@font-face {
  font-display: swap;
  font-family: Inter;
  font-style: normal;
  font-weight: 400;
  src: url(../../fonts/Inter/Inter-Regular.6cc68d6.woff2) format("woff2"),
    url(../../fonts/Inter/Inter-Regular.8398b37.woff) format("woff");
  unicode-range: u+0000-20e2, u+20e4-23ce, u+23d0-24c1, u+24c3-259f, u+25c2-2664,
    u+2666-2763, u+2765-2b05, u+2b07-2b1b, u+2b1d-10ffff;
}
@font-face {
  font-display: swap;
  font-family: Inter;
  font-style: italic;
  font-weight: 400;
  src: url(../../fonts/Inter/Inter-Italic.e2f5280.woff2) format("woff2"),
    url(../../fonts/Inter/Inter-Italic.635afee.woff) format("woff");
  unicode-range: u+0000-20e2, u+20e4-23ce, u+23d0-24c1, u+24c3-259f, u+25c2-2664,
    u+2666-2763, u+2765-2b05, u+2b07-2b1b, u+2b1d-10ffff;
}
@font-face {
  font-display: swap;
  font-family: Inter;
  font-style: normal;
  font-weight: 500;
  src: url(../../fonts/Inter/Inter-Medium.ba68c34.woff2) format("woff2"),
    url(../../fonts/Inter/Inter-Medium.f5549f6.woff) format("woff");
  unicode-range: u+0000-20e2, u+20e4-23ce, u+23d0-24c1, u+24c3-259f, u+25c2-2664,
    u+2666-2763, u+2765-2b05, u+2b07-2b1b, u+2b1d-10ffff;
}
@font-face {
  font-display: swap;
  font-family: Inter;
  font-style: italic;
  font-weight: 500;
  src: url(../../fonts/Inter/Inter-MediumItalic.d29ef50.woff2) format("woff2"),
    url(../../fonts/Inter/Inter-MediumItalic.2812ec5.woff) format("woff");
  unicode-range: u+0000-20e2, u+20e4-23ce, u+23d0-24c1, u+24c3-259f, u+25c2-2664,
    u+2666-2763, u+2765-2b05, u+2b07-2b1b, u+2b1d-10ffff;
}
@font-face {
  font-display: swap;
  font-family: Inter;
  font-style: normal;
  font-weight: 600;
  src: url(../../fonts/Inter/Inter-SemiBold.625474d.woff2) format("woff2"),
    url(../../fonts/Inter/Inter-SemiBold.25b1ffc.woff) format("woff");
  unicode-range: u+0000-20e2, u+20e4-23ce, u+23d0-24c1, u+24c3-259f, u+25c2-2664,
    u+2666-2763, u+2765-2b05, u+2b07-2b1b, u+2b1d-10ffff;
}
@font-face {
  font-display: swap;
  font-family: Inter;
  font-style: italic;
  font-weight: 600;
  src: url(../../fonts/Inter/Inter-SemiBoldItalic.c632fb9.woff2) format("woff2"),
    url(../../fonts/Inter/Inter-SemiBoldItalic.80d799b.woff) format("woff");
  unicode-range: u+0000-20e2, u+20e4-23ce, u+23d0-24c1, u+24c3-259f, u+25c2-2664,
    u+2666-2763, u+2765-2b05, u+2b07-2b1b, u+2b1d-10ffff;
}
@font-face {
  font-display: swap;
  font-family: Inter;
  font-style: normal;
  font-weight: 700;
  src: url(../../fonts/Inter/Inter-Bold.a808c21.woff2) format("woff2"),
    url(../../fonts/Inter/Inter-Bold.1c3dfbb.woff) format("woff");
  unicode-range: u+0000-20e2, u+20e4-23ce, u+23d0-24c1, u+24c3-259f, u+25c2-2664,
    u+2666-2763, u+2765-2b05, u+2b07-2b1b, u+2b1d-10ffff;
}
@font-face {
  font-display: swap;
  font-family: Inter;
  font-style: italic;
  font-weight: 700;
  src: url(../../fonts/Inter/Inter-BoldItalic.9744396.woff2) format("woff2"),
    url(../../fonts/Inter/Inter-BoldItalic.32e2b20.woff) format("woff");
  unicode-range: u+0000-20e2, u+20e4-23ce, u+23d0-24c1, u+24c3-259f, u+25c2-2664,
    u+2666-2763, u+2765-2b05, u+2b07-2b1b, u+2b1d-10ffff;
}
@font-face {
  font-family: Inconsolata;
  font-style: normal;
  font-weight: 400;
  src: local("Inconsolata Regular"), local("Inconsolata-Regular"),
    url(../../fonts/Inconsolata/QldKNThLqRwH-OJ1UHjlKGlX5qhExfHwNJU.2ff0f39.woff2)
      format("woff2");
  unicode-range: u+0100-024f, u+0259, u+1e??, u+2020, u+20a0-20ab, u+20ad-20cf,
    u+2113, u+2c60-2c7f, u+a720-a7ff;
}
@font-face {
  font-display: swap;
  font-family: Inconsolata;
  font-style: normal;
  font-weight: 400;
  src: local("Inconsolata Regular"), local("Inconsolata-Regular"),
    url(../../fonts/Inconsolata/QldKNThLqRwH-OJ1UHjlKGlZ5qhExfHw.d8934e4.woff2)
      format("woff2");
  unicode-range: u+00??, u+0131, u+0152-0153, u+02bb-02bc, u+02c6, u+02da,
    u+02dc, u+2000-206f, u+2074, u+20ac, u+2122, u+2191, u+2193, u+2212, u+2215,
    u+feff, u+fffd;
}
@font-face {
  font-display: swap;
  font-family: Inconsolata;
  font-style: normal;
  font-weight: 700;
  src: local("Inconsolata Bold"), local("Inconsolata-Bold"),
    url(../../fonts/Inconsolata/QldXNThLqRwH-OJ1UHjlKGHiw71n5_zaDpwm80E.279a413.woff2)
      format("woff2");
  unicode-range: u+0100-024f, u+0259, u+1e??, u+2020, u+20a0-20ab, u+20ad-20cf,
    u+2113, u+2c60-2c7f, u+a720-a7ff;
}
@font-face {
  font-display: swap;
  font-family: Inconsolata;
  font-style: normal;
  font-weight: 700;
  src: local("Inconsolata Bold"), local("Inconsolata-Bold"),
    url(../../fonts/Inconsolata/QldXNThLqRwH-OJ1UHjlKGHiw71p5_zaDpwm.e6a8d96.woff2)
      format("woff2");
  unicode-range: u+00??, u+0131, u+0152-0153, u+02bb-02bc, u+02c6, u+02da,
    u+02dc, u+2000-206f, u+2074, u+20ac, u+2122, u+2191, u+2193, u+2212, u+2215,
    u+feff, u+fffd;
}
:root {
  --emoji-font-family: "";
}
:root {
  --lp-background-blur: 40px;
}
body {
  color-scheme: light;
}
.hljs-addition {
  background: var(--cpd-color-green-500);
}
.hljs-deletion {
  background: var(--cpd-color-red-500);
}
.mx_RoomSublist_showNButton {
  background-color: transparent !important;
}
a:hover,
a:link,
a:visited {
  text-decoration: none;
}
.mx_rtg--fade-enter {
  opacity: 0;
}
.mx_rtg--fade-enter-active {
  opacity: 1;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
.mx_rtg--fade-exit {
  opacity: 1;
}
.mx_rtg--fade-exit-active {
  opacity: 0;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
:root {
  --hover-transition: 0.08s cubic-bezier(0.46, 0.03, 0.52, 0.96);
}
@-webkit-keyframes mx--anim-pulse {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.7;
  }
  to {
    opacity: 1;
  }
}
@keyframes mx--anim-pulse {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.7;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes mx_Dialog_lightbox_background_keyframes {
  0% {
    opacity: 0;
  }
  to {
    opacity: 0.95;
  }
}
@keyframes mx_Dialog_lightbox_background_keyframes {
  0% {
    opacity: 0;
  }
  to {
    opacity: 0.95;
  }
}
@-webkit-keyframes mx_ImageView_panel_keyframes {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes mx_ImageView_panel_keyframes {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@media (prefers-reduced-motion) {
  .mx_rtg--fade-enter-active,
  .mx_rtg--fade-exit-active {
    -webkit-transition: none;
    transition: none;
  }
}
@layer compound {
  @layer cpd-semantic, custom, cpd-base;
}
@layer compound {
  @media screen {
    @layer cpd-base {
      :root,
      [class*="cpd-theme-"] {
        --cpd-font-letter-spacing-heading-xl: -0.0216em;
        --cpd-font-letter-spacing-heading-lg: -0.0209em;
        --cpd-font-letter-spacing-heading-md: -0.0195em;
        --cpd-font-letter-spacing-heading-sm: -0.0166em;
        --cpd-font-letter-spacing-body-lg: -0.0128em;
        --cpd-font-letter-spacing-body-md: -0.0088em;
        --cpd-font-letter-spacing-body-sm: -0.0031em;
        --cpd-font-letter-spacing-body-xs: 0.0048em;
        --cpd-font-size-root: 1rem;
        --cpd-font-size-heading-xl: 2rem;
        --cpd-font-size-heading-lg: 1.75rem;
        --cpd-font-size-heading-md: 1.5rem;
        --cpd-font-size-heading-sm: 1.25rem;
        --cpd-font-size-body-lg: 1.0625rem;
        --cpd-font-size-body-md: 0.9375rem;
        --cpd-font-size-body-sm: 0.8125rem;
        --cpd-font-size-body-xs: 0.6875rem;
        --cpd-font-line-height-regular: 1.5;
        --cpd-font-line-height-tight: 1.25;
        --cpd-font-line-height-minimum: 1;
        --cpd-font-weight-semibold: 600;
        --cpd-font-weight-medium: 500;
        --cpd-font-weight-regular: 400;
        --cpd-font-family-mono: Inconsolata;
        --cpd-font-family-sans: Inter;
        --cpd-border-width-0-5: 0.5px;
        --cpd-border-width-4: 4px;
        --cpd-border-width-2: 2px;
        --cpd-border-width-1: 1px;
        --cpd-space-56x: 224px;
        --cpd-space-36x: 144px;
        --cpd-space-16x: 64px;
        --cpd-space-12x: 48px;
        --cpd-space-11x: 44px;
        --cpd-space-10x: 40px;
        --cpd-space-6x: 24px;
        --cpd-space-0x: 0px;
        --cpd-space-scale: 4px;
        --cpd-font-heading-xl-semibold: var(--cpd-font-weight-semibold)
          var(--cpd-font-size-heading-xl) / var(--cpd-font-line-height-tight)
          var(--cpd-font-family-sans);
        --cpd-font-heading-xl-regular: var(--cpd-font-weight-regular)
          var(--cpd-font-size-heading-xl) / var(--cpd-font-line-height-tight)
          var(--cpd-font-family-sans);
        --cpd-font-heading-lg-semibold: var(--cpd-font-weight-semibold)
          var(--cpd-font-size-heading-lg) / var(--cpd-font-line-height-tight)
          var(--cpd-font-family-sans);
        --cpd-font-heading-lg-regular: var(--cpd-font-weight-regular)
          var(--cpd-font-size-heading-lg) / var(--cpd-font-line-height-tight)
          var(--cpd-font-family-sans);
        --cpd-font-heading-md-semibold: var(--cpd-font-weight-semibold)
          var(--cpd-font-size-heading-md) / var(--cpd-font-line-height-tight)
          var(--cpd-font-family-sans);
        --cpd-font-heading-md-regular: var(--cpd-font-weight-regular)
          var(--cpd-font-size-heading-md) / var(--cpd-font-line-height-tight)
          var(--cpd-font-family-sans);
        --cpd-font-heading-sm-semibold: var(--cpd-font-weight-semibold)
          var(--cpd-font-line-height-tight) rem/1.25 var(--cpd-font-family-sans);
        --cpd-font-heading-sm-medium: var(--cpd-font-weight-medium)
          var(--cpd-font-line-height-tight) rem/1.25 var(--cpd-font-family-sans);
        --cpd-font-heading-sm-regular: var(--cpd-font-weight-regular)
          var(--cpd-font-line-height-tight) rem/1.25 var(--cpd-font-family-sans);
        --cpd-font-body-lg-semibold: var(--cpd-font-weight-semibold)
          var(--cpd-font-size-body-lg) / var(--cpd-font-line-height-regular)
          var(--cpd-font-family-sans);
        --cpd-font-body-lg-medium: var(--cpd-font-weight-medium)
          var(--cpd-font-size-body-lg) / var(--cpd-font-line-height-regular)
          var(--cpd-font-family-sans);
        --cpd-font-body-lg-regular: var(--cpd-font-weight-regular)
          var(--cpd-font-size-body-lg) / var(--cpd-font-line-height-regular)
          var(--cpd-font-family-sans);
        --cpd-font-body-md-semibold: var(--cpd-font-weight-semibold)
          var(--cpd-font-size-body-md) / var(--cpd-font-line-height-regular)
          var(--cpd-font-family-sans);
        --cpd-font-body-md-medium: var(--cpd-font-weight-medium)
          var(--cpd-font-size-body-md) / var(--cpd-font-line-height-regular)
          var(--cpd-font-family-sans);
        --cpd-font-body-md-regular: var(--cpd-font-weight-regular)
          var(--cpd-font-size-body-md) / var(--cpd-font-line-height-regular)
          var(--cpd-font-family-sans);
        --cpd-font-body-sm-semibold: var(--cpd-font-weight-semibold)
          var(--cpd-font-size-body-sm) / var(--cpd-font-line-height-regular)
          var(--cpd-font-family-sans);
        --cpd-font-body-sm-medium: var(--cpd-font-weight-medium)
          var(--cpd-font-size-body-sm) / var(--cpd-font-line-height-regular)
          var(--cpd-font-family-sans);
        --cpd-font-body-sm-regular: var(--cpd-font-weight-regular)
          var(--cpd-font-size-body-sm) / var(--cpd-font-line-height-regular)
          var(--cpd-font-family-sans);
        --cpd-font-body-xs-semibold: var(--cpd-font-weight-semibold)
          var(--cpd-font-size-body-xs) / var(--cpd-font-line-height-regular)
          var(--cpd-font-family-sans);
        --cpd-font-body-xs-medium: var(--cpd-font-weight-medium)
          var(--cpd-font-size-body-xs) / var(--cpd-font-line-height-regular)
          var(--cpd-font-family-sans);
        --cpd-font-body-xs-regular: var(--cpd-font-weight-regular)
          var(--cpd-font-size-body-xs) / var(--cpd-font-line-height-regular)
          var(--cpd-font-family-sans);
        --cpd-space-64x: 256px;
        --cpd-space-48x: 192px;
        --cpd-space-40x: 160px;
        --cpd-space-32x: 128px;
        --cpd-space-28x: 112px;
        --cpd-space-24x: 96px;
        --cpd-space-20x: 80px;
        --cpd-space-15x: 60px;
        --cpd-space-14x: 56px;
        --cpd-space-13x: 52px;
        --cpd-space-9x: 36px;
        --cpd-space-8x: 32px;
        --cpd-space-7x: 28px;
        --cpd-space-5x: 20px;
        --cpd-space-4x: 16px;
        --cpd-space-3x: 12px;
        --cpd-space-2x: 8px;
        --cpd-space-1-5x: 6px;
        --cpd-space-1x: var(--cpd-space-scale);
        --cpd-space-0-5x: 2px;
      }
    }
  }
}
@layer compound {
  @media screen {
    @layer cpd-semantic {
      :root,
      [class*="cpd-theme-"] {
        --cpd-color-icon-on-solid-primary: var(--cpd-color-theme-bg);
        --cpd-color-icon-info-primary: var(--cpd-color-blue-900);
        --cpd-color-icon-success-primary: var(--cpd-color-green-900);
        --cpd-color-icon-critical-primary: var(--cpd-color-red-900);
        --cpd-color-icon-accent-tertiary: var(--cpd-color-green-800);
        --cpd-color-icon-quaternary-alpha: var(--cpd-color-alpha-gray-700);
        --cpd-color-icon-tertiary-alpha: var(--cpd-color-alpha-gray-800);
        --cpd-color-icon-secondary-alpha: var(--cpd-color-alpha-gray-900);
        --cpd-color-icon-primary-alpha: var(--cpd-color-alpha-gray-1400);
        --cpd-color-icon-disabled: var(--cpd-color-gray-700);
        --cpd-color-icon-quaternary: var(--cpd-color-gray-700);
        --cpd-color-icon-tertiary: var(--cpd-color-gray-800);
        --cpd-color-icon-secondary: var(--cpd-color-gray-900);
        --cpd-color-icon-primary: var(--cpd-color-gray-1400);
        --cpd-color-border-info-subtle: var(--cpd-color-blue-500);
        --cpd-color-border-success-subtle: var(--cpd-color-green-500);
        --cpd-color-border-critical-subtle: var(--cpd-color-red-500);
        --cpd-color-border-critical-hovered: var(--cpd-color-red-1000);
        --cpd-color-border-critical-primary: var(--cpd-color-red-900);
        --cpd-color-border-interactive-hovered: var(--cpd-color-gray-1100);
        --cpd-color-border-interactive-secondary: var(--cpd-color-gray-600);
        --cpd-color-border-interactive-primary: var(--cpd-color-gray-800);
        --cpd-color-border-focused: var(--cpd-color-blue-900);
        --cpd-color-border-disabled: var(--cpd-color-gray-500);
        --cpd-color-bg-accent-pressed: var(--cpd-color-green-1100);
        --cpd-color-bg-accent-hovered: var(--cpd-color-green-1000);
        --cpd-color-bg-accent-rest: var(--cpd-color-green-900);
        --cpd-color-bg-decorative-6: var(--cpd-color-orange-300);
        --cpd-color-bg-decorative-5: var(--cpd-color-pink-300);
        --cpd-color-bg-decorative-4: var(--cpd-color-purple-300);
        --cpd-color-bg-decorative-3: var(--cpd-color-fuchsia-300);
        --cpd-color-bg-decorative-2: var(--cpd-color-cyan-300);
        --cpd-color-bg-decorative-1: var(--cpd-color-lime-300);
        --cpd-color-bg-info-subtle: var(--cpd-color-blue-200);
        --cpd-color-bg-success-subtle: var(--cpd-color-green-200);
        --cpd-color-bg-critical-subtle-hovered: var(--cpd-color-red-300);
        --cpd-color-bg-critical-subtle: var(--cpd-color-red-200);
        --cpd-color-bg-critical-hovered: var(--cpd-color-red-1000);
        --cpd-color-bg-critical-primary: var(--cpd-color-red-900);
        --cpd-color-bg-action-secondary-pressed: var(
          --cpd-color-alpha-gray-300
        );
        --cpd-color-bg-action-secondary-hovered: var(
          --cpd-color-alpha-gray-200
        );
        --cpd-color-bg-action-secondary-rest: var(--cpd-color-theme-bg);
        --cpd-color-bg-action-primary-disabled: var(--cpd-color-gray-700);
        --cpd-color-bg-action-primary-pressed: var(--cpd-color-gray-1100);
        --cpd-color-bg-action-primary-hovered: var(--cpd-color-gray-1200);
        --cpd-color-bg-action-primary-rest: var(--cpd-color-gray-1400);
        --cpd-color-bg-canvas-disabled: var(--cpd-color-gray-200);
        --cpd-color-bg-canvas-default: var(--cpd-color-theme-bg);
        --cpd-color-bg-subtle-secondary: var(--cpd-color-gray-300);
        --cpd-color-bg-subtle-primary: var(--cpd-color-gray-400);
        --cpd-color-text-decorative-6: var(--cpd-color-orange-1100);
        --cpd-color-text-decorative-5: var(--cpd-color-pink-1100);
        --cpd-color-text-decorative-4: var(--cpd-color-purple-1100);
        --cpd-color-text-decorative-3: var(--cpd-color-fuchsia-1100);
        --cpd-color-text-decorative-2: var(--cpd-color-cyan-1100);
        --cpd-color-text-decorative-1: var(--cpd-color-lime-1100);
        --cpd-color-text-on-solid-primary: var(--cpd-color-theme-bg);
        --cpd-color-text-info-primary: var(--cpd-color-blue-900);
        --cpd-color-text-success-primary: var(--cpd-color-green-900);
        --cpd-color-text-critical-primary: var(--cpd-color-red-900);
        --cpd-color-text-link-external: var(--cpd-color-blue-900);
        --cpd-color-text-action-accent: var(--cpd-color-green-900);
        --cpd-color-text-action-primary: var(--cpd-color-gray-1400);
        --cpd-color-text-disabled: var(--cpd-color-gray-800);
        --cpd-color-text-placeholder: var(--cpd-color-gray-800);
        --cpd-color-text-secondary: var(--cpd-color-gray-900);
        --cpd-color-text-primary: var(--cpd-color-gray-1400);
      }
    }
  }
}
@layer compound {
  @media screen {
    @layer cpd-base {
      .cpd-theme-light.cpd-theme-light {
        --cpd-color-alpha-pink-1400: #420017;
        --cpd-color-alpha-pink-1300: #61002c;
        --cpd-color-alpha-pink-1200: rgba(121, 1, 61, 0.98);
        --cpd-color-alpha-pink-1100: rgba(158, 0, 76, 0.97);
        --cpd-color-alpha-pink-1000: rgba(182, 2, 86, 0.97);
        --cpd-color-alpha-pink-900: rgba(207, 2, 94, 0.96);
        --cpd-color-alpha-pink-800: rgba(245, 0, 82, 0.75);
        --cpd-color-alpha-pink-700: rgba(255, 0, 64, 0.47);
        --cpd-color-alpha-pink-600: rgba(255, 5, 63, 0.33);
        --cpd-color-alpha-pink-500: rgba(255, 0, 55, 0.24);
        --cpd-color-alpha-pink-400: rgba(255, 0, 55, 0.13);
        --cpd-color-alpha-pink-300: rgba(255, 20, 71, 0.08);
        --cpd-color-alpha-pink-200: rgba(255, 5, 55, 0.04);
        --cpd-color-alpha-pink-100: rgba(255, 5, 55, 0.02);
        --cpd-color-alpha-fuchsia-1400: #34004d;
        --cpd-color-alpha-fuchsia-1300: #4d0066;
        --cpd-color-alpha-fuchsia-1200: rgba(93, 2, 121, 0.93);
        --cpd-color-alpha-fuchsia-1100: rgba(115, 3, 140, 0.88);
        --cpd-color-alpha-fuchsia-1000: rgba(130, 1, 152, 0.84);
        --cpd-color-alpha-fuchsia-900: rgba(153, 0, 173, 0.8);
        --cpd-color-alpha-fuchsia-800: rgba(171, 3, 186, 0.64);
        --cpd-color-alpha-fuchsia-700: rgba(170, 4, 185, 0.43);
        --cpd-color-alpha-fuchsia-600: rgba(178, 7, 187, 0.31);
        --cpd-color-alpha-fuchsia-500: rgba(180, 7, 192, 0.23);
        --cpd-color-alpha-fuchsia-400: rgba(189, 9, 195, 0.13);
        --cpd-color-alpha-fuchsia-300: rgba(182, 12, 198, 0.07);
        --cpd-color-alpha-fuchsia-200: rgba(181, 5, 204, 0.04);
        --cpd-color-alpha-fuchsia-100: rgba(204, 5, 204, 0.02);
        --cpd-color-alpha-purple-1400: #200066;
        --cpd-color-alpha-purple-1300: #34008f;
        --cpd-color-alpha-purple-1200: rgba(74, 2, 182, 0.99);
        --cpd-color-alpha-purple-1100: rgba(67, 3, 196, 0.86);
        --cpd-color-alpha-purple-1000: rgba(69, 2, 212, 0.79);
        --cpd-color-alpha-purple-900: rgba(73, 2, 237, 0.73);
        --cpd-color-alpha-purple-800: rgba(59, 1, 249, 0.56);
        --cpd-color-alpha-purple-700: rgba(51, 5, 255, 0.38);
        --cpd-color-alpha-purple-600: rgba(43, 5, 255, 0.27);
        --cpd-color-alpha-purple-500: rgba(38, 5, 255, 0.2);
        --cpd-color-alpha-purple-400: rgba(47, 15, 255, 0.12);
        --cpd-color-alpha-purple-300: rgba(56, 25, 255, 0.07);
        --cpd-color-alpha-purple-200: rgba(83, 56, 255, 0.04);
        --cpd-color-alpha-purple-100: rgba(56, 56, 255, 0.02);
        --cpd-color-alpha-blue-1400: #000e66;
        --cpd-color-alpha-blue-1300: #012579;
        --cpd-color-alpha-blue-1200: rgba(1, 54, 147, 0.99);
        --cpd-color-alpha-blue-1100: rgba(1, 72, 178, 0.98);
        --cpd-color-alpha-blue-1000: rgba(2, 86, 197, 0.99);
        --cpd-color-alpha-blue-900: rgba(1, 101, 223, 0.99);
        --cpd-color-alpha-blue-800: rgba(0, 98, 235, 0.75);
        --cpd-color-alpha-blue-700: rgba(2, 100, 237, 0.51);
        --cpd-color-alpha-blue-600: rgba(6, 99, 239, 0.37);
        --cpd-color-alpha-blue-500: rgba(9, 108, 246, 0.28);
        --cpd-color-alpha-blue-400: rgba(11, 106, 249, 0.16);
        --cpd-color-alpha-blue-300: rgba(10, 112, 255, 0.09);
        --cpd-color-alpha-blue-200: rgba(36, 116, 255, 0.05);
        --cpd-color-alpha-blue-100: rgba(56, 156, 255, 0.03);
        --cpd-color-alpha-cyan-1400: #001a52;
        --cpd-color-alpha-cyan-1300: #002c61;
        --cpd-color-alpha-cyan-1200: #003f75;
        --cpd-color-alpha-cyan-1100: #00568f;
        --cpd-color-alpha-cyan-1000: #00649e;
        --cpd-color-alpha-cyan-900: #0074ad;
        --cpd-color-alpha-cyan-800: #0095c2;
        --cpd-color-alpha-cyan-700: rgba(1, 183, 203, 0.92);
        --cpd-color-alpha-cyan-600: rgba(1, 170, 193, 0.54);
        --cpd-color-alpha-cyan-500: rgba(5, 171, 189, 0.4);
        --cpd-color-alpha-cyan-400: rgba(0, 170, 189, 0.22);
        --cpd-color-alpha-cyan-300: rgba(0, 168, 194, 0.11);
        --cpd-color-alpha-cyan-200: rgba(22, 171, 187, 0.06);
        --cpd-color-alpha-cyan-100: rgba(22, 187, 187, 0.03);
        --cpd-color-alpha-green-1400: #002411;
        --cpd-color-alpha-green-1300: #00331f;
        --cpd-color-alpha-green-1200: #004732;
        --cpd-color-alpha-green-1100: #005c45;
        --cpd-color-alpha-green-1000: #006b52;
        --cpd-color-alpha-green-900: #007a62;
        --cpd-color-alpha-green-800: #009975;
        --cpd-color-alpha-green-700: rgba(1, 193, 138, 0.96);
        --cpd-color-alpha-green-600: rgba(1, 183, 110, 0.56);
        --cpd-color-alpha-green-500: rgba(4, 185, 106, 0.41);
        --cpd-color-alpha-green-400: rgba(7, 182, 97, 0.23);
        --cpd-color-alpha-green-300: rgba(0, 184, 92, 0.11);
        --cpd-color-alpha-green-200: rgba(22, 187, 105, 0.06);
        --cpd-color-alpha-green-100: rgba(22, 187, 121, 0.03);
        --cpd-color-alpha-lime-1400: #002400;
        --cpd-color-alpha-lime-1300: #003800;
        --cpd-color-alpha-lime-1200: #004d00;
        --cpd-color-alpha-lime-1100: #006100;
        --cpd-color-alpha-lime-1000: #007000;
        --cpd-color-alpha-lime-900: rgba(16, 121, 2, 0.96);
        --cpd-color-alpha-lime-800: rgba(32, 147, 1, 0.91);
        --cpd-color-alpha-lime-700: rgba(57, 189, 0, 0.86);
        --cpd-color-alpha-lime-600: rgba(64, 206, 3, 0.71);
        --cpd-color-alpha-lime-500: rgba(55, 202, 2, 0.51);
        --cpd-color-alpha-lime-400: rgba(58, 206, 9, 0.28);
        --cpd-color-alpha-lime-300: rgba(46, 207, 2, 0.15);
        --cpd-color-alpha-lime-200: rgba(56, 212, 12, 0.07);
        --cpd-color-alpha-lime-100: rgba(79, 205, 29, 0.04);
        --cpd-color-alpha-yellow-1400: #420700;
        --cpd-color-alpha-yellow-1300: #571b00;
        --cpd-color-alpha-yellow-1200: #6b2e00;
        --cpd-color-alpha-yellow-1100: #804000;
        --cpd-color-alpha-yellow-1000: #8f4c00;
        --cpd-color-alpha-yellow-900: #9e5a00;
        --cpd-color-alpha-yellow-800: #bd7b00;
        --cpd-color-alpha-yellow-700: #e0a500;
        --cpd-color-alpha-yellow-600: #f0bc00;
        --cpd-color-alpha-yellow-500: #facc00;
        --cpd-color-alpha-yellow-400: rgba(255, 201, 5, 0.49);
        --cpd-color-alpha-yellow-300: rgba(255, 201, 5, 0.25);
        --cpd-color-alpha-yellow-200: rgba(255, 199, 15, 0.13);
        --cpd-color-alpha-yellow-100: rgba(255, 205, 5, 0.06);
        --cpd-color-alpha-orange-1400: #470000;
        --cpd-color-alpha-orange-1300: #610000;
        --cpd-color-alpha-orange-1200: #850000;
        --cpd-color-alpha-orange-1100: #992100;
        --cpd-color-alpha-orange-1000: #ad3400;
        --cpd-color-alpha-orange-900: #bd4500;
        --cpd-color-alpha-orange-800: #db6600;
        --cpd-color-alpha-orange-700: rgba(245, 110, 0, 0.75);
        --cpd-color-alpha-orange-600: rgba(252, 111, 3, 0.52);
        --cpd-color-alpha-orange-500: rgba(255, 106, 0, 0.37);
        --cpd-color-alpha-orange-400: rgba(255, 109, 5, 0.22);
        --cpd-color-alpha-orange-300: rgba(255, 108, 10, 0.11);
        --cpd-color-alpha-orange-200: rgba(255, 125, 25, 0.07);
        --cpd-color-alpha-orange-100: rgba(255, 129, 56, 0.04);
        --cpd-color-alpha-red-1400: #470000;
        --cpd-color-alpha-red-1300: #610000;
        --cpd-color-alpha-red-1200: #850007;
        --cpd-color-alpha-red-1100: rgba(162, 1, 28, 0.99);
        --cpd-color-alpha-red-1000: rgba(187, 2, 23, 0.95);
        --cpd-color-alpha-red-900: rgba(207, 2, 19, 0.91);
        --cpd-color-alpha-red-800: rgba(255, 5, 5, 0.77);
        --cpd-color-alpha-red-700: rgba(255, 26, 5, 0.5);
        --cpd-color-alpha-red-600: rgba(255, 34, 5, 0.36);
        --cpd-color-alpha-red-500: rgba(255, 38, 5, 0.27);
        --cpd-color-alpha-red-400: rgba(255, 43, 10, 0.15);
        --cpd-color-alpha-red-300: rgba(255, 56, 20, 0.08);
        --cpd-color-alpha-red-200: rgba(255, 57, 31, 0.04);
        --cpd-color-alpha-red-100: rgba(255, 89, 56, 0.03);
        --cpd-color-alpha-gray-1400: rgba(2, 4, 8, 0.9);
        --cpd-color-alpha-gray-1300: rgba(3, 5, 12, 0.84);
        --cpd-color-alpha-gray-1200: rgba(2, 7, 13, 0.77);
        --cpd-color-alpha-gray-1100: rgba(3, 11, 22, 0.71);
        --cpd-color-alpha-gray-1000: rgba(3, 12, 27, 0.66);
        --cpd-color-alpha-gray-900: rgba(3, 16, 33, 0.61);
        --cpd-color-alpha-gray-800: rgba(3, 21, 43, 0.5);
        --cpd-color-alpha-gray-700: rgba(1, 21, 50, 0.35);
        --cpd-color-alpha-gray-600: rgba(1, 29, 60, 0.26);
        --cpd-color-alpha-gray-500: rgba(5, 36, 72, 0.2);
        --cpd-color-alpha-gray-400: rgba(5, 46, 97, 0.12);
        --cpd-color-alpha-gray-300: rgba(5, 38, 87, 0.06);
        --cpd-color-alpha-gray-200: rgba(54, 104, 129, 0.04);
        --cpd-color-alpha-gray-100: rgba(54, 105, 155, 0.02);
        --cpd-color-pink-1400: #430017;
        --cpd-color-pink-1300: #5f002b;
        --cpd-color-pink-1200: #7e0642;
        --cpd-color-pink-1100: #9f0850;
        --cpd-color-pink-1000: #b80a5b;
        --cpd-color-pink-900: #d20c65;
        --cpd-color-pink-800: #f7407d;
        --cpd-color-pink-700: #ff88a6;
        --cpd-color-pink-600: #ffadc0;
        --cpd-color-pink-500: #ffc2cf;
        --cpd-color-pink-400: #ffdee5;
        --cpd-color-pink-300: #ffecf0;
        --cpd-color-pink-200: #fff5f7;
        --cpd-color-pink-100: #fffafb;
        --cpd-color-fuchsia-1400: #34004c;
        --cpd-color-fuchsia-1300: #4e0068;
        --cpd-color-fuchsia-1200: #671481;
        --cpd-color-fuchsia-1100: #822198;
        --cpd-color-fuchsia-1000: #972aaa;
        --cpd-color-fuchsia-900: #ad33bd;
        --cpd-color-fuchsia-800: #c85ed1;
        --cpd-color-fuchsia-700: #db93e1;
        --cpd-color-fuchsia-600: #e7b2ea;
        --cpd-color-fuchsia-500: #edc6f0;
        --cpd-color-fuchsia-400: #f6dff7;
        --cpd-color-fuchsia-300: #faeefb;
        --cpd-color-fuchsia-200: #fcf5fd;
        --cpd-color-fuchsia-100: #fefafe;
        --cpd-color-purple-1400: #200066;
        --cpd-color-purple-1300: #33008d;
        --cpd-color-purple-1200: #4c05b5;
        --cpd-color-purple-1100: #5d26cd;
        --cpd-color-purple-1000: #6b37de;
        --cpd-color-purple-900: #7a47f1;
        --cpd-color-purple-800: #9271fd;
        --cpd-color-purple-700: #b1a0ff;
        --cpd-color-purple-600: #c5bbff;
        --cpd-color-purple-500: #d4cdff;
        --cpd-color-purple-400: #e6e2ff;
        --cpd-color-purple-300: #f1efff;
        --cpd-color-purple-200: #f8f7ff;
        --cpd-color-purple-100: #fbfbff;
        --cpd-color-blue-1400: #000e65;
        --cpd-color-blue-1300: #012478;
        --cpd-color-blue-1200: #043894;
        --cpd-color-blue-1100: #064ab1;
        --cpd-color-blue-1000: #0558c7;
        --cpd-color-blue-900: #0467dd;
        --cpd-color-blue-800: #4088ee;
        --cpd-color-blue-700: #7eaff6;
        --cpd-color-blue-600: #a3c6fa;
        --cpd-color-blue-500: #bad5fc;
        --cpd-color-blue-400: #d8e7fe;
        --cpd-color-blue-300: #e9f2ff;
        --cpd-color-blue-200: #f4f8ff;
        --cpd-color-blue-100: #f9fcff;
        --cpd-color-cyan-1400: #00194f;
        --cpd-color-cyan-1300: #002b61;
        --cpd-color-cyan-1200: #004077;
        --cpd-color-cyan-1100: #00548c;
        --cpd-color-cyan-1000: #00629c;
        --cpd-color-cyan-900: #0072ac;
        --cpd-color-cyan-800: #0094c0;
        --cpd-color-cyan-700: #15becf;
        --cpd-color-cyan-600: #76d1dd;
        --cpd-color-cyan-500: #9bdde5;
        --cpd-color-cyan-400: #c7ecf0;
        --cpd-color-cyan-300: #e3f5f8;
        --cpd-color-cyan-200: #f1fafb;
        --cpd-color-cyan-100: #f8fdfd;
        --cpd-color-green-1400: #002311;
        --cpd-color-green-1300: #003420;
        --cpd-color-green-1200: #004933;
        --cpd-color-green-1100: #005c45;
        --cpd-color-green-1000: #006b52;
        --cpd-color-green-900: #007a61;
        --cpd-color-green-800: #009b78;
        --cpd-color-green-700: #0bc491;
        --cpd-color-green-600: #71d7ae;
        --cpd-color-green-500: #98e1c1;
        --cpd-color-green-400: #c6eedb;
        --cpd-color-green-300: #e3f7ed;
        --cpd-color-green-200: #f1fbf6;
        --cpd-color-green-100: #f8fdfb;
        --cpd-color-lime-1400: #002400;
        --cpd-color-lime-1300: #003600;
        --cpd-color-lime-1200: #004b00;
        --cpd-color-lime-1100: #005f00;
        --cpd-color-lime-1000: #006e00;
        --cpd-color-lime-900: #197d0c;
        --cpd-color-lime-800: #359d18;
        --cpd-color-lime-700: #54c424;
        --cpd-color-lime-600: #76db4c;
        --cpd-color-lime-500: #99e57e;
        --cpd-color-lime-400: #c8f1ba;
        --cpd-color-lime-300: #e0f8d9;
        --cpd-color-lime-200: #f1fcee;
        --cpd-color-lime-100: #f8fdf6;
        --cpd-color-yellow-1400: #410600;
        --cpd-color-yellow-1300: #541a00;
        --cpd-color-yellow-1200: #692e00;
        --cpd-color-yellow-1100: #803f00;
        --cpd-color-yellow-1000: #8f4d00;
        --cpd-color-yellow-900: #9f5b00;
        --cpd-color-yellow-800: #be7a00;
        --cpd-color-yellow-700: #dea200;
        --cpd-color-yellow-600: #f1bd00;
        --cpd-color-yellow-500: #fbce00;
        --cpd-color-yellow-400: #ffe484;
        --cpd-color-yellow-300: #fff2c1;
        --cpd-color-yellow-200: #fff8e0;
        --cpd-color-yellow-100: #fffcf0;
        --cpd-color-orange-1400: #450000;
        --cpd-color-orange-1300: #620000;
        --cpd-color-orange-1200: #850000;
        --cpd-color-orange-1100: #9b2200;
        --cpd-color-orange-1000: #ac3300;
        --cpd-color-orange-900: #bc4500;
        --cpd-color-orange-800: #dc6700;
        --cpd-color-orange-700: #f89440;
        --cpd-color-orange-600: #fdb37c;
        --cpd-color-orange-500: #ffc8a1;
        --cpd-color-orange-400: #ffdfc8;
        --cpd-color-orange-300: #ffefe4;
        --cpd-color-orange-200: #fff6ef;
        --cpd-color-orange-100: #fffaf7;
        --cpd-color-red-1400: #450000;
        --cpd-color-red-1300: #620000;
        --cpd-color-red-1200: #850006;
        --cpd-color-red-1100: #a4041d;
        --cpd-color-red-1000: #bc0f22;
        --cpd-color-red-900: #d51928;
        --cpd-color-red-800: #ff3d3d;
        --cpd-color-red-700: #ff8c81;
        --cpd-color-red-600: #ffafa5;
        --cpd-color-red-500: #ffc5bc;
        --cpd-color-red-400: #ffdfda;
        --cpd-color-red-300: #ffefec;
        --cpd-color-red-200: #fff7f6;
        --cpd-color-red-100: #fffaf9;
        --cpd-color-gray-1400: #1b1d22;
        --cpd-color-gray-1300: #2b2d32;
        --cpd-color-gray-1200: #3c4045;
        --cpd-color-gray-1100: #4c5158;
        --cpd-color-gray-1000: #595e67;
        --cpd-color-gray-900: #656d77;
        --cpd-color-gray-800: #818a95;
        --cpd-color-gray-700: #a6adb7;
        --cpd-color-gray-600: #bdc4cc;
        --cpd-color-gray-500: #cdd3da;
        --cpd-color-gray-400: #e1e6ec;
        --cpd-color-gray-300: #f0f2f5;
        --cpd-color-gray-200: #f7f9fa;
        --cpd-color-gray-100: #fbfcfd;
        --cpd-color-theme-bg: #fff;
      }
    }
  }
}
@layer compound {
  @media screen and (prefers-color-scheme: light) {
    @layer cpd-base {
      :root {
        --cpd-color-alpha-pink-1400: #420017;
        --cpd-color-alpha-pink-1300: #61002c;
        --cpd-color-alpha-pink-1200: rgba(121, 1, 61, 0.98);
        --cpd-color-alpha-pink-1100: rgba(158, 0, 76, 0.97);
        --cpd-color-alpha-pink-1000: rgba(182, 2, 86, 0.97);
        --cpd-color-alpha-pink-900: rgba(207, 2, 94, 0.96);
        --cpd-color-alpha-pink-800: rgba(245, 0, 82, 0.75);
        --cpd-color-alpha-pink-700: rgba(255, 0, 64, 0.47);
        --cpd-color-alpha-pink-600: rgba(255, 5, 63, 0.33);
        --cpd-color-alpha-pink-500: rgba(255, 0, 55, 0.24);
        --cpd-color-alpha-pink-400: rgba(255, 0, 55, 0.13);
        --cpd-color-alpha-pink-300: rgba(255, 20, 71, 0.08);
        --cpd-color-alpha-pink-200: rgba(255, 5, 55, 0.04);
        --cpd-color-alpha-pink-100: rgba(255, 5, 55, 0.02);
        --cpd-color-alpha-fuchsia-1400: #34004d;
        --cpd-color-alpha-fuchsia-1300: #4d0066;
        --cpd-color-alpha-fuchsia-1200: rgba(93, 2, 121, 0.93);
        --cpd-color-alpha-fuchsia-1100: rgba(115, 3, 140, 0.88);
        --cpd-color-alpha-fuchsia-1000: rgba(130, 1, 152, 0.84);
        --cpd-color-alpha-fuchsia-900: rgba(153, 0, 173, 0.8);
        --cpd-color-alpha-fuchsia-800: rgba(171, 3, 186, 0.64);
        --cpd-color-alpha-fuchsia-700: rgba(170, 4, 185, 0.43);
        --cpd-color-alpha-fuchsia-600: rgba(178, 7, 187, 0.31);
        --cpd-color-alpha-fuchsia-500: rgba(180, 7, 192, 0.23);
        --cpd-color-alpha-fuchsia-400: rgba(189, 9, 195, 0.13);
        --cpd-color-alpha-fuchsia-300: rgba(182, 12, 198, 0.07);
        --cpd-color-alpha-fuchsia-200: rgba(181, 5, 204, 0.04);
        --cpd-color-alpha-fuchsia-100: rgba(204, 5, 204, 0.02);
        --cpd-color-alpha-purple-1400: #200066;
        --cpd-color-alpha-purple-1300: #34008f;
        --cpd-color-alpha-purple-1200: rgba(74, 2, 182, 0.99);
        --cpd-color-alpha-purple-1100: rgba(67, 3, 196, 0.86);
        --cpd-color-alpha-purple-1000: rgba(69, 2, 212, 0.79);
        --cpd-color-alpha-purple-900: rgba(73, 2, 237, 0.73);
        --cpd-color-alpha-purple-800: rgba(59, 1, 249, 0.56);
        --cpd-color-alpha-purple-700: rgba(51, 5, 255, 0.38);
        --cpd-color-alpha-purple-600: rgba(43, 5, 255, 0.27);
        --cpd-color-alpha-purple-500: rgba(38, 5, 255, 0.2);
        --cpd-color-alpha-purple-400: rgba(47, 15, 255, 0.12);
        --cpd-color-alpha-purple-300: rgba(56, 25, 255, 0.07);
        --cpd-color-alpha-purple-200: rgba(83, 56, 255, 0.04);
        --cpd-color-alpha-purple-100: rgba(56, 56, 255, 0.02);
        --cpd-color-alpha-blue-1400: #000e66;
        --cpd-color-alpha-blue-1300: #012579;
        --cpd-color-alpha-blue-1200: rgba(1, 54, 147, 0.99);
        --cpd-color-alpha-blue-1100: rgba(1, 72, 178, 0.98);
        --cpd-color-alpha-blue-1000: rgba(2, 86, 197, 0.99);
        --cpd-color-alpha-blue-900: rgba(1, 101, 223, 0.99);
        --cpd-color-alpha-blue-800: rgba(0, 98, 235, 0.75);
        --cpd-color-alpha-blue-700: rgba(2, 100, 237, 0.51);
        --cpd-color-alpha-blue-600: rgba(6, 99, 239, 0.37);
        --cpd-color-alpha-blue-500: rgba(9, 108, 246, 0.28);
        --cpd-color-alpha-blue-400: rgba(11, 106, 249, 0.16);
        --cpd-color-alpha-blue-300: rgba(10, 112, 255, 0.09);
        --cpd-color-alpha-blue-200: rgba(36, 116, 255, 0.05);
        --cpd-color-alpha-blue-100: rgba(56, 156, 255, 0.03);
        --cpd-color-alpha-cyan-1400: #001a52;
        --cpd-color-alpha-cyan-1300: #002c61;
        --cpd-color-alpha-cyan-1200: #003f75;
        --cpd-color-alpha-cyan-1100: #00568f;
        --cpd-color-alpha-cyan-1000: #00649e;
        --cpd-color-alpha-cyan-900: #0074ad;
        --cpd-color-alpha-cyan-800: #0095c2;
        --cpd-color-alpha-cyan-700: rgba(1, 183, 203, 0.92);
        --cpd-color-alpha-cyan-600: rgba(1, 170, 193, 0.54);
        --cpd-color-alpha-cyan-500: rgba(5, 171, 189, 0.4);
        --cpd-color-alpha-cyan-400: rgba(0, 170, 189, 0.22);
        --cpd-color-alpha-cyan-300: rgba(0, 168, 194, 0.11);
        --cpd-color-alpha-cyan-200: rgba(22, 171, 187, 0.06);
        --cpd-color-alpha-cyan-100: rgba(22, 187, 187, 0.03);
        --cpd-color-alpha-green-1400: #002411;
        --cpd-color-alpha-green-1300: #00331f;
        --cpd-color-alpha-green-1200: #004732;
        --cpd-color-alpha-green-1100: #005c45;
        --cpd-color-alpha-green-1000: #006b52;
        --cpd-color-alpha-green-900: #007a62;
        --cpd-color-alpha-green-800: #009975;
        --cpd-color-alpha-green-700: rgba(1, 193, 138, 0.96);
        --cpd-color-alpha-green-600: rgba(1, 183, 110, 0.56);
        --cpd-color-alpha-green-500: rgba(4, 185, 106, 0.41);
        --cpd-color-alpha-green-400: rgba(7, 182, 97, 0.23);
        --cpd-color-alpha-green-300: rgba(0, 184, 92, 0.11);
        --cpd-color-alpha-green-200: rgba(22, 187, 105, 0.06);
        --cpd-color-alpha-green-100: rgba(22, 187, 121, 0.03);
        --cpd-color-alpha-lime-1400: #002400;
        --cpd-color-alpha-lime-1300: #003800;
        --cpd-color-alpha-lime-1200: #004d00;
        --cpd-color-alpha-lime-1100: #006100;
        --cpd-color-alpha-lime-1000: #007000;
        --cpd-color-alpha-lime-900: rgba(16, 121, 2, 0.96);
        --cpd-color-alpha-lime-800: rgba(32, 147, 1, 0.91);
        --cpd-color-alpha-lime-700: rgba(57, 189, 0, 0.86);
        --cpd-color-alpha-lime-600: rgba(64, 206, 3, 0.71);
        --cpd-color-alpha-lime-500: rgba(55, 202, 2, 0.51);
        --cpd-color-alpha-lime-400: rgba(58, 206, 9, 0.28);
        --cpd-color-alpha-lime-300: rgba(46, 207, 2, 0.15);
        --cpd-color-alpha-lime-200: rgba(56, 212, 12, 0.07);
        --cpd-color-alpha-lime-100: rgba(79, 205, 29, 0.04);
        --cpd-color-alpha-yellow-1400: #420700;
        --cpd-color-alpha-yellow-1300: #571b00;
        --cpd-color-alpha-yellow-1200: #6b2e00;
        --cpd-color-alpha-yellow-1100: #804000;
        --cpd-color-alpha-yellow-1000: #8f4c00;
        --cpd-color-alpha-yellow-900: #9e5a00;
        --cpd-color-alpha-yellow-800: #bd7b00;
        --cpd-color-alpha-yellow-700: #e0a500;
        --cpd-color-alpha-yellow-600: #f0bc00;
        --cpd-color-alpha-yellow-500: #facc00;
        --cpd-color-alpha-yellow-400: rgba(255, 201, 5, 0.49);
        --cpd-color-alpha-yellow-300: rgba(255, 201, 5, 0.25);
        --cpd-color-alpha-yellow-200: rgba(255, 199, 15, 0.13);
        --cpd-color-alpha-yellow-100: rgba(255, 205, 5, 0.06);
        --cpd-color-alpha-orange-1400: #470000;
        --cpd-color-alpha-orange-1300: #610000;
        --cpd-color-alpha-orange-1200: #850000;
        --cpd-color-alpha-orange-1100: #992100;
        --cpd-color-alpha-orange-1000: #ad3400;
        --cpd-color-alpha-orange-900: #bd4500;
        --cpd-color-alpha-orange-800: #db6600;
        --cpd-color-alpha-orange-700: rgba(245, 110, 0, 0.75);
        --cpd-color-alpha-orange-600: rgba(252, 111, 3, 0.52);
        --cpd-color-alpha-orange-500: rgba(255, 106, 0, 0.37);
        --cpd-color-alpha-orange-400: rgba(255, 109, 5, 0.22);
        --cpd-color-alpha-orange-300: rgba(255, 108, 10, 0.11);
        --cpd-color-alpha-orange-200: rgba(255, 125, 25, 0.07);
        --cpd-color-alpha-orange-100: rgba(255, 129, 56, 0.04);
        --cpd-color-alpha-red-1400: #470000;
        --cpd-color-alpha-red-1300: #610000;
        --cpd-color-alpha-red-1200: #850007;
        --cpd-color-alpha-red-1100: rgba(162, 1, 28, 0.99);
        --cpd-color-alpha-red-1000: rgba(187, 2, 23, 0.95);
        --cpd-color-alpha-red-900: rgba(207, 2, 19, 0.91);
        --cpd-color-alpha-red-800: rgba(255, 5, 5, 0.77);
        --cpd-color-alpha-red-700: rgba(255, 26, 5, 0.5);
        --cpd-color-alpha-red-600: rgba(255, 34, 5, 0.36);
        --cpd-color-alpha-red-500: rgba(255, 38, 5, 0.27);
        --cpd-color-alpha-red-400: rgba(255, 43, 10, 0.15);
        --cpd-color-alpha-red-300: rgba(255, 56, 20, 0.08);
        --cpd-color-alpha-red-200: rgba(255, 57, 31, 0.04);
        --cpd-color-alpha-red-100: rgba(255, 89, 56, 0.03);
        --cpd-color-alpha-gray-1400: rgba(2, 4, 8, 0.9);
        --cpd-color-alpha-gray-1300: rgba(3, 5, 12, 0.84);
        --cpd-color-alpha-gray-1200: rgba(2, 7, 13, 0.77);
        --cpd-color-alpha-gray-1100: rgba(3, 11, 22, 0.71);
        --cpd-color-alpha-gray-1000: rgba(3, 12, 27, 0.66);
        --cpd-color-alpha-gray-900: rgba(3, 16, 33, 0.61);
        --cpd-color-alpha-gray-800: rgba(3, 21, 43, 0.5);
        --cpd-color-alpha-gray-700: rgba(1, 21, 50, 0.35);
        --cpd-color-alpha-gray-600: rgba(1, 29, 60, 0.26);
        --cpd-color-alpha-gray-500: rgba(5, 36, 72, 0.2);
        --cpd-color-alpha-gray-400: rgba(5, 46, 97, 0.12);
        --cpd-color-alpha-gray-300: rgba(5, 38, 87, 0.06);
        --cpd-color-alpha-gray-200: rgba(54, 104, 129, 0.04);
        --cpd-color-alpha-gray-100: rgba(54, 105, 155, 0.02);
        --cpd-color-pink-1400: #430017;
        --cpd-color-pink-1300: #5f002b;
        --cpd-color-pink-1200: #7e0642;
        --cpd-color-pink-1100: #9f0850;
        --cpd-color-pink-1000: #b80a5b;
        --cpd-color-pink-900: #d20c65;
        --cpd-color-pink-800: #f7407d;
        --cpd-color-pink-700: #ff88a6;
        --cpd-color-pink-600: #ffadc0;
        --cpd-color-pink-500: #ffc2cf;
        --cpd-color-pink-400: #ffdee5;
        --cpd-color-pink-300: #ffecf0;
        --cpd-color-pink-200: #fff5f7;
        --cpd-color-pink-100: #fffafb;
        --cpd-color-fuchsia-1400: #34004c;
        --cpd-color-fuchsia-1300: #4e0068;
        --cpd-color-fuchsia-1200: #671481;
        --cpd-color-fuchsia-1100: #822198;
        --cpd-color-fuchsia-1000: #972aaa;
        --cpd-color-fuchsia-900: #ad33bd;
        --cpd-color-fuchsia-800: #c85ed1;
        --cpd-color-fuchsia-700: #db93e1;
        --cpd-color-fuchsia-600: #e7b2ea;
        --cpd-color-fuchsia-500: #edc6f0;
        --cpd-color-fuchsia-400: #f6dff7;
        --cpd-color-fuchsia-300: #faeefb;
        --cpd-color-fuchsia-200: #fcf5fd;
        --cpd-color-fuchsia-100: #fefafe;
        --cpd-color-purple-1400: #200066;
        --cpd-color-purple-1300: #33008d;
        --cpd-color-purple-1200: #4c05b5;
        --cpd-color-purple-1100: #5d26cd;
        --cpd-color-purple-1000: #6b37de;
        --cpd-color-purple-900: #7a47f1;
        --cpd-color-purple-800: #9271fd;
        --cpd-color-purple-700: #b1a0ff;
        --cpd-color-purple-600: #c5bbff;
        --cpd-color-purple-500: #d4cdff;
        --cpd-color-purple-400: #e6e2ff;
        --cpd-color-purple-300: #f1efff;
        --cpd-color-purple-200: #f8f7ff;
        --cpd-color-purple-100: #fbfbff;
        --cpd-color-blue-1400: #000e65;
        --cpd-color-blue-1300: #012478;
        --cpd-color-blue-1200: #043894;
        --cpd-color-blue-1100: #064ab1;
        --cpd-color-blue-1000: #0558c7;
        --cpd-color-blue-900: #0467dd;
        --cpd-color-blue-800: #4088ee;
        --cpd-color-blue-700: #7eaff6;
        --cpd-color-blue-600: #a3c6fa;
        --cpd-color-blue-500: #bad5fc;
        --cpd-color-blue-400: #d8e7fe;
        --cpd-color-blue-300: #e9f2ff;
        --cpd-color-blue-200: #f4f8ff;
        --cpd-color-blue-100: #f9fcff;
        --cpd-color-cyan-1400: #00194f;
        --cpd-color-cyan-1300: #002b61;
        --cpd-color-cyan-1200: #004077;
        --cpd-color-cyan-1100: #00548c;
        --cpd-color-cyan-1000: #00629c;
        --cpd-color-cyan-900: #0072ac;
        --cpd-color-cyan-800: #0094c0;
        --cpd-color-cyan-700: #15becf;
        --cpd-color-cyan-600: #76d1dd;
        --cpd-color-cyan-500: #9bdde5;
        --cpd-color-cyan-400: #c7ecf0;
        --cpd-color-cyan-300: #e3f5f8;
        --cpd-color-cyan-200: #f1fafb;
        --cpd-color-cyan-100: #f8fdfd;
        --cpd-color-green-1400: #002311;
        --cpd-color-green-1300: #003420;
        --cpd-color-green-1200: #004933;
        --cpd-color-green-1100: #005c45;
        --cpd-color-green-1000: #006b52;
        --cpd-color-green-900: #007a61;
        --cpd-color-green-800: #009b78;
        --cpd-color-green-700: #0bc491;
        --cpd-color-green-600: #71d7ae;
        --cpd-color-green-500: #98e1c1;
        --cpd-color-green-400: #c6eedb;
        --cpd-color-green-300: #e3f7ed;
        --cpd-color-green-200: #f1fbf6;
        --cpd-color-green-100: #f8fdfb;
        --cpd-color-lime-1400: #002400;
        --cpd-color-lime-1300: #003600;
        --cpd-color-lime-1200: #004b00;
        --cpd-color-lime-1100: #005f00;
        --cpd-color-lime-1000: #006e00;
        --cpd-color-lime-900: #197d0c;
        --cpd-color-lime-800: #359d18;
        --cpd-color-lime-700: #54c424;
        --cpd-color-lime-600: #76db4c;
        --cpd-color-lime-500: #99e57e;
        --cpd-color-lime-400: #c8f1ba;
        --cpd-color-lime-300: #e0f8d9;
        --cpd-color-lime-200: #f1fcee;
        --cpd-color-lime-100: #f8fdf6;
        --cpd-color-yellow-1400: #410600;
        --cpd-color-yellow-1300: #541a00;
        --cpd-color-yellow-1200: #692e00;
        --cpd-color-yellow-1100: #803f00;
        --cpd-color-yellow-1000: #8f4d00;
        --cpd-color-yellow-900: #9f5b00;
        --cpd-color-yellow-800: #be7a00;
        --cpd-color-yellow-700: #dea200;
        --cpd-color-yellow-600: #f1bd00;
        --cpd-color-yellow-500: #fbce00;
        --cpd-color-yellow-400: #ffe484;
        --cpd-color-yellow-300: #fff2c1;
        --cpd-color-yellow-200: #fff8e0;
        --cpd-color-yellow-100: #fffcf0;
        --cpd-color-orange-1400: #450000;
        --cpd-color-orange-1300: #620000;
        --cpd-color-orange-1200: #850000;
        --cpd-color-orange-1100: #9b2200;
        --cpd-color-orange-1000: #ac3300;
        --cpd-color-orange-900: #bc4500;
        --cpd-color-orange-800: #dc6700;
        --cpd-color-orange-700: #f89440;
        --cpd-color-orange-600: #fdb37c;
        --cpd-color-orange-500: #ffc8a1;
        --cpd-color-orange-400: #ffdfc8;
        --cpd-color-orange-300: #ffefe4;
        --cpd-color-orange-200: #fff6ef;
        --cpd-color-orange-100: #fffaf7;
        --cpd-color-red-1400: #450000;
        --cpd-color-red-1300: #620000;
        --cpd-color-red-1200: #850006;
        --cpd-color-red-1100: #a4041d;
        --cpd-color-red-1000: #bc0f22;
        --cpd-color-red-900: #d51928;
        --cpd-color-red-800: #ff3d3d;
        --cpd-color-red-700: #ff8c81;
        --cpd-color-red-600: #ffafa5;
        --cpd-color-red-500: #ffc5bc;
        --cpd-color-red-400: #ffdfda;
        --cpd-color-red-300: #ffefec;
        --cpd-color-red-200: #fff7f6;
        --cpd-color-red-100: #fffaf9;
        --cpd-color-gray-1400: #1b1d22;
        --cpd-color-gray-1300: #2b2d32;
        --cpd-color-gray-1200: #3c4045;
        --cpd-color-gray-1100: #4c5158;
        --cpd-color-gray-1000: #595e67;
        --cpd-color-gray-900: #656d77;
        --cpd-color-gray-800: #818a95;
        --cpd-color-gray-700: #a6adb7;
        --cpd-color-gray-600: #bdc4cc;
        --cpd-color-gray-500: #cdd3da;
        --cpd-color-gray-400: #e1e6ec;
        --cpd-color-gray-300: #f0f2f5;
        --cpd-color-gray-200: #f7f9fa;
        --cpd-color-gray-100: #fbfcfd;
        --cpd-color-theme-bg: #fff;
      }
    }
  }
}
@layer compound {
  @media screen {
    @layer cpd-semantic {
      .cpd-theme-light.cpd-theme-light {
        --cpd-color-bg-subtle-secondary-level-0: var(--cpd-color-gray-300);
        --cpd-color-bg-canvas-default-level-1: var(--cpd-color-theme-bg);
      }
    }
  }
}
@layer compound {
  @media screen and (prefers-color-scheme: light) {
    @layer cpd-semantic {
      :root {
        --cpd-color-bg-subtle-secondary-level-0: var(--cpd-color-gray-300);
        --cpd-color-bg-canvas-default-level-1: var(--cpd-color-theme-bg);
      }
    }
  }
}
@layer compound {
  @media screen {
    @layer cpd-base {
      .cpd-theme-light-hc.cpd-theme-light-hc {
        --cpd-color-alpha-pink-1400: #420015;
        --cpd-color-alpha-pink-1300: #4d001d;
        --cpd-color-alpha-pink-1200: #660030;
        --cpd-color-alpha-pink-1100: #70003a;
        --cpd-color-alpha-pink-1000: rgba(131, 2, 66, 0.98);
        --cpd-color-alpha-pink-900: rgba(143, 0, 69, 0.97);
        --cpd-color-alpha-pink-800: rgba(222, 2, 101, 0.96);
        --cpd-color-alpha-pink-700: rgba(247, 2, 80, 0.7);
        --cpd-color-alpha-pink-600: rgba(255, 0, 64, 0.47);
        --cpd-color-alpha-pink-500: rgba(255, 5, 63, 0.33);
        --cpd-color-alpha-pink-400: rgba(255, 10, 63, 0.19);
        --cpd-color-alpha-pink-300: rgba(255, 0, 55, 0.13);
        --cpd-color-alpha-pink-200: rgba(255, 20, 71, 0.08);
        --cpd-color-alpha-pink-100: rgba(255, 5, 55, 0.04);
        --cpd-color-alpha-fuchsia-1400: #34004d;
        --cpd-color-alpha-fuchsia-1300: #3a0052;
        --cpd-color-alpha-fuchsia-1200: #53026e;
        --cpd-color-alpha-fuchsia-1100: rgba(83, 2, 111, 0.95);
        --cpd-color-alpha-fuchsia-1000: rgba(94, 0, 122, 0.91);
        --cpd-color-alpha-fuchsia-900: rgba(106, 3, 135, 0.9);
        --cpd-color-alpha-fuchsia-800: rgba(164, 2, 182, 0.79);
        --cpd-color-alpha-fuchsia-700: rgba(171, 3, 186, 0.6);
        --cpd-color-alpha-fuchsia-600: rgba(170, 4, 185, 0.43);
        --cpd-color-alpha-fuchsia-500: rgba(178, 7, 187, 0.31);
        --cpd-color-alpha-fuchsia-400: rgba(177, 5, 189, 0.18);
        --cpd-color-alpha-fuchsia-300: rgba(189, 9, 195, 0.13);
        --cpd-color-alpha-fuchsia-200: rgba(182, 12, 198, 0.07);
        --cpd-color-alpha-fuchsia-100: rgba(181, 5, 204, 0.04);
        --cpd-color-alpha-purple-1400: #1f0061;
        --cpd-color-alpha-purple-1300: #240070;
        --cpd-color-alpha-purple-1200: #360094;
        --cpd-color-alpha-purple-1100: #4300a8;
        --cpd-color-alpha-purple-1000: rgba(70, 0, 184, 0.95);
        --cpd-color-alpha-purple-900: rgba(69, 3, 191, 0.9);
        --cpd-color-alpha-purple-800: rgba(76, 2, 247, 0.7);
        --cpd-color-alpha-purple-700: rgba(60, 0, 255, 0.53);
        --cpd-color-alpha-purple-600: rgba(51, 5, 255, 0.38);
        --cpd-color-alpha-purple-500: rgba(43, 5, 255, 0.27);
        --cpd-color-alpha-purple-400: rgba(43, 10, 255, 0.16);
        --cpd-color-alpha-purple-300: rgba(47, 15, 255, 0.12);
        --cpd-color-alpha-purple-200: rgba(56, 25, 255, 0.07);
        --cpd-color-alpha-purple-100: rgba(83, 56, 255, 0.04);
        --cpd-color-alpha-blue-1400: #000b61;
        --cpd-color-alpha-blue-1300: #00156b;
        --cpd-color-alpha-blue-1200: rgba(0, 37, 122, 0.99);
        --cpd-color-alpha-blue-1100: rgba(1, 46, 137, 0.99);
        --cpd-color-alpha-blue-1000: rgba(2, 57, 151, 0.99);
        --cpd-color-alpha-blue-900: rgba(2, 65, 167, 0.99);
        --cpd-color-alpha-blue-800: rgba(1, 110, 233, 0.99);
        --cpd-color-alpha-blue-700: rgba(0, 98, 235, 0.71);
        --cpd-color-alpha-blue-600: rgba(2, 100, 237, 0.51);
        --cpd-color-alpha-blue-500: rgba(6, 99, 239, 0.37);
        --cpd-color-alpha-blue-400: rgba(5, 101, 245, 0.22);
        --cpd-color-alpha-blue-300: rgba(11, 106, 249, 0.16);
        --cpd-color-alpha-blue-200: rgba(10, 112, 255, 0.09);
        --cpd-color-alpha-blue-100: rgba(36, 116, 255, 0.05);
        --cpd-color-alpha-cyan-1400: #00174d;
        --cpd-color-alpha-cyan-1300: #001e52;
        --cpd-color-alpha-cyan-1200: #003066;
        --cpd-color-alpha-cyan-1100: #003870;
        --cpd-color-alpha-cyan-1000: #00437a;
        --cpd-color-alpha-cyan-900: #004d85;
        --cpd-color-alpha-cyan-800: #007ab3;
        --cpd-color-alpha-cyan-700: #0098c2;
        --cpd-color-alpha-cyan-600: rgba(1, 183, 203, 0.92);
        --cpd-color-alpha-cyan-500: rgba(1, 170, 193, 0.54);
        --cpd-color-alpha-cyan-400: rgba(3, 169, 191, 0.31);
        --cpd-color-alpha-cyan-300: rgba(0, 170, 189, 0.22);
        --cpd-color-alpha-cyan-200: rgba(0, 168, 194, 0.11);
        --cpd-color-alpha-cyan-100: rgba(22, 171, 187, 0.06);
        --cpd-color-alpha-green-1400: #002410;
        --cpd-color-alpha-green-1300: #002916;
        --cpd-color-alpha-green-1200: #003824;
        --cpd-color-alpha-green-1100: #00422c;
        --cpd-color-alpha-green-1000: #004d36;
        --cpd-color-alpha-green-900: #00573e;
        --cpd-color-alpha-green-800: #00856a;
        --cpd-color-alpha-green-700: #00a37d;
        --cpd-color-alpha-green-600: rgba(1, 193, 138, 0.96);
        --cpd-color-alpha-green-500: rgba(1, 183, 110, 0.56);
        --cpd-color-alpha-green-400: rgba(5, 184, 103, 0.32);
        --cpd-color-alpha-green-300: rgba(7, 182, 97, 0.23);
        --cpd-color-alpha-green-200: rgba(0, 184, 92, 0.11);
        --cpd-color-alpha-green-100: rgba(22, 187, 105, 0.06);
        --cpd-color-alpha-lime-1400: #002400;
        --cpd-color-alpha-lime-1300: #002900;
        --cpd-color-alpha-lime-1200: #003800;
        --cpd-color-alpha-lime-1100: #004200;
        --cpd-color-alpha-lime-1000: #005200;
        --cpd-color-alpha-lime-900: #005700;
        --cpd-color-alpha-lime-800: rgba(18, 126, 2, 0.95);
        --cpd-color-alpha-lime-700: rgba(36, 152, 1, 0.9);
        --cpd-color-alpha-lime-600: rgba(57, 189, 0, 0.86);
        --cpd-color-alpha-lime-500: rgba(64, 206, 3, 0.71);
        --cpd-color-alpha-lime-400: rgba(55, 204, 5, 0.4);
        --cpd-color-alpha-lime-300: rgba(58, 206, 9, 0.28);
        --cpd-color-alpha-lime-200: rgba(46, 207, 2, 0.15);
        --cpd-color-alpha-lime-100: rgba(56, 212, 12, 0.07);
        --cpd-color-alpha-yellow-1400: #3d0500;
        --cpd-color-alpha-yellow-1300: #470c00;
        --cpd-color-alpha-yellow-1200: #571d00;
        --cpd-color-alpha-yellow-1100: #612700;
        --cpd-color-alpha-yellow-1000: #703200;
        --cpd-color-alpha-yellow-900: #753700;
        --cpd-color-alpha-yellow-800: #a86500;
        --cpd-color-alpha-yellow-700: #c28100;
        --cpd-color-alpha-yellow-600: #e0a500;
        --cpd-color-alpha-yellow-500: #f0bc00;
        --cpd-color-alpha-yellow-400: rgba(255, 204, 0, 0.72);
        --cpd-color-alpha-yellow-300: rgba(255, 201, 5, 0.49);
        --cpd-color-alpha-yellow-200: rgba(255, 201, 5, 0.25);
        --cpd-color-alpha-yellow-100: rgba(255, 199, 15, 0.13);
        --cpd-color-alpha-orange-1400: #420000;
        --cpd-color-alpha-orange-1300: #4d0000;
        --cpd-color-alpha-orange-1200: #600;
        --cpd-color-alpha-orange-1100: #750000;
        --cpd-color-alpha-orange-1000: #8a0900;
        --cpd-color-alpha-orange-900: #941600;
        --cpd-color-alpha-orange-800: #c24e00;
        --cpd-color-alpha-orange-700: #e06c00;
        --cpd-color-alpha-orange-600: rgba(245, 110, 0, 0.75);
        --cpd-color-alpha-orange-500: rgba(252, 111, 3, 0.52);
        --cpd-color-alpha-orange-400: rgba(255, 112, 10, 0.3);
        --cpd-color-alpha-orange-300: rgba(255, 109, 5, 0.22);
        --cpd-color-alpha-orange-200: rgba(255, 108, 10, 0.11);
        --cpd-color-alpha-orange-100: rgba(255, 125, 25, 0.07);
        --cpd-color-alpha-red-1400: #420000;
        --cpd-color-alpha-red-1300: #4d0000;
        --cpd-color-alpha-red-1200: #600;
        --cpd-color-alpha-red-1100: #750000;
        --cpd-color-alpha-red-1000: #8a000b;
        --cpd-color-alpha-red-900: #99001a;
        --cpd-color-alpha-red-800: rgba(222, 2, 17, 0.89);
        --cpd-color-alpha-red-700: rgba(255, 8, 0, 0.72);
        --cpd-color-alpha-red-600: rgba(255, 26, 5, 0.5);
        --cpd-color-alpha-red-500: rgba(255, 34, 5, 0.36);
        --cpd-color-alpha-red-400: rgba(255, 38, 5, 0.21);
        --cpd-color-alpha-red-300: rgba(255, 43, 10, 0.15);
        --cpd-color-alpha-red-200: rgba(255, 56, 20, 0.08);
        --cpd-color-alpha-red-100: rgba(255, 57, 31, 0.04);
        --cpd-color-alpha-gray-1400: rgba(1, 3, 9, 0.9);
        --cpd-color-alpha-gray-1300: rgba(0, 4, 10, 0.88);
        --cpd-color-alpha-gray-1200: rgba(2, 5, 9, 0.83);
        --cpd-color-alpha-gray-1100: rgba(3, 6, 12, 0.8);
        --cpd-color-alpha-gray-1000: rgba(2, 6, 13, 0.76);
        --cpd-color-alpha-gray-900: rgba(3, 7, 17, 0.73);
        --cpd-color-alpha-gray-800: rgba(2, 14, 34, 0.58);
        --cpd-color-alpha-gray-700: rgba(5, 21, 46, 0.48);
        --cpd-color-alpha-gray-600: rgba(1, 21, 50, 0.35);
        --cpd-color-alpha-gray-500: rgba(1, 29, 60, 0.26);
        --cpd-color-alpha-gray-400: rgba(5, 37, 81, 0.16);
        --cpd-color-alpha-gray-300: rgba(5, 46, 97, 0.12);
        --cpd-color-alpha-gray-200: rgba(5, 38, 87, 0.06);
        --cpd-color-alpha-gray-100: rgba(54, 104, 129, 0.04);
        --cpd-color-pink-1400: #410015;
        --cpd-color-pink-1300: #4a001c;
        --cpd-color-pink-1200: #64002f;
        --cpd-color-pink-1100: #72003a;
        --cpd-color-pink-1000: #840745;
        --cpd-color-pink-900: #92084b;
        --cpd-color-pink-800: #e00c6a;
        --cpd-color-pink-700: #f94e84;
        --cpd-color-pink-600: #ff88a6;
        --cpd-color-pink-500: #ffadc0;
        --cpd-color-pink-400: #ffd0da;
        --cpd-color-pink-300: #ffdee5;
        --cpd-color-pink-200: #ffecf0;
        --cpd-color-pink-100: #fff5f7;
        --cpd-color-fuchsia-1400: #32004a;
        --cpd-color-fuchsia-1300: #3b0053;
        --cpd-color-fuchsia-1200: #52026c;
        --cpd-color-fuchsia-1100: #5c0f76;
        --cpd-color-fuchsia-1000: #6c1785;
        --cpd-color-fuchsia-900: #781c90;
        --cpd-color-fuchsia-800: #b937c6;
        --cpd-color-fuchsia-700: #cb68d4;
        --cpd-color-fuchsia-600: #db93e1;
        --cpd-color-fuchsia-500: #e7b2ea;
        --cpd-color-fuchsia-400: #f1d2f3;
        --cpd-color-fuchsia-300: #f6dff7;
        --cpd-color-fuchsia-200: #faeefb;
        --cpd-color-fuchsia-100: #fcf5fd;
        --cpd-color-purple-1400: #1f0062;
        --cpd-color-purple-1300: #240070;
        --cpd-color-purple-1200: #360094;
        --cpd-color-purple-1100: #4200a6;
        --cpd-color-purple-1000: #4f0dba;
        --cpd-color-purple-900: #571cc4;
        --cpd-color-purple-800: #824ef9;
        --cpd-color-purple-700: #9778fe;
        --cpd-color-purple-600: #b1a0ff;
        --cpd-color-purple-500: #c5bbff;
        --cpd-color-purple-400: #ddd8ff;
        --cpd-color-purple-300: #e6e2ff;
        --cpd-color-purple-200: #f1efff;
        --cpd-color-purple-100: #f8f7ff;
        --cpd-color-blue-1400: #000c63;
        --cpd-color-blue-1300: #001569;
        --cpd-color-blue-1200: #03277b;
        --cpd-color-blue-1100: #043088;
        --cpd-color-blue-1000: #053b9a;
        --cpd-color-blue-900: #0543a7;
        --cpd-color-blue-800: #046ee8;
        --cpd-color-blue-700: #4a8ef0;
        --cpd-color-blue-600: #7eaff6;
        --cpd-color-blue-500: #a3c6fa;
        --cpd-color-blue-400: #c8ddfd;
        --cpd-color-blue-300: #d8e7fe;
        --cpd-color-blue-200: #e9f2ff;
        --cpd-color-blue-100: #f4f8ff;
        --cpd-color-cyan-1400: #00174d;
        --cpd-color-cyan-1300: #001e53;
        --cpd-color-cyan-1200: #002e64;
        --cpd-color-cyan-1100: #00376e;
        --cpd-color-cyan-1000: #00447b;
        --cpd-color-cyan-900: #004c84;
        --cpd-color-cyan-800: #007ab3;
        --cpd-color-cyan-700: #009ac3;
        --cpd-color-cyan-600: #15becf;
        --cpd-color-cyan-500: #76d1dd;
        --cpd-color-cyan-400: #b1e4eb;
        --cpd-color-cyan-300: #c7ecf0;
        --cpd-color-cyan-200: #e3f5f8;
        --cpd-color-cyan-100: #f1fafb;
        --cpd-color-green-1400: #00210f;
        --cpd-color-green-1300: #002715;
        --cpd-color-green-1200: #003723;
        --cpd-color-green-1100: #00402b;
        --cpd-color-green-1000: #004d36;
        --cpd-color-green-900: #00553d;
        --cpd-color-green-800: #008268;
        --cpd-color-green-700: #00a27c;
        --cpd-color-green-600: #0bc491;
        --cpd-color-green-500: #71d7ae;
        --cpd-color-green-400: #afe8ce;
        --cpd-color-green-300: #c6eedb;
        --cpd-color-green-200: #e3f7ed;
        --cpd-color-green-100: #f1fbf6;
        --cpd-color-lime-1400: #020;
        --cpd-color-lime-1300: #002900;
        --cpd-color-lime-1200: #003900;
        --cpd-color-lime-1100: #004200;
        --cpd-color-lime-1000: #004f00;
        --cpd-color-lime-900: #005700;
        --cpd-color-lime-800: #1f850f;
        --cpd-color-lime-700: #3aa31a;
        --cpd-color-lime-600: #54c424;
        --cpd-color-lime-500: #76db4c;
        --cpd-color-lime-400: #afeb9b;
        --cpd-color-lime-300: #c8f1ba;
        --cpd-color-lime-200: #e0f8d9;
        --cpd-color-lime-100: #f1fcee;
        --cpd-color-yellow-1400: #3f0500;
        --cpd-color-yellow-1300: #450c00;
        --cpd-color-yellow-1200: #571d00;
        --cpd-color-yellow-1100: #612600;
        --cpd-color-yellow-1000: #6e3100;
        --cpd-color-yellow-900: #773800;
        --cpd-color-yellow-800: #a76300;
        --cpd-color-yellow-700: #c38100;
        --cpd-color-yellow-600: #dea200;
        --cpd-color-yellow-500: #f1bd00;
        --cpd-color-yellow-400: #ffda49;
        --cpd-color-yellow-300: #ffe484;
        --cpd-color-yellow-200: #fff2c1;
        --cpd-color-yellow-100: #fff8e0;
        --cpd-color-orange-1400: #420000;
        --cpd-color-orange-1300: #4c0000;
        --cpd-color-orange-1200: #670000;
        --cpd-color-orange-1100: #700;
        --cpd-color-orange-1000: #890800;
        --cpd-color-orange-900: #931700;
        --cpd-color-orange-800: #c44d00;
        --cpd-color-orange-700: #e26e00;
        --cpd-color-orange-600: #f89440;
        --cpd-color-orange-500: #fdb37c;
        --cpd-color-orange-400: #ffd4b5;
        --cpd-color-orange-300: #ffdfc8;
        --cpd-color-orange-200: #ffefe4;
        --cpd-color-orange-100: #fff6ef;
        --cpd-color-red-1400: #420000;
        --cpd-color-red-1300: #4c0000;
        --cpd-color-red-1200: #670000;
        --cpd-color-red-1100: #700;
        --cpd-color-red-1000: #8b000c;
        --cpd-color-red-900: #99001a;
        --cpd-color-red-800: #e11e2a;
        --cpd-color-red-700: #ff4e49;
        --cpd-color-red-600: #ff8c81;
        --cpd-color-red-500: #ffafa5;
        --cpd-color-red-400: #ffd1ca;
        --cpd-color-red-300: #ffdfda;
        --cpd-color-red-200: #ffefec;
        --cpd-color-red-100: #fff7f6;
        --cpd-color-gray-1400: #1a1c21;
        --cpd-color-gray-1300: #1f2126;
        --cpd-color-gray-1200: #2d3034;
        --cpd-color-gray-1100: #35383d;
        --cpd-color-gray-1000: #3f4248;
        --cpd-color-gray-900: #474a51;
        --cpd-color-gray-800: #6c737e;
        --cpd-color-gray-700: #878f9b;
        --cpd-color-gray-600: #a6adb7;
        --cpd-color-gray-500: #bdc4cc;
        --cpd-color-gray-400: #d7dce3;
        --cpd-color-gray-300: #e1e6ec;
        --cpd-color-gray-200: #f0f2f5;
        --cpd-color-gray-100: #f7f9fa;
        --cpd-color-theme-bg: #fff;
      }
    }
  }
}
@layer compound {
  @media screen and (prefers-color-scheme: light) and (prefers-contrast: more) {
    @layer cpd-base {
      :root {
        --cpd-color-alpha-pink-1400: #420015;
        --cpd-color-alpha-pink-1300: #4d001d;
        --cpd-color-alpha-pink-1200: #660030;
        --cpd-color-alpha-pink-1100: #70003a;
        --cpd-color-alpha-pink-1000: rgba(131, 2, 66, 0.98);
        --cpd-color-alpha-pink-900: rgba(143, 0, 69, 0.97);
        --cpd-color-alpha-pink-800: rgba(222, 2, 101, 0.96);
        --cpd-color-alpha-pink-700: rgba(247, 2, 80, 0.7);
        --cpd-color-alpha-pink-600: rgba(255, 0, 64, 0.47);
        --cpd-color-alpha-pink-500: rgba(255, 5, 63, 0.33);
        --cpd-color-alpha-pink-400: rgba(255, 10, 63, 0.19);
        --cpd-color-alpha-pink-300: rgba(255, 0, 55, 0.13);
        --cpd-color-alpha-pink-200: rgba(255, 20, 71, 0.08);
        --cpd-color-alpha-pink-100: rgba(255, 5, 55, 0.04);
        --cpd-color-alpha-fuchsia-1400: #34004d;
        --cpd-color-alpha-fuchsia-1300: #3a0052;
        --cpd-color-alpha-fuchsia-1200: #53026e;
        --cpd-color-alpha-fuchsia-1100: rgba(83, 2, 111, 0.95);
        --cpd-color-alpha-fuchsia-1000: rgba(94, 0, 122, 0.91);
        --cpd-color-alpha-fuchsia-900: rgba(106, 3, 135, 0.9);
        --cpd-color-alpha-fuchsia-800: rgba(164, 2, 182, 0.79);
        --cpd-color-alpha-fuchsia-700: rgba(171, 3, 186, 0.6);
        --cpd-color-alpha-fuchsia-600: rgba(170, 4, 185, 0.43);
        --cpd-color-alpha-fuchsia-500: rgba(178, 7, 187, 0.31);
        --cpd-color-alpha-fuchsia-400: rgba(177, 5, 189, 0.18);
        --cpd-color-alpha-fuchsia-300: rgba(189, 9, 195, 0.13);
        --cpd-color-alpha-fuchsia-200: rgba(182, 12, 198, 0.07);
        --cpd-color-alpha-fuchsia-100: rgba(181, 5, 204, 0.04);
        --cpd-color-alpha-purple-1400: #1f0061;
        --cpd-color-alpha-purple-1300: #240070;
        --cpd-color-alpha-purple-1200: #360094;
        --cpd-color-alpha-purple-1100: #4300a8;
        --cpd-color-alpha-purple-1000: rgba(70, 0, 184, 0.95);
        --cpd-color-alpha-purple-900: rgba(69, 3, 191, 0.9);
        --cpd-color-alpha-purple-800: rgba(76, 2, 247, 0.7);
        --cpd-color-alpha-purple-700: rgba(60, 0, 255, 0.53);
        --cpd-color-alpha-purple-600: rgba(51, 5, 255, 0.38);
        --cpd-color-alpha-purple-500: rgba(43, 5, 255, 0.27);
        --cpd-color-alpha-purple-400: rgba(43, 10, 255, 0.16);
        --cpd-color-alpha-purple-300: rgba(47, 15, 255, 0.12);
        --cpd-color-alpha-purple-200: rgba(56, 25, 255, 0.07);
        --cpd-color-alpha-purple-100: rgba(83, 56, 255, 0.04);
        --cpd-color-alpha-blue-1400: #000b61;
        --cpd-color-alpha-blue-1300: #00156b;
        --cpd-color-alpha-blue-1200: rgba(0, 37, 122, 0.99);
        --cpd-color-alpha-blue-1100: rgba(1, 46, 137, 0.99);
        --cpd-color-alpha-blue-1000: rgba(2, 57, 151, 0.99);
        --cpd-color-alpha-blue-900: rgba(2, 65, 167, 0.99);
        --cpd-color-alpha-blue-800: rgba(1, 110, 233, 0.99);
        --cpd-color-alpha-blue-700: rgba(0, 98, 235, 0.71);
        --cpd-color-alpha-blue-600: rgba(2, 100, 237, 0.51);
        --cpd-color-alpha-blue-500: rgba(6, 99, 239, 0.37);
        --cpd-color-alpha-blue-400: rgba(5, 101, 245, 0.22);
        --cpd-color-alpha-blue-300: rgba(11, 106, 249, 0.16);
        --cpd-color-alpha-blue-200: rgba(10, 112, 255, 0.09);
        --cpd-color-alpha-blue-100: rgba(36, 116, 255, 0.05);
        --cpd-color-alpha-cyan-1400: #00174d;
        --cpd-color-alpha-cyan-1300: #001e52;
        --cpd-color-alpha-cyan-1200: #003066;
        --cpd-color-alpha-cyan-1100: #003870;
        --cpd-color-alpha-cyan-1000: #00437a;
        --cpd-color-alpha-cyan-900: #004d85;
        --cpd-color-alpha-cyan-800: #007ab3;
        --cpd-color-alpha-cyan-700: #0098c2;
        --cpd-color-alpha-cyan-600: rgba(1, 183, 203, 0.92);
        --cpd-color-alpha-cyan-500: rgba(1, 170, 193, 0.54);
        --cpd-color-alpha-cyan-400: rgba(3, 169, 191, 0.31);
        --cpd-color-alpha-cyan-300: rgba(0, 170, 189, 0.22);
        --cpd-color-alpha-cyan-200: rgba(0, 168, 194, 0.11);
        --cpd-color-alpha-cyan-100: rgba(22, 171, 187, 0.06);
        --cpd-color-alpha-green-1400: #002410;
        --cpd-color-alpha-green-1300: #002916;
        --cpd-color-alpha-green-1200: #003824;
        --cpd-color-alpha-green-1100: #00422c;
        --cpd-color-alpha-green-1000: #004d36;
        --cpd-color-alpha-green-900: #00573e;
        --cpd-color-alpha-green-800: #00856a;
        --cpd-color-alpha-green-700: #00a37d;
        --cpd-color-alpha-green-600: rgba(1, 193, 138, 0.96);
        --cpd-color-alpha-green-500: rgba(1, 183, 110, 0.56);
        --cpd-color-alpha-green-400: rgba(5, 184, 103, 0.32);
        --cpd-color-alpha-green-300: rgba(7, 182, 97, 0.23);
        --cpd-color-alpha-green-200: rgba(0, 184, 92, 0.11);
        --cpd-color-alpha-green-100: rgba(22, 187, 105, 0.06);
        --cpd-color-alpha-lime-1400: #002400;
        --cpd-color-alpha-lime-1300: #002900;
        --cpd-color-alpha-lime-1200: #003800;
        --cpd-color-alpha-lime-1100: #004200;
        --cpd-color-alpha-lime-1000: #005200;
        --cpd-color-alpha-lime-900: #005700;
        --cpd-color-alpha-lime-800: rgba(18, 126, 2, 0.95);
        --cpd-color-alpha-lime-700: rgba(36, 152, 1, 0.9);
        --cpd-color-alpha-lime-600: rgba(57, 189, 0, 0.86);
        --cpd-color-alpha-lime-500: rgba(64, 206, 3, 0.71);
        --cpd-color-alpha-lime-400: rgba(55, 204, 5, 0.4);
        --cpd-color-alpha-lime-300: rgba(58, 206, 9, 0.28);
        --cpd-color-alpha-lime-200: rgba(46, 207, 2, 0.15);
        --cpd-color-alpha-lime-100: rgba(56, 212, 12, 0.07);
        --cpd-color-alpha-yellow-1400: #3d0500;
        --cpd-color-alpha-yellow-1300: #470c00;
        --cpd-color-alpha-yellow-1200: #571d00;
        --cpd-color-alpha-yellow-1100: #612700;
        --cpd-color-alpha-yellow-1000: #703200;
        --cpd-color-alpha-yellow-900: #753700;
        --cpd-color-alpha-yellow-800: #a86500;
        --cpd-color-alpha-yellow-700: #c28100;
        --cpd-color-alpha-yellow-600: #e0a500;
        --cpd-color-alpha-yellow-500: #f0bc00;
        --cpd-color-alpha-yellow-400: rgba(255, 204, 0, 0.72);
        --cpd-color-alpha-yellow-300: rgba(255, 201, 5, 0.49);
        --cpd-color-alpha-yellow-200: rgba(255, 201, 5, 0.25);
        --cpd-color-alpha-yellow-100: rgba(255, 199, 15, 0.13);
        --cpd-color-alpha-orange-1400: #420000;
        --cpd-color-alpha-orange-1300: #4d0000;
        --cpd-color-alpha-orange-1200: #600;
        --cpd-color-alpha-orange-1100: #750000;
        --cpd-color-alpha-orange-1000: #8a0900;
        --cpd-color-alpha-orange-900: #941600;
        --cpd-color-alpha-orange-800: #c24e00;
        --cpd-color-alpha-orange-700: #e06c00;
        --cpd-color-alpha-orange-600: rgba(245, 110, 0, 0.75);
        --cpd-color-alpha-orange-500: rgba(252, 111, 3, 0.52);
        --cpd-color-alpha-orange-400: rgba(255, 112, 10, 0.3);
        --cpd-color-alpha-orange-300: rgba(255, 109, 5, 0.22);
        --cpd-color-alpha-orange-200: rgba(255, 108, 10, 0.11);
        --cpd-color-alpha-orange-100: rgba(255, 125, 25, 0.07);
        --cpd-color-alpha-red-1400: #420000;
        --cpd-color-alpha-red-1300: #4d0000;
        --cpd-color-alpha-red-1200: #600;
        --cpd-color-alpha-red-1100: #750000;
        --cpd-color-alpha-red-1000: #8a000b;
        --cpd-color-alpha-red-900: #99001a;
        --cpd-color-alpha-red-800: rgba(222, 2, 17, 0.89);
        --cpd-color-alpha-red-700: rgba(255, 8, 0, 0.72);
        --cpd-color-alpha-red-600: rgba(255, 26, 5, 0.5);
        --cpd-color-alpha-red-500: rgba(255, 34, 5, 0.36);
        --cpd-color-alpha-red-400: rgba(255, 38, 5, 0.21);
        --cpd-color-alpha-red-300: rgba(255, 43, 10, 0.15);
        --cpd-color-alpha-red-200: rgba(255, 56, 20, 0.08);
        --cpd-color-alpha-red-100: rgba(255, 57, 31, 0.04);
        --cpd-color-alpha-gray-1400: rgba(1, 3, 9, 0.9);
        --cpd-color-alpha-gray-1300: rgba(0, 4, 10, 0.88);
        --cpd-color-alpha-gray-1200: rgba(2, 5, 9, 0.83);
        --cpd-color-alpha-gray-1100: rgba(3, 6, 12, 0.8);
        --cpd-color-alpha-gray-1000: rgba(2, 6, 13, 0.76);
        --cpd-color-alpha-gray-900: rgba(3, 7, 17, 0.73);
        --cpd-color-alpha-gray-800: rgba(2, 14, 34, 0.58);
        --cpd-color-alpha-gray-700: rgba(5, 21, 46, 0.48);
        --cpd-color-alpha-gray-600: rgba(1, 21, 50, 0.35);
        --cpd-color-alpha-gray-500: rgba(1, 29, 60, 0.26);
        --cpd-color-alpha-gray-400: rgba(5, 37, 81, 0.16);
        --cpd-color-alpha-gray-300: rgba(5, 46, 97, 0.12);
        --cpd-color-alpha-gray-200: rgba(5, 38, 87, 0.06);
        --cpd-color-alpha-gray-100: rgba(54, 104, 129, 0.04);
        --cpd-color-pink-1400: #410015;
        --cpd-color-pink-1300: #4a001c;
        --cpd-color-pink-1200: #64002f;
        --cpd-color-pink-1100: #72003a;
        --cpd-color-pink-1000: #840745;
        --cpd-color-pink-900: #92084b;
        --cpd-color-pink-800: #e00c6a;
        --cpd-color-pink-700: #f94e84;
        --cpd-color-pink-600: #ff88a6;
        --cpd-color-pink-500: #ffadc0;
        --cpd-color-pink-400: #ffd0da;
        --cpd-color-pink-300: #ffdee5;
        --cpd-color-pink-200: #ffecf0;
        --cpd-color-pink-100: #fff5f7;
        --cpd-color-fuchsia-1400: #32004a;
        --cpd-color-fuchsia-1300: #3b0053;
        --cpd-color-fuchsia-1200: #52026c;
        --cpd-color-fuchsia-1100: #5c0f76;
        --cpd-color-fuchsia-1000: #6c1785;
        --cpd-color-fuchsia-900: #781c90;
        --cpd-color-fuchsia-800: #b937c6;
        --cpd-color-fuchsia-700: #cb68d4;
        --cpd-color-fuchsia-600: #db93e1;
        --cpd-color-fuchsia-500: #e7b2ea;
        --cpd-color-fuchsia-400: #f1d2f3;
        --cpd-color-fuchsia-300: #f6dff7;
        --cpd-color-fuchsia-200: #faeefb;
        --cpd-color-fuchsia-100: #fcf5fd;
        --cpd-color-purple-1400: #1f0062;
        --cpd-color-purple-1300: #240070;
        --cpd-color-purple-1200: #360094;
        --cpd-color-purple-1100: #4200a6;
        --cpd-color-purple-1000: #4f0dba;
        --cpd-color-purple-900: #571cc4;
        --cpd-color-purple-800: #824ef9;
        --cpd-color-purple-700: #9778fe;
        --cpd-color-purple-600: #b1a0ff;
        --cpd-color-purple-500: #c5bbff;
        --cpd-color-purple-400: #ddd8ff;
        --cpd-color-purple-300: #e6e2ff;
        --cpd-color-purple-200: #f1efff;
        --cpd-color-purple-100: #f8f7ff;
        --cpd-color-blue-1400: #000c63;
        --cpd-color-blue-1300: #001569;
        --cpd-color-blue-1200: #03277b;
        --cpd-color-blue-1100: #043088;
        --cpd-color-blue-1000: #053b9a;
        --cpd-color-blue-900: #0543a7;
        --cpd-color-blue-800: #046ee8;
        --cpd-color-blue-700: #4a8ef0;
        --cpd-color-blue-600: #7eaff6;
        --cpd-color-blue-500: #a3c6fa;
        --cpd-color-blue-400: #c8ddfd;
        --cpd-color-blue-300: #d8e7fe;
        --cpd-color-blue-200: #e9f2ff;
        --cpd-color-blue-100: #f4f8ff;
        --cpd-color-cyan-1400: #00174d;
        --cpd-color-cyan-1300: #001e53;
        --cpd-color-cyan-1200: #002e64;
        --cpd-color-cyan-1100: #00376e;
        --cpd-color-cyan-1000: #00447b;
        --cpd-color-cyan-900: #004c84;
        --cpd-color-cyan-800: #007ab3;
        --cpd-color-cyan-700: #009ac3;
        --cpd-color-cyan-600: #15becf;
        --cpd-color-cyan-500: #76d1dd;
        --cpd-color-cyan-400: #b1e4eb;
        --cpd-color-cyan-300: #c7ecf0;
        --cpd-color-cyan-200: #e3f5f8;
        --cpd-color-cyan-100: #f1fafb;
        --cpd-color-green-1400: #00210f;
        --cpd-color-green-1300: #002715;
        --cpd-color-green-1200: #003723;
        --cpd-color-green-1100: #00402b;
        --cpd-color-green-1000: #004d36;
        --cpd-color-green-900: #00553d;
        --cpd-color-green-800: #008268;
        --cpd-color-green-700: #00a27c;
        --cpd-color-green-600: #0bc491;
        --cpd-color-green-500: #71d7ae;
        --cpd-color-green-400: #afe8ce;
        --cpd-color-green-300: #c6eedb;
        --cpd-color-green-200: #e3f7ed;
        --cpd-color-green-100: #f1fbf6;
        --cpd-color-lime-1400: #020;
        --cpd-color-lime-1300: #002900;
        --cpd-color-lime-1200: #003900;
        --cpd-color-lime-1100: #004200;
        --cpd-color-lime-1000: #004f00;
        --cpd-color-lime-900: #005700;
        --cpd-color-lime-800: #1f850f;
        --cpd-color-lime-700: #3aa31a;
        --cpd-color-lime-600: #54c424;
        --cpd-color-lime-500: #76db4c;
        --cpd-color-lime-400: #afeb9b;
        --cpd-color-lime-300: #c8f1ba;
        --cpd-color-lime-200: #e0f8d9;
        --cpd-color-lime-100: #f1fcee;
        --cpd-color-yellow-1400: #3f0500;
        --cpd-color-yellow-1300: #450c00;
        --cpd-color-yellow-1200: #571d00;
        --cpd-color-yellow-1100: #612600;
        --cpd-color-yellow-1000: #6e3100;
        --cpd-color-yellow-900: #773800;
        --cpd-color-yellow-800: #a76300;
        --cpd-color-yellow-700: #c38100;
        --cpd-color-yellow-600: #dea200;
        --cpd-color-yellow-500: #f1bd00;
        --cpd-color-yellow-400: #ffda49;
        --cpd-color-yellow-300: #ffe484;
        --cpd-color-yellow-200: #fff2c1;
        --cpd-color-yellow-100: #fff8e0;
        --cpd-color-orange-1400: #420000;
        --cpd-color-orange-1300: #4c0000;
        --cpd-color-orange-1200: #670000;
        --cpd-color-orange-1100: #700;
        --cpd-color-orange-1000: #890800;
        --cpd-color-orange-900: #931700;
        --cpd-color-orange-800: #c44d00;
        --cpd-color-orange-700: #e26e00;
        --cpd-color-orange-600: #f89440;
        --cpd-color-orange-500: #fdb37c;
        --cpd-color-orange-400: #ffd4b5;
        --cpd-color-orange-300: #ffdfc8;
        --cpd-color-orange-200: #ffefe4;
        --cpd-color-orange-100: #fff6ef;
        --cpd-color-red-1400: #420000;
        --cpd-color-red-1300: #4c0000;
        --cpd-color-red-1200: #670000;
        --cpd-color-red-1100: #700;
        --cpd-color-red-1000: #8b000c;
        --cpd-color-red-900: #99001a;
        --cpd-color-red-800: #e11e2a;
        --cpd-color-red-700: #ff4e49;
        --cpd-color-red-600: #ff8c81;
        --cpd-color-red-500: #ffafa5;
        --cpd-color-red-400: #ffd1ca;
        --cpd-color-red-300: #ffdfda;
        --cpd-color-red-200: #ffefec;
        --cpd-color-red-100: #fff7f6;
        --cpd-color-gray-1400: #1a1c21;
        --cpd-color-gray-1300: #1f2126;
        --cpd-color-gray-1200: #2d3034;
        --cpd-color-gray-1100: #35383d;
        --cpd-color-gray-1000: #3f4248;
        --cpd-color-gray-900: #474a51;
        --cpd-color-gray-800: #6c737e;
        --cpd-color-gray-700: #878f9b;
        --cpd-color-gray-600: #a6adb7;
        --cpd-color-gray-500: #bdc4cc;
        --cpd-color-gray-400: #d7dce3;
        --cpd-color-gray-300: #e1e6ec;
        --cpd-color-gray-200: #f0f2f5;
        --cpd-color-gray-100: #f7f9fa;
        --cpd-color-theme-bg: #fff;
      }
    }
  }
}
@layer compound {
  @media screen {
    @layer cpd-semantic {
      .cpd-theme-light-hc.cpd-theme-light-hc {
        --cpd-color-bg-subtle-secondary-level-0: var(--cpd-color-gray-300);
        --cpd-color-bg-canvas-default-level-1: var(--cpd-color-theme-bg);
      }
    }
  }
}
@layer compound {
  @media screen and (prefers-color-scheme: light) and (prefers-contrast: more) {
    @layer cpd-semantic {
      :root {
        --cpd-color-bg-subtle-secondary-level-0: var(--cpd-color-gray-300);
        --cpd-color-bg-canvas-default-level-1: var(--cpd-color-theme-bg);
      }
    }
  }
}
@layer compound {
  @media screen {
    @layer cpd-base {
      .cpd-theme-dark.cpd-theme-dark {
        --cpd-color-alpha-pink-1400: #ffebef;
        --cpd-color-alpha-pink-1300: #ffd1db;
        --cpd-color-alpha-pink-1200: #ffadc0;
        --cpd-color-alpha-pink-1100: #fe86a4;
        --cpd-color-alpha-pink-1000: rgba(255, 102, 145, 0.98);
        --cpd-color-alpha-pink-900: rgba(254, 67, 130, 0.96);
        --cpd-color-alpha-pink-800: rgba(254, 27, 121, 0.8);
        --cpd-color-alpha-pink-700: rgba(253, 18, 119, 0.58);
        --cpd-color-alpha-pink-600: rgba(251, 4, 115, 0.46);
        --cpd-color-alpha-pink-500: #6b0036;
        --cpd-color-alpha-pink-400: #570024;
        --cpd-color-alpha-pink-300: #470019;
        --cpd-color-alpha-pink-200: #3d0012;
        --cpd-color-alpha-pink-100: #38000f;
        --cpd-color-alpha-fuchsia-1400: rgba(253, 236, 254, 0.98);
        --cpd-color-alpha-fuchsia-1300: rgba(253, 224, 255, 0.95);
        --cpd-color-alpha-fuchsia-1200: rgba(250, 195, 254, 0.91);
        --cpd-color-alpha-fuchsia-1100: rgba(250, 164, 254, 0.86);
        --cpd-color-alpha-fuchsia-1000: rgba(247, 144, 254, 0.83);
        --cpd-color-alpha-fuchsia-900: rgba(241, 114, 253, 0.8);
        --cpd-color-alpha-fuchsia-800: rgba(235, 68, 253, 0.71);
        --cpd-color-alpha-fuchsia-700: rgba(216, 47, 254, 0.54);
        --cpd-color-alpha-fuchsia-600: rgba(210, 31, 255, 0.44);
        --cpd-color-alpha-fuchsia-500: rgba(202, 10, 255, 0.38);
        --cpd-color-alpha-fuchsia-400: #45005c;
        --cpd-color-alpha-fuchsia-300: #36004d;
        --cpd-color-alpha-fuchsia-200: #2d0042;
        --cpd-color-alpha-fuchsia-100: #28003d;
        --cpd-color-alpha-purple-1400: #eeebff;
        --cpd-color-alpha-purple-1300: #dfdbff;
        --cpd-color-alpha-purple-1200: #c7bdff;
        --cpd-color-alpha-purple-1100: #ab9afe;
        --cpd-color-alpha-purple-1000: rgba(162, 139, 254, 0.99);
        --cpd-color-alpha-purple-900: rgba(146, 113, 254, 0.98);
        --cpd-color-alpha-purple-800: rgba(127, 77, 255, 0.92);
        --cpd-color-alpha-purple-700: rgba(113, 43, 253, 0.76);
        --cpd-color-alpha-purple-600: rgba(105, 13, 253, 0.67);
        --cpd-color-alpha-purple-500: #3d009e;
        --cpd-color-alpha-purple-400: #2d0080;
        --cpd-color-alpha-purple-300: #22006b;
        --cpd-color-alpha-purple-200: #1d005c;
        --cpd-color-alpha-purple-100: #1a0057;
        --cpd-color-alpha-blue-1400: #e6effe;
        --cpd-color-alpha-blue-1300: rgba(205, 225, 254, 0.99);
        --cpd-color-alpha-blue-1200: rgba(163, 200, 255, 0.97);
        --cpd-color-alpha-blue-1100: rgba(124, 178, 253, 0.96);
        --cpd-color-alpha-blue-1000: rgba(98, 160, 254, 0.94);
        --cpd-color-alpha-blue-900: rgba(68, 145, 253, 0.92);
        --cpd-color-alpha-blue-800: rgba(16, 119, 254, 0.84);
        --cpd-color-alpha-blue-700: rgba(6, 101, 254, 0.64);
        --cpd-color-alpha-blue-600: rgba(1, 90, 254, 0.53);
        --cpd-color-alpha-blue-500: rgba(0, 60, 189, 0.63);
        --cpd-color-alpha-blue-400: #001e70;
        --cpd-color-alpha-blue-300: #001366;
        --cpd-color-alpha-blue-200: #00095c;
        --cpd-color-alpha-blue-100: #00055c;
        --cpd-color-alpha-cyan-1400: rgba(225, 251, 254, 0.96);
        --cpd-color-alpha-cyan-1300: rgba(201, 247, 253, 0.92);
        --cpd-color-alpha-cyan-1200: rgba(138, 241, 255, 0.85);
        --cpd-color-alpha-cyan-1100: rgba(38, 231, 253, 0.79);
        --cpd-color-alpha-cyan-1000: rgba(0, 191, 224, 0.88);
        --cpd-color-alpha-cyan-900: #0091bd;
        --cpd-color-alpha-cyan-800: rgba(0, 126, 189, 0.88);
        --cpd-color-alpha-cyan-700: #00538a;
        --cpd-color-alpha-cyan-600: #003f75;
        --cpd-color-alpha-cyan-500: #036;
        --cpd-color-alpha-cyan-400: #00265c;
        --cpd-color-alpha-cyan-300: #001b4d;
        --cpd-color-alpha-cyan-200: #001447;
        --cpd-color-alpha-cyan-100: #001142;
        --cpd-color-alpha-green-1400: rgba(226, 253, 241, 0.96);
        --cpd-color-alpha-green-1300: rgba(196, 253, 226, 0.91);
        --cpd-color-alpha-green-1200: rgba(134, 253, 206, 0.83);
        --cpd-color-alpha-green-1100: rgba(38, 253, 188, 0.74);
        --cpd-color-alpha-green-1000: rgba(27, 254, 189, 0.65);
        --cpd-color-alpha-green-900: rgba(18, 253, 190, 0.58);
        --cpd-color-alpha-green-800: #007a62;
        --cpd-color-alpha-green-700: #005c45;
        --cpd-color-alpha-green-600: #004732;
        --cpd-color-alpha-green-500: #003d29;
        --cpd-color-alpha-green-400: #002e1b;
        --cpd-color-alpha-green-300: #002412;
        --cpd-color-alpha-green-200: #001f0e;
        --cpd-color-alpha-green-100: #001f0c;
        --cpd-color-alpha-lime-1400: rgba(225, 253, 216, 0.97);
        --cpd-color-alpha-lime-1300: rgba(195, 255, 173, 0.92);
        --cpd-color-alpha-lime-1200: rgba(141, 255, 92, 0.84);
        --cpd-color-alpha-lime-1100: rgba(113, 253, 53, 0.74);
        --cpd-color-alpha-lime-1000: rgba(96, 252, 44, 0.66);
        --cpd-color-alpha-lime-900: rgba(84, 253, 38, 0.58);
        --cpd-color-alpha-lime-800: rgba(45, 253, 13, 0.45);
        --cpd-color-alpha-lime-700: #005c00;
        --cpd-color-alpha-lime-600: #004d00;
        --cpd-color-alpha-lime-500: #003d00;
        --cpd-color-alpha-lime-400: #002e00;
        --cpd-color-alpha-lime-300: #002900;
        --cpd-color-alpha-lime-200: #001f00;
        --cpd-color-alpha-lime-100: #001a00;
        --cpd-color-alpha-yellow-1400: #ffedb3;
        --cpd-color-alpha-yellow-1300: #feda58;
        --cpd-color-alpha-yellow-1200: rgba(253, 197, 13, 0.94);
        --cpd-color-alpha-yellow-1100: #dba100;
        --cpd-color-alpha-yellow-1000: #cc8b00;
        --cpd-color-alpha-yellow-900: #bd7b00;
        --cpd-color-alpha-yellow-800: #9e5c00;
        --cpd-color-alpha-yellow-700: rgba(133, 66, 0, 0.92);
        --cpd-color-alpha-yellow-600: rgba(117, 51, 0, 0.87);
        --cpd-color-alpha-yellow-500: #5c2300;
        --cpd-color-alpha-yellow-400: #4d1400;
        --cpd-color-alpha-yellow-300: #420900;
        --cpd-color-alpha-yellow-200: #380300;
        --cpd-color-alpha-yellow-100: #380000;
        --cpd-color-alpha-orange-1400: #ffeadb;
        --cpd-color-alpha-orange-1300: #ffd4b8;
        --cpd-color-alpha-orange-1200: hsla(26, 97%, 75%, 0.99);
        --cpd-color-alpha-orange-1100: rgba(253, 149, 63, 0.97);
        --cpd-color-alpha-orange-1000: rgba(254, 131, 16, 0.92);
        --cpd-color-alpha-orange-900: rgba(254, 116, 11, 0.85);
        --cpd-color-alpha-orange-800: rgba(255, 89, 0, 0.71);
        --cpd-color-alpha-orange-700: rgba(199, 40, 0, 0.74);
        --cpd-color-alpha-orange-600: #850400;
        --cpd-color-alpha-orange-500: #700000;
        --cpd-color-alpha-orange-400: #570000;
        --cpd-color-alpha-orange-300: #470000;
        --cpd-color-alpha-orange-200: #3d0000;
        --cpd-color-alpha-orange-100: #380000;
        --cpd-color-alpha-red-1400: #ffe8e6;
        --cpd-color-alpha-red-1300: #ffd3cc;
        --cpd-color-alpha-red-1200: #ffaea3;
        --cpd-color-alpha-red-1100: #ff857a;
        --cpd-color-alpha-red-1000: #ff645c;
        --cpd-color-alpha-red-900: #fd3d3a;
        --cpd-color-alpha-red-800: rgba(254, 37, 48, 0.81);
        --cpd-color-alpha-red-700: rgba(254, 11, 36, 0.6);
        --cpd-color-alpha-red-600: #850009;
        --cpd-color-alpha-red-500: #700000;
        --cpd-color-alpha-red-400: #5c0000;
        --cpd-color-alpha-red-300: #470000;
        --cpd-color-alpha-red-200: #3d0000;
        --cpd-color-alpha-red-100: #380000;
        --cpd-color-alpha-gray-1400: rgba(246, 249, 254, 0.95);
        --cpd-color-alpha-gray-1300: rgba(242, 247, 253, 0.89);
        --cpd-color-alpha-gray-1200: rgba(237, 244, 252, 0.79);
        --cpd-color-alpha-gray-1100: rgba(231, 240, 254, 0.68);
        --cpd-color-alpha-gray-1000: rgba(225, 238, 254, 0.61);
        --cpd-color-alpha-gray-900: rgba(225, 239, 254, 0.54);
        --cpd-color-alpha-gray-800: rgba(224, 237, 255, 0.41);
        --cpd-color-alpha-gray-700: rgba(231, 241, 253, 0.27);
        --cpd-color-alpha-gray-600: rgba(236, 239, 248, 0.2);
        --cpd-color-alpha-gray-500: rgba(244, 247, 250, 0.15);
        --cpd-color-alpha-gray-400: rgba(237, 231, 244, 0.1);
        --cpd-color-alpha-gray-300: rgba(233, 219, 240, 0.06);
        --cpd-color-alpha-gray-200: rgba(217, 195, 223, 0.04);
        --cpd-color-alpha-gray-100: rgba(216, 219, 223, 0.02);
        --cpd-color-pink-1400: #ffe8ed;
        --cpd-color-pink-1300: #ffd2dc;
        --cpd-color-pink-1200: #ffabbe;
        --cpd-color-pink-1100: #fe84a2;
        --cpd-color-pink-1000: #fa658f;
        --cpd-color-pink-900: #f4427d;
        --cpd-color-pink-800: #ce1865;
        --cpd-color-pink-700: #99114f;
        --cpd-color-pink-600: #7c0c41;
        --cpd-color-pink-500: #6d0036;
        --cpd-color-pink-400: #550024;
        --cpd-color-pink-300: #450018;
        --cpd-color-pink-200: #3c0012;
        --cpd-color-pink-100: #37000f;
        --cpd-color-fuchsia-1400: #f8e9f9;
        --cpd-color-fuchsia-1300: #f1d4f3;
        --cpd-color-fuchsia-1200: #e5b1e9;
        --cpd-color-fuchsia-1100: #d991de;
        --cpd-color-fuchsia-1000: #cf78d7;
        --cpd-color-fuchsia-900: #c560cf;
        --cpd-color-fuchsia-800: #aa36ba;
        --cpd-color-fuchsia-700: #7d2394;
        --cpd-color-fuchsia-600: #65177d;
        --cpd-color-fuchsia-500: #560f6f;
        --cpd-color-fuchsia-400: #46005e;
        --cpd-color-fuchsia-300: #37004e;
        --cpd-color-fuchsia-200: #2e0044;
        --cpd-color-fuchsia-100: #28003d;
        --cpd-color-purple-1400: #eeebff;
        --cpd-color-purple-1300: #dedaff;
        --cpd-color-purple-1200: #c4baff;
        --cpd-color-purple-1100: #ad9cfe;
        --cpd-color-purple-1000: #9e87fc;
        --cpd-color-purple-900: #9171f9;
        --cpd-color-purple-800: #7849ec;
        --cpd-color-purple-700: #5a27c6;
        --cpd-color-purple-600: #4a0db1;
        --cpd-color-purple-500: #3d009e;
        --cpd-color-purple-400: #2c0080;
        --cpd-color-purple-300: #22006a;
        --cpd-color-purple-200: #1c005a;
        --cpd-color-purple-100: #1a0055;
        --cpd-color-blue-1400: #e4eefe;
        --cpd-color-blue-1300: #cbdffc;
        --cpd-color-blue-1200: #a1c4f8;
        --cpd-color-blue-1100: #7aacf4;
        --cpd-color-blue-1000: #5e99f0;
        --cpd-color-blue-900: #4187eb;
        --cpd-color-blue-800: #0e67d9;
        --cpd-color-blue-700: #0b49ab;
        --cpd-color-blue-600: #083891;
        --cpd-color-blue-500: #062d80;
        --cpd-color-blue-400: #001e6f;
        --cpd-color-blue-300: #001264;
        --cpd-color-blue-200: #00095d;
        --cpd-color-blue-100: #00055a;
        --cpd-color-cyan-1400: #dbf2f5;
        --cpd-color-cyan-1300: #b8e5eb;
        --cpd-color-cyan-1200: #78d0dc;
        --cpd-color-cyan-1100: #21bacd;
        --cpd-color-cyan-1000: #02a7c6;
        --cpd-color-cyan-900: #0093be;
        --cpd-color-cyan-800: #0271aa;
        --cpd-color-cyan-700: #005188;
        --cpd-color-cyan-600: #003f75;
        --cpd-color-cyan-500: #003468;
        --cpd-color-cyan-400: #002559;
        --cpd-color-cyan-300: #001b4e;
        --cpd-color-cyan-200: #001448;
        --cpd-color-cyan-100: #014;
        --cpd-color-green-1400: #d9f4e7;
        --cpd-color-green-1300: #b5e8d1;
        --cpd-color-green-1200: #72d5ae;
        --cpd-color-green-1100: #1fc090;
        --cpd-color-green-1000: #17ac84;
        --cpd-color-green-900: #129a78;
        --cpd-color-green-800: #007a62;
        --cpd-color-green-700: #005a43;
        --cpd-color-green-600: #004832;
        --cpd-color-green-500: #003d29;
        --cpd-color-green-400: #002e1b;
        --cpd-color-green-300: #002513;
        --cpd-color-green-200: #001f0e;
        --cpd-color-green-100: #001c0b;
        --cpd-color-lime-1400: #daf6d0;
        --cpd-color-lime-1300: #b6eca3;
        --cpd-color-lime-1200: #77d94f;
        --cpd-color-lime-1100: #56c02c;
        --cpd-color-lime-1000: #47ad26;
        --cpd-color-lime-900: #389b20;
        --cpd-color-lime-800: #1d7c13;
        --cpd-color-lime-700: #005c00;
        --cpd-color-lime-600: #004a00;
        --cpd-color-lime-500: #003e00;
        --cpd-color-lime-400: #003000;
        --cpd-color-lime-300: #002600;
        --cpd-color-lime-200: #002000;
        --cpd-color-lime-100: #001b00;
        --cpd-color-yellow-1400: #ffedb1;
        --cpd-color-yellow-1300: #fedb58;
        --cpd-color-yellow-1200: #efbb0b;
        --cpd-color-yellow-1100: #db9f00;
        --cpd-color-yellow-1000: #cc8c00;
        --cpd-color-yellow-900: #bc7a00;
        --cpd-color-yellow-800: #9d5b00;
        --cpd-color-yellow-700: #7c3e02;
        --cpd-color-yellow-600: #682e03;
        --cpd-color-yellow-500: #5c2400;
        --cpd-color-yellow-400: #4c1400;
        --cpd-color-yellow-300: #410900;
        --cpd-color-yellow-200: #3a0300;
        --cpd-color-yellow-100: #360000;
        --cpd-color-orange-1400: #ffeadb;
        --cpd-color-orange-1300: #ffd5b9;
        --cpd-color-orange-1200: #fbb37e;
        --cpd-color-orange-1100: #f6913d;
        --cpd-color-orange-1000: #eb7a12;
        --cpd-color-orange-900: #da670d;
        --cpd-color-orange-800: #b94607;
        --cpd-color-orange-700: #972206;
        --cpd-color-orange-600: #830500;
        --cpd-color-orange-500: #710000;
        --cpd-color-orange-400: #580000;
        --cpd-color-orange-300: #470000;
        --cpd-color-orange-200: #3c0000;
        --cpd-color-orange-100: #380000;
        --cpd-color-red-1400: #ffe9e6;
        --cpd-color-red-1300: #ffd4cd;
        --cpd-color-red-1200: #ffaea4;
        --cpd-color-red-1100: #ff877c;
        --cpd-color-red-1000: #ff665d;
        --cpd-color-red-900: #fd3e3c;
        --cpd-color-red-800: #d1212a;
        --cpd-color-red-700: #9f0d1e;
        --cpd-color-red-600: #830009;
        --cpd-color-red-500: #710000;
        --cpd-color-red-400: #590000;
        --cpd-color-red-300: #470000;
        --cpd-color-red-200: #3e0000;
        --cpd-color-red-100: #370000;
        --cpd-color-gray-1400: #ebeef2;
        --cpd-color-gray-1300: #d9dee4;
        --cpd-color-gray-1200: #bdc3cc;
        --cpd-color-gray-1100: #a3aab4;
        --cpd-color-gray-1000: #9199a4;
        --cpd-color-gray-900: #808994;
        --cpd-color-gray-800: #656c76;
        --cpd-color-gray-700: #4a4f55;
        --cpd-color-gray-600: #3c3f44;
        --cpd-color-gray-500: #323539;
        --cpd-color-gray-400: #26282d;
        --cpd-color-gray-300: #1d1f24;
        --cpd-color-gray-200: #181a1f;
        --cpd-color-gray-100: #14171b;
        --cpd-color-theme-bg: #101317;
      }
    }
  }
}
@layer compound {
  @media screen and (prefers-color-scheme: dark) {
    @layer cpd-base {
      :root {
        --cpd-color-alpha-pink-1400: #ffebef;
        --cpd-color-alpha-pink-1300: #ffd1db;
        --cpd-color-alpha-pink-1200: #ffadc0;
        --cpd-color-alpha-pink-1100: #fe86a4;
        --cpd-color-alpha-pink-1000: rgba(255, 102, 145, 0.98);
        --cpd-color-alpha-pink-900: rgba(254, 67, 130, 0.96);
        --cpd-color-alpha-pink-800: rgba(254, 27, 121, 0.8);
        --cpd-color-alpha-pink-700: rgba(253, 18, 119, 0.58);
        --cpd-color-alpha-pink-600: rgba(251, 4, 115, 0.46);
        --cpd-color-alpha-pink-500: #6b0036;
        --cpd-color-alpha-pink-400: #570024;
        --cpd-color-alpha-pink-300: #470019;
        --cpd-color-alpha-pink-200: #3d0012;
        --cpd-color-alpha-pink-100: #38000f;
        --cpd-color-alpha-fuchsia-1400: rgba(253, 236, 254, 0.98);
        --cpd-color-alpha-fuchsia-1300: rgba(253, 224, 255, 0.95);
        --cpd-color-alpha-fuchsia-1200: rgba(250, 195, 254, 0.91);
        --cpd-color-alpha-fuchsia-1100: rgba(250, 164, 254, 0.86);
        --cpd-color-alpha-fuchsia-1000: rgba(247, 144, 254, 0.83);
        --cpd-color-alpha-fuchsia-900: rgba(241, 114, 253, 0.8);
        --cpd-color-alpha-fuchsia-800: rgba(235, 68, 253, 0.71);
        --cpd-color-alpha-fuchsia-700: rgba(216, 47, 254, 0.54);
        --cpd-color-alpha-fuchsia-600: rgba(210, 31, 255, 0.44);
        --cpd-color-alpha-fuchsia-500: rgba(202, 10, 255, 0.38);
        --cpd-color-alpha-fuchsia-400: #45005c;
        --cpd-color-alpha-fuchsia-300: #36004d;
        --cpd-color-alpha-fuchsia-200: #2d0042;
        --cpd-color-alpha-fuchsia-100: #28003d;
        --cpd-color-alpha-purple-1400: #eeebff;
        --cpd-color-alpha-purple-1300: #dfdbff;
        --cpd-color-alpha-purple-1200: #c7bdff;
        --cpd-color-alpha-purple-1100: #ab9afe;
        --cpd-color-alpha-purple-1000: rgba(162, 139, 254, 0.99);
        --cpd-color-alpha-purple-900: rgba(146, 113, 254, 0.98);
        --cpd-color-alpha-purple-800: rgba(127, 77, 255, 0.92);
        --cpd-color-alpha-purple-700: rgba(113, 43, 253, 0.76);
        --cpd-color-alpha-purple-600: rgba(105, 13, 253, 0.67);
        --cpd-color-alpha-purple-500: #3d009e;
        --cpd-color-alpha-purple-400: #2d0080;
        --cpd-color-alpha-purple-300: #22006b;
        --cpd-color-alpha-purple-200: #1d005c;
        --cpd-color-alpha-purple-100: #1a0057;
        --cpd-color-alpha-blue-1400: #e6effe;
        --cpd-color-alpha-blue-1300: rgba(205, 225, 254, 0.99);
        --cpd-color-alpha-blue-1200: rgba(163, 200, 255, 0.97);
        --cpd-color-alpha-blue-1100: rgba(124, 178, 253, 0.96);
        --cpd-color-alpha-blue-1000: rgba(98, 160, 254, 0.94);
        --cpd-color-alpha-blue-900: rgba(68, 145, 253, 0.92);
        --cpd-color-alpha-blue-800: rgba(16, 119, 254, 0.84);
        --cpd-color-alpha-blue-700: rgba(6, 101, 254, 0.64);
        --cpd-color-alpha-blue-600: rgba(1, 90, 254, 0.53);
        --cpd-color-alpha-blue-500: rgba(0, 60, 189, 0.63);
        --cpd-color-alpha-blue-400: #001e70;
        --cpd-color-alpha-blue-300: #001366;
        --cpd-color-alpha-blue-200: #00095c;
        --cpd-color-alpha-blue-100: #00055c;
        --cpd-color-alpha-cyan-1400: rgba(225, 251, 254, 0.96);
        --cpd-color-alpha-cyan-1300: rgba(201, 247, 253, 0.92);
        --cpd-color-alpha-cyan-1200: rgba(138, 241, 255, 0.85);
        --cpd-color-alpha-cyan-1100: rgba(38, 231, 253, 0.79);
        --cpd-color-alpha-cyan-1000: rgba(0, 191, 224, 0.88);
        --cpd-color-alpha-cyan-900: #0091bd;
        --cpd-color-alpha-cyan-800: rgba(0, 126, 189, 0.88);
        --cpd-color-alpha-cyan-700: #00538a;
        --cpd-color-alpha-cyan-600: #003f75;
        --cpd-color-alpha-cyan-500: #036;
        --cpd-color-alpha-cyan-400: #00265c;
        --cpd-color-alpha-cyan-300: #001b4d;
        --cpd-color-alpha-cyan-200: #001447;
        --cpd-color-alpha-cyan-100: #001142;
        --cpd-color-alpha-green-1400: rgba(226, 253, 241, 0.96);
        --cpd-color-alpha-green-1300: rgba(196, 253, 226, 0.91);
        --cpd-color-alpha-green-1200: rgba(134, 253, 206, 0.83);
        --cpd-color-alpha-green-1100: rgba(38, 253, 188, 0.74);
        --cpd-color-alpha-green-1000: rgba(27, 254, 189, 0.65);
        --cpd-color-alpha-green-900: rgba(18, 253, 190, 0.58);
        --cpd-color-alpha-green-800: #007a62;
        --cpd-color-alpha-green-700: #005c45;
        --cpd-color-alpha-green-600: #004732;
        --cpd-color-alpha-green-500: #003d29;
        --cpd-color-alpha-green-400: #002e1b;
        --cpd-color-alpha-green-300: #002412;
        --cpd-color-alpha-green-200: #001f0e;
        --cpd-color-alpha-green-100: #001f0c;
        --cpd-color-alpha-lime-1400: rgba(225, 253, 216, 0.97);
        --cpd-color-alpha-lime-1300: rgba(195, 255, 173, 0.92);
        --cpd-color-alpha-lime-1200: rgba(141, 255, 92, 0.84);
        --cpd-color-alpha-lime-1100: rgba(113, 253, 53, 0.74);
        --cpd-color-alpha-lime-1000: rgba(96, 252, 44, 0.66);
        --cpd-color-alpha-lime-900: rgba(84, 253, 38, 0.58);
        --cpd-color-alpha-lime-800: rgba(45, 253, 13, 0.45);
        --cpd-color-alpha-lime-700: #005c00;
        --cpd-color-alpha-lime-600: #004d00;
        --cpd-color-alpha-lime-500: #003d00;
        --cpd-color-alpha-lime-400: #002e00;
        --cpd-color-alpha-lime-300: #002900;
        --cpd-color-alpha-lime-200: #001f00;
        --cpd-color-alpha-lime-100: #001a00;
        --cpd-color-alpha-yellow-1400: #ffedb3;
        --cpd-color-alpha-yellow-1300: #feda58;
        --cpd-color-alpha-yellow-1200: rgba(253, 197, 13, 0.94);
        --cpd-color-alpha-yellow-1100: #dba100;
        --cpd-color-alpha-yellow-1000: #cc8b00;
        --cpd-color-alpha-yellow-900: #bd7b00;
        --cpd-color-alpha-yellow-800: #9e5c00;
        --cpd-color-alpha-yellow-700: rgba(133, 66, 0, 0.92);
        --cpd-color-alpha-yellow-600: rgba(117, 51, 0, 0.87);
        --cpd-color-alpha-yellow-500: #5c2300;
        --cpd-color-alpha-yellow-400: #4d1400;
        --cpd-color-alpha-yellow-300: #420900;
        --cpd-color-alpha-yellow-200: #380300;
        --cpd-color-alpha-yellow-100: #380000;
        --cpd-color-alpha-orange-1400: #ffeadb;
        --cpd-color-alpha-orange-1300: #ffd4b8;
        --cpd-color-alpha-orange-1200: hsla(26, 97%, 75%, 0.99);
        --cpd-color-alpha-orange-1100: rgba(253, 149, 63, 0.97);
        --cpd-color-alpha-orange-1000: rgba(254, 131, 16, 0.92);
        --cpd-color-alpha-orange-900: rgba(254, 116, 11, 0.85);
        --cpd-color-alpha-orange-800: rgba(255, 89, 0, 0.71);
        --cpd-color-alpha-orange-700: rgba(199, 40, 0, 0.74);
        --cpd-color-alpha-orange-600: #850400;
        --cpd-color-alpha-orange-500: #700000;
        --cpd-color-alpha-orange-400: #570000;
        --cpd-color-alpha-orange-300: #470000;
        --cpd-color-alpha-orange-200: #3d0000;
        --cpd-color-alpha-orange-100: #380000;
        --cpd-color-alpha-red-1400: #ffe8e6;
        --cpd-color-alpha-red-1300: #ffd3cc;
        --cpd-color-alpha-red-1200: #ffaea3;
        --cpd-color-alpha-red-1100: #ff857a;
        --cpd-color-alpha-red-1000: #ff645c;
        --cpd-color-alpha-red-900: #fd3d3a;
        --cpd-color-alpha-red-800: rgba(254, 37, 48, 0.81);
        --cpd-color-alpha-red-700: rgba(254, 11, 36, 0.6);
        --cpd-color-alpha-red-600: #850009;
        --cpd-color-alpha-red-500: #700000;
        --cpd-color-alpha-red-400: #5c0000;
        --cpd-color-alpha-red-300: #470000;
        --cpd-color-alpha-red-200: #3d0000;
        --cpd-color-alpha-red-100: #380000;
        --cpd-color-alpha-gray-1400: rgba(246, 249, 254, 0.95);
        --cpd-color-alpha-gray-1300: rgba(242, 247, 253, 0.89);
        --cpd-color-alpha-gray-1200: rgba(237, 244, 252, 0.79);
        --cpd-color-alpha-gray-1100: rgba(231, 240, 254, 0.68);
        --cpd-color-alpha-gray-1000: rgba(225, 238, 254, 0.61);
        --cpd-color-alpha-gray-900: rgba(225, 239, 254, 0.54);
        --cpd-color-alpha-gray-800: rgba(224, 237, 255, 0.41);
        --cpd-color-alpha-gray-700: rgba(231, 241, 253, 0.27);
        --cpd-color-alpha-gray-600: rgba(236, 239, 248, 0.2);
        --cpd-color-alpha-gray-500: rgba(244, 247, 250, 0.15);
        --cpd-color-alpha-gray-400: rgba(237, 231, 244, 0.1);
        --cpd-color-alpha-gray-300: rgba(233, 219, 240, 0.06);
        --cpd-color-alpha-gray-200: rgba(217, 195, 223, 0.04);
        --cpd-color-alpha-gray-100: rgba(216, 219, 223, 0.02);
        --cpd-color-pink-1400: #ffe8ed;
        --cpd-color-pink-1300: #ffd2dc;
        --cpd-color-pink-1200: #ffabbe;
        --cpd-color-pink-1100: #fe84a2;
        --cpd-color-pink-1000: #fa658f;
        --cpd-color-pink-900: #f4427d;
        --cpd-color-pink-800: #ce1865;
        --cpd-color-pink-700: #99114f;
        --cpd-color-pink-600: #7c0c41;
        --cpd-color-pink-500: #6d0036;
        --cpd-color-pink-400: #550024;
        --cpd-color-pink-300: #450018;
        --cpd-color-pink-200: #3c0012;
        --cpd-color-pink-100: #37000f;
        --cpd-color-fuchsia-1400: #f8e9f9;
        --cpd-color-fuchsia-1300: #f1d4f3;
        --cpd-color-fuchsia-1200: #e5b1e9;
        --cpd-color-fuchsia-1100: #d991de;
        --cpd-color-fuchsia-1000: #cf78d7;
        --cpd-color-fuchsia-900: #c560cf;
        --cpd-color-fuchsia-800: #aa36ba;
        --cpd-color-fuchsia-700: #7d2394;
        --cpd-color-fuchsia-600: #65177d;
        --cpd-color-fuchsia-500: #560f6f;
        --cpd-color-fuchsia-400: #46005e;
        --cpd-color-fuchsia-300: #37004e;
        --cpd-color-fuchsia-200: #2e0044;
        --cpd-color-fuchsia-100: #28003d;
        --cpd-color-purple-1400: #eeebff;
        --cpd-color-purple-1300: #dedaff;
        --cpd-color-purple-1200: #c4baff;
        --cpd-color-purple-1100: #ad9cfe;
        --cpd-color-purple-1000: #9e87fc;
        --cpd-color-purple-900: #9171f9;
        --cpd-color-purple-800: #7849ec;
        --cpd-color-purple-700: #5a27c6;
        --cpd-color-purple-600: #4a0db1;
        --cpd-color-purple-500: #3d009e;
        --cpd-color-purple-400: #2c0080;
        --cpd-color-purple-300: #22006a;
        --cpd-color-purple-200: #1c005a;
        --cpd-color-purple-100: #1a0055;
        --cpd-color-blue-1400: #e4eefe;
        --cpd-color-blue-1300: #cbdffc;
        --cpd-color-blue-1200: #a1c4f8;
        --cpd-color-blue-1100: #7aacf4;
        --cpd-color-blue-1000: #5e99f0;
        --cpd-color-blue-900: #4187eb;
        --cpd-color-blue-800: #0e67d9;
        --cpd-color-blue-700: #0b49ab;
        --cpd-color-blue-600: #083891;
        --cpd-color-blue-500: #062d80;
        --cpd-color-blue-400: #001e6f;
        --cpd-color-blue-300: #001264;
        --cpd-color-blue-200: #00095d;
        --cpd-color-blue-100: #00055a;
        --cpd-color-cyan-1400: #dbf2f5;
        --cpd-color-cyan-1300: #b8e5eb;
        --cpd-color-cyan-1200: #78d0dc;
        --cpd-color-cyan-1100: #21bacd;
        --cpd-color-cyan-1000: #02a7c6;
        --cpd-color-cyan-900: #0093be;
        --cpd-color-cyan-800: #0271aa;
        --cpd-color-cyan-700: #005188;
        --cpd-color-cyan-600: #003f75;
        --cpd-color-cyan-500: #003468;
        --cpd-color-cyan-400: #002559;
        --cpd-color-cyan-300: #001b4e;
        --cpd-color-cyan-200: #001448;
        --cpd-color-cyan-100: #014;
        --cpd-color-green-1400: #d9f4e7;
        --cpd-color-green-1300: #b5e8d1;
        --cpd-color-green-1200: #72d5ae;
        --cpd-color-green-1100: #1fc090;
        --cpd-color-green-1000: #17ac84;
        --cpd-color-green-900: #129a78;
        --cpd-color-green-800: #007a62;
        --cpd-color-green-700: #005a43;
        --cpd-color-green-600: #004832;
        --cpd-color-green-500: #003d29;
        --cpd-color-green-400: #002e1b;
        --cpd-color-green-300: #002513;
        --cpd-color-green-200: #001f0e;
        --cpd-color-green-100: #001c0b;
        --cpd-color-lime-1400: #daf6d0;
        --cpd-color-lime-1300: #b6eca3;
        --cpd-color-lime-1200: #77d94f;
        --cpd-color-lime-1100: #56c02c;
        --cpd-color-lime-1000: #47ad26;
        --cpd-color-lime-900: #389b20;
        --cpd-color-lime-800: #1d7c13;
        --cpd-color-lime-700: #005c00;
        --cpd-color-lime-600: #004a00;
        --cpd-color-lime-500: #003e00;
        --cpd-color-lime-400: #003000;
        --cpd-color-lime-300: #002600;
        --cpd-color-lime-200: #002000;
        --cpd-color-lime-100: #001b00;
        --cpd-color-yellow-1400: #ffedb1;
        --cpd-color-yellow-1300: #fedb58;
        --cpd-color-yellow-1200: #efbb0b;
        --cpd-color-yellow-1100: #db9f00;
        --cpd-color-yellow-1000: #cc8c00;
        --cpd-color-yellow-900: #bc7a00;
        --cpd-color-yellow-800: #9d5b00;
        --cpd-color-yellow-700: #7c3e02;
        --cpd-color-yellow-600: #682e03;
        --cpd-color-yellow-500: #5c2400;
        --cpd-color-yellow-400: #4c1400;
        --cpd-color-yellow-300: #410900;
        --cpd-color-yellow-200: #3a0300;
        --cpd-color-yellow-100: #360000;
        --cpd-color-orange-1400: #ffeadb;
        --cpd-color-orange-1300: #ffd5b9;
        --cpd-color-orange-1200: #fbb37e;
        --cpd-color-orange-1100: #f6913d;
        --cpd-color-orange-1000: #eb7a12;
        --cpd-color-orange-900: #da670d;
        --cpd-color-orange-800: #b94607;
        --cpd-color-orange-700: #972206;
        --cpd-color-orange-600: #830500;
        --cpd-color-orange-500: #710000;
        --cpd-color-orange-400: #580000;
        --cpd-color-orange-300: #470000;
        --cpd-color-orange-200: #3c0000;
        --cpd-color-orange-100: #380000;
        --cpd-color-red-1400: #ffe9e6;
        --cpd-color-red-1300: #ffd4cd;
        --cpd-color-red-1200: #ffaea4;
        --cpd-color-red-1100: #ff877c;
        --cpd-color-red-1000: #ff665d;
        --cpd-color-red-900: #fd3e3c;
        --cpd-color-red-800: #d1212a;
        --cpd-color-red-700: #9f0d1e;
        --cpd-color-red-600: #830009;
        --cpd-color-red-500: #710000;
        --cpd-color-red-400: #590000;
        --cpd-color-red-300: #470000;
        --cpd-color-red-200: #3e0000;
        --cpd-color-red-100: #370000;
        --cpd-color-gray-1400: #ebeef2;
        --cpd-color-gray-1300: #d9dee4;
        --cpd-color-gray-1200: #bdc3cc;
        --cpd-color-gray-1100: #a3aab4;
        --cpd-color-gray-1000: #9199a4;
        --cpd-color-gray-900: #808994;
        --cpd-color-gray-800: #656c76;
        --cpd-color-gray-700: #4a4f55;
        --cpd-color-gray-600: #3c3f44;
        --cpd-color-gray-500: #323539;
        --cpd-color-gray-400: #26282d;
        --cpd-color-gray-300: #1d1f24;
        --cpd-color-gray-200: #181a1f;
        --cpd-color-gray-100: #14171b;
        --cpd-color-theme-bg: #101317;
      }
    }
  }
}
@layer compound {
  @media screen {
    @layer cpd-semantic {
      .cpd-theme-dark.cpd-theme-dark {
        --cpd-color-bg-subtle-secondary-level-0: var(--cpd-color-theme-bg);
        --cpd-color-bg-canvas-default-level-1: var(--cpd-color-gray-300);
      }
    }
  }
}
@layer compound {
  /* @media screen and (prefers-color-scheme: dark) {
    @layer cpd-semantic {
      :root {
        --cpd-color-bg-subtle-secondary-level-0: var(--cpd-color-theme-bg);
        --cpd-color-bg-canvas-default-level-1: var(--cpd-color-gray-300);
      }
    }
  } */
}
@layer compound {
  @media screen {
    @layer cpd-base {
      .cpd-theme-dark-hc.cpd-theme-dark-hc {
        --cpd-color-alpha-pink-1400: #fff0f3;
        --cpd-color-alpha-pink-1300: #ffebef;
        --cpd-color-alpha-pink-1200: #ffccd7;
        --cpd-color-alpha-pink-1100: #ffbdcb;
        --cpd-color-alpha-pink-1000: #ffa3b9;
        --cpd-color-alpha-pink-900: #ff94ad;
        --cpd-color-alpha-pink-800: rgba(253, 43, 120, 0.95);
        --cpd-color-alpha-pink-700: rgba(254, 27, 121, 0.76);
        --cpd-color-alpha-pink-600: rgba(253, 18, 119, 0.58);
        --cpd-color-alpha-pink-500: rgba(251, 4, 115, 0.46);
        --cpd-color-alpha-pink-400: #61002d;
        --cpd-color-alpha-pink-300: #570024;
        --cpd-color-alpha-pink-200: #470019;
        --cpd-color-alpha-pink-100: #3d0012;
        --cpd-color-alpha-fuchsia-1400: rgba(253, 242, 253, 0.99);
        --cpd-color-alpha-fuchsia-1300: rgba(253, 236, 254, 0.98);
        --cpd-color-alpha-fuchsia-1200: rgba(252, 215, 254, 0.95);
        --cpd-color-alpha-fuchsia-1100: rgba(250, 206, 253, 0.93);
        --cpd-color-alpha-fuchsia-1000: rgba(250, 190, 254, 0.9);
        --cpd-color-alpha-fuchsia-900: rgba(249, 179, 255, 0.88);
        --cpd-color-alpha-fuchsia-800: rgba(244, 103, 254, 0.78);
        --cpd-color-alpha-fuchsia-700: rgba(230, 64, 252, 0.68);
        --cpd-color-alpha-fuchsia-600: rgba(216, 47, 254, 0.54);
        --cpd-color-alpha-fuchsia-500: rgba(210, 31, 255, 0.44);
        --cpd-color-alpha-fuchsia-400: rgba(90, 0, 117, 0.85);
        --cpd-color-alpha-fuchsia-300: #45005c;
        --cpd-color-alpha-fuchsia-200: #36004d;
        --cpd-color-alpha-fuchsia-100: #2d0042;
        --cpd-color-alpha-purple-1400: #f7f5ff;
        --cpd-color-alpha-purple-1300: #eeebff;
        --cpd-color-alpha-purple-1200: #dbd6ff;
        --cpd-color-alpha-purple-1100: #cec7ff;
        --cpd-color-alpha-purple-1000: #c2b8ff;
        --cpd-color-alpha-purple-900: #b7a8ff;
        --cpd-color-alpha-purple-800: rgba(144, 107, 255, 0.97);
        --cpd-color-alpha-purple-700: rgba(127, 73, 253, 0.9);
        --cpd-color-alpha-purple-600: rgba(113, 43, 253, 0.76);
        --cpd-color-alpha-purple-500: rgba(105, 13, 253, 0.67);
        --cpd-color-alpha-purple-400: #34008f;
        --cpd-color-alpha-purple-300: #2d0080;
        --cpd-color-alpha-purple-200: #22006b;
        --cpd-color-alpha-purple-100: #1d005c;
        --cpd-color-alpha-blue-1400: #f1f6fe;
        --cpd-color-alpha-blue-1300: #e6effe;
        --cpd-color-alpha-blue-1200: rgba(200, 222, 254, 0.99);
        --cpd-color-alpha-blue-1100: rgba(184, 212, 255, 0.98);
        --cpd-color-alpha-blue-1000: rgba(158, 197, 255, 0.97);
        --cpd-color-alpha-blue-900: rgba(139, 185, 253, 0.97);
        --cpd-color-alpha-blue-800: rgba(52, 136, 254, 0.91);
        --cpd-color-alpha-blue-700: rgba(13, 113, 253, 0.81);
        --cpd-color-alpha-blue-600: rgba(6, 101, 254, 0.64);
        --cpd-color-alpha-blue-500: rgba(1, 90, 254, 0.53);
        --cpd-color-alpha-blue-400: rgba(0, 43, 143, 0.82);
        --cpd-color-alpha-blue-300: #001e70;
        --cpd-color-alpha-blue-200: #001366;
        --cpd-color-alpha-blue-100: #00095c;
        --cpd-color-alpha-cyan-1400: rgba(241, 253, 254, 0.98);
        --cpd-color-alpha-cyan-1300: rgba(225, 251, 254, 0.96);
        --cpd-color-alpha-cyan-1200: rgba(190, 245, 254, 0.91);
        --cpd-color-alpha-cyan-1100: rgba(164, 244, 254, 0.88);
        --cpd-color-alpha-cyan-1000: rgba(123, 239, 254, 0.84);
        --cpd-color-alpha-cyan-900: rgba(82, 237, 254, 0.81);
        --cpd-color-alpha-cyan-800: #008ebd;
        --cpd-color-alpha-cyan-700: #006da3;
        --cpd-color-alpha-cyan-600: #00538a;
        --cpd-color-alpha-cyan-500: #003f75;
        --cpd-color-alpha-cyan-400: #002d61;
        --cpd-color-alpha-cyan-300: #00265c;
        --cpd-color-alpha-cyan-200: #001b4d;
        --cpd-color-alpha-cyan-100: #001447;
        --cpd-color-alpha-green-1400: rgba(237, 253, 245, 0.98);
        --cpd-color-alpha-green-1300: rgba(226, 253, 241, 0.96);
        --cpd-color-alpha-green-1200: rgba(191, 253, 225, 0.9);
        --cpd-color-alpha-green-1100: rgba(164, 254, 215, 0.86);
        --cpd-color-alpha-green-1000: rgba(117, 255, 200, 0.81);
        --cpd-color-alpha-green-900: rgba(64, 252, 186, 0.78);
        --cpd-color-alpha-green-800: rgba(18, 253, 194, 0.54);
        --cpd-color-alpha-green-700: #00755e;
        --cpd-color-alpha-green-600: #005c45;
        --cpd-color-alpha-green-500: #004732;
        --cpd-color-alpha-green-400: #003824;
        --cpd-color-alpha-green-300: #002e1b;
        --cpd-color-alpha-green-200: #002412;
        --cpd-color-alpha-green-100: #001f0e;
        --cpd-color-alpha-lime-1400: rgba(237, 254, 231, 0.98);
        --cpd-color-alpha-lime-1300: rgba(225, 253, 216, 0.97);
        --cpd-color-alpha-lime-1200: rgba(193, 254, 169, 0.91);
        --cpd-color-alpha-lime-1100: rgba(164, 253, 129, 0.88);
        --cpd-color-alpha-lime-1000: rgba(123, 254, 62, 0.83);
        --cpd-color-alpha-lime-900: rgba(116, 254, 52, 0.78);
        --cpd-color-alpha-lime-800: rgba(77, 254, 37, 0.55);
        --cpd-color-alpha-lime-700: rgba(35, 255, 10, 0.42);
        --cpd-color-alpha-lime-600: #005c00;
        --cpd-color-alpha-lime-500: #004d00;
        --cpd-color-alpha-lime-400: #003800;
        --cpd-color-alpha-lime-300: #002e00;
        --cpd-color-alpha-lime-200: #002900;
        --cpd-color-alpha-lime-100: #001f00;
        --cpd-color-alpha-yellow-1400: #fff4d1;
        --cpd-color-alpha-yellow-1300: #ffedb3;
        --cpd-color-alpha-yellow-1200: #fed634;
        --cpd-color-alpha-yellow-1100: rgba(254, 207, 22, 0.97);
        --cpd-color-alpha-yellow-1000: rgba(254, 196, 6, 0.92);
        --cpd-color-alpha-yellow-900: #e6ac00;
        --cpd-color-alpha-yellow-800: #b37100;
        --cpd-color-alpha-yellow-700: #995700;
        --cpd-color-alpha-yellow-600: rgba(133, 66, 0, 0.92);
        --cpd-color-alpha-yellow-500: rgba(117, 51, 0, 0.87);
        --cpd-color-alpha-yellow-400: #571e00;
        --cpd-color-alpha-yellow-300: #4d1400;
        --cpd-color-alpha-yellow-200: #420900;
        --cpd-color-alpha-yellow-100: #380300;
        --cpd-color-alpha-orange-1400: #fff2eb;
        --cpd-color-alpha-orange-1300: #ffeadb;
        --cpd-color-alpha-orange-1200: #fed1b3;
        --cpd-color-alpha-orange-1100: #fdc196;
        --cpd-color-alpha-orange-1000: rgba(255, 177, 117, 0.98);
        --cpd-color-alpha-orange-900: rgba(253, 160, 88, 0.98);
        --cpd-color-alpha-orange-800: rgba(254, 114, 6, 0.81);
        --cpd-color-alpha-orange-700: rgba(250, 83, 0, 0.7);
        --cpd-color-alpha-orange-600: rgba(199, 40, 0, 0.74);
        --cpd-color-alpha-orange-500: #850400;
        --cpd-color-alpha-orange-400: #600;
        --cpd-color-alpha-orange-300: #570000;
        --cpd-color-alpha-orange-200: #470000;
        --cpd-color-alpha-orange-100: #3d0000;
        --cpd-color-alpha-red-1400: #fff3f0;
        --cpd-color-alpha-red-1300: #ffe8e6;
        --cpd-color-alpha-red-1200: #ffcec7;
        --cpd-color-alpha-red-1100: #ffbfb8;
        --cpd-color-alpha-red-1000: #ffa89e;
        --cpd-color-alpha-red-900: #ff988f;
        --cpd-color-alpha-red-800: rgba(255, 46, 49, 0.96);
        --cpd-color-alpha-red-700: rgba(255, 36, 47, 0.77);
        --cpd-color-alpha-red-600: rgba(254, 11, 36, 0.6);
        --cpd-color-alpha-red-500: #850009;
        --cpd-color-alpha-red-400: #600;
        --cpd-color-alpha-red-300: #5c0000;
        --cpd-color-alpha-red-200: #470000;
        --cpd-color-alpha-red-100: #3d0000;
        --cpd-color-alpha-gray-1400: rgba(251, 253, 254, 0.97);
        --cpd-color-alpha-gray-1300: rgba(246, 249, 254, 0.95);
        --cpd-color-alpha-gray-1200: rgba(241, 246, 253, 0.88);
        --cpd-color-alpha-gray-1100: rgba(240, 247, 255, 0.82);
        --cpd-color-alpha-gray-1000: rgba(240, 247, 255, 0.76);
        --cpd-color-alpha-gray-900: rgba(236, 244, 254, 0.72);
        --cpd-color-alpha-gray-800: rgba(220, 234, 254, 0.51);
        --cpd-color-alpha-gray-700: rgba(223, 235, 251, 0.39);
        --cpd-color-alpha-gray-600: rgba(231, 241, 253, 0.27);
        --cpd-color-alpha-gray-500: rgba(236, 239, 248, 0.2);
        --cpd-color-alpha-gray-400: rgba(225, 228, 239, 0.13);
        --cpd-color-alpha-gray-300: rgba(237, 231, 244, 0.1);
        --cpd-color-alpha-gray-200: rgba(233, 219, 240, 0.06);
        --cpd-color-alpha-gray-100: rgba(217, 195, 223, 0.04);
        --cpd-color-pink-1400: #fff1f4;
        --cpd-color-pink-1300: #ffe8ed;
        --cpd-color-pink-1200: #ffccd7;
        --cpd-color-pink-1100: #ffbbca;
        --cpd-color-pink-1000: #ffa4b9;
        --cpd-color-pink-900: #ff92ac;
        --cpd-color-pink-800: #f12c75;
        --cpd-color-pink-700: #c51761;
        --cpd-color-pink-600: #99114f;
        --cpd-color-pink-500: #7c0c41;
        --cpd-color-pink-400: #61002d;
        --cpd-color-pink-300: #550024;
        --cpd-color-pink-200: #450018;
        --cpd-color-pink-100: #3c0012;
        --cpd-color-fuchsia-1400: #fbf1fb;
        --cpd-color-fuchsia-1300: #f8e9f9;
        --cpd-color-fuchsia-1200: #f0cff2;
        --cpd-color-fuchsia-1100: #eac0ed;
        --cpd-color-fuchsia-1000: #e3abe7;
        --cpd-color-fuchsia-900: #dd9de3;
        --cpd-color-fuchsia-800: #c153cb;
        --cpd-color-fuchsia-700: #a233b3;
        --cpd-color-fuchsia-600: #7d2394;
        --cpd-color-fuchsia-500: #65177d;
        --cpd-color-fuchsia-400: #4f0368;
        --cpd-color-fuchsia-300: #46005e;
        --cpd-color-fuchsia-200: #37004e;
        --cpd-color-fuchsia-100: #2e0044;
        --cpd-color-purple-1400: #f5f3ff;
        --cpd-color-purple-1300: #eeebff;
        --cpd-color-purple-1200: #dad5ff;
        --cpd-color-purple-1100: #cec7ff;
        --cpd-color-purple-1000: #c0b5ff;
        --cpd-color-purple-900: #b6a7ff;
        --cpd-color-purple-800: #8b66f8;
        --cpd-color-purple-700: #7343e6;
        --cpd-color-purple-600: #5a27c6;
        --cpd-color-purple-500: #4a0db1;
        --cpd-color-purple-400: #350090;
        --cpd-color-purple-300: #2c0080;
        --cpd-color-purple-200: #22006a;
        --cpd-color-purple-100: #1c005a;
        --cpd-color-blue-1400: #eff5fe;
        --cpd-color-blue-1300: #e4eefe;
        --cpd-color-blue-1200: #c5dbfc;
        --cpd-color-blue-1100: #b2cffa;
        --cpd-color-blue-1000: #9ac0f8;
        --cpd-color-blue-900: #89b5f6;
        --cpd-color-blue-800: #337fe9;
        --cpd-color-blue-700: #0e61d1;
        --cpd-color-blue-600: #0b49ab;
        --cpd-color-blue-500: #083891;
        --cpd-color-blue-400: #032677;
        --cpd-color-blue-300: #001e6f;
        --cpd-color-blue-200: #001264;
        --cpd-color-blue-100: #00095d;
        --cpd-color-cyan-1400: #eaf7f9;
        --cpd-color-cyan-1300: #dbf2f5;
        --cpd-color-cyan-1200: #afe2e9;
        --cpd-color-cyan-1100: #93d9e2;
        --cpd-color-cyan-1000: #6bccd9;
        --cpd-color-cyan-900: #46c3d2;
        --cpd-color-cyan-800: #008aba;
        --cpd-color-cyan-700: #006ca4;
        --cpd-color-cyan-600: #005188;
        --cpd-color-cyan-500: #003f75;
        --cpd-color-cyan-400: #002d61;
        --cpd-color-cyan-300: #002559;
        --cpd-color-cyan-200: #001b4e;
        --cpd-color-cyan-100: #001448;
        --cpd-color-green-1400: #e9f8f1;
        --cpd-color-green-1300: #d9f4e7;
        --cpd-color-green-1200: #ace6cc;
        --cpd-color-green-1100: #8fddbc;
        --cpd-color-green-1000: #61d2a6;
        --cpd-color-green-900: #37c998;
        --cpd-color-green-800: #109173;
        --cpd-color-green-700: #00745c;
        --cpd-color-green-600: #005a43;
        --cpd-color-green-500: #004832;
        --cpd-color-green-400: #003622;
        --cpd-color-green-300: #002e1b;
        --cpd-color-green-200: #002513;
        --cpd-color-green-100: #001f0e;
        --cpd-color-lime-1400: #e9f9e3;
        --cpd-color-lime-1300: #daf6d0;
        --cpd-color-lime-1200: #afe99a;
        --cpd-color-lime-1100: #92e175;
        --cpd-color-lime-1000: #6ad639;
        --cpd-color-lime-900: #5eca2f;
        --cpd-color-lime-800: #31941d;
        --cpd-color-lime-700: #187611;
        --cpd-color-lime-600: #005c00;
        --cpd-color-lime-500: #004a00;
        --cpd-color-lime-400: #003700;
        --cpd-color-lime-300: #003000;
        --cpd-color-lime-200: #002600;
        --cpd-color-lime-100: #002000;
        --cpd-color-yellow-1400: #fff4d0;
        --cpd-color-yellow-1300: #ffedb1;
        --cpd-color-yellow-1200: #fed632;
        --cpd-color-yellow-1100: #f7c816;
        --cpd-color-yellow-1000: #ebb607;
        --cpd-color-yellow-900: #e3aa00;
        --cpd-color-yellow-800: #b47200;
        --cpd-color-yellow-700: #985600;
        --cpd-color-yellow-600: #7c3e02;
        --cpd-color-yellow-500: #682e03;
        --cpd-color-yellow-400: #541d00;
        --cpd-color-yellow-300: #4c1400;
        --cpd-color-yellow-200: #410900;
        --cpd-color-yellow-100: #3a0300;
        --cpd-color-orange-1400: #fff2ea;
        --cpd-color-orange-1300: #ffeadb;
        --cpd-color-orange-1200: #fed0b1;
        --cpd-color-orange-1100: #fdc197;
        --cpd-color-orange-1000: #faad73;
        --cpd-color-orange-900: #f89d58;
        --cpd-color-orange-800: #d15f0b;
        --cpd-color-orange-700: #b44007;
        --cpd-color-orange-600: #972206;
        --cpd-color-orange-500: #830500;
        --cpd-color-orange-400: #650000;
        --cpd-color-orange-300: #580000;
        --cpd-color-orange-200: #470000;
        --cpd-color-orange-100: #3c0000;
        --cpd-color-red-1400: #fff2ef;
        --cpd-color-red-1300: #ffe9e6;
        --cpd-color-red-1200: #ffcfc8;
        --cpd-color-red-1100: #ffbdb5;
        --cpd-color-red-1000: #ffa79d;
        --cpd-color-red-900: #ff968c;
        --cpd-color-red-800: #f52f33;
        --cpd-color-red-700: #c81e28;
        --cpd-color-red-600: #9f0d1e;
        --cpd-color-red-500: #830009;
        --cpd-color-red-400: #640000;
        --cpd-color-red-300: #590000;
        --cpd-color-red-200: #470000;
        --cpd-color-red-100: #3e0000;
        --cpd-color-gray-1400: #f2f5f7;
        --cpd-color-gray-1300: #ebeef2;
        --cpd-color-gray-1200: #d5dae1;
        --cpd-color-gray-1100: #c8ced5;
        --cpd-color-gray-1000: #b8bfc7;
        --cpd-color-gray-900: #acb4bd;
        --cpd-color-gray-800: #79818d;
        --cpd-color-gray-700: #606770;
        --cpd-color-gray-600: #4a4f55;
        --cpd-color-gray-500: #3c3f44;
        --cpd-color-gray-400: #2b2e33;
        --cpd-color-gray-300: #26282d;
        --cpd-color-gray-200: #1d1f24;
        --cpd-color-gray-100: #181a1f;
        --cpd-color-theme-bg: #101317;
      }
    }
  }
}
@layer compound {
  @media screen and (prefers-color-scheme: dark) and (prefers-contrast: more) {
    @layer cpd-base {
      :root {
        --cpd-color-alpha-pink-1400: #fff0f3;
        --cpd-color-alpha-pink-1300: #ffebef;
        --cpd-color-alpha-pink-1200: #ffccd7;
        --cpd-color-alpha-pink-1100: #ffbdcb;
        --cpd-color-alpha-pink-1000: #ffa3b9;
        --cpd-color-alpha-pink-900: #ff94ad;
        --cpd-color-alpha-pink-800: rgba(253, 43, 120, 0.95);
        --cpd-color-alpha-pink-700: rgba(254, 27, 121, 0.76);
        --cpd-color-alpha-pink-600: rgba(253, 18, 119, 0.58);
        --cpd-color-alpha-pink-500: rgba(251, 4, 115, 0.46);
        --cpd-color-alpha-pink-400: #61002d;
        --cpd-color-alpha-pink-300: #570024;
        --cpd-color-alpha-pink-200: #470019;
        --cpd-color-alpha-pink-100: #3d0012;
        --cpd-color-alpha-fuchsia-1400: rgba(253, 242, 253, 0.99);
        --cpd-color-alpha-fuchsia-1300: rgba(253, 236, 254, 0.98);
        --cpd-color-alpha-fuchsia-1200: rgba(252, 215, 254, 0.95);
        --cpd-color-alpha-fuchsia-1100: rgba(250, 206, 253, 0.93);
        --cpd-color-alpha-fuchsia-1000: rgba(250, 190, 254, 0.9);
        --cpd-color-alpha-fuchsia-900: rgba(249, 179, 255, 0.88);
        --cpd-color-alpha-fuchsia-800: rgba(244, 103, 254, 0.78);
        --cpd-color-alpha-fuchsia-700: rgba(230, 64, 252, 0.68);
        --cpd-color-alpha-fuchsia-600: rgba(216, 47, 254, 0.54);
        --cpd-color-alpha-fuchsia-500: rgba(210, 31, 255, 0.44);
        --cpd-color-alpha-fuchsia-400: rgba(90, 0, 117, 0.85);
        --cpd-color-alpha-fuchsia-300: #45005c;
        --cpd-color-alpha-fuchsia-200: #36004d;
        --cpd-color-alpha-fuchsia-100: #2d0042;
        --cpd-color-alpha-purple-1400: #f7f5ff;
        --cpd-color-alpha-purple-1300: #eeebff;
        --cpd-color-alpha-purple-1200: #dbd6ff;
        --cpd-color-alpha-purple-1100: #cec7ff;
        --cpd-color-alpha-purple-1000: #c2b8ff;
        --cpd-color-alpha-purple-900: #b7a8ff;
        --cpd-color-alpha-purple-800: rgba(144, 107, 255, 0.97);
        --cpd-color-alpha-purple-700: rgba(127, 73, 253, 0.9);
        --cpd-color-alpha-purple-600: rgba(113, 43, 253, 0.76);
        --cpd-color-alpha-purple-500: rgba(105, 13, 253, 0.67);
        --cpd-color-alpha-purple-400: #34008f;
        --cpd-color-alpha-purple-300: #2d0080;
        --cpd-color-alpha-purple-200: #22006b;
        --cpd-color-alpha-purple-100: #1d005c;
        --cpd-color-alpha-blue-1400: #f1f6fe;
        --cpd-color-alpha-blue-1300: #e6effe;
        --cpd-color-alpha-blue-1200: rgba(200, 222, 254, 0.99);
        --cpd-color-alpha-blue-1100: rgba(184, 212, 255, 0.98);
        --cpd-color-alpha-blue-1000: rgba(158, 197, 255, 0.97);
        --cpd-color-alpha-blue-900: rgba(139, 185, 253, 0.97);
        --cpd-color-alpha-blue-800: rgba(52, 136, 254, 0.91);
        --cpd-color-alpha-blue-700: rgba(13, 113, 253, 0.81);
        --cpd-color-alpha-blue-600: rgba(6, 101, 254, 0.64);
        --cpd-color-alpha-blue-500: rgba(1, 90, 254, 0.53);
        --cpd-color-alpha-blue-400: rgba(0, 43, 143, 0.82);
        --cpd-color-alpha-blue-300: #001e70;
        --cpd-color-alpha-blue-200: #001366;
        --cpd-color-alpha-blue-100: #00095c;
        --cpd-color-alpha-cyan-1400: rgba(241, 253, 254, 0.98);
        --cpd-color-alpha-cyan-1300: rgba(225, 251, 254, 0.96);
        --cpd-color-alpha-cyan-1200: rgba(190, 245, 254, 0.91);
        --cpd-color-alpha-cyan-1100: rgba(164, 244, 254, 0.88);
        --cpd-color-alpha-cyan-1000: rgba(123, 239, 254, 0.84);
        --cpd-color-alpha-cyan-900: rgba(82, 237, 254, 0.81);
        --cpd-color-alpha-cyan-800: #008ebd;
        --cpd-color-alpha-cyan-700: #006da3;
        --cpd-color-alpha-cyan-600: #00538a;
        --cpd-color-alpha-cyan-500: #003f75;
        --cpd-color-alpha-cyan-400: #002d61;
        --cpd-color-alpha-cyan-300: #00265c;
        --cpd-color-alpha-cyan-200: #001b4d;
        --cpd-color-alpha-cyan-100: #001447;
        --cpd-color-alpha-green-1400: rgba(237, 253, 245, 0.98);
        --cpd-color-alpha-green-1300: rgba(226, 253, 241, 0.96);
        --cpd-color-alpha-green-1200: rgba(191, 253, 225, 0.9);
        --cpd-color-alpha-green-1100: rgba(164, 254, 215, 0.86);
        --cpd-color-alpha-green-1000: rgba(117, 255, 200, 0.81);
        --cpd-color-alpha-green-900: rgba(64, 252, 186, 0.78);
        --cpd-color-alpha-green-800: rgba(18, 253, 194, 0.54);
        --cpd-color-alpha-green-700: #00755e;
        --cpd-color-alpha-green-600: #005c45;
        --cpd-color-alpha-green-500: #004732;
        --cpd-color-alpha-green-400: #003824;
        --cpd-color-alpha-green-300: #002e1b;
        --cpd-color-alpha-green-200: #002412;
        --cpd-color-alpha-green-100: #001f0e;
        --cpd-color-alpha-lime-1400: rgba(237, 254, 231, 0.98);
        --cpd-color-alpha-lime-1300: rgba(225, 253, 216, 0.97);
        --cpd-color-alpha-lime-1200: rgba(193, 254, 169, 0.91);
        --cpd-color-alpha-lime-1100: rgba(164, 253, 129, 0.88);
        --cpd-color-alpha-lime-1000: rgba(123, 254, 62, 0.83);
        --cpd-color-alpha-lime-900: rgba(116, 254, 52, 0.78);
        --cpd-color-alpha-lime-800: rgba(77, 254, 37, 0.55);
        --cpd-color-alpha-lime-700: rgba(35, 255, 10, 0.42);
        --cpd-color-alpha-lime-600: #005c00;
        --cpd-color-alpha-lime-500: #004d00;
        --cpd-color-alpha-lime-400: #003800;
        --cpd-color-alpha-lime-300: #002e00;
        --cpd-color-alpha-lime-200: #002900;
        --cpd-color-alpha-lime-100: #001f00;
        --cpd-color-alpha-yellow-1400: #fff4d1;
        --cpd-color-alpha-yellow-1300: #ffedb3;
        --cpd-color-alpha-yellow-1200: #fed634;
        --cpd-color-alpha-yellow-1100: rgba(254, 207, 22, 0.97);
        --cpd-color-alpha-yellow-1000: rgba(254, 196, 6, 0.92);
        --cpd-color-alpha-yellow-900: #e6ac00;
        --cpd-color-alpha-yellow-800: #b37100;
        --cpd-color-alpha-yellow-700: #995700;
        --cpd-color-alpha-yellow-600: rgba(133, 66, 0, 0.92);
        --cpd-color-alpha-yellow-500: rgba(117, 51, 0, 0.87);
        --cpd-color-alpha-yellow-400: #571e00;
        --cpd-color-alpha-yellow-300: #4d1400;
        --cpd-color-alpha-yellow-200: #420900;
        --cpd-color-alpha-yellow-100: #380300;
        --cpd-color-alpha-orange-1400: #fff2eb;
        --cpd-color-alpha-orange-1300: #ffeadb;
        --cpd-color-alpha-orange-1200: #fed1b3;
        --cpd-color-alpha-orange-1100: #fdc196;
        --cpd-color-alpha-orange-1000: rgba(255, 177, 117, 0.98);
        --cpd-color-alpha-orange-900: rgba(253, 160, 88, 0.98);
        --cpd-color-alpha-orange-800: rgba(254, 114, 6, 0.81);
        --cpd-color-alpha-orange-700: rgba(250, 83, 0, 0.7);
        --cpd-color-alpha-orange-600: rgba(199, 40, 0, 0.74);
        --cpd-color-alpha-orange-500: #850400;
        --cpd-color-alpha-orange-400: #600;
        --cpd-color-alpha-orange-300: #570000;
        --cpd-color-alpha-orange-200: #470000;
        --cpd-color-alpha-orange-100: #3d0000;
        --cpd-color-alpha-red-1400: #fff3f0;
        --cpd-color-alpha-red-1300: #ffe8e6;
        --cpd-color-alpha-red-1200: #ffcec7;
        --cpd-color-alpha-red-1100: #ffbfb8;
        --cpd-color-alpha-red-1000: #ffa89e;
        --cpd-color-alpha-red-900: #ff988f;
        --cpd-color-alpha-red-800: rgba(255, 46, 49, 0.96);
        --cpd-color-alpha-red-700: rgba(255, 36, 47, 0.77);
        --cpd-color-alpha-red-600: rgba(254, 11, 36, 0.6);
        --cpd-color-alpha-red-500: #850009;
        --cpd-color-alpha-red-400: #600;
        --cpd-color-alpha-red-300: #5c0000;
        --cpd-color-alpha-red-200: #470000;
        --cpd-color-alpha-red-100: #3d0000;
        --cpd-color-alpha-gray-1400: rgba(251, 253, 254, 0.97);
        --cpd-color-alpha-gray-1300: rgba(246, 249, 254, 0.95);
        --cpd-color-alpha-gray-1200: rgba(241, 246, 253, 0.88);
        --cpd-color-alpha-gray-1100: rgba(240, 247, 255, 0.82);
        --cpd-color-alpha-gray-1000: rgba(240, 247, 255, 0.76);
        --cpd-color-alpha-gray-900: rgba(236, 244, 254, 0.72);
        --cpd-color-alpha-gray-800: rgba(220, 234, 254, 0.51);
        --cpd-color-alpha-gray-700: rgba(223, 235, 251, 0.39);
        --cpd-color-alpha-gray-600: rgba(231, 241, 253, 0.27);
        --cpd-color-alpha-gray-500: rgba(236, 239, 248, 0.2);
        --cpd-color-alpha-gray-400: rgba(225, 228, 239, 0.13);
        --cpd-color-alpha-gray-300: rgba(237, 231, 244, 0.1);
        --cpd-color-alpha-gray-200: rgba(233, 219, 240, 0.06);
        --cpd-color-alpha-gray-100: rgba(217, 195, 223, 0.04);
        --cpd-color-pink-1400: #fff1f4;
        --cpd-color-pink-1300: #ffe8ed;
        --cpd-color-pink-1200: #ffccd7;
        --cpd-color-pink-1100: #ffbbca;
        --cpd-color-pink-1000: #ffa4b9;
        --cpd-color-pink-900: #ff92ac;
        --cpd-color-pink-800: #f12c75;
        --cpd-color-pink-700: #c51761;
        --cpd-color-pink-600: #99114f;
        --cpd-color-pink-500: #7c0c41;
        --cpd-color-pink-400: #61002d;
        --cpd-color-pink-300: #550024;
        --cpd-color-pink-200: #450018;
        --cpd-color-pink-100: #3c0012;
        --cpd-color-fuchsia-1400: #fbf1fb;
        --cpd-color-fuchsia-1300: #f8e9f9;
        --cpd-color-fuchsia-1200: #f0cff2;
        --cpd-color-fuchsia-1100: #eac0ed;
        --cpd-color-fuchsia-1000: #e3abe7;
        --cpd-color-fuchsia-900: #dd9de3;
        --cpd-color-fuchsia-800: #c153cb;
        --cpd-color-fuchsia-700: #a233b3;
        --cpd-color-fuchsia-600: #7d2394;
        --cpd-color-fuchsia-500: #65177d;
        --cpd-color-fuchsia-400: #4f0368;
        --cpd-color-fuchsia-300: #46005e;
        --cpd-color-fuchsia-200: #37004e;
        --cpd-color-fuchsia-100: #2e0044;
        --cpd-color-purple-1400: #f5f3ff;
        --cpd-color-purple-1300: #eeebff;
        --cpd-color-purple-1200: #dad5ff;
        --cpd-color-purple-1100: #cec7ff;
        --cpd-color-purple-1000: #c0b5ff;
        --cpd-color-purple-900: #b6a7ff;
        --cpd-color-purple-800: #8b66f8;
        --cpd-color-purple-700: #7343e6;
        --cpd-color-purple-600: #5a27c6;
        --cpd-color-purple-500: #4a0db1;
        --cpd-color-purple-400: #350090;
        --cpd-color-purple-300: #2c0080;
        --cpd-color-purple-200: #22006a;
        --cpd-color-purple-100: #1c005a;
        --cpd-color-blue-1400: #eff5fe;
        --cpd-color-blue-1300: #e4eefe;
        --cpd-color-blue-1200: #c5dbfc;
        --cpd-color-blue-1100: #b2cffa;
        --cpd-color-blue-1000: #9ac0f8;
        --cpd-color-blue-900: #89b5f6;
        --cpd-color-blue-800: #337fe9;
        --cpd-color-blue-700: #0e61d1;
        --cpd-color-blue-600: #0b49ab;
        --cpd-color-blue-500: #083891;
        --cpd-color-blue-400: #032677;
        --cpd-color-blue-300: #001e6f;
        --cpd-color-blue-200: #001264;
        --cpd-color-blue-100: #00095d;
        --cpd-color-cyan-1400: #eaf7f9;
        --cpd-color-cyan-1300: #dbf2f5;
        --cpd-color-cyan-1200: #afe2e9;
        --cpd-color-cyan-1100: #93d9e2;
        --cpd-color-cyan-1000: #6bccd9;
        --cpd-color-cyan-900: #46c3d2;
        --cpd-color-cyan-800: #008aba;
        --cpd-color-cyan-700: #006ca4;
        --cpd-color-cyan-600: #005188;
        --cpd-color-cyan-500: #003f75;
        --cpd-color-cyan-400: #002d61;
        --cpd-color-cyan-300: #002559;
        --cpd-color-cyan-200: #001b4e;
        --cpd-color-cyan-100: #001448;
        --cpd-color-green-1400: #e9f8f1;
        --cpd-color-green-1300: #d9f4e7;
        --cpd-color-green-1200: #ace6cc;
        --cpd-color-green-1100: #8fddbc;
        --cpd-color-green-1000: #61d2a6;
        --cpd-color-green-900: #37c998;
        --cpd-color-green-800: #109173;
        --cpd-color-green-700: #00745c;
        --cpd-color-green-600: #005a43;
        --cpd-color-green-500: #004832;
        --cpd-color-green-400: #003622;
        --cpd-color-green-300: #002e1b;
        --cpd-color-green-200: #002513;
        --cpd-color-green-100: #001f0e;
        --cpd-color-lime-1400: #e9f9e3;
        --cpd-color-lime-1300: #daf6d0;
        --cpd-color-lime-1200: #afe99a;
        --cpd-color-lime-1100: #92e175;
        --cpd-color-lime-1000: #6ad639;
        --cpd-color-lime-900: #5eca2f;
        --cpd-color-lime-800: #31941d;
        --cpd-color-lime-700: #187611;
        --cpd-color-lime-600: #005c00;
        --cpd-color-lime-500: #004a00;
        --cpd-color-lime-400: #003700;
        --cpd-color-lime-300: #003000;
        --cpd-color-lime-200: #002600;
        --cpd-color-lime-100: #002000;
        --cpd-color-yellow-1400: #fff4d0;
        --cpd-color-yellow-1300: #ffedb1;
        --cpd-color-yellow-1200: #fed632;
        --cpd-color-yellow-1100: #f7c816;
        --cpd-color-yellow-1000: #ebb607;
        --cpd-color-yellow-900: #e3aa00;
        --cpd-color-yellow-800: #b47200;
        --cpd-color-yellow-700: #985600;
        --cpd-color-yellow-600: #7c3e02;
        --cpd-color-yellow-500: #682e03;
        --cpd-color-yellow-400: #541d00;
        --cpd-color-yellow-300: #4c1400;
        --cpd-color-yellow-200: #410900;
        --cpd-color-yellow-100: #3a0300;
        --cpd-color-orange-1400: #fff2ea;
        --cpd-color-orange-1300: #ffeadb;
        --cpd-color-orange-1200: #fed0b1;
        --cpd-color-orange-1100: #fdc197;
        --cpd-color-orange-1000: #faad73;
        --cpd-color-orange-900: #f89d58;
        --cpd-color-orange-800: #d15f0b;
        --cpd-color-orange-700: #b44007;
        --cpd-color-orange-600: #972206;
        --cpd-color-orange-500: #830500;
        --cpd-color-orange-400: #650000;
        --cpd-color-orange-300: #580000;
        --cpd-color-orange-200: #470000;
        --cpd-color-orange-100: #3c0000;
        --cpd-color-red-1400: #fff2ef;
        --cpd-color-red-1300: #ffe9e6;
        --cpd-color-red-1200: #ffcfc8;
        --cpd-color-red-1100: #ffbdb5;
        --cpd-color-red-1000: #ffa79d;
        --cpd-color-red-900: #ff968c;
        --cpd-color-red-800: #f52f33;
        --cpd-color-red-700: #c81e28;
        --cpd-color-red-600: #9f0d1e;
        --cpd-color-red-500: #830009;
        --cpd-color-red-400: #640000;
        --cpd-color-red-300: #590000;
        --cpd-color-red-200: #470000;
        --cpd-color-red-100: #3e0000;
        --cpd-color-gray-1400: #f2f5f7;
        --cpd-color-gray-1300: #ebeef2;
        --cpd-color-gray-1200: #d5dae1;
        --cpd-color-gray-1100: #c8ced5;
        --cpd-color-gray-1000: #b8bfc7;
        --cpd-color-gray-900: #acb4bd;
        --cpd-color-gray-800: #79818d;
        --cpd-color-gray-700: #606770;
        --cpd-color-gray-600: #4a4f55;
        --cpd-color-gray-500: #3c3f44;
        --cpd-color-gray-400: #2b2e33;
        --cpd-color-gray-300: #26282d;
        --cpd-color-gray-200: #1d1f24;
        --cpd-color-gray-100: #181a1f;
        --cpd-color-theme-bg: #101317;
      }
    }
  }
}
@layer compound {
  @media screen {
    @layer cpd-semantic {
      .cpd-theme-dark-hc.cpd-theme-dark-hc {
        --cpd-color-bg-subtle-secondary-level-0: var(--cpd-color-theme-bg);
        --cpd-color-bg-canvas-default-level-1: var(--cpd-color-gray-300);
      }
    }
  }
}
@layer compound {
  @media screen and (prefers-color-scheme: dark) and (prefers-contrast: more) {
    @layer cpd-semantic {
      :root {
        --cpd-color-bg-subtle-secondary-level-0: var(--cpd-color-theme-bg);
        --cpd-color-bg-canvas-default-level-1: var(--cpd-color-gray-300);
      }
    }
  }
}

._alert_1bz08_19 {
  container-name: alert;
  container-type: inline-size;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: start;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  border: 1px solid;
  border-radius: 8px;
  gap: var(--cpd-space-3x);
  justify-content: start;
  padding: var(--cpd-space-4x);
}
._alert_1bz08_19[data-type="success"] {
  background-color: var(--cpd-color-green-200);
  border-color: var(--cpd-color-green-500);
}
._alert_1bz08_19[data-type="critical"] {
  background-color: var(--cpd-color-red-200);
  border-color: var(--cpd-color-red-500);
}
._alert_1bz08_19[data-type="info"] {
  background-color: var(--cpd-color-blue-200);
  border-color: var(--cpd-color-blue-500);
}
._content_1bz08_46 {
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: var(--cpd-space-3x);
}
._text-content_1bz08_53 {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
}
[data-type="success"] :is(._title_1bz08_57, ._icon_1bz08_57) {
  color: var(--cpd-color-green-900);
}
[data-type="critical"] :is(._title_1bz08_57, ._icon_1bz08_57) {
  color: var(--cpd-color-red-900);
}
[data-type="info"] :is(._title_1bz08_57, ._icon_1bz08_57) {
  color: var(--cpd-color-blue-900);
}
._alert_1bz08_19 p {
  margin: 0;
}
._actions_1bz08_73 {
  -webkit-box-flex: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 0;
  flex: 0;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: var(--cpd-space-1x);
  -ms-flex-item-align: center;
  align-self: center;
}
._icon_1bz08_57 {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
@container alert (max-width: 600px) {
  ._content_1bz08_46 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  ._text-content_1bz08_53 {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 100%;
    flex: 1 0 100%;
  }
}
._font-body-xs-regular_yh5dq_21 {
  font: var(--cpd-font-body-xs-regular);
  letter-spacing: var(--cpd-font-letter-spacing-body-xs);
}
._font-body-xs-semibold_yh5dq_26 {
  font: var(--cpd-font-body-xs-semibold);
  letter-spacing: var(--cpd-font-letter-spacing-body-xs);
}
._font-body-xs-medium_yh5dq_31 {
  font: var(--cpd-font-body-xs-medium);
  letter-spacing: var(--cpd-font-letter-spacing-body-xs);
}
._font-body-sm-regular_yh5dq_40 {
  font: var(--cpd-font-body-sm-regular);
  letter-spacing: var(--cpd-font-letter-spacing-body-sm);
}
._font-body-sm-semibold_yh5dq_45 {
  font: var(--cpd-font-body-sm-semibold);
  letter-spacing: var(--cpd-font-letter-spacing-body-sm);
}
._font-body-sm-medium_yh5dq_50 {
  font: var(--cpd-font-body-sm-medium);
  letter-spacing: var(--cpd-font-letter-spacing-body-sm);
}
._font-body-md-regular_yh5dq_59 {
  font: var(--cpd-font-body-md-regular);
  letter-spacing: var(--cpd-font-letter-spacing-body-md);
}
._font-body-md-semibold_yh5dq_64 {
  font: var(--cpd-font-body-md-semibold);
  letter-spacing: var(--cpd-font-letter-spacing-body-md);
}
._font-body-md-medium_yh5dq_69 {
  font: var(--cpd-font-body-md-medium);
  letter-spacing: var(--cpd-font-letter-spacing-body-md);
}
._font-body-lg-regular_yh5dq_78 {
  font: var(--cpd-font-body-lg-regular);
  letter-spacing: var(--cpd-font-letter-spacing-body-lg);
}
._font-body-lg-semibold_yh5dq_83 {
  font: var(--cpd-font-body-lg-semibold);
  letter-spacing: var(--cpd-font-letter-spacing-body-lg);
}
._font-body-lg-medium_yh5dq_88 {
  font: var(--cpd-font-body-lg-medium);
  letter-spacing: var(--cpd-font-letter-spacing-body-lg);
}
._font-heading-sm-regular_yh5dq_97 {
  font: var(--cpd-font-heading-sm-regular);
  letter-spacing: var(--cpd-font-letter-spacing-heading-sm);
}
._font-heading-sm-semibold_yh5dq_102 {
  font: var(--cpd-font-heading-sm-semibold);
  letter-spacing: var(--cpd-font-letter-spacing-heading-sm);
}
._font-heading-sm-medium_yh5dq_107 {
  font: var(--cpd-font-heading-sm-medium);
  letter-spacing: var(--cpd-font-letter-spacing-heading-sm);
}
._font-heading-md-regular_yh5dq_116 {
  font: var(--cpd-font-heading-md-regular);
  letter-spacing: var(--cpd-font-letter-spacing-heading-md);
}
._font-heading-md-semibold_yh5dq_121 {
  font: var(--cpd-font-heading-md-semibold);
  letter-spacing: var(--cpd-font-letter-spacing-heading-md);
}
._font-heading-lg-regular_yh5dq_130 {
  font: var(--cpd-font-heading-lg-regular);
  letter-spacing: var(--cpd-font-letter-spacing-heading-lg);
}
._font-heading-lg-semibold_yh5dq_135 {
  font: var(--cpd-font-heading-lg-semibold);
  letter-spacing: var(--cpd-font-letter-spacing-heading-lg);
}
._font-heading-xl-regular_yh5dq_144 {
  font: var(--cpd-font-heading-xl-regular);
  letter-spacing: var(--cpd-font-letter-spacing-heading-xl);
}
._font-heading-xl-semibold_yh5dq_149 {
  font: var(--cpd-font-heading-xl-semibold);
  letter-spacing: var(--cpd-font-letter-spacing-heading-xl);
}
._typography_yh5dq_162 {
  -webkit-font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
  font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
  -webkit-font-feature-settings: var(--cpd-font-feature-settings);
  font-feature-settings: var(--cpd-font-feature-settings);
}
._button_dyfp8_17 {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 9999px;
  border-radius: var(--cpd-radius-pill-effect);
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font: var(--cpd-font-body-md-semibold);
  gap: var(--cpd-space-2x);
  justify-content: center;
  -webkit-transition-duration: 0.1s;
  transition-duration: 0.1s;
  -webkit-transition-property: color, background-color, border-color;
  transition-property: color, background-color, border-color;
}
._button_dyfp8_17 > svg {
  -webkit-transition: color 0.1s;
  transition: color 0.1s;
}
._button_dyfp8_17[aria-disabled="true"] {
  color: var(--cpd-color-text-disabled) !important;
  cursor: not-allowed;
  pointer-events: all !important;
}
._button_dyfp8_17[aria-disabled="true"] > svg {
  color: var(--cpd-color-icon-disabled) !important;
}
._button_dyfp8_17[data-size="lg"] {
  min-block-size: var(--cpd-space-12x);
  padding-block: var(--cpd-space-2x);
  padding-inline: var(--cpd-space-8x);
}
._button_dyfp8_17[data-size="lg"]._has-icon_dyfp8_55 {
  -webkit-padding-start: var(--cpd-space-7x);
  padding-inline-start: var(--cpd-space-7x);
}
._button_dyfp8_17[data-size="sm"] {
  min-block-size: var(--cpd-space-9x);
  padding-block: var(--cpd-space-1x);
  padding-inline: var(--cpd-space-5x);
}
._button_dyfp8_17[data-size="sm"]._has-icon_dyfp8_55 {
  -webkit-padding-start: var(--cpd-space-4x);
  padding-inline-start: var(--cpd-space-4x);
}
._button_dyfp8_17[data-kind="primary"] {
  background: var(--cpd-color-bg-action-primary-rest);
  border-width: 0;
  color: var(--cpd-color-text-on-solid-primary);
}
._button_dyfp8_17[data-kind="primary"] > svg {
  color: var(--cpd-color-icon-on-solid-primary);
}
@media (hover) {
  ._button_dyfp8_17[data-kind="primary"]:hover {
    background: var(--cpd-color-bg-action-primary-hovered);
  }
}
._button_dyfp8_17[data-kind="primary"]:active,
._button_dyfp8_17[data-kind="primary"][aria-expanded="true"] {
  background: var(--cpd-color-bg-action-primary-pressed);
}
._button_dyfp8_17[data-kind="primary"][aria-disabled="true"] {
  /* !important to override destructive background */
  background: var(--cpd-color-bg-subtle-primary) !important;
}
._button_dyfp8_17[data-kind="primary"]._destructive_dyfp8_99 {
  background: var(--cpd-color-bg-critical-primary);
}
@media (hover) {
  ._button_dyfp8_17[data-kind="primary"]._destructive_dyfp8_99:hover {
    background: var(--cpd-color-bg-critical-hovered);
  }
}
._button_dyfp8_17[data-kind="primary"]._destructive_dyfp8_99:active,
._button_dyfp8_17[data-kind="primary"]._destructive_dyfp8_99[aria-expanded="true"] {
  background: var(--cpd-color-red-1100);
}
._button_dyfp8_17[data-kind="secondary"] {
  background: var(--cpd-color-bg-canvas-default);
  border: 1px solid var(--cpd-color-border-interactive-secondary);
  color: var(--cpd-color-text-primary);
}
._button_dyfp8_17[data-kind="secondary"] > svg {
  color: var(--cpd-color-icon-primary);
}
@media (hover) {
  ._button_dyfp8_17[data-kind="secondary"]:hover {
    background: var(--cpd-color-bg-subtle-secondary);
    border-color: var(--cpd-color-border-interactive-hovered);
  }
}
._button_dyfp8_17[data-kind="secondary"]:active,
._button_dyfp8_17[data-kind="secondary"][aria-expanded="true"] {
  background: var(--cpd-color-bg-subtle-primary);
  border-color: var(--cpd-color-border-interactive-hovered);
}
._button_dyfp8_17[data-kind="secondary"][aria-disabled="true"] {
  background: var(--cpd-color-bg-subtle-secondary) !important;
  /* !important to override destructive values */
  border-color: var(--cpd-color-border-interactive-secondary) !important;
}
._button_dyfp8_17[data-kind="secondary"]._destructive_dyfp8_99 {
  border-color: var(--cpd-color-border-critical-subtle);
  color: var(--cpd-color-text-critical-primary);
}
._button_dyfp8_17[data-kind="secondary"]._destructive_dyfp8_99 > svg {
  color: var(--cpd-color-icon-critical-primary);
}
@media (hover) {
  ._button_dyfp8_17[data-kind="secondary"]._destructive_dyfp8_99:hover {
    background: var(--cpd-color-bg-critical-subtle);
    border-color: var(--cpd-color-border-critical-hovered);
  }
}
._button_dyfp8_17[data-kind="secondary"]._destructive_dyfp8_99:active,
._button_dyfp8_17[data-kind="secondary"]._destructive_dyfp8_99[aria-expanded="true"] {
  background: var(--cpd-color-bg-critical-subtle-hovered);
  border-color: var(--cpd-color-border-critical-hovered);
}
._button_dyfp8_17[data-kind="tertiary"] {
  background: transparent;
  border: none;
  color: var(--cpd-color-text-primary);
  text-decoration: underline;
}
@media (hover) {
  ._button_dyfp8_17[data-kind="tertiary"]:hover {
    background: var(--cpd-color-bg-subtle-secondary);
  }
}
._button_dyfp8_17[data-kind="tertiary"]:active,
._button_dyfp8_17[data-kind="tertiary"][aria-expanded="true"] {
  background: var(--cpd-color-bg-subtle-primary);
}
._button_dyfp8_17[data-kind="tertiary"][aria-disabled="true"] {
  /* !important to override destructive background */
  background: transparent !important;
  color: var(--cpd-color-text-disabled);
}
._button_dyfp8_17[data-kind="tertiary"]._destructive_dyfp8_99 {
  color: var(--cpd-color-text-critical-primary);
}
@media (hover) {
  ._button_dyfp8_17[data-kind="tertiary"]._destructive_dyfp8_99:hover {
    background: var(--cpd-color-bg-critical-subtle);
  }
}
._button_dyfp8_17[data-kind="tertiary"]._destructive_dyfp8_99:active,
._button_dyfp8_17[data-kind="tertiary"]._destructive_dyfp8_99[aria-expanded="true"] {
  background: var(--cpd-color-bg-critical-subtle-hovered);
}
._icon-button_16nk7_17 {
  --cpd-icon-button-indicator-border-size: calc(
    var(--cpd-icon-button-size) * 0.0625
  );
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  aspect-ratio: 1/1;
  background: transparent;
  block-size: var(--cpd-space-8x);
  block-size: var(--cpd-icon-button-size);
  border: 0;
  border-radius: 50%;
  color: var(--cpd-color-icon-tertiary);
  cursor: pointer;
  inline-size: var(--cpd-space-8x);
  inline-size: var(--cpd-icon-button-size);
  line-height: 0px;
  padding: calc(var(--cpd-icon-button-size) * 0.125);
  position: relative;
}
._icon-button_16nk7_17[aria-disabled="true"] {
  color: var(--cpd-color-icon-disabled);
  cursor: not-allowed;
}
@media (hover) {
  ._icon-button_16nk7_17:not([aria-disabled="true"]):hover {
    background: var(--cpd-color-bg-subtle-primary);
    color: var(--cpd-color-icon-primary);
  }
}
._icon-button_16nk7_17:not([aria-disabled="true"]):active {
  background: var(--cpd-color-bg-subtle-primary);
  color: var(--cpd-color-icon-primary);
}
@media (hover) {
  ._icon-button_16nk7_17:not([aria-disabled="true"])[data-indicator]:is(
      :hover
    ):before {
    border: var(--cpd-icon-button-indicator-border-size) solid
      var(--cpd-color-bg-subtle-primary);
    inset-block-start: 0;
    inset-inline-end: 0;
  }
}
._icon-button_16nk7_17:not([aria-disabled="true"])[data-indicator]:is(
    :active
  ):before {
  border: var(--cpd-icon-button-indicator-border-size) solid
    var(--cpd-color-bg-subtle-primary);
  inset-block-start: 0;
  inset-inline-end: 0;
}
._indicator-icon_133tf_26 {
  aspect-ratio: 1/1;
  block-size: var(--cpd-space-8x);
  block-size: var(--cpd-icon-button-size);
  color: var(--cpd-color-icon-tertiary);
  inline-size: var(--cpd-space-8x);
  inline-size: var(--cpd-icon-button-size);
  position: relative;
}
._indicator-icon_133tf_26 svg {
  block-size: 100%;
  inline-size: 100%;
}
._indicator-icon_133tf_26[data-indicator] svg {
  -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M0 0v24h24V7.641a6 6 0 0 1-2 .36 6 6 0 0 1-6-6 6 6 0 0 1 .36-2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M0 0v24h24V7.641a6 6 0 0 1-2 .36 6 6 0 0 1-6-6 6 6 0 0 1 .36-2z'/%3E%3C/svg%3E");
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100%;
  mask-size: 100%;
}
._indicator-icon_133tf_26[data-indicator]:before {
  background: var(--cpd-color-icon-primary);
  block-size: 33.333%;
  border-radius: 50%;
  content: "";
  inline-size: 33.3333%;
  inset-block-start: -8.3333%;
  inset-inline-end: -8.3333%;
  position: absolute;
}
._indicator-icon_133tf_26[data-indicator="success"]:before {
  background: var(--cpd-color-icon-success-primary);
}
._indicator-icon_133tf_26[data-indicator="critical"]:before {
  background: var(--cpd-color-icon-critical-primary);
}
._avatar_mcap2_17 {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  font-size: min(calc(var(--cpd-space-16x) * 0.5625), 60px);
  font-size: min(calc(var(--cpd-avatar-size) * 0.5625), 60px);
  line-height: var(--cpd-space-16x);
  line-height: var(--cpd-avatar-size);
  text-align: center;
  text-transform: uppercase;
  speak: none;
  background: var(--cpd-color-bg-canvas-default);
  font-family: var(--cpd-font-family-sans);
  font-weight: 700;
  overflow: hidden;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
button._avatar_mcap2_17 {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 0;
  cursor: pointer;
  padding: 0;
}
button._avatar_mcap2_17:disabled {
  cursor: not-allowed;
}
._avatar_mcap2_17,
._image_mcap2_50 {
  aspect-ratio: 1/1;
  border-radius: var(--cpd-avatar-radius);
  inline-size: var(--cpd-space-16x);
  inline-size: var(--cpd-avatar-size);
}
._image_mcap2_50 {
  -o-object-fit: cover;
  object-fit: cover;
  overflow: hidden;
}
._avatar-imageless_mcap2_61 {
  background: var(--cpd-avatar-bg);
  color: var(--cpd-avatar-color);
}
._avatar_mcap2_17[data-color] {
  --cpd-avatar-bg: var(--cpd-color-bg-decorative-1);
  --cpd-avatar-color: var(--cpd-color-text-decorative-1);
}
._avatar_mcap2_17[data-color="2"] {
  --cpd-avatar-bg: var(--cpd-color-bg-decorative-2);
  --cpd-avatar-color: var(--cpd-color-text-decorative-2);
}
._avatar_mcap2_17[data-color="3"] {
  --cpd-avatar-bg: var(--cpd-color-bg-decorative-3);
  --cpd-avatar-color: var(--cpd-color-text-decorative-3);
}
._avatar_mcap2_17[data-color="4"] {
  --cpd-avatar-bg: var(--cpd-color-bg-decorative-4);
  --cpd-avatar-color: var(--cpd-color-text-decorative-4);
}
._avatar_mcap2_17[data-color="5"] {
  --cpd-avatar-bg: var(--cpd-color-bg-decorative-5);
  --cpd-avatar-color: var(--cpd-color-text-decorative-5);
}
._avatar_mcap2_17[data-color="6"] {
  --cpd-avatar-bg: var(--cpd-color-bg-decorative-6);
  --cpd-avatar-color: var(--cpd-color-text-decorative-6);
}
._avatar_mcap2_17[data-type="round"] {
  --cpd-avatar-radius: 20%;
}
._avatar_mcap2_17[data-type="square"] {
  --cpd-avatar-radius: 25%;
}
._stacked-avatars_mcap2_111:after {
  clear: both;
  content: "";
  display: table;
}
._stacked-avatars_mcap2_111 ._avatar_mcap2_17 {
  float: inline-start;
}
._stacked-avatars_mcap2_111 ._avatar_mcap2_17:not(:last-child) {
  clip-path: url(#cpdAvatarClip);
}
._stacked-avatars_mcap2_111 > :not(:first-child) {
  -webkit-margin-start: calc(var(--cpd-space-16x) * -0.2);
  margin-inline-start: calc(var(--cpd-space-16x) * -0.2);
  -webkit-margin-start: calc(var(--cpd-avatar-size) * -0.2);
  margin-inline-start: calc(var(--cpd-avatar-size) * -0.2);
}
._clip-path_mcap2_130 {
  inset-inline-start: -9999px;
  position: fixed;
}
._badge_qipht_17 {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  gap: var(--cpd-space-1x);
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: var(--cpd-color-gray-400);
  border-radius: 9999px;
  color: var(--cpd-color-text-secondary);
  padding: var(--cpd-space-1x) var(--cpd-space-3x);
}
._badge_qipht_17[data-kind="success"] {
  background: var(--cpd-color-green-400);
  color: var(--cpd-color-green-900);
}
._badge_qipht_17[data-kind="critical"] {
  background: var(--cpd-color-red-400);
  color: var(--cpd-color-red-900);
}
._menu_1x5h1_17 {
  background: var(--cpd-color-bg-canvas-default);
  border-radius: var(--cpd-space-3x);
  -webkit-box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.1);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  inline-size: -webkit-fit-content;
  inline-size: -moz-fit-content;
  inline-size: fit-content;
  max-inline-size: 320px;
  outline: var(--cpd-border-width-1) solid
    var(--cpd-color-border-interactive-secondary) !important;
  outline-offset: calc(var(--cpd-border-width-1) * -1);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: var(--cpd-space-1x);
  padding-block: var(--cpd-space-5x) var(--cpd-space-4x);
  --cpd-separator-spacing: 0;
  --cpd-separator-inset: var(--cpd-space-4x);
}
@-webkit-keyframes _slide-in_1x5h1_1 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(var(--cpd-space-3x));
    transform: translateY(var(--cpd-space-3x));
  }
}
@keyframes _slide-in_1x5h1_1 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(var(--cpd-space-3x));
    transform: translateY(var(--cpd-space-3x));
  }
}
@-webkit-keyframes _slide-out_1x5h1_1 {
  to {
    opacity: 0;
    -webkit-transform: translateY(var(--cpd-space-2x));
    transform: translateY(var(--cpd-space-2x));
  }
}
@keyframes _slide-out_1x5h1_1 {
  to {
    opacity: 0;
    -webkit-transform: translateY(var(--cpd-space-2x));
    transform: translateY(var(--cpd-space-2x));
  }
}
._menu_1x5h1_17[data-state="open"] {
  -webkit-animation: _slide-in_1x5h1_1 0.18s;
  animation: _slide-in_1x5h1_1 0.18s;
}
._menu_1x5h1_17[data-state="closed"] {
  -webkit-animation: _slide-out_1x5h1_1 0.11s;
  animation: _slide-out_1x5h1_1 0.11s;
}
@-webkit-keyframes _fade-in_1x5h1_1 {
  0% {
    opacity: 0;
  }
}
@keyframes _fade-in_1x5h1_1 {
  0% {
    opacity: 0;
  }
}
@-webkit-keyframes _fade-out_1x5h1_1 {
  to {
    opacity: 0;
  }
}
@keyframes _fade-out_1x5h1_1 {
  to {
    opacity: 0;
  }
}
@media (prefers-reduced-motion) {
  ._menu_1x5h1_17[data-state="open"] {
    -webkit-animation-name: _fade-in_1x5h1_1;
    animation-name: _fade-in_1x5h1_1;
  }
  ._menu_1x5h1_17[data-state="closed"] {
    -webkit-animation-name: _fade-out_1x5h1_1;
    animation-name: _fade-out_1x5h1_1;
  }
}
._title_1x5h1_83 {
  color: var(--cpd-color-text-secondary);
  padding-inline: var(--cpd-space-4x);
  -webkit-padding-after: calc(var(--cpd-space-2x) - var(--cpd-border-width-1));
  padding-block-end: calc(var(--cpd-space-2x) - var(--cpd-border-width-1));
  -webkit-border-after: var(--cpd-border-width-1) solid
    var(--cpd-color-gray-400);
  border-block-end: var(--cpd-border-width-1) solid var(--cpd-color-gray-400);
  margin-block: 0 var(--cpd-space-2x);
}
._bg_py3lt_17 {
  background: rgba(3, 12, 27, 0.528);
  inset: 0;
  position: fixed;
}
._drawer_py3lt_26 {
  background: var(--cpd-color-bg-canvas-default);
  border-start-end-radius: 28px;
  border-start-end-radius: var(--border-radius);
  border-start-start-radius: 28px;
  border-start-start-radius: var(--border-radius);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  inset-block-end: 0;
  inset-inline: 0;
  padding-inline: max(0px, calc(50% - 260px));
  position: fixed;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  --border-radius: 28px;
  --handle-block-size: 4px;
  --handle-inline-size: 32px;
  --handle-inset-block-start: var(--cpd-space-4x);
  --handle-inset-block-end: 0px;
  --content-inset-block-start: calc(
    var(--handle-inset-block-start) + var(--handle-block-size) +
      var(--handle-inset-block-end)
  );
}
._drawer_py3lt_26[data-platform="ios"] {
  --border-radius: 10px;
  --handle-block-size: 5px;
  --handle-inline-size: 36px;
  --handle-inset-block-start: var(--cpd-space-1-5x);
  --handle-inset-block-end: 1px;
}
._body_py3lt_60 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: var(--cpd-space-2x);
  -webkit-padding-before: calc(
    var(--content-inset-block-start) + var(--cpd-space-6x)
  );
  padding-block-start: calc(
    var(--content-inset-block-start) + var(--cpd-space-6x)
  );
  -webkit-padding-after: var(--cpd-space-12x);
  border-start-end-radius: var(--border-radius);
  border-start-start-radius: var(--border-radius);
  contain: paint;
  overflow: auto;
  padding-block-end: var(--cpd-space-12x);
  scrollbar-width: none;
  --cpd-separator-spacing: 0;
  --cpd-separator-inset: var(--cpd-space-4x);
}
._body_py3lt_60:before {
  background: var(--cpd-color-icon-secondary);
  block-size: var(--handle-block-size);
  border-radius: 9999px;
  border-radius: var(--cpd-radius-pill-effect);
  content: "";
  inset-block-start: var(--handle-inset-block-start);
  inset-inline: calc((100% - var(--handle-inline-size)) / 2);
  position: absolute;
}
._glass_1x9g9_17 {
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  background: var(--cpd-color-alpha-gray-400);
  border-radius: var(--cpd-space-9x);
  outline: var(--cpd-border-width-1) solid var(--cpd-color-alpha-gray-400);
  outline-offset: calc(var(--cpd-border-width-1) * -1);
  padding: var(--cpd-space-3x);
}
._glass_1x9g9_17 > :first-child {
  block-size: 100%;
  border-radius: var(--cpd-space-6x);
  inline-size: 100%;
}
._link_1mzip_17 {
  border-radius: 9999px;
  border-radius: var(--cpd-radius-pill-effect);
  color: var(--cpd-color-text-primary);
  display: inline-block;
  font-weight: var(--cpd-font-weight-medium);
  padding-inline: 0.25rem;
  text-decoration: underline;
}
._link_1mzip_17[data-kind="primary"] {
  color: var(--cpd-color-text-primary);
}
._link_1mzip_17[data-kind="critical"] {
  color: var(--cpd-color-text-critical-primary);
}
@media (hover) {
  ._link_1mzip_17[data-kind="primary"]:hover {
    background: var(--cpd-color-gray-300);
  }
  ._link_1mzip_17[data-kind="critical"]:hover {
    background: var(--cpd-color-red-300);
  }
}
._link_1mzip_17:active {
  color: var(--cpd-color-text-on-solid-primary);
}
._link_1mzip_17[data-kind="primary"]:active {
  background: var(--cpd-color-text-primary);
}
._link_1mzip_17[data-kind="critical"]:active {
  background: var(--cpd-color-text-critical-primary);
}
._item_1gwvj_17 {
  display: grid;
  grid-template: "icon label ." auto "empty1 label empty2" auto/auto auto minmax(
      var(--cpd-space-2x),
      1fr
    );
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: var(--cpd-color-bg-action-secondary-rest);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: var(--cpd-color-text-secondary);
  inline-size: 100%;
  justify-items: end;
  min-inline-size: 200px;
  padding-block: var(--cpd-space-2x);
  padding-inline: var(--cpd-space-4x);
}
._item_1gwvj_17._interactive_1gwvj_36 {
  cursor: pointer;
}
._item_1gwvj_17._no-label_1gwvj_40 {
  grid-template: "icon ." auto/auto 1fr;
}
._icon_1gwvj_44 {
  grid-area: icon;
  -webkit-margin-end: var(--cpd-space-3x);
  margin-inline-end: var(--cpd-space-3x);
}
._item_1gwvj_17._no-label_1gwvj_40 ._icon_1gwvj_44,
._label_1gwvj_53 {
  -webkit-margin-end: var(--cpd-space-4x);
  margin-inline-end: var(--cpd-space-4x);
}
._label_1gwvj_53 {
  grid-area: label;
  text-align: start;
  word-break: break-word;
}
._nav-hint_1gwvj_60 {
  display: none;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
button._item_1gwvj_17 {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
}
._item_1gwvj_17[data-kind="primary"] > ._label_1gwvj_53 {
  color: var(--cpd-color-text-primary);
}
._item_1gwvj_17[data-kind="primary"] > ._icon_1gwvj_44 {
  color: var(--cpd-color-icon-primary);
}
._item_1gwvj_17[data-kind="primary"] > ._nav-hint_1gwvj_60 {
  color: var(--cpd-color-icon-tertiary);
}
._item_1gwvj_17[data-kind="critical"] > ._label_1gwvj_53 {
  color: var(--cpd-color-text-critical-primary);
}
._item_1gwvj_17[data-kind="critical"] > ._icon_1gwvj_44,
._item_1gwvj_17[data-kind="critical"] > ._nav-hint_1gwvj_60 {
  color: var(--cpd-color-icon-critical-primary);
}
@media (hover) {
  ._item_1gwvj_17._interactive_1gwvj_36[data-kind="primary"]:hover {
    background: var(--cpd-color-bg-action-secondary-hovered);
  }
  ._item_1gwvj_17._interactive_1gwvj_36[data-kind="critical"]:hover {
    background: var(--cpd-color-bg-critical-subtle);
  }
  ._item_1gwvj_17._interactive_1gwvj_36:hover > ._nav-hint_1gwvj_60 {
    display: inline;
    display: initial;
  }
  ._item_1gwvj_17._interactive_1gwvj_36:hover > ._nav-hint_1gwvj_60 ~ * {
    display: none;
  }
}
._item_1gwvj_17._interactive_1gwvj_36[data-kind="primary"]:active {
  background: var(--cpd-color-bg-action-secondary-pressed);
}
._item_1gwvj_17._interactive_1gwvj_36[data-kind="critical"]:active {
  background: var(--cpd-color-bg-critical-subtle-hovered);
}
._item_1gwvj_17[data-kind]._disabled_1gwvj_119 {
  pointer-events: none;
}
._item_1gwvj_17[data-kind]._disabled_1gwvj_119 > ._icon_1gwvj_44,
._item_1gwvj_17[data-kind]._disabled_1gwvj_119 > ._label_1gwvj_53,
._item_1gwvj_17[data-kind]._disabled_1gwvj_119 > ._nav-hint_1gwvj_60 {
  color: var(--cpd-color-text-disabled);
}
._search_qztja_17 {
  block-size: 36px;
  border: 1px solid var(--cpd-color-border-interactive-secondary);
  border-radius: 9999px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: var(--cpd-color-text-primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;

  /* !important to override Field's default flex settings */
  -webkit-box-orient: horizontal !important;
  -webkit-box-direction: normal !important;
  -ms-flex-direction: row !important;
  flex-direction: row !important;
  gap: var(--cpd-space-2x) !important;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: var(--cpd-space-1-5x) var(--cpd-space-3x);
}
@media (hover) {
  ._search_qztja_17:hover {
    border-color: var(--cpd-color-border-interactive-hovered);
  }
}
._search_qztja_17:active {
  border-color: var(--cpd-color-border-interactive-hovered);
}
._search_qztja_17:focus-within {
  border-color: currentcolor;
}
._icon_qztja_46 {
  color: var(--cpd-color-icon-secondary);
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
@media (hover) {
  ._search_qztja_17:hover ._icon_qztja_46 {
    color: var(--cpd-color-icon-primary);
  }
}
._search_qztja_17:active ._icon_qztja_46 {
  color: var(--cpd-color-icon-primary);
}
._input_qztja_61 {
  background: inherit;
  border: 0;
  outline: 0;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-inline-size: 0;
}
._input_qztja_61::-webkit-input-placeholder {
  color: var(--cpd-color-text-placeholder);
}
._input_qztja_61::-moz-placeholder {
  color: var(--cpd-color-text-placeholder);
}
._input_qztja_61:-ms-input-placeholder {
  color: var(--cpd-color-text-placeholder);
}
._input_qztja_61::-ms-input-placeholder {
  color: var(--cpd-color-text-placeholder);
}
._input_qztja_61::placeholder {
  color: var(--cpd-color-text-placeholder);
}
._input_qztja_61:focus::-webkit-input-placeholder {
  color: var(--cpd-color-text-secondary);
}
._input_qztja_61:focus::-moz-placeholder {
  color: var(--cpd-color-text-secondary);
}
._input_qztja_61:focus:-ms-input-placeholder {
  color: var(--cpd-color-text-secondary);
}
._input_qztja_61:focus::-ms-input-placeholder {
  color: var(--cpd-color-text-secondary);
}
._input_qztja_61:focus::placeholder {
  color: var(--cpd-color-text-secondary);
}
@media (hover) {
  ._search_qztja_17:hover ._input_qztja_61::-webkit-input-placeholder {
    color: var(--cpd-color-text-secondary);
  }
  ._search_qztja_17:hover ._input_qztja_61::-moz-placeholder {
    color: var(--cpd-color-text-secondary);
  }
  ._search_qztja_17:hover ._input_qztja_61:-ms-input-placeholder {
    color: var(--cpd-color-text-secondary);
  }
  ._search_qztja_17:hover ._input_qztja_61::-ms-input-placeholder {
    color: var(--cpd-color-text-secondary);
  }
  ._search_qztja_17:hover ._input_qztja_61::placeholder {
    color: var(--cpd-color-text-secondary);
  }
}
._container_1qov4_17 {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
}
._control_1qov4_22 {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-padding-end: var(--cpd-space-12x) !important;
  min-inline-size: 0;
  padding-inline-end: var(--cpd-space-12x) !important;
}
._action_1qov4_33 {
  all: unset;
  background-color: transparent;
  border-radius: 50%;
  color: var(--cpd-color-icon-secondary);
  cursor: pointer;
  inset-block: var(--cpd-space-2x);
  inset-inline-end: var(--cpd-space-2x);
  overflow: visible;
  padding: var(--cpd-space-1x);
  position: absolute;
}
._action_1qov4_33 > svg {
  block-size: var(--cpd-space-6x);
  inline-size: var(--cpd-space-6x);
}
@media (hover) {
  ._action_1qov4_33:hover {
    background-color: var(--cpd-color-bg-subtle-secondary);
    color: var(--cpd-color-icon-primary);
  }
}
._action_1qov4_33:focus-visible {
  outline: 2px solid var(--cpd-color-border-focused);
  outline-offset: 1px;
}
._control_1qov4_22[disabled] + ._action_1qov4_33 {
  color: var(--cpd-color-text-disabled);
  pointer-events: none;
}
._control_1qov4_22[readonly] + ._action_1qov4_33 {
  color: var(--cpd-color-text-secondary);
  pointer-events: none;
}
._control_9gon8_18 {
  background: var(--cpd-color-bg-canvas-default);
  border: 1px solid var(--cpd-color-border-interactive-primary);
  border-radius: 0.5rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-font-feature-settings: "calt" 0;
  font-feature-settings: "calt" 0;
  padding: var(--cpd-space-3x) var(--cpd-space-4x);
}
@media (hover) {
  ._control_9gon8_18:hover {
    border-color: var(--cpd-color-border-interactive-hovered);
    -webkit-box-shadow: 0 1.2px 2.4px 0 rgba(0, 0, 0, 0.15);
    box-shadow: 0 1.2px 2.4px 0 rgba(0, 0, 0, 0.15);
  }
}
._control_9gon8_18:active {
  border-color: var(--cpd-color-border-interactive-hovered);
}
._control_9gon8_18:focus {
  border-color: transparent;
  outline: 2px solid var(--cpd-color-border-focused);
}
._control_9gon8_18[data-invalid] {
  border-color: var(--cpd-color-text-critical-primary);
}
._control_9gon8_18:disabled {
  background: var(--cpd-color-bg-canvas-disabled);
  border-color: var(--cpd-color-border-disabled);
  -webkit-box-shadow: none;
  box-shadow: none;
  color: var(--cpd-color-text-disabled);
  cursor: not-allowed;
}
._control_9gon8_18[readonly] {
  background: var(--cpd-color-bg-subtle-secondary);
  border-color: var(--cpd-color-bg-subtle-secondary);
  -webkit-box-shadow: none;
  box-shadow: none;
  color: var(--cpd-color-text-secondary);
}
._control_9gon8_18._enable-ligatures_9gon8_70 {
  -webkit-font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
  font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
  -webkit-font-feature-settings: var(--cpd-font-feature-settings);
  font-feature-settings: var(--cpd-font-feature-settings);
}
._tooltip_svz44_17 {
  background: var(--cpd-color-alpha-gray-1400);
  border-radius: 4px;
  color: var(--cpd-color-text-on-solid-primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font: var(--cpd-font-body-xs-medium);
  padding: var(--cpd-space-1-5x) var(--cpd-space-3x);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  text-align: center;
}
._caption_svz44_29 {
  color: var(--cpd-color-text-secondary);
  font-weight: var(--cpd-font-weight-regular);
}
._arrow_svz44_34 {
  fill: var(--cpd-color-alpha-gray-1400);
}
._container_9zyti_18 {
  --gap: var(--cpd-space-3x);
  --digit-size: var(--cpd-space-10x);
  --digit-height: var(--cpd-space-12x);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  inline-size: -webkit-fit-content;
  inline-size: -moz-fit-content;
  inline-size: fit-content;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: var(--cpd-space-3x);
  gap: var(--gap);
  position: relative;
}
._control_9zyti_33 {
  all: unset;
  font-family: var(--cpd-font-family-mono), ui-monospace, monospace;
  font-weight: 700;
  inset: 0;
  letter-spacing: calc(var(--gap) + var(--digit-size) - 1ch);
  line-height: var(--digit-height);
  position: absolute;
  -webkit-padding-start: calc(var(--cpd-space-10x) / 2 - 0.5ch);
  padding-inline-start: calc(var(--cpd-space-10x) / 2 - 0.5ch);
  -webkit-margin-end: calc((var(--cpd-space-10x) + var(--cpd-space-3x)) * -1);
  margin-inline-end: calc((var(--cpd-space-10x) + var(--cpd-space-3x)) * -1);
}
._digit_9zyti_57 {
  background: var(--cpd-color-bg-canvas-default);
  block-size: var(--cpd-space-12x);
  border: 1px solid var(--cpd-color-border-interactive-primary);
  border-radius: 0.5rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  inline-size: var(--cpd-space-10x);
  padding: var(--cpd-space-3x) var(--cpd-space-4x);
}
@media (hover) {
  ._control_9zyti_33:hover ~ ._digit_9zyti_57 {
    border-color: var(--cpd-color-border-interactive-hovered);
    -webkit-box-shadow: 0 1.2px 2.4px 0 rgba(0, 0, 0, 0.15);
    box-shadow: 0 1.2px 2.4px 0 rgba(0, 0, 0, 0.15);
  }
}
._control_9zyti_33:disabled {
  color: var(--cpd-color-text-disabled);
  cursor: not-allowed;
}
._control_9zyti_33:disabled ~ ._digit_9zyti_57 {
  background: var(--cpd-color-bg-canvas-disabled);
  border-color: var(--cpd-color-border-disabled);
  -webkit-box-shadow: none;
  box-shadow: none;
}
._control_9zyti_33[readonly] {
  color: var(--cpd-color-text-secondary);
}
._control_9zyti_33[readonly] ~ ._digit_9zyti_57 {
  background: var(--cpd-color-bg-subtle-secondary);
  border-color: var(--cpd-color-bg-subtle-secondary);
  -webkit-box-shadow: none;
  box-shadow: none;
}
._control_9zyti_33[data-invalid] ~ ._digit_9zyti_57 {
  border-color: var(--cpd-color-text-critical-primary);
}
._control_9zyti_33:focus ~ ._digit_9zyti_57:not([data-filled]) {
  border-color: transparent;
  outline: 2px solid var(--cpd-color-border-focused);
}
._digit_9zyti_57[data-selected] {
  background-color: var(--cpd-color-bg-info-subtle);
  border-color: var(--cpd-color-border-focused);
}
._container_1jek6_18 {
  --size: 20px;
  block-size: 20px;
  block-size: var(--size);
  display: grid;
  inline-size: 20px;
  inline-size: var(--size);
}
._input_1jek6_26,
._ui_1jek6_27 {
  block-size: var(--size);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  grid-area: 1/1;
  inline-size: var(--size);
}
._input_1jek6_26 {
  cursor: pointer;
  margin: 0;
  opacity: 0;
}
._ui_1jek6_27 {
  border: 1px solid;
  border-color: var(--cpd-color-border-interactive-primary);
  border-radius: 4px;
  color: transparent;
  pointer-events: none;
}
._ui_1jek6_27 svg {
  block-size: var(--size);
  inline-size: var(--size);
  margin: -1px;
}
._input_1jek6_26:checked + ._ui_1jek6_27 {
  background-color: var(--cpd-color-bg-action-primary-rest);
  border-color: var(--cpd-color-bg-action-primary-rest);
  color: var(--cpd-color-icon-on-solid-primary);
}
._input_1jek6_26:focus-visible + ._ui_1jek6_27 {
  outline: 2px solid var(--cpd-color-border-focused);
  outline-offset: 1px;
}
._input_1jek6_26[disabled] + ._ui_1jek6_27 {
  background: var(--cpd-color-bg-canvas-disabled);
  border-color: var(--cpd-color-border-disabled);
}
._input_1jek6_26[readonly] {
  pointer-events: none;
}
._input_1jek6_26[readonly] + ._ui_1jek6_27 {
  background: var(--cpd-color-bg-subtle-secondary);
  border-color: var(--cpd-color-border-interactive-secondary);
}
._input_1jek6_26[disabled]:checked + ._ui_1jek6_27 {
  background: var(--cpd-color-bg-action-primary-disabled);
  border-color: var(--cpd-color-bg-action-primary-disabled);
}
._input_1jek6_26[readonly]:checked + ._ui_1jek6_27 {
  color: var(--cpd-color-icon-secondary);
}
@media (hover) {
  ._input_1jek6_26:not([disabled], [readonly], :checked):hover + ._ui_1jek6_27 {
    border-color: var(--cpd-color-border-interactive-hovered);
    -webkit-box-shadow: 0 1.2px 2.4px 0 rgba(0, 0, 0, 0.15);
    box-shadow: 0 1.2px 2.4px 0 rgba(0, 0, 0, 0.15);
    color: var(--cpd-color-icon-quaternary);
  }
  ._input_1jek6_26:not([disabled], [readonly]):checked:hover + ._ui_1jek6_27 {
    background: var(--cpd-color-bg-action-primary-hovered);
    border-color: var(--cpd-color-bg-action-primary-hovered);
  }
  ._input_1jek6_26[data-invalid]:not([disabled], [readonly]):checked:hover
    + ._ui_1jek6_27 {
    background: var(--cpd-color-bg-critical-hovered);
    border-color: var(--cpd-color-bg-critical-hovered);
  }
}
._input_1jek6_26[data-invalid]:not([disabled], :checked, [readonly])
  + ._ui_1jek6_27 {
  border-color: var(--cpd-color-border-critical-primary);
}
._input_1jek6_26[data-invalid]:not([disabled], [readonly]):checked
  + ._ui_1jek6_27 {
  background-color: var(--cpd-color-bg-critical-primary);
  border-color: var(--cpd-color-bg-critical-primary);
}
._container_bdln6_18 {
  --size: 20px;
  block-size: 20px;
  block-size: var(--size);
  display: grid;
  inline-size: 20px;
  inline-size: var(--size);
}
._input_bdln6_26,
._ui_bdln6_27 {
  block-size: var(--size);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  grid-area: 1/1;
  inline-size: var(--size);
}
._input_bdln6_26 {
  cursor: pointer;
  margin: 0;
  opacity: 0;
}
._ui_bdln6_27 {
  border: 1px solid;
  border-color: var(--cpd-color-border-interactive-primary);
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  pointer-events: none;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
._ui_bdln6_27:after {
  background: transparent;
  block-size: 6px;
  border-radius: 50%;
  content: "";
  inline-size: 6px;
}
._input_bdln6_26:checked + ._ui_bdln6_27 {
  background-color: var(--cpd-color-bg-action-primary-rest);
  border-color: var(--cpd-color-bg-action-primary-rest);
}
._input_bdln6_26:checked + ._ui_bdln6_27:after {
  background: var(--cpd-color-icon-on-solid-primary);
}
._input_bdln6_26:focus-visible + ._ui_bdln6_27 {
  outline: 2px solid var(--cpd-color-border-focused);
  outline-offset: 1px;
}
._input_bdln6_26[readonly] {
  pointer-events: none;
}
._input_bdln6_26[readonly] + ._ui_bdln6_27 {
  background: var(--cpd-color-bg-subtle-secondary);
  border-color: var(--cpd-color-border-interactive-secondary);
}
._input_bdln6_26[disabled] + ._ui_bdln6_27 {
  background: var(--cpd-color-bg-canvas-disabled);
  border-color: var(--cpd-color-border-disabled);
}
._input_bdln6_26[disabled]:checked + ._ui_bdln6_27 {
  background: var(--cpd-color-bg-action-primary-disabled);
  border-color: var(--cpd-color-bg-action-primary-disabled);
}
._input_bdln6_26[readonly]:checked + ._ui_bdln6_27:after {
  background-color: var(--cpd-color-icon-secondary);
}
@media (hover) {
  ._input_bdln6_26:not([disabled], [readonly], :checked):hover + ._ui_bdln6_27 {
    border-color: var(--cpd-color-border-interactive-hovered);
    -webkit-box-shadow: 0 1.2px 2.4px 0 rgba(0, 0, 0, 0.15);
    box-shadow: 0 1.2px 2.4px 0 rgba(0, 0, 0, 0.15);
  }
  ._input_bdln6_26:not([disabled], [readonly], :checked):hover
    + ._ui_bdln6_27:after {
    background: var(--cpd-color-icon-quaternary);
  }
  ._input_bdln6_26:not([disabled], [readonly]):checked:hover + ._ui_bdln6_27 {
    background: var(--cpd-color-bg-action-primary-hovered);
    border-color: var(--cpd-color-bg-action-primary-hovered);
  }
  ._input_bdln6_26[data-invalid]:not([disabled], [readonly]):checked:hover
    + ._ui_bdln6_27 {
    background: var(--cpd-color-bg-critical-hovered);
    border-color: var(--cpd-color-bg-critical-hovered);
  }
}
._input_bdln6_26[data-invalid]:not([disabled], [readonly], :checked)
  + ._ui_bdln6_27 {
  border-color: var(--cpd-color-border-critical-primary);
}
._input_bdln6_26[data-invalid]:not([disabled], [readonly]):checked
  + ._ui_bdln6_27 {
  background-color: var(--cpd-color-bg-critical-primary);
  border-color: var(--cpd-color-bg-critical-primary);
}
._container_ik1u1_18 {
  block-size: 1.25rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: grid;
  inline-size: 2.25rem;
}
._container_ik1u1_18 > * {
  block-size: inherit;
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
  grid-area: 1/1;
  inline-size: inherit;
}
._container_ik1u1_18 > ._input_ik1u1_32 {
  cursor: pointer;
  margin: 0;
  opacity: 0;
}
._container_ik1u1_18 > ._input_ik1u1_32[disabled] {
  cursor: not-allowed;
}
._ui_ik1u1_42 {
  background: var(--cpd-color-bg-canvas-default);
  border: 1px solid var(--cpd-color-border-interactive-primary);
  border-radius: 9999px;
  border-radius: var(--cpd-radius-pill-effect);
  padding: 1px;
  pointer-events: none;
  position: relative;
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-property: background-color, border-color;
  transition-property: background-color, border-color;
  -webkit-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
}
._input_ik1u1_32:checked + ._ui_ik1u1_42 {
  background: var(--cpd-color-bg-action-primary-rest);
  border-color: var(--cpd-color-bg-action-primary-rest);
}
._ui_ik1u1_42:after {
  aspect-ratio: 1/1;
  background: var(--cpd-color-bg-action-primary-rest);
  block-size: 100%;
  border-radius: 50%;
  content: "";
  display: block;
  -webkit-transform: translateX(0);
  transform: translateX(0);
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-property: background-color, -webkit-transform;
  transition-property: background-color, -webkit-transform;
  transition-property: background-color, transform;
  transition-property: background-color, transform, -webkit-transform;
  -webkit-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
}
._input_ik1u1_32:focus-visible + ._ui_ik1u1_42 {
  outline: 2px solid var(--cpd-color-border-focused);
  outline-offset: 1px;
}
:checked + ._ui_ik1u1_42:after {
  background: var(--cpd-color-icon-on-solid-primary);
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
}
@media (hover) {
  :checked:not([disabled]):hover + ._ui_ik1u1_42 {
    background: var(--cpd-color-bg-action-primary-hovered);
    border-color: var(--cpd-color-bg-action-primary-hovered);
  }
}
:checked:active + ._ui_ik1u1_42 {
  background: var(--cpd-color-bg-action-primary-hovered);
  border-color: var(--cpd-color-bg-action-primary-hovered);
}
._input_ik1u1_32[readonly] {
  pointer-events: none;
}
._input_ik1u1_32[readonly] + ._ui_ik1u1_42 {
  background: var(--cpd-color-bg-subtle-secondary);
  border-color: var(--cpd-color-border-interactive-secondary);
}
._input_ik1u1_32[readonly] + ._ui_ik1u1_42:after {
  background: var(--cpd-color-icon-secondary);
}
._input_ik1u1_32[disabled] + ._ui_ik1u1_42 {
  background: var(--cpd-color-bg-canvas-disabled);
  border-color: var(--cpd-color-border-disabled);
}
._input_ik1u1_32[disabled] + ._ui_ik1u1_42:after {
  background: var(--cpd-color-bg-action-primary-disabled);
}
._input_ik1u1_32[readonly]:checked + ._ui_ik1u1_42 {
  background: var(--cpd-color-icon-secondary);
  border-color: var(--cpd-color-icon-secondary);
}
._input_ik1u1_32[readonly]:checked + ._ui_ik1u1_42:after {
  background: var(--cpd-color-icon-on-solid-primary);
}
._input_ik1u1_32[disabled]:checked + ._ui_ik1u1_42 {
  background: var(--cpd-color-bg-action-primary-disabled);
  border-color: var(--cpd-color-bg-action-primary-disabled);
}
._input_ik1u1_32[disabled]:checked + ._ui_ik1u1_42:after {
  background: var(--cpd-color-icon-on-solid-primary);
}
@media (hover) {
  ._input_ik1u1_32:not(:checked, [disabled], [readonly]):hover + ._ui_ik1u1_42 {
    border-color: var(--cpd-color-border-interactive-hovered);
    -webkit-box-shadow: 0 1.2px 2.4px 0 rgba(0, 0, 0, 0.15);
    box-shadow: 0 1.2px 2.4px 0 rgba(0, 0, 0, 0.15);
  }
}
._input_ik1u1_32:not(:checked, [disabled], [readonly]):active + ._ui_ik1u1_42 {
  border-color: var(--cpd-color-border-interactive-hovered);
}
._container_cgk4x_17 {
  min-block-size: 110px;
}
._label_cgk4x_21 {
  font-size: 15px;
  font-weight: 500;
  -webkit-margin-after: 4px;
  margin-block-end: 4px;
}
._controls_cgk4x_27 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 15px;
}
._button-group_cgk4x_32 {
  display: none;
  gap: 7px;
  grid-template-columns: 1fr 1fr;
  inset-block-start: 5px;
  position: relative;
}
._button_cgk4x_32 {
  background-color: transparent;
  block-size: 36px;
  border: 1px solid var(--cpd-color-border-interactive-secondary);
  border-radius: 20px;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  inline-size: 36px;
  text-align: center;
}
._primary-button_cgk4x_51 {
  background-color: var(--cpd-color-bg-action-primary-rest);
  border-color: var(--cpd-color-bg-action-primary-rest);
}
._primary-button_cgk4x_51 svg {
  color: var(--cpd-color-icon-on-solid-primary);
}
._primary-button-disabled_cgk4x_60 {
  background-color: var(--cpd-color-bg-subtle-primary);
  border-color: var(--cpd-color-bg-subtle-primary);
}
._primary-button-disabled_cgk4x_60 svg {
  color: var(--cpd-color-icon-disabled);
}
._button_cgk4x_32 svg {
  block-size: 24px;
  inline-size: 24px;
  margin: auto;
}
._control_cgk4x_27 {
  inline-size: 100%;
}
._container_cgk4x_17:focus-within ._button-group_cgk4x_32 {
  display: inline-grid;
}
._container-error_cgk4x_83 ._control_cgk4x_27 {
  border-color: var(--cpd-color-border-critical-primary);
}
._container-error_cgk4x_83 ._label_cgk4x_21 {
  color: var(--cpd-color-text-critical-primary);
}
._caption-line_cgk4x_91 {
  -webkit-margin-before: var(--cpd-space-2x);
  margin-block-start: var(--cpd-space-2x);
}
._caption-icon_cgk4x_95 {
  block-size: 20px;
  display: inline-block;
  inline-size: 20px;
  vertical-align: middle;
  -webkit-margin-end: var(--cpd-space-2x);
  margin-inline-end: var(--cpd-space-2x);
}
._caption-icon-error_cgk4x_103 {
  color: var(--cpd-color-icon-critical-primary);
}
._caption-icon-saved_cgk4x_107 {
  background-color: var(--cpd-color-icon-success-primary);
  border-radius: 20px;
  text-align: center;
  -webkit-margin-end: var(--cpd-space-2x);
  margin-inline-end: var(--cpd-space-2x);
}
._caption-icon-saved_cgk4x_107 svg {
  color: var(--cpd-color-icon-on-solid-primary);
}
._caption-text_cgk4x_118 {
  font-size: 13px;
  vertical-align: middle;
}
._caption-text-error_cgk4x_123 {
  color: var(--cpd-color-text-critical-primary);
}
._caption-text-saved_cgk4x_127 {
  color: var(--cpd-color-text-success-primary);
}
._root_578ve_24 {
  gap: var(--cpd-space-5x);
}
._field_578ve_34,
._root_578ve_24 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
._field_578ve_34 {
  gap: var(--cpd-space-1x);
}
._inline-field_578ve_40 {
  -webkit-box-orient: horizontal;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: var(--cpd-space-5x);
}
._inline-field-body_578ve_46,
._inline-field_578ve_40 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
}
._inline-field-body_578ve_46 {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-orient: vertical;
  -ms-flex-direction: column;
  flex-direction: column;
}
._inline-field-control_578ve_52 {
  block-size: calc(
    var(--cpd-font-size-body-md) * var(--cpd-font-line-height-regular)
  );
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
._label_578ve_67 {
  font: var(--cpd-font-body-md-medium);
  letter-spacing: var(--cpd-font-letter-spacing-body-md);
}
._label_578ve_67[for] {
  cursor: pointer;
}
._label_578ve_67[data-invalid] {
  color: var(--cpd-color-text-critical-primary);
}
._inline-field-body_578ve_46 ._label_578ve_67 {
  font: var(--cpd-font-body-md-regular);
}
._inline-field-control_578ve_52:has(input[disabled])
  ~ ._inline-field-body_578ve_46
  ._label_578ve_67,
._label_578ve_67:has(~ * input[disabled]),
._label_578ve_67:has(~ input[disabled]) {
  color: var(--cpd-color-text-disabled);
  cursor: not-allowed;
}
._message_578ve_98 {
  font: var(--cpd-font-body-sm-regular);
  letter-spacing: var(--cpd-font-letter-spacing-body-sm);
  -webkit-margin-before: var(--cpd-space-1x);
  margin-block-start: var(--cpd-space-1x);
}
._help-message_578ve_104 {
  color: var(--cpd-color-text-secondary);
}
._error-message_578ve_108 {
  color: var(--cpd-color-text-critical-primary);
}
._inline-field-control_578ve_52:has(input[disabled])
  ~ ._inline-field-body_578ve_46
  ._message_578ve_98,
:has(input[disabled]) ~ ._message_578ve_98,
input[disabled] ~ ._message_578ve_98 {
  color: var(--cpd-color-text-disabled);
}
._message_578ve_98 > svg {
  display: inline-block;
  vertical-align: bottom;
  -webkit-margin-end: var(--cpd-space-2x);
  block-size: calc(1em * var(--cpd-font-line-height-regular));
  inline-size: calc(1em * var(--cpd-font-line-height-regular));
  margin-inline-end: var(--cpd-space-2x);
}
._separator_144s5_17 {
  --cpd-separator-color: var(--cpd-color-gray-400);
  --cpd-separator-size: 1px;
  background-color: var(--cpd-color-gray-400);
  background-color: var(--cpd-separator-color);
}
._separator_144s5_17[data-kind="secondary"] {
  --cpd-separator-color: var(--cpd-color-gray-300);
}
._separator_144s5_17[data-kind="section"] {
  --cpd-separator-size: 2px;
}
._separator_144s5_17[data-orientation="horizontal"] {
  block-size: var(--cpd-separator-size);
  margin-block: var(--cpd-space-2x);
  margin-block: var(--cpd-separator-spacing);
  margin-inline: 0;
  margin-inline: var(--cpd-separator-inset);
}
._separator_144s5_17[data-orientation="vertical"] {
  inline-size: var(--cpd-separator-size);
  margin-block: 0;
  margin-block: var(--cpd-separator-inset);
  margin-inline: var(--cpd-space-2x);
  margin-inline: var(--cpd-separator-spacing);
}
._content_1oa1y_17 {
  background: var(--cpd-color-bg-action-primary-rest);
  border-radius: var(--cpd-space-3x);
  -webkit-box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.1);
  display: grid;
  grid-template: "header button" auto "description button" auto;
  max-inline-size: 320px;
  padding: var(--cpd-space-5x) var(--cpd-space-6x);
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-column-gap: var(--cpd-space-6x);
  -webkit-column-gap: var(--cpd-space-6x);
  -moz-column-gap: var(--cpd-space-6x);
  column-gap: var(--cpd-space-6x);
}
._header_1oa1y_46 {
  color: var(--cpd-color-text-on-solid-primary);
  grid-area: header;
  margin: 0;
}
._description_1oa1y_52 {
  color: var(--cpd-color-gray-500);
  grid-area: description;
}
._button_1oa1y_57 {
  color: var(--cpd-color-bg-subtle-secondary);
  grid-area: button;
}
._arrow_1oa1y_62 {
  fill: var(--cpd-color-bg-action-primary-rest);
}
._toast-container_pnye8_17 {
  background-color: var(--cpd-color-alpha-gray-1300);
  border-radius: 99px;
  color: var(--cpd-color-text-on-solid-primary);
  font-size: var(--cpd-font-body-sm-medium);
  inline-size: -webkit-fit-content;
  inline-size: -moz-fit-content;
  inline-size: fit-content;
  padding: var(--cpd-space-2x) var(--cpd-space-4x);
}
:root {
  --cpd-radius-pill-effect: 9999px;
  --cpd-icon-button-size: var(--cpd-space-8x);
  --cpd-avatar-size: var(--cpd-space-16x);
  --cpd-font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
  --cpd-separator-spacing: var(--cpd-space-2x);
  --cpd-separator-inset: 0;
}
body,
html,
input {
  color: var(--cpd-color-text-primary);
  font: var(--cpd-font-body-md-regular);
  -webkit-font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
  font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
  -webkit-font-feature-settings: var(--cpd-font-feature-settings);
  font-feature-settings: var(--cpd-font-feature-settings);
}
body,
html {
  block-size: 100%;
  font-size: var(--cpd-font-size-root);
}
body {
  background: var(--cpd-color-bg-canvas-default);
}
.mapboxgl-map,
.maplibregl-map {
  -webkit-tap-highlight-color: rgb(0 0 0/0);
  font: 12px/20px Helvetica Neue, Arial, Helvetica, sans-serif;
  overflow: hidden;
  position: relative;
}
.mapboxgl-canvas,
.maplibregl-canvas {
  left: 0;
  position: absolute;
  top: 0;
}
.mapboxgl-map:-webkit-full-screen,
.maplibregl-map:-webkit-full-screen {
  height: 100%;
  width: 100%;
}
.mapboxgl-map:-ms-fullscreen,
.maplibregl-map:-ms-fullscreen {
  height: 100%;
  width: 100%;
}
.mapboxgl-map:fullscreen,
.maplibregl-map:fullscreen {
  height: 100%;
  width: 100%;
}
.mapboxgl-canvas-container.mapboxgl-interactive,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-compass,
.maplibregl-canvas-container.maplibregl-interactive,
.maplibregl-ctrl-group button.maplibregl-ctrl-compass {
  cursor: -webkit-grab;
  cursor: grab;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.mapboxgl-canvas-container.mapboxgl-interactive.mapboxgl-track-pointer,
.maplibregl-canvas-container.maplibregl-interactive.maplibregl-track-pointer {
  cursor: pointer;
}
.mapboxgl-canvas-container.mapboxgl-interactive:active,
.mapboxgl-ctrl-group button.mapboxgl-ctrl-compass:active,
.maplibregl-canvas-container.maplibregl-interactive:active,
.maplibregl-ctrl-group button.maplibregl-ctrl-compass:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}
.mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate,
.mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate .mapboxgl-canvas,
.maplibregl-canvas-container.maplibregl-touch-zoom-rotate,
.maplibregl-canvas-container.maplibregl-touch-zoom-rotate .maplibregl-canvas {
  -ms-touch-action: pan-x pan-y;
  touch-action: pan-x pan-y;
}
.mapboxgl-canvas-container.mapboxgl-touch-drag-pan,
.mapboxgl-canvas-container.mapboxgl-touch-drag-pan .mapboxgl-canvas,
.maplibregl-canvas-container.maplibregl-touch-drag-pan,
.maplibregl-canvas-container.maplibregl-touch-drag-pan .maplibregl-canvas {
  -ms-touch-action: pinch-zoom;
  touch-action: pinch-zoom;
}
.mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate.mapboxgl-touch-drag-pan,
.mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate.mapboxgl-touch-drag-pan
  .mapboxgl-canvas,
.maplibregl-canvas-container.maplibregl-touch-zoom-rotate.maplibregl-touch-drag-pan,
.maplibregl-canvas-container.maplibregl-touch-zoom-rotate.maplibregl-touch-drag-pan
  .maplibregl-canvas {
  -ms-touch-action: none;
  touch-action: none;
}
.mapboxgl-ctrl-bottom-left,
.mapboxgl-ctrl-bottom-right,
.mapboxgl-ctrl-top-left,
.mapboxgl-ctrl-top-right,
.maplibregl-ctrl-bottom-left,
.maplibregl-ctrl-bottom-right,
.maplibregl-ctrl-top-left,
.maplibregl-ctrl-top-right {
  pointer-events: none;
  position: absolute;
  z-index: 2;
}
.mapboxgl-ctrl-top-left,
.maplibregl-ctrl-top-left {
  left: 0;
  top: 0;
}
.mapboxgl-ctrl-top-right,
.maplibregl-ctrl-top-right {
  right: 0;
  top: 0;
}
.mapboxgl-ctrl-bottom-left,
.maplibregl-ctrl-bottom-left {
  bottom: 0;
  left: 0;
}
.mapboxgl-ctrl-bottom-right,
.maplibregl-ctrl-bottom-right {
  bottom: 0;
  right: 0;
}
.mapboxgl-ctrl,
.maplibregl-ctrl {
  clear: both;
  pointer-events: auto;
  -webkit-transform: translate(0);
  transform: translate(0);
}
.mapboxgl-ctrl-top-left .mapboxgl-ctrl,
.maplibregl-ctrl-top-left .maplibregl-ctrl {
  float: left;
  margin: 10px 0 0 10px;
}
.mapboxgl-ctrl-top-right .mapboxgl-ctrl,
.maplibregl-ctrl-top-right .maplibregl-ctrl {
  float: right;
  margin: 10px 10px 0 0;
}
.mapboxgl-ctrl-bottom-left .mapboxgl-ctrl,
.maplibregl-ctrl-bottom-left .maplibregl-ctrl {
  float: left;
  margin: 0 0 10px 10px;
}
.mapboxgl-ctrl-bottom-right .mapboxgl-ctrl,
.maplibregl-ctrl-bottom-right .maplibregl-ctrl {
  float: right;
  margin: 0 10px 10px 0;
}
.mapboxgl-ctrl-group,
.maplibregl-ctrl-group {
  background: #fff;
  border-radius: 4px;
}
.mapboxgl-ctrl-group:not(:empty),
.maplibregl-ctrl-group:not(:empty) {
  -webkit-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1);
}
@media (-ms-high-contrast: active) {
  .mapboxgl-ctrl-group:not(:empty),
  .maplibregl-ctrl-group:not(:empty) {
    -webkit-box-shadow: 0 0 0 2px ButtonText;
    box-shadow: 0 0 0 2px ButtonText;
  }
}
.mapboxgl-ctrl-group button,
.maplibregl-ctrl-group button {
  background-color: transparent;
  border: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
  display: block;
  height: 29px;
  outline: none;
  padding: 0;
  width: 29px;
}
.mapboxgl-ctrl-group button + button,
.maplibregl-ctrl-group button + button {
  border-top: 1px solid #ddd;
}
.mapboxgl-ctrl button .mapboxgl-ctrl-icon,
.maplibregl-ctrl button .maplibregl-ctrl-icon {
  background-position: 50%;
  background-repeat: no-repeat;
  display: block;
  height: 100%;
  width: 100%;
}
@media (-ms-high-contrast: active) {
  .mapboxgl-ctrl-icon,
  .maplibregl-ctrl-icon {
    background-color: transparent;
  }
  .mapboxgl-ctrl-group button + button,
  .maplibregl-ctrl-group button + button {
    border-top: 1px solid ButtonText;
  }
}
.mapboxgl-ctrl button::-moz-focus-inner,
.maplibregl-ctrl button::-moz-focus-inner {
  border: 0;
  padding: 0;
}
.mapboxgl-ctrl-attrib-button:focus,
.mapboxgl-ctrl-group button:focus,
.maplibregl-ctrl-attrib-button:focus,
.maplibregl-ctrl-group button:focus {
  -webkit-box-shadow: 0 0 2px 2px #0096ff;
  box-shadow: 0 0 2px 2px #0096ff;
}
.mapboxgl-ctrl button:disabled,
.maplibregl-ctrl button:disabled {
  cursor: not-allowed;
}
.mapboxgl-ctrl button:disabled .mapboxgl-ctrl-icon,
.maplibregl-ctrl button:disabled .maplibregl-ctrl-icon {
  opacity: 0.25;
}
.mapboxgl-ctrl button:not(:disabled):hover,
.maplibregl-ctrl button:not(:disabled):hover {
  background-color: rgb(0 0 0/5%);
}
.mapboxgl-ctrl-group button:focus:focus-visible,
.maplibregl-ctrl-group button:focus:focus-visible {
  -webkit-box-shadow: 0 0 2px 2px #0096ff;
  box-shadow: 0 0 2px 2px #0096ff;
}
.mapboxgl-ctrl-group button:focus:not(:focus-visible),
.maplibregl-ctrl-group button:focus:not(:focus-visible) {
  -webkit-box-shadow: none;
  box-shadow: none;
}
.mapboxgl-ctrl-group button:focus:first-child,
.maplibregl-ctrl-group button:focus:first-child {
  border-radius: 4px 4px 0 0;
}
.mapboxgl-ctrl-group button:focus:last-child,
.maplibregl-ctrl-group button:focus:last-child {
  border-radius: 0 0 4px 4px;
}
.mapboxgl-ctrl-group button:focus:only-child,
.maplibregl-ctrl-group button:focus:only-child {
  border-radius: inherit;
}
.mapboxgl-ctrl button.mapboxgl-ctrl-zoom-out .mapboxgl-ctrl-icon,
.maplibregl-ctrl button.maplibregl-ctrl-zoom-out .maplibregl-ctrl-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23333'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13z'/%3E%3C/svg%3E");
}
.mapboxgl-ctrl button.mapboxgl-ctrl-zoom-in .mapboxgl-ctrl-icon,
.maplibregl-ctrl button.maplibregl-ctrl-zoom-in .maplibregl-ctrl-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23333'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5'/%3E%3C/svg%3E");
}
@media (-ms-high-contrast: active) {
  .mapboxgl-ctrl button.mapboxgl-ctrl-zoom-out .mapboxgl-ctrl-icon,
  .maplibregl-ctrl button.maplibregl-ctrl-zoom-out .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13z'/%3E%3C/svg%3E");
  }
  .mapboxgl-ctrl button.mapboxgl-ctrl-zoom-in .mapboxgl-ctrl-icon,
  .maplibregl-ctrl button.maplibregl-ctrl-zoom-in .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5'/%3E%3C/svg%3E");
  }
}
@media (-ms-high-contrast: black-on-white) {
  .mapboxgl-ctrl button.mapboxgl-ctrl-zoom-out .mapboxgl-ctrl-icon,
  .maplibregl-ctrl button.maplibregl-ctrl-zoom-out .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13z'/%3E%3C/svg%3E");
  }
  .mapboxgl-ctrl button.mapboxgl-ctrl-zoom-in .mapboxgl-ctrl-icon,
  .maplibregl-ctrl button.maplibregl-ctrl-zoom-in .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5'/%3E%3C/svg%3E");
  }
}
.mapboxgl-ctrl button.mapboxgl-ctrl-fullscreen .mapboxgl-ctrl-icon,
.maplibregl-ctrl button.maplibregl-ctrl-fullscreen .maplibregl-ctrl-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23333'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1z'/%3E%3C/svg%3E");
}
.mapboxgl-ctrl button.mapboxgl-ctrl-shrink .mapboxgl-ctrl-icon,
.maplibregl-ctrl button.maplibregl-ctrl-shrink .maplibregl-ctrl-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1z'/%3E%3C/svg%3E");
}
@media (-ms-high-contrast: active) {
  .mapboxgl-ctrl button.mapboxgl-ctrl-fullscreen .mapboxgl-ctrl-icon,
  .maplibregl-ctrl button.maplibregl-ctrl-fullscreen .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1z'/%3E%3C/svg%3E");
  }
  .mapboxgl-ctrl button.mapboxgl-ctrl-shrink .mapboxgl-ctrl-icon,
  .maplibregl-ctrl button.maplibregl-ctrl-shrink .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1z'/%3E%3C/svg%3E");
  }
}
@media (-ms-high-contrast: black-on-white) {
  .mapboxgl-ctrl button.mapboxgl-ctrl-fullscreen .mapboxgl-ctrl-icon,
  .maplibregl-ctrl button.maplibregl-ctrl-fullscreen .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1z'/%3E%3C/svg%3E");
  }
  .mapboxgl-ctrl button.mapboxgl-ctrl-shrink .mapboxgl-ctrl-icon,
  .maplibregl-ctrl button.maplibregl-ctrl-shrink .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1z'/%3E%3C/svg%3E");
  }
}
.mapboxgl-ctrl button.mapboxgl-ctrl-compass .mapboxgl-ctrl-icon,
.maplibregl-ctrl button.maplibregl-ctrl-compass .maplibregl-ctrl-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23333'%3E%3Cpath d='m10.5 14 4-8 4 8z'/%3E%3Cpath fill='%23ccc' d='m10.5 16 4 8 4-8z'/%3E%3C/svg%3E");
}
@media (-ms-high-contrast: active) {
  .mapboxgl-ctrl button.mapboxgl-ctrl-compass .mapboxgl-ctrl-icon,
  .maplibregl-ctrl button.maplibregl-ctrl-compass .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff'%3E%3Cpath d='m10.5 14 4-8 4 8z'/%3E%3Cpath fill='%23999' d='m10.5 16 4 8 4-8z'/%3E%3C/svg%3E");
  }
}
@media (-ms-high-contrast: black-on-white) {
  .mapboxgl-ctrl button.mapboxgl-ctrl-compass .mapboxgl-ctrl-icon,
  .maplibregl-ctrl button.maplibregl-ctrl-compass .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29'%3E%3Cpath d='m10.5 14 4-8 4 8z'/%3E%3Cpath fill='%23ccc' d='m10.5 16 4 8 4-8z'/%3E%3C/svg%3E");
  }
}
.mapboxgl-ctrl button.mapboxgl-ctrl-terrain .mapboxgl-ctrl-icon,
.maplibregl-ctrl button.maplibregl-ctrl-terrain .maplibregl-ctrl-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='%23333'%3E%3Cpath d='m1.754 13.406 4.453-4.851 3.09 3.09 3.281 3.277.969-.969-3.309-3.312 3.844-4.121 6.148 6.886h1.082v-.855l-7.207-8.07-4.84 5.187L6.169 6.57l-5.48 5.965v.871ZM.688 16.844h20.625v1.375H.688Zm0 0'/%3E%3C/svg%3E");
}
.mapboxgl-ctrl button.mapboxgl-ctrl-terrain-enabled .mapboxgl-ctrl-icon,
.maplibregl-ctrl button.maplibregl-ctrl-terrain-enabled .maplibregl-ctrl-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='%2333b5e5'%3E%3Cpath d='m1.754 13.406 4.453-4.851 3.09 3.09 3.281 3.277.969-.969-3.309-3.312 3.844-4.121 6.148 6.886h1.082v-.855l-7.207-8.07-4.84 5.187L6.169 6.57l-5.48 5.965v.871ZM.688 16.844h20.625v1.375H.688Zm0 0'/%3E%3C/svg%3E");
}
.mapboxgl-ctrl button.mapboxgl-ctrl-geolocate .mapboxgl-ctrl-icon,
.maplibregl-ctrl button.maplibregl-ctrl-geolocate .maplibregl-ctrl-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23333' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E");
}
.mapboxgl-ctrl button.mapboxgl-ctrl-geolocate:disabled .mapboxgl-ctrl-icon,
.maplibregl-ctrl
  button.maplibregl-ctrl-geolocate:disabled
  .maplibregl-ctrl-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23aaa' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3Cpath fill='red' d='m14 5 1 1-9 9-1-1z'/%3E%3C/svg%3E");
}
.mapboxgl-ctrl
  button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active
  .mapboxgl-ctrl-icon,
.maplibregl-ctrl
  button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-active
  .maplibregl-ctrl-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%2333b5e5' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E");
}
.mapboxgl-ctrl
  button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active-error
  .mapboxgl-ctrl-icon,
.maplibregl-ctrl
  button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-active-error
  .maplibregl-ctrl-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23e58978' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E");
}
.mapboxgl-ctrl
  button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-background
  .mapboxgl-ctrl-icon,
.maplibregl-ctrl
  button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-background
  .maplibregl-ctrl-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%2333b5e5' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3C/svg%3E");
}
.mapboxgl-ctrl
  button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-background-error
  .mapboxgl-ctrl-icon,
.maplibregl-ctrl
  button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-background-error
  .maplibregl-ctrl-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23e54e33' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3C/svg%3E");
}
.mapboxgl-ctrl
  button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-waiting
  .mapboxgl-ctrl-icon,
.maplibregl-ctrl
  button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-waiting
  .maplibregl-ctrl-icon {
  -webkit-animation: maplibregl-spin 2s linear infinite;
  animation: maplibregl-spin 2s linear infinite;
}
@media (-ms-high-contrast: active) {
  .mapboxgl-ctrl button.mapboxgl-ctrl-geolocate .mapboxgl-ctrl-icon,
  .maplibregl-ctrl button.maplibregl-ctrl-geolocate .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E");
  }
  .mapboxgl-ctrl button.mapboxgl-ctrl-geolocate:disabled .mapboxgl-ctrl-icon,
  .maplibregl-ctrl
    button.maplibregl-ctrl-geolocate:disabled
    .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23999' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3Cpath fill='red' d='m14 5 1 1-9 9-1-1z'/%3E%3C/svg%3E");
  }
  .mapboxgl-ctrl
    button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active
    .mapboxgl-ctrl-icon,
  .maplibregl-ctrl
    button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-active
    .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%2333b5e5' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E");
  }
  .mapboxgl-ctrl
    button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active-error
    .mapboxgl-ctrl-icon,
  .maplibregl-ctrl
    button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-active-error
    .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23e58978' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E");
  }
  .mapboxgl-ctrl
    button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-background
    .mapboxgl-ctrl-icon,
  .maplibregl-ctrl
    button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-background
    .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%2333b5e5' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3C/svg%3E");
  }
  .mapboxgl-ctrl
    button.mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-background-error
    .mapboxgl-ctrl-icon,
  .maplibregl-ctrl
    button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-background-error
    .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23e54e33' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3C/svg%3E");
  }
}
@media (-ms-high-contrast: black-on-white) {
  .mapboxgl-ctrl button.mapboxgl-ctrl-geolocate .mapboxgl-ctrl-icon,
  .maplibregl-ctrl button.maplibregl-ctrl-geolocate .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E");
  }
  .mapboxgl-ctrl button.mapboxgl-ctrl-geolocate:disabled .mapboxgl-ctrl-icon,
  .maplibregl-ctrl
    button.maplibregl-ctrl-geolocate:disabled
    .maplibregl-ctrl-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23666' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3Cpath fill='red' d='m14 5 1 1-9 9-1-1z'/%3E%3C/svg%3E");
  }
}
@-webkit-keyframes maplibregl-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(1turn);
    transform: rotate(1turn);
  }
}
@keyframes maplibregl-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(1turn);
    transform: rotate(1turn);
  }
}
a.mapboxgl-ctrl-logo,
a.maplibregl-ctrl-logo {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='23' fill='none'%3E%3Cpath fill='%23000' fill-opacity='.4' fill-rule='evenodd' d='M17.408 16.796h-1.827l2.501-12.095h.198l3.324 6.533.988 2.19.988-2.19 3.258-6.533h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.929 5.644h-.098l-2.914-5.644-.757-1.71-.345 1.71zm1.958-3.42-.726 3.663a1.255 1.255 0 0 1-1.232 1.011h-1.827a1.255 1.255 0 0 1-1.229-1.509l2.501-12.095a1.255 1.255 0 0 1 1.23-1.001h.197a1.25 1.25 0 0 1 1.12.685l3.19 6.273 3.125-6.263a1.25 1.25 0 0 1 1.123-.695h.181a1.255 1.255 0 0 1 1.227.991l1.443 6.71a5 5 0 0 1 .314-.787l.009-.016a4.6 4.6 0 0 1 1.777-1.887c.782-.46 1.668-.667 2.611-.667a4.6 4.6 0 0 1 1.7.32l.306.134c.21-.16.474-.256.759-.256h1.694a1.255 1.255 0 0 1 1.212.925 1.255 1.255 0 0 1 1.212-.925h1.711c.284 0 .545.094.755.252.613-.3 1.312-.45 2.075-.45 1.356 0 2.557.445 3.482 1.4q.47.48.763 1.064V4.701a1.255 1.255 0 0 1 1.255-1.255h1.86A1.255 1.255 0 0 1 54.44 4.7v9.194h2.217c.19 0 .37.043.532.118v-4.77c0-.356.147-.678.385-.906a2.42 2.42 0 0 1-.682-1.71c0-.665.267-1.253.735-1.7a2.45 2.45 0 0 1 1.722-.674 2.43 2.43 0 0 1 1.705.675q.318.302.504.683V4.7a1.255 1.255 0 0 1 1.255-1.255h1.744A1.255 1.255 0 0 1 65.812 4.7v3.335a4.8 4.8 0 0 1 1.526-.246c.938 0 1.817.214 2.59.69a4.47 4.47 0 0 1 1.67 1.743v-.98a1.255 1.255 0 0 1 1.256-1.256h1.777c.233 0 .451.064.639.174a3.4 3.4 0 0 1 1.567-.372c.346 0 .861.02 1.285.232a1.25 1.25 0 0 1 .689 1.004 4.7 4.7 0 0 1 .853-.588c.795-.44 1.675-.647 2.61-.647 1.385 0 2.65.39 3.525 1.396.836.938 1.168 2.173 1.168 3.528q-.001.515-.056 1.051a1.255 1.255 0 0 1-.947 1.09l.408.952a1.255 1.255 0 0 1-.477 1.552c-.418.268-.92.463-1.458.612-.613.171-1.304.244-2.049.244-1.06 0-2.043-.207-2.886-.698l-.015-.008c-.798-.48-1.419-1.135-1.818-1.963l-.004-.008a5.8 5.8 0 0 1-.548-2.512q0-.429.053-.843a1.3 1.3 0 0 1-.333-.086l-.166-.004c-.223 0-.426.062-.643.228-.03.024-.142.139-.142.59v3.883a1.255 1.255 0 0 1-1.256 1.256h-1.777a1.255 1.255 0 0 1-1.256-1.256V15.69l-.032.057a4.8 4.8 0 0 1-1.86 1.833 5.04 5.04 0 0 1-2.484.634 4.5 4.5 0 0 1-1.935-.424 1.25 1.25 0 0 1-.764.258h-1.71a1.255 1.255 0 0 1-1.256-1.255V7.687a2.4 2.4 0 0 1-.428.625c.253.23.412.561.412.93v7.553a1.255 1.255 0 0 1-1.256 1.255h-1.843a1.25 1.25 0 0 1-.894-.373c-.228.23-.544.373-.894.373H51.32a1.255 1.255 0 0 1-1.256-1.255v-1.251l-.061.117a4.7 4.7 0 0 1-1.782 1.884 4.77 4.77 0 0 1-2.485.67 5.6 5.6 0 0 1-1.485-.188l.009 2.764a1.255 1.255 0 0 1-1.255 1.259h-1.729a1.255 1.255 0 0 1-1.255-1.255v-3.537a1.255 1.255 0 0 1-1.167.793h-1.679a1.25 1.25 0 0 1-.77-.263 4.5 4.5 0 0 1-1.945.429c-.885 0-1.724-.21-2.495-.632l-.017-.01a5 5 0 0 1-1.081-.836 1.255 1.255 0 0 1-1.254 1.312h-1.81a1.255 1.255 0 0 1-1.228-.99l-.782-3.625-2.044 3.939a1.25 1.25 0 0 1-1.115.676h-.098a1.25 1.25 0 0 1-1.116-.68l-2.061-3.994zM35.92 16.63l.207-.114.223-.15q.493-.356.735-.785l.061-.118.033 1.332h1.678V9.242h-1.694l-.033 1.267q-.133-.329-.526-.658l-.032-.028a3.2 3.2 0 0 0-.668-.428l-.27-.12a3.3 3.3 0 0 0-1.235-.23q-1.136-.001-1.974.493a3.36 3.36 0 0 0-1.3 1.382q-.445.89-.444 2.074 0 1.2.51 2.107a3.8 3.8 0 0 0 1.382 1.381 3.9 3.9 0 0 0 1.893.477q.795 0 1.455-.33zm-2.789-5.38q-.576.675-.575 1.762 0 1.102.559 1.794.576.675 1.645.675a2.25 2.25 0 0 0 .934-.19 2.2 2.2 0 0 0 .468-.29l.178-.161a2.2 2.2 0 0 0 .397-.561q.244-.5.244-1.15v-.115q0-.708-.296-1.267l-.043-.077a2.2 2.2 0 0 0-.633-.709l-.13-.086-.047-.028a2.1 2.1 0 0 0-1.073-.285q-1.052 0-1.629.692zm2.316 2.706c.163-.17.28-.407.28-.83v-.114c0-.292-.06-.508-.15-.68a.96.96 0 0 0-.353-.389.85.85 0 0 0-.464-.127c-.4 0-.56.114-.664.239l-.01.012c-.148.174-.275.45-.275.945 0 .506.122.801.27.99.097.11.266.224.68.224.303 0 .504-.09.687-.269zm7.545 1.705a2.6 2.6 0 0 0 .331.423q.319.33.755.548l.173.074q.65.255 1.49.255 1.02 0 1.844-.493a3.45 3.45 0 0 0 1.316-1.4q.493-.904.493-2.089 0-1.909-.988-2.913-.988-1.02-2.584-1.02-.898 0-1.575.347a3 3 0 0 0-.415.262l-.199.166a3.4 3.4 0 0 0-.64.82V9.242h-1.712v11.553h1.729l-.017-5.134zm.53-1.138q.206.29.48.5l.155.11.053.034q.51.296 1.119.297 1.07 0 1.645-.675.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.435 0-.835.16a2 2 0 0 0-.284.136 2 2 0 0 0-.363.254 2.2 2.2 0 0 0-.46.569l-.082.162a2.6 2.6 0 0 0-.213 1.072v.115q0 .707.296 1.267l.135.211zm.964-.818a1.1 1.1 0 0 0 .367.385.94.94 0 0 0 .476.118c.423 0 .59-.117.687-.23.159-.194.28-.478.28-.95 0-.53-.133-.8-.266-.952l-.021-.025c-.078-.094-.231-.221-.68-.221a1 1 0 0 0-.503.135l-.012.007a.86.86 0 0 0-.335.343c-.073.133-.132.324-.132.614v.115a1.4 1.4 0 0 0 .14.66zm15.7-6.222q.347-.346.346-.856a1.05 1.05 0 0 0-.345-.79 1.18 1.18 0 0 0-.84-.329q-.51 0-.855.33a1.05 1.05 0 0 0-.346.79q0 .51.346.855.345.346.856.346.51 0 .839-.346zm4.337 9.314.033-1.332q.191.403.59.747l.098.081a4 4 0 0 0 .316.224l.223.122a3.2 3.2 0 0 0 1.44.322 3.8 3.8 0 0 0 1.875-.477 3.5 3.5 0 0 0 1.382-1.366q.527-.89.526-2.09 0-1.184-.444-2.073a3.24 3.24 0 0 0-1.283-1.399q-.823-.51-1.942-.51a3.5 3.5 0 0 0-1.527.344l-.086.043-.165.09a3 3 0 0 0-.33.214q-.432.315-.656.707a2 2 0 0 0-.099.198l.082-1.283V4.701h-1.744v12.095zm.473-2.509a2.5 2.5 0 0 0 .566.7q.117.098.245.18l.144.08a2.1 2.1 0 0 0 .975.232q1.07 0 1.645-.675.576-.69.576-1.778 0-1.102-.576-1.777-.56-.691-1.645-.692a2.2 2.2 0 0 0-1.015.235q-.22.113-.415.282l-.15.142a2.1 2.1 0 0 0-.42.594q-.223.479-.223 1.1v.115q0 .705.293 1.26zm2.616-.293c.157-.191.28-.479.28-.967 0-.51-.13-.79-.276-.961l-.021-.026c-.082-.1-.232-.225-.67-.225a.87.87 0 0 0-.681.279l-.012.011c-.154.155-.274.38-.274.807v.115c0 .285.057.499.144.669a1.1 1.1 0 0 0 .367.405c.137.082.28.123.455.123.423 0 .59-.118.686-.23zm8.266-3.013q.345-.13.724-.14l.069-.002q.493 0 .642.099l.247-1.794q-.196-.099-.717-.099a2.3 2.3 0 0 0-.545.063 2 2 0 0 0-.411.148 2.2 2.2 0 0 0-.4.249 2.5 2.5 0 0 0-.485.499 2.7 2.7 0 0 0-.32.581l-.05.137v-1.48h-1.778v7.553h1.777v-3.884q0-.546.159-.943a1.5 1.5 0 0 1 .466-.636 2.5 2.5 0 0 1 .399-.253 2 2 0 0 1 .224-.099zm9.784 2.656.05-.922q0-1.743-.856-2.698-.838-.97-2.584-.97-1.119-.001-2.007.493a3.46 3.46 0 0 0-1.4 1.382q-.493.906-.493 2.106 0 1.07.428 1.975.428.89 1.332 1.432.906.526 2.255.526.973 0 1.668-.185l.044-.012.135-.04q.613-.184.984-.421l-.542-1.267q-.3.162-.642.274l-.297.087q-.51.131-1.3.131-.954 0-1.497-.444a1.6 1.6 0 0 1-.192-.193q-.366-.44-.512-1.234l-.004-.021zm-5.427-1.256-.003.022h3.752v-.138q-.011-.727-.288-1.118a1 1 0 0 0-.156-.176q-.46-.428-1.316-.428-.986 0-1.494.604-.379.45-.494 1.234zm-27.053 2.77V4.7h-1.86v12.095h5.333V15.15zm7.103-5.908v7.553h-1.843V9.242h1.843z'/%3E%3Cpath fill='%23fff' d='m19.63 11.151-.757-1.71-.345 1.71-1.12 5.644h-1.827L18.083 4.7h.197l3.325 6.533.988 2.19.988-2.19L26.839 4.7h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.93 5.644h-.098l-2.913-5.644zm14.836 5.81q-1.02 0-1.893-.478a3.8 3.8 0 0 1-1.381-1.382q-.51-.906-.51-2.106 0-1.185.444-2.074a3.36 3.36 0 0 1 1.3-1.382q.839-.494 1.974-.494a3.3 3.3 0 0 1 1.234.231 3.3 3.3 0 0 1 .97.575q.396.33.527.659l.033-1.267h1.694v7.553H37.18l-.033-1.332q-.279.593-1.02 1.053a3.17 3.17 0 0 1-1.662.444zm.296-1.482q.938 0 1.58-.642.642-.66.642-1.711v-.115q0-.708-.296-1.267a2.2 2.2 0 0 0-.807-.872 2.1 2.1 0 0 0-1.119-.313q-1.053 0-1.629.692-.575.675-.575 1.76 0 1.103.559 1.795.577.675 1.645.675zm6.521-6.237h1.711v1.4q.906-1.597 2.83-1.597 1.596 0 2.584 1.02.988 1.005.988 2.914 0 1.185-.493 2.09a3.46 3.46 0 0 1-1.316 1.399 3.5 3.5 0 0 1-1.844.493q-.954 0-1.662-.329a2.67 2.67 0 0 1-1.086-.97l.017 5.134h-1.728zm4.048 6.22q1.07 0 1.645-.674.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.592 0-1.12.296-.51.28-.822.823-.296.527-.296 1.234v.115q0 .708.296 1.267.313.543.823.855.51.296 1.119.297z'/%3E%3Cpath fill='%23e1e3e9' d='M51.325 4.7h1.86v10.45h3.473v1.646h-5.333zm7.12 4.542h1.843v7.553h-1.843zm.905-1.415a1.16 1.16 0 0 1-.856-.346 1.17 1.17 0 0 1-.346-.856 1.05 1.05 0 0 1 .346-.79q.346-.329.856-.329.494 0 .839.33a1.05 1.05 0 0 1 .345.79 1.16 1.16 0 0 1-.345.855q-.33.346-.84.346zm7.875 9.133a3.17 3.17 0 0 1-1.662-.444q-.723-.46-1.004-1.053l-.033 1.332h-1.71V4.701h1.743v4.657l-.082 1.283q.279-.658 1.086-1.119a3.5 3.5 0 0 1 1.778-.477q1.119 0 1.942.51a3.24 3.24 0 0 1 1.283 1.4q.445.888.444 2.072 0 1.201-.526 2.09a3.5 3.5 0 0 1-1.382 1.366 3.8 3.8 0 0 1-1.876.477zm-.296-1.481q1.069 0 1.645-.675.577-.69.577-1.778 0-1.102-.577-1.776-.56-.691-1.645-.692a2.12 2.12 0 0 0-1.58.659q-.642.641-.642 1.694v.115q0 .71.296 1.267a2.4 2.4 0 0 0 .807.872 2.1 2.1 0 0 0 1.119.313zm5.927-6.237h1.777v1.481q.263-.757.856-1.217a2.14 2.14 0 0 1 1.349-.46q.527 0 .724.098l-.247 1.794q-.149-.099-.642-.099-.774 0-1.416.494-.626.493-.626 1.58v3.883h-1.777V9.242zm9.534 7.718q-1.35 0-2.255-.526-.904-.543-1.332-1.432a4.6 4.6 0 0 1-.428-1.975q0-1.2.493-2.106a3.46 3.46 0 0 1 1.4-1.382q.889-.495 2.007-.494 1.744 0 2.584.97.855.956.856 2.7 0 .444-.05.92h-5.43q.18 1.005.708 1.45.542.443 1.497.443.79 0 1.3-.131a4 4 0 0 0 .938-.362l.542 1.267q-.411.263-1.119.46-.708.198-1.711.197zm1.596-4.558q.016-1.02-.444-1.432-.46-.428-1.316-.428-1.728 0-1.991 1.86z'/%3E%3Cg fill-rule='evenodd' stroke-width='1.036'%3E%3Cpath fill='%23000' fill-opacity='.4' d='m8.166 16.146-.002.002a1.54 1.54 0 0 1-2.009 0l-.002-.002-.043-.034-.002-.002-.199-.162H4.377a.657.657 0 0 0-.659.659v1.84a.657.657 0 0 0 .659.659h5.565a.657.657 0 0 0 .659-.659v-1.84a.657.657 0 0 0-.659-.659H8.411l-.202.164zm-1.121-.905a.3.3 0 0 0 .113.023.3.3 0 0 0 .189-.07l.077-.063c.634-.508 4.672-3.743 4.672-7.575 0-2.55-2.215-4.625-4.938-4.625S2.221 5.006 2.221 7.556c0 3.225 2.86 6.027 4.144 7.137h.004l.04.038.484.4.077.063a1 1 0 0 0 .074.047zm-2.52-.548a17 17 0 0 1-1.183-1.315C2.187 11.942.967 9.897.967 7.555c0-3.319 2.855-5.88 6.192-5.88s6.193 2.561 6.193 5.881c0 2.34-1.22 4.387-2.376 5.822a17 17 0 0 1-1.182 1.315h.15a1.91 1.91 0 0 1 1.914 1.914v1.84a1.91 1.91 0 0 1-1.914 1.914H4.377a1.91 1.91 0 0 1-1.914-1.914v-1.84a1.91 1.91 0 0 1 1.914-1.914zm3.82-6.935c0 .692-.55 1.222-1.187 1.222s-1.185-.529-1.185-1.222.548-1.222 1.185-1.222c.638 0 1.186.529 1.186 1.222zm-1.186 2.477c1.348 0 2.442-1.11 2.442-2.478S8.507 5.28 7.159 5.28 4.72 6.39 4.72 7.758s1.092 2.477 2.44 2.477zm2.048 7.71H5.114v-.838h4.093z'/%3E%3Cpath fill='%23e1e3e9' d='M2.222 7.555c0-2.55 2.214-4.625 4.937-4.625s4.938 2.075 4.938 4.625c0 3.832-4.038 7.068-4.672 7.575l-.077.063a.3.3 0 0 1-.189.07.3.3 0 0 1-.188-.07l-.077-.063c-.634-.507-4.672-3.743-4.672-7.575m4.937 2.68c1.348 0 2.442-1.11 2.442-2.478S8.507 5.28 7.159 5.28 4.72 6.39 4.72 7.758s1.092 2.477 2.44 2.477z'/%3E%3Cpath fill='%23fff' d='M4.377 15.948a.657.657 0 0 0-.659.659v1.84a.657.657 0 0 0 .659.659h5.565a.657.657 0 0 0 .659-.659v-1.84a.657.657 0 0 0-.659-.659zm4.83 1.16H5.114v.838h4.093z'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
  cursor: pointer;
  display: block;
  height: 23px;
  margin: 0 0 -4px -4px;
  overflow: hidden;
  width: 88px;
}
a.mapboxgl-ctrl-logo.mapboxgl-compact,
a.maplibregl-ctrl-logo.maplibregl-compact {
  width: 14px;
}
@media (-ms-high-contrast: active) {
  a.mapboxgl-ctrl-logo,
  a.maplibregl-ctrl-logo {
    background-color: transparent;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='23' fill='none'%3E%3Cpath fill='%23000' fill-opacity='.4' fill-rule='evenodd' d='M17.408 16.796h-1.827l2.501-12.095h.198l3.324 6.533.988 2.19.988-2.19 3.258-6.533h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.929 5.644h-.098l-2.914-5.644-.757-1.71-.345 1.71zm1.958-3.42-.726 3.663a1.255 1.255 0 0 1-1.232 1.011h-1.827a1.255 1.255 0 0 1-1.229-1.509l2.501-12.095a1.255 1.255 0 0 1 1.23-1.001h.197a1.25 1.25 0 0 1 1.12.685l3.19 6.273 3.125-6.263a1.25 1.25 0 0 1 1.123-.695h.181a1.255 1.255 0 0 1 1.227.991l1.443 6.71a5 5 0 0 1 .314-.787l.009-.016a4.6 4.6 0 0 1 1.777-1.887c.782-.46 1.668-.667 2.611-.667a4.6 4.6 0 0 1 1.7.32l.306.134c.21-.16.474-.256.759-.256h1.694a1.255 1.255 0 0 1 1.212.925 1.255 1.255 0 0 1 1.212-.925h1.711c.284 0 .545.094.755.252.613-.3 1.312-.45 2.075-.45 1.356 0 2.557.445 3.482 1.4q.47.48.763 1.064V4.701a1.255 1.255 0 0 1 1.255-1.255h1.86A1.255 1.255 0 0 1 54.44 4.7v9.194h2.217c.19 0 .37.043.532.118v-4.77c0-.356.147-.678.385-.906a2.42 2.42 0 0 1-.682-1.71c0-.665.267-1.253.735-1.7a2.45 2.45 0 0 1 1.722-.674 2.43 2.43 0 0 1 1.705.675q.318.302.504.683V4.7a1.255 1.255 0 0 1 1.255-1.255h1.744A1.255 1.255 0 0 1 65.812 4.7v3.335a4.8 4.8 0 0 1 1.526-.246c.938 0 1.817.214 2.59.69a4.47 4.47 0 0 1 1.67 1.743v-.98a1.255 1.255 0 0 1 1.256-1.256h1.777c.233 0 .451.064.639.174a3.4 3.4 0 0 1 1.567-.372c.346 0 .861.02 1.285.232a1.25 1.25 0 0 1 .689 1.004 4.7 4.7 0 0 1 .853-.588c.795-.44 1.675-.647 2.61-.647 1.385 0 2.65.39 3.525 1.396.836.938 1.168 2.173 1.168 3.528q-.001.515-.056 1.051a1.255 1.255 0 0 1-.947 1.09l.408.952a1.255 1.255 0 0 1-.477 1.552c-.418.268-.92.463-1.458.612-.613.171-1.304.244-2.049.244-1.06 0-2.043-.207-2.886-.698l-.015-.008c-.798-.48-1.419-1.135-1.818-1.963l-.004-.008a5.8 5.8 0 0 1-.548-2.512q0-.429.053-.843a1.3 1.3 0 0 1-.333-.086l-.166-.004c-.223 0-.426.062-.643.228-.03.024-.142.139-.142.59v3.883a1.255 1.255 0 0 1-1.256 1.256h-1.777a1.255 1.255 0 0 1-1.256-1.256V15.69l-.032.057a4.8 4.8 0 0 1-1.86 1.833 5.04 5.04 0 0 1-2.484.634 4.5 4.5 0 0 1-1.935-.424 1.25 1.25 0 0 1-.764.258h-1.71a1.255 1.255 0 0 1-1.256-1.255V7.687a2.4 2.4 0 0 1-.428.625c.253.23.412.561.412.93v7.553a1.255 1.255 0 0 1-1.256 1.255h-1.843a1.25 1.25 0 0 1-.894-.373c-.228.23-.544.373-.894.373H51.32a1.255 1.255 0 0 1-1.256-1.255v-1.251l-.061.117a4.7 4.7 0 0 1-1.782 1.884 4.77 4.77 0 0 1-2.485.67 5.6 5.6 0 0 1-1.485-.188l.009 2.764a1.255 1.255 0 0 1-1.255 1.259h-1.729a1.255 1.255 0 0 1-1.255-1.255v-3.537a1.255 1.255 0 0 1-1.167.793h-1.679a1.25 1.25 0 0 1-.77-.263 4.5 4.5 0 0 1-1.945.429c-.885 0-1.724-.21-2.495-.632l-.017-.01a5 5 0 0 1-1.081-.836 1.255 1.255 0 0 1-1.254 1.312h-1.81a1.255 1.255 0 0 1-1.228-.99l-.782-3.625-2.044 3.939a1.25 1.25 0 0 1-1.115.676h-.098a1.25 1.25 0 0 1-1.116-.68l-2.061-3.994zM35.92 16.63l.207-.114.223-.15q.493-.356.735-.785l.061-.118.033 1.332h1.678V9.242h-1.694l-.033 1.267q-.133-.329-.526-.658l-.032-.028a3.2 3.2 0 0 0-.668-.428l-.27-.12a3.3 3.3 0 0 0-1.235-.23q-1.136-.001-1.974.493a3.36 3.36 0 0 0-1.3 1.382q-.445.89-.444 2.074 0 1.2.51 2.107a3.8 3.8 0 0 0 1.382 1.381 3.9 3.9 0 0 0 1.893.477q.795 0 1.455-.33zm-2.789-5.38q-.576.675-.575 1.762 0 1.102.559 1.794.576.675 1.645.675a2.25 2.25 0 0 0 .934-.19 2.2 2.2 0 0 0 .468-.29l.178-.161a2.2 2.2 0 0 0 .397-.561q.244-.5.244-1.15v-.115q0-.708-.296-1.267l-.043-.077a2.2 2.2 0 0 0-.633-.709l-.13-.086-.047-.028a2.1 2.1 0 0 0-1.073-.285q-1.052 0-1.629.692zm2.316 2.706c.163-.17.28-.407.28-.83v-.114c0-.292-.06-.508-.15-.68a.96.96 0 0 0-.353-.389.85.85 0 0 0-.464-.127c-.4 0-.56.114-.664.239l-.01.012c-.148.174-.275.45-.275.945 0 .506.122.801.27.99.097.11.266.224.68.224.303 0 .504-.09.687-.269zm7.545 1.705a2.6 2.6 0 0 0 .331.423q.319.33.755.548l.173.074q.65.255 1.49.255 1.02 0 1.844-.493a3.45 3.45 0 0 0 1.316-1.4q.493-.904.493-2.089 0-1.909-.988-2.913-.988-1.02-2.584-1.02-.898 0-1.575.347a3 3 0 0 0-.415.262l-.199.166a3.4 3.4 0 0 0-.64.82V9.242h-1.712v11.553h1.729l-.017-5.134zm.53-1.138q.206.29.48.5l.155.11.053.034q.51.296 1.119.297 1.07 0 1.645-.675.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.435 0-.835.16a2 2 0 0 0-.284.136 2 2 0 0 0-.363.254 2.2 2.2 0 0 0-.46.569l-.082.162a2.6 2.6 0 0 0-.213 1.072v.115q0 .707.296 1.267l.135.211zm.964-.818a1.1 1.1 0 0 0 .367.385.94.94 0 0 0 .476.118c.423 0 .59-.117.687-.23.159-.194.28-.478.28-.95 0-.53-.133-.8-.266-.952l-.021-.025c-.078-.094-.231-.221-.68-.221a1 1 0 0 0-.503.135l-.012.007a.86.86 0 0 0-.335.343c-.073.133-.132.324-.132.614v.115a1.4 1.4 0 0 0 .14.66zm15.7-6.222q.347-.346.346-.856a1.05 1.05 0 0 0-.345-.79 1.18 1.18 0 0 0-.84-.329q-.51 0-.855.33a1.05 1.05 0 0 0-.346.79q0 .51.346.855.345.346.856.346.51 0 .839-.346zm4.337 9.314.033-1.332q.191.403.59.747l.098.081a4 4 0 0 0 .316.224l.223.122a3.2 3.2 0 0 0 1.44.322 3.8 3.8 0 0 0 1.875-.477 3.5 3.5 0 0 0 1.382-1.366q.527-.89.526-2.09 0-1.184-.444-2.073a3.24 3.24 0 0 0-1.283-1.399q-.823-.51-1.942-.51a3.5 3.5 0 0 0-1.527.344l-.086.043-.165.09a3 3 0 0 0-.33.214q-.432.315-.656.707a2 2 0 0 0-.099.198l.082-1.283V4.701h-1.744v12.095zm.473-2.509a2.5 2.5 0 0 0 .566.7q.117.098.245.18l.144.08a2.1 2.1 0 0 0 .975.232q1.07 0 1.645-.675.576-.69.576-1.778 0-1.102-.576-1.777-.56-.691-1.645-.692a2.2 2.2 0 0 0-1.015.235q-.22.113-.415.282l-.15.142a2.1 2.1 0 0 0-.42.594q-.223.479-.223 1.1v.115q0 .705.293 1.26zm2.616-.293c.157-.191.28-.479.28-.967 0-.51-.13-.79-.276-.961l-.021-.026c-.082-.1-.232-.225-.67-.225a.87.87 0 0 0-.681.279l-.012.011c-.154.155-.274.38-.274.807v.115c0 .285.057.499.144.669a1.1 1.1 0 0 0 .367.405c.137.082.28.123.455.123.423 0 .59-.118.686-.23zm8.266-3.013q.345-.13.724-.14l.069-.002q.493 0 .642.099l.247-1.794q-.196-.099-.717-.099a2.3 2.3 0 0 0-.545.063 2 2 0 0 0-.411.148 2.2 2.2 0 0 0-.4.249 2.5 2.5 0 0 0-.485.499 2.7 2.7 0 0 0-.32.581l-.05.137v-1.48h-1.778v7.553h1.777v-3.884q0-.546.159-.943a1.5 1.5 0 0 1 .466-.636 2.5 2.5 0 0 1 .399-.253 2 2 0 0 1 .224-.099zm9.784 2.656.05-.922q0-1.743-.856-2.698-.838-.97-2.584-.97-1.119-.001-2.007.493a3.46 3.46 0 0 0-1.4 1.382q-.493.906-.493 2.106 0 1.07.428 1.975.428.89 1.332 1.432.906.526 2.255.526.973 0 1.668-.185l.044-.012.135-.04q.613-.184.984-.421l-.542-1.267q-.3.162-.642.274l-.297.087q-.51.131-1.3.131-.954 0-1.497-.444a1.6 1.6 0 0 1-.192-.193q-.366-.44-.512-1.234l-.004-.021zm-5.427-1.256-.003.022h3.752v-.138q-.011-.727-.288-1.118a1 1 0 0 0-.156-.176q-.46-.428-1.316-.428-.986 0-1.494.604-.379.45-.494 1.234zm-27.053 2.77V4.7h-1.86v12.095h5.333V15.15zm7.103-5.908v7.553h-1.843V9.242h1.843z'/%3E%3Cpath fill='%23fff' d='m19.63 11.151-.757-1.71-.345 1.71-1.12 5.644h-1.827L18.083 4.7h.197l3.325 6.533.988 2.19.988-2.19L26.839 4.7h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.93 5.644h-.098l-2.913-5.644zm14.836 5.81q-1.02 0-1.893-.478a3.8 3.8 0 0 1-1.381-1.382q-.51-.906-.51-2.106 0-1.185.444-2.074a3.36 3.36 0 0 1 1.3-1.382q.839-.494 1.974-.494a3.3 3.3 0 0 1 1.234.231 3.3 3.3 0 0 1 .97.575q.396.33.527.659l.033-1.267h1.694v7.553H37.18l-.033-1.332q-.279.593-1.02 1.053a3.17 3.17 0 0 1-1.662.444zm.296-1.482q.938 0 1.58-.642.642-.66.642-1.711v-.115q0-.708-.296-1.267a2.2 2.2 0 0 0-.807-.872 2.1 2.1 0 0 0-1.119-.313q-1.053 0-1.629.692-.575.675-.575 1.76 0 1.103.559 1.795.577.675 1.645.675zm6.521-6.237h1.711v1.4q.906-1.597 2.83-1.597 1.596 0 2.584 1.02.988 1.005.988 2.914 0 1.185-.493 2.09a3.46 3.46 0 0 1-1.316 1.399 3.5 3.5 0 0 1-1.844.493q-.954 0-1.662-.329a2.67 2.67 0 0 1-1.086-.97l.017 5.134h-1.728zm4.048 6.22q1.07 0 1.645-.674.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.592 0-1.12.296-.51.28-.822.823-.296.527-.296 1.234v.115q0 .708.296 1.267.313.543.823.855.51.296 1.119.297z'/%3E%3Cpath fill='%23e1e3e9' d='M51.325 4.7h1.86v10.45h3.473v1.646h-5.333zm7.12 4.542h1.843v7.553h-1.843zm.905-1.415a1.16 1.16 0 0 1-.856-.346 1.17 1.17 0 0 1-.346-.856 1.05 1.05 0 0 1 .346-.79q.346-.329.856-.329.494 0 .839.33a1.05 1.05 0 0 1 .345.79 1.16 1.16 0 0 1-.345.855q-.33.346-.84.346zm7.875 9.133a3.17 3.17 0 0 1-1.662-.444q-.723-.46-1.004-1.053l-.033 1.332h-1.71V4.701h1.743v4.657l-.082 1.283q.279-.658 1.086-1.119a3.5 3.5 0 0 1 1.778-.477q1.119 0 1.942.51a3.24 3.24 0 0 1 1.283 1.4q.445.888.444 2.072 0 1.201-.526 2.09a3.5 3.5 0 0 1-1.382 1.366 3.8 3.8 0 0 1-1.876.477zm-.296-1.481q1.069 0 1.645-.675.577-.69.577-1.778 0-1.102-.577-1.776-.56-.691-1.645-.692a2.12 2.12 0 0 0-1.58.659q-.642.641-.642 1.694v.115q0 .71.296 1.267a2.4 2.4 0 0 0 .807.872 2.1 2.1 0 0 0 1.119.313zm5.927-6.237h1.777v1.481q.263-.757.856-1.217a2.14 2.14 0 0 1 1.349-.46q.527 0 .724.098l-.247 1.794q-.149-.099-.642-.099-.774 0-1.416.494-.626.493-.626 1.58v3.883h-1.777V9.242zm9.534 7.718q-1.35 0-2.255-.526-.904-.543-1.332-1.432a4.6 4.6 0 0 1-.428-1.975q0-1.2.493-2.106a3.46 3.46 0 0 1 1.4-1.382q.889-.495 2.007-.494 1.744 0 2.584.97.855.956.856 2.7 0 .444-.05.92h-5.43q.18 1.005.708 1.45.542.443 1.497.443.79 0 1.3-.131a4 4 0 0 0 .938-.362l.542 1.267q-.411.263-1.119.46-.708.198-1.711.197zm1.596-4.558q.016-1.02-.444-1.432-.46-.428-1.316-.428-1.728 0-1.991 1.86z'/%3E%3Cg fill-rule='evenodd' stroke-width='1.036'%3E%3Cpath fill='%23000' fill-opacity='.4' d='m8.166 16.146-.002.002a1.54 1.54 0 0 1-2.009 0l-.002-.002-.043-.034-.002-.002-.199-.162H4.377a.657.657 0 0 0-.659.659v1.84a.657.657 0 0 0 .659.659h5.565a.657.657 0 0 0 .659-.659v-1.84a.657.657 0 0 0-.659-.659H8.411l-.202.164zm-1.121-.905a.3.3 0 0 0 .113.023.3.3 0 0 0 .189-.07l.077-.063c.634-.508 4.672-3.743 4.672-7.575 0-2.55-2.215-4.625-4.938-4.625S2.221 5.006 2.221 7.556c0 3.225 2.86 6.027 4.144 7.137h.004l.04.038.484.4.077.063a1 1 0 0 0 .074.047zm-2.52-.548a17 17 0 0 1-1.183-1.315C2.187 11.942.967 9.897.967 7.555c0-3.319 2.855-5.88 6.192-5.88s6.193 2.561 6.193 5.881c0 2.34-1.22 4.387-2.376 5.822a17 17 0 0 1-1.182 1.315h.15a1.91 1.91 0 0 1 1.914 1.914v1.84a1.91 1.91 0 0 1-1.914 1.914H4.377a1.91 1.91 0 0 1-1.914-1.914v-1.84a1.91 1.91 0 0 1 1.914-1.914zm3.82-6.935c0 .692-.55 1.222-1.187 1.222s-1.185-.529-1.185-1.222.548-1.222 1.185-1.222c.638 0 1.186.529 1.186 1.222zm-1.186 2.477c1.348 0 2.442-1.11 2.442-2.478S8.507 5.28 7.159 5.28 4.72 6.39 4.72 7.758s1.092 2.477 2.44 2.477zm2.048 7.71H5.114v-.838h4.093z'/%3E%3Cpath fill='%23e1e3e9' d='M2.222 7.555c0-2.55 2.214-4.625 4.937-4.625s4.938 2.075 4.938 4.625c0 3.832-4.038 7.068-4.672 7.575l-.077.063a.3.3 0 0 1-.189.07.3.3 0 0 1-.188-.07l-.077-.063c-.634-.507-4.672-3.743-4.672-7.575m4.937 2.68c1.348 0 2.442-1.11 2.442-2.478S8.507 5.28 7.159 5.28 4.72 6.39 4.72 7.758s1.092 2.477 2.44 2.477z'/%3E%3Cpath fill='%23fff' d='M4.377 15.948a.657.657 0 0 0-.659.659v1.84a.657.657 0 0 0 .659.659h5.565a.657.657 0 0 0 .659-.659v-1.84a.657.657 0 0 0-.659-.659zm4.83 1.16H5.114v.838h4.093z'/%3E%3C/g%3E%3C/svg%3E");
  }
}
@media (-ms-high-contrast: black-on-white) {
  a.mapboxgl-ctrl-logo,
  a.maplibregl-ctrl-logo {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='23' fill='none'%3E%3Cpath fill='%23000' fill-opacity='.4' fill-rule='evenodd' d='M17.408 16.796h-1.827l2.501-12.095h.198l3.324 6.533.988 2.19.988-2.19 3.258-6.533h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.929 5.644h-.098l-2.914-5.644-.757-1.71-.345 1.71zm1.958-3.42-.726 3.663a1.255 1.255 0 0 1-1.232 1.011h-1.827a1.255 1.255 0 0 1-1.229-1.509l2.501-12.095a1.255 1.255 0 0 1 1.23-1.001h.197a1.25 1.25 0 0 1 1.12.685l3.19 6.273 3.125-6.263a1.25 1.25 0 0 1 1.123-.695h.181a1.255 1.255 0 0 1 1.227.991l1.443 6.71a5 5 0 0 1 .314-.787l.009-.016a4.6 4.6 0 0 1 1.777-1.887c.782-.46 1.668-.667 2.611-.667a4.6 4.6 0 0 1 1.7.32l.306.134c.21-.16.474-.256.759-.256h1.694a1.255 1.255 0 0 1 1.212.925 1.255 1.255 0 0 1 1.212-.925h1.711c.284 0 .545.094.755.252.613-.3 1.312-.45 2.075-.45 1.356 0 2.557.445 3.482 1.4q.47.48.763 1.064V4.701a1.255 1.255 0 0 1 1.255-1.255h1.86A1.255 1.255 0 0 1 54.44 4.7v9.194h2.217c.19 0 .37.043.532.118v-4.77c0-.356.147-.678.385-.906a2.42 2.42 0 0 1-.682-1.71c0-.665.267-1.253.735-1.7a2.45 2.45 0 0 1 1.722-.674 2.43 2.43 0 0 1 1.705.675q.318.302.504.683V4.7a1.255 1.255 0 0 1 1.255-1.255h1.744A1.255 1.255 0 0 1 65.812 4.7v3.335a4.8 4.8 0 0 1 1.526-.246c.938 0 1.817.214 2.59.69a4.47 4.47 0 0 1 1.67 1.743v-.98a1.255 1.255 0 0 1 1.256-1.256h1.777c.233 0 .451.064.639.174a3.4 3.4 0 0 1 1.567-.372c.346 0 .861.02 1.285.232a1.25 1.25 0 0 1 .689 1.004 4.7 4.7 0 0 1 .853-.588c.795-.44 1.675-.647 2.61-.647 1.385 0 2.65.39 3.525 1.396.836.938 1.168 2.173 1.168 3.528q-.001.515-.056 1.051a1.255 1.255 0 0 1-.947 1.09l.408.952a1.255 1.255 0 0 1-.477 1.552c-.418.268-.92.463-1.458.612-.613.171-1.304.244-2.049.244-1.06 0-2.043-.207-2.886-.698l-.015-.008c-.798-.48-1.419-1.135-1.818-1.963l-.004-.008a5.8 5.8 0 0 1-.548-2.512q0-.429.053-.843a1.3 1.3 0 0 1-.333-.086l-.166-.004c-.223 0-.426.062-.643.228-.03.024-.142.139-.142.59v3.883a1.255 1.255 0 0 1-1.256 1.256h-1.777a1.255 1.255 0 0 1-1.256-1.256V15.69l-.032.057a4.8 4.8 0 0 1-1.86 1.833 5.04 5.04 0 0 1-2.484.634 4.5 4.5 0 0 1-1.935-.424 1.25 1.25 0 0 1-.764.258h-1.71a1.255 1.255 0 0 1-1.256-1.255V7.687a2.4 2.4 0 0 1-.428.625c.253.23.412.561.412.93v7.553a1.255 1.255 0 0 1-1.256 1.255h-1.843a1.25 1.25 0 0 1-.894-.373c-.228.23-.544.373-.894.373H51.32a1.255 1.255 0 0 1-1.256-1.255v-1.251l-.061.117a4.7 4.7 0 0 1-1.782 1.884 4.77 4.77 0 0 1-2.485.67 5.6 5.6 0 0 1-1.485-.188l.009 2.764a1.255 1.255 0 0 1-1.255 1.259h-1.729a1.255 1.255 0 0 1-1.255-1.255v-3.537a1.255 1.255 0 0 1-1.167.793h-1.679a1.25 1.25 0 0 1-.77-.263 4.5 4.5 0 0 1-1.945.429c-.885 0-1.724-.21-2.495-.632l-.017-.01a5 5 0 0 1-1.081-.836 1.255 1.255 0 0 1-1.254 1.312h-1.81a1.255 1.255 0 0 1-1.228-.99l-.782-3.625-2.044 3.939a1.25 1.25 0 0 1-1.115.676h-.098a1.25 1.25 0 0 1-1.116-.68l-2.061-3.994zM35.92 16.63l.207-.114.223-.15q.493-.356.735-.785l.061-.118.033 1.332h1.678V9.242h-1.694l-.033 1.267q-.133-.329-.526-.658l-.032-.028a3.2 3.2 0 0 0-.668-.428l-.27-.12a3.3 3.3 0 0 0-1.235-.23q-1.136-.001-1.974.493a3.36 3.36 0 0 0-1.3 1.382q-.445.89-.444 2.074 0 1.2.51 2.107a3.8 3.8 0 0 0 1.382 1.381 3.9 3.9 0 0 0 1.893.477q.795 0 1.455-.33zm-2.789-5.38q-.576.675-.575 1.762 0 1.102.559 1.794.576.675 1.645.675a2.25 2.25 0 0 0 .934-.19 2.2 2.2 0 0 0 .468-.29l.178-.161a2.2 2.2 0 0 0 .397-.561q.244-.5.244-1.15v-.115q0-.708-.296-1.267l-.043-.077a2.2 2.2 0 0 0-.633-.709l-.13-.086-.047-.028a2.1 2.1 0 0 0-1.073-.285q-1.052 0-1.629.692zm2.316 2.706c.163-.17.28-.407.28-.83v-.114c0-.292-.06-.508-.15-.68a.96.96 0 0 0-.353-.389.85.85 0 0 0-.464-.127c-.4 0-.56.114-.664.239l-.01.012c-.148.174-.275.45-.275.945 0 .506.122.801.27.99.097.11.266.224.68.224.303 0 .504-.09.687-.269zm7.545 1.705a2.6 2.6 0 0 0 .331.423q.319.33.755.548l.173.074q.65.255 1.49.255 1.02 0 1.844-.493a3.45 3.45 0 0 0 1.316-1.4q.493-.904.493-2.089 0-1.909-.988-2.913-.988-1.02-2.584-1.02-.898 0-1.575.347a3 3 0 0 0-.415.262l-.199.166a3.4 3.4 0 0 0-.64.82V9.242h-1.712v11.553h1.729l-.017-5.134zm.53-1.138q.206.29.48.5l.155.11.053.034q.51.296 1.119.297 1.07 0 1.645-.675.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.435 0-.835.16a2 2 0 0 0-.284.136 2 2 0 0 0-.363.254 2.2 2.2 0 0 0-.46.569l-.082.162a2.6 2.6 0 0 0-.213 1.072v.115q0 .707.296 1.267l.135.211zm.964-.818a1.1 1.1 0 0 0 .367.385.94.94 0 0 0 .476.118c.423 0 .59-.117.687-.23.159-.194.28-.478.28-.95 0-.53-.133-.8-.266-.952l-.021-.025c-.078-.094-.231-.221-.68-.221a1 1 0 0 0-.503.135l-.012.007a.86.86 0 0 0-.335.343c-.073.133-.132.324-.132.614v.115a1.4 1.4 0 0 0 .14.66zm15.7-6.222q.347-.346.346-.856a1.05 1.05 0 0 0-.345-.79 1.18 1.18 0 0 0-.84-.329q-.51 0-.855.33a1.05 1.05 0 0 0-.346.79q0 .51.346.855.345.346.856.346.51 0 .839-.346zm4.337 9.314.033-1.332q.191.403.59.747l.098.081a4 4 0 0 0 .316.224l.223.122a3.2 3.2 0 0 0 1.44.322 3.8 3.8 0 0 0 1.875-.477 3.5 3.5 0 0 0 1.382-1.366q.527-.89.526-2.09 0-1.184-.444-2.073a3.24 3.24 0 0 0-1.283-1.399q-.823-.51-1.942-.51a3.5 3.5 0 0 0-1.527.344l-.086.043-.165.09a3 3 0 0 0-.33.214q-.432.315-.656.707a2 2 0 0 0-.099.198l.082-1.283V4.701h-1.744v12.095zm.473-2.509a2.5 2.5 0 0 0 .566.7q.117.098.245.18l.144.08a2.1 2.1 0 0 0 .975.232q1.07 0 1.645-.675.576-.69.576-1.778 0-1.102-.576-1.777-.56-.691-1.645-.692a2.2 2.2 0 0 0-1.015.235q-.22.113-.415.282l-.15.142a2.1 2.1 0 0 0-.42.594q-.223.479-.223 1.1v.115q0 .705.293 1.26zm2.616-.293c.157-.191.28-.479.28-.967 0-.51-.13-.79-.276-.961l-.021-.026c-.082-.1-.232-.225-.67-.225a.87.87 0 0 0-.681.279l-.012.011c-.154.155-.274.38-.274.807v.115c0 .285.057.499.144.669a1.1 1.1 0 0 0 .367.405c.137.082.28.123.455.123.423 0 .59-.118.686-.23zm8.266-3.013q.345-.13.724-.14l.069-.002q.493 0 .642.099l.247-1.794q-.196-.099-.717-.099a2.3 2.3 0 0 0-.545.063 2 2 0 0 0-.411.148 2.2 2.2 0 0 0-.4.249 2.5 2.5 0 0 0-.485.499 2.7 2.7 0 0 0-.32.581l-.05.137v-1.48h-1.778v7.553h1.777v-3.884q0-.546.159-.943a1.5 1.5 0 0 1 .466-.636 2.5 2.5 0 0 1 .399-.253 2 2 0 0 1 .224-.099zm9.784 2.656.05-.922q0-1.743-.856-2.698-.838-.97-2.584-.97-1.119-.001-2.007.493a3.46 3.46 0 0 0-1.4 1.382q-.493.906-.493 2.106 0 1.07.428 1.975.428.89 1.332 1.432.906.526 2.255.526.973 0 1.668-.185l.044-.012.135-.04q.613-.184.984-.421l-.542-1.267q-.3.162-.642.274l-.297.087q-.51.131-1.3.131-.954 0-1.497-.444a1.6 1.6 0 0 1-.192-.193q-.366-.44-.512-1.234l-.004-.021zm-5.427-1.256-.003.022h3.752v-.138q-.011-.727-.288-1.118a1 1 0 0 0-.156-.176q-.46-.428-1.316-.428-.986 0-1.494.604-.379.45-.494 1.234zm-27.053 2.77V4.7h-1.86v12.095h5.333V15.15zm7.103-5.908v7.553h-1.843V9.242h1.843z'/%3E%3Cpath fill='%23fff' d='m19.63 11.151-.757-1.71-.345 1.71-1.12 5.644h-1.827L18.083 4.7h.197l3.325 6.533.988 2.19.988-2.19L26.839 4.7h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.93 5.644h-.098l-2.913-5.644zm14.836 5.81q-1.02 0-1.893-.478a3.8 3.8 0 0 1-1.381-1.382q-.51-.906-.51-2.106 0-1.185.444-2.074a3.36 3.36 0 0 1 1.3-1.382q.839-.494 1.974-.494a3.3 3.3 0 0 1 1.234.231 3.3 3.3 0 0 1 .97.575q.396.33.527.659l.033-1.267h1.694v7.553H37.18l-.033-1.332q-.279.593-1.02 1.053a3.17 3.17 0 0 1-1.662.444zm.296-1.482q.938 0 1.58-.642.642-.66.642-1.711v-.115q0-.708-.296-1.267a2.2 2.2 0 0 0-.807-.872 2.1 2.1 0 0 0-1.119-.313q-1.053 0-1.629.692-.575.675-.575 1.76 0 1.103.559 1.795.577.675 1.645.675zm6.521-6.237h1.711v1.4q.906-1.597 2.83-1.597 1.596 0 2.584 1.02.988 1.005.988 2.914 0 1.185-.493 2.09a3.46 3.46 0 0 1-1.316 1.399 3.5 3.5 0 0 1-1.844.493q-.954 0-1.662-.329a2.67 2.67 0 0 1-1.086-.97l.017 5.134h-1.728zm4.048 6.22q1.07 0 1.645-.674.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.592 0-1.12.296-.51.28-.822.823-.296.527-.296 1.234v.115q0 .708.296 1.267.313.543.823.855.51.296 1.119.297z'/%3E%3Cpath fill='%23e1e3e9' d='M51.325 4.7h1.86v10.45h3.473v1.646h-5.333zm7.12 4.542h1.843v7.553h-1.843zm.905-1.415a1.16 1.16 0 0 1-.856-.346 1.17 1.17 0 0 1-.346-.856 1.05 1.05 0 0 1 .346-.79q.346-.329.856-.329.494 0 .839.33a1.05 1.05 0 0 1 .345.79 1.16 1.16 0 0 1-.345.855q-.33.346-.84.346zm7.875 9.133a3.17 3.17 0 0 1-1.662-.444q-.723-.46-1.004-1.053l-.033 1.332h-1.71V4.701h1.743v4.657l-.082 1.283q.279-.658 1.086-1.119a3.5 3.5 0 0 1 1.778-.477q1.119 0 1.942.51a3.24 3.24 0 0 1 1.283 1.4q.445.888.444 2.072 0 1.201-.526 2.09a3.5 3.5 0 0 1-1.382 1.366 3.8 3.8 0 0 1-1.876.477zm-.296-1.481q1.069 0 1.645-.675.577-.69.577-1.778 0-1.102-.577-1.776-.56-.691-1.645-.692a2.12 2.12 0 0 0-1.58.659q-.642.641-.642 1.694v.115q0 .71.296 1.267a2.4 2.4 0 0 0 .807.872 2.1 2.1 0 0 0 1.119.313zm5.927-6.237h1.777v1.481q.263-.757.856-1.217a2.14 2.14 0 0 1 1.349-.46q.527 0 .724.098l-.247 1.794q-.149-.099-.642-.099-.774 0-1.416.494-.626.493-.626 1.58v3.883h-1.777V9.242zm9.534 7.718q-1.35 0-2.255-.526-.904-.543-1.332-1.432a4.6 4.6 0 0 1-.428-1.975q0-1.2.493-2.106a3.46 3.46 0 0 1 1.4-1.382q.889-.495 2.007-.494 1.744 0 2.584.97.855.956.856 2.7 0 .444-.05.92h-5.43q.18 1.005.708 1.45.542.443 1.497.443.79 0 1.3-.131a4 4 0 0 0 .938-.362l.542 1.267q-.411.263-1.119.46-.708.198-1.711.197zm1.596-4.558q.016-1.02-.444-1.432-.46-.428-1.316-.428-1.728 0-1.991 1.86z'/%3E%3Cg fill-rule='evenodd' stroke-width='1.036'%3E%3Cpath fill='%23000' fill-opacity='.4' d='m8.166 16.146-.002.002a1.54 1.54 0 0 1-2.009 0l-.002-.002-.043-.034-.002-.002-.199-.162H4.377a.657.657 0 0 0-.659.659v1.84a.657.657 0 0 0 .659.659h5.565a.657.657 0 0 0 .659-.659v-1.84a.657.657 0 0 0-.659-.659H8.411l-.202.164zm-1.121-.905a.3.3 0 0 0 .113.023.3.3 0 0 0 .189-.07l.077-.063c.634-.508 4.672-3.743 4.672-7.575 0-2.55-2.215-4.625-4.938-4.625S2.221 5.006 2.221 7.556c0 3.225 2.86 6.027 4.144 7.137h.004l.04.038.484.4.077.063a1 1 0 0 0 .074.047zm-2.52-.548a17 17 0 0 1-1.183-1.315C2.187 11.942.967 9.897.967 7.555c0-3.319 2.855-5.88 6.192-5.88s6.193 2.561 6.193 5.881c0 2.34-1.22 4.387-2.376 5.822a17 17 0 0 1-1.182 1.315h.15a1.91 1.91 0 0 1 1.914 1.914v1.84a1.91 1.91 0 0 1-1.914 1.914H4.377a1.91 1.91 0 0 1-1.914-1.914v-1.84a1.91 1.91 0 0 1 1.914-1.914zm3.82-6.935c0 .692-.55 1.222-1.187 1.222s-1.185-.529-1.185-1.222.548-1.222 1.185-1.222c.638 0 1.186.529 1.186 1.222zm-1.186 2.477c1.348 0 2.442-1.11 2.442-2.478S8.507 5.28 7.159 5.28 4.72 6.39 4.72 7.758s1.092 2.477 2.44 2.477zm2.048 7.71H5.114v-.838h4.093z'/%3E%3Cpath fill='%23e1e3e9' d='M2.222 7.555c0-2.55 2.214-4.625 4.937-4.625s4.938 2.075 4.938 4.625c0 3.832-4.038 7.068-4.672 7.575l-.077.063a.3.3 0 0 1-.189.07.3.3 0 0 1-.188-.07l-.077-.063c-.634-.507-4.672-3.743-4.672-7.575m4.937 2.68c1.348 0 2.442-1.11 2.442-2.478S8.507 5.28 7.159 5.28 4.72 6.39 4.72 7.758s1.092 2.477 2.44 2.477z'/%3E%3Cpath fill='%23fff' d='M4.377 15.948a.657.657 0 0 0-.659.659v1.84a.657.657 0 0 0 .659.659h5.565a.657.657 0 0 0 .659-.659v-1.84a.657.657 0 0 0-.659-.659zm4.83 1.16H5.114v.838h4.093z'/%3E%3C/g%3E%3C/svg%3E");
  }
}
.mapboxgl-ctrl.mapboxgl-ctrl-attrib,
.maplibregl-ctrl.maplibregl-ctrl-attrib {
  background-color: hsla(0, 0%, 100%, 0.5);
  margin: 0;
  padding: 0 5px;
}
@media screen {
  .mapboxgl-ctrl-attrib.mapboxgl-compact,
  .maplibregl-ctrl-attrib.maplibregl-compact {
    background-color: #fff;
    border-radius: 12px;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    margin: 10px;
    min-height: 20px;
    padding: 2px 24px 2px 0;
    position: relative;
  }
  .mapboxgl-ctrl-attrib.mapboxgl-compact-show,
  .maplibregl-ctrl-attrib.maplibregl-compact-show {
    padding: 2px 28px 2px 8px;
    visibility: visible;
  }
  .mapboxgl-ctrl-bottom-left > .mapboxgl-ctrl-attrib.mapboxgl-compact-show,
  .mapboxgl-ctrl-top-left > .mapboxgl-ctrl-attrib.mapboxgl-compact-show,
  .maplibregl-ctrl-bottom-left
    > .maplibregl-ctrl-attrib.maplibregl-compact-show,
  .maplibregl-ctrl-top-left > .maplibregl-ctrl-attrib.maplibregl-compact-show {
    border-radius: 12px;
    padding: 2px 8px 2px 28px;
  }
  .mapboxgl-ctrl-attrib.mapboxgl-compact .mapboxgl-ctrl-attrib-inner,
  .maplibregl-ctrl-attrib.maplibregl-compact .maplibregl-ctrl-attrib-inner {
    display: none;
  }
  .mapboxgl-ctrl-attrib-button,
  .maplibregl-ctrl-attrib-button {
    background-color: hsla(0, 0%, 100%, 0.5);
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill-rule='evenodd' viewBox='0 0 20 20'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E");
    border: 0;
    border-radius: 12px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
    display: none;
    height: 24px;
    outline: none;
    position: absolute;
    right: 0;
    top: 0;
    width: 24px;
  }
  .maplibregl-ctrl-attrib summary.maplibregl-ctrl-attrib-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    list-style: none;
  }
  .maplibregl-ctrl-attrib
    summary.maplibregl-ctrl-attrib-button::-webkit-details-marker {
    display: none;
  }
  .mapboxgl-ctrl-bottom-left .mapboxgl-ctrl-attrib-button,
  .mapboxgl-ctrl-top-left .mapboxgl-ctrl-attrib-button,
  .maplibregl-ctrl-bottom-left .maplibregl-ctrl-attrib-button,
  .maplibregl-ctrl-top-left .maplibregl-ctrl-attrib-button {
    left: 0;
  }
  .mapboxgl-ctrl-attrib.mapboxgl-compact .mapboxgl-ctrl-attrib-button,
  .mapboxgl-ctrl-attrib.mapboxgl-compact-show .mapboxgl-ctrl-attrib-inner,
  .maplibregl-ctrl-attrib.maplibregl-compact .maplibregl-ctrl-attrib-button,
  .maplibregl-ctrl-attrib.maplibregl-compact-show
    .maplibregl-ctrl-attrib-inner {
    display: block;
  }
  .mapboxgl-ctrl-attrib.mapboxgl-compact-show .mapboxgl-ctrl-attrib-button,
  .maplibregl-ctrl-attrib.maplibregl-compact-show
    .maplibregl-ctrl-attrib-button {
    background-color: rgb(0 0 0/5%);
  }
  .mapboxgl-ctrl-bottom-right > .mapboxgl-ctrl-attrib.mapboxgl-compact:after,
  .maplibregl-ctrl-bottom-right
    > .maplibregl-ctrl-attrib.maplibregl-compact:after {
    bottom: 0;
    right: 0;
  }
  .mapboxgl-ctrl-top-right > .mapboxgl-ctrl-attrib.mapboxgl-compact:after,
  .maplibregl-ctrl-top-right
    > .maplibregl-ctrl-attrib.maplibregl-compact:after {
    right: 0;
    top: 0;
  }
  .mapboxgl-ctrl-top-left > .mapboxgl-ctrl-attrib.mapboxgl-compact:after,
  .maplibregl-ctrl-top-left > .maplibregl-ctrl-attrib.maplibregl-compact:after {
    left: 0;
    top: 0;
  }
  .mapboxgl-ctrl-bottom-left > .mapboxgl-ctrl-attrib.mapboxgl-compact:after,
  .maplibregl-ctrl-bottom-left
    > .maplibregl-ctrl-attrib.maplibregl-compact:after {
    bottom: 0;
    left: 0;
  }
}
@media screen and (-ms-high-contrast: active) {
  .mapboxgl-ctrl-attrib.mapboxgl-compact:after,
  .maplibregl-ctrl-attrib.maplibregl-compact:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%23fff' fill-rule='evenodd' viewBox='0 0 20 20'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E");
  }
}
@media screen and (-ms-high-contrast: black-on-white) {
  .mapboxgl-ctrl-attrib.mapboxgl-compact:after,
  .maplibregl-ctrl-attrib.maplibregl-compact:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill-rule='evenodd' viewBox='0 0 20 20'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E");
  }
}
.mapboxgl-ctrl-attrib a,
.maplibregl-ctrl-attrib a {
  color: rgba(0, 0, 0, 0.75);
  text-decoration: none;
}
.mapboxgl-ctrl-attrib a:hover,
.maplibregl-ctrl-attrib a:hover {
  color: inherit;
  text-decoration: underline;
}
.mapboxgl-attrib-empty,
.maplibregl-attrib-empty {
  display: none;
}
.mapboxgl-ctrl-scale,
.maplibregl-ctrl-scale {
  background-color: hsla(0, 0%, 100%, 0.75);
  border: 2px solid #333;
  border-top: #333;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #333;
  font-size: 10px;
  padding: 0 5px;
}
.mapboxgl-popup,
.maplibregl-popup {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  will-change: transform;
}
.mapboxgl-popup-anchor-top,
.mapboxgl-popup-anchor-top-left,
.mapboxgl-popup-anchor-top-right,
.maplibregl-popup-anchor-top,
.maplibregl-popup-anchor-top-left,
.maplibregl-popup-anchor-top-right {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mapboxgl-popup-anchor-bottom,
.mapboxgl-popup-anchor-bottom-left,
.mapboxgl-popup-anchor-bottom-right,
.maplibregl-popup-anchor-bottom,
.maplibregl-popup-anchor-bottom-left,
.maplibregl-popup-anchor-bottom-right {
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
  -ms-flex-direction: column-reverse;
  flex-direction: column-reverse;
}
.mapboxgl-popup-anchor-left,
.maplibregl-popup-anchor-left {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
}
.mapboxgl-popup-anchor-right,
.maplibregl-popup-anchor-right {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}
.mapboxgl-popup-tip,
.maplibregl-popup-tip {
  border: 10px solid transparent;
  height: 0;
  width: 0;
  z-index: 1;
}
.mapboxgl-popup-anchor-top .mapboxgl-popup-tip,
.maplibregl-popup-anchor-top .maplibregl-popup-tip {
  -ms-flex-item-align: center;
  align-self: center;
  border-bottom-color: #fff;
  border-top: none;
}
.mapboxgl-popup-anchor-top-left .mapboxgl-popup-tip,
.maplibregl-popup-anchor-top-left .maplibregl-popup-tip {
  -ms-flex-item-align: start;
  align-self: flex-start;
  border-bottom-color: #fff;
  border-left: none;
  border-top: none;
}
.mapboxgl-popup-anchor-top-right .mapboxgl-popup-tip,
.maplibregl-popup-anchor-top-right .maplibregl-popup-tip {
  -ms-flex-item-align: end;
  align-self: flex-end;
  border-bottom-color: #fff;
  border-right: none;
  border-top: none;
}
.mapboxgl-popup-anchor-bottom .mapboxgl-popup-tip,
.maplibregl-popup-anchor-bottom .maplibregl-popup-tip {
  -ms-flex-item-align: center;
  align-self: center;
  border-bottom: none;
  border-top-color: #fff;
}
.mapboxgl-popup-anchor-bottom-left .mapboxgl-popup-tip,
.maplibregl-popup-anchor-bottom-left .maplibregl-popup-tip {
  -ms-flex-item-align: start;
  align-self: flex-start;
  border-bottom: none;
  border-left: none;
  border-top-color: #fff;
}
.mapboxgl-popup-anchor-bottom-right .mapboxgl-popup-tip,
.maplibregl-popup-anchor-bottom-right .maplibregl-popup-tip {
  -ms-flex-item-align: end;
  align-self: flex-end;
  border-bottom: none;
  border-right: none;
  border-top-color: #fff;
}
.mapboxgl-popup-anchor-left .mapboxgl-popup-tip,
.maplibregl-popup-anchor-left .maplibregl-popup-tip {
  -ms-flex-item-align: center;
  align-self: center;
  border-left: none;
  border-right-color: #fff;
}
.mapboxgl-popup-anchor-right .mapboxgl-popup-tip,
.maplibregl-popup-anchor-right .maplibregl-popup-tip {
  -ms-flex-item-align: center;
  align-self: center;
  border-left-color: #fff;
  border-right: none;
}
.mapboxgl-popup-close-button,
.maplibregl-popup-close-button {
  background-color: transparent;
  border: 0;
  border-radius: 0 3px 0 0;
  cursor: pointer;
  position: absolute;
  right: 0;
  top: 0;
}
.mapboxgl-popup-close-button:hover,
.maplibregl-popup-close-button:hover {
  background-color: rgb(0 0 0/5%);
}
.mapboxgl-popup-content,
.maplibregl-popup-content {
  background: #fff;
  border-radius: 3px;
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
  padding: 15px 10px;
  pointer-events: auto;
  position: relative;
}
.mapboxgl-popup-anchor-top-left .mapboxgl-popup-content,
.maplibregl-popup-anchor-top-left .maplibregl-popup-content {
  border-top-left-radius: 0;
}
.mapboxgl-popup-anchor-top-right .mapboxgl-popup-content,
.maplibregl-popup-anchor-top-right .maplibregl-popup-content {
  border-top-right-radius: 0;
}
.mapboxgl-popup-anchor-bottom-left .mapboxgl-popup-content,
.maplibregl-popup-anchor-bottom-left .maplibregl-popup-content {
  border-bottom-left-radius: 0;
}
.mapboxgl-popup-anchor-bottom-right .mapboxgl-popup-content,
.maplibregl-popup-anchor-bottom-right .maplibregl-popup-content {
  border-bottom-right-radius: 0;
}
.mapboxgl-popup-track-pointer,
.maplibregl-popup-track-pointer {
  display: none;
}
.mapboxgl-popup-track-pointer *,
.maplibregl-popup-track-pointer * {
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.mapboxgl-map:hover .mapboxgl-popup-track-pointer,
.maplibregl-map:hover .maplibregl-popup-track-pointer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mapboxgl-map:active .mapboxgl-popup-track-pointer,
.maplibregl-map:active .maplibregl-popup-track-pointer {
  display: none;
}
.mapboxgl-marker,
.maplibregl-marker {
  left: 0;
  position: absolute;
  top: 0;
  will-change: transform;
}
.mapboxgl-user-location-dot,
.maplibregl-user-location-dot {
  background-color: #1da1f2;
  border-radius: 50%;
  height: 15px;
  width: 15px;
}
.mapboxgl-user-location-dot:before,
.maplibregl-user-location-dot:before {
  -webkit-animation: maplibregl-user-location-dot-pulse 2s infinite;
  animation: maplibregl-user-location-dot-pulse 2s infinite;
  background-color: #1da1f2;
  border-radius: 50%;
  content: "";
  height: 15px;
  position: absolute;
  width: 15px;
}
.mapboxgl-user-location-dot:after,
.maplibregl-user-location-dot:after {
  border: 2px solid #fff;
  border-radius: 50%;
  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.35);
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.35);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  content: "";
  height: 19px;
  left: -2px;
  position: absolute;
  top: -2px;
  width: 19px;
}
@-webkit-keyframes maplibregl-user-location-dot-pulse {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  70% {
    opacity: 0;
    -webkit-transform: scale(3);
    transform: scale(3);
  }
  to {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes maplibregl-user-location-dot-pulse {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  70% {
    opacity: 0;
    -webkit-transform: scale(3);
    transform: scale(3);
  }
  to {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.mapboxgl-user-location-dot-stale,
.maplibregl-user-location-dot-stale {
  background-color: #aaa;
}
.mapboxgl-user-location-dot-stale:after,
.maplibregl-user-location-dot-stale:after {
  display: none;
}
.mapboxgl-user-location-accuracy-circle,
.maplibregl-user-location-accuracy-circle {
  background-color: #1da1f233;
  border-radius: 100%;
  height: 1px;
  width: 1px;
}
.mapboxgl-crosshair,
.mapboxgl-crosshair .mapboxgl-interactive,
.mapboxgl-crosshair .mapboxgl-interactive:active,
.maplibregl-crosshair,
.maplibregl-crosshair .maplibregl-interactive,
.maplibregl-crosshair .maplibregl-interactive:active {
  cursor: crosshair;
}
.mapboxgl-boxzoom,
.maplibregl-boxzoom {
  background: #fff;
  border: 2px dotted #202020;
  height: 0;
  left: 0;
  opacity: 0.5;
  position: absolute;
  top: 0;
  width: 0;
}
.maplibregl-cooperative-gesture-screen {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.4);
  bottom: 0;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 1.4em;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  left: 0;
  line-height: 1.2;
  opacity: 0;
  padding: 1rem;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  -webkit-transition: opacity 1s ease 1s;
  transition: opacity 1s ease 1s;
}
.maplibregl-cooperative-gesture-screen.maplibregl-show {
  opacity: 1;
  -webkit-transition: opacity 0.05s;
  transition: opacity 0.05s;
}
.maplibregl-cooperative-gesture-screen .maplibregl-mobile-message {
  display: none;
}
@media (hover: none), (max-width: 480px) {
  .maplibregl-cooperative-gesture-screen .maplibregl-desktop-message {
    display: none;
  }
  .maplibregl-cooperative-gesture-screen .maplibregl-mobile-message {
    display: block;
  }
}
:root {
  font-size: 10px;
  --container-border-width: 8px;
  --container-gap-width: 8px;
  --transition-short: 0.1s;
  --transition-standard: 0.3s;
  --buttons-dialog-gap-row: 8px;
  --buttons-dialog-gap-column: 8px;
  --MBody-border-radius: 8px;
  --dialog-zIndex-wrapper-default: 4000;
  --dialog-zIndex-static-background: 4009;
  --dialog-zIndex-static: calc(var(--dialog-zIndex-static-background) + 1);
  --dialog-zIndex-standard-background: calc(var(--dialog-zIndex-static) + 1);
  --dialog-zIndex-standard: calc(var(--dialog-zIndex-standard-background) + 1);
}
#matrixchat {
  contain: strict;
}
#mx_ContextualMenu_Container,
#mx_Dialog_Container,
#mx_Dialog_StaticContainer,
#mx_PersistedElement_container {
  isolation: isolate;
}
[class^="cpd-theme"][class^="cpd-theme"] {
  --cpd-font-family-sans: "Inter", var(--emoji-font-family), "Apple Color Emoji",
    "Segoe UI Emoji", "Arial", "Helvetica", sans-serif, "Noto Color Emoji";
}
@media (prefers-reduced-motion) {
  :root {
    --transition-short: 0;
    --transition-standard: 0;
  }
}
html {
  height: 100%;
  overflow: hidden;
  -ms-scroll-chaining: none;
  overscroll-behavior: none;
}
body {
  background-color: var(--cpd-color-bg-canvas-default);
  border: 0;
  color: var(--cpd-color-text-primary);
  font: var(--cpd-font-body-md-regular);
  -webkit-font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
  font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
  letter-spacing: var(--cpd-font-letter-spacing-body-md);
  margin: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
code,
pre {
  font-family: Inconsolata, , Apple Color Emoji, Segoe UI Emoji, Courier,
    monospace, Noto Color Emoji;
  font-family: "Inconsolata", var(--emoji-font-family), "Apple Color Emoji",
    "Segoe UI Emoji", "Courier", monospace, "Noto Color Emoji";
  font-size: 100% !important;
}
.error,
.text-error,
.text-warning,
.warning {
  color: var(--cpd-color-text-critical-primary);
}
.text-success {
  color: var(--cpd-color-text-action-accent);
}
.text-muted {
  color: #61708b;
}
.text-primary {
  color: var(--cpd-color-text-primary);
}
.text-secondary {
  color: var(--cpd-color-text-secondary);
}
.mx_Verified {
  color: var(--cpd-color-icon-success-primary);
}
.mx_Untrusted {
  color: var(--cpd-color-icon-critical-primary);
}
b {
  font-weight: 700;
}
h2 {
  color: var(--cpd-color-text-primary);
  font: var(--cpd-font-heading-lg-regular);
  letter-spacing: var(--cpd-font-letter-spacing-heading-lg);
  margin-bottom: 16px;
  margin-top: 16px;
}
a:hover,
a:link,
a:visited {
  color: var(--cpd-color-text-link-external);
}
input[type="password"],
input[type="search"],
input[type="text"] {
  font: var(--cpd-font-body-md-semibold);
  font-weight: var(--cpd-font-weight-semibold);
  min-width: 0;
  padding: 9px;
}
input[type="search"].mx_textinput_icon,
input[type="text"].mx_textinput_icon {
  background-position: 10px;
  background-repeat: no-repeat;
  padding-left: 36px;
}
input[type="search"].mx_textinput_icon.mx_textinput_search,
input[type="text"].mx_textinput_icon.mx_textinput_search {
  background-image: url(../../img/feather-customised/search-input.5d69fb5.svg);
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
  display: none;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  opacity: 1;
}
input::-moz-placeholder,
textarea::-moz-placeholder {
  opacity: 1;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  opacity: 1;
}
input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
  opacity: 1;
}
input::placeholder,
textarea::placeholder {
  opacity: 1;
}
input[type="password"],
input[type="text"],
textarea {
  background-color: transparent;
  color: var(--cpd-color-text-primary);
}
textarea {
  color: var(--cpd-color-text-primary);
}
input[type="password"]:focus,
input[type="text"]:focus,
textarea:focus {
  -webkit-box-shadow: none;
  box-shadow: none;
  outline: none;
}
:focus:not(:focus-visible) {
  outline: none;
}
fieldset {
  border: none;
  display: inline-block;
  margin-inline: unset;
  min-inline-size: unset;
  padding-block: unset;
  padding-inline: unset;
}
summary {
  cursor: pointer;
}
legend {
  border: none;
  padding-inline: unset;
}
.mx_Dialog .mx_textinput > input[type="search"],
.mx_Dialog .mx_textinput > input[type="text"],
.mx_MatrixChat_wrapper .mx_textinput > input[type="search"],
.mx_MatrixChat_wrapper .mx_textinput > input[type="text"] {
  border: none;
  -webkit-box-flex: 1;
  color: var(--cpd-color-text-primary);
  -ms-flex: 1;
  flex: 1;
}
.mx_Dialog .mx_textinput,
.mx_Dialog
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="search"],
.mx_Dialog
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="text"],
.mx_MatrixChat_wrapper .mx_textinput,
.mx_MatrixChat_wrapper
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="search"],
.mx_MatrixChat_wrapper
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="text"] {
  background-color: transparent;
  border: 1px solid var(--cpd-color-gray-300);
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #9fa9ba;
  display: block;
  margin: 9px;
}
.mx_Dialog .mx_textinput,
.mx_MatrixChat_wrapper .mx_textinput {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_Dialog .mx_textinput input::-webkit-input-placeholder,
.mx_Dialog
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="search"]::-webkit-input-placeholder,
.mx_Dialog
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="text"]::-webkit-input-placeholder,
.mx_MatrixChat_wrapper .mx_textinput input::-webkit-input-placeholder,
.mx_MatrixChat_wrapper
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="search"]::-webkit-input-placeholder,
.mx_MatrixChat_wrapper
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="text"]::-webkit-input-placeholder {
  color: var(--cpd-color-text-placeholder);
}
.mx_Dialog .mx_textinput input::-moz-placeholder,
.mx_Dialog
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="search"]::-moz-placeholder,
.mx_Dialog
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="text"]::-moz-placeholder,
.mx_MatrixChat_wrapper .mx_textinput input::-moz-placeholder,
.mx_MatrixChat_wrapper
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="search"]::-moz-placeholder,
.mx_MatrixChat_wrapper
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="text"]::-moz-placeholder {
  color: var(--cpd-color-text-placeholder);
}
.mx_Dialog .mx_textinput input:-ms-input-placeholder,
.mx_Dialog
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="search"]:-ms-input-placeholder,
.mx_Dialog
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="text"]:-ms-input-placeholder,
.mx_MatrixChat_wrapper .mx_textinput input:-ms-input-placeholder,
.mx_MatrixChat_wrapper
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="search"]:-ms-input-placeholder,
.mx_MatrixChat_wrapper
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="text"]:-ms-input-placeholder {
  color: var(--cpd-color-text-placeholder);
}
.mx_Dialog .mx_textinput input::-ms-input-placeholder,
.mx_Dialog
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="search"]::-ms-input-placeholder,
.mx_Dialog
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="text"]::-ms-input-placeholder,
.mx_MatrixChat_wrapper .mx_textinput input::-ms-input-placeholder,
.mx_MatrixChat_wrapper
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="search"]::-ms-input-placeholder,
.mx_MatrixChat_wrapper
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="text"]::-ms-input-placeholder {
  color: var(--cpd-color-text-placeholder);
}
.mx_Dialog .mx_textinput input::placeholder,
.mx_Dialog
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="search"]::placeholder,
.mx_Dialog
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="text"]::placeholder,
.mx_MatrixChat_wrapper .mx_textinput input::placeholder,
.mx_MatrixChat_wrapper
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="search"]::placeholder,
.mx_MatrixChat_wrapper
  :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput)
  > input[type="text"]::placeholder {
  color: var(--cpd-color-text-placeholder);
}
::-moz-focus-inner {
  border: 0;
}
#mx_theme_accentColor {
  color: var(--cpd-color-text-action-accent);
}
#mx_theme_secondaryAccentColor {
  color: #f2f5f8;
}
.mx_Dialog_wrapper {
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  z-index: 4000;
  z-index: var(--dialog-zIndex-wrapper-default);
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_Dialog_border,
.mx_Dialog_wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
}
.mx_Dialog_border {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  max-height: calc(100% - var(--cpd-space-6x));
  max-width: -webkit-fit-content;
  max-width: -moz-fit-content;
  max-width: fit-content;
  position: relative;
  z-index: 4012;
  z-index: var(--dialog-zIndex-standard);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_Dialog_lightbox .mx_Dialog_border {
  display: contents;
}
.mx_Dialog {
  background-color: var(--cpd-color-bg-canvas-default);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #747474;
  font-size: 0.9375rem;
  overflow-y: auto;
  padding: var(--cpd-space-8x) var(--cpd-space-10x);
  position: relative;
}
.mx_Dialog_staticWrapper .mx_Dialog {
  contain: content;
  z-index: 4010;
  z-index: var(--dialog-zIndex-static);
}
.mx_Dialog_lightbox .mx_Dialog {
  background-color: transparent;
  border-radius: 0;
  height: 100%;
  max-height: 100%;
  max-width: 100%;
  padding: 0;
  pointer-events: none;
  width: 100%;
}
.mx_Dialog .markdown-body {
  color: inherit;
  font: var(--cpd-font-body-md-regular) !important;
  font-family: inherit !important;
  letter-spacing: var(--cpd-font-letter-spacing-body-md);
  line-height: inherit !important;
  white-space: normal !important;
}
.mx_Dialog .markdown-body code,
.mx_Dialog .markdown-body pre {
  background-color: var(--cpd-color-bg-subtle-primary);
  font-family: Inconsolata, , Apple Color Emoji, Segoe UI Emoji, Courier,
    monospace, Noto Color Emoji !important;
  font-family: "Inconsolata", var(--emoji-font-family), "Apple Color Emoji",
    "Segoe UI Emoji", "Courier", monospace, "Noto Color Emoji" !important;
}
.mx_Dialog .markdown-body code {
  white-space: pre-wrap;
}
.mx_Dialog .markdown-body pre {
  overflow-x: overlay;
  overflow-y: visible;
}
.mx_Dialog .markdown-body pre::-webkit-scrollbar-corner {
  background: transparent;
}
.mx_Dialog .markdown-body pre code {
  white-space: pre;
}
.mx_Dialog .markdown-body pre code > * {
  display: inline;
}
.mx_Dialog .markdown-body h1,
.mx_Dialog .markdown-body h2,
.mx_Dialog .markdown-body h3,
.mx_Dialog .markdown-body h4,
.mx_Dialog .markdown-body h5,
.mx_Dialog .markdown-body h6 {
  color: inherit;
  font-family: inherit !important;
}
.mx_Dialog .markdown-body h1,
.mx_Dialog .markdown-body h2 {
  border-bottom: none !important;
  font-size: 1.5em;
}
.mx_Dialog .markdown-body a {
  color: var(--cpd-color-text-link-external);
}
.mx_Dialog .markdown-body blockquote {
  border-left: 2px solid var(--cpd-color-border-interactive-primary);
  border-radius: 2px;
  color: var(--cpd-color-text-secondary);
  padding: 0 10px;
}
.mx_Dialog_fixedWidth {
  max-width: 704px;
  width: 60vw;
}
.mx_Dialog_background {
  background-color: #030c1b4d;
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 4011;
  z-index: var(--dialog-zIndex-standard-background);
}
.mx_Dialog_background.mx_Dialog_staticBackground {
  z-index: 4009;
  z-index: var(--dialog-zIndex-static-background);
}
.mx_Dialog_wrapperWithStaticUnder .mx_Dialog_background {
  opacity: 0.4;
}
.mx_Dialog_lightbox .mx_Dialog_background {
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-name: mx_Dialog_lightbox_background_keyframes;
  animation-name: mx_Dialog_lightbox_background_keyframes;
  background-color: #000;
  opacity: 0.95;
}
.mx_Dialog_titleImage {
  height: 25px;
  margin-bottom: 2px;
  margin-left: -2px;
  margin-right: 4px;
  vertical-align: sub;
  width: 25px;
}
.mx_Dialog_title {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: var(--cpd-color-text-primary);
  display: inline-block;
  letter-spacing: var(--cpd-font-letter-spacing-heading-lg);
  width: 100%;
}
.mx_Dialog_title.danger {
  color: var(--cpd-color-text-critical-primary);
}
.mx_Dialog_header {
  padding: 0;
  position: relative;
  -webkit-padding-end: 20px;
  margin-bottom: var(--cpd-space-2x);
  padding-inline-end: 20px;
}
.mx_Dialog_header.mx_Dialog_headerWithButton > .mx_Dialog_title {
  text-align: center;
}
.mx_Dialog_cancelButton {
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 14px;
  cursor: pointer;
  height: 28px;
  position: relative;
  width: 28px;
}
.mx_Dialog_cancelButton:hover {
  background-color: var(--cpd-color-bg-subtle-primary);
}
.mx_Dialog_cancelButton:before {
  background-color: var(--cpd-color-icon-secondary);
  content: "";
  height: 28px;
  -webkit-mask-image: url(../../icons/close.dce71fd.svg);
  mask-image: url(../../icons/close.dce71fd.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  position: absolute;
  width: 28px;
}
.mx_Dialog_cancelButton {
  position: absolute;
  right: var(--cpd-space-4x);
  top: var(--cpd-space-4x);
}
.mx_Dialog_content {
  color: var(--cpd-color-text-primary);
  font: var(--cpd-font-body-md-regular);
  /* margin: 24px 0 68px; */
  word-wrap: break-word;
}
.mx_Dialog_buttons {
  margin-top: 20px;
  -webkit-margin-start: auto;
  margin-inline-start: auto;
  text-align: right;
}
.mx_Dialog_buttons .mx_Dialog_buttons_additive {
  float: left;
}
.mx_Dialog_buttons .mx_Dialog_buttons_row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  text-align: left;
  text-align: initial;
  -webkit-margin-start: auto;
  -webkit-column-gap: 8px;
  -moz-column-gap: 8px;
  column-gap: 8px;
  -webkit-column-gap: var(--buttons-dialog-gap-column);
  -moz-column-gap: var(--buttons-dialog-gap-column);
  column-gap: var(--buttons-dialog-gap-column);
  margin-inline-start: auto;
  row-gap: 8px;
  row-gap: var(--buttons-dialog-gap-row);
}
.mx_Dialog_buttons .mx_Dialog_buttons_row button {
  margin: 0 !important;
}
.mx_Dialog
  button:not(.mx_Dialog_nonDialogButton):not([class|="maplibregl"]):not(
    .mx_AccessibleButton
  ):not(.mx_UserProfileSettings button),
.mx_Dialog input[type="submit"],
.mx_Dialog_buttons
  button:not(.mx_Dialog_nonDialogButton):not(.mx_AccessibleButton),
.mx_Dialog_buttons input[type="submit"] {
  background-color: var(--cpd-color-bg-action-primary-rest);
  border: 0;
  border-radius: 24px;
  color: var(--cpd-color-bg-canvas-default);
  cursor: pointer;
  display: inline-block;
  font: var(--cpd-font-body-md-regular);
  padding: 7px 1.5em;
  vertical-align: middle;
  width: auto;
}
.mx_Dialog
  button:not(.mx_Dialog_nonDialogButton):not([class|="maplibregl"]):not(
    .mx_AccessibleButton
  ):not(.mx_UserProfileSettings button):not(:focus-visible),
.mx_Dialog input[type="submit"]:not(:focus-visible),
.mx_Dialog_buttons
  button:not(.mx_Dialog_nonDialogButton):not(.mx_AccessibleButton):not(
    :focus-visible
  ),
.mx_Dialog_buttons input[type="submit"]:not(:focus-visible) {
  outline: none;
}
.mx_Dialog
  button:not(.mx_Dialog_nonDialogButton):not([class|="maplibregl"]):not(
    .mx_AccessibleButton
  ):not(.mx_UserProfileSettings button),
.mx_Dialog input[type="submit"],
.mx_Dialog_buttons
  button:not(.mx_Dialog_nonDialogButton):not(.mx_AccessibleButton),
.mx_Dialog_buttons input[type="submit"] {
  background-color: transparent;
  border: 1px solid var(--cpd-color-border-interactive-secondary);
  color: var(--cpd-color-text-primary);
  font-family: inherit;
  font-weight: var(--cpd-font-weight-semibold);
  margin-bottom: 5px;
  margin-left: 0;
  margin-right: 8px;
  margin-right: var(--buttons-dialog-gap-column);
}
.mx_Dialog
  button:not(.mx_Dialog_nonDialogButton):not([class|="maplibregl"]):not(
    .mx_AccessibleButton
  ):not(.mx_UserProfileSettings button):last-child {
  margin-right: 0;
}
.mx_Dialog
  button:not(.mx_Dialog_nonDialogButton):not([class|="maplibregl"]):not(
    .mx_AccessibleButton
  ):not(.mx_UserProfileSettings button):focus,
.mx_Dialog input[type="submit"]:focus,
.mx_Dialog_buttons
  button:not(.mx_Dialog_nonDialogButton):not(.mx_AccessibleButton):focus,
.mx_Dialog_buttons input[type="submit"]:focus {
  -webkit-filter: brightness(105%);
  filter: brightness(105%);
}
.mx_Dialog
  button.mx_Dialog_primary:not(.mx_Dialog_nonDialogButton):not(
    [class|="maplibregl"]
  ),
.mx_Dialog input[type="submit"].mx_Dialog_primary,
.mx_Dialog_buttons
  button.mx_Dialog_primary:not(.mx_Dialog_nonDialogButton):not(
    .mx_AccessibleButton
  ):not(.mx_UserProfileSettings button),
.mx_Dialog_buttons input[type="submit"].mx_Dialog_primary {
  background-color: var(--cpd-color-bg-action-primary-rest);
  border-color: var(--cpd-color-bg-action-primary-rest);
  color: var(--cpd-color-text-on-solid-primary);
  min-width: 156px;
}
.mx_Dialog
  button.danger:not(.mx_Dialog_nonDialogButton):not([class|="maplibregl"]),
.mx_Dialog input[type="submit"].danger,
.mx_Dialog_buttons
  button.danger:not(.mx_Dialog_nonDialogButton):not(.mx_AccessibleButton):not(
    .mx_UserProfileSettings button
  ),
.mx_Dialog_buttons input[type="submit"].danger {
  background-color: var(--cpd-color-bg-critical-primary);
  border: 1px solid var(--cpd-color-bg-critical-primary);
  color: var(--cpd-color-text-on-solid-primary);
}
.mx_Dialog
  button.warning:not(.mx_Dialog_nonDialogButton):not([class|="maplibregl"]),
.mx_Dialog input[type="submit"].warning {
  border: 1px solid var(--cpd-color-border-critical-subtle);
  color: var(--cpd-color-text-critical-primary);
}
.mx_Dialog
  button:not(.mx_Dialog_nonDialogButton):not([class|="maplibregl"]):not(
    .mx_AccessibleButton
  ):not(.mx_UserProfileSettings button):disabled,
.mx_Dialog input[type="submit"]:disabled,
.mx_Dialog_buttons
  button:not(.mx_Dialog_nonDialogButton):not(.mx_AccessibleButton):disabled,
.mx_Dialog_buttons input[type="submit"]:disabled {
  background-color: #747474;
  border: 1px solid #747474;
  opacity: 0.7;
}
.mx_Dialog_wrapper.mx_Dialog_spinner .mx_Dialog_border {
  display: contents;
}
.mx_Dialog_wrapper.mx_Dialog_spinner .mx_Dialog {
  block-size: auto;
  border-radius: 8px;
  -webkit-box-shadow: none;
  box-shadow: none;
  inline-size: auto;
  overflow-x: hidden;
  overflow-y: hidden;
  padding: 8px;
}
.mx_GeneralButton {
  background-color: var(--cpd-color-bg-action-primary-rest);
  border: 0;
  border-radius: 24px;
  color: var(--cpd-color-bg-canvas-default);
  cursor: pointer;
  display: inline-block;
  font: var(--cpd-font-body-md-regular);
  padding: 7px 1.5em;
  vertical-align: middle;
  width: auto;
}
.mx_GeneralButton:not(:focus-visible) {
  outline: none;
}
.mx_GeneralButton {
  display: inline;
  margin: auto;
}
.mx_TextInputDialog_label {
  padding-bottom: 12px;
  text-align: left;
}
.mx_TextInputDialog_input {
  background-color: var(--cpd-color-bg-canvas-default);
  border: 1px solid #e7e7e7;
  border-radius: 3px;
  color: var(--cpd-color-text-primary);
  font-size: 0.9375rem;
  padding: 9px;
}
.mx_button_row {
  margin-top: 69px;
}
.mx_Username_color1 {
  color: var(--cpd-color-text-decorative-1);
}
.mx_Username_color2 {
  color: var(--cpd-color-text-decorative-2);
}
.mx_Username_color3 {
  color: var(--cpd-color-text-decorative-3);
}
.mx_Username_color4 {
  color: var(--cpd-color-text-decorative-4);
}
.mx_Username_color5 {
  color: var(--cpd-color-text-decorative-5);
}
.mx_Username_color6 {
  color: var(--cpd-color-text-decorative-6);
}
.mx_AppPermission,
.mx_AppWarning {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  text-align: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_lineClamp {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  -webkit-line-clamp: var(--mx-line-clamp, 1);
  overflow: hidden;
}
.mx_BeaconListItem {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  border-bottom: 1px solid var(--cpd-color-bg-subtle-primary);
  cursor: pointer;
  padding: 12px 0;
}
.mx_BeaconListItem_avatarIcon {
  -webkit-box-flex: 0;
  -ms-flex: 0 0;
  flex: 0 0;
  height: 32px;
  width: 32px;
}
.mx_BeaconListItem_avatar {
  -webkit-box-flex: 0;
  border: 2px solid var(--cpd-color-purple-900);
  border-radius: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -ms-flex: 0 0;
  flex: 0 0;
  margin-right: 8px;
}
.mx_BeaconListItem_info {
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  width: 0;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}
.mx_BeaconListItem_status {
  margin-bottom: 8px;
  padding: 0 !important;
}
.mx_BeaconListItem_status .mx_BeaconStatus_label {
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_BeaconListItem_lastUpdated {
  color: var(--cpd-color-gray-800);
  font-size: 0.625rem;
}
.mx_BeaconListItem_interactions,
.mx_BeaconStatus {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
}
.mx_BeaconStatus {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: var(--color);
  font-size: 0.75rem;
  justify-content: flex-start;
  padding: 8px;
}
.mx_BeaconStatus_Loading,
.mx_BeaconStatus_Stopped {
  --color: var(--cpd-color-gray-800);
}
.mx_BeaconStatus_Active,
.mx_BeaconStatus_Error {
  --color: var(--cpd-color-text-primary);
}
.mx_BeaconStatus_icon {
  height: 32px;
  width: 32px;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 32px;
  flex: 0 0 32px;
  margin-right: 8px;
}
.mx_BeaconStatus_description {
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  line-height: 0.875rem;
  overflow: hidden;
  padding-right: 8px;
  white-space: nowrap;
}
.mx_BeaconStatus_description .mx_BeaconStatus_description_status {
  overflow: hidden;
  text-overflow: ellipsis;
}
.mx_BeaconStatus_expiryTime {
  color: var(--cpd-color-text-secondary);
}
.mx_BeaconStatus_label {
  margin-bottom: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mx_BeaconStatusTooltip {
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  height: 38px;
  max-width: 150px;
  padding-top: 8px;
  position: absolute;
  top: 42px;
}
.mx_BeaconStatusTooltip_inner {
  background: var(--cpd-color-bg-canvas-default);
  border-radius: 4px;
  -webkit-box-shadow: 4px 4px 12px 0 rgba(118, 131, 156, 0.6);
  box-shadow: 4px 4px 12px 0 rgba(118, 131, 156, 0.6);
  height: 100%;
  position: relative;
}
.mx_BeaconViewDialog_wrapper .mx_Dialog {
  contain: unset;
  padding: 0;
  position: static;
}
.mx_BeaconViewDialog {
  height: calc(80vh - 0.5px);
  overflow: hidden;
  position: relative;
  width: calc(80vw - 0.5px);
}
.mx_BeaconViewDialog .mx_Dialog_header {
  margin: 0;
  padding: 0;
  position: static;
}
.mx_BeaconViewDialog .mx_Dialog_header .mx_Dialog_title {
  display: none;
}
.mx_BeaconViewDialog .mx_Dialog_header .mx_Dialog_cancelButton {
  background-color: var(--cpd-color-bg-canvas-default);
  height: 20px;
  position: fixed;
  right: 5vw;
  top: 5vh;
  width: 20px;
  z-index: 4010;
}
.mx_BeaconViewDialog_map {
  border-radius: 8px;
  height: 80vh;
  width: 80vw;
}
.mx_BeaconViewDialog_mapFallbackMessage {
  color: var(--cpd-color-text-secondary);
  margin-bottom: 16px;
}
.mx_BeaconViewDialog_viewListButton {
  left: 24px;
  position: absolute;
  top: 24px;
}
.mx_DialogOwnBeaconStatus {
  bottom: 32px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  left: 50%;
  margin-left: -150px;
  position: absolute;
  width: 300px;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: stretch;
  -ms-flex-pack: stretch;
  background: var(--cpd-color-bg-canvas-default);
  border-radius: 8px;
  -webkit-box-shadow: 4px 4px 12px 0 rgba(118, 131, 156, 0.6);
  box-shadow: 4px 4px 12px 0 rgba(118, 131, 156, 0.6);
  justify-content: stretch;
  padding: 0 12px;
}
.mx_DialogOwnBeaconStatus_avatarIcon {
  -webkit-box-flex: 0;
  -ms-flex: 0 0;
  flex: 0 0;
  height: 32px;
  margin: 8px 0;
  width: 32px;
}
.mx_DialogOwnBeaconStatus_avatar {
  -webkit-box-flex: 0;
  border: 2px solid var(--cpd-color-purple-900);
  border-radius: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -ms-flex: 0 0;
  flex: 0 0;
  margin: 8px 0;
}
.mx_DialogOwnBeaconStatus_status {
  -webkit-box-flex: 1;
  -ms-flex: 1 1;
  flex: 1 1;
  padding-right: 0;
}
.mx_DialogSidebar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 265px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  background-color: var(--cpd-color-bg-canvas-default);
  -webkit-box-shadow: 0 4px 4px rgba(118, 131, 156, 0.6);
  box-shadow: 0 4px 4px rgba(118, 131, 156, 0.6);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 16px;
}
.mx_DialogSidebar .mx_DialogSidebar_header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-flex: 0;
  color: var(--cpd-color-text-primary);
  -ms-flex: 0 0;
  flex: 0 0;
  margin-bottom: 16px;
}
.mx_DialogSidebar .mx_DialogSidebar_header .mx_DialogSidebar_closeButtonIcon {
  color: var(--cpd-color-gray-800);
  height: 12px;
}
.mx_DialogSidebar .mx_DialogSidebar_list {
  list-style: none;
  margin: 0;
  padding: 0;
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  overflow: auto;
  width: 100%;
}
.mx_DialogSidebar_noResults {
  color: var(--cpd-color-text-secondary);
  font: var(--cpd-font-body-md-regular);
}
.mx_LeftPanelLiveShareWarning {
  background-color: var(--cpd-color-text-action-accent);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #fff;
  font-size: 0.625rem;
  padding: 4px;
  text-align: center;
  width: 100%;
  z-index: 1;
}
.mx_LeftPanelLiveShareWarning__error {
  background-color: var(--cpd-color-text-critical-primary);
}
.mx_LiveTimeRemaining {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
}
.mx_OwnBeaconStatus_button {
  margin-left: 8px;
}
.mx_EventTile[data-layout="bubble"] .mx_OwnBeaconStatus_button {
  -ms-flex-item-align: start;
  align-self: start;
}
.mx_OwnBeaconStatus_destructiveButton {
  color: var(--cpd-color-text-critical-primary) !important;
  font-weight: var(--cpd-font-weight-semibold) !important;
}
.mx_RoomLiveShareWarning {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: var(--cpd-color-bg-subtle-primary);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: var(--cpd-color-text-primary);
  cursor: pointer;
  padding: 12px 16px;
}
.mx_RoomLiveShareWarning_icon {
  height: 32px;
  margin-right: 8px;
  width: 32px;
}
.mx_RoomLiveShareWarning_label {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  font-size: 0.9375rem;
}
.mx_RoomLiveShareWarning_spinner {
  margin-right: 16px;
}
.mx_RoomLiveShareWarning_closeButton {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  margin: 0 0 0 16px;
  padding: 0;
}
.mx_RoomLiveShareWarning_stopButton {
  margin-left: 16px;
}
.mx_RoomLiveShareWarning_closeButtonIcon {
  height: 1.125rem;
  padding: 4px;
}
.mx_ShareLatestLocation_icon {
  color: var(--cpd-color-text-secondary);
  height: 13px;
  width: 13px;
}
.mx_CopyableText.mx_ShareLatestLocation_copy .mx_CopyableText_copyButton {
  height: 13px;
  margin-left: 8px !important;
  position: relative;
  top: -1px;
  width: 13px;
}
.mx_CopyableText.mx_ShareLatestLocation_copy
  .mx_CopyableText_copyButton:before {
  background-color: var(--cpd-color-text-secondary);
  height: 13px;
  width: 13px;
}
.mx_StyledLiveBeaconIcon {
  -webkit-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  background-color: var(--cpd-color-purple-900);
  border-color: var(--cpd-color-purple-900);
  border-radius: 50%;
  border-style: solid;
  border-width: 2px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #fff;
  flex-shrink: 0;
  padding: 2px;
}
.mx_StyledLiveBeaconIcon.mx_StyledLiveBeaconIcon_error {
  background-color: var(--cpd-color-text-critical-primary);
  border-color: var(--cpd-color-text-critical-primary);
}
.mx_StyledLiveBeaconIcon.mx_StyledLiveBeaconIcon_idle {
  background-color: var(--cpd-color-gray-600);
  border-color: var(--cpd-color-gray-600);
}
.mx_KebabContextMenu_icon {
  color: var(--cpd-color-icon-tertiary);
  width: 24px;
}
.mx_PollDetailHeader {
  font-size: 0.9375rem !important;
}
.mx_PollDetailHeader_icon {
  height: 15px;
  margin-right: 8px;
  vertical-align: middle;
  width: 15px;
}
.mx_PollListItem {
  width: 100%;
}
.mx_PollListItem_content {
  display: grid;
  width: 100%;
  -webkit-box-pack: left;
  -ms-flex-pack: left;
  justify-content: left;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 8px;
  color: var(--cpd-color-text-primary);
  cursor: pointer;
  grid-template-columns: auto auto auto;
  grid-template-rows: auto;
}
.mx_PollListItem_icon {
  color: var(--cpd-color-gray-600);
  height: 14px;
  padding-left: 8px;
  width: 14px;
}
.mx_PollListItem_question {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_PollListItemEnded {
  width: 100%;
}
.mx_PollListItemEnded_content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  color: var(--cpd-color-text-primary);
  cursor: pointer;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_PollListItemEnded_title {
  display: grid;
  -webkit-box-pack: left;
  -ms-flex-pack: left;
  justify-content: left;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-gap: 8px;
  grid-template-columns: -webkit-min-content 1fr -webkit-min-content;
  grid-template-columns: min-content 1fr min-content;
  grid-template-rows: auto;
}
.mx_PollListItemEnded_icon {
  color: var(--cpd-color-gray-600);
  height: 14px;
  padding-left: 8px;
  width: 14px;
}
.mx_PollListItemEnded_date {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
}
.mx_PollListItemEnded_question {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_PollListItemEnded_answers {
  display: grid;
  grid-gap: 8px;
  margin-top: 12px;
}
.mx_PollListItemEnded_voteCount {
  margin: 8px 0 0 6px;
}
.mx_AppPermission {
  font-size: 0.75rem;
  overflow-y: scroll;
  width: 100%;
}
.mx_AppPermission .mx_AppPermission_bolder {
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_AppPermission .mx_AppPermission_content {
  margin-block: auto;
}
.mx_AppPermission .mx_AppPermission_content > div {
  margin-block: 12px;
}
.mx_AppPermission .mx_AppPermission_content .mx_AppPermission_content_bolder {
  font-weight: var(--font-semi-bold);
}
.mx_AppPermission
  .mx_AppPermission_content
  .mx_TextWithTooltip_target--helpIcon {
  display: inline-block;
  height: 0.875rem;
  vertical-align: middle;
}
.mx_AppPermission
  .mx_AppPermission_content
  .mx_TextWithTooltip_target--helpIcon
  .mx_Icon {
  color: var(--cpd-color-text-action-accent);
}
.mx_AppWarning {
  font-size: 1rem;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_AppWarning h4 {
  margin: 0;
  padding: 0;
}
.mx_FilterDropdown .mx_Dropdown_menu {
  background-color: var(--cpd-color-bg-subtle-primary);
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 8px;
  -webkit-box-shadow: 0 1px 3px rgba(23, 25, 28, 0.05);
  box-shadow: 0 1px 3px rgba(23, 25, 28, 0.05);
  left: auto;
  margin-top: 4px;
  padding: 12px;
  right: -12px;
  width: 232px;
}
.mx_FilterDropdown .mx_Dropdown_menu .mx_Dropdown_option_highlight {
  background-color: transparent;
}
.mx_FilterDropdown .mx_Dropdown_input {
  background-color: transparent;
  border-color: transparent;
  border-radius: 4px;
  color: var(--cpd-color-text-secondary);
  height: 24px;
}
.mx_FilterDropdown .mx_Dropdown_input:focus,
.mx_FilterDropdown .mx_Dropdown_input:hover {
  background-color: var(--cpd-color-gray-400);
  border-color: var(--cpd-color-gray-400);
}
.mx_FilterDropdown .mx_Dropdown_arrow {
  background: var(--cpd-color-text-secondary);
}
.mx_FilterDropdown_option {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: var(--cpd-color-text-primary);
  font-size: 0.75rem;
  line-height: 0.9375rem;
  padding: 8px 0 8px 20px;
  position: relative;
  width: 100%;
}
.mx_FilterDropdown_optionSelectedIcon {
  height: 14px;
  left: 0;
  position: absolute;
  top: 8px;
  width: 14px;
}
.mx_FilterDropdown_optionLabel {
  display: block;
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_FilterDropdown_optionDescription {
  color: var(--cpd-color-text-secondary);
  margin-top: 4px;
}
.mx_FilterTabGroup {
  color: var(--cpd-color-text-primary);
}
.mx_FilterTabGroup label {
  cursor: pointer;
  margin-right: 12px;
}
.mx_FilterTabGroup label span {
  display: inline-block;
  line-height: 1.5rem;
}
.mx_FilterTabGroup input[type="radio"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  margin: 0;
  padding: 0;
}
.mx_FilterTabGroup input[type="radio"]:focus + span,
.mx_FilterTabGroup input[type="radio"]:hover + span {
  color: var(--cpd-color-text-secondary);
}
.mx_FilterTabGroup input[type="radio"]:checked + span {
  -webkit-box-shadow: 0 1.5px 0 0 currentColor;
  box-shadow: 0 1.5px 0 0 currentColor;
  color: var(--cpd-color-text-action-accent);
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_LearnMore_button {
  margin-left: 4px;
}
.mx_EnableLiveShare {
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 32px 16px;
  text-align: center;
}
.mx_EnableLiveShare_heading {
  padding-top: 24px;
}
.mx_EnableLiveShare_icon {
  height: 58px;
  width: 58px;
}
.mx_EnableLiveShare_description {
  line-height: 1.25rem;
  margin-bottom: 32px;
  padding: 0 24px;
}
.mx_EnableLiveShare_button {
  height: 48px;
  margin-top: 32px;
  width: 100%;
}
.mx_LiveDurationDropdown {
  margin-bottom: 16px;
}
.mx_LocationShareMenu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 460px;
  width: 375px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_MapError {
  padding: 100px 32px 0;
  text-align: center;
  --mx-map-error-icon-color: var(--cpd-color-text-secondary);
  --mx-map-error-icon-size: 58px;
}
.mx_MapError.mx_MapError_isMinimised {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: var(--cpd-color-bg-subtle-secondary);
  font-size: 0.75rem;
  line-height: 1rem;
  padding: 24px;
  --mx-map-error-icon-color: var(--cpd-color-text-critical-primary);
  --mx-map-error-icon-size: 26px;
}
.mx_MapError.mx_MapError_isMinimised .mx_MapError_message {
  margin: 0;
  max-width: 275px;
}
.mx_MapError.mx_MapError_isMinimised .mx_MapError_heading {
  font-size: inherit !important;
  font-weight: 400 !important;
  padding-top: 8px;
}
.mx_MapError_message {
  margin: 16px 0 32px;
}
.mx_MapError_heading {
  padding-top: 24px;
}
.mx_MapError_icon {
  height: var(--mx-map-error-icon-size);
}
.mx_MapError_icon path {
  fill: var(--mx-map-error-icon-color);
}
.mx_MapFallback {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: var(--cpd-color-bg-subtle-primary);
  position: relative;
  z-index: 0;
}
.mx_MapFallback_bg {
  color: var(--cpd-color-gray-400);
  left: 0;
  min-height: 100%;
  min-width: 100%;
  pointer-events: none;
  position: absolute;
  top: 0;
  z-index: -1;
}
.mx_MapFallback_icon {
  color: var(--cpd-color-gray-600);
  margin-bottom: 16px;
  width: 65px;
}
.mx_Marker_defaultColor {
  color: var(--cpd-color-text-action-accent);
}
.mx_Marker_border {
  background-color: currentColor;
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-filter: drop-shadow(0 3px 5px rgba(0, 0, 0, 0.2));
  filter: drop-shadow(0 3px 5px rgba(0, 0, 0, 0.2));
  height: 42px;
  width: 42px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_Marker_border:before {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid;
  bottom: -4px;
  content: "";
  position: absolute;
}
.mx_Marker_icon {
  color: #fff;
  height: 20px;
}
.mx_ShareDialogButtons {
  height: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
.mx_ShareDialogButtons_button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: none;
  background-color: var(--cpd-color-gray-400);
  border: none;
  border-radius: 50%;
  color: var(--cpd-color-text-secondary);
  cursor: pointer;
  font-family: inherit;
  font-size: inherit;
  height: 24px;
  line-height: inherit;
  margin: 0;
  opacity: 0.8;
  padding: 0;
  position: absolute;
  text-align: center;
  top: 16px;
  width: 24px;
}
.mx_ShareDialogButtons_button:focus,
.mx_ShareDialogButtons_button:hover {
  opacity: 1;
}
.mx_ShareDialogButtons_button.left {
  left: 16px;
}
.mx_ShareDialogButtons_button.right {
  right: 16px;
}
.mx_ShareDialogButtons_button-icon {
  height: 10px;
  margin-top: 3px;
}
.mx_ShareType {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-primary);
  padding: 60px 12px 32px;
}
.mx_ShareType,
.mx_ShareType .mx_ShareType_wrapper_options {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_ShareType .mx_ShareType_wrapper_options {
  margin-top: 12px;
  row-gap: 12px;
  width: 100%;
}
.mx_ShareType .mx_ShareType_wrapper_options .mx_ShareType_option {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  background: none;
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 8px;
  color: var(--cpd-color-text-primary);
  font-family: inherit;
  font-size: 0.9375rem;
  justify-content: flex-start;
  line-height: inherit;
  padding: 8px 20px;
}
.mx_ShareType .mx_ShareType_wrapper_options .mx_ShareType_option:focus,
.mx_ShareType .mx_ShareType_wrapper_options .mx_ShareType_option:hover {
  border-color: var(--cpd-color-text-action-accent);
}
.mx_ShareType_badge {
  background-color: var(--cpd-color-text-action-accent);
  border: 14px solid var(--cpd-color-text-action-accent);
  border-radius: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #fff;
  height: 60px;
  margin-bottom: 20px;
  width: 60px;
}
.mx_ShareType_heading {
  padding-bottom: 32px;
  text-align: center;
}
.mx_ShareType_option-icon {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 40px;
  margin-right: 12px;
  width: 40px;
  -webkit-box-flex: 0;
  border-radius: 50%;
  border-style: solid;
  border-width: 2px;
  -ms-flex: 0 0 40px;
  flex: 0 0 40px;
}
.mx_ShareType_option-icon.Own,
.mx_ShareType_option-icon.Pin {
  border-color: var(--cpd-color-text-action-accent);
}
.mx_ShareType_option-icon.Pin {
  background-color: var(--cpd-color-text-action-accent);
  color: #fff;
  padding: 7px;
}
.mx_ZoomButtons {
  bottom: 32px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  right: 24px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  row-gap: 8px;
}
.mx_ZoomButtons .mx_ZoomButtons_button {
  border-radius: 4px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: var(--cpd-color-bg-canvas-default);
  -webkit-box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
  height: 24px;
  width: 24px;
}
.mx_ZoomButtons .mx_ZoomButtons_button .mx_ZoomButtons_icon {
  color: var(--cpd-color-text-primary);
  height: 10px;
  width: 10px;
}
.mx_MBeaconBody {
  border-radius: 8px;
  border-radius: var(--MBody-border-radius);
  height: 220px;
  max-width: 325px;
  overflow: hidden;
  position: relative;
  width: 100%;
}
.mx_MBeaconBody.mx_MBeaconBody_withoutMap {
  height: auto;
}
.mx_MBeaconBody.mx_MBeaconBody_withoutMap .mx_MBeaconBody_chin {
  background-color: transparent;
  position: relative;
}
.mx_MBeaconBody_withoutMapContent {
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 4px;
}
.mx_MBeaconBody_withoutMapInfoLastUpdated {
  color: var(--cpd-color-gray-800);
  font-size: 0.625rem;
  margin-top: -8px;
  padding: 0 8px 8px 48px;
}
.mx_MBeaconBody_map {
  cursor: pointer;
  height: 100%;
  width: 100%;
  z-index: 0;
}
.mx_MBeaconBody_mapError,
.mx_MBeaconBody_mapFallback {
  padding-bottom: 50px !important;
}
.mx_MBeaconBody_mapErrorInteractive {
  cursor: pointer;
}
.mx_MBeaconBody_mapFallback {
  cursor: default;
}
.mx_MBeaconBody_chin {
  background-color: var(--cpd-color-alpha-gray-1300);
  bottom: 0;
  position: absolute;
  width: 100%;
}
.mx_EventTile[data-layout="bubble"] .mx_EventTile_line .mx_MBeaconBody {
  max-width: 100%;
  width: 450px;
}
.mx_ReplyTile .mx_MBeaconBody {
  pointer-events: none;
}
.mx_MediaProcessingError_Icon {
  margin-right: 4px;
  vertical-align: text-top;
}
.mx_WidgetPip,
.mx_WidgetPip_overlay {
  height: 220px;
  width: 320px;
}
.mx_WidgetPip_overlay {
  border-radius: 8px;
  color: #fff;
  cursor: pointer;
  overflow: hidden;
  position: absolute;
  top: 0;
}
.mx_WidgetPip_footer,
.mx_WidgetPip_header {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 60px;
  left: 0;
  position: absolute;
  -webkit-transition: opacity 0.15s ease;
  transition: opacity 0.15s ease;
  width: 100%;
}
.mx_WidgetPip_overlay:not(:hover) .mx_WidgetPip_footer,
.mx_WidgetPip_overlay:not(:hover) .mx_WidgetPip_header {
  opacity: 0;
}
.mx_WidgetPip_header {
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(rgba(0, 0, 0, 0.9)),
    to(transparent)
  );
  background: linear-gradient(rgba(0, 0, 0, 0.9), transparent);
  font-size: 0.75rem;
  font-weight: var(--cpd-font-weight-semibold);
  padding: 12px;
  top: 0;
}
.mx_WidgetPip_backButton,
.mx_WidgetPip_header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_WidgetPip_backButton {
  height: 24px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 12px;
}
.mx_WidgetPip_backButton > .mx_Icon {
  color: #c1c6cd;
  padding: 0;
}
.mx_WidgetPip_footer {
  bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 12px 8px;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(transparent),
    to(rgba(0, 0, 0, 0.9))
  );
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.9));
}
.mx_PollOption {
  background-color: var(--cpd-color-bg-canvas-default);
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 8px;
  padding: 6px 12px;
}
.mx_PollOption .mx_PollOption_endedOption,
.mx_PollOption .mx_StyledRadioButton_content {
  margin-right: 0;
  padding-top: 2px;
}
.mx_PollOption .mx_StyledRadioButton_spacer {
  display: none;
}
.mx_PollOption,
.mx_PollOption_live-option {
  cursor: pointer;
}
.mx_PollOption_content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.mx_PollOption_optionVoteCount {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  white-space: nowrap;
}
.mx_PollOption_winnerIcon {
  color: var(--cpd-color-icon-accent-tertiary);
  height: 12px;
  margin-right: 4px;
  vertical-align: middle;
  width: 12px;
}
.mx_PollOption_checked {
  border-color: var(--cpd-color-border-interactive-hovered);
}
.mx_PollOption_checked
  .mx_PollOption_popularityBackground
  .mx_PollOption_popularityAmount {
  background-color: var(--cpd-color-icon-accent-tertiary);
}
.mx_PollOption_checked
  .mx_StyledRadioButton_checked
  input[type="radio"]:checked
  + div {
  background-color: var(--cpd-color-icon-accent-tertiary);
  background-image: url(../../img/element-icons/check-white.9400525.svg);
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 12px;
  border-color: var(--cpd-color-icon-accent-tertiary);
  border-width: 2px;
}
.mx_PollOption_checked
  .mx_StyledRadioButton_checked
  input[type="radio"]:checked
  + div
  div {
  visibility: hidden;
}
.mx_PollOption_checked,
.mx_PollOption_ended {
  pointer-events: none;
}
.mx_PollOption_popularityBackground {
  background-color: var(--cpd-color-bg-subtle-primary);
  border-radius: 8px;
  height: 8px;
  margin-right: 12px;
  margin-top: 8px;
  width: 100%;
}
.mx_PollOption_popularityBackground .mx_PollOption_popularityAmount {
  background-color: var(--cpd-color-gray-600);
  border-radius: 8px;
  height: 8px;
  width: 0;
}
.mx_CurrentDeviceSection_deviceDetails {
  margin-left: 56px;
}
.mx_DeviceDetailHeading {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_DeviceDetailHeading_renameCta {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_DeviceDetailHeading_renameForm {
  display: grid;
  grid-gap: 16px;
  -webkit-box-pack: left;
  -ms-flex-pack: left;
  grid-template-columns: 100%;
  justify-content: left;
}
.mx_DeviceDetailHeading_renameFormButtons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: 8px;
}
.mx_DeviceDetailHeading_renameFormButtons .mx_Spinner {
  width: auto;
  -webkit-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
}
.mx_DeviceDetailHeading_renameFormInput {
  margin: 0 0 4px !important;
}
.mx_DeviceDetailHeading_renameFormHeading {
  margin: 0;
}
.mx_DeviceDetailHeading_renameFormError {
  color: var(--cpd-color-text-critical-primary);
  display: block;
  padding-right: 4px;
}
.mx_DeviceDetails {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-top: 16px;
  padding: 24px;
}
.mx_DeviceDetails_section {
  border-bottom: 1px solid var(--cpd-color-gray-400);
  display: grid;
  margin-bottom: 20px;
  padding-bottom: 20px;
  grid-gap: 24px;
  -webkit-box-pack: left;
  -ms-flex-pack: left;
  grid-template-columns: 100%;
  justify-content: left;
}
.mx_DeviceDetails_section:last-child {
  border-bottom: 0;
  margin-bottom: 0;
  padding-bottom: 0;
}
.mx_DeviceDetails_sectionHeading {
  margin: 0;
}
.mx_DeviceDetails_sectionHeading .mx_DeviceDetails_sectionSubheading {
  color: var(--cpd-color-text-secondary);
  display: block;
  font-size: 0.75rem;
  line-height: 0.875rem;
  margin-top: 4px;
}
.mx_DeviceDetails_metadataTable {
  border-spacing: 0;
  color: var(--cpd-color-text-secondary);
  font: var(--cpd-font-body-sm-regular);
  width: 100%;
}
.mx_DeviceDetails_metadataTable th {
  font-weight: 400;
  text-align: left;
  text-transform: uppercase;
}
.mx_DeviceDetails_metadataTable td {
  padding-top: 8px;
}
.mx_DeviceDetails_metadataTable .mxDeviceDetails_metadataLabel {
  width: 160px;
}
.mx_DeviceDetails_metadataTable .mxDeviceDetails_metadataValue {
  color: var(--cpd-color-text-primary);
}
.mx_DeviceDetails_signOutButtonContent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
}
.mx_DeviceDetails_pushNotifications {
  display: block;
}
.mx_DeviceDetails_pushNotifications .mx_ToggleSwitch {
  float: right;
}
.mx_DeviceExpandDetailsButton {
  background: transparent;
  border-radius: 4px;
  color: var(--cpd-color-icon-tertiary);
  height: 32px;
  width: 32px;
  --icon-transform: rotate(-90deg);
}
.mx_DeviceExpandDetailsButton:hover {
  background: var(--cpd-color-gray-400);
}
.mx_DeviceExpandDetailsButton.mx_DeviceExpandDetailsButton_expanded {
  --icon-transform: rotate(0deg);
  background: var(--cpd-color-bg-subtle-primary);
}
.mx_DeviceExpandDetailsButton.mx_DeviceExpandDetailsButton_expanded:hover {
  background: var(--cpd-color-gray-400);
}
.mx_DeviceExpandDetailsButton_icon {
  height: 16px;
  -webkit-transform: var(--icon-transform);
  transform: var(--icon-transform);
  -webkit-transform-origin: center;
  transform-origin: center;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  width: 16px;
}
.mx_DeviceSecurityCard {
  width: 100%;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  border: 1px solid var(--cpd-color-gray-400);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 16px;
}
.mx_DeviceSecurityCard,
.mx_DeviceSecurityCard_icon {
  border-radius: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_DeviceSecurityCard_icon {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 40px;
  flex: 0 0 40px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  background-color: var(--background-color);
  color: var(--icon-color);
  height: 40px;
  justify-content: center;
  margin-right: 16px;
  width: 40px;
}
.mx_DeviceSecurityCard_icon.Verified {
  --icon-color: var(--cpd-color-icon-success-primary);
  --background-color: var(--cpd-color-green-300);
}
.mx_DeviceSecurityCard_icon.Unverified {
  --icon-color: var(--cpd-color-icon-critical-primary);
  --background-color: var(--cpd-color-red-300);
}
.mx_DeviceSecurityCard_icon.Inactive {
  --icon-color: var(--cpd-color-text-secondary);
  --background-color: var(--cpd-color-bg-subtle-secondary);
}
.mx_DeviceSecurityCard_content {
  -webkit-box-flex: 1;
  -ms-flex: 1 1;
  flex: 1 1;
}
.mx_DeviceSecurityCard_heading {
  margin: 0 0 4px;
}
.mx_DeviceSecurityCard_description {
  color: var(--cpd-color-text-secondary);
  font: var(--cpd-font-body-sm-regular);
  margin: 0;
}
.mx_DeviceSecurityCard_actions {
  margin-top: 16px;
}
.mx_DeviceTile {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
}
.mx_DeviceTile_interactive {
  cursor: pointer;
}
.mx_DeviceTile_info {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
}
.mx_DeviceTile_metadata {
  color: var(--cpd-color-text-secondary);
  font: var(--cpd-font-body-sm-regular);
  margin-top: 4px;
}
.mx_DeviceTile_inactiveIcon {
  height: 14px;
  margin-right: 8px;
  vertical-align: middle;
}
.mx_DeviceTile_actions {
  display: grid;
  grid-gap: 8px;
  grid-auto-flow: column;
  margin-left: 8px;
}
.mx_DeviceTypeIcon {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  margin-right: 8px;
  padding: 0 8px 8px 0;
  position: relative;
}
.mx_DeviceTypeIcon_deviceIconWrapper {
  --background-color: var(--cpd-color-bg-subtle-secondary);
  --icon-color: var(--cpd-color-text-secondary);
  background-color: var(--cpd-color-bg-subtle-secondary);
  background-color: var(--background-color);
  border: 8px solid var(--background-color);
  border-radius: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: var(--cpd-color-text-secondary);
  color: var(--icon-color);
  height: 40px;
  width: 40px;
}
.mx_DeviceTypeIcon_selected .mx_DeviceTypeIcon_deviceIconWrapper {
  --background-color: var(--cpd-color-text-primary);
  --icon-color: var(--cpd-color-bg-canvas-default);
}
.mx_DeviceTypeIcon_deviceIcon {
  height: 24px;
  width: 24px;
}
.mx_DeviceTypeIcon_verificationIcon {
  background-color: var(--cpd-color-bg-canvas-default);
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 50%;
  bottom: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: var(--v-icon-color);
  height: 24px;
  padding: 4px;
  position: absolute;
  right: 0;
  width: 24px;
}
.mx_DeviceTypeIcon_verificationIcon.verified {
  --v-icon-color: var(--cpd-color-icon-success-primary);
}
.mx_DeviceTypeIcon_verificationIcon.unverified {
  --v-icon-color: var(--cpd-color-icon-critical-primary);
}
.mx_FilteredDeviceList .mx_Dropdown {
  -webkit-box-flex: 1;
  -ms-flex: 1 0 80px;
  flex: 1 0 80px;
}
.mx_FilteredDeviceList_list {
  display: grid;
  list-style-type: none;
  grid-gap: 16px;
  margin: 0;
  padding: 0 16px;
}
.mx_FilteredDeviceList_listItem {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_FilteredDeviceList_securityCard {
  margin-bottom: 32px;
}
.mx_FilteredDeviceList_noResults {
  margin-bottom: 32px;
  text-align: center;
  width: 100%;
}
.mx_FilteredDeviceList_headerButton {
  -ms-flex-negative: 0;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  flex-shrink: 0;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: 8px;
}
.mx_FilteredDeviceList_deviceDetails {
  margin-left: 88px;
}
.mx_FilteredDeviceListHeader {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: var(--cpd-color-text-secondary);
  gap: 16px;
  height: 48px;
  margin-bottom: 32px;
  padding: 0 16px;
  width: 100%;
}
.mx_FilteredDeviceListHeader .mx_AccessibleButton.mx_AccessibleButton_hasKind {
  -ms-flex-item-align: center;
  align-self: center;
}
.mx_FilteredDeviceListHeader_label {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 100%;
  flex: 1 1 100%;
}
.mx_SecurityRecommendations_spacing {
  height: 16px;
}
.mx_SelectableDeviceTile {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
}
.mx_SelectableDeviceTile_checkbox {
  -webkit-box-flex: 1;
  -ms-flex: 1 0;
  flex: 1 0;
}
.mx_SelectableDeviceTile_checkbox .mx_Checkbox_background + div {
  -webkit-box-flex: 1;
  -ms-flex: 1 0;
  flex: 1 0;
  margin-left: 16px !important;
}
.mx_SettingsSubsection {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
}
.mx_SettingsSubsection_description {
  margin-top: 8px;
}
.mx_SettingsSubsection_text {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
  color: var(--cpd-color-text-secondary);
  width: 100%;
}
.mx_SettingsSubsection_content {
  display: grid;
  width: 100%;
  grid-gap: 8px;
  grid-template-columns: minmax(0, 1fr);
  justify-items: flex-start;
  margin-top: 24px;
  
}
.mx_SettingsSubsection_content summary {
  color: var(--cpd-color-text-action-accent);
}
.mx_SettingsSubsection_content details[open] summary {
  margin-bottom: 8px;
}
.mx_SettingsSubsection_content.mx_SettingsSubsection_contentStretch {
  justify-items: stretch;
}
.mx_SettingsSubsection_content.mx_SettingsSubsection_noHeading {
  margin-top: 0;
}
.mx_SettingsSubsectionHeading {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: 8px;
}
.mx_SettingsSubsectionHeading_heading {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 100%;
  flex: 1 1 100%;
}
.mx_QuickThemeSwitcher {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_QuickThemeSwitcher .mx_Dropdown {
  height: -webkit-min-content;
  height: -moz-min-content;
  height: min-content;
  margin-left: auto;
  min-width: 100px;
}
.mx_QuickThemeSwitcher .mx_Dropdown_menu {
  max-height: 70px;
}
.mx_Dropdown {
  color: var(--cpd-color-text-primary);
  position: relative;
  display: none !important;
}
.mx_QuickThemeSwitcher_heading {
  color: var(--cpd-color-text-secondary);
  display: inline-block;
  font-size: 0.75rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 0.9375rem;
  margin: 0;
  text-transform: uppercase;
}
.mx_Caption {
  color: var(--cpd-color-text-secondary);
  font: var(--cpd-font-body-sm-regular);
}
.mx_Caption.mx_Caption_error {
  color: var(--cpd-color-text-critical-primary);
}
.mx_Box--flex {
  -webkit-box-flex: initial;
  -ms-flex: initial;
  flex: initial;
  -webkit-box-flex: var(--mx-box-flex, unset);
  -ms-flex: var(--mx-box-flex, unset);
  flex: var(--mx-box-flex, unset);
}
.mx_Box--shrink {
  -ms-flex-negative: initial;
  flex-shrink: 1;
  -ms-flex-negative: var(--mx-box-shrink, unset);
  flex-shrink: var(--mx-box-shrink, unset);
}
.mx_Box--grow {
  -webkit-box-flex: initial;
  -ms-flex-positive: initial;
  flex-grow: 0;
  flex-grow: var(--mx-box-grow, unset);
}
.mx_Flex {
  display: inline;
  display: initial;
  display: var(--mx-flex-display, unset);
  -webkit-box-orient: initial;
  -webkit-box-direction: initial;
  -ms-flex-direction: initial;
  flex-direction: row;
  flex-direction: var(--mx-flex-direction, unset);
  -webkit-box-align: initial;
  -ms-flex-align: initial;
  align-items: normal;
  -webkit-box-align: var(--mx-flex-align, unset);
  -ms-flex-align: var(--mx-flex-align, unset);
  align-items: var(--mx-flex-align, unset);
  -webkit-box-pack: initial;
  -ms-flex-pack: initial;
  justify-content: normal;
  -webkit-box-pack: var(--mx-flex-justify, unset);
  -ms-flex-pack: var(--mx-flex-justify, unset);
  gap: initial;
  gap: var(--mx-flex-gap, unset);
  justify-content: var(--mx-flex-justify, unset);
}
.mx_Icon {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.mx_Icon_accent {
  color: var(--cpd-color-text-action-accent);
}
.mx_Icon_bg-accent-light {
  background-color: var(--cpd-color-green-300);
}
.mx_Icon_alert {
  color: var(--cpd-color-text-critical-primary);
}
.mx_Icon_circle-40 {
  border-radius: 20px;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 40px;
  flex: 0 0 40px;
  height: 40px;
  padding: 0 12px;
  width: 40px;
}
.mx_Icon_8 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 8px;
  flex: 0 0 8px;
  height: 8px;
  width: 8px;
}
.mx_Icon_10 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 10px;
  flex: 0 0 10px;
  height: 10px;
  width: 10px;
}
.mx_Icon_12 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 12px;
  flex: 0 0 12px;
  height: 12px;
  width: 12px;
}
.mx_Icon_16 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 16px;
  flex: 0 0 16px;
  height: 16px;
  width: 16px;
}
.mx_Icon_24 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 24px;
  flex: 0 0 24px;
  height: 24px;
  width: 24px;
}
.mx_Icon_32 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 32px;
  flex: 0 0 32px;
  height: 32px;
  width: 32px;
}
.mx_SuccessDialog {
  text-align: center;
}
.mx_SuccessDialog .mx_Icon {
  margin-bottom: 16px;
}
.mx_SuccessDialog .mx_Dialog_header {
  margin: 0 0 16px;
  padding: 0;
}
.mx_SuccessDialog .mx_Dialog_title {
  margin: 0;
}
.mx_SuccessDialog .mx_Dialog_content {
  color: var(--cpd-color-text-secondary);
  margin: 0 0 40px;
}
.mx_SuccessDialog .mx_Dialog_buttons .mx_Dialog_buttons_row {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_SuccessDialog
  .mx_Dialog_buttons
  .mx_Dialog_buttons_row
  button.mx_Dialog_primary {
  height: 48px;
  min-width: 328px;
}
html {
  scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
}
* {
  scrollbar-width: thin;
}
::-webkit-scrollbar {
  height: 6px;
  width: 6px;
}
::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 3px;
}
.mx_AutoHideScrollbar:hover {
  scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
}
.mx_AutoHideScrollbar:hover::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.2);
}
.mx_AutoHideScrollbar {
  overflow-x: hidden;
  overflow-y: auto;
  overflow-y: overlay;
  -ms-overflow-style: -ms-autohiding-scrollbar;
}
.mx_AutoHideScrollbar::-webkit-scrollbar,
.mx_AutoHideScrollbar::-webkit-scrollbar-thumb {
  background-color: transparent;
}
.mx_AutoHideScrollbar {
  scrollbar-color: transparent transparent;
}
.mx_AutocompleteInput {
  position: relative;
}
.mx_AutocompleteInput_search_icon {
  margin-left: 8px;
  fill: var(--cpd-color-text-secondary);
}
.mx_AutocompleteInput_editor {
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1;
  flex: 1;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border: 1px solid #e7e7e7;
  border-radius: 4px;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-transition: border-color 0.25s;
  transition: border-color 0.25s;
}
.mx_AutocompleteInput_editor > input {
  -webkit-box-flex: 1;
  border: none !important;
  color: var(--cpd-color-text-primary) !important;
  -ms-flex: 1;
  flex: 1;
  font-weight: 400 !important;
  margin: 0 !important;
  min-width: 40%;
  padding: 8px 9px;
  resize: none;
}
.mx_AutocompleteInput_editor > input::-webkit-input-placeholder {
  color: var(--cpd-color-text-primary) !important;
  font-weight: 400 !important;
}
.mx_AutocompleteInput_editor > input::-moz-placeholder {
  color: var(--cpd-color-text-primary) !important;
  font-weight: 400 !important;
}
.mx_AutocompleteInput_editor > input:-ms-input-placeholder {
  color: var(--cpd-color-text-primary) !important;
  font-weight: 400 !important;
}
.mx_AutocompleteInput_editor > input::-ms-input-placeholder {
  color: var(--cpd-color-text-primary) !important;
  font-weight: 400 !important;
}
.mx_AutocompleteInput_editor > input::placeholder {
  color: var(--cpd-color-text-primary) !important;
  font-weight: 400 !important;
}
.mx_AutocompleteInput_editor--focused {
  border-color: var(--cpd-color-text-link-external);
}
.mx_AutocompleteInput_editor--has-suggestions {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.mx_AutocompleteInput_editor_selection {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-left: 8px;
}
.mx_AutocompleteInput_editor_selection_pill {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: var(--cpd-color-text-decorative-1);
  border-radius: 12px;
  color: #fff;
  font-size: 0.75rem;
  padding-left: 8px;
  padding-right: 8px;
}
.mx_AutocompleteInput_editor_selection_remove_button {
  padding: 0 4px;
}
.mx_AutocompleteInput_matches {
  background-color: var(--cpd-color-bg-canvas-default);
  border: 1px solid var(--cpd-color-text-link-external);
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  border-top: 1px solid #e7e7e7;
  left: 0;
  position: absolute;
  right: 0;
  z-index: 1000;
}
.mx_AutocompleteInput_suggestion {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
  padding: 8px;
}
.mx_AutocompleteInput_suggestion > * {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.mx_AutocompleteInput_suggestion:hover {
  background-color: var(--cpd-color-gray-400);
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}
.mx_AutocompleteInput_suggestion--selected {
  background-color: var(--cpd-color-gray-400);
}
.mx_AutocompleteInput_suggestion--selected:last-child {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}
.mx_AutocompleteInput_suggestion_title {
  margin-right: 8px;
}
.mx_AutocompleteInput_suggestion_description {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
}
.mx_BackdropPanel {
  -webkit-filter: blur(40px);
  filter: blur(40px);
  -webkit-filter: blur(var(--lp-background-blur));
  filter: blur(var(--lp-background-blur));
  height: 100vh;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  width: 100%;
}
.mx_BackdropPanel,
.mx_BackdropPanel--image {
  left: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
}
.mx_BackdropPanel--image {
  min-height: 100%;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  z-index: 0;
}
.mx_CompatibilityPage {
  background-color: #e55;
  height: 100%;
  width: 100%;
}
.mx_CompatibilityPage_box {
  background-color: #fcc;
  border: 1px solid;
  height: 300px;
  inset: 0;
  margin: auto;
  padding: 10px;
  position: absolute;
  width: 500px;
}
.mx_ContextualMenu_wrapper {
  position: fixed;
  z-index: 5000;
}
.mx_ContextualMenu_background {
  height: 100%;
  left: 0;
  opacity: 1;
  position: fixed;
  top: 0;
  width: 100%;
}
.mx_UserOnboardingHeader_image{
  width: 25% !important;
}
.mx_UserOnboardingHeader {
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-fill-mode: backwards;
  animation-fill-mode: backwards;
  -webkit-animation-name: mx_UserOnboardingHeader_slideIn;
  animation-name: mx_UserOnboardingHeader_slideIn;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
  /* background: var(--cpd-color-bg-subtle-primary); */
  border-radius: 16px;
  -ms-flex-direction: row;
  flex-direction: column;
  gap: 64px;
  padding: 32px;
  will-change: opacity, transform;
  align-content: center;
  justify-content: center;
  align-items: center;
}
/* Mobile media query for screens 768px or smaller */
@media (max-width: 500px) {
    .mx_ContextualMenu_wrapper {
        position: fixed;
        z-index: 5000;
        display: flex;
        align-items: center;
        justify-content: center;
        align-content: center;
        flex-direction: column;
        width: 100%;
        padding: 10px; /* Added padding for smaller screens */
    }
    .mx_UserOnboardingHeader_image{
      display: none !important;
    }
    .p{
        font-size: 0.5em !important;
  }
    .mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenuType {
        border: 1px solid #e7e7e7;
        border-radius: 8px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        font-size: 1rem; /* Adjusted font size for mobile */
        font-weight: var(--cpd-font-weight-semibold);
        margin: 8px 0; /* Reduced margin for mobile */
        padding: 12px 24px 12px 56px; /* Adjusted padding for mobile */
        position: relative;
        width: 90%; /* Reduced width for mobile */
    }
    .mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenuType {
    border: 1px solid #e7e7e7;
    border-radius: 8px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 1.0625rem;
    font-weight: var(--cpd-font-weight-semibold);
    margin: 10px 0;
    padding: 16px 32px 16px 72px;
    position: relative;
    width: 100%;
}
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu {
    background-color: var(--cpd-color-bg-canvas-default);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 24px;
    position: relative;
    width: 100%;
}
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenuType {
    border: 1px solid #e7e7e7;
    border-radius: 8px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 1.0625rem;
    font-weight: var(--cpd-font-weight-semibold);
    margin: 20px 0;
    padding: 16px 32px 16px 72px;
    position: relative;
    width: 100%;
}
}

.main-title {
  font-size: 1em;
  color: green;
  margin-bottom: 10px;
  text-align: center;
  display: block;
}

.text-container {
  padding: 20px;
  background-color: rgb(245, 245, 245);
  display: flex;
  align-content: center;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.description-text {
  color: #333;
  font-size: 0.9em !important;
  text-align: center;
  margin-bottom: 10px;
  display: block;
  font-weight: 800;
  font-family: ui-sans-serif;
}

.action-text {
  color: #666;
  font-size: 1em !important;
  display: block;
  margin: 0;
}
/* Default styling for larger screens */
.header-image {
  width: 50%;
  max-width: 400px;
  margin-bottom: 20px;
}

.main-title {
  font-size: 1em;
  color: green;
  margin-bottom: 10px;
  text-align: center;
  display: block;
}

.text-container {
  padding: 20px;
  background-color: rgb(245, 245, 245);
  display: flex;
  align-content: center;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}


.action-text {
  color: #666;
  font-size: 0.55em !important;
  display: block;
  margin: 0;
}
.header-container {
  display: flex;
  flex-direction: column;
  align-content: center;
  justify-content: center;
  align-items: center;
}

/* Mobile version - reducing the values */
@media (max-width: 500px) {

  .header-container {
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    align-items: center;
}
  .header-image {
    max-width: 50%; /* Half of the original size */
    
  }

  .main-title {
    font-size: 0.75em; /* Reduce font size */
    margin-bottom: 5px; /* Reduce margin */
  }

  .text-container {
    padding: 8% 0% 8% 1%;
    width: 100%;
}

  .description-text {
    font-size: 1em !important; /* Reduced font size */
    margin-bottom: 5px; /* Reduce margin */
  }

  .action-text {
    font-size: 0.5em !important; /* Reduced font size */
  }
}


.mx_ContextualMenu {
  background-color: whitesmoke;
  border: var(--cpd-border-width-1) solid
  var(--cpd-color-border-interactive-secondary);
  border-radius: 12px;
  -webkit-box-shadow: 0 4px 24px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.1);
  color: var(--cpd-color-text-primary);
  position: absolute;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  z-index: 5001;
}
.mx_ContextualMenu_right {
  right: 16px;
}
.mx_ContextualMenu.mx_ContextualMenu_withChevron_right {
  right: 8px;
}
.mx_ContextualMenu_chevron_right {
  border-bottom: 8px solid transparent;
  border-left: 8px solid var(--cpd-color-bg-canvas-default);
  border-top: 8px solid transparent;
  height: 0;
  position: absolute;
  right: -8px;
  top: 0;
  width: 0;
}
.mx_ContextualMenu_left {
  left: 0;
}
.mx_ContextualMenu.mx_ContextualMenu_withChevron_left {
  left: 8px;
}
.mx_ContextualMenu_chevron_left {
  border-bottom: 8px solid transparent;
  border-right: 8px solid var(--cpd-color-bg-canvas-default);
  border-top: 8px solid transparent;
  height: 0;
  left: -8px;
  position: absolute;
  top: 0;
  width: 0;
}
.mx_ContextualMenu_top {
  top: 0;
}
.mx_ContextualMenu.mx_ContextualMenu_withChevron_top {
  top: 8px;
}
.mx_ContextualMenu_chevron_top {
  border-bottom: 8px solid var(--cpd-color-bg-canvas-default);
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  height: 0;
  left: 0;
  position: absolute;
  top: -8px;
  width: 0;
}
.mx_ContextualMenu_bottom {
  bottom: 0;
}
.mx_ContextualMenu.mx_ContextualMenu_withChevron_bottom {
  bottom: 8px;
}
.mx_ContextualMenu_chevron_bottom {
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid var(--cpd-color-bg-canvas-default);
  bottom: -8px;
  height: 0;
  left: 0;
  position: absolute;
  width: 0;
}
.mx_ContextualMenu_rightAligned {
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
}
.mx_ContextualMenu_bottomAligned {
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}
.mx_ErrorMessage {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-critical-primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 0.75rem;
  gap: 8px;
  line-height: 1.2em;
  min-height: 2.4em;
}
@-webkit-keyframes mx_FileDropTarget_animation {
  0% {
    opacity: 0;
  }
  to {
    opacity: 0.95;
  }
}
@keyframes mx_FileDropTarget_animation {
  0% {
    opacity: 0;
  }
  to {
    opacity: 0.95;
  }
}
.mx_FileDropTarget {
  background-color: var(--cpd-color-bg-canvas-default);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 1.125rem;
  height: 100%;
  min-width: 0;
  opacity: 0.95;
  pointer-events: none;
  position: absolute;
  text-align: center;
  width: 100%;
  z-index: 3000;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-animation: mx_FileDropTarget_animation;
  animation: mx_FileDropTarget_animation;
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
}
@-webkit-keyframes mx_FileDropTarget_image_animation {
  0% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
  }
  to {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}
@keyframes mx_FileDropTarget_image_animation {
  0% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
  }
  to {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}
.mx_FileDropTarget_image {
  -webkit-animation: mx_FileDropTarget_image_animation;
  animation: mx_FileDropTarget_image_animation;
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  margin-bottom: 16px;
  width: 32px;
}
.mx_FilePanel {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  overflow-y: auto;
}
.mx_FilePanel .mx_RoomView_messageListWrapper {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_FilePanel .mx_RoomView_MessageList {
  width: 100%;
}
.mx_FilePanel .mx_EventTile_avatar,
.mx_FilePanel .mx_RoomView_MessageList h2 {
  display: none;
}
.mx_FilePanel .mx_EventTile {
  margin-top: 10px;
  padding-top: 0;
  word-break: break-word;
}
.mx_FilePanel .mx_EventTile .mx_EventTile_line {
  -webkit-padding-start: 0;
  padding-inline-start: 0;
}
.mx_FilePanel .mx_EventTile .mx_MFileBody {
  line-height: 2.4rem;
}
.mx_FilePanel .mx_EventTile .mx_MFileBody_download {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 8px;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  color: #acacac;
  font: var(--cpd-font-body-md-regular);
  justify-content: space-between;
}
.mx_FilePanel .mx_EventTile .mx_MFileBody_download .mx_MImageBody_size {
  font: var(--cpd-font-body-md-regular);
  text-align: right;
  white-space: nowrap;
}
.mx_FilePanel .mx_EventTile .mx_MFileBody_downloadLink {
  -webkit-box-flex: 1;
  color: #747474;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
}
.mx_FilePanel .mx_EventTile .mx_EventTile_senderDetailsLink {
  text-decoration: none;
}
.mx_FilePanel
  .mx_EventTile
  .mx_EventTile_senderDetailsLink
  .mx_EventTile_senderDetails {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-top: -2px;
}
.mx_FilePanel
  .mx_EventTile
  .mx_EventTile_senderDetailsLink
  .mx_EventTile_senderDetails
  .mx_DisambiguatedProfile {
  color: #acacac;
}
.mx_FilePanel
  .mx_EventTile
  .mx_EventTile_senderDetailsLink
  .mx_EventTile_senderDetails
  .mx_MessageTimestamp {
  color: var(--cpd-color-text-secondary);
  font: var(--cpd-font-body-sm-regular);
  text-align: right;
}
.mx_FilePanel .mx_EventTile_line {
  -webkit-margin-end: 0;
  margin-inline-end: 0;
  -webkit-padding-start: 0;
  padding-inline-start: 0;
}
.mx_FilePanel_empty:before {
  --maskImage: url(../../img/element-icons/room/files.ff2ae8d.svg);
}
.mx_GenericDropdownMenu_button {
  border-radius: 4px;
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  line-height: 1.5;
  padding: 3px 4px 3px 8px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.mx_GenericDropdownMenu_button:hover,
.mx_GenericDropdownMenu_button[aria-expanded="true"] {
  background: var(--cpd-color-gray-400);
}
.mx_GenericDropdownMenu_button:before {
  background: currentColor;
  content: "";
  float: right;
  height: 18px;
  -webkit-mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100%;
  mask-size: 100%;
  width: 18px;
}
.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper .mx_ContextualMenu {
  border: 1px solid var(--cpd-color-gray-400);
  -webkit-box-shadow: 0 1px 3px rgba(23, 25, 28, 0.05);
  box-shadow: 0 1px 3px rgba(23, 25, 28, 0.05);
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  padding-bottom: 10px;
  padding-top: 10px;
  position: static;
}
.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper
  .mx_ContextualMenu_chevron_top {
  border-bottom-color: var(--cpd-color-gray-400);
  left: auto;
  right: 22px;
}
.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper
  .mx_ContextualMenu_chevron_top:after {
  border: inherit;
  border-bottom-color: var(--cpd-color-bg-canvas-default);
  content: "";
  left: -8px;
  position: absolute;
  top: 1px;
}
.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper
  .mx_GenericDropdownMenu_divider {
  border-top: 1px solid var(--cpd-color-gray-400);
  display: block;
  height: 0;
  margin-left: 4px;
  margin-right: 19px;
}
.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper
  .mx_GenericDropdownMenu_Option {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 10px 20px 10px 30px;
  position: relative;
}
.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper
  .mx_GenericDropdownMenu_Option
  > .mx_GenericDropdownMenu_Option--label {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  margin: 0;
}
.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper
  .mx_GenericDropdownMenu_Option
  > .mx_GenericDropdownMenu_Option--label
  span:first-child {
  color: var(--cpd-color-text-primary);
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper
  .mx_GenericDropdownMenu_Option.mx_GenericDropdownMenu_Option--header
  > .mx_GenericDropdownMenu_Option--label
  span:first-child {
  font-size: 0.9375rem;
}
.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper
  .mx_GenericDropdownMenu_Option.mx_GenericDropdownMenu_Option--item:hover {
  background-color: #f5f8fa;
}
.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper
  .mx_GenericDropdownMenu_Option.mx_GenericDropdownMenu_Option--item[aria-checked="true"]:before {
  background-color: var(--cpd-color-text-primary);
  content: "";
  display: inline-block;
  height: 12px;
  margin-left: -20px;
  margin-right: 8px;
  -webkit-mask-image: url(../../img/feather-customised/check.bfca953.svg);
  mask-image: url(../../img/feather-customised/check.bfca953.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100%;
  mask-size: 100%;
  vertical-align: middle;
  width: 12px;
}
.mx_GenericErrorPage {
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  width: 100%;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_GenericErrorPage_box {
  background-color: #fcc;
  border: 1px solid #f22;
  display: inline;
  min-height: 125px;
  padding: 10px 10px 20px;
  width: 500px;
}
.mx_HomePage {
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  max-width: 960px;
  width: 100%;
}
.mx_HomePage_default {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-align: center;
}
.mx_HomePage_default .mx_HomePage_default_wrapper {
  margin: auto;
}
.mx_HomePage_default img {
  height: 48px;
}
.mx_HomePage_default h1 {
  font-size: 1.5rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.375;
  margin-bottom: 25px;
  color: #488D41;
  
}
.mx_HomePage_default h2 {
  color: #488D41;
  font-size: 0.85rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.5625rem;
  margin-top: 4px;
}
.mx_HomePage_default .mx_MiniAvatarUploader {
  margin: 0 auto;
}
.mx_HomePage_default .mx_HomePage_default_buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 60px auto 0;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.mx_HomePage_default .mx_HomePage_default_buttons .mx_AccessibleButton {
  background-color: #488D41;
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #fff;
  display: inline-block;
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.25rem;
  margin: 20px;
  min-height: 132px;
  padding: 73px 8px 15px;
  position: relative;
  vertical-align: top;
  width: 160px;
  word-break: break-word;
  display: none;
}
.mx_HomePage_default .mx_HomePage_default_buttons .mx_AccessibleButton:before {
  background-color: #fff;
  content: "";
  height: 40px;
  left: 60px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 20px;
  width: 40px;
}
.mx_HomePage_default
  .mx_HomePage_default_buttons
  .mx_AccessibleButton.mx_HomePage_button_sendDm:before {
  -webkit-mask-image: url(../../img/element-icons/feedback.0bc9353.svg);
  mask-image: url(../../img/element-icons/feedback.0bc9353.svg);
}
.mx_HomePage_default
  .mx_HomePage_default_buttons
  .mx_AccessibleButton.mx_HomePage_button_explore:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/explore.6738ed6.svg);
  mask-image: url(../../img/element-icons/roomlist/explore.6738ed6.svg);
}
.mx_HomePage_default
  .mx_HomePage_default_buttons
  .mx_AccessibleButton.mx_HomePage_button_createGroup:before {
  -webkit-mask-image: url(../../img/element-icons/group-members.d86d751.svg);
  mask-image: url(../../img/element-icons/group-members.d86d751.svg);
}
.mx_LargeLoader {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  height: 100%;
}
.mx_LargeLoader .mx_Spinner {
  -webkit-box-flex: initial;
  -ms-flex: initial;
  flex: initial;
  height: auto;
  margin-bottom: 32px;
  margin-top: 33vh;
}
.mx_LargeLoader .mx_LargeLoader_text {
  font-size: 24px;
  font-weight: var(--cpd-font-weight-semibold);
  padding: 0 16px;
  position: relative;
  text-align: center;
}
.mx_MatrixChat--with-avatar .mx_LeftPanel,
.mx_MatrixChat--with-avatar .mx_LeftPanel .mx_LeftPanel_roomListContainer {
  background-color: white !important;
}
.mx_LeftPanel_outerWrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  contain: layout paint;
  -ms-flex-direction: column;
  flex-direction: column;
  /* max-width: 80%; */
  position: relative;
}
.mx_LeftPanel,
.mx_LeftPanel_wrapper {
  --collapsedWidth: 68px;
}
.mx_LeftPanel_wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  height: 100%;
}
.mx_LeftPanel_wrapper .mx_LeftPanel_wrapper--user {
  background-color: hsla(0, 0%, 96%, 0.9);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  position: relative;
}
.mx_LeftPanel_wrapper .mx_LeftPanel_wrapper--user[data-collapsed] {
  max-width: var(--collapsedWidth);
}
.mx_LeftPanel {
  background-color: hsla(0, 0%, 96%, 0.9);
  contain: content;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  overflow: hidden;
}
.mx_LeftPanel .mx_LeftPanel_roomListContainer {
  background-color: hsla(0, 0%, 96%, 0.9);
  -webkit-box-flex: 1;
  -ms-flex: 1 0 0px;
  flex: 1 0 0;
  min-width: 0;
}
.mx_LeftPanel .mx_LeftPanel_roomListContainer,
.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_userHeader {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_userHeader {
  padding: 12px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_breadcrumbsContainer {
  margin: 12px 12px 0;
  overflow-x: scroll;
  overflow-y: hidden;
  -webkit-box-flex: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  contain: content;
}
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_breadcrumbsContainer.mx_IndicatorScrollbar_leftOverflow {
  -webkit-mask-image: -webkit-gradient(
    linear,
    left top,
    right top,
    from(transparent),
    color-stop(5%, #000)
  );
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%);
  mask-image: -webkit-gradient(
    linear,
    left top,
    right top,
    from(transparent),
    color-stop(5%, #000)
  );
  mask-image: linear-gradient(90deg, transparent, #000 5%);
}
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_breadcrumbsContainer.mx_IndicatorScrollbar_rightOverflow {
  -webkit-mask-image: -webkit-gradient(
    linear,
    left top,
    right top,
    from(#000),
    color-stop(95%, #000),
    to(transparent)
  );
  -webkit-mask-image: linear-gradient(90deg, #000, #000 95%, transparent);
  mask-image: -webkit-gradient(
    linear,
    left top,
    right top,
    from(#000),
    color-stop(95%, #000),
    to(transparent)
  );
  mask-image: linear-gradient(90deg, #000, #000 95%, transparent);
}
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_breadcrumbsContainer.mx_IndicatorScrollbar_rightOverflow.mx_IndicatorScrollbar_leftOverflow {
  -webkit-mask-image: -webkit-gradient(
    linear,
    left top,
    right top,
    from(transparent),
    color-stop(5%, #000),
    color-stop(95%, #000),
    to(transparent)
  );
  -webkit-mask-image: linear-gradient(
    90deg,
    transparent,
    #000 5%,
    #000 95%,
    transparent
  );
  mask-image: -webkit-gradient(
    linear,
    left top,
    right top,
    from(transparent),
    color-stop(5%, #000),
    color-stop(95%, #000),
    to(transparent)
  );
  mask-image: linear-gradient(
    90deg,
    transparent,
    #000 5%,
    #000 95%,
    transparent
  );
}
.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer {
  border-bottom: 1px solid var(--cpd-color-gray-400);
  margin: 0 12px;
  padding: 12px 0 8px;
  -ms-flex-negative: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-shrink: 0;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_filterContainer
  + .mx_RoomListHeader {
  margin-top: 12px;
}
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_filterContainer
  .mx_LeftPanel_dialPadButton {
  background-color: var(--cpd-color-alpha-gray-300);
  border-radius: 8px;
  height: 32px;
  margin-left: 8px;
  position: relative;
  width: 32px;
}
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_filterContainer
  .mx_LeftPanel_dialPadButton:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 16px;
  left: 8px;
  -webkit-mask-image: url(../../img/element-icons/call/dialpad.b652586.svg);
  mask-image: url(../../img/element-icons/call/dialpad.b652586.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 8px;
  width: 16px;
}
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_filterContainer
  .mx_LeftPanel_exploreButton,
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_filterContainer
  .mx_LeftPanel_recentsButton {
  background-color: var(--cpd-color-alpha-gray-300);
  border-radius: 8px;
  height: 32px;
  margin-left: 8px;
  position: relative;
  width: 32px;
  display: none;
}
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_filterContainer
  .mx_LeftPanel_exploreButton:before,
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_filterContainer
  .mx_LeftPanel_recentsButton:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 16px;
  left: 8px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 8px;
  width: 16px;
}
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_filterContainer
  .mx_LeftPanel_exploreButton:hover,
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_filterContainer
  .mx_LeftPanel_recentsButton:hover {
  background-color: var(--cpd-color-gray-800);
}
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_filterContainer
  .mx_LeftPanel_exploreButton:hover:before,
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_filterContainer
  .mx_LeftPanel_recentsButton:hover:before {
  background-color: var(--cpd-color-bg-canvas-default);
}
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_filterContainer
  .mx_LeftPanel_exploreButton:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/explore.6738ed6.svg);
  mask-image: url(../../img/element-icons/roomlist/explore.6738ed6.svg);
}
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_filterContainer
  .mx_LeftPanel_recentsButton:before {
  -webkit-mask-image: url(../../img/element-icons/clock.5fea538.svg);
  mask-image: url(../../img/element-icons/clock.5fea538.svg);
}
.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_RoomListHeader:first-child {
  margin-top: 12px;
}
.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_roomListWrapper {
  margin-top: 10px;
  overflow: hidden;
  padding-right: 2px;
  -webkit-box-flex: 1;
  -ms-flex: 1 0 0px;
  flex: 1 0 0;
}
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_roomListWrapper.mx_LeftPanel_roomListWrapper_stickyBottom {
  padding-bottom: 32px;
}
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_roomListWrapper.mx_LeftPanel_roomListWrapper_stickyTop {
  padding-top: 32px;
}
.mx_LeftPanel
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_actualRoomListContainer {
  height: 100%;
  position: relative;
}
.mx_LeftPanel.mx_LeftPanel_minimized {
  -webkit-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  min-width: 0;
  min-width: auto;
  width: auto !important;
}
.mx_LeftPanel.mx_LeftPanel_minimized .mx_LeftPanel_roomListContainer {
  width: var(--collapsedWidth);
}
.mx_LeftPanel.mx_LeftPanel_minimized
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_userHeader {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_LeftPanel.mx_LeftPanel_minimized
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_filterContainer {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_LeftPanel.mx_LeftPanel_minimized
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_filterContainer
  .mx_LeftPanel_dialPadButton {
  background-color: transparent;
  margin-left: 0;
  margin-top: 8px;
}
.mx_LeftPanel.mx_LeftPanel_minimized
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_filterContainer
  .mx_LeftPanel_exploreButton,
.mx_LeftPanel.mx_LeftPanel_minimized
  .mx_LeftPanel_roomListContainer
  .mx_LeftPanel_filterContainer
  .mx_LeftPanel_recentsButton {
  margin-left: 0;
  margin-top: 8px;
}
.mx_MainSplit {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  height: 100%;
  min-height: 0;
  min-width: 0;
}
.mx_MainSplit
  > .mx_RightPanel_ResizeWrapper:hover
  .mx_ResizeHandle--horizontal:before {
  background-color: var(--cpd-color-text-primary);
  border-radius: 4px;
  content: "";
  height: 64px;
  left: 50%;
  opacity: 0.8;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(-150%, -50%);
  transform: translate(-150%, -50%);
  width: 4px;
}
.mx_MatrixChat_splash {
  height: 100%;
  position: relative;
}
.mx_MatrixChat_wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  width: 100%;
}
.mx_MatrixToolbar {
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  height: 40px;
  order: 1;
}
.mx_MatrixChat {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  position: relative;
  width: 100%;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-height: 0;
}
.mx_MatrixChat
  > :not(.mx_LeftPanel):not(.mx_SpacePanel):not(.mx_ResizeHandle):not(
    .mx_LeftPanel_outerWrapper
  ) {
  background-color: var(--cpd-color-bg-canvas-default);
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
}
.mx_MatrixChat > .mx_ResizeHandle--horizontal:hover {
  position: relative;
}
.mx_MatrixChat > .mx_ResizeHandle--horizontal:hover:before {
  background-color: var(--cpd-color-text-primary);
  border-radius: 4px;
  content: " ";
  height: 64px;
  left: 50%;
  opacity: 0.8;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 4px;
}
.mx_MessagePanel_myReadMarker {
  border: 0;
  height: 0;
  margin: 0;
  padding: 0;
}
.mx_MessagePanel_myReadMarker hr {
  border-bottom: 1px solid var(--cpd-color-text-action-accent);
  border-top: 1px solid var(--cpd-color-text-action-accent);
  margin-top: 0;
  opacity: 1;
  position: relative;
  top: -1px;
  -webkit-transition: width easeinsine 0.4s 1s, opacity easeinsine 0.4s 1s;
  transition: width easeinsine 0.4s 1s, opacity easeinsine 0.4s 1s;
  width: 99%;
  will-change: width;
  z-index: 1;
}
.mx_NonUrgentToastContainer {
  bottom: 30px;
  left: 28px;
  position: absolute;
  z-index: 101;
}
.mx_NonUrgentToastContainer .mx_NonUrgentToastContainer_toast {
  background-color: #17191c;
  border-radius: 8px;
  color: #fff;
  font-size: 0.8125rem;
  margin-top: 8px;
  padding: 10px 12px;
  width: 320px;
}
.mx_NotificationPanel_empty:before {
  --maskImage: url(../../img/element-icons/notifications.988ddb0.svg);
}
.mx_QuickSettingsButton {
  -webkit-box-flex: 0;
  border-radius: 8px;
  color: var(--cpd-color-text-secondary);
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  line-height: 32px;
  margin: 12px auto;
  min-height: 32px;
  min-width: 32px;
  position: relative;
}
@media (max-width: 500px) {
  /* Styles for mobile view only */

  .mx_LeftPanel_outerWrapper {
      position: fixed;
      top: 0;
      left: -450px; /* Initially off-screen */
      width: 100%; /* Occupy 80% of the screen width on mobile */
      height: 100vh;
      background-color: #333; /* Background color */
      color: #fff;
      transition: left 0.3s ease-in-out;
      z-index: 100; /* Ensure it's above other elements */
      overflow-y: auto;
  }

  /* When the panel is open */
  .mx_LeftPanel_outerWrapper.open {
      left: 0; /* Slide it in */
  }

  /* The invisible clickable area on the left */
  .clickable-left-side {
      position: fixed;
      top: 0;
      left: 0;
      width: 20px; /* Maintain a small clickable area */
      height: 100vh;
      cursor: pointer;
      z-index: 99;
      background-color: transparent; /* Transparent but clickable */
  }
}
.hamburger-menu {
  display: none; /* Hide by default */
  position: fixed;
  top: 38px;
  left: -2px;
  z-index: 100;
  background-color: #333;
  color: white;
  padding: 10px;
  border-radius: 5px;
  cursor: pointer;
}
@media (max-width: 500px) {
  .mx_SettingsSubsection_content {
      display: grid;
      width: 100%; /* Use full width on mobile */
      grid-gap: 14px;
      grid-template-columns: 1fr; /* Single-column layout */
      justify-items: stretch; /* Stretch items to fill the width */
  }
  .mx_LayoutSwitcher_RadioButtons > .mx_LayoutSwitcher_RadioButton {
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-shrink: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    overflow: hidden;
    -ms-flex-preferred-size: 33%;
    border: 1px solid var(--cpd-color-gray-400);
    border-radius: 10px;
    flex-basis: 95%;
    min-width: 0;
}
}

.hamburger-menu span {
  font-size: 24px;
  color: green;
}

/* Show the hamburger menu on screens 500px or smaller */
@media (max-width: 500px) {
  .hamburger-menu {
      display: block;
  }
}


.mx_QuickSettingsButton.expanded {
  margin-left: 20px;
  padding-left: 44px;
  padding-right: 8px;
}
.mx_QuickSettingsButton:before {
  background: #488D41;
  content: "";
  height: 32px;
  left: 0;
  -webkit-mask-image: url(../../icons/settings-svgrepo-com.svg) !important;
  mask-image: url(../../icons/settings-solid.5cd4545.svg) !important;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 24px;
  mask-size: 24px;
  position: absolute;
  width: 32px;
}

.mx_beep.expanded {
  margin-left: 20px;
  padding-left: 44px;
  padding-right: 8px;
}
.mx_beep:before {
  content: "";
  height: 32px;
  left: 0;
  mask-image: url(../../icons/settings-solid.5cd4545.svg) !important;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 24px;
  mask-size: 24px;
  position: absolute;
  width: 32px;
}

.mx_QuickSettingsButton_ContextMenuWrapper .mx_ContextualMenu {
  contain: unset;
  min-width: 200px;
  padding: 16px;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
.mx_QuickSettingsButton_ContextMenuWrapper .mx_ContextualMenu > div > h2 {
  color: var(--cpd-color-text-secondary);
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.5rem;
  margin: 0 0 16px;
}
.mx_QuickSettingsButton_ContextMenuWrapper
  .mx_ContextualMenu
  .mx_AccessibleButton_hasKind {
  display: block;
  margin-top: 4px;
}
.mx_QuickSettingsButton_ContextMenuWrapper .mx_ContextualMenu > div > h4 {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 0.9375rem;
  margin: 20px 0 12px;
  text-transform: uppercase;
}
.mx_QuickSettingsButton_ContextMenuWrapper
  .mx_ContextualMenu
  .mx_QuickSettingsButton_pinToSidebarHeading {
  padding-left: 24px;
  position: relative;
}
.mx_QuickSettingsButton_ContextMenuWrapper .mx_ContextualMenu .mx_Checkbox {
  margin-bottom: 8px;
}

.mx_QuickSettingsButton_ContextMenuWrapper
  .mx_ContextualMenu
  .mx_QuickSettingsButton_favouritesCheckbox
  .mx_Checkbox_background
  + div,
.mx_QuickSettingsButton_ContextMenuWrapper
  .mx_ContextualMenu
  .mx_QuickSettingsButton_peopleCheckbox
  .mx_Checkbox_background
  + div {
  color: var(--cpd-color-text-primary);
  font-size: 0.9375rem;
  line-height: 1.5rem;
  margin-left: 6px;
  padding-left: 22px;
  position: relative;
}
.mx_QuickSettingsButton_ContextMenuWrapper
  .mx_ContextualMenu
  .mx_QuickSettingsButton_moreOptionsButton {
  color: var(--cpd-color-text-primary);
  font-size: 0.9375rem;
  line-height: 1.5rem;
  margin-bottom: 16px;
  margin-left: 22px;
  padding-left: 22px;
  position: relative;
}
.mx_QuickSettingsButton_icon * {
  fill: var(--cpd-color-text-secondary);
}
.mx_QuickSettingsButton_icon {
  color: var(--cpd-color-text-secondary);
  height: 16px;
  left: 0;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 16px;
}
.mx_RightPanel {
  overflow-x: hidden;
  -webkit-box-flex: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  position: relative;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  background-color: var(--cpd-color-bg-canvas-default);
  border-left: 1px solid var(--cpd-color-alpha-gray-400);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  contain: strict;
  -ms-flex-direction: column;
  flex-direction: column;
  height: 100%;
}
.mx_RightPanel .mx_RoomView_MessageList {
  padding: 14px 18px;
}
.mx_RightPanel_threadsButton:before {
  -webkit-mask-image: url(../../img/element-icons/room/thread.239d10c.svg);
  mask-image: url(../../img/element-icons/room/thread.239d10c.svg);
}
.mx_RightPanel_notifsButton:before {
  -webkit-mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
  mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
  -webkit-mask-position: center;
  mask-position: center;
}
.mx_RightPanel_roomSummaryButton:before {
  -webkit-mask-image: url(../../img/element-icons/room/room-summary.50ea68e.svg);
  mask-image: url(../../img/element-icons/room/room-summary.50ea68e.svg);
  -webkit-mask-position: center;
  mask-position: center;
}
.mx_RightPanel_pinnedMessagesButton:before {
  -webkit-mask-image: url(../../img/element-icons/room/pin.c358af7.svg);
  mask-image: url(../../img/element-icons/room/pin.c358af7.svg);
  -webkit-mask-position: center;
  mask-position: center;
}
.mx_RightPanel_timelineCardButton:before {
  -webkit-mask-image: url(../../img/element-icons/feedback.0bc9353.svg);
  mask-image: url(../../img/element-icons/feedback.0bc9353.svg);
  -webkit-mask-position: center;
  mask-position: center;
}
.mx_RightPanel .mx_MemberInfo,
.mx_RightPanel .mx_MemberList {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
}
.mx_RightPanel .mx_RoomView_messagePanelSpinner {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  margin: auto;
  order: 2;
}
.mx_RightPanel_empty {
  margin-right: -28px;
}
.mx_RightPanel_empty h2 {
  font-weight: 700;
  margin: 16px 0;
}
.mx_RightPanel_empty h2,
.mx_RightPanel_empty p {
  font: var(--cpd-font-body-md-regular);
}
.mx_RightPanel_empty:before {
  background-color: #91a1c0;
  content: "";
  display: block;
  height: 42px;
  margin: 11px auto 29px;
  -webkit-mask-image: var(--maskImage);
  mask-image: var(--maskImage);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  width: 42px;
}
.mx_RoomSearch {
  -webkit-box-flex: 1;
  background-color: white;
  border: 1px solid transparent;
  border-radius: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1;
  flex: 1;
  height: 28px;
  min-width: 0;
  padding: 1px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
}
.mx_RoomSearch .mx_RoomSearch_icon {
  background-color: var(--cpd-color-text-secondary);
  height: 16px;
  margin-bottom: 2px;
  margin-left: 7px;
  -webkit-mask: url(../../img/element-icons/roomlist/search.91a83f7.svg);
  mask: url(../../img/element-icons/roomlist/search.91a83f7.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  width: 16px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_RoomSearch .mx_RoomSearch_spotlightTriggerText {
  color: var(--cpd-color-gray-800);
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  font: var(--cpd-font-body-sm-semibold);
  margin: 9px;
  min-width: 0;
  overflow: hidden;
}
.mx_RoomSearch .mx_RoomSearch_shortcutPrompt {
  background-color: var(--cpd-color-alpha-gray-300);
  border-radius: 6px;
  color: #747474;
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 0.9375rem;
  margin-right: 6px;
  overflow: hidden;
  padding: 2px 4px;
  text-overflow: ellipsis;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  white-space: nowrap;
}
.mx_RoomSearch.mx_RoomSearch_minimized {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 32px;
  min-height: 32px;
  width: 32px;
}
.mx_RoomSearch.mx_RoomSearch_minimized .mx_RoomSearch_icon {
  margin: 0 auto;
  padding: 1px;
  -ms-flex-item-align: center;
  align-self: center;
}
.mx_RoomSearch.mx_RoomSearch_minimized .mx_RoomSearch_shortcutPrompt {
  display: none;
}
/* .mx_RoomSearch:hover {
  background-color: var(--cpd-color-gray-800);
}
.mx_RoomSearch:hover .mx_RoomSearch_spotlightTriggerText {
  color: var(--cpd-color-bg-canvas-default);
}
.mx_RoomSearch:hover .mx_RoomSearch_shortcutPrompt {
  background-color: var(--cpd-color-bg-canvas-default);
  color: var(--cpd-color-text-secondary);
}
.mx_RoomSearch:hover .mx_RoomSearch_icon {
  background-color: var(--cpd-color-bg-canvas-default);
} */
.mx_RoomStatusBar:not(.mx_RoomStatusBar_unsentMessages) {
  margin-left: 65px;
  min-height: 50px;
}
.mx_RoomStatusBar_typingIndicatorAvatars {
  margin-top: -1px;
  text-align: left;
  width: 52px;
}
.mx_RoomStatusBar_typingIndicatorRemaining {
  background-color: #ddd;
  border: 1px solid var(--cpd-color-bg-canvas-default);
  border-radius: 40px;
  color: #acacac;
  display: inline-block;
  font-size: 0.8em;
  height: 24px;
  line-height: 1.5rem;
  position: absolute;
  text-align: center;
  vertical-align: top;
  width: 24px;
}
.mx_RoomStatusBar_scrollDownIndicator {
  cursor: pointer;
  padding-left: 1px;
}
.mx_RoomStatusBar_unreadMessagesBar {
  color: var(--cpd-color-text-critical-primary);
  cursor: pointer;
  padding-top: 10px;
}
.mx_RoomStatusBar_connectionLostBar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 19px;
  min-height: 58px;
}
.mx_RoomStatusBar_unsentMessages > div[role="alert"] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: var(--cpd-color-bg-subtle-primary);
  border-radius: 4px;
  margin: 12px;
  min-height: 70px;
  padding-left: 16px;
}
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentBadge {
  margin-right: 12px;
}
.mx_RoomStatusBar_unsentMessages
  .mx_RoomStatusBar_unsentBadge
  .mx_NotificationBadge {
  border-radius: 24px !important;
  height: 24px !important;
  width: 24px !important;
}
.mx_RoomStatusBar_unsentMessages
  .mx_RoomStatusBar_unsentBadge
  .mx_NotificationBadge
  .mx_NotificationBadge_count {
  font-size: 1rem !important;
}
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentTitle {
  color: var(--cpd-color-text-critical-primary);
  font-size: 0.9375rem;
}
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentDescription {
  font-size: 0.75rem;
}
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentButtonBar {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  color: #61708b;
  flex-grow: 1;
  margin-right: 22px;
  text-align: right;
}
.mx_RoomStatusBar_unsentMessages
  .mx_RoomStatusBar_unsentButtonBar
  .mx_AccessibleButton {
  display: inline-block;
  padding: 5px 10px 5px 30px;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.mx_RoomStatusBar_unsentMessages
  .mx_RoomStatusBar_unsentButtonBar
  .mx_AccessibleButton:nth-child(2) {
  border-left: 1px solid var(--cpd-color-gray-400);
}
.mx_RoomStatusBar_unsentMessages
  .mx_RoomStatusBar_unsentButtonBar
  .mx_AccessibleButton:before {
  background-color: #61708b;
  content: "";
  height: 18px;
  left: 10px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 18px;
}
.mx_RoomStatusBar_unsentMessages
  .mx_RoomStatusBar_unsentButtonBar
  .mx_AccessibleButton.mx_RoomStatusBar_unsentCancelAllBtn:before {
  -webkit-mask-image: url(../../img/element-icons/trashcan.2f78f2d.svg);
  mask-image: url(../../img/element-icons/trashcan.2f78f2d.svg);
}
.mx_RoomStatusBar_unsentMessages
  .mx_RoomStatusBar_unsentButtonBar
  .mx_AccessibleButton.mx_RoomStatusBar_unsentRetry {
  padding-left: 34px;
}
.mx_RoomStatusBar_unsentMessages
  .mx_RoomStatusBar_unsentButtonBar
  .mx_AccessibleButton.mx_RoomStatusBar_unsentRetry:before {
  -webkit-mask-image: url(../../img/element-icons/retry.8a39798.svg);
  mask-image: url(../../img/element-icons/retry.8a39798.svg);
}
.mx_RoomStatusBar_unsentMessages
  .mx_RoomStatusBar_unsentButtonBar
  .mx_InlineSpinner {
  margin-right: 5px;
  top: 1px;
  vertical-align: middle;
}
.mx_RoomStatusBar_unsentMessages
  .mx_RoomStatusBar_unsentButtonBar
  .mx_InlineSpinner
  + span {
  margin-right: 10px;
}
.mx_RoomStatusBar_connectionLostBar svg {
  float: left;
  padding-left: 10px;
  padding-right: 10px;
  vertical-align: middle;
}
.mx_RoomStatusBar_connectionLostBar_title {
  color: var(--cpd-color-text-critical-primary);
}
.mx_RoomStatusBar_connectionLostBar_desc {
  color: var(--cpd-color-text-primary);
  font-size: 0.8125rem;
  opacity: 0.5;
  padding-bottom: 20px;
}
.mx_RoomStatusBar_resend_link {
  color: var(--cpd-color-text-primary) !important;
  cursor: pointer;
  text-decoration: underline !important;
}
.mx_RoomStatusBar_typingBar {
  color: var(--cpd-color-text-primary);
  display: block;
  height: 50px;
  line-height: 50px;
  opacity: 0.5;
  overflow-y: hidden;
}
.mx_MatrixChat_useCompactLayout
  .mx_RoomStatusBar:not(.mx_RoomStatusBar_unsentMessages) {
  min-height: 40px;
}
.mx_MatrixChat_useCompactLayout .mx_RoomStatusBar_indicator {
  margin-top: 10px;
}
.mx_MatrixChat_useCompactLayout .mx_RoomStatusBar_typingBar {
  height: 40px;
  line-height: 40px;
}
:root {
  --RoomView_MessageList-padding: 18px;
}
.mx_RoomView_wrapper {
  -ms-flex: 1;
  flex: 1;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  contain: strict;
  justify-content: center;
}
.mx_RoomView,
.mx_RoomView_wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  position: relative;
}
.mx_RoomView {
  word-wrap: break-word;
  -ms-flex: 1;
  flex: 1;
}
.mx_RoomView .mx_MainSplit {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
}
.mx_RoomView .mx_MessageComposer {
  width: 100%;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  margin-right: 2px;
}
.mx_RoomView_auxPanel_hiddenHighlights {
  border-bottom: 1px solid transparent;
  color: var(--cpd-color-text-critical-primary);
  cursor: pointer;
  padding: 10px 26px;
}
.mx_RoomView_messagePanel {
  overflow-y: auto;
  width: 100%;
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  overflow-anchor: none;
}
.mx_RoomView_messagePanelSearchSpinner {
  -webkit-box-flex: 1;
  background-image: url(../../img/typing-indicator-2x.e13c259.gif);
  background-position: center 367px;
  background-repeat: no-repeat;
  background-size: 25px;
  -ms-flex: 1;
  flex: 1;
  position: relative;
}
.mx_RoomView_messagePanelSearchSpinner:before {
  background-color: var(--cpd-color-gray-900);
  content: "";
  height: 50px;
  left: 0;
  -webkit-mask: url(../../img/feather-customised/search-input.5d69fb5.svg);
  mask: url(../../img/feather-customised/search-input.5d69fb5.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 50px;
  mask-size: 50px;
  position: absolute;
  right: 0;
  top: 286px;
}
.mx_RoomView_body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-width: 0;
}
.mx_RoomView_body .mx_RoomView_messagePanel, .mx_RoomView_body .mx_RoomView_messagePanelSearchSpinner, .mx_RoomView_body .mx_RoomView_messagePanelSpinner {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
  background-image: url(https://firebasestorage.googleapis.com/v0/b/laaleh-2451e.appspot.com/o/Frame%201171282997.png?alt=media&token=7e35a41d-2d25-469c-9c52-157e9ddd995c);
}
.mx_RoomView_body .mx_RoomView_timeline {
  position: relative;
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-right: 4px;
  margin-right: calc(var(--container-gap-width) / 2);
}
.mx_RoomView_statusArea {
  width: 100%;
  -webkit-box-flex: 0;
  background-color: var(--cpd-color-bg-canvas-default);
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  max-height: 0;
  overflow: hidden;
  -webkit-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
  z-index: 1000;
}
.mx_RoomView_statusArea_expanded {
  max-height: 100px;
}
.mx_RoomView_statusAreaBox {
  margin: auto;
  min-height: 50px;
}
.mx_RoomView_statusAreaBox_line {
  border-top: 1px solid transparent;
  height: 1px;
  margin-left: 65px;
}
.mx_RoomView_messageListWrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  position: relative;
}
.mx_RoomView_searchResultsPanel .mx_RoomView_messageListWrapper {
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}
.mx_RoomView_searchResultsPanel
  .mx_RoomView_messageListWrapper
  > .mx_RoomView_MessageList
  > li
  > ol {
  list-style-type: none;
}
.mx_RoomView_searchResultsPanel a {
  color: inherit;
  text-decoration: none;
}
.mx_RoomView_empty {
  font-size: 0.8125rem;
  margin-bottom: 80px;
  margin-right: 30px;
  padding: 0 24px;
  text-align: center;
}
.mx_RoomView_MessageList {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  list-style-type: none;
  margin: 0;
  padding: 18px;
  padding: var(--RoomView_MessageList-padding);
}
.mx_RoomView_MessageList li {
  clear: both;
}
.mx_ScrollPanel .mx_RoomView_MessageList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  contain-intrinsic-size: 50px;
  content-visibility: auto;
  justify-content: flex-end;
  min-height: 528px !important;
}
.mx_RoomView--local .mx_ScrollPanel .mx_RoomView_MessageList {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_RoomView_immersive .mx_LegacyRoomHeader_wrapper {
  border: initial;
}
.mx_RoomView_inCall .mx_RoomView_statusAreaBox_line {
  border: none;
  height: 0;
  margin-top: 2px;
}
.mx_RoomView_inCall .mx_MessageComposer_wrapper {
  border-top: 2px hidden;
  padding-top: 1px;
}
.mx_MatrixChat_useCompactLayout .mx_RoomView_MessageList {
  margin-bottom: 4px;
}
.mx_MatrixChat_useCompactLayout .mx_RoomView_MessageList h2 {
  margin-top: 6px;
}
.mx_MatrixChat_useCompactLayout .mx_RoomView_statusAreaBox {
  min-height: 42px;
}
@-webkit-keyframes mx_Indicator_pulse {
  0% {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
  }
  70% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  to {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
  }
}
@keyframes mx_Indicator_pulse {
  0% {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
  }
  70% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  to {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
  }
}
@-webkit-keyframes mx_Indicator_pulse_shadow {
  0% {
    opacity: 0.7;
  }
  70% {
    opacity: 0;
    -webkit-transform: scale(2.2);
    transform: scale(2.2);
  }
  to {
    opacity: 0;
  }
}
@keyframes mx_Indicator_pulse_shadow {
  0% {
    opacity: 0.7;
  }
  70% {
    opacity: 0;
    -webkit-transform: scale(2.2);
    transform: scale(2.2);
  }
  to {
    opacity: 0;
  }
}
.mx_Indicator {
  -webkit-animation: mx_Indicator_pulse 2s infinite;
  animation: mx_Indicator_pulse 2s infinite;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
  background: var(--cpd-color-text-critical-primary);
  background: var(--RoomHeader-indicator-pulseColor);
  border-radius: 50%;
  -webkit-box-shadow: 0 0 0 0 var(--cpd-color-text-critical-primary);
  box-shadow: 0 0 0 0 var(--cpd-color-text-critical-primary);
  -webkit-box-shadow: 0 0 0 0 var(--RoomHeader-indicator-pulseColor);
  box-shadow: 0 0 0 0 var(--RoomHeader-indicator-pulseColor);
  height: 8px;
  height: var(--RoomHeader-indicator-dot-size);
  position: absolute;
  right: -3px;
  top: -3px;
  -webkit-transform: scale(1);
  transform: scale(1);
  width: 8px;
  width: var(--RoomHeader-indicator-dot-size);
}
.mx_Indicator:after {
  -webkit-animation-duration: inherit;
  animation-duration: inherit;
  -webkit-animation-iteration-count: inherit;
  animation-iteration-count: inherit;
  -webkit-animation-name: mx_Indicator_pulse_shadow;
  animation-name: mx_Indicator_pulse_shadow;
  background: inherit;
  border-radius: 50%;
  content: "";
  height: inherit;
  left: 0;
  position: absolute;
  top: 0;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transform-origin: center center;
  transform-origin: center center;
  width: inherit;
}
.mx_SearchBox {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
}
.mx_SearchBox.mx_SearchBox_blurred:not(:hover) {
  background-color: transparent;
}
.mx_SearchBox .mx_SearchBox_closeButton {
  background-image: url(../../img/icons-close.18b3d80.svg);
  background-position: 50%;
  background-repeat: no-repeat;
  cursor: pointer;
  height: 16px;
  padding: 9px;
  width: 16px;
}
.mx_SpaceRoomView_landing .mx_AccessibleButton_kind_link {
  font-size: inherit;
}
.mx_SpaceRoomView_landing .mx_SearchBox {
  margin: 24px 0 16px;
}
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_noResults {
  text-align: center;
}
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_noResults > div {
  color: var(--cpd-color-text-secondary);
  font-size: 0.9375rem;
  line-height: 1.5rem;
}
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_listHeader {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: wrap;
  flex-flow: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-primary);
  font-size: 0.9375rem;
  gap: 12px;
  line-height: 1.5rem;
  margin-bottom: 12px;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_listHeader
  .mx_SpaceHierarchy_listHeader_header {
  font-weight: var(--cpd-font-weight-semibold);
  grid-column-start: 1;
  margin: 0;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_listHeader
  .mx_SpaceHierarchy_listHeader_buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: wrap;
  flex-flow: wrap;
  gap: 12px;
  grid-column-start: 2;
  min-height: 32px;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_listHeader
  .mx_SpaceHierarchy_listHeader_buttons
  .mx_AccessibleButton {
  font-weight: 400;
  padding: 4px 12px;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_listHeader
  .mx_AccessibleButton_kind_danger_outline,
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_listHeader
  .mx_AccessibleButton_kind_primary_outline {
  padding: 3px 12px;
}
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_error {
  color: var(--cpd-color-text-critical-primary);
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.125rem;
  margin: 20px auto 12px;
  padding-left: 24px;
  position: relative;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_error:before {
  background-image: url(../../img/element-icons/warning-badge.203170a.svg);
  background-repeat: no-repeat;
  background-size: cover;
  content: "";
  height: 16px;
  left: 0;
  position: absolute;
  width: 16px;
}
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomCount > h3 {
  color: var(--cpd-color-text-primary);
  display: inline;
  font-size: 1.125rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.375rem;
}
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomCount > span {
  color: var(--cpd-color-text-secondary);
  font-size: 0.9375rem;
  line-height: 1.5rem;
  margin-left: 8px;
}
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_subspace_toggle {
  background-color: var(--cpd-color-bg-canvas-default);
  border-radius: 4px;
  height: 16px;
  left: -1px;
  position: absolute;
  top: 10px;
  width: 16px;
}
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_subspace_toggle:before {
  background-color: var(--cpd-color-gray-800);
  content: "";
  height: 16px;
  left: 0;
  -webkit-mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 16px;
  mask-size: 16px;
  position: absolute;
  top: 0;
  -webkit-transform: rotate(270deg);
  transform: rotate(270deg);
  width: 16px;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_subspace_toggle.mx_SpaceHierarchy_subspace_toggle_shown:before {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_subspace_children {
  padding-left: 12px;
  position: relative;
}
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper {
  list-style: none;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile {
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 6px 12px;
  padding: 8px 16px;
  position: relative;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_roomTile_item {
  display: grid;
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
  grid-template-columns: 20px auto;
  line-height: 1.125rem;
  grid-gap: 6px 8px;
  gap: 6px 8px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_roomTile_item
  .mx_SpaceHierarchy_roomTile_avatar {
  grid-column: 1;
  grid-row: 1;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_roomTile_item
  .mx_SpaceHierarchy_roomTile_name {
  grid-column: 2;
  grid-row: 1;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_roomTile_item
  .mx_SpaceHierarchy_roomTile_name
  .mx_InfoTooltip,
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_roomTile_item
  .mx_SpaceHierarchy_roomTile_name
  .mx_SpaceHierarchy_roomTile_joined {
  color: var(--cpd-color-gray-800);
  font-size: 0.75rem;
  line-height: 0.9375rem;
  margin-left: 12px;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_roomTile_item
  .mx_SpaceHierarchy_roomTile_name
  .mx_InfoTooltip
  .mx_InfoTooltip_icon,
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_roomTile_item
  .mx_SpaceHierarchy_roomTile_name
  .mx_SpaceHierarchy_roomTile_joined
  .mx_InfoTooltip_icon {
  margin-right: 4px;
  position: relative;
  vertical-align: text-top;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_roomTile_item
  .mx_SpaceHierarchy_roomTile_name
  .mx_InfoTooltip
  .mx_InfoTooltip_icon:before,
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_roomTile_item
  .mx_SpaceHierarchy_roomTile_name
  .mx_SpaceHierarchy_roomTile_joined
  .mx_InfoTooltip_icon:before {
  left: 0;
  position: absolute;
  top: 0;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_roomTile_item
  .mx_SpaceHierarchy_roomTile_name
  .mx_InfoTooltip {
  display: inline-block;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_roomTile_item
  .mx_SpaceHierarchy_roomTile_name
  .mx_SpaceHierarchy_roomTile_joined {
  display: inline;
  padding-left: 16px;
  position: relative;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_roomTile_item
  .mx_SpaceHierarchy_roomTile_name
  .mx_SpaceHierarchy_roomTile_joined:before {
  background-color: var(--cpd-color-text-action-accent);
  content: "";
  height: 20px;
  left: -4px;
  -webkit-mask-image: url(../../img/element-icons/roomlist/checkmark.76b08f2.svg);
  mask-image: url(../../img/element-icons/roomlist/checkmark.76b08f2.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: -2px;
  width: 20px;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_roomTile_item
  .mx_SpaceHierarchy_roomTile_info {
  color: var(--cpd-color-text-secondary);
  display: -webkit-box;
  font: var(--cpd-font-body-md-regular);
  font-weight: 400;
  grid-column: 2;
  grid-row: 2;
  line-height: 1.125rem;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_actions {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-column-gap: 12px;
  -moz-column-gap: 12px;
  column-gap: 12px;
  margin-left: auto;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_actions
  .mx_AccessibleButton {
  display: inline-block;
  line-height: 1.5rem;
  padding: 4px 16px;
  visibility: hidden;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_actions
  .mx_AccessibleButton_kind_danger_outline,
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_actions
  .mx_AccessibleButton_kind_primary_outline {
  padding: 3px 16px;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_actions
  .mx_Checkbox {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile
  .mx_SpaceHierarchy_actions
  .mx_Checkbox
  label {
  height: 16px;
  width: 16px;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile:focus-within,
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile:hover {
  background-color: hsla(0, 0%, 91%, 0.77);
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile:focus-within
  .mx_AccessibleButton,
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile:hover
  .mx_AccessibleButton {
  visibility: visible;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_list
  li.mx_SpaceHierarchy_roomTileWrapper
  .mx_SpaceHierarchy_roomTile.mx_SpaceHierarchy_joining
  .mx_AccessibleButton {
  padding: 4px 18px;
  visibility: visible;
}
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile:before,
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_subspace_children:before {
  background-color: hsla(0, 0%, 91%, 0.77);
  content: "";
  height: 100%;
  left: 6px;
  position: absolute;
  top: 0;
  width: 1px;
}
.mx_SpaceRoomView_landing
  .mx_SpaceHierarchy_actions
  .mx_SpaceHierarchy_actionsText {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 0.9375rem;
}
.mx_SpaceRoomView_landing > hr {
  background-color: rgba(141, 151, 165, 0.2);
  border: none;
  height: 1px;
  margin: 20px 0;
}
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_createRoom {
  display: block;
  margin: 16px auto 0;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
.mx_SpacePanel {
  --activeBackground-color: var(--cpd-color-alpha-gray-300);
  --activeBorder-color: var(--cpd-color-text-primary);
  --activeBorder-transparent-gap: 1px;
  --gutterSize: 14px;
  --height-nested: 24px;
  --height-topLevel: 32px;
  background-color: #cef6db;
  -webkit-box-flex: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
  position: relative;
  z-index: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_SpacePanel.collapsed {
  width: 68px;
}
/* For mobile and tablet devices (max width 1024px) */


.mx_SpacePanel .mx_SpacePanel_toggleCollapse {
  background-color: var(--cpd-color-gray-800);
  border-radius: 50%;
  height: 18px;
  position: absolute;
  right: -8px;
  top: 19px;
  width: 18px;
}
.mx_SpacePanel .mx_SpacePanel_toggleCollapse:before {
  background-color: var(--cpd-color-bg-canvas-default);
  content: "";
  height: inherit;
  -webkit-mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  -webkit-transform: rotate(270deg);
  transform: rotate(270deg);
  width: inherit;
}
.mx_SpacePanel .mx_SpacePanel_toggleCollapse:not(.expanded) {
  opacity: 0;
  display: none;
}
.mx_SpacePanel .mx_SpacePanel_toggleCollapse:not(.expanded):before {
  -webkit-mask-position: center 1px;
  mask-position: center 1px;
}
.mx_SpacePanel .mx_SpacePanel_toggleCollapse.expanded:before {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}
.mx_SpacePanel:hover .mx_SpacePanel_toggleCollapse {
  opacity: 1;
}
.mx_SpacePanel ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.mx_SpacePanel .mx_SpaceButton_toggleCollapse {
  cursor: pointer;
}
.mx_SpacePanel .mx_SpaceItem_dragging .mx_SpaceButton_toggleCollapse {
  visibility: hidden;
}
.mx_SpacePanel .mx_SpaceItem {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-flow: wrap;
  flex-flow: wrap;
}
.mx_SpacePanel .mx_SpaceItem.mx_SpaceItem_narrow {
  -ms-flex-item-align: baseline;
  align-self: baseline;
}
.mx_SpacePanel
  .mx_SpaceItem.collapsed
  > .mx_SpaceButton
  > .mx_SpaceButton_toggleCollapse {
  margin: 0 -10px;
  padding: 0 10px;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
.mx_SpacePanel .mx_SpaceItem.collapsed > .mx_SpaceTreeLevel {
  display: none;
}
.mx_SpacePanel .mx_SpaceItem_new {
  position: relative;
}
.mx_SpacePanel .mx_SpaceItem:not(.hasSubSpaces) > .mx_SpaceButton {
  margin-left: var(--gutterSize);
  min-width: 40px;
}
.mx_SpacePanel .mx_SpaceButton {
  border-radius: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
  padding: 4px 4px 4px 0;
  width: 100%;
}
.mx_SpacePanel
  .mx_SpaceButton.mx_SpaceButton_active:not(.mx_SpaceButton_narrow)
  .mx_SpaceButton_selectionWrapper {
  background-color: var(--activeBackground-color);
}
.mx_SpacePanel
  .mx_SpaceButton.mx_SpaceButton_active.mx_SpaceButton_narrow
  .mx_SpaceButton_selectionWrapper {
  padding: var(--activeBorder-transparent-gap);
}
.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_selectionWrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 12px;
  min-width: 0;
  padding: 4px;
  width: calc(100% - 32px);
}
.mx_SpacePanel
  .mx_SpaceButton.mx_SpaceButton_narrow
  .mx_SpaceButton_selectionWrapper {
  -webkit-box-flex: initial;
  -ms-flex: initial;
  flex: initial;
  width: 32px;
}
.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_name {
  -webkit-box-flex: 1;
  display: block;
  -ms-flex: 1;
  flex: 1;
  font: var(--cpd-font-body-md-regular);
  margin-left: 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_toggleCollapse {
  background-color: var(--cpd-color-gray-800);
  height: 20px;
  -webkit-mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  min-width: var(--gutterSize);
  padding: 10px 0;
  width: var(--gutterSize);
}
.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_icon {
  border-radius: 8px;
  height: var(--height-topLevel);
  min-width: var(--height-topLevel);
  position: relative;
  width: var(--height-topLevel);
}
.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_icon:before {
  content: "";
  height: var(--height-topLevel);
  left: 0;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 18px;
  mask-size: 18px;
  position: absolute;
  top: 0;
  width: var(--height-topLevel);
}
.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_favourites .mx_SpaceButton_icon,
.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_home .mx_SpaceButton_icon,
.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_orphans .mx_SpaceButton_icon,
.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_people .mx_SpaceButton_icon,
.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_videoRooms .mx_SpaceButton_icon {
  background-color: var(--cpd-color-alpha-gray-300);
}
.mx_SpacePanel
  .mx_SpaceButton.mx_SpaceButton_favourites
  .mx_SpaceButton_icon:before,
.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_home .mx_SpaceButton_icon:before,
.mx_SpacePanel
  .mx_SpaceButton.mx_SpaceButton_orphans
  .mx_SpaceButton_icon:before,
.mx_SpacePanel
  .mx_SpaceButton.mx_SpaceButton_people
  .mx_SpaceButton_icon:before,
.mx_SpacePanel
  .mx_SpaceButton.mx_SpaceButton_videoRooms
  .mx_SpaceButton_icon:before {
  background-color: var(--cpd-color-text-secondary);
}
.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_home .mx_SpaceButton_icon:before {
  -webkit-mask-image: url(../../img/element-icons/home.e0e6ce5.svg);
  mask-image: url(../../img/element-icons/home.e0e6ce5.svg);
}
.mx_SpacePanel
  .mx_SpaceButton.mx_SpaceButton_favourites
  .mx_SpaceButton_icon:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/favorite.9dcb53a.svg);
  mask-image: url(../../img/element-icons/roomlist/favorite.9dcb53a.svg);
}
.mx_SpacePanel
  .mx_SpaceButton.mx_SpaceButton_people
  .mx_SpaceButton_icon:before {
  -webkit-mask-image: url(../../img/element-icons/room/members.bcfbe84.svg);
  mask-image: url(../../img/element-icons/room/members.bcfbe84.svg);
}
.mx_SpacePanel
  .mx_SpaceButton.mx_SpaceButton_orphans
  .mx_SpaceButton_icon:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/hash-circle.221168c.svg);
  mask-image: url(../../img/element-icons/roomlist/hash-circle.221168c.svg);
}
.mx_SpacePanel
  .mx_SpaceButton.mx_SpaceButton_videoRooms
  .mx_SpaceButton_icon:before {
  -webkit-mask-image: url(../../icons/video-call-solid.90cb901.svg);
  mask-image: url(../../icons/video-call-solid.90cb901.svg);
}
.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_new .mx_SpaceButton_icon:before {
  background-color: var(--cpd-color-text-primary);
  -webkit-mask-image: url(../../img/element-icons/plus.7b3d018.svg);
  mask-image: url(../../img/element-icons/plus.7b3d018.svg);
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.mx_SpacePanel
  .mx_SpaceButton.mx_SpaceButton_newCancel
  .mx_SpaceButton_icon:before {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_menuButton {
  display: none;
  height: 20px;
  margin-bottom: auto;
  margin-top: auto;
  min-width: 20px;
  position: absolute;
  right: 4px;
  width: 20px;
}
.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_menuButton:before {
  background: var(--cpd-color-text-primary);
  content: "";
  height: 16px;
  left: 2px;
  -webkit-mask-image: url(../../img/element-icons/context-menu.2c3f393.svg);
  mask-image: url(../../img/element-icons/context-menu.2c3f393.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 3px;
  width: 16px;
}
.mx_SpacePanel .mx_SpaceTreeLevel {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  max-width: 250px;
  min-width: 0;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
.mx_SpacePanel .mx_SpaceTreeLevel .mx_SpaceTreeLevel {
  padding-left: 16px;
}
.mx_SpacePanel .mx_SpaceButton_avatarWrapper {
  line-height: 0;
  position: relative;
}
.mx_SpacePanel .mx_SpacePanel_badgeContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  right: -3px;
  top: -3px;
}
.mx_SpacePanel .mx_SpacePanel_badgeContainer .mx_NotificationBadge {
  background-clip: padding-box;
  margin: 0 2px;
}
.mx_SpacePanel .mx_SpacePanel_badgeContainer .mx_NotificationBadge_dot {
  border: 3px solid hsla(0, 0%, 91%, 0.77);
  margin: 0 -1px 0 0;
}
.mx_SpacePanel .mx_SpacePanel_badgeContainer .mx_NotificationBadge_2char,
.mx_SpacePanel .mx_SpacePanel_badgeContainer .mx_NotificationBadge_3char {
  border: 2px solid hsla(0, 0%, 91%, 0.77);
  margin: -5px -5px 0 0;
}
.mx_SpacePanel
  .mx_SpaceButton:focus-within:not(.mx_SpaceButton_narrow):not(
    .mx_SpaceButton_invite
  )
  .mx_SpaceButton_menuButton,
.mx_SpacePanel
  .mx_SpaceButton:hover:not(.mx_SpaceButton_narrow):not(.mx_SpaceButton_invite)
  .mx_SpaceButton_menuButton,
.mx_SpacePanel
  .mx_SpaceButton_hasMenuOpen:not(.mx_SpaceButton_narrow):not(
    .mx_SpaceButton_invite
  )
  .mx_SpaceButton_menuButton {
  display: block;
}
.mx_SpacePanel
  .mx_SpaceItem:not(.mx_SpaceItem_new)
  .mx_SpaceButton:focus-within:not(.mx_SpaceButton_narrow):not(
    .mx_SpaceButton_invite
  )
  .mx_SpaceButton_name,
.mx_SpacePanel
  .mx_SpaceItem:not(.mx_SpaceItem_new)
  .mx_SpaceButton:hover:not(.mx_SpaceButton_narrow):not(.mx_SpaceButton_invite)
  .mx_SpaceButton_name,
.mx_SpacePanel
  .mx_SpaceItem:not(.mx_SpaceItem_new)
  .mx_SpaceButton_hasMenuOpen:not(.mx_SpaceButton_narrow):not(
    .mx_SpaceButton_invite
  )
  .mx_SpaceButton_name {
  max-width: calc(100% - 56px);
}
.mx_SpacePanel > .mx_AutoHideScrollbar {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding: 0 0 16px;
  scrollbar-gutter: stable;
}
.mx_SpacePanel > .mx_AutoHideScrollbar > .mx_SpaceButton {
  height: var(--height-topLevel);
}
.mx_SpacePanel
  > .mx_AutoHideScrollbar
  > .mx_SpaceButton.mx_SpaceButton_active:before {
  height: var(--height-topLevel);
}
.mx_SpacePanel > .mx_AutoHideScrollbar > ul {
  padding-left: 0;
}
.mx_SpacePanel > .mx_AutoHideScrollbar.mx_IndicatorScrollbar_topOverflow {
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 16px);
  mask-image: linear-gradient(180deg, transparent, #000 16px);
}
.mx_SpacePanel > .mx_AutoHideScrollbar.mx_IndicatorScrollbar_bottomOverflow {
  -webkit-mask-image: linear-gradient(
    0deg,
    transparent,
    hsla(0, 0%, 100%, 0.3) 4px,
    hsla(0, 0%, 100%, 0.55) 8px,
    hsla(0, 0%, 100%, 0.75) 12px,
    #000 16px
  );
  mask-image: linear-gradient(
    0deg,
    transparent,
    hsla(0, 0%, 100%, 0.3) 4px,
    hsla(0, 0%, 100%, 0.55) 8px,
    hsla(0, 0%, 100%, 0.75) 12px,
    #000 16px
  );
}
.mx_SpacePanel
  > .mx_AutoHideScrollbar.mx_IndicatorScrollbar_topOverflow.mx_IndicatorScrollbar_bottomOverflow {
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 16px),
    linear-gradient(
      0deg,
      transparent,
      hsla(0, 0%, 100%, 0.3) 4px,
      hsla(0, 0%, 100%, 0.55) 8px,
      hsla(0, 0%, 100%, 0.75) 12px,
      #000 16px
    );
  mask-image: linear-gradient(180deg, transparent, #000 16px),
    linear-gradient(
      0deg,
      transparent,
      hsla(0, 0%, 100%, 0.3) 4px,
      hsla(0, 0%, 100%, 0.55) 8px,
      hsla(0, 0%, 100%, 0.75) 12px,
      #000 16px
    );
  -webkit-mask-position: 0 0, 0 100%;
  mask-position: 0 0, 0 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: calc(100% - 10px) 50%, calc(100% - 10px) 50%;
  mask-size: calc(100% - 10px) 50%, calc(100% - 10px) 50%;
}
.mx_SpacePanel .mx_UserMenu {
  border-bottom: 1px solid var(--cpd-color-alpha-gray-400);
  margin: 12px 14px 4px 18px;
  max-width: 226px;
  padding-bottom: 12px;
  width: -webkit-min-content;
  width: -moz-min-content;
  width: min-content;
}
.mx_SpacePanel .mx_UserMenu .mx_UserMenu_userAvatar_BaseAvatar {
  display: block;
}
.mx_SpacePanel_contextMenu {
  max-width: 360px;
}
.mx_SpacePanel_contextMenu .mx_SpacePanel_contextMenu_header {
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.125rem;
  margin: 12px 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_SpacePanel_contextMenu .mx_SpacePanel_iconHome:before {
  -webkit-mask-image: url(../../img/element-icons/home.e0e6ce5.svg);
  mask-image: url(../../img/element-icons/home.e0e6ce5.svg);
}
.mx_SpacePanel_contextMenu .mx_SpacePanel_iconInvite:before {
  -webkit-mask-image: url(../../img/element-icons/room/invite.440bc20.svg);
  mask-image: url(../../img/element-icons/room/invite.440bc20.svg);
}
.mx_SpacePanel_contextMenu .mx_SpacePanel_iconSettings:before {
  -webkit-mask-image: url(../../img/element-icons/settings.6b0c052.svg);
  mask-image: url(../../img/element-icons/settings.6b0c052.svg);
}
.mx_SpacePanel_contextMenu .mx_SpacePanel_iconLeave:before {
  -webkit-mask-image: url(../../img/element-icons/leave.9cf503d.svg);
  mask-image: url(../../img/element-icons/leave.9cf503d.svg);
}
.mx_SpacePanel_contextMenu .mx_SpacePanel_iconMembers:before {
  -webkit-mask-image: url(../../img/element-icons/room/members.bcfbe84.svg);
  mask-image: url(../../img/element-icons/room/members.bcfbe84.svg);
}
.mx_SpacePanel_contextMenu .mx_SpacePanel_iconPlus:before {
  -webkit-mask-image: url(../../img/element-icons/plus.7b3d018.svg);
  mask-image: url(../../img/element-icons/plus.7b3d018.svg);
}
.mx_SpacePanel_contextMenu .mx_SpacePanel_iconExplore:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/hash-search.53e3a04.svg);
  mask-image: url(../../img/element-icons/roomlist/hash-search.53e3a04.svg);
}
.mx_SpacePanel_contextMenu .mx_SpacePanel_iconPreferences:before {
  -webkit-mask-image: url(../../img/element-icons/settings/preference.dd3ae3c.svg);
  mask-image: url(../../img/element-icons/settings/preference.dd3ae3c.svg);
}
.mx_SpacePanel_contextMenu .mx_SpacePanel_noIcon {
  display: none;
}
.mx_SpacePanel_contextMenu
  .mx_SpacePanel_noIcon
  + .mx_IconizedContextMenu_label {
  padding-left: 5px !important;
}
.mx_SpacePanel_contextMenu .mx_SpacePanel_contextMenu_separatorLabel {
  color: var(--cpd-color-gray-800);
  font-size: 0.625rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 0.75rem;
}
.mx_SpacePanel_sharePublicSpace {
  margin: 0;
}
.mx_SpacePanel_Tooltip_KeyboardShortcut kbd {
  font-family: inherit;
  text-transform: capitalize;
}
.mx_SpaceRoomView {
  --innerWidth: 428px;
  overflow-y: auto;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_SpaceRoomView .mx_MainSplit > div:first-child {
  padding: 80px 60px;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  max-height: 100%;
  overflow-y: auto;
}
.mx_SpaceRoomView .mx_MainSplit > div:first-child h1 {
  color: var(--cpd-color-text-primary);
  font-size: 1.5rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin: 0;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
.mx_SpaceRoomView
  .mx_MainSplit
  > div:first-child
  .mx_SpaceRoomView_description {
  color: var(--cpd-color-text-secondary);
  font-size: 0.9375rem;
  margin-bottom: 24px;
  margin-top: 12px;
  max-width: var(--innerWidth);
}
.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_AddExistingToSpace {
  max-width: var(--innerWidth);
}
.mx_SpaceRoomView
  .mx_MainSplit
  > div:first-child
  .mx_AddExistingToSpace
  .mx_AddExistingToSpace_content {
  height: calc(100vh - 360px);
  max-height: 400px;
}
.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_SpaceRoomView_buttons {
  display: block;
  margin-top: 44px;
  text-align: right;
  width: var(--innerWidth);
}
.mx_SpaceRoomView
  .mx_MainSplit
  > div:first-child
  .mx_SpaceRoomView_buttons
  .mx_AccessibleButton_hasKind {
  margin-left: 16px;
  padding: 8px 22px;
}
.mx_SpaceRoomView
  .mx_MainSplit
  > div:first-child
  .mx_SpaceRoomView_buttons
  input.mx_AccessibleButton {
  border: none;
}
.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_Field {
  max-width: var(--innerWidth);
}
.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_Field + .mx_Field {
  margin-top: 28px;
}
.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_SpaceRoomView_errorText {
  color: var(--cpd-color-text-critical-primary);
  font-size: 0.75rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 0.9375rem;
  margin-bottom: 28px;
}
.mx_SpaceRoomView
  .mx_MainSplit
  > div:first-child
  .mx_AccessibleButton_disabled {
  cursor: not-allowed;
}
.mx_SpaceRoomView .mx_SpaceRoomView_landing {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
}
.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_landing
  .mx_SpaceRoomView_landing_header
  .mx_BaseAvatar {
  width: 80px;
}
.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_name {
  color: var(--cpd-color-text-secondary);
  font-size: 0.9375rem;
  margin: 24px 0 16px;
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_landing
  .mx_SpaceRoomView_landing_name
  > span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-flow: column;
  flex-flow: column;
  gap: 12px 0;
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_landing
  .mx_SpaceRoomView_landing_name
  > span
  h1 {
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_landing
  .mx_SpaceRoomView_landing_name
  .mx_SpaceRoomView_landing_inviter
  .mx_BaseAvatar {
  margin-right: 4px;
  vertical-align: middle;
}
.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_infoBar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
  line-height: 1.5rem;
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_landing
  .mx_SpaceRoomView_landing_infoBar
  .mx_SpaceRoomView_landing_infoBar_interactive {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 12px 12px;
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_landing
  .mx_SpaceRoomView_landing_infoBar
  .mx_SpaceRoomView_landing_infoBar_interactive
  .mx_FacePile {
  cursor: pointer;
  display: inline-block;
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_landing
  .mx_SpaceRoomView_landing_infoBar
  .mx_SpaceRoomView_landing_infoBar_interactive
  .mx_SpaceRoomView_landing_inviteButton,
.mx_SpaceRoomView
  .mx_SpaceRoomView_landing
  .mx_SpaceRoomView_landing_infoBar
  .mx_SpaceRoomView_landing_infoBar_interactive
  .mx_SpaceRoomView_landing_settingsButton {
  position: relative;
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_landing
  .mx_SpaceRoomView_landing_infoBar
  .mx_SpaceRoomView_landing_infoBar_interactive
  .mx_SpaceRoomView_landing_inviteButton:before,
.mx_SpaceRoomView
  .mx_SpaceRoomView_landing
  .mx_SpaceRoomView_landing_infoBar
  .mx_SpaceRoomView_landing_infoBar_interactive
  .mx_SpaceRoomView_landing_settingsButton:before {
  content: "";
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  position: absolute;
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_landing
  .mx_SpaceRoomView_landing_infoBar
  .mx_SpaceRoomView_landing_infoBar_interactive
  .mx_SpaceRoomView_landing_inviteButton {
  height: -webkit-min-content;
  height: -moz-min-content;
  height: min-content;
  padding: 4px 18px 4px 40px;
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_landing
  .mx_SpaceRoomView_landing_infoBar
  .mx_SpaceRoomView_landing_infoBar_interactive
  .mx_SpaceRoomView_landing_inviteButton:before {
  background: var(--cpd-color-icon-on-solid-primary);
  height: 16px;
  left: 8px;
  -webkit-mask-image: url(../../img/element-icons/room/invite.440bc20.svg);
  mask-image: url(../../img/element-icons/room/invite.440bc20.svg);
  -webkit-mask-size: 16px;
  mask-size: 16px;
  width: 16px;
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_landing
  .mx_SpaceRoomView_landing_infoBar
  .mx_SpaceRoomView_landing_infoBar_interactive
  .mx_SpaceRoomView_landing_settingsButton {
  height: 24px;
  width: 24px;
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_landing
  .mx_SpaceRoomView_landing_infoBar
  .mx_SpaceRoomView_landing_infoBar_interactive
  .mx_SpaceRoomView_landing_settingsButton:before {
  background: var(--cpd-color-gray-800);
  height: 24px;
  left: 0;
  -webkit-mask-image: url(../../img/element-icons/settings.6b0c052.svg);
  mask-image: url(../../img/element-icons/settings.6b0c052.svg);
  -webkit-mask-size: contain;
  mask-size: contain;
  top: 0;
  width: 24px;
}
.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_topic {
  font-size: 0.9375rem;
  margin-bottom: 16px;
  margin-top: 12px;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SearchBox {
  margin: 0 0 20px;
  -webkit-box-flex: 0;
  -ms-flex: 0;
  flex: 0;
}
.mx_SpaceRoomView .mx_SpaceRoomView_privateScope > .mx_AccessibleButton {
  border: 1px solid #e7e7e7;
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 1.0625rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin: 20px 0;
  padding: 16px 32px 16px 72px;
  position: relative;
  width: 432px;
}
.mx_SpaceRoomView .mx_SpaceRoomView_privateScope > .mx_AccessibleButton > div {
  color: var(--cpd-color-text-secondary);
  font-size: 0.9375rem;
  font-weight: 400;
  margin-top: 4px;
}
.mx_SpaceRoomView .mx_SpaceRoomView_privateScope > .mx_AccessibleButton:before {
  background-color: var(--cpd-color-gray-800);
  content: "";
  height: 24px;
  left: 20px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 24px;
  mask-size: 24px;
  position: absolute;
  top: 27px;
  width: 24px;
}
.mx_SpaceRoomView .mx_SpaceRoomView_privateScope > .mx_AccessibleButton:hover {
  border-color: var(--cpd-color-bg-interactive-primary-rest);
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_privateScope
  > .mx_AccessibleButton:hover:before {
  background-color: var(--cpd-color-icon-primary);
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_privateScope
  > .mx_AccessibleButton:hover
  > span {
  color: var(--cpd-color-text-primary);
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_privateScope
  .mx_SpaceRoomView_privateScope_justMeButton:before {
  -webkit-mask-image: url(../../img/element-icons/room/members.bcfbe84.svg);
  mask-image: url(../../img/element-icons/room/members.bcfbe84.svg);
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_privateScope
  .mx_SpaceRoomView_privateScope_meAndMyTeammatesButton:before {
  -webkit-mask-image: url(../../img/element-icons/group-members.d86d751.svg);
  mask-image: url(../../img/element-icons/group-members.d86d751.svg);
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_inviteTeammates
  .mx_SpaceRoomView_inviteTeammates_buttons {
  color: var(--cpd-color-text-secondary);
  margin-top: 28px;
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_inviteTeammates
  .mx_SpaceRoomView_inviteTeammates_buttons
  .mx_AccessibleButton {
  display: inline-block;
  line-height: 24px;
  padding-left: 32px;
  position: relative;
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_inviteTeammates
  .mx_SpaceRoomView_inviteTeammates_buttons
  .mx_AccessibleButton:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 24px;
  left: 0;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 0;
  width: 24px;
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_inviteTeammates
  .mx_SpaceRoomView_inviteTeammates_buttons
  .mx_AccessibleButton
  + .mx_AccessibleButton {
  margin-left: 32px;
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_inviteTeammates
  .mx_SpaceRoomView_inviteTeammates_buttons
  .mx_SpaceRoomView_inviteTeammates_inviteDialogButton {
  color: var(--cpd-color-text-primary);
  font-weight: var(--cpd-font-weight-semibold);
  text-decoration: underline;
}
.mx_SpaceRoomView
  .mx_SpaceRoomView_inviteTeammates
  .mx_SpaceRoomView_inviteTeammates_buttons
  .mx_SpaceRoomView_inviteTeammates_inviteDialogButton:before {
  background-color: var(--cpd-color-icon-primary);
  -webkit-mask-image: url(../../img/element-icons/room/invite.440bc20.svg);
  mask-image: url(../../img/element-icons/room/invite.440bc20.svg);
}
.mx_SplashPage {
  height: 100%;
  position: relative;
}
.mx_SplashPage:before {
  background-image: radial-gradient(
      53.85% 66.75% at 87.55% 0,
      rgba(144, 125, 237, 0.261) 0,
      rgba(204, 194, 255, 0) 100%
    ),
    radial-gradient(
      41.93% 41.93% at 0 0,
      rgba(36, 45, 66, 0.28) 0,
      rgba(204, 194, 255, 0) 100%
    ),
    radial-gradient(
      100% 100% at 0 0,
      rgba(204, 194, 255, 0.174) 0,
      hsla(0, 100%, 86%, 0) 100%
    ),
    radial-gradient(
      106.35% 96.26% at 100% 0,
      rgba(204, 194, 255, 0.4) 0,
      rgba(174, 244, 229, 0) 100%
    );
  content: "";
  display: block;
  -webkit-filter: blur(8px);
  filter: blur(8px);
  inset: -9px;
  -webkit-mask: url(../../img/noise.8322d5a.png),
    -webkit-gradient(linear, left top, left bottom, color-stop(20%, rgba(0, 0, 0, 0.9)), to(rgba(0, 0, 0, 0.2)));
  -webkit-mask: url(../../img/noise.8322d5a.png),
    linear-gradient(180deg, rgba(0, 0, 0, 0.9) 20%, rgba(0, 0, 0, 0.2));
  mask: url(../../img/noise.8322d5a.png),
    -webkit-gradient(linear, left top, left bottom, color-stop(20%, rgba(0, 0, 0, 0.9)), to(rgba(0, 0, 0, 0.2)));
  mask: url(../../img/noise.8322d5a.png),
    linear-gradient(180deg, rgba(0, 0, 0, 0.9) 20%, rgba(0, 0, 0, 0.2));
  opacity: 0.6;
  position: absolute;
  z-index: -1;
}
.mx_TabbedView {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  inset: 0;
  margin: 8px 0 0;
  padding: 0 0 0 var(--cpd-space-8x);
}
.mx_TabbedView,
.mx_TabbedView_tabsOnLeft {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_TabbedView_tabsOnLeft {
  position: absolute;
}
.mx_TabbedView_tabsOnLeft .mx_TabbedView_tabLabels {
  margin: 0;
  max-width: 220px;
  padding: 0;
  position: fixed;
  width: 220px;
}
.mx_TabbedView_tabsOnLeft .mx_TabbedView_tabPanel {
  margin-left: 280px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_TabbedView_tabsOnLeft .mx_TabbedView_tabLabel:hover,
.mx_TabbedView_tabsOnLeft .mx_TabbedView_tabLabel_active {
  color: var(--cpd-color-text-primary);
}
.mx_TabbedView_tabsOnLeft
  .mx_TabbedView_tabLabel:hover
  .mx_TabbedView_maskedIcon:before,
.mx_TabbedView_tabsOnLeft
  .mx_TabbedView_tabLabel_active
  .mx_TabbedView_maskedIcon:before {
  background-color: var(--cpd-color-icon-primary);
}
.mx_TabbedView_tabsOnLeft .mx_TabbedView_tabLabel_active {
  background-color: var(--cpd-color-bg-subtle-secondary);
}
.mx_TabbedView_tabsOnLeft .mx_TabbedView_maskedIcon {
  height: 20px;
  margin-right: var(--cpd-space-3x);
  width: 20px;
}
.mx_TabbedView_tabsOnLeft .mx_TabbedView_maskedIcon:before {
  height: 20px;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  -webkit-transition: background-color 0.1s;
  transition: background-color 0.1s;
  width: 20px;
}
.mx_TabbedView_tabsOnTop {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_TabbedView_tabsOnTop .mx_TabbedView_tabLabels {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 8px;
}
.mx_TabbedView_tabsOnTop .mx_TabbedView_tabLabel {
  padding-left: 0;
  padding-right: 52px;
}
.mx_TabbedView_tabsOnTop .mx_TabbedView_tabLabel .mx_TabbedView_tabLabel_text {
  color: var(--cpd-color-gray-800);
  font-size: 15px;
}
.mx_TabbedView_tabsOnTop .mx_TabbedView_tabPanel {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
}
.mx_TabbedView_tabsOnTop .mx_TabbedView_tabLabel_active,
.mx_TabbedView_tabsOnTop
  .mx_TabbedView_tabLabel_active
  .mx_TabbedView_tabLabel_text {
  color: var(--cpd-color-text-action-accent);
}
.mx_TabbedView_tabsOnTop
  .mx_TabbedView_tabLabel_active
  .mx_TabbedView_maskedIcon:before {
  background-color: var(--cpd-color-text-action-accent);
}
.mx_TabbedView_tabsOnTop .mx_TabbedView_maskedIcon {
  height: 22px;
  margin-left: 0;
  margin-right: 8px;
  width: 22px;
}
.mx_TabbedView_tabsOnTop .mx_TabbedView_maskedIcon:before {
  height: inherit;
  -webkit-mask-size: 22px;
  mask-size: 22px;
  width: inherit;
}
.mx_TabbedView_tabLabels {
  color: var(--cpd-color-text-secondary);
}
.mx_TabbedView_tabLabel {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 24px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
  font: var(--cpd-font-body-md-medium);
  min-block-size: 40px;
  min-inline-size: 40px;
  padding-block: var(--cpd-space-2x);
  padding-inline: var(--cpd-space-3x) var(--cpd-space-4x);
  position: relative;
  -webkit-transition: color 0.1s, background-color 0.1s;
  transition: color 0.1s, background-color 0.1s;
  vertical-align: text-top;
}
.mx_TabbedView_maskedIcon {
  display: inline-block;
}
.mx_TabbedView_maskedIcon:before {
  background-color: var(--cpd-color-icon-secondary);
  content: "";
  display: inline-block;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
.mx_TabbedView_tabLabel_text {
  vertical-align: middle;
}
.mx_TabbedView_tabPanel {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_TabbedView_tabPanel,
.mx_TabbedView_tabPanelContent {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  min-height: 0;
}
.mx_TabbedView_tabPanelContent {
  overflow: auto;
}
@media (max-width: 1024px) {
  .mx_TabbedView_tabsOnLeft.mx_TabbedView_responsive
    .mx_TabbedView_tabLabel_text {
    display: none;
  }
  .mx_TabbedView_tabsOnLeft.mx_TabbedView_responsive .mx_TabbedView_tabPanel {
    margin-left: 72px;
  }
  .mx_TabbedView_tabsOnLeft.mx_TabbedView_responsive .mx_TabbedView_maskedIcon {
    margin-left: auto;
    margin-right: auto;
  }
  .mx_TabbedView_tabsOnLeft.mx_TabbedView_responsive .mx_TabbedView_tabLabels {
    width: auto;
  }
  .mx_TabbedView_tabsOnLeft.mx_TabbedView_responsive .mx_TabbedView_tabLabel {
    padding-inline: 0 0;
  }
}
.mx_ThreadsActivityCentre_container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_ThreadsActivityCentreButton {
  border-radius: 8px;
  margin: 18px auto auto;
}
.mx_ThreadsActivityCentreButton.expanded {
  background-color: transparent !important;
  margin-left: 21px;
}
.mx_ThreadsActivityCentreButton.expanded > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_ThreadsActivityCentreButton.expanded .mx_ThreadsActivityCentreButton_Icon {
  margin-right: 14px;
  min-width: 24px;
}
.mx_ThreadsActivityCentreButton.expanded .mx_ThreadsActivityCentreButton_Text {
  color: var(--cpd-color-text-secondary);
}
.mx_ThreadsActivityCentreButton:not(.expanded):hover,
.mx_ThreadsActivityCentreButton:not(.expanded):hover
  .mx_ThreadsActivityCentreButton_Icon {
  background-color: var(--cpd-color-gray-600);
  color: var(--cpd-color-text-primary);
}
.mx_ThreadsActivityCentreButton .mx_ThreadsActivityCentreButton_Icon {
  color: #488D41;
}
.mx_ThreadsActivityCentre_rows {
  max-height: calc(100vh - 200px);
  overflow-y: scroll;
}
.mx_ThreadsActivityCentre_rows .mx_ThreadsActivityCentreRow {
  height: 48px;
}
.mx_ThreadsActivityCentre_rows .mx_ThreadsActivityCentreRow > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 202px;
}
.mx_ThreadsActivityCentre_emptyCaption {
  font-size: 13px;
  padding-left: 16px;
  padding-right: 16px;
}
.mx_ToastContainer {
  display: grid;
  grid-template-rows: 1fr 14px 6px;
  left: 70px;
  padding: 4px;
  position: absolute;
  top: 0;
  z-index: 101;
}
.mx_ToastContainer.mx_ToastContainer_stacked:before {
  background-color: var(--cpd-color-bg-subtle-primary);
  border-radius: 8px;
  -webkit-box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
  content: "";
  grid-column: 1;
  grid-row: 2/4;
  margin: 0 4px;
}
.mx_ToastContainer .mx_Toast_toast {
  background-color: var(--cpd-color-bg-canvas-default);
  border: var(--cpd-border-width-1) solid
    var(--cpd-color-border-interactive-secondary);
  border-radius: 12px;
  -webkit-box-shadow: 0 4px 24px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.1);
  color: var(--cpd-color-text-primary);
  display: grid;
  grid-column: 1;
  grid-row: 1/3;
  grid-template-columns: 22px 1fr;
  overflow: hidden;
  grid-column-gap: 8px;
  -webkit-column-gap: 8px;
  -moz-column-gap: 8px;
  column-gap: 8px;
  grid-row-gap: 4px;
  padding: var(--cpd-space-3x);
  row-gap: 4px;
}
.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon:after,
.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon:before {
  background-repeat: no-repeat;
  background-size: 100%;
  content: "";
  grid-column: 1;
  grid-row: 1;
  height: 22px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100%;
  mask-size: 100%;
  width: 22px;
}
.mx_ToastContainer
  .mx_Toast_toast.mx_Toast_hasIcon.mx_Toast_icon_verification:after {
  background-color: var(--cpd-color-text-primary);
  -webkit-mask-image: url(../../img/e2e/normal.ab42a7b.svg);
  mask-image: url(../../img/e2e/normal.ab42a7b.svg);
}
.mx_ToastContainer
  .mx_Toast_toast.mx_Toast_hasIcon.mx_Toast_icon_verification_warning:before {
  background-color: #fff;
  -webkit-mask-image: url(../../img/e2e/normal.ab42a7b.svg);
  mask-image: url(../../img/e2e/normal.ab42a7b.svg);
  -webkit-mask-size: 80%;
  mask-size: 80%;
}
.mx_ToastContainer
  .mx_Toast_toast.mx_Toast_hasIcon.mx_Toast_icon_verification_warning:after {
  background-color: var(--cpd-color-icon-critical-primary);
  -webkit-mask-image: url(../../img/e2e/warning.71ffc83.svg);
  mask-image: url(../../img/e2e/warning.71ffc83.svg);
}
.mx_ToastContainer
  .mx_Toast_toast.mx_Toast_hasIcon.mx_Toast_icon_secure_backup:after {
  background-color: var(--cpd-color-text-primary);
  -webkit-mask-image: url(../../img/feather-customised/secure-backup.7e95b34.svg);
  mask-image: url(../../img/feather-customised/secure-backup.7e95b34.svg);
}
.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon.mx_Toast_icon_labs:after {
  background-color: var(--cpd-color-text-secondary);
  -webkit-mask-image: url(../../img/element-icons/flask.6aca159.svg);
  mask-image: url(../../img/element-icons/flask.6aca159.svg);
}
.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon .mx_Toast_body,
.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon .mx_Toast_title {
  grid-column: 2;
}
.mx_ToastContainer .mx_Toast_toast:not(.mx_Toast_hasIcon) {
  padding-left: 12px;
}
.mx_ToastContainer .mx_Toast_toast:not(.mx_Toast_hasIcon) .mx_Toast_title {
  grid-column: 1/-1;
}
.mx_ToastContainer .mx_Toast_toast .mx_Toast_description,
.mx_ToastContainer .mx_Toast_toast .mx_Toast_title {
  padding-right: 8px;
}
.mx_ToastContainer .mx_Toast_toast .mx_Toast_title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-column-gap: 8px;
  -moz-column-gap: 8px;
  column-gap: 8px;
  width: 100%;
}
.mx_ToastContainer .mx_Toast_toast .mx_Toast_title h2 {
  display: inline;
  font: var(--cpd-font-heading-sm-medium);
  font-weight: var(--cpd-font-weight-medium);
  margin: 0;
  width: auto;
}
.mx_ToastContainer
  .mx_Toast_toast
  .mx_Toast_title
  .mx_Toast_title_countIndicator {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  line-height: 1.375rem;
  -webkit-margin-start: auto;
  margin-inline-start: auto;
}
.mx_ToastContainer .mx_Toast_toast .mx_Toast_body {
  grid-column: 1/3;
  grid-row: 2;
}
.mx_ToastContainer .mx_Toast_toast .mx_Toast_buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  -webkit-column-gap: 5px;
  -moz-column-gap: 5px;
  column-gap: 5px;
  justify-content: flex-end;
}
.mx_ToastContainer .mx_Toast_toast .mx_Toast_buttons .mx_AccessibleButton {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  min-width: 96px;
}
.mx_ToastContainer .mx_Toast_toast .mx_Toast_description {
  font: var(--cpd-font-body-sm-regular);
  margin: 4px 0 11px;
  max-width: 272px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mx_ToastContainer .mx_Toast_toast .mx_Toast_description a {
  text-decoration: none;
}
.mx_ToastContainer .mx_Toast_toast .mx_Toast_detail {
  color: var(--cpd-color-text-secondary);
}
.mx_ToastContainer .mx_Toast_toast .mx_Toast_deviceID {
  font-size: 0.625rem;
}
.mx_UploadBar {
  padding-left: 65px;
  padding-top: 5px;
  position: relative;
}
.mx_UploadBar .mx_ProgressBar {
  width: calc(100% - 40px);
}
.mx_ThreadView .mx_UploadBar {
  padding-left: 0;
}
.mx_UploadBar_filename {
  color: #61708b;
  font-size: 0.9375rem;
  padding-left: 22px;
  padding-right: 38px;
  position: relative;
  vertical-align: middle;
}
.mx_UploadBar_filename:before {
  background-color: #61708b;
  content: "";
  height: 18px;
  left: 0;
  -webkit-mask-image: url(../../img/element-icons/upload.1018a2f.svg);
  mask-image: url(../../img/element-icons/upload.1018a2f.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  position: absolute;
  top: 0;
  width: 18px;
}
.mx_UploadBar_cancel {
  background-color: #61708b;
  height: 16px;
  margin-right: 16px;
  margin-top: 5px;
  -webkit-mask-image: url(../../img/icons-close.18b3d80.svg);
  mask-image: url(../../img/icons-close.18b3d80.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  position: absolute;
  right: 0;
  top: 0;
  width: 16px;
}
.mx_UserMenu {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.mx_UserMenu,
.mx_UserMenu .mx_AccessibleButton {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_UserMenu .mx_AccessibleButton .mx_UserMenu_userAvatar {
  position: relative;
}
.mx_UserMenu .mx_AccessibleButton .mx_UserMenu_userAvatar .mx_BaseAvatar {
  pointer-events: none;
}
.mx_UserMenu .mx_AccessibleButton .mx_UserMenu_userAvatarLive {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: var(--cpd-color-text-critical-primary);
  border-radius: 6px;
  color: var(--cpd-color-icon-on-solid-primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 12px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  left: 25px;
  position: absolute;
  top: 20px;
  width: 12px;
}
.mx_UserMenu .mx_UserMenu_contextMenuButton {
  width: 100%;
}
.mx_UserMenu .mx_UserMenu_name {
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.5rem;
  margin-left: 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_UserMenu .mx_UserMenu_dndBadge {
  border-radius: 50%;
  bottom: -2px;
  height: 16px;
  position: absolute;
  right: -7px;
  width: 16px;
}
.mx_UserMenu .mx_UserMenu_dndBadge:before {
  background-color: var(--cpd-color-text-critical-primary);
  content: "";
  height: 16px;
  -webkit-mask-image: url(../../img/element-icons/roomlist/dnd.83b4a64.svg);
  mask-image: url(../../img/element-icons/roomlist/dnd.83b4a64.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  width: 16px;
}
.mx_IconizedContextMenu.mx_UserMenu_contextMenu {
  width: 258px;
}
.mx_UserMenu_contextMenu.mx_IconizedContextMenu
  .mx_IconizedContextMenu_optionList_red
  .mx_AccessibleButton {
  padding-bottom: 16px;
  padding-top: 16px;
}
.mx_UserMenu_contextMenu .mx_UserMenu_contextMenu_header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 20px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_UserMenu_contextMenu
  .mx_UserMenu_contextMenu_header
  .mx_UserMenu_contextMenu_name {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: calc(100% - 40px);
}
.mx_UserMenu_contextMenu
  .mx_UserMenu_contextMenu_header
  .mx_UserMenu_contextMenu_name
  .mx_UserMenu_contextMenu_displayName,
.mx_UserMenu_contextMenu
  .mx_UserMenu_contextMenu_header
  .mx_UserMenu_contextMenu_name
  .mx_UserMenu_contextMenu_userId {
  font: var(--cpd-font-heading-sm-regular);
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}
.mx_UserMenu_contextMenu
  .mx_UserMenu_contextMenu_header
  .mx_UserMenu_contextMenu_name
  .mx_UserMenu_contextMenu_displayName {
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_UserMenu_contextMenu
  .mx_UserMenu_contextMenu_header
  .mx_UserMenu_contextMenu_themeButton {
  background-color: var(--cpd-color-gray-400);
  border-radius: 32px;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: none;
  height: 32px;
  margin-left: 8px;
  max-width: 32px;
  min-width: 32px;
  width: 32px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_UserMenu_contextMenu
  .mx_UserMenu_contextMenu_header.mx_UserMenu_contextMenu_guestPrompts {
  display: inline-block;
  padding-top: 0;
}
.mx_UserMenu_contextMenu
  .mx_UserMenu_contextMenu_header.mx_UserMenu_contextMenu_guestPrompts
  > span {
  display: block;
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_UserMenu_contextMenu
  .mx_UserMenu_contextMenu_header.mx_UserMenu_contextMenu_guestPrompts
  > span
  + span {
  margin-top: 8px;
}
.mx_UserMenu_contextMenu .mx_IconizedContextMenu_icon {
  display: block;
  height: 16px;
  width: 16px;
}
.mx_UserMenu_contextMenu .mx_IconizedContextMenu_icon:before {
  background: var(--cpd-color-icon-tertiary);
  content: "";
  display: block;
  height: 16px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  width: 16px;
}
.mx_UserMenu_contextMenu .mx_UserMenu_iconHome:before {
  -webkit-mask-image: url(../../img/element-icons/home.e0e6ce5.svg);
  mask-image: url(../../img/element-icons/home.e0e6ce5.svg);
}
.mx_UserMenu_contextMenu .mx_UserMenu_iconDnd:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/dnd.83b4a64.svg);
  mask-image: url(../../img/element-icons/roomlist/dnd.83b4a64.svg);
}
.mx_UserMenu_contextMenu .mx_UserMenu_iconDndOff:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/dnd-cross.2cf7314.svg);
  mask-image: url(../../img/element-icons/roomlist/dnd-cross.2cf7314.svg);
}
.mx_UserMenu_contextMenu .mx_UserMenu_iconBell:before {
  -webkit-mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
  mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
}
.mx_UserMenu_contextMenu .mx_UserMenu_iconLock:before {
  -webkit-mask-image: url(../../img/element-icons/security.fa860ea.svg);
  mask-image: url(../../img/element-icons/security.fa860ea.svg);
}
.mx_UserMenu_contextMenu .mx_UserMenu_iconSettings:before {
  -webkit-mask-image: url(../../img/element-icons/settings.6b0c052.svg);
  mask-image: url(../../img/element-icons/settings.6b0c052.svg);
}
.mx_UserMenu_contextMenu .mx_UserMenu_iconMessage:before {
  -webkit-mask-image: url(../../img/element-icons/feedback.0bc9353.svg);
  mask-image: url(../../img/element-icons/feedback.0bc9353.svg);
}
.mx_UserMenu_contextMenu .mx_UserMenu_iconSignOut:before {
  -webkit-mask-image: url(../../img/element-icons/leave.9cf503d.svg);
  mask-image: url(../../img/element-icons/leave.9cf503d.svg);
}
.mx_UserMenu_contextMenu .mx_UserMenu_iconQr:before {
  -webkit-mask-image: url(../../icons/qr-code.f185038.svg);
  mask-image: url(../../icons/qr-code.f185038.svg);
}
.mx_UserMenu_CustomStatusSection {
  margin: 0 12px 8px;
}
.mx_UserMenu_CustomStatusSection .mx_UserMenu_CustomStatusSection_field {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}
.mx_UserMenu_CustomStatusSection
  .mx_UserMenu_CustomStatusSection_field.mx_UserMenu_CustomStatusSection_field_hasQuery
  .mx_UserMenu_CustomStatusSection_clear {
  display: block;
}
.mx_UserMenu_CustomStatusSection
  .mx_UserMenu_CustomStatusSection_field
  > .mx_UserMenu_CustomStatusSection_input {
  border: 1px solid var(--cpd-color-text-action-accent);
  border-radius: 8px;
  width: 100%;
}
.mx_UserMenu_CustomStatusSection
  .mx_UserMenu_CustomStatusSection_field
  > .mx_UserMenu_CustomStatusSection_input:focus
  + .mx_UserMenu_CustomStatusSection_clear {
  display: block;
}
.mx_UserMenu_CustomStatusSection
  .mx_UserMenu_CustomStatusSection_field
  > .mx_UserMenu_CustomStatusSection_clear {
  background-color: var(--cpd-color-gray-400);
  border-radius: 50%;
  display: none;
  height: 16px;
  margin-right: 8px;
  position: absolute;
  right: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 16px;
}
.mx_UserMenu_CustomStatusSection
  .mx_UserMenu_CustomStatusSection_field
  > .mx_UserMenu_CustomStatusSection_clear:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: inherit;
  -webkit-mask-image: url(../../img/feather-customised/x.c543757.svg);
  mask-image: url(../../img/feather-customised/x.c543757.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 12px;
  mask-size: 12px;
  position: absolute;
  width: inherit;
}
.mx_UserMenu_CustomStatusSection > p {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  line-height: 0.9375rem;
  margin: 4px 0;
}
.mx_UserMenu_CustomStatusSection .mx_AccessibleButton_kind_primary_outline {
  display: block;
}
.mx_ViewSource pre {
  font-size: 0.75rem;
  padding: 0.5em 1em;
  word-wrap: break-word;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}
.mx_ViewSource .mx_ViewSource_header {
  border-bottom: 1px solid var(--cpd-color-gray-400);
  font-family: monospace;
  margin-bottom: 12px;
  padding-bottom: 12px;
}
.mx_ViewSource .mx_ViewSource_header .mx_CopyableText {
  word-break: break-all;
}
.mx_ViewSource .mx_ViewSource_heading {
  color: var(--cpd-color-text-primary);
  font-size: 1.0625rem;
  font-weight: 400;
  margin-top: 12px;
}
.mx_ViewSource .mx_ViewSource_details {
  margin-top: 12px;
}
.mx_ViewSource .mx_CopyableText_border {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
}
.mx_CompleteSecurity_header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_CompleteSecurity_headerIcon {
  height: 24px;
  margin-right: 4px;
  position: relative;
  width: 24px;
}
.mx_CompleteSecurity_heroIcon {
  height: 128px;
  margin: 0 auto;
  position: relative;
  width: 128px;
}
.mx_CompleteSecurity_skip {
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 14px;
  cursor: pointer;
  height: 28px;
  position: relative;
  width: 28px;
}
.mx_CompleteSecurity_skip:hover {
  background-color: var(--cpd-color-bg-subtle-primary);
}
.mx_CompleteSecurity_skip:before {
  background-color: var(--cpd-color-icon-secondary);
  content: "";
  height: 28px;
  -webkit-mask-image: url(../../icons/close.dce71fd.svg);
  mask-image: url(../../icons/close.dce71fd.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  position: absolute;
  width: 28px;
}
.mx_CompleteSecurity_skip {
  position: absolute;
  right: 24px;
}
.mx_CompleteSecurity_body {
  font-size: 0.9375rem;
}
.mx_CompleteSecurity_waiting {
  color: var(--cpd-color-gray-800);
}
.mx_CompleteSecurity_actionRow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  margin-top: 1.75rem;
}
@media only screen and (max-width: 768px) {
  .mx_CompleteSecurity_actionRow {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      gap: 10px;
      -webkit-box-pack: end;
      -ms-flex-pack: end;
      justify-content: flex-end;
      flex-direction: column;
      align-content: center;
      align-items: center;
  }
}

.mx_CompleteSecurity_actionRow .mx_AccessibleButton {
  -webkit-margin-start: 18px;
  margin-inline-start: 18px;
}
.mx_CompleteSecurity_actionRow .mx_AccessibleButton.warning {
  color: var(--cpd-color-text-critical-primary);
}
.mx_ConfirmSessionLockTheftView {
  height: 100%;
  width: 100%;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_ConfirmSessionLockTheftView,
.mx_ConfirmSessionLockTheftView_body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_ConfirmSessionLockTheftView_body {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  max-width: 400px;
}
.mx_Login_submit {
  background-color: var(--cpd-color-bg-action-primary-rest);
  border: 0;
  border-radius: 24px;
  color: var(--cpd-color-bg-canvas-default);
  cursor: pointer;
  display: inline-block;
  font: var(--cpd-font-body-md-regular);
  padding: 7px 1.5em;
  vertical-align: middle;
  width: auto;
}
.mx_Login_submit:not(:focus-visible) {
  outline: none;
}
.mx_Login_submit {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 15px;
  font-weight: var(--cpd-font-weight-semibold);
  margin-bottom: 24px;
  margin-top: 24px;
  text-align: center;
  width: 100%;
}
.mx_Login_submit:disabled {
  cursor: default;
  opacity: 0.3;
}
.mx_Login_loader {
  display: inline;
  left: 8px;
  position: relative;
  top: 2px;
}
.mx_Login_loader .mx_Spinner {
  display: inline;
}
.mx_Login_loader .mx_Spinner img {
  height: 16px;
  width: 16px;
}
.mx_Login_error {
  color: var(--cpd-color-text-critical-primary);
  font-weight: 700;
  margin-bottom: 12px;
  margin-top: 12px;
  text-align: center;
}
.mx_Login_error.mx_Login_serverError {
  font-weight: 400;
  text-align: left;
}
.mx_Login_error.mx_Login_serverError.mx_Login_serverErrorNonFatal {
  color: #ff8d13;
}
.mx_Login_type_container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: none;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-primary);
}
.mx_Login_type_container .mx_Field {
  margin: 0;
}
.mx_Login_type_label {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_Login_underlinedServerName {
  border-bottom: 1px dashed var(--cpd-color-text-action-accent);
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
div.mx_AccessibleButton_kind_link.mx_Login_forgot {
  display: block;
  margin-top: 24px;
}
div.mx_AccessibleButton_kind_link.mx_Login_forgot.mx_AccessibleButton_disabled {
  cursor: not-allowed;
}
.mx_Login_spinner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center;
  padding: 14px;
}
.mx_Login_fullWidthButton {
  margin-bottom: 16px;
  width: 100%;
}
.mx_LoginSplashView_migrationProgress {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  height: 100%;
  justify-content: center;
  width: 100%;
}
.mx_LoginSplashView_migrationProgress .mx_ProgressBar {
  border-radius: 8px;
  height: 8px;
  width: 600px;
}
.mx_LoginSplashView_migrationProgress .mx_ProgressBar::-moz-progress-bar {
  border-radius: 8px;
}
.mx_LoginSplashView_migrationProgress .mx_ProgressBar::-webkit-progress-bar,
.mx_LoginSplashView_migrationProgress .mx_ProgressBar::-webkit-progress-value {
  border-radius: 8px;
}
.mx_LoginSplashView_splashButtons {
  bottom: 30px;
  position: absolute;
  text-align: center;
  width: 100%;
}
.mx_LoginSplashView_syncError {
  background-color: #df2a8b;
  border-radius: 5px;
  color: #f4f6fa;
  display: table;
  left: 50%;
  padding: 30px;
  position: absolute;
  top: 100px;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
.mx_Register_mainContent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  min-height: 270px;
}
.mx_Register_mainContent p {
  color: var(--cpd-color-text-primary);
  font: var(--cpd-font-body-md-regular);
}
.mx_Register_mainContent p.secondary {
  color: var(--cpd-color-text-secondary);
}
.mx_Register_mainContent > img:first-child {
  margin-bottom: 16px;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
.mx_Register_mainContent .mx_Login_submit {
  margin-bottom: 0;
}
.mx_Register_footerActions {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  border-top: 1px solid rgba(141, 151, 165, 0.2);
  justify-content: space-between;
  margin-top: 16px;
  padding-top: 16px;
}
.mx_Register_footerActions > * {
  -ms-flex-preferred-size: content;
  flex-basis: content;
}
.mx_SessionLockStolenView h1 {
  font-size: 2rem;
  font-weight: var(--cpd-font-weight-semibold);
  text-align: center;
}
.mx_SessionLockStolenView h2 {
  font-size: 1.5rem;
  font-weight: 500;
  margin: 0;
  text-align: center;
}
.mx_SetupEncryptionBody_reset {
  color: #747474;
  margin-top: 0.875rem;
}
.mx_SetupEncryptionBody_reset
  .mx_SetupEncryptionBody_reset_link.mx_AccessibleButton_kind_link_inline {
  color: var(--cpd-color-text-critical-primary);
}
.mx_MediaBody.mx_AudioPlayer_container {
  padding: 16px 12px 12px;
}
.mx_MediaBody.mx_AudioPlayer_container .mx_AudioPlayer_primaryContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_MediaBody.mx_AudioPlayer_container
  .mx_AudioPlayer_primaryContainer
  .mx_PlayPauseButton {
  margin-right: 8px;
}
.mx_MediaBody.mx_AudioPlayer_container
  .mx_AudioPlayer_primaryContainer
  .mx_AudioPlayer_mediaInfo {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
}
.mx_MediaBody.mx_AudioPlayer_container
  .mx_AudioPlayer_primaryContainer
  .mx_AudioPlayer_mediaInfo
  > * {
  display: block;
}
.mx_MediaBody.mx_AudioPlayer_container
  .mx_AudioPlayer_primaryContainer
  .mx_AudioPlayer_mediaInfo
  .mx_AudioPlayer_mediaName {
  color: var(--cpd-color-text-primary);
  font-size: 0.9375rem;
  line-height: 0.9375rem;
  overflow: hidden;
  padding-bottom: 4px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_MediaBody.mx_AudioPlayer_container
  .mx_AudioPlayer_primaryContainer
  .mx_AudioPlayer_mediaInfo
  .mx_AudioPlayer_byline {
  font-size: 0.75rem;
  line-height: 0.75rem;
}
.mx_MediaBody.mx_AudioPlayer_container .mx_AudioPlayer_seek {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_MediaBody.mx_AudioPlayer_container .mx_AudioPlayer_seek .mx_SeekBar {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_MediaBody.mx_AudioPlayer_container .mx_AudioPlayer_seek .mx_Clock {
  min-width: 2.625rem;
  padding-left: 4px;
  text-align: justify;
  white-space: nowrap;
}
.mx_PlayPauseButton {
  background-color: var(--cpd-color-bg-subtle-primary);
  border-radius: 32px;
  height: 32px;
  min-height: 32px;
  min-width: 32px;
  position: relative;
  width: 32px;
}
.mx_PlayPauseButton:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
}
.mx_PlayPauseButton.mx_PlayPauseButton_disabled:before {
  opacity: 0.5;
}
.mx_PlayPauseButton.mx_PlayPauseButton_play:before {
  height: 16px;
  left: 12px;
  -webkit-mask-image: url(../../img/element-icons/play.1b76a00.svg);
  mask-image: url(../../img/element-icons/play.1b76a00.svg);
  top: 8px;
  width: 13px;
}
.mx_PlayPauseButton.mx_PlayPauseButton_pause:before {
  height: 12px;
  left: 11px;
  -webkit-mask-image: url(../../img/element-icons/pause.9c2f319.svg);
  mask-image: url(../../img/element-icons/pause.9c2f319.svg);
  top: 10px;
  width: 10px;
}
.mx_MediaBody.mx_VoiceMessagePrimaryContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-right: 11px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  contain: content;
}
.mx_MediaBody.mx_VoiceMessagePrimaryContainer
  .mx_RecordingPlayback_timelineLayoutMiddle,
.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_Waveform {
  min-width: 0;
}
.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_Waveform .mx_Waveform_bar {
  background-color: var(--cpd-color-gray-600);
  height: 100%;
  -webkit-transform: scaleY(max(0.05, var(--barHeight)));
  transform: scaleY(max(0.05, var(--barHeight)));
}
.mx_MediaBody.mx_VoiceMessagePrimaryContainer
  .mx_Waveform
  .mx_Waveform_bar.mx_Waveform_bar_100pct {
  background-color: var(--cpd-color-text-secondary);
  -webkit-transition: background-color 0.25s ease;
  transition: background-color 0.25s ease;
}
.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_Clock {
  min-width: 2.625rem;
  padding-left: 8px;
  padding-right: 6px;
  width: 2.625rem;
}
.mx_MediaBody.mx_VoiceMessagePrimaryContainer
  .mx_RecordingPlayback_timelineLayoutMiddle {
  display: inline-block;
  margin-left: 8px;
  margin-right: 6px;
  position: relative;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  height: 30px;
}
.mx_MediaBody.mx_VoiceMessagePrimaryContainer
  .mx_RecordingPlayback_timelineLayoutMiddle
  .mx_Waveform {
  left: 0;
  top: 0;
}
.mx_MediaBody.mx_VoiceMessagePrimaryContainer
  .mx_RecordingPlayback_timelineLayoutMiddle
  .mx_SeekBar {
  background: none;
  height: 30px;
  left: 0;
  position: absolute;
  top: -2px;
}
.mx_MediaBody.mx_VoiceMessagePrimaryContainer
  .mx_RecordingPlayback_timelineLayoutMiddle
  .mx_SeekBar:before {
  background: none;
}
.mx_MediaBody.mx_VoiceMessagePrimaryContainer
  .mx_RecordingPlayback_timelineLayoutMiddle
  .mx_SeekBar::-moz-range-progress {
  background: none;
}
.mx_MediaBody.mx_VoiceMessagePrimaryContainer
  .mx_RecordingPlayback_timelineLayoutMiddle
  .mx_SeekBar::-webkit-slider-thumb {
  background-color: transparent;
  height: 10px;
  width: 10px;
}
.mx_MediaBody.mx_VoiceMessagePrimaryContainer
  .mx_RecordingPlayback_timelineLayoutMiddle
  .mx_SeekBar::-moz-range-thumb {
  background-color: transparent;
  height: 10px;
  width: 10px;
}
.mx_MediaBody.mx_VoiceMessagePrimaryContainer
  .mx_RecordingPlayback_timelineLayoutMiddle
  + .mx_Clock {
  padding: 0;
  text-align: right;
}
.mx_SeekBar {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: var(--cpd-color-gray-600);
  cursor: pointer;
  height: 1px;
  outline: none;
  position: relative;
  width: 100%;
}
.mx_SeekBar::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  background-color: var(--cpd-color-gray-800);
  border-radius: 8px;
  cursor: pointer;
  height: 8px;
  width: 8px;
}
.mx_SeekBar::-moz-range-thumb {
  background-color: var(--cpd-color-gray-800);
  border: none;
  border-radius: 8px;
  cursor: pointer;
  height: 8px;
  width: 8px;
}
.mx_SeekBar:before {
  background-color: var(--cpd-color-gray-800);
  content: "";
  height: 1px;
  left: 0;
  position: absolute;
  top: 0;
  -webkit-transform: scaleX(var(--fillTo));
  transform: scaleX(var(--fillTo));
  -webkit-transform-origin: 0 100%;
  transform-origin: 0 100%;
  width: 100%;
}
.mx_SeekBar::-moz-range-progress {
  background-color: var(--cpd-color-gray-800);
  height: 1px;
}
.mx_SeekBar:disabled {
  opacity: 0.5;
}
.mx_SeekBar:after {
  bottom: -6px;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: -6px;
}
.mx_Waveform {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 30px;
  position: relative;
  top: 1px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  overflow: hidden;
}
.mx_Waveform .mx_Waveform_bar {
  border: 1px solid transparent;
  border-radius: 2px;
  margin-left: 1px;
  margin-right: 1px;
  max-height: 100%;
  min-height: 0;
  width: 0;
}
.mx_AuthBody {
  border-radius: 0 4px 4px 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  padding: 25px 60px;
  width: 500px;
}
.mx_AuthBody b {
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_AuthBody.mx_AuthBody_flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_AuthBody h1 {
  color: #488D41;
  font-size: 1.5rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin-top: 8px;
}
.mx_AuthBody h2 {
  color: var(--cpd-color-text-secondary);
  font: var(--cpd-font-body-md-semibold);
}
.mx_AuthBody h2.mx_AuthBody_centered {
  text-align: center;
}
.mx_AuthBody a:hover,
.mx_AuthBody a:link,
.mx_AuthBody a:visited {
  color: var(--cpd-color-text-action-accent);
  text-decoration: none;
}
.mx_AuthBody fieldset {
  display: block;
}
.mx_AuthBody .mx_AuthBody_icon {
  width: 40px;
}
.mx_AuthBody .mx_AuthBody_lockIcon {
  color: var(--cpd-color-text-secondary);
  height: 32px;
  margin-bottom: -3px;
}
.mx_AuthBody .mx_AuthBody_text {
  margin-bottom: 48px;
  margin-top: 0;
}
.mx_AuthBody input[type="password"],
.mx_AuthBody input[type="text"] {
  color: var(--cpd-color-text-primary);
}
.mx_AuthBody .mx_Field label {
  color : black
}
.mx_AuthBody .mx_Field input,
.mx_AuthBody .mx_Field select {
  background-color: var(--cpd-color-bg-canvas-default);
  color:#488D41;
}
.mx_AuthBody .mx_Field input:not(:-moz-placeholder-shown) + label,
.mx_AuthBody .mx_Field textarea:not(:-moz-placeholder-shown) + label {
  background-color: var(--cpd-color-bg-canvas-default);
}
.mx_AuthBody .mx_Field input:not(:-ms-input-placeholder) + label,
.mx_AuthBody .mx_Field textarea:not(:-ms-input-placeholder) + label {
  background-color: var(--cpd-color-bg-canvas-default);
}
.mx_AuthBody .mx_Field input:focus + label,
.mx_AuthBody .mx_Field input:not(:placeholder-shown) + label,
.mx_AuthBody .mx_Field select + label,
.mx_AuthBody .mx_Field textarea:focus + label,
.mx_AuthBody .mx_Field textarea:not(:placeholder-shown) + label,
.mx_AuthBody .mx_Field_labelAlwaysTopLeft label {
  background-color: var(--cpd-color-bg-canvas-default);
  color: #488D41;
}
.mx_AuthBody input.error {
  color: var(--cpd-color-text-critical-primary);
}
.mx_AuthBody .mx_Login_submit {
  height: 35px;
  margin-top: 16px;
  background-color: #488D41;
}
.mx_AuthBody .mx_ErrorMessage {
  margin-bottom: 12px;
  margin-top: 2px;
}
.mx_AuthBody .mx_Field input {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.mx_AuthBody .mx_Field_select:before {
  background-color: var(--cpd-color-text-primary);
}
.mx_AuthBody .mx_Dropdown {
  color: var(--cpd-color-text-primary);
}
.mx_AuthBody .mx_Dropdown_arrow {
  background: var(--cpd-color-text-primary);
}
.mx_AuthBody .mx_Dropdown_menu {
  background-color: var(--cpd-color-bg-canvas-default);
}
.mx_AuthBody .mx_Dropdown_menu .mx_Dropdown_option_highlight {
  background-color: var(--cpd-color-bg-subtle-primary);
}
.mx_AuthBody.mx_AuthBody_forgot-password {
  color: var(--cpd-color-text-primary);
  font: var(--cpd-font-body-md-regular);
  min-height: 600px;
  padding: 50px 32px;
}
.mx_AuthBody.mx_AuthBody_forgot-password h1 {
  margin: 24px 0;
}
.mx_AuthBody.mx_AuthBody_forgot-password .mx_AuthBody_button-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_AuthBody.mx_AuthBody_forgot-password .mx_Login_submit {
  font-weight: var(--cpd-font-weight-semibold);
  margin: 0 0 16px;
}
.mx_AuthBody.mx_AuthBody_forgot-password .mx_AuthBody_text {
  margin-bottom: 32px;
}
.mx_AuthBody.mx_AuthBody_forgot-password .mx_AuthBody_text p {
  margin: 0 0 8px;
}
.mx_AuthBody.mx_AuthBody_forgot-password .mx_AuthBody_sign-in-instead-button {
  font-weight: var(--cpd-font-weight-semibold);
  padding: 4px;
}
.mx_AuthBody.mx_AuthBody_forgot-password .mx_AuthBody_fieldRow {
  margin-bottom: 24px;
}
.mx_AuthBody.mx_AuthBody_forgot-password
  .mx_AccessibleButton.mx_AccessibleButton_hasKind {
  background: none;
}
.mx_AuthBody.mx_AuthBody_forgot-password
  .mx_AccessibleButton.mx_AccessibleButton_hasKind:disabled {
  cursor: default;
  opacity: 0.4;
}
.mx_AuthBody_did-not-receive {
  color: var(--cpd-color-text-secondary);
  gap: 8px;
}
.mx_AuthBody_did-not-receive,
.mx_AuthBody_resend-button {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_AuthBody_resend-button {
  border-radius: 8px;
  color: var(--cpd-color-text-action-accent);
  gap: 4px;
  padding: 4px;
}
.mx_AuthBody_resend-button:hover {
  background-color: var(--cpd-color-bg-subtle-primary);
}
.mx_AuthBody_emailPromptIcon {
  width: 57px;
}
.mx_AuthBody_emailPromptIcon--shifted {
  margin-bottom: -17px;
  position: relative;
  top: -17px;
  width: 57px;
}
.mx_AuthBody_fieldRow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  
}
.mx_AuthBody_fieldRow > .mx_Field {

}
@media only screen and (max-width: 768px) {
  .mx_AuthBody_fieldRow {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      flex-direction: column;
  }
}

.mx_AuthBody_fieldRow > .mx_Field:first-child {
  margin-left: 0;
}
.mx_AuthBody_fieldRow > .mx_Field:last-child {
  margin-right: 0;
}
.mx_AuthBody_paddedFooter {
  height: 80px;
  padding-top: 28px;
  text-align: center;
}
.mx_AuthBody_paddedFooter .mx_AuthBody_paddedFooter_title {
  font-size: 0.9375rem;
  line-height: 1.5rem;
  margin-top: 16px;
}
.mx_AuthBody_paddedFooter
  .mx_AuthBody_paddedFooter_title
  .mx_InlineSpinner
  img {
  margin-right: 5px;
  vertical-align: sub;
}
.mx_AuthBody_paddedFooter .mx_AuthBody_paddedFooter_subtitle {
  font-size: 0.625rem;
  line-height: 0.875rem;
  margin-top: 8px;
}
.mx_AuthBody_changeFlow {
  display: none;
  text-align: center;
}
.mx_AuthBody_changeFlow > a {
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_SSOButtons + .mx_AuthBody_changeFlow {
  margin-top: 24px;
}
.mx_AuthBody_spinner {
  margin: 1em 0;
}
@media only screen and (max-width: 480px) {
  .mx_AuthBody {
  
    width: 100%;
  }
}
.mx_AuthFooter {
  display: none !important;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(transparent),
    to(rgba(0, 0, 0, 0.8))
  );
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.8));
  font: var(--cpd-font-body-md-regular);
  opacity: 0.72;
  padding: 20px 0;
  text-align: center;
  width: 100%;
}
.mx_AuthFooter a:hover,
.mx_AuthFooter a:link,
.mx_AuthFooter a:visited {
  color: #f4f6fa;
  margin: 0 22px;
}
.mx_AuthHeader {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  padding: 4% 1% 0% 1%;
}
@media only screen and (max-width: 480px) {
  .mx_AuthHeader {
    display: none;
  }
}
.mx_AuthHeaderLogo {
  margin-top: -15px;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* padding: 0 25px; */
  display: flex;
  align-items: center;
  justify-content: center;
}
.mx_AuthHeaderLogo img {
  width: 30%;
}
@media only screen and (max-width: 480px) {
  .mx_AuthHeaderLogo {
    display: none;
  }
}
.mx_AuthPage {
  min-height: 100%;
  width: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  background-color: #2e3649;
  -ms-flex-direction: column;
  flex-direction: column;
  overflow: auto;
}
.mx_AuthPage,
.mx_AuthPage_modal {
 
  display: flex;
  align-items: center;
  justify-content: center;
}
.mx_AuthPage_modal {
  background-color: hsla(0, 0%, 96%, 0.9);
  border-radius: 4px;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.33);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.33);
}

@media only screen and (max-width: 480px) {
  .mx_AuthPage_modal {
    margin-top: 0;
  }
}
.mx_CompleteSecurityBody {
  background-color: var(--cpd-color-bg-canvas-default);
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: var(--cpd-color-text-primary);
  padding: 20px;
  width: 600px;
}
.mx_CompleteSecurityBody h2 {
  font-size: 1.5rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin-top: 0;
}
.mx_CompleteSecurityBody h3 {
  font: var(--cpd-font-body-md-semibold);
}
.mx_CompleteSecurityBody a:hover,
.mx_CompleteSecurityBody a:link,
.mx_CompleteSecurityBody a:visited {
  color: var(--cpd-color-text-action-accent);
  text-decoration: none;
}
.mx_CountryDropdown .mx_Dropdown_input .mx_Dropdown_option {
  padding: 0 3px;
  display: none !important;
}
.mx_CountryDropdown .mx_Dropdown_arrow {
  padding-right: 3px;
}
.mx_CountryDropdown_shortOption {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  height: 100%;
}
.mx_CountryDropdown_option,
.mx_CountryDropdown_shortOption {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_CountryDropdown_option {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_InteractiveAuthEntryComponents
  .mx_InteractiveAuthEntryComponents_termsSubmit {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin-bottom: 5px;
  margin-top: 20px;
  width: 100%;
}
.mx_InteractiveAuthEntryComponents_msisdnWrapper {
  text-align: center;
}
.mx_InteractiveAuthEntryComponents_msisdnEntry {
  border: 1px solid var(--cpd-color-border-interactive-primary);
  border-radius: 3px;
  font-size: 200%;
  font-weight: 700;
  width: 6em;
}
.mx_InteractiveAuthEntryComponents_msisdnEntry:focus {
  border: 1px solid var(--cpd-color-text-action-accent);
}
.mx_InteractiveAuthEntryComponents_msisdnSubmit {
  margin-bottom: 5px;
  margin-top: 4px;
}
.mx_InteractiveAuthEntryComponents_msisdnSubmit:disabled {
  background-color: #747474;
  cursor: default;
}
.mx_InteractiveAuthEntryComponents_termsPolicy {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_InteractiveAuthEntryComponents_passwordSection {
  width: 300px;
}
.mx_InteractiveAuthEntryComponents_sso_buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  margin-top: 20px;
}
.mx_InteractiveAuthEntryComponents_sso_buttons .mx_AccessibleButton {
  margin-left: 5px;
}
.mx_InteractiveAuthEntryComponents_emailWrapper
  .mx_AccessibleButton_kind_link_inline {
  display: inline-block !important;
}
.mx_InteractiveAuthEntryComponents_emailWrapper
  .mx_AccessibleButton_kind_link_inline
  .mx_Spinner {
  display: -webkit-inline-box !important;
  display: -ms-inline-flexbox !important;
  display: inline-flex !important;
  vertical-align: middle !important;
  width: auto !important;
}
.mx_AuthBody_language {
  width: 100%;
}
.mx_AuthBody_language .mx_Dropdown_input {
  border: none;
  color: var(--cpd-color-text-secondary);
  font: var(--cpd-font-body-md-semibold);
  width: auto;
}
.mx_AuthBody_language .mx_Dropdown_arrow {
  background: var(--cpd-color-text-secondary);
}
.mx_LoginWithQRSection p {
  margin-bottom: 16px;
  margin-top: 0;
}
.mx_LoginWithQRSection .mx_AccessibleButton svg {
  margin-right: 12px;
}
.mx_AuthPage .mx_LoginWithQR .mx_AccessibleButton {
  display: block !important;
}
.mx_AuthPage .mx_LoginWithQR .mx_AccessibleButton + .mx_AccessibleButton {
  margin-top: 8px;
}
.mx_AuthPage .mx_LoginWithQR {
  font-size: 0.9375rem;
}
.mx_UserSettingsDialog .mx_LoginWithQR {
  font: var(--cpd-font-body-md-regular);
}
.mx_UserSettingsDialog .mx_LoginWithQR h1 {
  font-size: 1.5rem;
  margin-bottom: 0;
}
.mx_UserSettingsDialog .mx_LoginWithQR h2 {
  margin-top: 24px;
}
.mx_UserSettingsDialog .mx_LoginWithQR .mx_QRCode {
  margin: 28px 0;
}
.mx_LoginWithQR,
.mx_UserSettingsDialog .mx_LoginWithQR .mx_LoginWithQR_qrWrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_LoginWithQR {
  min-height: 350px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_LoginWithQR h1 > svg.normal {
  color: var(--cpd-color-text-secondary);
}
.mx_LoginWithQR h1 > svg.error {
  color: var(--cpd-color-text-critical-primary);
}
.mx_LoginWithQR h1 > svg.success {
  color: var(--cpd-color-text-action-accent);
}
.mx_LoginWithQR h1 > svg {
  height: 1.3em;
  margin-right: 8px;
  vertical-align: middle;
}
.mx_LoginWithQR .mx_LoginWithQR_confirmationDigits {
  color: var(--cpd-color-text-primary);
  font-size: 1.5rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin: 48px auto;
  text-align: center;
}
.mx_LoginWithQR .mx_LoginWithQR_confirmationAlert {
  border: 1px solid var(--cpd-color-gray-600);
  border-radius: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  line-height: 1.5em;
  padding: 8px;
}
.mx_LoginWithQR .mx_LoginWithQR_confirmationAlert svg {
  height: 30px;
}
.mx_LoginWithQR .mx_LoginWithQR_separator {
  margin: 1em 0;
}
.mx_LoginWithQR ol {
  -webkit-padding-start: 0;
  list-style: none;
  padding-inline-start: 0;
}
.mx_LoginWithQR ol li {
  color: 1px solid var(--cpd-color-text-placeholder);
  line-height: 20px;
  margin-bottom: var(--cpd-space-4x);
  padding-left: var(--cpd-space-7x);
  position: relative;
  text-align: left;
  text-align: initial;
}
.mx_LoginWithQR ol li:before {
  border: 1px solid var(--cpd-color-text-placeholder);
  border-radius: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  content: counter(list-item);
  display: inline-block;
  height: 20px;
  left: 0;
  line-height: 20px;
  position: absolute;
  text-align: center;
  width: 20px;
}
.mx_LoginWithQR label[for="mx_LoginWithQR_checkCode"] {
  color: var(--cpd-color-text-primary);
  margin-bottom: var(--cpd-space-1x);
  margin-top: var(--cpd-space-6x);
}
.mx_LoginWithQR .mx_LoginWithQR_icon {
  background-color: var(--cpd-color-bg-success-subtle);
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  gap: 10px;
  height: 56px;
  padding: var(--cpd-space-3x);
  width: 56px;
}
.mx_LoginWithQR .mx_LoginWithQR_icon svg {
  color: var(--cpd-color-icon-success-primary);
}
.mx_LoginWithQR .mx_LoginWithQR_icon.mx_LoginWithQR_icon--critical {
  background-color: var(--cpd-color-bg-critical-subtle);
}
.mx_LoginWithQR .mx_LoginWithQR_icon.mx_LoginWithQR_icon--critical svg {
  color: var(--cpd-color-icon-critical-primary);
}
.mx_LoginWithQR .mx_LoginWithQR_checkCode_input {
  margin-bottom: var(--cpd-space-1x);
  text-align: left;
  text-align: initial;
}
.mx_LoginWithQR .mx_LoginWithQR_checkCode_input input {
  padding: 0;
  -webkit-padding-start: calc(20px - 0.5ch);
  padding-inline-start: calc(20px - 0.5ch);
}
.mx_LoginWithQR .mx_LoginWithQR_heading {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_LoginWithQR .mx_LoginWithQR_BackButton {
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 28px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 28px;
  padding: 4px;
}
.mx_LoginWithQR .mx_LoginWithQR_BackButton svg {
  height: 100%;
}
.mx_LoginWithQR .mx_LoginWithQR_breadcrumbs {
  color: var(--cpd-color-text-secondary);
  font-size: 0.8125rem;
}
.mx_LoginWithQR .mx_LoginWithQR_main {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-primary);
  text-align: center;
}
.mx_LoginWithQR .mx_LoginWithQR_main p {
  color: var(--cpd-color-text-secondary);
}
.mx_LoginWithQR.mx_LoginWithQR_error .mx_LoginWithQR_main {
  margin: 0 auto;
  max-width: 400px;
}
.mx_LoginWithQR .mx_LoginWithQR_buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 16px;
  margin-top: var(--cpd-space-6x);
}
.mx_LoginWithQR .mx_LoginWithQR_buttons .mx_AccessibleButton {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 48px;
  width: 300px;
}
.mx_LoginWithQR .mx_QRCode {
  border-radius: 8px;
}
.mx_LoginWithQR .mx_LoginWithQR_spinner,
.mx_LoginWithQR .mx_QRCode {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_LoginWithQR .mx_LoginWithQR_spinner {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 100%;
}
progress.mx_PassphraseField_progress {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 0;
  border-radius: "2px";
  height: 4px;
  position: absolute;
  top: -12px;
  width: 100%;
}
progress.mx_PassphraseField_progress::-moz-progress-bar {
  border-radius: "2px";
}
progress.mx_PassphraseField_progress::-webkit-progress-bar,
progress.mx_PassphraseField_progress::-webkit-progress-value {
  border-radius: "2px";
}
progress.mx_PassphraseField_progress {
  color: var(--cpd-color-text-critical-primary);
}
progress.mx_PassphraseField_progress::-moz-progress-bar {
  background-color: var(--cpd-color-text-critical-primary);
}
progress.mx_PassphraseField_progress::-webkit-progress-value {
  background-color: var(--cpd-color-text-critical-primary);
}
progress.mx_PassphraseField_progress[value="2"],
progress.mx_PassphraseField_progress[value="3"] {
  color: var(--cpd-color-text-decorative-5);
}
progress.mx_PassphraseField_progress[value="2"]::-moz-progress-bar,
progress.mx_PassphraseField_progress[value="3"]::-moz-progress-bar {
  background-color: var(--cpd-color-text-decorative-5);
}
progress.mx_PassphraseField_progress[value="2"]::-webkit-progress-value,
progress.mx_PassphraseField_progress[value="3"]::-webkit-progress-value {
  background-color: var(--cpd-color-text-decorative-5);
}
progress.mx_PassphraseField_progress[value="4"] {
  color: var(--cpd-color-text-action-accent);
}
progress.mx_PassphraseField_progress[value="4"]::-moz-progress-bar {
  background-color: var(--cpd-color-text-action-accent);
}
progress.mx_PassphraseField_progress[value="4"]::-webkit-progress-value {
  background-color: var(--cpd-color-text-action-accent);
}
.mx_Welcome {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_Welcome.mx_WelcomePage_registrationDisabled .mx_ButtonCreateAccount {
  display: none;
}
.mx_Welcome .mx_AuthBody_language {
  margin-bottom: 10px;
  width: 160px;
}
button.mx_BaseAvatar {
  font-family: inherit;
  line-height: inherit;
}
.mx_DecoratedRoomAvatar,
.mx_ExtraTile {
  contain: content;
  line-height: 0;
  position: relative;
}
.mx_DecoratedRoomAvatar.mx_DecoratedRoomAvatar_cutout .mx_BaseAvatar,
.mx_ExtraTile.mx_DecoratedRoomAvatar_cutout .mx_BaseAvatar {
  -webkit-mask-image: url(../../img/element-icons/roomlist/decorated-avatar-mask.376375b.svg);
  mask-image: url(../../img/element-icons/roomlist/decorated-avatar-mask.376375b.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.mx_DecoratedRoomAvatar .mx_DecoratedRoomAvatar_icon,
.mx_ExtraTile .mx_DecoratedRoomAvatar_icon {
  border-radius: 50%;
  bottom: 6.25%;
  height: 25%;
  position: absolute;
  right: 6.25%;
  width: 25%;
}
.mx_DecoratedRoomAvatar .mx_DecoratedRoomAvatar_icon:before,
.mx_ExtraTile .mx_DecoratedRoomAvatar_icon:before {
  border-radius: 8px;
  content: "";
  height: 100%;
  position: absolute;
  right: 0;
  width: 100%;
}
.mx_DecoratedRoomAvatar .mx_DecoratedRoomAvatar_icon_globe:before,
.mx_ExtraTile .mx_DecoratedRoomAvatar_icon_globe:before {
  background: var(--cpd-color-text-secondary);
  -webkit-mask-image: url(../../img/globe.0408a7a.svg);
  mask-image: url(../../img/globe.0408a7a.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.mx_DecoratedRoomAvatar .mx_DecoratedRoomAvatar_icon_offline:before,
.mx_ExtraTile .mx_DecoratedRoomAvatar_icon_offline:before {
  background-color: #e3e8f0;
}
.mx_DecoratedRoomAvatar .mx_DecoratedRoomAvatar_icon_online:before,
.mx_ExtraTile .mx_DecoratedRoomAvatar_icon_online:before {
  background-color: var(--cpd-color-text-action-accent);
}
.mx_DecoratedRoomAvatar .mx_DecoratedRoomAvatar_icon_away:before,
.mx_ExtraTile .mx_DecoratedRoomAvatar_icon_away:before {
  background-color: #d9b072;
}
.mx_DecoratedRoomAvatar .mx_DecoratedRoomAvatar_icon_busy:before,
.mx_ExtraTile .mx_DecoratedRoomAvatar_icon_busy:before {
  background-color: var(--cpd-color-text-critical-primary);
}
.mx_DecoratedRoomAvatar .mx_NotificationBadge,
.mx_DecoratedRoomAvatar .mx_RoomTile_badgeContainer,
.mx_ExtraTile .mx_NotificationBadge,
.mx_ExtraTile .mx_RoomTile_badgeContainer {
  height: 18px;
  position: absolute;
  right: 0;
  top: 0;
  width: 18px;
}
.mx_WidgetAvatar {
  border-radius: 4px;
}
.mx_BetaCard {
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: var(--cpd-color-text-secondary);
  padding: 24px;
}
.mx_BetaCard .mx_BetaCard_columns {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: wrap;
  flex-flow: wrap;
  gap: 20px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_BetaCard .mx_BetaCard_columns .mx_BetaCard_columns_description {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_BetaCard
  .mx_BetaCard_columns
  .mx_BetaCard_columns_description
  .mx_BetaCard_title {
  color: var(--cpd-color-text-primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 1.125rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.375rem;
  margin: 4px 0 14px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-column-gap: 12px;
  -moz-column-gap: 12px;
  column-gap: 12px;
}
.mx_BetaCard
  .mx_BetaCard_columns
  .mx_BetaCard_columns_description
  .mx_BetaCard_caption {
  font-size: 0.9375rem;
  line-height: 1.25rem;
}
.mx_BetaCard
  .mx_BetaCard_columns
  .mx_BetaCard_columns_description
  .mx_BetaCard_buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap-reverse;
  flex-wrap: wrap-reverse;
  gap: 12px;
  margin: 20px auto 0;
}
.mx_BetaCard
  .mx_BetaCard_columns
  .mx_BetaCard_columns_description
  .mx_BetaCard_buttons
  .mx_AccessibleButton {
  padding: 7px 40px;
  width: auto;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  white-space: nowrap;
}
.mx_BetaCard
  .mx_BetaCard_columns
  .mx_BetaCard_columns_description
  .mx_BetaCard_buttons
  .mx_AccessibleButton:first-child {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
}
.mx_BetaCard
  .mx_BetaCard_columns
  .mx_BetaCard_columns_description
  .mx_BetaCard_refreshWarning {
  font-size: 0.625rem;
  margin-top: 8px;
  text-align: center;
}
.mx_BetaCard
  .mx_BetaCard_columns
  .mx_BetaCard_columns_description
  .mx_BetaCard_faq {
  font: var(--cpd-font-body-xs-regular);
  margin-top: 20px;
}
.mx_BetaCard
  .mx_BetaCard_columns
  .mx_BetaCard_columns_description
  .mx_BetaCard_faq
  > h4 {
  margin: 12px 0 0;
}
.mx_BetaCard
  .mx_BetaCard_columns
  .mx_BetaCard_columns_description
  .mx_BetaCard_faq
  > p {
  margin: 0;
}
.mx_BetaCard .mx_BetaCard_columns .mx_BetaCard_columns_image_wrapper {
  margin: auto 0;
}
.mx_BetaCard
  .mx_BetaCard_columns
  .mx_BetaCard_columns_image_wrapper
  .mx_BetaCard_columns_image {
  border-radius: 4px;
  height: 100%;
  max-width: 300px;
  -o-object-fit: contain;
  object-fit: contain;
  width: 100%;
}
.mx_BetaCard .mx_BetaCard_relatedSettings .mx_SettingsFlag {
  color: var(--cpd-color-text-primary);
  font-size: 0.9375rem;
  line-height: 1.5rem;
  margin: 16px 0 0;
}
.mx_BetaCard
  .mx_BetaCard_relatedSettings
  .mx_SettingsFlag
  .mx_SettingsFlag_microcopy {
  font: var(--cpd-font-body-sm-regular);
  margin-top: 4px;
}
.mx_BetaCard_betaPill {
  background-color: var(--cpd-color-text-link-external);
  border-radius: 8px;
  color: var(--cpd-color-bg-canvas-default);
  display: inline-block;
  font-size: 0.75rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 15px;
  padding: 4px 10px;
  text-transform: uppercase;
  vertical-align: text-bottom;
  word-break: keep-all;
}
.mx_BetaCard_betaPill.mx_AccessibleButton {
  cursor: pointer;
}
.mx_DeviceContextMenu {
  max-width: 252px;
}
.mx_DeviceContextMenu .mx_DeviceContextMenu_device_icon {
  display: none;
}
.mx_DeviceContextMenu .mx_IconizedContextMenu_label {
  padding-left: 0 !important;
}
.mx_IconizedContextMenu {
  margin: 0;
  min-width: 146px;
  padding: 0;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  background-color: white !important;
}
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList > * {
  padding-left: 20px;
  padding-right: 20px;
}
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_optionList
  .mx_IconizedContextMenu_optionList_label {
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_optionList
  .mx_IconizedContextMenu_optionList_notFirst,
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList:nth-child(n + 2) {
  border-top: var(--cpd-border-width-1) solid var(--cpd-color-gray-400);
}
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_optionList:first-child
  .mx_IconizedContextMenu_item:first-child {
  border-radius: 8px 8px 0 0;
}
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_optionList:last-child
  .mx_IconizedContextMenu_item:last-child {
  border-radius: 0 0 8px 8px;
}
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_optionList:first-child:last-child
  .mx_IconizedContextMenu_item:first-child:last-child {
  border-radius: 8px;
}
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_optionList
  .mx_IconizedContextMenu_item {
  color: var(--cpd-color-text-primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font: var(--cpd-font-body-md-regular);
  padding-bottom: 12px;
  padding-top: 12px;
  text-decoration: none;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_optionList
  .mx_IconizedContextMenu_item:focus-visible,
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_optionList
  .mx_IconizedContextMenu_item:hover {
  background-color: var(--cpd-color-bg-action-secondary-hovered);
}
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_optionList
  .mx_IconizedContextMenu_item.mx_AccessibleButton_disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_optionList
  .mx_IconizedContextMenu_item
  .mx_IconizedContextMenu_icon,
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_optionList
  .mx_IconizedContextMenu_item
  img {
  max-width: 16px;
  min-width: 16px;
  width: 16px;
}
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_optionList
  .mx_IconizedContextMenu_item
  span.mx_IconizedContextMenu_label {
  width: 100%;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_optionList
  .mx_IconizedContextMenu_item
  .mx_IconizedContextMenu_icon
  + .mx_IconizedContextMenu_label {
  padding-left: 14px;
}
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_optionList
  .mx_IconizedContextMenu_item
  .mx_BetaCard_betaPill {
  margin-left: 16px;
}
.mx_IconizedContextMenu .mx_IconizedContextMenu_icon {
  height: 16px;
  position: relative;
  width: 16px;
}
.mx_IconizedContextMenu .mx_IconizedContextMenu_icon:before {
  background-color: var(--cpd-color-icon-primary);
  content: "";
  height: inherit;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  width: inherit;
}
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_optionList_red
  .mx_IconizedContextMenu_item {
  color: var(--cpd-color-text-critical-primary) !important;
}
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_optionList_red
  .mx_IconizedContextMenu_icon:before {
  background-color: var(--cpd-color-icon-critical-primary);
}
.mx_IconizedContextMenu .mx_IconizedContextMenu_option_red {
  color: var(--cpd-color-text-critical-primary) !important;
}
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_option_red
  .mx_IconizedContextMenu_icon:before {
  background-color: var(--cpd-color-text-critical-primary);
}
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_active
  .mx_IconizedContextMenu_item,
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_active.mx_IconizedContextMenu_item {
  color: var(--cpd-color-text-action-accent) !important;
}
.mx_IconizedContextMenu
  .mx_IconizedContextMenu_active
  .mx_IconizedContextMenu_icon:before {
  background-color: var(--cpd-color-text-action-accent);
}
.mx_IconizedContextMenu.mx_IconizedContextMenu_compact
  .mx_IconizedContextMenu_optionList
  > * {
  padding: 8px 16px 8px 12px;
}
.mx_IconizedContextMenu .mx_IconizedContextMenu_checked,
.mx_IconizedContextMenu .mx_IconizedContextMenu_unchecked {
  margin-left: 16px;
  margin-right: -5px;
}
.mx_IconizedContextMenu .mx_IconizedContextMenu_developerTools:before {
  -webkit-mask-image: url(../../img/element-icons/settings/flask.40eebdf.svg);
  mask-image: url(../../img/element-icons/settings/flask.40eebdf.svg);
}
.mx_IconizedContextMenu .mx_IconizedContextMenu_checked:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/checkmark.76b08f2.svg);
  mask-image: url(../../img/element-icons/roomlist/checkmark.76b08f2.svg);
}
.mx_IconizedContextMenu .mx_IconizedContextMenu_unchecked:before {
  content: normal;
}
.mx_IconizedContextMenu .mx_IconizedContextMenu_sublabel {
  color: var(--cpd-color-gray-800);
  margin-left: 20px;
}
.mx_IconizedContextMenu_item.mx_IconizedContextMenu_itemDestructive {
  color: var(--cpd-color-text-critical-primary) !important;
}
.mx_LegacyCallContextMenu_item {
  height: 40px;
  line-height: 40px;
  padding-left: 16px;
  vertical-align: center;
  width: 205px;
}
.mx_MessageContextMenu .mx_IconizedContextMenu_icon {
  display: block;
  height: 16px;
  width: 16px;
}
.mx_MessageContextMenu .mx_IconizedContextMenu_icon:before {
  content: "";
  display: block;
  height: 16px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  width: 16px;
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconCollapse:before {
  -webkit-mask-image: url(../../img/element-icons/message/chevron-up.0f9ac6f.svg);
  mask-image: url(../../img/element-icons/message/chevron-up.0f9ac6f.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconReport:before {
  -webkit-mask-image: url(../../img/element-icons/warning-badge.203170a.svg);
  mask-image: url(../../img/element-icons/warning-badge.203170a.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconLink:before {
  -webkit-mask-image: url(../../img/element-icons/link.e24e5a8.svg);
  mask-image: url(../../img/element-icons/link.e24e5a8.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconPermalink:before {
  -webkit-mask-image: url(../../img/element-icons/room/share.6a6396f.svg);
  mask-image: url(../../img/element-icons/room/share.6a6396f.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconUnhidePreview:before {
  -webkit-mask-image: url(../../img/element-icons/settings/appearance.90cad21.svg);
  mask-image: url(../../img/element-icons/settings/appearance.90cad21.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconOpenInMapSite:before {
  -webkit-mask-image: url(../../img/external-link.8197a77.svg);
  mask-image: url(../../img/external-link.8197a77.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconEndPoll:before {
  -webkit-mask-image: url(../../img/element-icons/check-white.9400525.svg);
  mask-image: url(../../img/element-icons/check-white.9400525.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconForward:before {
  -webkit-mask-image: url(../../img/element-icons/message/fwd.5170eae.svg);
  mask-image: url(../../img/element-icons/message/fwd.5170eae.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconRedact:before {
  -webkit-mask-image: url(../../img/element-icons/trashcan.2f78f2d.svg);
  mask-image: url(../../img/element-icons/trashcan.2f78f2d.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconResend:before {
  -webkit-mask-image: url(../../img/element-icons/retry.8a39798.svg);
  mask-image: url(../../img/element-icons/retry.8a39798.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconSource:before {
  -webkit-mask-image: url(../../img/element-icons/room/format-bar/code.14db777.svg);
  mask-image: url(../../img/element-icons/room/format-bar/code.14db777.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconQuote:before {
  -webkit-mask-image: url(../../img/element-icons/room/format-bar/quote.72d307f.svg);
  mask-image: url(../../img/element-icons/room/format-bar/quote.72d307f.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconPin:before {
  -webkit-mask-image: url(../../img/element-icons/room/pin-upright.340b3b6.svg);
  mask-image: url(../../img/element-icons/room/pin-upright.340b3b6.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconUnpin:before {
  -webkit-mask-image: url(../../img/element-icons/room/pin.c358af7.svg);
  mask-image: url(../../img/element-icons/room/pin.c358af7.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconCopy:before {
  height: 12px;
  left: 2px;
  -webkit-mask-image: url(../../img/element-icons/copy.4ee219c.svg);
  mask-image: url(../../img/element-icons/copy.4ee219c.svg);
  position: relative;
  top: 3px;
  width: 12px;
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconEdit:before {
  -webkit-mask-image: url(../../img/element-icons/room/message-bar/edit.940a38c.svg);
  mask-image: url(../../img/element-icons/room/message-bar/edit.940a38c.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconReply:before {
  -webkit-mask-image: url(../../img/element-icons/room/message-bar/reply.b232084.svg);
  mask-image: url(../../img/element-icons/room/message-bar/reply.b232084.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconReplyInThread:before {
  -webkit-mask-image: url(../../img/element-icons/message/thread.d1987ec.svg);
  mask-image: url(../../img/element-icons/message/thread.d1987ec.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconReact:before {
  -webkit-mask-image: url(../../img/element-icons/room/message-bar/emoji.27bdbc0.svg);
  mask-image: url(../../img/element-icons/room/message-bar/emoji.27bdbc0.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_iconViewInRoom:before {
  -webkit-mask-image: url(../../img/element-icons/view-in-room.afeddb7.svg);
  mask-image: url(../../img/element-icons/view-in-room.afeddb7.svg);
}
.mx_MessageContextMenu .mx_MessageContextMenu_jumpToEvent:before {
  -webkit-mask-image: url(../../img/element-icons/child-relationship.f8cfd49.svg);
  mask-image: url(../../img/element-icons/child-relationship.f8cfd49.svg);
}
.mx_RoomGeneralContextMenu_iconStar:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/favorite.9dcb53a.svg);
  mask-image: url(../../img/element-icons/roomlist/favorite.9dcb53a.svg);
}
.mx_RoomGeneralContextMenu_iconArrowDown:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/low-priority.d46a05a.svg);
  mask-image: url(../../img/element-icons/roomlist/low-priority.d46a05a.svg);
}
.mx_RoomGeneralContextMenu_iconMarkAsRead:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/mark-as-read.273067d.svg);
  mask-image: url(../../img/element-icons/roomlist/mark-as-read.273067d.svg);
}
.mx_RoomGeneralContextMenu_iconMarkAsUnread:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/mark-as-unread.f1a2c4d.svg);
  mask-image: url(../../img/element-icons/roomlist/mark-as-unread.f1a2c4d.svg);
}
.mx_RoomGeneralContextMenu_iconNotificationsDefault:before {
  -webkit-mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
  mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
}
.mx_RoomGeneralContextMenu_iconNotificationsAllMessages:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/notifications-default.63a2b44.svg);
  mask-image: url(../../img/element-icons/roomlist/notifications-default.63a2b44.svg);
}
.mx_RoomGeneralContextMenu_iconNotificationsMentionsKeywords:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/notifications-dm.6739542.svg);
  mask-image: url(../../img/element-icons/roomlist/notifications-dm.6739542.svg);
}
.mx_RoomGeneralContextMenu_iconNotificationsNone:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/notifications-off.0b8adcc.svg);
  mask-image: url(../../img/element-icons/roomlist/notifications-off.0b8adcc.svg);
}
.mx_RoomGeneralContextMenu_iconPeople:before {
  -webkit-mask-image: url(../../img/element-icons/room/members.bcfbe84.svg);
  mask-image: url(../../img/element-icons/room/members.bcfbe84.svg);
}
.mx_RoomGeneralContextMenu_iconFiles:before {
  -webkit-mask-image: url(../../img/element-icons/room/files.ff2ae8d.svg);
  mask-image: url(../../img/element-icons/room/files.ff2ae8d.svg);
}
.mx_RoomGeneralContextMenu_iconPins:before {
  -webkit-mask-image: url(../../img/element-icons/room/pin-upright.340b3b6.svg);
  mask-image: url(../../img/element-icons/room/pin-upright.340b3b6.svg);
}
.mx_RoomGeneralContextMenu_iconWidgets:before {
  -webkit-mask-image: url(../../img/element-icons/room/apps.931b680.svg);
  mask-image: url(../../img/element-icons/room/apps.931b680.svg);
}
.mx_RoomGeneralContextMenu_iconSettings:before {
  -webkit-mask-image: url(../../img/element-icons/settings.6b0c052.svg);
  mask-image: url(../../img/element-icons/settings.6b0c052.svg);
}
.mx_RoomGeneralContextMenu_iconExport:before {
  -webkit-mask-image: url(../../img/element-icons/export.2d0320e.svg);
  mask-image: url(../../img/element-icons/export.2d0320e.svg);
}
.mx_RoomGeneralContextMenu_iconDeveloperTools:before {
  -webkit-mask-image: url(../../img/element-icons/settings/flask.40eebdf.svg);
  mask-image: url(../../img/element-icons/settings/flask.40eebdf.svg);
}
.mx_RoomGeneralContextMenu_iconCopyLink:before {
  -webkit-mask-image: url(../../img/element-icons/link.e24e5a8.svg);
  mask-image: url(../../img/element-icons/link.e24e5a8.svg);
}
.mx_RoomGeneralContextMenu_iconInvite:before {
  -webkit-mask-image: url(../../img/element-icons/room/invite.440bc20.svg);
  mask-image: url(../../img/element-icons/room/invite.440bc20.svg);
}
.mx_RoomGeneralContextMenu_iconSignOut:before {
  -webkit-mask-image: url(../../img/element-icons/leave.9cf503d.svg);
  mask-image: url(../../img/element-icons/leave.9cf503d.svg);
}
.mx_RoomNotificationContextMenu_iconBell:before {
  -webkit-mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
  mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
}
.mx_RoomNotificationContextMenu_iconBellDot:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/notifications-default.63a2b44.svg);
  mask-image: url(../../img/element-icons/roomlist/notifications-default.63a2b44.svg);
}
.mx_RoomNotificationContextMenu_iconBellMentions:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/notifications-dm.6739542.svg);
  mask-image: url(../../img/element-icons/roomlist/notifications-dm.6739542.svg);
}
.mx_RoomNotificationContextMenu_iconBellCrossed:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/notifications-off.0b8adcc.svg);
  mask-image: url(../../img/element-icons/roomlist/notifications-off.0b8adcc.svg);
}
.mx_AddExistingToSpaceDialog_wrapper .mx_Dialog {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_AddExistingToSpace .mx_SearchBox {
  margin: 0 0 15px;
  -webkit-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
}
.mx_AddExistingToSpace .mx_AddExistingToSpace_content {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
.mx_AddExistingToSpace .mx_AddExistingToSpace_noResults {
  display: block;
  margin-top: 24px;
}
.mx_AddExistingToSpace .mx_AddExistingToSpace_section {
  margin-right: 12px;
}
.mx_AddExistingToSpace .mx_AddExistingToSpace_section:not(:first-child) {
  margin-top: 24px;
}
.mx_AddExistingToSpace .mx_AddExistingToSpace_section > h3 {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 0.9375rem;
  margin: 0;
}
.mx_AddExistingToSpace
  .mx_AddExistingToSpace_section
  .mx_AccessibleButton_kind_link {
  font-size: 0.75rem;
  line-height: 0.9375rem;
  margin-top: 8px;
}
.mx_AddExistingToSpace .mx_AddExistingToSpace_footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 20px;
}
.mx_AddExistingToSpace .mx_AddExistingToSpace_footer > span {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  color: var(--cpd-color-text-secondary);
  flex-grow: 1;
  font-size: 0.75rem;
  line-height: 0.9375rem;
}
.mx_AddExistingToSpace .mx_AddExistingToSpace_footer > span .mx_ProgressBar {
  border-radius: 8px;
  height: 8px;
  width: 100%;
}
.mx_AddExistingToSpace
  .mx_AddExistingToSpace_footer
  > span
  .mx_ProgressBar::-moz-progress-bar {
  border-radius: 8px;
}
.mx_AddExistingToSpace
  .mx_AddExistingToSpace_footer
  > span
  .mx_ProgressBar::-webkit-progress-bar,
.mx_AddExistingToSpace
  .mx_AddExistingToSpace_footer
  > span
  .mx_ProgressBar::-webkit-progress-value {
  border-radius: 8px;
}
.mx_AddExistingToSpace
  .mx_AddExistingToSpace_footer
  > span
  .mx_AddExistingToSpaceDialog_progressText {
  color: var(--cpd-color-text-primary);
  font-size: 0.9375rem;
  line-height: 1.5rem;
  margin-top: 8px;
}
.mx_AddExistingToSpace .mx_AddExistingToSpace_footer > span > * {
  vertical-align: middle;
}
.mx_AddExistingToSpace
  .mx_AddExistingToSpace_footer
  .mx_AddExistingToSpace_error {
  padding-left: 12px;
}
.mx_AddExistingToSpace
  .mx_AddExistingToSpace_footer
  .mx_AddExistingToSpace_error
  > img {
  -ms-flex-item-align: center;
  align-self: center;
}
.mx_AddExistingToSpace
  .mx_AddExistingToSpace_footer
  .mx_AddExistingToSpace_error
  .mx_AddExistingToSpace_errorHeading {
  color: var(--cpd-color-text-critical-primary);
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.125rem;
}
.mx_AddExistingToSpace
  .mx_AddExistingToSpace_footer
  .mx_AddExistingToSpace_error
  .mx_AddExistingToSpace_errorCaption {
  color: var(--cpd-color-text-primary);
  font-size: 0.75rem;
  line-height: 0.9375rem;
  margin-top: 4px;
}
.mx_AddExistingToSpace .mx_AddExistingToSpace_footer .mx_AccessibleButton {
  display: inline-block;
  -ms-flex-item-align: center;
  align-self: center;
}
.mx_AddExistingToSpace
  .mx_AddExistingToSpace_footer
  .mx_AccessibleButton_kind_primary {
  padding: 8px 36px;
}
.mx_AddExistingToSpace
  .mx_AddExistingToSpace_footer
  .mx_AddExistingToSpace_retryButton {
  margin-left: 12px;
  padding-left: 24px;
  position: relative;
}
.mx_AddExistingToSpace
  .mx_AddExistingToSpace_footer
  .mx_AddExistingToSpace_retryButton:before {
  background-color: var(--cpd-color-text-primary);
  content: "";
  height: 18px;
  left: 0;
  -webkit-mask-image: url(../../img/element-icons/retry.8a39798.svg);
  mask-image: url(../../img/element-icons/retry.8a39798.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  width: 18px;
}
.mx_AddExistingToSpaceDialog {
  color: var(--cpd-color-text-primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 480px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  height: 80vh;
  min-height: 0;
}
.mx_AddExistingToSpaceDialog .mx_AddExistingToSpace {
  display: contents;
}
.mx_SubspaceSelector {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_SubspaceSelector .mx_BaseAvatar {
  margin: auto 16px auto 5px;
}
.mx_SubspaceSelector > div > h1 {
  font-size: 1.125rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.375rem;
  margin: 0;
}
.mx_SubspaceSelector .mx_Dropdown_input {
  border: none;
}
.mx_SubspaceSelector .mx_Dropdown_input > .mx_Dropdown_option {
  padding-left: 0;
  -webkit-box-flex: initial;
  color: var(--cpd-color-text-secondary);
  -ms-flex: initial;
  flex: initial;
  font-size: 0.9375rem;
  height: auto;
  line-height: 1.5rem;
}
.mx_SubspaceSelector .mx_Dropdown_input > .mx_Dropdown_option .mx_BaseAvatar {
  display: none;
}
.mx_SubspaceSelector
  .mx_Dropdown_input
  .mx_Dropdown_menu
  .mx_SubspaceSelector_dropdownOptionActive {
  color: var(--cpd-color-text-action-accent);
  padding-right: 32px;
  position: relative;
}
.mx_SubspaceSelector
  .mx_Dropdown_input
  .mx_Dropdown_menu
  .mx_SubspaceSelector_dropdownOptionActive:before {
  background-color: var(--cpd-color-text-action-accent);
  content: "";
  height: 20px;
  -webkit-mask-image: url(../../img/element-icons/roomlist/checkmark.76b08f2.svg);
  mask-image: url(../../img/element-icons/roomlist/checkmark.76b08f2.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  right: 0;
  top: 8px;
  width: 20px;
}
.mx_SubspaceSelector .mx_SubspaceSelector_onlySpace {
  color: var(--cpd-color-text-secondary);
  font-size: 0.9375rem;
  line-height: 1.5rem;
}
.mx_AddExistingToSpace_entry {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 12px;
}
.mx_AddExistingToSpace_entry .mx_DecoratedRoomAvatar {
  margin-right: 12px;
}
.mx_AddExistingToSpace_entry .mx_AddExistingToSpace_entry_name {
  font-size: 0.9375rem;
  line-height: 30px;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  margin-right: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_AddExistingToSpace_entry .mx_Checkbox {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_AnalyticsLearnMoreDialog {
  max-width: 500px;
}
.mx_AnalyticsLearnMoreDialog .mx_AnalyticsLearnMore_image_holder {
  background-image: url(../../img/element-shiny.f5a5e6e.svg);
  background-position: top;
  background-repeat: no-repeat;
  height: 112px;
  padding: 20px 0;
}
.mx_AnalyticsLearnMoreDialog .mx_Dialog_content {
  margin-bottom: 0;
}
.mx_AnalyticsLearnMoreDialog .mx_AnalyticsLearnMore_copy {
  border-bottom: 1px solid #e7e7e7;
  margin-bottom: 20px;
  padding-bottom: 20px;
}
.mx_AnalyticsLearnMoreDialog a {
  color: var(--cpd-color-text-action-accent);
  text-decoration: none;
}
.mx_AnalyticsLearnMoreDialog .mx_AnalyticsLearnMore_bullets {
  padding-left: 0;
}
.mx_AnalyticsLearnMoreDialog .mx_AnalyticsLearnMore_bullets li {
  background: url(../../img/tick-circle.605de0c.svg) no-repeat;
  list-style-type: none;
  padding: 2px 0 20px 32px;
  vertical-align: middle;
}
.mx_AppDownloadDialog {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  color: var(--cpd-color-text-primary);
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 32px;
}
.mx_AppDownloadDialog.mx_Dialog_fixedWidth {
  width: 640px;
}
.mx_AppDownloadDialog .mx_AppDownloadDialog_desktop {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 16px;
}
.mx_AppDownloadDialog .mx_AppDownloadDialog_mobile {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: 24px;
}
.mx_AppDownloadDialog .mx_AppDownloadDialog_mobile .mx_AppDownloadDialog_app {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -ms-flex-preferred-size: 50%;
  flex-basis: 50%;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 16px;
}
.mx_AppDownloadDialog
  .mx_AppDownloadDialog_mobile
  .mx_AppDownloadDialog_app
  .mx_QRCode {
  background: #fff;
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 4px;
  padding: 24px;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_AppDownloadDialog
  .mx_AppDownloadDialog_mobile
  .mx_AppDownloadDialog_app
  .mx_QRCode
  .mx_VerificationQRCode {
  height: 144px;
  width: 144px;
  -ms-interpolation-mode: nearest-neighbor;
  border-radius: 0;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: pixelated;
}
.mx_AppDownloadDialog
  .mx_AppDownloadDialog_mobile
  .mx_AppDownloadDialog_app
  .mx_AppDownloadDialog_info {
  color: var(--cpd-color-gray-800);
  font-size: 0.75rem;
}
.mx_AppDownloadDialog
  .mx_AppDownloadDialog_mobile
  .mx_AppDownloadDialog_app
  .mx_AppDownloadDialog_links {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: 8px;
}
.mx_AppDownloadDialog
  .mx_AppDownloadDialog_mobile
  .mx_AppDownloadDialog_app
  .mx_AppDownloadDialog_links
  .mx_AccessibleButton
  svg {
  height: 40px;
}
.mx_AppDownloadDialog .mx_AppDownloadDialog_legal p {
  color: var(--cpd-color-gray-800);
  font-size: 0.75rem;
  margin: 0;
}
.mx_BugReportDialog
  .mx_BugReportDialog_download
  .mx_AccessibleButton_kind_link {
  margin-right: 18px;
}
.mx_BulkRedactDialog .mx_BulkRedactDialog_checkboxMicrocopy,
.mx_BulkRedactDialog .mx_Checkbox {
  line-height: 1.25rem;
}
.mx_BulkRedactDialog .mx_BulkRedactDialog_checkboxMicrocopy {
  color: var(--cpd-color-text-secondary);
  margin-left: 26px;
}
.mx_ChangelogDialog_content {
  max-height: 300px;
  overflow: auto;
}
.mx_ChangelogDialog_li {
  padding: 0.2em;
}
.mx_Dialog_wrapper.mx_CompoundDialog .mx_Dialog {
  color: var(--cpd-color-text-primary);
  padding: 0;
}
.mx_CompoundDialog .mx_Dialog {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_CompoundDialog .mx_CompoundDialog_header {
  padding: 32px 32px 16px;
}
.mx_CompoundDialog .mx_CompoundDialog_header h1 {
  display: inline-block;
  font-size: 1.5rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin: 0;
}
.mx_CompoundDialog .mx_CompoundDialog_cancelButton {
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 14px;
  cursor: pointer;
  height: 28px;
  position: relative;
  width: 28px;
}
.mx_CompoundDialog .mx_CompoundDialog_cancelButton:hover {
  background-color: var(--cpd-color-bg-subtle-primary);
}
.mx_CompoundDialog .mx_CompoundDialog_cancelButton:before {
  background-color: var(--cpd-color-icon-secondary);
  content: "";
  height: 28px;
  -webkit-mask-image: url(../../icons/close.dce71fd.svg);
  mask-image: url(../../icons/close.dce71fd.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  position: absolute;
  width: 28px;
}
.mx_CompoundDialog .mx_CompoundDialog_cancelButton {
  position: absolute;
  right: var(--cpd-space-4x);
  top: var(--cpd-space-4x);
}
.mx_CompoundDialog .mx_CompoundDialog_form {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  min-height: 0;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_CompoundDialog .mx_CompoundDialog_content {
  overflow: auto;
  padding: 8px 32px;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_CompoundDialog .mx_CompoundDialog_footer {
  padding: 20px 32px;
  text-align: right;
}
.mx_CompoundDialog .mx_CompoundDialog_footer .mx_AccessibleButton {
  margin-left: 24px;
}
.mx_ScrollableBaseDialog {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  height: 516px;
  max-height: 80%;
  max-width: 100%;
  min-height: 0;
  width: 544px;
}
.mx_ScrollableBaseDialog .mx_CompoundDialog_footer {
  -webkit-box-shadow: 0 -4px 4px rgba(0, 0, 0, 0.05);
  box-shadow: 0 -4px 4px rgba(0, 0, 0, 0.05);
  z-index: 1;
}
.mx_ConfirmSpaceUserActionDialog_wrapper .mx_Dialog {
  padding: 24px 32px;
}
.mx_ConfirmSpaceUserActionDialog,
.mx_ConfirmSpaceUserActionDialog_wrapper .mx_Dialog {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_ConfirmSpaceUserActionDialog {
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  height: 520px;
  width: 440px;
}
.mx_ConfirmSpaceUserActionDialog .mx_Dialog_content {
  margin: 12px 0;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  overflow-y: auto;
}
.mx_ConfirmSpaceUserActionDialog .mx_ConfirmUserActionDialog_reasonField {
  margin-bottom: 12px;
}
.mx_ConfirmSpaceUserActionDialog .mx_ConfirmSpaceUserActionDialog_warning {
  background-color: var(--cpd-color-bg-subtle-primary);
  border-radius: 8px;
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  line-height: 0.9375rem;
  padding: 12px 8px 12px 42px;
  position: relative;
}
.mx_ConfirmSpaceUserActionDialog
  .mx_ConfirmSpaceUserActionDialog_warning:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 16px;
  left: 10px;
  -webkit-mask-image: url(../../img/element-icons/room/room-summary.50ea68e.svg);
  mask-image: url(../../img/element-icons/room/room-summary.50ea68e.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: calc(50% - 8px);
  width: 16px;
}
.mx_ConfirmUserActionDialog
  .mx_Dialog_content
  .mx_ConfirmUserActionDialog_user {
  margin-bottom: 24px;
  min-height: 48px;
}
.mx_ConfirmUserActionDialog_avatar {
  float: left;
  margin-right: 20px;
}
.mx_ConfirmUserActionDialog_name {
  font-size: 1.125rem;
  padding-top: 2px;
}
.mx_ConfirmUserActionDialog_userId {
  font-size: 0.8125rem;
}
.mx_ConfirmUserActionDialog_reasonField {
  background-color: var(--cpd-color-bg-canvas-default);
  color: var(--cpd-color-text-primary);
  font: var(--cpd-font-body-md-regular);
}
.mx_CreateRoomDialog_details {
  margin-top: 15px;
}
.mx_CreateRoomDialog_details .mx_CreateRoomDialog_details_summary {
  color: var(--cpd-color-text-primary);
  cursor: pointer;
  font-weight: var(--cpd-font-weight-semibold);
  list-style: none;
  text-decoration: underline;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.mx_CreateRoomDialog_details
  .mx_CreateRoomDialog_details_summary::-webkit-details-marker {
  display: none;
}
.mx_CreateRoomDialog_details
  .mx_CreateRoomDialog_details_summary:not(:focus-visible) {
  outline: none;
}
.mx_CreateRoomDialog_details > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  margin: 5px 0;
}
.mx_CreateRoomDialog_details > div input[type="checkbox"] {
  margin-right: 10px;
}
.mx_CreateRoomDialog_label {
  padding-bottom: 12px;
  text-align: left;
}
.mx_CreateRoomDialog_input_container {
  padding-right: 20px;
}
.mx_CreateRoomDialog_input {
  background-color: var(--cpd-color-bg-canvas-default);
  border: 1px solid #e7e7e7;
  border-radius: 3px;
  color: var(--cpd-color-text-primary);
  font-size: 0.9375rem;
  padding: 9px;
  width: 100%;
}
.mx_CreateRoomDialog_aliasContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 24px 0 10px;
}
.mx_CreateRoomDialog_aliasContainer .mx_RoomAliasField {
  margin: 0;
}
.mx_CreateRoomDialog.mx_Dialog_fixedWidth {
  width: 450px;
}
.mx_CreateRoomDialog .mx_Dialog_content {
  margin-bottom: 40px;
}
.mx_CreateRoomDialog .mx_Field_input label,
.mx_CreateRoomDialog p {
  color: #61708b;
}
.mx_CreateRoomDialog .mx_SettingsFlag {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_CreateRoomDialog .mx_SettingsFlag_label {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  font-weight: var(--cpd-font-weight-semibold);
  min-width: 0;
}
.mx_CreateRoomDialog .mx_ToggleSwitch {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  margin-left: 30px;
}
.mx_CreateRoomDialog .mx_Dialog_content > .mx_SettingsFlag {
  margin-top: 24px;
}
.mx_CreateRoomDialog p {
  font-size: 0.75rem;
  margin: 0 85px 0 0;
}
.mx_CreateRoomDialog_labelledCheckbox {
  color: #61708b;
  margin-top: var(--cpd-space-6x);
}
.mx_CreateSubspaceDialog,
.mx_CreateSubspaceDialog_wrapper .mx_Dialog {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_CreateSubspaceDialog {
  color: var(--cpd-color-text-primary);
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  min-height: 0;
  width: 480px;
}
.mx_CreateSubspaceDialog .mx_CreateSubspaceDialog_content {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
.mx_CreateSubspaceDialog
  .mx_CreateSubspaceDialog_content
  .mx_CreateSubspaceDialog_betaNotice {
  background-color: var(--cpd-color-bg-subtle-primary);
  border-radius: 8px;
  padding: 12px 16px;
}
.mx_CreateSubspaceDialog
  .mx_CreateSubspaceDialog_content
  .mx_CreateSubspaceDialog_betaNotice
  .mx_BetaCard_betaPill {
  margin-right: 8px;
  vertical-align: middle;
}
.mx_CreateSubspaceDialog
  .mx_CreateSubspaceDialog_content
  .mx_JoinRuleDropdown
  + p {
  color: #61708b;
  font-size: 0.75rem;
}
.mx_CreateSubspaceDialog .mx_CreateSubspaceDialog_footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 20px;
}
.mx_CreateSubspaceDialog
  .mx_CreateSubspaceDialog_footer
  .mx_CreateSubspaceDialog_footer_prompt {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  color: var(--cpd-color-text-secondary);
  flex-grow: 1;
  font-size: 0.75rem;
  line-height: 0.9375rem;
}
.mx_CreateSubspaceDialog
  .mx_CreateSubspaceDialog_footer
  .mx_CreateSubspaceDialog_footer_prompt
  > * {
  vertical-align: middle;
}
.mx_CreateSubspaceDialog .mx_CreateSubspaceDialog_footer .mx_AccessibleButton {
  display: inline-block;
  -ms-flex-item-align: center;
  align-self: center;
}
.mx_CreateSubspaceDialog
  .mx_CreateSubspaceDialog_footer
  .mx_AccessibleButton_kind_primary {
  margin-left: 16px;
  padding: 8px 36px;
}
.mx_DeactivateAccountDialog .mx_Dialog_content {
  margin-bottom: 30px;
}
.mx_DeactivateAccountDialog
  .mx_DeactivateAccountDialog_input_section
  .mx_Field {
  width: 300px;
}
.mx_DevtoolsDialog_wrapper .mx_Dialog,
.mx_DevtoolsDialog_wrapper .mx_Dialog_fixedWidth {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_DevtoolsDialog_wrapper .mx_Dialog_fixedWidth {
  max-height: 100%;
  min-height: 0;
}
.mx_DevtoolsDialog_wrapper .mx_Dialog_fixedWidth .mx_Dialog_buttons button {
  margin-bottom: 0;
}
.mx_DevTools_content {
  overflow-y: auto;
}
.mx_DevTools_RoomStateExplorer_query {
  margin-bottom: 10px;
}
.mx_DevTools_button {
  font-family: monospace !important;
  margin-bottom: 8px !important;
}
.mx_DevTools_RoomStateExplorer_button_hasSpaces {
  text-decoration: underline;
}
.mx_DevTools_button.mx_DevTools_RoomStateExplorer_button_emptyString {
  font-style: italic;
}
.mx_DevTools_label_left {
  float: left;
}
.mx_DevTools_label_right {
  float: right;
}
.mx_DevTools_label_bottom {
  border-bottom: 1px solid #e5e5e5;
  clear: both;
}
.mx_DevTools_inputRow {
  display: table-row;
}
.mx_DevTools_inputLabelCell {
  display: table-cell;
  font-weight: 700;
  padding-right: 24px;
}
.mx_DevTools_textarea {
  font-size: 0.75rem;
  max-width: 684px;
  min-height: 250px;
  padding: 10px;
}
.mx_DevTools_eventTypeStateKeyGroup {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.mx_DevTools_content .mx_Field_input:first-of-type {
  margin-right: 42px;
}
.mx_DevTools_VerificationRequest {
  border: 1px solid #ccc;
  border-radius: 3px;
  font-family: Inconsolata, , Apple Color Emoji, Segoe UI Emoji, Courier,
    monospace, Noto Color Emoji;
  font-family: "Inconsolata", var(--emoji-font-family), "Apple Color Emoji",
    "Segoe UI Emoji", "Courier", monospace, "Noto Color Emoji";
  margin-bottom: 6px;
  padding: 1px 5px;
}
.mx_DevTools_VerificationRequest dl {
  display: grid;
  grid-template-columns: -webkit-max-content auto;
  grid-template-columns: max-content auto;
  margin: 0;
}
.mx_DevTools_VerificationRequest dd {
  grid-column-start: 2;
}
.mx_DevTools_VerificationRequest dd:empty {
  color: #666;
}
.mx_DevTools_VerificationRequest dd:empty:after {
  content: "(empty)";
}
.mx_DevTools_VerificationRequest dt {
  font-weight: 700;
  grid-column-start: 1;
}
.mx_DevTools_VerificationRequest dt:after {
  content: ":";
}
.mx_DevTools_SettingsExplorer table {
  border-collapse: collapse;
  table-layout: fixed;
  width: 100%;
}
.mx_DevTools_SettingsExplorer table th {
  border-bottom: 1px solid var(--cpd-color-text-action-accent);
  text-align: left;
}
.mx_DevTools_SettingsExplorer table td,
.mx_DevTools_SettingsExplorer table th {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 360px;
}
.mx_DevTools_SettingsExplorer table td + td,
.mx_DevTools_SettingsExplorer table th + th {
  width: auto;
}
.mx_DevTools_SettingsExplorer table tr:hover {
  background-color: var(--cpd-color-text-action-accent);
}
.mx_DevTools_SettingsExplorer .mx_DevTools_SettingsExplorer_mutable {
  background-color: var(--cpd-color-text-action-accent);
}
.mx_DevTools_SettingsExplorer .mx_DevTools_SettingsExplorer_immutable {
  background-color: var(--cpd-color-text-critical-primary);
}
.mx_DevTools_SettingsExplorer .mx_DevTools_SettingsExplorer_edit {
  float: right;
  margin-right: 16px;
}
.mx_DevTools_SettingsExplorer .mx_DevTools_SettingsExplorer_warning {
  border: 2px solid var(--cpd-color-text-critical-primary);
  border-radius: 4px;
  margin-bottom: 8px;
  padding: 4px;
}
.mx_DevTools_SettingsExplorer_setting {
  color: var(--cpd-color-text-link-external) !important;
}
.mx_ExportDialog .mx_ExportDialog_subheading {
  color: var(--cpd-color-text-primary);
  display: block;
  font-family: Inter, , Apple Color Emoji, Segoe UI Emoji, Arial, Helvetica,
    sans-serif, Noto Color Emoji;
  font-family: "Inter", var(--emoji-font-family), "Apple Color Emoji",
    "Segoe UI Emoji", "Arial", "Helvetica", sans-serif, "Noto Color Emoji";
  font-size: 1rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin-bottom: 12px;
  margin-top: 18px;
}
.mx_ExportDialog.mx_ExportDialog_Exporting .mx_ExportDialog_options {
  pointer-events: none;
}
.mx_ExportDialog.mx_ExportDialog_Exporting .mx_Field_select:before {
  display: none;
}
.mx_ExportDialog.mx_ExportDialog_Exporting
  .mx_StyledRadioButton
  input[type="radio"]:checked
  + div
  > div {
  background: var(--cpd-color-gray-900);
}
.mx_ExportDialog.mx_ExportDialog_Exporting
  .mx_StyledRadioButton
  input[type="radio"]:checked
  + div {
  border-color: initial;
}
.mx_ExportDialog.mx_ExportDialog_Exporting .mx_Field_valid.mx_Field label,
.mx_ExportDialog.mx_ExportDialog_Exporting
  .mx_Field_valid.mx_Field:focus-within
  label {
  color: inherit;
}
.mx_ExportDialog.mx_ExportDialog_Exporting .mx_Field_valid.mx_Field,
.mx_ExportDialog.mx_ExportDialog_Exporting
  .mx_Field_valid.mx_Field:focus-within {
  border-color: #e7e7e7;
}
.mx_ExportDialog.mx_ExportDialog_Exporting
  .mx_Checkbox
  input[type="checkbox"]:checked
  + label
  > .mx_Checkbox_background {
  background: var(--cpd-color-gray-900);
  border-color: var(--cpd-color-gray-900);
}
.mx_ExportDialog .mx_ExportDialog_progress .mx_Dialog_buttons {
  margin-left: 18px;
  margin-top: 0;
}
.mx_ExportDialog .mx_ExportDialog_progress .mx_Spinner {
  height: auto;
  width: auto;
  -webkit-box-flex: initial;
  -ms-flex: initial;
  flex: initial;
  margin-right: 10px;
}
.mx_ExportDialog .mx_ExportDialog_progress {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_ExportDialog .mx_StyledRadioButton > .mx_StyledRadioButton_content {
  margin-bottom: 5px;
  margin-top: 5px;
}
.mx_ExportDialog .mx_Field {
  width: 256px;
}
.mx_ExportDialog .mx_Field_postfix {
  padding: 9px 10px;
}
.mx_ExportDialog_attachments-checkbox {
  margin-top: 16px;
}
.mx_FeedbackDialog hr {
  border-color: #e7e7e7;
  margin: 24px 0;
}
.mx_FeedbackDialog .mx_Dialog_content {
  margin-bottom: 24px;
}
.mx_FeedbackDialog .mx_Dialog_content > h2 {
  margin-bottom: 32px;
}
.mx_FeedbackDialog .mx_FeedbackDialog_section {
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 8px;
  padding: 12px 52px 12px 68px;
  position: relative;
}
.mx_FeedbackDialog .mx_FeedbackDialog_section + .mx_FeedbackDialog_section {
  margin-top: 16px;
}
.mx_FeedbackDialog .mx_FeedbackDialog_section > h3 {
  font-size: 1.125rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.375rem;
  margin-bottom: 8px;
  margin-top: 0;
}
.mx_FeedbackDialog .mx_FeedbackDialog_section > p {
  color: var(--cpd-color-text-secondary);
  font-size: 0.9375rem;
  line-height: 1.5rem;
  margin: 8px 0 0;
}
.mx_FeedbackDialog
  .mx_FeedbackDialog_section
  .mx_FeedbackDialog_section_microcopy {
  font-size: 0.75rem;
  line-height: 0.9375rem;
}
.mx_FeedbackDialog .mx_FeedbackDialog_section .mx_AccessibleButton_kind_link,
.mx_FeedbackDialog .mx_FeedbackDialog_section a {
  text-decoration: underline;
}
.mx_FeedbackDialog .mx_FeedbackDialog_section:after,
.mx_FeedbackDialog .mx_FeedbackDialog_section:before {
  content: "";
  height: 40px;
  left: 16px;
  position: absolute;
  top: 12px;
  width: 40px;
}
.mx_FeedbackDialog .mx_FeedbackDialog_section:before {
  background-color: var(--cpd-color-icon-tertiary);
  border-radius: 8px;
}
.mx_FeedbackDialog .mx_FeedbackDialog_section:after {
  background: var(--cpd-color-bg-canvas-default);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 24px;
  mask-size: 24px;
}
.mx_FeedbackDialog .mx_FeedbackDialog_reportBug:after {
  -webkit-mask-image: url(../../img/feather-customised/bug.4551a84.svg);
  mask-image: url(../../img/feather-customised/bug.4551a84.svg);
}
.mx_FeedbackDialog .mx_FeedbackDialog_rateApp .mx_StyledRadioButton {
  border: 2px solid transparent;
  border-radius: 50%;
  cursor: pointer;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  font-size: 20px;
  margin-bottom: 24px;
  margin-top: 12px;
  -webkit-transition: font-size 1s, border 0.5s;
  transition: font-size 1s, border 0.5s;
  vertical-align: top;
}
.mx_FeedbackDialog
  .mx_FeedbackDialog_rateApp
  .mx_StyledRadioButton
  input[type="radio"]
  + div {
  display: none;
}
.mx_FeedbackDialog
  .mx_FeedbackDialog_rateApp
  .mx_StyledRadioButton
  .mx_StyledRadioButton_content {
  background: var(--cpd-color-icon-tertiary);
  border-radius: 20px;
  height: 40px;
  line-height: 40px;
  margin: 5px;
  text-align: center;
  width: 40px;
}
.mx_FeedbackDialog
  .mx_FeedbackDialog_rateApp
  .mx_StyledRadioButton
  .mx_StyledRadioButton_spacer {
  display: none;
}
.mx_FeedbackDialog
  .mx_FeedbackDialog_rateApp
  .mx_StyledRadioButton
  + .mx_StyledRadioButton {
  margin-left: 16px;
}
.mx_FeedbackDialog .mx_FeedbackDialog_rateApp .mx_StyledRadioButton_checked {
  border-color: var(--cpd-color-bg-action-primary-rest);
  font-size: 24px;
}
.mx_FeedbackDialog .mx_FeedbackDialog_rateApp:after {
  -webkit-mask-image: url(../../img/element-icons/feedback.0bc9353.svg);
  mask-image: url(../../img/element-icons/feedback.0bc9353.svg);
}
.mx_ForwardDialog {
  color: var(--cpd-color-text-primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 520px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  height: 80vh;
  min-height: 0;
}
.mx_ForwardDialog > h3 {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 0.9375rem;
  margin: 0 0 6px;
}
.mx_ForwardDialog > .mx_ForwardDialog_preview {
  max-height: 30%;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  overflow-y: auto;
}
.mx_ForwardDialog
  > .mx_ForwardDialog_preview
  .mx_EventTile[data-layout="bubble"] {
  margin-top: 20px;
}
.mx_ForwardDialog > .mx_ForwardDialog_preview div {
  pointer-events: none;
}
.mx_ForwardDialog > .mx_ForwardDialog_preview .mx_EventTile_e2eIcon_unencrypted,
.mx_ForwardDialog > .mx_ForwardDialog_preview .mx_EventTile_e2eIcon_warning,
.mx_ForwardDialog > .mx_ForwardDialog_preview .mx_EventTile_msgOption,
.mx_ForwardDialog > .mx_ForwardDialog_preview .mx_MFileBody_download {
  display: none;
}
.mx_ForwardDialog > hr {
  border: none;
  border-top: 1px solid #e7e7e7;
  margin: 12px 0;
  width: 100%;
}
.mx_ForwardDialog > .mx_ForwardList {
  display: contents;
}
.mx_ForwardDialog > .mx_ForwardList .mx_SearchBox {
  margin: 0 0 15px;
  -webkit-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
}
.mx_ForwardDialog > .mx_ForwardList .mx_ForwardList_content {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
.mx_ForwardDialog > .mx_ForwardList .mx_ForwardList_noResults {
  display: block;
  margin-top: 24px;
}
.mx_ForwardDialog > .mx_ForwardList .mx_ForwardList_results:not(:first-child) {
  margin-top: 24px;
}
.mx_ForwardDialog
  > .mx_ForwardList
  .mx_ForwardList_results
  .mx_ForwardList_resultsList {
  padding-right: 8px;
}
.mx_ForwardDialog
  > .mx_ForwardList
  .mx_ForwardList_results
  .mx_ForwardList_entry {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  border-radius: 8px;
  height: 32px;
  justify-content: space-between;
  padding: 6px;
}
.mx_ForwardDialog
  > .mx_ForwardList
  .mx_ForwardList_results
  .mx_ForwardList_entry.mx_ForwardList_entry_active,
.mx_ForwardDialog
  > .mx_ForwardList
  .mx_ForwardList_results
  .mx_ForwardList_entry:hover {
  background-color: hsla(0, 0%, 91%, 0.77);
}
.mx_ForwardDialog
  > .mx_ForwardList
  .mx_ForwardList_results
  .mx_ForwardList_entry
  .mx_ForwardList_roomButton {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-right: 12px;
  min-width: 0;
}
.mx_ForwardDialog
  > .mx_ForwardList
  .mx_ForwardList_results
  .mx_ForwardList_entry
  .mx_ForwardList_roomButton
  .mx_DecoratedRoomAvatar {
  margin-right: 12px;
}
.mx_ForwardDialog
  > .mx_ForwardList
  .mx_ForwardList_results
  .mx_ForwardList_entry
  .mx_ForwardList_roomButton
  .mx_ForwardList_entry_detail,
.mx_ForwardDialog
  > .mx_ForwardList
  .mx_ForwardList_results
  .mx_ForwardList_entry
  .mx_ForwardList_roomButton
  .mx_ForwardList_entry_name {
  line-height: 30px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_ForwardDialog
  > .mx_ForwardList
  .mx_ForwardList_results
  .mx_ForwardList_entry
  .mx_ForwardList_roomButton
  .mx_ForwardList_entry_name {
  font-size: 0.9375rem;
}
.mx_ForwardDialog
  > .mx_ForwardList
  .mx_ForwardList_results
  .mx_ForwardList_entry
  .mx_ForwardList_roomButton
  .mx_ForwardList_entry_detail {
  color: var(--cpd-color-gray-800);
  font-size: 0.75rem;
  margin-left: 8px;
}
.mx_ForwardDialog
  > .mx_ForwardList
  .mx_ForwardList_results
  .mx_ForwardList_entry
  .mx_ForwardList_sendButton {
  margin-left: 12px;
  position: relative;
}
.mx_ForwardDialog
  > .mx_ForwardList
  .mx_ForwardList_results
  .mx_ForwardList_entry
  .mx_ForwardList_sendButton:not(.mx_ForwardList_canSend)
  .mx_ForwardList_sendLabel {
  visibility: hidden;
}
.mx_ForwardDialog
  > .mx_ForwardList
  .mx_ForwardList_results
  .mx_ForwardList_entry
  .mx_ForwardList_sendButton
  .mx_ForwardList_sendIcon,
.mx_ForwardDialog
  > .mx_ForwardList
  .mx_ForwardList_results
  .mx_ForwardList_entry
  .mx_ForwardList_sendButton
  .mx_NotificationBadge {
  position: absolute;
}
.mx_ForwardDialog
  > .mx_ForwardList
  .mx_ForwardList_results
  .mx_ForwardList_entry
  .mx_ForwardList_sendButton
  .mx_NotificationBadge {
  background-color: var(--cpd-color-bg-canvas-default);
}
.mx_ForwardDialog
  > .mx_ForwardList
  .mx_ForwardList_results
  .mx_ForwardList_entry
  .mx_ForwardList_sendButton.mx_ForwardList_sending
  .mx_ForwardList_sendIcon {
  background-color: var(--cpd-color-text-action-accent);
  height: 14px;
  -webkit-mask-image: url(../../img/element-icons/circle-sending.394023e.svg);
  mask-image: url(../../img/element-icons/circle-sending.394023e.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 14px;
  mask-size: 14px;
  width: 14px;
}
.mx_ForwardDialog
  > .mx_ForwardList
  .mx_ForwardList_results
  .mx_ForwardList_entry
  .mx_ForwardList_sendButton.mx_ForwardList_sent
  .mx_ForwardList_sendIcon {
  background-color: var(--cpd-color-text-action-accent);
  height: 14px;
  -webkit-mask-image: url(../../img/element-icons/circle-sent.4ba3d6b.svg);
  mask-image: url(../../img/element-icons/circle-sent.4ba3d6b.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 14px;
  mask-size: 14px;
  width: 14px;
}
.mx_GenericFeatureFeedbackDialog .mx_GenericFeatureFeedbackDialog_subheading {
  color: var(--cpd-color-text-primary);
  font: var(--cpd-font-body-md-regular);
  line-height: 1.25rem;
  margin-bottom: 24px;
}
.mx_IncomingSasDialog_opponentProfile_image {
  position: relative;
}
.mx_IncomingSasDialog_opponentProfile h2 {
  display: inline-block;
  margin-left: 10px;
}
.mx_InviteDialog_flexWrapper .mx_Dialog {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_InviteDialog_transferWrapper .mx_Dialog {
  padding-bottom: 16px;
}
.mx_InviteDialog_addressBar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  margin: 8px 45px 0 0;
}
.mx_InviteDialog_addressBar .mx_InviteDialog_editor {
  -webkit-box-flex: 1;
  background-color: var(--cpd-color-bg-subtle-primary);
  border-radius: 4px;
  -ms-flex: 1;
  flex: 1;
  min-height: 25px;
  width: 100%;
  -webkit-padding-start: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  overflow-x: hidden;
  overflow-y: auto;
  padding-inline-start: 8px;
}
.mx_InviteDialog_addressBar .mx_InviteDialog_editor .mx_InviteDialog_userTile {
  display: inline-block;
  margin: 6px 6px 0 0;
  min-width: -webkit-max-content;
  min-width: -moz-max-content;
  min-width: max-content;
}
.mx_InviteDialog_addressBar .mx_InviteDialog_editor > input[type="text"] {
  font: var(--cpd-font-body-md-regular);
  height: 24px;
  line-height: 1.5rem;
  margin: 6px 0 !important;
  -webkit-padding-start: 12px;
  border: 0 !important;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  min-width: 40%;
  outline: 0 !important;
  padding-inline-start: 12px;
  resize: none;
  -webkit-box-flex: 1 !important;
  color: var(--cpd-color-text-primary) !important;
  -ms-flex: 1 !important;
  flex: 1 !important;
}
.mx_InviteDialog_addressBar .mx_InviteDialog_goButton {
  min-width: 48px;
  -webkit-margin-start: 10px;
  height: 25px;
  line-height: 1.5625rem;
  margin-inline-start: 10px;
}
.mx_InviteDialog_addressBar .mx_InviteDialog_buttonAndSpinner .mx_Spinner {
  height: 20px;
  width: 20px;
  -webkit-margin-start: 5px;
  display: inline-block;
  margin-inline-start: 5px;
  vertical-align: middle;
}
.mx_InviteDialog_section {
  padding-bottom: 4px;
}
.mx_InviteDialog_section h3 {
  color: #61708b;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}
.mx_InviteDialog_section > p {
  margin: 0;
}
.mx_InviteDialog_section > span {
  color: var(--cpd-color-text-primary);
}
.mx_InviteDialog_section .mx_InviteDialog_section_showMore {
  display: block;
  margin: 7px 18px;
}
.mx_InviteDialog_section_hidden_suggestions_disclaimer {
  font: var(--cpd-font-body-md-regular);
  padding: 8px 0 16px;
}
.mx_InviteDialog_section_hidden_suggestions_disclaimer > span {
  color: var(--cpd-color-text-primary);
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_InviteDialog_section_hidden_suggestions_disclaimer > p {
  margin: 0;
}
.mx_InviteDialog_footer {
  border-top: 1px solid #e7e7e7;
}
.mx_InviteDialog_footer > h3 {
  color: #61708b;
  font-size: 0.75rem;
  font-weight: 700;
  margin: 12px 0;
  text-transform: uppercase;
}
.mx_InviteDialog_footer .mx_CopyableText.mx_CopyableText_border {
  margin-bottom: 0;
  width: auto;
}
.mx_InviteDialog_footer .mx_CopyableText.mx_CopyableText_border > a {
  text-decoration: none;
  -ms-flex-negative: 1;
  flex-shrink: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mx_InviteDialog_userTile {
  -webkit-margin-end: 8px;
  margin-inline-end: 8px;
}
.mx_InviteDialog_userTile .mx_InviteDialog_userTile_pill {
  background-color: var(--cpd-color-bg-success-subtle);
  border-radius: 12px;
  color: var(--cpd-color-text-primary);
  display: inline-block;
  height: 24px;
  line-height: 1.5rem;
  padding-inline: 8px;
  vertical-align: middle;
}
.mx_InviteDialog_userTile
  .mx_InviteDialog_userTile_pill
  .mx_SearchResultAvatar {
  border-radius: 20px;
  left: -5px;
  position: relative;
  top: 2px;
}
.mx_InviteDialog_userTile
  .mx_InviteDialog_userTile_pill
  .mx_InviteDialog_userTile_name,
.mx_InviteDialog_userTile
  .mx_InviteDialog_userTile_pill
  img.mx_SearchResultAvatar {
  vertical-align: top;
}
.mx_InviteDialog_userTile
  .mx_InviteDialog_userTile_pill
  .mx_SearchResultAvatar_threepidAvatar {
  background-color: #fff;
}
.mx_InviteDialog_userTile .mx_InviteDialog_userTile_remove {
  display: inline-block;
  -webkit-margin-start: 4px;
  margin-inline-start: 4px;
  vertical-align: middle;
}
.mx_InviteDialog_other {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  height: 600px;
  overflow: hidden;
}
.mx_InviteDialog_other h2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: pre-wrap;
}
.mx_InviteDialog_other .mx_InviteDialog_addressBar {
  -webkit-margin-end: 0;
  margin-inline-end: 0;
}
.mx_InviteDialog_other .mx_InviteDialog_userSections {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -webkit-padding-end: 0;
  padding-inline-end: 0;
}
.mx_InviteDialog_other .mx_InviteDialog_userSections .mx_InviteDialog_section {
  margin-top: 12px;
  padding-bottom: 0;
}
.mx_InviteDialog_content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  overflow: hidden;
}
.mx_InviteDialog_transfer {
  width: auto;
}
.mx_InviteDialog_transfer .mx_InviteDialog_content {
  height: 430px;
  overflow: visible;
  width: 496px;
}
.mx_InviteDialog_transfer .mx_InviteDialog_content .mx_TabbedView {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-negative: 1;
  flex-shrink: 1;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  min-height: 0;
}
.mx_InviteDialog_transfer .mx_InviteDialog_content .mx_TabbedView,
.mx_InviteDialog_transfer
  .mx_InviteDialog_content
  .mx_TabbedView
  .mx_TabbedView_tabPanel {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_InviteDialog_transfer
  .mx_InviteDialog_content
  .mx_TabbedView
  .mx_TabbedView_tabPanel
  .mx_TabbedView_tabPanelContent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_InviteDialog_transfer .mx_InviteDialog_addressBar {
  margin-top: 8px;
}
.mx_InviteDialog_transfer input[type="checkbox"] {
  -webkit-margin-end: 8px;
  margin-inline-end: 8px;
}
.mx_InviteDialog_userSections {
  margin-top: 4px;
  overflow-y: auto;
  padding: 0 45px 4px 0;
}
.mx_InviteDialog_helpText {
  margin: 0;
}
.mx_InviteDialog_dialPad {
  margin-top: 16px;
  margin-inline: auto;
  width: 224px;
}
.mx_InviteDialog_dialPad .mx_InviteDialog_dialPadField {
  border-inline: 0;
  border-radius: 0;
  border-top: 0;
  border-color: var(--cpd-color-gray-600);
  margin-top: 0;
}
.mx_InviteDialog_dialPad .mx_InviteDialog_dialPadField:focus-within {
  border-color: var(--cpd-color-text-action-accent);
}
.mx_InviteDialog_dialPad .mx_InviteDialog_dialPadField input {
  font-size: 18px;
  font-weight: var(--cpd-font-weight-semibold);
  padding-top: 0;
}
.mx_InviteDialog_dialPad .mx_InviteDialog_dialPadField .mx_Field_postfix {
  border-left: none;
}
.mx_InviteDialog_dialPad .mx_DialPad {
  -webkit-column-gap: 48px;
  -moz-column-gap: 48px;
  column-gap: 48px;
  margin-inline: auto;
  row-gap: 16px;
}
.mx_InviteDialog_transferConsultConnect {
  border-top: 1px solid var(--cpd-color-gray-400);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-inline: -24px;
  padding-top: 16px;
  padding-inline: 24px;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_InviteDialog_transferConsultConnect_pushRight {
  -webkit-margin-start: auto;
  margin-inline-start: auto;
}
.mx_InviteDialog_userDirectoryIcon:before {
  -webkit-mask-image: url(../../img/voip/tab-userdirectory.6dac23d.svg);
  mask-image: url(../../img/voip/tab-userdirectory.6dac23d.svg);
}
.mx_InviteDialog_dialPadIcon:before {
  -webkit-mask-image: url(../../img/voip/tab-dialpad.5fb10f3.svg);
  mask-image: url(../../img/voip/tab-dialpad.5fb10f3.svg);
}
.mx_InviteDialog_tile {
  cursor: pointer;
  display: grid;
  grid-gap: 8px 12px;
  gap: 8px 12px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_InviteDialog_tile.mx_InviteDialog_tile--room {
  grid-template-columns: -webkit-min-content auto auto;
  grid-template-columns: min-content auto auto;
  padding: 4px 8px;
}
.mx_InviteDialog_tile.mx_InviteDialog_tile--room:hover {
  background-color: var(--cpd-color-bg-subtle-primary);
  border-radius: 4px;
}
.mx_InviteDialog_tile.mx_InviteDialog_tile--room
  .mx_InviteDialog_tile--room_selected {
  background-color: var(--cpd-color-bg-success-subtle);
  border-radius: 36px;
}
.mx_InviteDialog_tile.mx_InviteDialog_tile--room
  .mx_InviteDialog_tile--room_selected:before {
  background-color: var(--cpd-color-text-primary);
  content: "";
  grid-column: 1;
  grid-row: 1;
  height: 24px;
  left: 6px;
  -webkit-mask-image: url(../../img/feather-customised/check.bfca953.svg);
  mask-image: url(../../img/feather-customised/check.bfca953.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100%;
  mask-size: 100%;
  position: absolute;
  top: 6px;
  width: 24px;
}
.mx_InviteDialog_tile.mx_InviteDialog_tile--room
  .mx_InviteDialog_tile--room_time {
  -webkit-margin-start: auto;
  color: #61708b;
  font-size: 0.75rem;
  margin-inline-start: auto;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
.mx_InviteDialog_tile.mx_InviteDialog_tile--room
  .mx_InviteDialog_tile--room_highlight {
  font-weight: 900;
}
.mx_InviteDialog_tile.mx_InviteDialog_tile--inviterError {
  grid-template-columns: -webkit-max-content auto;
  grid-template-columns: max-content auto;
  margin-bottom: 24px;
}
.mx_InviteDialog_tile.mx_InviteDialog_tile--inviterError:last-child {
  margin-bottom: 0;
}
.mx_InviteDialog_tile.mx_InviteDialog_tile--inviterError
  .mx_InviteDialog_tile--inviterError_errorText {
  color: var(--cpd-color-text-critical-primary);
  font-size: 0.9375rem;
  grid-column-start: 2;
  grid-row-start: 2;
}
.mx_InviteDialog_tile * {
  vertical-align: middle;
}
.mx_InviteDialog_tile .mx_InviteDialog_tile--room_selected,
.mx_InviteDialog_tile .mx_InviteDialog_tile_avatarStack {
  display: inline-block;
  height: 36px;
  position: relative;
  width: 36px;
}
.mx_InviteDialog_tile .mx_InviteDialog_tile_avatarStack {
  grid-column-start: 1;
  grid-row-start: 1;
}
.mx_InviteDialog_tile .mx_InviteDialog_tile_avatarStack > * {
  left: 0;
  position: absolute;
  top: 0;
}
.mx_InviteDialog_tile .mx_InviteDialog_tile_nameStack {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  grid-column-start: 2;
  grid-row-start: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  align-self: center;
  -ms-flex-flow: column;
  flex-flow: column;
  -webkit-box-align: baseline;
  -ms-flex-align: baseline;
  align-items: baseline;
  gap: 2px 0;
  overflow: hidden;
}
.mx_InviteDialog_tile
  .mx_InviteDialog_tile_nameStack
  .mx_InviteDialog_tile_nameStack_name,
.mx_InviteDialog_tile
  .mx_InviteDialog_tile_nameStack
  .mx_InviteDialog_tile_nameStack_userId {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_InviteDialog_tile
  .mx_InviteDialog_tile_nameStack
  .mx_InviteDialog_tile_nameStack_name {
  color: var(--cpd-color-text-primary);
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_InviteDialog_tile
  .mx_InviteDialog_tile_nameStack
  .mx_InviteDialog_tile_nameStack_userId {
  color: #61708b;
  font-size: 0.75rem;
}
.mx_InviteDialog_multiInviterError > h4 {
  color: var(--cpd-color-text-secondary);
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.5rem;
}
.mx_InviteDialog_identityServer {
  margin-top: 1em;
}
.mx_InviteDialog_oneThreepid {
  font-size: 0.75rem;
  margin: 8px 0;
}
.mx_JoinRuleDropdown {
  color: var(--cpd-color-text-primary);
  font: var(--cpd-font-body-md-regular);
  margin-bottom: 8px;
}
.mx_JoinRuleDropdown .mx_Dropdown_option {
  font: var(--cpd-font-body-md-regular);
  height: 32px;
  line-height: 2rem;
  min-height: 32px;
}
.mx_JoinRuleDropdown .mx_Dropdown_option > div {
  padding-left: 30px;
  position: relative;
}
.mx_JoinRuleDropdown .mx_Dropdown_option > div:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 16px;
  left: 6px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  position: absolute;
  top: 8px;
  width: 16px;
}
.mx_JoinRuleDropdown
  .mx_Dropdown_option
  > div.mx_JoinRuleDropdown_knock:before {
  content: normal;
}
.mx_JoinRuleDropdown .mx_JoinRuleDropdown_invite:before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-mask-image: url(../../img/element-icons/lock.998ae1f.svg);
  mask-image: url(../../img/element-icons/lock.998ae1f.svg);
  -webkit-mask-size: contain;
  mask-size: contain;
  padding: 1px;
}
.mx_JoinRuleDropdown .mx_JoinRuleDropdown_public:before {
  -webkit-mask-image: url(../../img/globe.0408a7a.svg);
  mask-image: url(../../img/globe.0408a7a.svg);
  -webkit-mask-size: 12px;
  mask-size: 12px;
}
.mx_JoinRuleDropdown .mx_JoinRuleDropdown_restricted:before {
  -webkit-mask-image: url(../../img/element-icons/group-members.d86d751.svg);
  mask-image: url(../../img/element-icons/group-members.d86d751.svg);
  -webkit-mask-size: contain;
  mask-size: contain;
}
.mx_JoinRuleDropdown .mx_JoinRuleDropdown_icon {
  color: var(--cpd-color-text-secondary);
  left: 6px;
  position: absolute;
  top: 8px;
}
.mx_LeaveSpaceDialog_wrapper .mx_Dialog {
  padding: 24px 32px;
}
.mx_LeaveSpaceDialog_wrapper .mx_Dialog,
.mx_LeaveSpaceDialog_wrapper .mx_Dialog .mx_LeaveSpaceDialog {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_LeaveSpaceDialog_wrapper .mx_Dialog .mx_LeaveSpaceDialog {
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  height: 520px;
  width: 440px;
}
.mx_LeaveSpaceDialog_wrapper
  .mx_Dialog
  .mx_LeaveSpaceDialog
  .mx_Dialog_content {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  margin: 0;
  overflow-y: auto;
}
.mx_LeaveSpaceDialog_wrapper
  .mx_Dialog
  .mx_LeaveSpaceDialog
  .mx_Dialog_content
  .mx_LeaveSpaceDialog_section_warning {
  background-color: var(--cpd-color-bg-subtle-primary);
  border-radius: 8px;
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  line-height: 0.9375rem;
  margin: 12px 0 0;
  padding: 12px 8px 12px 42px;
  position: relative;
}
.mx_LeaveSpaceDialog_wrapper
  .mx_Dialog
  .mx_LeaveSpaceDialog
  .mx_Dialog_content
  .mx_LeaveSpaceDialog_section_warning:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 16px;
  left: 10px;
  -webkit-mask-image: url(../../img/element-icons/room/room-summary.50ea68e.svg);
  mask-image: url(../../img/element-icons/room/room-summary.50ea68e.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: calc(50% - 8px);
  width: 16px;
}
.mx_LeaveSpaceDialog_wrapper
  .mx_Dialog
  .mx_LeaveSpaceDialog
  .mx_Dialog_content
  > p {
  color: var(--cpd-color-text-primary);
}
.mx_LocationViewDialog_wrapper .mx_Dialog {
  padding: 0;
}
.mx_LocationViewDialog {
  height: calc(80vh - 0.5px);
  overflow: hidden;
  width: calc(80vw - 0.5px);
}
.mx_LocationViewDialog .mx_Dialog_header {
  margin: 0;
  padding: 0;
  position: static;
}
.mx_LocationViewDialog .mx_Dialog_header .mx_Dialog_title {
  display: none;
}
.mx_LocationViewDialog .mx_Dialog_cancelButton {
  left: var(--cpd-space-4x);
  position: absolute;
  top: var(--cpd-space-4x);
  z-index: 4010;
}
.mx_LocationViewDialog_map {
  border-radius: 8px;
  height: 80vh;
  width: 80vw;
}
.mx_LogoutDialog_ExportKeyAdvanced {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.mx_ManageRestrictedJoinRuleDialog,
.mx_ManageRestrictedJoinRuleDialog_wrapper .mx_Dialog {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_ManageRestrictedJoinRuleDialog {
  color: var(--cpd-color-text-primary);
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  height: 60vh;
  min-height: 0;
  width: 480px;
}
.mx_ManageRestrictedJoinRuleDialog .mx_SearchBox {
  margin: 0 0 15px;
  -webkit-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
}
.mx_ManageRestrictedJoinRuleDialog .mx_ManageRestrictedJoinRuleDialog_content {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
.mx_ManageRestrictedJoinRuleDialog
  .mx_ManageRestrictedJoinRuleDialog_noResults {
  display: block;
  margin-top: 24px;
}
.mx_ManageRestrictedJoinRuleDialog
  .mx_ManageRestrictedJoinRuleDialog_section:not(:first-child) {
  margin-top: 24px;
}
.mx_ManageRestrictedJoinRuleDialog
  .mx_ManageRestrictedJoinRuleDialog_section
  > h3 {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 0.9375rem;
  margin: 0;
}
.mx_ManageRestrictedJoinRuleDialog
  .mx_ManageRestrictedJoinRuleDialog_section
  .mx_ManageRestrictedJoinRuleDialog_entry {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 12px;
}
.mx_ManageRestrictedJoinRuleDialog
  .mx_ManageRestrictedJoinRuleDialog_section
  .mx_ManageRestrictedJoinRuleDialog_entry
  > div {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
.mx_ManageRestrictedJoinRuleDialog
  .mx_ManageRestrictedJoinRuleDialog_section
  .mx_ManageRestrictedJoinRuleDialog_entry
  .mx_ManageRestrictedJoinRuleDialog_entry_name {
  font-size: 0.9375rem;
  line-height: 30px;
  margin: 0 8px;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_ManageRestrictedJoinRuleDialog
  .mx_ManageRestrictedJoinRuleDialog_section
  .mx_ManageRestrictedJoinRuleDialog_entry
  .mx_ManageRestrictedJoinRuleDialog_entry_description {
  color: var(--cpd-color-gray-800);
  font-size: 0.75rem;
  line-height: 0.9375rem;
  margin-top: 8px;
}
.mx_ManageRestrictedJoinRuleDialog
  .mx_ManageRestrictedJoinRuleDialog_section
  .mx_ManageRestrictedJoinRuleDialog_entry
  .mx_Checkbox {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_ManageRestrictedJoinRuleDialog
  .mx_ManageRestrictedJoinRuleDialog_section_spaces
  .mx_BaseAvatar {
  margin-right: 12px;
}
.mx_ManageRestrictedJoinRuleDialog
  .mx_ManageRestrictedJoinRuleDialog_section_info {
  background-color: var(--cpd-color-bg-subtle-primary);
  border-radius: 8px;
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  line-height: 0.9375rem;
  margin: 12px 0;
  padding: 8px 8px 8px 42px;
  position: relative;
}
.mx_ManageRestrictedJoinRuleDialog
  .mx_ManageRestrictedJoinRuleDialog_section_info:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 16px;
  left: 10px;
  -webkit-mask-image: url(../../img/element-icons/room/room-summary.50ea68e.svg);
  mask-image: url(../../img/element-icons/room/room-summary.50ea68e.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: calc(50% - 8px);
  width: 16px;
}
.mx_ManageRestrictedJoinRuleDialog .mx_ManageRestrictedJoinRuleDialog_footer {
  margin-top: 20px;
}
.mx_ManageRestrictedJoinRuleDialog
  .mx_ManageRestrictedJoinRuleDialog_footer
  .mx_ManageRestrictedJoinRuleDialog_footer_buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-left: auto;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
.mx_ManageRestrictedJoinRuleDialog
  .mx_ManageRestrictedJoinRuleDialog_footer
  .mx_ManageRestrictedJoinRuleDialog_footer_buttons
  .mx_AccessibleButton {
  display: inline-block;
}
.mx_ManageRestrictedJoinRuleDialog
  .mx_ManageRestrictedJoinRuleDialog_footer
  .mx_ManageRestrictedJoinRuleDialog_footer_buttons
  .mx_AccessibleButton
  + .mx_AccessibleButton {
  margin-left: 24px;
}
.mx_MessageEditHistoryDialog {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  max-height: 60vh;
}
.mx_MessageEditHistoryDialog_scrollPanel {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
}
.mx_MessageEditHistoryDialog_error {
  color: var(--cpd-color-text-critical-primary);
  text-align: center;
}
.mx_MessageEditHistoryDialog_edits {
  color: var(--cpd-color-text-primary);
  font: var(--cpd-font-body-md-regular);
  list-style-type: none;
  padding: 0;
}
.mx_MessageEditHistoryDialog_edits span.mx_EditHistoryMessage_deletion,
.mx_MessageEditHistoryDialog_edits span.mx_EditHistoryMessage_insertion {
  padding: 0 2px;
}
.mx_MessageEditHistoryDialog_edits .mx_EditHistoryMessage_deletion {
  background-color: rgba(255, 76, 85, 0.1);
  color: #ff4c55;
  text-decoration: line-through;
}
.mx_MessageEditHistoryDialog_edits .mx_EditHistoryMessage_insertion {
  background-color: rgba(26, 169, 123, 0.1);
  color: #1aa97b;
  text-decoration: underline;
}
.mx_MessageEditHistoryDialog_edits .mx_EventTile {
  padding-top: 0;
}
.mx_MessageEditHistoryDialog_edits .mx_EventTile .mx_MessageTimestamp {
  left: 0;
  position: absolute;
  text-align: center;
}
.mx_MessageEditHistoryDialog_edits .mx_EventTile .mx_EventTile_line {
  line-height: var(--EventTile_group_line-line-height);
  padding-bottom: var(--EventTile_group_line-spacing-block-end);
  padding-left: var(--EventTile_group_line-spacing-inline-start);
  padding-top: var(--EventTile_group_line-spacing-block-start);
}
.mx_MessageEditHistoryDialog_edits
  .mx_EventTile
  .mx_EventTile_line
  .mx_EventTile_content {
  margin-right: 0;
}
.mx_MessageEditHistoryDialog_edits .mx_EventTile:before {
  border-radius: 4px;
  bottom: -1px;
  content: "";
  left: -10px;
  position: absolute;
  right: -10px;
  top: -1px;
  z-index: -1;
}
.mx_MessageEditHistoryDialog_edits .mx_EventTile:hover:before {
  background: var(--cpd-color-bg-subtle-secondary);
}
.mx_MessageEditHistoryDialog_edits .mx_MessageActionBar .mx_AccessibleButton {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-padding-start: 8px;
  padding-inline-start: 8px;
  -webkit-padding-end: 8px;
  font-size: 0.9375rem;
  padding-inline-end: 8px;
}
.mx_ModalWidgetDialog .mx_ModalWidgetDialog_warning {
  margin-bottom: 24px;
}
.mx_ModalWidgetDialog .mx_ModalWidgetDialog_warning > img {
  margin-right: 8px;
  vertical-align: middle;
}
.mx_ModalWidgetDialog .mx_ModalWidgetDialog_buttons {
  float: right;
  margin-top: 24px;
}
.mx_ModalWidgetDialog
  .mx_ModalWidgetDialog_buttons
  .mx_AccessibleButton
  + .mx_AccessibleButton {
  margin-left: 8px;
}
.mx_ModalWidgetDialog iframe {
  border: 0;
  border-radius: 8px;
  height: 450px;
  width: 100%;
}
.mx_PollCreateDialog .mx_PollCreateDialog_busy {
  background-color: var(--cpd-color-alpha-gray-1300);
  inset: 0;
  position: absolute;
  z-index: 1;
}
.mx_PollCreateDialog h2 {
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.5rem;
  margin-bottom: 8px;
  margin-top: 0;
}
.mx_PollCreateDialog h2:nth-child(n + 2) {
  margin-top: 20px;
}
.mx_PollCreateDialog p {
  color: var(--cpd-color-text-secondary);
}
.mx_PollCreateDialog .mx_PollCreateDialog_option {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 16px;
  margin-top: 11px;
}
.mx_PollCreateDialog .mx_PollCreateDialog_option .mx_Field {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  margin: 0;
}
.mx_PollCreateDialog
  .mx_PollCreateDialog_option
  .mx_PollCreateDialog_removeOption {
  background-color: var(--cpd-color-gray-400);
  border-radius: 50%;
  cursor: pointer;
  height: 20px;
  margin-left: 12px;
  position: relative;
  width: 20px;
}
.mx_PollCreateDialog
  .mx_PollCreateDialog_option
  .mx_PollCreateDialog_removeOption:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 8px;
  left: 6px;
  -webkit-mask: url(../../img/element-icons/x-8px.1715293.svg);
  mask: url(../../img/element-icons/x-8px.1715293.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: cover;
  mask-size: cover;
  position: absolute;
  top: 6px;
  width: 8px;
}
.mx_PollCreateDialog .mx_PollCreateDialog_addOption {
  margin-bottom: 40px;
  padding: 0;
}
.mx_PollCreateDialog .mx_AccessibleButton_disabled {
  opacity: 0.4;
}
.mx_RegistrationEmailPromptDialog {
  width: 417px;
}
.mx_RegistrationEmailPromptDialog .mx_Dialog_content {
  color: var(--cpd-color-gray-800);
  margin-bottom: 24px;
}
.mx_RegistrationEmailPromptDialog .mx_Dialog_primary {
  width: 100%;
}
.mx_RoomSettingsDialog_settingsIcon:before {
  -webkit-mask-image: url(../../img/element-icons/settings.6b0c052.svg);
  mask-image: url(../../img/element-icons/settings.6b0c052.svg);
}
.mx_RoomSettingsDialog_voiceIcon:before {
  -webkit-mask-image: url(../../img/element-icons/call/voice-call.85002aa.svg);
  mask-image: url(../../img/element-icons/call/voice-call.85002aa.svg);
}
.mx_RoomSettingsDialog_securityIcon:before {
  -webkit-mask-image: url(../../img/element-icons/security.fa860ea.svg);
  mask-image: url(../../img/element-icons/security.fa860ea.svg);
}
.mx_RoomSettingsDialog_rolesIcon:before {
  -webkit-mask-image: url(../../img/element-icons/room/settings/roles.ace4f24.svg);
  mask-image: url(../../img/element-icons/room/settings/roles.ace4f24.svg);
}
.mx_RoomSettingsDialog_notificationsIcon:before {
  -webkit-mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
  mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
}
.mx_RoomSettingsDialog_bridgesIcon:before {
  -webkit-mask-image: url(../../img/feather-customised/bridge.8ca4493.svg);
  mask-image: url(../../img/feather-customised/bridge.8ca4493.svg);
}
.mx_RoomSettingsDialog_pollsIcon:before {
  -webkit-mask-image: url(../../img/element-icons/room/composer/poll.a8ee2f3.svg);
  mask-image: url(../../img/element-icons/room/composer/poll.a8ee2f3.svg);
}
.mx_RoomSettingsDialog_warningIcon:before {
  -webkit-mask-image: url(../../img/element-icons/room/settings/advanced.5744e03.svg);
  mask-image: url(../../img/element-icons/room/settings/advanced.5744e03.svg);
}
.mx_RoomSettingsDialog_peopleIcon:before {
  -webkit-mask-image: url(../../img/element-icons/group-members.d86d751.svg);
  mask-image: url(../../img/element-icons/group-members.d86d751.svg);
}
.mx_RoomSettingsDialog .mx_Dialog_title {
  margin: 0 auto;
  overflow: hidden;
  padding-right: 80px;
  -ms-text-overflow: ellipsis;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_RoomSettingsDialog
  .mx_AvatarSetting_avatar
  .mx_AvatarSetting_avatarPlaceholder:before {
  -webkit-mask: url(../../img/feather-customised/image.ba8601f.svg);
  mask: url(../../img/feather-customised/image.ba8601f.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 36px;
  mask-size: 36px;
}
.mx_RoomSettingsDialog_BridgeList {
  padding: 0;
}
.mx_RoomSettingsDialog_BridgeList li {
  list-style-type: none;
}
.mx_RoomSettingsDialog_BridgeList li.mx_RoomSettingsDialog_BridgeList_listItem {
  border: 1px solid transparent;
  border-radius: 5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 8px;
  padding: 5px;
}
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_icon
  .mx_RoomSettingsDialog_noProtocolIcon,
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_icon
  .mx_RoomSettingsDialog_protocolIcon,
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_icon
  .mx_RoomSettingsDialog_protocolIcon
  span {
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 5px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_icon
  .mx_RoomSettingsDialog_noProtocolIcon,
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_icon
  .mx_RoomSettingsDialog_protocolIcon
  img {
  border-radius: 5px;
}
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_icon
  .mx_RoomSettingsDialog_noProtocolIcon {
  background: var(--cpd-color-gray-400);
  height: 48px;
  width: 48px;
}
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_icon
  .mx_RoomSettingsDialog_protocolIcon
  img {
  border-color: transparent;
  border-width: 1px;
}
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_icon
  .mx_RoomSettingsDialog_protocolIcon
  span {
  left: auto;
}
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_data {
  display: inline-block;
  width: 85%;
}
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_data
  .mx_RoomSettingsDialog_column_data_details,
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_data
  .mx_RoomSettingsDialog_column_data_metadata,
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_data
  .mx_RoomSettingsDialog_column_data_metadata
  li,
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_data
  .mx_RoomSettingsDialog_column_data_protocolName {
  margin-bottom: 0;
}
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_data
  .mx_RoomSettingsDialog_column_data_details,
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_data
  .mx_RoomSettingsDialog_column_data_metadata {
  margin-top: 4px;
}
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_data
  .mx_RoomSettingsDialog_column_data_metadata
  li {
  margin-top: 8px;
}
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_data
  .mx_RoomSettingsDialog_column_data_protocolName {
  color: var(--cpd-color-text-primary);
  font-size: 16pt;
  margin-top: 0;
}
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_data
  .mx_RoomSettingsDialog_workspace_channel_details {
  color: var(--cpd-color-text-primary);
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_data
  .mx_RoomSettingsDialog_workspace_channel_details
  .mx_RoomSettingsDialog_channel {
  -webkit-margin-start: 5px;
  margin-inline-start: 5px;
}
.mx_RoomSettingsDialog_BridgeList
  li.mx_RoomSettingsDialog_BridgeList_listItem
  .mx_RoomSettingsDialog_column_data
  .mx_RoomSettingsDialog_metadata {
  color: #61708b;
  margin-bottom: 0;
  overflow-y: visible;
  padding: 0;
  text-overflow: ellipsis;
  white-space: normal;
}
.mx_RoomUpgradeDialog {
  padding-right: 70px;
}
.mx_RoomUpgradeWarningDialog {
  max-width: 38vw;
  width: 38vw;
}
.mx_RoomUpgradeWarningDialog
  .mx_RoomUpgradeWarningDialog_progress
  .mx_ProgressBar {
  border-radius: 8px;
  height: 8px;
  width: 100%;
}
.mx_RoomUpgradeWarningDialog
  .mx_RoomUpgradeWarningDialog_progress
  .mx_ProgressBar::-moz-progress-bar {
  border-radius: 8px;
}
.mx_RoomUpgradeWarningDialog
  .mx_RoomUpgradeWarningDialog_progress
  .mx_ProgressBar::-webkit-progress-bar,
.mx_RoomUpgradeWarningDialog
  .mx_RoomUpgradeWarningDialog_progress
  .mx_ProgressBar::-webkit-progress-value {
  border-radius: 8px;
}
.mx_RoomUpgradeWarningDialog
  .mx_RoomUpgradeWarningDialog_progress
  .mx_RoomUpgradeWarningDialog_progressText {
  color: var(--cpd-color-text-primary);
  font-size: 0.9375rem;
  line-height: 1.5rem;
  margin-top: 8px;
}
.mx_RoomUpgradeWarningDialog .mx_SettingsFlag {
  font-weight: 700;
}
.mx_RoomUpgradeWarningDialog .mx_SettingsFlag .mx_ToggleSwitch {
  display: inline-block;
  float: right;
  margin-left: 8px;
  vertical-align: middle;
}
.mx_RoomUpgradeWarningDialog .mx_SettingsFlag .mx_SettingsFlag_label {
  display: inline-block;
  vertical-align: middle;
}
.mx_ServerOfflineDialog .mx_ServerOfflineDialog_content {
  color: var(--cpd-color-text-primary);
  padding-right: 85px;
}
.mx_ServerOfflineDialog .mx_ServerOfflineDialog_content hr {
  border-color: var(--cpd-color-text-primary);
  border-bottom: none;
  opacity: 0.1;
}
.mx_ServerOfflineDialog .mx_ServerOfflineDialog_content ul {
  padding: 16px;
}
.mx_ServerOfflineDialog .mx_ServerOfflineDialog_content ul li:nth-child(n + 2) {
  margin-top: 16px;
}
.mx_ServerOfflineDialog
  .mx_ServerOfflineDialog_content
  .mx_ServerOfflineDialog_content_context
  .mx_ServerOfflineDialog_content_context_timestamp {
  color: #61708b;
  display: inline-block;
  line-height: 24px;
  vertical-align: top;
  width: 115px;
}
.mx_ServerOfflineDialog
  .mx_ServerOfflineDialog_content
  .mx_ServerOfflineDialog_content_context
  .mx_ServerOfflineDialog_content_context_timeline {
  display: inline-block;
  width: calc(100% - 155px);
}
.mx_ServerOfflineDialog
  .mx_ServerOfflineDialog_content
  .mx_ServerOfflineDialog_content_context
  .mx_ServerOfflineDialog_content_context_timeline
  .mx_ServerOfflineDialog_content_context_timeline_header
  span {
  margin-left: 8px;
  vertical-align: middle;
}
.mx_ServerOfflineDialog
  .mx_ServerOfflineDialog_content
  .mx_ServerOfflineDialog_content_context
  .mx_ServerOfflineDialog_content_context_timeline
  .mx_ServerOfflineDialog_content_context_txn {
  margin-top: 8px;
  position: relative;
}
.mx_ServerOfflineDialog
  .mx_ServerOfflineDialog_content
  .mx_ServerOfflineDialog_content_context
  .mx_ServerOfflineDialog_content_context_timeline
  .mx_ServerOfflineDialog_content_context_txn
  .mx_ServerOfflineDialog_content_context_txn_desc {
  width: calc(100% - 100px);
}
.mx_ServerOfflineDialog
  .mx_ServerOfflineDialog_content
  .mx_ServerOfflineDialog_content_context
  .mx_ServerOfflineDialog_content_context_timeline
  .mx_ServerOfflineDialog_content_context_txn
  .mx_AccessibleButton {
  float: right;
}
.mx_ServerPickerDialog {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 468px;
}
.mx_ServerPickerDialog .mx_Dialog_content {
  margin-bottom: 0;
}
.mx_ServerPickerDialog .mx_Dialog_content > p {
  color: var(--cpd-color-text-secondary);
  font: var(--cpd-font-body-md-regular);
  margin: 16px 0;
}
.mx_ServerPickerDialog .mx_Dialog_content > p:first-of-type {
  margin-bottom: 40px;
}
.mx_ServerPickerDialog .mx_Dialog_content > p:last-of-type {
  margin: 0 24px 24px;
}
.mx_ServerPickerDialog .mx_Dialog_content > h2 {
  color: var(--cpd-color-text-secondary);
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin: 16px 0 16px 8px;
}
.mx_ServerPickerDialog .mx_Dialog_content > a {
  color: var(--cpd-color-text-action-accent);
  margin-left: 8px;
}
.mx_ServerPickerDialog
  .mx_ServerPickerDialog_otherHomeserverRadio
  input[type="radio"]
  + div {
  margin-bottom: auto;
  margin-top: auto;
}
.mx_ServerPickerDialog .mx_ServerPickerDialog_otherHomeserver {
  border-left: none;
  border-radius: 0;
  border-radius: initial;
  border-right: none;
  border-top: none;
}
.mx_ServerPickerDialog .mx_ServerPickerDialog_otherHomeserver > input {
  padding-left: 0;
}
.mx_ServerPickerDialog .mx_ServerPickerDialog_otherHomeserver > label {
  margin-left: 0;
}
.mx_ServerPickerDialog .mx_AccessibleButton_kind_primary {
  margin: 0 8px;
  padding: 15px 18px;
  width: calc(100% - 64px);
}
.mx_SetEmailDialog_email_input {
  background-color: var(--cpd-color-bg-canvas-default);
  border: 1px solid #e7e7e7;
  border-radius: 3px;
  color: rgba(74, 74, 74, 0.9);
  font-size: 0.9375rem;
  margin-bottom: 10px;
  max-width: 280px;
  padding: 9px;
  width: 100%;
}
.mx_SetEmailDialog_email_input:focus {
  border: 1px solid var(--cpd-color-text-action-accent);
  -webkit-box-shadow: none;
  box-shadow: none;
  outline: none;
}
.mx_RoomSettingsDialog,
.mx_SpacePreferencesDialog,
.mx_SpaceSettingsDialog,
.mx_UserSettingsDialog {
  height: 80vh;
  max-width: 980px;
  width: 90vw;
}
.mx_RoomSettingsDialog .mx_TabbedView,
.mx_SpacePreferencesDialog .mx_TabbedView,
.mx_SpaceSettingsDialog .mx_TabbedView,
.mx_UserSettingsDialog .mx_TabbedView {
  top: 90px;
}
.mx_RoomSettingsDialog .mx_TabbedView .mx_SettingsTab,
.mx_SpacePreferencesDialog .mx_TabbedView .mx_SettingsTab,
.mx_SpaceSettingsDialog .mx_TabbedView .mx_SettingsTab,
.mx_UserSettingsDialog .mx_TabbedView .mx_SettingsTab {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  min-width: 300px;
  padding-right: 100px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 100px;
}
.mx_ShareDialog hr {
  border-color: #747474;
  margin-bottom: 25px;
  margin-top: 25px;
}
.mx_ShareDialog .mx_ShareDialog_content {
  margin: 10px 0;
}
.mx_ShareDialog .mx_ShareDialog_content .mx_CopyableText {
  width: auto;
}
.mx_ShareDialog .mx_ShareDialog_content .mx_CopyableText > a {
  text-decoration: none;
  -ms-flex-negative: 1;
  flex-shrink: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_ShareDialog_split {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.mx_ShareDialog_qrcode_container {
  float: left;
  height: 256px;
  margin-right: 64px;
  width: 256px;
}
.mx_ShareDialog_qrcode_container + .mx_ShareDialog_social_container {
  width: 299px;
}
.mx_ShareDialog_social_container {
  display: inline-block;
}
.mx_ShareDialog_social_icon {
  display: inline-grid;
  margin-bottom: 10px;
  margin-right: 10px;
}
.mx_SlashCommandHelpDialog .mx_SlashCommandHelpDialog_headerRow h2 {
  margin-bottom: 2px;
}
.mx_SlashCommandHelpDialog .mx_Dialog_content {
  margin-bottom: 34px;
  margin-top: 12px;
}
.mx_SpacePreferencesDialog {
  height: 400px;
  width: 700px;
}
.mx_SpacePreferencesDialog > h4 {
  color: var(--cpd-color-text-secondary);
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.5rem;
  margin: -12px 0 0;
}
.mx_SpacePreferencesDialog .mx_TabbedView {
  top: 80px;
}
.mx_SpacePreferencesDialog .mx_TabbedView .mx_SettingsTab {
  min-width: 0;
  min-width: auto;
}
.mx_SpacePreferencesDialog_appearanceIcon:before {
  -webkit-mask-image: url(../../img/element-icons/settings/appearance.90cad21.svg);
  mask-image: url(../../img/element-icons/settings/appearance.90cad21.svg);
}
.mx_SpaceSettingsDialog {
  color: var(--cpd-color-text-primary);
}
.mx_SpaceSettingsDialog .mx_SpaceSettings_errorText {
  color: var(--cpd-color-text-critical-primary);
  font-size: 0.75rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 0.9375rem;
  margin-bottom: 28px;
}
.mx_SpaceSettingsDialog .mx_ToggleSwitch {
  display: inline-block;
  margin-left: 16px;
  vertical-align: middle;
}
.mx_SpaceSettingsDialog
  .mx_SettingsTab_section
  .mx_SettingsTab_section_caption {
  margin-bottom: 20px;
  margin-top: 12px;
}
.mx_SpaceSettingsDialog .mx_SettingsTab_section .mx_StyledRadioButton {
  margin-bottom: 4px;
  margin-top: 8px;
}
.mx_SpaceSettingsDialog
  .mx_SettingsTab_section
  .mx_StyledRadioButton
  .mx_StyledRadioButton_content {
  color: var(--cpd-color-text-primary);
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.125rem;
}
.mx_SpaceSettingsDialog .mx_SettingsTab_section .mx_StyledRadioButton + span {
  color: var(--cpd-color-text-secondary);
  font-size: 0.9375rem;
  line-height: 1.125rem;
  margin-left: 26px;
}
.mx_SpaceSettingsDialog .mx_SpaceSettingsDialog_buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 64px;
}
.mx_SpaceSettingsDialog .mx_SpaceSettingsDialog_buttons .mx_AccessibleButton {
  display: inline-block;
}
.mx_SpaceSettingsDialog
  .mx_SpaceSettingsDialog_buttons
  .mx_AccessibleButton_kind_link {
  margin-left: auto;
}
.mx_SpaceSettingsDialog
  .mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_link {
  font: var(--cpd-font-body-md-semibold);
  margin: 7px 18px;
}
.mx_SpaceSettingsDialog
  .mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_link.mx_SettingsTab_showAdvanced {
  margin: 18px 0;
}
.mx_SpaceSettingsDialog
  .mx_TabbedView_tabLabel
  .mx_SpaceSettingsDialog_generalIcon:before {
  -webkit-mask-image: url(../../img/element-icons/settings.6b0c052.svg);
  mask-image: url(../../img/element-icons/settings.6b0c052.svg);
}
.mx_SpaceSettingsDialog
  .mx_TabbedView_tabLabel
  .mx_SpaceSettingsDialog_visibilityIcon:before {
  -webkit-mask-image: url(../../img/element-icons/eye.e715558.svg);
  mask-image: url(../../img/element-icons/eye.e715558.svg);
}
.mx_SpotlightDialog_wrapper .mx_Dialog_border {
  display: contents;
}
.mx_SpotlightDialog_wrapper .mx_Dialog {
  border-radius: 8px;
  contain: unset;
  height: 60%;
  overflow-y: visible;
  overflow-y: initial;
  padding: 0;
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.mx_SpotlightDialog_wrapper .mx_Dialog #mx_SpotlightDialog_keyboardPrompt {
  background-color: var(--cpd-color-bg-canvas-default);
  border-radius: 8px;
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  left: 50%;
  line-height: 0.9375rem;
  padding: 8px;
  position: absolute;
  top: -60px;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
.mx_SpotlightDialog_wrapper .mx_Dialog #mx_SpotlightDialog_keyboardPrompt kbd {
  background-color: var(--cpd-color-gray-400);
  border-radius: 6px;
  color: var(--cpd-color-gray-800);
  display: inline-block;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  margin: 0 4px;
  padding: 2px 4px;
  vertical-align: middle;
}
.mx_SpotlightDialog {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_SpotlightDialog .mx_Dialog_header {
  display: none;
}
.mx_SpotlightDialog .mx_SpotlightDialog_searchBox {
  border: none;
  border-bottom: 1px solid var(--cpd-color-bg-subtle-primary);
  border-radius: 8px 8px 0 0;
  margin: 0;
  padding: 12px 16px;
}
.mx_SpotlightDialog .mx_SpotlightDialog_searchBox > .mx_SpotlightDialog_filter {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-line-pack: center;
  align-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: var(--cpd-color-gray-400);
  border-radius: 8px;
  color: var(--cpd-color-text-primary);
  margin-right: 8px;
  padding: 4px 8px 4px 37px;
  position: relative;
  vertical-align: middle;
}
.mx_SpotlightDialog
  .mx_SpotlightDialog_searchBox
  > .mx_SpotlightDialog_filter:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 18px;
  left: 8px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 18px;
}
.mx_SpotlightDialog
  .mx_SpotlightDialog_searchBox
  > .mx_SpotlightDialog_filter.mx_SpotlightDialog_filterPeople:before {
  -webkit-mask-image: url(../../img/element-icons/room/members.bcfbe84.svg);
  mask-image: url(../../img/element-icons/room/members.bcfbe84.svg);
}
.mx_SpotlightDialog
  .mx_SpotlightDialog_searchBox
  > .mx_SpotlightDialog_filter.mx_SpotlightDialog_filterPublicRooms:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/hash-circle.221168c.svg);
  mask-image: url(../../img/element-icons/roomlist/hash-circle.221168c.svg);
}
.mx_SpotlightDialog
  .mx_SpotlightDialog_searchBox
  > .mx_SpotlightDialog_filter.mx_SpotlightDialog_filterPublicSpaces:before {
  -webkit-mask-image: url(../../img/element-icons/spaces.8a53f25.svg);
  mask-image: url(../../img/element-icons/spaces.8a53f25.svg);
}
.mx_SpotlightDialog
  .mx_SpotlightDialog_searchBox
  > .mx_SpotlightDialog_filter
  .mx_SpotlightDialog_filter--close {
  background: var(--cpd-color-bg-subtle-primary);
  border-radius: 8px;
  color: var(--cpd-color-text-secondary);
  display: inline-block;
  height: 16px;
  line-height: 16px;
  margin-left: 8px;
  position: relative;
  text-align: center;
  width: 16px;
}
.mx_SpotlightDialog
  .mx_SpotlightDialog_searchBox
  > .mx_SpotlightDialog_filter
  .mx_SpotlightDialog_filter--close:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 8px;
  left: 50%;
  -webkit-mask-image: url(../../img/cancel-small.599ba74.svg);
  mask-image: url(../../img/cancel-small.599ba74.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 8px;
}
.mx_SpotlightDialog .mx_SpotlightDialog_searchBox > input {
  background-color: transparent;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: var(--cpd-color-gray-800);
  display: block;
  font-size: 0.9375rem;
  font-weight: 400;
  height: 32px;
  line-height: 1.5rem;
  padding: 0;
  width: 100%;
}
.mx_SpotlightDialog .mx_SpotlightDialog_searchBox > .mx_Spinner {
  -webkit-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  height: auto;
  margin-left: 16px;
  width: auto;
}
.mx_SpotlightDialog #mx_SpotlightDialog_content {
  height: 100%;
  overflow-y: auto;
  padding: 16px;
}
.mx_SpotlightDialog #mx_SpotlightDialog_content ul {
  margin: 0;
  padding: 0;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_section
  > .mx_SpotlightDialog_sectionHeader
  > h4,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_section
  > h4 {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 0.9375rem;
  margin: 0;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_section
  > h4 {
  margin-bottom: 8px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_section
  .mx_SpotlightDialog_sectionHeader {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 8px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_section
  .mx_SpotlightDialog_sectionHeader
  .mx_SpotlightDialog_options {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 4px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_section
  + .mx_SpotlightDialog_section {
  margin-top: 24px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentlyViewed
  > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-right: 1px;
  overflow-x: hidden;
  white-space: nowrap;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentlyViewed
  .mx_SpotlightDialog_option {
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: var(--cpd-color-text-primary);
  display: inline-block;
  font-size: 0.75rem;
  height: 58px;
  line-height: 0.9375rem;
  min-width: 58px;
  overflow: hidden;
  padding: 4px;
  text-align: center;
  text-overflow: ellipsis;
  width: 58px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentlyViewed
  .mx_SpotlightDialog_option
  .mx_DecoratedRoomAvatar {
  margin: 0 9px 4px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentlyViewed
  .mx_SpotlightDialog_option
  + .mx_SpotlightDialog_option {
  margin-left: 16px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentlyViewed
  .mx_SpotlightDialog_option:hover,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentlyViewed
  .mx_SpotlightDialog_option[aria-selected="true"] {
  background-color: var(--cpd-color-gray-400);
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option {
  border-radius: 8px;
  color: var(--cpd-color-text-primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 0.9375rem;
  line-height: 1.5rem;
  padding: 6px 4px;
  position: relative;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--endAdornment,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--endAdornment,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--endAdornment,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--endAdornment {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  margin-left: auto;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option.mx_SpotlightDialog_result_multiline,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option.mx_SpotlightDialog_result_multiline,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option.mx_SpotlightDialog_result_multiline,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option.mx_SpotlightDialog_result_multiline {
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option.mx_SpotlightDialog_result_multiline
  .mx_AccessibleButton,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option.mx_SpotlightDialog_result_multiline
  .mx_AccessibleButton,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option.mx_SpotlightDialog_result_multiline
  .mx_AccessibleButton,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option.mx_SpotlightDialog_result_multiline
  .mx_AccessibleButton {
  margin: 2px 4px;
  padding: 4px 20px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option.mx_SpotlightDialog_result_multiline
  .mx_SpotlightDialog_enterPrompt,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option.mx_SpotlightDialog_result_multiline
  .mx_SpotlightDialog_enterPrompt,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option.mx_SpotlightDialog_result_multiline
  .mx_SpotlightDialog_enterPrompt,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option.mx_SpotlightDialog_result_multiline
  .mx_SpotlightDialog_enterPrompt {
  margin-right: 8px;
  margin-top: 9px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  > .mx_BaseAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  > .mx_DecoratedRoomAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  > .mx_SpotlightDialog_metaspaceResult,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  > .mx_BaseAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  > .mx_DecoratedRoomAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  > .mx_SpotlightDialog_metaspaceResult,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  > .mx_BaseAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  > .mx_DecoratedRoomAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  > .mx_SpotlightDialog_metaspaceResult,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  > .mx_BaseAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  > .mx_DecoratedRoomAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  > .mx_SpotlightDialog_metaspaceResult {
  height: 24px;
  margin-right: 8px;
  width: 24px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  > .mx_BaseAvatar
  .mx_BaseAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  > .mx_DecoratedRoomAvatar
  .mx_BaseAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  > .mx_SpotlightDialog_metaspaceResult
  .mx_BaseAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  > .mx_BaseAvatar
  .mx_BaseAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  > .mx_DecoratedRoomAvatar
  .mx_BaseAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  > .mx_SpotlightDialog_metaspaceResult
  .mx_BaseAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  > .mx_BaseAvatar
  .mx_BaseAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  > .mx_DecoratedRoomAvatar
  .mx_BaseAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  > .mx_SpotlightDialog_metaspaceResult
  .mx_BaseAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  > .mx_BaseAvatar
  .mx_BaseAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  > .mx_DecoratedRoomAvatar
  .mx_BaseAvatar,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  > .mx_SpotlightDialog_metaspaceResult
  .mx_BaseAvatar {
  height: inherit;
  width: inherit;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  min-width: 0;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails
  .mx_SpotlightDialog_result_publicRoomHeader,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails
  .mx_SpotlightDialog_result_publicRoomHeader,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails
  .mx_SpotlightDialog_result_publicRoomHeader,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails
  .mx_SpotlightDialog_result_publicRoomHeader {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  line-height: 1.5rem;
  margin-right: 8px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails
  .mx_SpotlightDialog_result_publicRoomHeader
  .mx_SpotlightDialog_result_publicRoomName,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails
  .mx_SpotlightDialog_result_publicRoomHeader
  .mx_SpotlightDialog_result_publicRoomName,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails
  .mx_SpotlightDialog_result_publicRoomHeader
  .mx_SpotlightDialog_result_publicRoomName,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails
  .mx_SpotlightDialog_result_publicRoomHeader
  .mx_SpotlightDialog_result_publicRoomName {
  color: var(--cpd-color-text-primary);
  font-size: 0.9375rem;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails
  .mx_SpotlightDialog_result_publicRoomHeader
  .mx_SpotlightDialog_result_publicRoomAlias,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails
  .mx_SpotlightDialog_result_publicRoomHeader
  .mx_SpotlightDialog_result_publicRoomAlias,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails
  .mx_SpotlightDialog_result_publicRoomHeader
  .mx_SpotlightDialog_result_publicRoomAlias,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails
  .mx_SpotlightDialog_result_publicRoomHeader
  .mx_SpotlightDialog_result_publicRoomAlias {
  color: var(--cpd-color-gray-800);
  font-size: 0.75rem;
  margin-left: 8px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails
  .mx_SpotlightDialog_result_publicRoomDescription,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails
  .mx_SpotlightDialog_result_publicRoomDescription,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails
  .mx_SpotlightDialog_result_publicRoomDescription,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_result_publicRoomDetails
  .mx_SpotlightDialog_result_publicRoomDescription {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  white-space: normal;
  word-wrap: break-word;
  display: -webkit-box;
  line-height: 1.25rem;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  .mx_NotificationBadge,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  .mx_NotificationBadge,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  .mx_NotificationBadge,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  .mx_NotificationBadge {
  margin-left: 8px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--notifications,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--notifications,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--notifications,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--notifications {
  display: none;
  height: 20px;
  margin-bottom: auto;
  margin-top: auto;
  min-width: 20px;
  position: relative;
  width: 20px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--notifications:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--notifications:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--notifications:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--notifications:before {
  background: var(--cpd-color-gray-800);
  content: "";
  height: 16px;
  left: 2px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 2px;
  width: 16px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu:hover:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu[aria-selected="true"]:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--notifications:hover:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--notifications[aria-selected="true"]:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu:hover:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu[aria-selected="true"]:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--notifications:hover:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--notifications[aria-selected="true"]:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu:hover:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu[aria-selected="true"]:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--notifications:hover:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--notifications[aria-selected="true"]:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu:hover:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu[aria-selected="true"]:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--notifications:hover:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--notifications[aria-selected="true"]:before {
  background-color: var(--cpd-color-text-secondary);
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option
  .mx_SpotlightDialog_option--menu:before {
  -webkit-mask-image: url(../../img/element-icons/context-menu.2c3f393.svg);
  mask-image: url(../../img/element-icons/context-menu.2c3f393.svg);
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option:hover,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option[aria-selected="true"],
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option:hover,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option[aria-selected="true"],
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option:hover,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option[aria-selected="true"],
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option:hover,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option[aria-selected="true"] {
  background-color: var(--cpd-color-bg-subtle-primary);
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option:hover
  .mx_SpotlightDialog_option--menu,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option:hover
  .mx_SpotlightDialog_option--notifications,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option[aria-selected="true"]
  .mx_SpotlightDialog_option--menu,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option[aria-selected="true"]
  .mx_SpotlightDialog_option--notifications,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option:hover
  .mx_SpotlightDialog_option--menu,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option:hover
  .mx_SpotlightDialog_option--notifications,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option[aria-selected="true"]
  .mx_SpotlightDialog_option--menu,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option[aria-selected="true"]
  .mx_SpotlightDialog_option--notifications,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option:hover
  .mx_SpotlightDialog_option--menu,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option:hover
  .mx_SpotlightDialog_option--notifications,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option[aria-selected="true"]
  .mx_SpotlightDialog_option--menu,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option[aria-selected="true"]
  .mx_SpotlightDialog_option--notifications,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option:hover
  .mx_SpotlightDialog_option--menu,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option:hover
  .mx_SpotlightDialog_option--notifications,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option[aria-selected="true"]
  .mx_SpotlightDialog_option--menu,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option[aria-selected="true"]
  .mx_SpotlightDialog_option--notifications {
  display: block;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_hiddenResults
  .mx_SpotlightDialog_option[aria-selected="true"]
  .mx_SpotlightDialog_enterPrompt,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_option[aria-selected="true"]
  .mx_SpotlightDialog_enterPrompt,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  .mx_SpotlightDialog_option[aria-selected="true"]
  .mx_SpotlightDialog_enterPrompt,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_results
  .mx_SpotlightDialog_option[aria-selected="true"]
  .mx_SpotlightDialog_enterPrompt {
  display: inline-block;
}
.mx_SpotlightDialog #mx_SpotlightDialog_content .mx_SpotlightDialog_createRoom,
.mx_SpotlightDialog #mx_SpotlightDialog_content .mx_SpotlightDialog_inviteLink {
  margin-top: 8px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_createRoom
  .mx_AccessibleButton,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_inviteLink
  .mx_AccessibleButton {
  margin: 0;
  padding: 3px 8px 3px 28px;
  position: relative;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_createRoom
  .mx_AccessibleButton:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_inviteLink
  .mx_AccessibleButton:before {
  background: var(--cpd-color-icon-primary);
  content: "";
  display: block;
  height: 16px;
  left: 8px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  width: 16px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_inviteLink
  .mx_AccessibleButton:before {
  -webkit-mask-image: url(../../img/element-icons/link.e24e5a8.svg);
  mask-image: url(../../img/element-icons/link.e24e5a8.svg);
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_createRoom
  .mx_AccessibleButton:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/hash.9de9cf7.svg);
  mask-image: url(../../img/element-icons/roomlist/hash.9de9cf7.svg);
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_explorePublicRooms,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_explorePublicSpaces,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_joinRoomAlias,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_startChat,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_startGroupChat {
  padding-left: 32px;
  position: relative;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_explorePublicRooms:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_explorePublicSpaces:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_joinRoomAlias:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_startChat:before,
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_startGroupChat:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 24px;
  left: 4px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 24px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_startChat:before {
  -webkit-mask-image: url(../../img/element-icons/room/members.bcfbe84.svg);
  mask-image: url(../../img/element-icons/room/members.bcfbe84.svg);
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_joinRoomAlias:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/hash-circle.221168c.svg);
  mask-image: url(../../img/element-icons/roomlist/hash-circle.221168c.svg);
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_explorePublicRooms:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/hash-circle.221168c.svg);
  mask-image: url(../../img/element-icons/roomlist/hash-circle.221168c.svg);
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_explorePublicSpaces:before {
  -webkit-mask-image: url(../../img/element-icons/spaces.8a53f25.svg);
  mask-image: url(../../img/element-icons/spaces.8a53f25.svg);
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_startGroupChat:before {
  -webkit-mask-image: url(../../img/element-icons/group-members.d86d751.svg);
  mask-image: url(../../img/element-icons/group-members.d86d751.svg);
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_otherSearches_messageSearchText {
  font-size: 0.9375rem;
  line-height: 1.5rem;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_otherSearches
  .mx_SpotlightDialog_otherSearches_messageSearchIcon {
  background-color: var(--cpd-color-text-secondary);
  display: inline-block;
  height: 24px;
  -webkit-mask-image: url(../../img/element-icons/room/search-inset.7a9a2eb.svg);
  mask-image: url(../../img/element-icons/room/search-inset.7a9a2eb.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  vertical-align: text-bottom;
  width: 24px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_result_details {
  color: var(--cpd-color-gray-800);
  font-size: 0.75rem;
  line-height: 0.9375rem;
  margin-left: 8px;
  margin-right: 8px;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_recentSearches
  > h4
  > .mx_AccessibleButton_kind_link {
  color: var(--cpd-color-text-secondary);
  float: right;
  font-size: 0.75rem;
  line-height: 0.9375rem;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_enterPrompt {
  background-color: var(--cpd-color-gray-400);
  border-radius: 6px;
  color: var(--cpd-color-gray-800);
  display: none;
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: inherit;
  line-height: 0.9375rem;
  margin-right: 4px;
  padding: 2px 4px;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_metaspaceResult {
  background-color: var(--cpd-color-text-secondary);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_metaspaceResult.mx_SpotlightDialog_metaspaceResult_home-space {
  -webkit-mask-image: url(../../img/element-icons/home.e0e6ce5.svg);
  mask-image: url(../../img/element-icons/home.e0e6ce5.svg);
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_metaspaceResult.mx_SpotlightDialog_metaspaceResult_favourites-space {
  -webkit-mask-image: url(../../img/element-icons/roomlist/favorite.9dcb53a.svg);
  mask-image: url(../../img/element-icons/roomlist/favorite.9dcb53a.svg);
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_metaspaceResult.mx_SpotlightDialog_metaspaceResult_people-space {
  -webkit-mask-image: url(../../img/element-icons/room/members.bcfbe84.svg);
  mask-image: url(../../img/element-icons/room/members.bcfbe84.svg);
}
.mx_SpotlightDialog
  #mx_SpotlightDialog_content
  .mx_SpotlightDialog_metaspaceResult.mx_SpotlightDialog_metaspaceResult_orphans-space {
  -webkit-mask-image: url(../../img/element-icons/roomlist/hash-circle.221168c.svg);
  mask-image: url(../../img/element-icons/roomlist/hash-circle.221168c.svg);
}
.mx_TermsDialog_forIntegrationManager .mx_Dialog_border {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 70%;
  width: 60%;
}
.mx_TermsDialog_termsTableHeader {
  font-weight: 700;
  text-align: left;
}
.mx_TermsDialog_termsTable {
  font-size: 0.75rem;
  width: 100%;
}
.mx_TermsDialog_service,
.mx_TermsDialog_summary {
  padding-right: 10px;
}
.mx_UntrustedDeviceDialog .mx_Dialog_title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_UntrustedDeviceDialog .mx_Dialog_title .mx_E2EIcon {
  margin-left: 0;
}
.mx_UntrustedDeviceDialog .mx_Dialog_buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  gap: 8px;
  justify-content: flex-end;
}
.mx_UploadConfirmDialog_fileIcon {
  margin-right: 5px;
}
.mx_UploadConfirmDialog_previewOuter {
  text-align: center;
}
.mx_UploadConfirmDialog_previewInner {
  display: inline-block;
  text-align: left;
}
.mx_UploadConfirmDialog_imagePreview {
  border: 1px solid var(--cpd-color-icon-tertiary);
  border-radius: 4px;
  max-height: 300px;
  max-width: 100%;
}
.mx_SettingsDialog_toastContainer {
  bottom: var(--cpd-space-10x);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  width: 100%;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_UserSettingsDialog_settingsIcon:before {
  -webkit-mask-image: url(../../img/element-icons/settings.6b0c052.svg);
  mask-image: url(../../img/element-icons/settings.6b0c052.svg);
}
.mx_UserSettingsDialog_appearanceIcon:before {
  -webkit-mask-image: url(../../img/element-icons/settings/appearance.90cad21.svg);
  mask-image: url(../../img/element-icons/settings/appearance.90cad21.svg);
}
.mx_UserSettingsDialog_voiceIcon:before {
  -webkit-mask-image: url(../../img/element-icons/call/voice-call.85002aa.svg);
  mask-image: url(../../img/element-icons/call/voice-call.85002aa.svg);
}
.mx_UserSettingsDialog_bellIcon:before {
  -webkit-mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
  mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
}
.mx_UserSettingsDialog_preferencesIcon:before {
  -webkit-mask-image: url(../../img/element-icons/settings/preference.dd3ae3c.svg);
  mask-image: url(../../img/element-icons/settings/preference.dd3ae3c.svg);
}
.mx_UserSettingsDialog_keyboardIcon:before {
  -webkit-mask-image: url(../../img/element-icons/settings/keyboard.67e29b9.svg);
  mask-image: url(../../img/element-icons/settings/keyboard.67e29b9.svg);
}
.mx_UserSettingsDialog_sidebarIcon:before {
  -webkit-mask-image: url(../../img/element-icons/settings/sidebar.5dcb382.svg);
  mask-image: url(../../img/element-icons/settings/sidebar.5dcb382.svg);
}
.mx_UserSettingsDialog_securityIcon:before {
  -webkit-mask-image: url(../../img/element-icons/security.fa860ea.svg);
  mask-image: url(../../img/element-icons/security.fa860ea.svg);
}
.mx_UserSettingsDialog_sessionsIcon:before {
  -webkit-mask-image: url(../../img/element-icons/settings/devices.9771113.svg);
  mask-image: url(../../img/element-icons/settings/devices.9771113.svg);
}
.mx_UserSettingsDialog_helpIcon:before {
  -webkit-mask-image: url(../../img/element-icons/settings/help.96dda0b.svg);
  mask-image: url(../../img/element-icons/settings/help.96dda0b.svg);
}
.mx_UserSettingsDialog_labsIcon:before {
  -webkit-mask-image: url(../../img/element-icons/settings/flask.40eebdf.svg);
  mask-image: url(../../img/element-icons/settings/flask.40eebdf.svg);
}
.mx_UserSettingsDialog_mjolnirIcon:before {
  -webkit-mask-image: url(../../img/element-icons/room/composer/emoji.d7b1970.svg);
  mask-image: url(../../img/element-icons/room/composer/emoji.d7b1970.svg);
}
.mx_VerifyEMailDialog {
  height: auto;
  top: 300px;
}
.mx_VerifyEMailDialog .mx_Dialog {
  color: var(--cpd-color-text-primary);
  font: var(--cpd-font-body-md-regular);
  padding: 24px 24px 16px;
  text-align: center;
  width: 485px;
}
.mx_VerifyEMailDialog .mx_Dialog h1 {
  font-size: 1.5rem;
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_VerifyEMailDialog .mx_Dialog .mx_VerifyEMailDialog_text-light {
  color: var(--cpd-color-text-secondary);
  line-height: 20px;
}
.mx_VerifyEMailDialog .mx_Dialog .mx_AuthBody_did-not-receive {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-bottom: 8px;
}
.mx_VerifyEMailDialog .mx_Dialog .mx_Dialog_cancelButton {
  right: 10px;
}
.mx_WidgetCapabilitiesPromptDialog .text-muted {
  font-size: 0.75rem;
}
.mx_WidgetCapabilitiesPromptDialog .mx_Dialog_content {
  margin-bottom: 16px;
}
.mx_WidgetCapabilitiesPromptDialog .mx_WidgetCapabilitiesPromptDialog_cap {
  font-size: 0.9375rem;
  line-height: 0.9375rem;
  margin-top: 20px;
}
.mx_WidgetCapabilitiesPromptDialog
  .mx_WidgetCapabilitiesPromptDialog_cap
  .mx_WidgetCapabilitiesPromptDialog_byline {
  color: #61708b;
  font-size: 0.75rem;
  line-height: 0.75rem;
  margin-left: 26px;
}
.mx_WidgetCapabilitiesPromptDialog .mx_Dialog_buttons {
  margin-top: 40px;
}
.mx_WidgetCapabilitiesPromptDialog .mx_SettingsFlag {
  color: #61708b;
  font-size: 0.75rem;
  line-height: calc(0.875rem + 14px);
}
.mx_WidgetCapabilitiesPromptDialog .mx_SettingsFlag .mx_ToggleSwitch {
  height: 0.9375rem;
  width: 2rem;
}
.mx_WidgetCapabilitiesPromptDialog
  .mx_SettingsFlag
  .mx_ToggleSwitch.mx_ToggleSwitch_on
  > .mx_ToggleSwitch_ball {
  left: calc(100% - 0.9375rem);
}
.mx_WidgetCapabilitiesPromptDialog
  .mx_SettingsFlag
  .mx_ToggleSwitch
  .mx_ToggleSwitch_ball {
  border-radius: 0.9375rem;
  height: 0.9375rem;
  width: 0.9375rem;
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_titleWithIcon:before {
  content: "";
  display: inline-block;
  height: 24px;
  width: 24px;
  -webkit-margin-end: 8px;
  background-color: var(--cpd-color-text-primary);
  margin-inline-end: 8px;
  position: relative;
  top: 5px;
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_titleWithIcon.mx_AccessSecretStorageDialog_resetBadge:before {
  background-color: transparent;
  background-image: url(../../img/element-icons/warning-badge.203170a.svg);
  background-size: 24px;
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_titleWithIcon.mx_AccessSecretStorageDialog_secureBackupTitle:before {
  -webkit-mask-image: url(../../img/feather-customised/secure-backup.7e95b34.svg);
  mask-image: url(../../img/feather-customised/secure-backup.7e95b34.svg);
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_titleWithIcon.mx_AccessSecretStorageDialog_securePhraseTitle:before {
  -webkit-mask-image: url(../../img/feather-customised/secure-phrase.73fa1c2.svg);
  mask-image: url(../../img/feather-customised/secure-phrase.73fa1c2.svg);
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_primaryContainer
  .mx_AccessSecretStorageDialog_passPhraseInput {
  border: 1px solid var(--cpd-color-text-action-accent);
  border-radius: 5px;
  width: 300px;
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_primaryContainer
  .mx_AccessSecretStorageDialog_keyStatus {
  height: 30px;
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_primaryContainer
  .mx_AccessSecretStorageDialog_recoveryKeyEntry {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_primaryContainer
  .mx_AccessSecretStorageDialog_recoveryKeyEntry
  .mx_AccessSecretStorageDialog_recoveryKeyEntry_textInput {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_primaryContainer
  .mx_AccessSecretStorageDialog_recoveryKeyEntry
  .mx_AccessSecretStorageDialog_recoveryKeyEntry_entryControlSeparatorText {
  margin: 16px;
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_primaryContainer
  .mx_AccessSecretStorageDialog_recoveryKeyEntry
  .mx_AccessSecretStorageDialog_recoveryKeyEntry_fileInput {
  display: none;
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_primaryContainer
  .mx_AccessSecretStorageDialog_recoveryKeyFeedback:before {
  content: "";
  display: inline-block;
  height: 20px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  vertical-align: bottom;
  width: 20px;
  -webkit-margin-end: 5px;
  margin-inline-end: 5px;
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_primaryContainer
  .mx_AccessSecretStorageDialog_recoveryKeyFeedback.mx_AccessSecretStorageDialog_recoveryKeyFeedback--valid {
  color: var(--cpd-color-text-action-accent);
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_primaryContainer
  .mx_AccessSecretStorageDialog_recoveryKeyFeedback.mx_AccessSecretStorageDialog_recoveryKeyFeedback--valid:before {
  background-color: var(--cpd-color-text-action-accent);
  -webkit-mask-image: url(../../img/feather-customised/check.bfca953.svg);
  mask-image: url(../../img/feather-customised/check.bfca953.svg);
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_primaryContainer
  .mx_AccessSecretStorageDialog_recoveryKeyFeedback.mx_AccessSecretStorageDialog_recoveryKeyFeedback--invalid {
  color: var(--cpd-color-text-critical-primary);
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_primaryContainer
  .mx_AccessSecretStorageDialog_recoveryKeyFeedback.mx_AccessSecretStorageDialog_recoveryKeyFeedback--invalid:before {
  background-color: var(--cpd-color-text-critical-primary);
  -webkit-mask-image: url(../../img/feather-customised/x.c543757.svg);
  mask-image: url(../../img/feather-customised/x.c543757.svg);
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_primaryContainer
  .mx_Dialog_buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-align: left;
  text-align: initial;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-flow: column;
  flex-flow: column;
  gap: 14px;
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_primaryContainer
  .mx_Dialog_buttons
  .mx_Dialog_buttons_additive {
  float: none;
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_primaryContainer
  .mx_Dialog_buttons
  .mx_Dialog_buttons_additive
  .mx_AccessSecretStorageDialog_reset {
  position: relative;
  -webkit-padding-start: 24px;
  font-weight: inherit;
  padding-inline-start: 24px;
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_primaryContainer
  .mx_Dialog_buttons
  .mx_Dialog_buttons_additive
  .mx_AccessSecretStorageDialog_reset:before {
  background-image: url(../../img/element-icons/warning-badge.203170a.svg);
  background-size: contain;
  content: "";
  display: inline-block;
  height: 16px;
  left: 0;
  position: absolute;
  top: 2px;
  width: 16px;
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_primaryContainer
  .mx_Dialog_buttons
  .mx_Dialog_buttons_additive
  .mx_AccessSecretStorageDialog_reset
  .mx_AccessSecretStorageDialog_reset_link {
  color: var(--cpd-color-text-critical-primary);
}
.mx_AccessSecretStorageDialog
  .mx_AccessSecretStorageDialog_primaryContainer
  .mx_Dialog_buttons
  .mx_Dialog_buttons_row {
  gap: 16px;
  -webkit-padding-start: 24px;
  padding-inline-start: 24px;
}
.mx_CreateCrossSigningDialog {
  width: 560px;
}
.mx_CreateCrossSigningDialog details .mx_AccessibleButton {
  margin: 1em 0;
}
.mx_CreateCrossSigningDialog .mx_Dialog_title,
.mx_CreateKeyBackupDialog .mx_Dialog_title {
  margin-bottom: 1em;
}
.mx_CreateKeyBackupDialog_primaryContainer {
  padding: 20px;
}
.mx_CreateKeyBackupDialog_primaryContainer:after {
  clear: both;
  content: "";
  display: block;
}
.mx_CreateKeyBackupDialog_passPhraseContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}
.mx_CreateKeyBackupDialog_passPhraseInput {
  -webkit-box-flex: 0;
  border: 1px solid var(--cpd-color-text-action-accent);
  border-radius: 5px;
  -ms-flex: none;
  flex: none;
  margin-bottom: 1em;
  padding: 10px;
  width: 250px;
}
.mx_CreateKeyBackupDialog_passPhraseMatch {
  margin-left: 20px;
}
.mx_CreateKeyBackupDialog_recoveryKeyHeader {
  margin-bottom: 1em;
}
.mx_CreateKeyBackupDialog_recoveryKeyContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_CreateKeyBackupDialog_recoveryKey {
  background-color: #f7f7f7;
  color: var(--cpd-color-gray-900);
  margin-right: 12px;
  padding: 20px;
  width: 262px;
}
.mx_CreateKeyBackupDialog_recoveryKeyButtons {
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_CreateKeyBackupDialog_recoveryKeyButtons button {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  white-space: nowrap;
}
.mx_CreateKeyBackupDialog details .mx_AccessibleButton {
  margin: 1em 0;
}
.mx_CreateSecretStorageDialog {
  width: 560px;
}
.mx_CreateSecretStorageDialog.mx_SuccessDialog {
  padding: 56px;
}
.mx_CreateSecretStorageDialog.mx_SuccessDialog .mx_Dialog_title {
  margin-bottom: 16px;
}
.mx_CreateSecretStorageDialog .mx_SettingsFlag {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_CreateSecretStorageDialog .mx_SettingsFlag_label {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  font-weight: var(--cpd-font-weight-semibold);
  min-width: 0;
}
.mx_CreateSecretStorageDialog .mx_ToggleSwitch {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  margin-left: 30px;
}
.mx_CreateSecretStorageDialog details .mx_AccessibleButton {
  margin: 1em 0;
}
.mx_CreateSecretStorageDialog .mx_Dialog_title {
  margin-bottom: 1em;
}
.mx_CreateSecretStorageDialog_titleWithIcon:before {
  background-color: var(--cpd-color-text-primary);
  content: "";
  display: inline-block;
  height: 24px;
  margin-right: 8px;
  position: relative;
  top: 5px;
  width: 24px;
}
.mx_CreateSecretStorageDialog_secureBackupTitle:before {
  -webkit-mask-image: url(../../img/feather-customised/secure-backup.7e95b34.svg);
  mask-image: url(../../img/feather-customised/secure-backup.7e95b34.svg);
}
.mx_CreateSecretStorageDialog_securePhraseTitle:before {
  -webkit-mask-image: url(../../img/feather-customised/secure-phrase.73fa1c2.svg);
  mask-image: url(../../img/feather-customised/secure-phrase.73fa1c2.svg);
}
.mx_CreateSecretStorageDialog_centeredBody,
.mx_CreateSecretStorageDialog_centeredTitle {
  text-align: center;
}
.mx_CreateSecretStorageDialog_primaryContainer {
  padding-top: 20px;
}
.mx_CreateSecretStorageDialog_primaryContainer.mx_CreateSecretStorageDialog_recoveryKeyPrimarycontainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_CreateSecretStorageDialog_primaryContainer:after {
  clear: both;
  content: "";
  display: block;
}
.mx_CreateSecretStorageDialog_primaryContainer .mx_StyledRadioButton {
  margin-bottom: 16px;
  padding: 11px;
}
.mx_CreateSecretStorageDialog_optionTitle {
  color: var(--cpd-color-text-primary);
  font-size: 1.125rem;
  font-weight: var(--cpd-font-weight-semibold);
  padding-bottom: 10px;
}
.mx_CreateSecretStorageDialog_optionIcon {
  background-color: var(--cpd-color-text-primary);
  display: inline-block;
  height: 24px;
  margin-right: 8px;
  position: relative;
  top: 5px;
  width: 24px;
}
.mx_CreateSecretStorageDialog_optionIcon_securePhrase {
  -webkit-mask-image: url(../../img/feather-customised/secure-phrase.73fa1c2.svg);
  mask-image: url(../../img/feather-customised/secure-phrase.73fa1c2.svg);
}
.mx_CreateSecretStorageDialog_optionIcon_secureBackup {
  -webkit-mask-image: url(../../img/feather-customised/secure-backup.7e95b34.svg);
  mask-image: url(../../img/feather-customised/secure-backup.7e95b34.svg);
}
.mx_CreateSecretStorageDialog_passPhraseContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}
.mx_Field.mx_CreateSecretStorageDialog_passPhraseField {
  margin-top: 0;
}
.mx_CreateSecretStorageDialog_passPhraseMatch {
  margin-left: 20px;
  width: 200px;
}
.mx_CreateSecretStorageDialog_recoveryKeyContainer {
  display: inline-block;
}
.mx_CreateSecretStorageDialog_recoveryKey {
  background-color: #f7f7f7;
  border-radius: 6px;
  color: var(--cpd-color-gray-900);
  font-weight: 700;
  margin-bottom: 20px;
  padding: 20px;
  text-align: center;
  word-spacing: 1em;
}
.mx_CreateSecretStorageDialog_recoveryKey code {
  display: inline-block;
  width: 30rem;
}
.mx_CreateSecretStorageDialog_recoveryKeyButtons {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 16px;
}
.mx_CreateSecretStorageDialog_recoveryKeyButtons_copyBtn {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_CreateSecretStorageDialog_recoveryKeyButtons .mx_AccessibleButton {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  white-space: nowrap;
}
.mx_CreateSecretStorageDialog_continueSpinner {
  margin-top: 33px;
  text-align: right;
}
.mx_CreateSecretStorageDialog_continueSpinner img {
  height: 20px;
  width: 20px;
}
.mx_KeyBackupFailedDialog .mx_Dialog_title {
  margin-bottom: 32px;
}
.mx_KeyBackupFailedDialog_title {
  padding-bottom: 10px;
  padding-left: 45px;
  position: relative;
}
.mx_KeyBackupFailedDialog_title:before {
  background-color: var(--cpd-color-text-primary);
  bottom: 0;
  content: "";
  left: 0;
  -webkit-mask: url(../../img/e2e/lock-warning-filled.655a613.svg);
  mask: url(../../img/e2e/lock-warning-filled.655a613.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  position: absolute;
  right: 0;
  top: -6px;
}
.mx_KeyBackupFailedDialog .mx_Dialog_buttons {
  margin-top: 36px;
}
.mx_RestoreKeyBackupDialog_keyStatus {
  height: 30px;
}
.mx_RestoreKeyBackupDialog_primaryContainer {
  padding: 20px;
}
.mx_RestoreKeyBackupDialog_passPhraseInput,
.mx_RestoreKeyBackupDialog_recoveryKeyInput {
  border: 1px solid var(--cpd-color-text-action-accent);
  border-radius: 5px;
  padding: 10px;
  width: 300px;
}
.mx_RestoreKeyBackupDialog_content > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  min-height: 110px;
}
.mx_NetworkDropdown_wrapper
  .mx_ContextualMenu
  .mx_GenericDropdownMenu_Option.mx_GenericDropdownMenu_Option--header {
  min-width: 160px;
  padding-bottom: 4px;
  padding-top: 12px;
}
.mx_NetworkDropdown_wrapper
  .mx_ContextualMenu
  .mx_GenericDropdownMenu_Option.mx_GenericDropdownMenu_Option--item {
  padding-bottom: 4px;
  padding-top: 4px;
}
.mx_NetworkDropdown_wrapper
  .mx_ContextualMenu
  .mx_GenericDropdownMenu_Option.mx_GenericDropdownMenu_Option--item
  > .mx_GenericDropdownMenu_Option--label
  span:first-child {
  font-weight: 400;
}
.mx_NetworkDropdown_wrapper
  .mx_ContextualMenu
  .mx_GenericDropdownMenu_Option
  > .mx_GenericDropdownMenu_Option--label {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: baseline;
  -ms-flex-align: baseline;
  align-items: baseline;
  -ms-flex-line-pack: baseline;
  align-content: baseline;
  color: var(--cpd-color-text-primary);
}
.mx_NetworkDropdown_wrapper
  .mx_ContextualMenu
  .mx_GenericDropdownMenu_Option
  > .mx_GenericDropdownMenu_Option--label
  span:not(:first-child) {
  color: var(--cpd-color-text-secondary);
  margin-left: 4px;
}
.mx_NetworkDropdown_wrapper .mx_ContextualMenu .mx_GenericDropdownMenu_divider {
  margin-bottom: 4px;
  margin-top: 4px;
}
.mx_NetworkDropdown_addServer {
  font-size: 0.9375rem;
  font-weight: 400;
}
.mx_NetworkDropdown_removeServer {
  background: var(--cpd-color-gray-400);
  border-radius: 8px;
  color: var(--cpd-color-text-secondary);
  display: inline-block;
  height: 16px;
  line-height: 16px;
  margin-left: auto;
  position: relative;
  text-align: center;
  width: 16px;
}
.mx_NetworkDropdown_removeServer:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 8px;
  left: 50%;
  -webkit-mask-image: url(../../img/cancel-small.599ba74.svg);
  mask-image: url(../../img/cancel-small.599ba74.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 8px;
}
.mx_NetworkDropdown_dialog .mx_Dialog {
  width: 45vw;
}
.mx_AccessibleButton {
  cursor: pointer;
}
.mx_AccessibleButton.mx_AccessibleButton_disabled {
  cursor: not-allowed;
}
.mx_AccessibleButton.mx_AccessibleButton_disabled.mx_AccessibleButton_kind_content_inline,
.mx_AccessibleButton.mx_AccessibleButton_disabled.mx_AccessibleButton_kind_danger_inline,
.mx_AccessibleButton.mx_AccessibleButton_disabled.mx_AccessibleButton_kind_icon_primary,
.mx_AccessibleButton.mx_AccessibleButton_disabled.mx_AccessibleButton_kind_icon_primary_outline,
.mx_AccessibleButton.mx_AccessibleButton_disabled.mx_AccessibleButton_kind_link,
.mx_AccessibleButton.mx_AccessibleButton_disabled.mx_AccessibleButton_kind_link_accent,
.mx_AccessibleButton.mx_AccessibleButton_disabled.mx_AccessibleButton_kind_link_inline,
.mx_AccessibleButton.mx_AccessibleButton_disabled.mx_AccessibleButton_kind_link_sm,
.mx_AccessibleButton.mx_AccessibleButton_disabled.mx_AccessibleButton_kind_primary,
.mx_AccessibleButton.mx_AccessibleButton_disabled.mx_AccessibleButton_kind_primary_outline,
.mx_AccessibleButton.mx_AccessibleButton_disabled.mx_AccessibleButton_kind_primary_sm {
  opacity: 0.4;
}
.mx_AccessibleButton.mx_AccessibleButton_hasKind {
  border-radius: 24px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  padding: 7px 18px;
  text-align: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  border: none;
  font: var(--cpd-font-body-md-semibold);
  justify-content: center;
  word-break: keep-all;
}
.mx_AccessibleButton.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_danger_sm,
.mx_AccessibleButton.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_link_sm,
.mx_AccessibleButton.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_primary_sm {
  padding: 5px 12px;
}
.mx_AccessibleButton.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_primary_sm {
  background-color: var(--cpd-color-bg-action-primary-rest);
  color: var(--cpd-color-text-on-solid-primary);
}
.mx_AccessibleButton.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_danger_sm {
  background-color: var(--cpd-color-bg-critical-primary);
  color: var(--cpd-color-text-on-solid-primary);
}
.mx_AccessibleButton.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_link_sm {
  color: var(--cpd-color-text-primary);
  font-weight: var(--cpd-font-weight-semibold);
  text-decoration: underline;
}
.mx_AccessibleButton.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_confirm_sm {
  background-color: var(--cpd-color-bg-action-primary-rest);
}
.mx_AccessibleButton.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_confirm_sm:before {
  -webkit-mask-image: url(../../img/feather-customised/check.bfca953.svg);
  mask-image: url(../../img/feather-customised/check.bfca953.svg);
}
.mx_AccessibleButton.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_cancel_sm {
  background-color: var(--cpd-color-bg-critical-primary);
}
.mx_AccessibleButton.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_cancel_sm:before {
  -webkit-mask-image: url(../../img/feather-customised/x.c543757.svg);
  mask-image: url(../../img/feather-customised/x.c543757.svg);
}
.mx_AccessibleButton.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_icon,
.mx_AccessibleButton.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_icon_primary,
.mx_AccessibleButton.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_icon_primary_outline {
  height: 32px;
  padding: 0;
  width: 32px;
}
.mx_AccessibleButton.mx_AccessibleButton_kind_icon_primary,
.mx_AccessibleButton.mx_AccessibleButton_kind_icon_primary_outline,
.mx_AccessibleButton.mx_AccessibleButton_kind_primary,
.mx_AccessibleButton.mx_AccessibleButton_kind_primary_outline,
.mx_AccessibleButton.mx_AccessibleButton_kind_secondary {
  font-weight: var(--cpd-font-weight-semibold);
}
@media only screen and (max-width: 768px) {
  .mx_AccessibleButton.mx_AccessibleButton_kind_icon_primary,
  .mx_AccessibleButton.mx_AccessibleButton_kind_primary {
      background-color: green !important;
      border: 1px solid var(--cpd-color-bg-action-primary-rest);
      color: var(--cpd-color-text-on-solid-primary);
      margin: 0;
      width: 85%;
  }
}

.mx_AccessibleButton.mx_AccessibleButton_kind_icon_primary,
.mx_AccessibleButton.mx_AccessibleButton_kind_primary {
  background-color: var(--cpd-color-bg-action-primary-rest);
  border: 1px solid var(--cpd-color-bg-action-primary-rest);
  color: var(--cpd-color-text-on-solid-primary);
}
.mx_AccessibleButton.mx_AccessibleButton_kind_icon_primary_outline,
.mx_AccessibleButton.mx_AccessibleButton_kind_primary_outline {
  border: 1px solid var(--cpd-color-border-interactive-secondary);
  color: var(--cpd-color-text-primary);
}
.mx_AccessibleButton.mx_AccessibleButton_kind_secondary {
  color: var(--cpd-color-text-primary);
  text-decoration: underline;
}
.mx_AccessibleButton.mx_AccessibleButton_kind_secondary_content {
  color: var(--cpd-color-text-secondary);
}
.mx_AccessibleButton.mx_AccessibleButton_kind_danger,
.mx_AccessibleButton.mx_AccessibleButton_kind_danger.mx_AccessibleButton_disabled {
  background-color: var(--cpd-color-bg-critical-primary);
  color: var(--cpd-color-text-on-solid-primary);
}
.mx_AccessibleButton.mx_AccessibleButton_kind_danger_outline {
  background-color: transparent;
  border: 1px solid var(--cpd-color-border-critical-subtle);
  color: var(--cpd-color-text-critical-primary);
}
.mx_AccessibleButton.mx_AccessibleButton_kind_danger_outline.mx_AccessibleButton_disabled {
  border-color: var(--cpd-color-border-disabled);
  color: var(--cpd-color-text-disabled);
}
.mx_AccessibleButton.mx_AccessibleButton_kind_danger_sm.mx_AccessibleButton_disabled {
  background-color: var(--cpd-color-bg-subtle-primary);
  color: var(--cpd-color-text-disabled);
}
.mx_AccessibleButton.mx_AccessibleButton_kind_content_inline,
.mx_AccessibleButton.mx_AccessibleButton_kind_danger_inline,
.mx_AccessibleButton.mx_AccessibleButton_kind_link,
.mx_AccessibleButton.mx_AccessibleButton_kind_link_inline {
  font-size: inherit;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: inherit;
  padding: 0;
  text-decoration: underline;
}
.mx_AccessibleButton.mx_AccessibleButton_kind_link,
.mx_AccessibleButton.mx_AccessibleButton_kind_link_inline {
  color: var(--cpd-color-text-primary);
}
.mx_AccessibleButton.mx_AccessibleButton_kind_danger_inline {
  color: var(--cpd-color-text-critical-primary);
}
.mx_AccessibleButton.mx_AccessibleButton_kind_content_inline {
  color: var(--cpd-color-text-primary);
}
.mx_AccessibleButton.mx_AccessibleButton_kind_content_inline,
.mx_AccessibleButton.mx_AccessibleButton_kind_danger_inline,
.mx_AccessibleButton.mx_AccessibleButton_kind_link_inline {
  display: inline;
}
.mx_AccessibleButton.mx_AccessibleButton_kind_cancel_sm,
.mx_AccessibleButton.mx_AccessibleButton_kind_confirm_sm {
  border-radius: 100%;
  display: block;
  height: 16px;
  padding: 0;
  position: relative;
  width: 16px;
}
.mx_AccessibleButton.mx_AccessibleButton_kind_cancel_sm:before,
.mx_AccessibleButton.mx_AccessibleButton_kind_confirm_sm:before {
  background-color: #fff;
  content: "";
  display: block;
  inset: 0;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 80%;
  mask-size: 80%;
  position: absolute;
}
.mx_CopyableText {
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  max-width: 100%;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
.mx_CopyableText.mx_CopyableText_border {
  border: 1px solid #747474;
  border-radius: 5px;
  margin-bottom: 10px;
  margin-top: 10px;
  overflow: auto;
  padding: 10px 0 10px 10px;
}
.mx_CopyableText .mx_CopyableText_copyButton {
  -ms-flex-negative: 0;
  background-color: var(--cpd-color-bg-canvas-default);
  cursor: pointer;
  display: block;
  flex-shrink: 0;
  height: 1em;
  padding-left: 12px;
  padding-right: 10px;
  position: sticky;
  right: 0;
  top: 0.15em;
  width: 1em;
}
.mx_CopyableText .mx_CopyableText_copyButton:before {
  background-color: var(--cpd-color-text-primary);
  background-repeat: no-repeat;
  content: "";
  display: block;
  height: 1em;
  -webkit-mask-image: url(../../img/element-icons/copy.4ee219c.svg);
  mask-image: url(../../img/element-icons/copy.4ee219c.svg);
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  width: 1em;
}
.mx_desktopCapturerSourcePicker {
  overflow: hidden;
}
.mx_desktopCapturerSourcePicker .mx_desktopCapturerSourcePicker_tab {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  height: 500px;
  overflow: overlay;
}
.mx_desktopCapturerSourcePicker
  .mx_desktopCapturerSourcePicker_tab
  .mx_desktopCapturerSourcePicker_source {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 50%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_desktopCapturerSourcePicker
  .mx_desktopCapturerSourcePicker_tab
  .mx_desktopCapturerSourcePicker_source
  .mx_desktopCapturerSourcePicker_source_thumbnail {
  border: 2px solid transparent;
  border-radius: 8px;
  margin: 4px;
  padding: 4px;
}
.mx_desktopCapturerSourcePicker
  .mx_desktopCapturerSourcePicker_tab
  .mx_desktopCapturerSourcePicker_source
  .mx_desktopCapturerSourcePicker_source_thumbnail.mx_desktopCapturerSourcePicker_source_thumbnail_selected,
.mx_desktopCapturerSourcePicker
  .mx_desktopCapturerSourcePicker_tab
  .mx_desktopCapturerSourcePicker_source
  .mx_desktopCapturerSourcePicker_source_thumbnail:focus,
.mx_desktopCapturerSourcePicker
  .mx_desktopCapturerSourcePicker_tab
  .mx_desktopCapturerSourcePicker_source
  .mx_desktopCapturerSourcePicker_source_thumbnail:hover {
  border-color: var(--cpd-color-text-action-accent);
}
.mx_desktopCapturerSourcePicker
  .mx_desktopCapturerSourcePicker_tab
  .mx_desktopCapturerSourcePicker_source
  .mx_desktopCapturerSourcePicker_source_name {
  margin: 0 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_DialPadBackspaceButton {
  height: 28px;
  position: relative;
  width: 28px;
}
.mx_DialPadBackspaceButton:before {
  background-color: #8d97a5;
  content: "";
  display: inline-block;
  height: inherit;
  left: 0;
  -webkit-mask-image: url(../../img/element-icons/call/delete.1f69b87.svg);
  mask-image: url(../../img/element-icons/call/delete.1f69b87.svg);
  -webkit-mask-position: 8px;
  mask-position: 8px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  position: absolute;
  top: 0;
  vertical-align: middle;
  width: inherit;
}
.mx_Dropdown {
  color: var(--cpd-color-text-primary);
  position: relative;
}
.mx_Dropdown_disabled {
  opacity: 0.3;
}
.mx_Dropdown_input {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border: 1px solid var(--cpd-color-border-interactive-secondary);
  border-radius: 8px;
  font: var(--cpd-font-body-sm-regular);
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.mx_Dropdown_input.mx_AccessibleButton_disabled {
  cursor: not-allowed;
}
.mx_Dropdown_input:focus {
  border-color: var(--cpd-color-text-link-external);
}
.mx_Dropdown_input.mx_AccessibleButton:focus {
  -webkit-filter: none;
  filter: none;
}
.mx_Dropdown_arrow {
  background: var(--cpd-color-text-primary);
  height: 6px;
  -webkit-mask: url(../../img/feather-customised/dropdown-arrow.12f4aa5.svg);
  mask: url(../../img/feather-customised/dropdown-arrow.12f4aa5.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  padding-right: 9px;
  width: 10px;
}
.mx_Dropdown_option {
  height: 35px;
  line-height: 2.1875rem;
  padding: 0 8px;
}
.mx_Dropdown_input > .mx_Dropdown_option {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  -webkit-box-flex: 1;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_Dropdown_option div {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_Dropdown_option .mx_Dropdown_option_emoji,
.mx_Dropdown_option img {
  margin: 5px;
  vertical-align: middle;
  width: 16px;
}
.mx_Dropdown_option_emoji {
  font-size: 1rem;
  line-height: 1rem;
}
input.mx_Dropdown_option,
input.mx_Dropdown_option:focus {
  border: 0;
  font-weight: 400;
  padding-bottom: 0;
  padding-top: 0;
  width: 60%;
}
.mx_Dropdown_menu {
  background-color: var(--cpd-color-bg-canvas-default);
  border: 1px solid var(--cpd-color-text-link-external);
  border-radius: 4px;
  left: -1px;
  margin: 0;
  max-height: 200px;
  overflow-y: auto;
  padding: 0;
  position: absolute;
  right: -1px;
  top: 100%;
  z-index: 2;
}
.mx_Dropdown_menu .mx_Dropdown_option {
  height: auto;
  min-height: 35px;
}
ul.mx_Dropdown_menu li.mx_Dropdown_option {
  list-style: none;
}
.mx_Dropdown_menu .mx_Dropdown_option_highlight {
  background-color: var(--cpd-color-bg-subtle-primary);
}
.mx_Dropdown_searchPrompt {
  font-weight: 400;
  margin-bottom: 5px;
  margin-left: 5px;
}
.mx_EditableItemList {
  margin-bottom: 10px;
  margin-top: 12px;
}
.mx_EditableItem {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 5px;
}
.mx_EditableItem_delete {
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 14px;
  cursor: pointer;
  height: 28px;
  position: relative;
  width: 28px;
}
.mx_EditableItem_delete:hover {
  background-color: var(--cpd-color-bg-subtle-primary);
}
.mx_EditableItem_delete:before {
  background-color: var(--cpd-color-icon-secondary);
  content: "";
  height: 28px;
  -webkit-mask-image: url(../../icons/close.dce71fd.svg);
  mask-image: url(../../icons/close.dce71fd.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  position: absolute;
  width: 28px;
}
.mx_EditableItem_delete {
  -webkit-box-ordinal-group: 4;
  -ms-flex-order: 3;
  background-color: var(--cpd-color-text-critical-primary);
  height: 14px;
  margin-right: 5px;
  -webkit-mask-size: 100%;
  mask-size: 100%;
  order: 3;
  vertical-align: middle;
  width: 14px;
}
.mx_EditableItem_email {
  vertical-align: middle;
}
.mx_EditableItem_promptText {
  margin-right: 10px;
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
}
.mx_EditableItem_confirmBtn {
  margin-right: 5px;
}
.mx_EditableItem_item {
  -webkit-box-flex: 1;
  -ms-flex: auto 1 0px;
  flex: auto 1 0;
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1;
  overflow-x: hidden;
  text-overflow: ellipsis;
  width: calc(100% - 14px);
}
.mx_EditableItemList_label {
  margin-bottom: 5px;
}
.mx_ErrorBoundary {
  height: 100%;
  width: 100%;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_ErrorBoundary,
.mx_ErrorBoundary_body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_ErrorBoundary_body {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  max-width: 400px;
}
.mx_ErrorBoundary_body .mx_AccessibleButton {
  margin-top: 5px;
}
.mx_ExternalLink {
  color: var(--cpd-color-text-link-external);
}
.mx_ExternalLink_icon {
  background-color: currentColor;
  display: inline-block;
  height: 0.6875rem;
  margin-left: 0.3rem;
  -webkit-mask-image: url(../../img/external-link.8197a77.svg);
  mask-image: url(../../img/external-link.8197a77.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  vertical-align: middle;
  width: 0.6875rem;
}
.mx_FacePile_more {
  --cpd-avatar-size: 28px;
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 100%;
  display: inline-block;
  height: 28px;
  position: relative;
  width: 28px;
}
.mx_FacePile_more:before {
  background: var(--cpd-color-gray-800);
  content: "";
  height: inherit;
  left: 0;
  -webkit-mask-image: url(../../img/element-icons/room/ellipsis.c7bfee4.svg);
  mask-image: url(../../img/element-icons/room/ellipsis.c7bfee4.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  position: absolute;
  top: 0;
  width: inherit;
  z-index: 1;
}
.mx_FacePile_summary {
  color: var(--cpd-color-gray-800);
  font: var(--cpd-font-body-md-regular);
  line-height: 1.5rem;
  margin-left: 12px;
}
.mx_Field {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  border: 1px solid var(--cpd-color-border-interactive-secondary);
  border-radius: 8px;
  -ms-flex: 1;
  flex: 1;
  margin: 0.5em 0;
  min-width: 0;
  position: relative;
  -webkit-transition: border-color 0.25s;
  transition: border-color 0.25s;
}
.form{
  display: flex !important;
}
.mx_Field_prefix {
  border-right: 1px solid var(--cpd-color-border-interactive-secondary);
}
.mx_Field_postfix {
  border-left: 1px solid var(--cpd-color-border-interactive-secondary);
}
.mx_Field input,
.mx_Field select,
.mx_Field textarea {
  background-color: var(--cpd-color-bg-canvas-default);
  border: none;
  border-radius: 8px;
  color: var(--cpd-color-text-primary);
  font: var(--cpd-font-body-md-regular);
  padding: 8px 9px;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-width: 0;
}
.mx_Field select {
  -moz-appearance: none;
  -webkit-appearance: none;
  text-overflow: ellipsis;
}
.mx_Field_select:before {
  background-color: var(--cpd-color-text-primary);
  content: "";
  height: 6px;
  -webkit-mask: url(../../img/feather-customised/dropdown-arrow.12f4aa5.svg);
  mask: url(../../img/feather-customised/dropdown-arrow.12f4aa5.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  pointer-events: none;
  position: absolute;
  right: 10px;
  top: 15px;
  width: 10px;
  z-index: 1;
}
.mx_Field:focus-within {
  border-color: var(--cpd-color-text-link-external);
}
.mx_Field input:focus,
.mx_Field select:focus,
.mx_Field textarea:focus {
  outline: 0;
}
.mx_Field input::-webkit-input-placeholder,
.mx_Field textarea::-webkit-input-placeholder {
  color: transparent;
  -webkit-transition: color 0.25s ease-in 0s;
  transition: color 0.25s ease-in 0s;
}
.mx_Field input::-moz-placeholder,
.mx_Field textarea::-moz-placeholder {
  color: transparent;
  -moz-transition: color 0.25s ease-in 0s;
  transition: color 0.25s ease-in 0s;
}
.mx_Field input:-ms-input-placeholder,
.mx_Field textarea:-ms-input-placeholder {
  color: transparent;
  -ms-transition: color 0.25s ease-in 0s;
  transition: color 0.25s ease-in 0s;
}
.mx_Field input::-ms-input-placeholder,
.mx_Field textarea::-ms-input-placeholder {
  color: transparent;
  -ms-transition: color 0.25s ease-in 0s;
  transition: color 0.25s ease-in 0s;
}
.mx_Field input::placeholder,
.mx_Field textarea::placeholder {
  color: transparent;
  -webkit-transition: color 0.25s ease-in 0s;
  transition: color 0.25s ease-in 0s;
}
.mx_Field input:placeholder-shown:focus::-webkit-input-placeholder,
.mx_Field textarea:placeholder-shown:focus::-webkit-input-placeholder,
.mx_Field.mx_Field_placeholderIsHint input::-webkit-input-placeholder {
  color: var(--cpd-color-gray-900);
  -webkit-transition: color 0.25s ease-in 0.1s;
  transition: color 0.25s ease-in 0.1s;
}
.mx_Field input:placeholder-shown:focus::-moz-placeholder,
.mx_Field textarea:placeholder-shown:focus::-moz-placeholder,
.mx_Field.mx_Field_placeholderIsHint input::-moz-placeholder {
  color: var(--cpd-color-gray-900);
  -moz-transition: color 0.25s ease-in 0.1s;
  transition: color 0.25s ease-in 0.1s;
}
.mx_Field input:placeholder-shown:focus:-ms-input-placeholder,
.mx_Field textarea:placeholder-shown:focus:-ms-input-placeholder,
.mx_Field.mx_Field_placeholderIsHint input:-ms-input-placeholder {
  color: var(--cpd-color-gray-900);
  -ms-transition: color 0.25s ease-in 0.1s;
  transition: color 0.25s ease-in 0.1s;
}
.mx_Field input:placeholder-shown:focus::-ms-input-placeholder,
.mx_Field textarea:placeholder-shown:focus::-ms-input-placeholder,
.mx_Field.mx_Field_placeholderIsHint input::-ms-input-placeholder {
  color: var(--cpd-color-gray-900);
  -ms-transition: color 0.25s ease-in 0.1s;
  transition: color 0.25s ease-in 0.1s;
}
.mx_Field input:-moz-placeholder-shown:focus::placeholder,
.mx_Field textarea:-moz-placeholder-shown:focus::placeholder {
  color: var(--cpd-color-gray-900);
  -moz-transition: color 0.25s ease-in 0.1s;
  transition: color 0.25s ease-in 0.1s;
}
.mx_Field input:-ms-input-placeholder:focus::placeholder,
.mx_Field textarea:-ms-input-placeholder:focus::placeholder {
  color: var(--cpd-color-gray-900);
  -ms-transition: color 0.25s ease-in 0.1s;
  transition: color 0.25s ease-in 0.1s;
}
.mx_Field input:placeholder-shown:focus::placeholder,
.mx_Field textarea:placeholder-shown:focus::placeholder,
.mx_Field.mx_Field_placeholderIsHint input::placeholder {
  color: var(--cpd-color-gray-900);
  -webkit-transition: color 0.25s ease-in 0.1s;
  transition: color 0.25s ease-in 0.1s;
}
.mx_Field label {
  background-color: transparent;
  color: var(--cpd-color-text-secondary);
  font: var(--cpd-font-body-md-regular);
  left: 0;
  margin: 7px 8px;
  max-width: calc(100% - 20px);
  overflow: hidden;
  padding: 2px;
  pointer-events: none;
  position: absolute;
  text-overflow: ellipsis;
  -webkit-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: font-size 0.25s ease-out 0.1s, color 0.25s ease-out 0.1s,
    background-color 0.25s ease-out 0.1s, -webkit-transform 0.25s ease-out 0.1s;
  transition: font-size 0.25s ease-out 0.1s, color 0.25s ease-out 0.1s,
    background-color 0.25s ease-out 0.1s, -webkit-transform 0.25s ease-out 0.1s;
  transition: font-size 0.25s ease-out 0.1s, color 0.25s ease-out 0.1s,
    transform 0.25s ease-out 0.1s, background-color 0.25s ease-out 0.1s;
  transition: font-size 0.25s ease-out 0.1s, color 0.25s ease-out 0.1s,
    transform 0.25s ease-out 0.1s, background-color 0.25s ease-out 0.1s,
    -webkit-transform 0.25s ease-out 0.1s;
  white-space: nowrap;
}
.mx_Field input:not(:-moz-placeholder-shown) + label,
.mx_Field textarea:not(:-moz-placeholder-shown) + label {
  background-color: var(--cpd-color-bg-canvas-default);
  font-size: 0.625rem;
  padding: 0 2px;
  pointer-events: auto;
  transform: translateY(-13px);
  -moz-transition: font-size 0.25s ease-out 0s, color 0.25s ease-out 0s,
    transform 0.25s ease-out 0s, background-color 0.25s ease-out 0s;
  transition: font-size 0.25s ease-out 0s, color 0.25s ease-out 0s,
    transform 0.25s ease-out 0s, background-color 0.25s ease-out 0s;
}
.mx_Field input:not(:-ms-input-placeholder) + label,
.mx_Field textarea:not(:-ms-input-placeholder) + label {
  background-color: var(--cpd-color-bg-canvas-default);
  font-size: 0.625rem;
  padding: 0 2px;
  pointer-events: auto;
  transform: translateY(-13px);
  -ms-transition: font-size 0.25s ease-out 0s, color 0.25s ease-out 0s,
    transform 0.25s ease-out 0s, background-color 0.25s ease-out 0s;
  transition: font-size 0.25s ease-out 0s, color 0.25s ease-out 0s,
    transform 0.25s ease-out 0s, background-color 0.25s ease-out 0s;
}
.mx_Field input:focus + label,
.mx_Field input:not(:placeholder-shown) + label,
.mx_Field select + label,
.mx_Field textarea:focus + label,
.mx_Field textarea:not(:placeholder-shown) + label,
.mx_Field_labelAlwaysTopLeft label {
  background-color: var(--cpd-color-bg-canvas-default);
  font-size: 0.625rem;
  padding: 0 2px;
  pointer-events: auto;
  -webkit-transform: translateY(-13px);
  transform: translateY(-13px);
  -webkit-transition: font-size 0.25s ease-out 0s, color 0.25s ease-out 0s,
    background-color 0.25s ease-out 0s, -webkit-transform 0.25s ease-out 0s;
  transition: font-size 0.25s ease-out 0s, color 0.25s ease-out 0s,
    background-color 0.25s ease-out 0s, -webkit-transform 0.25s ease-out 0s;
  transition: font-size 0.25s ease-out 0s, color 0.25s ease-out 0s,
    transform 0.25s ease-out 0s, background-color 0.25s ease-out 0s;
  transition: font-size 0.25s ease-out 0s, color 0.25s ease-out 0s,
    transform 0.25s ease-out 0s, background-color 0.25s ease-out 0s,
    -webkit-transform 0.25s ease-out 0s;
}
.mx_Field input:focus + label,
.mx_Field select:focus + label,
.mx_Field textarea:focus + label {
  color: var(--cpd-color-text-link-external);
}
.mx_Field input:disabled,
.mx_Field input:disabled + label,
.mx_Field select:disabled,
.mx_Field select:disabled + label,
.mx_Field textarea:disabled,
.mx_Field textarea:disabled + label {
  background-color: var(--cpd-color-bg-canvas-default);
  color: var(--cpd-color-gray-900);
}
.mx_Field_valid.mx_Field,
.mx_Field_valid.mx_Field:focus-within {
  border-color: var(--cpd-color-text-action-accent);
}
.mx_Field_valid.mx_Field label,
.mx_Field_valid.mx_Field:focus-within label {
  color: var(--cpd-color-text-action-accent);
}
.mx_Field_invalid.mx_Field,
.mx_Field_invalid.mx_Field:focus-within {
  border-color: var(--cpd-color-text-critical-primary);
}
.mx_Field_invalid.mx_Field label,
.mx_Field_invalid.mx_Field:focus-within label {
  color: var(--cpd-color-text-critical-primary);
}
.mx_Field_tooltip {
  width: 200px;
}
.mx_Field_tooltip.mx_Field_valid {
  -webkit-animation: mx_fadeout 1s 2s forwards;
  animation: mx_fadeout 1s 2s forwards;
}
.mx_Field .mx_Dropdown_input {
  border: initial;
  border-radius: 0;
  border-radius: initial;
}
.mx_Field .mx_CountryDropdown {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.mx_GenericEventListSummary {
  position: relative;
}
.mx_GenericEventListSummary .mx_GenericEventListSummary_avatars {
  margin-right: 8px;
}
.mx_GenericEventListSummary .mx_GenericEventListSummary_spacer {
  border-bottom: 1px solid transparent;
  line-height: 1.875rem;
  margin-left: 63px;
}
.mx_IRCLayout .mx_GenericEventListSummary .mx_GenericEventListSummary_spacer {
  line-height: var(--line-height);
}
.mx_GenericEventListSummary .mx_GenericEventListSummary_toggle {
  text-transform: lowercase;
}
.mx_GenericEventListSummary[data-layout="bubbles"]
  .mx_GenericEventListSummary_toggle,
.mx_GenericEventListSummary[data-layout="irc"]
  .mx_GenericEventListSummary_toggle {
  float: right;
  margin-inline: 0 10px;
}
.mx_GenericEventListSummary[data-layout="bubbles"] {
  margin-top: 8px;
}
.mx_GenericEventListSummary[data-layout="bubble"] {
  --maxWidth: 70%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-left: calc(var(--avatarSize) + var(--gutterSize));
}
.mx_GenericEventListSummary[data-layout="bubble"]
  .mx_GenericEventListSummary_toggle {
  margin-block: 0;
}
.mx_GenericEventListSummary[data-layout="bubble"]
  .mx_GenericEventListSummary_toggle[aria-expanded="false"] {
  -webkit-box-ordinal-group: 10;
  -ms-flex-order: 9;
  order: 9;
}
.mx_GenericEventListSummary[data-layout="bubble"]
  .mx_GenericEventListSummary_toggle[aria-expanded="true"] {
  -webkit-margin-start: auto;
  margin-inline-start: auto;
  -webkit-margin-end: var(--EventTile_bubble-margin-inline-end);
  margin-inline-end: var(--EventTile_bubble-margin-inline-end);
}
.mx_GenericEventListSummary[data-layout="bubble"]
  .mx_GenericEventListSummary_spacer {
  display: none;
}
.mx_GenericEventListSummary[data-layout="bubble"][data-expanded="false"] {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-column-gap: 5px;
  -moz-column-gap: 5px;
  column-gap: 5px;
  justify-content: space-between;
}
.mx_GenericEventListSummary[data-layout="bubble"][data-expanded="true"] {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin: 0;
}
.mx_GenericEventListSummary[data-layout="bubble"]:after {
  clear: both;
  content: "";
}
.mx_GenericEventListSummary[data-layout="bubble"]:hover:before {
  background: transparent;
}
.mx_MatrixChat_useCompactLayout .mx_GenericEventListSummary {
  font-size: 0.8125rem;
  margin-top: 4px;
}
.mx_MatrixChat_useCompactLayout .mx_GenericEventListSummary .mx_EventTile_line {
  line-height: 1.25;
}
.mx_MatrixChat_useCompactLayout
  .mx_GenericEventListSummary
  .mx_GenericEventListSummary_spacer {
  line-height: 1.375;
}
.mx_MatrixChat_useCompactLayout
  .mx_GenericEventListSummary
  .mx_TextualEvent.mx_GenericEventListSummary_summary {
  font: var(--cpd-font-body-sm-regular);
  font-size: 0.7rem;
}
.mx_GenericEventListSummary .mx_EventTile {
  color: var(--cpd-color-text-secondary);
  font: var(--cpd-font-body-sm-regular);
}
.mx_GenericEventListSummary_unstyledList {
  list-style: none;
  padding: 0;
}
.mx_TextualEvent.mx_GenericEventListSummary_summary {
  color: var(--cpd-color-text-secondary);
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  font: var(--cpd-font-body-sm-regular);
  font-size: 0.7rem !important; 
}
.mx_GenericEventListSummary_avatars {
  display: inline-block;
  line-height: 0.75rem;
}
.mx_GenericEventListSummary_avatars .mx_BaseAvatar {
  cursor: pointer;
  margin-right: -4px;
}
:root {
  --image-view-panel-height: 68px;
}
.mx_ImageView {
  width: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_ImageView,
.mx_ImageView_image_wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
}
.mx_ImageView_image_wrapper {
  pointer-events: auto;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  overflow: hidden;
}
.mx_ImageView_image {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_ImageView_image.mx_ImageView_image_animating {
  -webkit-transition: -webkit-transform 0.2s ease 0s;
  transition: -webkit-transform 0.2s ease 0s;
  transition: transform 0.2s ease 0s;
  transition: transform 0.2s ease 0s, -webkit-transform 0.2s ease 0s;
}
.mx_ImageView_image.mx_ImageView_image_animatingLoading {
  -webkit-transition: -webkit-transform 0.3s ease 0s;
  transition: -webkit-transform 0.3s ease 0s;
  transition: transform 0.3s ease 0s;
  transition: transform 0.3s ease 0s, -webkit-transform 0.3s ease 0s;
}
.mx_ImageView_panel {
  height: 68px;
  height: var(--image-view-panel-height);
  width: 100%;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-name: mx_ImageView_panel_keyframes;
  animation-name: mx_ImageView_panel_keyframes;
  justify-content: space-between;
}
.mx_ImageView_info_wrapper,
.mx_ImageView_panel {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_ImageView_info_wrapper {
  padding-left: 32px;
  pointer-events: auto;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  color: #fff;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
}
.mx_ImageView_info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-left: 12px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_ImageView_info_sender {
  font-weight: 700;
}
.mx_ImageView_title {
  color: #fff;
  font-size: 0.75rem;
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  text-align: center;
}
.mx_ImageView_title,
.mx_ImageView_toolbar {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
.mx_ImageView_toolbar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-right: 16px;
  pointer-events: auto;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  gap: 14px;
  justify-content: flex-end;
}
.mx_ImageView_button {
  display: block;
  padding: 5px;
}
.mx_ImageView_button:before {
  background-color: var(--cpd-color-icon-tertiary);
  content: "";
  display: block;
  height: 22px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  width: 22px;
}
.mx_ImageView_button_rotateCW:before {
  -webkit-mask-image: url(../../img/image-view/rotate-cw.22a8e66.svg);
  mask-image: url(../../img/image-view/rotate-cw.22a8e66.svg);
}
.mx_ImageView_button_rotateCCW:before {
  -webkit-mask-image: url(../../img/image-view/rotate-ccw.bc1b65b.svg);
  mask-image: url(../../img/image-view/rotate-ccw.bc1b65b.svg);
}
.mx_ImageView_button_zoomOut:before {
  -webkit-mask-image: url(../../img/image-view/zoom-out.4a741a1.svg);
  mask-image: url(../../img/image-view/zoom-out.4a741a1.svg);
}
.mx_ImageView_button_zoomIn:before {
  -webkit-mask-image: url(../../img/image-view/zoom-in.714cc54.svg);
  mask-image: url(../../img/image-view/zoom-in.714cc54.svg);
}
.mx_ImageView_button_download:before {
  -webkit-mask-image: url(../../img/image-view/download.e1f4f96.svg);
  mask-image: url(../../img/image-view/download.e1f4f96.svg);
}
.mx_ImageView_button_more:before {
  -webkit-mask-image: url(../../img/image-view/more.6adb72c.svg);
  mask-image: url(../../img/image-view/more.6adb72c.svg);
}
.mx_ImageView_button_close {
  background: #21262c;
  border-radius: 100%;
  padding: 0;
}
.mx_ImageView_button_close:before {
  height: 32px;
  -webkit-mask-image: url(../../img/image-view/close.c2af4a8.svg);
  mask-image: url(../../img/image-view/close.c2af4a8.svg);
  -webkit-mask-size: 40%;
  mask-size: 40%;
  width: 32px;
}
@media (prefers-reduced-motion) {
  .mx_ImageView_image_animating,
  .mx_ImageView_image_animatingLoading {
    -webkit-transition: none !important;
    transition: none !important;
  }
}
.mx_InfoTooltip_icon {
  display: inline-block;
  height: 16px;
  width: 16px;
}
.mx_InfoTooltip_icon:before {
  background-color: #61708b;
  content: "";
  display: inline-block;
  height: 16px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 16px;
  mask-size: 16px;
  vertical-align: middle;
  width: 16px;
}
.mx_InfoTooltip_icon_info:before {
  -webkit-mask-image: url(../../img/element-icons/info.1d7ac3e.svg);
  mask-image: url(../../img/element-icons/info.1d7ac3e.svg);
}
.mx_InfoTooltip_icon_warning:before {
  -webkit-mask-image: url(../../img/element-icons/warning.af4c54e.svg);
  mask-image: url(../../img/element-icons/warning.af4c54e.svg);
}
.mx_InlineSpinner {
  display: inline;
}
.mx_InlineSpinner img,
.mx_InlineSpinner_icon {
  margin: 0 6px;
  vertical-align: -3px;
}
.mx_InlineSpinner_icon {
  display: inline-block !important;
}
.mx_InteractiveTooltip_wrapper {
  position: fixed;
  z-index: 3999;
}
.mx_InteractiveTooltip {
  background-color: var(--cpd-color-bg-canvas-default);
  border-radius: 8px;
  -webkit-box-shadow: 0 24px 8px rgb(17 17 26/4%), 0 8px 32px rgb(17 17 26/4%);
  box-shadow: 0 24px 8px rgb(17 17 26/4%), 0 8px 32px rgb(17 17 26/4%);
  color: var(--cpd-color-text-primary);
  position: absolute;
  z-index: 5001;
}
.mx_InteractiveTooltip.mx_InteractiveTooltip_withChevron_top {
  top: 10px;
}
.mx_InteractiveTooltip.mx_InteractiveTooltip_withChevron_left {
  left: 10px;
}
.mx_InteractiveTooltip.mx_InteractiveTooltip_withChevron_right {
  right: 10px;
}
.mx_InteractiveTooltip.mx_InteractiveTooltip_withChevron_bottom {
  bottom: 10px;
}
.mx_InteractiveTooltip_chevron_top {
  border-bottom: 8px solid var(--cpd-color-bg-canvas-default);
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  height: 0;
  left: calc(50% - 8px);
  position: absolute;
  top: -8px;
  width: 0;
}
@supports (clip-path: polygon(0% 0%, 100% 100%, 0% 100%)) {
  .mx_InteractiveTooltip_chevron_top {
    background-color: inherit;
    border: none;
    border-radius: 0 0 0 3px;
    clip-path: polygon(0 0, 100% 100%, 0 100%);
    height: 16px;
    top: -5.65771px;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    width: 16px;
  }
}
.mx_InteractiveTooltip_chevron_bottom {
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid var(--cpd-color-bg-canvas-default);
  bottom: -8px;
  height: 0;
  left: calc(50% - 8px);
  position: absolute;
  width: 0;
}
@supports (clip-path: polygon(0% 0%, 100% 100%, 0% 100%)) {
  .mx_InteractiveTooltip_chevron_bottom {
    background-color: inherit;
    border: none;
    border-radius: 0 0 0 3px;
    bottom: -5.65771px;
    clip-path: polygon(0 0, 100% 100%, 0 100%);
    height: 16px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    width: 16px;
  }
}
.mx_InviteReason {
  margin-bottom: 1em;
  position: relative;
}
.mx_InviteReason .mx_InviteReason_reason {
  visibility: visible;
}
.mx_InviteReason .mx_InviteReason_view {
  display: none;
  inset: 0;
  position: absolute;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-secondary);
  cursor: pointer;
}
.mx_InviteReason .mx_InviteReason_view:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  display: inline-block;
  height: 14px;
  margin-right: 8px;
  -webkit-mask-image: url(../../img/feather-customised/eye.d8df60a.svg);
  mask-image: url(../../img/feather-customised/eye.d8df60a.svg);
  width: 18px;
}
.mx_InviteReason_hidden .mx_InviteReason_reason {
  visibility: hidden;
}
.mx_InviteReason_hidden .mx_InviteReason_view,
.mx_LabelledCheckbox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_LabelledCheckbox {
  gap: 8px;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
}
.mx_LabelledCheckbox .mx_Checkbox {
  margin-top: 3px;
}
.mx_LabelledCheckbox .mx_LabelledCheckbox_labels {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_LabelledCheckbox .mx_LabelledCheckbox_labels .mx_LabelledCheckbox_label {
  vertical-align: middle;
}
.mx_LabelledCheckbox .mx_LabelledCheckbox_labels .mx_LabelledCheckbox_byline {
  color: #61708b;
  display: block;
  font-size: 0.6875rem;
  padding-top: 4px;
}
.mx_LanguageDropdown .mx_Dropdown_option > div {
  text-transform: capitalize;
}
.mx_MiniAvatarUploader {
  position: relative;
  width: -webkit-min-content;
  width: -moz-min-content;
  width: min-content;
}
.mx_MiniAvatarUploader .mx_Tooltip {
  display: inline-block;
  left: 72px;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  z-index: auto;
}
.mx_MiniAvatarUploader .mx_MiniAvatarUploader_indicator {
  background-color: var(--cpd-color-bg-canvas-default);
  border-radius: 50%;
  bottom: -6px;
  height: 26px;
  line-height: 0;
  position: absolute;
  right: -6px;
  width: 26px;
  z-index: 1;
}
.mx_MiniAvatarUploader
  .mx_MiniAvatarUploader_indicator
  .mx_MiniAvatarUploader_cameraIcon {
  background-color: var(--cpd-color-text-secondary);
  height: 100%;
  -webkit-mask-image: url(../../img/element-icons/camera.d1d1927.svg);
  mask-image: url(../../img/element-icons/camera.d1d1927.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 16px;
  mask-size: 16px;
  width: 100%;
  z-index: 2;
}
.mx_MiniAvatarUploader_input {
  display: none;
}
.mx_Pill {
  border-radius: 1rem;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  line-height: 1.0625rem;
  padding: 0.0625rem 0.4em;
  vertical-align: text-top;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: var(--cpd-color-bg-action-primary-rest) !important;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: var(--cpd-color-text-on-solid-primary) !important;
  cursor: pointer;
  max-width: 100%;
  overflow: hidden;
}
.mx_Pill > * {
  pointer-events: none;
}
.mx_Pill.mx_AtRoomPill,
.mx_Pill.mx_UserPill_me {
  background-color: var(--cpd-color-bg-critical-primary) !important;
}
.mx_Pill:hover {
  background-color: var(--cpd-color-bg-action-primary-hovered) !important;
}
.mx_Pill:active {
  background-color: var(--cpd-color-bg-action-primary-pressed) !important;
}
.mx_Pill.mx_UserPill_me:hover {
  background-color: var(--cpd-color-bg-critical-hovered) !important;
}
.mx_Pill.mx_AtRoomPill:hover {
  background-color: var(--cpd-color-bg-critical-primary) !important;
  cursor: inherit;
}
.mx_Pill .mx_BaseAvatar,
.mx_Pill:before {
  -webkit-margin-start: -0.3em;
  margin-inline-start: -0.3em;
  -webkit-margin-end: 0.2em;
  margin-inline-end: 0.2em;
  min-width: 1rem;
}
.mx_Pill .mx_Pill_text {
  min-width: 0;
}
.mx_Pill .mx_Pill_text,
a.mx_Pill {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
a.mx_Pill {
  text-decoration: none !important;
}
.mx_Pill .mx_Pill_LinkIcon {
  background-color: var(--cpd-color-text-link-external);
  border-radius: 50%;
  color: var(--cpd-color-bg-canvas-default);
  padding: 1px;
}
.mx_Pill .mx_Pill_LinkIcon,
.mx_Pill .mx_Pill_UserIcon {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 16px;
  width: 16px;
}
.mx_Pill .mx_Pill_UserIcon {
  color: var(--cpd-color-text-secondary);
}
.mx_Pill.mx_SpacePill {
  border-bottom-left-radius: 8px;
  border-top-left-radius: 8px;
  padding-left: 4px;
}
.mx_PowerSelector {
  width: 100%;
}
.mx_PowerSelector .mx_Field input,
.mx_PowerSelector .mx_Field select {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
progress.mx_ProgressBar {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: var(--cpd-border-width-1) solid var(--cpd-color-gray-400);
  border-radius: 6px;
  height: 6px;
  overflow: hidden;
  width: 60px;
}
progress.mx_ProgressBar::-moz-progress-bar {
  border-radius: 6px;
}
progress.mx_ProgressBar::-webkit-progress-bar,
progress.mx_ProgressBar::-webkit-progress-value {
  border-radius: 6px;
}
progress.mx_ProgressBar {
  color: var(--cpd-color-icon-accent-tertiary);
}
progress.mx_ProgressBar::-moz-progress-bar {
  background-color: var(--cpd-color-icon-accent-tertiary);
}
progress.mx_ProgressBar::-webkit-progress-value {
  background-color: var(--cpd-color-icon-accent-tertiary);
}
progress.mx_ProgressBar {
  background-color: var(--cpd-color-gray-200);
}
progress.mx_ProgressBar::-webkit-progress-bar {
  background-color: var(--cpd-color-gray-200);
}
progress.mx_ProgressBar ::-webkit-progress-value {
  -webkit-transition: width 1s;
  transition: width 1s;
}
progress.mx_ProgressBar ::-moz-progress-bar {
  height: 0;
  padding-bottom: var(--value);
  padding-left: 15px;
  transform: rotate(-90deg) translateX(-15px);
  transform-origin: 0 0;
  -moz-transition: padding-bottom 1s;
  transition: padding-bottom 1s;
}
.mx_QRCode img {
  border-radius: 8px;
}
.mx_ReplyChain {
  border-left: 2px solid var(--username-color);
  border-radius: 2px;
  margin: 0;
  padding-left: 10px;
}
.mx_ReplyChain .mx_ReplyChain_show.mx_AccessibleButton_kind_link_inline {
  color: var(--cpd-color-text-secondary);
  font-weight: var(--cpd-font-weight-normal);
  text-decoration: inherit;
  -webkit-transition: color 0.15s ease;
  transition: color 0.15s ease;
  white-space: nowrap;
}
.mx_ReplyChain .mx_ReplyChain_show.mx_AccessibleButton_kind_link_inline:hover {
  color: var(--cpd-color-text-primary);
}
.mx_ReplyChain.mx_ReplyChain_color1 {
  --username-color: var(--cpd-color-text-decorative-1);
}
.mx_ReplyChain.mx_ReplyChain_color2 {
  --username-color: var(--cpd-color-text-decorative-2);
}
.mx_ReplyChain.mx_ReplyChain_color3 {
  --username-color: var(--cpd-color-text-decorative-3);
}
.mx_ReplyChain.mx_ReplyChain_color4 {
  --username-color: var(--cpd-color-text-decorative-4);
}
.mx_ReplyChain.mx_ReplyChain_color5 {
  --username-color: var(--cpd-color-text-decorative-5);
}
.mx_ReplyChain.mx_ReplyChain_color6 {
  --username-color: var(--cpd-color-text-decorative-6);
}
.mx_ResizeHandle {
  cursor: row-resize;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  z-index: 100;
}
.mx_ResizeHandle.mx_ResizeHandle--horizontal {
  cursor: col-resize;
  margin: 0 -5px;
  padding: 0 5px;
  display:flex
}
.mx_ResizeHandle.mx_ResizeHandle--horizontal > div {
  height: 100%;
  width: 1px;
}
.mx_ResizeHandle.mx_ResizeHandle--vertical {
  margin: -5px 0;
  padding: 5px 0;
}
.mx_ResizeHandle.mx_ResizeHandle--vertical > div {
  height: 1px;
}
.mx_Markdown_BOLD {
  font-weight: 700;
}
.mx_Markdown_ITALIC {
  font-style: italic;
}
.mx_Markdown_CODE {
  background-color: rgba(0, 0, 0, 0.04);
  border-radius: 3px;
  font-size: 85%;
  margin: 0;
  padding: 0.2em 0;
}
.mx_Markdown_HR {
  background: #e9e9e9;
  display: block;
}
.mx_Markdown_STRIKETHROUGH {
  text-decoration: line-through;
}
.mx_Emoji {
  font-size: max(1.125rem, 1em);
  vertical-align: bottom;
}
.mx_RoomAliasField {
  -webkit-box-flex: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  max-width: 100%;
  min-width: 0;
}
.mx_RoomAliasField input {
  padding-left: 0;
  padding-right: 0;
  width: 150px;
}
.mx_RoomAliasField input::-webkit-input-placeholder {
  color: var(--cpd-color-gray-900);
  font-weight: 400;
}
.mx_RoomAliasField input::-moz-placeholder {
  color: var(--cpd-color-gray-900);
  font-weight: 400;
}
.mx_RoomAliasField input:-ms-input-placeholder {
  color: var(--cpd-color-gray-900);
  font-weight: 400;
}
.mx_RoomAliasField input::-ms-input-placeholder {
  color: var(--cpd-color-gray-900);
  font-weight: 400;
}
.mx_RoomAliasField input::placeholder {
  color: var(--cpd-color-gray-900);
  font-weight: 400;
}
.mx_RoomAliasField .mx_Field_postfix,
.mx_RoomAliasField .mx_Field_prefix {
  border-left: none;
  border-right: none;
  color: var(--cpd-color-gray-900);
  font-weight: var(--cpd-font-weight-semibold);
  padding: 9px 10px;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
}
.mx_RoomAliasField .mx_Field_postfix {
  max-width: calc(100% - 180px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_SSOButtons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_SSOButtons .mx_SSOButtons_row + .mx_SSOButtons_row {
  margin-top: 16px;
}
.mx_SSOButtons .mx_SSOButton {
  border: 1px solid #e7e7e7;
  border-radius: 8px;
  color: var(--cpd-color-text-primary);
  display: inline-block;
  font: var(--cpd-font-body-md-semibold);
  padding: 7px 32px;
  position: relative;
  text-align: center;
  width: 100%;
}
.mx_SSOButtons .mx_SSOButton > img {
  left: 8px;
  -o-object-fit: contain;
  object-fit: contain;
  position: absolute;
  top: 4px;
}
.mx_SSOButtons .mx_SSOButton:hover {
  background-color: var(--cpd-color-alpha-gray-300);
}
.mx_SSOButtons .mx_SSOButton_default {
  background-color: #f4f6fa;
  border-color: var(--cpd-color-text-action-accent);
  color: var(--cpd-color-text-action-accent);
}
.mx_SSOButtons .mx_SSOButton_default.mx_SSOButton_primary {
  background-color: var(--cpd-color-text-action-accent);
  color: var(--cpd-color-bg-canvas-default);
}
.mx_SSOButtons .mx_SSOButton_mini {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 50px;
  min-width: 50px;
  padding: 12px;
  width: 50px;
}
.mx_SSOButtons .mx_SSOButton_mini > img {
  left: 12px;
  top: 12px;
}
.mx_SSOButtons .mx_SSOButton_mini + .mx_SSOButton_mini {
  margin-left: 16px;
}
.mx_SearchWarning {
  padding: 0 16px;
  text-align: center;
}
.mx_SearchWarning > * {
  vertical-align: middle;
}
.mx_SearchWarning > img {
  margin-right: 8px;
  width:20%
}
.mx_ServerPicker {
  border-bottom: 1px solid rgba(141, 151, 165, 0.2);
  display: none;
  font: var(--cpd-font-body-md-regular);
  grid-template-columns: auto -webkit-min-content;
  grid-template-columns: auto min-content;
  grid-template-rows: auto auto auto;
  margin-bottom: 14px;
  padding-bottom: 16px;
}
.mx_ServerPicker > h2 {
  font-weight: var(--cpd-font-weight-semibold);
  grid-column: 1;
  grid-row: 1;
  margin: 0 0 20px;
}
.mx_ServerPicker .mx_ServerPicker_help {
  background-color: var(--cpd-color-icon-tertiary);
  border-radius: 10px;
  color: #fff;
  font-size: 16px;
  grid-column: 2;
  grid-row: 1;
  height: 20px;
  margin-left: auto;
  position: relative;
  text-align: center;
  width: 20px;
}
.mx_ServerPicker .mx_ServerPicker_help:before {
  background: #fff;
  content: "";
  height: 24px;
  left: -2px;
  -webkit-mask-image: url(../../img/element-icons/i.cf33278.svg);
  mask-image: url(../../img/element-icons/i.cf33278.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: -2px;
  width: 24px;
}
.mx_ServerPicker .mx_ServerPicker_server {
  color: var(--cpd-color-text-primary);
  grid-column: 1;
  grid-row: 2;
  margin-right: 8px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mx_ServerPicker .mx_ServerPicker_change {
  grid-column: 2;
  grid-row: 2;
}
.mx_ServerPicker .mx_ServerPicker_desc {
  color: var(--cpd-color-gray-800);
  grid-column: 1/2;
  grid-row: 3;
  margin-top: 4px;
}
.mx_ServerPicker_helpDialog .mx_Dialog_content {
  width: 456px;
}
.mx_SettingsFlag {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-bottom: 4px;
  width: 100%;
}
.mx_SettingsFlag .mx_ToggleSwitch {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
}
.mx_SettingsFlag.mx_SettingsFlag_toggleInFront .mx_ToggleSwitch {
  display: inline-block;
  margin-right: 8px;
  vertical-align: middle;
}
.mx_SettingsFlag.mx_SettingsFlag_toggleInFront .mx_SettingsFlag_label {
  display: inline-block;
  vertical-align: middle;
}
.mx_SettingsFlag_label {
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  color: var(--cpd-color-text-primary);
  -ms-flex-direction: column;
  flex-direction: column;
  padding-right: 10px;
  padding-top: 4px;
}
.mx_SettingsFlag_microcopy {
  color: var(--cpd-color-text-secondary);
  font: var(--cpd-font-body-sm-regular);
  margin-top: 4px;
}
.mx_SettingsFlag_microcopy code,
.mx_SettingsFlag_microcopy pre {
  background-color: rgba(0, 0, 0, 0.04);
  font-family: Inconsolata, , Apple Color Emoji, Segoe UI Emoji, Courier,
    monospace, Noto Color Emoji !important;
  font-family: "Inconsolata", var(--emoji-font-family), "Apple Color Emoji",
    "Segoe UI Emoji", "Courier", monospace, "Noto Color Emoji" !important;
}
.mx_SettingsFlag_microcopy .mx_SettingsTab_microcopy_warning:before {
  content: "⚠️ ";
}
.mx_Spinner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  height: 100%;
  justify-content: center;
  width: 100%;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_MatrixChat_middlePanel .mx_Spinner {
  height: auto;
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(1turn);
    transform: rotate(1turn);
  }
}
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(1turn);
    transform: rotate(1turn);
  }
}
.mx_Spinner_icon {
  background-color: var(--cpd-color-gray-400);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-mask: url(../../img/spinner/spinner-background.0fe37e1.svg);
  mask: url(../../img/spinner/spinner-background.0fe37e1.svg);
  -webkit-mask-size: 100%;
  mask-size: 100%;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 100%;
  width: 100%;
}
.mx_Spinner_icon:before {
  -webkit-animation: spin 1s linear infinite;
  animation: spin 1s linear infinite;
  background-color: var(--cpd-color-text-secondary);
  content: "";
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  -webkit-mask: url(../../img/spinner/spinner-foreground.9b87205.svg);
  mask: url(../../img/spinner/spinner-foreground.9b87205.svg);
  -webkit-mask-size: 100%;
  mask-size: 100%;
  width: 100%;
}
.mx_Checkbox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}
.mx_Checkbox input[type="checkbox"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  margin: 0;
  padding: 0;
}
.mx_Checkbox input[type="checkbox"] + label {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
.mx_Checkbox input[type="checkbox"] + label > .mx_Checkbox_background {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  height: 1rem;
  width: 1rem;
  size: 0.5rem;
  border: 1px solid var(--cpd-color-border-interactive-primary);
  border-radius: 0.27rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.mx_Checkbox
  input[type="checkbox"]
  + label
  > .mx_Checkbox_background
  .mx_Checkbox_checkmark {
  display: none;
  height: 100%;
  -webkit-mask-image: url(../../img/feather-customised/check.bfca953.svg);
  mask-image: url(../../img/feather-customised/check.bfca953.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100%;
  mask-size: 100%;
  width: 100%;
}
.mx_Checkbox
  input[type="checkbox"]:checked
  + label
  > .mx_Checkbox_background
  .mx_Checkbox_checkmark {
  display: block;
}
.mx_Checkbox input[type="checkbox"] + label > :not(.mx_Checkbox_background) {
  margin-left: 10px;
}
.mx_Checkbox input[type="checkbox"]:disabled + label {
  cursor: not-allowed;
}
.mx_Checkbox
  input[type="checkbox"]:focus-visible
  + label
  .mx_Checkbox_background {
  outline-color: Highlight;
  outline-style: solid;
  outline-width: 2px;
}
@media (-webkit-min-device-pixel-ratio: 0) {
  .mx_Checkbox
    input[type="checkbox"]:focus-visible
    + label
    .mx_Checkbox_background {
    outline-color: -webkit-focus-ring-color;
    outline-style: auto;
  }
}
.mx_Checkbox.mx_Checkbox_kind_solid
  input[type="checkbox"]
  + label
  > .mx_Checkbox_background
  .mx_Checkbox_checkmark {
  background: var(--cpd-color-icon-on-solid-primary);
}
.mx_Checkbox.mx_Checkbox_kind_solid
  input[type="checkbox"]:checked
  + label
  > .mx_Checkbox_background {
  background: var(--cpd-color-bg-accent-rest);
  border-color: var(--cpd-color-bg-accent-rest);
}
.mx_Checkbox.mx_Checkbox_kind_solid
  input[type="checkbox"]:checked:disabled
  + label
  > .mx_Checkbox_background {
  background: var(--cpd-color-bg-action-primary-disabled);
  border-color: var(--cpd-color-bg-action-primary-disabled);
}
.mx_Checkbox.mx_Checkbox_kind_outline
  input[type="checkbox"]
  + label
  > .mx_Checkbox_background
  .mx_Checkbox_checkmark {
  background: var(--cpd-color-bg-accent-rest);
}
.mx_Checkbox.mx_Checkbox_kind_outline
  input[type="checkbox"]:checked
  + label
  > .mx_Checkbox_background {
  background: transparent;
  border-color: var(--cpd-color-bg-accent-rest);
}
.mx_StyledRadioButton {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  -webkit-box-align: baseline;
  -ms-flex-align: baseline;
  align-items: baseline;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
.mx_StyledRadioButton > .mx_StyledRadioButton_content {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-grow: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-left: 8px;
  margin-right: 8px;
}
.mx_StyledRadioButton .mx_StyledRadioButton_spacer {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -webkit-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  height: 1rem;
  width: 1rem;
}
.mx_StyledRadioButton input[type="radio"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  margin: 0;
  padding: 0;
}
.mx_StyledRadioButton input[type="radio"] + div {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -webkit-box-flex: 0;
  -ms-flex-positive: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-grow: 0;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  border: 1px solid var(--cpd-color-border-interactive-primary);
  border-radius: 1rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 1rem;
  justify-content: center;
  margin-left: 2px;
  width: 1rem;
}
.mx_StyledRadioButton input[type="radio"] + div > div {
  border-radius: 0.5rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 0.5rem;
  width: 0.5rem;
}
.mx_StyledRadioButton input[type="radio"]:focus-visible + div {
  outline-color: Highlight;
  outline-style: solid;
  outline-width: 2px;
}
@media (-webkit-min-device-pixel-ratio: 0) {
  .mx_StyledRadioButton input[type="radio"]:focus-visible + div {
    outline-color: -webkit-focus-ring-color;
    outline-style: auto;
  }
}
.mx_StyledRadioButton input[type="radio"]:checked + div {
  border-color: var(--cpd-color-bg-accent-rest);
}
.mx_StyledRadioButton input[type="radio"]:checked + div > div {
  background: var(--cpd-color-bg-accent-rest);
}
.mx_StyledRadioButton input[type="radio"]:disabled + div,
.mx_StyledRadioButton input[type="radio"]:disabled + div + span {
  cursor: not-allowed;
  opacity: 0.5;
}
.mx_StyledRadioButton input[type="radio"]:disabled + div {
  border-color: var(--cpd-color-border-interactive-primary);
}
.mx_StyledRadioButton input[type="radio"]:checked:disabled + div > div {
  background-color: var(--cpd-color-border-interactive-primary);
}
.mx_StyledRadioButton .mx_StyledRadioButton_innerLabel {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  top: 4px;
}
.mx_StyledRadioButton_outlined {
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 8px;
}
.mx_StyledRadioButton_checked {
  border-color: var(--cpd-color-bg-accent-rest);
}
.mx_SyntaxHighlight {
  background: none !important;
  color: #747474 !important;
}
.mx_TagComposer .mx_TagComposer_input {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
}
.mx_TagComposer .mx_TagComposer_input .mx_AccessibleButton {
  min-width: 70px;
  padding: 0 8px;
  -ms-flex-item-align: stretch;
  align-self: stretch;
}
.mx_TagComposer .mx_TagComposer_input .mx_AccessibleButton,
.mx_TagComposer .mx_TagComposer_input .mx_Field,
.mx_TagComposer .mx_TagComposer_input .mx_Field input {
  border-radius: 8px;
}
.mx_TagComposer .mx_TagComposer_tags {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: 12px;
}
.mx_TagComposer .mx_Tag {
  margin-right: 12px;
  margin-top: 12px;
}
.mx_Tag {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  font-size: 0.9375rem;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: var(--cpd-color-gray-400);
  border-radius: 8px;
  color: var(--cpd-color-text-primary);
  gap: 8px;
  padding: 8px;
}
.mx_Tag > svg:first-child {
  color: var(--cpd-color-text-secondary);
  -webkit-transform: scale(1.25);
  transform: scale(1.25);
  -webkit-transform-origin: center;
  transform-origin: center;
  width: 1em;
}
.mx_Tag .mx_Tag_delete {
  background: var(--cpd-color-bg-subtle-primary);
  border-radius: 50%;
  color: var(--cpd-color-text-secondary);
  height: 1.066666em;
  line-height: 1em;
  position: relative;
  text-align: center;
  width: 1.066666em;
}
.mx_Tag .mx_Tag_delete svg {
  vertical-align: middle;
  width: 0.5em;
}
.mx_TextWithTooltip_target {
  display: inline;
}
.mx_TextWithTooltip_tooltip {
  display: none;
}
.mx_ToggleSwitch {
  --ToggleSwitch-min-width: 2.75rem;
  background-color: var(--cpd-color-bg-canvas-disabled);
  border: 1px solid var(--cpd-color-border-disabled);
  border-radius: 1.5rem;
  cursor: not-allowed;
  height: 1.25rem;
  padding: 2px;
  -webkit-transition: background-color 0.2s ease-out 0.1s,
    border-color 0.2s ease-out 0.1s;
  transition: background-color 0.2s ease-out 0.1s,
    border-color 0.2s ease-out 0.1s;
  width: 2.75rem;
}
.mx_ToggleSwitch.mx_ToggleSwitch_enabled {
  background-color: var(--cpd-color-bg-canvas-default);
  border: var(--cpd-border-width-1) solid
    var(--cpd-color-border-interactive-primary);
  cursor: pointer;
}
.mx_ToggleSwitch.mx_ToggleSwitch_enabled.mx_ToggleSwitch_on {
  background-color: var(--cpd-color-bg-accent-rest);
  border-color: var(--cpd-color-bg-accent-rest);
}
.mx_ToggleSwitch.mx_ToggleSwitch_enabled > .mx_ToggleSwitch_ball {
  background-color: var(--cpd-color-icon-secondary);
}
.mx_ToggleSwitch.mx_ToggleSwitch_on {
  background-color: var(--cpd-color-bg-action-primary-disabled);
  border-color: var(--cpd-color-bg-action-primary-disabled);
}
.mx_ToggleSwitch.mx_ToggleSwitch_on > .mx_ToggleSwitch_ball {
  background-color: var(--cpd-color-icon-on-solid-primary);
  left: calc(100% - 1.25rem);
}
.mx_ToggleSwitch_ball {
  background-color: var(--cpd-color-bg-action-primary-disabled);
  border-radius: 1.25rem;
  height: 1.25rem;
  left: 0;
  position: relative;
  -webkit-transition: left 0.15s ease-out 0.1s,
    background-color 0.15s ease-out 0.1s;
  transition: left 0.15s ease-out 0.1s, background-color 0.15s ease-out 0.1s;
  width: 1.25rem;
}
@-webkit-keyframes mx_fadein {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes mx_fadein {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes mx_fadeout {
  0% {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes mx_fadeout {
  0% {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
.mx_Tooltip_chevron {
  border-bottom: 7px solid transparent;
  border-right: 7px solid #e7e7e7;
  border-top: 7px solid transparent;
  height: 0;
  left: -7px;
  position: absolute;
  top: calc(50% - 6px);
  width: 0;
}
.mx_Tooltip_chevron:after {
  border-bottom: 6px solid transparent;
  border-right: 6px solid var(--cpd-color-bg-canvas-default);
  border-top: 6px solid transparent;
  content: "";
  height: 0;
  left: 1px;
  position: absolute;
  top: -6px;
  width: 0;
}
.mx_Tooltip {
  background-color: var(--cpd-color-alpha-gray-1400);
  border: 0;
  border-radius: 8px;
  color: var(--cpd-color-text-on-solid-primary);
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 0.875rem;
  max-width: 300px;
  padding: 10px;
  pointer-events: none;
  position: fixed;
  text-align: center;
  word-break: break-word;
  z-index: 6000;
}
.mx_Tooltip,
.mx_Tooltip .mx_Tooltip_chevron {
  display: none;
}
.mx_Tooltip.mx_Tooltip_visible {
  -webkit-animation: mx_fadein 0.2s forwards;
  animation: mx_fadein 0.2s forwards;
}
.mx_Tooltip.mx_Tooltip_invisible {
  -webkit-animation: mx_fadeout 0.1s forwards;
  animation: mx_fadeout 0.1s forwards;
}
.mx_Tooltip ol,
.mx_Tooltip ul {
  text-align: start;
}
.mx_Field_tooltip {
  background-color: var(--cpd-color-bg-canvas-default);
  border: 1px solid #e7e7e7;
  color: var(--cpd-color-text-primary);
  text-align: inherit;
}
.mx_Field_tooltip .mx_Tooltip_chevron {
  display: inline;
  display: initial;
}
.mx_Tooltip_title {
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_Tooltip_sub {
  margin-top: 4px;
  opacity: 0.7;
}
.mx_UseCaseSelection {
  display: grid;
  grid-template-rows: 1fr 1fr -webkit-max-content 2fr;
  grid-template-rows: 1fr 1fr max-content 2fr;
  height: 100%;
  grid-gap: 40px;
}
.mx_UseCaseSelection .mx_UseCaseSelection_title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}
.mx_UseCaseSelection .mx_UseCaseSelection_title h1 {
  font-size: 2rem;
  font-weight: var(--cpd-font-weight-semibold);
  text-align: center;
}
.mx_UseCaseSelection .mx_UseCaseSelection_info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  -ms-flex-item-align: end;
  align-self: flex-end;
}
.mx_UseCaseSelection .mx_UseCaseSelection_info h2 {
  font-size: 1.5rem;
  font-weight: 500;
  margin: 0;
  text-align: center;
}
.mx_UseCaseSelection .mx_UseCaseSelection_info h3 {
  color: var(--cpd-color-text-secondary);
  font-size: 1rem;
  font-weight: 400;
  margin: 0;
  text-align: center;
}
.mx_UseCaseSelection .mx_UseCaseSelection_options {
  display: grid;
  grid-template-columns: repeat(auto-fit, 232px);
  grid-gap: 32px;
  align-self: stretch;
  gap: 32px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_UseCaseSelection .mx_UseCaseSelection_skip {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-item-align: start;
  align-self: flex-start;
}
.mx_UseCaseSelection_slideIn {
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-fill-mode: backwards;
  animation-fill-mode: backwards;
  -webkit-animation-name: mx_UseCaseSelection_slideInLong;
  animation-name: mx_UseCaseSelection_slideInLong;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
  will-change: opacity;
}
.mx_UseCaseSelection_slideInDelayed {
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-fill-mode: backwards;
  animation-fill-mode: backwards;
  -webkit-animation-name: mx_UseCaseSelection_slideInShort;
  animation-name: mx_UseCaseSelection_slideInShort;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
  will-change: transform, opacity;
}
.mx_UseCaseSelection_selected .mx_UseCaseSelection_slideIn,
.mx_UseCaseSelection_selected .mx_UseCaseSelection_slideInDelayed {
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-name: mx_UseCaseSelection_fadeOut;
  animation-name: mx_UseCaseSelection_fadeOut;
  will-change: opacity;
}
@-webkit-keyframes mx_UseCaseSelection_slideInLong {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}
@keyframes mx_UseCaseSelection_slideInLong {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}
@-webkit-keyframes mx_UseCaseSelection_slideInShort {
  0% {
    opacity: 0;
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}
@keyframes mx_UseCaseSelection_slideInShort {
  0% {
    opacity: 0;
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}
@-webkit-keyframes mx_UseCaseSelection_fadeOut {
  0% {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes mx_UseCaseSelection_fadeOut {
  0% {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
.mx_UseCaseSelectionButton {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #018749;
  color:"white";
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 8px;
  padding: 24px 16px;
  position: relative;
  text-align: center;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-box-shadow, -webkit-transform;
  transition-property: -webkit-box-shadow, -webkit-transform;
  transition-property: box-shadow, transform;
  transition-property: box-shadow, transform, -webkit-box-shadow,
    -webkit-transform;
}
.mx_UseCaseSelectionButton .mx_UseCaseSelectionButton_icon {
  background: -webkit-gradient(
      linear,
      left bottom,
      left top,
      from(rgba(172, 59, 168, 0.15)),
      to(rgba(172, 59, 168, 0.15))
    ),
    #fff;
  background: linear-gradient(
      0deg,
      rgba(172, 59, 168, 0.15),
      rgba(172, 59, 168, 0.15)
    ),
    #fff;
    color: #fff !important;
  border-radius: 14px;
  margin-bottom: 16px;
  padding: 8px;
}
.mx_UseCaseSelectionButton .mx_UseCaseSelectionButton_icon:before {
  background: #1e1e1e;
  content: "";
  display: block;
  height: 22px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  width: 22px;
}
.mx_UseCaseSelectionButton
  .mx_UseCaseSelectionButton_icon.mx_UseCaseSelectionButton_messaging:before {
  -webkit-mask-image: url(../../img/element-icons/chat-bubble.d1c5d78.svg);
  mask-image: url(../../img/element-icons/chat-bubble.d1c5d78.svg);
}
.mx_UseCaseSelectionButton
  .mx_UseCaseSelectionButton_icon.mx_UseCaseSelectionButton_work:before {
  -webkit-mask-image: url(../../img/element-icons/view-community.0d3cd3f.svg);
  mask-image: url(../../img/element-icons/view-community.0d3cd3f.svg);
}
.mx_UseCaseSelectionButton
  .mx_UseCaseSelectionButton_icon.mx_UseCaseSelectionButton_community:before {
  -webkit-mask-image: url(../../img/globe.0408a7a.svg);
  mask-image: url(../../img/globe.0408a7a.svg);
}
.mx_UseCaseSelectionButton:focus,
.mx_UseCaseSelectionButton:hover {
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
  -webkit-transform: translateY(-8px);
  transform: translateY(-8px);
}
.mx_UseCaseSelectionButton .mx_UseCaseSelectionButton_selectedIcon {
  background: var(--cpd-color-text-action-accent);
  border-radius: 24px;
  opacity: 0;
  padding: 6px;
  position: absolute;
  right: -12px;
  top: -12px;
  -webkit-transform: scale(0.6);
  transform: scale(0.6);
  -webkit-transition-duration: 0.15s;
  transition-duration: 0.15s;
  -webkit-transition-property: opacity, -webkit-transform;
  transition-property: opacity, -webkit-transform;
  transition-property: opacity, transform;
  transition-property: opacity, transform, -webkit-transform;
}
.mx_UseCaseSelectionButton .mx_UseCaseSelectionButton_selectedIcon:before {
  background: var(--cpd-color-bg-canvas-default);
  content: "";
  display: block;
  height: 12px;
  -webkit-mask-image: url(../../img/element-icons/check-white.9400525.svg);
  mask-image: url(../../img/element-icons/check-white.9400525.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  width: 12px;
}
.mx_UseCaseSelectionButton.mx_UseCaseSelectionButton_selected {
  border: 2px solid var(--cpd-color-text-action-accent);
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
  padding: 23px 15px;
}
.mx_UseCaseSelectionButton.mx_UseCaseSelectionButton_selected
  .mx_UseCaseSelectionButton_selectedIcon {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}
.mx_Validation {
  position: relative;
}
.mx_Validation_details {
  margin: 0;
  padding-left: 20px;
}
.mx_Validation_description + .mx_Validation_details {
  margin: 1em 0 0;
}
.mx_Validation_detail {
  font-weight: 400;
  list-style: none;
  margin-bottom: 0.5em;
  position: relative;
}
.mx_Validation_detail:last-child {
  margin-bottom: 0;
}
.mx_Validation_detail:before {
  content: "";
  height: 14px;
  left: -18px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 0;
  width: 14px;
}
.mx_Validation_detail.mx_Validation_valid {
  color: var(--cpd-color-text-action-accent);
}
.mx_Validation_detail.mx_Validation_valid:before {
  background-color: var(--cpd-color-text-action-accent);
  -webkit-mask-image: url(../../img/feather-customised/check.bfca953.svg);
  mask-image: url(../../img/feather-customised/check.bfca953.svg);
}
.mx_Validation_detail.mx_Validation_invalid {
  color: var(--cpd-color-text-critical-primary);
}
.mx_Validation_detail.mx_Validation_invalid:before {
  background-color: var(--cpd-color-text-critical-primary);
  -webkit-mask-image: url(../../img/feather-customised/x.c543757.svg);
  mask-image: url(../../img/feather-customised/x.c543757.svg);
}
.mx_EmojiPicker {
  border-radius: 4px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 450px;
  width: 340px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_EmojiPicker_body {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow-y: scroll;
  scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
  scrollbar-width: thin;
}
.mx_EmojiPicker_header {
  border-bottom: 1px solid #e9edf1;
  padding: 4px 8px 0;
}
.mx_EmojiPicker_anchor {
  background-color: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  border-radius: 4px 4px 0 0;
  height: 38px;
  padding: 8px 8px 6px;
  width: 36px;
}
.mx_EmojiPicker_anchor:not(:disabled) {
  cursor: pointer;
}
.mx_EmojiPicker_anchor:not(:disabled):hover {
  background-color: var(--cpd-color-bg-subtle-primary);
  border-bottom: 2px solid var(--cpd-color-text-action-accent);
}
.mx_EmojiPicker_anchor:before {
  background-color: var(--cpd-color-text-primary);
  content: "";
  display: inline-block;
  height: 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100%;
  mask-size: 100%;
  width: 100%;
}
.mx_EmojiPicker_anchor:disabled:before {
  background-color: var(--cpd-color-bg-subtle-primary);
}
.mx_EmojiPicker_anchor_activity:before {
  -webkit-mask-image: url(../../img/emojipicker/activity.b1bd2e6.svg);
  mask-image: url(../../img/emojipicker/activity.b1bd2e6.svg);
}
.mx_EmojiPicker_anchor_custom:before {
  -webkit-mask-image: url(../../img/emojipicker/custom.0b41026.svg);
  mask-image: url(../../img/emojipicker/custom.0b41026.svg);
}
.mx_EmojiPicker_anchor_flags:before {
  -webkit-mask-image: url(../../img/emojipicker/flags.90f18b0.svg);
  mask-image: url(../../img/emojipicker/flags.90f18b0.svg);
}
.mx_EmojiPicker_anchor_foods:before {
  -webkit-mask-image: url(../../img/emojipicker/foods.7be3b5f.svg);
  mask-image: url(../../img/emojipicker/foods.7be3b5f.svg);
}
.mx_EmojiPicker_anchor_nature:before {
  -webkit-mask-image: url(../../img/emojipicker/nature.8a9bfce.svg);
  mask-image: url(../../img/emojipicker/nature.8a9bfce.svg);
}
.mx_EmojiPicker_anchor_objects:before {
  -webkit-mask-image: url(../../img/emojipicker/objects.31b5fc3.svg);
  mask-image: url(../../img/emojipicker/objects.31b5fc3.svg);
}
.mx_EmojiPicker_anchor_people:before {
  -webkit-mask-image: url(../../img/emojipicker/people.0fb0422.svg);
  mask-image: url(../../img/emojipicker/people.0fb0422.svg);
}
.mx_EmojiPicker_anchor_places:before {
  -webkit-mask-image: url(../../img/emojipicker/places.87f4f91.svg);
  mask-image: url(../../img/emojipicker/places.87f4f91.svg);
}
.mx_EmojiPicker_anchor_recent:before {
  -webkit-mask-image: url(../../img/emojipicker/recent.ac61335.svg);
  mask-image: url(../../img/emojipicker/recent.ac61335.svg);
}
.mx_EmojiPicker_anchor_symbols:before {
  -webkit-mask-image: url(../../img/emojipicker/symbols.9e36ce6.svg);
  mask-image: url(../../img/emojipicker/symbols.9e36ce6.svg);
}
.mx_EmojiPicker_anchor_visible {
  border-bottom: 2px solid var(--cpd-color-text-action-accent);
}
.mx_EmojiPicker_search {
  background-color: var(--cpd-color-bg-canvas-default);
  border: 1px solid #e7e7e7;
  border-radius: 4px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 8px;
}
.mx_EmojiPicker_search input {
  -webkit-box-flex: 1;
  border: none;
  border-radius: 4px 0;
  -ms-flex: 1;
  flex: 1;
  padding: 8px 12px;
}
.mx_EmojiPicker_search button {
  background-color: inherit;
  border: none;
  margin: 0;
  padding: 8px;
  -ms-flex-item-align: center;
  align-self: center;
  height: 32px;
  width: 32px;
}
.mx_EmojiPicker_search_clear {
  cursor: pointer;
}
.mx_EmojiPicker_search_icon {
  margin: 8px;
  width: 16px;
}
.mx_EmojiPicker_search_icon:not(.mx_EmojiPicker_search_clear) {
  pointer-events: none;
}
.mx_EmojiPicker_search_icon:after {
  background-color: var(--cpd-color-text-primary);
  content: "";
  display: inline-block;
  height: 100%;
  -webkit-mask: url(../../img/emojipicker/search.fc4e297.svg) no-repeat;
  mask: url(../../img/emojipicker/search.fc4e297.svg) no-repeat;
  -webkit-mask-size: 100%;
  mask-size: 100%;
  width: 100%;
}
.mx_EmojiPicker_search_clear:after {
  -webkit-mask-image: url(../../img/emojipicker/delete.bef70a7.svg);
  mask-image: url(../../img/emojipicker/delete.bef70a7.svg);
}
.mx_EmojiPicker_category {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0 12px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_EmojiPicker_category_label {
  width: 304px;
}
.mx_EmojiPicker_list {
  margin: 0;
  padding: 0;
  width: 304px;
}
.mx_EmojiPicker_item_wrapper {
  cursor: pointer;
  display: inline-block;
  list-style: none;
  width: 38px;
}
.mx_EmojiPicker_item_wrapper:focus-within {
  background-color: var(--cpd-color-bg-subtle-primary);
}
.mx_EmojiPicker_body
  .mx_EmojiPicker_item_wrapper[tabindex="0"]
  .mx_EmojiPicker_item {
  background-color: var(--cpd-color-bg-subtle-primary);
}
.mx_EmojiPicker_item {
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  font-size: 1.25rem;
  height: 100%;
  padding: 5px;
  text-align: center;
  width: 100%;
}
.mx_EmojiPicker_item:hover {
  background-color: var(--cpd-color-bg-subtle-primary);
}
.mx_EmojiPicker_item_selected {
  border: 1px solid var(--cpd-color-text-action-accent);
  color: rgba(0, 0, 0, 0.5);
  padding: 4px;
}
.mx_EmojiPicker_category_label,
.mx_EmojiPicker_preview_name {
  font-size: 1rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin: 0;
}
.mx_EmojiPicker_footer {
  border-top: 1px solid #e9edf1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  min-height: 72px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_EmojiPicker_preview_emoji {
  font-size: 2rem;
  padding: 8px 16px;
}
.mx_EmojiPicker_preview_text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
  padding-bottom: 1rem;
  padding-top: 1rem;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_EmojiPicker_name {
  text-transform: capitalize;
}
.mx_EmojiPicker_shortcode {
  color: #747474;
  font: var(--cpd-font-body-md-regular);
  overflow-wrap: break-word;
}
.mx_EmojiPicker_shortcode:after,
.mx_EmojiPicker_shortcode:before {
  content: ":";
}
.mx_EmojiPicker_quick {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: distribute;
  justify-content: space-around;
}
.mx_EmojiPicker_quick_header .mx_EmojiPicker_name {
  margin-right: 4px;
}
.mx_LocationPicker {
  border-radius: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  position: relative;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_LocationPicker.mx_LocationPicker_hasError .maplibregl-canvas-container,
.mx_LocationPicker.mx_LocationPicker_hasError .maplibregl-control-container {
  display: none;
}
.mx_LocationPicker #mx_LocationPicker_map {
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_LocationPicker
  #mx_LocationPicker_map
  .maplibregl-ctrl.maplibregl-ctrl-attrib,
.mx_LocationPicker
  #mx_LocationPicker_map
  .maplibregl-ctrl.maplibregl-ctrl-group {
  margin-right: 16px;
}
.mx_LocationPicker
  #mx_LocationPicker_map
  .maplibregl-ctrl.maplibregl-ctrl-group {
  margin-top: 50px;
}
.mx_LocationPicker
  #mx_LocationPicker_map
  .maplibregl-user-location-accuracy-circle,
.mx_LocationPicker #mx_LocationPicker_map .maplibregl-user-location-dot {
  display: none;
}
.mx_LocationPicker .mx_LocationPicker_footer {
  -webkit-box-flex: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 0;
  flex: 0;
  padding: 16px;
  width: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: stretch;
  -ms-flex-pack: stretch;
  background-color: var(--cpd-color-bg-subtle-primary);
  border-bottom-left-radius: inherit;
  border-bottom-right-radius: inherit;
  justify-content: stretch;
}
.mx_LocationPicker_pinText {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 0;
  pointer-events: none;
  position: absolute;
  text-align: center;
  top: 16px;
  width: 100%;
}
.mx_LocationPicker_pinText span {
  background-color: var(--cpd-color-bg-canvas-default);
  border-radius: 8px;
  -webkit-box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
  color: var(--cpd-color-text-primary);
  font-size: 0.75rem;
  padding: 8px;
}
.mx_LocationPicker_submitButton {
  height: 48px;
  width: 100%;
}
.mx_CallEvent,
.mx_CallEvent_wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
}
.mx_CallEvent {
  background-color: var(--cpd-color-bg-subtle-primary);
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  gap: 8px;
  max-width: 600px;
  min-height: 60px;
  padding: 12px;
}
.mx_CallEvent > .mx_BaseAvatar,
.mx_CallEvent > .mx_Icon {
  -ms-flex-item-align: start;
  align-self: flex-start;
}
.mx_CallEvent > .mx_Icon {
  color: var(--cpd-color-text-secondary);
  margin: 4px 0;
  padding: 0;
}
.mx_CallEvent .mx_LiveContentSummary {
  font-size: 0.75rem;
}
.mx_CallEvent {
  --facepile-background: var(--cpd-color-bg-subtle-primary);
}
.mx_CallEvent_title {
  font-size: 0.9375rem;
  line-height: 24px;
}
.mx_CallEvent_inactive .mx_CallEvent_title:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  display: inline-block;
  height: 16px;
  margin-right: 8px;
  -webkit-mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
  mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
  -webkit-mask-size: 16px;
  mask-size: 16px;
  vertical-align: middle;
  width: 16px;
}
.mx_CallEvent_active .mx_CallEvent_title {
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_CallEvent_columns {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-grow: 1;
  gap: 12px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.mx_TimelineCard .mx_CallEvent_columns {
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 8px;
}
.mx_CallEvent_details,
.mx_TimelineCard .mx_CallEvent_columns {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_CallEvent_details {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-grow: 1;
  gap: 6px;
}
.mx_CallEvent_button {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  min-width: 120px;
}
.mx_EventTileBubble.mx_CreateEvent {
  margin: var(--EventTileBubble_margin-block) auto;
}
.mx_EventTileBubble.mx_CreateEvent:before {
  background-color: #91a1c0;
  -webkit-mask-image: url(../../img/element-icons/chat-bubbles.7946de9.svg);
  mask-image: url(../../img/element-icons/chat-bubbles.7946de9.svg);
}
.mx_DateSeparator_dateContent {
  padding: 0 25px;
}
.mx_DateSeparator_dateHeading {
  -webkit-box-flex: 0;
  color: inherit;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  font-size: inherit;
  font-weight: inherit;
  margin: 0;
  text-transform: capitalize;
}
.mx_DateSeparator_jumpToDateMenu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_DateSeparator_chevron {
  -ms-flex-item-align: center;
  align-self: center;
  background-color: var(--cpd-color-icon-secondary);
  height: 16px;
  -webkit-mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  width: 16px;
}
.mx_DecryptionFailureBody {
  color: var(--cpd-color-text-secondary);
  font-style: italic;
}
.mx_DisambiguatedProfile {
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_DisambiguatedProfile .mx_DisambiguatedProfile_displayName {
  font: var(--cpd-font-body-md-semibold);
  -webkit-margin-end: 0;
  line-height: 1;
  margin-inline-end: 0;
}
.mx_DisambiguatedProfile .mx_DisambiguatedProfile_mxid {
  -webkit-margin-start: 5px;
  color: var(--cpd-color-text-secondary);
  font-size: var(--cpd-font-size-body-sm);
  margin-inline-start: 5px;
}
.mx_EventTileBubble {
  --EventTileBubble_margin-block: 10px;
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) -webkit-min-content -webkit-min-content;
  grid-template-columns: 24px minmax(0, 1fr) min-content min-content;
  max-width: min(calc(100% - 92px), 600px);
  max-width: min(calc(100% - var(--MessageTimestamp-width) * 2), 600px);
  padding: 10px;
}
/* .mx_EventTileBubble:after,
.mx_EventTileBubble:before {
  content: "";
  grid-column: 1;
  grid-row: 1/3;
  height: 16px;
  inset: 0;
  margin-top: 4px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: relative;
  width: 16px;
} */
.mx_EventTileBubble .mx_EventTileBubble_subtitle,
.mx_EventTileBubble .mx_EventTileBubble_title {
  grid-column: 2;
  min-inline-size: 50px;
  overflow-wrap: break-word;
}
.mx_EventTileBubble .mx_EventTileBubble_title {
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
  grid-row: 1;
  text-align: center;
}
.mx_EventTileBubble .mx_EventTileBubble_subtitle {
  font-size: 0.75rem;
  grid-row: 2;
}
.mx_EventTileBubble .mx_MessageTimestamp {
  align-self: center;
  grid-column: 4;
  grid-row: 1/3;
  margin-left: 16px;
}
.mx_HiddenBody {
  color: #61708b;
  padding-left: 20px;
  position: relative;
  vertical-align: middle;
  white-space: pre-wrap;
}
.mx_HiddenBody:before {
  background-color: #61708b;
  content: "";
  height: 14px;
  left: 0;
  -webkit-mask-image: url(../../img/element-icons/hide.72c451b.svg);
  mask-image: url(../../img/element-icons/hide.72c451b.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 1px;
  width: 14px;
}
.mx_JumpToDatePicker_form {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-bottom: 12px;
  padding-top: 12px;
}
.mx_JumpToDatePicker_label {
  -ms-flex-item-align: center;
  align-self: center;
  font-size: 0.9375rem;
}
.mx_JumpToDatePicker_datePicker {
  margin: 0 0 0 8px;
}
.mx_JumpToDatePicker_datePicker,
.mx_JumpToDatePicker_datePicker > input {
  border-radius: 8px;
}
.mx_JumpToDatePicker_submitButton {
  margin-left: 8px;
}
.mx_LegacyCallEvent_wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
}
.mx_LegacyCallEvent_wrapper .mx_LegacyCallEvent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  gap: 4px 0;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  justify-content: space-between;
  margin: 4px 0;
  padding: 12px 24px;
  position: relative;
  width: 65%;
}
.mx_LegacyCallEvent_wrapper .mx_LegacyCallEvent .mx_LegacyCallEvent_iconButton {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent
  .mx_LegacyCallEvent_iconButton:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 16px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  width: 16px;
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent
  .mx_LegacyCallEvent_silence:before {
  -webkit-mask-image: url(../../img/voip/silence.fff021d.svg);
  mask-image: url(../../img/voip/silence.fff021d.svg);
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent
  .mx_LegacyCallEvent_unSilence:before {
  -webkit-mask-image: url(../../img/voip/un-silence.fd94a16.svg);
  mask-image: url(../../img/voip/un-silence.fd94a16.svg);
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent.mx_LegacyCallEvent_voice
  .mx_LegacyCallEvent_content_button_answer
  span:before,
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent.mx_LegacyCallEvent_voice
  .mx_LegacyCallEvent_content_button_callBack
  span:before,
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent.mx_LegacyCallEvent_voice
  .mx_LegacyCallEvent_type_icon:before {
  -webkit-mask-image: url(../../img/element-icons/call/voice-call.85002aa.svg);
  mask-image: url(../../img/element-icons/call/voice-call.85002aa.svg);
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent.mx_LegacyCallEvent_voice.mx_LegacyCallEvent_noAnswer
  .mx_LegacyCallEvent_type_icon:before,
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent.mx_LegacyCallEvent_voice.mx_LegacyCallEvent_rejected
  .mx_LegacyCallEvent_type_icon:before {
  -webkit-mask-image: url(../../img/element-icons/call/hangup.a9876fc.svg);
  mask-image: url(../../img/element-icons/call/hangup.a9876fc.svg);
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent.mx_LegacyCallEvent_video
  .mx_LegacyCallEvent_content_button_answer
  span:before,
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent.mx_LegacyCallEvent_video
  .mx_LegacyCallEvent_content_button_callBack
  span:before,
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent.mx_LegacyCallEvent_video
  .mx_LegacyCallEvent_type_icon:before {
  -webkit-mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
  mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent.mx_LegacyCallEvent_video.mx_LegacyCallEvent_noAnswer
  .mx_LegacyCallEvent_type_icon:before,
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent.mx_LegacyCallEvent_video.mx_LegacyCallEvent_rejected
  .mx_LegacyCallEvent_type_icon:before {
  -webkit-mask-image: url(../../img/voip/declined-video.6800c36.svg);
  mask-image: url(../../img/voip/declined-video.6800c36.svg);
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent.mx_LegacyCallEvent_missed.mx_LegacyCallEvent_voice
  .mx_LegacyCallEvent_type_icon:before {
  -webkit-mask-image: url(../../img/voip/missed-voice.8a2b762.svg);
  mask-image: url(../../img/voip/missed-voice.8a2b762.svg);
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent.mx_LegacyCallEvent_missed.mx_LegacyCallEvent_video
  .mx_LegacyCallEvent_type_icon:before {
  -webkit-mask-image: url(../../img/voip/missed-video.c6ff632.svg);
  mask-image: url(../../img/voip/missed-video.c6ff632.svg);
}
.mx_LegacyCallEvent_wrapper .mx_LegacyCallEvent .mx_LegacyCallEvent_info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  max-width: 100%;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent
  .mx_LegacyCallEvent_info
  .mx_LegacyCallEvent_info_basic {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  margin-left: 10px;
  margin-right: 10px;
  min-width: 0;
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent
  .mx_LegacyCallEvent_info
  .mx_LegacyCallEvent_info_basic
  .mx_LegacyCallEvent_sender {
  font-weight: var(--cpd-font-weight-semibold);
  margin-bottom: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent
  .mx_LegacyCallEvent_info
  .mx_LegacyCallEvent_info_basic
  .mx_LegacyCallEvent_type {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-secondary);
  font-weight: 400;
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent
  .mx_LegacyCallEvent_info
  .mx_LegacyCallEvent_info_basic
  .mx_LegacyCallEvent_type
  .mx_LegacyCallEvent_type_icon {
  height: 13px;
  margin-right: 5px;
  width: 13px;
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent
  .mx_LegacyCallEvent_info
  .mx_LegacyCallEvent_info_basic
  .mx_LegacyCallEvent_type
  .mx_LegacyCallEvent_type_icon:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 13px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  width: 13px;
}
.mx_LegacyCallEvent_wrapper .mx_LegacyCallEvent .mx_LegacyCallEvent_content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  gap: 12px;
  -webkit-margin-start: 42px;
  margin-inline-start: 42px;
  max-width: -webkit-fit-content;
  max-width: -moz-fit-content;
  max-width: fit-content;
  word-break: break-word;
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent
  .mx_LegacyCallEvent_content
  .mx_LegacyCallEvent_content_button {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-weight: var(--cpd-font-weight-semibold);
  height: 1.5rem;
  line-height: 1.5rem;
  margin-right: 0;
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent
  .mx_LegacyCallEvent_content
  .mx_LegacyCallEvent_content_button
  span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent
  .mx_LegacyCallEvent_content
  .mx_LegacyCallEvent_content_button
  span:before {
  background-color: var(--cpd-color-bg-canvas-default);
  content: "";
  display: inline-block;
  margin-right: 8px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent
  .mx_LegacyCallEvent_content
  .mx_LegacyCallEvent_content_button {
  font-size: inherit;
  padding: 0 12px;
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent
  .mx_LegacyCallEvent_content
  .mx_LegacyCallEvent_content_button
  span:before {
  height: 16px;
  -webkit-mask-size: 16px;
  mask-size: 16px;
  width: 16px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent
  .mx_LegacyCallEvent_content
  .mx_LegacyCallEvent_content_button_reject
  span:before {
  -webkit-mask-image: url(../../img/element-icons/call/hangup.a9876fc.svg);
  mask-image: url(../../img/element-icons/call/hangup.a9876fc.svg);
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent
  .mx_LegacyCallEvent_content
  .mx_LegacyCallEvent_content_tooltip {
  margin-right: 5px;
}
.mx_LegacyCallEvent_wrapper .mx_LegacyCallEvent.mx_LegacyCallEvent_narrow {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: initial;
  -ms-flex-align: initial;
  align-items: normal;
  gap: 4px 16px;
  height: auto;
  min-width: 290px;
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent.mx_LegacyCallEvent_narrow
  .mx_LegacyCallEvent_iconButton {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 16px;
  margin-right: 0;
  position: absolute;
  right: 12px;
  top: 12px;
  width: 16px;
}
.mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent.mx_LegacyCallEvent_narrow
  .mx_LegacyCallEvent_info {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_EventTile[data-layout="bubble"]
  .mx_EventTile_e2eIcon
  + .mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent {
  position: relative;
  right: 28px;
}
.mx_EventTile_leftAlignedBubble
  .mx_LegacyCallEvent_wrapper
  .mx_LegacyCallEvent.mx_LegacyCallEvent_narrow {
  gap: 8px 4px;
}
.mx_IRCLayout .mx_LegacyCallEvent_wrapper .mx_LegacyCallEvent {
  -webkit-margin-start: 4px;
  margin-inline-start: 4px;
}
.mx_MEmoteBody {
  white-space: pre-wrap;
}
.mx_MEmoteBody_sender {
  cursor: pointer;
}
.mx_MFileBody_download {
  color: var(--cpd-color-text-action-accent);
}
.mx_MFileBody_download .mx_MFileBody_download_icon {
  background-color: var(--cpd-color-text-action-accent);
  display: inline-block;
  height: 12px;
  -webkit-mask-image: url(../../img/download.8869916.svg);
  mask-image: url(../../img/download.8869916.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 12px;
  mask-size: 12px;
  width: 12px;
}
.mx_MFileBody_download a {
  color: var(--cpd-color-text-action-accent);
  cursor: pointer;
  text-decoration: none;
}
.mx_MFileBody_download object {
  margin-left: -16px;
  margin-top: -4px;
  padding-right: 4px;
  pointer-events: none;
  vertical-align: middle;
}
.mx_MFileBody_download iframe {
  border: none;
  height: 1.5em;
  margin: 0;
  padding: 0;
  width: 100%;
}
.mx_MFileBody_info {
  cursor: pointer;
}
.mx_MFileBody_info .mx_MFileBody_info_icon {
  background-color: var(--cpd-color-bg-subtle-primary);
  border-radius: 20px;
  display: inline-block;
  height: 32px;
  margin-right: 12px;
  position: relative;
  vertical-align: middle;
  width: 32px;
}
.mx_MFileBody_info .mx_MFileBody_info_icon:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 15px;
  left: 8px;
  -webkit-mask-image: url(../../img/element-icons/room/composer/attach.7eed7d0.svg);
  mask-image: url(../../img/element-icons/room/composer/attach.7eed7d0.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: cover;
  mask-size: cover;
  position: absolute;
  top: 8px;
  width: 15px;
}
.mx_MFileBody_info .mx_MFileBody_info_filename {
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
  width: calc(100% - 44px);
}
.mx_MImageBody_banner {
  background-color: rgba(0, 0, 0, 0.6);
  border-radius: 8px;
  border-radius: var(--MBody-border-radius);
  bottom: 4px;
  color: #fff;
  font-size: 0.9375rem;
  left: 4px;
  max-width: min(100%, 350px);
  overflow: hidden;
  padding: 4px;
  pointer-events: none;
  position: absolute;
  text-overflow: ellipsis;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  white-space: nowrap;
}
.mx_MImageBody_placeholder {
  background-color: var(--cpd-color-bg-canvas-default);
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
.mx_MImageBody_placeholder .mx_Blurhash > canvas {
  -webkit-animation: mx--anim-pulse 1.75s cubic-bezier(0.4, 0, 0.6, 1) infinite;
  animation: mx--anim-pulse 1.75s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
.mx_MImageBody_thumbnail_container {
  border-radius: 8px;
  border-radius: var(--MBody-border-radius);
  contain: paint;
  overflow: hidden;
}
.mx_MImageBody_thumbnail {
  display: block;
  height: 100%;
  width: 100%;
}
.mx_MImageBody_gifLabel {
  background: rgba(0, 0, 0, 0.7);
  border: 2px solid rgba(0, 0, 0, 0.2);
  border-radius: 5px;
  color: #f4f6fa;
  display: block;
  left: 14px;
  padding: 5px;
  pointer-events: none;
  position: absolute;
  top: 0;
}
.mx_HiddenImagePlaceholder {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  inset: 0;
  position: absolute;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  background-color: var(--cpd-color-bg-subtle-primary);
  cursor: pointer;
  justify-content: center;
  text-align: center;
}
.mx_HiddenImagePlaceholder .mx_HiddenImagePlaceholder_button {
  color: var(--cpd-color-text-action-accent);
}
.mx_HiddenImagePlaceholder
  .mx_HiddenImagePlaceholder_button
  span.mx_HiddenImagePlaceholder_eye {
  background-color: var(--cpd-color-text-action-accent);
  display: inline-block;
  height: 14px;
  margin-right: 8px;
  -webkit-mask-image: url(../../img/feather-customised/eye.d8df60a.svg);
  mask-image: url(../../img/feather-customised/eye.d8df60a.svg);
  width: 18px;
}
.mx_HiddenImagePlaceholder
  .mx_HiddenImagePlaceholder_button
  span:not(.mx_HiddenImagePlaceholder_eye) {
  vertical-align: text-bottom;
}
.mx_EventTile:hover .mx_HiddenImagePlaceholder {
  background-color: var(--cpd-color-bg-canvas-default);
}
.mx_MImageReplyBody {
  -webkit-column-gap: 4px;
  -moz-column-gap: 4px;
  column-gap: 4px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_MImageReplyBody .mx_MImageBody_thumbnail_container {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-width: 0;
}
/* .mx_EventTileBubble.mx_MJitsiWidgetEvent:before {
  background-color: #91a1c0;
  -webkit-mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
  mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
} */
.mx_MLocationBody {
  max-width: 100%;
}
.mx_MLocationBody .mx_MLocationBody_map {
  border-radius: 8px;
  border-radius: var(--MBody-border-radius);
  cursor: pointer;
  height: 300px;
  max-width: 100%;
  width: 450px;
  z-index: 0;
}
.mx_EventTile_line .mx_MLocationBody .mx_MLocationBody_map {
  max-width: 450px;
  width: 100%;
}
.mx_EventTile[data-layout="bubble"]
  .mx_EventTile_line
  .mx_MLocationBody
  .mx_MLocationBody_map {
  max-width: 100%;
  width: 450px;
}
.mx_DisambiguatedProfile ~ .mx_MLocationBody {
  margin-top: 6px;
}
.mx_ReplyTile .mx_MLocationBody {
  pointer-events: none;
}
.mx_MNoticeBody {
  color: var(--cpd-color-text-secondary);
  white-space: pre-wrap;
}
.mx_MPollBody {
  margin-top: 8px;
}
.mx_MPollBody h2 {
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.5rem;
  margin-bottom: 8px;
  margin-top: 0;
}
.mx_MPollBody h2 .mx_MPollBody_edited {
  color: #9e9e9e;
  font-size: 0.75rem;
  opacity: 0.6;
}
.mx_MPollBody h2:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  display: inline-block;
  height: 20px;
  left: 3px;
  margin-right: 12px;
  -webkit-mask-image: url(../../img/element-icons/room/composer/poll.a8ee2f3.svg);
  mask-image: url(../../img/element-icons/room/composer/poll.a8ee2f3.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: relative;
  top: 3px;
  width: 20px;
}
.mx_MPollBody .mx_MPollBody_totalVotes {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: inline;
  flex-direction: inline;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  justify-content: start;
}
.mx_MPollBody .mx_MPollBody_totalVotes .mx_Spinner {
  -webkit-box-flex: 0;
  -ms-flex: 0;
  flex: 0;
  margin-left: 8px;
}
.mx_ReplyTile .mx_MPollBody {
  pointer-events: none;
}
.mx_MPollBody_allOptions {
  display: grid;
  grid-gap: 16px;
  margin-bottom: 8px;
  max-width: 550px;
}
.mx_MPollEndBody_icon {
  color: var(--cpd-color-text-secondary);
  height: 14px;
  margin-right: 8px;
  vertical-align: middle;
}
.mx_MStickerBody_wrapper {
  padding: 12px 0;
}
.mx_MStickerBody_hidden {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  max-width: 220px;
  text-align: center;
  text-decoration: none;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_MStickerBody_placeholder {
  left: calc(50% - 40px);
  position: absolute;
  top: calc(50% - 40px);
}
.mx_MTextBody {
  white-space: pre-wrap;
}
span.mx_MVideoBody {
  overflow: hidden;
}
span.mx_MVideoBody .mx_MVideoBody_container {
  border-radius: 8px;
  border-radius: var(--MBody-border-radius);
  overflow: hidden;
}
span.mx_MVideoBody .mx_MVideoBody_container video {
  height: 100%;
  width: 100%;
}
.mx_MediaBody {
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 12px;
  color: var(--cpd-color-text-secondary);
  font: var(--cpd-font-body-md-regular);
  line-height: 1.5rem;
  max-width: 243px;
  padding: 6px 12px;
}
.mx_MessageActionBar {
  --MessageActionBar-size-button: 28px;
  --MessageActionBar-size-box: 32px;
  --MessageActionBar-item-hover-background: var(
    --cpd-color-bg-subtle-secondary
  );
  --MessageActionBar-item-hover-borderRadius: 6px;
  --MessageActionBar-item-hover-zIndex: 1;
  background: var(--cpd-color-bg-canvas-default);
  border: var(--cpd-border-width-1) solid var(--cpd-color-border-disabled);
  border-radius: 8px;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 32px;
  height: var(--MessageActionBar-size-box);
  line-height: 1.5rem;
  position: absolute;
  right: 8px;
  top: -32px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  visibility: hidden;
  z-index: 10;
}
.mx_MessageActionBar:before {
  content: "";
  cursor: auto;
  height: calc(20px + 100%);
  left: -58px;
  position: absolute;
  top: -12px;
  width: calc(66px + 100%);
  z-index: -1;
}
.mx_GenericEventListSummary[data-layout="bubble"]
  .mx_GenericEventListSummary_toggle
  ~ .mx_GenericEventListSummary_unstyledList
  .mx_EventTile_info:first-of-type
  .mx_MessageActionBar:before {
  height: 100%;
  left: 0;
  top: 0;
  width: 100%;
}
.mx_EventTile_info .mx_ViewSourceEvent ~ .mx_MessageActionBar:before {
  height: 100%;
  left: 0;
  top: 0;
  width: 100%;
}
.mx_MessageActionBar > * {
  display: inline-block;
  margin: 2px;
  position: relative;
  white-space: nowrap;
}
.mx_MessageActionBar > :hover {
  background: var(--MessageActionBar-item-hover-background);
  border-radius: var(--MessageActionBar-item-hover-borderRadius);
  z-index: var(--MessageActionBar-item-hover-zIndex);
}
.mx_MessageActionBar .mx_MessageActionBar_iconButton {
  --MessageActionBar-icon-size: 18px;
  color: var(--cpd-color-icon-secondary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: var(--MessageActionBar-size-button);
  width: var(--MessageActionBar-size-button);
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_MessageActionBar .mx_MessageActionBar_iconButton svg {
  height: var(--MessageActionBar-icon-size);
  width: var(--MessageActionBar-icon-size);
  -webkit-box-flex: 0;
  -ms-flex: 0 0 var(--MessageActionBar-icon-size);
  flex: 0 0 var(--MessageActionBar-icon-size);
}
.mx_MessageActionBar .mx_MessageActionBar_iconButton:disabled,
.mx_MessageActionBar .mx_MessageActionBar_iconButton[disabled] {
  cursor: not-allowed;
  opacity: 0.75;
}
.mx_MessageActionBar .mx_MessageActionBar_iconButton:hover {
  color: var(--cpd-color-icon-primary);
}
.mx_MessageActionBar
  .mx_MessageActionBar_iconButton.mx_MessageActionBar_downloadButton {
  --MessageActionBar-icon-size: 14px;
}
.mx_MessageActionBar
  .mx_MessageActionBar_iconButton.mx_MessageActionBar_downloadButton.mx_MessageActionBar_downloadSpinnerButton
  svg {
  display: none;
}
.mx_MessageActionBar
  .mx_MessageActionBar_iconButton.mx_MessageActionBar_expandCollapseMessageButton {
  --MessageActionBar-icon-size: 12px;
}
:root {
  --MessageTimestamp-width: 46px;
  --MessageTimestamp-max-width: 80px;
  --MessageTimestamp-color: #acacac;
}
.mx_MessageTimestamp {
  color: #acacac;
  color: var(--MessageTimestamp-color);
  display: block;
  -webkit-font-feature-settings: "tnum";
  font-feature-settings: "tnum";
  font-size: 0.625rem;
  font-variant-numeric: tabular-nums;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  white-space: nowrap;
  width: 46px;
  width: var(--MessageTimestamp-width);
}
.mx_MessageTimestamp_lateIcon {
  color: inherit;
  position: absolute;
  right: 100%;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.mx_MjolnirBody {
  opacity: 0.4;
}
.mx_ReactionsRow {
  color: var(--cpd-color-text-primary);
  margin: 6px 0;
}
.mx_ReactionsRow .mx_ReactionsRow_addReactionButton {
  display: inline-block;
  height: 24px;
  margin-left: 4px;
  margin-right: 4px;
  position: relative;
  vertical-align: middle;
  visibility: hidden;
  width: 24px;
}
.mx_ReactionsRow .mx_ReactionsRow_addReactionButton:before {
  background-color: var(--cpd-color-gray-800);
  content: "";
  height: 100%;
  -webkit-mask-image: url(../../img/element-icons/room/message-bar/emoji.27bdbc0.svg);
  mask-image: url(../../img/element-icons/room/message-bar/emoji.27bdbc0.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 16px;
  mask-size: 16px;
  position: absolute;
  width: 100%;
}
.mx_ReactionsRow
  .mx_ReactionsRow_addReactionButton.mx_ReactionsRow_addReactionButton_active {
  visibility: visible;
}
.mx_ReactionsRow
  .mx_ReactionsRow_addReactionButton.mx_ReactionsRow_addReactionButton_active:before,
.mx_ReactionsRow .mx_ReactionsRow_addReactionButton:hover:before {
  background-color: var(--cpd-color-text-primary);
}
.mx_EventTile:hover .mx_ReactionsRow_addReactionButton {
  visibility: visible;
}
.mx_ReactionsRow_showAll {
  color: var(--cpd-color-gray-800);
}
.mx_ReactionsRow_showAll.mx_AccessibleButton_kind_link_inline {
  font-size: 0.75rem;
  line-height: 1.25rem;
  -webkit-margin-start: 4px;
  margin-inline-start: 4px;
  vertical-align: middle;
}
.mx_ReactionsRow_showAll.mx_AccessibleButton_kind_link_inline:hover {
  color: var(--cpd-color-text-primary);
}
.mx_ReactionsRowButton {
  background-color: var(--cpd-color-gray-300);
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 10px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  line-height: 1.25rem;
  padding: 1px 6px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_ReactionsRowButton:hover {
  border-color: var(--cpd-color-gray-400);
}
.mx_ReactionsRowButton.mx_ReactionsRowButton_selected {
  background-color: var(--cpd-color-green-300);
  border-color: var(--cpd-color-green-800);
}
.mx_ReactionsRowButton.mx_AccessibleButton_disabled {
  cursor: not-allowed;
}
.mx_ReactionsRowButton .mx_ReactionsRowButton_content {
  max-width: 100px;
  overflow: hidden;
  padding-right: 4px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_RedactedBody {
  color: var(--cpd-color-text-secondary);
  padding-left: 20px;
  position: relative;
  vertical-align: middle;
  white-space: pre-wrap;
}
.mx_RedactedBody:before {
  background-color: var(--cpd-color-icon-tertiary);
  content: "";
  height: 14px;
  left: 0;
  -webkit-mask-image: url(../../img/feather-customised/trash.custom.1dac3e5.svg);
  mask-image: url(../../img/feather-customised/trash.custom.1dac3e5.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 1px;
  width: 14px;
}
.mx_RoomAvatarEvent_avatar {
  display: inline;
  position: relative;
  top: 3px;
}
.mx_TextualEvent {
  line-height: normal;
  overflow-y: hidden;
}
.mx_TextualEvent a {
  color: var(--cpd-color-text-action-accent);
  cursor: pointer;
}
.mx_RoomView_searchResultsPanel .mx_TextualEvent {
  opacity: 1;
}
.mx_TimelineSeparator {
  clear: both;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 4px 0;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-secondary);
  font: var(--cpd-font-body-md-regular);
}
.mx_TimelineSeparator > hr {
  -webkit-box-flex: 1;
  border: none;
  border-bottom: 1px solid var(--cpd-color-gray-400);
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  height: 0;
}
.mx_UnknownBody {
  white-space: pre-wrap;
}
.mx_EventTile_content.mx_ViewSourceEvent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 0.75rem;
  line-height: normal;
  opacity: 0.6;
  overflow-x: auto;
  width: 100%;
}
.mx_EventTile_content.mx_ViewSourceEvent code,
.mx_EventTile_content.mx_ViewSourceEvent pre {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_EventTile_content.mx_ViewSourceEvent pre {
  line-height: 1.2;
  margin: 3.5px 0;
}
.mx_EventTile_content.mx_ViewSourceEvent .mx_ViewSourceEvent_toggle {
  --ViewSourceEvent_toggle-size: 12px;
  background-color: var(--cpd-color-text-action-accent);
  border-radius: 0;
  -webkit-mask-image: url(../../img/element-icons/maximise-expand.c678e40.svg);
  mask-image: url(../../img/element-icons/maximise-expand.c678e40.svg);
  -webkit-mask-position: 0 center;
  mask-position: 0 center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: auto 12px;
  mask-size: auto 12px;
  -webkit-mask-size: auto var(--ViewSourceEvent_toggle-size);
  mask-size: auto var(--ViewSourceEvent_toggle-size);
  min-width: 12px;
  min-width: var(--ViewSourceEvent_toggle-size);
  visibility: hidden;
  width: 12px;
  width: var(--ViewSourceEvent_toggle-size);
}
.mx_EventTile:hover
  .mx_EventTile_content.mx_ViewSourceEvent
  .mx_ViewSourceEvent_toggle {
  visibility: visible;
}
.mx_EventTile_content.mx_ViewSourceEvent.mx_ViewSourceEvent_expanded
  .mx_ViewSourceEvent_toggle {
  -ms-flex-item-align: end;
  align-self: flex-end;
  height: var(--ViewSourceEvent_toggle-size);
  margin-bottom: 5px;
  -webkit-mask-image: url(../../img/element-icons/minimise-collapse.c9216fb.svg);
  mask-image: url(../../img/element-icons/minimise-collapse.c9216fb.svg);
  -webkit-mask-position: 0 bottom;
  mask-position: 0 bottom;
}
.mx_EventTileBubble.mx_cryptoEvent {
  margin: var(--EventTileBubble_margin-block) auto;
}
.mx_EventTileBubble.mx_cryptoEvent.mx_cryptoEvent_icon:before {
  background-color: #fff;
  -webkit-mask-image: url(../../img/e2e/normal.ab42a7b.svg);
  mask-image: url(../../img/e2e/normal.ab42a7b.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 80%;
  mask-size: 80%;
}
.mx_EventTileBubble.mx_cryptoEvent.mx_cryptoEvent_icon:after {
  background-color: #91a1c0;
  -webkit-mask-image: url(../../img/e2e/normal.ab42a7b.svg);
  mask-image: url(../../img/e2e/normal.ab42a7b.svg);
}
.mx_EventTileBubble.mx_cryptoEvent.mx_cryptoEvent_icon_verified:after {
  background-color: var(--cpd-color-text-action-accent);
  -webkit-mask-image: url(../../img/e2e/verified.2ccf64e.svg);
  mask-image: url(../../img/e2e/verified.2ccf64e.svg);
}
.mx_EventTileBubble.mx_cryptoEvent.mx_cryptoEvent_icon_warning:after {
  background-color: var(--cpd-color-icon-critical-primary);
  -webkit-mask-image: url(../../img/e2e/warning.71ffc83.svg);
  mask-image: url(../../img/e2e/warning.71ffc83.svg);
}
.mx_EventTileBubble.mx_cryptoEvent .mx_cryptoEvent_buttons,
.mx_EventTileBubble.mx_cryptoEvent .mx_cryptoEvent_state {
  grid-column: 3;
  grid-row: 1/3;
}
.mx_EventTileBubble.mx_cryptoEvent .mx_cryptoEvent_buttons {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 5px;
}
.mx_EventTileBubble.mx_cryptoEvent .mx_cryptoEvent_state {
  color: var(--cpd-color-gray-800);
  font-size: 0.75rem;
  margin: auto 0;
  overflow-wrap: break-word;
  padding: 10px 20px;
  text-align: center;
  width: 130px;
}
.mx_PollHistory_content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 600px;
  width: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_PollHistory_header.mx_Heading_h2 {
  margin-bottom: 16px;
}
.mx_PollHistoryList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  max-height: 100%;
}
.mx_PollHistoryList_list {
  list-style: none;
  margin-block: 0;
  overflow: auto;
  padding-inline: 0;
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  -ms-flex-line-pack: start;
  align-content: flex-start;
  display: grid;
  grid-gap: 20px;
  margin: 32px 0;
  padding-right: 64px;
}
.mx_PollHistoryList_list.mx_PollHistoryList_list_ENDED {
  grid-gap: 32px;
}
.mx_PollHistoryList_noResults {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  padding: 0 64px;
  width: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  color: var(--cpd-color-text-secondary);
  justify-content: center;
  line-height: 1.5rem;
  text-align: center;
}
.mx_PollHistoryList_noResults .mx_PollHistoryList_loadMorePolls {
  margin-top: 16px;
}
.mx_PollHistoryList_loading {
  color: var(--cpd-color-text-secondary);
  text-align: center;
}
.mx_PollHistoryList_loading.mx_PollHistoryList_noResultsYet {
  margin: auto;
}
.mx_PollHistoryList_loadMorePolls {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
.mx_BaseCard {
  --BaseCard_EventTile_line-padding-block: 2px;
  --BaseCard_EventTile-spacing-inline: 36px;
  --BaseCard_header-button-size: 28px;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  font-size: var(--cpd-font-size-body-md);
}
.mx_BaseCard,
.mx_BaseCard .mx_BaseCard_header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_BaseCard .mx_BaseCard_header {
  border-bottom: 1px solid transparent;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 64px;
  padding: var(--cpd-space-3x);
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  gap: var(--cpd-space-2x);
  justify-content: space-between;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_BaseCard .mx_BaseCard_header > h2 {
  font: var(--cpd-font-body-sm-semibold);
  margin: 0 44px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_BaseCard .mx_BaseCard_header .mx_BaseCard_header_title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  height: 24px;
  justify-content: space-between;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_BaseCard
  .mx_BaseCard_header
  .mx_BaseCard_header_title
  .mx_BaseCard_header_title_heading {
  color: var(--cpd-color-text-primary);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_BaseCard
  .mx_BaseCard_header
  .mx_BaseCard_header_title
  .mx_BaseCard_header_title_button--option {
  height: var(--BaseCard_header-button-size);
  position: relative;
  width: var(--BaseCard_header-button-size);
}
.mx_BaseCard
  .mx_BaseCard_header
  .mx_BaseCard_header_title
  .mx_BaseCard_header_title_button--option:after {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 100%;
  inset-block-start: 0;
  inset-inline-start: 0;
  -webkit-mask-image: url(../../img/element-icons/message/overflow-large.f3afed8.svg);
  mask-image: url(../../img/element-icons/message/overflow-large.f3afed8.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  position: absolute;
  width: 100%;
}
.mx_BaseCard
  .mx_BaseCard_header
  .mx_BaseCard_header_title
  .mx_BaseCard_header_title_button--option:hover:after {
  background-color: var(--cpd-color-text-primary);
}
.mx_BaseCard .mx_AutoHideScrollbar {
  height: 100%;
  min-height: 0;
  scrollbar-gutter: stable;
  width: 100%;
}
.mx_BaseCard .mx_BaseCard_Group {
  margin: 20px 0 16px;
  display: none;
}
.mx_BaseCard .mx_BaseCard_Group > * {
  margin-left: 12px;
  margin-right: 12px;
}
.mx_BaseCard .mx_BaseCard_Group > h2 {
  color: var(--cpd-color-gray-800);
  font: var(--cpd-font-body-sm-medium);
  margin: 12px;
}
.mx_BaseCard .mx_BaseCard_Group .mx_BaseCard_Button {
  padding: 10px;
  -webkit-padding-start: 12px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font: var(--cpd-font-heading-sm-medium);
  height: 20px;
  margin: 0;
  overflow: hidden;
  padding-inline-start: 12px;
  position: relative;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_BaseCard
  .mx_BaseCard_Group
  .mx_BaseCard_Button
  .mx_BaseCard_Button_sublabel {
  color: var(--cpd-color-gray-800);
  margin-left: auto;
}
.mx_BaseCard .mx_BaseCard_Group .mx_BaseCard_Button:hover {
  background-color: rgba(141, 151, 165, 0.1);
}
.mx_BaseCard
  .mx_BaseCard_Group
  .mx_BaseCard_Button.mx_AccessibleButton_disabled {
  padding-right: 12px;
}
.mx_BaseCard
  .mx_BaseCard_Group
  .mx_BaseCard_Button.mx_AccessibleButton_disabled:after {
  content: normal;
}
.mx_BaseCard .mx_BaseCard_footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 4px;
  text-align: center;
  -ms-flex-pack: distribute;
  justify-content: space-around;
}
.mx_BaseCard .mx_BaseCard_footer .mx_AccessibleButton_kind_secondary {
  background-color: rgba(141, 151, 165, 0.2);
  color: var(--cpd-color-text-secondary);
  font: var(--cpd-font-body-md-semibold);
}
.mx_BaseCard .mx_BaseCard_footer .mx_AccessibleButton_disabled {
  cursor: not-allowed;
}
.mx_BaseCard_back,
.mx_BaseCard_close {
  -ms-flex-negative: 0;
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 50%;
  flex-shrink: 0;
  height: var(--BaseCard_header-button-size);
  position: relative;
  width: var(--BaseCard_header-button-size);
}
.mx_BaseCard_back:hover,
.mx_BaseCard_close:hover {
  background-color: var(--cpd-color-bg-subtle-primary);
}
.mx_BaseCard_back:before,
.mx_BaseCard_close:before {
  background-color: var(--cpd-color-icon-secondary);
  content: "";
  height: inherit;
  left: 0;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  position: absolute;
  top: 0;
  width: inherit;
}
.mx_BaseCard_back {
  -webkit-box-ordinal-group: 1;
  -ms-flex-order: 0;
  order: 0;
}
.mx_BaseCard_back:before {
  -webkit-mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  -webkit-mask-size: 22px;
  mask-size: 22px;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}
.mx_BaseCard_close {
  -webkit-box-ordinal-group: 1000;
  -ms-flex-order: 999;
  order: 999;
}
.mx_BaseCard_close:before {
  -webkit-mask-image: url(../../icons/close.dce71fd.svg);
  mask-image: url(../../icons/close.dce71fd.svg);
}
.mx_ContextualMenu_wrapper.mx_BaseCard_header_title .mx_ContextualMenu {
  position: static;
}
.mx_ContextualMenu_wrapper.mx_BaseCard_header_title
  .mx_ContextualMenu
  span:first-of-type {
  color: var(--cpd-color-text-primary);
  font-size: inherit;
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_ContextualMenu_wrapper.mx_BaseCard_header_title .mx_ContextualMenu {
  border: var(--cpd-border-width-1) solid
    var(--cpd-color-border-interactive-secondary);
  -webkit-box-shadow: 0 4px 24px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.1);
  color: var(--cpd-color-text-primary);
  font: var(--cpd-font-body-sm-regular);
  padding-bottom: 10px;
  padding-top: 10px;
}
.mx_ContextualMenu_wrapper.mx_BaseCard_header_title
  .mx_ContextualMenu_chevron_top {
  border-bottom-color: var(--cpd-color-border-interactive-secondary);
  left: auto;
  right: 22px;
}
.mx_ContextualMenu_wrapper.mx_BaseCard_header_title
  .mx_ContextualMenu_chevron_top:after {
  border: inherit;
  border-bottom-color: var(--cpd-color-bg-canvas-default);
  content: "";
  left: -8px;
  position: absolute;
  top: 1px;
}
.mx_BaseCard_headerProp {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 100%;
  flex: 1 1 100%;
}
.mx_EncryptionInfo_spinner .mx_Spinner {
  margin-bottom: 15px;
  margin-top: 25px;
}
.mx_EncryptionInfo_spinner {
  text-align: center;
}
.mx_PinnedMessagesCard .mx_PinnedMessagesCard_empty_wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
}
.mx_PinnedMessagesCard
  .mx_PinnedMessagesCard_empty_wrapper
  .mx_PinnedMessagesCard_empty {
  height: -webkit-max-content;
  height: -moz-max-content;
  height: max-content;
  margin: auto 40px;
  text-align: center;
}
.mx_PinnedMessagesCard
  .mx_PinnedMessagesCard_empty_wrapper
  .mx_PinnedMessagesCard_empty
  .mx_PinnedMessagesCard_MessageActionBar {
  cursor: inherit;
  margin: 0 auto;
  pointer-events: none;
  position: static;
  visibility: visible;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
.mx_PinnedMessagesCard
  .mx_PinnedMessagesCard_empty_wrapper
  .mx_PinnedMessagesCard_empty
  .mx_PinnedMessagesCard_MessageActionBar:before {
  content: normal;
}
.mx_PinnedMessagesCard
  .mx_PinnedMessagesCard_empty_wrapper
  .mx_PinnedMessagesCard_empty
  .mx_PinnedMessagesCard_MessageActionBar
  .mx_MessageActionBar_optionsButton {
  background: var(--MessageActionBar-item-hover-background);
  border-radius: var(--MessageActionBar-item-hover-borderRadius);
  color: var(--cpd-color-icon-primary);
  z-index: var(--MessageActionBar-item-hover-zIndex);
}
.mx_PinnedMessagesCard
  .mx_PinnedMessagesCard_empty_wrapper
  .mx_PinnedMessagesCard_empty
  .mx_PinnedMessagesCard_empty_header {
  color: var(--cpd-color-text-primary);
  margin-block: 24px 20px;
}
.mx_PinnedMessagesCard
  .mx_PinnedMessagesCard_empty_wrapper
  .mx_PinnedMessagesCard_empty
  > span {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  line-height: 0.9375rem;
}
.mx_PinnedMessagesCard .mx_EventTile_body {
  word-break: break-word;
}
.mx_RoomSummaryCard .mx_RoomSummaryCard_container {
  margin: 20px var(--cpd-space-4x) 0;
  text-align: center;
}
.mx_RoomSummaryCard .mx_RoomSummaryCard_alias,
.mx_RoomSummaryCard .mx_RoomSummaryCard_roomName {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: pre-wrap;
}
.mx_RoomSummaryCard .mx_RoomSummaryCard_alias {
  text-overflow: ellipsis;
}
.mx_RoomSummaryCard .mx_RoomSummaryCard_aboutGroup .mx_RoomSummaryCard_Button {
  padding-left: 44px;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_aboutGroup
  .mx_RoomSummaryCard_Button:before {
  background-color: var(--cpd-color-icon-tertiary);
  content: "";
  height: 24px;
  left: 10px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  position: absolute;
  top: 8px;
  width: 24px;
}
.mx_RoomSummaryCard .mx_RoomSummaryCard_topic {
  padding: 0 12px;
}
.mx_RoomSummaryCard .mx_RoomSummaryCard_topic .mx_Box {
  width: 100%;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_topic
  .mx_RoomSummaryCard_topic_container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_RoomSummaryCard .mx_RoomSummaryCard_topic .mx_RoomSummaryCard_topic_edit {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
.mx_RoomSummaryCard .mx_RoomSummaryCard_topic p {
  margin: 0;
  min-width: 0;
  white-space: pre-wrap;
  width: 100%;
}
.mx_RoomSummaryCard .mx_RoomSummaryCard_topic a {
  cursor: pointer;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_topic
  .mx_RoomSummaryCard_topic_chevron {
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_topic.mx_RoomSummaryCard_topic_collapsed
  p {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_topic.mx_RoomSummaryCard_topic_collapsed
  .mx_RoomSummaryCard_topic_chevron {
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
.mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button {
  color: var(--cpd-color-gray-800);
  height: auto;
  padding: 0;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button
  .mx_RoomSummaryCard_icon_app {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  padding: 10px 48px 10px 12px;
  text-overflow: ellipsis;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button
  .mx_RoomSummaryCard_icon_app
  span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-right: 10px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-primary);
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button
  .mx_RoomSummaryCard_app_maximiseToggle,
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button
  .mx_RoomSummaryCard_app_options,
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button
  .mx_RoomSummaryCard_app_pinToggle {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 100%;
  min-width: 24px;
  padding: 12px 4px;
  position: absolute;
  top: 0;
  width: 24px;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button
  .mx_RoomSummaryCard_app_maximiseToggle:hover:after,
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button
  .mx_RoomSummaryCard_app_options:hover:after,
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button
  .mx_RoomSummaryCard_app_pinToggle:hover:after {
  background-color: rgba(141, 151, 165, 0.1);
  border-radius: 12px;
  content: "";
  height: 24px;
  left: 0;
  position: absolute;
  top: 8px;
  width: 24px;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button
  .mx_RoomSummaryCard_app_maximiseToggle:before,
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button
  .mx_RoomSummaryCard_app_options:before,
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button
  .mx_RoomSummaryCard_app_pinToggle:before {
  background-color: var(--cpd-color-icon-tertiary);
  content: "";
  height: 16px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 16px;
  mask-size: 16px;
  position: absolute;
  width: 16px;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button
  .mx_RoomSummaryCard_app_pinToggle {
  right: 8px;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button
  .mx_RoomSummaryCard_app_pinToggle:before {
  -webkit-mask-image: url(../../img/element-icons/room/pin-upright.340b3b6.svg);
  mask-image: url(../../img/element-icons/room/pin-upright.340b3b6.svg);
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button
  .mx_RoomSummaryCard_app_maximiseToggle {
  right: 32px;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button
  .mx_RoomSummaryCard_app_maximiseToggle:before {
  -webkit-mask-image: url(../../img/element-icons/maximise-expand.c678e40.svg);
  mask-image: url(../../img/element-icons/maximise-expand.c678e40.svg);
  -webkit-mask-size: 14px;
  mask-size: 14px;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button
  .mx_RoomSummaryCard_app_options {
  display: none;
  right: 56px;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button
  .mx_RoomSummaryCard_app_options:before {
  -webkit-mask-image: url(../../img/element-icons/room/ellipsis.c7bfee4.svg);
  mask-image: url(../../img/element-icons/room/ellipsis.c7bfee4.svg);
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button.mx_RoomSummaryCard_Button_pinned:after {
  opacity: 0.2;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button.mx_RoomSummaryCard_Button_pinned
  .mx_RoomSummaryCard_app_pinToggle:before {
  background-color: var(--cpd-color-text-action-accent);
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button.mx_RoomSummaryCard_Button_maximised:after {
  opacity: 0.2;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button.mx_RoomSummaryCard_Button_maximised
  .mx_RoomSummaryCard_app_maximiseToggle:before {
  background-color: var(--cpd-color-text-action-accent);
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button:hover
  .mx_RoomSummaryCard_icon_app {
  padding-right: 72px;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button:hover
  .mx_RoomSummaryCard_app_options {
  display: inline;
  display: initial;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button:before {
  content: normal;
}
.mx_RoomSummaryCard
  .mx_RoomSummaryCard_appsGroup
  .mx_RoomSummaryCard_Button:after {
  pointer-events: none;
  top: 8px;
}
.mx_RoomSummaryCard .mx_AccessibleButton_kind_link {
  font-size: 0.8125rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin-bottom: 12px;
  margin-top: 12px;
}
.mx_RoomSummaryCard_badges {
  margin: var(--cpd-space-4x) 0;
}
.mx_RoomSummaryCard_header {
  padding: 15px 12px;
}
.mx_RoomSummaryCard_search input {
  border: 0 !important;
  cursor: pointer;
  margin: 0 !important;
}
.mx_RoomSummaryCard_searchBtn {
  background: var(--cpd-color-bg-canvas-default);
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 50%;
  color: var(--cpd-color-icon-primary);
  cursor: pointer;
  height: 36px;
  padding: var(--cpd-space-2x);
  width: 36px;
}
.mx_RoomSummaryCard_searchBtn:hover {
  background: var(--cpd-color-bg-subtle-primary);
}
.mx_RoomSummaryCard_roomName {
  margin: 12px 0 4px;
}
.mx_ThreadPanel {
  height: 100px;
  overflow: visible;
}
.mx_ThreadPanel
  .mx_BaseCard_header
  .mx_BaseCard_header_title
  .mx_BaseCard_header_title_heading {
  margin-right: auto;
}
.mx_ThreadPanel
  .mx_BaseCard_header
  .mx_BaseCard_header_title
  .mx_AccessibleButton {
  color: var(--cpd-color-text-secondary);
  font-size: 12px;
}
.mx_ThreadPanel
  .mx_BaseCard_header
  .mx_BaseCard_header_title
  .mx_ThreadPanel_vertical_separator {
  border-left: 1px solid var(--cpd-color-gray-400);
  height: 16px;
  margin-left: var(--cpd-space-3x);
  margin-right: var(--cpd-space-1x);
}
.mx_ThreadPanel
  .mx_BaseCard_header
  .mx_BaseCard_header_title
  .mx_ThreadPanel_dropdown {
  border-radius: 4px;
  line-height: 1.5;
  padding: 3px 4px 3px 8px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.mx_ThreadPanel
  .mx_BaseCard_header
  .mx_BaseCard_header_title
  .mx_ThreadPanel_dropdown:hover,
.mx_ThreadPanel
  .mx_BaseCard_header
  .mx_BaseCard_header_title
  .mx_ThreadPanel_dropdown[aria-expanded="true"] {
  background: var(--cpd-color-gray-400);
}
.mx_ThreadPanel
  .mx_BaseCard_header
  .mx_BaseCard_header_title
  .mx_ThreadPanel_dropdown:before {
  background: currentColor;
  content: "";
  float: right;
  height: 18px;
  -webkit-mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100%;
  mask-size: 100%;
  width: 18px;
}
.mx_ThreadPanel .mx_AutoHideScrollbar,
.mx_ThreadPanel .mx_RoomView_messagePanelSpinner {
  background-color: var(--cpd-color-bg-canvas-default);
  border-radius: 8px;
  -webkit-padding-end: 0;
  height: 100%;
  overflow-y: scroll;
  padding-inline-end: 0;
}
.mx_ThreadPanel .mx_EventTile[data-layout="bubbles"] .mx_MessageActionBar {
  right: 0;
  top: -36px;
  z-index: 10;
}
.mx_ThreadPanel.mx_ThreadView {
  max-height: 100%;
}
.mx_ThreadPanel.mx_ThreadView .mx_ThreadView_timelinePanelWrapper {
  min-height: 0;
  position: relative;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
.mx_ThreadPanel.mx_ThreadView
  .mx_ThreadView_timelinePanelWrapper
  .mx_FileDropTarget {
  border-radius: 8px;
}
.mx_ThreadPanel.mx_ThreadView .mx_MessageComposer_sendMessage {
  margin-right: 0;
}
.mx_ThreadPanel.mx_ThreadView .mx_Autocomplete {
  width: calc(100% + 140px);
}
.mx_ThreadPanel.mx_ThreadView.mx_ThreadView_narrow .mx_Autocomplete {
  width: calc(100% + 108px);
}
.mx_ThreadPanel .mx_RoomView_messagePanel .mx_RoomView_messageListWrapper {
  width: calc(100% + 6px);
}
.mx_ThreadPanel .mx_RoomView_MessageList {
  -webkit-padding-start: 8px;
  padding-inline-start: 8px;
  -webkit-padding-end: 8px;
  content-visibility: visible;
  padding-inline-end: 8px;
}
.mx_ThreadPanel .mx_EventTile,
.mx_ThreadPanel .mx_GenericEventListSummary {
  padding-top: 0;
}
.mx_ThreadPanel .mx_EventTile .mx_TimelineSeparator,
.mx_ThreadPanel .mx_GenericEventListSummary .mx_TimelineSeparator {
  display: none;
}
.mx_ThreadPanel .mx_EventTile.mx_EventTile_clamp:hover,
.mx_ThreadPanel .mx_GenericEventListSummary.mx_EventTile_clamp:hover {
  cursor: pointer;
}
.mx_ThreadPanel .mx_MessageComposer {
  background-color: var(--cpd-color-bg-canvas-default);
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin-top: 8px;
  padding: 0 8px;
}
.mx_ThreadPanel .mx_MessageTimestamp {
  color: var(--cpd-color-text-secondary);
}
.mx_ThreadPanel .mx_BaseCard_footer {
  font-size: 0.75rem;
  text-align: left;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  gap: 4px;
  justify-content: flex-end;
  padding-right: 8px;
  position: relative;
  top: 2px;
}
.mx_ThreadPanel .mx_BaseCard_footer .mx_AccessibleButton_kind_link_inline {
  color: var(--cpd-color-text-secondary);
}
.mx_ThreadPanel_viewInRoom:before {
  -webkit-mask-image: url(../../img/element-icons/view-in-room.afeddb7.svg);
  mask-image: url(../../img/element-icons/view-in-room.afeddb7.svg);
}
.mx_ThreadPanel_copyLinkToThread:before {
  -webkit-mask-image: url(../../img/element-icons/link.e24e5a8.svg);
  mask-image: url(../../img/element-icons/link.e24e5a8.svg);
}
.mx_ThreadPanel_empty {
  background: var(--cpd-color-bg-canvas-default);
  border-radius: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  bottom: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  justify-content: center;
  left: 0;
  padding: 20px;
  position: absolute;
  top: 0;
  width: 100%;
}
.mx_ThreadPanel_empty h2 {
  color: var(--cpd-color-text-primary);
  font-size: 1.125rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin-bottom: 10px;
  margin-top: 24px;
}
.mx_ThreadPanel_empty p {
  color: var(--cpd-color-text-secondary);
  font-size: 0.9375rem;
  margin: 10px 0;
}
.mx_ThreadPanel_empty button {
  background: none;
  border: none;
  color: var(--cpd-color-text-action-accent);
  font-size: 0.9375rem;
}
.mx_ThreadPanel_empty button:active,
.mx_ThreadPanel_empty button:hover {
  cursor: pointer;
  text-decoration: underline;
}
.mx_ThreadPanel_empty .mx_ThreadPanel_empty_tip {
  font-size: 0.75rem;
  line-height: 0.9375rem;
}
.mx_ThreadPanel_empty .mx_ThreadPanel_empty_tip > b {
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_ThreadPanel_largeIcon {
  background: var(--cpd-color-bg-subtle-primary);
  border-radius: 50%;
  height: 28px;
  padding: 18px;
  width: 28px;
}
.mx_ThreadPanel_largeIcon:after {
  background-color: var(--cpd-color-icon-tertiary) !important;
  content: "";
  display: inline-block;
  height: 18px;
  height: inherit;
  -webkit-mask-image: url(../../img/element-icons/thread-summary.4b1ebec.svg);
  mask-image: url(../../img/element-icons/thread-summary.4b1ebec.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  min-width: 18px;
  width: inherit;
}
.mx_ContextualMenu_wrapper .mx_ThreadPanel_Header_FilterOptionItem {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 10px 20px 10px 30px;
  position: relative;
}
.mx_ContextualMenu_wrapper .mx_ThreadPanel_Header_FilterOptionItem:hover {
  background-color: var(--cpd-color-bg-subtle-secondary);
}
.mx_ContextualMenu_wrapper
  .mx_ThreadPanel_Header_FilterOptionItem[aria-checked="true"]
  :first-child {
  margin-left: -20px;
}
.mx_ContextualMenu_wrapper
  .mx_ThreadPanel_Header_FilterOptionItem[aria-checked="true"]
  :first-child:before {
  background-color: var(--cpd-color-text-primary);
  content: "";
  display: inline-block;
  height: 12px;
  margin-right: 8px;
  -webkit-mask-image: url(../../img/feather-customised/check.bfca953.svg);
  mask-image: url(../../img/feather-customised/check.bfca953.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100%;
  mask-size: 100%;
  vertical-align: middle;
  width: 12px;
}
.mx_ContextualMenu_wrapper .mx_ThreadPanel_Header_FilterOptionItem :last-child {
  color: var(--cpd-color-text-secondary);
}
.mx_TimelineCard .mx_TimelineCard_timeline {
  overflow: hidden;
  position: relative;
  -webkit-box-flex: 1;
  border-radius: 8px;
  -ms-flex: 1;
  flex: 1;
}
.mx_TimelineCard .mx_NewRoomIntro {
  -webkit-margin-start: var(--BaseCard_EventTile-spacing-inline);
  margin-inline-start: var(--BaseCard_EventTile-spacing-inline);
  -webkit-margin-end: var(--BaseCard_EventTile-spacing-inline);
  margin-inline-end: var(--BaseCard_EventTile-spacing-inline);
}
.mx_TimelineCard .mx_EventTile_content {
  margin-right: 0;
}
.mx_TimelineCard .mx_EventTile .mx_ThreadSummary {
  padding-right: 11px;
  position: relative;
}
.mx_TimelineCard .mx_EventTile .mx_ThreadSummary:after {
  border-bottom: 1px solid #e9edf1;
  bottom: -16px;
  content: "";
  display: block;
  height: 1px;
  left: 0;
  position: absolute;
  width: 100%;
}
.mx_TimelineCard .mx_EventTile[data-layout="bubbles"],
.mx_TimelineCard .mx_EventTile[data-layout="irc"] {
  --TimelineCard_ReadReceiptGroup-inset-block-start: -6px;
}
.mx_TimelineCard .mx_EventTile[data-layout="bubbles"] .mx_EventTile_line,
.mx_TimelineCard
  .mx_EventTile[data-layout="bubbles"].mx_EventTile_info
  .mx_EventTile_line,
.mx_TimelineCard .mx_EventTile[data-layout="irc"] .mx_EventTile_line,
.mx_TimelineCard
  .mx_EventTile[data-layout="irc"].mx_EventTile_info
  .mx_EventTile_line {
  padding: var(--BaseCard_EventTile_line-padding-block)
    var(--BaseCard_EventTile-spacing-inline);
  -webkit-padding-end: 46px;
  padding-inline-end: 46px;
  -webkit-padding-end: var(--MessageTimestamp-width);
  padding-inline-end: var(--MessageTimestamp-width);
}
.mx_TimelineCard
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_line
  .mx_EventTile_e2eIcon,
.mx_TimelineCard
  .mx_EventTile[data-layout="bubbles"].mx_EventTile_info
  .mx_EventTile_line
  .mx_EventTile_e2eIcon,
.mx_TimelineCard
  .mx_EventTile[data-layout="irc"]
  .mx_EventTile_line
  .mx_EventTile_e2eIcon,
.mx_TimelineCard
  .mx_EventTile[data-layout="irc"].mx_EventTile_info
  .mx_EventTile_line
  .mx_EventTile_e2eIcon {
  inset-inline-start: 8px;
}
.mx_TimelineCard
  .mx_EventTile[data-layout="bubbles"].mx_EventTile_info
  .mx_EventTile_avatar,
.mx_TimelineCard
  .mx_EventTile[data-layout="irc"].mx_EventTile_info
  .mx_EventTile_avatar {
  inset-inline-start: 18px;
}
.mx_TimelineCard .mx_EventTile[data-layout="bubbles"].mx_EventTile_info,
.mx_TimelineCard .mx_EventTile[data-layout="irc"].mx_EventTile_info {
  font: var(--cpd-font-body-sm-regular);
}
.mx_TimelineCard .mx_EventTile[data-layout="bubbles"] .mx_EventTile_avatar,
.mx_TimelineCard .mx_EventTile[data-layout="irc"] .mx_EventTile_avatar {
  inset-inline-start: -3px;
}
.mx_TimelineCard .mx_EventTile[data-layout="bubbles"] .mx_EventTile_msgOption,
.mx_TimelineCard .mx_EventTile[data-layout="irc"] .mx_EventTile_msgOption {
  -webkit-margin-end: 0;
  margin-inline-end: 0;
}
.mx_TimelineCard
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_msgOption
  .mx_ReadReceiptGroup,
.mx_TimelineCard
  .mx_EventTile[data-layout="irc"]
  .mx_EventTile_msgOption
  .mx_ReadReceiptGroup {
  top: var(--TimelineCard_ReadReceiptGroup-inset-block-start);
}
.mx_TimelineCard .mx_EventTile[data-layout="bubbles"] .mx_DisambiguatedProfile,
.mx_TimelineCard .mx_EventTile[data-layout="bubbles"] .mx_ReactionsRow,
.mx_TimelineCard .mx_EventTile[data-layout="bubbles"] .mx_ThreadSummary,
.mx_TimelineCard .mx_EventTile[data-layout="irc"] .mx_DisambiguatedProfile,
.mx_TimelineCard .mx_EventTile[data-layout="irc"] .mx_ReactionsRow,
.mx_TimelineCard .mx_EventTile[data-layout="irc"] .mx_ThreadSummary {
  -webkit-margin-start: var(--BaseCard_EventTile-spacing-inline);
  margin-inline-start: var(--BaseCard_EventTile-spacing-inline);
}
.mx_TimelineCard .mx_EventTile[data-layout="bubbles"] .mx_DisambiguatedProfile,
.mx_TimelineCard .mx_EventTile[data-layout="irc"] .mx_DisambiguatedProfile {
  max-width: calc(100% - var(--BaseCard_EventTile-spacing-inline));
}
.mx_TimelineCard
  .mx_EventTile[data-layout="bubbles"]
  .mx_ReplyTile
  .mx_DisambiguatedProfile,
.mx_TimelineCard
  .mx_EventTile[data-layout="irc"]
  .mx_ReplyTile
  .mx_DisambiguatedProfile {
  -webkit-margin-start: 0;
  margin-inline-start: 0;
  max-width: none;
}
.mx_TimelineCard .mx_EventTile[data-layout="bubbles"] .mx_MessageTimestamp,
.mx_TimelineCard .mx_EventTile[data-layout="irc"] .mx_MessageTimestamp {
  font-size: 0.75rem;
  inset-inline: auto 0;
}
.mx_TimelineCard .mx_EventTile[data-layout="bubbles"] .mx_ReactionsRow,
.mx_TimelineCard .mx_EventTile[data-layout="irc"] .mx_ReactionsRow {
  -webkit-margin-end: 8px;
  margin-inline-end: 8px;
}
.mx_TimelineCard .mx_EventTile[data-layout="bubbles"] .mx_ThreadSummary,
.mx_TimelineCard .mx_EventTile[data-layout="irc"] .mx_ThreadSummary {
  -webkit-margin-end: 0;
  margin-inline-end: 0;
  max-width: min(calc(100% - 36px), 600px);
}
.mx_TimelineCard .mx_EventTile[data-layout="irc"] .mx_EventTile_avatar,
.mx_TimelineCard .mx_EventTile[data-layout="irc"] .mx_MessageTimestamp {
  position: absolute;
}
.mx_MatrixChat_useCompactLayout
  .mx_TimelineCard
  .mx_EventTile[data-layout="bubbles"]
  .mx_ReadReceiptGroup {
  top: var(--TimelineCard_ReadReceiptGroup-inset-block-start);
}
.mx_TimelineCard .mx_EventTile[data-layout="bubble"]:before {
  z-index: auto;
}
.mx_TimelineCard
  .mx_EventTile[data-layout="bubble"].mx_EventTile_info
  .mx_MessageActionBar {
  inset-inline-end: 9px;
  inset-inline-end: calc(var(--container-gap-width) + 1px);
}
.mx_TimelineCard .mx_EventTile[data-layout="bubble"] .mx_ReactionsRow {
  position: relative;
}
.mx_TimelineCard .mx_LegacyCallEvent_wrapper {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin: auto 5px;
}
.mx_TimelineCard .mx_LegacyCallEvent_wrapper .mx_LegacyCallEvent {
  margin: 4px;
}
.mx_TimelineCard
  .mx_GenericEventListSummary[data-layout="bubbles"]
  .mx_EventTile_line,
.mx_TimelineCard
  .mx_GenericEventListSummary[data-layout="bubbles"]
  .mx_GenericEventListSummary_unstyledList
  > .mx_EventTile_info
  .mx_EventTile_avatar
  ~ .mx_EventTile_line,
.mx_TimelineCard
  .mx_GenericEventListSummary[data-layout="irc"]
  .mx_EventTile_line,
.mx_TimelineCard
  .mx_GenericEventListSummary[data-layout="irc"]
  .mx_GenericEventListSummary_unstyledList
  > .mx_EventTile_info
  .mx_EventTile_avatar
  ~ .mx_EventTile_line {
  -webkit-padding-start: var(--BaseCard_EventTile-spacing-inline);
  padding-inline-start: var(--BaseCard_EventTile-spacing-inline);
  -webkit-padding-end: 46px;
  padding-inline-end: 46px;
  -webkit-padding-end: var(--MessageTimestamp-width);
  padding-inline-end: var(--MessageTimestamp-width);
}
.mx_TimelineCard .mx_WhoIsTypingTile {
  margin-left: -12px;
}
.mx_TimelineCard .mx_WhoIsTypingTile_avatars {
  -ms-flex-preferred-size: 48px;
  flex-basis: 48px;
}
.mx_TimelineCard
  .mx_GenericEventListSummary_unstyledList
  .mx_EventTile[data-layout="bubble"]
  .mx_ReadReceiptGroup,
.mx_TimelineCard
  .mx_RoomView_MessageList
  .mx_EventTile[data-layout="bubble"]
  .mx_ReadReceiptGroup {
  inset-inline-end: calc(
    var(--ReadReceiptGroup_EventBubbleTile-spacing-end) * -1 + 14px
  );
  inset-inline-end: calc(
    var(--ReadReceiptGroup_EventBubbleTile-spacing-end) * -1 +
      var(--container-gap-width) + 6px
  );
}
.mx_TimelineCard
  .mx_GenericEventListSummary_unstyledList
  .mx_EventTile[data-layout="bubble"].mx_EventTile_info
  .mx_ReadReceiptGroup,
.mx_TimelineCard
  .mx_RoomView_MessageList
  .mx_EventTile[data-layout="bubble"].mx_EventTile_info
  .mx_ReadReceiptGroup {
  inset-inline-end: -4px;
}
.mx_UserInfo.mx_BaseCard {
  font-size: var(--cpd-font-size-body-sm);
  overflow-y: auto;
  padding-top: 0;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_cancel {
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 4px;
  cursor: pointer;
  margin: 9px;
  position: absolute;
  top: 0;
  z-index: 1;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_cancel div {
  background-color: #91a1c0;
  height: 16px;
  -webkit-mask-image: url(../../img/minimise.86e5d8e.svg);
  mask-image: url(../../img/minimise.86e5d8e.svg);
  -webkit-mask-position: 7px center;
  mask-position: 7px center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  padding: 4px;
  width: 16px;
}
.mx_UserInfo.mx_BaseCard h2 {
  font-size: 1.125rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin: 18px 0 0;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_container {
  padding: 8px 16px;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_container:not(.mx_UserInfo_separator) {
  padding-bottom: 0;
  padding-top: 16px;
}
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_container:not(.mx_UserInfo_separator)
  > :not(h3) {
  -webkit-margin-start: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-inline-start: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-flow: column;
  flex-flow: column;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  row-gap: 8px;
}
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_container
  .mx_UserInfo_container_verifyButton {
  margin-top: 8px;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_separator {
  border-bottom: 1px solid var(--cpd-color-alpha-gray-400);
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_memberDetailsContainer {
  margin-bottom: 8px;
  padding-bottom: 0;
  padding-top: 0;
}
.mx_UserInfo.mx_BaseCard .mx_RoomTile_titleContainer {
  width: 154px;
}
.mx_UserInfo.mx_BaseCard .mx_RoomTile_badge {
  display: none;
}
.mx_UserInfo.mx_BaseCard .mx_RoomTile_title {
  width: 160px;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_avatar {
  margin: 24px 32px 0;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_avatar .mx_UserInfo_avatar_transition {
  aspect-ratio: 1/1;
  margin: 0 auto;
  max-width: 30vh;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_avatar
  .mx_UserInfo_avatar_transition
  .mx_BaseAvatar {
  font-size: 4rem;
}
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_avatar
  .mx_UserInfo_avatar_transition
  .mx_BaseAvatar,
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_avatar
  .mx_UserInfo_avatar_transition
  .mx_BaseAvatar
  img {
  height: 100%;
  width: 100%;
}
.mx_UserInfo.mx_BaseCard h3 {
  color: var(--cpd-color-gray-800);
  font: var(--cpd-font-heading-sm-semibold);
  font-weight: var(--cpd-font-weight-semibold);
  margin: 4px 0;
  text-transform: uppercase;
}
.mx_UserInfo.mx_BaseCard p {
  margin: 5px 0;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_profile {
  text-align: center;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_profile h2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 1.0625rem;
  line-height: 1.5625rem;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_profile h2 span {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_profile h2 .mx_E2EIcon {
  margin-top: 3px;
  -webkit-margin-end: 4px;
  margin-inline-end: 4px;
  min-width: 18px;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_profile .mx_UserInfo_profileStatus {
  margin-top: 12px;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_memberDetails .mx_UserInfo_profileField {
  margin: 6px 0;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_memberDetails .mx_UserInfo_profileField,
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_memberDetails
  .mx_UserInfo_profileField
  .mx_UserInfo_roleDescription {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_memberDetails
  .mx_UserInfo_profileField
  .mx_UserInfo_roleDescription {
  margin: 11px 0 12px;
}
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_memberDetails
  .mx_UserInfo_profileField
  .mx_Field {
  margin: 0;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_field {
  line-height: 1rem;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_field.mx_UserInfo_destructive {
  color: var(--cpd-color-text-critical-primary);
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_statusMessage {
  display: -webkit-box;
  font: var(--cpd-font-body-sm-regular);
  font-size: 0.6875rem;
  line-height: 1rem;
  max-height: 3rem;
  opacity: 0.5;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.mx_UserInfo.mx_BaseCard .mx_AutoHideScrollbar {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_devices .mx_UserInfo_device {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 8px 0;
}
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_devices
  .mx_UserInfo_device.mx_UserInfo_device_verified
  .mx_UserInfo_device_trusted {
  color: var(--cpd-color-text-action-accent);
}
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_devices
  .mx_UserInfo_device.mx_UserInfo_device_unverified
  .mx_UserInfo_device_trusted {
  color: var(--cpd-color-text-critical-primary);
}
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_devices
  .mx_UserInfo_device
  .mx_UserInfo_device_name {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  margin: 0 5px;
  word-break: break-word;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_devices .mx_E2EIcon {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  height: 12px;
  margin: 0;
  width: 12px;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_devices .mx_UserInfo_expand {
  -webkit-column-gap: 5px;
  -moz-column-gap: 5px;
  column-gap: 5px;
  margin-bottom: 11px;
  -webkit-box-align: initial;
  -ms-flex-align: initial;
  align-items: normal;
}
.mx_UserInfo.mx_BaseCard.mx_UserInfo_smallAvatar
  .mx_UserInfo_avatar
  .mx_UserInfo_avatar_transition {
  margin: 0 auto;
  max-width: 72px;
}
.mx_UserInfo.mx_BaseCard.mx_UserInfo_smallAvatar
  .mx_UserInfo_avatar
  .mx_BaseAvatar {
  font-size: 2rem;
}
.mx_VerificationPanel_reciprocate_section .mx_E2EIcon,
.mx_VerificationPanel_verified_section .mx_E2EIcon {
  margin: 20px auto !important;
}
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_container:not(.mx_UserInfo_separator)
  > div
  > p {
  margin-bottom: 0;
  margin-top: 0;
}
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_container:not(.mx_UserInfo_separator)
  .mx_UserInfo_wideButton,
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_container:not(.mx_UserInfo_separator)
  .mx_VerificationPanel_verifyByEmojiButton {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_container:not(.mx_UserInfo_separator)
  .mx_EncryptionInfo_spinner,
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_container:not(.mx_UserInfo_separator)
  .mx_VerificationShowSas {
  -webkit-margin-start: auto;
  margin-inline-start: auto;
  -webkit-margin-end: auto;
  margin-inline-end: auto;
}
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_container:not(.mx_UserInfo_separator)
  .mx_Spinner,
.mx_UserInfo.mx_BaseCard
  .mx_UserInfo_container:not(.mx_UserInfo_separator)
  .mx_VerificationShowSas {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_UserInfo.mx_BaseCard .mx_EncryptionPanel_cancel {
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 14px;
  cursor: pointer;
  height: 28px;
  position: relative;
  width: 28px;
}
.mx_UserInfo.mx_BaseCard .mx_EncryptionPanel_cancel:hover {
  background-color: var(--cpd-color-bg-subtle-primary);
}
.mx_UserInfo.mx_BaseCard .mx_EncryptionPanel_cancel:before {
  background-color: var(--cpd-color-icon-secondary);
  content: "";
  height: 28px;
  -webkit-mask-image: url(../../icons/close.dce71fd.svg);
  mask-image: url(../../icons/close.dce71fd.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  position: absolute;
  width: 28px;
}
.mx_UserInfo.mx_BaseCard .mx_EncryptionPanel_cancel {
  position: absolute;
  right: 14px;
  top: 14px;
  z-index: 100;
}
.mx_UserInfo.mx_BaseCard .mx_VerificationPanel_qrCode {
  background: #fff;
  border-radius: 4px;
  margin: 0 auto !important;
  max-width: 100%;
  padding: 4px 4px 0;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
.mx_UserInfo.mx_BaseCard .mx_VerificationPanel_qrCode canvas {
  height: auto !important;
  max-width: 240px;
  width: 100% !important;
}
.mx_UserInfo.mx_BaseCard
  .mx_VerificationPanel_reciprocate_section
  .mx_AccessibleButton {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  margin: 10px 0;
  padding: 10px;
  width: 100%;
}
.mx_CompleteSecurity_body .mx_VerificationPanel_QRPhase_startOptions,
.mx_Dialog .mx_VerificationPanel_QRPhase_startOptions {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 10px;
  margin-top: 10px;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_CompleteSecurity_body
  .mx_VerificationPanel_QRPhase_startOptions
  > .mx_VerificationPanel_QRPhase_betweenText,
.mx_Dialog
  .mx_VerificationPanel_QRPhase_startOptions
  > .mx_VerificationPanel_QRPhase_betweenText {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-align: center;
  vertical-align: middle;
  width: 50px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_CompleteSecurity_body
  .mx_VerificationPanel_QRPhase_startOptions
  .mx_VerificationPanel_QRPhase_startOption,
.mx_Dialog
  .mx_VerificationPanel_QRPhase_startOptions
  .mx_VerificationPanel_QRPhase_startOption {
  background-color: var(--cpd-color-bg-subtle-primary);
  border-radius: 10px;
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1;
  flex: 1;
  padding: 20px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  max-width: 310px;
  position: relative;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.mx_CompleteSecurity_body
  .mx_VerificationPanel_QRPhase_startOptions
  .mx_VerificationPanel_QRPhase_startOption
  .mx_VerificationPanel_QRPhase_noQR,
.mx_CompleteSecurity_body
  .mx_VerificationPanel_QRPhase_startOptions
  .mx_VerificationPanel_QRPhase_startOption
  canvas,
.mx_Dialog
  .mx_VerificationPanel_QRPhase_startOptions
  .mx_VerificationPanel_QRPhase_startOption
  .mx_VerificationPanel_QRPhase_noQR,
.mx_Dialog
  .mx_VerificationPanel_QRPhase_startOptions
  .mx_VerificationPanel_QRPhase_startOption
  canvas {
  background-color: #fff;
  border-radius: 4px;
  height: 220px !important;
  padding: 10px;
  text-align: center;
  vertical-align: middle;
  width: 220px !important;
}
.mx_CompleteSecurity_body
  .mx_VerificationPanel_QRPhase_startOptions
  .mx_VerificationPanel_QRPhase_startOption
  > p,
.mx_Dialog
  .mx_VerificationPanel_QRPhase_startOptions
  .mx_VerificationPanel_QRPhase_startOption
  > p {
  font-weight: 700;
  margin-top: 0;
}
.mx_CompleteSecurity_body
  .mx_VerificationPanel_QRPhase_startOptions
  .mx_VerificationPanel_QRPhase_startOption
  .mx_VerificationPanel_QRPhase_helpText,
.mx_Dialog
  .mx_VerificationPanel_QRPhase_startOptions
  .mx_VerificationPanel_QRPhase_startOption
  .mx_VerificationPanel_QRPhase_helpText {
  font: var(--cpd-font-body-md-regular);
  margin: 30px 0;
  text-align: center;
}
.mx_CompleteSecurity_body
  .mx_VerificationPanel_verified_section
  .mx_AccessibleButton,
.mx_Dialog .mx_VerificationPanel_verified_section .mx_AccessibleButton {
  float: right;
}
.mx_CompleteSecurity_body
  .mx_VerificationPanel_reciprocate_section
  .mx_AccessibleButton,
.mx_Dialog .mx_VerificationPanel_reciprocate_section .mx_AccessibleButton {
  margin-left: 10px;
  padding: 7px 40px;
}
.mx_CompleteSecurity_body
  .mx_VerificationPanel_reciprocate_section
  .mx_VerificationPanel_reciprocateButtons,
.mx_Dialog
  .mx_VerificationPanel_reciprocate_section
  .mx_VerificationPanel_reciprocateButtons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}
.mx_WidgetCard .mx_AppTileFullWidth {
  border: 0;
  height: 100%;
  max-width: none;
  width: auto !important;
}
.mx_AliasSettings_localAddresses {
  color: var(--cpd-color-text-primary);
  cursor: pointer;
  font-weight: var(--cpd-font-weight-semibold);
  list-style: none;
  text-decoration: underline;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.mx_AliasSettings_localAddresses::-webkit-details-marker {
  display: none;
}
:root {
  --AppTile_mini-height: 220px;
}
.mx_AppsDrawer {
  --minWidth: 240px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 8px;
  margin: var(--container-gap-width);
  margin-bottom: 0;
  margin-right: 4px;
  margin-right: calc(var(--container-gap-width) / 2);
  position: relative;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  overflow: hidden;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
.mx_AppsDrawer .mx_AppsDrawer_resizer {
  margin-bottom: 8px;
  margin-bottom: var(--container-gap-width);
}
.mx_AppsDrawer .mx_AppsDrawer_resizer_container {
  display: block;
  height: 10px;
  position: relative;
  width: 100%;
}
.mx_AppsDrawer
  .mx_AppsDrawer_resizer_container
  .mx_AppsDrawer_resizer_container_handle {
  bottom: 50% !important;
  cursor: ns-resize;
  height: 100% !important;
  position: absolute;
  width: 100% !important;
}
.mx_AppsDrawer
  .mx_AppsDrawer_resizer_container
  .mx_AppsDrawer_resizer_container_handle:after {
  border-radius: 3px;
  bottom: 0;
  content: "";
  height: 4px;
  left: calc(50% - 32px);
  position: absolute;
  right: calc(50% - 32px);
}
.mx_AppsDrawer:hover .mx_AppsDrawer_resizer_container_handle:after {
  background: var(--cpd-color-text-primary);
  opacity: 0.8;
}
.mx_AppsDrawer:hover .mx_ResizeHandle--horizontal:before {
  background-color: var(--cpd-color-text-primary);
  border-radius: 4px;
  content: "";
  height: 64px;
  left: 3px;
  opacity: 0.8;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 4px;
}
.mx_AppsDrawer .mx_AppTile {
  min-width: var(--minWidth);
  width: 50%;
}
.mx_AppsDrawer.mx_AppsDrawer--maximised {
  margin-bottom: 8px;
  margin-bottom: var(--container-gap-width);
}
.mx_AppsDrawer.mx_AppsDrawer--resizing .mx_AppTile_persistedWrapper {
  z-index: 1;
}
.mx_AppsDrawer.mx_AppsDrawer--2apps .mx_AppTile {
  width: 50%;
}
.mx_AppsDrawer.mx_AppsDrawer--2apps .mx_AppTile:nth-child(3) {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  min-width: var(--minWidth) !important;
  width: 0 !important;
}
.mx_AppsDrawer.mx_AppsDrawer--3apps .mx_AppTile {
  width: 33%;
}
.mx_AppsDrawer.mx_AppsDrawer--3apps .mx_AppTile:nth-child(3) {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  min-width: var(--minWidth) !important;
  width: 0 !important;
}
.mx_AppsContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  height: 100%;
  justify-content: center;
  width: 100%;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-height: 0;
}
.mx_AppsContainer .mx_AppTile:first-of-type {
  border-left-width: 8px;
  border-left-width: var(--container-border-width);
  border-radius: 10px 0 0 10px;
}
.mx_AppsContainer .mx_AppTile:last-of-type {
  border-radius: 0 10px 10px 0;
  border-right-width: 8px;
  border-right-width: var(--container-border-width);
}
.mx_AppsContainer .mx_ResizeHandle--horizontal {
  position: relative;
}
.mx_AppsContainer .mx_ResizeHandle--horizontal > div {
  width: 0;
}
.mx_AppTile {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.mx_AppTile,
.mx_AppTileFullWidth {
  border: 8px solid #f2f5f8;
  border: var(--container-border-width) solid #f2f5f8;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  background-color: #f2f5f8;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_AppTileFullWidth {
  border-radius: 8px;
  margin: 0;
  padding: 0;
  width: 100% !important;
}
.mx_AppTile_mini {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0;
  padding: 0;
  width: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  height: 220px;
  height: var(--AppTile_mini-height);
}
.mx_AppTile .mx_AppTile_persistedWrapper,
.mx_AppTileFullWidth .mx_AppTile_persistedWrapper,
.mx_AppTile_mini .mx_AppTile_persistedWrapper {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_AppTile_persistedWrapper div {
  height: 100%;
  width: 100%;
}
.mx_AppTileMenuBar {
  background-color: #f2f5f8;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 0.75rem;
  margin: 0;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding-bottom: 6px;
  padding-top: 3px;
  width: 100%;
}
.mx_AppTileMenuBar .mx_AppTileMenuBar_title {
  line-height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_AppTileMenuBar .mx_AppTileMenuBar_title .mx_WidgetAvatar {
  margin-right: 12px;
}
.mx_AppTileMenuBar .mx_AppTileMenuBar_title h3 {
  font-size: inherit;
  margin: 0;
}
.mx_AppTileMenuBar .mx_AppTileMenuBar_title > :last-child {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-left: 9px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.minimise-button{
  display:none !important
}
.mx_AppTileMenuBar .mx_AppTileMenuBar_widgets,
.mx_AppTileMenuBar
  .mx_AppTileMenuBar_widgets
  .mx_AppTileMenuBar_widgets_button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_AppTileMenuBar
  .mx_AppTileMenuBar_widgets
  .mx_AppTileMenuBar_widgets_button {
  --size: 24px;
  height: 24px;
  height: var(--size);
  margin: 0 4px;
  position: relative;
  width: 24px;
  width: var(--size);
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_AppTileMenuBar
  .mx_AppTileMenuBar_widgets
  .mx_AppTileMenuBar_widgets_button:hover:after {
  background-color: var(--cpd-color-alpha-gray-300);
  border-radius: 50%;
  content: "";
  height: var(--size);
  left: 0;
  position: absolute;
  top: 0;
  width: var(--size);
}
.mx_AppTileMenuBar
  .mx_AppTileMenuBar_widgets
  .mx_AppTileMenuBar_widgets_button
  .mx_Icon {
  color: #61708b;
}
.mx_AppTileBody {
  border-radius: 8px;
}
.mx_AppTileBody .mx_AppTileBody_fadeInSpinner {
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
  -webkit-animation-duration: 0.2s;
  animation-duration: 0.2s;
  -webkit-animation-fill-mode: backwards;
  animation-fill-mode: backwards;
  -webkit-animation-name: mx_AppTileBody_fadeInSpinnerAnimation;
  animation-name: mx_AppTileBody_fadeInSpinnerAnimation;
  font-weight: 700;
  height: 100%;
  width: 100%;
}
.mx_AppTileBody.mx_AppTileBody--large,
.mx_AppTileBody.mx_AppTileBody--mini {
  height: var(--AppTileBody-height);
  overflow: hidden;
  width: 100%;
}
.mx_AppTileBody.mx_AppTileBody--large iframe,
.mx_AppTileBody.mx_AppTileBody--mini iframe {
  border: none;
  height: 100%;
  width: 100%;
}
.mx_AppTileBody.mx_AppTileBody--large {
  --AppTileBody-height: 100%;
  background-color: var(--cpd-color-bg-canvas-default);
}
.mx_AppTileBody.mx_AppTileBody--large iframe {
  display: block;
  margin: 0;
  overflow: hidden;
  padding: 0;
}
.mx_AppTileBody.mx_AppTileBody--mini {
  --AppTileBody-height: var(--AppTile_mini-height);
}
.mx_AppTileBody.mx_AppTileBody--loading {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: var(--cpd-color-bg-canvas-default) !important;
  height: 100%;
  position: relative;
}
.mx_AppTileBody.mx_AppTileBody--loading iframe {
  display: block;
}
.mx_AppTileBody.mx_AppTileBody--call {
  border-radius: 0;
}
.mx_AppTileBody.mx_AppTileBody--call.mx_AppTileBody--mini {
  border-radius: 8px;
}
.mx_AppTile .mx_AppTileBody--large,
.mx_AppTileFullWidth .mx_AppTileBody--large,
.mx_AppTile_mini .mx_AppTileBody--mini {
  height: inherit;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
@-webkit-keyframes mx_AppTileBody_fadeInSpinnerAnimation {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes mx_AppTileBody_fadeInSpinnerAnimation {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.mx_Autocomplete {
  background: var(--cpd-color-bg-canvas-default);
  border: 1px solid transparent;
  border-bottom: none;
  border-radius: 8px 8px 0 0;
  bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: clip;
  position: absolute;
  width: 100%;
  z-index: 1001;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-box-shadow: 0 -16px 32px rgba(0, 0, 0, 0.04);
  box-shadow: 0 -16px 32px rgba(0, 0, 0, 0.04);
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_Autocomplete_ProviderSection {
  border-bottom: 1px solid transparent;
  width: 100%;
}
.mx_Autocomplete_Completion_block {
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  min-height: 34px;
  padding: 0 12px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-primary);
}
.mx_Autocomplete_Completion_block * {
  margin: 0 3px;
}
.mx_Autocomplete_Completion_pill {
  border-radius: 2rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 2.125rem;
  padding: 0.4rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-primary);
}
.mx_Autocomplete_Completion_pill > * {
  margin-right: 0.3rem;
}
.mx_Autocomplete_Completion_subtitle {
  font-style: italic;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_Autocomplete_Completion_description {
  color: gray;
  min-width: 150px;
}
.mx_Autocomplete_Completion_container_pill {
  height: 100%;
  margin: 12px;
  max-height: 35vh;
  overflow-y: scroll;
}
.mx_Autocomplete_Completion_container_truncate
  .mx_Autocomplete_Completion_description,
.mx_Autocomplete_Completion_container_truncate
  .mx_Autocomplete_Completion_subtitle,
.mx_Autocomplete_Completion_container_truncate
  .mx_Autocomplete_Completion_title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_Autocomplete_Completion.selected,
.mx_Autocomplete_Completion:hover {
  background: #f2f5f8;
  outline: none;
}
.mx_Autocomplete_provider_name {
  color: var(--cpd-color-text-primary);
  font-weight: 400;
  margin: 12px;
  opacity: 0.4;
}
.mx_AuxPanel {
  margin: 0 auto;
  min-width: 0;
  overflow: auto;
  width: 100%;
}
.mx_BasicMessageComposer {
  position: relative;
}
.mx_BasicMessageComposer
  .mx_BasicMessageComposer_inputEmpty
  > :first-child:before {
  color: var(--cpd-color-text-secondary);
  content: var(--placeholder);
  display: inline-block;
  height: 0;
  overflow: visible;
  pointer-events: none;
  white-space: nowrap;
  width: 0;
}
@-webkit-keyframes visualbell {
  0% {
    background-color: #faa;
  }
  to {
    background-color: var(--cpd-color-bg-canvas-default);
  }
}
.mx_BasicMessageComposer.mx_BasicMessageComposer_input_error {
  -webkit-animation: visualbell 0.2s;
  animation: visualbell 0.2s;
}
.mx_BasicMessageComposer .mx_BasicMessageComposer_input {
  white-space: pre-wrap;
  word-wrap: break-word;
  outline: none;
  overflow-x: hidden;
}
.mx_BasicMessageComposer .mx_BasicMessageComposer_input .caretNode {
  -webkit-user-select: all;
  -moz-user-select: all;
  user-select: all;
}
.mx_BasicMessageComposer
  .mx_BasicMessageComposer_input.mx_BasicMessageComposer_input_shouldShowPillAvatar
  span.mx_RoomPill,
.mx_BasicMessageComposer
  .mx_BasicMessageComposer_input.mx_BasicMessageComposer_input_shouldShowPillAvatar
  span.mx_SpacePill,
.mx_BasicMessageComposer
  .mx_BasicMessageComposer_input.mx_BasicMessageComposer_input_shouldShowPillAvatar
  span.mx_UserPill {
  cursor: inherit;
  overflow: hidden;
  position: relative;
  text-overflow: ellipsis;
  -webkit-user-select: all;
  -moz-user-select: all;
  user-select: all;
  white-space: nowrap;
}
.mx_BasicMessageComposer
  .mx_BasicMessageComposer_input.mx_BasicMessageComposer_input_shouldShowPillAvatar
  span.mx_RoomPill:hover,
.mx_BasicMessageComposer
  .mx_BasicMessageComposer_input.mx_BasicMessageComposer_input_shouldShowPillAvatar
  span.mx_SpacePill:hover,
.mx_BasicMessageComposer
  .mx_BasicMessageComposer_input.mx_BasicMessageComposer_input_shouldShowPillAvatar
  span.mx_UserPill:hover {
  background-color: var(--cpd-color-bg-action-primary-rest) !important;
}
.mx_BasicMessageComposer
  .mx_BasicMessageComposer_input.mx_BasicMessageComposer_input_shouldShowPillAvatar
  span.mx_RoomPill:before,
.mx_BasicMessageComposer
  .mx_BasicMessageComposer_input.mx_BasicMessageComposer_input_shouldShowPillAvatar
  span.mx_SpacePill:before,
.mx_BasicMessageComposer
  .mx_BasicMessageComposer_input.mx_BasicMessageComposer_input_shouldShowPillAvatar
  span.mx_UserPill:before {
  content: var(--avatar-letter);
  display: inline-block;
  height: 1rem;
  min-width: 1rem;
  width: 1rem;
  -webkit-margin-end: 0.24rem;
  background: var(--avatar-background), var(--cpd-color-bg-canvas-default);
  background-repeat: no-repeat;
  background-size: 1rem;
  border-radius: 1rem;
  color: var(--avatar-color, var(--cpd-color-bg-canvas-default));
  font-size: 0.6275rem;
  font-weight: 400;
  line-height: 1rem;
  margin-inline-end: 0.24rem;
  text-align: center;
}
.mx_BasicMessageComposer
  .mx_BasicMessageComposer_input.mx_BasicMessageComposer_input_disabled {
  pointer-events: none;
}
.mx_BasicMessageComposer .mx_BasicMessageComposer_AutoCompleteWrapper {
  height: 0;
  position: relative;
}
.mx_JoinRuleDialog .mx_JoinRuleDialogButtons {
  -webkit-column-gap: 5px;
  -moz-column-gap: 5px;
  column-gap: 5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_DecryptionFailureBar {
  --gap-row: 8px;
  --gap-column: 12px;
  --gap: var(--gap-row) var(--gap-column);
  --size-icon: 24px;
  background-color: var(--cpd-color-bg-subtle-primary);
  border-radius: 4px;
  margin-inline: 16px;
  padding: 12px;
}
.mx_DecryptionFailureBar.mx_DecryptionFailureBar--withEnd {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: wrap;
  flex-flow: wrap;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  row-gap: calc(var(--gap-row) + 4px);
}
.mx_DecryptionFailureBar.mx_DecryptionFailureBar--withEnd
  .mx_DecryptionFailureBar_end {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 8px 8px;
  gap: var(--buttons-dialog-gap-row) var(--buttons-dialog-gap-column);
  -webkit-margin-start: calc(var(--size-icon) + var(--gap-column));
  margin-inline-start: calc(var(--size-icon) + var(--gap-column));
}
.mx_DecryptionFailureBar .mx_DecryptionFailureBar_start {
  display: grid;
  grid-gap: var(--gap);
  gap: var(--gap);
  grid-template-areas: "status headline" ".      message";
  grid-template-columns: var(--size-icon) auto;
}
.mx_DecryptionFailureBar
  .mx_DecryptionFailureBar_start
  .mx_DecryptionFailureBar_start_status {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  grid-area: status;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: var(--gap);
}
.mx_DecryptionFailureBar
  .mx_DecryptionFailureBar_start
  .mx_DecryptionFailureBar_start_status
  .mx_Spinner {
  height: auto;
}
.mx_DecryptionFailureBar
  .mx_DecryptionFailureBar_start
  .mx_DecryptionFailureBar_start_status
  .mx_DecryptionFailureBar_start_status_icon {
  background-color: var(--cpd-color-icon-critical-primary);
  height: var(--size-icon);
  -webkit-mask-image: url(../../img/e2e/decryption-failure.d4a03e3.svg);
  mask-image: url(../../img/e2e/decryption-failure.d4a03e3.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  min-width: var(--size-icon);
}
.mx_DecryptionFailureBar
  .mx_DecryptionFailureBar_start
  .mx_DecryptionFailureBar_start_headline {
  align-self: center;
  font-size: 1rem;
  font-weight: var(--cpd-font-weight-semibold);
  grid-area: headline;
}
.mx_DecryptionFailureBar
  .mx_DecryptionFailureBar_start
  .mx_DecryptionFailureBar_start_message {
  color: var(--cpd-color-text-secondary);
  grid-area: message;
}
.mx_E2EIcon {
  display: block;
  height: 16px;
  margin: 0 9px;
  position: relative;
  width: 16px;
}
.mx_E2EIcon_normal:after,
.mx_E2EIcon_normal:before,
.mx_E2EIcon_verified:after,
.mx_E2EIcon_verified:before,
.mx_E2EIcon_warning:after,
.mx_E2EIcon_warning:before {
  content: "";
  display: block;
  inset: 0;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
}
.mx_E2EIcon_bordered {
  background-color: var(--cpd-color-bg-subtle-primary);
  -webkit-mask-image: url(../../img/e2e/normal.ab42a7b.svg);
  mask-image: url(../../img/e2e/normal.ab42a7b.svg);
  -webkit-mask-size: 100%;
  mask-size: 100%;
}
.mx_E2EIcon_bordered:after {
  -webkit-mask-size: 75%;
  mask-size: 75%;
}
.mx_E2EIcon_bordered:before {
  background: var(--cpd-color-bg-canvas-default);
  -webkit-mask-size: 60%;
  mask-size: 60%;
}
.mx_E2EIcon_warning:after {
  background-color: var(--cpd-color-icon-critical-primary);
  -webkit-mask-image: url(../../img/e2e/warning.71ffc83.svg);
  mask-image: url(../../img/e2e/warning.71ffc83.svg);
}
.mx_E2EIcon_normal:after {
  background-color: var(--cpd-color-icon-tertiary);
  -webkit-mask-image: url(../../img/e2e/normal.ab42a7b.svg);
  mask-image: url(../../img/e2e/normal.ab42a7b.svg);
}
.mx_E2EIcon_verified:after {
  background-color: var(--cpd-color-icon-success-primary);
  -webkit-mask-image: url(../../img/e2e/verified.2ccf64e.svg);
  mask-image: url(../../img/e2e/verified.2ccf64e.svg);
}
.mx_EditMessageComposer {
  --EditMessageComposer-padding-inline: 3px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 5px;
  max-width: 100%;
  padding: 3px;
  padding: 3px var(--EditMessageComposer-padding-inline);
  width: auto;
}
.mx_EditMessageComposer .mx_BasicMessageComposer_input {
  background-color: var(--cpd-color-bg-canvas-default);
  border: 1px solid transparent;
  border-radius: 4px;
  max-height: 200px;
  padding: 3px 6px;
}
.mx_EditMessageComposer .mx_BasicMessageComposer_input:focus {
  border-color: var(--cpd-color-border-interactive-primary);
}
.mx_EditMessageComposer .mx_EditMessageComposer_buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-flow: row wrap-reverse;
  flex-flow: row wrap-reverse;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  gap: 5px;
  justify-content: flex-end;
  -webkit-margin-start: auto;
  margin-inline-start: auto;
}
.mx_EditMessageComposer .mx_EditMessageComposer_buttons .mx_AccessibleButton {
  -webkit-box-flex: 1;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -ms-flex: 1;
  flex: 1;
  min-width: 100px;
}
.mx_EmojiButton {
  --size: 26px;
  border-radius: 50%;
  cursor: pointer;
  height: 26px;
  height: var(--size);
  line-height: 26px;
  line-height: var(--size);
  padding-left: 26px;
  padding-left: var(--size);
  position: relative;
  width: auto;
}
.mx_EmojiButton:before {
  background-color: var(--cpd-color-icon-tertiary);
  content: "";
  height: 20px;
  left: 3px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 3px;
  width: 20px;
  z-index: 2;
}
.mx_EmojiButton:after {
  border-radius: 50%;
  content: "";
  height: var(--size);
  left: 0;
  position: absolute;
  top: 0;
  width: var(--size);
  z-index: 0;
}

.mx_EmojiButton_highlight:before {
  background-color: var(--cpd-color-icon-primary) !important;
}
.mx_EmojiButton_icon:before {
  -webkit-mask-image: url(../../img/element-icons/room/composer/emoji.d7b1970.svg);
  mask-image: url(../../img/element-icons/room/composer/emoji.d7b1970.svg);
}
.mx_MessageComposer_wysiwyg .mx_EmojiButton {
  --size: 26px;
  border-radius: 5px;
  cursor: pointer;
  height: 26px;
  height: var(--size);
  line-height: 26px;
  line-height: var(--size);
  padding-left: 26px;
  padding-left: var(--size);
  position: relative;
  width: auto;
}
.mx_MessageComposer_wysiwyg .mx_EmojiButton:before {
  background-color: var(--cpd-color-icon-tertiary);
  content: "";
  height: 20px;
  left: 3px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 3px;
  width: 20px;
  z-index: 2;
}
.mx_MessageComposer_wysiwyg .mx_EmojiButton:after {
  border-radius: 5px;
  content: "";
  height: var(--size);
  left: 0;
  position: absolute;
  top: 0;
  width: var(--size);
  z-index: 0;
}
.mx_MessageComposer_wysiwyg .mx_EmojiButton:hover:after {
  background: var(--cpd-color-bg-subtle-secondary);
}
.mx_MessageComposer_wysiwyg .mx_EmojiButton:hover:before {
  background-color: var(--cpd-color-gray-800);
}
.mx_EntityTile {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-primary);
  cursor: pointer;
}
.mx_EntityTile .mx_E2EIcon {
  bottom: 2px;
  margin: 0;
  position: absolute;
  right: 7px;
}
.mx_EntityTile:hover {
  padding-right: 30px;
  position: relative;
}
.mx_EntityTile:hover:before {
  background-color: #91a1c0;
  content: "";
  height: 16px;
  -webkit-mask: url(../../img/member_chevron.85a55f6.png);
  mask: url(../../img/member_chevron.85a55f6.png);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  position: absolute;
  right: -8px;
  top: calc(50% - 8px);
  width: 16px;
}
.mx_EntityTile:not(.mx_EntityTile_unreachable) .mx_PresenceLabel {
  display: none;
}
.mx_EntityTile:hover .mx_PresenceLabel {
  display: block;
}
.mx_EntityTile_invite {
  display: table-cell;
  margin-left: 10px;
  vertical-align: middle;
  width: 26px;
}
.mx_EntityTile_avatar {
  line-height: 0;
  padding: 4px 12px 4px 3px;
  position: relative;
}
.mx_EntityTile_name {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  font: var(--cpd-font-body-md-regular);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_EntityTile_details {
  overflow: hidden;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_EntityTile_ellipsis .mx_EntityTile_name,
.mx_EntityTile_invitePlaceholder .mx_EntityTile_name {
  color: var(--cpd-color-text-primary);
  font-style: italic;
}
.mx_EntityTile_offline_beenactive .mx_EntityTile_avatar,
.mx_EntityTile_offline_beenactive .mx_EntityTile_name,
.mx_EntityTile_unavailable .mx_EntityTile_avatar,
.mx_EntityTile_unavailable .mx_EntityTile_name {
  opacity: 0.5;
}
.mx_EntityTile_offline_neveractive .mx_EntityTile_avatar,
.mx_EntityTile_offline_neveractive .mx_EntityTile_name,
.mx_EntityTile_unknown .mx_EntityTile_avatar,
.mx_EntityTile_unknown .mx_EntityTile_name,
.mx_EntityTile_unreachable .mx_EntityTile_avatar,
.mx_EntityTile_unreachable .mx_EntityTile_name {
  opacity: 0.25;
}
.mx_EntityTile_subtext {
  font-size: 0.6875rem;
  opacity: 0.5;
  overflow: hidden;
  text-overflow: clip;
  white-space: nowrap;
}
.mx_EntityTile_power {
  -webkit-padding-start: 6px;
  color: var(--cpd-color-text-secondary);
  font-size: 0.625rem;
  max-width: 6em;
  overflow: hidden;
  padding-inline-start: 6px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_EntityTile:hover .mx_EntityTile_power {
  display: none;
}
.mx_RoomView_body[data-layout="bubble"] .mx_MessageComposer,
.mx_RoomView_body[data-layout="bubble"] .mx_RoomView_statusArea,
.mx_RoomView_body[data-layout="bubble"] .mx_RoomView_timeline {
  margin: 0 auto;
  max-width: 1200px;
  width: 100%;
}
.mx_EventTile[data-layout="bubble"],
.mx_GenericEventListSummary[data-layout="bubble"] {
  --avatarSize: 32px;
  --gutterSize: 11px;
  --cornerRadius: 12px;
  --maxWidth: 70%;
  --EventTile_bubble-margin-inline-start: 49px;
  --EventTile_bubble-margin-inline-end: 60px;
  -webkit-margin-start: 49px;
  margin-inline-start: 49px;
  -webkit-margin-start: var(--EventTile_bubble-margin-inline-start);
  margin-inline-start: var(--EventTile_bubble-margin-inline-start);
  -webkit-margin-end: 60px;
  margin-inline-end: 60px;
  -webkit-margin-end: var(--EventTile_bubble-margin-inline-end);
  margin-inline-end: var(--EventTile_bubble-margin-inline-end);
}
.mx_EventTile[data-layout="bubble"] {
  --EventTile_bubble_line-margin-inline-start: -9px;
  --EventTile_bubble_line-margin-inline-end: -12px;
  --EventTile_bubble_gap-inline: 5px;
}
.mx_EventTile[data-layout="bubble"] .mx_MessageTimestamp {
  max-width: 80px;
  max-width: var(--MessageTimestamp-max-width);
  width: auto;
}
.mx_EventTile[data-layout="bubble"] .mx_ThreadSummary {
  clear: both;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.mx_EventTile[data-layout="bubble"] .mx_EventTile_content {
  margin-right: 0;
}
.mx_EventTile[data-layout="bubble"] .mx_EventTile_avatar {
  border: 4px solid var(--cpd-color-bg-canvas-default);
  border-radius: 50%;
  line-height: 0;
  position: absolute;
  top: 6px;
  z-index: 9;
}
.mx_EventTile[data-layout="bubble"] .mx_EventTile_avatar img {
  border-radius: 50%;
  -webkit-box-shadow: 0 0 0 3px var(--cpd-color-bg-canvas-default);
  box-shadow: 0 0 0 3px var(--cpd-color-bg-canvas-default);
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_highlight
  .mx_EventTile_avatar {
  border-color: var(--cpd-color-yellow-200);
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_highlight:before {
  background-color: var(--cpd-color-yellow-200);
}
.mx_EventTile[data-layout="bubble"]:hover .mx_EventTile_avatar {
  border-color: var(--cpd-color-bg-subtle-secondary);
}
.mx_EventTile[data-layout="bubble"] .mx_EventTile {
  padding-top: 0;
}
.mx_EventTile[data-layout="bubble"]:before {
  border-radius: 4px;
  bottom: -1px;
  content: "";
  left: calc(var(--EventTile_bubble-margin-inline-start) * -1);
  position: absolute;
  right: calc(var(--EventTile_bubble-margin-inline-end) * -1);
  top: -1px;
  z-index: -1;
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_selected:before,
.mx_EventTile[data-layout="bubble"]:hover:before {
  background: var(--cpd-color-bg-subtle-secondary);
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_selected
  .mx_EventTile_avatar
  img,
.mx_EventTile[data-layout="bubble"]:hover .mx_EventTile_avatar img {
  -webkit-box-shadow: 0 0 0 3px var(--cpd-color-bg-subtle-secondary);
  box-shadow: 0 0 0 3px var(--cpd-color-bg-subtle-secondary);
}
.mx_EventTile[data-layout="bubble"] .mx_DisambiguatedProfile,
.mx_EventTile[data-layout="bubble"] .mx_EventTile_line {
  --EventBubbleTile_line-max-width: 70%;
  line-height: 1.125rem;
  max-width: 70%;
  max-width: var(--EventBubbleTile_line-max-width);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.mx_EventTile[data-layout="bubble"] > .mx_DisambiguatedProfile {
  white-space: normal;
}
.mx_EventTile[data-layout="bubble"]
  > .mx_DisambiguatedProfile
  .mx_DisambiguatedProfile_displayName {
  white-space: nowrap;
  -webkit-margin-end: 5px;
  direction: ltr;
  margin-inline-end: 5px;
  unicode-bidi: embed;
}
.mx_EventTile[data-layout="bubble"]
  > .mx_DisambiguatedProfile
  .mx_DisambiguatedProfile_mxid {
  -webkit-margin-start: 0;
  margin-inline-start: 0;
}
.mx_EventTile[data-layout="bubble"]
  .mx_EventTile_senderDetails
  > .mx_DisambiguatedProfile,
.mx_EventTile[data-layout="bubble"] > .mx_DisambiguatedProfile {
  font-size: 0.9375rem;
  left: 2px;
  position: relative;
  top: -2px;
}
.mx_EventTile[data-layout="bubble"] .mx_MessageActionBar {
  top: -28px;
  z-index: 9;
}
.mx_EventTile[data-layout="bubble"] .mx_MediaBody {
  padding-right: 48px;
}
.mx_EventTile[data-layout="bubble"]
  .mx_MImageBody
  .mx_MImageBody_thumbnail_container {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  min-height: calc(1.8rem + var(--gutterSize) + var(--gutterSize));
  min-width: calc(1.8rem + var(--gutterSize) + var(--gutterSize));
}
.mx_EventTile[data-layout="bubble"] .mx_LegacyCallEvent {
  background-color: transparent;
  background-color: initial;
  border-color: var(--cpd-color-gray-400);
  border-style: solid;
  border-width: 1px;
}
.mx_EventTile[data-layout="bubble"] .mx_ReactionsRow {
  margin-inline: var(--EventTile_bubble_line-margin-inline-start)
    var(--EventTile_bubble_line-margin-inline-end);
}
.mx_EventTile[data-layout="bubble"][data-self="false"] .mx_EventTile_line {
  border-bottom-right-radius: var(--cornerRadius);
}
.mx_EventTile[data-layout="bubble"][data-self="false"]
  .mx_EventTile_line
  .mx_MBeaconBody,
.mx_EventTile[data-layout="bubble"][data-self="false"]
  .mx_EventTile_line
  .mx_MImageBody
  .mx_MImageBody_thumbnail_container,
.mx_EventTile[data-layout="bubble"][data-self="false"]
  .mx_EventTile_line
  .mx_MImageBody:before,
.mx_EventTile[data-layout="bubble"][data-self="false"]
  .mx_EventTile_line
  .mx_MLocationBody_map,
.mx_EventTile[data-layout="bubble"][data-self="false"]
  .mx_EventTile_line
  .mx_MVideoBody
  .mx_MVideoBody_container,
.mx_EventTile[data-layout="bubble"][data-self="false"]
  .mx_EventTile_line
  .mx_MediaBody {
  border-bottom-right-radius: var(--cornerRadius) !important;
}
.mx_EventTile[data-layout="bubble"][data-self="false"] .mx_EventTile_avatar {
  left: -36px;
}
.mx_EventTile[data-layout="bubble"][data-self="false"] .mx_MessageActionBar {
  inset-inline-start: calc(100% - var(--MessageActionBar-size-box));
  right: auto;
}
.mx_EventTile[data-layout="bubble"][data-self="false"] .mx_ThreadSummary {
  -webkit-margin-start: calc(var(--gutterSize) * -1);
  margin-inline-start: calc(var(--gutterSize) * -1);
  -webkit-margin-end: auto;
  margin-inline-end: auto;
}
.mx_EventTile[data-layout="bubble"][data-self="false"] .mx_ReactionsRow {
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}
.mx_EventTile[data-layout="bubble"][data-self="false"] {
  --backgroundColor: var(--cpd-color-gray-300);
}
.mx_EventTile[data-layout="bubble"][data-self="true"] .mx_EventTile_line {
  -webkit-margin-start: auto;
  border-bottom-left-radius: var(--cornerRadius);
  margin-inline-start: auto;
}
.mx_EventTile[data-layout="bubble"][data-self="true"]
  .mx_EventTile_line
  .mx_MBeaconBody,
.mx_EventTile[data-layout="bubble"][data-self="true"]
  .mx_EventTile_line
  .mx_MImageBody
  .mx_MImageBody_thumbnail_container,
.mx_EventTile[data-layout="bubble"][data-self="true"]
  .mx_EventTile_line
  .mx_MImageBody:before,
.mx_EventTile[data-layout="bubble"][data-self="true"]
  .mx_EventTile_line
  .mx_MLocationBody_map,
.mx_EventTile[data-layout="bubble"][data-self="true"]
  .mx_EventTile_line
  .mx_MVideoBody
  .mx_MVideoBody_container,
.mx_EventTile[data-layout="bubble"][data-self="true"]
  .mx_EventTile_line
  .mx_MediaBody {
  border-bottom-left-radius: var(--cornerRadius) !important;
}
.mx_EventTile[data-layout="bubble"][data-self="true"] .mx_EventTile_sticker {
  margin-right: 32px;
}
.mx_EventTile[data-layout="bubble"][data-self="true"] .mx_ThreadSummary {
  -webkit-margin-start: auto;
  margin-inline-start: auto;
  -webkit-margin-end: calc(var(--gutterSize) * -1);
  margin-inline-end: calc(var(--gutterSize) * -1);
}
.mx_EventTile[data-layout="bubble"][data-self="true"] .mx_DisambiguatedProfile {
  display: none;
}
.mx_EventTile[data-layout="bubble"][data-self="true"]
  .mx_ReplyTile
  .mx_DisambiguatedProfile {
  display: block;
  max-width: 100%;
}
.mx_EventTile[data-layout="bubble"][data-self="true"] .mx_ReactionsRow {
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}
.mx_EventTile[data-layout="bubble"][data-self="true"]
  .mx_ReactionsRow
  > :last-child {
  -webkit-box-ordinal-group: 0;
  -ms-flex-order: -1;
  order: -1;
}
.mx_EventTile[data-layout="bubble"][data-self="true"] .mx_EventTile_avatar {
  right: -38px;
  top: -19px;
}
.mx_EventTile[data-layout="bubble"][data-self="true"] .mx_MediaBody {
  background: var(--cpd-color-green-300);
}
.mx_EventTile[data-layout="bubble"][data-self="true"] .mx_MessageActionBar {
  inset-inline-end: 0;
}
.mx_EventTile[data-layout="bubble"][data-self="true"] {
  --backgroundColor: var(--cpd-color-green-300);
}
.mx_EventTile[data-layout="bubble"] .mx_EventTile_line {
  border-top-left-radius: var(--cornerRadius);
  border-top-right-radius: var(--cornerRadius);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 5px var(--EventTile_bubble_gap-inline);
  margin-block: 0;
  margin-inline: var(--EventTile_bubble_line-margin-inline-start)
    var(--EventTile_bubble_line-margin-inline-end);
  position: relative;
}
.mx_EventTile[data-layout="bubble"]
  .mx_EventTile_line
  .mx_MessageActionBar
  + .mx_MessageTimestamp,
.mx_EventTile[data-layout="bubble"] .mx_EventTile_line > a {
  bottom: 0;
  padding: 4px 8px;
  position: absolute;
  right: 0;
  z-index: 3;
}
.mx_EventTile[data-layout="bubble"]
  .mx_EventTile_line.mx_EventTile_mediaLine
  .mx_MAudioBody,
.mx_EventTile[data-layout="bubble"]
  .mx_EventTile_line.mx_EventTile_mediaLine
  .mx_MFileBody {
  max-width: 100%;
}
.mx_EventTile[data-layout="bubble"]
  .mx_EventTile_line.mx_EventTile_mediaLine
  .mx_MVoiceMessageBody {
  min-width: 0;
}
.mx_EventTile[data-layout="bubble"]
  .mx_EventTile_line.mx_EventTile_mediaLine.mx_EventTile_image
  .mx_MessageTimestamp {
  background-color: rgba(0, 0, 0, 0.6);
  border-radius: 8px;
  border-radius: var(--MBody-border-radius);
  color: #fff;
  padding: 0 4px;
}
.mx_EventTile[data-layout="bubble"]
  .mx_EventTile_line.mx_EventTile_sticker
  .mx_MessageActionBar
  + .mx_MessageTimestamp,
.mx_EventTile[data-layout="bubble"]
  .mx_EventTile_line.mx_EventTile_sticker
  > a {
  left: 100%;
  right: auto;
}
.mx_EventTile[data-layout="bubble"]
  .mx_EventTile_line.mx_EventTile_sticker
  .mx_MStickerBody_wrapper {
  padding: 0;
}
.mx_EventTile[data-layout="bubble"] .mx_EventTile_line .mx_MImageBody {
  height: 100%;
  width: 100%;
}
.mx_EventTile[data-layout="bubble"]
  .mx_EventTile_line
  .mx_MImageBody
  .mx_MImageBody_thumbnail.mx_MImageBody_thumbnail--blurhash {
  position: static;
}
.mx_EventTile[data-layout="bubble"]
  .mx_EventTile_line
  .mx_MImageBody
  .mx_MImageBody_thumbnail_container,
.mx_EventTile[data-layout="bubble"]
  .mx_EventTile_line
  .mx_MVideoBody
  .mx_MVideoBody_container,
.mx_EventTile[data-layout="bubble"] .mx_EventTile_line .mx_MediaBody {
  border-radius: 0;
  border-radius: initial;
  border-top-left-radius: var(--cornerRadius);
  border-top-right-radius: var(--cornerRadius);
}
.mx_EventTile[data-layout="bubble"] .mx_EventTile_line .mx_EventTile_e2eIcon {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  height: calc(1.125rem + 2px);
}
.mx_EventTile[data-layout="bubble"] .mx_EventTile_line .mx_MPollEndBody {
  width: 100%;
}
._avatar_mcap2_17[data-type="round"] {
  --cpd-avatar-radius: 50% !important; 
}
.mx_EventTile[data-layout="bubble"]:not(.mx_EventTile_noBubble)
  .mx_EventTile_line:not(.mx_EventTile_mediaLine) {
    background: var(--backgroundColor);
    padding: 1.5% 3.5% 1.5% 1.5%;
    padding-right: 42px;
}
.mx_EventTile[data-layout="bubble"]:not(.mx_EventTile_noBubble)
  .mx_EventTile_line:not(.mx_EventTile_mediaLine)
  .mx_EventTile_content {
  padding: 1px;
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_continuation[data-self="false"]
  .mx_EventTile_line {
  border-top-left-radius: 0;
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_continuation[data-self="false"]
  .mx_EventTile_line
  .mx_MBeaconBody,
.mx_EventTile[data-layout="bubble"].mx_EventTile_continuation[data-self="false"]
  .mx_EventTile_line
  .mx_MImageBody
  .mx_MImageBody_thumbnail_container,
.mx_EventTile[data-layout="bubble"].mx_EventTile_continuation[data-self="false"]
  .mx_EventTile_line
  .mx_MImageBody:before,
.mx_EventTile[data-layout="bubble"].mx_EventTile_continuation[data-self="false"]
  .mx_EventTile_line
  .mx_MLocationBody_map,
.mx_EventTile[data-layout="bubble"].mx_EventTile_continuation[data-self="false"]
  .mx_EventTile_line
  .mx_MVideoBody
  .mx_MVideoBody_container,
.mx_EventTile[data-layout="bubble"].mx_EventTile_continuation[data-self="false"]
  .mx_EventTile_line
  .mx_MediaBody {
  border-top-left-radius: 0;
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_lastInSection[data-self="false"]
  .mx_EventTile_line {
  border-bottom-left-radius: var(--cornerRadius);
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_lastInSection[data-self="false"]
  .mx_EventTile_line
  .mx_MBeaconBody,
.mx_EventTile[data-layout="bubble"].mx_EventTile_lastInSection[data-self="false"]
  .mx_EventTile_line
  .mx_MImageBody
  .mx_MImageBody_thumbnail_container,
.mx_EventTile[data-layout="bubble"].mx_EventTile_lastInSection[data-self="false"]
  .mx_EventTile_line
  .mx_MImageBody:before,
.mx_EventTile[data-layout="bubble"].mx_EventTile_lastInSection[data-self="false"]
  .mx_EventTile_line
  .mx_MLocationBody_map,
.mx_EventTile[data-layout="bubble"].mx_EventTile_lastInSection[data-self="false"]
  .mx_EventTile_line
  .mx_MVideoBody
  .mx_MVideoBody_container,
.mx_EventTile[data-layout="bubble"].mx_EventTile_lastInSection[data-self="false"]
  .mx_EventTile_line
  .mx_MediaBody {
  border-bottom-left-radius: var(--cornerRadius);
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_continuation[data-self="true"]
  .mx_EventTile_line {
  border-top-right-radius: 0;
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_continuation[data-self="true"]
  .mx_EventTile_line
  .mx_MBeaconBody,
.mx_EventTile[data-layout="bubble"].mx_EventTile_continuation[data-self="true"]
  .mx_EventTile_line
  .mx_MImageBody
  .mx_MImageBody_thumbnail_container,
.mx_EventTile[data-layout="bubble"].mx_EventTile_continuation[data-self="true"]
  .mx_EventTile_line
  .mx_MImageBody:before,
.mx_EventTile[data-layout="bubble"].mx_EventTile_continuation[data-self="true"]
  .mx_EventTile_line
  .mx_MLocationBody_map,
.mx_EventTile[data-layout="bubble"].mx_EventTile_continuation[data-self="true"]
  .mx_EventTile_line
  .mx_MVideoBody
  .mx_MVideoBody_container,
.mx_EventTile[data-layout="bubble"].mx_EventTile_continuation[data-self="true"]
  .mx_EventTile_line
  .mx_MediaBody {
  border-top-right-radius: 0;
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_lastInSection[data-self="true"]
  .mx_EventTile_line {
  border-bottom-right-radius: var(--cornerRadius);
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_lastInSection[data-self="true"]
  .mx_EventTile_line
  .mx_MBeaconBody,
.mx_EventTile[data-layout="bubble"].mx_EventTile_lastInSection[data-self="true"]
  .mx_EventTile_line
  .mx_MImageBody
  .mx_MImageBody_thumbnail_container,
.mx_EventTile[data-layout="bubble"].mx_EventTile_lastInSection[data-self="true"]
  .mx_EventTile_line
  .mx_MImageBody:before,
.mx_EventTile[data-layout="bubble"].mx_EventTile_lastInSection[data-self="true"]
  .mx_EventTile_line
  .mx_MLocationBody_map,
.mx_EventTile[data-layout="bubble"].mx_EventTile_lastInSection[data-self="true"]
  .mx_EventTile_line
  .mx_MVideoBody
  .mx_MVideoBody_container,
.mx_EventTile[data-layout="bubble"].mx_EventTile_lastInSection[data-self="true"]
  .mx_EventTile_line
  .mx_MediaBody {
  border-bottom-right-radius: var(--cornerRadius);
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_noSender .mx_EventTile_avatar {
  top: -19px;
}
.mx_EventTile[data-layout="bubble"][data-has-reply="true"]
  > .mx_EventTile_line {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_EventTile[data-layout="bubble"][data-has-reply="true"]
  .mx_ReplyChain
  .mx_EventTile_reply {
  max-width: 90%;
  padding: 0;
}
.mx_EventTile[data-layout="bubble"][data-has-reply="true"]
  .mx_ReplyChain
  .mx_EventTile_reply
  .mx_MessageActionBar
  + .mx_MessageTimestamp,
.mx_EventTile[data-layout="bubble"][data-has-reply="true"]
  .mx_ReplyChain
  .mx_EventTile_reply
  > a {
  display: none !important;
}
.mx_EventTile[data-layout="bubble"][data-has-reply="true"]
  .mx_ReplyChain
  .mx_EventTile {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: var(--gutterSize);
}
.mx_EventTile[data-layout="bubble"][data-has-reply="true"]
  .mx_ReplyChain
  .mx_EventTile
  .mx_EventTile_avatar {
  position: static;
}
.mx_EventTile[data-layout="bubble"][data-has-reply="true"]
  .mx_ReplyChain
  .mx_EventTile
  .mx_DisambiguatedProfile {
  display: none;
}
.mx_EventTile[data-layout="bubble"] .mx_MPollBody {
  max-width: 100%;
  width: 550px;
}
.mx_EventTile[data-layout="bubble"] .mx_MPollBody .mx_MPollBody_totalVotes {
  padding: 4px 0;
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_bad:hover:before {
  background: transparent;
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_bad .mx_EventTile_line {
  display: grid;
  grid-template: "reply reply" auto "shield body" auto/auto 1fr;
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_bad
  .mx_EventTile_line
  .mx_ReplyChain_wrapper,
.mx_EventTile[data-layout="bubble"].mx_EventTile_bad
  .mx_EventTile_line
  .mx_UnknownBody,
.mx_EventTile[data-layout="bubble"].mx_EventTile_bad
  .mx_EventTile_line
  .mx_ViewSourceEvent {
  min-width: 0;
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_bad
  .mx_EventTile_line
  .mx_EventTile_e2eIcon {
  grid-area: shield;
  margin-bottom: auto;
  margin-top: auto;
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_bad
  .mx_EventTile_line
  .mx_DecryptionFailureBody,
.mx_EventTile[data-layout="bubble"].mx_EventTile_bad
  .mx_EventTile_line
  .mx_UnknownBody {
  grid-area: body;
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_bad
  .mx_EventTile_line
  .mx_ReplyChain_wrapper {
  grid-area: reply;
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_bad.mx_EventTile_info
  .mx_EventTile_line {
  gap: 0 9px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-template: "shield source" auto/auto 1fr;
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_bad.mx_EventTile_info
  .mx_EventTile_line
  .mx_ViewSourceEvent {
  grid-area: source;
}
.mx_EventTile[data-layout="bubble"] .mx_MTextBody {
  max-width: 100%;
}
.mx_EventTile[data-layout="bubble"] .mx_CallEvent_wrapper,
.mx_EventTile[data-layout="bubble"] .mx_LegacyCallEvent_wrapper {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_EventTile.mx_EventTile_noBubble[data-layout="bubble"] {
  --backgroundColor: transparent;
}
.mx_EventTile.mx_EventTile_noBubble[data-layout="bubble"]
  .mx_EventTile_line.mx_EventTile_emote {
  font-style: italic;
  padding-right: 60px;
}
.mx_EventTile.mx_EventTile_noBubble[data-layout="bubble"]
  .mx_EventTile_line.mx_EventTile_emote
  > a {
  -ms-flex-item-align: center;
  align-self: center;
  bottom: auto;
  font-style: normal;
  top: auto;
}
.mx_EventTile.mx_EventTile_noBubble[data-layout="bubble"]
  .mx_EventTile_line.mx_EventTile_emote
  .mx_MEmoteBody {
  padding: 4px 0;
}
.mx_EventTile.mx_EventTile_bubbleContainer[data-layout="bubble"]
  .mx_EventTile_line
  > a,
.mx_EventTile.mx_EventTile_leftAlignedBubble[data-layout="bubble"]
  .mx_EventTile_line
  > a {
  display: none;
}
.mx_EventTile.mx_EventTile_bubbleContainer[data-layout="bubble"],
.mx_EventTile.mx_EventTile_info[data-layout="bubble"],
.mx_EventTile.mx_EventTile_leftAlignedBubble[data-layout="bubble"] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 5px 0;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}
.mx_EventTile.mx_EventTile_bubbleContainer[data-layout="bubble"]
  .mx_EventTile_info,
.mx_EventTile.mx_EventTile_bubbleContainer[data-layout="bubble"]
  .mx_EventTile_line,
.mx_EventTile.mx_EventTile_info[data-layout="bubble"] .mx_EventTile_info,
.mx_EventTile.mx_EventTile_info[data-layout="bubble"] .mx_EventTile_line,
.mx_EventTile.mx_EventTile_leftAlignedBubble[data-layout="bubble"]
  .mx_EventTile_info,
.mx_EventTile.mx_EventTile_leftAlignedBubble[data-layout="bubble"]
  .mx_EventTile_line {
  margin: 0;
  min-width: 100%;
}
.mx_EventTile.mx_EventTile_bubbleContainer[data-layout="bubble"],
.mx_EventTile.mx_EventTile_info[data-layout="bubble"],
.mx_EventTile.mx_EventTile_leftAlignedBubble[data-layout="bubble"],
.mx_GenericEventListSummary[data-layout="bubble"][data-expanded="false"] {
  --backgroundColor: transparent;
  --gutterSize: 0;
  font-size: 0.9rem;
}
.mx_EventTile.mx_EventTile_bubbleContainer[data-layout="bubble"]
  .mx_EventTile_avatar,
.mx_EventTile.mx_EventTile_info[data-layout="bubble"] .mx_EventTile_avatar,
.mx_EventTile.mx_EventTile_leftAlignedBubble[data-layout="bubble"]
  .mx_EventTile_avatar,
.mx_GenericEventListSummary[data-layout="bubble"][data-expanded="false"]
  .mx_EventTile_avatar {
  position: static;
  -webkit-box-ordinal-group: 0;
  -ms-flex-order: -1;
  order: -1;
  -webkit-margin-end: var(--EventTile_bubble_gap-inline);
  margin-inline-end: var(--EventTile_bubble_gap-inline);
}
.mx_EventTile.mx_EventTile_bubbleContainer[data-layout="bubble"]
  .mx_EventTile_e2eIcon,
.mx_EventTile.mx_EventTile_info[data-layout="bubble"] .mx_EventTile_e2eIcon,
.mx_EventTile.mx_EventTile_leftAlignedBubble[data-layout="bubble"]
  .mx_EventTile_e2eIcon,
.mx_GenericEventListSummary[data-layout="bubble"][data-expanded="false"]
  .mx_EventTile_e2eIcon {
  -webkit-margin-start: 0;
  margin-inline-start: 0;
  -ms-flex-item-align: center;
  align-self: center;
}
.mx_EventTile.mx_EventTile_bubbleContainer[data-layout="bubble"]
  .mx_EventTile_line
  .mx_MessageActionBar
  + .mx_MessageTimestamp,
.mx_EventTile.mx_EventTile_bubbleContainer[data-layout="bubble"]
  .mx_EventTile_line
  > a,
.mx_EventTile.mx_EventTile_info[data-layout="bubble"]
  .mx_EventTile_line
  .mx_MessageActionBar
  + .mx_MessageTimestamp,
.mx_EventTile.mx_EventTile_info[data-layout="bubble"] .mx_EventTile_line > a,
.mx_EventTile.mx_EventTile_leftAlignedBubble[data-layout="bubble"]
  .mx_EventTile_line
  .mx_MessageActionBar
  + .mx_MessageTimestamp,
.mx_EventTile.mx_EventTile_leftAlignedBubble[data-layout="bubble"]
  .mx_EventTile_line
  > a,
.mx_GenericEventListSummary[data-layout="bubble"][data-expanded="false"]
  .mx_EventTile_line
  .mx_MessageActionBar
  + .mx_MessageTimestamp,
.mx_GenericEventListSummary[data-layout="bubble"][data-expanded="false"]
  .mx_EventTile_line
  > a {
  bottom: auto;
  left: -77px;
  right: auto;
  -ms-flex-item-align: center;
  align-self: center;
}
.mx_EventTile.mx_EventTile_bubbleContainer[data-layout="bubble"]
  .mx_EventTile_line
  .mx_MessageActionBar
  + .mx_MessageTimestamp
  .mx_MessageTimestamp,
.mx_EventTile.mx_EventTile_bubbleContainer[data-layout="bubble"]
  .mx_EventTile_line
  .mx_MessageActionBar
  + .mx_MessageTimestamp.mx_MessageTimestamp,
.mx_EventTile.mx_EventTile_bubbleContainer[data-layout="bubble"]
  .mx_EventTile_line
  > a
  .mx_MessageTimestamp,
.mx_EventTile.mx_EventTile_bubbleContainer[data-layout="bubble"]
  .mx_EventTile_line
  > a.mx_MessageTimestamp,
.mx_EventTile.mx_EventTile_info[data-layout="bubble"]
  .mx_EventTile_line
  .mx_MessageActionBar
  + .mx_MessageTimestamp
  .mx_MessageTimestamp,
.mx_EventTile.mx_EventTile_info[data-layout="bubble"]
  .mx_EventTile_line
  .mx_MessageActionBar
  + .mx_MessageTimestamp.mx_MessageTimestamp,
.mx_EventTile.mx_EventTile_info[data-layout="bubble"]
  .mx_EventTile_line
  > a
  .mx_MessageTimestamp,
.mx_EventTile.mx_EventTile_info[data-layout="bubble"]
  .mx_EventTile_line
  > a.mx_MessageTimestamp,
.mx_EventTile.mx_EventTile_leftAlignedBubble[data-layout="bubble"]
  .mx_EventTile_line
  .mx_MessageActionBar
  + .mx_MessageTimestamp
  .mx_MessageTimestamp,
.mx_EventTile.mx_EventTile_leftAlignedBubble[data-layout="bubble"]
  .mx_EventTile_line
  .mx_MessageActionBar
  + .mx_MessageTimestamp.mx_MessageTimestamp,
.mx_EventTile.mx_EventTile_leftAlignedBubble[data-layout="bubble"]
  .mx_EventTile_line
  > a
  .mx_MessageTimestamp,
.mx_EventTile.mx_EventTile_leftAlignedBubble[data-layout="bubble"]
  .mx_EventTile_line
  > a.mx_MessageTimestamp,
.mx_GenericEventListSummary[data-layout="bubble"][data-expanded="false"]
  .mx_EventTile_line
  .mx_MessageActionBar
  + .mx_MessageTimestamp
  .mx_MessageTimestamp,
.mx_GenericEventListSummary[data-layout="bubble"][data-expanded="false"]
  .mx_EventTile_line
  .mx_MessageActionBar
  + .mx_MessageTimestamp.mx_MessageTimestamp,
.mx_GenericEventListSummary[data-layout="bubble"][data-expanded="false"]
  .mx_EventTile_line
  > a
  .mx_MessageTimestamp,
.mx_GenericEventListSummary[data-layout="bubble"][data-expanded="false"]
  .mx_EventTile_line
  > a.mx_MessageTimestamp {
  vertical-align: middle;
}
.mx_GenericEventListSummary[data-layout="bubble"]
  .mx_EventTile.mx_EventTile_info
  .mx_EventTile_line {
  max-width: 100%;
  min-width: 0;
  width: 100%;
  font-size: 0.7rem;
}
.mx_GenericEventListSummary[data-layout="bubble"][data-expanded="false"]
  + .mx_EventTile[data-layout="bubble"][data-self="true"] {
  margin-top: 20px;
}
.mx_GenericEventListSummary[data-layout="bubble"][data-expanded="true"]
  .mx_EventTile_info {
  margin-right: 0;
  padding: 2px 0;
}
.mx_GenericEventListSummary[data-layout="bubble"][data-expanded="true"]
  .mx_EventTile_info
  .mx_MessageActionBar {
  inset-inline-end: 48px;
  inset-inline-start: auto;
}
.mx_GenericEventListSummary[data-layout="bubble"][data-expanded="true"]
  .mx_EventTile_info
  .mx_ReadReceiptGroup {
  inset-inline-end: calc(
    var(--ReadReceiptGroup_EventBubbleTile-spacing-end) * -1 + 60px
  );
}
.mx_GenericEventListSummary[data-layout="bubble"][data-expanded="true"]
  .mx_EventTile_info:before {
  inset-inline-end: 0;
}
.mx_EventTile_tileError[data-layout="bubble"] .mx_EventTile_line {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_EventTile {
  --EventTile_content-margin-inline-end: 34px;
  --EventTile_group_line-spacing-block-start: 1px;
  --EventTile_group_line-spacing-block-end: 3px;
  --EventTile_group_line-spacing-inline-start: 64px;
  --EventTile_group_line-line-height: 1.375rem;
  --EventTile_ThreadSummary-line-height: 1.5rem;
  -ms-flex-negative: 0;
  clear: both;
  flex-shrink: 0;
  max-width: 100%;
  padding-top: 18px;
  position: relative;
}
.mx_EventTile.mx_EventTile_info {
  color: var(--cpd-color-text-secondary);
  font-size: var(--cpd-font-size-body-sm);
}
.mx_EventTile .mx_EventTile_avatar {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.mx_EventTile .mx_EventTile_body {
  overflow-y: hidden;
}
.mx_EventTile .mx_EventTile_receiptSending,
.mx_EventTile .mx_EventTile_receiptSent {
  display: inline-block;
  height: 16px;
  position: relative;
  width: 16px;
}
.mx_EventTile .mx_EventTile_receiptSending:before,
.mx_EventTile .mx_EventTile_receiptSent:before {
  background-color: var(--cpd-color-icon-tertiary);
  content: "";
  height: 16px;
  left: 0;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 16px;
  mask-size: 16px;
  position: absolute;
  right: 0;
  top: 0;
  width: 16px;
}
.mx_EventTile .mx_EventTile_receiptSent:before {
  -webkit-mask-image: url(../../img/element-icons/circle-sent.4ba3d6b.svg);
  mask-image: url(../../img/element-icons/circle-sent.4ba3d6b.svg);
}
.mx_EventTile .mx_EventTile_receiptSending:before {
  -webkit-mask-image: url(../../img/element-icons/circle-sending.394023e.svg);
  mask-image: url(../../img/element-icons/circle-sending.394023e.svg);
}
.mx_EventTile .mx_EventTile_content.mx_EditMessageComposer,
.mx_EventTile .mx_EventTile_content.mx_EditWysiwygComposer {
  overflow: visible;
}
.mx_EventTile .mx_EventTile_searchHighlight {
  border-radius: 5px;
  cursor: pointer;
  padding-inline: 2px;
}
.mx_EventTile .mx_EventTile_searchHighlight,
.mx_EventTile .mx_EventTile_searchHighlight a {
  background-color: var(--cpd-color-text-action-accent);
  color: #f4f6fa;
}
.mx_EventTile .mx_EventTileBubble {
  margin-block: var(--EventTileBubble_margin-block);
  min-width: 100px;
}
.mx_EventTile .mx_MImageBody .mx_MImageBody_thumbnail_container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_EventTile .mx_DisambiguatedProfile {
  color: var(--cpd-color-text-primary);
  display: inline-block;
  font: var(--cpd-font-body-md-regular);
  padding-bottom: 0;
  padding-top: 0;
}
.mx_EventTile .mx_ReactionsRow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: wrap;
  flex-flow: wrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
}
.mx_EventTile .mx_ReplyChain--expanded .mx_EventTile_body {
  display: block;
  overflow-y: scroll;
}
.mx_EventTile .mx_ReplyChain--expanded .mx_EventTile_collapsedCodeBlock {
  /* !important needed due to .mx_ReplyTile .mx_EventTile_content .mx_EventTile_pre_container > pre */
  display: block !important;
}
.mx_RoomView_searchResultsPanel .mx_EventTile.mx_EventTile_contextual {
  opacity: 0.4;
}
.mx_EventTile.mx_EventTile_highlight,
.mx_EventTile.mx_EventTile_highlight .markdown-body,
.mx_EventTile.mx_EventTile_highlight .mx_EventTile_edited {
  color: var(--cpd-color-text-critical-primary);
}
.mx_EventTile.mx_EventTile_bubbleContainer {
  display: grid;
  grid-template-columns: 1fr 100px;
}
.mx_EventTile.mx_EventTile_bubbleContainer .mx_EventTile_line {
  grid-column: 1/3;
  margin-right: 0;
  padding: 0 !important;
}
.mx_EventTile.mx_EventTile_bubbleContainer .mx_EventTile_msgOption {
  grid-column: 2;
}
.mx_EventTile.mx_EventTile_bubbleContainer:hover .mx_EventTile_line {
  background-color: inherit !important;
}
.mx_EventTile.mx_EventTile_isEditing .mx_MessageTimestamp {
  visibility: hidden;
}
.mx_EventTile[data-layout="bubbles"],
.mx_EventTile[data-layout="irc"] {
  --selected-message-border-width: 4px;
  --EventTile-box-shadow-offset-x: calc(
    50px + var(--selected-message-border-width)
  );
  --EventTile-box-shadow-spread-radius: -50px;
}
.mx_EventTile[data-layout="bubbles"] .mx_EventTile_e2eIcon,
.mx_EventTile[data-layout="irc"] .mx_EventTile_e2eIcon {
  position: absolute;
}
.mx_EventTile[data-layout="bubbles"]
  .mx_MImageBody
  .mx_MImageBody_thumbnail_container,
.mx_EventTile[data-layout="irc"]
  .mx_MImageBody
  .mx_MImageBody_thumbnail_container {
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  min-height: 2.75rem;
  min-width: 2.75rem;
}
.mx_EventTile[data-layout="bubbles"] .mx_EventTile_line,
.mx_EventTile[data-layout="bubbles"] .mx_EventTile_reply,
.mx_EventTile[data-layout="irc"] .mx_EventTile_line,
.mx_EventTile[data-layout="irc"] .mx_EventTile_reply {
  border-radius: 8px;
  position: relative;
}
.mx_EventTile[data-layout="bubbles"] .mx_EventTile_reply,
.mx_EventTile[data-layout="irc"] .mx_EventTile_reply {
  margin-right: 10px;
}
.mx_EventTile[data-layout="bubbles"] .mx_EventTile_msgOption,
.mx_EventTile[data-layout="irc"] .mx_EventTile_msgOption {
  float: right;
  height: 1px;
  position: relative;
  text-align: right;
  width: 90px;
}
.mx_EventTile[data-layout="bubbles"] .mx_EventTile_msgOption a,
.mx_EventTile[data-layout="irc"] .mx_EventTile_msgOption a {
  text-decoration: none;
}
.mx_EventTile[data-layout="bubbles"].mx_EventTile_highlight
  .markdown-body
  .mx_EventTile_line,
.mx_EventTile[data-layout="bubbles"].mx_EventTile_highlight .mx_EventTile_line,
.mx_EventTile[data-layout="irc"].mx_EventTile_highlight
  .markdown-body
  .mx_EventTile_line,
.mx_EventTile[data-layout="irc"].mx_EventTile_highlight .mx_EventTile_line {
  background-color: var(--cpd-color-yellow-200);
}
.mx_EventTile[data-layout="bubbles"].mx_EventTile_actionBarFocused
  .mx_EventTile_line,
.mx_EventTile[data-layout="bubbles"].mx_EventTile_isEditing .mx_EventTile_line,
.mx_EventTile[data-layout="bubbles"].mx_EventTile_selected .mx_EventTile_line,
.mx_EventTile[data-layout="bubbles"]:focus-visible:focus-within
  .mx_EventTile_line,
.mx_EventTile[data-layout="irc"].mx_EventTile_actionBarFocused
  .mx_EventTile_line,
.mx_EventTile[data-layout="irc"].mx_EventTile_isEditing .mx_EventTile_line,
.mx_EventTile[data-layout="irc"].mx_EventTile_selected .mx_EventTile_line,
.mx_EventTile[data-layout="irc"]:focus-visible:focus-within .mx_EventTile_line {
  background-color: var(--cpd-color-bg-subtle-secondary);
}
.mx_EventTile[data-layout="bubbles"].mx_EventTile_isEditing > .mx_EventTile_line,
.mx_EventTile[data-layout="bubbles"].mx_EventTile_selected > .mx_EventTile_line,
.mx_EventTile[data-layout="irc"].mx_EventTile_isEditing > .mx_EventTile_line,
.mx_EventTile[data-layout="irc"].mx_EventTile_selected > .mx_EventTile_line {
  -webkit-box-shadow: inset var(--EventTile-box-shadow-offset-x) 0 0
    var(--EventTile-box-shadow-spread-radius)
    var(--cpd-color-bg-action-primary-rest);
  box-shadow: inset var(--EventTile-box-shadow-offset-x) 0 0
    var(--EventTile-box-shadow-spread-radius)
    var(--cpd-color-bg-action-primary-rest);
}
.mx_EventTile[data-layout="bubbles"].mx_EventTile_info .mx_EventTile_e2eIcon,
.mx_EventTile[data-layout="irc"].mx_EventTile_info .mx_EventTile_e2eIcon {
  top: 0;
}
.mx_EventTile[data-layout="bubbles"].mx_EventTile_continuation .mx_EventTile_line,
.mx_EventTile[data-layout="irc"].mx_EventTile_continuation .mx_EventTile_line {
  clear: both;
}
.mx_EventTile[data-layout="bubbles"]:hover .mx_EventTile_line,
.mx_EventTile[data-layout="irc"]:hover .mx_EventTile_line {
  background-color: var(--cpd-color-bg-subtle-secondary);
}
.mx_EventTile[data-layout="bubble"] .mx_EventTileBubble,
.mx_EventTile[data-layout="bubbles"] .mx_EventTileBubble {
  margin-inline: auto;
}
.mx_EventTile[data-layout="bubble"] .mx_ReplyChain,
.mx_EventTile[data-layout="bubbles"] .mx_ReplyChain {
  margin-bottom: 8px;
}
.mx_EventTile[data-layout="irc"] {
  --EventTile_irc_line-padding-block: 1px;
  --EventTile_irc_line_info-margin-inline-start: calc(
    var(--name-width) + var(--icon-width) + var(--right-padding) * 1
  );
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  padding-top: 0;
}
.mx_EventTile[data-layout="irc"] > a {
  min-width: 46px;
  min-width: var(--MessageTimestamp-width);
  text-decoration: none;
}
.mx_EventTile[data-layout="irc"] > * {
  margin-right: var(--right-padding);
}
.mx_EventTile[data-layout="irc"] .mx_EventTile_avatar,
.mx_EventTile[data-layout="irc"] .mx_EventTile_e2eIcon {
  height: 1.125rem;
  height: var(--irc-line-height);
}
.mx_EventTile[data-layout="irc"] .mx_DisambiguatedProfile,
.mx_EventTile[data-layout="irc"] .mx_EventTile_avatar,
.mx_EventTile[data-layout="irc"] .mx_EventTile_e2eIcon,
.mx_EventTile[data-layout="irc"] .mx_EventTile_msgOption {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_EventTile[data-layout="irc"] .mx_EventTile_avatar {
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  order: 1;
  position: relative;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_EventTile[data-layout="irc"] .mx_EventTile_avatar > .mx_BaseAvatar,
.mx_EventTile[data-layout="irc"] .mx_EventTile_avatar > .mx_BaseAvatar > * {
  font-size: 0.625rem !important;
  height: 0.875rem !important;
  line-height: 0.9375rem !important;
  width: 0.875rem !important;
}
.mx_EventTile[data-layout="irc"] .mx_DisambiguatedProfile {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
  width: var(--name-width);
  -webkit-margin-end: 0;
  margin-inline-end: 0;
}
.mx_EventTile[data-layout="irc"]
  .mx_DisambiguatedProfile
  > .mx_DisambiguatedProfile_displayName {
  overflow: hidden;
  text-align: end;
  text-overflow: ellipsis;
  width: 100%;
}
.mx_EventTile[data-layout="irc"]
  .mx_DisambiguatedProfile
  > .mx_DisambiguatedProfile_mxid {
  margin-left: 0;
  padding: 0 5px;
  visibility: collapse;
}
.mx_EventTile[data-layout="irc"] .mx_DisambiguatedProfile:hover {
  overflow: visible;
  z-index: 10;
}
.mx_EventTile[data-layout="irc"]
  .mx_DisambiguatedProfile:hover
  > .mx_DisambiguatedProfile_displayName {
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 8px 0 0 8px;
  display: inline;
  overflow: visible;
  padding-right: 8px;
}
.mx_EventTile[data-layout="irc"]
  .mx_DisambiguatedProfile:hover
  > .mx_DisambiguatedProfile_mxid {
  background-color: var(--cpd-color-bg-subtle-secondary);
  opacity: 1;
  visibility: visible;
}
.mx_EventTile[data-layout="irc"] .mx_EventTile_e2eIcon {
  padding: 0;
  -webkit-box-flex: 0;
  -ms-flex-positive: 0;
  background-position: 50%;
  flex-grow: 0;
}
.mx_EventTile[data-layout="irc"] .mx_EventTile_line .mx_EventTile_e2eIcon,
.mx_EventTile[data-layout="irc"] .mx_EventTile_line .mx_MTextBody,
.mx_EventTile[data-layout="irc"] .mx_EventTile_line .mx_TextualEvent,
.mx_EventTile[data-layout="irc"] .mx_EventTile_line .mx_ViewSourceEvent {
  padding: var(--EventTile_irc_line-padding-block) 0;
}
.mx_EventTile[data-layout="irc"] .mx_EventTile_line .mx_EventTile_e2eIcon,
.mx_EventTile[data-layout="irc"] .mx_EventTile_line .mx_MTextBody,
.mx_EventTile[data-layout="irc"] .mx_EventTile_line .mx_TextualEvent {
  display: inline-block;
}
.mx_EventTile[data-layout="irc"]
  .mx_EventTile_line
  .mx_ReplyTile
  .mx_MTextBody {
  display: -webkit-box;
}
.mx_EventTile[data-layout="irc"] .mx_EventTile_line,
.mx_EventTile[data-layout="irc"] .mx_EventTile_reply {
  -webkit-box-ordinal-group: 4;
  -ms-flex-order: 3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  order: 3;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -ms-flex-negative: 1;
  flex-shrink: 1;
  min-width: 0;
}
.mx_EventTile[data-layout="irc"] .mx_EventTile_reply {
  -webkit-box-ordinal-group: 5;
  -ms-flex-order: 4;
  order: 4;
}
.mx_EventTile[data-layout="irc"] .mx_EventTile_msgOption {
  -webkit-box-ordinal-group: 6;
  -ms-flex-order: 5;
  order: 5;
}
.mx_EventTile[data-layout="irc"] .mx_EventTile_msgOption .mx_ReadReceiptGroup {
  inset-block-start: -0.3rem;
}
.mx_EventTile[data-layout="irc"] .mx_ReplyChain {
  margin: 0;
}
.mx_EventTile[data-layout="irc"] .mx_MessageTimestamp {
  text-align: right;
}
.mx_EventTile[data-layout="irc"] .mx_EditMessageComposer_buttons {
  position: relative;
}
.mx_EventTile[data-layout="irc"] .mx_EventTileBubble {
  left: var(--EventTile_irc_line_info-margin-inline-start);
  position: relative;
}
.mx_EventTile[data-layout="irc"] .mx_EventTileBubble.mx_cryptoEvent {
  left: auto;
}
.mx_EventTile[data-layout="irc"] .mx_ReplyTile .mx_EventTileBubble {
  left: auto;
}
.mx_EventTile[data-layout="irc"].mx_EventTile_isEditing
  > .mx_EventTile_line
  .mx_EditMessageComposer {
  -webkit-padding-start: calc(
    var(--selected-message-border-width) +
      var(--EditMessageComposer-padding-inline)
  );
  padding-inline-start: calc(
    var(--selected-message-border-width) +
      var(--EditMessageComposer-padding-inline)
  );
}
.mx_EventTile[data-layout="irc"].mx_EventTile_info .mx_EventTile_avatar {
  left: var(--EventTile_irc_line_info-margin-inline-start);
  margin-right: var(--right-padding);
  padding-block: var(--EventTile_irc_line-padding-block);
  top: 0;
}
.mx_EventTile[data-layout="irc"].mx_EventTile_info .mx_EventTile_line {
  -webkit-margin-start: var(--EventTile_irc_line_info-margin-inline-start);
  margin-inline-start: var(--EventTile_irc_line_info-margin-inline-start);
}
.mx_EventTile[data-layout="irc"].mx_EventTile_info .mx_TextualEvent,
.mx_EventTile[data-layout="irc"].mx_EventTile_info .mx_ViewSourceEvent {
  line-height: 1.125rem;
  line-height: var(--irc-line-height);
}
.mx_EventTile[data-layout="irc"].mx_EventTile_emote .mx_EventTile_avatar {
  margin-left: calc(
    var(--name-width) + var(--icon-width) + var(--right-padding) * 1
  );
}
.mx_EventTile[data-layout="bubbles"] .mx_EventTile_avatar {
  left: 8px;
  top: 14px;
}
.mx_EventTile[data-layout="bubbles"] .mx_EventTile_line,
.mx_EventTile[data-layout="bubbles"] .mx_EventTile_reply {
  line-height: var(--EventTile_group_line-line-height);
  padding-bottom: var(--EventTile_group_line-spacing-block-end);
  padding-left: var(--EventTile_group_line-spacing-inline-start);
  padding-top: var(--EventTile_group_line-spacing-block-start);
}
.mx_EventTile[data-layout="bubbles"] .mx_EventTile_e2eIcon {
  height: var(--EventTile_group_line-line-height);
  inset: 0 0 0 44px;
  margin: 1px;
}
.mx_EventTile[data-layout="bubbles"] .mx_EventTile_msgOption {
  -webkit-margin-end: 10px;
  margin-inline-end: 10px;
}
.mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_msgOption
  .mx_ReadReceiptGroup {
  inset-block-start: calc(-1.375rem - 3px);
}
.mx_EventTile[data-layout="bubbles"] .mx_MessageTimestamp {
  left: 0;
  position: absolute;
  text-align: center;
}
.mx_EventTile[data-layout="bubbles"] .mx_ThreadSummary,
.mx_EventTile[data-layout="bubbles"] .mx_ThreadSummary_icon {
  margin-left: 64px;
}
.mx_EventTile[data-layout="bubbles"] .mx_ReactionsRow {
  margin: 4px 64px;
}
.mx_EventTile[data-layout="bubbles"] > .mx_DisambiguatedProfile {
  line-height: 1.25rem;
  margin-left: 64px;
  max-width: calc(100% - 64px);
}
.mx_EventTile[data-layout="bubbles"] > .mx_EventTile_avatar {
  position: absolute;
  z-index: 9;
}
.mx_RoomView_timeline_rr_enabled
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_line,
.mx_RoomView_timeline_rr_enabled
  .mx_EventTile[data-layout="bubbles"]
  .mx_ThreadSummary,
.mx_RoomView_timeline_rr_enabled
  .mx_EventTile[data-layout="bubbles"]
  .mx_ThreadSummary_icon {
  margin-right: 80px;
  min-height: 0.875rem;
}
.mx_RoomView_timeline_rr_enabled
  .mx_EventTile[data-layout="bubbles"]
  .mx_ThreadSummary {
  max-width: min(calc(100% - 144px), 600px);
}
.mx_EventTile[data-layout="bubbles"].mx_EventTile_continuation {
  padding-top: 0;
}
.mx_EventTile[data-layout="bubbles"].mx_EventTile_info {
  padding-top: 0;
}
.mx_EventTile[data-layout="bubbles"].mx_EventTile_info .mx_EventTile_avatar,
.mx_EventTile[data-layout="bubbles"].mx_EventTile_info .mx_EventTile_e2eIcon {
  line-height: 1;
  margin: 3px 0 2px;
}
.mx_EventTile[data-layout="bubbles"].mx_EventTile_info .mx_EventTile_avatar {
  height: 14px;
  inset-inline-start: 64px;
  top: auto;
}
.mx_EventTile[data-layout="bubbles"].mx_EventTile_info .mx_EventTile_line {
  padding-block: 3px 2px;
  -webkit-padding-start: calc(
    var(--EventTile_group_line-spacing-inline-start) + 20px
  );
  padding-inline-start: calc(
    var(--EventTile_group_line-spacing-inline-start) + 20px
  );
}
.mx_EventTile[data-layout="bubbles"].mx_EventTile_info
  .mx_EventTile_line
  .mx_MessageTimestamp {
  top: 0;
}
.mx_EventTile[data-layout="bubbles"].mx_EventTile_info.mx_EventTile_selected
  .mx_EventTile_line {
  -webkit-padding-start: calc(
    var(--EventTile_group_line-spacing-inline-start) + 20px
  );
  padding-inline-start: calc(
    var(--EventTile_group_line-spacing-inline-start) + 20px
  );
}
.mx_EventTile[data-layout="bubble"] {
  margin-left: var(--EventTile_bubble-margin-inline-start);
  margin-top: calc(var(--gutterSize) / 2);
  max-width: none;
  padding-top: 0;
}
.mx_EventTile[data-layout="bubble"]
  .mx_EventTile_msgOption
  .mx_ReadReceiptGroup {
  inset-block-end: calc(0.5625rem - 12px);
  inset-block-start: auto;
  inset-inline-end: calc(
    var(--ReadReceiptGroup_EventBubbleTile-spacing-end) * -1
  );
  position: absolute;
}
.mx_EventTile[data-layout="bubble"] .mx_EventTileBubble {
  max-width: 600px;
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_continuation {
  margin-top: 2px;
}
.mx_EventTile[data-layout="bubble"].mx_EventTile_lastInSection {
  margin-bottom: calc(var(--gutterSize) / 2);
}
.mx_GenericEventListSummary[data-layout="bubbles"]
  .mx_EventTile_line
  .mx_RedactedBody,
.mx_GenericEventListSummary[data-layout="irc"]
  .mx_EventTile_line
  .mx_RedactedBody {
  line-height: 1;
}
.mx_GenericEventListSummary[data-layout="irc"] > .mx_EventTile_line {
  padding-left: calc(
    var(--name-width) + var(--icon-width) + var(--MessageTimestamp-width) +
      var(--right-padding) * 2
  );
}
.mx_GenericEventListSummary[data-layout="bubbles"] .mx_EventTile_line {
  padding-left: 64px;
}
.mx_GenericEventListSummary[data-layout="bubbles"]
  .mx_GenericEventListSummary_unstyledList
  > .mx_EventTile_info
  .mx_EventTile_avatar
  ~ .mx_EventTile_line {
  -webkit-padding-start: calc(
    var(--EventTile_group_line-spacing-inline-start) + 20px
  );
  padding-inline-start: calc(
    var(--EventTile_group_line-spacing-inline-start) + 20px
  );
}
.mx_EventTile_content {
  margin-right: var(--EventTile_content-margin-inline-end);
  overflow-x: hidden;
  overflow-y: hidden;
}
.mx_EventTile_content .mx_EventTile_edited,
.mx_EventTile_content .mx_EventTile_pendingModeration {
  color: var(--cpd-color-text-secondary);
  display: inline-block;
  font-size: 0.75rem;
  margin-left: 9px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.mx_EventTile_content .mx_EventTile_edited {
  cursor: pointer;
}
.mx_EventTile_content .markdown-body {
  color: inherit;
  font: var(--cpd-font-body-md-regular) !important;
  font-family: inherit !important;
  letter-spacing: var(--cpd-font-letter-spacing-body-md);
  line-height: inherit !important;
  white-space: normal !important;
}
.mx_EventTile_content .markdown-body code,
.mx_EventTile_content .markdown-body pre {
  background-color: var(--cpd-color-bg-subtle-primary);
  font-family: Inconsolata, , Apple Color Emoji, Segoe UI Emoji, Courier,
    monospace, Noto Color Emoji !important;
  font-family: "Inconsolata", var(--emoji-font-family), "Apple Color Emoji",
    "Segoe UI Emoji", "Courier", monospace, "Noto Color Emoji" !important;
}
.mx_EventTile_content .markdown-body code:not(pre *) {
  background-color: var(--cpd-color-bg-subtle-primary);
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 4px;
  line-height: 1.375rem;
  margin-right: 2px;
  padding: 2px 0;
}
.mx_EventTile_content .markdown-body code {
  white-space: pre-wrap;
}
.mx_EventTile_content .markdown-body pre {
  overflow-x: overlay;
  overflow-y: visible;
}
.mx_EventTile_content .markdown-body pre::-webkit-scrollbar-corner {
  background: transparent;
}
.mx_EventTile_content .markdown-body pre {
  border: 1px solid var(--cpd-color-gray-400);
}
.mx_EventTile_content .markdown-body pre code {
  white-space: pre;
}
.mx_EventTile_content .markdown-body pre code > * {
  display: inline;
}
.mx_EventTile_content .markdown-body h1,
.mx_EventTile_content .markdown-body h2,
.mx_EventTile_content .markdown-body h3,
.mx_EventTile_content .markdown-body h4,
.mx_EventTile_content .markdown-body h5,
.mx_EventTile_content .markdown-body h6 {
  color: inherit;
  font-family: inherit !important;
}
.mx_EventTile_content .markdown-body h1,
.mx_EventTile_content .markdown-body h2 {
  border-bottom: none !important;
  font-size: 1.5em;
}
.mx_EventTile_content .markdown-body a {
  color: var(--cpd-color-text-link-external);
}
.mx_EventTile_content .markdown-body blockquote {
  border-left: 2px solid var(--cpd-color-border-interactive-primary);
  border-radius: 2px;
  color: var(--cpd-color-text-secondary);
  padding: 0 10px;
}
.mx_EventTile_content .markdown-body ol ol,
.mx_EventTile_content .markdown-body ul ol {
  list-style-type: revert;
}
.mx_EventTile_content .markdown-body ul {
  list-style-type: disc;
}
.mx_EventTile_spoiler {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  margin: 0;
  padding: 0;
  text-align: inherit;
}
.mx_EventTile_spoiler .mx_EventTile_spoiler_reason {
  color: #acacac;
  font-size: 0.6875rem;
}
.mx_EventTile_spoiler .mx_EventTile_spoiler_content {
  -webkit-filter: blur(5px) saturate(0.1) sepia(1);
  filter: blur(5px) saturate(0.1) sepia(1);
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
}
.mx_EventTile_spoiler.visible > .mx_EventTile_spoiler_content {
  -webkit-filter: none;
  filter: none;
  -webkit-user-select: auto;
  -moz-user-select: auto;
  -ms-user-select: auto;
  user-select: auto;
}
.mx_EventTile_bigEmoji {
  font-size: 48px;
  line-height: 57px;
}
.mx_EventTile_bigEmoji .mx_Emoji {
  font-size: inherit !important;
}
.mx_EventTile_e2eIcon {
  background-repeat: no-repeat;
  background-size: contain;
  display: block;
  height: 14px;
  position: relative;
  width: 14px;
  display: none;
}
.mx_EventTile_e2eIcon:after,
.mx_EventTile_e2eIcon:before {
  content: "";
  display: block;
  inset: 0;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
}
.mx_EventTile_e2eIcon:before {
  -webkit-mask-size: 80%;
  mask-size: 80%;
}
.mx_EventTile_e2eIcon.mx_EventTile_e2eIcon_warning:after {
  background-color: var(--cpd-color-icon-critical-primary);
  -webkit-mask-image: url(../../img/e2e/warning.71ffc83.svg);
  mask-image: url(../../img/e2e/warning.71ffc83.svg);
}
.mx_EventTile_e2eIcon.mx_EventTile_e2eIcon_normal:after {
  background-color: var(--cpd-color-icon-tertiary);
  -webkit-mask-image: url(../../img/e2e/normal.ab42a7b.svg);
  mask-image: url(../../img/e2e/normal.ab42a7b.svg);
}
.mx_EventTile_e2eIcon.mx_EventTile_e2eIcon_decryption_failure:after {
  background-color: var(--cpd-color-icon-tertiary);
  -webkit-mask-image: url(../../img/e2e/decryption-failure.d4a03e3.svg);
  mask-image: url(../../img/e2e/decryption-failure.d4a03e3.svg);
}
.mx_EventTile_body a:hover {
  text-decoration: underline;
}
.mx_EventTile_body pre {
  border: 1px solid transparent;
}
.mx_EventTile:focus-visible:focus-within .mx_EventTile_body pre,
.mx_EventTile:hover .mx_EventTile_body pre {
  border: 1px solid var(--cpd-color-gray-800);
}
.mx_EventTile_body.markdown-body img {
  -o-object-fit: contain;
  object-fit: contain;
  -o-object-position: left top;
  object-position: left top;
}
.mx_EventTile_clamp .mx_EventTile_body {
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mx_EventTile_body .mx_EventTile_pre_container {
  position: relative;
}
.mx_EventTile_body
  .mx_EventTile_pre_container:focus-within
  .mx_EventTile_button,
.mx_EventTile_body .mx_EventTile_pre_container:hover .mx_EventTile_button {
  visibility: visible;
}
.mx_EventTile_body
  .mx_EventTile_pre_container
  .mx_EventTile_collapsedCodeBlock {
  max-height: 30vh;
  padding-bottom: 12px;
  padding-top: 12px;
}
.mx_EventTile_body .mx_EventTile_pre_container .mx_EventTile_button {
  background-color: var(--cpd-color-text-primary);
  height: 19px;
  position: absolute;
  right: 8px;
  top: 8px;
  visibility: hidden;
  width: 19px;
}
.mx_EventTile_body
  .mx_EventTile_pre_container
  .mx_EventTile_button.mx_EventTile_buttonBottom {
  top: 33px;
}
.mx_EventTile_body
  .mx_EventTile_pre_container
  .mx_EventTile_button.mx_EventTile_collapseButton,
.mx_EventTile_body
  .mx_EventTile_pre_container
  .mx_EventTile_button.mx_EventTile_expandButton {
  -webkit-mask-size: 75%;
  mask-size: 75%;
}
.mx_EventTile_body .mx_EventTile_pre_container .mx_EventTile_copyButton {
  height: 17px;
  -webkit-mask-image: url(../../img/element-icons/copy.4ee219c.svg);
  mask-image: url(../../img/element-icons/copy.4ee219c.svg);
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  right: 9px;
  width: 17px;
}
.mx_EventTile_lineNumbers {
  color: gray;
  float: left;
  margin: 0 0.5em 0 -1.5em;
}
.mx_EventTile_lineNumbers span {
  display: block;
  padding-left: 1em;
  text-align: right;
}
.mx_EventTile_button {
  cursor: pointer;
  display: inline-block;
}
.mx_EventTile_collapseButton,
.mx_EventTile_expandButton {
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
.mx_EventTile_collapseButton {
  -webkit-mask-image: url(../../img/element-icons/minimise-collapse.c9216fb.svg);
  mask-image: url(../../img/element-icons/minimise-collapse.c9216fb.svg);
}
.mx_EventTile_expandButton {
  -webkit-mask-image: url(../../img/element-icons/maximise-expand.c678e40.svg);
  mask-image: url(../../img/element-icons/maximise-expand.c678e40.svg);
}
.mx_EventTile_tileError {
  color: red;
  margin-right: 0;
  text-align: center;
}
.mx_EventTile_tileError .mx_EventTile_line {
  margin-right: 0;
  padding-left: 0;
}
.mx_EventTile_tileError .mx_EventTile_line span {
  padding: 4px 8px;
}
.mx_EventTile_tileError a {
  margin-left: 1em;
}
.mx_EventTile.mx_EventTile_actionBarFocused .mx_MessageActionBar,
.mx_EventTile:focus-visible:focus-within .mx_MessageActionBar,
.mx_EventTile:hover .mx_MessageActionBar,
[data-whatinput="keyboard"] .mx_EventTile:focus-within .mx_MessageActionBar {
  visibility: visible;
}
.mx_EventTile:not(:hover):not(.mx_EventTile_actionBarFocused):not(
    [data-whatinput="keyboard"] :focus-within
  ):not(:focus-visible:focus-within)
  .mx_MessageActionBar
  .mx_Indicator {
  -webkit-animation: none;
  animation: none;
}
.mx_EventTile[data-shape="Notification"],
.mx_EventTile[data-shape="ThreadsList"] {
  --topOffset: 12px;
  --leftOffset: 48px;
  border-radius: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: wrap;
  flex-flow: wrap;
  margin: 13px 0 12px;
  margin: calc(var(--topOffset) + 1px) 0 var(--topOffset);
  padding: 8px 24px 8px 8px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_EventTile[data-shape="Notification"]:after,
.mx_EventTile[data-shape="Notification"]:before,
.mx_EventTile[data-shape="ThreadsList"]:after,
.mx_EventTile[data-shape="ThreadsList"]:before {
  content: "";
  position: absolute;
}
.mx_EventTile[data-shape="Notification"]:after,
.mx_EventTile[data-shape="ThreadsList"]:after {
  background-color: var(--cpd-color-gray-400);
  height: 1px;
  inset: auto 24px calc(var(--topOffset) * -1 - 1px)
    calc(var(--leftOffset) + 8px);
  pointer-events: none;
}
.mx_EventTile[data-shape="Notification"]:before,
.mx_EventTile[data-shape="ThreadsList"]:before {
  inset: 0;
  pointer-events: none;
}
.mx_EventTile[data-shape="Notification"][data-notification="total"]:before,
.mx_EventTile[data-shape="ThreadsList"][data-notification="total"]:before {
  background-color: var(--cpd-color-icon-tertiary);
}
.mx_EventTile[data-shape="Notification"][data-notification="highlight"]:before,
.mx_EventTile[data-shape="ThreadsList"][data-notification="highlight"]:before {
  background-color: var(--cpd-color-text-critical-primary);
}
.mx_EventTile[data-shape="Notification"]:last-child:after,
.mx_EventTile[data-shape="ThreadsList"]:last-child:after {
  content: normal;
}
.mx_EventTile[data-shape="Notification"]:last-child,
.mx_EventTile[data-shape="ThreadsList"]:last-child {
  margin-bottom: 0;
}
.mx_EventTile[data-shape="Notification"]:first-child,
.mx_EventTile[data-shape="ThreadsList"]:first-child {
  margin-top: 0;
}
.mx_EventTile[data-shape="Notification"] .mx_EventTile_avatar,
.mx_EventTile[data-shape="ThreadsList"] .mx_EventTile_avatar {
  inset: 8px auto auto 8px;
}
.mx_EventTile[data-shape="Notification"] .mx_EventTile_details,
.mx_EventTile[data-shape="ThreadsList"] .mx_EventTile_details {
  overflow: hidden;
}
.mx_EventTile[data-shape="Notification"] .mx_DisambiguatedProfile,
.mx_EventTile[data-shape="ThreadsList"] .mx_DisambiguatedProfile {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_EventTile[data-shape="Notification"]
  .mx_DisambiguatedProfile
  .mx_DisambiguatedProfile_displayName,
.mx_EventTile[data-shape="Notification"]
  .mx_DisambiguatedProfile
  .mx_DisambiguatedProfile_mxid,
.mx_EventTile[data-shape="ThreadsList"]
  .mx_DisambiguatedProfile
  .mx_DisambiguatedProfile_displayName,
.mx_EventTile[data-shape="ThreadsList"]
  .mx_DisambiguatedProfile
  .mx_DisambiguatedProfile_mxid {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mx_EventTile[data-shape="Notification"]
  .mx_DisambiguatedProfile
  .mx_DisambiguatedProfile_displayName,
.mx_EventTile[data-shape="ThreadsList"]
  .mx_DisambiguatedProfile
  .mx_DisambiguatedProfile_displayName {
  -webkit-box-flex: 0;
  -ms-flex: none;
  flex: none;
  max-width: 100%;
}
.mx_EventTile[data-shape="Notification"]
  .mx_DisambiguatedProfile
  .mx_DisambiguatedProfile_mxid,
.mx_EventTile[data-shape="ThreadsList"]
  .mx_DisambiguatedProfile
  .mx_DisambiguatedProfile_mxid {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_EventTile[data-shape="Notification"] .mx_EventTile_line,
.mx_EventTile[data-shape="ThreadsList"] .mx_EventTile_line {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-bottom: 0;
  width: 100%;
  -webkit-padding-start: var(--leftOffset);
  padding-inline-start: var(--leftOffset);
}
.mx_EventTile[data-shape="Notification"] .mx_MessageTimestamp,
.mx_EventTile[data-shape="ThreadsList"] .mx_MessageTimestamp {
  font-size: 0.75rem;
  margin-left: auto;
  overflow: hidden;
  position: static;
  text-overflow: ellipsis;
  width: auto;
}
.mx_EventTile[data-shape="Notification"]:hover,
.mx_EventTile[data-shape="ThreadsList"]:hover {
  background-color: var(--cpd-color-bg-subtle-secondary);
}
.mx_EventTile[data-shape="Notification"][data-layout="bubbles"]:hover
  .mx_EventTile_line,
.mx_EventTile[data-shape="ThreadsList"][data-layout="bubbles"]:hover
  .mx_EventTile_line {
  background-color: inherit;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.mx_EventTile[data-shape="ThreadsList"] .mx_ThreadPanel_replies {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 8px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font: var(--cpd-font-body-sm-regular);
  position: relative;
}
.mx_EventTile[data-shape="ThreadsList"] .mx_ThreadPanel_replies:before {
  background-color: var(--cpd-color-icon-tertiary) !important;
  content: "";
  display: inline-block;
  height: 18px;
  -webkit-mask-image: url(../../img/element-icons/thread-summary.4b1ebec.svg);
  mask-image: url(../../img/element-icons/thread-summary.4b1ebec.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  min-width: 18px;
}
.mx_EventTile[data-shape="ThreadsList"]
  .mx_ThreadPanel_replies
  .mx_ThreadPanel_replies_amount {
  color: var(--cpd-color-text-secondary);
  font-weight: var(--cpd-font-weight-semibold);
  padding: 0 12px 0 8px;
  position: relative;
  white-space: nowrap;
}
.mx_EventTile[data-shape="ThreadsList"]
  .mx_ThreadPanel_replies
  .mx_ThreadSummary_content {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_ThreadView {
  --ThreadView_group_spacing-start: 56px;
  --ThreadView_group_spacing-end: 8px;
}
.mx_ThreadView .mx_EventTile {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_ThreadView .mx_EventTile .mx_EventTile_roomName {
  display: none;
}
.mx_ThreadView .mx_EventTile.mx_EventTile_info .mx_EventTile_avatar {
  height: 14px;
  margin-bottom: 0;
  margin-top: 0;
  position: absolute;
  top: 1.5px;
  width: 14px;
}
.mx_ThreadView .mx_EventTile.mx_EventTile_info .mx_EventTile_line,
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info.mx_EventTile_selected
  .mx_EventTile_line {
  -webkit-padding-start: 0;
  line-height: 0.75rem;
  padding-inline-start: 0;
}
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info
  .mx_EventTile_line
  .mx_EventTile_content,
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info
  .mx_EventTile_line
  .mx_RedactedBody,
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info.mx_EventTile_selected
  .mx_EventTile_line
  .mx_EventTile_content,
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info.mx_EventTile_selected
  .mx_EventTile_line
  .mx_RedactedBody {
  font-size: 0.75rem;
  width: auto;
}
.mx_ThreadView .mx_EventTile.mx_EventTile_info[data-layout="bubbles"],
.mx_ThreadView .mx_EventTile.mx_EventTile_info[data-layout="irc"] {
  padding-top: 0;
}
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info[data-layout="bubbles"]
  .mx_EventTile_avatar,
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info[data-layout="irc"]
  .mx_EventTile_avatar {
  left: 56px;
  left: calc(var(--MessageTimestamp-width) + 10px);
  z-index: 9;
}
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info[data-layout="bubbles"]
  .mx_MessageTimestamp,
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info[data-layout="irc"]
  .mx_MessageTimestamp {
  top: 2px;
}
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info[data-layout="bubbles"]
  .mx_EventTile_line
  .mx_EventTile_content,
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info[data-layout="bubbles"]
  .mx_EventTile_line
  .mx_RedactedBody,
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info[data-layout="bubbles"].mx_EventTile_selected
  .mx_EventTile_line
  .mx_EventTile_content,
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info[data-layout="bubbles"].mx_EventTile_selected
  .mx_EventTile_line
  .mx_RedactedBody,
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info[data-layout="irc"]
  .mx_EventTile_line
  .mx_EventTile_content,
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info[data-layout="irc"]
  .mx_EventTile_line
  .mx_RedactedBody,
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info[data-layout="irc"].mx_EventTile_selected
  .mx_EventTile_line
  .mx_EventTile_content,
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info[data-layout="irc"].mx_EventTile_selected
  .mx_EventTile_line
  .mx_RedactedBody {
  -webkit-margin-start: 20px;
  margin-inline-start: 20px;
}
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info[data-layout="bubble"]
  .mx_EventTile_avatar {
  inset-inline-start: 0;
}
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info[data-layout="bubble"]
  .mx_EventTile_line
  .mx_EventTile_content,
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info[data-layout="bubble"]
  .mx_EventTile_line
  .mx_RedactedBody,
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info[data-layout="bubble"].mx_EventTile_selected
  .mx_EventTile_line
  .mx_EventTile_content,
.mx_ThreadView
  .mx_EventTile.mx_EventTile_info[data-layout="bubble"].mx_EventTile_selected
  .mx_EventTile_line
  .mx_RedactedBody {
  -webkit-margin-start: calc(var(--ThreadView_group_spacing-start) + 20px);
  margin-inline-start: calc(var(--ThreadView_group_spacing-start) + 20px);
}
.mx_ThreadView .mx_EventTile[data-layout="bubbles"],
.mx_ThreadView .mx_EventTile[data-layout="irc"] {
  -webkit-padding-before: 16px;
  padding-block-start: 16px;
}
.mx_ThreadView .mx_EventTile[data-layout="bubbles"] .mx_EventTile_line,
.mx_ThreadView .mx_EventTile[data-layout="bubbles"] .mx_ReactionsRow,
.mx_ThreadView .mx_EventTile[data-layout="irc"] .mx_EventTile_line,
.mx_ThreadView .mx_EventTile[data-layout="irc"] .mx_ReactionsRow {
  -webkit-margin-end: var(--ThreadView_group_spacing-end);
  margin-inline-end: var(--ThreadView_group_spacing-end);
}
.mx_ThreadView .mx_EventTile[data-layout="bubbles"] .mx_EventTile_line,
.mx_ThreadView .mx_EventTile[data-layout="irc"] .mx_EventTile_line {
  padding-block: var(--BaseCard_EventTile_line-padding-block);
  -webkit-padding-start: var(--ThreadView_group_spacing-start);
  padding-inline-start: var(--ThreadView_group_spacing-start);
}
.mx_ThreadView
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_line
  .mx_EventTile_content.mx_EditMessageComposer,
.mx_ThreadView
  .mx_EventTile[data-layout="irc"]
  .mx_EventTile_line
  .mx_EventTile_content.mx_EditMessageComposer {
  -webkit-padding-start: 0;
  padding-inline-start: 0;
}
.mx_ThreadView .mx_EventTile[data-layout="bubbles"] .mx_ReactionsRow,
.mx_ThreadView .mx_EventTile[data-layout="irc"] .mx_ReactionsRow {
  -webkit-margin-start: var(--ThreadView_group_spacing-start);
  margin-inline-start: var(--ThreadView_group_spacing-start);
}
.mx_ThreadView .mx_EventTile[data-layout="bubbles"].mx_EventTile_continuation,
.mx_ThreadView .mx_EventTile[data-layout="irc"].mx_EventTile_continuation {
  -webkit-padding-before: 0;
  padding-block-start: 0;
}
.mx_ThreadView .mx_EventTile[data-layout="bubbles"] {
  width: 100%;
}
.mx_ThreadView .mx_EventTile[data-layout="bubbles"] .mx_EventTile_senderDetails {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 16px;
  -webkit-padding-start: 8px;
  padding-inline-start: 8px;
}
.mx_ThreadView
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_senderDetails
  a {
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1;
  flex: 1;
  max-width: 100%;
  min-width: 0;
  min-width: auto;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_ThreadView
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_senderDetails
  a
  .mx_DisambiguatedProfile {
  margin-left: 8px;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_ThreadView .mx_EventTile[data-layout="bubbles"] .mx_MessageTimestamp {
  position: absolute;
  top: 2px;
}
.mx_ThreadView .mx_EventTile[data-layout="bubble"] {
  margin-inline: var(--BaseCard_EventTile-spacing-inline);
}
.mx_ThreadView .mx_EventTile[data-layout="bubble"]:before {
  inset-inline: calc(var(--BaseCard_EventTile-spacing-inline) * -1);
  z-index: auto;
}
.mx_ThreadView .mx_EventTile[data-layout="bubble"] .mx_ReactionsRow {
  position: relative;
}
.mx_ThreadView
  .mx_EventTile[data-layout="bubble"]
  .mx_EventTile_line.mx_EventTile_mediaLine {
  padding-block: 0;
  -webkit-padding-start: 0;
  max-width: var(--EventBubbleTile_line-max-width);
  padding-inline-start: 0;
}
.mx_ThreadView .mx_EventTile[data-layout="bubble"][data-self="true"] {
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
}
.mx_ThreadView
  .mx_EventTile[data-layout="bubble"][data-self="true"]
  .mx_EventTile_line.mx_EventTile_mediaLine {
  margin: 0 var(--EventTile_bubble_line-margin-inline-end) 0 0;
}
.mx_ThreadView
  .mx_GenericEventListSummary[data-layout="bubbles"]
  > .mx_EventTile_line,
.mx_ThreadView
  .mx_GenericEventListSummary[data-layout="irc"]
  > .mx_EventTile_line {
  -webkit-padding-start: var(--ThreadView_group_spacing-start);
  padding-inline-start: var(--ThreadView_group_spacing-start);
  -webkit-padding-end: var(--ThreadView_group_spacing-end);
  padding-inline-end: var(--ThreadView_group_spacing-end);
}
.mx_MatrixChat_useCompactLayout .mx_EventTile[data-layout="bubbles"] {
  --MatrixChat_useCompactLayout_group-padding-top: 4px;
  --MatrixChat_useCompactLayout-top-avatar: 2px;
  --MatrixChat_useCompactLayout_line-spacing-block: 0px;
  padding-top: 4px;
  padding-top: var(--MatrixChat_useCompactLayout_group-padding-top);
}
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_line,
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_reply {
  padding-block: var(--MatrixChat_useCompactLayout_line-spacing-block);
}
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"]
  .mx_ReplyChain {
  margin-bottom: 4px;
}
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"].mx_EventTile_info {
  font-size: 0.8125rem;
  padding-top: 0;
}
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"].mx_EventTile_info
  .mx_EventTile_avatar,
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"].mx_EventTile_info
  .mx_EventTile_e2eIcon {
  margin-block: var(--MatrixChat_useCompactLayout_line-spacing-block);
  top: 0;
}
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"].mx_EventTile_info
  .mx_EventTile_line,
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"].mx_EventTile_info
  .mx_EventTile_reply {
  line-height: 1.25rem;
}
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"].mx_EventTile_emote {
  padding-top: 8px;
}
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"].mx_EventTile_emote
  .mx_EventTile_avatar {
  top: var(--MatrixChat_useCompactLayout-top-avatar);
}
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"].mx_EventTile_emote
  .mx_EventTile_line,
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"].mx_EventTile_emote
  .mx_EventTile_reply {
  padding-bottom: 1px;
}
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"].mx_EventTile_emote.mx_EventTile_continuation
  .mx_EventTile_line,
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"].mx_EventTile_emote.mx_EventTile_continuation
  .mx_EventTile_reply {
  padding-bottom: var(--MatrixChat_useCompactLayout_line-spacing-block);
}
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"].mx_EventTile_continuation {
  padding-top: var(--MatrixChat_useCompactLayout_line-spacing-block);
}
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_avatar {
  top: var(--MatrixChat_useCompactLayout-top-avatar);
}
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_e2eIcon {
  margin: 0;
}
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"]
  .mx_DisambiguatedProfile {
  font-size: 0.8125rem;
}
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_msgOption
  .mx_ReadReceiptGroup {
  inset-block-start: -2rem;
}
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_content
  .markdown-body
  blockquote,
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_content
  .markdown-body
  dl,
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_content
  .markdown-body
  ol,
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_content
  .markdown-body
  p,
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_content
  .markdown-body
  pre,
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_content
  .markdown-body
  table,
.mx_MatrixChat_useCompactLayout
  .mx_EventTile[data-layout="bubbles"]
  .mx_EventTile_content
  .markdown-body
  ul {
  margin-bottom: 4px;
}
.mx_EventTile_details {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: -webkit-fill-available;
  width: -moz-available;
  width: stretch;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  gap: 8px;
  justify-content: space-between;
  margin-left: var(--leftOffset);
}
.mx_EventTile_details .mx_EventTile_truncated {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media only screen and (max-width: 480px) {
  .mx_EventTile_content {
    margin-right: 0;
  }
}
.mx_EventTileBubble.mx_HistoryTile {
  margin: var(--EventTileBubble_margin-block) auto;
}
.mx_EventTileBubble.mx_HistoryTile:before {
  background-color: #91a1c0;
  -webkit-mask-image: url(../../img/element-icons/hide.72c451b.svg);
  mask-image: url(../../img/element-icons/hide.72c451b.svg);
}
:root {
  --irc-line-height: 1.125rem;
}
.mx_IRCLayout {
  --name-width: 80px;
  --icon-width: 14px;
  --line-height: var(--irc-line-height);
  --right-padding: 5px;
  line-height: 1.125rem !important;
  line-height: var(--line-height) !important;
}
.mx_IRCLayout blockquote {
  margin: 0;
}
.mx_IRCLayout .mx_NewRoomIntro > h2 {
  line-height: normal;
}
.mx_IRCLayout .mx_ReplyChain .mx_DisambiguatedProfile {
  background: transparent;
  width: auto;
  -webkit-box-ordinal-group: initial;
  -ms-flex-order: initial;
  order: 0;
  -ms-flex-negative: initial;
  flex-shrink: 1;
}
.mx_IRCLayout .mx_ReplyChain .mx_EventTile_emote > .mx_EventTile_avatar {
  margin-left: 0;
}
.mx_IRCLayout .mx_ReplyChain .mx_MessageTimestamp {
  width: auto;
}
.mx_IRCLayout .mx_ReplyChain .mx_EventTile_e2eIcon {
  position: relative;
  -webkit-box-ordinal-group: 0;
  -ms-flex-order: -1;
  order: -1;
}
.mx_IRCLayout .mx_ProfileResizer {
  --resizer-width: 15px;
  --resizer-a11y: 3px;
  cursor: col-resize;
  height: 100%;
  inset-inline-start: calc(
    46px + var(--icon-width) + var(--right-padding) + var(--name-width) +
      var(--right-padding)
  );
  inset-inline-start: calc(
    var(--RoomView_MessageList-padding) + var(--MessageTimestamp-width) +
      var(--icon-width) + var(--right-padding) + var(--name-width) +
      var(--right-padding) - var(--resizer-width) - var(--resizer-a11y)
  );
  position: absolute;
  width: 15px;
  width: var(--resizer-width);
  z-index: 100;
}
.mx_JumpToBottomButton {
  bottom: 12px;
  height: 50px;
  position: absolute;
  right: 24px;
  text-align: center;
  width: 38px;
  z-index: 1000;
}
.mx_JumpToBottomButton_badge {
  background-color: var(--cpd-color-icon-secondary);
  border-radius: 16px;
  color: var(--cpd-color-text-on-solid-primary);
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 0.875rem;
  padding: 0 4px;
  position: relative;
  text-align: center;
  top: -12px;
}
.mx_JumpToBottomButton_highlight .mx_JumpToBottomButton_badge {
  background-color: var(--cpd-color-icon-critical-primary);
}
.mx_JumpToBottomButton_scrollDown {
  background: var(--cpd-color-bg-canvas-default);
  border: 1.3px solid var(--cpd-color-icon-tertiary);
  border-radius: 19px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
  display: block;
  height: 38px;
  position: relative;
}
.mx_JumpToBottomButton_scrollDown:before {
  background: var(--cpd-color-icon-tertiary);
  content: "";
  inset: 0;
  -webkit-mask-image: url(../../img/element-icons/message/chevron-up.0f9ac6f.svg);
  mask-image: url(../../img/element-icons/message/chevron-up.0f9ac6f.svg);
  -webkit-mask-position: center 6px;
  mask-position: center 6px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  position: absolute;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
:root {
  --RoomHeader-indicator-dot-size: 8px;
  --RoomHeader-indicator-dot-offset: -3px;
  --RoomHeader-indicator-pulseColor: var(--cpd-color-text-critical-primary);
}
.mx_LegacyRoomHeader {
  -webkit-box-flex: 0;
  background-color: var(--cpd-color-bg-canvas-default);
  border-bottom: 1px solid transparent;
  -ms-flex: 0 0 50px;
  flex: 0 0 50px;
}
.mx_LegacyRoomHeader .mx_LegacyRoomHeader_icon {
  height: 12px;
  width: 12px;
}
.mx_LegacyRoomHeader .mx_LegacyRoomHeader_icon.mx_LegacyRoomHeader_icon_video {
  background-color: var(--cpd-color-text-secondary);
  height: 14px;
  -webkit-mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
  mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
  -webkit-mask-size: 100%;
  mask-size: 100%;
  width: 14px;
}
.mx_LegacyRoomHeader .mx_LegacyRoomHeader_icon.mx_E2EIcon {
  height: 100%;
  margin: 0;
  display: none;
}
.mx_LegacyRoomHeader .mx_CallDuration {
  font-size: 0.8125rem;
  margin-top: 0.0625rem;
}
.mx_LegacyRoomHeader_wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 44px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-bottom: 1px solid var(--cpd-color-alpha-gray-400);
  min-width: 0;
  padding: 10px 20px 9px 16px;
}
.mx_LegacyRoomHeader_wrapper .mx_InviteOnlyIcon_large {
  margin: 0;
}
.mx_LegacyRoomHeader_wrapper .mx_BetaCard_betaPill {
  margin-right: 8px;
}
.mx_LegacyRoomHeader_wrapper > span {
  height: 100%;
}
.mx_LegacyRoomHeader_name {
  -webkit-box-flex: 0;
  color: var(--cpd-color-text-primary);
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
  font: var(--cpd-font-heading-sm-semibold);
  font-weight: var(--cpd-font-weight-semibold);
  min-height: 24px;
  overflow: hidden;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 6px;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0 3px;
  padding: 1px 4px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.mx_LegacyRoomHeader_name:hover {
  background-color: var(--cpd-color-gray-400);
}
.mx_LegacyRoomHeader_name .mx_LegacyRoomHeader_nametext {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_LegacyRoomHeader_name .mx_LegacyRoomHeader_chevron {
  -ms-flex-item-align: center;
  align-self: center;
  background-color: var(--cpd-color-gray-800);
  height: 20px;
  -webkit-mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  width: 20px;
}
.mx_LegacyRoomHeader_name.mx_LegacyRoomHeader_name--textonly {
  cursor: inherit;
}
.mx_LegacyRoomHeader_name.mx_LegacyRoomHeader_name--textonly:hover {
  background-color: transparent;
  background-color: initial;
}
.mx_LegacyRoomHeader_name[aria-expanded="true"] {
  background-color: var(--cpd-color-alpha-gray-400);
}
.mx_LegacyRoomHeader_name[aria-expanded="true"] .mx_LegacyRoomHeader_chevron {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
.mx_LegacyRoomHeader_settingsHint {
  color: #a2a2a2 !important;
}
.mx_LegacyRoomHeader_searchStatus {
  font-weight: 400;
  opacity: 0.6;
}
.mx_RoomTopic {
  cursor: pointer;
  position: relative;
}
.mx_LegacyRoomHeader_topic {
  -webkit-box-flex: 1;
  color: var(--cpd-color-text-secondary);
  -ms-flex: 1;
  flex: 1;
  font: var(--cpd-font-body-sm-regular);
  line-height: 1rem;
  max-height: 2rem;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  display: -webkit-box;
}
.mx_LegacyRoomHeader_topic .mx_Emoji {
  font-size: inherit;
}
.mx_LegacyRoomHeader_avatar {
  -webkit-box-flex: 0;
  cursor: pointer;
  -ms-flex: 0;
  flex: 0;
  margin: 0 7px;
  position: relative;
}
.mx_LegacyRoomHeader_button {
  cursor: pointer;
  -webkit-box-flex: 0;
  border-radius: 100%;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  height: 32px;
  margin-left: 1px;
  margin-right: 1px;
  position: relative;
  width: 32px;
}
.mx_LegacyRoomHeader_button:before {
  background-color: green;
  content: "";
  height: 24px;
  left: 4px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 4px;
  width: 24px;
}
/* .mx_LegacyRoomHeader_button:hover {
  background: var(--cpd-color-bg-subtle-primary);
}
.mx_LegacyRoomHeader_button:hover:before {
  background-color: var(--cpd-color-icon-primary);
} */
.mx_LegacyRoomHeader_button_unreadIndicator_bg {
  background: var(--cpd-color-bg-canvas-default);
  border-radius: 50%;
  height: 8px;
  height: var(--RoomHeader-indicator-dot-size);
  -webkit-transform: scale(1.6);
  transform: scale(1.6);
  -webkit-transform-origin: center center;
  transform-origin: center center;
  width: 8px;
  width: var(--RoomHeader-indicator-dot-size);
}
.mx_LegacyRoomHeader_button_unreadIndicator,
.mx_LegacyRoomHeader_button_unreadIndicator_bg {
  margin: 4px;
  position: absolute;
  right: -3px;
  right: var(--RoomHeader-indicator-dot-offset);
  top: -3px;
  top: var(--RoomHeader-indicator-dot-offset);
}
.mx_LegacyRoomHeader_button_unreadIndicator.mx_Indicator_highlight {
  background: var(--cpd-color-icon-critical-primary);
  -webkit-box-shadow: var(--cpd-color-icon-critical-primary);
  box-shadow: var(--cpd-color-icon-critical-primary);
}
.mx_LegacyRoomHeader_button_unreadIndicator.mx_Indicator_notification {
  background: var(--cpd-color-icon-success-primary);
  -webkit-box-shadow: var(--cpd-color-icon-success-primary);
  box-shadow: var(--cpd-color-icon-success-primary);
}
.mx_LegacyRoomHeader_button_unreadIndicator.mx_Indicator_activity {
  background: var(--cpd-color-icon-primary);
  -webkit-box-shadow: var(--cpd-color-icon-primary);
  box-shadow: var(--cpd-color-icon-primary);
}
.mx_LegacyRoomHeader_button--unread:before {
  background-color: var(--cpd-color-icon-tertiary) !important;
}
.mx_LegacyRoomHeader_button--highlight:before {
  background-color: var(--cpd-color-icon-primary) !important;
}
.mx_LegacyRoomHeader_forgetButton:before {
  -webkit-mask-image: url(../../img/element-icons/leave.9cf503d.svg);
  mask-image: url(../../img/element-icons/leave.9cf503d.svg);
  width: 26px;
}
.mx_LegacyRoomHeader_appsButton:before {
  -webkit-mask-image: url(../../img/element-icons/room/apps.931b680.svg);
  mask-image: url(../../img/element-icons/room/apps.931b680.svg);
}
.mx_LegacyRoomHeader_appsButton_highlight:before {
  background-color: var(--cpd-color-text-action-accent);
}
.mx_LegacyRoomHeader_voiceCallButton:before {
  -webkit-mask-image: url(../../img/element-icons/call/voice-call.85002aa.svg);
  mask-image: url(../../img/element-icons/call/voice-call.85002aa.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  color:green
}
.mx_LegacyRoomHeader_videoCallButton:before {
  -webkit-mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
  mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
}
.mx_LegacyRoomHeader_freedomIcon:before,
.mx_LegacyRoomHeader_layoutButton--freedom:before {
  -webkit-mask-image: url(../../img/element-icons/call/freedom.3785dd5.svg);
  mask-image: url(../../img/element-icons/call/freedom.3785dd5.svg);
}
.mx_LegacyRoomHeader_layoutButton--spotlight:before,
.mx_LegacyRoomHeader_spotlightIcon:before {
  -webkit-mask-image: url(../../img/element-icons/call/spotlight.7864fc7.svg);
  mask-image: url(../../img/element-icons/call/spotlight.7864fc7.svg);
}
.mx_LegacyRoomHeader_closeButton:before {
  -webkit-mask-image: url(../../img/cancel.f8ee58c.svg);
  mask-image: url(../../img/cancel.f8ee58c.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 20px;
  mask-size: 20px;
}
.mx_LegacyRoomHeader_closeButton:hover {
  background: transparent none repeat 0 0 / auto auto padding-box border-box
    scroll;
  background: initial;
}
.mx_LegacyRoomHeader_closeButton:hover:before {
  background-color: var(--cpd-color-icon-tertiary);
}
.mx_LegacyRoomHeader_minimiseButton:before {
  -webkit-mask-image: url(../../img/element-icons/reduce.12b1369.svg);
  mask-image: url(../../img/element-icons/reduce.12b1369.svg);
}
.mx_LegacyRoomHeader_layoutMenu .mx_IconizedContextMenu_icon:before {
  background: var(--cpd-color-text-primary);
  content: "";
  display: block;
  height: 16px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  width: 16px;
}
@media only screen and (max-width: 480px) {
  .mx_LegacyRoomHeader_wrapper {
    margin: 0;
    padding: 0;
  }
  .mx_LegacyRoomHeader {
    overflow: hidden;
  }
}
.mx_LinkPreviewGroup .mx_LinkPreviewGroup_hide {
  cursor: pointer;
  height: 18px;
  width: 18px;
}
.mx_LinkPreviewGroup .mx_LinkPreviewGroup_hide img {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 40px;
  flex: 0 0 40px;
  visibility: hidden;
}
.mx_LinkPreviewGroup .mx_LinkPreviewGroup_hide:focus-visible:focus img,
.mx_LinkPreviewGroup:hover .mx_LinkPreviewGroup_hide img {
  visibility: visible;
}
.mx_LinkPreviewGroup > .mx_AccessibleButton {
  color: var(--cpd-color-text-action-accent);
  text-align: center;
}
.mx_LinkPreviewWidget {
  -webkit-column-gap: 4px;
  -moz-column-gap: 4px;
  column-gap: 4px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 16px 0 16px auto;
  -webkit-border-start: 2px solid var(--cpd-color-bg-subtle-primary);
  border-inline-start: 2px solid var(--cpd-color-bg-subtle-primary);
  border-radius: 2px;
  color: var(--cpd-color-gray-900);
}
.mx_MatrixChat_useCompactLayout .mx_LinkPreviewWidget {
  margin-bottom: 6px;
  margin-top: 6px;
}
.mx_LinkPreviewWidget .mx_LinkPreviewWidget_wrapImageCaption {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  row-gap: 8px;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_LinkPreviewWidget
  .mx_LinkPreviewWidget_wrapImageCaption
  .mx_LinkPreviewWidget_caption,
.mx_LinkPreviewWidget
  .mx_LinkPreviewWidget_wrapImageCaption
  .mx_LinkPreviewWidget_image {
  -webkit-margin-start: 16px;
  margin-inline-start: 16px;
  min-width: 0;
}
.mx_LinkPreviewWidget
  .mx_LinkPreviewWidget_wrapImageCaption
  .mx_LinkPreviewWidget_image {
  -webkit-box-flex: 0;
  cursor: pointer;
  -ms-flex: 0 0 100px;
  flex: 0 0 100px;
  text-align: center;
}
.mx_LinkPreviewWidget
  .mx_LinkPreviewWidget_wrapImageCaption
  .mx_LinkPreviewWidget_caption {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
}
.mx_LinkPreviewWidget
  .mx_LinkPreviewWidget_wrapImageCaption
  .mx_LinkPreviewWidget_description,
.mx_LinkPreviewWidget
  .mx_LinkPreviewWidget_wrapImageCaption
  .mx_LinkPreviewWidget_title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
}
.mx_LinkPreviewWidget
  .mx_LinkPreviewWidget_wrapImageCaption
  .mx_LinkPreviewWidget_title {
  font-weight: 700;
  -webkit-line-clamp: 2;
}
.mx_LinkPreviewWidget
  .mx_LinkPreviewWidget_wrapImageCaption
  .mx_LinkPreviewWidget_title
  .mx_LinkPreviewWidget_siteName {
  font-weight: 400;
}
.mx_LinkPreviewWidget
  .mx_LinkPreviewWidget_wrapImageCaption
  .mx_LinkPreviewWidget_description {
  margin-top: 8px;
  word-wrap: break-word;
  -webkit-line-clamp: 3;
}
.mx_LiveContentSummary {
  color: var(--cpd-color-text-secondary);
}
.mx_LiveContentSummary .mx_LiveContentSummary_text:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  display: inline-block;
  height: 16px;
  margin-right: 4px;
  -webkit-mask-size: 16px;
  mask-size: 16px;
  vertical-align: text-bottom;
  width: 16px;
}
.mx_LiveContentSummary
  .mx_LiveContentSummary_text.mx_LiveContentSummary_text_video:before {
  -webkit-mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
  mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
}
.mx_LiveContentSummary
  .mx_LiveContentSummary_text.mx_LiveContentSummary_text_active {
  color: var(--cpd-color-text-action-accent);
}
.mx_LiveContentSummary
  .mx_LiveContentSummary_text.mx_LiveContentSummary_text_active:before {
  background-color: var(--cpd-color-text-action-accent);
}
.mx_LiveContentSummary .mx_LiveContentSummary_participants:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  display: inline-block;
  height: 16px;
  margin-right: 2px;
  -webkit-mask-image: url(../../img/element-icons/group-members.d86d751.svg);
  mask-image: url(../../img/element-icons/group-members.d86d751.svg);
  -webkit-mask-size: 16px;
  mask-size: 16px;
  vertical-align: text-bottom;
  width: 16px;
}
.mx_MemberList {
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  min-height: 0;
}
.mx_MemberList .mx_Spinner {
  -webkit-box-flex: 1;
  -ms-flex: 1 0 auto;
  flex: 1 0 auto;
}
.mx_MemberList .mx_SearchBox {
  margin-bottom: 5px;
}
.mx_MemberList h2 {
  color: #3d3b39;
  font-size: 0.8125rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin-bottom: 4px;
  margin-top: 8px;
  padding-left: 3px;
  padding-right: 12px;
  text-transform: uppercase;
}
.mx_MemberList .mx_AutoHideScrollbar {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
}
.mx_MemberList_chevron {
  margin-top: -15px;
  position: absolute;
  right: 35px;
}
.mx_MemberList_border {
  overflow-y: auto;
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1;
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0px;
  flex: 1 1 0px;
}
.mx_MemberList_query {
  height: 16px;
}
.mx_MemberList_query[type="text"] {
  font-size: 0.75rem;
}
.mx_MemberList_wrapper {
  padding: 10px;
}
.mx_MemberList_invite {
  margin: 0 var(--cpd-space-2x);
  width: calc(100% - var(--cpd-space-4x));
}
.mx_MessageComposer_wrapper {
  border-top: 1px solid #E9E9E9;
  margin: auto;
  padding-left: 42px;
  padding-right: 16px;
  position: relative;
  vertical-align: middle;
}
.mx_MessageComposer_replaced_wrapper {
  margin-left: auto;
  margin-right: auto;
}
.mx_MessageComposer_replaced_valign {
  display: table-cell;
  height: 60px;
  vertical-align: middle;
}
.mx_MessageComposer_roomReplaced_icon {
  float: left;
  height: 31px;
  margin-right: 20px;
  margin-top: 5px;
  width: 31px;
}
.mx_MessageComposer_roomReplaced_header {
  font-weight: 700;
}
.mx_MessageComposer_autocomplete_wrapper {
  height: 0;
  position: relative;
}
.mx_MessageComposer_row {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  width: 100%;
}
.mx_MessageComposer_actions,
.mx_MessageComposer_row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_MessageComposer_actions {
  gap: 6px;
}
.mx_MessageComposer .mx_MessageComposer_avatar {
  left: 26px;
  position: absolute;
}
.mx_MessageComposer .mx_MessageComposer_avatar .mx_BaseAvatar {
  display: block;
}
.mx_MessageComposer_composecontrols {
  width: 100%;
}
.mx_MessageComposer_e2eIconWrapper {
  height: 12px;
}
.mx_MessageComposer_e2eIcon.mx_E2EIcon {
  height: 12px;
  left: 20px;
  margin-left: 3px;
  margin-right: 0;
  position: absolute;
  width: 12px;
  display: none;
}
.mx_MessageComposer_noperm_error {
  color: var(--cpd-color-gray-900);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-style: italic;
  height: 60px;
  width: 100%;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_MessageComposer_input_wrapper {
  cursor: text;
}
.mx_MessageComposer_input,
.mx_MessageComposer_input_wrapper {
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_MessageComposer_input {
  min-height: 60px;
  vertical-align: middle;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  font: var(--cpd-font-body-md-regular);
  margin-right: 6px;
}
.mx_MessageComposer_input pre {
  background-color: rgba(0, 0, 0, 0.04);
  border-radius: 3px;
  padding: 10px;
}
.mx_MessageComposer_input textarea {
  background-color: var(--cpd-color-bg-canvas-default);
  border: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  color: var(--cpd-color-text-primary);
  display: block;
  font: var(--cpd-font-body-md-regular);
  margin-bottom: 6px;
  margin-top: 6px;
  max-height: 120px;
  outline: none;
  overflow: auto;
  padding: 0;
  resize: none;
  width: 100%;
}
.mx_MessageComposer_input textarea::-moz-placeholder {
  color: var(--cpd-color-text-action-accent);
  line-height: 100%;
  opacity: 1;
}
.mx_MessageComposer_input textarea::-webkit-input-placeholder {
  color: var(--cpd-color-text-action-accent);
}
.mx_MessageComposer_editor {
  max-height: 120px;
  min-height: 19px;
  overflow-x: hidden;
  overflow-y: auto;
  width: 100%;
  word-break: break-word;
}
.mx_MessageComposer_editor > :first-child {
  margin-top: 0 !important;
}
.mx_MessageComposer_editor > :last-child {
  margin-bottom: 0 !important;
}
.mx_MessageComposer_input_error {
  -webkit-animation: visualbell 0.2s;
  animation: visualbell 0.2s;
}
.mx_MessageComposer_button_highlight {
  background: green;
}
.mx_MessageComposer_button_highlight:before {
  background-color: green !important;
}
.mx_MessageComposer_button {
  --size: 26px;
  border-radius: 50%;
  cursor: pointer;
  height: 26px;
  height: var(--size);
  line-height: 26px;
  line-height: var(--size);
  padding-left: 26px;
  padding-left: var(--size);
  position: relative;
  width: auto;
}
.mx_MessageComposer_button:before {
  background-color: green;
  content: "";
  height: 20px;
  left: 3px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 3px;
  width: 20px;
  z-index: 2;
}
.mx_MessageComposer_button:after {
  border-radius: 50%;
  content: "";
  height: var(--size);
  left: 0;
  position: absolute;
  top: 0;
  width: var(--size);
  z-index: 0;
}
/* .mx_MessageComposer_button:hover:after {
  background: var(--cpd-color-bg-subtle-primary);
}
.mx_MessageComposer_button:hover:before {
  background-color: var(--cpd-color-icon-primary);
} */
.mx_MessageComposer_button:last-child {
  margin-right: auto;
}
.mx_MessageComposer_button.mx_MessageComposer_closeButtonMenu:after {
  background: var(--cpd-color-bg-subtle-primary);
}
.mx_MessageComposer_button.mx_MessageComposer_closeButtonMenu:before {
  background-color: var(--cpd-color-icon-primary);
  z-index: 2;
}
.mx_MessageComposer_button.mx_MessageComposer_hangup:not(
    .mx_AccessibleButton_disabled
  ):before {
  background-color: var(--cpd-color-text-critical-primary);
}
.mx_MessageComposer_wysiwyg .mx_MessageComposer_wrapper {
  margin-bottom: 12px;
  margin-top: 6px;
  padding-left: 16px;
}
.mx_MessageComposer_wysiwyg .mx_MessageComposer_row {
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
}
.mx_MessageComposer_wysiwyg .mx_MessageComposer_actions {
  height: 40px;
}
.mx_MessageComposer_wysiwyg .mx_MediaBody {
  padding-bottom: 4px;
  padding-top: 4px;
}
.mx_MessageComposer_wysiwyg .mx_MessageComposer_button {
  --size: 26px;
  border-radius: 5px;
  cursor: pointer;
  height: 26px;
  height: var(--size);
  line-height: 26px;
  line-height: var(--size);
  padding-left: 26px;
  padding-left: var(--size);
  position: relative;
  width: auto;
}
.mx_MessageComposer_wysiwyg .mx_MessageComposer_button:before {
  background-color: var(--cpd-color-icon-tertiary);
  content: "";
  height: 20px;
  left: 3px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 3px;
  width: 20px;
  z-index: 2;
}
.mx_MessageComposer_wysiwyg .mx_MessageComposer_button:after {
  border-radius: 5px;
  content: "";
  height: var(--size);
  left: 0;
  position: absolute;
  top: 0;
  width: var(--size);
  z-index: 0;
}
.mx_MessageComposer_wysiwyg .mx_MessageComposer_button:hover:after {
  background: var(--cpd-color-bg-subtle-secondary);
}
.mx_MessageComposer_wysiwyg .mx_MessageComposer_button:hover:before {
  background-color: var(--cpd-color-gray-800);
}
.mx_MessageComposer_wysiwyg
  .mx_MessageComposer_button.mx_MessageComposer_closeButtonMenu:after {
  background: var(--cpd-color-green-300);
}
.mx_MessageComposer_wysiwyg
  .mx_MessageComposer_button.mx_MessageComposer_closeButtonMenu:before {
  background-color: var(--cpd-color-text-action-accent);
  z-index: 2;
}
.mx_MessageComposer_wysiwyg
  .mx_MessageComposer_button.mx_MessageComposer_hangup:not(
    .mx_AccessibleButton_disabled
  ):before {
  background-color: var(--cpd-color-text-critical-primary);
}
.mx_MessageComposer_upload:before {
  -webkit-mask-image: url(../../img/element-icons/room/composer/attach.7eed7d0.svg);
  mask-image: url(../../img/element-icons/room/composer/attach.7eed7d0.svg);
}
.mx_MessageComposer_poll:before {
  -webkit-mask-image: url(../../img/element-icons/room/composer/poll.a8ee2f3.svg);
  mask-image: url(../../img/element-icons/room/composer/poll.a8ee2f3.svg);
}
.mx_MessageComposer_voiceMessage:before {
  -webkit-mask-image: url(../../img/element-icons/mic.cf0a544.svg);
  mask-image: url(../../img/element-icons/mic.cf0a544.svg);
}
.mx_MessageComposer_voiceBroadcast:before {
  -webkit-mask-image: url(../../img/element-icons/live.3af3890.svg);
  mask-image: url(../../img/element-icons/live.3af3890.svg);
}
.mx_MessageComposer_plain_text:before {
  -webkit-mask-image: url(../../img/element-icons/room/composer/plain_text.ad262e9.svg);
  mask-image: url(../../img/element-icons/room/composer/plain_text.ad262e9.svg);
}
.mx_MessageComposer_rich_text:before {
  -webkit-mask-image: url(../../img/element-icons/room/composer/rich_text.a74f6cc.svg);
  mask-image: url(../../img/element-icons/room/composer/rich_text.a74f6cc.svg);
}
.mx_MessageComposer_location:before {
  -webkit-mask-image: url(../../img/element-icons/room/composer/location.d0dc71f.svg);
  mask-image: url(../../img/element-icons/room/composer/location.d0dc71f.svg);
}
.mx_MessageComposer_stickers:before {
  -webkit-mask-image: url(../../img/element-icons/room/composer/sticker.6a92ae6.svg);
  mask-image: url(../../img/element-icons/room/composer/sticker.6a92ae6.svg);
}
.mx_MessageComposer_buttonMenu:before {
  -webkit-mask-image: url(../../img/image-view/more.6adb72c.svg);
  mask-image: url(../../img/image-view/more.6adb72c.svg);
}
.mx_MessageComposer_sendMessage {
  background-color: var(--cpd-color-icon-accent-tertiary);
  border-radius: 100%;
  cursor: pointer;
  height: 32px;
  position: relative;
  width: 32px;
}
.mx_MessageComposer_sendMessage:before {
  background-color: var(--cpd-color-icon-on-solid-primary);
  content: "";
  height: 16px;
  left: 9px;
  -webkit-mask-image: url(../../img/element-icons/send-message.4b52f53.svg);
  mask-image: url(../../img/element-icons/send-message.4b52f53.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 8px;
  width: 16px;
}
.mx_MatrixChat_useCompactLayout .mx_MessageComposer_input {
  min-height: 50px;
}
.mx_MatrixChat_useCompactLayout .mx_MessageComposer_noperm_error {
  height: 50px;
}
.mx_MessageComposer.mx_MessageComposer--compact {
  margin-right: 0;
}
.mx_MessageComposer.mx_MessageComposer--compact .mx_MessageComposer_wrapper {
  padding: 0 0 0 25px;
}
.mx_MessageComposer.mx_MessageComposer--compact:not(
    .mx_MessageComposer_e2eStatus
  )
  .mx_MessageComposer_wrapper {
  padding: 0;
}
.mx_MessageComposer.mx_MessageComposer--compact
  .mx_MessageComposer_button:last-child {
  margin-right: 0;
}
.mx_MessageComposer.mx_MessageComposer--compact .mx_MessageComposer_e2eIcon {
  left: 0;
}
.mx_MessageComposerFormatBar {
  background-color: var(--cpd-color-bg-canvas-default);
  border: var(--cpd-border-width-1) solid var(--cpd-color-border-disabled);
  border-radius: 8px;
  cursor: pointer;
  display: none;
  height: 32px;
  position: absolute;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 192px;
  z-index: 1000;
}
.mx_MessageComposerFormatBar.mx_MessageComposerFormatBar_shown {
  display: block;
}
.mx_MessageComposerFormatBar > * {
  display: inline-block;
  margin: 2px;
  position: relative;
  white-space: nowrap;
}
.mx_MessageComposerFormatBar .mx_MessageComposerFormatBar_button {
  background: none;
  border: none;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 28px;
  vertical-align: middle;
  width: 28px;
}
.mx_MessageComposerFormatBar .mx_MessageComposerFormatBar_button:hover {
  background: var(--cpd-color-bg-subtle-secondary);
  border-radius: 6px;
  z-index: 1;
}
.mx_MessageComposerFormatBar .mx_MessageComposerFormatBar_button:after {
  background-color: var(--cpd-color-icon-secondary);
  content: "";
  height: 100%;
  left: 0;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  position: absolute;
  top: 0;
  width: 100%;
}
.mx_MessageComposerFormatBar .mx_MessageComposerFormatBar_button:hover:after {
  background-color: var(--cpd-color-icon-primary);
}
.mx_MessageComposerFormatBar .mx_MessageComposerFormatBar_buttonIconBold:after {
  -webkit-mask-image: url(../../img/element-icons/room/format-bar/bold.78873b8.svg);
  mask-image: url(../../img/element-icons/room/format-bar/bold.78873b8.svg);
}
.mx_MessageComposerFormatBar
  .mx_MessageComposerFormatBar_buttonIconItalic:after {
  -webkit-mask-image: url(../../img/element-icons/room/format-bar/italic.bc981b2.svg);
  mask-image: url(../../img/element-icons/room/format-bar/italic.bc981b2.svg);
}
.mx_MessageComposerFormatBar
  .mx_MessageComposerFormatBar_buttonIconStrikethrough:after {
  -webkit-mask-image: url(../../img/element-icons/room/format-bar/strikethrough.2c63d5c.svg);
  mask-image: url(../../img/element-icons/room/format-bar/strikethrough.2c63d5c.svg);
}
.mx_MessageComposerFormatBar
  .mx_MessageComposerFormatBar_buttonIconQuote:after {
  -webkit-mask-image: url(../../img/element-icons/room/format-bar/quote.72d307f.svg);
  mask-image: url(../../img/element-icons/room/format-bar/quote.72d307f.svg);
}
.mx_MessageComposerFormatBar .mx_MessageComposerFormatBar_buttonIconCode:after {
  -webkit-mask-image: url(../../img/element-icons/room/format-bar/code.14db777.svg);
  mask-image: url(../../img/element-icons/room/format-bar/code.14db777.svg);
}
.mx_MessageComposerFormatBar
  .mx_MessageComposerFormatBar_buttonIconInsertLink:after {
  -webkit-mask-image: url(../../img/element-icons/link.e24e5a8.svg);
  mask-image: url(../../img/element-icons/link.e24e5a8.svg);
  -webkit-mask-size: 18px;
  mask-size: 18px;
}
.mx_MessageComposerFormatBar_buttonTooltip {
  font-size: 0.8125rem;
  font-weight: var(--cpd-font-weight-semibold);
  min-width: 54px;
  text-align: center;
  white-space: nowrap;
}
.mx_NewRoomIntro {
  margin: 40px 0 48px 64px;
}
.mx_NewRoomIntro
  .mx_MiniAvatarUploader_hasAvatar:not(.mx_MiniAvatarUploader_busy):not(:hover)
  .mx_MiniAvatarUploader_indicator {
  display: none;
}
.mx_NewRoomIntro .mx_NewRoomIntro_buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: wrap;
  flex-flow: wrap;
  gap: 14px 12px;
  margin-top: 28px;
}
.mx_NewRoomIntro .mx_NewRoomIntro_buttons .mx_AccessibleButton {
  display: inline-block;
  line-height: 1.5rem;
}
.mx_NewRoomIntro
  .mx_NewRoomIntro_buttons
  .mx_AccessibleButton:not(.mx_AccessibleButton_kind_primary_outline):before {
  background-color: var(--cpd-color-bg-canvas-default);
  content: "";
  display: inline-block;
  height: 20px;
  margin-right: 5px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  vertical-align: text-bottom;
  width: 20px;
}
.mx_NewRoomIntro .mx_NewRoomIntro_buttons .mx_NewRoomIntro_inviteButton:before {
  -webkit-mask-image: url(../../img/element-icons/room/invite.440bc20.svg);
  mask-image: url(../../img/element-icons/room/invite.440bc20.svg);
}
.mx_NewRoomIntro > h2 {
  font-size: 0.9rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin-top: 24px;
}
.mx_NewRoomIntro > p {
  color: var(--cpd-color-text-secondary);
  font-size: 0.7rem;
  margin: 0;
}
.mx_NotificationBadge:not(.mx_NotificationBadge_visible) {
  display: none;
}
.mx_NotificationBadge.mx_NotificationBadge_visible {
  background-color: var(--cpd-color-icon-secondary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_NotificationBadge.mx_NotificationBadge_visible.mx_NotificationBadge_dot {
  background-color: var(--cpd-color-icon-primary);
  border-radius: 8px;
  height: 8px;
  width: 8px;
}
.mx_NotificationBadge.mx_NotificationBadge_visible.mx_NotificationBadge_dot
  .mx_NotificationBadge_count {
  display: none;
}
.mx_NotificationBadge.mx_NotificationBadge_visible.mx_NotificationBadge_dot.mx_NotificationBadge_level_notification {
  background-color: var(--cpd-color-icon-success-primary);
}
.mx_NotificationBadge.mx_NotificationBadge_visible.mx_NotificationBadge_level_highlight {
  background-color: var(--cpd-color-icon-critical-primary);
}
.mx_NotificationBadge.mx_NotificationBadge_visible.mx_NotificationBadge_knocked {
  height: 16px;
  -webkit-mask-image: url(../../img/element-icons/ask-to-join.a351162.svg);
  mask-image: url(../../img/element-icons/ask-to-join.a351162.svg);
  width: 12px;
}
.mx_NotificationBadge.mx_NotificationBadge_visible.mx_NotificationBadge_2char {
  border-radius: 1rem;
  height: 1rem;
  width: 1rem;
}
.mx_NotificationBadge.mx_NotificationBadge_visible.mx_NotificationBadge_3char {
  border-radius: 1rem;
  height: 1rem;
  width: 1.625rem;
}
.mx_NotificationBadge.mx_NotificationBadge_visible .mx_NotificationBadge_count {
  color: var(--cpd-color-text-on-solid-primary);
  font-size: 0.625rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 0.875rem;
}
.mx_PinnedEventTile {
  display: grid;
  grid-template-areas: "avatar name remove" "content content content" "footer footer footer";
  grid-template-columns: 24px auto 24px;
  grid-template-rows: -webkit-max-content auto -webkit-max-content;
  grid-template-rows: max-content auto max-content;
  min-height: 40px;
  padding: 0 4px 12px;
  width: 100%;
  grid-row-gap: 12px;
  grid-column-gap: 8px;
}
.mx_PinnedEventTile + .mx_PinnedEventTile {
  border-top: 1px solid #e7e7e7;
  padding: 12px 4px;
}
.mx_PinnedEventTile .mx_PinnedEventTile_footer,
.mx_PinnedEventTile .mx_PinnedEventTile_message,
.mx_PinnedEventTile .mx_PinnedEventTile_sender,
.mx_PinnedEventTile .mx_PinnedEventTile_senderAvatar,
.mx_PinnedEventTile .mx_PinnedEventTile_unpinButton {
  min-width: 0;
}
.mx_PinnedEventTile .mx_PinnedEventTile_senderAvatar {
  grid-area: avatar;
}
.mx_PinnedEventTile .mx_PinnedEventTile_sender {
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
  grid-area: name;
  line-height: 1.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_PinnedEventTile .mx_PinnedEventTile_unpinButton {
  border-radius: 8px;
  grid-area: remove;
  height: 24px;
  position: relative;
  visibility: hidden;
  width: 24px;
}
.mx_PinnedEventTile .mx_PinnedEventTile_unpinButton:hover {
  background-color: rgba(92, 100, 112, 0.2);
}
.mx_PinnedEventTile .mx_PinnedEventTile_unpinButton:before {
  background: var(--cpd-color-text-secondary);
  content: "";
  height: inherit;
  -webkit-mask-image: url(../../img/image-view/close.c2af4a8.svg);
  mask-image: url(../../img/image-view/close.c2af4a8.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 8px;
  mask-size: 8px;
  position: absolute;
  width: inherit;
}
.mx_PinnedEventTile .mx_PinnedEventTile_message {
  grid-area: content;
}
.mx_PinnedEventTile .mx_PinnedEventTile_footer {
  font-size: 0.625rem;
  grid-area: footer;
  line-height: 12px;
}
.mx_PinnedEventTile .mx_PinnedEventTile_footer .mx_PinnedEventTile_timestamp {
  color: var(--cpd-color-text-secondary);
  display: inline;
  display: initial;
  width: auto;
}
.mx_PinnedEventTile .mx_PinnedEventTile_footer .mx_AccessibleButton_kind_link {
  margin-left: 12px;
}
.mx_PinnedEventTile:hover .mx_PinnedEventTile_unpinButton {
  visibility: visible;
}
.mx_PresenceLabel {
  font-size: 0.6875rem;
  opacity: 0.5;
}
.mx_ReadReceiptGroup {
  --ReadReceiptGroup_EventBubbleTile-spacing-end: 78px;
  display: inline-block;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  z-index: 1;
}
.mx_ReadReceiptGroup .mx_ReadReceiptGroup_button {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  border-radius: 6px;
  -ms-flex-direction: row;
  flex-direction: row;
  height: 16px;
  padding: 4px;
}
.mx_ReadReceiptGroup .mx_ReadReceiptGroup_button.mx_AccessibleButton:hover {
  background: var(--cpd-color-bg-subtle-secondary);
}
.mx_ReadReceiptGroup .mx_ReadReceiptGroup_remainder {
  color: var(--cpd-color-text-secondary);
  font-size: 0.6875rem;
  line-height: 1rem;
  margin-right: 4px;
}
.mx_ReadReceiptGroup .mx_ReadReceiptGroup_container {
  display: block;
  height: 100%;
  position: relative;
}
.mx_ReadReceiptGroup .mx_ReadReceiptGroup_container .mx_BaseAvatar {
  border: 1px solid var(--cpd-color-bg-canvas-default);
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  height: 14px;
  position: absolute;
  -webkit-transition: left 0.1s ease-out, top 0.3s ease-out;
  transition: left 0.1s ease-out, top 0.3s ease-out;
  -webkit-transition: left var(--transition-short) ease-out,
    top var(--transition-standard) ease-out;
  transition: left var(--transition-short) ease-out,
    top var(--transition-standard) ease-out;
  width: 14px;
  will-change: left, top;
}
.mx_ReadReceiptGroup_popup {
  border-radius: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  max-height: 300px;
  width: 220px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  font-size: 12px;
  line-height: 15px;
  right: 0;
  text-align: left;
}
.mx_ReadReceiptGroup_popup.mx_ContextualMenu_top {
  top: 8px;
}
.mx_ReadReceiptGroup_popup.mx_ContextualMenu_bottom {
  bottom: 8px;
}
.mx_ReadReceiptGroup_popup .mx_ReadReceiptGroup_title {
  font-size: 12px;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 15px;
  margin: 16px 16px 8px;
  outline: none;
}
.mx_ReadReceiptGroup_popup .mx_AutoHideScrollbar .mx_ReadReceiptGroup_person {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  border-radius: 8px;
  -ms-flex-direction: row;
  flex-direction: row;
  margin: 0 12px;
  padding: 4px;
}
.mx_ReadReceiptGroup_popup
  .mx_AutoHideScrollbar
  .mx_ReadReceiptGroup_person:hover {
  background: #f5f8fa;
}
.mx_ReadReceiptGroup_popup
  .mx_AutoHideScrollbar
  .mx_ReadReceiptGroup_person:last-child {
  margin-bottom: 8px;
}
.mx_ReadReceiptGroup_popup
  .mx_AutoHideScrollbar
  .mx_ReadReceiptGroup_person
  .mx_BaseAvatar {
  margin: 6px 8px;
  -ms-flex-item-align: center;
  align-self: center;
  justify-self: center;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_ReadReceiptGroup_popup
  .mx_AutoHideScrollbar
  .mx_ReadReceiptGroup_person
  .mx_ReadReceiptGroup_name {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -ms-flex-negative: 1;
  flex-shrink: 1;
  overflow: hidden;
}
.mx_ReadReceiptGroup_popup
  .mx_AutoHideScrollbar
  .mx_ReadReceiptGroup_person
  .mx_ReadReceiptGroup_name
  p {
  margin: 2px 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_ReadReceiptGroup_popup
  .mx_AutoHideScrollbar
  .mx_ReadReceiptGroup_person
  .mx_ReadReceiptGroup_name
  .mx_ReadReceiptGroup_secondary {
  color: var(--cpd-color-text-secondary);
}
.mx_ReadReceiptGroup_person--tooltip {
  overflow-y: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_ReplyPreview {
  background: var(--cpd-color-bg-canvas-default);
  border: 1px solid transparent;
  border-bottom: none;
  max-height: 50vh;
  overflow: auto;
}
.mx_ReplyPreview .mx_ReplyPreview_section {
  border-bottom: 1px solid transparent;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-flow: column;
  flex-flow: column;
  padding: 8px 8px 0 0;
  row-gap: 8px;
}
.mx_ReplyPreview .mx_ReplyPreview_section .mx_ReplyPreview_header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  color: var(--cpd-color-text-primary);
  -webkit-column-gap: 8px;
  -moz-column-gap: 8px;
  column-gap: 8px;
  font-weight: 400;
  justify-content: space-between;
  opacity: 0.4;
}
.mx_ReplyPreview
  .mx_ReplyPreview_section
  .mx_ReplyPreview_header
  .mx_ReplyPreview_header_cancel {
  background-color: var(--cpd-color-text-primary);
  height: 18px;
  -webkit-mask: url(../../img/cancel.f8ee58c.svg);
  mask: url(../../img/cancel.f8ee58c.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 18px;
  mask-size: 18px;
  min-height: 18px;
  min-width: 18px;
  width: 18px;
}
.mx_RoomView_body .mx_ReplyPreview {
  border-radius: 8px 8px 0 0;
  -webkit-box-shadow: 0 -16px 32px rgba(0, 0, 0, 0.04);
  box-shadow: 0 -16px 32px rgba(0, 0, 0, 0.04);
}
.mx_ReplyTile {
  font: var(--cpd-font-body-md-regular);
  padding: 2px 0;
  position: relative;
}
.mx_ReplyTile.mx_ReplyTile_audio .mx_MFileBody_info_icon:before {
  -webkit-mask-image: url(../../img/element-icons/speaker.65cebab.svg);
  mask-image: url(../../img/element-icons/speaker.65cebab.svg);
}
.mx_ReplyTile.mx_ReplyTile_video .mx_MFileBody_info_icon:before {
  -webkit-mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
  mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
}
.mx_ReplyTile > a {
  color: var(--cpd-color-text-secondary);
  display: grid;
  grid-template: "sender" auto "message" auto/100%;
  text-decoration: none;
  -webkit-transition: color 0.15s ease;
  transition: color 0.15s ease;
  grid-gap: 2px;
  gap: 2px;
  max-width: 100%;
}
.mx_ReplyTile > a:hover {
  color: var(--cpd-color-text-primary);
}
.mx_ReplyTile .mx_RedactedBody {
  line-height: 1.125rem;
}
.mx_ReplyTile .mx_HiddenBody,
.mx_ReplyTile .mx_RedactedBody {
  padding: 4px 0 2px 20px;
}
.mx_ReplyTile .mx_HiddenBody:before,
.mx_ReplyTile .mx_RedactedBody:before {
  height: 13px;
  top: 3px;
  width: 13px;
}
.mx_ReplyTile .mx_EventTile_content {
  display: -webkit-box;
  grid-area: message;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.mx_ReplyTile .mx_EventTile_content .mx_EventTile_body.mx_EventTile_bigEmoji {
  font-size: 0.875rem !important;
  line-height: 1.375rem !important;
}
.mx_ReplyTile .mx_EventTile_content .mx_EventTile_edited,
.mx_ReplyTile .mx_EventTile_content .mx_EventTile_lineNumbers {
  display: none;
}
.mx_ReplyTile .mx_EventTile_content .mx_EventTile_pre_container > pre {
  display: -webkit-box;
  overflow-x: scroll;
  overflow-y: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  padding: 4px;
}
.mx_ReplyTile .mx_EventTile_content .markdown-body blockquote,
.mx_ReplyTile .mx_EventTile_content .markdown-body dl,
.mx_ReplyTile .mx_EventTile_content .markdown-body ol,
.mx_ReplyTile .mx_EventTile_content .markdown-body p,
.mx_ReplyTile .mx_EventTile_content .markdown-body pre,
.mx_ReplyTile .mx_EventTile_content .markdown-body table,
.mx_ReplyTile .mx_EventTile_content .markdown-body ul {
  margin-bottom: 4px;
}
.mx_ReplyTile.mx_ReplyTile_info {
  padding-top: 0;
}
.mx_ReplyTile.mx_ReplyTile_inline > a {
  gap: 4px;
  grid-template: "sender        message" auto/-webkit-max-content auto;
  grid-template: "sender        message" auto/max-content auto;
}
.mx_ReplyTile .mx_ReplyTile_sender {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  grid-area: sender;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
}
.mx_ReplyTile .mx_ReplyTile_sender .mx_DisambiguatedProfile {
  display: inline-block;
  font: var(--cpd-font-body-md-regular);
  margin: 0;
  overflow: hidden;
  padding: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_ReplyTile .mx_ReplyTile_sender .mx_BaseAvatar {
  line-height: 14px;
}
.mx_RoomBreadcrumbs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  margin-bottom: 12px;
}
.mx_RoomBreadcrumbs .mx_RoomBreadcrumbs_crumb {
  margin-right: 8px;
  width: 32px;
}
.mx_RoomBreadcrumbs.mx_RoomBreadcrumbs-enter {
  -webkit-transform: translateX(-40px);
  transform: translateX(-40px);
}
.mx_RoomBreadcrumbs.mx_RoomBreadcrumbs-enter-active {
  -webkit-transform: translateX(0);
  transform: translateX(0);
  -webkit-transition: -webkit-transform 0.64s cubic-bezier(0.66, 0.02, 0.36, 1);
  transition: -webkit-transform 0.64s cubic-bezier(0.66, 0.02, 0.36, 1);
  transition: transform 0.64s cubic-bezier(0.66, 0.02, 0.36, 1);
  transition: transform 0.64s cubic-bezier(0.66, 0.02, 0.36, 1),
    -webkit-transform 0.64s cubic-bezier(0.66, 0.02, 0.36, 1);
}
.mx_RoomBreadcrumbs .mx_RoomBreadcrumbs_placeholder {
  font: var(--cpd-font-body-md-semibold);
  height: 32px;
  line-height: 32px;
}
.mx_RoomCallBanner {
  width: 100%;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-align: center;
  background-color: var(--cpd-color-bg-subtle-primary);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: var(--cpd-color-text-primary);
  cursor: pointer;
  padding: 12px 16px;
}
.mx_RoomCallBanner,
.mx_RoomCallBanner_text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
}
.mx_RoomCallBanner_text {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -ms-flex-align: center;
}
.mx_RoomCallBanner_label {
  color: var(--cpd-color-text-primary);
  font-weight: var(--cpd-font-weight-semibold);
  padding-right: 8px;
}
.mx_RoomCallBanner_label:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  display: inline-block;
  -webkit-mask-size: 16px;
  mask-size: 16px;
  vertical-align: middle;
  mask-position-y: center;
  height: 1.2em;
  margin-right: 8px;
  -webkit-mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
  mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
  width: 16px;
}
.mx_RoomHeader {
  background-color: var(--cpd-color-bg-canvas-default);
  border-bottom: 1px solid var(--cpd-color-alpha-gray-400);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 64px;
  padding: 0 var(--cpd-space-3x);
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.mx_RoomHeader:hover {
  background-color: var(--cpd-color-gray-200);
}
.mx_RoomHeader_infoWrapper {
  background: transparent none repeat 0 0 / auto auto padding-box border-box
    scroll;
  background: initial;
  border: initial;
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  cursor: pointer;
  gap: var(--cpd-space-3x);
  justify-content: flex-start;
  text-align: left;
}
.mx_RoomHeader_info {
  padding-right: var(--cpd-space-13x);
}
.mx_RoomHeader_truncated {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
}
.mx_RoomHeader_heading {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: var(--cpd-space-1x);
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_RoomHeader_topic {
  height: 0;
  opacity: 0;
  -webkit-transition: all 0.3s ease 0.1s;
  transition: all 0.3s ease 0.1s;
  -webkit-transition: all var(--transition-standard) ease 0.1s;
  transition: all var(--transition-standard) ease 0.1s;
}
.mx_RoomHeader_topic .mx_Emoji {
  font-size: inherit;
}
.mx_RoomHeader:hover .mx_RoomHeader_topic {
  height: 1.21875rem;
  opacity: 1;
}
.mx_RoomHeader:hover .mx_RoomHeader_topic a:hover {
  text-decoration: underline;
}
.mx_RoomHeader_icon {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_RoomHeader .mx_FacePile {
  background: var(--cpd-color-bg-canvas-default);
  color: var(--cpd-color-text-secondary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 9999px;
  cursor: pointer;
  gap: var(--cpd-space-2x);
  padding: var(--cpd-space-1-5x);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.mx_RoomHeader .mx_FacePile > div {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_RoomHeader .mx_FacePile:hover {
  background: var(--cpd-color-bg-subtle-primary);
  color: var(--cpd-color-text-primary);
}
.mx_RoomHeader .mx_BaseAvatar {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_RoomInfoLine {
  color: var(--cpd-color-text-secondary);
  display: inline-block;
}
.mx_RoomInfoLine:before {
  content: "";
  display: inline-block;
  height: 1.2em;
  mask-position-y: center;
  background-color: var(--cpd-color-gray-800);
  margin-right: 6px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  vertical-align: text-bottom;
}
.mx_RoomInfoLine.mx_RoomInfoLine_public:before {
  -webkit-mask-image: url(../../img/globe.0408a7a.svg);
  mask-image: url(../../img/globe.0408a7a.svg);
  -webkit-mask-size: 12px;
  mask-size: 12px;
  width: 12px;
}
.mx_RoomInfoLine.mx_RoomInfoLine_private:before {
  -webkit-mask-image: url(../../img/element-icons/lock.998ae1f.svg);
  mask-image: url(../../img/element-icons/lock.998ae1f.svg);
  -webkit-mask-size: 10px;
  mask-size: 10px;
  width: 10px;
}
.mx_RoomInfoLine.mx_RoomInfoLine_video:before {
  -webkit-mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
  mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
  -webkit-mask-size: 16px;
  mask-size: 16px;
  width: 16px;
}
.mx_RoomInfoLine .mx_RoomInfoLine_members {
  color: inherit;
  font-weight: inherit;
  text-decoration: inherit;
}
.mx_RoomInfoLine .mx_RoomInfoLine_members:before {
  content: "·";
  margin: 0 6px;
}
.mx_RoomKnocksBar {
  background-color: var(--cpd-color-bg-subtle-secondary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: var(--cpd-space-2x) var(--cpd-space-4x);
}
.mx_RoomKnocksBar_content {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  margin: 0 var(--cpd-space-3x);
}
.mx_RoomKnocksBar_paragraph {
  color: var(--cpd-color-text-secondary);
  font-size: var(--cpd-font-size-body-sm);
  margin: 0;
}
.mx_RoomKnocksBar_link {
  margin-left: var(--cpd-space-3x);
}
.mx_RoomKnocksBar_action,
.mx_RoomKnocksBar_avatar {
  -ms-flex-item-align: center;
  align-self: center;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_RoomKnocksBar_action + .mx_RoomKnocksBar_action {
  margin-left: var(--cpd-space-3x);
}
.mx_RoomKnocksBar_avatar + .mx_RoomKnocksBar_avatar {
  margin-left: calc(var(--cpd-space-4x) * -1);
}
.mx_RoomList {
  padding-right: 7px;
}
.mx_RoomList_iconPlus:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/plus-circle.4fbd7e8.svg);
  mask-image: url(../../img/element-icons/roomlist/plus-circle.4fbd7e8.svg);
}
.mx_RoomList_iconNewRoom:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/hash-plus.0f56725.svg);
  mask-image: url(../../img/element-icons/roomlist/hash-plus.0f56725.svg);
}
.mx_RoomList_iconNewVideoRoom:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/hash-video.0d44220.svg);
  mask-image: url(../../img/element-icons/roomlist/hash-video.0d44220.svg);
}
.mx_RoomList_iconAddExistingRoom:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/hash.9de9cf7.svg);
  mask-image: url(../../img/element-icons/roomlist/hash.9de9cf7.svg);
}
.mx_RoomList_iconExplore:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/hash-search.53e3a04.svg);
  mask-image: url(../../img/element-icons/roomlist/hash-search.53e3a04.svg);
}
.mx_RoomList_iconDialpad:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/dialpad.024cc1d.svg);
  mask-image: url(../../img/element-icons/roomlist/dialpad.024cc1d.svg);
}
.mx_RoomList_iconStartChat:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/member-plus.705de31.svg);
  mask-image: url(../../img/element-icons/roomlist/member-plus.705de31.svg);
}
.mx_RoomList_iconInvite:before {
  -webkit-mask-image: url(../../img/element-icons/room/share.6a6396f.svg);
  mask-image: url(../../img/element-icons/room/share.6a6396f.svg);
}
.mx_RoomListHeader {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_RoomListHeader .mx_RoomListHeader_contextLessTitle,
.mx_RoomListHeader .mx_RoomListHeader_contextMenuButton {
  font: var(--cpd-font-heading-sm-semibold);
  font-weight: var(--cpd-font-weight-semibold);
  margin-left: 8px;
  margin-right: auto;
  overflow: hidden;
  padding: 1px 24px 1px 4px;
  position: relative;
  text-overflow: ellipsis;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  white-space: nowrap;
}
.mx_RoomListHeader .mx_RoomListHeader_contextMenuButton {
  border-radius: 6px;
}
.mx_RoomListHeader .mx_RoomListHeader_contextMenuButton:hover {
  background-color: var(--cpd-color-gray-400);
}
.mx_RoomListHeader .mx_RoomListHeader_contextMenuButton:before {
  background-color: var(--cpd-color-gray-800);
  content: "";
  height: 20px;
  -webkit-mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  right: 0;
  top: 3px;
  width: 20px;
}
.mx_RoomListHeader .mx_RoomListHeader_contextMenuButton[aria-expanded="true"] {
  background-color: var(--cpd-color-gray-400);
}
.mx_RoomListHeader
  .mx_RoomListHeader_contextMenuButton[aria-expanded="true"]:before {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
.mx_RoomListHeader .mx_RoomListHeader_plusButton {
  background-color: var(--cpd-color-alpha-gray-300);
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 32px;
  margin-left: 8px;
  margin-right: 12px;
  padding: 8px;
  position: relative;
  width: 32px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_RoomListHeader .mx_RoomListHeader_plusButton:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 16px;
  -webkit-mask-image: url(../../img/element-icons/roomlist/plus.6af83e4.svg);
  mask-image: url(../../img/element-icons/roomlist/plus.6af83e4.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  width: 16px;
}
.mx_RoomListHeader .mx_RoomListHeader_plusButton:hover {
  background-color: var(--cpd-color-gray-800);
}
.mx_RoomListHeader .mx_RoomListHeader_plusButton:hover:before {
  background-color: var(--cpd-color-bg-canvas-default);
}
.mx_RoomListHeader_iconInvite:before {
  -webkit-mask-image: url(../../img/element-icons/room/invite.440bc20.svg);
  mask-image: url(../../img/element-icons/room/invite.440bc20.svg);
}
.mx_RoomListHeader_iconStartChat:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/member-plus.705de31.svg);
  mask-image: url(../../img/element-icons/roomlist/member-plus.705de31.svg);
}
.mx_RoomListHeader_iconNewRoom:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/hash-plus.0f56725.svg);
  mask-image: url(../../img/element-icons/roomlist/hash-plus.0f56725.svg);
}
.mx_RoomListHeader_iconNewVideoRoom:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/hash-video.0d44220.svg);
  mask-image: url(../../img/element-icons/roomlist/hash-video.0d44220.svg);
}
.mx_RoomListHeader_iconExplore:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/hash-search.53e3a04.svg);
  mask-image: url(../../img/element-icons/roomlist/hash-search.53e3a04.svg);
}
.mx_RoomListHeader_iconPlus:before {
  -webkit-mask-image: url(../../img/element-icons/plus.7b3d018.svg);
  mask-image: url(../../img/element-icons/plus.7b3d018.svg);
}
.mx_RoomPreviewBar {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
}
.mx_RoomPreviewBar h3 {
  font-size: 1.125rem;
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_RoomPreviewBar h3.mx_RoomPreviewBar_spinnerTitle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin: 0;
}
.mx_RoomPreviewBar .mx_RoomPreviewBar_message p,
.mx_RoomPreviewBar h3 {
  word-break: break-all;
  word-break: break-word;
}
.mx_RoomPreviewBar .mx_Spinner {
  height: auto;
  margin: 10px 10px 10px 0;
  width: auto;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
}
.mx_RoomPreviewBar .mx_RoomPreviewBar_footer {
  font-size: 0.75rem;
  line-height: 1.25rem;
}
.mx_RoomPreviewBar .mx_RoomPreviewBar_footer .mx_Spinner {
  display: inline-block;
  vertical-align: middle;
}
.mx_RoomPreviewBar_actions,
.mx_RoomPreviewBar_message {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_RoomPreviewBar_message {
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}
.mx_RoomPreviewBar_message p {
  overflow-wrap: break-word;
}
.mx_RoomPreviewBar_panel {
  padding: 8px 8px 8px 20px;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
}
.mx_RoomPreviewBar_panel .mx_RoomPreviewBar_actions {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  padding: 3px 8px;
}
.mx_RoomPreviewBar_panel .mx_RoomPreviewBar_actions > * {
  margin-left: 12px;
}
.mx_RoomPreviewBar_panel .mx_RoomPreviewBar_message {
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1 0 0px;
  flex: 1 0 0;
  min-width: 0;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_RoomPreviewBar_panel .mx_RoomPreviewBar_message > * {
  margin: 4px;
}
.mx_MainSplit_maximisedWidget .mx_RoomPreviewBar_panel {
  border-radius: 8px;
  margin: 8px;
  margin: var(--container-gap-width);
  margin-right: 4px;
  margin-right: calc(var(--container-gap-width) / 2);
  margin-top: 0;
}
.mx_RoomPreviewBar_dialog {
  border-radius: 4px;
  -webkit-box-sizing: content;
  box-sizing: content;
  margin: auto;
  padding: 20px;
  text-align: center;
  width: 400px;
}
.mx_RoomPreviewBar_dialog,
.mx_RoomPreviewBar_dialog .mx_RoomPreviewBar_message {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_RoomPreviewBar_dialog .mx_RoomPreviewBar_message > * {
  margin: 5px 0 20px;
}
.mx_RoomPreviewBar_dialog .mx_RoomPreviewBar_actions {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_RoomPreviewBar_dialog .mx_RoomPreviewBar_actions .mx_AccessibleButton {
  padding: 7px 50px;
}
.mx_RoomPreviewBar_dialog .mx_RoomPreviewBar_actions > * {
  margin-top: 12px;
}
.mx_RoomPreviewBar_dialog
  .mx_RoomPreviewBar_actions
  .mx_AccessibleButton.mx_AccessibleButton_kind_primary {
  margin-bottom: 7px;
}
.mx_RoomPreviewBar_Invite {
  max-height: 100vh;
  overflow-y: auto;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}
.mx_RoomPreviewBar_Invite h3 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: pre-wrap;
}
.mx_RoomPreviewBar_inviter {
  font-weight: var(--cpd-font-weight-semibold);
}
a.mx_RoomPreviewBar_inviter {
  cursor: pointer;
  text-decoration: underline;
}
.mx_RoomPreviewBar_icon {
  margin-right: 8px;
  vertical-align: text-top;
}
.mx_RoomPreviewBar_fullWidth {
  width: 100%;
}
.mx_RoomPreviewCard {
  margin: auto;
  padding: 32px 24px !important;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  background-color: var(--cpd-color-bg-subtle-primary);
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  flex-grow: 1;
  font: var(--cpd-font-body-md-regular);
  max-width: 480px;
  position: relative;
}
.mx_RoomPreviewCard .mx_RoomPreviewCard_notice {
  color: var(--cpd-color-text-primary);
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.5rem;
  margin-top: 24px;
  padding-left: 28px;
  position: relative;
}
.mx_RoomPreviewCard .mx_RoomPreviewCard_notice:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 1.5rem;
  left: 0;
  -webkit-mask-image: url(../../img/element-icons/room/room-summary.50ea68e.svg);
  mask-image: url(../../img/element-icons/room/room-summary.50ea68e.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  width: 20px;
}
.mx_RoomPreviewCard .mx_RoomPreviewCard_inviter {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 0.9375rem;
  margin-bottom: 20px;
}
.mx_RoomPreviewCard .mx_RoomPreviewCard_inviter > div {
  margin-left: 8px;
}
.mx_RoomPreviewCard
  .mx_RoomPreviewCard_inviter
  > div
  .mx_RoomPreviewCard_inviter_name {
  line-height: 1.125rem;
}
.mx_RoomPreviewCard
  .mx_RoomPreviewCard_inviter
  > div
  .mx_RoomPreviewCard_inviter_mxid {
  color: var(--cpd-color-text-secondary);
}
.mx_RoomPreviewCard .mx_RoomPreviewCard_avatar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_RoomPreviewCard .mx_RoomPreviewCard_avatar .mx_RoomPreviewCard_video {
  background-color: var(--cpd-color-text-action-accent);
  border: 3px solid var(--cpd-color-bg-subtle-primary);
  border-radius: 28px;
  height: 50px;
  left: -15.5px;
  position: relative;
  width: 50px;
}
.mx_RoomPreviewCard
  .mx_RoomPreviewCard_avatar
  .mx_RoomPreviewCard_video:before {
  background-color: var(--cpd-color-bg-canvas-default);
  content: "";
  height: 50px;
  -webkit-mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
  mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 22px;
  mask-size: 22px;
  position: absolute;
  width: 50px;
}
.mx_RoomPreviewCard .mx_RoomPreviewCard_avatar .mx_BetaCard_betaPill {
  inset-block-start: 32px;
  inset-inline-end: 24px;
  position: absolute;
}
.mx_RoomPreviewCard h1.mx_RoomPreviewCard_name {
  margin: 16px 0 !important;
}
.mx_RoomPreviewCard .mx_RoomPreviewCard_topic {
  line-height: 1.375rem;
  margin-top: 16px;
  max-height: 160px;
  overflow-y: auto;
}
.mx_RoomPreviewCard .mx_FacePile {
  margin-top: 20px;
}
.mx_RoomPreviewCard .mx_RoomPreviewCard_joinButtons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 20px;
  margin-top: 20px;
}
.mx_RoomPreviewCard .mx_RoomPreviewCard_joinButtons .mx_AccessibleButton {
  max-width: 200px;
  padding: 14px 0;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
.mx_RoomSublist {
  margin-bottom: 4px;
  margin-left: 8px;
}
.mx_RoomSublist.mx_RoomSublist_hidden {
  display: none;
}
.mx_RoomSublist:not(.mx_RoomSublist_minimized) .mx_RoomSublist_headerContainer {
  height: auto;
}
.mx_RoomSublist .mx_RoomSublist_headerContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-secondary);
  height: 24px;
  padding-bottom: 8px;
}
.mx_RoomSublist
  .mx_RoomSublist_headerContainer
  .mx_RoomSublist_stickableContainer {
  width: 100%;
}
.mx_RoomSublist .mx_RoomSublist_headerContainer .mx_RoomSublist_stickable {
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1;
  flex: 1;
  max-width: 100%;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_RoomSublist
  .mx_RoomSublist_headerContainer
  .mx_RoomSublist_stickable.mx_RoomSublist_headerContainer_sticky {
  height: 32px;
  position: fixed;
  width: calc(100% - 15px);
}
.mx_RoomSublist .mx_RoomSublist_headerContainer .mx_RoomSublist_badgeContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_RoomSublist
  .mx_RoomSublist_headerContainer
  .mx_RoomSublist_badgeContainer
  .mx_NotificationBadge {
  margin-left: 8px;
}
.mx_RoomSublist
  .mx_RoomSublist_headerContainer:not(.mx_RoomSublist_headerContainer_withAux)
  .mx_NotificationBadge {
  margin-right: 4px;
}
.mx_RoomSublist .mx_RoomSublist_headerContainer .mx_RoomSublist_auxButton,
.mx_RoomSublist .mx_RoomSublist_headerContainer .mx_RoomSublist_menuButton {
  border-radius: 8px;
  height: 24px;
  margin-left: 8px;
  position: relative;
  width: 24px;
}
.mx_RoomSublist
  .mx_RoomSublist_headerContainer
  .mx_RoomSublist_auxButton:before,
.mx_RoomSublist
  .mx_RoomSublist_headerContainer
  .mx_RoomSublist_menuButton:before {
  background: var(--cpd-color-icon-secondary);
  content: "";
  height: 16px;
  left: 4px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 4px;
  width: 16px;
}
.mx_RoomSublist .mx_RoomSublist_headerContainer .mx_RoomSublist_auxButton:hover,
.mx_RoomSublist
  .mx_RoomSublist_headerContainer
  .mx_RoomSublist_menuButton:hover {
  background: var(--cpd-color-alpha-gray-300);
}
.mx_RoomSublist .mx_RoomSublist_headerContainer .mx_RoomSublist_menuButton {
  margin: 0;
  visibility: hidden;
  width: 0;
}
.mx_RoomSublist
  .mx_RoomSublist_headerContainer
  .mx_RoomSublist_auxButton:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/plus.6af83e4.svg);
  mask-image: url(../../img/element-icons/roomlist/plus.6af83e4.svg);
}
.mx_RoomSublist
  .mx_RoomSublist_headerContainer
  .mx_RoomSublist_menuButton:before {
  -webkit-mask-image: url(../../img/element-icons/context-menu.2c3f393.svg);
  mask-image: url(../../img/element-icons/context-menu.2c3f393.svg);
}
.mx_RoomSublist .mx_RoomSublist_headerContainer .mx_RoomSublist_headerText {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  font: var(--cpd-font-body-sm-semibold);
  max-width: calc(100% - 16px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_RoomSublist
  .mx_RoomSublist_headerContainer
  .mx_RoomSublist_headerText
  .mx_RoomSublist_collapseBtn {
  display: inline-block;
  height: 14px;
  margin-right: 6px;
  position: relative;
  width: 14px;
}
.mx_RoomSublist
  .mx_RoomSublist_headerContainer
  .mx_RoomSublist_headerText
  .mx_RoomSublist_collapseBtn:before {
  background-color: var(--cpd-color-icon-secondary);
  content: "";
  height: 18px;
  -webkit-mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  width: 18px;
}
.mx_RoomSublist
  .mx_RoomSublist_headerContainer
  .mx_RoomSublist_headerText
  .mx_RoomSublist_collapseBtn.mx_RoomSublist_collapseBtn_collapsed:before {
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
.mx_RoomSublist:not(.mx_RoomSublist_hidden)
  ~ .mx_RoomSublist
  .mx_RoomSublist_stickableContainer {
  height: 24px;
}
.mx_RoomSublist .mx_RoomSublist_resizeBox {
  -ms-flex-direction: column;
  flex-direction: column;
  position: relative;
}
.mx_RoomSublist .mx_RoomSublist_resizeBox,
.mx_RoomSublist .mx_RoomSublist_resizeBox .mx_RoomSublist_tiles {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  overflow: hidden;
}
.mx_RoomSublist .mx_RoomSublist_resizeBox .mx_RoomSublist_tiles {
  -webkit-box-flex: 1;
  -ms-flex: 1 0 0px;
  flex: 1 0 0;
  -ms-flex-direction: column;
  flex-direction: column;
  overflow: clip;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  -webkit-mask-image: linear-gradient(0deg, transparent, #000 4px);
  mask-image: linear-gradient(0deg, transparent, #000 4px);
  min-height: 0;
}
.mx_RoomSublist
  .mx_RoomSublist_resizeBox.mx_RoomSublist_resizeBox_forceExpanded
  .mx_RoomSublist_tiles {
  min-height: 0;
  min-height: auto;
  overflow: visible;
}
.mx_RoomSublist
  .mx_RoomSublist_resizeBox
  .mx_RoomSublist_resizerHandles_showNButton {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 32px;
  flex: 0 0 32px;
}
.mx_RoomSublist .mx_RoomSublist_resizeBox .mx_RoomSublist_resizerHandles {
  -webkit-box-flex: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 0 0 4px;
  flex: 0 0 4px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
}
.mx_RoomSublist .mx_RoomSublist_resizeBox .mx_RoomSublist_resizerHandle {
  border-radius: 3px;
  bottom: 0 !important;
  cursor: ns-resize;
  height: 4px !important;
  max-width: 64px;
  position: relative !important;
}
.mx_RoomSublist
  .mx_RoomSublist_resizeBox.mx_RoomSublist_hasMenuOpen
  .mx_RoomSublist_resizerHandle,
.mx_RoomSublist .mx_RoomSublist_resizeBox:hover .mx_RoomSublist_resizerHandle {
  background-color: var(--cpd-color-text-primary);
  opacity: 0.8;
}
.mx_RoomSublist .mx_RoomSublist_showNButton {
  color: var(--cpd-color-text-secondary);
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 0.8125rem;
  height: 24px;
  line-height: 1.125rem;
  padding-bottom: 4px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_RoomSublist .mx_RoomSublist_showNButton .mx_RoomSublist_showNButtonChevron {
  background: var(--cpd-color-gray-800);
  height: 18px;
  left: -1px;
  margin-left: 12px;
  margin-right: 16px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: relative;
  width: 18px;
}
.mx_RoomSublist
  .mx_RoomSublist_showNButton
  .mx_RoomSublist_showLessButtonChevron,
.mx_RoomSublist
  .mx_RoomSublist_showNButton
  .mx_RoomSublist_showMoreButtonChevron {
  -webkit-mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
}
.mx_RoomSublist
  .mx_RoomSublist_showNButton
  .mx_RoomSublist_showLessButtonChevron {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
.mx_RoomSublist.mx_RoomSublist_hasMenuOpen .mx_RoomSublist_menuButton,
.mx_RoomSublist:not(.mx_RoomSublist_minimized)
  > .mx_RoomSublist_headerContainer:focus-within
  .mx_RoomSublist_menuButton,
.mx_RoomSublist:not(.mx_RoomSublist_minimized)
  > .mx_RoomSublist_headerContainer:hover
  .mx_RoomSublist_menuButton {
  margin-left: 8px;
  visibility: visible;
  width: 24px;
}
.mx_RoomSublist.mx_RoomSublist_minimized .mx_RoomSublist_headerContainer {
  height: auto;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  position: relative;
}
.mx_RoomSublist.mx_RoomSublist_minimized
  .mx_RoomSublist_headerContainer
  .mx_RoomSublist_badgeContainer {
  -webkit-box-ordinal-group: 1;
  -ms-flex-order: 0;
  order: 0;
  -ms-flex-item-align: end;
  align-self: flex-end;
  margin-right: 0;
}
.mx_RoomSublist.mx_RoomSublist_minimized
  .mx_RoomSublist_headerContainer
  .mx_RoomSublist_stickable {
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  max-width: 100%;
  order: 1;
}
.mx_RoomSublist.mx_RoomSublist_minimized
  .mx_RoomSublist_headerContainer
  .mx_RoomSublist_auxButton {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  background-color: var(--cpd-color-alpha-gray-300);
  height: 32px !important; /* !important to override hover styles */
  margin-left: 0 !important; /* !important to override hover styles */
  margin-top: 8px;
  order: 2;
  visibility: visible;
  width: 32px !important; /* !important to override hover styles */
  display: none;
}
.mx_RoomSublist.mx_RoomSublist_minimized
  .mx_RoomSublist_headerContainer
  .mx_RoomSublist_auxButton:before {
  left: 8px;
  top: 8px;
}
.mx_RoomSublist.mx_RoomSublist_minimized .mx_RoomSublist_resizeBox {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_RoomSublist.mx_RoomSublist_minimized .mx_RoomSublist_showNButton {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_RoomSublist.mx_RoomSublist_minimized
  .mx_RoomSublist_showNButton
  .mx_RoomSublist_showNButtonChevron {
  margin-right: 12px;
}
.mx_RoomSublist.mx_RoomSublist_minimized .mx_RoomSublist_menuButton {
  height: 16px;
}
.mx_RoomSublist.mx_RoomSublist_minimized.mx_RoomSublist_hasMenuOpen
  .mx_RoomSublist_menuButton,
.mx_RoomSublist.mx_RoomSublist_minimized
  > .mx_RoomSublist_headerContainer:hover
  .mx_RoomSublist_menuButton {
  background-color: hsla(0, 0%, 96%, 0.9);
  border-radius: 0;
  bottom: 48px;
  height: 16px;
  position: absolute;
  right: 0;
  visibility: visible;
  width: 16px;
  z-index: 1;
}
.mx_RoomSublist.mx_RoomSublist_minimized.mx_RoomSublist_hasMenuOpen
  .mx_RoomSublist_menuButton:before,
.mx_RoomSublist.mx_RoomSublist_minimized
  > .mx_RoomSublist_headerContainer:hover
  .mx_RoomSublist_menuButton:before {
  left: 0;
  top: 0;
}
.mx_RoomSublist.mx_RoomSublist_minimized.mx_RoomSublist_hasMenuOpen.mx_RoomSublist_headerContainer:not(
    .mx_RoomSublist_headerContainer_withAux
  )
  .mx_RoomSublist_menuButton,
.mx_RoomSublist.mx_RoomSublist_minimized
  > .mx_RoomSublist_headerContainer:hover.mx_RoomSublist_headerContainer:not(
    .mx_RoomSublist_headerContainer_withAux
  )
  .mx_RoomSublist_menuButton {
  bottom: 8px;
}
.mx_RoomSublist_contextMenu {
  padding: 20px 16px;
  width: 250px;
}
.mx_RoomSublist_contextMenu hr {
  border: 1px solid var(--cpd-color-text-primary);
  margin-bottom: 16px;
  margin-right: 16px;
  margin-top: 16px;
  opacity: 0.1;
}
.mx_RoomSublist_contextMenu .mx_RoomSublist_contextMenu_title {
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.25rem;
  margin-bottom: 4px;
}
.mx_RoomSublist_contextMenu .mx_Checkbox,
.mx_RoomSublist_contextMenu .mx_StyledRadioButton {
  margin-top: 8px;
}
.mx_RoomSublist_skeletonUI {
  height: 240px;
  margin-left: 4px;
  position: relative;
}
.mx_RoomSublist_skeletonUI:before {
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(var(--cpd-color-bg-canvas-default)),
    to(#ffffff00)
  );
  background: linear-gradient(
    180deg,
    var(--cpd-color-bg-canvas-default) 0,
    #ffffff00 100%
  );
  content: "";
  height: 100%;
  -webkit-mask-image: url(../../img/element-icons/roomlist/skeleton-ui.fde3810.svg);
  mask-image: url(../../img/element-icons/roomlist/skeleton-ui.fde3810.svg);
  -webkit-mask-repeat: repeat-y;
  mask-repeat: repeat-y;
  -webkit-mask-size: auto 48px;
  mask-size: auto 48px;
  position: absolute;
  width: 100%;
}
.mx_RoomSublist_minimized .mx_RoomSublist_skeletonUI {
  margin-left: 10px;
  width: 32px;
}
.mx_RoomTile {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  contain: content;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: var(--cpd-font-size-body-sm);
  margin-bottom: 4px;
  padding: 4px;
}
.mx_RoomTile.mx_RoomTile_hasMenuOpen,
.mx_RoomTile.mx_RoomTile_selected,
.mx_RoomTile:focus-within,
.mx_RoomTile:hover {
  background-color: var(--cpd-color-alpha-gray-300);
  border-radius: 8px;
}
.mx_RoomTile .mx_DecoratedRoomAvatar,
.mx_RoomTile .mx_RoomTile_avatarContainer {
  margin-right: 10px;
}
.mx_RoomTile .mx_RoomTile_details {
  min-width: 0;
}
.mx_RoomTile .mx_RoomTile_titleContainer {
  height: 32px;
  min-width: 0;
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-grow: 1;
  margin-right: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_RoomTile .mx_RoomTile_titleContainer .mx_RoomTile_subtitle {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-secondary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 4px;
  line-height: 1.25;
  position: relative;
  top: -1px;
}
.mx_RoomTile .mx_RoomTile_titleContainer .mx_RoomTile_subtitle_text,
.mx_RoomTile .mx_RoomTile_titleContainer .mx_RoomTile_title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_RoomTile .mx_RoomTile_titleContainer .mx_RoomTile_title {
  font: var(--cpd-font-body-md-regular);
  line-height: 1.25;
}
.mx_RoomTile
  .mx_RoomTile_titleContainer
  .mx_RoomTile_title.mx_RoomTile_titleHasUnreadEvents {
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_RoomTile .mx_RoomTile_titleContainer .mx_RoomTile_titleWithSubtitle {
  margin-top: -2px;
}
.mx_RoomTile .mx_RoomTile_notificationsButton {
  margin-left: 4px;
}
.mx_RoomTile .mx_RoomTile_badgeContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 16px;
  margin: auto 0;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_RoomTile .mx_RoomTile_badgeContainer .mx_NotificationBadge {
  margin-right: 2px;
}
.mx_RoomTile .mx_RoomTile_badgeContainer .mx_NotificationBadge_dot {
  margin-left: 5px;
  margin-right: 7px;
}
.mx_RoomTile .mx_RoomTile_menuButton,
.mx_RoomTile .mx_RoomTile_notificationsButton {
  display: none;
  height: 20px;
  margin-bottom: auto;
  margin-top: auto;
  min-width: 20px;
  position: relative;
  width: 20px;
}
.mx_RoomTile .mx_RoomTile_menuButton:before,
.mx_RoomTile .mx_RoomTile_notificationsButton:before {
  background: var(--cpd-color-icon-primary);
  content: "";
  height: 16px;
  left: 2px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 2px;
  width: 16px;
}
.mx_RoomTile
  .mx_RoomTile_notificationsButton.mx_RoomTile_notificationsButton_show {
  display: block;
}
.mx_RoomTile .mx_RoomTile_menuButton:before {
  -webkit-mask-image: url(../../img/element-icons/context-menu.2c3f393.svg);
  mask-image: url(../../img/element-icons/context-menu.2c3f393.svg);
}
.mx_RoomTile:not(
    .mx_RoomTile_minimized,
    .mx_RoomTile_sticky
  ).mx_RoomTile_hasMenuOpen
  .mx_RoomTile_badgeContainer,
.mx_RoomTile:not(.mx_RoomTile_minimized, .mx_RoomTile_sticky):focus-within
  .mx_RoomTile_badgeContainer,
.mx_RoomTile:not(.mx_RoomTile_minimized, .mx_RoomTile_sticky):hover
  .mx_RoomTile_badgeContainer {
  display: none;
  height: 0;
  width: 0;
}
.mx_RoomTile:not(
    .mx_RoomTile_minimized,
    .mx_RoomTile_sticky
  ).mx_RoomTile_hasMenuOpen
  .mx_RoomTile_menuButton,
.mx_RoomTile:not(
    .mx_RoomTile_minimized,
    .mx_RoomTile_sticky
  ).mx_RoomTile_hasMenuOpen
  .mx_RoomTile_notificationsButton,
.mx_RoomTile:not(.mx_RoomTile_minimized, .mx_RoomTile_sticky):focus-within
  .mx_RoomTile_menuButton,
.mx_RoomTile:not(.mx_RoomTile_minimized, .mx_RoomTile_sticky):focus-within
  .mx_RoomTile_notificationsButton,
.mx_RoomTile:not(.mx_RoomTile_minimized, .mx_RoomTile_sticky):hover
  .mx_RoomTile_menuButton,
.mx_RoomTile:not(.mx_RoomTile_minimized, .mx_RoomTile_sticky):hover
  .mx_RoomTile_notificationsButton {
  display: block;
}
.mx_RoomTile.mx_RoomTile_minimized {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
}
.mx_RoomTile.mx_RoomTile_minimized .mx_DecoratedRoomAvatar,
.mx_RoomTile.mx_RoomTile_minimized .mx_RoomTile_avatarContainer {
  margin-right: 0;
}
.mx_RoomTile_iconBell:before {
  -webkit-mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
  mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
}
.mx_RoomTile_iconBellDot:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/notifications-default.63a2b44.svg);
  mask-image: url(../../img/element-icons/roomlist/notifications-default.63a2b44.svg);
}
.mx_RoomTile_iconBellCrossed:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/notifications-off.0b8adcc.svg);
  mask-image: url(../../img/element-icons/roomlist/notifications-off.0b8adcc.svg);
}
.mx_RoomTile_iconBellMentions:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/notifications-dm.6739542.svg);
  mask-image: url(../../img/element-icons/roomlist/notifications-dm.6739542.svg);
}
.mx_RoomTile_contextMenu .mx_RoomTile_iconStar:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/favorite.9dcb53a.svg);
  mask-image: url(../../img/element-icons/roomlist/favorite.9dcb53a.svg);
}
.mx_RoomTile_contextMenu .mx_RoomTile_iconArrowDown:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/low-priority.d46a05a.svg);
  mask-image: url(../../img/element-icons/roomlist/low-priority.d46a05a.svg);
}
.mx_RoomTile_contextMenu .mx_RoomTile_iconNotificationsDefault:before {
  -webkit-mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
  mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
}
.mx_RoomTile_contextMenu .mx_RoomTile_iconNotificationsAllMessages:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/notifications-default.63a2b44.svg);
  mask-image: url(../../img/element-icons/roomlist/notifications-default.63a2b44.svg);
}
.mx_RoomTile_contextMenu .mx_RoomTile_iconNotificationsMentionsKeywords:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/notifications-dm.6739542.svg);
  mask-image: url(../../img/element-icons/roomlist/notifications-dm.6739542.svg);
}
.mx_RoomTile_contextMenu .mx_RoomTile_iconNotificationsNone:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/notifications-off.0b8adcc.svg);
  mask-image: url(../../img/element-icons/roomlist/notifications-off.0b8adcc.svg);
}
.mx_RoomTile_contextMenu .mx_RoomTile_iconPeople:before {
  -webkit-mask-image: url(../../img/element-icons/room/members.bcfbe84.svg);
  mask-image: url(../../img/element-icons/room/members.bcfbe84.svg);
}
.mx_RoomTile_contextMenu .mx_RoomTile_iconFiles:before {
  -webkit-mask-image: url(../../img/element-icons/room/files.ff2ae8d.svg);
  mask-image: url(../../img/element-icons/room/files.ff2ae8d.svg);
}
.mx_RoomTile_contextMenu .mx_RoomTile_iconPins:before {
  -webkit-mask-image: url(../../img/element-icons/room/pin-upright.340b3b6.svg);
  mask-image: url(../../img/element-icons/room/pin-upright.340b3b6.svg);
}
.mx_RoomTile_contextMenu .mx_RoomTile_iconWidgets:before {
  -webkit-mask-image: url(../../img/element-icons/room/apps.931b680.svg);
  mask-image: url(../../img/element-icons/room/apps.931b680.svg);
}
.mx_RoomTile_contextMenu .mx_RoomTile_iconSettings:before {
  -webkit-mask-image: url(../../img/element-icons/settings.6b0c052.svg);
  mask-image: url(../../img/element-icons/settings.6b0c052.svg);
}
.mx_RoomTile_contextMenu .mx_RoomTile_iconExport:before {
  -webkit-mask-image: url(../../img/element-icons/export.2d0320e.svg);
  mask-image: url(../../img/element-icons/export.2d0320e.svg);
}
.mx_RoomTile_contextMenu .mx_RoomTile_iconCopyLink:before {
  -webkit-mask-image: url(../../img/element-icons/link.e24e5a8.svg);
  mask-image: url(../../img/element-icons/link.e24e5a8.svg);
}
.mx_RoomTile_contextMenu .mx_RoomTile_iconInvite:before {
  -webkit-mask-image: url(../../img/element-icons/room/invite.440bc20.svg);
  mask-image: url(../../img/element-icons/room/invite.440bc20.svg);
}
.mx_RoomTile_contextMenu .mx_RoomTile_iconSignOut:before {
  -webkit-mask-image: url(../../img/element-icons/leave.9cf503d.svg);
  mask-image: url(../../img/element-icons/leave.9cf503d.svg);
}
.mx_RoomUpgradeWarningBar {
  background-color: #f7f7f7;
  max-height: 235px;
  overflow: scroll;
  padding-left: 20px;
  padding-right: 20px;
}
.mx_RoomUpgradeWarningBar_wrapped {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  text-align: center;
  width: 100%;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-align-items: center;
  justify-content: center;
}
.mx_RoomUpgradeWarningBar_header {
  font-weight: 700;
}
.mx_RoomUpgradeWarningBar_body,
.mx_RoomUpgradeWarningBar_header,
.mx_RoomUpgradeWarningBar_upgradelink {
  color: var(--cpd-color-text-critical-primary);
}
.mx_RoomUpgradeWarningBar_upgradelink {
  text-decoration: underline;
}
.mx_RoomUpgradeWarningBar_small {
  color: var(--cpd-color-gray-900);
  font-size: 70%;
}
.mx_SearchBar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  min-height: 56px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-bottom: 1px solid transparent;
}
.mx_SearchBar .mx_SearchBar_input {
  --size-button-search: 37px;
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  margin-left: 22px;
  min-width: calc(7em + 37px);
  min-width: calc(7em + var(--size-button-search));
}
.mx_SearchBar .mx_SearchBar_input input {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.mx_SearchBar .mx_SearchBar_searchButton {
  background-color: var(--cpd-color-text-action-accent);
  cursor: pointer;
  height: var(--size-button-search);
  -webkit-mask: url(../../img/feather-customised/search-input.5d69fb5.svg);
  mask: url(../../img/feather-customised/search-input.5d69fb5.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  width: var(--size-button-search);
}
.mx_SearchBar .mx_SearchBar_buttons {
  display: inherit;
  min-width: 0;
}
.mx_SearchBar .mx_SearchBar_button {
  border: 0;
  border-bottom: 2px solid var(--cpd-color-text-action-accent);
  color: var(--cpd-color-text-primary);
  cursor: pointer;
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin: 0 0 0 22px;
  padding: 5px;
  word-break: break-all;
}
.mx_SearchBar .mx_SearchBar_unselected {
  border-color: transparent;
  color: #9fa9ba;
}
.mx_SearchBar .mx_SearchBar_cancel {
  background-color: var(--cpd-color-text-critical-primary);
  cursor: pointer;
  margin: 0 12px 0 3px;
  -webkit-mask: url(../../img/cancel.f8ee58c.svg);
  mask: url(../../img/cancel.f8ee58c.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 14px;
  mask-size: 14px;
  padding: 9px;
}
.mx_SendMessageComposer {
  -ms-flex: 1;
  flex: 1;
  -ms-flex-direction: column;
  flex-direction: column;
  font: var(--cpd-font-body-md-regular);
  line-height: 1.125rem;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-right: 6px;
  min-width: 0;
}
.mx_SendMessageComposer,
.mx_SendMessageComposer .mx_BasicMessageComposer {
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
}
.mx_SendMessageComposer .mx_BasicMessageComposer {
  -ms-flex: 1;
  flex: 1;
  -ms-flex-direction: column;
  flex-direction: column;
  min-height: 55px;
}
.mx_SendMessageComposer
  .mx_BasicMessageComposer
  .mx_BasicMessageComposer_input {
  margin: auto 0;
  max-height: 140px;
  overflow-y: auto;
  padding: 3px 0;
}
.mx_SpaceScopeHeader {
  display: -webkit-box;
  text-align: center;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}
.mx_SpaceScopeHeader .mx_BaseAvatar {
  margin-right: var(--cpd-space-2x);
  vertical-align: middle;
}
.mx_Stickers_content {
  overflow: hidden;
}
.mx_Stickers_content_container {
  height: 300px;
  overflow: hidden;
}
#mx_persistedElement_stickerPicker .mx_AppTileFullWidth {
  border-bottom: none;
  border-left: none;
  border-right: none;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: auto;
}
#mx_persistedElement_stickerPicker .mx_AppTileMenuBar {
  padding: 0;
}
#mx_persistedElement_stickerPicker iframe {
  height: 283px;
}
.mx_Stickers_contentPlaceholder {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
}
.mx_Stickers_contentPlaceholder p {
  max-width: 200px;
}
.mx_Stickers_addLink {
  color: var(--cpd-color-text-action-accent);
  cursor: pointer;
  display: inline;
}
.mx_ThirdPartyMemberInfo {
  padding: var(--cpd-space-4x);
}
.mx_ThreadSummary,
.mx_ThreadSummary_content {
  color: var(--cpd-color-text-secondary);
}
.mx_ThreadSummary,
.mx_ThreadSummary_icon {
  margin-top: 8px;
}
.mx_ThreadSummary {
  background-color: var(--cpd-color-bg-subtle-secondary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 40px;
  max-width: min(
    calc(100% - var(--EventTile_group_line-spacing-inline-start)),
    600px
  );
  min-width: 267px;
  padding-inline: 12px 16px;
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  border: 1px solid var(--cpd-color-bg-subtle-secondary);
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  clear: both;
  font: var(--cpd-font-body-sm-regular);
  justify-content: flex-start;
  overflow: hidden;
}
.mx_ThreadSummary .mx_ThreadSummary_chevron {
  background: -webkit-gradient(
    linear,
    right top,
    left top,
    color-stop(50%, var(--cpd-color-bg-subtle-primary)),
    to(#e1e6ec00)
  );
  background: linear-gradient(
    270deg,
    var(--cpd-color-bg-subtle-primary) 50%,
    #e1e6ec00 100%
  );
  bottom: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  opacity: 0;
  position: absolute;
  right: 0;
  top: 0;
  -webkit-transform: translateX(60px);
  transform: translateX(60px);
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
  width: 60px;
}
.mx_ThreadSummary .mx_ThreadSummary_chevron:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 12px;
  -webkit-mask-image: url(../../img/compound/chevron-right-12px.bc5b8f9.svg);
  mask-image: url(../../img/compound/chevron-right-12px.bc5b8f9.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  right: 12px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 12px;
}
.mx_ThreadSummary:focus,
.mx_ThreadSummary:hover {
  border-color: var(--cpd-color-gray-400);
}
.mx_ThreadSummary:focus .mx_ThreadSummary_chevron,
.mx_ThreadSummary:hover .mx_ThreadSummary_chevron {
  opacity: 1;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
.mx_ThreadSummary .mx_ThreadSummary_content,
.mx_ThreadSummary .mx_ThreadSummary_replies_amount,
.mx_ThreadSummary .mx_ThreadSummary_sender {
  line-height: var(--EventTile_ThreadSummary-line-height);
}
.mx_ThreadSummary .mx_ThreadSummary_content,
.mx_ThreadSummary .mx_ThreadSummary_sender {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_ThreadSummary .mx_ThreadSummary_sender {
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_ThreadSummary .mx_ThreadSummary_content {
  margin-left: 4px;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_ThreadSummary .mx_ThreadSummary_replies_amount {
  color: var(--cpd-color-text-secondary);
  font-weight: var(--cpd-font-weight-semibold);
  padding: 0 12px 0 8px;
  position: relative;
  white-space: nowrap;
}
.mx_MessagePanel_narrow .mx_ThreadSummary {
  max-width: 100%;
  min-width: 0;
  min-width: auto;
  width: auto;
}
.mx_ThreadSummary_avatar {
  -webkit-margin-end: 8px;
  margin-inline-end: 8px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_ThreadSummary_icon {
  display: inline-block;
  margin-bottom: 8px;
}
.mx_ThreadSummary_icon:before {
  background-color: var(--cpd-color-icon-tertiary) !important;
  content: "";
  display: inline-block;
  height: 18px;
  -webkit-mask-image: url(../../img/element-icons/thread-summary.4b1ebec.svg);
  mask-image: url(../../img/element-icons/thread-summary.4b1ebec.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  min-width: 18px;
  vertical-align: middle;
  -webkit-margin-end: 8px;
  margin-inline-end: 8px;
  margin-top: -2px;
}
a.mx_ThreadSummary_icon {
  color: var(--cpd-color-text-secondary);
}
.mx_TopUnreadMessagesBar {
  position: absolute;
  right: 24px;
  top: 24px;
  width: 38px;
  z-index: 1000;
}
.mx_TopUnreadMessagesBar:after {
  background-color: var(--cpd-color-bg-canvas-default);
  border: 6px solid var(--cpd-color-icon-accent-tertiary);
  border-radius: 16px;
  content: "";
  height: 4px;
  left: 11px;
  pointer-events: none;
  position: absolute;
  top: -8px;
  width: 4px;
}
.mx_TopUnreadMessagesBar_scrollUp {
  background: var(--cpd-color-bg-canvas-default);
  border: 1.3px solid var(--cpd-color-icon-tertiary);
  border-radius: 19px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
  height: 38px;
}
.mx_TopUnreadMessagesBar_scrollUp:before {
  background: var(--cpd-color-icon-tertiary);
  content: "";
  height: 36px;
  -webkit-mask-image: url(../../img/element-icons/message/chevron-up.0f9ac6f.svg);
  mask-image: url(../../img/element-icons/message/chevron-up.0f9ac6f.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  position: absolute;
  width: 36px;
}
.mx_TopUnreadMessagesBar_markAsRead {
  background: var(--cpd-color-bg-canvas-default);
  border: 1.3px solid var(--cpd-color-icon-tertiary);
  border-radius: 10px;
  display: block;
  height: 18px;
  margin: 5px auto;
  width: 18px;
}
.mx_TopUnreadMessagesBar_markAsRead:before {
  background: var(--cpd-color-icon-tertiary);
  content: "";
  height: 18px;
  -webkit-mask-image: url(../../img/cancel.f8ee58c.svg);
  mask-image: url(../../img/cancel.f8ee58c.svg);
  -webkit-mask-position: 4px 4px;
  mask-position: 4px 4px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 10px;
  mask-size: 10px;
  position: absolute;
  width: 18px;
}
.mx_VoiceRecordComposerTile_stop {
  border: 2px solid var(--cpd-color-gray-400);
  border-radius: 32px;
  height: 28px;
  margin-right: 2px;
  position: relative;
  width: 28px;
}
.mx_VoiceRecordComposerTile_stop:after {
  background-color: #ff5b55;
  border-radius: 2px;
  content: "";
  height: 14px;
  left: 7px;
  position: absolute;
  top: 7px;
  width: 14px;
}
.mx_VoiceRecordComposerTile_delete {
  background-color: var(--cpd-color-gray-800);
  height: 24px;
  margin-right: 2px;
  -webkit-mask-image: url(../../img/element-icons/trashcan.2f78f2d.svg);
  mask-image: url(../../img/element-icons/trashcan.2f78f2d.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  vertical-align: middle;
  width: 24px;
}
.mx_VoiceRecordComposerTile_uploadingState {
  color: var(--cpd-color-text-secondary);
  margin-right: 10px;
}
.mx_VoiceRecordComposerTile_failedState {
  margin-right: 21px;
}
.mx_VoiceRecordComposerTile_failedState
  .mx_VoiceRecordComposerTile_uploadState_badge {
  display: inline-block;
  margin-right: 4px;
  vertical-align: middle;
}
.mx_MessageComposer_row .mx_VoiceMessagePrimaryContainer {
  height: 32px;
  margin: 6px;
  position: relative;
}
.mx_MessageComposer_row
  .mx_VoiceMessagePrimaryContainer.mx_VoiceRecordComposerTile_recording {
  padding-left: 22px;
}
.mx_MessageComposer_row
  .mx_VoiceMessagePrimaryContainer.mx_VoiceRecordComposerTile_recording:before {
  -webkit-animation: recording-pulse 2s infinite;
  animation: recording-pulse 2s infinite;
  background-color: #ff5b55;
  border-radius: 10px;
  content: "";
  height: 10px;
  left: 12px;
  position: absolute;
  top: 17px;
  width: 10px;
}
.mx_MessageComposer_wysiwyg
  .mx_VoiceMessagePrimaryContainer.mx_VoiceRecordComposerTile_recording:before {
  top: 15px;
}
@-webkit-keyframes recording-pulse {
  0% {
    opacity: 1;
  }
  35% {
    opacity: 0;
  }
  65% {
    opacity: 1;
  }
}
@keyframes recording-pulse {
  0% {
    opacity: 1;
  }
  35% {
    opacity: 0;
  }
  65% {
    opacity: 1;
  }
}
.mx_WhoIsTypingTile {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-left: -18px;
  padding-top: 18px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_WhoIsTypingTile_avatars {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 82px;
  flex: 0 0 82px;
  text-align: center;
}
.mx_WhoIsTypingTile_avatars > :not(:first-child) {
  margin-left: -12px;
}
.mx_WhoIsTypingTile_avatars .mx_BaseAvatar,
.mx_WhoIsTypingTile_remainingAvatarPlaceholder {
  border: 1px solid var(--cpd-color-bg-canvas-default);
  border-radius: 40px;
}
.mx_WhoIsTypingTile_remainingAvatarPlaceholder {
  background-color: var(--cpd-color-gray-400);
  color: var(--cpd-color-text-primary);
  display: inline-block;
  font-size: 0.8em;
  height: 24px;
  line-height: 1.5rem;
  position: relative;
  text-align: center;
  vertical-align: top;
  width: 24px;
}
.mx_WhoIsTypingTile_label {
  -webkit-box-flex: 1;
  color: #9e9e9e;
  -ms-flex: 1;
  flex: 1;
  font: var(--cpd-font-body-md-semibold);
}
.mx_WhoIsTypingTile_label > span {
  background-image: url(../../img/typing-indicator-2x.e13c259.gif);
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 25px;
  display: block;
  padding-bottom: 15px;
}
.mx_MatrixChat_useCompactLayout .mx_WhoIsTypingTile {
  padding-top: 4px;
}
.mx_EditWysiwygComposer {
  --EditWysiwygComposer-padding-inline: 3px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  max-width: 100%;
  padding: 8px 3px;
  padding: 8px var(--EditWysiwygComposer-padding-inline);
  width: auto;
}
.mx_EditWysiwygComposer .mx_WysiwygComposer_Editor_content {
  background-color: var(--cpd-color-bg-canvas-default);
  border: 1px solid transparent;
  border-radius: 4px;
  max-height: 200px;
  padding: 3px 6px;
}
.mx_EditWysiwygComposer .mx_WysiwygComposer_Editor_content:focus {
  border-color: var(--cpd-color-green-400);
}
.mx_EditWysiwygComposer .mx_EditWysiwygComposer_buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-flow: row wrap-reverse;
  flex-flow: row wrap-reverse;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  gap: 5px;
  justify-content: flex-end;
  -webkit-margin-start: auto;
  margin-inline-start: auto;
}
.mx_EditWysiwygComposer .mx_EditWysiwygComposer_buttons .mx_AccessibleButton {
  -webkit-box-flex: 1;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -ms-flex: 1;
  flex: 1;
  min-width: 100px;
}
.mx_EditWysiwygComposer .mx_FormattingButtons_Button:first-child {
  margin-left: 0;
}
.mx_SendWysiwygComposer {
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  font: var(--cpd-font-body-md-regular);
  line-height: 1.125rem;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  gap: 8px;
  justify-content: center;
  margin-right: 13px;
}
.mx_SendWysiwygComposer .mx_FormattingButtons {
  margin-left: 12px;
}
.mx_SendWysiwygComposer .mx_WysiwygComposer_Editor {
  border: 1px solid;
  border-color: var(--cpd-color-gray-400);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 6px 11px 6px 12px;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  gap: 10px;
}
.mx_SendWysiwygComposer .mx_WysiwygComposer_Editor .mx_E2EIcon {
  height: 12px;
  margin: 0 0 7px;
  width: 12px;
}
.mx_SendWysiwygComposer .mx_WysiwygComposer_Editor[data-is-expanded="true"] {
  border-radius: 14px;
}
.mx_SendWysiwygComposer
  .mx_WysiwygComposer_Editor[data-is-expanded="true"]
  .mx_WysiwygComposer_Editor_container {
  margin-bottom: 3px;
  margin-top: 3px;
}
.mx_SendWysiwygComposer .mx_WysiwygComposer_Editor[data-is-expanded="false"] {
  border-radius: 40px;
}
.mx_SendWysiwygComposer
  .mx_WysiwygComposer_Editor
  .mx_WysiwygComposer_Editor_container {
  -webkit-box-flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-bottom: 2px;
  min-height: 22px;
  width: 0;
}
.mx_SendWysiwygComposer
  .mx_WysiwygComposer_Editor
  .mx_WysiwygComposer_Editor_container
  .mx_WysiwygComposer_Editor_content {
  margin: auto 0;
  max-height: 22rem;
  overflow-y: auto;
}
.mx_SendWysiwygComposer-focused .mx_WysiwygComposer_Editor {
  border-color: var(--cpd-color-gray-600);
}
@keyframes visualbell {
  0% {
    background-color: #faa;
  }
  to {
    background-color: var(--cpd-color-bg-canvas-default);
  }
}
.mx_WysiwygComposer_Editor_container .mx_WysiwygComposer_Editor_content {
  line-height: 1.375rem;
  white-space: pre-wrap;
  word-wrap: break-word;
  outline: none;
  overflow-x: hidden;
}
.mx_WysiwygComposer_Editor_container
  .mx_WysiwygComposer_Editor_content
  .caretNode {
  -webkit-user-select: all;
  -moz-user-select: all;
  user-select: all;
}
.mx_WysiwygComposer_Editor_container
  .mx_WysiwygComposer_Editor_content
  br:not(:only-child) {
  display: none;
}
.mx_WysiwygComposer_Editor_container .mx_WysiwygComposer_Editor_content p {
  margin-bottom: 0;
  margin-top: 0;
  min-height: 1.375rem;
}
.mx_WysiwygComposer_Editor_container .mx_WysiwygComposer_Editor_content ol,
.mx_WysiwygComposer_Editor_container .mx_WysiwygComposer_Editor_content ul {
  margin-bottom: 0;
  margin-top: 0;
  -webkit-padding-start: 28px;
  padding-inline-start: 28px;
}
.mx_WysiwygComposer_Editor_container .mx_WysiwygComposer_Editor_content ul {
  list-style-type: disc;
}
.mx_WysiwygComposer_Editor_container
  .mx_WysiwygComposer_Editor_content
  blockquote {
  border-left: 2px solid var(--cpd-color-border-interactive-primary);
  border-radius: 2px;
  color: #777;
  padding: 0 10px;
  -webkit-margin-before: 0;
  margin-block-start: 0;
  -webkit-margin-after: 0;
  margin-block-end: 0;
  -webkit-margin-start: 0;
  margin-inline-start: 0;
  -webkit-margin-end: 0;
  margin-inline-end: 0;
}
.mx_WysiwygComposer_Editor_container .mx_WysiwygComposer_Editor_content > pre {
  background-color: var(--cpd-color-bg-subtle-primary);
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 2px;
  font-size: 0.9375rem;
  line-height: 1.5rem;
  margin-bottom: 0;
  margin-top: 0;
  padding: 8px 12px;
}
.mx_WysiwygComposer_Editor_container
  .mx_WysiwygComposer_Editor_content
  code:not(pre *) {
  background-color: var(--cpd-color-bg-subtle-primary);
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 4px;
  font-family: Inconsolata, , Apple Color Emoji, Segoe UI Emoji, Courier,
    monospace, Noto Color Emoji !important;
  font-family: "Inconsolata", var(--emoji-font-family), "Apple Color Emoji",
    "Segoe UI Emoji", "Courier", monospace, "Noto Color Emoji" !important;
  padding: 2px;
}
.mx_WysiwygComposer_Editor_container
  .mx_WysiwygComposer_Editor_content
  code:not(pre *):empty {
  border: initial;
  padding: initial;
}
.mx_WysiwygComposer_Editor_container
  .mx_WysiwygComposer_Editor_content
  a[data-mention-type] {
  background-color: var(--cpd-color-bg-action-primary-rest);
  border-radius: 1rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: var(--cpd-color-text-on-solid-primary);
  cursor: inherit;
  display: inline;
  line-height: 1.0625rem;
  max-width: 100%;
  overflow: hidden;
  padding: 0.0625rem 0.4em;
  position: relative;
  text-overflow: ellipsis;
  -webkit-user-select: all;
  -moz-user-select: all;
  user-select: all;
  white-space: nowrap;
}
.mx_WysiwygComposer_Editor_container
  .mx_WysiwygComposer_Editor_content
  a[data-mention-type]:before {
  background: var(--avatar-background), var(--cpd-color-bg-canvas-default);
  content: var(--avatar-letter);
  display: inline-block;
  height: 1rem;
  line-height: 1rem;
  min-width: 1rem;
  text-align: center;
  width: 1rem;
  -webkit-margin-start: -0.4rem;
  margin-inline-start: -0.4rem;
  -webkit-margin-end: 0.24rem;
  background-repeat: no-repeat;
  background-size: 1rem;
  border-radius: 1rem;
  color: var(--avatar-color, var(--cpd-color-bg-canvas-default));
  font-size: 0.6275rem;
  font-weight: 700;
  margin-inline-end: 0.24rem;
  vertical-align: 0.12rem;
}
.mx_WysiwygComposer_Editor_container
  .mx_WysiwygComposer_Editor_content_placeholder:before {
  color: var(--cpd-color-gray-800);
  content: var(--placeholder);
  display: inline-block;
  height: 0;
  overflow: visible;
  pointer-events: none;
  white-space: nowrap;
  width: 0;
}
.mx_WysiwygComposer_AutoCompleteWrapper {
  position: relative;
}
.mx_WysiwygComposer_AutoCompleteWrapper > .mx_Autocomplete {
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 8px;
}
.mx_FormattingButtons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  gap: 8px;
  justify-content: flex-start;
}
.mx_FormattingButtons .mx_FormattingButtons_Button {
  --size: 28px;
  background-color: transparent;
  border: none;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 28px;
  height: var(--size);
  width: 28px;
  width: var(--size);
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  border-radius: 5px;
  justify-content: center;
}
.mx_FormattingButtons .mx_FormattingButtons_Button_hover:hover {
  background: var(--cpd-color-bg-subtle-secondary);
}
.mx_FormattingButtons
  .mx_FormattingButtons_Button_hover:hover
  .mx_FormattingButtons_Icon {
  color: var(--cpd-color-text-secondary);
}
.mx_FormattingButtons .mx_FormattingButtons_active {
  background: var(--cpd-color-green-300);
}
.mx_FormattingButtons .mx_FormattingButtons_active .mx_FormattingButtons_Icon {
  color: var(--cpd-color-text-action-accent);
}
.mx_FormattingButtons
  .mx_FormattingButtons_disabled
  .mx_FormattingButtons_Icon {
  color: var(--cpd-color-gray-400);
}
.mx_FormattingButtons .mx_FormattingButtons_Icon {
  --size: 16px;
  color: var(--cpd-color-gray-800);
  height: 16px;
  height: var(--size);
  width: 16px;
  width: var(--size);
}
.mx_FormattingButtons_Tooltip_KeyboardShortcut kbd {
  display: inline-block;
  font-family: Inter, sans-serif;
  text-align: center;
  text-transform: capitalize;
}
.mx_LinkModal {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 341px;
  max-width: 600px;
  padding: 32px;
}
.mx_LinkModal,
.mx_LinkModal .mx_LinkModal_content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_LinkModal .mx_LinkModal_content {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  gap: 8px;
  margin-top: 7px;
}
.mx_LinkModal .mx_LinkModal_content .mx_LinkModal_Field {
  -webkit-box-flex: initial;
  -ms-flex: initial;
  flex: initial;
  height: 40px;
}
.mx_LinkModal .mx_LinkModal_content .mx_LinkModal_buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
}
.mx_LinkModal .mx_LinkModal_content .mx_LinkModal_buttons .mx_Dialog_buttons {
  display: inline-block;
}
.mx_AvatarSetting_avatar {
  height: 90px;
  margin-top: 8px;
  min-width: 90px;
  position: relative;
  width: 90px;
}
.mx_AvatarSetting_avatar.mx_AvatarSetting_avatarDisplay:hover
  .mx_AvatarSetting_hover {
  opacity: 1;
}
.mx_AvatarSetting_avatar > * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.mx_AvatarSetting_avatar .mx_AccessibleButton.mx_AccessibleButton_kind_primary {
  margin-top: 8px;
}
.mx_AvatarSetting_avatar .mx_AccessibleButton.mx_AccessibleButton_kind_link_sm {
  width: 100%;
}
.mx_AvatarSetting_avatar > img {
  border-radius: 90px;
  cursor: pointer;
  display: block;
  height: 90px;
  -o-object-fit: cover;
  object-fit: cover;
  width: inherit;
}
.mx_AvatarSetting_avatar .mx_AvatarSetting_uploadButton {
  background-color: var(--cpd-color-bg-canvas-default);
  border: 1px solid var(--cpd-color-bg-canvas-default);
  border-radius: 32px;
  bottom: 0;
  cursor: pointer;
  height: 28px;
  position: absolute;
  right: 0;
  text-align: center;
  width: 28px;
}
.mx_AvatarSetting_avatar .mx_AvatarSetting_uploadButton svg {
  position: relative;
  top: 3px;
}
.mx_AvatarSetting_avatar .mx_AvatarSetting_uploadButton:hover,
.mx_AvatarSetting_avatar .mx_AvatarSetting_uploadButton_active {
  background-color: var(--cpd-color-bg-subtle-primary);
}
.mx_AvatarSetting_removeMenuItem span,
.mx_AvatarSetting_removeMenuItem svg {
  color: var(--cpd-color-text-critical-primary) !important;
}
.mx_CrossSigningPanel_statusList {
  border-spacing: 0;
}
.mx_CrossSigningPanel_statusList th {
  text-align: start;
}
.mx_CrossSigningPanel_statusList td,
.mx_CrossSigningPanel_statusList th {
  padding: 0;
}
.mx_CrossSigningPanel_statusList td:first-of-type,
.mx_CrossSigningPanel_statusList th:first-of-type {
  -webkit-padding-end: 1em;
  padding-inline-end: 1em;
}
.mx_CrossSigningPanel_buttonRow {
  margin: 1em 0;
}
.mx_CrossSigningPanel_buttonRow :nth-child(n + 1) {
  -webkit-margin-end: 10px;
  margin-inline-end: 10px;
}
.mx_CrossSigningPanel_advanced {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.mx_CryptographyPanel_sessionInfo {
  border-spacing: 0;
  padding: 0;
}
.mx_CryptographyPanel_sessionInfo > tr {
  padding: 0;
  vertical-align: baseline;
}
.mx_CryptographyPanel_sessionInfo > tr th {
  text-align: start;
}
.mx_CryptographyPanel_sessionInfo > tr td,
.mx_CryptographyPanel_sessionInfo > tr th {
  padding: 0 1em 0 0;
}
.mx_CryptographyPanel_importExportButtons {
  -webkit-column-gap: 8px;
  -moz-column-gap: 8px;
  column-gap: 8px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-flow: wrap;
  flex-flow: wrap;
  row-gap: 8px;
}
.mx_FontScalingPanel_preview {
  --FontScalingPanel_preview-padding-block: 9px;
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 10px;
  display: flow-root;
  padding: 0 16px 9px;
  padding: 0 16px var(--FontScalingPanel_preview-padding-block) 16px;
  pointer-events: none;
}
.mx_FontScalingPanel_preview.mx_IRCLayout {
  padding-top: 9px;
}
.mx_FontScalingPanel_preview .mx_EventTile[data-layout="bubble"] {
  margin-top: 30px;
}
.mx_FontScalingPanel_preview .mx_EventTile_msgOption {
  display: none;
}
.mx_FontScalingPanel_Dropdown {
  margin-bottom: var(--cpd-space-2x) !important;
  width: 120px;
}
.mx_ImageSizePanel_radios {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: 16px;
}
.mx_ImageSizePanel_radios > label {
  cursor: pointer;
  margin-right: 68px;
}
.mx_ImageSizePanel_radios .mx_ImageSizePanel_size {
  background-color: var(--cpd-color-gray-400);
  height: 148px;
  margin-bottom: 14px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 221px;
  mask-size: 221px;
  width: 221px;
}
.mx_ImageSizePanel_radios
  .mx_ImageSizePanel_size.mx_ImageSizePanel_sizeDefault {
  -webkit-mask: url(../../img/element-icons/settings/img-size-normal.769b56e.svg);
  mask: url(../../img/element-icons/settings/img-size-normal.769b56e.svg);
}
.mx_ImageSizePanel_radios .mx_ImageSizePanel_size.mx_ImageSizePanel_sizeLarge {
  -webkit-mask: url(../../img/element-icons/settings/img-size-large.9c06d67.svg);
  mask: url(../../img/element-icons/settings/img-size-large.9c06d67.svg);
}
.mx_IntegrationManager .mx_Dialog_border {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 70%;
  max-height: none;
  max-width: none;
  width: 60%;
}
.mx_IntegrationManager .mx_Dialog {
  overflow: hidden;
  padding: 0;
}
.mx_IntegrationManager iframe {
  background-color: #fff;
  border: 0;
  height: 100%;
  width: 100%;
}
.mx_IntegrationManager h3 {
  margin-block: 20px;
}
.mx_IntegrationManager .mx_IntegrationManager_error,
.mx_IntegrationManager .mx_IntegrationManager_loading {
  text-align: center;
}
.mx_IntegrationManager .mx_IntegrationManager_error h3 {
  color: var(--cpd-color-text-critical-primary);
}
.mx_JoinRuleSettings_upgradeRequired {
  border: 1px solid var(--cpd-color-text-action-accent);
  border-radius: 8px;
  color: var(--cpd-color-text-action-accent);
  font-size: 0.75rem;
  line-height: 0.9375rem;
  margin-left: 16px;
  padding: 4px 16px;
}
.mx_JoinRuleSettings_spacesWithAccess > h4 {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 0.9375rem;
  text-transform: uppercase;
}
.mx_JoinRuleSettings_spacesWithAccess > span {
  color: var(--cpd-color-text-secondary);
  display: inline-block;
  font: var(--cpd-font-body-md-medium);
  line-height: 32px;
}
.mx_JoinRuleSettings_spacesWithAccess > span .mx_BaseAvatar {
  margin-right: 8px;
}
.mx_JoinRuleSettings_spacesWithAccess > span + span {
  margin-left: 16px;
}
.mx_JoinRuleSettings_radioButton {
  padding-top: 16px;
}
.mx_JoinRuleSettings_radioButton .mx_StyledRadioButton_content {
  color: var(--cpd-color-text-primary);
  display: block;
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.5rem;
  margin-left: 14px;
}
.mx_JoinRuleSettings_radioButton + span {
  color: var(--cpd-color-text-secondary);
  display: inline-block;
  font-size: 0.9375rem;
  line-height: 1.5rem;
  margin-bottom: 16px;
  margin-left: 34px;
}
.mx_JoinRuleSettings_radioButton + span + .mx_StyledRadioButton {
  border-top: 1px solid var(--cpd-color-gray-400);
}
.mx_JoinRuleSettings_labelledCheckbox {
  font: var(--cpd-font-body-md-regular);
  margin-top: var(--cpd-space-2x);
}
.mx_KeyboardShortcut kbd {
  background-color: var(--cpd-color-bg-canvas-default);
  border: 1px solid var(--cpd-color-border-interactive-primary);
  border-radius: 4px;
  -webkit-box-shadow: 0 2px var(--cpd-color-border-interactive-primary);
  box-shadow: 0 2px var(--cpd-color-border-interactive-primary);
  display: inline-block;
  min-width: 20px;
  padding: 5px;
  text-align: center;
  text-transform: capitalize;
}
.mx_LayoutSwitcher_RadioButtons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  color: var(--cpd-color-text-primary);
  -ms-flex-direction: row;
  flex-direction: row;
  gap: 24px;
  width: 100%;
}
.mx_LayoutSwitcher_RadioButtons > .mx_LayoutSwitcher_RadioButton {
  -webkit-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-shrink: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  overflow: hidden;
  -ms-flex-preferred-size: 33%;
  border: 1px solid var(--cpd-color-gray-400);
  border-radius: 10px;
  flex-basis: 100%;
  min-width: 0;
}
@media (max-width: 500px) {
  .mx_UserNotifSettings_grid {
      display: grid;
      grid-template-columns: auto repeat(3, 49px);
      place-items: center center;
      width: calc(100% + 40px);
      grid-gap: 8px;
  }
  .mx_RoomPreviewBar_dialog .mx_RoomPreviewBar_actions {
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    align-content: center;
}
.mx_RoomPreviewBar h3 {
  font-size: 0.825rem;
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_RoomPreviewBar_dialog, .mx_RoomPreviewBar_dialog .mx_RoomPreviewBar_message {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100% !important;
  font-size: 0.57em !important;
}
}
.mx_LayoutSwitcher_RadioButtons
  > .mx_LayoutSwitcher_RadioButton
  .mx_EventTile_msgOption,
.mx_LayoutSwitcher_RadioButtons
  > .mx_LayoutSwitcher_RadioButton
  .mx_MessageActionBar {
  display: none;
}
.mx_LayoutSwitcher_RadioButtons
  > .mx_LayoutSwitcher_RadioButton
  .mx_LayoutSwitcher_RadioButton_preview {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-grow: 1;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 10px;
  pointer-events: none;
}
.mx_LayoutSwitcher_RadioButtons
  > .mx_LayoutSwitcher_RadioButton
  .mx_LayoutSwitcher_RadioButton_preview
  .mx_EventTile[data-layout="bubble"]
  .mx_EventTile_line {
  padding-right: 11px;
}
.mx_LayoutSwitcher_RadioButtons
  > .mx_LayoutSwitcher_RadioButton
  .mx_StyledRadioButton {
  -webkit-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  padding: 10px;
}
.mx_LayoutSwitcher_RadioButtons
  > .mx_LayoutSwitcher_RadioButton
  .mx_EventTile_content {
  margin-right: 0;
}
.mx_LayoutSwitcher_RadioButtons
  > .mx_LayoutSwitcher_RadioButton.mx_LayoutSwitcher_RadioButton_selected {
  border-color: var(--cpd-color-bg-accent-rest);
}
.mx_LayoutSwitcher_RadioButtons .mx_StyledRadioButton {
  border-top: 1px solid var(--cpd-color-gray-400);
}
.mx_LayoutSwitcher_RadioButtons .mx_StyledRadioButton_checked {
  background-color: var(--cpd-color-bg-subtle-secondary);
}
.mx_LayoutSwitcher_RadioButtons .mx_EventTile {
  margin: 0;
}
.mx_LayoutSwitcher_RadioButtons .mx_EventTile[data-layout="bubble"] {
  margin-right: 40px;
  -ms-flex-negative: 1;
  flex-shrink: 1;
}
.mx_LayoutSwitcher_RadioButtons .mx_EventTile[data-layout="irc"] > a {
  display: none;
}
.mx_LayoutSwitcher_RadioButtons .mx_EventTile .mx_EventTile_line {
  max-width: 90%;
}
.mx_NotificationPusherSettings .mx_NotificationPusherSettings_description {
  color: var(--cpd-color-text-primary);
}
.mx_NotificationPusherSettings .mx_NotificationPusherSettings_detail {
  margin-bottom: 12px;
  margin-top: -4px;
}
.mx_NotificationSettings2 .mx_SettingsSection_subSections {
  color: var(--cpd-color-text-primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 32px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_NotificationSettings2 .mx_SettingsSubsection_description {
  margin-bottom: 20px;
}
.mx_NotificationSettings2
  .mx_SettingsSubsection_description
  .mx_SettingsSubsection_text {
  font-size: 1.2rem;
}
.mx_NotificationSettings2
  .mx_SettingsSubsection_description
  .mx_SettingsSubsection_text
  .mx_NotificationBadge {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  margin: 0 2px;
  vertical-align: baseline;
}
.mx_NotificationSettings2 .mx_SettingsSubsection_content {
  margin-top: 12px;
  grid-gap: 12px;
  justify-items: stretch;
  -webkit-box-pack: stretch;
  -ms-flex-pack: stretch;
  justify-content: stretch;
}
.mx_NotificationSettings2 .mx_SettingsBanner {
  margin-bottom: 32px;
}
.mx_NotificationSettings2 .mx_NotificationSettings2_flags {
  grid-gap: 4px;
}
.mx_NotificationSettings2 .mx_StyledRadioButton_content {
  margin-left: 10px;
  margin-right: 10px;
}
.mx_NotificationSettings2 .mx_TagComposer {
  margin-top: 16px;
}
.mx_NotificationSettings2 .mx_TagComposer.mx_TagComposer_disabled {
  opacity: 0.7;
}
.mx_NotificationSettings2 .mx_TagComposer .mx_TagComposer_tags {
  gap: 8px;
  margin-top: 16px;
}
.mx_NotificationSettings2 .mx_TagComposer .mx_TagComposer_tags .mx_Tag {
  background: var(--cpd-color-alpha-gray-300);
  border-radius: 18px;
  margin: 0;
  padding: 6px 12px;
}
.mx_NotificationSettings2
  .mx_TagComposer
  .mx_TagComposer_tags
  .mx_Tag
  .mx_Tag_delete {
  background: var(--cpd-color-gray-800);
  color: #fff;
  -ms-flex-item-align: initial;
  align-self: auto;
}
.mx_UserNotifSettings_grid {
  display: grid;
  grid-template-columns: auto repeat(3, 62px);
  place-items: center center;
  width: calc(100% + 12px);
  grid-gap: 8px;
}
.mx_UserNotifSettings_grid .mx_StyledRadioButton {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_UserNotifSettings_grid .mx_StyledRadioButton .mx_StyledRadioButton_content,
.mx_UserNotifSettings_grid .mx_StyledRadioButton .mx_StyledRadioButton_spacer {
  display: none;
}
.mx_UserNotifSettings_grid .mx_SettingsSubsectionHeading {
  justify-self: start;
}
.mx_UserNotifSettings_gridRow,
.mx_UserNotifSettings_gridRowContainer {
  display: contents;
}
.mx_UserNotifSettings_gridRowLabel {
  float: left;
  justify-self: start;
}
.mx_UserNotifSettings_gridColumnLabel {
  color: var(--cpd-color-text-secondary);
  font: var(--cpd-font-body-sm-semibold);
}
.mx_UserNotifSettings_gridRowError {
  grid-column: 1/-1;
  justify-self: start;
  margin-top: -4px;
  padding-right: 30%;
}
.mx_UserNotifSettings_floatingSection {
  margin-top: 40px;
}
.mx_UserNotifSettings_floatingSection > div:first-child {
  font-size: 1.125rem;
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_UserNotifSettings_floatingSection > table {
  border-collapse: collapse;
  border-spacing: 0;
  margin-top: 8px;
}
.mx_UserNotifSettings_floatingSection > table tr > td:first-child {
  padding-right: 8px;
}
.mx_UserNotifSettings_clearNotifsButton {
  margin-top: 8px;
}
.mx_TagComposer {
  margin-top: 35px;
}
.mx_AccessibleButton.mx_NotificationSound_browse {
  margin-right: 10px;
}
.mx_GeneralUserSettingsTab_section--discovery_existing_verification {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_GeneralUserSettingsTab_section--discovery_existing_verification .mx_Field {
  margin: 0 0 0 1em;
}
.mx_PhoneNumbers_input {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_PhoneNumbers_input > .mx_Field {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
.mx_PhoneNumbers_country {
  width: 80px;
}
.mx_PowerLevelSelector_Button {
  -ms-flex-item-align: start;
  align-self: flex-start;
}
.mx_RoomProfileSettings {
  border-bottom: 1px solid var(--cpd-color-gray-400);
}
.mx_RoomProfileSettings .mx_RoomProfileSettings_profile {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_RoomProfileSettings
  .mx_RoomProfileSettings_profile
  .mx_RoomProfileSettings_profile_controls {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -webkit-margin-end: 54px;
  margin-inline-end: 54px;
}
.mx_RoomProfileSettings
  .mx_RoomProfileSettings_profile
  .mx_RoomProfileSettings_profile_controls
  .mx_Field,
.mx_RoomProfileSettings
  .mx_RoomProfileSettings_profile
  .mx_RoomProfileSettings_profile_controls
  .mx_RoomProfileSettings_profile_controls_topic {
  margin-top: 8px;
}
.mx_RoomProfileSettings
  .mx_RoomProfileSettings_profile
  .mx_RoomProfileSettings_profile_controls
  .mx_RoomProfileSettings_profile_controls_topic
  > textarea {
  font-family: inherit;
  resize: vertical;
}
.mx_RoomProfileSettings
  .mx_RoomProfileSettings_profile
  .mx_RoomProfileSettings_profile_controls
  .mx_RoomProfileSettings_profile_controls_topic.mx_RoomProfileSettings_profile_controls_topic--room
  textarea {
  min-height: 4em;
}
.mx_RoomProfileSettings
  .mx_RoomProfileSettings_profile
  .mx_RoomProfileSettings_profile_controls
  .mx_RoomProfileSettings_profile_controls_userId {
  -webkit-margin-end: 20px;
  margin-inline-end: 20px;
}
.mx_RoomProfileSettings .mx_RoomProfileSettings_buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: var(--cpd-space-4x);
  margin-bottom: 28px;
  margin-top: 10px;
}
.mx_SecureBackupPanel_deviceName {
  font-style: italic;
}
.mx_SecureBackupPanel_buttonRow {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-flow: wrap;
  flex-flow: wrap;
  margin: 1em 0;
  row-gap: 10px;
}
.mx_SecureBackupPanel_buttonRow :nth-child(n + 1) {
  -webkit-margin-end: 10px;
  margin-inline-end: 10px;
}
.mx_SecureBackupPanel_statusList {
  border-spacing: 0;
}
.mx_SecureBackupPanel_statusList th {
  text-align: start;
}
.mx_SecureBackupPanel_statusList td,
.mx_SecureBackupPanel_statusList th {
  padding: 0;
}
.mx_SecureBackupPanel_statusList td:first-of-type,
.mx_SecureBackupPanel_statusList th:first-of-type {
  -webkit-padding-end: 1em;
  padding-inline-end: 1em;
}
.mx_SecureBackupPanel_advanced {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.mx_SetIdServer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 8px;
}
.mx_SetIdServer .mx_Field {
  margin: 0;
  width: 100%;
}
.mx_SetIdServer_tooltip {
  max-width: var(--SettingsTab_tooltip-max-width);
}
.mx_SetIntegrationManager .mx_SettingsFlag {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_SetIntegrationManager
  .mx_SettingsFlag
  .mx_SetIntegrationManager_heading_manager {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-column-gap: 4px;
  -moz-column-gap: 4px;
  column-gap: 4px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.mx_SetIntegrationManager .mx_SettingsFlag .mx_ToggleSwitch {
  -ms-flex-item-align: start;
  align-self: flex-start;
  min-width: var(--ToggleSwitch-min-width);
}
.mx_SettingsFieldset {
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}
.mx_SettingsFieldset_legend {
  color: var(--cpd-color-text-primary);
  display: none;
  font: var(--cpd-font-heading-md-semibold);
  font-weight: var(--cpd-font-weight-semibold);
  margin-bottom: 10px;
  margin-top: 12px;
}
.mx_SettingsFieldset_description {
  display: block;
  margin-bottom: 10px;
  margin-top: 0;
}
.mx_SettingsFieldset_description p {
  margin-bottom: 0;
  margin-top: 10px;
}
.mx_SettingsFieldset_description p:first-child {
  margin: 0;
}
.mx_SettingsFieldset_content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
}
.mx_ExistingSpellCheckLanguage {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_ExistingSpellCheckLanguage_language {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  margin-right: 10px;
}
.mx_GeneralUserSettingsTab_spellCheckLanguageInput {
  margin-bottom: 8px;
}
.mx_ThemeChoicePanel_themeSelectors {
  color: var(--cpd-color-text-primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: none;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.mx_ThemeChoicePanel_themeSelectors > .mx_StyledRadioButton {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: var(--cpd-color-green-200);
  border-radius: 10px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  opacity: 0.4;
  padding: 1rem;
  width: 180px;
  -ms-flex-negative: 1;
  flex-shrink: 1;
  -webkit-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  font-weight: var(--cpd-font-weight-semibold);
  margin-right: 15px;
  margin-top: 10px;
}
.mx_ThemeChoicePanel_themeSelectors > .mx_StyledRadioButton > span {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_ThemeChoicePanel_themeSelectors > .mx_StyledRadioButton_enabled {
  opacity: 1;
}
.mx_ThemeChoicePanel_themeSelectors
  > .mx_StyledRadioButton_enabled.mx_ThemeSelector_light {
  background-color: #f3f8fd;
  color: #2e2f32;
}
.mx_ThemeChoicePanel_themeSelectors
  > .mx_StyledRadioButton_enabled.mx_ThemeSelector_dark {
  background-color: #25282e;
  color: #f3f8fd;
}
.mx_UpdateCheckButton_summary {
  margin-left: 16px;
}
.mx_UserProfileSettings {
  border-bottom: 1px solid var(--cpd-color-gray-400);
}
.mx_UserProfileSettings .mx_UserProfileSettings_profile {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 16px;
  margin-bottom: 20px;
  margin-top: var(--cpd-space-6x);
}
.mx_UserProfileSettings
  .mx_UserProfileSettings_profile
  .mx_UserProfileSettings_profile_displayName {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  width: 100%;
}
.mx_UserProfileSettings .mx_UserProfileSettings_profile_controls {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
.mx_UserProfileSettings .mx_UserProfileSettings_profile_controls_userId {
  width: 100%;
}
.mx_AccessibleButton.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_primary_sm {
  background-color: green !important;
  color: var(--cpd-color-text-on-solid-primary);
}
.mx_UserProfileSettings
  .mx_UserProfileSettings_profile_controls_userId
  .mx_CopyableText {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin-top: var(--cpd-space-1x);
  width: 100%;
}
.mx_UserProfileSettings .mx_UserProfileSettings_profile_controls_userId_label {
  font-size: 15px;
  font-weight: 500;
}
@media (max-width: 500px) {
  .mx_UserProfileSettings_profile {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 30px;
  }
  .mx_ContextualMenu_wrapper 
  .mx_SpaceCreateMenu_wrapper{
    left:0px !important
  }
}

.mx_SettingsBanner {
  background: var(--cpd-color-bg-subtle-primary);
  border-radius: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  padding: 12px 16px;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_SettingsBanner .mx_SettingsBanner_content {
  margin: 0;
}
.mx_SettingsBanner .mx_AccessibleButton {
  white-space: nowrap;
}
.mx_SettingsIndent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-left: 16px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
}
.mx_SettingsSection {
  --SettingsTab_section-margin-bottom-preferences-labs: 30px;
  --SettingsTab_heading_nth_child-margin-top: 30px;
  --SettingsTab_tooltip-max-width: 20px;
  color: var(--cpd-color-text-primary);
}
.mx_SettingsSection a {
  color: var(--cpd-color-text-link-external);
}
.mx_SettingsSection_subSections {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-gap: 32px;
  padding: 16px 0;
}
.mx_SettingsTab {
  --SettingsTab_tooltip-max-width: 120px;
  color: var(--cpd-color-text-primary);
}
.mx_SettingsTab a {
  color: var(--cpd-color-text-link-external);
}
.mx_SettingsTab form {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
.mx_SettingsTab .mx_AccessibleButton {
  -ms-flex-item-align: start;
  align-self: flex-start;
  justify-self: flex-start;
}
.mx_SettingsTab .mx_Field {
  margin: 0;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.mx_SettingsTab_warningText {
  color: var(--cpd-color-text-critical-primary);
}
.mx_SettingsTab_subsectionText {
  color: var(--cpd-color-text-secondary);
  display: block;
  font: var(--cpd-font-body-md-regular);
  margin-top: 10px;
  -webkit-margin-end: 80px;
  margin-inline-end: 80px;
  margin-bottom: 10px;
  -webkit-margin-start: 0;
  margin-inline-start: 0;
}
.mx_SettingsTab_section {
  margin-bottom: 24px;
}
.mx_SettingsTab_section .mx_SettingsFlag {
  -webkit-margin-end: 80px;
  margin-inline-end: 80px;
  margin-bottom: 10px;
}
.mx_SettingsTab_section .mx_SettingsFlag .mx_SettingsFlag_label {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  max-width: calc(100% - 3rem);
  vertical-align: middle;
}
.mx_SettingsTab_section .mx_SettingsFlag .mx_ToggleSwitch {
  float: inline-end;
}
.mx_SettingsTab_section > p {
  -webkit-margin-end: 80px;
  margin-inline-end: 80px;
}
.mx_SettingsTab_section.mx_SettingsTab_subsectionText .mx_SettingsFlag {
  -webkit-margin-end: 0 !important;
  margin-inline-end: 0 !important;
}
.mx_SettingsTab_toggleWithDescription {
  margin-top: 24px;
}
.mx_SettingsTab_sections {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 32px;
  padding-bottom: 16px;
}
.mx_NotificationSettingsTab_notificationsSection {
  width: 360px;
}
.mx_NotificationSettingsTab_notificationsSection .mx_StyledRadioButton {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  color: var(--cpd-color-text-primary);
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.125rem;
  margin-top: 16px;
  padding-left: 8px;
  position: relative;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_NotificationSettingsTab_notificationsSection .mx_StyledRadioButton:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 24px;
  left: 0;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  width: 24px;
}
.mx_NotificationSettingsTab_notificationsSection
  .mx_StyledRadioButton
  input
  + div {
  margin-top: 8px;
}
.mx_NotificationSettingsTab_notificationsSection
  .mx_StyledRadioButton
  .mx_NotificationSettingsTab_microCopy {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 0.9375rem;
  margin-right: 32px;
}
.mx_NotificationSettingsTab_notificationsSection
  .mx_NotificationSettingsTab_defaultEntry:before {
  -webkit-mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
  mask-image: url(../../img/element-icons/notifications.988ddb0.svg);
}
.mx_NotificationSettingsTab_notificationsSection
  .mx_NotificationSettingsTab_allMessagesEntry:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/notifications-default.63a2b44.svg);
  mask-image: url(../../img/element-icons/roomlist/notifications-default.63a2b44.svg);
}
.mx_NotificationSettingsTab_notificationsSection
  .mx_NotificationSettingsTab_mentionsKeywordsEntry:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/notifications-dm.6739542.svg);
  mask-image: url(../../img/element-icons/roomlist/notifications-dm.6739542.svg);
}
.mx_NotificationSettingsTab_notificationsSection
  .mx_NotificationSettingsTab_noneEntry:before {
  -webkit-mask-image: url(../../img/element-icons/roomlist/notifications-off.0b8adcc.svg);
  mask-image: url(../../img/element-icons/roomlist/notifications-off.0b8adcc.svg);
}
input[type="file"].mx_NotificationSound_soundUpload {
  display: none;
}
.mx_PeopleRoomSettingsTab_knock {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: var(--cpd-space-2x);
}
.mx_PeopleRoomSettingsTab_content {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  margin: 0 var(--cpd-space-4x);
}
.mx_PeopleRoomSettingsTab_avatar {
  -ms-flex-item-align: start;
  align-self: flex-start;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_PeopleRoomSettingsTab_name {
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_PeopleRoomSettingsTab_timestamp {
  color: var(--cpd-color-text-secondary);
  margin-left: var(--cpd-space-1x);
}
.mx_PeopleRoomSettingsTab_userId {
  color: var(--cpd-color-text-secondary);
  display: block;
  font-size: var(--cpd-font-size-body-sm);
}
.mx_PeopleRoomSettingsTab_seeMoreOrLess {
  margin: var(--cpd-space-3x) 0 0;
}
.mx_PeopleRoomSettingsTab_action {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_PeopleRoomSettingsTab_action + .mx_PeopleRoomSettingsTab_action {
  margin-left: var(--cpd-space-3x);
}
.mx_PeopleRoomSettingsTab_paragraph {
  margin: 0;
}
.mx_RolesRoomSettingsTab_bannedList {
  margin-bottom: 0;
}
.mx_RolesRoomSettingsTab_unbanBtn {
  margin-bottom: 5px;
  margin-right: 10px;
}
.mx_SecurityRoomSettingsTab_advancedSection {
  margin-top: 16px;
}
.mx_SecurityRoomSettingsTab_warning {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-column-gap: 4px;
  -moz-column-gap: 4px;
  column-gap: 4px;
}
.mx_Field.mx_AppearanceUserSettingsTab_checkboxControlledField {
  width: 256px;
  -webkit-margin-start: calc(1rem + 10px);
  margin-inline-start: calc(1rem + 10px);
}
.mx_GeneralUserSettingsTab_section--discovery_existing {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_GeneralUserSettingsTab_section--discovery_existing_address,
.mx_GeneralUserSettingsTab_section--discovery_existing_promptText {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  margin-right: 10px;
}
.mx_GeneralUserSettingsTab_section--discovery_existing_button {
  margin-left: 5px;
}
.mx_GeneralUserSettingsTab_warningIcon {
  margin-bottom: 2px;
  margin-right: 8px;
  vertical-align: middle;
}
.mx_HelpUserSettingsTab_accessTokenDetails {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.mx_KeyboardShortcut_shortcutList {
  display: grid;
  margin: 0;
  padding: 0;
  width: 100%;
  grid-gap: 4px;
}
.mx_KeyboardShortcut,
.mx_KeyboardShortcut_shortcutRow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_KeyboardShortcut_shortcutRow {
  -webkit-column-gap: 8px;
  -moz-column-gap: 8px;
  column-gap: 8px;
}
.mx_KeyboardShortcut {
  -webkit-column-gap: 4px;
  -moz-column-gap: 4px;
  column-gap: 4px;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
}
.mx_MjolnirUserSettingsTab_listItem {
  margin-bottom: 2px;
}
.mx_SecurityUserSettingsTab_bulkOptions {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-column-gap: 8px;
  -moz-column-gap: 8px;
  column-gap: 8px;
  -ms-flex-direction: row;
  flex-direction: row;
}
.mx_SecurityUserSettingsTab_ignoredUser {
  margin-bottom: 4px;
}
.mx_SecurityUserSettingsTab_ignoredUser .mx_AccessibleButton {
  margin-right: 8px;
}
.mx_SecurityUserSettingsTab_warning {
  color: var(--cpd-color-text-critical-primary);
  padding-left: 40px;
  position: relative;
}
.mx_SecurityUserSettingsTab_warning:before {
  background-color: var(--cpd-color-text-critical-primary);
  content: "";
  height: 1.5rem;
  left: 0;
  -webkit-mask-image: url(../../img/feather-customised/alert-triangle.86506d9.svg);
  mask-image: url(../../img/feather-customised/alert-triangle.86506d9.svg);
  -webkit-mask-position: 0 center;
  mask-position: 0 center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 1.5rem;
  mask-size: 1.5rem;
  position: absolute;
  top: 0;
  width: 1.5rem;
}
.mx_SidebarUserSettingsTab_homeAllRoomsCheckbox {
  margin-left: 24px;
}
.mx_SidebarUserSettingsTab_homeAllRoomsCheckbox + div {
  margin-left: 48px;
}
.mx_SidebarUserSettingsTab_checkbox {
  margin-bottom: 8px;
}
.mx_SidebarUserSettingsTab_checkbox label {
  -webkit-box-align: start !important;
  -ms-flex-align: start !important;
  align-items: flex-start !important;
}
.mx_SidebarUserSettingsTab_checkbox svg {
  height: 16px;
  margin-bottom: -1px;
  margin-right: 8px;
  width: 16px;
}
.mx_SpaceBasicSettings .mx_Field {
  margin: 24px 0;
}
.mx_SpaceBasicSettings .mx_SpaceBasicSettings_avatarContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 24px;
}
.mx_SpaceBasicSettings
  .mx_SpaceBasicSettings_avatarContainer
  .mx_SpaceBasicSettings_avatar {
  background-color: var(--cpd-color-gray-800);
  border-radius: 16px;
  height: 80px;
  position: relative;
  width: 80px;
}
.mx_SpaceBasicSettings
  .mx_SpaceBasicSettings_avatarContainer
  img.mx_SpaceBasicSettings_avatar {
  border-radius: 16px;
  height: 80px;
  -o-object-fit: cover;
  object-fit: cover;
  width: 80px;
}
.mx_SpaceBasicSettings
  .mx_SpaceBasicSettings_avatarContainer
  div.mx_SpaceBasicSettings_avatar {
  cursor: pointer;
}
.mx_SpaceBasicSettings
  .mx_SpaceBasicSettings_avatarContainer
  div.mx_SpaceBasicSettings_avatar:before {
  background-color: #fff;
  content: "";
  height: 80px;
  left: 0;
  -webkit-mask-image: url(../../img/element-icons/camera.d1d1927.svg);
  mask-image: url(../../img/element-icons/camera.d1d1927.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  position: absolute;
  top: 0;
  width: 80px;
}
.mx_SpaceBasicSettings
  .mx_SpaceBasicSettings_avatarContainer
  > input[type="file"] {
  display: none;
}
.mx_SpaceBasicSettings
  .mx_SpaceBasicSettings_avatarContainer
  > .mx_AccessibleButton_kind_link {
  color: var(--cpd-color-text-link-external);
  display: inline-block;
  font: var(--cpd-font-body-md-regular);
  margin: auto 18px;
}
.mx_SpaceBasicSettings
  .mx_SpaceBasicSettings_avatarContainer
  > .mx_SpaceBasicSettings_avatar_remove {
  color: var(--cpd-color-text-critical-primary);
}
.mx_SpaceBasicSettings .mx_AccessibleButton_hasKind {
  display: block;
  margin-left: auto;
  width: -webkit-min-content;
  width: -moz-min-content;
  width: min-content;
}
.mx_SpaceBasicSettings .mx_AccessibleButton_disabled {
  cursor: not-allowed;
}
.mx_SpaceChildrenPicker {
  margin: 16px 0;
}
.mx_SpaceChildrenPicker .mx_StyledRadioButton + .mx_StyledRadioButton {
  margin-top: 16px;
}
.mx_SpaceChildrenPicker .mx_SearchBox {
  margin: 0 0 15px;
  -webkit-box-flex: 0;
  -ms-flex-positive: 0;
  border-radius: 8px;
  flex-grow: 0;
}
.mx_SpaceChildrenPicker .mx_SpaceChildrenPicker_noResults {
  display: block;
  margin-top: 24px;
}
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu_background {
  background-color: #030c1b4d;
  left: 68px;
  opacity: 0.6;
}
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu {
  background-color: var(--cpd-color-bg-canvas-default);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 24px;
  position: relative;
  width: 480px;
}
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu > div > h2 {
  font-size: 1.125rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin-top: 4px;
}
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu > div > p {
  color: var(--cpd-color-text-secondary);
  font-size: 0.9375rem;
}
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenuType {
  border: 1px solid #e7e7e7;
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 1.0625rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin: 20px 0;
  padding: 16px 32px 16px 72px;
  position: relative;
  width: 432px;
}
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenuType > div {
  color: var(--cpd-color-text-secondary);
  font-size: 0.9375rem;
  font-weight: 400;
  margin-top: 4px;
}
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenuType:before {
  background-color: var(--cpd-color-gray-800);
  content: "";
  height: 24px;
  left: 20px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 24px;
  mask-size: 24px;
  position: absolute;
  top: 27px;
  width: 24px;
}
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenuType:hover {
  border-color: var(--cpd-color-bg-interactive-primary-rest);
}
.mx_SpaceCreateMenu_wrapper
  .mx_ContextualMenu
  .mx_SpaceCreateMenuType:hover:before {
  background-color: var(--cpd-color-icon-primary);
}
.mx_SpaceCreateMenu_wrapper
  .mx_ContextualMenu
  .mx_SpaceCreateMenuType:hover
  > span {
  color: var(--cpd-color-text-primary);
}
.mx_SpaceCreateMenu_wrapper
  .mx_ContextualMenu
  .mx_SpaceCreateMenuType_public:before {
  -webkit-mask-image: url(../../img/globe.0408a7a.svg);
  mask-image: url(../../img/globe.0408a7a.svg);
}
.mx_SpaceCreateMenu_wrapper
  .mx_ContextualMenu
  .mx_SpaceCreateMenuType_private:before {
  -webkit-mask-image: url(../../img/element-icons/lock.998ae1f.svg);
  mask-image: url(../../img/element-icons/lock.998ae1f.svg);
  -webkit-mask-size: 18px;
  mask-size: 18px;
}
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenu_back {
  background-color: var(--cpd-color-alpha-gray-300);
  border-radius: 14px;
  height: 28px;
  margin-bottom: 12px;
  position: relative;
  width: 28px;
}
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenu_back:before {
  background-color: var(--cpd-color-gray-800);
  content: "";
  height: 28px;
  left: 0;
  -webkit-mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  -webkit-mask-position: 2px 3px;
  mask-position: 2px 3px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 24px;
  mask-size: 24px;
  position: absolute;
  top: 0;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  width: 28px;
}
.mx_SpaceCreateMenu_wrapper
  .mx_ContextualMenu
  .mx_AccessibleButton_kind_primary {
  display: block;
  margin-left: auto;
  padding: 8px 22px;
  width: -webkit-min-content;
  width: -moz-min-content;
  width: min-content;
}
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_AccessibleButton_disabled {
  cursor: not-allowed;
}
.mx_SpacePublicShare .mx_AccessibleButton {
  border: 1px solid #e7e7e7;
  border-radius: 8px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 1.0625rem;
  font-weight: var(--cpd-font-weight-semibold);
  margin: 20px 0;
  padding: 16px 32px 16px 72px;
  position: relative;
  width: 432px;
}
.mx_SpacePublicShare .mx_AccessibleButton > div {
  color: var(--cpd-color-text-secondary);
  font-size: 0.9375rem;
  font-weight: 400;
  margin-top: 4px;
}
.mx_SpacePublicShare .mx_AccessibleButton:before {
  background-color: var(--cpd-color-gray-800);
  content: "";
  height: 24px;
  left: 20px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 24px;
  mask-size: 24px;
  position: absolute;
  top: 27px;
  width: 24px;
}
.mx_SpacePublicShare .mx_AccessibleButton:hover {
  border-color: var(--cpd-color-bg-interactive-primary-rest);
}
.mx_SpacePublicShare .mx_AccessibleButton:hover:before {
  background-color: var(--cpd-color-icon-primary);
}
.mx_SpacePublicShare .mx_AccessibleButton:hover > span {
  color: var(--cpd-color-text-primary);
}
.mx_SpacePublicShare
  .mx_AccessibleButton.mx_SpacePublicShare_shareButton:before {
  -webkit-mask-image: url(../../img/element-icons/link.e24e5a8.svg);
  mask-image: url(../../img/element-icons/link.e24e5a8.svg);
}
.mx_SpacePublicShare
  .mx_AccessibleButton.mx_SpacePublicShare_inviteButton:before {
  -webkit-mask-image: url(../../img/element-icons/room/invite.440bc20.svg);
  mask-image: url(../../img/element-icons/room/invite.440bc20.svg);
}
.mx_InlineTermsAgreement_cbContainer {
  font: var(--cpd-font-body-md-regular);
  margin-bottom: 10px;
}
.mx_InlineTermsAgreement_cbContainer a {
  color: var(--cpd-color-text-action-accent);
  text-decoration: none;
}
.mx_InlineTermsAgreement_cbContainer .mx_InlineTermsAgreement_checkbox {
  margin-top: 10px;
}
.mx_InlineTermsAgreement_cbContainer .mx_InlineTermsAgreement_checkbox input {
  vertical-align: text-bottom;
}
.mx_InlineTermsAgreement_link {
  background-color: var(--cpd-color-text-action-accent);
  display: inline-block;
  height: 12px;
  margin-left: 3px;
  -webkit-mask-image: url(../../img/external-link.8197a77.svg);
  mask-image: url(../../img/external-link.8197a77.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  vertical-align: middle;
  width: 12px;
}
.mx_AnalyticsToast .mx_AccessibleButton_kind_danger_outline,
.mx_AnalyticsToast .mx_AccessibleButton_kind_primary {
  background-color: var(--cpd-color-text-action-accent);
  border: 1px solid var(--cpd-color-text-action-accent);
  color: #fff;
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_IncomingCallToast {
  position: relative;
  -webkit-box-orient: horizontal;
  -ms-flex-direction: row;
  flex-direction: row;
  pointer-events: auto;
  width: 250px;
}
.mx_IncomingCallToast,
.mx_IncomingCallToast .mx_IncomingCallToast_content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
}
.mx_IncomingCallToast .mx_IncomingCallToast_content {
  -webkit-box-orient: vertical;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-left: 8px;
  overflow: hidden;
  width: 100%;
}
.mx_IncomingCallToast .mx_IncomingCallToast_content .mx_IncomingCallToast_info {
  margin-bottom: 16px;
}
.mx_IncomingCallToast
  .mx_IncomingCallToast_content
  .mx_IncomingCallToast_info
  .mx_IncomingCallToast_room {
  display: inline-block;
  font-size: 0.9375rem;
  font-weight: var(--cpd-font-weight-semibold);
  line-height: 1.5rem;
  margin-bottom: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: calc(100% - 24px);
}
.mx_IncomingCallToast
  .mx_IncomingCallToast_content
  .mx_IncomingCallToast_info
  .mx_IncomingCallToast_message {
  font-size: 0.75rem;
  line-height: 0.9375rem;
  margin-bottom: 4px;
}
.mx_IncomingCallToast
  .mx_IncomingCallToast_content
  .mx_IncomingCallToast_info
  .mx_LiveContentSummary {
  font-size: 0.75rem;
  line-height: 0.9375rem;
}
.mx_IncomingCallToast
  .mx_IncomingCallToast_content
  .mx_IncomingCallToast_info
  .mx_LiveContentSummary
  .mx_LiveContentSummary_participants:before {
  height: 15px;
  width: 15px;
}
.mx_IncomingCallToast
  .mx_IncomingCallToast_content
  .mx_IncomingCallToast_joinButton {
  bottom: 4px;
  position: relative;
  right: 4px;
  -ms-flex-item-align: end;
  align-self: flex-end;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 1.5rem;
  min-width: 120px;
  padding: 4px 0;
}
.mx_IncomingCallToast .mx_IncomingCallToast_closeButton {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 16px;
  position: absolute;
  right: 4px;
  top: 4px;
  width: 16px;
}
.mx_IncomingCallToast .mx_IncomingCallToast_closeButton:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: inherit;
  -webkit-mask-image: url(../../img/cancel.f8ee58c.svg);
  mask-image: url(../../img/cancel.f8ee58c.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  width: inherit;
}
.mx_IncomingLegacyCallToast {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  pointer-events: auto;
}
.mx_IncomingLegacyCallToast .mx_IncomingLegacyCallToast_content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-left: 8px;
}
.mx_IncomingLegacyCallToast
  .mx_IncomingLegacyCallToast_content
  .mx_LegacyCallEvent_caller {
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1.125rem;
  margin-right: 6px;
  margin-top: 2px;
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_IncomingLegacyCallToast
  .mx_IncomingLegacyCallToast_content
  .mx_LegacyCallEvent_type {
  color: var(--cpd-color-gray-800);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 0.75rem;
  line-height: 0.9375rem;
  margin-bottom: 6px;
  margin-top: 4px;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_IncomingLegacyCallToast
  .mx_IncomingLegacyCallToast_content
  .mx_LegacyCallEvent_type
  .mx_LegacyCallEvent_type_icon {
  height: 16px;
  margin-right: 6px;
  width: 16px;
}
.mx_IncomingLegacyCallToast
  .mx_IncomingLegacyCallToast_content
  .mx_LegacyCallEvent_type
  .mx_LegacyCallEvent_type_icon:before {
  background-color: var(--cpd-color-gray-800);
  content: "";
  height: inherit;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  width: inherit;
}
.mx_IncomingLegacyCallToast
  .mx_IncomingLegacyCallToast_content.mx_IncomingLegacyCallToast_content_voice
  .mx_IncomingLegacyCallToast_buttons
  .mx_IncomingLegacyCallToast_button_accept
  span:before,
.mx_IncomingLegacyCallToast
  .mx_IncomingLegacyCallToast_content.mx_IncomingLegacyCallToast_content_voice
  .mx_LegacyCallEvent_type
  .mx_LegacyCallEvent_type_icon:before {
  -webkit-mask-image: url(../../img/element-icons/call/voice-call.85002aa.svg);
  mask-image: url(../../img/element-icons/call/voice-call.85002aa.svg);
}
.mx_IncomingLegacyCallToast
  .mx_IncomingLegacyCallToast_content.mx_IncomingLegacyCallToast_content_video
  .mx_IncomingLegacyCallToast_buttons
  .mx_IncomingLegacyCallToast_button_accept
  span:before,
.mx_IncomingLegacyCallToast
  .mx_IncomingLegacyCallToast_content.mx_IncomingLegacyCallToast_content_video
  .mx_LegacyCallEvent_type
  .mx_LegacyCallEvent_type_icon:before {
  -webkit-mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
  mask-image: url(../../img/element-icons/call/video-call.515f9f9.svg);
}
.mx_IncomingLegacyCallToast
  .mx_IncomingLegacyCallToast_content
  .mx_IncomingLegacyCallToast_buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 8px;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: 12px;
}
.mx_IncomingLegacyCallToast
  .mx_IncomingLegacyCallToast_content
  .mx_IncomingLegacyCallToast_buttons
  .mx_IncomingLegacyCallToast_button {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-weight: var(--cpd-font-weight-semibold);
  height: 1.5rem;
  line-height: 1.5rem;
  margin-right: 0;
}
.mx_IncomingLegacyCallToast
  .mx_IncomingLegacyCallToast_content
  .mx_IncomingLegacyCallToast_buttons
  .mx_IncomingLegacyCallToast_button
  span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_IncomingLegacyCallToast
  .mx_IncomingLegacyCallToast_content
  .mx_IncomingLegacyCallToast_buttons
  .mx_IncomingLegacyCallToast_button
  span:before {
  background-color: var(--cpd-color-bg-canvas-default);
  content: "";
  display: inline-block;
  margin-right: 8px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
.mx_IncomingLegacyCallToast
  .mx_IncomingLegacyCallToast_content
  .mx_IncomingLegacyCallToast_buttons
  .mx_IncomingLegacyCallToast_button {
  padding: 0 8px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  font-size: 0.9375rem;
}
.mx_IncomingLegacyCallToast
  .mx_IncomingLegacyCallToast_content
  .mx_IncomingLegacyCallToast_buttons
  .mx_IncomingLegacyCallToast_button
  span {
  padding: 8px 0;
}
.mx_IncomingLegacyCallToast
  .mx_IncomingLegacyCallToast_content
  .mx_IncomingLegacyCallToast_buttons
  .mx_IncomingLegacyCallToast_button.mx_IncomingLegacyCallToast_button_accept
  span:before {
  height: 13px;
  -webkit-mask-size: 13px;
  mask-size: 13px;
  width: 13px;
}
.mx_IncomingLegacyCallToast
  .mx_IncomingLegacyCallToast_content
  .mx_IncomingLegacyCallToast_buttons
  .mx_IncomingLegacyCallToast_button.mx_IncomingLegacyCallToast_button_decline
  span:before {
  height: 16px;
  -webkit-mask-image: url(../../img/element-icons/call/hangup.a9876fc.svg);
  mask-image: url(../../img/element-icons/call/hangup.a9876fc.svg);
  -webkit-mask-size: 16px;
  mask-size: 16px;
  width: 16px;
}
.mx_IncomingLegacyCallToast .mx_IncomingLegacyCallToast_iconButton {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 20px;
  width: 20px;
}
.mx_IncomingLegacyCallToast .mx_IncomingLegacyCallToast_iconButton:before {
  background-color: var(--cpd-color-gray-800);
  content: "";
  height: inherit;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  width: inherit;
}
.mx_IncomingLegacyCallToast .mx_IncomingLegacyCallToast_silence:before {
  -webkit-mask-image: url(../../img/voip/silence.fff021d.svg);
  mask-image: url(../../img/voip/silence.fff021d.svg);
}
.mx_IncomingLegacyCallToast .mx_IncomingLegacyCallToast_unSilence:before {
  -webkit-mask-image: url(../../img/voip/un-silence.fd94a16.svg);
  mask-image: url(../../img/voip/un-silence.fd94a16.svg);
}
.mx_NonUrgentEchoFailureToast .mx_NonUrgentEchoFailureToast_icon {
  background-color: #fff;
  display: inline-block;
  height: 1.125rem;
  margin-right: 8px;
  -webkit-mask-image: url(../../img/element-icons/cloud-off.97663f7.svg);
  mask-image: url(../../img/element-icons/cloud-off.97663f7.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  width: 1.125rem;
}
.mx_NonUrgentEchoFailureToast span {
  vertical-align: middle;
}
.mx_Heading_h1,
.mx_Heading_h2,
.mx_Heading_h3,
.mx_Heading_h4 {
  margin-block: unset;
  margin-inline: unset;
  display: none;
}
.mx_Heading_h1 {
  font: var(--cpd-font-heading-xl-semibold);
}
.mx_Heading_h2 {
  font: var(--cpd-font-heading-lg-semibold);
}
.mx_Heading_h3 {
  font: var(--cpd-font-heading-md-semibold);
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_Heading_h4 {
  font: var(--cpd-font-heading-sm-semibold);
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_UserOnboardingButton {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-line-pack: stretch;
  align-content: stretch;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  border-radius: 8px;
  margin: 8px 8px 0;
  padding: 12px;
}
.mx_UserOnboardingButton.mx_UserOnboardingButton_selected,
.mx_UserOnboardingButton:focus-within,
.mx_UserOnboardingButton:hover {
  background-color: var(--cpd-color-alpha-gray-300);
}
.mx_UserOnboardingButton .mx_UserOnboardingButton_content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: 5px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_UserOnboardingButton .mx_UserOnboardingButton_content .mx_Heading_h4 {
  color: var(--cpd-color-text-primary);
  font: var(--cpd-font-body-md-regular);
  margin-right: auto;
}
.mx_UserOnboardingButton
  .mx_UserOnboardingButton_content
  .mx_UserOnboardingButton_percentage {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
}
.mx_UserOnboardingButton
  .mx_UserOnboardingButton_content
  .mx_UserOnboardingButton_close {
  border: 1px solid var(--cpd-color-text-secondary);
  border-radius: 7px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 14px;
  position: relative;
  width: 14px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.mx_UserOnboardingButton
  .mx_UserOnboardingButton_content
  .mx_UserOnboardingButton_close:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  height: 7px;
  left: 50%;
  -webkit-mask-image: url(../../img/element-icons/cancel-rounded.ede6a2d.svg);
  mask-image: url(../../img/element-icons/cancel-rounded.ede6a2d.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 7px;
}
.mx_UserOnboardingButton .mx_ProgressBar {
  background: var(--cpd-color-bg-canvas-default);
  margin-top: 8px;
  width: auto;
}
.mx_UserOnboardingButton.mx_UserOnboardingButton_completed .mx_ProgressBar {
  display: none;
}

@media (max-width: 1280px) {
  .mx_UserOnboardingHeader {
    margin: 32px;
    display: flex;
    flex-direction: column-reverse;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
}
}
.mx_UserOnboardingHeader .mx_UserOnboardingHeader_dot {
  color: var(--cpd-color-text-action-accent);
}
.mx_UserOnboardingHeader .mx_UserOnboardingHeader_content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-preferred-size: 50%;
  flex-basis: 50%;
  -ms-flex-negative: 1;
  flex-shrink: 1;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  gap: 24px;
  margin-right: auto;
  min-width: 0;
  align-content: center;
  justify-content: center;
  align-items: center;
}
.mx_UserOnboardingHeader .mx_UserOnboardingHeader_content p {
  margin: 0;
}
.mx_UserOnboardingHeader .mx_UserOnboardingHeader_content .mx_AccessibleButton {
  margin-top: auto;
  -ms-flex-item-align: start;
  align-self: flex-start;
  padding: 12px 24px;
}
.mx_UserOnboardingHeader .mx_UserOnboardingHeader_image {
  -ms-flex-preferred-size: 30%;
  flex-basis: 30%;
  -ms-flex-negative: 1;
  flex-shrink: 1;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -ms-flex-item-align: center;
  align-self: center;
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-fill-mode: backwards;
  animation-fill-mode: backwards;
  -webkit-animation-name: mx_UserOnboardingHeader_slideInLong;
  animation-name: mx_UserOnboardingHeader_slideInLong;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
  aspect-ratio: 4/3;
  height: calc(100% + 128px);
  margin-bottom: -64px;
  margin-top: -64px;
  min-height: 0;
  min-width: 0;
  -o-object-fit: contain;
  object-fit: contain;
  will-change: opacity, transform;
}
@-webkit-keyframes mx_UserOnboardingHeader_slideIn {
  0% {
    opacity: 0;
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}
@keyframes mx_UserOnboardingHeader_slideIn {
  0% {
    opacity: 0;
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}
@-webkit-keyframes mx_UserOnboardingHeader_slideInLong {
  0% {
    -webkit-transform: translateY(32px);
    transform: translateY(32px);
  }
  to {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}
@keyframes mx_UserOnboardingHeader_slideInLong {
  0% {
    -webkit-transform: translateY(32px);
    transform: translateY(32px);
  }
  to {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}
.mx_UserOnboardingList {
  -webkit-box-orient: vertical;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-fill-mode: backwards;
  animation-fill-mode: backwards;
  -webkit-animation-name: mx_UserOnboardingList_slideIn;
  animation-name: mx_UserOnboardingList_slideIn;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
  -ms-flex-direction: column;
  flex-direction: column;
  margin: 0 32px;
  will-change: opacity;
}
.mx_UserOnboardingList{
  display: none !important;
}
.mx_UserOnboardingList,
.mx_UserOnboardingList .mx_UserOnboardingList_header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
}
.mx_UserOnboardingList .mx_UserOnboardingList_header {
  -webkit-box-orient: horizontal;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: 12px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_UserOnboardingList
  .mx_UserOnboardingList_header
  .mx_UserOnboardingList_hint {
  color: var(--cpd-color-text-secondary);
}
.mx_UserOnboardingList .mx_UserOnboardingList_progress {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  counter-reset: user-onboarding;
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_UserOnboardingList .mx_UserOnboardingList_progress .mx_ProgressBar {
  border-radius: 16px;
  height: 16px;
  margin-top: 16px;
  width: auto;
}
.mx_UserOnboardingList
  .mx_UserOnboardingList_progress
  .mx_ProgressBar::-moz-progress-bar {
  border-radius: 16px;
}
.mx_UserOnboardingList
  .mx_UserOnboardingList_progress
  .mx_ProgressBar::-webkit-progress-bar,
.mx_UserOnboardingList
  .mx_UserOnboardingList_progress
  .mx_ProgressBar::-webkit-progress-value {
  border-radius: 16px;
}
.mx_UserOnboardingList .mx_UserOnboardingList_list {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: grid;
  grid-template-columns: -webkit-max-content 1fr -webkit-max-content;
  grid-template-columns: max-content 1fr max-content;
  list-style: none;
  margin: 32px 0 0;
  padding: 0;
  grid-gap: 24px;
}
@-webkit-keyframes mx_UserOnboardingList_slideIn {
  0% {
    opacity: 0;
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}
@keyframes mx_UserOnboardingList_slideIn {
  0% {
    opacity: 0;
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}
.mx_UserOnboardingPage {
  height: 100%;
  width: 100%;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 64px;
  align-content: center;
  justify-content: center;
  align-items: center;
}

.mx_UserOnboardingTask {
  display: contents;
}
.mx_UserOnboardingTask .mx_UserOnboardingTask_number {
  align-self: center;
  border: 2px solid var(--cpd-color-gray-400);
  border-radius: 32px;
  color: var(--cpd-color-text-secondary);
  counter-increment: user-onboarding;
  grid-column: 1;
  height: 32px;
  line-height: 32px;
  position: relative;
  text-align: center;
  width: 32px;
}
.mx_UserOnboardingTask .mx_UserOnboardingTask_number:before {
  content: counter(user-onboarding);
}
.mx_UserOnboardingTask .mx_UserOnboardingTask_content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  grid-column: 2;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -ms-flex-negative: 1;
  flex-shrink: 1;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.mx_UserOnboardingTask
  .mx_UserOnboardingTask_content
  .mx_UserOnboardingTask_description {
  font-size: 0.75rem;
}
.mx_UserOnboardingTask .mx_UserOnboardingTask_action.mx_AccessibleButton {
  grid-column: 3;
  min-width: 180px;
}
@media (max-width: 800px) {
  .mx_UserOnboardingTask .mx_UserOnboardingTask_action.mx_AccessibleButton {
    grid-column: 2;
    margin-top: -16px;
  }
}
.mx_UserOnboardingTask.mx_UserOnboardingTask_completed
  .mx_UserOnboardingTask_number:before {
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-name: mx_UserOnboardingTask_spring;
  animation-name: mx_UserOnboardingTask_spring;
  background: var(--cpd-color-icon-accent-tertiary);
  border-radius: 32px;
  content: "";
  inset: -2px;
  position: absolute;
  will-change: opacity, transform;
}
.mx_UserOnboardingTask.mx_UserOnboardingTask_completed
  .mx_UserOnboardingTask_number:after {
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-name: mx_UserOnboardingTask_spring;
  animation-name: mx_UserOnboardingTask_spring;
  background-color: var(--cpd-color-icon-on-solid-primary);
  content: "";
  height: 16px;
  left: calc(50% - 8px);
  -webkit-mask-image: url(../../img/element-icons/check-white.9400525.svg);
  mask-image: url(../../img/element-icons/check-white.9400525.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  top: calc(50% - 8px);
  width: 16px;
  will-change: opacity, transform;
}
.mx_UserOnboardingTask.mx_UserOnboardingTask_completed
  .mx_UserOnboardingTask_content {
  opacity: 0.6;
}
@-webkit-keyframes mx_UserOnboardingTask_spring {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.6);
    transform: scale(0.6);
  }
  50% {
    opacity: 1;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  to {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes mx_UserOnboardingTask_spring {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.6);
    transform: scale(0.6);
  }
  50% {
    opacity: 1;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  to {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.mx_VerificationShowSas_decimalSas {
  font-weight: 700;
  padding-left: 3px;
  padding-right: 3px;
  text-align: center;
}
.mx_VerificationShowSas_decimalSas span {
  margin-left: 5px;
  margin-right: 5px;
}
.mx_VerificationShowSas_emojiSas {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  text-align: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin: 25px 0;
}
.mx_VerificationShowSas_emojiSas_block {
  display: inline-block;
  margin-bottom: 16px;
  position: relative;
  width: 52px;
}
.mx_AuthPage_modal .mx_VerificationShowSas_emojiSas_block,
.mx_Dialog .mx_VerificationShowSas_emojiSas_block {
  width: 60px;
}
.mx_VerificationShowSas_emojiSas_emoji {
  font-family: Twemoji, var(--cpd-font-family-sans);
  font-size: 2rem;
}
.mx_VerificationShowSas_emojiSas_label {
  font-size: 0.75rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_VerificationShowSas_emojiSas_break {
  -ms-flex-preferred-size: 100%;
  flex-basis: 100%;
}
.mx_VerificationShowSas_buttonRow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  text-align: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  gap: 9px;
  justify-content: center;
}
[data-whatinput="mouse"]
  .mx_LegacyCallViewButtons.mx_LegacyCallViewButtons_hidden {
  opacity: 0.001;
  pointer-events: none;
}
.mx_LegacyCallViewButtons {
  --LegacyCallViewButtons_dropdownButton-size: 16px;
  bottom: 32px;
  gap: 18px;
  opacity: 1;
  position: absolute;
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
  z-index: 200;
}
.mx_LegacyCallViewButtons,
.mx_LegacyCallViewButtons .mx_LegacyCallViewButtons_button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_LegacyCallViewButtons .mx_LegacyCallViewButtons_button {
  background-color: var(--cpd-color-bg-canvas-default);
  border-radius: 100%;
  cursor: pointer;
  height: 40px;
  width: 40px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-shadow: 0 4px 4px 0 #00000026;
  box-shadow: 0 4px 4px 0 #00000026;
  position: relative;
}
.mx_LegacyCallViewButtons .mx_LegacyCallViewButtons_button:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  display: inline-block;
  height: 24px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  width: 24px;
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_dropdownButton {
  bottom: 0;
  height: var(--LegacyCallViewButtons_dropdownButton-size);
  position: absolute;
  right: 0;
  width: var(--LegacyCallViewButtons_dropdownButton-size);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_dropdownButton:before {
  height: 14px;
  -webkit-mask-image: url(../../img/element-icons/message/chevron-up.0f9ac6f.svg);
  mask-image: url(../../img/element-icons/message/chevron-up.0f9ac6f.svg);
  width: 14px;
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_dropdownButton.mx_LegacyCallViewButtons_dropdownButton_collapsed:before {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_on {
  background-color: var(--cpd-color-bg-canvas-default);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_on:before {
  background-color: var(--cpd-color-text-secondary);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_on.mx_LegacyCallViewButtons_button_mic:before {
  height: 20px;
  -webkit-mask-image: url(../../img/element-icons/mic.cf0a544.svg);
  mask-image: url(../../img/element-icons/mic.cf0a544.svg);
  width: 20px;
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_on.mx_LegacyCallViewButtons_button_vid:before {
  -webkit-mask-image: url(../../img/voip/call-view/cam-on.b011f60.svg);
  mask-image: url(../../img/voip/call-view/cam-on.b011f60.svg);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_on.mx_LegacyCallViewButtons_button_screensharing {
  background-color: var(--cpd-color-text-action-accent);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_on.mx_LegacyCallViewButtons_button_screensharing:before {
  background-color: #fff;
  -webkit-mask-image: url(../../img/voip/call-view/screensharing.5c2d592.svg);
  mask-image: url(../../img/voip/call-view/screensharing.5c2d592.svg);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_on.mx_LegacyCallViewButtons_button_sidebar:before {
  -webkit-mask-image: url(../../img/voip/call-view/sidebar-on.c8ce983.svg);
  mask-image: url(../../img/voip/call-view/sidebar-on.c8ce983.svg);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_off {
  background-color: var(--cpd-color-text-secondary);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_off:before {
  background-color: var(--cpd-color-bg-canvas-default);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_off.mx_LegacyCallViewButtons_button_mic:before {
  height: 20px;
  -webkit-mask-image: url(../../img/element-icons/Mic-off.0f5d334.svg);
  mask-image: url(../../img/element-icons/Mic-off.0f5d334.svg);
  width: 20px;
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_off.mx_LegacyCallViewButtons_button_vid:before {
  -webkit-mask-image: url(../../img/voip/call-view/cam-off.a099e25.svg);
  mask-image: url(../../img/voip/call-view/cam-off.a099e25.svg);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_off.mx_LegacyCallViewButtons_button_screensharing {
  background-color: var(--cpd-color-bg-canvas-default);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_off.mx_LegacyCallViewButtons_button_screensharing:before {
  background-color: var(--cpd-color-text-secondary);
  -webkit-mask-image: url(../../img/voip/call-view/screensharing.5c2d592.svg);
  mask-image: url(../../img/voip/call-view/screensharing.5c2d592.svg);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_off.mx_LegacyCallViewButtons_button_sidebar {
  background-color: var(--cpd-color-bg-canvas-default);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_off.mx_LegacyCallViewButtons_button_sidebar:before {
  background-color: var(--cpd-color-text-secondary);
  -webkit-mask-image: url(../../img/voip/call-view/sidebar-off.9164266.svg);
  mask-image: url(../../img/voip/call-view/sidebar-off.9164266.svg);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_dialpad:before {
  -webkit-mask-image: url(../../img/voip/call-view/dialpad.44caf66.svg);
  mask-image: url(../../img/voip/call-view/dialpad.44caf66.svg);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_hangup {
  background-color: var(--cpd-color-text-critical-primary);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_hangup:before {
  background-color: #fff;
  -webkit-mask-image: url(../../img/element-icons/call/hangup.a9876fc.svg);
  mask-image: url(../../img/element-icons/call/hangup.a9876fc.svg);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_more:before {
  -webkit-mask-image: url(../../img/voip/call-view/more.33bfe39.svg);
  mask-image: url(../../img/voip/call-view/more.33bfe39.svg);
}
.mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_button_invisible {
  pointer-events: none;
  position: absolute;
  visibility: hidden;
}
.mx_CallDuration {
  color: var(--cpd-color-text-secondary);
  font-size: 0.75rem;
  white-space: nowrap;
}
.mx_CallView {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-grow: 1;
  min-height: 0;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  background-color: var(--cpd-color-bg-subtle-primary);
  -ms-flex-direction: column;
  flex-direction: column;
}
.mx_CallView .mx_AppTile {
  background-color: #15191e;
  border: none;
  border-radius: inherit;
  height: 100%;
  width: auto;
}
.mx_CallView .mx_CallView_lobby ~ .mx_AppTile {
  display: none;
}
.mx_CallView .mx_CallView_lobby {
  min-height: 0;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  background-color: #15191e;
  color: #fff;
  flex-grow: 1;
  padding: 12px;
  --facepile-background: #15191e;
  border-radius: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  gap: 32px;
  justify-content: center;
}
.mx_CallView .mx_CallView_lobby .mx_FacePile {
  margin: 8px auto 0;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.mx_CallView .mx_CallView_lobby .mx_CallView_preview {
  aspect-ratio: 1.5;
  background-color: #21262c;
  border-radius: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  max-width: 800px;
  overflow: hidden;
  position: relative;
  width: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_CallView .mx_CallView_lobby .mx_CallView_preview .mx_BaseAvatar {
  height: auto !important;
  margin: 20px;
  min-height: 0;
  min-width: 0;
  width: auto !important;
  -webkit-box-flex: 0;
  -ms-flex: 0 1 200px;
  flex: 0 1 200px;
}
.mx_CallView .mx_CallView_lobby .mx_CallView_preview video {
  background-color: #000;
  display: block;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  position: absolute;
  top: 0;
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  width: 100%;
}
.mx_CallView .mx_CallView_lobby .mx_CallView_preview .mx_CallView_controls {
  background-color: var(--cpd-color-gray-900);
  bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  left: 0;
  position: absolute;
  right: 0;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  gap: 24px;
  justify-content: center;
}
.mx_CallView
  .mx_CallView_lobby
  .mx_CallView_preview
  .mx_CallView_controls
  .mx_CallView_deviceButtonWrapper {
  margin: 6px 0 10px;
  position: relative;
}
.mx_CallView
  .mx_CallView_lobby
  .mx_CallView_preview
  .mx_CallView_controls
  .mx_CallView_deviceButtonWrapper
  .mx_CallView_deviceButton {
  background-color: #21262c;
  border-radius: 25px;
  height: 50px;
  width: 50px;
}
.mx_CallView
  .mx_CallView_lobby
  .mx_CallView_preview
  .mx_CallView_controls
  .mx_CallView_deviceButtonWrapper
  .mx_CallView_deviceButton:before {
  background-color: #fff;
  content: "";
  display: inline-block;
  height: 100%;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  width: 100%;
}
.mx_CallView
  .mx_CallView_lobby
  .mx_CallView_preview
  .mx_CallView_controls
  .mx_CallView_deviceButtonWrapper
  .mx_CallView_deviceButton.mx_CallView_deviceButton_audio:before {
  -webkit-mask-image: url(../../img/element-icons/mic.cf0a544.svg);
  mask-image: url(../../img/element-icons/mic.cf0a544.svg);
  -webkit-mask-size: 14px;
  mask-size: 14px;
}
.mx_CallView
  .mx_CallView_lobby
  .mx_CallView_preview
  .mx_CallView_controls
  .mx_CallView_deviceButtonWrapper
  .mx_CallView_deviceButton.mx_CallView_deviceButton_video:before {
  -webkit-mask-image: url(../../img/voip/call-view/cam-on.b011f60.svg);
  mask-image: url(../../img/voip/call-view/cam-on.b011f60.svg);
}
.mx_CallView
  .mx_CallView_lobby
  .mx_CallView_preview
  .mx_CallView_controls
  .mx_CallView_deviceButtonWrapper
  .mx_CallView_deviceListButton {
  background-color: #21262c;
  border-radius: 7.5px;
  bottom: 0;
  height: 15px;
  position: absolute;
  right: -2.5px;
  width: 15px;
}
.mx_CallView
  .mx_CallView_lobby
  .mx_CallView_preview
  .mx_CallView_controls
  .mx_CallView_deviceButtonWrapper
  .mx_CallView_deviceListButton:before {
  background-color: #fff;
  content: "";
  display: inline-block;
  height: 100%;
  -webkit-mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  mask-image: url(../../img/feather-customised/chevron-down.59c17e1.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  width: 100%;
}
.mx_CallView
  .mx_CallView_lobby
  .mx_CallView_preview
  .mx_CallView_controls
  .mx_CallView_deviceButtonWrapper.mx_CallView_deviceButtonWrapper_muted
  .mx_CallView_deviceButton,
.mx_CallView
  .mx_CallView_lobby
  .mx_CallView_preview
  .mx_CallView_controls
  .mx_CallView_deviceButtonWrapper.mx_CallView_deviceButtonWrapper_muted
  .mx_CallView_deviceListButton {
  background-color: #fff;
}
.mx_CallView
  .mx_CallView_lobby
  .mx_CallView_preview
  .mx_CallView_controls
  .mx_CallView_deviceButtonWrapper.mx_CallView_deviceButtonWrapper_muted
  .mx_CallView_deviceButton:before,
.mx_CallView
  .mx_CallView_lobby
  .mx_CallView_preview
  .mx_CallView_controls
  .mx_CallView_deviceButtonWrapper.mx_CallView_deviceButtonWrapper_muted
  .mx_CallView_deviceListButton:before {
  background-color: #21262c;
}
.mx_CallView
  .mx_CallView_lobby
  .mx_CallView_preview
  .mx_CallView_controls
  .mx_CallView_deviceButtonWrapper.mx_CallView_deviceButtonWrapper_muted
  .mx_CallView_deviceButton.mx_CallView_deviceButton_audio:before {
  -webkit-mask-image: url(../../img/element-icons/Mic-off.0f5d334.svg);
  mask-image: url(../../img/element-icons/Mic-off.0f5d334.svg);
  -webkit-mask-size: 18px;
  mask-size: 18px;
}
.mx_CallView
  .mx_CallView_lobby
  .mx_CallView_preview
  .mx_CallView_controls
  .mx_CallView_deviceButtonWrapper.mx_CallView_deviceButtonWrapper_muted
  .mx_CallView_deviceButton.mx_CallView_deviceButton_video:before {
  -webkit-mask-image: url(../../img/voip/call-view/cam-off.a099e25.svg);
  mask-image: url(../../img/voip/call-view/cam-off.a099e25.svg);
}
.mx_CallView .mx_CallView_lobby .mx_CallView_connectButton {
  padding-left: 50px;
  padding-right: 50px;
}
.mx_DialPad {
  display: grid;
  grid-row-gap: 16px;
  row-gap: 16px;
  grid-column-gap: 0;
  -webkit-column-gap: 0;
  -moz-column-gap: 0;
  column-gap: 0;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 24px;
}
.mx_DialPad,
.mx_DialPad_button {
  margin-left: auto;
  margin-right: auto;
}
.mx_DialPad_button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  background-color: var(--cpd-color-gray-400);
  border-radius: 40px;
  font-size: 18px;
  font-weight: var(--cpd-font-weight-semibold);
  height: 40px;
  justify-content: center;
  text-align: center;
  vertical-align: middle;
  width: 40px;
}
.mx_DialPad_button .mx_DialPad_buttonSubText {
  font-size: 8px;
}
.mx_DialPad_dialButton {
  background-color: var(--cpd-color-text-action-accent);
  grid-column: 2;
}
.mx_DialPad_dialButton:before {
  background-color: #fff;
  content: "";
  display: inline-block;
  height: 40px;
  -webkit-mask-image: url(../../img/element-icons/call/voice-call.85002aa.svg);
  mask-image: url(../../img/element-icons/call/voice-call.85002aa.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  vertical-align: middle;
  width: 40px;
}
.mx_DialPadContextMenu_dialPad .mx_DialPad {
  -webkit-column-gap: 32px;
  -moz-column-gap: 32px;
  column-gap: 32px;
  row-gap: 16px;
}
.mx_DialPadContextMenuWrapper {
  padding: 15px;
}
.mx_DialPadContextMenu_header {
  border: none;
  border-bottom: 1px solid var(--cpd-color-gray-600);
  margin-left: 20px;
  margin-right: 20px;
  margin-top: 32px;
  -webkit-transition: border-bottom 0.25s;
  transition: border-bottom 0.25s;
}
.mx_DialPadContextMenu_cancel {
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 14px;
  cursor: pointer;
  height: 28px;
  position: relative;
  width: 28px;
}
.mx_DialPadContextMenu_cancel:hover {
  background-color: var(--cpd-color-bg-subtle-primary);
}
.mx_DialPadContextMenu_cancel:before {
  background-color: var(--cpd-color-icon-secondary);
  content: "";
  height: 28px;
  -webkit-mask-image: url(../../icons/close.dce71fd.svg);
  mask-image: url(../../icons/close.dce71fd.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  position: absolute;
  width: 28px;
}
.mx_DialPadContextMenu_cancel {
  float: right;
}
.mx_DialPadContextMenu_header:focus-within {
  border-bottom: 1px solid var(--cpd-color-text-action-accent);
}
.mx_DialPadContextMenu_title {
  color: #61708b;
  font-size: 12px;
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_DialPadContextMenu_dialled {
  border: none;
  font-size: 18px;
  font-weight: var(--cpd-font-weight-semibold);
  height: 1.5em;
  margin: 0;
}
.mx_DialPadContextMenu_dialled input {
  background-color: transparent;
  font-size: 18px;
  font-weight: var(--cpd-font-weight-semibold);
  max-width: 185px;
  overflow: hidden;
  padding: 8px 0;
  text-align: left;
}
.mx_DialPadContextMenu_dialPad {
  margin: 16px;
}
.mx_Dialog_dialPadWrapper .mx_Dialog {
  padding: 0;
}
.mx_DialPadModal {
  height: 370px;
  padding: 16px 0 0;
  width: 292px;
}
.mx_DialPadModal_header {
  border-bottom: 1px solid var(--cpd-color-gray-600);
  margin-left: 40px;
  margin-right: 40px;
  margin-top: 32px;
  -webkit-transition: border-bottom 0.25s;
  transition: border-bottom 0.25s;
}
.mx_DialPadModal_header:focus-within {
  border-bottom: 1px solid var(--cpd-color-text-action-accent);
}
.mx_DialPadModal_title {
  color: #61708b;
  font-size: 12px;
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_DialPadModal_cancel {
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 14px;
  cursor: pointer;
  height: 28px;
  position: relative;
  width: 28px;
}
.mx_DialPadModal_cancel:hover {
  background-color: var(--cpd-color-bg-subtle-primary);
}
.mx_DialPadModal_cancel:before {
  background-color: var(--cpd-color-icon-secondary);
  content: "";
  height: 28px;
  -webkit-mask-image: url(../../icons/close.dce71fd.svg);
  mask-image: url(../../icons/close.dce71fd.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px;
  mask-size: 20px;
  position: absolute;
  width: 28px;
}
.mx_DialPadModal_cancel {
  float: right;
  margin-right: 16px;
}
.mx_DialPadModal_field {
  border: none;
  height: 30px;
  margin: 0;
}
.mx_DialPadModal_field .mx_Field_postfix {
  border-left: none;
}
.mx_DialPadModal_field input {
  font-size: 18px;
  font-weight: var(--cpd-font-weight-semibold);
}
.mx_DialPadModal_dialPad {
  margin-left: 16px;
  margin-right: 16px;
  margin-top: 16px;
}
.mx_LegacyCallPreview {
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  left: 0;
  position: fixed;
  top: 0;
  z-index: 102;
}
.mx_LegacyCallPreview .mx_VideoFeed_remote.mx_VideoFeed_voice {
  min-height: 150px;
}
.mx_LegacyCallPreview .mx_VideoFeed_local {
  border-radius: 8px;
  overflow: hidden;
}
.mx_LegacyCallView {
  background-color: var(--cpd-color-bg-subtle-secondary);
  border-radius: 8px;
  padding-left: 8px;
  padding-right: 8px;
  pointer-events: auto;
}
.mx_LegacyCallView .mx_LegacyCallView_toast {
  background-color: #17191c;
  border-radius: 4px;
  color: #fff;
  padding: 4px 8px;
  position: absolute;
  top: 74px;
  z-index: 50;
}
.mx_LegacyCallView .mx_LegacyCallView_content_wrapper {
  height: 100%;
  width: 100%;
}
.mx_LegacyCallView .mx_LegacyCallView_content_wrapper,
.mx_LegacyCallView
  .mx_LegacyCallView_content_wrapper
  .mx_LegacyCallView_content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  overflow: hidden;
}
.mx_LegacyCallView
  .mx_LegacyCallView_content_wrapper
  .mx_LegacyCallView_content {
  position: relative;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-flex: 1;
  background-color: #21262c;
  border-radius: 10px;
  -ms-flex: 1;
  flex: 1;
  padding: 10px calc(20% + 20px) 10px 10px;
}
.mx_LegacyCallView
  .mx_LegacyCallView_content_wrapper
  .mx_LegacyCallView_content
  .mx_LegacyCallView_status {
  color: #f4f6fa;
  z-index: 50;
}
.mx_LegacyCallView
  .mx_LegacyCallView_content_wrapper
  .mx_LegacyCallView_content
  .mx_LegacyCallView_avatarsContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_LegacyCallView
  .mx_LegacyCallView_content_wrapper
  .mx_LegacyCallView_content
  .mx_LegacyCallView_avatarsContainer
  div {
  margin-left: 12px;
  margin-right: 12px;
}
.mx_LegacyCallView
  .mx_LegacyCallView_content_wrapper
  .mx_LegacyCallView_content
  .mx_LegacyCallView_holdBackground {
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-filter: blur(20px);
  filter: blur(20px);
  height: 100%;
  left: 0;
  position: absolute;
  right: 0;
  width: 100%;
}
.mx_LegacyCallView
  .mx_LegacyCallView_content_wrapper
  .mx_LegacyCallView_content
  .mx_LegacyCallView_holdBackground:after {
  background-color: rgba(0, 0, 0, 0.6);
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  right: 0;
  width: 100%;
}
.mx_LegacyCallView
  .mx_LegacyCallView_content_wrapper
  .mx_LegacyCallView_content.mx_LegacyCallView_content_hold
  .mx_LegacyCallView_status {
  font-weight: 700;
  text-align: center;
}
.mx_LegacyCallView
  .mx_LegacyCallView_content_wrapper
  .mx_LegacyCallView_content.mx_LegacyCallView_content_hold
  .mx_LegacyCallView_status:before {
  background-image: url(../../img/voip/paused.b00e0b4.svg);
  background-position: 50%;
  background-size: cover;
  content: "";
  display: block;
  height: 40px;
  margin-left: auto;
  margin-right: auto;
  width: 40px;
}
.mx_LegacyCallView_pip
  .mx_LegacyCallView
  .mx_LegacyCallView_content_wrapper
  .mx_LegacyCallView_content.mx_LegacyCallView_content_hold
  .mx_LegacyCallView_status:before {
  height: 30px;
  width: 30px;
}
.mx_LegacyCallView:not(.mx_LegacyCallView_sidebar) .mx_LegacyCallView_content {
  height: 100%;
  padding: 0;
  width: 100%;
}
.mx_LegacyCallView:not(.mx_LegacyCallView_sidebar)
  .mx_LegacyCallView_content
  .mx_VideoFeed_primary {
  aspect-ratio: unset;
  border: 0;
  height: 100%;
  width: 100%;
}
.mx_LegacyCallView.mx_LegacyCallView_pip {
  background-color: var(--cpd-color-bg-subtle-primary);
  border-radius: 8px;
  -webkit-box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
  padding-bottom: 8px;
  width: 320px;
}
.mx_LegacyCallView.mx_LegacyCallView_pip .mx_LegacyCallViewButtons {
  bottom: 13px;
}
.mx_LegacyCallView.mx_LegacyCallView_pip
  .mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button {
  height: 34px;
  width: 34px;
}
.mx_LegacyCallView.mx_LegacyCallView_pip
  .mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button.mx_LegacyCallViewButtons_dropdownButton {
  height: var(--LegacyCallViewButtons_dropdownButton-size);
  width: var(--LegacyCallViewButtons_dropdownButton-size);
}
.mx_LegacyCallView.mx_LegacyCallView_pip
  .mx_LegacyCallViewButtons
  .mx_LegacyCallViewButtons_button:before {
  height: 22px;
  width: 22px;
}
.mx_LegacyCallView.mx_LegacyCallView_pip .mx_LegacyCallView_content {
  min-height: 180px;
}
.mx_LegacyCallView.mx_LegacyCallView_large {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  margin: 8px;
  margin: var(--container-gap-width);
  margin-bottom: 10px;
  margin-right: 4px;
  margin-right: calc(var(--container-gap-width) / 2);
  padding-bottom: 10px;
}
.mx_LegacyCallView.mx_LegacyCallView_belowWidget {
  margin-top: 0;
}
.mx_LegacyCallViewForRoom {
  overflow: hidden;
}
.mx_LegacyCallViewForRoom .mx_LegacyCallViewForRoom_ResizeWrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.mx_LegacyCallViewForRoom
  .mx_LegacyCallViewForRoom_ResizeWrapper:hover
  .mx_LegacyCallViewForRoom_ResizeHandle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100% !important;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.mx_LegacyCallViewForRoom
  .mx_LegacyCallViewForRoom_ResizeWrapper:hover
  .mx_LegacyCallViewForRoom_ResizeHandle:after {
  background-color: var(--cpd-color-text-primary);
  border-radius: 4px;
  content: "";
  height: 4px;
  max-width: 64px;
  width: 100%;
}
.mx_LegacyCallViewHeader {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 44px;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 100%;
}
.mx_LegacyCallViewHeader.mx_LegacyCallViewHeader_pip {
  cursor: -webkit-grab;
  cursor: grab;
}
.mx_LegacyCallViewHeader_text {
  font-size: 1.2rem;
  font-weight: 700;
  vertical-align: middle;
}
.mx_LegacyCallViewHeader_secondaryCallInfo:before {
  content: "·";
  margin-left: 6px;
  margin-right: 6px;
}
.mx_LegacyCallViewHeader_controls {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 5px;
  margin-left: auto;
}
.mx_LegacyCallViewHeader_button {
  cursor: pointer;
  display: inline-block;
  vertical-align: middle;
}
.mx_LegacyCallViewHeader_button:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  display: inline-block;
  height: 20px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  vertical-align: middle;
  width: 20px;
}
.mx_LegacyCallViewHeader_button.mx_LegacyCallViewHeader_button_fullscreen:before {
  -webkit-mask-image: url(../../img/element-icons/call/fullscreen.3baa8a5.svg);
  mask-image: url(../../img/element-icons/call/fullscreen.3baa8a5.svg);
}
.mx_LegacyCallViewHeader_button.mx_LegacyCallViewHeader_button_pin:before {
  -webkit-mask-image: url(../../img/element-icons/room/pin-upright.340b3b6.svg);
  mask-image: url(../../img/element-icons/room/pin-upright.340b3b6.svg);
}
.mx_LegacyCallViewHeader_button.mx_LegacyCallViewHeader_button_expand:before {
  -webkit-mask-image: url(../../img/element-icons/call/expand.b085a84.svg);
  mask-image: url(../../img/element-icons/call/expand.b085a84.svg);
}
.mx_LegacyCallViewHeader_callInfo {
  margin-left: 12px;
  margin-right: 16px;
  overflow: hidden;
}
.mx_LegacyCallViewHeader_roomName {
  font-size: 12px;
  font-weight: 700;
  height: 15px;
  line-height: normal;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_LegacyCallView_secondaryCall_roomName {
  margin-left: 4px;
}
.mx_LegacyCallViewHeader_icon {
  display: inline-block;
  height: 16px;
  margin-right: 6px;
  vertical-align: middle;
  width: 16px;
}
.mx_LegacyCallViewHeader_icon:before {
  background-color: var(--cpd-color-text-secondary);
  content: "";
  display: inline-block;
  height: 16px;
  -webkit-mask-image: url(../../img/element-icons/call/voice-call.85002aa.svg);
  mask-image: url(../../img/element-icons/call/voice-call.85002aa.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  vertical-align: top;
  width: 16px;
}
.mx_LegacyCallViewSidebar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  overflow: auto;
  position: absolute;
  right: 10px;
  width: 20%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  gap: 12px;
}
.mx_LegacyCallViewSidebar > .mx_VideoFeed {
  border-radius: 4px;
  width: 100%;
}
.mx_LegacyCallViewSidebar > .mx_VideoFeed.mx_VideoFeed_voice {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  background-color: #394049;
  justify-content: center;
}
.mx_LegacyCallViewSidebar.mx_LegacyCallViewSidebar_pipMode {
  bottom: auto;
  top: 16px;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  gap: 4px;
  justify-content: flex-end;
}
.mx_VideoFeed {
  border: 2px solid transparent;
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  position: relative;
}
.mx_VideoFeed.mx_VideoFeed_secondary {
  bottom: 72px;
  position: absolute;
  right: 24px;
  width: 20%;
}
.mx_VideoFeed.mx_VideoFeed_voice {
  background-color: var(--cpd-color-bg-action-primary-rest);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.mx_VideoFeed.mx_VideoFeed_voice:not(.mx_VideoFeed_primary) {
  aspect-ratio: 16/9;
}
.mx_VideoFeed .mx_VideoFeed_video {
  background-color: #000;
  border-radius: 4px;
  height: 100%;
  width: 100%;
}
.mx_VideoFeed .mx_VideoFeed_video.mx_VideoFeed_video_mirror {
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
}
.mx_VideoFeed .mx_VideoFeed_mic {
  bottom: 6px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  left: 6px;
  position: absolute;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 100%;
  height: 24px;
  justify-content: center;
  width: 24px;
}
.mx_VideoFeed .mx_VideoFeed_mic:before {
  background-color: #fff;
  border-radius: 7px;
  content: "";
  height: 17px;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  position: absolute;
  width: 17px;
}
.mx_VideoFeed .mx_VideoFeed_mic.mx_VideoFeed_mic_muted:before {
  -webkit-mask-image: url(../../img/element-icons/Mic-off.0f5d334.svg);
  mask-image: url(../../img/element-icons/Mic-off.0f5d334.svg);
}
.mx_VideoFeed .mx_VideoFeed_mic.mx_VideoFeed_mic_unmuted:before {
  -webkit-mask-image: url(../../img/element-icons/mic.cf0a544.svg);
  mask-image: url(../../img/element-icons/mic.cf0a544.svg);
}
.mx_LegacyRoomHeader_searchButton:before {
  -webkit-mask-image: url(../../img/element-icons/room/search-inset.7a9a2eb.svg);
  mask-image: url(../../img/element-icons/room/search-inset.7a9a2eb.svg);
}
.mx_AccessibleButton.mx_AccessibleButton_kind_icon_primary, .mx_AccessibleButton.mx_AccessibleButton_kind_primary {
  background-color: green !important;
  border: 1px solid var(--cpd-color-bg-action-primary-rest);
  color: var(--cpd-color-text-on-solid-primary);
}
.mx_LiveBadge {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: var(--cpd-color-text-critical-primary);
  border-radius: 2px;
  color: var(--cpd-color-icon-on-solid-primary);
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  font-size: 0.75rem;
  font-weight: var(--cpd-font-weight-semibold);
  gap: 4px;
  padding: 2px 4px;
}
.mx_LiveBadge--grey {
  background-color: var(--cpd-color-gray-600);
}
.mx_VoiceBroadcastControl {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: var(--cpd-color-bg-canvas-default);
  border-radius: 50%;
  color: var(--cpd-color-text-secondary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 32px;
  flex: 0 0 32px;
  height: 32px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 32px;
}
.mx_VoiceBroadcastControl-recording {
  color: var(--cpd-color-text-critical-primary);
}
.mx_VoiceBroadcastControl-play .mx_Icon {
  left: 1px;
  position: relative;
}
.mx_VoiceBroadcastHeader {
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  line-height: 20px;
  margin-bottom: 16px;
  min-width: 0;
}
.mx_VoiceBroadcastHeader_content {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  min-width: 0;
}
.mx_VoiceBroadcastHeader_room_wrapper {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 4px;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}
.mx_VoiceBroadcastHeader_room {
  font-size: 0.75rem;
  font-weight: var(--cpd-font-weight-semibold);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_VoiceBroadcastHeader_line {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-secondary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 0.75rem;
  gap: 4px;
}
.mx_VoiceBroadcastHeader_line .mx_Spinner {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 14px;
  flex: 0 0 14px;
  padding: 1px;
}
.mx_VoiceBroadcastHeader_line span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mx_VoiceBroadcastHeader_mic--clickable {
  cursor: pointer;
}
.mx_VoiceBroadcastRecordingConnectionError {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-critical-primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
}
.mx_VoiceBroadcastRecordingConnectionError svg path {
  fill: var(--cpd-color-text-critical-primary);
}
.mx_RoomTile
  .mx_RoomTile_titleContainer
  .mx_RoomTile_subtitle.mx_RoomTile_subtitle--voice-broadcast {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--cpd-color-text-critical-primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 4px;
}
.mx_VoiceBroadcastBody {
  background-color: var(--cpd-color-gray-400);
  border-radius: 8px;
  color: var(--cpd-color-text-secondary);
  display: inline-block;
  font-size: 0.75rem;
  padding: 12px;
  width: 271px;
}
.mx_VoiceBroadcastBody .mx_Clock {
  line-height: 1;
}
.mx_VoiceBroadcastBody--pip {
  background-color: var(--cpd-color-bg-subtle-primary);
  -webkit-box-shadow: 0 2px 8px 0 #0000004a;
  box-shadow: 0 2px 8px 0 #0000004a;
}
.mx_VoiceBroadcastBody--small {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  width: 192px;
}
.mx_VoiceBroadcastBody--small .mx_VoiceBroadcastHeader {
  margin-bottom: 0;
}
.mx_VoiceBroadcastBody--small .mx_VoiceBroadcastControl {
  -ms-flex-item-align: center;
  align-self: center;
}
.mx_VoiceBroadcastBody--small .mx_LiveBadge {
  margin-top: 4px;
}
.mx_VoiceBroadcastBody_divider {
  background-color: var(--cpd-color-gray-400);
  border: 0;
  height: 1px;
  margin: 12px 0;
}
.mx_VoiceBroadcastBody_controls {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 32px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-bottom: 8px;
}
.mx_VoiceBroadcastBody_timerow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.mx_AccessibleButton.mx_VoiceBroadcastBody_blockButton {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
}
.mx_VoiceBroadcastBody__small-close {
  position: absolute;
  right: 8px;
  top: 8px;
}
pre code.hljs {
  display: block;
  overflow-x: auto;
  padding: 1em;
}
code.hljs {
  padding: 3px 5px;
}
.hljs {
  background: #fafafa;
  color: #383a42;
}
.hljs-comment,
.hljs-quote {
  color: #a0a1a7;
  font-style: italic;
}
.hljs-doctag,
.hljs-formula,
.hljs-keyword {
  color: #a626a4;
}
.hljs-deletion,
.hljs-name,
.hljs-section,
.hljs-selector-tag,
.hljs-subst {
  color: #e45649;
}
.hljs-literal {
  color: #0184bb;
}
.hljs-addition,
.hljs-attribute,
.hljs-meta .hljs-string,
.hljs-regexp,
.hljs-string {
  color: #50a14f;
}
.hljs-attr,
.hljs-number,
.hljs-selector-attr,
.hljs-selector-class,
.hljs-selector-pseudo,
.hljs-template-variable,
.hljs-type,
.hljs-variable {
  color: #986801;
}
.hljs-bullet,
.hljs-link,
.hljs-meta,
.hljs-selector-id,
.hljs-symbol,
.hljs-title {
  color: #4078f2;
}
.hljs-built_in,
.hljs-class .hljs-title,
.hljs-title.class_ {
  color: #c18401;
}
.hljs-emphasis {
  font-style: italic;
}
.hljs-strong {
  font-weight: 700;
}
.hljs-link {
  text-decoration: underline;
}
/*# sourceMappingURL=theme-light.css.map*/