@font-face {
    font-family: 'Beeps';
    src: url(../../fonts/Beeper/Beeps-3_013.e006092.otf) format('opentype');
}
@font-face {
    font-family: 'Sofia Pro';
    font-style: normal;
    font-weight: 400;
    src: url(../../fonts/Sofia_Pro/Sofia-Pro-Regular.0320e99.ttf) format('truetype');
}
@font-face {
    font-family: 'Sofia Pro';
    font-style: normal;
    font-weight: 500;
    src: url(../../fonts/Sofia_Pro/Sofia-Pro-Medium.72f29e7.ttf) format('truetype');
}
@font-face {
    font-family: 'Sofia Pro';
    font-style: normal;
    font-weight: 600;
    src: url(../../fonts/Sofia_Pro/Sofia-Pro-Semibold.908d463.ttf) format('truetype');
}
@font-face {
    font-family: 'Sofia Pro';
    font-style: normal;
    font-weight: 700;
    src: url(../../fonts/Sofia_Pro/Sofia-Pro-Bold.3441be5.ttf) format('truetype');
}
@font-face {
    font-family: 'Space Grotesk';
    font-style: normal;
    font-weight: 400;
    src: url(../../fonts/Space_Grotesk/Space-Grotesk-Regular.9589c3d.ttf) format('truetype');
}
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: url(../../fonts/Open_Sans/OpenSans-Regular.629a55a.ttf) format('truetype');
}
@font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 400;
    src: url(../../fonts/Open_Sans/OpenSans-Italic.c7dcce0.ttf) format('truetype');
}
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    src: url(../../fonts/Open_Sans/OpenSans-Semibold.33f225b.ttf) format('truetype');
}
@font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 600;
    src: url(../../fonts/Open_Sans/OpenSans-SemiboldItalic.73f7301.ttf) format('truetype');
}
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    src: url(../../fonts/Open_Sans/OpenSans-Bold.5014568.ttf) format('truetype');
}
@font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 700;
    src: url(../../fonts/Open_Sans/OpenSans-BoldItalic.78b08a6.ttf) format('truetype');
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 600;
    src: url(../../fonts/Roboto/Roboto-Bold.e07df86.ttf) format('truetype');
}
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 600;
    src: url(../../fonts/Roboto/Roboto-BoldItalic.5b44818.ttf) format('truetype');
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: url(../../fonts/Roboto/Roboto-Medium.58aef54.ttf) format('truetype');
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url(../../fonts/Roboto/Roboto-Regular.11eabca.ttf) format('truetype');
}
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 400;
    src: url(../../fonts/Roboto/Roboto-Italic.a720f17.ttf) format('truetype');
}
/* the 'src' links are relative to the bundle.css, which is in a subdirectory.
 */
/* Inter unexpectedly contains various codepoints which collide with emoji, even
   when variation-16 is applied to request the emoji variant.  From eyeballing
   the emoji picker, these are: 20e3, 23cf, 24c2, 25a0-25c1, 2665, 2764, 2b06, 2b1c.
   Therefore we define a unicode-range to load which excludes the glyphs
   (to avoid having to maintain a fork of Inter). */
@font-face {
     font-family: 'Inter';
     font-style:  normal;
     font-weight: 400;
     font-display: swap;
     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;
     src: url(../../fonts/Inter/Inter-Regular.4232a67.woff2) format("woff2"),
          url(../../fonts/Inter/Inter-Regular.3a1908c.woff) format("woff");
   }
@font-face {
     font-family: 'Inter';
     font-style:  italic;
     font-weight: 400;
     font-display: swap;
     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;
     src: url(../../fonts/Inter/Inter-Italic.b791861.woff2) format("woff2"),
          url(../../fonts/Inter/Inter-Italic.b13e6fe.woff) format("woff");
   }
@font-face {
     font-family: 'Inter';
     font-style:  normal;
     font-weight: 500;
     font-display: swap;
     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;
     src: url(../../fonts/Inter/Inter-Medium.027d14e.woff2) format("woff2"),
          url(../../fonts/Inter/Inter-Medium.d1f6b6e.woff) format("woff");
   }
@font-face {
     font-family: 'Inter';
     font-style:  italic;
     font-weight: 500;
     font-display: swap;
     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;
     src: url(../../fonts/Inter/Inter-MediumItalic.8154ac2.woff2) format("woff2"),
          url(../../fonts/Inter/Inter-MediumItalic.1912849.woff) format("woff");
   }
@font-face {
     font-family: 'Inter';
     font-style:  normal;
     font-weight: 600;
     font-display: swap;
     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;
     src: url(../../fonts/Inter/Inter-SemiBold.0802d48.woff2) format("woff2"),
          url(../../fonts/Inter/Inter-SemiBold.8357f92.woff) format("woff");
   }
@font-face {
     font-family: 'Inter';
     font-style:  italic;
     font-weight: 600;
     font-display: swap;
     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;
     src: url(../../fonts/Inter/Inter-SemiBoldItalic.10a60d8.woff2) format("woff2"),
          url(../../fonts/Inter/Inter-SemiBoldItalic.1c70752.woff) format("woff");
   }
@font-face {
     font-family: 'Inter';
     font-style:  normal;
     font-weight: 700;
     font-display: swap;
     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;
     src: url(../../fonts/Inter/Inter-Bold.fc28dff.woff2) format("woff2"),
          url(../../fonts/Inter/Inter-Bold.025b6f2.woff) format("woff");
   }
@font-face {
     font-family: 'Inter';
     font-style:  italic;
     font-weight: 700;
     font-display: swap;
     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;
     src: url(../../fonts/Inter/Inter-BoldItalic.2129bd0.woff2) format("woff2"),
          url(../../fonts/Inter/Inter-BoldItalic.80f8542.woff) format("woff");
   }
/* Nunito lacks combining diacritics, so these will fall through
   to the next font.  Helevetica's diacritics however do not combine
   nicely (on OSX, at least) and result in a huge horizontal mess.
   Arial empirically gets it right, hence prioritising Arial here. */
/* We fall through to Twemoji for emoji rather than falling through
   to native Emoji fonts (if any) to ensure cross-browser consistency */
/* Noto Color Emoji contains digits, in fixed-width, therefore causing
   digits in flowed text to stand out.
   TODO: Consider putting all emoji fonts to the end rather than the front. */
:root {
    --lp-background-blur: 40px;
}
.hljs-addition {
    background: #dfd;
}
.hljs-deletion {
    background: #fdd;
}
.hljs-outer-grid {
    display: grid;
    grid-column-gap: 8px;
    -webkit-column-gap: 8px;
       -moz-column-gap: 8px;
            column-gap: 8px;
}
.hljs-outer-grid-line-number {
    grid-column-start: 1;
    color: gray;
    text-align: right;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
}
.hljs-outer-grid-code {
    grid-column-start: 2;
}
.hljs-outer-grid-code, .hljs-outer-grid-code * { font-family: monospace !important; }
/******************************************************************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/*******************     BEEPER BEEKIT      ***********************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/***********************   INPUT   ********************************/
/******************************************************************/
/******************************************************************/
/***********************   DIVIDER   ******************************/
/******************************************************************/
/******************************************************************/
/***********************   BUTTON   *******************************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/**************************     BEEPER      ***********************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/***********************   BridgedIcon   **************************/
/******************************************************************/
/******************************************************************/
/***********************    LeftPanel    **************************/
/******************************************************************/
/******************************************************************/
/*********************    Beekit Icon    **************************/
/******************************************************************/
/******************************************************************/
/************************    Composer    **************************/
/******************************************************************/
/******************************************************************/
/***********************    Room Toast    *************************/
/******************************************************************/
/******************************************************************/
/*******************    New Chat Dropdown    **********************/
/******************************************************************/
/******************************************************************/
/*******************  New Conversation View  **********************/
/******************************************************************/
:root {
    --default-avatar-hue: 200;
    --message-color-saturation: 100%;
    --message-color-lightness: 15%;
    --message-color-opacity: 1;
    --message-bg-saturation: 100%;
    --message-bg-lightness: 15%;
    --message-bg-opacity: 0.07;
    --reply-bg-opacity: 0.2;
    --reply-bg-saturation: 46%;
    --reply-bg-lightness: 81%;
    --reply-to-color-saturation: 100%;
    --reply-to-color-lightness: 10%;
    --reply-to-color-opacity: 0.8;
    --sender-name-saturation: 100%;
    --sender-name-lightness: 15%;
    --timestamp-saturation: 100%;
    --timestamp-lightness: 10%;
    --reaction-saturation: 97%;
    --reaction-lightness: 15%;
    --reaction-opacity: 0.1;
    --add-reaction-saturation: 98%;
    --add-reaction-lightness: 15%;
    --read-receipt-fg: hsla(0, 0%, 0%, 0.5);
    --read-receipt-tooltip-fg: 10%;
    --archive-background: rgb(158, 157, 162, 0.9);
    --archive-fg: black;
    --left-panel-bg: rgb(241 241 242 / 0%);
    --main-panel-bg: rgb(255 255 255);
    --main-panel-transparent-bg: #1e1e1e00;
    --search-primary: black;
    --base: 0, 0, 0;
    --message-actions-fg: #d0d1d8;
    --search-bar-input-fg: #97989b;
    --search-input-bg-experimental: rgba(118, 118, 128, 0.12);
    --header-control-fg: #68686D;
    --header-control-fg-hover: #828282;
    --composer-bg: rgb(0 0 0 / 7%);

    --room-tile-bg-hover: #F7F7F7;
    --primary-content: #424961;
    --primary-fg-color: #424961;
    --primary-bg-color: #ffffff;
    --input-border-color: #e7e7e7;
    --brand-linear-gradient: linear-gradient(120deg, #a93fe9 12px, #4958f5);
    --dialog-bg-color: #F7F7F7;
    --read-check-color: #000000;
    --read-check-color-bubble: #FFFFFF;

    --tooltipText: #000;
    --tooltipBackground: #fff;
    --dialog-title-fg-color: #45474a;
    --space-bar-bg: #00000007;
    --space-bar-selected: #1e1e1e50;
    --space-bar-error-icon: url(../../img/x-stroke.ab96061.svg);
    --floating-button-bg: white;
    --left-panel-bg-no-transparency: #eae8ea;
    --left-panel-v2-bg-no-transparency--windows: #fff;
    --lightbox-opacity: 0.95;
    --lightbox-bg-color: #2e3338;
    --lightbox-icon-color: #c1c6cd;
    --white: #ffffff;
    --black: #000000;
    --base-100: #25262D;
    --base-150: #32343E;
    --base-200: #35363D;
    --base-300: #5C5D62;
    --base-400: #68686D;
    --base-500: #76767B;
    --base-600: #949598;
    --base-700: #E1E2E2;
    --base-800: #EFEFF0;
    --base-900: #F7F7F7;

    --siren-pale: #F1CAC9;
    --siren-full: #CE484F;
    --azure-pale: #C8D4E7;
    --azure-full: #3577ff;

    --bronzer: #F09C74;
    --luck: #54BF6F;
    --button-transparent-bg: rgba(8, 8, 8, 0.05);
    --button-transparent-fg: var(--base-100);
}
.mx_MatrixChat_wrapper:not(.mx_MatrixChat_wrapper--colorful) {
    --message-color-lightness: 0;
    --reply-bg-saturation: 10%;
    --reply-bg-lightness: 70%;
    --sender-name-saturation: 10%;
    --sender-name-lightness: 0%;
    --add-reaction-saturation: 10%;
    --read-receipt-tooltip-fg: 100%;
}
.mx_MatrixChat_wrapper--transparent-main-panel {
    --message-actions-fg: #00000087;
}
.mx_filterFlipColor {
    -webkit-filter: invert(1);
            filter: invert(1);
}
.mx_EventTile_content .markdown-body pre:hover {
    border-color: #808080 !important;
}
.mx_EventTile_content .markdown-body table tr {
            background-color: #000000;
        }
.mx_EventTile_content .markdown-body table tr:nth-child(2n) {
            background-color: #080808;
        }
.mx_EventTile_content .markdown-body blockquote {
        color: #919191;
    }
/******************************************************************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/*******************     BEEPER BEEKIT      ***********************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/***********************   INPUT   ********************************/
/******************************************************************/
/******************************************************************/
/***********************   DIVIDER   ******************************/
/******************************************************************/
/******************************************************************/
/***********************   BUTTON   *******************************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/**************************     BEEPER      ***********************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/******************************************************************/
/***********************   BridgedIcon   **************************/
/******************************************************************/
/******************************************************************/
/***********************    LeftPanel    **************************/
/******************************************************************/
/******************************************************************/
/*********************    Beekit Icon    **************************/
/******************************************************************/
/******************************************************************/
/************************    Composer    **************************/
/******************************************************************/
/******************************************************************/
/************************    LeftPanel    **************************/
/******************************************************************/
/******************************************************************/
/***********************    Room Toast    *************************/
/******************************************************************/
/******************************************************************/
/*******************    New Chat Dropdown    **********************/
/******************************************************************/
/******************************************************************/
/*******************  New Conversation View  **********************/
/******************************************************************/
:root {
    --default-avatar-hue: 150;
    --message-color-saturation: 100%;
    --message-color-lightness: 90%;
    --message-color-opacity: 1;
    --message-bg-saturation: 100%;
    --message-bg-lightness: 70%;
    --message-bg-opacity: 0.07;
    --reply-bg-opacity: 0.07;
    --reply-bg-saturation: 46%;
    --reply-bg-lightness: 81%;
    --reply-to-color-saturation: 100%;
    --reply-to-color-lightness: 95%;
    --reply-to-color-opacity: 0.8;
    --sender-name-saturation: 100%;
    --sender-name-lightness: 95%;
    --timestamp-saturation: 29%;
    --timestamp-lightness: 80%;
    --reaction-saturation: 29%;
    --reaction-lightness: 72%;
    --reaction-opacity: 0.15;
    --add-reaction-saturation: 29%;
    --add-reaction-lightness: 80%;
    --read-receipt-fg: hsla(240, 100%, 93%, 0.5);
    --read-receipt-tooltip-fg: 88%;
    --archive-background: rgb(43, 41, 47);
    --archive-fg: white;
    --left-panel-bg: hsl(0deg 0% 100% / 0%);
    --main-panel-bg: #1e1e1e;
    --main-panel-transparent-bg: #1e1e1e00;
    --search-primary: white;
    --base: 255, 255, 255;
    --message-actions-fg: #d0d1d8;
    --search-bar-input-fg: #76767b;
    --search-input-bg-experimental: rgba(118, 118, 128, 0.12);
    --header-control-fg: hsla(215, 21%, 76%, 0.33);
    --header-control-fg-hover: hsla(215, 21%, 76%, 0.63);
    --room-tile-bg-hover: #25262dcc;
    --primary-content: #f0f0f1;
    --primary-bg-color: #25262d;
    --primary-fg-color: #f0f0f1;
    --input-border-color: rgba(231, 231, 231, 0.2);
    --brand-linear-gradient: linear-gradient(120deg, #a93fe9 12px, #4958f5);
    --dialog-bg-color: hsla(216, 21%, 14%, 1);
    --read-check-color: #FFFFFF;
    --read-check-color-bubble: #FFFFFF;
    --composer-bg: rgba(255, 255, 255, 0.07);

    --tooltipText: white;
    --tooltipBackground: #25262d;
    --dialog-title-fg-color: #f0f0f1;
    --space-bar-bg: #ffffff07;
    --space-bar-selected: #ffffff50;
    --space-bar-error-icon: url(../../img/x-stroke-dark.d150096.svg);
    --floating-button-bg: #312D39;
    --left-panel-bg-no-transparency: #202020;
    --left-panel-v2-bg-no-transparency--windows: #202020;
    --lightbox-opacity: 0.85;
    --lightbox-bg-color: #000;
    --lightbox-icon-color: #8e99a4;

    --base-900: #25262D;
    --base-800: #32343E;
    --base-700: #35363D;
    --base-600: #5C5D62;
    --base-500: #68686D;
    --base-400: #76767B;
    --base-300: #949598;
    --base-200: #E1E2E2;
    --base-150: #EFEFF0;
    --base-100: #F7F7F7;
    --siren-pale: #3F333A;
    --siren-full: #E04950;
    --azure-pale: #313646;
    --azure-full: #3577ff;
    --button-transparent-bg: rgba(247, 247, 247, 0.05);
    --button-transparent-fg: var(--base-300);
}
.mx_MatrixChat_wrapper--transparent-main-panel {
    --message-actions-fg: #ffffff87;
}
.mx_MatrixChat_wrapper:not(.mx_MatrixChat_wrapper--colorful) {
    --default-avatar-hue: 100;
    --message-color-saturation: 0%;
    --message-color-lightness: 100%;
    --message-bg-saturation: 7%;
    --message-bg-lightness: 88%;
    --reply-to-color-saturation: 10%;
    --sender-name-saturation: 0%;
    --sender-name-lightness: 100%;
    --timestamp-saturation: 10%;
    --timestamp-lightness: 100%;
    --reaction-lightness: 80%;
    --add-reaction-saturation: 10%;
    --add-reaction-lightness: 90%;
    --read-receipt-tooltip-fg: 100%;
}
.mx_MatrixChat_wrapper--transparent-main-panel.mx_MatrixChat_wrapper--colorful {
    --timestamp-saturation: 100%;
    --timestamp-lightness: 90%;
    --reaction-lightness: 80%;
    --add-reaction-saturation: 100%;
    --add-reaction-lightness: 90%;
}
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2017 Vector Creations Ltd
Copyright 2017 - 2019 New Vector Ltd
Copyright 2019 - 2021 The Matrix.org Foundation C.I.C

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
/*
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
/**
 * React Transition Group animations are prefixed with 'mx_rtg--' so that we
 * know they should not be used anywhere outside of React Transition Groups.
*/
.mx_rtg--fade-enter {
    opacity: 0;
}
.mx_rtg--fade-exit {
    opacity: 1;
}
.mx_rtg--fade-enter-active {
    opacity: 1;
}
.mx_rtg--fade-exit-active {
    opacity: 0;
}
.mx_rtg--fade-enter-active, .mx_rtg--fade-exit-active {
    -webkit-transition: opacity 250ms ease;
    transition: opacity 250ms ease;
}
@-webkit-keyframes mx--anim-pulse {
    0% { opacity: 1; }
    50% { opacity: 0.7; }
    100% { opacity: 1; }
}
@keyframes mx--anim-pulse {
    0% { opacity: 1; }
    50% { opacity: 0.7; }
    100% { opacity: 1; }
}
@-webkit-keyframes mx_Dialog_lightbox_background_keyframes {
    from {
        opacity: 0;
    }
    to {
        opacity: 0.95;
    }
}
@keyframes mx_Dialog_lightbox_background_keyframes {
    from {
        opacity: 0;
    }
    to {
        opacity: 0.95;
    }
}
@media (prefers-reduced-motion) {
    @-webkit-keyframes mx--anim-pulse {
    }
    @keyframes mx--anim-pulse {
    }

    @-webkit-keyframes mx_Dialog_lightbox_background_keyframes {
    }

    @keyframes mx_Dialog_lightbox_background_keyframes {
    }

    .mx_rtg--fade-enter-active {
        -webkit-transition: none;
        transition: none;
    }
    .mx_rtg--fade-exit-active {
        -webkit-transition: none;
        transition: none;
    }
}
.mapboxgl-map, .maplibregl-map{font:12px/20px Helvetica Neue,Arial,Helvetica,sans-serif;overflow:hidden;position:relative;-webkit-tap-highlight-color:rgba(0,0,0,0)}
.mapboxgl-canvas, .maplibregl-canvas{position:absolute;left:0;top:0}
.mapboxgl-map:-webkit-full-screen, .maplibregl-map:-webkit-full-screen{width:100%;height: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{position:absolute;pointer-events:none;z-index:2}
.mapboxgl-ctrl-top-left, .maplibregl-ctrl-top-left{top:0;left:0}
.mapboxgl-ctrl-top-right, .maplibregl-ctrl-top-right{top:0;right:0}
.mapboxgl-ctrl-bottom-left, .maplibregl-ctrl-bottom-left{bottom:0;left:0}
.mapboxgl-ctrl-bottom-right, .maplibregl-ctrl-bottom-right{right:0;bottom: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{margin:10px 0 0 10px;float:left}
.mapboxgl-ctrl-top-right .mapboxgl-ctrl, .maplibregl-ctrl-top-right .maplibregl-ctrl{margin:10px 10px 0 0;float:right}
.mapboxgl-ctrl-bottom-left .mapboxgl-ctrl, .maplibregl-ctrl-bottom-left .maplibregl-ctrl{margin:0 0 10px 10px;float:left}
.mapboxgl-ctrl-bottom-right .mapboxgl-ctrl, .maplibregl-ctrl-bottom-right .maplibregl-ctrl{margin:0 10px 10px 0;float:right}
.mapboxgl-ctrl-group, .maplibregl-ctrl-group{border-radius:4px;background:#fff}
.mapboxgl-ctrl-group:not(:empty), .maplibregl-ctrl-group:not(:empty){-webkit-box-shadow:0 0 2px rgba(0,0,0,.1);box-shadow:0 0 0 2px rgba(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{width:29px;height:29px;display:block;padding:0;outline:none;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;background-color:transparent;cursor:pointer}
.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{display:block;width:100%;height:100%;background-repeat:no-repeat;background-position:50%}
@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:.25}
.mapboxgl-ctrl button:not(:disabled):hover, .maplibregl-ctrl button:not(:disabled):hover{background-color:rgba(0,0,0,.05)}
.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 width='29' height='29' viewBox='0 0 29 29' xmlns='http://www.w3.org/2000/svg' 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 13h-9z'/%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 width='29' height='29' viewBox='0 0 29 29' xmlns='http://www.w3.org/2000/svg' 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.5z'/%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 width='29' height='29' viewBox='0 0 29 29' xmlns='http://www.w3.org/2000/svg' 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 13h-9z'/%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 width='29' height='29' viewBox='0 0 29 29' xmlns='http://www.w3.org/2000/svg' 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.5z'/%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 width='29' height='29' viewBox='0 0 29 29' xmlns='http://www.w3.org/2000/svg'%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 13h-9z'/%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 width='29' height='29' viewBox='0 0 29 29' xmlns='http://www.w3.org/2000/svg'%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.5z'/%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 width='29' height='29' viewBox='0 0 29 29' xmlns='http://www.w3.org/2000/svg' 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-3h1zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16h1zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5H13zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1V7.5z'/%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 width='29' height='29' viewBox='0 0 29 29' xmlns='http://www.w3.org/2000/svg'%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-1h-5.5zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1v-5.5zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1v5.5zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1h5.5z'/%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 width='29' height='29' viewBox='0 0 29 29' xmlns='http://www.w3.org/2000/svg' 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-3h1zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16h1zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5H13zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1V7.5z'/%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 width='29' height='29' viewBox='0 0 29 29' xmlns='http://www.w3.org/2000/svg' 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-1h-5.5zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1v-5.5zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1v5.5zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1h5.5z'/%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 width='29' height='29' viewBox='0 0 29 29' xmlns='http://www.w3.org/2000/svg'%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-3h1zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16h1zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5H13zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1V7.5z'/%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 width='29' height='29' viewBox='0 0 29 29' xmlns='http://www.w3.org/2000/svg'%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-1h-5.5zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1v-5.5zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1v5.5zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1h5.5z'/%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 width='29' height='29' viewBox='0 0 29 29' xmlns='http://www.w3.org/2000/svg' fill='%23333'%3E%3Cpath d='M10.5 14l4-8 4 8h-8z'/%3E%3Cpath d='M10.5 16l4 8 4-8h-8z' fill='%23ccc'/%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 width='29' height='29' viewBox='0 0 29 29' xmlns='http://www.w3.org/2000/svg' fill='%23fff'%3E%3Cpath d='M10.5 14l4-8 4 8h-8z'/%3E%3Cpath d='M10.5 16l4 8 4-8h-8z' fill='%23999'/%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 width='29' height='29' viewBox='0 0 29 29' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.5 14l4-8 4 8h-8z'/%3E%3Cpath d='M10.5 16l4 8 4-8h-8z' fill='%23ccc'/%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 width='29' height='29' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23333'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 005.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 009 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 003.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0011 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 110 7 3.5 3.5 0 110-7z'/%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 width='29' height='29' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23aaa'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 005.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 009 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 003.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0011 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 110 7 3.5 3.5 0 110-7z'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3Cpath d='M14 5l1 1-9 9-1-1 9-9z' fill='red'/%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 width='29' height='29' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%2333b5e5'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 005.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 009 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 003.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0011 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 110 7 3.5 3.5 0 110-7z'/%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 width='29' height='29' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23e58978'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 005.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 009 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 003.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0011 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 110 7 3.5 3.5 0 110-7z'/%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 width='29' height='29' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%2333b5e5'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 005.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 009 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 003.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0011 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 110 7 3.5 3.5 0 110-7z'/%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 width='29' height='29' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23e54e33'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 005.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 009 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 003.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0011 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 110 7 3.5 3.5 0 110-7z'/%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 width='29' height='29' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23fff'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 005.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 009 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 003.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0011 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 110 7 3.5 3.5 0 110-7z'/%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 width='29' height='29' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23999'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 005.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 009 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 003.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0011 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 110 7 3.5 3.5 0 110-7z'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3Cpath d='M14 5l1 1-9 9-1-1 9-9z' fill='red'/%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 width='29' height='29' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%2333b5e5'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 005.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 009 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 003.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0011 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 110 7 3.5 3.5 0 110-7z'/%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 width='29' height='29' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23e58978'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 005.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 009 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 003.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0011 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 110 7 3.5 3.5 0 110-7z'/%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 width='29' height='29' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%2333b5e5'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 005.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 009 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 003.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0011 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 110 7 3.5 3.5 0 110-7z'/%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 width='29' height='29' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23e54e33'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 005.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 009 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 003.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0011 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 110 7 3.5 3.5 0 110-7z'/%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 width='29' height='29' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 005.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 009 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 003.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0011 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 110 7 3.5 3.5 0 110-7z'/%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 width='29' height='29' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23666'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 005.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 009 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 003.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0011 5.1V5s0-1-1-1zm0 2.5a3.5 3.5 0 110 7 3.5 3.5 0 110-7z'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3Cpath d='M14 5l1 1-9 9-1-1 9-9z' fill='red'/%3E%3C/svg%3E")}}
@-webkit-keyframes maplibregl-spin{0%{-webkit-transform:rotate(0deg)}to{-webkit-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{width:88px;height:23px;margin:0 0 -4px -4px;display:block;background-repeat:no-repeat;cursor:pointer;overflow:hidden;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 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.42l-.726 3.663a1.255 1.255 0 01-1.232 1.011h-1.827a1.255 1.255 0 01-1.229-1.509l2.501-12.095a1.255 1.255 0 011.23-1.001h.197a1.255 1.255 0 011.12.685l3.19 6.273 3.125-6.263a1.255 1.255 0 011.123-.695h.181a1.255 1.255 0 011.227.991l1.443 6.71a5.11 5.11 0 01.314-.787l.009-.016a4.623 4.623 0 011.777-1.887c.782-.46 1.668-.667 2.611-.667a4.548 4.548 0 011.7.32l.306.134c.21-.16.474-.256.759-.256h1.694a1.255 1.255 0 011.212.925 1.255 1.255 0 011.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.4.314.319.566.676.763 1.064V4.701a1.255 1.255 0 011.255-1.255h1.86A1.255 1.255 0 0154.44 4.7v9.194h2.217c.19 0 .37.043.532.118v-4.77c0-.356.147-.678.385-.906a2.416 2.416 0 01-.682-1.71c0-.665.267-1.253.735-1.7a2.448 2.448 0 011.722-.674 2.43 2.43 0 011.705.675c.211.2.381.43.504.683V4.7a1.255 1.255 0 011.255-1.255h1.744A1.255 1.255 0 0165.812 4.7v3.335a4.76 4.76 0 011.526-.246c.938 0 1.817.214 2.59.69a4.47 4.47 0 011.67 1.743v-.98a1.255 1.255 0 011.256-1.256h1.777c.233 0 .451.064.639.174a3.407 3.407 0 011.567-.372c.346 0 .861.02 1.285.232a1.255 1.255 0 01.689 1.004 4.73 4.73 0 01.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.528 0 .343-.02.694-.056 1.051a1.255 1.255 0 01-.947 1.09l.408.952a1.255 1.255 0 01-.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.815 5.815 0 01-.548-2.512c0-.286.017-.567.053-.843a1.255 1.255 0 01-.333-.086l-.166-.004c-.223 0-.426.062-.643.228-.03.024-.142.139-.142.59v3.883a1.255 1.255 0 01-1.256 1.256h-1.777a1.255 1.255 0 01-1.256-1.256V15.69l-.032.057a4.778 4.778 0 01-1.86 1.833 5.04 5.04 0 01-2.484.634 4.47 4.47 0 01-1.935-.424 1.252 1.252 0 01-.764.258h-1.71a1.255 1.255 0 01-1.256-1.255V7.687a2.402 2.402 0 01-.428.625c.253.23.412.561.412.93v7.553a1.255 1.255 0 01-1.256 1.255h-1.843a1.25 1.25 0 01-.894-.373c-.228.23-.544.373-.894.373H51.32a1.255 1.255 0 01-1.256-1.255v-1.251l-.061.117a4.703 4.703 0 01-1.782 1.884 4.767 4.767 0 01-2.485.67 5.6 5.6 0 01-1.485-.188l.009 2.764a1.255 1.255 0 01-1.255 1.259h-1.729a1.255 1.255 0 01-1.255-1.255v-3.537a1.255 1.255 0 01-1.167.793h-1.679a1.25 1.25 0 01-.77-.263 4.47 4.47 0 01-1.945.429c-.885 0-1.724-.21-2.495-.632l-.017-.01a4.983 4.983 0 01-1.081-.836 1.255 1.255 0 01-1.254 1.312h-1.81a1.255 1.255 0 01-1.228-.99l-.782-3.625-2.044 3.939a1.255 1.255 0 01-1.115.676h-.098a1.255 1.255 0 01-1.116-.68l-2.061-3.994zM35.92 16.63l.207-.114.223-.15c.329-.237.574-.499.735-.785l.061-.118.033 1.332h1.678V9.242h-1.694l-.033 1.267c-.088-.22-.264-.438-.526-.658l-.032-.028a3.16 3.16 0 00-.668-.428l-.27-.12a3.293 3.293 0 00-1.235-.23c-.757 0-1.415.163-1.974.493a3.36 3.36 0 00-1.3 1.382c-.297.593-.444 1.284-.444 2.074 0 .8.17 1.503.51 2.107a3.795 3.795 0 001.382 1.381 3.883 3.883 0 001.893.477c.53 0 1.015-.11 1.455-.33zm-2.789-5.38c-.384.45-.575 1.038-.575 1.762 0 .735.186 1.332.559 1.794.384.45.933.675 1.645.675a2.25 2.25 0 00.934-.19 2.17 2.17 0 00.468-.29l.178-.161a2.163 2.163 0 00.397-.561c.163-.333.244-.717.244-1.15v-.115c0-.472-.098-.894-.296-1.267l-.043-.077a2.211 2.211 0 00-.633-.709l-.13-.086-.047-.028a2.099 2.099 0 00-1.073-.285c-.702 0-1.244.231-1.629.692zm2.316 2.706c.163-.17.28-.407.28-.83v-.114c0-.292-.06-.508-.15-.68a.958.958 0 00-.353-.389.851.851 0 00-.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.626 2.626 0 00.331.423c.213.22.464.402.755.548l.173.074c.433.17.93.255 1.49.255.68 0 1.295-.165 1.844-.493a3.447 3.447 0 001.316-1.4c.329-.603.493-1.299.493-2.089 0-1.273-.33-2.243-.988-2.913-.658-.68-1.52-1.02-2.584-1.02-.598 0-1.124.115-1.575.347a2.807 2.807 0 00-.415.262l-.199.166a3.35 3.35 0 00-.64.82V9.242h-1.712v11.553h1.729l-.017-5.134zm.53-1.138c.137.193.297.36.48.5l.155.11.053.034c.34.197.713.297 1.119.297.714 0 1.262-.225 1.645-.675.385-.46.576-1.048.576-1.762 0-.746-.192-1.338-.576-1.777-.372-.45-.92-.675-1.645-.675-.29 0-.569.053-.835.16a2.366 2.366 0 00-.284.136 1.99 1.99 0 00-.363.254 2.237 2.237 0 00-.46.569l-.082.162a2.56 2.56 0 00-.213 1.072v.115c0 .471.098.894.296 1.267l.135.211zm.964-.818a1.11 1.11 0 00.367.385.937.937 0 00.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-.221a.995.995 0 00-.503.135l-.012.007a.859.859 0 00-.335.343c-.073.133-.132.324-.132.614v.115a1.43 1.43 0 00.14.66zm15.7-6.222c.232-.23.346-.516.346-.856a1.053 1.053 0 00-.345-.79 1.175 1.175 0 00-.84-.329c-.34 0-.625.11-.855.33a1.053 1.053 0 00-.346.79c0 .34.115.625.346.855.23.23.516.346.856.346.34 0 .62-.115.839-.346zm4.337 9.314l.033-1.332c.128.269.324.518.59.747l.098.081a3.727 3.727 0 00.316.224l.223.122a3.21 3.21 0 001.44.322 3.785 3.785 0 001.875-.477 3.52 3.52 0 001.382-1.366c.352-.593.526-1.29.526-2.09 0-.79-.147-1.48-.444-2.073a3.235 3.235 0 00-1.283-1.399c-.549-.34-1.195-.51-1.942-.51a3.476 3.476 0 00-1.527.344l-.086.043-.165.09a3.412 3.412 0 00-.33.214c-.288.21-.507.446-.656.707a1.893 1.893 0 00-.099.198l.082-1.283V4.701h-1.744v12.095zm.473-2.509a2.482 2.482 0 00.566.7c.078.065.159.125.245.18l.144.08a2.105 2.105 0 00.975.232c.713 0 1.262-.225 1.645-.675.384-.46.576-1.053.576-1.778 0-.734-.192-1.327-.576-1.777-.373-.46-.921-.692-1.645-.692a2.18 2.18 0 00-1.015.235c-.147.075-.285.17-.415.282l-.15.142a2.086 2.086 0 00-.42.594c-.149.32-.223.685-.223 1.1v.115c0 .47.097.89.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.868.868 0 00-.681.279l-.012.011c-.154.155-.274.38-.274.807v.115c0 .285.057.499.144.669a1.13 1.13 0 00.367.405c.137.082.28.123.455.123.423 0 .59-.118.686-.23zm8.266-3.013c.23-.087.472-.134.724-.14l.069-.002c.329 0 .542.033.642.099l.247-1.794c-.13-.066-.37-.099-.717-.099a2.3 2.3 0 00-.545.063 2.086 2.086 0 00-.411.148 2.18 2.18 0 00-.4.249 2.482 2.482 0 00-.485.499 2.659 2.659 0 00-.32.581l-.05.137v-1.48h-1.778v7.553h1.777v-3.884c0-.364.053-.678.159-.943a1.49 1.49 0 01.466-.636 2.52 2.52 0 01.399-.253 2.19 2.19 0 01.224-.099zm9.784 2.656l.05-.922c0-1.162-.285-2.062-.856-2.698-.559-.647-1.42-.97-2.584-.97-.746 0-1.415.163-2.007.493a3.462 3.462 0 00-1.4 1.382c-.329.604-.493 1.306-.493 2.106 0 .714.143 1.371.428 1.975.285.593.73 1.07 1.332 1.432.604.351 1.355.526 2.255.526.649 0 1.204-.062 1.668-.185l.044-.012.135-.04c.409-.122.736-.263.984-.421l-.542-1.267c-.2.108-.415.199-.642.274l-.297.087c-.34.088-.773.131-1.3.131-.636 0-1.135-.147-1.497-.444a1.573 1.573 0 01-.192-.193c-.244-.294-.415-.705-.512-1.234l-.004-.021h5.43zm-5.427-1.256l-.003.022h3.752v-.138c-.007-.485-.104-.857-.288-1.118a1.056 1.056 0 00-.156-.176c-.307-.285-.746-.428-1.316-.428-.657 0-1.155.202-1.494.604-.253.3-.417.712-.494 1.234zm-27.053 2.77V4.7h-1.86v12.095h5.333V15.15zm7.103-5.908v7.553h-1.843V9.242h1.843z' fill='%23000' fill-opacity='.4' fill-rule='evenodd'/%3E%3Cpath d='M19.63 11.151l-.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.81c-.68 0-1.311-.16-1.893-.478a3.795 3.795 0 01-1.381-1.382c-.34-.604-.51-1.306-.51-2.106 0-.79.147-1.482.444-2.074a3.364 3.364 0 011.3-1.382c.559-.33 1.217-.494 1.974-.494a3.293 3.293 0 011.234.231 3.341 3.341 0 01.97.575c.264.22.44.439.527.659l.033-1.267h1.694v7.553H37.18l-.033-1.332c-.186.395-.526.746-1.02 1.053a3.167 3.167 0 01-1.662.444zm.296-1.482c.626 0 1.152-.214 1.58-.642.428-.44.642-1.01.642-1.711v-.115c0-.472-.098-.894-.296-1.267a2.211 2.211 0 00-.807-.872 2.098 2.098 0 00-1.119-.313c-.702 0-1.245.231-1.629.692-.384.45-.575 1.037-.575 1.76 0 .736.186 1.333.559 1.795.384.45.933.675 1.645.675zm6.521-6.237h1.711v1.4c.604-1.065 1.547-1.597 2.83-1.597 1.064 0 1.926.34 2.584 1.02.659.67.988 1.641.988 2.914 0 .79-.164 1.487-.493 2.09a3.456 3.456 0 01-1.316 1.399 3.51 3.51 0 01-1.844.493c-.636 0-1.19-.11-1.662-.329a2.665 2.665 0 01-1.086-.97l.017 5.134h-1.728V9.242zm4.048 6.22c.714 0 1.262-.224 1.645-.674.385-.46.576-1.048.576-1.762 0-.746-.192-1.338-.576-1.777-.372-.45-.92-.675-1.645-.675-.395 0-.768.098-1.12.296-.34.187-.613.46-.822.823-.197.351-.296.763-.296 1.234v.115c0 .472.098.894.296 1.267.209.362.483.647.823.855.34.197.713.297 1.119.297z' fill='%23fff'/%3E%3Cpath d='M51.325 4.7h1.86v10.45h3.473v1.646h-5.333zm7.12 4.542h1.843v7.553h-1.843zm.905-1.415a1.159 1.159 0 01-.856-.346 1.165 1.165 0 01-.346-.856 1.053 1.053 0 01.346-.79c.23-.219.516-.329.856-.329.329 0 .609.11.839.33a1.053 1.053 0 01.345.79 1.159 1.159 0 01-.345.855c-.22.23-.5.346-.84.346zm7.875 9.133a3.167 3.167 0 01-1.662-.444c-.482-.307-.817-.658-1.004-1.053l-.033 1.332h-1.71V4.701h1.743v4.657l-.082 1.283c.186-.438.548-.812 1.086-1.119a3.486 3.486 0 011.778-.477c.746 0 1.393.17 1.942.51a3.235 3.235 0 011.283 1.4c.297.592.444 1.282.444 2.072 0 .8-.175 1.498-.526 2.09a3.52 3.52 0 01-1.382 1.366 3.785 3.785 0 01-1.876.477zm-.296-1.481c.713 0 1.26-.225 1.645-.675.384-.46.577-1.053.577-1.778 0-.734-.193-1.327-.577-1.776-.373-.46-.921-.692-1.645-.692a2.115 2.115 0 00-1.58.659c-.428.428-.642.992-.642 1.694v.115c0 .473.098.895.296 1.267a2.385 2.385 0 00.807.872 2.1 2.1 0 001.119.313zm5.927-6.237h1.777v1.481c.176-.505.46-.91.856-1.217a2.14 2.14 0 011.349-.46c.351 0 .593.032.724.098l-.247 1.794c-.099-.066-.313-.099-.642-.099-.516 0-.988.164-1.416.494-.417.329-.626.855-.626 1.58v3.883h-1.777V9.242zm9.534 7.718c-.9 0-1.651-.175-2.255-.526-.603-.362-1.047-.84-1.332-1.432a4.567 4.567 0 01-.428-1.975c0-.8.164-1.502.493-2.106a3.462 3.462 0 011.4-1.382c.592-.33 1.262-.494 2.007-.494 1.163 0 2.024.324 2.584.97.57.637.856 1.537.856 2.7 0 .296-.017.603-.05.92h-5.43c.12.67.356 1.153.708 1.45.362.296.86.443 1.497.443.526 0 .96-.044 1.3-.131a4.123 4.123 0 00.938-.362l.542 1.267c-.274.175-.647.329-1.119.46-.472.132-1.042.197-1.711.197zm1.596-4.558c.01-.68-.137-1.158-.444-1.432-.307-.285-.746-.428-1.316-.428-1.152 0-1.815.62-1.991 1.86h3.752z' fill='%23e1e3e9'/%3E%3Cg fill-rule='evenodd' stroke-width='1.036'%3E%3Cpath d='M8.166 16.146l-.002.002a1.54 1.54 0 01-2.009 0l-.002-.002-.043-.034-.002-.002-.199-.162H4.377a.657.657 0 00-.659.659v1.84a.657.657 0 00.659.659h5.565a.657.657 0 00.659-.659v-1.84a.657.657 0 00-.659-.659H8.411l-.202.164zm-1.121-.905a.29.29 0 00.113.023.286.286 0 00.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.063a.628.628 0 00.074.047zm-2.52-.548a16.898 16.898 0 01-1.183-1.315C2.187 11.942.967 9.897.967 7.555c0-3.319 2.855-5.88 6.192-5.88 3.338 0 6.193 2.561 6.193 5.881 0 2.34-1.22 4.387-2.376 5.822a16.898 16.898 0 01-1.182 1.315h.15a1.912 1.912 0 011.914 1.914v1.84a1.912 1.912 0 01-1.914 1.914H4.377a1.912 1.912 0 01-1.914-1.914v-1.84a1.912 1.912 0 011.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' fill='%23000' fill-opacity='.4'/%3E%3Cpath d='M2.222 7.555c0-2.55 2.214-4.625 4.937-4.625 2.723 0 4.938 2.075 4.938 4.625 0 3.832-4.038 7.068-4.672 7.575l-.077.063a.286.286 0 01-.189.07.286.286 0 01-.188-.07l-.077-.063c-.634-.507-4.672-3.743-4.672-7.575zm4.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' fill='%23e1e3e9'/%3E%3Cpath d='M4.377 15.948a.657.657 0 00-.659.659v1.84a.657.657 0 00.659.659h5.565a.657.657 0 00.659-.659v-1.84a.657.657 0 00-.659-.659zm4.83 1.16H5.114v.838h4.093z' fill='%23fff'/%3E%3C/g%3E%3C/svg%3E")}
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 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.42l-.726 3.663a1.255 1.255 0 01-1.232 1.011h-1.827a1.255 1.255 0 01-1.229-1.509l2.501-12.095a1.255 1.255 0 011.23-1.001h.197a1.255 1.255 0 011.12.685l3.19 6.273 3.125-6.263a1.255 1.255 0 011.123-.695h.181a1.255 1.255 0 011.227.991l1.443 6.71a5.11 5.11 0 01.314-.787l.009-.016a4.623 4.623 0 011.777-1.887c.782-.46 1.668-.667 2.611-.667a4.548 4.548 0 011.7.32l.306.134c.21-.16.474-.256.759-.256h1.694a1.255 1.255 0 011.212.925 1.255 1.255 0 011.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.4.314.319.566.676.763 1.064V4.701a1.255 1.255 0 011.255-1.255h1.86A1.255 1.255 0 0154.44 4.7v9.194h2.217c.19 0 .37.043.532.118v-4.77c0-.356.147-.678.385-.906a2.416 2.416 0 01-.682-1.71c0-.665.267-1.253.735-1.7a2.448 2.448 0 011.722-.674 2.43 2.43 0 011.705.675c.211.2.381.43.504.683V4.7a1.255 1.255 0 011.255-1.255h1.744A1.255 1.255 0 0165.812 4.7v3.335a4.76 4.76 0 011.526-.246c.938 0 1.817.214 2.59.69a4.47 4.47 0 011.67 1.743v-.98a1.255 1.255 0 011.256-1.256h1.777c.233 0 .451.064.639.174a3.407 3.407 0 011.567-.372c.346 0 .861.02 1.285.232a1.255 1.255 0 01.689 1.004 4.73 4.73 0 01.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.528 0 .343-.02.694-.056 1.051a1.255 1.255 0 01-.947 1.09l.408.952a1.255 1.255 0 01-.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.815 5.815 0 01-.548-2.512c0-.286.017-.567.053-.843a1.255 1.255 0 01-.333-.086l-.166-.004c-.223 0-.426.062-.643.228-.03.024-.142.139-.142.59v3.883a1.255 1.255 0 01-1.256 1.256h-1.777a1.255 1.255 0 01-1.256-1.256V15.69l-.032.057a4.778 4.778 0 01-1.86 1.833 5.04 5.04 0 01-2.484.634 4.47 4.47 0 01-1.935-.424 1.252 1.252 0 01-.764.258h-1.71a1.255 1.255 0 01-1.256-1.255V7.687a2.402 2.402 0 01-.428.625c.253.23.412.561.412.93v7.553a1.255 1.255 0 01-1.256 1.255h-1.843a1.25 1.25 0 01-.894-.373c-.228.23-.544.373-.894.373H51.32a1.255 1.255 0 01-1.256-1.255v-1.251l-.061.117a4.703 4.703 0 01-1.782 1.884 4.767 4.767 0 01-2.485.67 5.6 5.6 0 01-1.485-.188l.009 2.764a1.255 1.255 0 01-1.255 1.259h-1.729a1.255 1.255 0 01-1.255-1.255v-3.537a1.255 1.255 0 01-1.167.793h-1.679a1.25 1.25 0 01-.77-.263 4.47 4.47 0 01-1.945.429c-.885 0-1.724-.21-2.495-.632l-.017-.01a4.983 4.983 0 01-1.081-.836 1.255 1.255 0 01-1.254 1.312h-1.81a1.255 1.255 0 01-1.228-.99l-.782-3.625-2.044 3.939a1.255 1.255 0 01-1.115.676h-.098a1.255 1.255 0 01-1.116-.68l-2.061-3.994zM35.92 16.63l.207-.114.223-.15c.329-.237.574-.499.735-.785l.061-.118.033 1.332h1.678V9.242h-1.694l-.033 1.267c-.088-.22-.264-.438-.526-.658l-.032-.028a3.16 3.16 0 00-.668-.428l-.27-.12a3.293 3.293 0 00-1.235-.23c-.757 0-1.415.163-1.974.493a3.36 3.36 0 00-1.3 1.382c-.297.593-.444 1.284-.444 2.074 0 .8.17 1.503.51 2.107a3.795 3.795 0 001.382 1.381 3.883 3.883 0 001.893.477c.53 0 1.015-.11 1.455-.33zm-2.789-5.38c-.384.45-.575 1.038-.575 1.762 0 .735.186 1.332.559 1.794.384.45.933.675 1.645.675a2.25 2.25 0 00.934-.19 2.17 2.17 0 00.468-.29l.178-.161a2.163 2.163 0 00.397-.561c.163-.333.244-.717.244-1.15v-.115c0-.472-.098-.894-.296-1.267l-.043-.077a2.211 2.211 0 00-.633-.709l-.13-.086-.047-.028a2.099 2.099 0 00-1.073-.285c-.702 0-1.244.231-1.629.692zm2.316 2.706c.163-.17.28-.407.28-.83v-.114c0-.292-.06-.508-.15-.68a.958.958 0 00-.353-.389.851.851 0 00-.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.626 2.626 0 00.331.423c.213.22.464.402.755.548l.173.074c.433.17.93.255 1.49.255.68 0 1.295-.165 1.844-.493a3.447 3.447 0 001.316-1.4c.329-.603.493-1.299.493-2.089 0-1.273-.33-2.243-.988-2.913-.658-.68-1.52-1.02-2.584-1.02-.598 0-1.124.115-1.575.347a2.807 2.807 0 00-.415.262l-.199.166a3.35 3.35 0 00-.64.82V9.242h-1.712v11.553h1.729l-.017-5.134zm.53-1.138c.137.193.297.36.48.5l.155.11.053.034c.34.197.713.297 1.119.297.714 0 1.262-.225 1.645-.675.385-.46.576-1.048.576-1.762 0-.746-.192-1.338-.576-1.777-.372-.45-.92-.675-1.645-.675-.29 0-.569.053-.835.16a2.366 2.366 0 00-.284.136 1.99 1.99 0 00-.363.254 2.237 2.237 0 00-.46.569l-.082.162a2.56 2.56 0 00-.213 1.072v.115c0 .471.098.894.296 1.267l.135.211zm.964-.818a1.11 1.11 0 00.367.385.937.937 0 00.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-.221a.995.995 0 00-.503.135l-.012.007a.859.859 0 00-.335.343c-.073.133-.132.324-.132.614v.115a1.43 1.43 0 00.14.66zm15.7-6.222c.232-.23.346-.516.346-.856a1.053 1.053 0 00-.345-.79 1.175 1.175 0 00-.84-.329c-.34 0-.625.11-.855.33a1.053 1.053 0 00-.346.79c0 .34.115.625.346.855.23.23.516.346.856.346.34 0 .62-.115.839-.346zm4.337 9.314l.033-1.332c.128.269.324.518.59.747l.098.081a3.727 3.727 0 00.316.224l.223.122a3.21 3.21 0 001.44.322 3.785 3.785 0 001.875-.477 3.52 3.52 0 001.382-1.366c.352-.593.526-1.29.526-2.09 0-.79-.147-1.48-.444-2.073a3.235 3.235 0 00-1.283-1.399c-.549-.34-1.195-.51-1.942-.51a3.476 3.476 0 00-1.527.344l-.086.043-.165.09a3.412 3.412 0 00-.33.214c-.288.21-.507.446-.656.707a1.893 1.893 0 00-.099.198l.082-1.283V4.701h-1.744v12.095zm.473-2.509a2.482 2.482 0 00.566.7c.078.065.159.125.245.18l.144.08a2.105 2.105 0 00.975.232c.713 0 1.262-.225 1.645-.675.384-.46.576-1.053.576-1.778 0-.734-.192-1.327-.576-1.777-.373-.46-.921-.692-1.645-.692a2.18 2.18 0 00-1.015.235c-.147.075-.285.17-.415.282l-.15.142a2.086 2.086 0 00-.42.594c-.149.32-.223.685-.223 1.1v.115c0 .47.097.89.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.868.868 0 00-.681.279l-.012.011c-.154.155-.274.38-.274.807v.115c0 .285.057.499.144.669a1.13 1.13 0 00.367.405c.137.082.28.123.455.123.423 0 .59-.118.686-.23zm8.266-3.013c.23-.087.472-.134.724-.14l.069-.002c.329 0 .542.033.642.099l.247-1.794c-.13-.066-.37-.099-.717-.099a2.3 2.3 0 00-.545.063 2.086 2.086 0 00-.411.148 2.18 2.18 0 00-.4.249 2.482 2.482 0 00-.485.499 2.659 2.659 0 00-.32.581l-.05.137v-1.48h-1.778v7.553h1.777v-3.884c0-.364.053-.678.159-.943a1.49 1.49 0 01.466-.636 2.52 2.52 0 01.399-.253 2.19 2.19 0 01.224-.099zm9.784 2.656l.05-.922c0-1.162-.285-2.062-.856-2.698-.559-.647-1.42-.97-2.584-.97-.746 0-1.415.163-2.007.493a3.462 3.462 0 00-1.4 1.382c-.329.604-.493 1.306-.493 2.106 0 .714.143 1.371.428 1.975.285.593.73 1.07 1.332 1.432.604.351 1.355.526 2.255.526.649 0 1.204-.062 1.668-.185l.044-.012.135-.04c.409-.122.736-.263.984-.421l-.542-1.267c-.2.108-.415.199-.642.274l-.297.087c-.34.088-.773.131-1.3.131-.636 0-1.135-.147-1.497-.444a1.573 1.573 0 01-.192-.193c-.244-.294-.415-.705-.512-1.234l-.004-.021h5.43zm-5.427-1.256l-.003.022h3.752v-.138c-.007-.485-.104-.857-.288-1.118a1.056 1.056 0 00-.156-.176c-.307-.285-.746-.428-1.316-.428-.657 0-1.155.202-1.494.604-.253.3-.417.712-.494 1.234zm-27.053 2.77V4.7h-1.86v12.095h5.333V15.15zm7.103-5.908v7.553h-1.843V9.242h1.843z' fill='%23000' fill-opacity='.4' fill-rule='evenodd'/%3E%3Cpath d='M19.63 11.151l-.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.81c-.68 0-1.311-.16-1.893-.478a3.795 3.795 0 01-1.381-1.382c-.34-.604-.51-1.306-.51-2.106 0-.79.147-1.482.444-2.074a3.364 3.364 0 011.3-1.382c.559-.33 1.217-.494 1.974-.494a3.293 3.293 0 011.234.231 3.341 3.341 0 01.97.575c.264.22.44.439.527.659l.033-1.267h1.694v7.553H37.18l-.033-1.332c-.186.395-.526.746-1.02 1.053a3.167 3.167 0 01-1.662.444zm.296-1.482c.626 0 1.152-.214 1.58-.642.428-.44.642-1.01.642-1.711v-.115c0-.472-.098-.894-.296-1.267a2.211 2.211 0 00-.807-.872 2.098 2.098 0 00-1.119-.313c-.702 0-1.245.231-1.629.692-.384.45-.575 1.037-.575 1.76 0 .736.186 1.333.559 1.795.384.45.933.675 1.645.675zm6.521-6.237h1.711v1.4c.604-1.065 1.547-1.597 2.83-1.597 1.064 0 1.926.34 2.584 1.02.659.67.988 1.641.988 2.914 0 .79-.164 1.487-.493 2.09a3.456 3.456 0 01-1.316 1.399 3.51 3.51 0 01-1.844.493c-.636 0-1.19-.11-1.662-.329a2.665 2.665 0 01-1.086-.97l.017 5.134h-1.728V9.242zm4.048 6.22c.714 0 1.262-.224 1.645-.674.385-.46.576-1.048.576-1.762 0-.746-.192-1.338-.576-1.777-.372-.45-.92-.675-1.645-.675-.395 0-.768.098-1.12.296-.34.187-.613.46-.822.823-.197.351-.296.763-.296 1.234v.115c0 .472.098.894.296 1.267.209.362.483.647.823.855.34.197.713.297 1.119.297z' fill='%23fff'/%3E%3Cpath d='M51.325 4.7h1.86v10.45h3.473v1.646h-5.333zm7.12 4.542h1.843v7.553h-1.843zm.905-1.415a1.159 1.159 0 01-.856-.346 1.165 1.165 0 01-.346-.856 1.053 1.053 0 01.346-.79c.23-.219.516-.329.856-.329.329 0 .609.11.839.33a1.053 1.053 0 01.345.79 1.159 1.159 0 01-.345.855c-.22.23-.5.346-.84.346zm7.875 9.133a3.167 3.167 0 01-1.662-.444c-.482-.307-.817-.658-1.004-1.053l-.033 1.332h-1.71V4.701h1.743v4.657l-.082 1.283c.186-.438.548-.812 1.086-1.119a3.486 3.486 0 011.778-.477c.746 0 1.393.17 1.942.51a3.235 3.235 0 011.283 1.4c.297.592.444 1.282.444 2.072 0 .8-.175 1.498-.526 2.09a3.52 3.52 0 01-1.382 1.366 3.785 3.785 0 01-1.876.477zm-.296-1.481c.713 0 1.26-.225 1.645-.675.384-.46.577-1.053.577-1.778 0-.734-.193-1.327-.577-1.776-.373-.46-.921-.692-1.645-.692a2.115 2.115 0 00-1.58.659c-.428.428-.642.992-.642 1.694v.115c0 .473.098.895.296 1.267a2.385 2.385 0 00.807.872 2.1 2.1 0 001.119.313zm5.927-6.237h1.777v1.481c.176-.505.46-.91.856-1.217a2.14 2.14 0 011.349-.46c.351 0 .593.032.724.098l-.247 1.794c-.099-.066-.313-.099-.642-.099-.516 0-.988.164-1.416.494-.417.329-.626.855-.626 1.58v3.883h-1.777V9.242zm9.534 7.718c-.9 0-1.651-.175-2.255-.526-.603-.362-1.047-.84-1.332-1.432a4.567 4.567 0 01-.428-1.975c0-.8.164-1.502.493-2.106a3.462 3.462 0 011.4-1.382c.592-.33 1.262-.494 2.007-.494 1.163 0 2.024.324 2.584.97.57.637.856 1.537.856 2.7 0 .296-.017.603-.05.92h-5.43c.12.67.356 1.153.708 1.45.362.296.86.443 1.497.443.526 0 .96-.044 1.3-.131a4.123 4.123 0 00.938-.362l.542 1.267c-.274.175-.647.329-1.119.46-.472.132-1.042.197-1.711.197zm1.596-4.558c.01-.68-.137-1.158-.444-1.432-.307-.285-.746-.428-1.316-.428-1.152 0-1.815.62-1.991 1.86h3.752z' fill='%23e1e3e9'/%3E%3Cg fill-rule='evenodd' stroke-width='1.036'%3E%3Cpath d='M8.166 16.146l-.002.002a1.54 1.54 0 01-2.009 0l-.002-.002-.043-.034-.002-.002-.199-.162H4.377a.657.657 0 00-.659.659v1.84a.657.657 0 00.659.659h5.565a.657.657 0 00.659-.659v-1.84a.657.657 0 00-.659-.659H8.411l-.202.164zm-1.121-.905a.29.29 0 00.113.023.286.286 0 00.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.063a.628.628 0 00.074.047zm-2.52-.548a16.898 16.898 0 01-1.183-1.315C2.187 11.942.967 9.897.967 7.555c0-3.319 2.855-5.88 6.192-5.88 3.338 0 6.193 2.561 6.193 5.881 0 2.34-1.22 4.387-2.376 5.822a16.898 16.898 0 01-1.182 1.315h.15a1.912 1.912 0 011.914 1.914v1.84a1.912 1.912 0 01-1.914 1.914H4.377a1.912 1.912 0 01-1.914-1.914v-1.84a1.912 1.912 0 011.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' fill='%23000' fill-opacity='.4'/%3E%3Cpath d='M2.222 7.555c0-2.55 2.214-4.625 4.937-4.625 2.723 0 4.938 2.075 4.938 4.625 0 3.832-4.038 7.068-4.672 7.575l-.077.063a.286.286 0 01-.189.07.286.286 0 01-.188-.07l-.077-.063c-.634-.507-4.672-3.743-4.672-7.575zm4.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' fill='%23e1e3e9'/%3E%3Cpath d='M4.377 15.948a.657.657 0 00-.659.659v1.84a.657.657 0 00.659.659h5.565a.657.657 0 00.659-.659v-1.84a.657.657 0 00-.659-.659zm4.83 1.16H5.114v.838h4.093z' fill='%23fff'/%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 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.42l-.726 3.663a1.255 1.255 0 01-1.232 1.011h-1.827a1.255 1.255 0 01-1.229-1.509l2.501-12.095a1.255 1.255 0 011.23-1.001h.197a1.255 1.255 0 011.12.685l3.19 6.273 3.125-6.263a1.255 1.255 0 011.123-.695h.181a1.255 1.255 0 011.227.991l1.443 6.71a5.11 5.11 0 01.314-.787l.009-.016a4.623 4.623 0 011.777-1.887c.782-.46 1.668-.667 2.611-.667a4.548 4.548 0 011.7.32l.306.134c.21-.16.474-.256.759-.256h1.694a1.255 1.255 0 011.212.925 1.255 1.255 0 011.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.4.314.319.566.676.763 1.064V4.701a1.255 1.255 0 011.255-1.255h1.86A1.255 1.255 0 0154.44 4.7v9.194h2.217c.19 0 .37.043.532.118v-4.77c0-.356.147-.678.385-.906a2.416 2.416 0 01-.682-1.71c0-.665.267-1.253.735-1.7a2.448 2.448 0 011.722-.674 2.43 2.43 0 011.705.675c.211.2.381.43.504.683V4.7a1.255 1.255 0 011.255-1.255h1.744A1.255 1.255 0 0165.812 4.7v3.335a4.76 4.76 0 011.526-.246c.938 0 1.817.214 2.59.69a4.47 4.47 0 011.67 1.743v-.98a1.255 1.255 0 011.256-1.256h1.777c.233 0 .451.064.639.174a3.407 3.407 0 011.567-.372c.346 0 .861.02 1.285.232a1.255 1.255 0 01.689 1.004 4.73 4.73 0 01.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.528 0 .343-.02.694-.056 1.051a1.255 1.255 0 01-.947 1.09l.408.952a1.255 1.255 0 01-.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.815 5.815 0 01-.548-2.512c0-.286.017-.567.053-.843a1.255 1.255 0 01-.333-.086l-.166-.004c-.223 0-.426.062-.643.228-.03.024-.142.139-.142.59v3.883a1.255 1.255 0 01-1.256 1.256h-1.777a1.255 1.255 0 01-1.256-1.256V15.69l-.032.057a4.778 4.778 0 01-1.86 1.833 5.04 5.04 0 01-2.484.634 4.47 4.47 0 01-1.935-.424 1.252 1.252 0 01-.764.258h-1.71a1.255 1.255 0 01-1.256-1.255V7.687a2.402 2.402 0 01-.428.625c.253.23.412.561.412.93v7.553a1.255 1.255 0 01-1.256 1.255h-1.843a1.25 1.25 0 01-.894-.373c-.228.23-.544.373-.894.373H51.32a1.255 1.255 0 01-1.256-1.255v-1.251l-.061.117a4.703 4.703 0 01-1.782 1.884 4.767 4.767 0 01-2.485.67 5.6 5.6 0 01-1.485-.188l.009 2.764a1.255 1.255 0 01-1.255 1.259h-1.729a1.255 1.255 0 01-1.255-1.255v-3.537a1.255 1.255 0 01-1.167.793h-1.679a1.25 1.25 0 01-.77-.263 4.47 4.47 0 01-1.945.429c-.885 0-1.724-.21-2.495-.632l-.017-.01a4.983 4.983 0 01-1.081-.836 1.255 1.255 0 01-1.254 1.312h-1.81a1.255 1.255 0 01-1.228-.99l-.782-3.625-2.044 3.939a1.255 1.255 0 01-1.115.676h-.098a1.255 1.255 0 01-1.116-.68l-2.061-3.994zM35.92 16.63l.207-.114.223-.15c.329-.237.574-.499.735-.785l.061-.118.033 1.332h1.678V9.242h-1.694l-.033 1.267c-.088-.22-.264-.438-.526-.658l-.032-.028a3.16 3.16 0 00-.668-.428l-.27-.12a3.293 3.293 0 00-1.235-.23c-.757 0-1.415.163-1.974.493a3.36 3.36 0 00-1.3 1.382c-.297.593-.444 1.284-.444 2.074 0 .8.17 1.503.51 2.107a3.795 3.795 0 001.382 1.381 3.883 3.883 0 001.893.477c.53 0 1.015-.11 1.455-.33zm-2.789-5.38c-.384.45-.575 1.038-.575 1.762 0 .735.186 1.332.559 1.794.384.45.933.675 1.645.675a2.25 2.25 0 00.934-.19 2.17 2.17 0 00.468-.29l.178-.161a2.163 2.163 0 00.397-.561c.163-.333.244-.717.244-1.15v-.115c0-.472-.098-.894-.296-1.267l-.043-.077a2.211 2.211 0 00-.633-.709l-.13-.086-.047-.028a2.099 2.099 0 00-1.073-.285c-.702 0-1.244.231-1.629.692zm2.316 2.706c.163-.17.28-.407.28-.83v-.114c0-.292-.06-.508-.15-.68a.958.958 0 00-.353-.389.851.851 0 00-.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.626 2.626 0 00.331.423c.213.22.464.402.755.548l.173.074c.433.17.93.255 1.49.255.68 0 1.295-.165 1.844-.493a3.447 3.447 0 001.316-1.4c.329-.603.493-1.299.493-2.089 0-1.273-.33-2.243-.988-2.913-.658-.68-1.52-1.02-2.584-1.02-.598 0-1.124.115-1.575.347a2.807 2.807 0 00-.415.262l-.199.166a3.35 3.35 0 00-.64.82V9.242h-1.712v11.553h1.729l-.017-5.134zm.53-1.138c.137.193.297.36.48.5l.155.11.053.034c.34.197.713.297 1.119.297.714 0 1.262-.225 1.645-.675.385-.46.576-1.048.576-1.762 0-.746-.192-1.338-.576-1.777-.372-.45-.92-.675-1.645-.675-.29 0-.569.053-.835.16a2.366 2.366 0 00-.284.136 1.99 1.99 0 00-.363.254 2.237 2.237 0 00-.46.569l-.082.162a2.56 2.56 0 00-.213 1.072v.115c0 .471.098.894.296 1.267l.135.211zm.964-.818a1.11 1.11 0 00.367.385.937.937 0 00.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-.221a.995.995 0 00-.503.135l-.012.007a.859.859 0 00-.335.343c-.073.133-.132.324-.132.614v.115a1.43 1.43 0 00.14.66zm15.7-6.222c.232-.23.346-.516.346-.856a1.053 1.053 0 00-.345-.79 1.175 1.175 0 00-.84-.329c-.34 0-.625.11-.855.33a1.053 1.053 0 00-.346.79c0 .34.115.625.346.855.23.23.516.346.856.346.34 0 .62-.115.839-.346zm4.337 9.314l.033-1.332c.128.269.324.518.59.747l.098.081a3.727 3.727 0 00.316.224l.223.122a3.21 3.21 0 001.44.322 3.785 3.785 0 001.875-.477 3.52 3.52 0 001.382-1.366c.352-.593.526-1.29.526-2.09 0-.79-.147-1.48-.444-2.073a3.235 3.235 0 00-1.283-1.399c-.549-.34-1.195-.51-1.942-.51a3.476 3.476 0 00-1.527.344l-.086.043-.165.09a3.412 3.412 0 00-.33.214c-.288.21-.507.446-.656.707a1.893 1.893 0 00-.099.198l.082-1.283V4.701h-1.744v12.095zm.473-2.509a2.482 2.482 0 00.566.7c.078.065.159.125.245.18l.144.08a2.105 2.105 0 00.975.232c.713 0 1.262-.225 1.645-.675.384-.46.576-1.053.576-1.778 0-.734-.192-1.327-.576-1.777-.373-.46-.921-.692-1.645-.692a2.18 2.18 0 00-1.015.235c-.147.075-.285.17-.415.282l-.15.142a2.086 2.086 0 00-.42.594c-.149.32-.223.685-.223 1.1v.115c0 .47.097.89.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.868.868 0 00-.681.279l-.012.011c-.154.155-.274.38-.274.807v.115c0 .285.057.499.144.669a1.13 1.13 0 00.367.405c.137.082.28.123.455.123.423 0 .59-.118.686-.23zm8.266-3.013c.23-.087.472-.134.724-.14l.069-.002c.329 0 .542.033.642.099l.247-1.794c-.13-.066-.37-.099-.717-.099a2.3 2.3 0 00-.545.063 2.086 2.086 0 00-.411.148 2.18 2.18 0 00-.4.249 2.482 2.482 0 00-.485.499 2.659 2.659 0 00-.32.581l-.05.137v-1.48h-1.778v7.553h1.777v-3.884c0-.364.053-.678.159-.943a1.49 1.49 0 01.466-.636 2.52 2.52 0 01.399-.253 2.19 2.19 0 01.224-.099zm9.784 2.656l.05-.922c0-1.162-.285-2.062-.856-2.698-.559-.647-1.42-.97-2.584-.97-.746 0-1.415.163-2.007.493a3.462 3.462 0 00-1.4 1.382c-.329.604-.493 1.306-.493 2.106 0 .714.143 1.371.428 1.975.285.593.73 1.07 1.332 1.432.604.351 1.355.526 2.255.526.649 0 1.204-.062 1.668-.185l.044-.012.135-.04c.409-.122.736-.263.984-.421l-.542-1.267c-.2.108-.415.199-.642.274l-.297.087c-.34.088-.773.131-1.3.131-.636 0-1.135-.147-1.497-.444a1.573 1.573 0 01-.192-.193c-.244-.294-.415-.705-.512-1.234l-.004-.021h5.43zm-5.427-1.256l-.003.022h3.752v-.138c-.007-.485-.104-.857-.288-1.118a1.056 1.056 0 00-.156-.176c-.307-.285-.746-.428-1.316-.428-.657 0-1.155.202-1.494.604-.253.3-.417.712-.494 1.234zm-27.053 2.77V4.7h-1.86v12.095h5.333V15.15zm7.103-5.908v7.553h-1.843V9.242h1.843z' fill='%23000' fill-opacity='.4' fill-rule='evenodd'/%3E%3Cpath d='M19.63 11.151l-.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.81c-.68 0-1.311-.16-1.893-.478a3.795 3.795 0 01-1.381-1.382c-.34-.604-.51-1.306-.51-2.106 0-.79.147-1.482.444-2.074a3.364 3.364 0 011.3-1.382c.559-.33 1.217-.494 1.974-.494a3.293 3.293 0 011.234.231 3.341 3.341 0 01.97.575c.264.22.44.439.527.659l.033-1.267h1.694v7.553H37.18l-.033-1.332c-.186.395-.526.746-1.02 1.053a3.167 3.167 0 01-1.662.444zm.296-1.482c.626 0 1.152-.214 1.58-.642.428-.44.642-1.01.642-1.711v-.115c0-.472-.098-.894-.296-1.267a2.211 2.211 0 00-.807-.872 2.098 2.098 0 00-1.119-.313c-.702 0-1.245.231-1.629.692-.384.45-.575 1.037-.575 1.76 0 .736.186 1.333.559 1.795.384.45.933.675 1.645.675zm6.521-6.237h1.711v1.4c.604-1.065 1.547-1.597 2.83-1.597 1.064 0 1.926.34 2.584 1.02.659.67.988 1.641.988 2.914 0 .79-.164 1.487-.493 2.09a3.456 3.456 0 01-1.316 1.399 3.51 3.51 0 01-1.844.493c-.636 0-1.19-.11-1.662-.329a2.665 2.665 0 01-1.086-.97l.017 5.134h-1.728V9.242zm4.048 6.22c.714 0 1.262-.224 1.645-.674.385-.46.576-1.048.576-1.762 0-.746-.192-1.338-.576-1.777-.372-.45-.92-.675-1.645-.675-.395 0-.768.098-1.12.296-.34.187-.613.46-.822.823-.197.351-.296.763-.296 1.234v.115c0 .472.098.894.296 1.267.209.362.483.647.823.855.34.197.713.297 1.119.297z' fill='%23fff'/%3E%3Cpath d='M51.325 4.7h1.86v10.45h3.473v1.646h-5.333zm7.12 4.542h1.843v7.553h-1.843zm.905-1.415a1.159 1.159 0 01-.856-.346 1.165 1.165 0 01-.346-.856 1.053 1.053 0 01.346-.79c.23-.219.516-.329.856-.329.329 0 .609.11.839.33a1.053 1.053 0 01.345.79 1.159 1.159 0 01-.345.855c-.22.23-.5.346-.84.346zm7.875 9.133a3.167 3.167 0 01-1.662-.444c-.482-.307-.817-.658-1.004-1.053l-.033 1.332h-1.71V4.701h1.743v4.657l-.082 1.283c.186-.438.548-.812 1.086-1.119a3.486 3.486 0 011.778-.477c.746 0 1.393.17 1.942.51a3.235 3.235 0 011.283 1.4c.297.592.444 1.282.444 2.072 0 .8-.175 1.498-.526 2.09a3.52 3.52 0 01-1.382 1.366 3.785 3.785 0 01-1.876.477zm-.296-1.481c.713 0 1.26-.225 1.645-.675.384-.46.577-1.053.577-1.778 0-.734-.193-1.327-.577-1.776-.373-.46-.921-.692-1.645-.692a2.115 2.115 0 00-1.58.659c-.428.428-.642.992-.642 1.694v.115c0 .473.098.895.296 1.267a2.385 2.385 0 00.807.872 2.1 2.1 0 001.119.313zm5.927-6.237h1.777v1.481c.176-.505.46-.91.856-1.217a2.14 2.14 0 011.349-.46c.351 0 .593.032.724.098l-.247 1.794c-.099-.066-.313-.099-.642-.099-.516 0-.988.164-1.416.494-.417.329-.626.855-.626 1.58v3.883h-1.777V9.242zm9.534 7.718c-.9 0-1.651-.175-2.255-.526-.603-.362-1.047-.84-1.332-1.432a4.567 4.567 0 01-.428-1.975c0-.8.164-1.502.493-2.106a3.462 3.462 0 011.4-1.382c.592-.33 1.262-.494 2.007-.494 1.163 0 2.024.324 2.584.97.57.637.856 1.537.856 2.7 0 .296-.017.603-.05.92h-5.43c.12.67.356 1.153.708 1.45.362.296.86.443 1.497.443.526 0 .96-.044 1.3-.131a4.123 4.123 0 00.938-.362l.542 1.267c-.274.175-.647.329-1.119.46-.472.132-1.042.197-1.711.197zm1.596-4.558c.01-.68-.137-1.158-.444-1.432-.307-.285-.746-.428-1.316-.428-1.152 0-1.815.62-1.991 1.86h3.752z' fill='%23e1e3e9'/%3E%3Cg fill-rule='evenodd' stroke-width='1.036'%3E%3Cpath d='M8.166 16.146l-.002.002a1.54 1.54 0 01-2.009 0l-.002-.002-.043-.034-.002-.002-.199-.162H4.377a.657.657 0 00-.659.659v1.84a.657.657 0 00.659.659h5.565a.657.657 0 00.659-.659v-1.84a.657.657 0 00-.659-.659H8.411l-.202.164zm-1.121-.905a.29.29 0 00.113.023.286.286 0 00.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.063a.628.628 0 00.074.047zm-2.52-.548a16.898 16.898 0 01-1.183-1.315C2.187 11.942.967 9.897.967 7.555c0-3.319 2.855-5.88 6.192-5.88 3.338 0 6.193 2.561 6.193 5.881 0 2.34-1.22 4.387-2.376 5.822a16.898 16.898 0 01-1.182 1.315h.15a1.912 1.912 0 011.914 1.914v1.84a1.912 1.912 0 01-1.914 1.914H4.377a1.912 1.912 0 01-1.914-1.914v-1.84a1.912 1.912 0 011.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' fill='%23000' fill-opacity='.4'/%3E%3Cpath d='M2.222 7.555c0-2.55 2.214-4.625 4.937-4.625 2.723 0 4.938 2.075 4.938 4.625 0 3.832-4.038 7.068-4.672 7.575l-.077.063a.286.286 0 01-.189.07.286.286 0 01-.188-.07l-.077-.063c-.634-.507-4.672-3.743-4.672-7.575zm4.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' fill='%23e1e3e9'/%3E%3Cpath d='M4.377 15.948a.657.657 0 00-.659.659v1.84a.657.657 0 00.659.659h5.565a.657.657 0 00.659-.659v-1.84a.657.657 0 00-.659-.659zm4.83 1.16H5.114v.838h4.093z' fill='%23fff'/%3E%3C/g%3E%3C/svg%3E")}}
.mapboxgl-ctrl.mapboxgl-ctrl-attrib, .maplibregl-ctrl.maplibregl-ctrl-attrib{padding:0 5px;background-color:hsla(0,0%,100%,.5);margin:0}
@media screen{.mapboxgl-ctrl-attrib.mapboxgl-compact, .maplibregl-ctrl-attrib.maplibregl-compact{min-height:20px;padding:2px 24px 2px 0;margin:10px;position:relative;background-color:#fff;border-radius:12px}.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{padding:2px 8px 2px 28px;border-radius:12px}.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{display:none;cursor:pointer;position:absolute;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd'%3E%3Cpath d='M4 10a6 6 0 1012 0 6 6 0 10-12 0m5-3a1 1 0 102 0 1 1 0 10-2 0m0 3a1 1 0 112 0v3a1 1 0 11-2 0'/%3E%3C/svg%3E");background-color:hsla(0,0%,100%,.5);width:24px;height:24px;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:12px;outline:none;top:0;right:0;border:0}.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-show .mapboxgl-ctrl-attrib-inner, .mapboxgl-ctrl-attrib.mapboxgl-compact .mapboxgl-ctrl-attrib-button, .maplibregl-ctrl-attrib.maplibregl-compact-show .maplibregl-ctrl-attrib-inner, .maplibregl-ctrl-attrib.maplibregl-compact .maplibregl-ctrl-attrib-button{display:block}.mapboxgl-ctrl-attrib.mapboxgl-compact-show .mapboxgl-ctrl-attrib-button, .maplibregl-ctrl-attrib.maplibregl-compact-show .maplibregl-ctrl-attrib-button{background-color:rgba(0,0,0,.05)}.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{top:0;right:0}.mapboxgl-ctrl-top-left>.mapboxgl-ctrl-attrib.mapboxgl-compact:after, .maplibregl-ctrl-top-left>.maplibregl-ctrl-attrib.maplibregl-compact:after{top:0;left: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 width='24' height='24' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd' fill='%23fff'%3E%3Cpath d='M4 10a6 6 0 1012 0 6 6 0 10-12 0m5-3a1 1 0 102 0 1 1 0 10-2 0m0 3a1 1 0 112 0v3a1 1 0 11-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 width='24' height='24' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd'%3E%3Cpath d='M4 10a6 6 0 1012 0 6 6 0 10-12 0m5-3a1 1 0 102 0 1 1 0 10-2 0m0 3a1 1 0 112 0v3a1 1 0 11-2 0'/%3E%3C/svg%3E")}}
.mapboxgl-ctrl-attrib a, .maplibregl-ctrl-attrib a{color:rgba(0,0,0,.75);text-decoration:none}
.mapboxgl-ctrl-attrib a:hover, .maplibregl-ctrl-attrib a:hover{color:inherit;text-decoration:underline}
.mapboxgl-ctrl-attrib .mapbox-improve-map, .maplibregl-ctrl-attrib .mapbox-improve-map{font-weight:700;margin-left:2px}
.mapboxgl-attrib-empty, .maplibregl-attrib-empty{display:none}
.mapboxgl-ctrl-scale, .maplibregl-ctrl-scale{background-color:hsla(0,0%,100%,.75);font-size:10px;border:2px solid #333;border-top:#333;padding:0 5px;color:#333;-webkit-box-sizing:border-box;box-sizing:border-box}
.mapboxgl-popup, .maplibregl-popup{position:absolute;top:0;left:0;display:-webkit-box;display:-ms-flexbox;display:flex;will-change:transform;pointer-events:none}
.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{width:0;height:0;border:10px solid transparent;z-index:1}
.mapboxgl-popup-anchor-top .mapboxgl-popup-tip, .maplibregl-popup-anchor-top .maplibregl-popup-tip{-webkit-align-self:center;-ms-flex-item-align:center;align-self:center;border-top:none;border-bottom-color:#fff}
.mapboxgl-popup-anchor-top-left .mapboxgl-popup-tip, .maplibregl-popup-anchor-top-left .maplibregl-popup-tip{-webkit-align-self:flex-start;-ms-flex-item-align:start;align-self:flex-start;border-top:none;border-left:none;border-bottom-color:#fff}
.mapboxgl-popup-anchor-top-right .mapboxgl-popup-tip, .maplibregl-popup-anchor-top-right .maplibregl-popup-tip{-webkit-align-self:flex-end;-ms-flex-item-align:end;align-self:flex-end;border-top:none;border-right:none;border-bottom-color:#fff}
.mapboxgl-popup-anchor-bottom .mapboxgl-popup-tip, .maplibregl-popup-anchor-bottom .maplibregl-popup-tip{-webkit-align-self:center;-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{-webkit-align-self:flex-start;-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{-webkit-align-self:flex-end;-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{-webkit-align-self:center;-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{-webkit-align-self:center;-ms-flex-item-align:center;align-self:center;border-right:none;border-left-color:#fff}
.mapboxgl-popup-close-button, .maplibregl-popup-close-button{position:absolute;right:0;top:0;border:0;border-radius:0 3px 0 0;cursor:pointer;background-color:transparent}
.mapboxgl-popup-close-button:hover, .maplibregl-popup-close-button:hover{background-color:rgba(0,0,0,.05)}
.mapboxgl-popup-content, .maplibregl-popup-content{position:relative;background:#fff;border-radius:3px;-webkit-box-shadow:0 1px 2px rgba(0,0,0,.1);box-shadow:0 1px 2px rgba(0,0,0,.1);padding:10px 10px 15px;pointer-events:auto}
.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{position:absolute;top:0;left:0;will-change:transform}
.mapboxgl-user-location-dot, .maplibregl-user-location-dot{background-color:#1da1f2;width:15px;height:15px;border-radius:50%}
.mapboxgl-user-location-dot:before, .maplibregl-user-location-dot:before{background-color:#1da1f2;content:"";width:15px;height:15px;border-radius:50%;position:absolute;-webkit-animation:maplibregl-user-location-dot-pulse 2s infinite;animation:maplibregl-user-location-dot-pulse 2s infinite}
.mapboxgl-user-location-dot:after, .maplibregl-user-location-dot:after{border-radius:50%;border:2px solid #fff;content:"";height:19px;left:-2px;position:absolute;top:-2px;width:19px;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-shadow:0 0 3px rgba(0,0,0,.35);box-shadow:0 0 3px rgba(0,0,0,.35)}
@-webkit-keyframes maplibregl-user-location-dot-pulse{0%{-webkit-transform:scale(1);opacity:1}70%{-webkit-transform:scale(3);opacity:0}to{-webkit-transform:scale(1);opacity:0}}
@keyframes maplibregl-user-location-dot-pulse{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}70%{-webkit-transform:scale(3);transform:scale(3);opacity:0}to{-webkit-transform:scale(1);transform:scale(1);opacity:0}}
.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:rgba(29,161,242,.2);width:1px;height:1px;border-radius:100%}
.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{position:absolute;top:0;left:0;width:0;height:0;background:#fff;border:2px dotted #202020;opacity:.5}
@media print{.mapbox-improve-map{display:none}}
/* 8 + 30 (avatar) + 8 */
:root {
    font-size: 10px;

    --transition-short: .1s;
    --transition-standard: .3s;
}
@media (prefers-reduced-motion) {
    :root {
        --transition-short: 0;
        --transition-standard: 0;
    }
}
html {
    /* hack to stop overscroll bounce on OSX and iOS.
       N.B. Breaks things when we have legitimate horizontal overscroll */
    height: 100%;
    overflow: hidden;
    -ms-scroll-chaining: none;
        overscroll-behavior: none;
}
ul {
    list-style-type: disc;
}
body {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Apple Color Emoji", "Twemoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif, "Noto Color Emoji", "Inter";
    background-color: hsl(260deg 11% 16% / 35%);
    font-size: 1.5rem;
    font-style: normal;
    color: rgb(255 255 255);
    border: 0px;
    margin: 0px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;

    -webkit-app-region: no-drag;
}
body.transparency {
        background-color: #25262d25;
    }
.noselect {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.select {
  -webkit-touch-callout: unset;
  -webkit-user-select: unset;
  -moz-user-select: unset;
  -ms-user-select: text;
  user-select: all;
}
.nocursor {
  cursor: none;
}
pre, code {
    font-family: monospace;
    font-size: 100% !important;
}
.error, .warning, .text-error, .text-warning {
    color: #FF5B55;
}
.text-success {
    color: #4958F5;
}
.text-muted {
    color: #b9bec6;
}
b {
    font-weight: bold;
}
h2 {
    color: #f0f0f1;
    font-weight: 400;
    font-size: 1.8rem;
    margin-top: 16px;
    margin-bottom: 16px;
}
div[class^="commandbar"] h2 {
        color: inherit;
    }
a:hover, a:link, a:visited {
    color: #238CF5;
}
input[type=text], input[type=datetime-local], input[type=search], input[type=password] {
    font-family: inherit;
    padding: 9px;
    font-size: 1.4rem;
    font-weight: 600;
    min-width: 0;
}
input[type='text'].mx_textinput_icon, input[type='search'].mx_textinput_icon {
    padding-left: 36px;
    background-repeat: no-repeat;
    background-position: 10px center;
}
input[type='text'].mx_textinput_icon.mx_textinput_search, input[type='search'].mx_textinput_icon.mx_textinput_search {
    background-image: url(../../img/feather-customised/search-input.044bfa7.svg);
}
input[type='search']::-webkit-search-decoration, input[type='search']::-webkit-search-cancel-button, 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;
    opacity: initial;
}
input::-moz-placeholder, textarea::-moz-placeholder {
    opacity: 1;
    opacity: initial;
}
input:-ms-input-placeholder, textarea:-ms-input-placeholder {
    opacity: 1;
    opacity: initial;
}
input::-ms-input-placeholder, textarea::-ms-input-placeholder {
    opacity: 1;
    opacity: initial;
}
input::placeholder, textarea::placeholder {
    opacity: 1;
    opacity: initial;
}
input[type='text'], input[type='datetime-local'], input[type='password'], select, textarea {
    background-color: transparent;
    color: #f0f0f1;
    border: none;
}
select {
    background-color: #25262d;
}
input::-webkit-calendar-picker-indicator {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="15" viewBox="0 0 24 24"><path fill="%23bbbbbb" d="M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 18H4V8h16v13z"/></svg>');
}
/* Required by Firefox */
textarea {
    color: #f0f0f1;
}
input[type='text']:focus, input[type='password']:focus, textarea:focus {
    outline: none;
    -webkit-box-shadow: none;
            box-shadow: none;
}
*:focus {
    outline: none;
}
fieldset {
    display: inline-block;
    margin-inline: unset;
    padding-block: unset;
    padding-inline: unset;
    min-inline-size: unset;
    border: none;
}
legend {
    padding-inline: unset;
    border: none;
}
.mx_Dialog .mx_textinput > input[type=text], .mx_Dialog .mx_textinput > input[type=search], .mx_MatrixChat_wrapper .mx_textinput > input[type=text], .mx_MatrixChat_wrapper .mx_textinput > input[type=search] {
        border: none;
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        color: #f0f0f1;
    }
.mx_Dialog :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput):not(.bp_TextInput2) > input[type='text'], .mx_Dialog :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput):not(.bp_TextInput2) > input[type='search'], .mx_Dialog .mx_textinput, .mx_MatrixChat_wrapper :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput):not(.bp_TextInput2) > input[type='text'], .mx_MatrixChat_wrapper :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput):not(.bp_TextInput2) > input[type='search'], .mx_MatrixChat_wrapper .mx_textinput {
        display: block;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        background-color: transparent;
        color: rgba(208, 209, 216, 0.6);
        border-radius: 4px;
        border: 1px solid rgba(240,240,241, .1);
        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 :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='text']::-webkit-input-placeholder, .mx_Dialog :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='search']::-webkit-input-placeholder, .mx_Dialog .mx_textinput input::-webkit-input-placeholder, .mx_MatrixChat_wrapper :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='text']::-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 .mx_textinput input::-webkit-input-placeholder {
        color: rgba(rgba(208, 209, 216, 0.6), 0.75);
    }
.mx_Dialog :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='text']::-moz-placeholder, .mx_Dialog :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='search']::-moz-placeholder, .mx_Dialog .mx_textinput input::-moz-placeholder, .mx_MatrixChat_wrapper :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='text']::-moz-placeholder, .mx_MatrixChat_wrapper :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='search']::-moz-placeholder, .mx_MatrixChat_wrapper .mx_textinput input::-moz-placeholder {
        color: rgba(rgba(208, 209, 216, 0.6), 0.75);
    }
.mx_Dialog :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='text']:-ms-input-placeholder, .mx_Dialog :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='search']:-ms-input-placeholder, .mx_Dialog .mx_textinput input:-ms-input-placeholder, .mx_MatrixChat_wrapper :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='text']:-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 .mx_textinput input:-ms-input-placeholder {
        color: rgba(rgba(208, 209, 216, 0.6), 0.75);
    }
.mx_Dialog :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='text']::-ms-input-placeholder, .mx_Dialog :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='search']::-ms-input-placeholder, .mx_Dialog .mx_textinput input::-ms-input-placeholder, .mx_MatrixChat_wrapper :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='text']::-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 .mx_textinput input::-ms-input-placeholder {
        color: rgba(rgba(208, 209, 216, 0.6), 0.75);
    }
.mx_Dialog :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='text']::placeholder, .mx_Dialog :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='search']::placeholder, .mx_Dialog .mx_textinput input::placeholder, .mx_MatrixChat_wrapper :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='text']::placeholder, .mx_MatrixChat_wrapper :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='search']::placeholder, .mx_MatrixChat_wrapper .mx_textinput input::placeholder {
        color: rgba(rgba(208, 209, 216, 0.6), 0.75);
    }
/*** panels ***/
.dark-panel {
    background-color: #25262d;
}
.dark-panel :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='text'], .dark-panel :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='search'], .dark-panel .mx_textinput {
        color: rgba(208, 209, 216, 0.6);
        background-color: hsla(216, 21%, 14%, 1);
        border: none;
    }
.light-panel :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='text'], .light-panel :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type='search'], .light-panel .mx_textinput {
        color: rgba(208, 209, 216, 0.6);
        background-color: #f2f5f8;
        border: none;
    }
/* Prevent ugly dotted highlight around selected elements in Firefox */
::-moz-focus-inner {
    border: 0;
}
#mx_theme_accentColor {
    color: #4958F5;
}
#mx_theme_secondaryAccentColor {
    color: #25262d;
}
/* Expected z-indexes for dialogs:
    4000 - Default wrapper index
    4009 - Static dialog background
    4010 - Static dialog itself
    4011 - Standard dialog background
    4012 - Standard dialog itself

   These are set up such that the static dialog always appears
   underneath the standard dialogs.
 */
.mx_Dialog_wrapper {
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    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_Dialog {
    -webkit-app-region: no-drag;
    background-color: hsla(216, 21%, 14%, 1);
    color: #c8c8cd;
    z-index: 4012;
    font-size: 1.5rem;
    position: relative;
    max-height: 80%;
    -webkit-box-shadow: 2px 15px 30px 0 rgba(0, 0, 0, 0.48);
            box-shadow: 2px 15px 30px 0 rgba(0, 0, 0, 0.48);
    border-radius: 20px;
    overflow-y: auto;
    padding: 20px;
}
.mx_Dialog_fixedWidth {
    width: 60vw;
    max-width: 704px;
}
.mx_Dialog_staticWrapper .mx_Dialog {
    z-index: 4010;
    contain: content;
}
.mx_Dialog_background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: 0.8;
    z-index: 4011;
}
.mx_Dialog_background.mx_Dialog_staticBackground {
    z-index: 4009;
}
.mx_Dialog_wrapperWithStaticUnder .mx_Dialog_background {
    opacity: 0.4;
}
.mx_Dialog_lightbox .mx_Dialog_background {
    opacity: 0.95;
    background-color: #000;
    -webkit-animation-name: mx_Dialog_lightbox_background_keyframes;
            animation-name: mx_Dialog_lightbox_background_keyframes;
    -webkit-animation-duration: 300ms;
            animation-duration: 300ms;
}
.mx_Dialog_lightbox .mx_Dialog {
    border-radius: 0px;
    background-color: transparent;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    pointer-events: none;
    padding: 0;
}
.mx_Dialog_header {
    position: relative;
}
.mx_Dialog_titleImage {
    vertical-align: sub;
    width: 25px;
    height: 25px;
    margin-left: -2px;
    margin-right: 4px;
    margin-bottom: 2px;
}
.mx_Dialog_title {
    color: #f0f0f1;
    display: inline-block;
    width: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}
.mx_Dialog_header.mx_Dialog_headerWithButton > .mx_Dialog_title {
    text-align: center;
}
.mx_Dialog_header.mx_Dialog_headerWithCancel {
    padding-right: 20px;
}
.mx_Dialog_title.danger {
    color: #FF5B55;
}
.mx_Dialog_cancelButton {
    -webkit-mask: url(../../img/feather-customised/cancel.23c2689.svg);
            mask: url(../../img/feather-customised/cancel.23c2689.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-size: cover;
            mask-size: cover;
    width: 18px;
    height: 18px;
    background-color: #9fa9ba;
    cursor: default;
    position: absolute;
    top: 10px;
    right: 0;
}
.mx_Dialog_content {
    margin: 24px 0 68px;
    font-size: 1.4rem;
    color: #f0f0f1;
    word-wrap: break-word;
}
.mx_Dialog_buttons {
    margin-top: 20px;
    text-align: right;
}
.mx_Dialog_buttons .mx_Dialog_buttons_additive {
        float: left;
    }
/* XXX: Our button style are a mess: buttons that happen to appear in dialogs get special styles applied
 * to them that no button anywhere else in the app gets by default. In practice, buttons in other places
 * in the app look the same by being AccessibleButtons, or possibly by having explict button classes.
 * We should go through and have one consistent set of styles for buttons throughout the app.
 * For now, I am duplicating the selectors here for mx_Dialog and mx_DialogButtons.
 *
 * Elements that should not be styled like a dialog button are mentioned in a :not() pseudo-class.
 * For the widest browser support, we use multiple :not pseudo-classes instead of :not(.a, .b).
 */
.mx_Dialog button:where(:not(.mx_Dialog_nonDialogButton):not(.maplibregl-ctrl-attrib-button):not(.mx_AccessibleButton)), .mx_Dialog input[type="submit"], .mx_Dialog_buttons button:where(:not(.mx_Dialog_nonDialogButton):not(.mx_AccessibleButton)), .mx_Dialog_buttons input[type="submit"] {
    /* align images in buttons (eg spinners) */
    vertical-align: middle;
    border: 0px;
    border-radius: 8px;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Apple Color Emoji", "Twemoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif, "Noto Color Emoji", "Inter";
    font-size: 1.4rem;
    color: white;
    background-color: rgba(169, 63, 233, 1);
    width: auto;
    padding: 7px;
    padding-left: 1.5em;
    padding-right: 1.5em;
    cursor: default;
    display: inline-block;
    outline: none;
    margin-left: 0px;
    margin-right: 8px;
    margin-bottom: 5px;
    font-weight: 600;
    border: 1px solid #4958F5;
    color: #4958F5;
    background-color: transparent;
    font-family: inherit;
}
.mx_Dialog button:not(.mx_Dialog_nonDialogButton):not(.maplibregl-ctrl-attrib-button):not(.mx_AccessibleButton):last-child {
    margin-right: 0px;
}
.mx_Dialog button:not(.mx_Dialog_nonDialogButton):not(.maplibregl-ctrl-attrib-button):not(.mx_AccessibleButton):hover, .mx_Dialog input[type="submit"]:hover, .mx_Dialog_buttons button:not(.mx_Dialog_nonDialogButton):not(.mx_AccessibleButton):hover, .mx_Dialog_buttons input[type="submit"]:hover {
    cursor: default;
}
.mx_Dialog button:not(.mx_Dialog_nonDialogButton):not(.maplibregl-ctrl-attrib-button):not(.mx_AccessibleButton):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(.maplibregl-ctrl-attrib-button), .mx_Dialog input[type="submit"].mx_Dialog_primary, .mx_Dialog_buttons button.mx_Dialog_primary, .mx_Dialog_buttons input[type="submit"].mx_Dialog_primary {
    min-width: 156px;
}
.mx_Dialog button.danger:not(.mx_Dialog_nonDialogButton):not(.maplibregl-ctrl-attrib-button), .mx_Dialog input[type="submit"].danger, .mx_Dialog_buttons button.danger, .mx_Dialog_buttons input[type="submit"].danger {
}
.mx_Dialog button.warning:not(.mx_Dialog_nonDialogButton):not(.maplibregl-ctrl-attrib-button), .mx_Dialog input[type="submit"].warning {
    border: solid 1px #FF5B55;
    color: #FF5B55;
}
.mx_Dialog button:not(.mx_Dialog_nonDialogButton):not(.maplibregl-ctrl-attrib-button):not(.mx_AccessibleButton):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 {
    opacity: 0.7;
}
/* Spinner Dialog overide */
.mx_Dialog_wrapper.mx_Dialog_spinner .mx_Dialog {
    width: auto;
    border-radius: 8px;
    padding: 8px;
    -webkit-box-shadow: none;
            box-shadow: none;

    /* Don't show scroll-bars on spinner dialogs */
    overflow-x: hidden;
    overflow-y: hidden;
}
.mx_DialogDesignChanges_wrapper .mx_Dialog_fixedWidth {
    max-width: 636px;
}
.mx_DialogDesignChanges_wrapper .mx_Dialog_fixedWidth .mx_AccessibleButton_kind_link {
        font-size: inherit;
        padding: 0;
    }
.mx_GeneralButton {
    /* align images in buttons (eg spinners) */
    vertical-align: middle;
    border: 0px;
    border-radius: 8px;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Apple Color Emoji", "Twemoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif, "Noto Color Emoji", "Inter";
    font-size: 1.4rem;
    color: white;
    background-color: rgba(169, 63, 233, 1);
    width: auto;
    padding: 7px;
    padding-left: 1.5em;
    padding-right: 1.5em;
    cursor: default;
    display: inline-block;
    outline: none;
    display: inline;
    margin: auto;
}
.mx_GeneralButton:hover {
    cursor: default;
}
.mx_SecondaryButton {
  /* align images in buttons (eg spinners) */
  vertical-align: middle;
  border: 0px;
  border-radius: 8px;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Apple Color Emoji", "Twemoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif, "Noto Color Emoji", "Inter";
  font-size: 1.4rem;
  color: white;
  background-color: rgba(169, 63, 233, 1);
  width: auto;
  padding: 7px;
  padding-left: 1.5em;
  padding-right: 1.5em;
  cursor: default;
  display: inline-block;
  outline: none;
  background: none;
  border: 2px solid #585E74;
}
.mx_SecondaryButton:hover {
  cursor: default;
  background: none;
  border: 2px solid #424961;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.mx_linkButton {
    cursor: default;
    color: #4958F5;
}
.mx_TextInputDialog_label {
    text-align: left;
    padding-bottom: 12px;
}
.mx_TextInputDialog_input {
    font-size: 1.5rem;
    border-radius: 3px;
    border: 1px solid rgba(231, 231, 231, 0.2);
    padding: 9px;
    color: #f0f0f1;
    background-color: hsla(216, 21%, 14%, 1);
}
.mx_textButton {
    background-color: transparent;
    border: 0px solid transparent;
    color: rgba(113, 118, 137, 1);
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Apple Color Emoji", "Twemoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif, "Noto Color Emoji", "Inter";
    font-weight: 700;
    line-height: 16.8px;
}
.mx_textButton:hover {
    -webkit-text-decoration-line: underline;
            text-decoration-line: underline;
    -webkit-text-decoration-style: solid;
            text-decoration-style: solid;
    cursor: default;
}
.mx_button_row {
    margin-top: 69px;
}
.mx_Username_color1 {
    color: #c03d33;
}
.mx_Username_color2 {
    color: #4fad2d;
}
.mx_Username_color3 {
    color: #d09306;
}
.mx_Username_color4 {
    color: #168acd;
}
.mx_Username_color5 {
    color: #8544d6;
}
.mx_Username_color6 {
    color: #cd4073;
}
.mx_Username_color7 {
    color: #2996ad;
}
.mx_Username_color8 {
    color: #ce671b;
}
.mx_Tooltip_dark .mx_Tooltip_chevron::after {
        border-right-color: rgba(38, 39, 43, 0.82);
    }
/*
Copyright 2022 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
/*
Copyright 2018 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
html {
    scrollbar-color: rgba(255, 255, 255, 0.2) transparent;
}
* {
    scrollbar-width: thin;
}
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background-color: rgba(255, 255, 255, 0.2);
}
.mx_AutoHideScrollbar:hover {
    scrollbar-color: rgba(255, 255, 255, 0.2) transparent;
}
.mx_AutoHideScrollbar:hover::-webkit-scrollbar-thumb {
        background-color: rgba(255, 255, 255, 0.2);
    }
.mx_AutoHideScrollbar {
    overflow-x: hidden;
    overflow-y: auto;
    overflow-y: overlay;
    -ms-overflow-style: -ms-autohiding-scrollbar;
}
.mx_AutoHideScrollbar::-webkit-scrollbar {
        background-color: transparent;
    }
.mx_AutoHideScrollbar::-webkit-scrollbar-thumb {
        background-color: transparent;
    }
.mx_AutoHideScrollbar {

    scrollbar-color: transparent transparent;
}
.mx_CompatibilityPage {
    width: 100%;
    height: 100%;
    background-color: #e55;
}
.mx_CompatibilityPage_box {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 500px;
    height: 300px;
    border: 1px solid;
    padding: 10px;
    background-color: #fcc;
}
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ContextualMenu_wrapper {
    position: fixed;
    z-index: 10000;
}
.mx_ContextualMenu_wrapper_drilled .mx_ContextualMenu  {
        background-color: hsla(216, 21%, 14%, 1);
    }
.mx_ContextualMenu_background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 1.0;
}
.mx_ContextualMenu_background_clickthrough {
        pointer-events: none;
    }
@-webkit-keyframes zoomIn {
  0% {
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}
@keyframes zoomIn {
  0% {
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}
.mx_ContextualMenu {
    overflow: hidden;
    border-radius: 12px;
    -webkit-box-shadow: 0px 4px 24px rgba(10, 38, 46, 0.08);
            box-shadow: 0px 4px 24px rgba(10, 38, 46, 0.08);
    background-color: #25262d;
    color: #f0f0f1;
    position: absolute;
    font-size: 1.4rem;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    z-index: 10001;

    -webkit-animation: 0.1s ease 0s 1 zoomIn forwards;

            animation: 0.1s ease 0s 1 zoomIn forwards;
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
    opacity: 0;
}
.mx_ContextualMenu_right {
    right: 0;
}
.mx_ContextualMenu.mx_ContextualMenu_withChevron_right {
    right: 8px;
}
.mx_ContextualMenu_chevron_right {
    position: absolute;
    right: -8px;
    top: 0px;
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-left: 8px solid #25262d;
    border-bottom: 8px solid transparent;
}
.mx_ContextualMenu_left {
    left: 0;
}
.mx_ContextualMenu.mx_ContextualMenu_withChevron_left {
    left: 8px;
}
.mx_ContextualMenu_chevron_left {
    position: absolute;
    left: -8px;
    top: 0px;
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-right: 8px solid #25262d;
    border-bottom: 8px solid transparent;
}
.mx_ContextualMenu_top {
    top: 0;
}
.mx_ContextualMenu.mx_ContextualMenu_withChevron_top {
    top: 8px;
}
.mx_ContextualMenu_chevron_top {
    position: absolute;
    left: 0px;
    top: -8px;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-bottom: 8px solid #25262d;
    border-right: 8px solid transparent;
}
.mx_ContextualMenu_bottom {
    bottom: 0;
}
.mx_ContextualMenu.mx_ContextualMenu_withChevron_bottom {
    bottom: 8px;
}
.mx_ContextualMenu_chevron_bottom {
    position: absolute;
    left: 0px;
    bottom: -8px;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-top: 8px solid #25262d;
    border-right: 8px solid transparent;
}
.mx_ContextualMenu_rightAligned {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
}
.mx_ContextualMenu_bottomAligned {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CreateRoom {
    width: 960px;
    margin-left: auto;
    margin-right: auto;
    color: #f0f0f1;
}
.mx_CreateRoom input, .mx_CreateRoom textarea {
    border-radius: 3px;
    border: 1px solid rgba(249, 248, 248, 0.2);
    font-weight: 300;
    font-size: 1.3rem;
    padding: 9px;
    margin-top: 6px;
}
.mx_CreateRoom_description {
    width: 330px;
}
/*
Copyright 2019 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CustomRoomTagPanel {
    background-color: rgba(38, 39, 43, 0.82);
    max-height: 40vh;
}
.mx_CustomRoomTagPanel_scroller {
    max-height: inherit;
    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_CustomRoomTagPanel .mx_AccessibleButton {
    margin: 0 auto;
    width: 40px;
    padding: 10px 0 9px 0;
    position: relative;
}
.mx_CustomRoomTagPanel .mx_BaseAvatar_image {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    width: 40px;
    height: 40px;
}
.mx_CustomRoomTagPanel .mx_AccessibleButton.CustomRoomTagPanel_tileSelected::before {
    content: '';
    height: 56px;
    background-color: #238CF5;
    width: 5px;
    position: absolute;
    left: -9px;
    border-radius: 0 3px 3px 0;
    top: 5px;
}
/*
Copyright 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_FilePanel {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    -webkit-box-flex: 1;
        -ms-flex: 1 1 0px;
            flex: 1 1 0;
    overflow-y: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.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_RoomView_MessageList h2 {
    display: none;
}
/* FIXME: rather than having EventTile's default CSS be for MessagePanel,
   we should make EventTile a base CSS class and customise it specifically
   for usage in {Message,File,Notification}Panel. */
.mx_FilePanel .mx_EventTile_avatar {
    display: none;
}
/* Overrides for the attachment body tiles */
.mx_FilePanel .mx_EventTile:not([data-layout=bubble]) {
    word-break: break-word;
    margin-top: 10px;
    padding-top: 0;
}
.mx_FilePanel .mx_EventTile:not([data-layout=bubble]) .mx_EventTile_line {
        padding-left: 0;
    }
.mx_FilePanel .mx_EventTile .mx_MImageBody {
    margin-right: 0px;
}
.mx_FilePanel .mx_EventTile .mx_MFileBody {
    line-height: 2.4rem;
}
.mx_FilePanel .mx_EventTile .mx_MFileBody_download {
    padding-top: 8px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 1.4rem;
    color: #d0d1d8;
}
.mx_FilePanel .mx_EventTile .mx_MFileBody_downloadLink {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    color: #c8c8cd;
}
.mx_FilePanel .mx_EventTile .mx_MImageBody_size {
    -webkit-box-flex: 1;
        -ms-flex: 1 0 0px;
            flex: 1 0 0;
    font-size: 1.4rem;
    text-align: right;
    white-space: nowrap;
}
/* Overides for the sender details line */
.mx_FilePanel .mx_EventTile_senderDetails {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: -2px;
}
.mx_FilePanel .mx_EventTile_senderDetailsLink {
    text-decoration: none;
}
.mx_FilePanel .mx_EventTile .mx_SenderProfile {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    line-height: normal;
    line-height: initial;
    padding: 0px;
    font-size: 1.4rem;
    opacity: 1.0;
    color: #d0d1d8;
}
.mx_FilePanel .mx_EventTile .mx_MessageTimestamp {
    -webkit-box-flex: 1;
        -ms-flex: 1 0 0px;
            flex: 1 0 0;
    text-align: right;
    visibility: visible;
    position: static;
    position: initial;
    font-size: 1.4rem;
    opacity: 1.0;
    color: #d0d1d8;
}
/* Overrides for the wrappers around the body tile */
.mx_FilePanel .mx_EventTile_line {
    margin-right: 0px;
    padding-left: 0px;
}
.mx_FilePanel .mx_EventTile_selected .mx_EventTile_line {
    padding-left: 0px;
}
.mx_FilePanel_empty::before {
    -webkit-mask-image: url(../../img/element-icons/room/files.5709c0c.svg);
            mask-image: url(../../img/element-icons/room/files.5709c0c.svg);
}
.mx_GenericErrorPage {
    width: 100%;
    height: 100%;
    background-color: #fff;
    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_GenericErrorPage_box {
    display: inline;
    width: 500px;
    min-height: 125px;
    border: 1px solid #f22;
    padding: 10px 10px 20px;
    background-color: #fcc;
}
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_HeaderButtons {
    -webkit-app-region: no-drag;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.mx_RoomHeader_buttons + .mx_HeaderButtons {
}
.mx_RoomHeader_buttons + .mx_HeaderButtons::before {
        content: unset;
    }
/*
Copyright 2016 OpenMarket Ltd
Copyright 2017 Vector Creations Ltd
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_HomePage {
    width: 100%;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
}
.mx_HomePage_default {
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.mx_HomePage_default .mx_HomePage_default_wrapper {
        margin: auto;
    }
.mx_HomePage_default img {
        height: 48px;
    }
.mx_HomePage_default h1 {
        font-weight: 600;
        font-size: 3.2rem;
        line-height: 4.4rem;
        margin-bottom: 4px;
    }
.mx_HomePage_default h4 {
        margin-top: 4px;
        font-weight: 600;
        font-size: 1.8rem;
        line-height: 2.5rem;
        color: #b9bec6;
    }
.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 {
            padding: 73px 8px 15px;

            width: 160px;
            margin: 20px;
            position: relative;
            display: inline-block;
            border-radius: 8px;
            vertical-align: top;
            word-break: break-word;
            -webkit-box-sizing: border-box;
                    box-sizing: border-box;

            font-weight: 600;
            font-size: 1.5rem;
            line-height: 2.0rem;
            color: #fff;
            background-color: #4958F5;
        }
.mx_HomePage_default .mx_HomePage_default_buttons .mx_AccessibleButton::before {
                top: 20px;
                left: 60px;
                width: 40px;
                height: 40px;

                content: '';
                position: absolute;
                background-color: #fff;
                -webkit-mask-repeat: no-repeat;
                        mask-repeat: no-repeat;
                -webkit-mask-size: contain;
                        mask-size: contain;
            }
.mx_HomePage_default .mx_HomePage_default_buttons .mx_AccessibleButton.mx_HomePage_button_sendDm::before {
                -webkit-mask-image: url(../../img/element-icons/feedback.a91241e.svg);
                        mask-image: url(../../img/element-icons/feedback.a91241e.svg);
            }
.mx_HomePage_default .mx_HomePage_default_buttons .mx_AccessibleButton.mx_HomePage_button_explore::before {
                -webkit-mask-image: url(../../img/element-icons/roomlist/explore.1523e65.svg);
                        mask-image: url(../../img/element-icons/roomlist/explore.1523e65.svg);
            }
.mx_HomePage_default .mx_HomePage_default_buttons .mx_AccessibleButton.mx_HomePage_button_createGroup::before {
                -webkit-mask-image: url(../../img/element-icons/community-members.cbb31c1.svg);
                        mask-image: url(../../img/element-icons/community-members.cbb31c1.svg);
            }
/* @import "../../../css/structures/_LeftPanel.scss"; */
/* @import "../../../css/structures/_LeftPanel2.scss"; */
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.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;
    min-width: 0;
    min-height: 0;
    height: 100%;
    background: #1e1e1e;
}
.mx_MainSplit > .mx_RightPanel_ResizeWrapper {
    z-index: 2;
    padding: 8px;
    padding-left: calc(8px / 2);
    height: calc(100vh - 51px);
}
.mx_MainSplit > .mx_RightPanel_ResizeWrapper:hover .mx_ResizeHandle_horizontal::before {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);

        height: 64px;
        width: 4px;
        border-radius: 4px;

        content: '';

        background-color: #f0f0f1;
        opacity: 0.8;
    }
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MatrixChat_splash {
    position: relative;
    height: 100%;
}
.mx_MatrixChat_splashButtons {
    text-align: center;
    width: 100%;
    position: absolute;
    bottom: 30px;
}
.mx_MatrixChat_wrapper--transparent-main-panel .bp_MainPanel {
        background-color: #1e1e1e00 !important;
        background-color: var(--main-panel-transparent-bg) !important;
    }
.mx_MatrixChat_wrapper--transparent-main-panel .mx_MainSplit {
        background: #00000000  !important;
    }
.mx_MatrixChat_wrapper--transparent-main-panel .mx_RoomHeader {
        background: #37353a00  !important;
    }
.mx_MatrixChat_wrapper--transparent-main-panel .mx_MessageComposer_wrapper {
        background: rgba(255, 255, 255, 0.07)  !important;
    }
.mx_MatrixChat_wrapper--transparent-main-panel .mx_MatrixChat > .mx_ResizeHandle, .mx_MatrixChat_wrapper--transparent-main-panel .mx_MatrixChat_wrapper .mx_RightPanel_ResizeWrapper .mx_ResizeHandle {
        -webkit-box-shadow: hsl(0deg 0% 100% / 10%) 1px 0px 0px 0px inset;
                box-shadow: hsl(0deg 0% 100% / 10%) 1px 0px 0px 0px inset;
    }
.mx_MatrixChat_wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;

    width: 100%;
    height: 100%;
}
.mx_MatrixToolbar {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;

    height: 40px;
}
.mx_MatrixChat {
    position: relative;
    width: 100%;
    height: 100%;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-flex: 1;

        -ms-flex: 1;

            flex: 1;
    min-height: 0;
}
.mx_MatrixChat_syncError {
    color: #202127;
    background-color: #DF2A8B;
    border-radius: 5px;
    display: table;
    padding: 30px;
    position: absolute;
    top: 100px;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
}
/* not the left panel, and not the resize handle, so the roomview/groupview/... */
.mx_MatrixChat > :not(.mx_SpacePanel):not(.mx_ResizeHandle):not(.mx_LeftPanel_wrapper):not(.bp_LeftPanel) {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 0px;
            flex: 1 1 0;
    min-width: 0;

    /* To fix https://github.com/vector-im/element-web/issues/3298 where Safari
       needed height 100% all the way down to the HomePage. Height does not
       have to be auto, empirically.
    */
    height: 100%;
}
.mx_MatrixChat > .mx_ResizeHandle.mx_ResizeHandle_horizontal {
    margin: 0 calc(-5.5px - 8px / 2) 0 calc(-6.5px + 8px / 2);
}
.mx_MatrixChat > .mx_ResizeHandle_horizontal:hover {
    position: relative;
}
.mx_MatrixChat > .mx_ResizeHandle_horizontal:hover::before {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);

        height: 64px;
        width: 4px;
        border-radius: 4px;

        content: ' ';

        background-color: #f0f0f1;
        opacity: 0.8;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_NonUrgentToastContainer {
    position: absolute;
    bottom: 30px;
    left: 28px;
    z-index: 101;
}
.mx_NonUrgentToastContainer .mx_NonUrgentToastContainer_toast {
        padding: 10px 12px;
        border-radius: 8px;
        width: 320px;
        font-size: 1.3rem;
        margin-top: 8px;
        background-color: #17191c;
        color: #fff;
    }
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RightPanel {
    overflow-x: hidden;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    border-radius: 8px;
    padding: 8px 0;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    height: 100%;
    contain: strict;
}
.mx_RightPanel .mx_RoomView_MessageList {
        padding: 14px 18px;
    }
.mx_RightPanel_header {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    border-bottom: 1px solid #404040;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 52px;
            flex: 0 0 52px;
}
/** Fixme - factor this out with the main header **/
.mx_RightPanel_headerButtonGroup {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background-color: hsla(216, 21%, 14%, 1);
    padding: 0 9px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.mx_RightPanel_headerButton {
    cursor: default;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    margin-left: 1px;
    margin-right: 1px;
    height: 32px;
    width: 32px;
    position: relative;
    border-radius: 100%;
}
.mx_RightPanel_headerButton::before {
        content: '';
        position: absolute;
        top: 4px;
        left: 4px;
        height: 24px;
        width: 24px;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-size: contain;
                mask-size: contain;
    }
.mx_RightPanel_headerButton::before {
    background-color: rgb(255 255 255 / 50%)
}
.mx_RightPanel_threadsButton::before {
    -webkit-mask-image: url(../../img/element-icons/room/thread.bf9dfb2.svg);
            mask-image: url(../../img/element-icons/room/thread.bf9dfb2.svg);
}
.mx_RightPanel_notifsButton::before {
    -webkit-mask-image: url(../../img/element-icons/notifications.d298b39.svg);
            mask-image: url(../../img/element-icons/notifications.d298b39.svg);
    -webkit-mask-position: center;
            mask-position: center;
}
.mx_RightPanel_roomSummaryButton::before {
    -webkit-mask-image: url(../../img/element-icons/room/room-summary.dd857b6.svg);
            mask-image: url(../../img/element-icons/room/room-summary.dd857b6.svg);
    -webkit-mask-position: center;
            mask-position: center;
}
.mx_RightPanel_groupMembersButton::before {
    -webkit-mask-image: url(../../img/element-icons/community-members.cbb31c1.svg);
            mask-image: url(../../img/element-icons/community-members.cbb31c1.svg);
    -webkit-mask-position: center;
            mask-position: center;
}
.mx_RightPanel_roomsButton::before {
    -webkit-mask-image: url(../../img/element-icons/community-rooms.8f0b6c9.svg);
            mask-image: url(../../img/element-icons/community-rooms.8f0b6c9.svg);
    -webkit-mask-position: center;
            mask-position: center;
}
.mx_RightPanel_pinnedMessagesButton::before {
        -webkit-mask-image: url(../../img/element-icons/room/pin.5d99673.svg);
                mask-image: url(../../img/element-icons/room/pin.5d99673.svg);
        -webkit-mask-position: center;
                mask-position: center;
    }
.mx_RightPanel_headerButton_unreadIndicator_bg {
    position: absolute;
    right: 0;
    top: 0;
    margin: 4px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    -webkit-transform: scale(1.6);
            transform: scale(1.6);
    -webkit-transform-origin: center center;
            transform-origin: center center;
    background: rgba(hsla(216, 21%, 14%, 1), 1);
}
.mx_RightPanel_headerButton_unreadIndicator {
    position: absolute;
    right: 0;
    top: 0;
    margin: 4px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    -webkit-transform: scale(1);
            transform: scale(1);
    background: rgba(255,91,85, 1);
    -webkit-box-shadow: 0 0 0 0 rgba(255,91,85, 1);
            box-shadow: 0 0 0 0 rgba(255,91,85, 1);
    -webkit-animation: mx_RightPanel_indicator_pulse 2s infinite;
            animation: mx_RightPanel_indicator_pulse 2s infinite;
    -webkit-animation-iteration-count: 1;
            animation-iteration-count: 1;
}
.mx_RightPanel_headerButton_unreadIndicator.mx_Indicator_gray {
        background: rgba(rgba(208, 209, 216, 0.6), 1);
        -webkit-box-shadow: rgba(rgba(208, 209, 216, 0.6), 1);
                box-shadow: rgba(rgba(208, 209, 216, 0.6), 1);
    }
.mx_RightPanel_headerButton_unreadIndicator::after {
        content: "";
        position: absolute;
        width: inherit;
        height: inherit;
        top: 0;
        left: 0;
        -webkit-transform: scale(1);
                transform: scale(1);
        -webkit-transform-origin: center center;
                transform-origin: center center;
        -webkit-animation-name: mx_RightPanel_indicator_pulse_shadow;
                animation-name: mx_RightPanel_indicator_pulse_shadow;
        -webkit-animation-duration: inherit;
                animation-duration: inherit;
        -webkit-animation-iteration-count: inherit;
                animation-iteration-count: inherit;
        border-radius: 50%;
        background: inherit;
    }
.mx_RightPanel_timelineCardButton::before {
        -webkit-mask-image: url(../../img/element-icons/feedback.a91241e.svg);
                mask-image: url(../../img/element-icons/feedback.a91241e.svg);
        -webkit-mask-position: center;
                mask-position: center;
    }
@-webkit-keyframes mx_RightPanel_indicator_pulse {
    0% {
        -webkit-transform: scale(0.95);
                transform: scale(0.95);
    }

    70% {
        -webkit-transform: scale(1);
                transform: scale(1);
    }

    100% {
        -webkit-transform: scale(0.95);
                transform: scale(0.95);
    }
}
@keyframes mx_RightPanel_indicator_pulse {
    0% {
        -webkit-transform: scale(0.95);
                transform: scale(0.95);
    }

    70% {
        -webkit-transform: scale(1);
                transform: scale(1);
    }

    100% {
        -webkit-transform: scale(0.95);
                transform: scale(0.95);
    }
}
@-webkit-keyframes mx_RightPanel_indicator_pulse_shadow {
    0% {
        opacity: 0.7;
    }

    70% {
        -webkit-transform: scale(2.2);
                transform: scale(2.2);
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}
@keyframes mx_RightPanel_indicator_pulse_shadow {
    0% {
        opacity: 0.7;
    }

    70% {
        -webkit-transform: scale(2.2);
                transform: scale(2.2);
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}
.mx_RightPanel_headerButton_highlight::before {
        background-color: #4958F5 !important;
    }
.mx_RightPanel_headerButton_badge {
    font-size: 0.8rem;
    border-radius: 8px;
    color: #202127;
    background-color: #4958F5;
    font-weight: bold;
    position: absolute;
    top: -4px;
    left: 20px;
    padding: 2px 4px;
}
.mx_RightPanel_collapsebutton {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    text-align: right;
    height: 16px;
    border: none;
}
.mx_RightPanel .mx_MemberList, .mx_RightPanel .mx_MemberInfo, .mx_RightPanel .mx_GroupRoomList, .mx_RightPanel_blank {
    -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;
            order: 2;
    margin: auto;
}
.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-size: 1.4rem;
    }
.mx_RightPanel_empty::before {
        content: '';
        display: block;
        margin: 11px auto 29px auto;
        height: 42px;
        width: 42px;
        background-color: #b9bec6;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-size: contain;
                mask-size: contain;
        -webkit-mask-position: center;
                mask-position: center;
    }
.mx_RightPanel_scopeHeader {
    margin: 24px;
    text-align: center;
    font-weight: 600;
    font-size: 1.8rem;
    line-height: 2.2rem;
}
.mx_RightPanel_scopeHeader .mx_BaseAvatar {
        margin-right: 8px;
        vertical-align: middle;
    }
.mx_RightPanel_scopeHeader .mx_BaseAvatar_image {
        border-radius: 8px;
    }
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RoomDirectory_dialogWrapper > .mx_Dialog {
    max-width: 960px;
    height: 100%;
}
.mx_RoomDirectory_dialog {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
.mx_RoomDirectory {
    margin-bottom: 12px;
    color: #f0f0f1;
    word-break: break-word;
    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;
}
.mx_RoomDirectory_list {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
.mx_RoomDirectory_list .mx_RoomView_messageListWrapper {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
}
.mx_RoomDirectory_listheader {
    display: block;
    margin-top: 13px;
}
.mx_RoomDirectory_searchbox {
    -webkit-box-flex: 1 !important;
        -ms-flex: 1 !important;
            flex: 1 !important;
}
.mx_RoomDirectory_listheader .mx_NetworkDropdown {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 200px;
            flex: 0 0 200px;
}
.mx_RoomDirectory_tableWrapper {
    overflow-y: auto;
    -webkit-box-flex: 1;
        -ms-flex: 1 1 0px;
            flex: 1 1 0;
}
.mx_RoomDirectory_tableWrapper .mx_RoomDirectory_footer {
        margin-top: 24px;
        text-align: center;
    }
.mx_RoomDirectory_tableWrapper .mx_RoomDirectory_footer > h5 {
            margin: 0;
            font-weight: 600;
            font-size: 1.5rem;
            line-height: 1.8rem;
            color: #f0f0f1;
        }
.mx_RoomDirectory_tableWrapper .mx_RoomDirectory_footer > p {
            margin: 40px auto 60px;
            font-size: 1.4rem;
            line-height: 2.0rem;
            color: #737D8C;
            max-width: 464px;
        }
.mx_RoomDirectory_tableWrapper .mx_RoomDirectory_footer > hr {
            margin: 0;
            border: none;
            height: 1px;
            background-color: #454854;
        }
.mx_RoomDirectory_tableWrapper .mx_RoomDirectory_footer .mx_RoomDirectory_newRoom {
            margin: 24px auto 0;
            width: -webkit-max-content;
            width: -moz-max-content;
            width: max-content;
        }
.mx_RoomDirectory_table {
    color: #f0f0f1;
    display: grid;
    font-size: 1.2rem;
    grid-template-columns: -webkit-max-content auto -webkit-max-content -webkit-max-content -webkit-max-content;
    grid-template-columns: max-content auto max-content max-content max-content;
    grid-row-gap: 24px;
    row-gap: 24px;
    text-align: left;
    width: 100%;
}
.mx_RoomDirectory_roomAvatar {
    padding: 2px 14px 0 0;
}
.mx_RoomDirectory_roomMemberCount {
    -ms-flex-item-align: center;
        align-self: center;
    color: #c8c8cd;
    padding: 3px 10px 0;
}
.mx_RoomDirectory_roomMemberCount::before {
        background-color: #c8c8cd;
        display: inline-block;
        vertical-align: text-top;
        margin-right: 2px;
        content: "";
        -webkit-mask: url(../../img/feather-customised/user.7a4d23d.svg);
                mask: url(../../img/feather-customised/user.7a4d23d.svg);
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: 80%;
                mask-size: 80%;
        width: 16px;
        height: 16px;
    }
.mx_RoomDirectory_join, .mx_RoomDirectory_preview {
    -ms-flex-item-align: center;
        align-self: center;
    white-space: nowrap;
}
.mx_RoomDirectory_name {
    display: inline-block;
    font-size: 1.8rem;
    font-weight: 600;
}
.mx_RoomDirectory_perms {
    display: inline-block;
}
.mx_RoomDirectory_perm {
    border-radius: 10px;
    display: inline-block;
    height: 20px;
    line-height: 2.0rem;
    padding: 0 5px;
    color: #202127;
    background-color: #25262d;
}
.mx_RoomDirectory_topic {
    cursor: auto;
    cursor: initial;
    color: #c8c8cd;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}
.mx_RoomDirectory_alias {
    font-size: 1.2rem;
    color: #a2a2a2;
}
.mx_RoomDirectory .mx_RoomView_MessageList {
    padding: 0;
}
.mx_RoomDirectory > span {
    font-size: 1.5rem;
    margin-top: 0;
}
.mx_RoomDirectory > span .mx_AccessibleButton {
        padding: 0;
    }
@media screen and (max-width: 700px) {
    .mx_RoomDirectory_roomMemberCount {
        padding: 0px;
    }

    .mx_AccessibleButton_kind_secondary {
        padding: 0px !important;
    }

    .mx_RoomDirectory_join {
        margin-left: 0px;
    }

    .mx_RoomDirectory_alias {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .mx_RoomDirectory_roomDescription {
        padding-bottom: 0px;
    }

    .mx_RoomDirectory_name {
        margin-bottom: 5px;
    }

    .mx_RoomDirectory_roomAvatar {
        margin-top: 10px;
    }

    .mx_RoomDirectory_table {
        grid-template-columns: auto;
        grid-row-gap: 14px;
        row-gap: 14px;
        margin-top: 5px;
    }
}
.mx_RoomDirectory_listItem {
    display: contents;
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RoomStatusBar:not(.mx_RoomStatusBar_unsentMessages) {
    margin-left: 65px;
    min-height: 50px;
}
.mx_RoomStatusBar_typingIndicatorAvatars {
    width: 52px;
    margin-top: -1px;
    text-align: left;
}
.mx_RoomStatusBar_typingIndicatorAvatars .mx_BaseAvatar_image {
    margin-right: -12px;
    border: 1px solid hsla(216, 21%, 14%, 1);
}
.mx_RoomStatusBar_typingIndicatorAvatars .mx_BaseAvatar_initial {
    padding-left: 1px;
    padding-top: 1px;
}
.mx_RoomStatusBar_typingIndicatorRemaining {
    display: inline-block;
    color: #acacac;
    background-color: #ddd;
    border: 1px solid hsla(216, 21%, 14%, 1);
    border-radius: 40px;
    width: 24px;
    height: 24px;
    line-height: 2.4rem;
    font-size: 0.8em;
    vertical-align: top;
    text-align: center;
    position: absolute;
}
.mx_RoomStatusBar_scrollDownIndicator {
    cursor: default;
    padding-left: 1px;
}
.mx_RoomStatusBar_unreadMessagesBar {
    padding-top: 10px;
    color: #FF5B55;
    cursor: default;
}
.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;
        min-height: 70px;
        margin: 12px;
        padding-left: 16px;
        background-color: #454854;
        border-radius: 4px;
    }
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentBadge {
        margin-right: 12px;
    }
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentBadge .mx_NotificationBadge {
            width: 24px !important;
            height: 24px !important;
            border-radius: 24px !important;
        }
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentBadge .mx_NotificationBadge .mx_NotificationBadge_count {
                font-size: 1.6rem !important;
            }
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentTitle {
        color: #FF5B55;
        font-size: 1.5rem;
    }
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentDescription {
        font-size: 1.2rem;
    }
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentButtonBar {
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
        text-align: right;
        margin-right: 22px;
        color: #b9bec6;
    }
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentButtonBar .mx_AccessibleButton {
            padding: 5px 10px;
            padding-left: 30px;
            display: inline-block;
            position: relative;
        }
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentButtonBar .mx_AccessibleButton:nth-child(2) {
                border-left: 1px solid #E3E8F0;
            }
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentButtonBar .mx_AccessibleButton::before {
                content: '';
                position: absolute;
                left: 10px;
                background-color: #b9bec6;
                -webkit-mask-repeat: no-repeat;
                        mask-repeat: no-repeat;
                -webkit-mask-position: center;
                        mask-position: center;
                -webkit-mask-size: contain;
                        mask-size: contain;
                width: 18px;
                height: 18px;
                top: 50%;
                -webkit-transform: translateY(-50%);
                        transform: translateY(-50%);
            }
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentButtonBar .mx_AccessibleButton.mx_RoomStatusBar_unsentCancelAllBtn::before {
                -webkit-mask-image: url(../../img/element-icons/trashcan.3b626db.svg);
                        mask-image: url(../../img/element-icons/trashcan.3b626db.svg);
            }
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentButtonBar .mx_AccessibleButton.mx_RoomStatusBar_unsentResendAllBtn {
                padding-left: 34px;
            }
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentButtonBar .mx_AccessibleButton.mx_RoomStatusBar_unsentResendAllBtn::before {
                    -webkit-mask-image: url(../../img/element-icons/retry.6cd23ad.svg);
                            mask-image: url(../../img/element-icons/retry.6cd23ad.svg);
                }
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentButtonBar .mx_InlineSpinner {
            vertical-align: middle;
            margin-right: 5px;
            top: 1px;
        }
.mx_RoomStatusBar_unsentMessages .mx_RoomStatusBar_unsentButtonBar .mx_InlineSpinner + span {
                margin-right: 10px;
            }
.mx_RoomStatusBar_connectionLostBar img {
    padding-left: 10px;
    padding-right: 10px;
    vertical-align: middle;
    float: left;
}
.mx_RoomStatusBar_connectionLostBar_title {
    color: #FF5B55;
}
.mx_RoomStatusBar_connectionLostBar_desc {
    color: #f0f0f1;
    font-size: 1.3rem;
    opacity: 0.5;
    padding-bottom: 20px;
}
.mx_RoomStatusBar_resend_link {
    color: #f0f0f1 !important;
    text-decoration: underline !important;
    cursor: default;
}
.mx_RoomStatusBar_typingBar {
    height: 50px;
    line-height: 5.0rem;

    color: #f0f0f1;
    opacity: 0.5;
    overflow-y: hidden;
    display: block;
}
.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: 4.0rem;
    }
/* @import "../../../css/structures/_RoomSubList.scss"; */
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.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;
        -ms-flex: 1;
            flex: 1;
    position: relative;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    contain: strict;
}
.mx_RoomView {
    word-wrap: break-word;
    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;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 9;
}
.mx_RoomView_hidden {
        z-index: 1;
        opacity: 0;
        pointer-events: none;
        -webkit-user-select: none;
           -moz-user-select: none;
            -ms-user-select: none;
                user-select: none;
        width: 1000px !important;
    }
@-webkit-keyframes mx_RoomView_fileDropTarget_animation {
    from {
        opacity: 0;
    }
    to {
        opacity: 0.95;
    }
}
@keyframes mx_RoomView_fileDropTarget_animation {
    from {
        opacity: 0;
    }
    to {
        opacity: 0.95;
    }
}
.mx_RoomView_fileDropTarget {
    min-width: 0px;
    width: 100%;
    height: 100%;

    font-size: 1.8rem;
    text-align: center;

    pointer-events: none;

    background-color: hsla(216, 21%, 14%, 1);
    opacity: 0.95;

    position: absolute;
    z-index: 3000;

    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;

    -webkit-animation: mx_RoomView_fileDropTarget_animation;

            animation: mx_RoomView_fileDropTarget_animation;
    -webkit-animation-duration: 0.5s;
            animation-duration: 0.5s;
}
@-webkit-keyframes mx_RoomView_fileDropTarget_image_animation {
    from {
        -webkit-transform: scaleX(0);
                transform: scaleX(0);
    }
    to {
        -webkit-transform: scaleX(1);
                transform: scaleX(1);
    }
}
@keyframes mx_RoomView_fileDropTarget_image_animation {
    from {
        -webkit-transform: scaleX(0);
                transform: scaleX(0);
    }
    to {
        -webkit-transform: scaleX(1);
                transform: scaleX(1);
    }
}
.mx_RoomView_fileDropTarget_image {
    width: 32px;
    -webkit-animation: mx_RoomView_fileDropTarget_image_animation;
            animation: mx_RoomView_fileDropTarget_image_animation;
    -webkit-animation-duration: 0.5s;
            animation-duration: 0.5s;
    margin-bottom: 16px;
}
.mx_RoomView_auxPanel {
    min-width: 0px;
    width: 100%;
    margin: 0px auto;

    overflow: auto;
}
.mx_RoomView_lowerAuxPanel {
    min-width: 0px;
    width: 100%;
    margin: 0px auto;
    overflow: auto;
}
.mx_RoomView_auxPanel_fullHeight {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 3000;
    background-color: hsla(216, 21%, 14%, 1);
}
.mx_RoomView_auxPanel_hiddenHighlights {
    border-bottom: 1px solid #404040;
    padding: 10px 26px;
    color: #FF5B55;
    cursor: default;
}
.mx_RoomView_auxPanel_apps {
    max-width: 1920px !important;
}
.mx_RoomView .mx_MainSplit {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 0px;
            flex: 1 1 0;
}
.mx_RoomView_messagePanel {
    width: 100%;
    -webkit-box-flex: 1;
        -ms-flex: 1 1 0px;
            flex: 1 1 0;
    overflow-anchor: none;

    overflow-y: overlay;
    overflow-x: hidden;
}
.mx_RoomView_messagePanelSearchSpinner {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    background-image: url(../../img/typing-indicator-2x.0eb9f0e.gif);
    background-position: center 367px;
    background-size: 25px;
    background-repeat: no-repeat;
    position: relative;
}
.mx_RoomView_messagePanelSearchSpinner::before {
    background-color: #888;
    -webkit-mask: url(../../img/feather-customised/search-input.044bfa7.svg);
            mask: url(../../img/feather-customised/search-input.044bfa7.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-size: 50px;
            mask-size: 50px;
    content: '';
    position: absolute;
    top: 286px;
    left: 0;
    right: 0;
    height: 50px;
}
.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;
    position: relative;
}
.mx_RoomView_body .mx_RoomView_messagePanel, .mx_RoomView_body .mx_RoomView_messagePanelSpinner, .mx_RoomView_body .mx_RoomView_messagePanelSearchSpinner {
        -webkit-box-ordinal-group: 3;
            -ms-flex-order: 2;
                order: 2;
    }
.mx_RoomView_body .mx_RoomView_timeline {
    /* offset parent for mx_RoomView_topUnreadMessagesBar  */
    position: relative;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin-right: calc(8px / 2);
}
.mx_RoomView_statusArea {
    width: 100%;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;

    max-height: 0px;
    background-color: hsla(216, 21%, 14%, 1);
    z-index: 1000;
    overflow: hidden;

    -webkit-transition: all .2s ease-out;

    transition: all .2s ease-out;
}
.mx_RoomView_statusArea_expanded {
    max-height: 100px;
}
.mx_RoomView_statusAreaBox {
    margin: auto;
    min-height: 50px;
}
.mx_RoomView_statusAreaBox_line {
    margin-left: 65px;
    border-top: 1px solid #404040;
    height: 1px;
}
.mx_RoomView_messageListWrapper {
    min-height: 100%;
    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_RoomView_searchResultsPanel .mx_RoomView_messageListWrapper {
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
    }
.mx_RoomView_searchResultsPanel a {
        text-decoration: none;
        color: inherit;
    }
.mx_RoomView_empty {
    font-size: 1.3rem;
    padding: 0 24px;
    margin-right: 30px;
    text-align: center;
    margin-bottom: 80px;
}
.mx_RoomView_MessageList {
    list-style-type: none;
    margin: 0;
    /* needed as min-height is set to clientHeight in ScrollPanel
    to prevent shrinking when WhoIsTypingTile is hidden */
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}
.mx_RoomView_MessageList li {
    clear: both;
}
li.mx_RoomView_myReadMarker_container {
    height: 0px;
    margin: 0px;
    padding: 0px;
    border: 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.mx_RoomView_myReadMarker_newLabel {
    color: #FF6161;
    -webkit-box-flex: 0;
        -ms-flex: 0;
            flex: 0;
    margin-left: 5px;
    margin-top: -1px;
}
hr.mx_RoomView_myReadMarker {
    border-top: solid 1px #FF6161;
    border-bottom: 0;
    margin-top: 0;
    margin-bottom: 0;
    position: relative;
    top: -1px;
    z-index: 1;
    will-change: width;
    -webkit-transition: width 400ms easeinsine 1s, opacity 400ms easeinsine 1s;
    transition: width 400ms easeinsine 1s, opacity 400ms easeinsine 1s;
    width: 99%;
    opacity: 1;
}
.mx_RoomView_dateSeparator_container .mx_DateSeparator > div {
            background: #25262d;
            z-index: 10;
        }
.mx_RoomView_dateSeparator_container + .mx_RoomView_myReadMarker_container {
    margin-top: -25px !important;
    margin-bottom: 25px !important;
}
.mx_RoomView_inCall .mx_RoomView_statusAreaBox_line {
    margin-top: 2px;
    border: none;
    height: 0px;
}
.mx_RoomView_inCall .mx_MessageComposer_wrapper {
    border-top: 2px hidden;
    padding-top: 1px;
}
.mx_RoomView_voipChevron {
    position: absolute;
    bottom: -11px;
    right: 11px;
}
.mx_RoomView_voipButton {
    float: right;
    margin-right: 13px;
    margin-top: 13px;
    cursor: default;
}
.mx_RoomView_voipButton object {
    pointer-events: none;
}
.mx_RoomView .mx_MessageComposer {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    margin-right: 2px;
}
.mx_RoomView_ongoingConfCallNotification {
    width: 100%;
    text-align: center;
    background-color: #FF5B55;
    color: #202127;
    font-weight: bold;
    padding: 6px 0;
    cursor: default;
}
.mx_RoomView_ongoingConfCallNotification a {
    color: #202127 !important;
}
.mx_MatrixChat_useCompactLayout .mx_RoomView_MessageList {
        margin-bottom: 4px;
    }
.mx_MatrixChat_useCompactLayout .mx_RoomView_statusAreaBox {
        min-height: 42px;
    }
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ScrollPanel .mx_RoomView_MessageList {
        position: relative;
        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;

        content-visibility: auto;
        contain-intrinsic-size: 50px;
    }
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.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 {
        cursor: default;
        background-image: url(../../img/icons-close.11ff07c.svg);
        background-repeat: no-repeat;
        width: 16px;
        height: 16px;
        background-position: center;
        padding: 9px;
    }
/*
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SpaceRoomView_landing .mx_AccessibleButton_kind_link {
        padding: 0;
        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 {
            font-size: 1.5rem;
            line-height: 2.4rem;
            color: #737D8C;
        }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_listHeader {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        min-height: 32px;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        font-size: 1.5rem;
        line-height: 2.4rem;
        color: #f0f0f1;
        margin-bottom: 12px;
    }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_listHeader > h4 {
            font-weight: 600;
            margin: 0;
        }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_listHeader .mx_AccessibleButton {
            padding: 4px 12px;
            font-weight: normal;
        }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_listHeader .mx_AccessibleButton + .mx_AccessibleButton {
                margin-left: 16px;
            }
.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_listHeader > span {
            margin-left: auto;
        }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_error {
        position: relative;
        font-weight: 600;
        color: #FF5B55;
        font-size: 1.5rem;
        line-height: 1.8rem;
        margin: 20px auto 12px;
        padding-left: 24px;
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
    }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_error::before {
            content: "";
            position: absolute;
            height: 16px;
            width: 16px;
            left: 0;
            background-image: url(../../img/element-icons/warning-badge.713e1ca.svg);
        }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list {
        list-style: none;
        padding: 0;
        margin: 0;
    }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomCount > h3 {
            display: inline;
            font-weight: 600;
            font-size: 1.8rem;
            line-height: 2.2rem;
            color: #f0f0f1;
        }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomCount > span {
            margin-left: 8px;
            font-size: 1.5rem;
            line-height: 2.4rem;
            color: #737D8C;
        }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_subspace .mx_BaseAvatar_image {
            border-radius: 8px;
        }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_subspace_toggle {
        position: absolute;
        left: -1px;
        top: 10px;
        height: 16px;
        width: 16px;
        border-radius: 4px;
        background-color: hsla(216, 21%, 14%, 1);
    }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_subspace_toggle::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            height: 16px;
            width: 16px;
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            -webkit-mask-position: center;
                    mask-position: center;
            background-color: #8D97A5;
            -webkit-mask-size: 16px;
                    mask-size: 16px;
            -webkit-transform: rotate(270deg);
                    transform: rotate(270deg);
            -webkit-mask-image: url(../../img/feather-customised/chevron-down.5278abe.svg);
                    mask-image: url(../../img/feather-customised/chevron-down.5278abe.svg);
        }
.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 {
        position: relative;
        padding-left: 12px;
    }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile {
        position: relative;
        padding: 8px 16px;
        border-radius: 8px;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;

        display: grid;
        grid-template-columns: 20px auto -webkit-max-content;
        grid-template-columns: 20px auto max-content;
        grid-column-gap: 8px;
        grid-row-gap: 6px;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile .mx_BaseAvatar {
            grid-row: 1;
            grid-column: 1;
        }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_roomTile_name {
            font-weight: 600;
            font-size: 1.5rem;
            line-height: 1.8rem;
            grid-row: 1;
            grid-column: 2;
        }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_roomTile_name .mx_InfoTooltip, .mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_roomTile_name .mx_SpaceHierarchy_roomTile_joined {
                display: inline;
                margin-left: 12px;
                color: #8D97A5;
                font-size: 1.2rem;
                line-height: 1.5rem;
            }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_roomTile_name .mx_InfoTooltip .mx_InfoTooltip_icon, .mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile .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_roomTile .mx_SpaceHierarchy_roomTile_name .mx_InfoTooltip .mx_InfoTooltip_icon::before, .mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_roomTile_name .mx_SpaceHierarchy_roomTile_joined .mx_InfoTooltip_icon::before {
                        position: absolute;
                        top: 0;
                        left: 0;
                    }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_roomTile_name .mx_SpaceHierarchy_roomTile_joined {
                position: relative;
                padding-left: 16px;
            }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_roomTile_name .mx_SpaceHierarchy_roomTile_joined::before {
                    content: '';
                    width: 20px;
                    height: 20px;
                    top: -2px;
                    left: -4px;
                    position: absolute;
                    -webkit-mask-position: center;
                            mask-position: center;
                    -webkit-mask-size: contain;
                            mask-size: contain;
                    -webkit-mask-repeat: no-repeat;
                            mask-repeat: no-repeat;
                    background-color: #4958F5;
                    -webkit-mask-image: url(../../img/element-icons/roomlist/checkmark.a8c4d72.svg);
                            mask-image: url(../../img/element-icons/roomlist/checkmark.a8c4d72.svg);
                }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_roomTile_info {
            font-size: 1.4rem;
            line-height: 1.8rem;
            color: #737D8C;
            grid-row: 2;
            grid-column: 2/3;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            overflow: hidden;
        }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_actions {
            text-align: right;
            margin-left: 20px;
            grid-column: 3;
            grid-row: 1/3;
        }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_actions .mx_AccessibleButton {
                line-height: 2.4rem;
                padding: 4px 16px;
                display: inline-block;
                visibility: hidden;
            }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_actions .mx_AccessibleButton_kind_danger_outline, .mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_actions .mx_AccessibleButton_kind_primary_outline {
                padding: 3px 16px;
            }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_actions .mx_Checkbox {
                display: -webkit-inline-box;
                display: -ms-inline-flexbox;
                display: inline-flex;
                vertical-align: middle;
                margin-left: 12px;
            }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile:hover, .mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile:focus-within {
            background-color: rgba(38, 39, 43, 0.82);
        }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile:hover .mx_AccessibleButton, .mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile:focus-within .mx_AccessibleButton {
                visibility: visible;
            }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile.mx_SpaceHierarchy_joining .mx_AccessibleButton {
            visibility: visible;
            padding: 4px 18px;
        }
.mx_SpaceRoomView_landing li.mx_SpaceHierarchy_roomTileWrapper {
        list-style: none;
    }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile::before, .mx_SpaceRoomView_landing .mx_SpaceHierarchy_subspace_children::before {
            content: "";
            position: absolute;
            background-color: rgba(38, 39, 43, 0.82);
            width: 1px;
            height: 100%;
            left: 6px;
            top: 0;
        }
.mx_SpaceRoomView_landing .mx_SpaceHierarchy_actions .mx_SpaceHierarchy_actionsText {
            font-weight: normal;
            font-size: 1.2rem;
            line-height: 1.5rem;
            color: #737D8C;
        }
.mx_SpaceRoomView_landing > hr {
        border: none;
        height: 1px;
        background-color: rgba(141, 151, 165, 0.2);
        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;
    }
/*
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SpacePanel {
    background-color: rgba(38, 39, 43, 0.82);
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    padding: 50px 0 0;
    margin: 0;
    position: relative;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
.mx_SpacePanel .mx_SpacePanel_toggleCollapse {
        position: absolute;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background-color: #8D97A5;
        top: 19px;
        right: -8px;
    }
.mx_SpacePanel .mx_SpacePanel_toggleCollapse::before {
            content: "";
            position: absolute;
            width: inherit;
            height: inherit;
            -webkit-mask-position: center;
                    mask-position: center;
            -webkit-mask-size: contain;
                    mask-size: contain;
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            background-color: hsla(216, 21%, 14%, 1);
            -webkit-mask-image: url(../../img/feather-customised/chevron-down.5278abe.svg);
                    mask-image: url(../../img/feather-customised/chevron-down.5278abe.svg);
            -webkit-transform: rotate(270deg);
                    transform: rotate(270deg);
        }
.mx_SpacePanel .mx_SpacePanel_toggleCollapse:not(.expanded) {
            opacity: 0;
        }
.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 {
        margin: 0;
        list-style: none;
        padding: 0;
    }
.mx_SpacePanel ul > .mx_SpaceItem {
            padding-left: 16px;
        }
.mx_SpacePanel .mx_SpaceButton_toggleCollapse {
        cursor: default;
    }
.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 {
            -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_new .mx_BetaDot {
            position: absolute;
            left: 33px;
            top: -5px;
        }
.mx_SpacePanel .mx_SpaceItem:not(.hasSubSpaces) > .mx_SpaceButton {
        margin-left: 16px;
        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;
        padding: 4px 4px 4px 0;
        width: 100%;
        cursor: default;
    }
.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_active:not(.mx_SpaceButton_narrow) .mx_SpaceButton_selectionWrapper {
                background-color: rgba(141,151,165, 0.2);
            }
.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_active.mx_SpaceButton_narrow .mx_SpaceButton_selectionWrapper {
                padding: 1px;
                border: 3px #f0f0f1 solid;
            }
.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_selectionWrapper {
            position: relative;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-flex: 1;
                -ms-flex: 1;
                    flex: 1;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            border-radius: 12px;
            padding: 4px;
            width: calc(100% - 32px);
        }
.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_name {
            -webkit-box-flex: 1;
                -ms-flex: 1;
                    flex: 1;
            margin-left: 8px;
            white-space: nowrap;
            display: block;
            text-overflow: ellipsis;
            overflow: hidden;
            font-size: 1.4rem;
            line-height: 1.8rem;
        }
.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_toggleCollapse {
            width: 16px;
            min-width: 16px;
            height: 20px;
            -webkit-mask-position: center;
                    mask-position: center;
            -webkit-mask-size: 20px;
                    mask-size: 20px;
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            background-color: #8D97A5;
            -webkit-mask-image: url(../../img/feather-customised/chevron-down.5278abe.svg);
                    mask-image: url(../../img/feather-customised/chevron-down.5278abe.svg);
        }
.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_icon {
            width: 32px;
            min-width: 32px;
            height: 32px;
            border-radius: 8px;
            position: relative;
        }
.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_icon::before {
                position: absolute;
                content: '';
                width: 32px;
                height: 32px;
                top: 0;
                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;
            }
.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_home .mx_SpaceButton_icon, .mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_favourites .mx_SpaceButton_icon, .mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_people .mx_SpaceButton_icon, .mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_orphans .mx_SpaceButton_icon {
                background-color: rgba(141,151,165, 0.2);
            }
.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_home .mx_SpaceButton_icon::before, .mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_favourites .mx_SpaceButton_icon::before, .mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_people .mx_SpaceButton_icon::before, .mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_orphans .mx_SpaceButton_icon::before {
                    background-color: #737D8C;
                }
.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_home .mx_SpaceButton_icon::before {
            -webkit-mask-image: url(../../img/element-icons/home.b706c0e.svg);
                    mask-image: url(../../img/element-icons/home.b706c0e.svg);
        }
.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_favourites .mx_SpaceButton_icon::before {
            -webkit-mask-image: url(../../img/element-icons/roomlist/favorite.ff7609d.svg);
                    mask-image: url(../../img/element-icons/roomlist/favorite.ff7609d.svg);
        }
.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_people .mx_SpaceButton_icon::before {
            -webkit-mask-image: url(../../img/element-icons/room/members.88c3e93.svg);
                    mask-image: url(../../img/element-icons/room/members.88c3e93.svg);
        }
.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_orphans .mx_SpaceButton_icon::before {
            -webkit-mask-image: url(../../img/element-icons/roomlist/hash-circle.c36ee5b.svg);
                    mask-image: url(../../img/element-icons/roomlist/hash-circle.c36ee5b.svg);
        }
.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_new .mx_SpaceButton_icon::before {
                background-color: #f0f0f1;
                -webkit-mask-image: url(../../img/element-icons/plus.62cc275.svg);
                        mask-image: url(../../img/element-icons/plus.62cc275.svg);
                -webkit-transition: all .2s ease-in-out;
                transition: all .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_BaseAvatar_image {
            border-radius: 8px;
        }
.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_menuButton {
            width: 20px;
            min-width: 20px;
            height: 20px;
            margin-top: auto;
            margin-bottom: auto;
            display: none;
            position: relative;
        }
.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_menuButton::before {
                top: 3px;
                left: 2px;
                content: '';
                width: 16px;
                height: 16px;
                position: absolute;
                -webkit-mask-position: center;
                        mask-position: center;
                -webkit-mask-size: contain;
                        mask-size: contain;
                -webkit-mask-repeat: no-repeat;
                        mask-repeat: no-repeat;
                -webkit-mask-image: url(../../img/element-icons/context-menu.829cc1a.svg);
                        mask-image: url(../../img/element-icons/context-menu.829cc1a.svg);
                background: #f0f0f1;
            }
.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;
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
    }
.mx_SpacePanel .mx_SpaceTreeLevel .mx_BaseAvatar:not(.mx_UserMenu_userAvatar_BaseAvatar) .mx_BaseAvatar_initial {
            color: #737D8C;
            border-radius: 8px;
            background-color: rgba(141,151,165, 0.2);
            font-size: 1.5rem !important;
            font-weight: 600;
            line-height: 1.8rem;
        }
.mx_SpacePanel .mx_SpaceTreeLevel .mx_BaseAvatar:not(.mx_UserMenu_userAvatar_BaseAvatar) .mx_BaseAvatar_initial + .mx_BaseAvatar_image {
                visibility: hidden;
            }
.mx_SpacePanel .mx_SpaceButton_avatarWrapper {
        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 {
            margin: 0 2px;
            background-clip: padding-box;
        }
.mx_SpacePanel .mx_SpacePanel_badgeContainer .mx_NotificationBadge_dot {
            margin: 0 -1px 0 0;
            border: 3px solid rgba(38, 39, 43, 0.82);
        }
.mx_SpacePanel .mx_SpacePanel_badgeContainer .mx_NotificationBadge_2char, .mx_SpacePanel .mx_SpacePanel_badgeContainer .mx_NotificationBadge_3char {
            margin: -5px -5px 0 0;
            border: 2px solid rgba(38, 39, 43, 0.82);
        }
.mx_SpacePanel .mx_SpaceButton:hover:not(.mx_SpaceButton_narrow):not(.mx_SpaceButton_invite) .mx_SpaceButton_menuButton, .mx_SpacePanel .mx_SpaceButton:focus-within: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;
        }
/* root space buttons are bigger and not indented */
.mx_SpacePanel > .mx_AutoHideScrollbar {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        padding: 0 8px 16px 0;
    }
.mx_SpacePanel > .mx_AutoHideScrollbar > .mx_SpaceButton {
            height: 32px;
        }
.mx_SpacePanel > .mx_AutoHideScrollbar > .mx_SpaceButton.mx_SpaceButton_active::before {
                height: 32px;
            }
.mx_SpacePanel > .mx_AutoHideScrollbar > ul {
            padding-left: 0;
        }
.mx_SpacePanel > .mx_AutoHideScrollbar.mx_IndicatorScrollbar_topOverflow {
            -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(5%, black));
            -webkit-mask-image: linear-gradient(180deg, transparent, black 5%);
                    mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(5%, black));
                    mask-image: linear-gradient(180deg, transparent, black 5%);
        }
.mx_SpacePanel > .mx_AutoHideScrollbar.mx_IndicatorScrollbar_bottomOverflow {
            -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(black), color-stop(95%, black), to(transparent));
            -webkit-mask-image: linear-gradient(180deg, black, black 95%, transparent);
                    mask-image: -webkit-gradient(linear, left top, left bottom, from(black), color-stop(95%, black), to(transparent));
                    mask-image: linear-gradient(180deg, black, black 95%, transparent);
        }
.mx_SpacePanel > .mx_AutoHideScrollbar.mx_IndicatorScrollbar_topOverflow.mx_IndicatorScrollbar_bottomOverflow {
            -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(5%, black), color-stop(95%, black), to(transparent));
            -webkit-mask-image: linear-gradient(180deg, transparent, black 5%, black 95%, transparent);
                    mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(5%, black), color-stop(95%, black), to(transparent));
                    mask-image: linear-gradient(180deg, transparent, black 5%, black 95%, transparent);
        }
.mx_SpacePanel .mx_UserMenu {
        padding: 0 2px 8px;
        border-bottom: 1px solid #E3E8F0;
        margin: 12px 14px 4px 18px;
    }
.mx_SpacePanel_contextMenu .mx_SpacePanel_contextMenu_header {
        margin: 12px 16px 12px;
        font-weight: 600;
        font-size: 1.5rem;
        line-height: 1.8rem;
    }
.mx_SpacePanel_contextMenu .mx_SpacePanel_iconHome::before {
        -webkit-mask-image: url(../../img/element-icons/home.b706c0e.svg);
                mask-image: url(../../img/element-icons/home.b706c0e.svg);
    }
.mx_SpacePanel_contextMenu .mx_SpacePanel_iconInvite::before {
        -webkit-mask-image: url(../../img/element-icons/room/invite.946a71b.svg);
                mask-image: url(../../img/element-icons/room/invite.946a71b.svg);
    }
.mx_SpacePanel_contextMenu .mx_SpacePanel_iconSettings::before {
        -webkit-mask-image: url(../../img/element-icons/settings.6b381af.svg);
                mask-image: url(../../img/element-icons/settings.6b381af.svg);
    }
.mx_SpacePanel_contextMenu .mx_SpacePanel_iconLeave::before {
        -webkit-mask-image: url(../../img/element-icons/leave.bb917e7.svg);
                mask-image: url(../../img/element-icons/leave.bb917e7.svg);
    }
.mx_SpacePanel_contextMenu .mx_SpacePanel_iconMembers::before {
        -webkit-mask-image: url(../../img/element-icons/room/members.88c3e93.svg);
                mask-image: url(../../img/element-icons/room/members.88c3e93.svg);
    }
.mx_SpacePanel_contextMenu .mx_SpacePanel_iconPlus::before {
        -webkit-mask-image: url(../../img/element-icons/plus.62cc275.svg);
                mask-image: url(../../img/element-icons/plus.62cc275.svg);
    }
.mx_SpacePanel_contextMenu .mx_SpacePanel_iconExplore::before {
        -webkit-mask-image: url(../../img/element-icons/roomlist/hash-search.2077950.svg);
                mask-image: url(../../img/element-icons/roomlist/hash-search.2077950.svg);
    }
.mx_SpacePanel_contextMenu .mx_SpacePanel_iconPreferences::before {
        -webkit-mask-image: url(../../img/element-icons/settings/preference.82bfabd.svg);
                mask-image: url(../../img/element-icons/settings/preference.82bfabd.svg);
    }
.mx_SpacePanel_contextMenu .mx_SpacePanel_iconPreferences::before {
        -webkit-mask-image: url(../../img/element-icons/settings/preference.82bfabd.svg);
                mask-image: url(../../img/element-icons/settings/preference.82bfabd.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: #8D97A5;
        font-size: 1.0rem;
        line-height: 1.2rem;
        font-weight: 600;
    }
.mx_SpacePanel_sharePublicSpace {
    margin: 0;
}
/*
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SpaceRoomView {
    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 {
            margin: 0;
            font-size: 2.4rem;
            font-weight: 600;
            color: #f0f0f1;
            width: -webkit-max-content;
            width: -moz-max-content;
            width: max-content;
        }
.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_SpaceRoomView_description {
            font-size: 1.5rem;
            color: #737D8C;
            margin-top: 12px;
            margin-bottom: 24px;
            max-width: 428px;
        }
.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_AddExistingToSpace {
            max-width: 428px;
        }
.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:not(.mx_SpaceRoomView_landing) .mx_SpaceFeedbackPrompt {
            width: 428px;
        }
.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_SpaceRoomView_buttons {
            display: block;
            margin-top: 44px;
            width: 428px;
            text-align: right;
        }
.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_SpaceRoomView_buttons .mx_AccessibleButton_hasKind {
                padding: 8px 22px;
                margin-left: 16px;
            }
.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: 428px;
        }
.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_Field + .mx_Field {
                margin-top: 28px;
            }
.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_SpaceRoomView_errorText {
            font-weight: 600;
            font-size: 1.2rem;
            line-height: 1.5rem;
            color: #FF5B55;
            margin-bottom: 28px;
        }
.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_AccessibleButton_disabled {
            cursor: not-allowed;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_preview {
        padding: 32px 24px !important;
        margin: auto;
        max-width: 480px;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        -webkit-box-shadow: 2px 15px 30px rgba(0, 0, 0, 0.48);
                box-shadow: 2px 15px 30px rgba(0, 0, 0, 0.48);
        border-radius: 8px;
        position: relative;
    }
.mx_SpaceRoomView .mx_SpaceRoomView_preview .mx_BetaCard_betaPill {
            position: absolute;
            right: 24px;
            top: 32px;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_preview .mx_SpaceRoomView_preview_spaceBetaPrompt {
            font-weight: 600;
            font-size: 1.4rem;
            line-height: 2.4rem;
            color: #f0f0f1;
            margin-top: 24px;
            position: relative;
            padding-left: 24px;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_preview .mx_SpaceRoomView_preview_spaceBetaPrompt .mx_AccessibleButton_kind_link {
                display: inline;
                padding: 0;
                font-size: inherit;
                line-height: inherit;
            }
.mx_SpaceRoomView .mx_SpaceRoomView_preview .mx_SpaceRoomView_preview_spaceBetaPrompt::before {
                content: "";
                position: absolute;
                height: 2.4rem;
                width: 20px;
                left: 0;
                -webkit-mask-repeat: no-repeat;
                        mask-repeat: no-repeat;
                -webkit-mask-position: center;
                        mask-position: center;
                -webkit-mask-size: contain;
                        mask-size: contain;
                -webkit-mask-image: url(../../img/element-icons/room/room-summary.dd857b6.svg);
                        mask-image: url(../../img/element-icons/room/room-summary.dd857b6.svg);
                background-color: #737D8C;
            }
.mx_SpaceRoomView .mx_SpaceRoomView_preview .mx_SpaceRoomView_preview_migratedCommunity {
            margin-bottom: 16px;
            padding: 8px 12px;
            border-radius: 8px;
            border: 1px solid rgba(231, 231, 231, 0.2);
            width: -webkit-max-content;
            width: -moz-max-content;
            width: max-content;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_preview .mx_SpaceRoomView_preview_migratedCommunity .mx_BaseAvatar {
                margin-right: 4px;
            }
.mx_SpaceRoomView .mx_SpaceRoomView_preview .mx_SpaceRoomView_preview_inviter {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            margin-bottom: 20px;
            font-size: 1.5rem;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_preview .mx_SpaceRoomView_preview_inviter > div {
                margin-left: 8px;
            }
.mx_SpaceRoomView .mx_SpaceRoomView_preview .mx_SpaceRoomView_preview_inviter > div .mx_SpaceRoomView_preview_inviter_name {
                    line-height: 1.8rem;
                }
.mx_SpaceRoomView .mx_SpaceRoomView_preview .mx_SpaceRoomView_preview_inviter > div .mx_SpaceRoomView_preview_inviter_mxid {
                    line-height: 2.4rem;
                    color: #737D8C;
                }
.mx_SpaceRoomView .mx_SpaceRoomView_preview > .mx_RoomAvatar_isSpaceRoom.mx_BaseAvatar_image, .mx_SpaceRoomView .mx_SpaceRoomView_preview > .mx_RoomAvatar_isSpaceRoom .mx_BaseAvatar_image {
                border-radius: 12px;
            }
.mx_SpaceRoomView .mx_SpaceRoomView_preview h1.mx_SpaceRoomView_preview_name {
            margin: 20px 0 !important;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_preview .mx_SpaceRoomView_preview_topic {
            font-size: 1.4rem;
            line-height: 2.2rem;
            color: #737D8C;
            margin: 20px 0;
            max-height: 160px;
            overflow-y: auto;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_preview .mx_SpaceRoomView_preview_joinButtons {
            margin-top: 20px;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_preview .mx_SpaceRoomView_preview_joinButtons .mx_AccessibleButton {
                width: 200px;
                -webkit-box-sizing: border-box;
                        box-sizing: border-box;
                padding: 14px 0;
            }
.mx_SpaceRoomView .mx_SpaceRoomView_preview .mx_SpaceRoomView_preview_joinButtons .mx_AccessibleButton + .mx_AccessibleButton {
                    margin-left: 20px;
                }
.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_BaseAvatar {
            width: 80px;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_landing > .mx_BaseAvatar_image, .mx_SpaceRoomView .mx_SpaceRoomView_landing > .mx_BaseAvatar > .mx_BaseAvatar_image {
            border-radius: 12px;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_name {
            margin: 24px 0 16px;
            font-size: 1.5rem;
            color: #737D8C;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_name > span {
                display: inline-block;
            }
.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_name .mx_SpaceRoomView_landing_nameRow {
                margin-top: 12px;
            }
.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_name .mx_SpaceRoomView_landing_nameRow > h1 {
                    display: inline-block;
                }
.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_info {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_info .mx_SpaceRoomView_info {
                display: inline-block;
                margin: 0 auto 0 0;
            }
.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_info .mx_FacePile {
                display: inline-block;
                margin-right: 12px;
            }
.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_info .mx_FacePile .mx_FacePile_faces {
                    cursor: default;
                }
.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_info .mx_SpaceRoomView_landing_inviteButton {
                position: relative;
                padding: 4px 18px 4px 40px;
                line-height: 2.4rem;
                height: -webkit-min-content;
                height: -moz-min-content;
                height: min-content;
            }
.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_info .mx_SpaceRoomView_landing_inviteButton::before {
                    position: absolute;
                    content: "";
                    left: 8px;
                    height: 16px;
                    width: 16px;
                    background: #ffffff;
                    -webkit-mask-position: center;
                            mask-position: center;
                    -webkit-mask-size: 16px;
                            mask-size: 16px;
                    -webkit-mask-repeat: no-repeat;
                            mask-repeat: no-repeat;
                    -webkit-mask-image: url(../../img/element-icons/room/invite.946a71b.svg);
                            mask-image: url(../../img/element-icons/room/invite.946a71b.svg);
                }
.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_info .mx_SpaceRoomView_landing_settingsButton {
                position: relative;
                margin-left: 16px;
                width: 24px;
                height: 24px;
            }
.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_info .mx_SpaceRoomView_landing_settingsButton::before {
                    position: absolute;
                    content: "";
                    left: 0;
                    top: 0;
                    height: 24px;
                    width: 24px;
                    background: #8D97A5;
                    -webkit-mask-position: center;
                            mask-position: center;
                    -webkit-mask-size: contain;
                            mask-size: contain;
                    -webkit-mask-repeat: no-repeat;
                            mask-repeat: no-repeat;
                    -webkit-mask-image: url(../../img/element-icons/settings.6b381af.svg);
                            mask-image: url(../../img/element-icons/settings.6b381af.svg);
                }
.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_topic {
            font-size: 1.5rem;
            margin-top: 12px;
            margin-bottom: 16px;
            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_landing .mx_SpaceFeedbackPrompt {
            padding: 7px;
            border: 1px solid rgba(240,240,241, .1);
            border-radius: 8px;
            width: -webkit-max-content;
            width: -moz-max-content;
            width: max-content;
            margin: 0 0 -40px auto;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_privateScope > .mx_AccessibleButton {
            position: relative;
            padding: 16px 32px 16px 72px;
            width: 432px;
            -webkit-box-sizing: border-box;
                    box-sizing: border-box;
            border-radius: 8px;
            border: 1px solid rgba(231, 231, 231, 0.2);
            font-size: 1.5rem;
            margin: 20px 0;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_privateScope > .mx_AccessibleButton > h3 {
        font-weight: 600;
        margin: 0 0 4px;
    }
.mx_SpaceRoomView .mx_SpaceRoomView_privateScope > .mx_AccessibleButton > span {
        color: #737D8C;
    }
.mx_SpaceRoomView .mx_SpaceRoomView_privateScope > .mx_AccessibleButton::before {
        position: absolute;
        content: '';
        width: 32px;
        height: 32px;
        top: 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;
        background-color: #8D97A5;
    }
.mx_SpaceRoomView .mx_SpaceRoomView_privateScope > .mx_AccessibleButton:hover {
        border-color: #4958F5;
    }
.mx_SpaceRoomView .mx_SpaceRoomView_privateScope > .mx_AccessibleButton:hover::before {
            background-color: #4958F5;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_privateScope > .mx_AccessibleButton:hover > span {
            color: #f0f0f1;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_privateScope .mx_SpaceRoomView_privateScope_justMeButton::before {
            -webkit-mask-image: url(../../img/element-icons/room/members.88c3e93.svg);
                    mask-image: url(../../img/element-icons/room/members.88c3e93.svg);
        }
.mx_SpaceRoomView .mx_SpaceRoomView_privateScope .mx_SpaceRoomView_privateScope_meAndMyTeammatesButton::before {
            -webkit-mask-image: url(../../img/element-icons/community-members.cbb31c1.svg);
                    mask-image: url(../../img/element-icons/community-members.cbb31c1.svg);
        }
.mx_SpaceRoomView .mx_SpaceRoomView_inviteTeammates .mx_SpaceRoomView_inviteTeammates_betaDisclaimer {
            padding: 16px;
            position: relative;
            border-radius: 8px;
            background-color: #454854;
            max-width: 428px;
            margin: 20px 0 30px;
            -webkit-box-sizing: border-box;
                    box-sizing: border-box;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_inviteTeammates .mx_SpaceRoomView_inviteTeammates_betaDisclaimer .mx_BetaCard_betaPill {
                position: absolute;
                left: 16px;
                top: 16px;
            }
.mx_SpaceRoomView .mx_SpaceRoomView_inviteTeammates .mx_SpaceRoomView_inviteTeammates_buttons {
            color: #737D8C;
            margin-top: 28px;
        }
.mx_SpaceRoomView .mx_SpaceRoomView_inviteTeammates .mx_SpaceRoomView_inviteTeammates_buttons .mx_AccessibleButton {
                position: relative;
                display: inline-block;
                padding-left: 32px;
                line-height: 24px;
            }
.mx_SpaceRoomView .mx_SpaceRoomView_inviteTeammates .mx_SpaceRoomView_inviteTeammates_buttons .mx_AccessibleButton::before {
                    content: "";
                    position: absolute;
                    height: 24px;
                    width: 24px;
                    top: 0;
                    left: 0;
                    background-color: #737D8C;
                    -webkit-mask-repeat: no-repeat;
                            mask-repeat: no-repeat;
                    -webkit-mask-position: center;
                            mask-position: center;
                    -webkit-mask-size: contain;
                            mask-size: contain;
                }
.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: #4958F5;
            }
.mx_SpaceRoomView .mx_SpaceRoomView_inviteTeammates .mx_SpaceRoomView_inviteTeammates_buttons .mx_SpaceRoomView_inviteTeammates_inviteDialogButton::before {
                    -webkit-mask-image: url(../../img/element-icons/room/invite.946a71b.svg);
                            mask-image: url(../../img/element-icons/room/invite.946a71b.svg);
                    background-color: #4958F5;
                }
.mx_SpaceRoomView_info {
    color: #737D8C;
    font-size: 1.5rem;
    line-height: 2.4rem;
    margin: 20px 0;
}
.mx_SpaceRoomView_info .mx_SpaceRoomView_info_public, .mx_SpaceRoomView_info .mx_SpaceRoomView_info_private {
        padding-left: 20px;
        position: relative;
    }
.mx_SpaceRoomView_info .mx_SpaceRoomView_info_public::before, .mx_SpaceRoomView_info .mx_SpaceRoomView_info_private::before {
            position: absolute;
            content: "";
            width: 20px;
            height: 20px;
            top: 0;
            left: -2px;
            -webkit-mask-position: center;
                    mask-position: center;
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            background-color: #8D97A5;
        }
.mx_SpaceRoomView_info .mx_SpaceRoomView_info_public::before {
        -webkit-mask-size: 12px;
                mask-size: 12px;
        -webkit-mask-image: url(../../img/globe.8201f08.svg);
                mask-image: url(../../img/globe.8201f08.svg);
    }
.mx_SpaceRoomView_info .mx_SpaceRoomView_info_private::before {
        -webkit-mask-size: 14px;
                mask-size: 14px;
        -webkit-mask-image: url(../../img/element-icons/lock.1f264bd.svg);
                mask-image: url(../../img/element-icons/lock.1f264bd.svg);
    }
.mx_SpaceRoomView_info .mx_SpaceRoomView_info_memberCount {
        color: inherit;
        position: relative;
        padding: 0 0 0 16px;
        font-size: 1.5rem;
    }
.mx_SpaceRoomView_info .mx_SpaceRoomView_info_memberCount::before {
            content: "·";
            position: absolute;
            left: 6px;
        }
/*
Copyright 2017 Travis Ralston
Copyright 2019 New Vector Ltd
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_TabbedView {
    margin: 0;
    padding: 0 0 0 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin-top: 8px;
}
.mx_TabbedView_tabsOnLeft {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    position: absolute;
}
.mx_TabbedView_tabsOnLeft .mx_TabbedView_tabLabels {
        width: 170px;
        max-width: 170px;
        position: fixed;
    }
.mx_TabbedView_tabsOnLeft .mx_TabbedView_tabPanel {
        margin-left: 240px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
.mx_TabbedView_tabsOnLeft .mx_TabbedView_tabLabel_active {
        background-color: #4958F5;
        color: #f0f0f1;
    }
.mx_TabbedView_tabsOnLeft .mx_TabbedView_tabLabel_active .mx_TabbedView_maskedIcon::before {
        background-color: #f0f0f1;
    }
.mx_TabbedView_tabsOnLeft .mx_TabbedView_maskedIcon {
        width: 16px;
        height: 16px;
        margin-left: 8px;
        margin-right: 16px;
    }
.mx_TabbedView_tabsOnLeft .mx_TabbedView_maskedIcon::before {
        -webkit-mask-size: 16px;
                mask-size: 16px;
        width: 16px;
        height: 16px;
    }
.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: 0px;
        padding-right: 52px;
    }
.mx_TabbedView_tabsOnTop .mx_TabbedView_tabLabel .mx_TabbedView_tabLabel_text {
            font-size: 15px;
            color: #8D97A5;
        }
.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 {
        color: #4958F5;
    }
.mx_TabbedView_tabsOnTop .mx_TabbedView_tabLabel_active .mx_TabbedView_tabLabel_text {
            color: #4958F5;
        }
.mx_TabbedView_tabsOnTop .mx_TabbedView_tabLabel_active .mx_TabbedView_maskedIcon::before {
        background-color: #4958F5;
    }
.mx_TabbedView_tabsOnTop .mx_TabbedView_maskedIcon {
        width: 22px;
        height: 22px;
        margin-left: 0px;
        margin-right: 8px;
    }
.mx_TabbedView_tabsOnTop .mx_TabbedView_maskedIcon::before {
        -webkit-mask-size: 22px;
                mask-size: 22px;
        width: inherit;
        height: inherit;
    }
.mx_TabbedView_tabLabels {
    color: #f0f0f1;
}
.mx_TabbedView_tabLabel {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    vertical-align: text-top;
    cursor: default;
    padding: 8px 0;
    border-radius: 8px;
    font-size: 1.3rem;
    position: relative;
}
.mx_TabbedView_maskedIcon {
    display: inline-block;
}
.mx_TabbedView_maskedIcon::before {
    display: inline-block;
    background-color: #8e99a4;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    content: '';
}
.mx_TabbedView_tabLabel_text {
    vertical-align: middle;
}
.mx_TabbedView_tabPanel {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 0;
}
.mx_TabbedView_tabPanelContent {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    overflow: auto;
    min-height: 0;
}
/*
Copyright 2017 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_GroupFilterPanelContainer {
    -webkit-box-flex: 0;
        -ms-flex-positive: 0;
            flex-grow: 0;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    width: 56px;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
.mx_GroupFilterPanel {
    z-index: 1;
    background-color: rgba(38, 39, 43, 0.82);
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    cursor: default;
    position: relative;

    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: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    min-height: 0;
}
.mx_GroupFilterPanel_items_selected {
    cursor: default;
}
.mx_GroupFilterPanel .mx_GroupFilterPanel_divider {
    height: 0px;
    width: 90%;
    border: none;
    border-bottom: 1px solid #8D97A5;
}
.mx_GroupFilterPanel .mx_GroupFilterPanel_scroller {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    width: 100%;
}
.mx_GroupFilterPanel .mx_GroupFilterPanel_tagTileContainer {
    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;

    padding-top: 6px;
}
.mx_GroupFilterPanel .mx_GroupFilterPanel_tagTileContainer > div {
    margin: 6px 0;
}
.mx_GroupFilterPanel .mx_TagTile {
    position: relative;
}
.mx_GroupFilterPanel .mx_TagTile.mx_TagTile_prototype {
    padding: 3px;
}
.mx_GroupFilterPanel .mx_TagTile:focus, .mx_GroupFilterPanel .mx_TagTile:hover, .mx_GroupFilterPanel .mx_TagTile.mx_TagTile_selected {
}
.mx_GroupFilterPanel .mx_TagTile.mx_TagTile_selected_prototype {
    background-color: hsla(216, 21%, 14%, 1);
    border-radius: 6px;
}
.mx_TagTile_selected_prototype .mx_TagTile_homeIcon::before {
        background-color: #f0f0f1;
    }
.mx_TagTile:not(.mx_TagTile_selected_prototype) .mx_TagTile_homeIcon {
    background-color: rgba(92, 100, 112, 0.3);
    border-radius: 48px;
}
.mx_TagTile:not(.mx_TagTile_selected_prototype) .mx_TagTile_homeIcon::before {
        background-color: #f0f0f1;
    }
.mx_TagTile_homeIcon {
    width: 32px;
    height: 32px;
    position: relative;
}
.mx_TagTile_homeIcon::before {
        -webkit-mask-image: url(../../img/element-icons/home.b706c0e.svg);
                mask-image: url(../../img/element-icons/home.b706c0e.svg);
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-size: 21px;
                mask-size: 21px;
        content: '';
        display: inline-block;
        width: 32px;
        height: 32px;
        position: absolute;
        top: calc(50% - 16px);
        left: calc(50% - 16px);
    }
.mx_GroupFilterPanel .mx_TagTile_plus {
    margin-bottom: 12px;
    height: 32px;
    width: 32px;
    border-radius: 20px;
    background-color: rgba(92, 100, 112, 0.3);
    position: relative;
    /* overwrite mx_RoleButton inline-block */
    display: block !important;
}
.mx_GroupFilterPanel .mx_TagTile_plus::before {
        background-color: #f0f0f1;
        -webkit-mask-image: url(../../img/feather-customised/plus.38ae979.svg);
                mask-image: url(../../img/feather-customised/plus.38ae979.svg);
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
    }
.mx_GroupFilterPanel .mx_TagTile.mx_TagTile_selected::before {
    content: '';
    height: 100%;
    background-color: #4958F5;
    width: 4px;
    position: absolute;
    left: -12px;
    border-radius: 0 3px 3px 0;
}
.mx_GroupFilterPanel .mx_TagTile.mx_AccessibleButton:focus {
    -webkit-filter: none;
            filter: none;
}
.mx_TagTile_tooltip {
    position: relative;
    top: -30px;
    left: 5px;
}
.mx_TagTile_context_button {
    min-width: 15px;
    height: 15px;
    position: absolute;
    right: -5px;
    top: -8px;
    border-radius: 8px;
    background-color: #dbdbdb;
    color: #000;
    font-weight: 600;
    font-size: 1.0rem;
    text-align: center;
    padding-top: 1px;
    padding-left: 4px;
    padding-right: 4px;
}
.mx_TagTile_avatar {
    position: relative;
}
.mx_TagTile_badge {
    position: absolute;
    right: -4px;
    top: -2px;
    border-radius: 8px;
    color: #202127;
    font-weight: 600;
    font-size: 1.4rem;
    padding: 0 5px;
    background-color: #b9bec6;
}
.mx_TagTile_badgeHighlight {
    background-color: #FF5B55;
}
/*
Copyright 2019-2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ToastContainer {
    position: absolute;
    top: 42px;
    left: 70px;
    padding: 4px;
    display: grid;
    grid-template-rows: 1fr 14px 6px;
    z-index: 10000;
}
.mx_ToastContainer.mx_ToastContainer_stacked::before {
        content: "";
        margin: 0 4px;
        grid-row: 2 / 4;
        grid-column: 1;
        background-color: #F4F6FA;
        -webkit-box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.5);
                box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.5);
        border-radius: 8px;
    }
.mx_ToastContainer .mx_Toast_toast {
        grid-row: 1 / 3;
        grid-column: 1;
        background-color: #F4F6FA;
        color: #f0f0f1;
        -webkit-box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.5);
                box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.5);
        border-radius: 8px;
        overflow: hidden;
        display: grid;
        grid-template-columns: 22px 1fr;
        grid-column-gap: 8px;
        -webkit-column-gap: 8px;
           -moz-column-gap: 8px;
                column-gap: 8px;
        grid-row-gap: 4px;
        row-gap: 4px;
        padding: 8px;
    }
.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon:not(.mx_Toast_icon_beekit)::before, .mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon:not(.mx_Toast_icon_beekit)::after, .mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon .mx_Toast_icon_beekit {
                content: "";
                width: 22px;
                height: 22px;
                grid-column: 1;
                grid-row: 1;
                -webkit-mask-size: 100%;
                        mask-size: 100%;
                -webkit-mask-position: center;
                        mask-position: center;
                -webkit-mask-repeat: no-repeat;
                        mask-repeat: no-repeat;
                background-size: 100%;
                background-repeat: no-repeat;
            }
.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon.mx_Toast_icon_verification::after {
                -webkit-mask-image: url(../../img/e2e/normal.76f0c09.svg);
                        mask-image: url(../../img/e2e/normal.76f0c09.svg);
                background-color: #f0f0f1;
            }
.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon.mx_Toast_icon_verification_warning::before {
                    background-color: #ffffff;
                    -webkit-mask-image: url(../../img/e2e/normal.76f0c09.svg);
                            mask-image: url(../../img/e2e/normal.76f0c09.svg);
                    -webkit-mask-size: 80%;
                            mask-size: 80%;
                }
.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon.mx_Toast_icon_verification_warning::after {
                    -webkit-mask-image: url(../../img/e2e/warning.78bb264.svg);
                            mask-image: url(../../img/e2e/warning.78bb264.svg);
                    background-color: #FF5B55;
                }
.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon.mx_Toast_icon_secure_backup::after {
                -webkit-mask-image: url(../../img/feather-customised/secure-backup.329cb1c.svg);
                        mask-image: url(../../img/feather-customised/secure-backup.329cb1c.svg);
                background-color: #f0f0f1;
            }
.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon.mx_Toast_icon_labs::after {
                -webkit-mask-image: url(../../img/element-icons/flask.b62a9a9.svg);
                        mask-image: url(../../img/element-icons/flask.b62a9a9.svg);
                background-color: #737D8C;
            }
.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon.mx_Toast_icon_warning::after {
                background-image: url(../../img/warning.05cc423.svg);
            }
.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon .mx_Toast_title, .mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon .mx_Toast_body {
                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_title, .mx_ToastContainer .mx_Toast_toast .mx_Toast_description {
            padding-right: 8px;
        }
.mx_ToastContainer .mx_Toast_toast .mx_Toast_title {
            width: 100%;
            -webkit-box-sizing: border-box;
                    box-sizing: border-box;
        }
.mx_ToastContainer .mx_Toast_toast .mx_Toast_title h2 {
                grid-column: 1 / 3;
                grid-row: 1;
                margin: 0;
                font-size: 1.5rem;
                font-weight: 600;
                display: inline;
                width: auto;
                vertical-align: middle;
            }
.mx_ToastContainer .mx_Toast_toast .mx_Toast_title span {
                padding-left: 8px;
                float: right;
                font-size: 1.2rem;
                line-height: 2.2rem;
                color: #737D8C;
            }
.mx_ToastContainer .mx_Toast_toast .mx_Toast_body {
            grid-column: 1 / 3;
            grid-row: 2;
        }
.mx_ToastContainer .mx_Toast_toast .mx_Toast_buttons {
            float: right;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
        }
.mx_ToastContainer .mx_Toast_toast .mx_Toast_buttons .mx_AccessibleButton {
                min-width: 96px;
                -webkit-box-sizing: border-box;
                        box-sizing: border-box;
            }
.mx_ToastContainer .mx_Toast_toast .mx_Toast_buttons .mx_AccessibleButton + .mx_AccessibleButton {
                margin-left: 5px;
            }
.mx_ToastContainer .mx_Toast_toast .mx_Toast_description {
            max-width: 272px;
            overflow: hidden;
            text-overflow: ellipsis;
            margin: 4px 0 11px 0;
            font-size: 1.2rem;
        }
.mx_ToastContainer .mx_Toast_toast .mx_Toast_description .mx_AccessibleButton_kind_link {
                font-size: inherit;
                padding: 0;
            }
.mx_ToastContainer .mx_Toast_toast .mx_Toast_description a {
                text-decoration: none;
            }
.mx_ToastContainer .mx_Toast_toast .mx_Toast_detail {
            color: #737D8C;
        }
.mx_ToastContainer .mx_Toast_toast .mx_Toast_deviceID {
            font-size: 1.0rem;
        }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_UserMenu {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.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_UserMenu_name {
        font-weight: 600;
        font-size: 1.5rem;
        line-height: 2.4rem;
        margin-left: 10px;
    }
.mx_UserMenu .mx_UserMenu_cutout .mx_BaseAvatar {
        -webkit-mask-image: url(../../img/element-icons/roomlist/dnd-avatar-mask.953b958.svg);
                mask-image: url(../../img/element-icons/roomlist/dnd-avatar-mask.953b958.svg);
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: contain;
                mask-size: contain;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
    }
.mx_UserMenu .mx_UserMenu_dndBadge {
        position: absolute;
        bottom: -2px;
        right: -7px;
        width: 16px;
        height: 16px;
        border-radius: 50%;
    }
.mx_UserMenu .mx_UserMenu_dndBadge::before {
            content: "";
            width: 16px;
            height: 16px;
            position: absolute;
            -webkit-mask-position: center;
                    mask-position: center;
            -webkit-mask-size: contain;
                    mask-size: contain;
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            background-color: #FF5B55;
            -webkit-mask-image: url(../../img/element-icons/roomlist/dnd.1d2f3d1.svg);
                    mask-image: url(../../img/element-icons/roomlist/dnd.1d2f3d1.svg);
        }
.mx_UserMenu_dnd {
    cursor: default;
    width: 24px;
    height: 24px;
    position: relative;
    display: table;
}
.mx_UserMenu_dnd::before {
        content: "";
        position: absolute;
        width: 24px;
        height: 24px;
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: contain;
                mask-size: contain;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        background: hsla(215, 21%, 76%, 0.33);
    }
.mx_UserMenu_dnd.mx_UserMenu_dnd_noisy::before {
        -webkit-mask-size: 16px;
                mask-size: 16px;
        -webkit-mask-image: url(../../img/icon-bell-outline.cb3aea8.svg);
                mask-image: url(../../img/icon-bell-outline.cb3aea8.svg);
    }
.mx_UserMenu_dnd.mx_UserMenu_dnd_muted::before {
        -webkit-mask-size: 16px;
                mask-size: 16px;
        -webkit-mask-image: url(../../img/icon-bell-slash-outline.4ebd80b.svg);
                mask-image: url(../../img/icon-bell-slash-outline.4ebd80b.svg);
    }
.mx_UserMenu_dnd {

    cursor: default;
}
.mx_UserMenu_dnd:hover::before {
            background-color: hsla(215, 21%, 76%, 0.63);
            background-color: var(--header-control-fg-hover);
        }
.mx_UserMenu_contextMenu {
    width: 258px;
}
.mx_UserMenu_contextMenu.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList_red .mx_AccessibleButton {
            padding-top: 16px;
            padding-bottom: 16px;
        }
.mx_UserMenu_contextMenu .mx_UserMenu_contextMenu_header {
        padding: 20px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -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 * {
                -webkit-box-flex: 1;
                    -ms-flex: 1;
                        flex: 1;
                width: 100%;
                text-overflow: ellipsis;
                overflow: hidden;
                white-space: nowrap;
            }
.mx_UserMenu_contextMenu .mx_UserMenu_contextMenu_header .mx_UserMenu_contextMenu_name .mx_UserMenu_contextMenu_displayName {
                font-weight: bold;
                font-size: 1.5rem;
                line-height: 2.0rem;
            }
.mx_UserMenu_contextMenu .mx_UserMenu_contextMenu_header .mx_UserMenu_contextMenu_name .mx_UserMenu_contextMenu_userId {
                font-size: 1.5rem;
                line-height: 2.4rem;
            }
.mx_UserMenu_contextMenu .mx_UserMenu_contextMenu_header .mx_UserMenu_contextMenu_themeButton {
            min-width: 32px;
            max-width: 32px;
            width: 32px;
            height: 32px;
            margin-left: 8px;
            border-radius: 32px;
            background-color: #e3e8f0;
            cursor: default;
            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_UserMenu_contextMenu .mx_UserMenu_contextMenu_header.mx_UserMenu_contextMenu_guestPrompts, .mx_UserMenu_contextMenu .mx_UserMenu_contextMenu_header.mx_UserMenu_contextMenu_hostingLink {
            padding-top: 0;
        }
.mx_UserMenu_contextMenu .mx_UserMenu_contextMenu_header.mx_UserMenu_contextMenu_guestPrompts {
            display: inline-block;
        }
.mx_UserMenu_contextMenu .mx_UserMenu_contextMenu_header.mx_UserMenu_contextMenu_guestPrompts > span {
                font-weight: 600;
                display: block;
            }
.mx_UserMenu_contextMenu .mx_UserMenu_contextMenu_header.mx_UserMenu_contextMenu_guestPrompts > span + span {
                    margin-top: 8px;
                }
.mx_UserMenu_contextMenu .mx_UserMenu_contextMenu_header.mx_UserMenu_contextMenu_guestPrompts .mx_AccessibleButton_kind_link {
                font-weight: normal;
                font-size: inherit;
                padding: 0;
            }
.mx_UserMenu_contextMenu .mx_IconizedContextMenu_icon {
        width: 16px;
        height: 16px;
        display: block;
    }
.mx_UserMenu_contextMenu .mx_IconizedContextMenu_icon::before {
            content: "";
            width: 16px;
            height: 16px;
            display: block;
            -webkit-mask-position: center;
                    mask-position: center;
            -webkit-mask-size: contain;
                    mask-size: contain;
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            background: #f0f0f1;
        }
.mx_UserMenu_contextMenu .mx_UserMenu_iconHome::before {
        -webkit-mask-image: url(../../img/element-icons/roomlist/home.1b4edd5.svg);
                mask-image: url(../../img/element-icons/roomlist/home.1b4edd5.svg);
    }
.mx_UserMenu_contextMenu .mx_UserMenu_iconDnd::before {
        -webkit-mask-image: url(../../img/element-icons/roomlist/dnd.1d2f3d1.svg);
                mask-image: url(../../img/element-icons/roomlist/dnd.1d2f3d1.svg);
    }
.mx_UserMenu_contextMenu .mx_UserMenu_iconDndOff::before {
        -webkit-mask-image: url(../../img/element-icons/roomlist/dnd-cross.d0ad706.svg);
                mask-image: url(../../img/element-icons/roomlist/dnd-cross.d0ad706.svg);
    }
.mx_UserMenu_contextMenu .mx_UserMenu_iconHosting::before {
        -webkit-mask-image: url(../../img/element-icons/brands/element.182040d.svg);
                mask-image: url(../../img/element-icons/brands/element.182040d.svg);
    }
.mx_UserMenu_contextMenu .mx_UserMenu_iconBell::before {
        -webkit-mask-image: url(../../img/element-icons/notifications.d298b39.svg);
                mask-image: url(../../img/element-icons/notifications.d298b39.svg);
    }
.mx_UserMenu_contextMenu .mx_UserMenu_iconLock::before {
        -webkit-mask-image: url(../../img/element-icons/security.66f2fa6.svg);
                mask-image: url(../../img/element-icons/security.66f2fa6.svg);
    }
.mx_UserMenu_contextMenu .mx_UserMenu_iconSettings::before {
        -webkit-mask-image: url(../../img/element-icons/settings.6b381af.svg);
                mask-image: url(../../img/element-icons/settings.6b381af.svg);
    }
.mx_UserMenu_contextMenu .mx_UserMenu_iconHelp::before {
        -webkit-mask-image: url(../../img/element-icons/help.e30d95b.svg);
                mask-image: url(../../img/element-icons/help.e30d95b.svg);
    }
.mx_UserMenu_contextMenu .mx_UserMenu_iconHelpHub::before {
        -webkit-mask-image: url(../../img/beeper/question-mark16.7154382.svg);
                mask-image: url(../../img/beeper/question-mark16.7154382.svg);
    }
.mx_UserMenu_contextMenu .mx_UserMenu_iconGroup::before {
        -webkit-mask-image: url(../../img/beeper/group16.35e826f.svg);
                mask-image: url(../../img/beeper/group16.35e826f.svg);
    }
.mx_UserMenu_contextMenu .mx_UserMenu_iconDM::before {
        -webkit-mask-image: url(../../img/beeper/avatar16.f4fd2ae.svg);
                mask-image: url(../../img/beeper/avatar16.f4fd2ae.svg);
    }
.mx_UserMenu_contextMenu .mx_UserMenu_iconUpdate::before {
        -webkit-mask-image: url(../../img/beeper/down-arrow16.cc2e317.svg);
                mask-image: url(../../img/beeper/down-arrow16.cc2e317.svg);
    }
.mx_UserMenu_contextMenu .mx_UserMenu_iconRead::before {
        -webkit-mask-image: url(../../img/element-icons/read.51cfa6c.svg);
                mask-image: url(../../img/element-icons/read.51cfa6c.svg);
    }
.mx_UserMenu_contextMenu .mx_UserMenu_iconJoin::before {
        -webkit-mask-image: url(../../img/element-icons/roomlist/explore.1523e65.svg);
                mask-image: url(../../img/element-icons/roomlist/explore.1523e65.svg);
    }
.mx_UserMenu_contextMenu .mx_UserMenu_iconInvite::before {
        -webkit-mask-image: url(../../img/element-icons/view-community.0cad1a5.svg);
                mask-image: url(../../img/element-icons/view-community.0cad1a5.svg);
    }
.mx_UserMenu_contextMenu .mx_UserMenu_iconLink::before {
        -webkit-mask-image: url(../../img/element-icons/link.8f4b1fc.svg);
                mask-image: url(../../img/element-icons/link.8f4b1fc.svg);
    }
.mx_UserMenu_contextMenu .mx_UserMenu_iconMessage::before {
        -webkit-mask-image: url(../../img/element-icons/chat-bubbles.1167151.svg);
                mask-image: url(../../img/element-icons/chat-bubbles.1167151.svg);
    }
.mx_UserMenu_contextMenu .mx_UserMenu_iconSignOut::before {
        -webkit-mask-image: url(../../img/element-icons/leave.bb917e7.svg);
                mask-image: url(../../img/element-icons/leave.bb917e7.svg);
    }
.mx_UserMenu_CustomStatusSection {
    margin: 0 12px 8px;
}
.mx_UserMenu_CustomStatusSection .mx_UserMenu_CustomStatusSection_field {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
.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 #4958F5;
            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 {
            display: none;

            position: absolute;
            top: 50%;
            right: 0;
            -webkit-transform: translateY(-50%);
                    transform: translateY(-50%);

            width: 16px;
            height: 16px;
            margin-right: 8px;
            background-color: #E3E8F0;
            border-radius: 50%;
        }
.mx_UserMenu_CustomStatusSection .mx_UserMenu_CustomStatusSection_field > .mx_UserMenu_CustomStatusSection_clear::before {
                content: "";
                position: absolute;
                width: inherit;
                height: inherit;
                -webkit-mask-image: url(../../img/feather-customised/x.9662221.svg);
                        mask-image: url(../../img/feather-customised/x.9662221.svg);
                -webkit-mask-position: center;
                        mask-position: center;
                -webkit-mask-size: 12px;
                        mask-size: 12px;
                -webkit-mask-repeat: no-repeat;
                        mask-repeat: no-repeat;
                background-color: #737D8C;
            }
.mx_UserMenu_CustomStatusSection > p {
        font-size: 1.2rem;
        line-height: 1.5rem;
        color: #737D8C;
        margin: 4px 0;
    }
.mx_UserMenu_CustomStatusSection .mx_AccessibleButton_kind_primary_outline {
        display: block;
    }
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ViewSource_separator {
    clear: both;
    border-bottom: 1px solid #e5e5e5;
    padding-top: 0.7em;
    padding-bottom: 0.7em;
}
.mx_ViewSource_heading {
    font-size: 1.7rem;
    font-weight: 400;
    color: #f0f0f1;
    margin-top: 0.7em;
}
.mx_ViewSource pre {
    text-align: left;
    font-size: 1.2rem;
    padding: 0.5em 1em 0.5em 1em;
    word-wrap: break-word;
    white-space: pre-wrap;
}
.mx_ViewSource_details {
    margin-top: 0.8em;
}
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CompleteSecurity_header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    color: #fff;
}
.mx_CompleteSecurity_headerIcon {
    width: 24px;
    height: 24px;
    margin-right: 10px;
    position: relative;
}
.mx_CompleteSecurity_heroIcon {
    width: 128px;
    height: 128px;
    position: relative;
    margin: 0 auto;
}
.mx_CompleteSecurity_skip {
    -webkit-mask: url(../../img/feather-customised/cancel.23c2689.svg);
            mask: url(../../img/feather-customised/cancel.23c2689.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-size: cover;
            mask-size: cover;
    width: 18px;
    height: 18px;
    background-color: #9fa9ba;
    cursor: default;
    position: absolute;
    right: 24px;
}
.mx_CompleteSecurity_body {
    font-size: 1.5rem;
    border-radius: 20px;
}
.mx_CompleteSecurity_waiting {
    color: #8D97A5;
}
.mx_CompleteSecurity_actionRow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-top: 2.8rem;
}
.mx_CompleteSecurity_actionRow .mx_AccessibleButton {
        -webkit-margin-start: 18px;
                margin-inline-start: 18px;
    }
.mx_CompleteSecurity_actionRow .mx_AccessibleButton.warning {
            color: #FF5B55;
        }
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_Login_field {
  border-radius: 14px !important;
  border: 1.7px solid transparent !important;
  background-color: rgba(255, 255, 255, 0.04) !important;
}
.mx_Login_field input {
    border-radius: 12px !important;
    background-color: transparent !important;
  }
.mx_Login_field label {
    color: #717689 !important;
  }
.mx_Login_field:focus-within {
  background: rgba(255, 255, 255, 0.02) !important;
  border: 1.7px solid rgba(255, 255, 255, 0.08) !important;
}
.mx_Login_field:focus + label {
  background-color: red !important;
}
.mx_Login_submit {
    /* align images in buttons (eg spinners) */
    vertical-align: middle;
    border: 0px;
    border-radius: 8px;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Apple Color Emoji", "Twemoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif, "Noto Color Emoji", "Inter";
    font-size: 1.4rem;
    color: white;
    background-color: rgba(169, 63, 233, 1);
    width: auto;
    padding: 7px;
    padding-left: 1.5em;
    padding-right: 1.5em;
    cursor: default;
    display: inline-block;
    outline: none;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    text-align: center;
    background: linear-gradient(120deg, #A93FE9 12px, #4958F5 502px);
}
.mx_Login_submit:hover {
    cursor: default;
    -webkit-box-shadow: 0px 4px 16px rgba(133, 73, 238, 0.24), 0px 2px 12px rgba(130, 74, 239, 0.24);
            box-shadow: 0px 4px 16px rgba(133, 73, 238, 0.24), 0px 2px 12px rgba(130, 74, 239, 0.24);
}
.mx_Login_submit:disabled {
    opacity: 0.3;
    cursor: default;
}
.mx_Login_loader {
    display: inline;
    position: relative;
    top: 2px;
    left: 8px;
}
.mx_Login_loader .mx_Spinner {
    display: inline;
}
.mx_Login_loader .mx_Spinner img {
    width: 16px;
    height: 16px;
}
.mx_Login_error {
    color: #FF5B55;
    font-weight: bold;
    text-align: center;
    margin-top: 12px;
    margin-bottom: 12px;
}
.mx_Login_error.mx_Login_serverError {
    text-align: left;
    font-weight: normal;
}
.mx_Login_error.mx_Login_serverError.mx_Login_serverErrorNonFatal {
    color: #ff8d13;
}
.mx_Login_type_container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    color: #ffffff;
}
.mx_Login_type_container .mx_Field {
        margin: 0;
    }
.mx_Login_type_label {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
.mx_Login_underlinedServerName {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    border-bottom: 1px dashed #4958F5;
}
div.mx_AccessibleButton_kind_link.mx_Login_forgot {
    display: block;
    margin: 0 auto;
    font-size: inherit;
    padding: 0;
}
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;
}
.bp_ForgotPasswordSubmit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;

    width: 100%;
    margin: 24px 0;
}
.bp_Authentication {
    width: 100%;
    height: 100%;
    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;
    position: relative;
    overflow: scroll;
}
.bp_Authentication .content {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      text-align: center;
    }
.bp_Authentication .page_title {
        font-size: 32px;
        font-weight: 700;
        margin-bottom: 18px;
        color: #fff;
    }
.bp_Authentication .page_description {
        font-size: 20px;
        margin-bottom: 18px;
        color: #fff;
        opacity: .8;
        line-height: 30px;
    }
.bp_Authentication .text_input input {
          color: #fff;
      }
.bp_Authentication .text_input label {
          color: #fff;
      }
.bp_Authentication .mx_Dropdown {
      color: #fff;
    }
.bp_Authentication .mx_Dropdown_menu {
      background-color: transparent;
    }
.bp_Authentication .mx_Dropdown_arrow {
      background: #fff;
    }
/*
  EVERYTHING BENEATH HERE WAS DONE IN SPRING OF 2020 AND THUS IS OLD 
*/
.bp-reg {
    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-app-region: no-drag;
}
.bp-reg .bp-reg-input-wrapper {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 1;
            -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;
        border-bottom: 1px dotted #585e74;
        width: 330px;
        padding: 0px 10px;
    }
.bp-reg .bp-reg-input-wrapper input {
            -webkit-box-flex: 1;
                -ms-flex: 1;
                    flex: 1;
            border: none;
            font-size: 28px;
            font-weight: 700;
            color: #fff;
            text-align: center;
        }
.bp-reg .bp-reg-input-wrapper ::-webkit-input-placeholder {
            /* Chrome, Firefox, Opera, Safari 10.1+ */
            color: #585e74;
            opacity: 1; /* Firefox */
            font-weight: 400;
        }
.bp-reg .bp-reg-input-wrapper ::-moz-placeholder {
            /* Chrome, Firefox, Opera, Safari 10.1+ */
            color: #585e74;
            opacity: 1; /* Firefox */
            font-weight: 400;
        }
.bp-reg .bp-reg-input-wrapper :-ms-input-placeholder {
            /* Chrome, Firefox, Opera, Safari 10.1+ */
            color: #585e74;
            opacity: 1; /* Firefox */
            font-weight: 400;
        }
.bp-reg .bp-reg-input-wrapper ::-ms-input-placeholder {
            /* Chrome, Firefox, Opera, Safari 10.1+ */
            color: #585e74;
            opacity: 1; /* Firefox */
            font-weight: 400;
        }
.bp-reg .bp-reg-input-wrapper ::placeholder {
            /* Chrome, Firefox, Opera, Safari 10.1+ */
            color: #585e74;
            opacity: 1; /* Firefox */
            font-weight: 400;
        }
.bp-reg .bp-reg-input-wrapper :-ms-input-placeholder {
            /* Internet Explorer 10-11 */
            color: #585e74;
            font-weight: 400;
        }
.bp-reg .bp-reg-input-wrapper ::-ms-input-placeholder {
            /* Microsoft Edge */
            color: #585e74;
            font-weight: 400;
        }
.bp-reg .bp-reg-input-wrapper .bp-reg-hide-pw {
            cursor: default;
            background-image: url(../../img/icons-eye-closed.043235b.svg);
            background-repeat: no-repeat;
            width: 16px;
            height: 16px;
            background-position: center;
            padding: 6px;
            margin-top: 5px;
        }
.bp-reg .bp-reg-input-wrapper .bp-reg-hide-pw.hidden {
                background-image: url(../../img/icons-eye-open.cb43e62.svg);
            }
.bp-reg label {
        color: #d0d1d8;
        opacity: 0.9;
        height: 70px;
        margin-top: 8px;
        font-size: 14px;
        width: 320px;
        text-align: center;

        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        -o-user-select: none;
        user-select: none;
    }
.bp-reg label.error {
            color: #ff6161;
        }
.bp-reg-title {
    color: #fff;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}
.bp-dots-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-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 75px;
    height: 25px;
    border-radius: 12.5px;
    margin-bottom: 48px;
}
.bp-dots-wrapper span {
        background-color: #424961;
        border-radius: 12px;
    }
.bp-dots-wrapper span.active:after {
                width: 16px;
                border-radius: 12px;
                background: linear-gradient(180.97deg, #ff9b71 -10.54%, #db48f3 143.48%);
            }
.bp-dots-wrapper span:after {
            content: '';
            display: block;
            -webkit-box-flex: 1;
                -ms-flex: 1;
                    flex: 1;
            -ms-flex-item-align: center;
                align-self: center;
            width: 8px;
            height: 8px;
            background-color: #424961;
            border-radius: 100%;
            -webkit-transition: all 0.3s ease-in-out;
            transition: all 0.3s ease-in-out;
        }
.bp-reg-but {
    font-size: 16px;
    font-weight: 700;
    margin-top: 12px;
}
.bp-reg-continue {
    font-size: 14px;
    font-weight: 400;
    margin-top: 12px;

    background: linear-gradient(120deg, #A93FE9 12px, #4958F5 502px);
}
.bp-reg-continue:hover {
        -webkit-box-shadow: 0px 4px 16px rgba(133, 73, 238, 0.24), 0px 2px 12px rgba(130, 74, 239, 0.24);
                box-shadow: 0px 4px 16px rgba(133, 73, 238, 0.24), 0px 2px 12px rgba(130, 74, 239, 0.24);
    }
.bp-reg-continue:disabled {
        -webkit-box-shadow: none;
                box-shadow: none;
        background: #d0d1d8;
        cursor: default;
        color: #717689;
    }
.bp-security-info {
    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;
}
.bp-security-info .bp-security-icon {
        width: 54px;
        height: 62px;
        background: url(../../img/lock-and-key.7cbe98b.svg);
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat;
        -ms-flex-item-align: center;
            align-self: center;
    }
.bp-security-info h1 {
        color: #d0d1d8;
        width: 208px;
        font-weight: 800;
        font-size: 32px;
        line-height: 110%;
        text-align: center;
        margin-top: 16px;
        margin-bottom: 12px;
        -ms-flex-item-align: center;
            align-self: center;
    }
.bp-security-info p {
        font-weight: normal;
        font-size: 15px;
        line-height: 165%;
        text-align: center;
        color: #d0d1d8;
        margin-bottom: 20px;
    }
/*
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MediaBody.mx_AudioPlayer_container {
    padding: 16px 12px 0 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: #f0f0f1;
                font-size: 1.5rem;
                line-height: 1.5rem;
                text-overflow: ellipsis;
                overflow: hidden;
                padding-bottom: 4px;
            }
.mx_MediaBody.mx_AudioPlayer_container .mx_AudioPlayer_primaryContainer .mx_AudioPlayer_mediaInfo .mx_AudioPlayer_byline {
                font-size: 1.2rem;
                line-height: 1.2rem;
            }
.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 {
            width: 4.2rem;
            min-width: 4.2rem;
            padding-left: 4px;
            text-align: right;
        }
/*
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_PlayPauseButton {
    position: relative;
    width: 32px;
    height: 32px;
    min-width: 32px;
    min-height: 32px;
    border-radius: 32px;
    background-color: #F4F6FA;
}
.mx_PlayPauseButton::before {
        content: '';
        position: absolute;
        background-color: #737D8C;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-size: contain;
                mask-size: contain;
    }
.mx_PlayPauseButton.mx_PlayPauseButton_disabled::before {
        opacity: 0.5;
    }
.mx_PlayPauseButton.mx_PlayPauseButton_play::before {
        width: 13px;
        height: 16px;
        top: 8px;
        left: 12px;
        -webkit-mask-image: url(../../img/element-icons/play.a72552b.svg);
                mask-image: url(../../img/element-icons/play.a72552b.svg);
    }
.mx_PlayPauseButton.mx_PlayPauseButton_pause::before {
        width: 10px;
        height: 12px;
        top: 10px;
        left: 11px;
        -webkit-mask-image: url(../../img/element-icons/pause.c4c0886.svg);
                mask-image: url(../../img/element-icons/pause.c4c0886.svg);
    }
/*
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MediaBody.mx_VoiceMessagePrimaryContainer {
    padding-right: 11px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;

    contain: content;
}
.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_Waveform .mx_Waveform_bar {
            background-color: #c1c6cd;
            height: 100%;
            /* Variable set by a JS component */
            -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 {
                -webkit-transition: background-color 250ms ease;
                transition: background-color 250ms ease;
                background-color: #737D8C;
            }
.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_Clock {
        width: 4.2rem;
        padding-right: 6px;
        padding-left: 8px;
    }
.mx_MediaBody.mx_VoiceMessagePrimaryContainer.mx_VoiceMessagePrimaryContainer_noWaveform {
        max-width: 162px;
    }
.mx_RecordingPlayback_timelineLayoutMiddle {
    position: relative;
}
/*
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_RecordingPlayback_timelineLayoutMiddle .mx_SeekBar {
    background: none;
    height: 30px;
    left: 0;
    position: absolute;
    top: -2px;
    opacity: 0;
}
.mx_SeekBar {
    background: #c1c6cd;
    height: 1px;
    position: relative;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    width: 100%;
    outline: none;
    cursor: default;
}
.mx_SeekBar::-webkit-slider-thumb {
        -webkit-appearance: none;
                appearance: none;
        width: 8px;
        height: 8px;
        border-radius: 8px;
        background-color: #8D97A5;
        cursor: default;
    }
.mx_SeekBar::-moz-range-thumb {
        width: 8px;
        height: 8px;
        border-radius: 8px;
        background-color: #8D97A5;
        cursor: default;
        border: none;
    }
.mx_SeekBar::before {
        background-color: none;
        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: #8D97A5;
        height: 1px;
    }
.mx_SeekBar:disabled {
        opacity: 0.5;
    }
.mx_SeekBar::after {
        bottom: -6px;
        content: "";
        left: 0;
        position: absolute;
        right: 0;
        top: -6px;
    }
/*
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_Waveform {
    position: relative;
    height: 30px;
    top: 1px;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;

    overflow: hidden;
}
.mx_Waveform .mx_Waveform_bar {
        width: 0;
        border: 1px solid transparent;
        border-radius: 2px;
        min-height: 0;
        max-height: 100%;
        margin-left: 1px;
        margin-right: 1px;
    }
/*
Copyright 2019 New Vector Ltd
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AuthBody {
    width: 500px;
    font-size: 1.2rem;
    color: rgba(113, 118, 137, 1);
    background-color: #32384E;
    border-radius: 20px;
    padding: 40px 60px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(0.01%, rgba(19, 27, 58, 0)), to(rgba(19, 27, 58, 0.4))), #32384E;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(19, 27, 58, 0) 0.01%, rgba(19, 27, 58, 0.4) 100%), #32384E;
}
.mx_AuthBody h2 {
        font-size: 2.4rem;
        font-weight: 600;
        margin-top: 8px;
        color: #ffffff;
    }
.mx_AuthBody h3 {
        font-size: 1.4rem;
        font-weight: 600;
        color: #ffffff;
    }
.mx_AuthBody h3.mx_AuthBody_centered {
        text-align: center;
    }
.mx_AuthBody a:link, .mx_AuthBody a:hover, .mx_AuthBody a:visited {
        color: #4958F5;
        text-decoration: none;
    }
.mx_AuthBody input[type=text], .mx_AuthBody input[type=password] {
        color: #ffffff;
    }
.mx_AuthBody .mx_Field input, .mx_AuthBody .mx_Field select {
        color: #ffffff;
        background-color: rgba(255, 255, 255, 0.05);
    }
.mx_AuthBody .mx_Field label {
        color: #ffffff;
    }
.mx_AuthBody .mx_Field input:not(:-moz-placeholder-shown) + label, .mx_AuthBody .mx_Field textarea:not(:-moz-placeholder-shown) + label {
        border-radius: 8px;
    }
.mx_AuthBody .mx_Field input:not(:-ms-input-placeholder) + label, .mx_AuthBody .mx_Field textarea:not(:-ms-input-placeholder) + label {
        border-radius: 8px;
    }
.mx_AuthBody .mx_Field_labelAlwaysTopLeft label, .mx_AuthBody .mx_Field select + label, .mx_AuthBody .mx_Field input:focus + label, .mx_AuthBody .mx_Field input:not(:placeholder-shown) + label, .mx_AuthBody .mx_Field textarea:focus + label, .mx_AuthBody .mx_Field textarea:not(:placeholder-shown) + label {
        border-radius: 8px;
    }
.mx_AuthBody input.error {
        color: #FF5B55;
    }
.mx_AuthBody .mx_Field input {
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
    }
.mx_AuthBody .mx_Field_select::before {
        background-color: #ffffff;
    }
.mx_AuthBody .mx_Dropdown {
        color: #ffffff;
    }
.mx_AuthBody .mx_Dropdown_arrow {
        background: #ffffff;
    }
.mx_AuthBody .mx_Dropdown_menu {
        background-color: hsla(216, 21%, 14%, 1);
    }
.mx_AuthBody .mx_Dropdown_menu .mx_Dropdown_option_highlight {
            background-color: rgba(255, 255, 255, 0.05);
        }
.mx_AuthBody_fieldRow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 10px;
}
.mx_AuthBody_fieldRow > .mx_Field {
  margin: 0 5px;
}
.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 {
      margin-top: 16px;
      font-size: 1.5rem;
      line-height: 2.4rem;
  }
.mx_AuthBody_paddedFooter .mx_AuthBody_paddedFooter_title .mx_InlineSpinner img {
          vertical-align: sub;
          margin-right: 5px;
      }
.mx_AuthBody_paddedFooter .mx_AuthBody_paddedFooter_subtitle {
      margin-top: 8px;
      font-size: 1.0rem;
      line-height: 1.4rem;
  }
.mx_AuthBody_changeFlow {
  display: block;
  text-align: center;
  width: 100%;
}
.mx_AuthBody_changeFlow > a {
      font-weight: 600;
  }
.mx_SSOButtons + .mx_AuthBody_changeFlow {
  margin-top: 24px;
}
.mx_AuthBody_spinner {
  margin: 1em 0;
}
@media only screen and (max-width: 480px) {
  .mx_AuthBody {
      border-radius: 4px;
      width: auto;
      max-width: 500px;
      padding: 10px;
  }
}
/*
Copyright 2017 OpenMarket Ltd
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AuthButtons {
    min-height: 24px;
    height: unset !important;
    padding-top: 13px !important;
    padding-bottom: 14px !important;
    -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
            order: 4;
}
.mx_AuthButtons_loginButton_wrapper {
    text-align: center;
    width: 100%;
}
.mx_AuthButtons_loginButton, .mx_AuthButtons_registerButton {
    margin-top: 3px;
    height: 40px;
    border: 0px;
    border-radius: 40px;
    margin-left: 4px;
    margin-right: 4px;
    min-width: 80px;

    background-color: #4958F5;
    color: hsla(216, 21%, 14%, 1);

    cursor: default;

    font-size: 1.5rem;
    padding: 0 11px;
    word-break: break-word;
}
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AuthFooter {
    -webkit-app-region: no-drag;
    text-align: center;
    width: 100%;
    font-size: 1.4rem;
    opacity: 0.72;
    padding: 20px 0;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.8)));
    background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
}
.mx_AuthFooter a:link, .mx_AuthFooter a:hover, .mx_AuthFooter a:visited {
    color: #202127;
    margin: 0 22px;
}
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AuthHeader {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 206px;
    padding: 25px 25px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}
@media only screen and (max-width: 480px) {
    .mx_AuthHeader {
        display: none;
    }
}
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AuthHeaderLogo {
    margin-top: 15px;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    padding: 0 25px;
}
.mx_AuthHeaderLogo img {
    width: 100%;
}
@media only screen and (max-width: 480px) {
    .mx_AuthHeaderLogo {
        display: none;
    }
}
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AuthPage {
    -webkit-user-select: none;
    -webkit-app-region: drag;
    width: 100%;
    min-height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    background-color: #131B3A;
}
.mx_AuthPage .mx_CompleteSecurity_body .mx_VerificationPanel_QRPhase_startOptions .mx_VerificationPanel_QRPhase_startOption {
        background-color: rgba(0, 0, 0, 0.1);
    }
.mx_AuthPage_modal {
    -webkit-app-region: no-drag;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-radius: 4px;
}
@media only screen and (max-width: 480px) {
    .mx_AuthPage_modal {
        margin-top: 0;
    }
}
.bp_BeeperServerPicker {
    -webkit-app-region: no-drag;
    position: absolute;
    left: 20px;
    bottom: 20px;
    opacity: 0.15;
    min-width: 300px;
}
.bp_BeeperServerPicker:hover {
        opacity: 0.8;
    }
.bp_BeeperServerPicker--opaque {
        opacity: 0.8;
    }
.bp_BeeperServerPicker--opaque:hover {
            opacity: 1;
        }
.bp_BeeperServerPicker .bp_Selector {
        -webkit-app-region: no-drag;
        position: absolute;
        left: 0;
        bottom: 50px;
        padding: 4px;
        padding-bottom: 0;
        background: #343c52;
        border-radius: 12px;
    }
.bp_BeeperServerPicker .bp_SelectorItem {
        -webkit-app-region: no-drag;
        padding: 6px 12px;
        border-radius: 8px;
        margin-bottom: 4px;
        color: #fff;
        cursor: default;
    }
.bp_BeeperServerPicker .bp_SelectorItem:hover {
            background: #ffffff20;
        }
.bp_BeeperServerPicker .bp_SelectorToggle {
        -webkit-app-region: no-drag;
        background: #343c52;
        border-radius: 12px;
        height: 10px;
        padding: 18px;
        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;
        color: white;
        cursor: default;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
    }
/*
Copyright 2019 New Vector Ltd
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CompleteSecurityBody {
    width: 600px;
    color: #ffffff;
    background-color: hsla(216, 21%, 14%, 1);
    border-radius: 4px;
    padding: 20px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}
.mx_CompleteSecurityBody h2 {
        font-size: 2.4rem;
        font-weight: 600;
        margin-top: 0;
    }
.mx_CompleteSecurityBody h3 {
        font-size: 1.4rem;
        font-weight: 600;
    }
.mx_CompleteSecurityBody a:link, .mx_CompleteSecurityBody a:hover, .mx_CompleteSecurityBody a:visited {
        color: #4958F5;
        text-decoration: none;
    }
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CountryDropdown .mx_Dropdown_input .mx_Dropdown_option {
    padding: 0 3px;
}
.mx_CountryDropdown .mx_Dropdown_arrow {
    padding-right: 3px;
}
.mx_CountryDropdown_shortOption {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: 100%;
}
.mx_CountryDropdown_option {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
/*
Copyright 2017 Vector Creations Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_InteractiveAuthEntryComponents_emailWrapper {
    padding-right: 100px;
    position: relative;
    margin-top: 32px;
    margin-bottom: 32px;
}
.mx_InteractiveAuthEntryComponents_emailWrapper::before, .mx_InteractiveAuthEntryComponents_emailWrapper::after {
        position: absolute;
        width: 116px;
        height: 116px;
        content: "";
        right: -10px;
    }
.mx_InteractiveAuthEntryComponents_emailWrapper::before {
        background-color: rgba(244, 246, 250, 0.91);
        border-radius: 50%;
        top: -20px;
    }
.mx_InteractiveAuthEntryComponents_emailWrapper::after {
        background-image: url(../../img/element-icons/email-prompt.1d04dfe.svg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        top: -25px;
    }
.mx_InteractiveAuthEntryComponents_msisdnWrapper {
    text-align: center;
}
.mx_InteractiveAuthEntryComponents_msisdnEntry {
    font-size: 200%;
    font-weight: bold;
    border: 1px solid rgba(249, 248, 248, 0.2);
    border-radius: 3px;
    width: 6em;
}
.mx_InteractiveAuthEntryComponents_msisdnEntry:focus {
    border: 1px solid #4958F5;
}
.mx_InteractiveAuthEntryComponents_msisdnSubmit {
    margin-top: 4px;
    margin-bottom: 5px;
}
.mx_InteractiveAuthEntryComponents_termsSubmit {
    margin-top: 20px;
    margin-bottom: 5px;
    display: block;
    width: 100%;
}
.mx_InteractiveAuthEntryComponents_msisdnSubmit:disabled {
    background-color: #c8c8cd;
    cursor: default;
}
.mx_InteractiveAuthEntryComponents_termsSubmit:disabled {
    background-color: #92caad;
    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;
    }
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AuthBody_language {
    width: 100%;
}
.mx_AuthBody_language .mx_Dropdown_input {
    border: none;
    font-size: 1.4rem;
    font-weight: 600;
    color: #4e5054;
    width: auto;
}
.mx_AuthBody_language .mx_Dropdown_arrow {
    background: #4e5054;
}
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
progress.mx_PassphraseField_progress {
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    width: 100%;
    border: 0;
    height: 4px;
    position: absolute;
    top: -12px;

    border-radius: "2px";
}
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: #FF5B55;
}
progress.mx_PassphraseField_progress::-moz-progress-bar {
        background-color: #FF5B55;
    }
progress.mx_PassphraseField_progress::-webkit-progress-value {
        background-color: #FF5B55;
    }
progress.mx_PassphraseField_progress[value="2"], progress.mx_PassphraseField_progress[value="3"] {
        color: #8544d6;
    }
progress.mx_PassphraseField_progress[value="2"]::-moz-progress-bar, progress.mx_PassphraseField_progress[value="3"]::-moz-progress-bar {
        background-color: #8544d6;
    }
progress.mx_PassphraseField_progress[value="2"]::-webkit-progress-value, progress.mx_PassphraseField_progress[value="3"]::-webkit-progress-value {
        background-color: #8544d6;
    }
progress.mx_PassphraseField_progress[value="4"] {
        color: #4958F5;
    }
progress.mx_PassphraseField_progress[value="4"]::-moz-progress-bar {
        background-color: #4958F5;
    }
progress.mx_PassphraseField_progress[value="4"]::-webkit-progress-value {
        background-color: #4958F5;
    }
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.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 {
    width: 160px;
    margin-bottom: 10px;
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_BaseAvatar {
    position: relative;
    display: inline-block;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    z-index: 5;
}
.mx_BaseAvatar.mx_RoomAvatar_isSpaceRoom.mx_BaseAvatar_image, .mx_BaseAvatar.mx_RoomAvatar_isSpaceRoom .mx_BaseAvatar_image {
            border-radius: 8px;
        }
.mx_BaseAvatar_initial {
    position: absolute;
    left: 0;
    color: #131B3A;
    mix-blend-mode: color-burn;
    text-align: center;
    speak: none;
    pointer-events: none;
    font-weight: normal;
    z-index: 20;
    opacity: .4;
}
.mx_BaseAvatar_initial.mx_BaseAvatar_initial--colourful {
    color: hsl(#131B3A, 100%, 32%);
    color: hsl(var(--avatarHue, #131B3A), 100%, 32%);
    mix-blend-mode: revert;
    opacity: 1;
}
.mx_BaseAvatar_image {
    -o-object-fit: cover;
       object-fit: cover;
    border-radius: 50%;
    vertical-align: top;
    background-color: hsla(216, 21%, 14%, 1);
}
.bp_Avatar {
    color: #131B3A;
    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;
}
.bp_Avatar_bg--dynamic {
    background: -webkit-gradient(
        linear,
        left top, left bottom,
        from(hsl(#131B3A, 100%, 80%)),
        to(hsl(#131B3A, 100%, 56%)));
    background: linear-gradient(
        hsl(#131B3A, 100%, 80%),
        hsl(#131B3A, 100%, 56%));
    background: -webkit-gradient(
        linear,
        left top, left bottom,
        from(hsl(var(--avatarHue, #131B3A), 100%, 80%)),
        to(hsl(var(--avatarHue, #131B3A), 100%, 56%)));
    background: linear-gradient(
        hsl(var(--avatarHue, #131B3A), 100%, 80%),
        hsl(var(--avatarHue, #131B3A), 100%, 56%));
}
.bp_Avatar_bg_1 {
      background-color: #F0DAFB;
  }
.bp_Avatar_bg_2 {
      background-color: #DBDEFD;
  }
.bp_Avatar_bg_3 {
      background-color: #FFD7C6;
  }
.bp_Avatar_bg_4 {
      background-color: #FADFF5;
  }
.bp_noteToSelf {
  border-radius: 100px;
  background-color: rgba(118, 118, 128, 0.12);
  background-color: var(--search-input-bg-experimental);
}
.bp_noteToSelf .bp_noteToSelf_icon {
      -webkit-filter: invert(1);
              filter: invert(1);
  }
.mx_BaseAvatar_initial {
    height: 100%;
}
.mx_BaseAvatar_initial .bp_icon {
        height: 100%;
    }
.mx_BaseAvatar_initial .bp_icon div {
        height: 100%;
        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_BaseAvatar_initial .bp_icon div .bp_Icon {
            margin-top: 0;
        }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_DecoratedRoomAvatar, .mx_ExtraTile {
    position: relative;
    contain: content;
}
.mx_DecoratedRoomAvatar .mx_DecoratedRoomAvatar_icon, .mx_ExtraTile .mx_DecoratedRoomAvatar_icon {
        position: absolute;
        bottom: -2px;
        right: -2px;
        margin: 7px;
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }
.mx_DecoratedRoomAvatar .mx_DecoratedRoomAvatar_icon::before, .mx_ExtraTile .mx_DecoratedRoomAvatar_icon::before {
        content: '';
        width: 8px;
        height: 8px;
        right: 0;
        position: absolute;
        border-radius: 8px;
    }
.mx_DecoratedRoomAvatar .mx_DecoratedRoomAvatar_icon_globe::before, .mx_ExtraTile .mx_DecoratedRoomAvatar_icon_globe::before {
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: contain;
                mask-size: contain;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        background: #737D8C;
        -webkit-mask-image: url(../../img/globe.8201f08.svg);
                mask-image: url(../../img/globe.8201f08.svg);
    }
.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: #4958F5;
    }
.mx_DecoratedRoomAvatar .mx_DecoratedRoomAvatar_icon_away::before, .mx_ExtraTile .mx_DecoratedRoomAvatar_icon_away::before {
        background-color: orange;
    }
.mx_DecoratedRoomAvatar .mx_NotificationBadge, .mx_DecoratedRoomAvatar .mx_RoomTile_badgeContainer, .mx_ExtraTile .mx_NotificationBadge, .mx_ExtraTile .mx_RoomTile_badgeContainer {
        position: absolute;
        top: 0;
        right: 0;
        height: 18px;
        width: 18px;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_WidgetAvatar {
    border-radius: 4px;
}
/*
Copyright 2020 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CallContextMenu_item {
    width: 205px;
    height: 40px;
    padding-left: 16px;
    line-height: 40px;
    vertical-align: center;
}
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_IconizedContextMenu {
    min-width: 146px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
}
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList > * {
            padding-left: 20px;
            padding-right: 20px;
        }
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList:nth-child(n + 2), .mx_IconizedContextMenu .mx_IconizedContextMenu_optionList .mx_IconizedContextMenu_optionList_notFirst {
        }
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList:nth-child(n + 2)::before, .mx_IconizedContextMenu .mx_IconizedContextMenu_optionList .mx_IconizedContextMenu_optionList_notFirst::before {
                border-top: 1px solid #f0f0f1;
                opacity: 0.1;
                content: '';
                width: 100%;
                position: absolute;
                left: 0;
            }
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList:first-child .mx_AccessibleButton:first-child {
            border-radius: 8px 8px 0 0;
        }
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList:last-child .mx_AccessibleButton:last-child {
            border-radius: 0 0 8px 8px;
        }
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList:first-child:last-child .mx_AccessibleButton:first-child:last-child {
            border-radius: 8px;
        }
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList .mx_AccessibleButton {
            padding-top: 12px;
            padding-bottom: 12px;
            text-decoration: none;
            color: #f0f0f1;
            font-size: 1.5rem;
            line-height: 2.4rem;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
        }
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList .mx_AccessibleButton:hover {
                background-color: #25262d;
            }
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList .mx_AccessibleButton.mx_AccessibleButton_disabled {
                opacity: 0.5;
                cursor: not-allowed;
            }
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList .mx_AccessibleButton img, .mx_IconizedContextMenu .mx_IconizedContextMenu_optionList .mx_AccessibleButton .mx_IconizedContextMenu_icon {
                width: 16px;
                min-width: 16px;
                max-width: 16px;
            }
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList .mx_AccessibleButton span.mx_IconizedContextMenu_label {
                width: 100%;
                -webkit-box-flex: 1;
                    -ms-flex: 1;
                        flex: 1;
                text-overflow: ellipsis;
                overflow: hidden;
                white-space: nowrap;
            }
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList .mx_AccessibleButton span.mx_IconizedContextMenu_label--allow-overflow {
                    overflow: visible;
                }
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList .mx_AccessibleButton .mx_IconizedContextMenu_icon + .mx_IconizedContextMenu_label {
                padding-left: 14px;
            }
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList .mx_AccessibleButton .mx_BetaCard_betaPill {
                margin-left: 16px;
            }
.mx_IconizedContextMenu .mx_IconizedContextMenu_icon {
        position: relative;
        width: 16px;
        height: 16px;
    }
.mx_IconizedContextMenu .mx_IconizedContextMenu_icon::before {
            content: '';
            width: 16px;
            height: 16px;
            position: absolute;
            -webkit-mask-position: center;
                    mask-position: center;
            -webkit-mask-size: contain;
                    mask-size: contain;
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            background-color: #737D8C;
        }
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList_red .mx_AccessibleButton {
            color: #FF5B55 !important;
        }
.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList_red .mx_IconizedContextMenu_icon::before {
            background-color: #FF5B55;
        }
.mx_IconizedContextMenu .mx_IconizedContextMenu_option_red {
        color: #FF5B55 !important;
    }
.mx_IconizedContextMenu .mx_IconizedContextMenu_option_red .mx_IconizedContextMenu_icon::before {
            background-color: #FF5B55;
        }
.mx_IconizedContextMenu .mx_IconizedContextMenu_active.mx_AccessibleButton, .mx_IconizedContextMenu .mx_IconizedContextMenu_active .mx_AccessibleButton {
            color: #4958F5 !important;
        }
.mx_IconizedContextMenu .mx_IconizedContextMenu_active .mx_IconizedContextMenu_icon::before {
            background-color: #4958F5;
        }
.mx_IconizedContextMenu.mx_IconizedContextMenu_compact .mx_IconizedContextMenu_optionList > * {
            padding: 8px 16px 8px 11px;
        }
.mx_IconizedContextMenu .mx_IconizedContextMenu_checked, .mx_IconizedContextMenu .mx_IconizedContextMenu_unchecked {
        margin-left: 16px;
        margin-right: -5px;
    }
.mx_IconizedContextMenu .mx_IconizedContextMenu_checked::before {
        -webkit-mask-image: url(../../img/element-icons/roomlist/checkmark.a8c4d72.svg);
                mask-image: url(../../img/element-icons/roomlist/checkmark.a8c4d72.svg);
    }
.mx_IconizedContextMenu .mx_IconizedContextMenu_unchecked::before {
        content: unset !important;
    }
.mx_IconizedContextMenu .mx_IconizedContextMenu_sublabel {
        margin-left: 20px;
        color: #8D97A5;
    }
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2021 Michael Weimann <mail@michael-weimann.eu>

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MessageContextMenu .mx_IconizedContextMenu_icon {
        width: 16px;
        height: 16px;
        display: block;
    }
.mx_MessageContextMenu .mx_IconizedContextMenu_icon::before {
            content: '';
            width: 16px;
            height: 16px;
            display: block;
            -webkit-mask-position: center;
                    mask-position: center;
            -webkit-mask-size: contain;
                    mask-size: contain;
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            background: #f0f0f1;
        }
.mx_MessageContextMenu .mx_MessageContextMenu_iconCollapse::before {
        -webkit-mask-image: url(../../img/element-icons/message/chevron-up.90f4709.svg);
                mask-image: url(../../img/element-icons/message/chevron-up.90f4709.svg);
    }
.mx_MessageContextMenu .mx_MessageContextMenu_iconReport::before {
        -webkit-mask-image: url(../../img/element-icons/warning-badge.713e1ca.svg);
                mask-image: url(../../img/element-icons/warning-badge.713e1ca.svg);
    }
.mx_MessageContextMenu .mx_MessageContextMenu_iconLink::before {
        -webkit-mask-image: url(../../img/element-icons/link.8f4b1fc.svg);
                mask-image: url(../../img/element-icons/link.8f4b1fc.svg);
    }
.mx_MessageContextMenu .mx_MessageContextMenu_iconPermalink::before {
        -webkit-mask-image: url(../../img/element-icons/room/share.54dc3fb.svg);
                mask-image: url(../../img/element-icons/room/share.54dc3fb.svg);
    }
.mx_MessageContextMenu .mx_MessageContextMenu_iconUnhidePreview::before {
        -webkit-mask-image: url(../../img/element-icons/settings/appearance.cdebd40.svg);
                mask-image: url(../../img/element-icons/settings/appearance.cdebd40.svg);
    }
.mx_MessageContextMenu .mx_MessageContextMenu_iconOpenInMapSite::before {
        -webkit-mask-image: url(../../img/external-link.a8d3e9b.svg);
                mask-image: url(../../img/external-link.a8d3e9b.svg);
    }
.mx_MessageContextMenu .mx_MessageContextMenu_iconEndPoll::before {
        -webkit-mask-image: url(../../img/element-icons/check-white.212e405.svg);
                mask-image: url(../../img/element-icons/check-white.212e405.svg);
    }
.mx_MessageContextMenu .mx_MessageContextMenu_iconForward::before {
        -webkit-mask-image: url(../../img/element-icons/message/fwd.d1f50ee.svg);
                mask-image: url(../../img/element-icons/message/fwd.d1f50ee.svg);
    }
.mx_MessageContextMenu .mx_MessageContextMenu_iconRedact::before {
        -webkit-mask-image: url(../../img/element-icons/trashcan.3b626db.svg);
                mask-image: url(../../img/element-icons/trashcan.3b626db.svg);
    }
.mx_MessageContextMenu .mx_MessageContextMenu_iconResend::before {
        -webkit-mask-image: url(../../img/element-icons/retry.6cd23ad.svg);
                mask-image: url(../../img/element-icons/retry.6cd23ad.svg);
    }
.mx_MessageContextMenu .mx_MessageContextMenu_iconSource::before {
        -webkit-mask-image: url(../../img/element-icons/room/format-bar/code.27444ba.svg);
                mask-image: url(../../img/element-icons/room/format-bar/code.27444ba.svg);
    }
.mx_MessageContextMenu .mx_MessageContextMenu_iconQuote::before {
        -webkit-mask-image: url(../../img/element-icons/room/format-bar/quote.560cd8f.svg);
                mask-image: url(../../img/element-icons/room/format-bar/quote.560cd8f.svg);
    }
.mx_MessageContextMenu .mx_MessageContextMenu_iconPin::before {
        -webkit-mask-image: url(../../img/element-icons/room/pin-upright.65783fb.svg);
                mask-image: url(../../img/element-icons/room/pin-upright.65783fb.svg);
    }
.mx_MessageContextMenu .mx_MessageContextMenu_iconUnpin::before {
        -webkit-mask-image: url(../../img/element-icons/room/pin.5d99673.svg);
                mask-image: url(../../img/element-icons/room/pin.5d99673.svg);
    }
.mx_MessageContextMenu .mx_MessageContextMenu_iconViewInRoom::before {
        -webkit-mask-image: url(../../img/element-icons/view-in-room.a7fa669.svg);
                mask-image: url(../../img/element-icons/view-in-room.a7fa669.svg);
    }
/*
Copyright 2018 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_TagTileContextMenu_item {
    padding: 8px;
    padding-right: 20px;
    cursor: default;
    white-space: nowrap;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    line-height: 1.6rem;
}
.mx_TagTileContextMenu_item::before {
    content: '';
    height: 15px;
    width: 15px;
    background-color: currentColor;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-size: contain;
            mask-size: contain;
    margin-right: 8px;
}
.mx_TagTileContextMenu_viewCommunity::before {
    -webkit-mask-image: url(../../img/element-icons/view-community.0cad1a5.svg);
            mask-image: url(../../img/element-icons/view-community.0cad1a5.svg);
}
.mx_TagTileContextMenu_moveUp::before {
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
    -webkit-mask-image: url(../../img/feather-customised/chevron-down.5278abe.svg);
            mask-image: url(../../img/feather-customised/chevron-down.5278abe.svg);
}
.mx_TagTileContextMenu_moveDown::before {
    -webkit-mask-image: url(../../img/feather-customised/chevron-down.5278abe.svg);
            mask-image: url(../../img/feather-customised/chevron-down.5278abe.svg);
}
.mx_TagTileContextMenu_hideCommunity::before {
    -webkit-mask-image: url(../../img/element-icons/hide.2b52315.svg);
            mask-image: url(../../img/element-icons/hide.2b52315.svg);
}
.mx_TagTileContextMenu_createSpace::before {
    -webkit-mask-image: url(../../img/element-icons/message/fwd.d1f50ee.svg);
            mask-image: url(../../img/element-icons/message/fwd.d1f50ee.svg);
}
.mx_TagTileContextMenu_separator {
    margin-top: 0;
    margin-bottom: 0;
    border-bottom-style: none;
    border-left-style: none;
    border-right-style: none;
    border-top-style: solid;
    border-top-width: 1px;
    border-color: #000000;
}
/*
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.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 0;
        -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:not(:first-child) {
            margin-top: 24px;
        }
.mx_AddExistingToSpace .mx_AddExistingToSpace_section > h3 {
            margin: 0;
            color: #737D8C;
            font-size: 1.2rem;
            font-weight: 600;
            line-height: 1.5rem;
        }
.mx_AddExistingToSpace .mx_AddExistingToSpace_section .mx_AccessibleButton_kind_link {
            font-size: 1.2rem;
            line-height: 1.5rem;
            margin-top: 8px;
            padding: 0;
        }
.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;
                    flex-grow: 1;
            font-size: 1.2rem;
            line-height: 1.5rem;
            color: #737D8C;
        }
.mx_AddExistingToSpace .mx_AddExistingToSpace_footer > span .mx_ProgressBar {
                height: 8px;
                width: 100%;

                border-radius: 8px;
            }
.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 {
                margin-top: 8px;
                font-size: 1.5rem;
                line-height: 2.4rem;
                color: #f0f0f1;
            }
.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 {
                font-weight: 600;
                font-size: 1.5rem;
                line-height: 1.8rem;
                color: #FF5B55;
            }
.mx_AddExistingToSpace .mx_AddExistingToSpace_footer .mx_AddExistingToSpace_error .mx_AddExistingToSpace_errorCaption {
                margin-top: 4px;
                font-size: 1.2rem;
                line-height: 1.5rem;
                color: #f0f0f1;
            }
.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 {
                content: '';
                position: absolute;
                background-color: #f0f0f1;
                -webkit-mask-repeat: no-repeat;
                        mask-repeat: no-repeat;
                -webkit-mask-position: center;
                        mask-position: center;
                -webkit-mask-size: contain;
                        mask-size: contain;
                -webkit-mask-image: url(../../img/element-icons/retry.6cd23ad.svg);
                        mask-image: url(../../img/element-icons/retry.6cd23ad.svg);
                width: 18px;
                height: 18px;
                left: 0;
            }
.mx_AddExistingToSpace .mx_AddExistingToSpace_footer .mx_AccessibleButton_kind_link {
            padding: 0;
        }
.mx_AddExistingToSpaceDialog {
    width: 480px;
    color: #f0f0f1;
    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-wrap: nowrap;
        flex-wrap: nowrap;
    min-height: 0;
    height: 80vh;
}
.mx_AddExistingToSpaceDialog .mx_AddExistingToSpace {
        display: contents;
    }
.mx_SubspaceSelector {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.mx_SubspaceSelector .mx_BaseAvatar_image {
        border-radius: 8px;
        margin: 0;
        vertical-align: unset;
    }
.mx_SubspaceSelector .mx_BaseAvatar {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        margin: auto 16px auto 5px;
        vertical-align: middle;
    }
.mx_SubspaceSelector > div > h1 {
            font-weight: 600;
            font-size: 1.8rem;
            line-height: 2.2rem;
            margin: 0;
        }
.mx_SubspaceSelector .mx_Dropdown_input {
        border: none;
    }
.mx_SubspaceSelector .mx_Dropdown_input > .mx_Dropdown_option {
            padding-left: 0;
            -webkit-box-flex: unset;
                -ms-flex: unset;
                    flex: unset;
            height: unset;
            color: #737D8C;
            font-size: 1.5rem;
            line-height: 2.4rem;
        }
.mx_SubspaceSelector .mx_Dropdown_input > .mx_Dropdown_option .mx_BaseAvatar {
                display: none;
            }
.mx_SubspaceSelector .mx_Dropdown_input .mx_Dropdown_menu .mx_SubspaceSelector_dropdownOptionActive {
                color: #4958F5;
                padding-right: 32px;
                position: relative;
            }
.mx_SubspaceSelector .mx_Dropdown_input .mx_Dropdown_menu .mx_SubspaceSelector_dropdownOptionActive::before {
                    content: '';
                    width: 20px;
                    height: 20px;
                    top: 8px;
                    right: 0;
                    position: absolute;
                    -webkit-mask-position: center;
                            mask-position: center;
                    -webkit-mask-size: contain;
                            mask-size: contain;
                    -webkit-mask-repeat: no-repeat;
                            mask-repeat: no-repeat;
                    background-color: #4958F5;
                    -webkit-mask-image: url(../../img/element-icons/roomlist/checkmark.a8c4d72.svg);
                            mask-image: url(../../img/element-icons/roomlist/checkmark.a8c4d72.svg);
                }
.mx_SubspaceSelector .mx_SubspaceSelector_onlySpace {
        color: #737D8C;
        font-size: 1.5rem;
        line-height: 2.4rem;
    }
.mx_AddExistingToSpace_entry {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 12px;
}
.mx_AddExistingToSpace_entry .mx_DecoratedRoomAvatar, .mx_AddExistingToSpace_entry .mx_BaseAvatar.mx_RoomAvatar_isSpaceRoom {
        margin-right: 12px;
    }
.mx_AddExistingToSpace_entry img.mx_RoomAvatar_isSpaceRoom, .mx_AddExistingToSpace_entry .mx_RoomAvatar_isSpaceRoom img {
        border-radius: 8px;
    }
.mx_AddExistingToSpace_entry .mx_AddExistingToSpace_entry_name {
        font-size: 1.5rem;
        line-height: 30px;
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        margin-right: 12px;
    }
.mx_AddExistingToSpace_entry .mx_Checkbox {
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }
/*
Copyright 2019 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AnalyticsModal table {
    margin: 10px 0px;
}
.mx_AnalyticsModal table .mx_AnalyticsModal_label {
        width: 400px;
    }
/*
Copyright 2016 Aviral Dasgupta

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ChangelogDialog_content {
    max-height: 300px;
    overflow: auto;
}
.mx_ChangelogDialog_li {
    padding: 0.2em;
}
/*
Copyright 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ChatCreateOrReuseDialog .mx_ChatCreateOrReuseDialog_tiles {
    margin-top: 24px;
}
.mx_ChatCreateOrReuseDialog .mx_Dialog_content {
    margin-bottom: 24px;

    /*
       To stop spinner that mx_ChatCreateOrReuseDialog_profile replaces from causing a
       height change
    */
    min-height: 100px;
}
.mx_ChatCreateOrReuseDialog .mx_RoomTile_badge {
    display: none;
}
.mx_ChatCreateOrReuseDialog_profile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.mx_ChatCreateOrReuseDialog_profile_name {
    padding: 14px;
}
/*
Copyright 2017 Vector Creations Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ConfirmUserActionDialog .mx_Dialog_content .mx_ConfirmUserActionDialog_user {
    min-height: 48px;
    margin-bottom: 24px;
}
.mx_ConfirmUserActionDialog_avatar {
    float: left;
    margin-right: 20px;
}
.mx_ConfirmUserActionDialog_name {
    padding-top: 2px;
    font-size: 1.8rem;
}
.mx_ConfirmUserActionDialog_userId {
    font-size: 1.3rem;
}
.mx_ConfirmUserActionDialog_reasonField {
    font-size: 1.4rem;
    color: #f0f0f1;
    background-color: hsla(216, 21%, 14%, 1);
}
/*
Copyright 2017 Michael Telatynski <7t3chguy@gmail.com>

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CreateRoomDialog_details {
    margin-top: 15px;
}
.mx_CreateRoomDialog_details .mx_CreateRoomDialog_details_summary {
        outline: none;
        list-style: none;
        font-weight: 600;
        cursor: default;
        color: #4958F5;
    }
.mx_CreateRoomDialog_details .mx_CreateRoomDialog_details_summary::-webkit-details-marker {
            display: 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 {
    text-align: left;
    padding-bottom: 12px;
}
.mx_CreateRoomDialog_input_container {
    padding-right: 20px;
}
.mx_CreateRoomDialog_input {
    font-size: 1.5rem;
    border-radius: 3px;
    border: 1px solid rgba(231, 231, 231, 0.2);
    padding: 9px;
    color: #f0f0f1;
    background-color: hsla(216, 21%, 14%, 1);
    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 p, .mx_CreateRoomDialog .mx_Field_input label {
        color: #b9bec6;
    }
.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;
        min-width: 0;
        font-weight: 600;
    }
.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 {
        margin: 0 85px 0 0;
        font-size: 1.2rem;
    }
/*
Copyright 2018 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_DeactivateAccountDialog .mx_Dialog_content {
    margin-bottom: 30px;
}
.mx_DeactivateAccountDialog .mx_DeactivateAccountDialog_input_section {
    margin-top: 60px;
}
.mx_DeactivateAccountDialog .mx_DeactivateAccountDialog_input_section .mx_Field {
    width: 300px;
}
/*
Copyright 2017 Michael Telatynski <7t3chguy@gmail.com>

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_DevTools_content {
    margin: 10px 0;
}
.mx_DevTools_ServersInRoomList_button {
    /* Set the cursor back to default as `.mx_Dialog button` sets it to pointer */
    cursor: default !important;
}
.mx_DevTools_RoomStateExplorer_query {
    margin-bottom: 10px;
}
.mx_DevTools_RoomStateExplorer_button, .mx_DevTools_ServersInRoomList_button {
    margin-bottom: 10px;
    width: 100%;
}
.mx_DevTools_label_left {
    float: left;
}
.mx_DevTools_label_right {
    float: right;
}
.mx_DevTools_label_bottom {
    clear: both;
    border-bottom: 1px solid #e5e5e5;
}
.mx_DevTools_inputRow {
    display: table-row;
}
.mx_DevTools_inputLabelCell {
    display: table-cell;
    font-weight: bold;
    padding-right: 24px;
}
.mx_DevTools_textarea {
    font-size: 1.2rem;
    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_tgl {
    display: none;
}
.mx_DevTools_tgl, .mx_DevTools_tgl::after, .mx_DevTools_tgl::before, .mx_DevTools_tgl *, .mx_DevTools_tgl *::after, .mx_DevTools_tgl *::before, .mx_DevTools_tgl + .mx_DevTools_tgl-btn {
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
    }
.mx_DevTools_tgl::-moz-selection, .mx_DevTools_tgl::after::-moz-selection, .mx_DevTools_tgl::before::-moz-selection, .mx_DevTools_tgl *::-moz-selection, .mx_DevTools_tgl *::after::-moz-selection, .mx_DevTools_tgl *::before::-moz-selection, .mx_DevTools_tgl + .mx_DevTools_tgl-btn::-moz-selection {
            background: none;
        }
.mx_DevTools_tgl::selection, .mx_DevTools_tgl::after::selection, .mx_DevTools_tgl::before::selection, .mx_DevTools_tgl *::selection, .mx_DevTools_tgl *::after::selection, .mx_DevTools_tgl *::before::selection, .mx_DevTools_tgl + .mx_DevTools_tgl-btn::selection {
            background: none;
        }
.mx_DevTools_tgl + .mx_DevTools_tgl-btn {
        outline: 0;
        display: block;
        width: 7em;
        height: 2em;
        position: relative;
        cursor: default;
        -webkit-user-select: none;
           -moz-user-select: none;
            -ms-user-select: none;
                user-select: none;
    }
.mx_DevTools_tgl + .mx_DevTools_tgl-btn::after, .mx_DevTools_tgl + .mx_DevTools_tgl-btn::before {
            position: relative;
            display: block;
            content: "";
            width: 50%;
            height: 100%;
        }
.mx_DevTools_tgl + .mx_DevTools_tgl-btn::after {
            left: 0;
        }
.mx_DevTools_tgl + .mx_DevTools_tgl-btn::before {
            display: none;
        }
.mx_DevTools_tgl:checked + .mx_DevTools_tgl-btn::after {
        left: 50%;
    }
.mx_DevTools_tgl-flip + .mx_DevTools_tgl-btn {
        padding: 2px;
        -webkit-transition: all .2s ease;
        transition: all .2s ease;
        -webkit-perspective: 100px;
                perspective: 100px;
    }
.mx_DevTools_tgl-flip + .mx_DevTools_tgl-btn::after, .mx_DevTools_tgl-flip + .mx_DevTools_tgl-btn::before {
            display: inline-block;
            -webkit-transition: all .4s ease;
            transition: all .4s ease;
            width: 100%;
            text-align: center;
            position: absolute;
            line-height: 2em;
            font-weight: bold;
            color: #fff;
            top: 0;
            left: 0;
            -webkit-backface-visibility: hidden;
                    backface-visibility: hidden;
            border-radius: 4px;
        }
.mx_DevTools_tgl-flip + .mx_DevTools_tgl-btn::after {
            content: attr(data-tg-on);
            background: #02c66f;
            -webkit-transform: rotateY(-180deg);
                    transform: rotateY(-180deg);
        }
.mx_DevTools_tgl-flip + .mx_DevTools_tgl-btn::before {
            background: #ff3a19;
            content: attr(data-tg-off);
        }
.mx_DevTools_tgl-flip + .mx_DevTools_tgl-btn:active::before {
            -webkit-transform: rotateY(-20deg);
                    transform: rotateY(-20deg);
        }
.mx_DevTools_tgl-flip:checked + .mx_DevTools_tgl-btn::before {
            -webkit-transform: rotateY(180deg);
                    transform: rotateY(180deg);
        }
.mx_DevTools_tgl-flip:checked + .mx_DevTools_tgl-btn::after {
            -webkit-transform: rotateY(0);
                    transform: rotateY(0);
            left: 0;
            background: #7fc6a6;
        }
.mx_DevTools_tgl-flip:checked + .mx_DevTools_tgl-btn:active::after {
            -webkit-transform: rotateY(20deg);
                    transform: rotateY(20deg);
        }
.mx_DevTools_VerificationRequest {
    border: 1px solid #cccccc;
    border-radius: 3px;
    padding: 1px 5px;
    margin-bottom: 6px;
    font-family: monospace;
}
.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: #666666;
    }
.mx_DevTools_VerificationRequest dd:empty::after {
            content: "(empty)";
        }
.mx_DevTools_VerificationRequest dt {
        font-weight: bold;
        grid-column-start: 1;
    }
.mx_DevTools_VerificationRequest dt::after {
        content: ":";
    }
.mx_DevTools_SettingsExplorer table {
        width: 100%;
        table-layout: fixed;
        border-collapse: collapse;
    }
.mx_DevTools_SettingsExplorer table th {
            border-bottom: 1px solid #4958F5;
            text-align: left;
        }
.mx_DevTools_SettingsExplorer table td, .mx_DevTools_SettingsExplorer table th {
            width: 360px;

            text-overflow: ellipsis;
            overflow: hidden;
            white-space: nowrap;
        }
.mx_DevTools_SettingsExplorer table td + td, .mx_DevTools_SettingsExplorer table th + th {
            width: auto;
        }
.mx_DevTools_SettingsExplorer table tr:hover {
            background-color: #4958F5;
        }
.mx_DevTools_SettingsExplorer .mx_DevTools_SettingsExplorer_mutable {
        background-color: #4958F5;
    }
.mx_DevTools_SettingsExplorer .mx_DevTools_SettingsExplorer_immutable {
        background-color: #FF5B55;
    }
.mx_DevTools_SettingsExplorer .mx_DevTools_SettingsExplorer_edit {
        float: right;
        margin-right: 16px;
    }
.mx_DevTools_SettingsExplorer .mx_DevTools_SettingsExplorer_warning {
        border: 2px solid #FF5B55;
        border-radius: 4px;
        padding: 4px;
        margin-bottom: 8px;
    }
.mx_DevTools_SettingsExplorer_setting {
    color: #0086e6 !important;
}
/*
Copyright 2019 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_IncomingSasDialog_opponentProfile_image {
    position: relative;
}
.mx_IncomingSasDialog_opponentProfile h2 {
    display: inline-block;
    margin-left: 10px;
}
/*
Copyright 2019, 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.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;
            -ms-flex: 1;
                flex: 1;
        width: 100%;
        background-color: #454854;
        border-radius: 4px;
        min-height: 25px;
        padding-left: 8px;
        overflow-x: hidden;
        overflow-y: auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    }
.mx_InviteDialog_addressBar .mx_InviteDialog_editor .mx_InviteDialog_userTile {
            margin: 6px 6px 0 0;
            display: inline-block;
            min-width: -webkit-max-content;
            min-width: -moz-max-content;
            min-width: max-content;
        }
.mx_InviteDialog_addressBar .mx_InviteDialog_editor > input[type="text"] {
            margin: 6px 0 !important;
            height: 24px;
            line-height: 2.4rem;
            font-size: 1.4rem;
            padding-left: 12px;
            border: 0 !important;
            outline: 0 !important;
            resize: none;
            -webkit-box-sizing: border-box;
                    box-sizing: border-box;
            min-width: 40%;
            -webkit-box-flex: 1 !important;
                -ms-flex: 1 !important;
                    flex: 1 !important;
            color: #f0f0f1 !important;
        }
.mx_InviteDialog_addressBar .mx_InviteDialog_goButton {
        min-width: 48px;
        margin-left: 10px;
        height: 25px;
        line-height: 2.5rem;
    }
.mx_InviteDialog_addressBar .mx_InviteDialog_buttonAndSpinner .mx_Spinner {
            width: 20px;
            height: 20px;
            margin-left: 5px;
            display: inline-block;
            vertical-align: middle;
        }
.mx_InviteDialog_section {
    padding-bottom: 4px;
}
.mx_InviteDialog_section h3 {
        font-size: 1.2rem;
        color: #b9bec6;
        font-weight: bold;
        text-transform: uppercase;
    }
.mx_InviteDialog_section > p {
        margin: 0;
    }
.mx_InviteDialog_section > span {
        color: #f0f0f1;
    }
.mx_InviteDialog_section .mx_InviteDialog_subname {
        margin-bottom: 10px;
        margin-top: -10px;
        font-size: 1.2rem;
        color: #b9bec6;
    }
.mx_InviteDialog_section_hidden_suggestions_disclaimer {
    padding: 8px 0 16px 0;
    font-size: 1.4rem;
}
.mx_InviteDialog_section_hidden_suggestions_disclaimer > span {
        color: #f0f0f1;
        font-weight: 600;
    }
.mx_InviteDialog_section_hidden_suggestions_disclaimer > p {
        margin: 0;
    }
.mx_InviteDialog_footer {
    border-top: 1px solid rgba(231, 231, 231, 0.2);
}
.mx_InviteDialog_footer > h3 {
        margin: 12px 0;
        font-size: 1.2rem;
        color: #b9bec6;
        font-weight: bold;
        text-transform: uppercase;
    }
.mx_InviteDialog_footer .mx_InviteDialog_footer_link {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        border-radius: 4px;
        border: solid 1px #c8c8cd;
        padding: 8px;
    }
.mx_InviteDialog_footer .mx_InviteDialog_footer_link > a {
            text-decoration: none;
            -ms-flex-negative: 1;
                flex-shrink: 1;
            overflow: hidden;
            text-overflow: ellipsis;
        }
.mx_InviteDialog_footer .mx_InviteDialog_footer_link_copy {
        -ms-flex-negative: 0;
            flex-shrink: 0;
        cursor: default;
        margin-left: 20px;
        display: inherit;
    }
.mx_InviteDialog_footer .mx_InviteDialog_footer_link_copy > div {
            -webkit-mask-image: url(../../img/feather-customised/clipboard.24dd87a.svg);
                    mask-image: url(../../img/feather-customised/clipboard.24dd87a.svg);
            background-color: #b9bec6;
            margin-left: 5px;
            width: 20px;
            height: 20px;
            background-repeat: no-repeat;
        }
.mx_InviteDialog_roomTile {
    cursor: default;
    padding: 5px 10px;
}
.mx_InviteDialog_roomTile:hover {
        background-color: #454854;
        border-radius: 4px;
    }
.mx_InviteDialog_roomTile * {
        vertical-align: middle;
    }
.mx_InviteDialog_roomTile .mx_InviteDialog_roomTile_avatarStack {
        display: inline-block;
        position: relative;
        width: 36px;
        height: 36px;
    }
.mx_InviteDialog_roomTile .mx_InviteDialog_roomTile_avatarStack > * {
            position: absolute;
            top: 0;
            left: 0;
        }
.mx_InviteDialog_roomTile .mx_InviteDialog_roomTile_selected {
        width: 36px;
        height: 36px;
        border-radius: 36px;
        background-color: #c03d33;
        display: inline-block;
        position: relative;
    }
.mx_InviteDialog_roomTile .mx_InviteDialog_roomTile_selected::before {
            content: "";
            width: 24px;
            height: 24px;
            grid-column: 1;
            grid-row: 1;
            -webkit-mask-image: url(../../img/feather-customised/check.5745b4e.svg);
                    mask-image: url(../../img/feather-customised/check.5745b4e.svg);
            -webkit-mask-size: 100%;
                    mask-size: 100%;
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            position: absolute;
            top: 6px;
            left: 6px;
            background-color: #ffffff;
        }
.mx_InviteDialog_roomTile .mx_InviteDialog_roomTile_nameStack {
        display: inline-block;
        overflow: hidden;
    }
.mx_InviteDialog_roomTile .mx_InviteDialog_roomTile_name {
        font-weight: 600;
        font-size: 1.4rem;
        color: #f0f0f1;
        margin-left: 7px;
    }
.mx_InviteDialog_roomTile .mx_InviteDialog_roomTile_userId {
        font-size: 1.2rem;
        color: #b9bec6;
        margin-left: 7px;
    }
.mx_InviteDialog_roomTile .mx_InviteDialog_roomTile_name, .mx_InviteDialog_roomTile .mx_InviteDialog_roomTile_userId {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
.mx_InviteDialog_roomTile .mx_InviteDialog_roomTile_time {
        text-align: right;
        font-size: 1.2rem;
        color: #b9bec6;
        float: right;
        line-height: 3.6rem;
    }
.mx_InviteDialog_roomTile .mx_InviteDialog_roomTile_highlight {
        font-weight: 900;
    }
.mx_InviteDialog_userTile {
    margin-right: 8px;
}
.mx_InviteDialog_userTile .mx_InviteDialog_userTile_pill {
        background-color: #c03d33;
        border-radius: 12px;
        display: inline-block;
        height: 24px;
        line-height: 2.4rem;
        padding-left: 8px;
        padding-right: 8px;
        color: #ffffff;
    }
.mx_InviteDialog_userTile .mx_InviteDialog_userTile_pill .mx_InviteDialog_userTile_avatar {
            border-radius: 20px;
            position: relative;
            left: -5px;
            top: 2px;
        }
.mx_InviteDialog_userTile .mx_InviteDialog_userTile_pill img.mx_InviteDialog_userTile_avatar {
            vertical-align: top;
        }
.mx_InviteDialog_userTile .mx_InviteDialog_userTile_pill .mx_InviteDialog_userTile_name {
            vertical-align: top;
        }
.mx_InviteDialog_userTile .mx_InviteDialog_userTile_pill .mx_InviteDialog_userTile_threepidAvatar {
            background-color: #ffffff;
        }
.mx_InviteDialog_userTile .mx_InviteDialog_userTile_remove {
        display: inline-block;
        margin-left: 4px;
    }
.mx_InviteDialog_other {
    height: 600px;
    padding-left: 20px;
}
.mx_InviteDialog_other .mx_InviteDialog_userSections {
        height: calc(100% - 115px);
    }
.mx_InviteDialog_content {
    height: calc(100% - 36px);
    overflow: hidden;
}
.mx_InviteDialog_transfer {
    width: 496px;
    height: 466px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
.mx_InviteDialog_transfer .mx_InviteDialog_content {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
.mx_InviteDialog_transfer .mx_InviteDialog_content .mx_TabbedView {
            height: calc(100% - 60px);
        }
.mx_InviteDialog_transfer .mx_InviteDialog_content {
        overflow: visible;
}
.mx_InviteDialog_transfer .mx_InviteDialog_addressBar {
        margin-top: 8px;
    }
.mx_InviteDialog_transfer input[type="checkbox"] {
        margin-right: 8px;
    }
.mx_InviteDialog_userSections {
    margin-top: 4px;
    overflow-y: auto;
    padding: 0 45px 4px 0;
}
.mx_InviteDialog_hasFooter .mx_InviteDialog_userSections {
    height: calc(100% - 175px);
}
.mx_InviteDialog_helpText {
    margin: 0;
}
.mx_InviteDialog_helpText .mx_AccessibleButton_kind_link {
    padding: 0;
}
.mx_InviteDialog_dialPad .mx_InviteDialog_dialPadField {
    border-top: 0;
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    margin-top: 0;
    border-color: #c1c6cd;
}
.mx_InviteDialog_dialPad .mx_InviteDialog_dialPadField input {
        font-size: 18px;
        font-weight: 600;
        padding-top: 0;
    }
.mx_InviteDialog_dialPad .mx_InviteDialog_dialPadField:focus-within {
    border-color: #4958F5;
}
.mx_InviteDialog_dialPadField .mx_Field_postfix {
    /* Remove border separator between postfix and field content */
    border-left: none;
}
.mx_InviteDialog_dialPad {
    width: 224px;
    margin-top: 16px;
    margin-left: auto;
    margin-right: auto;
}
.mx_InviteDialog_dialPad .mx_DialPad {
    grid-row-gap: 16px;
    row-gap: 16px;
    grid-column-gap: 48px;
    -webkit-column-gap: 48px;
       -moz-column-gap: 48px;
            column-gap: 48px;

    margin-left: auto;
    margin-right: auto;
}
.mx_InviteDialog_transferConsultConnect {
    padding-top: 16px;
    /* This wants a drop shadow the full width of the dialog, so relative-position it
     * and make it wider, then compensate with padding
     */
    position: relative;
    width: 496px;
    left: -24px;
    padding-left: 24px;
    padding-right: 24px;
    border-top: 1px solid #E3E8F0;

    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;
}
.mx_InviteDialog_transferConsultConnect_pushRight {
    margin-left: auto;
}
.mx_InviteDialog_userDirectoryIcon::before {
    -webkit-mask-image: url(../../img/voip/tab-userdirectory.cc3ed9a.svg);
            mask-image: url(../../img/voip/tab-userdirectory.cc3ed9a.svg);
}
.mx_InviteDialog_dialPadIcon::before {
    -webkit-mask-image: url(../../img/voip/tab-dialpad.a4a190e.svg);
            mask-image: url(../../img/voip/tab-dialpad.a4a190e.svg);
}
.mx_InviteDialog_multiInviterError > h4 {
        font-size: 1.5rem;
        line-height: 2.4rem;
        color: #737D8C;
        font-weight: normal;
    }
.mx_InviteDialog_multiInviterError > div .mx_InviteDialog_multiInviterError_entry {
            margin-bottom: 24px;
        }
.mx_InviteDialog_multiInviterError > div .mx_InviteDialog_multiInviterError_entry .mx_InviteDialog_multiInviterError_entry_userProfile .mx_InviteDialog_multiInviterError_entry_name {
                    margin-left: 6px;
                    font-size: 1.5rem;
                    line-height: 2.4rem;
                    font-weight: 600;
                    color: #f0f0f1;
                }
.mx_InviteDialog_multiInviterError > div .mx_InviteDialog_multiInviterError_entry .mx_InviteDialog_multiInviterError_entry_userProfile .mx_InviteDialog_multiInviterError_entry_userId {
                    margin-left: 6px;
                    font-size: 1.2rem;
                    line-height: 1.5rem;
                    color: #8D97A5;
                }
.mx_InviteDialog_multiInviterError > div .mx_InviteDialog_multiInviterError_entry .mx_InviteDialog_multiInviterError_entry_error {
                margin-left: 32px;
                font-size: 1.5rem;
                line-height: 2.4rem;
                color: #FF5B55;
            }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_KeyboardShortcutsDialog kbd {
        padding: 5px;
        border-radius: 4px;
        background-color: #454854;
        margin-right: 2px;
        min-width: 20px;
        text-align: center;
        display: inline-block;
        border: 1px solid #000000;
        -webkit-box-shadow: 0 2px #000000;
                box-shadow: 0 2px #000000;
        margin-bottom: 4px;
        text-transform: capitalize;
    }
/*
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MessageEditHistoryDialog .mx_Dialog_header > .mx_Dialog_title {
    text-align: center;
}
.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: #FF5B55;
    text-align: center;
}
.mx_MessageEditHistoryDialog_edits {
    list-style-type: none;
    font-size: 1.4rem;
    padding: 0;
    color: #f0f0f1;
}
.mx_MessageEditHistoryDialog_edits span.mx_EditHistoryMessage_deletion, .mx_MessageEditHistoryDialog_edits span.mx_EditHistoryMessage_insertion {
        padding: 0px 2px;
    }
.mx_MessageEditHistoryDialog_edits .mx_EditHistoryMessage_deletion {
        color: rgb(255, 76, 85);
        background-color: rgba(255, 76, 85, 0.1);
        text-decoration: line-through;
    }
.mx_MessageEditHistoryDialog_edits .mx_EditHistoryMessage_insertion {
        color: rgb(26, 169, 123);
        background-color: rgba(26, 169, 123, 0.1);
        text-decoration: underline;
    }
.mx_MessageEditHistoryDialog_edits .mx_EventTile_line, .mx_MessageEditHistoryDialog_edits .mx_EventTile_content {
        margin-right: 0px;
    }
.mx_MessageEditHistoryDialog_edits .mx_MessageActionBar .mx_AccessibleButton {
        font-size: 1.0rem;
        padding: 0 8px;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ModalWidgetDialog .mx_ModalWidgetDialog_warning {
        margin-bottom: 24px;
    }
.mx_ModalWidgetDialog .mx_ModalWidgetDialog_warning > img {
            vertical-align: middle;
            margin-right: 8px;
        }
.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 {
        width: 100%;
        height: 450px;
        border: 0;
        border-radius: 8px;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_NewSessionReviewDialog_header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-top: 0;
}
.mx_NewSessionReviewDialog_headerIcon {
    width: 24px;
    height: 24px;
    margin-right: 4px;
    position: relative;
}
.mx_NewSessionReviewDialog_deviceName {
    font-weight: 600;
}
.mx_NewSessionReviewDialog_deviceID {
    font-size: 1.2rem;
    color: #8D97A5;
}
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RegistrationEmailPromptDialog {
    width: 417px;
}
.mx_RegistrationEmailPromptDialog .mx_Dialog_content {
        margin-bottom: 24px;
        color: #8D97A5;
    }
.mx_RegistrationEmailPromptDialog .mx_Dialog_primary {
        width: 100%;
    }
/*
Copyright 2019 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RoomSettingsDialog_settingsIcon::before {
    -webkit-mask-image: url(../../img/element-icons/settings.6b381af.svg);
            mask-image: url(../../img/element-icons/settings.6b381af.svg);
}
.mx_RoomSettingsDialog_securityIcon::before {
    -webkit-mask-image: url(../../img/element-icons/security.66f2fa6.svg);
            mask-image: url(../../img/element-icons/security.66f2fa6.svg);
}
.mx_RoomSettingsDialog_rolesIcon::before {
    -webkit-mask-image: url(../../img/element-icons/room/settings/roles.bad9a9e.svg);
            mask-image: url(../../img/element-icons/room/settings/roles.bad9a9e.svg);
}
.mx_RoomSettingsDialog_notificationsIcon::before {
    -webkit-mask-image: url(../../img/element-icons/notifications.d298b39.svg);
            mask-image: url(../../img/element-icons/notifications.d298b39.svg);
}
.mx_RoomSettingsDialog_bridgesIcon::before {
    -webkit-mask-image: url(../../img/feather-customised/bridge.b2ca042.svg);
            mask-image: url(../../img/feather-customised/bridge.b2ca042.svg);
}
.mx_RoomSettingsDialog_warningIcon::before {
    -webkit-mask-image: url(../../img/element-icons/room/settings/advanced.e079c15.svg);
            mask-image: url(../../img/element-icons/room/settings/advanced.e079c15.svg);
}
.mx_RoomSettingsDialog .mx_Dialog_title {
    -ms-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    margin: 0 auto;
    padding-right: 80px;
}
.mx_RoomSettingsDialog .mx_AvatarSetting_avatar .mx_AvatarSetting_avatarPlaceholder::before {
    -webkit-mask: url(../../img/feather-customised/image.a8671b8.svg);
            mask: url(../../img/feather-customised/image.a8671b8.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-size: 36px;
            mask-size: 36px;
    -webkit-mask-position: center;
            mask-position: center;
}
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RoomSettingsDialog_BridgeList {
    padding: 0;
}
.mx_RoomSettingsDialog_BridgeList .mx_AccessibleButton {
        display: inline;
        margin: 0;
        padding: 0;
    }
.mx_RoomSettingsDialog_BridgeList li {
    list-style-type: none;
    padding: 5px;
    margin-bottom: 8px;
    border-width: 1px 1px;
    border-color: #404040;
    border-style: solid;
    border-radius: 5px;
}
.mx_RoomSettingsDialog_BridgeList li .column-icon {
        float: left;
        padding-right: 10px;
    }
.mx_RoomSettingsDialog_BridgeList li .column-icon * {
            border-radius: 5px;
            border: 1px solid #3a3c46;
        }
.mx_RoomSettingsDialog_BridgeList li .column-icon .noProtocolIcon {
            width: 48px;
            height: 48px;
            background: #3a3c46;
            border-radius: 5px;
        }
.mx_RoomSettingsDialog_BridgeList li .column-icon .protocol-icon {
            float: left;
            margin-right: 5px;
        }
.mx_RoomSettingsDialog_BridgeList li .column-icon .protocol-icon img {
                border-radius: 5px;
                border-width: 1px 1px;
                border-color: #404040;
            }
.mx_RoomSettingsDialog_BridgeList li .column-icon .protocol-icon span {
                /* Correct letter placement */
                left: auto;
            }
.mx_RoomSettingsDialog_BridgeList li .column-data {
        display: inline-block;
        width: 85%;
    }
.mx_RoomSettingsDialog_BridgeList li .column-data > h3 {
            margin-top: 0px;
            margin-bottom: 0px;
            font-size: 16pt;
            color: #f0f0f1;
        }
.mx_RoomSettingsDialog_BridgeList li .column-data > * {
            margin-top: 4px;
            margin-bottom: 0;
        }
.mx_RoomSettingsDialog_BridgeList li .column-data .workspace-channel-details {
            color: #f0f0f1;
            font-weight: 600;
        }
.mx_RoomSettingsDialog_BridgeList li .column-data .workspace-channel-details .channel {
                margin-left: 5px;
            }
.mx_RoomSettingsDialog_BridgeList li .column-data .metadata {
            color: #b9bec6;
            margin-bottom: 0;
            overflow-y: visible;
            text-overflow: ellipsis;
            white-space: normal;
            padding: 0;
        }
.mx_RoomSettingsDialog_BridgeList li .column-data .metadata > li {
                padding: 0;
                border: 0;
            }
/*
Copyright 2018 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RoomUpgradeDialog {
    padding-right: 70px;
}
/*
Copyright 2019 - 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RoomUpgradeWarningDialog {
    max-width: 38vw;
    width: 38vw;
}
.mx_RoomUpgradeWarningDialog .mx_RoomUpgradeWarningDialog_progress .mx_ProgressBar {
            height: 8px;
            width: 100%;

            border-radius: 8px;
        }
.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 {
            margin-top: 8px;
            font-size: 1.5rem;
            line-height: 2.4rem;
            color: #f0f0f1;
        }
.mx_RoomUpgradeWarningDialog .mx_SettingsFlag {
    font-weight: 700;
}
.mx_RoomUpgradeWarningDialog .mx_SettingsFlag .mx_ToggleSwitch {
        display: inline-block;
        vertical-align: middle;
        margin-left: 8px;
        float: right;
    }
.mx_RoomUpgradeWarningDialog .mx_SettingsFlag .mx_SettingsFlag_label {
        display: inline-block;
        vertical-align: middle;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ServerOfflineDialog .mx_ServerOfflineDialog_content {
        padding-right: 85px;
        color: #f0f0f1;
    }
.mx_ServerOfflineDialog .mx_ServerOfflineDialog_content hr {
            border-color: #f0f0f1;
            opacity: 0.1;
            border-bottom: none;
        }
.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 {
                display: inline-block;
                width: 115px;
                color: #b9bec6;
                line-height: 24px;
                vertical-align: top;
            }
.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 {
                    position: relative;
                    margin-top: 8px;
                }
.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;
                        padding: 0;
                    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ServerPickerDialog {
    width: 468px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}
.mx_ServerPickerDialog .mx_Dialog_content {
        margin-bottom: 0;
    }
.mx_ServerPickerDialog .mx_Dialog_content > p {
            color: #737D8C;
            font-size: 1.4rem;
            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 > h4 {
            font-size: 1.5rem;
            font-weight: 600;
            color: #737D8C;
            margin-left: 8px;
        }
.mx_ServerPickerDialog .mx_Dialog_content > a {
            color: #4958F5;
            margin-left: 8px;
        }
.mx_ServerPickerDialog .mx_ServerPickerDialog_otherHomeserverRadio input[type="radio"] + div {
            margin-top: auto;
            margin-bottom: auto;
        }
.mx_ServerPickerDialog .mx_ServerPickerDialog_otherHomeserver {
        border-top: none;
        border-left: none;
        border-right: none;
        border-radius: unset;
    }
.mx_ServerPickerDialog .mx_ServerPickerDialog_otherHomeserver > input {
            padding-left: 0;
        }
.mx_ServerPickerDialog .mx_ServerPickerDialog_otherHomeserver > label {
            margin-left: 0;
        }
.mx_ServerPickerDialog .mx_AccessibleButton_kind_primary {
        width: calc(100% - 64px);
        margin: 0 8px;
        padding: 15px 18px;
    }
/*
Copyright 2017 Vector Creations Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SetEmailDialog_email_input {
    border-radius: 3px;
    border: 1px solid rgba(231, 231, 231, 0.2);
    padding: 9px;
    color: rgba(74, 74, 74, 0.9);
    background-color: hsla(216, 21%, 14%, 1);
    font-size: 1.5rem;
    width: 100%;
    max-width: 280px;
    margin-bottom: 10px;
}
.mx_SetEmailDialog_email_input:focus {
    outline: none;
    -webkit-box-shadow: none;
            box-shadow: none;
    border: 1px solid #4958F5;
}
/*
Copyright 2019 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_UserSettingsDialog, .mx_RoomSettingsDialog, .mx_SpaceSettingsDialog, .mx_SpacePreferencesDialog {
    width: 90vw;
    max-width: 1000px;
    height: 80vh;
}
.mx_UserSettingsDialog .mx_TabbedView, .mx_RoomSettingsDialog .mx_TabbedView, .mx_SpaceSettingsDialog .mx_TabbedView, .mx_SpacePreferencesDialog .mx_TabbedView {
        top: 65px;
    }
.mx_UserSettingsDialog .mx_TabbedView .mx_SettingsTab, .mx_RoomSettingsDialog .mx_TabbedView .mx_SettingsTab, .mx_SpaceSettingsDialog .mx_TabbedView .mx_SettingsTab, .mx_SpacePreferencesDialog .mx_TabbedView .mx_SettingsTab {
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        min-width: 580px;
        padding-right: 100px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        padding-bottom: 100px;
    }
.mx_ChatNetworksDialog_wrapper {
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
}
.mx_ChatNetworksDialog {
    padding: 0;
    height: 100%;
    width: 100%;
}
.mx_ChatNetworksDialog .mx_Dialog_cancelButton {
    right: 20px;
    top: 18px;
}
.mx_ChatNetworks_Dialog {
    padding: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    max-height: unset;
    width: 90vw;
    height: 92vh;
    background: #25262d;
}
.mx_ChatNetworks_Dialog.inOnboarding {
      width: 100%;
      height: 100%;
      border-radius: 0;
      max-height: unset;
    }
.ChatNetworksDialog {
    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;
    height: 100%;
    color: #f0f0f1;
}
.ChatNetworksDialog.inOnboarding {
      width: 100%;
      color: #fff;
      overflow: hidden;
    }
.inOnboarding .statusIcon_loading {
      border-color: #ffffff50;
  }
.inOnboarding .tab:hover {
    background: #ffffff25 !important;
  }
.infoIcon {
    -webkit-mask-image: url(../../themes/beeper/img/icon-info.1ad2c41.svg);
            mask-image: url(../../themes/beeper/img/icon-info.1ad2c41.svg);
    -webkit-mask-size: contain;
            mask-size: contain;
    background-color: #717689;
    width: 15px;
    height: 15px;
    display: inline-block;
}
.ChatNetworksDialog-leftbar {
    width: 30%;
    height: 100%;
    background: #25262d;
    overflow-y: scroll;
}
.ChatNetworksDialog-leftbar.inOnboarding {
      background: transparent;
      margin-top: 85px;
    }
.ChatNetworksDialog-leftbar .tabbar .tab {
    padding: 12px 16px 12px 32px;
    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;
    cursor: default;
    height: 24px;
}
.ChatNetworksDialog-leftbar .tabbar .tab.disabled {
      cursor: not-allowed;
    }
.ChatNetworksDialog-leftbar .tabbar .tab.selected:hover, .ChatNetworksDialog-leftbar .tabbar .tab.selected {
    background: #4958f5;
}
.ChatNetworksDialog-leftbar .tabbar .tab:hover {
    background: #747f8d26;
}
.ChatNetworksDialog-leftbar .tabbar .tab:hover.disabled {
        background: unset;
    }
.ChatNetworksDialog-leftbar .tabbar .tab .network-icon {
    height: 18px;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 24px;
            flex: 0 0 24px;
    margin-right: 12px;
}
.ChatNetworksDialog-leftbar .tabbar .tab .name {
    margin-right: auto;
    font-weight: 700;
    font-size: 16px;
}
.ChatNetworksDialog .status-icon {
    height: 16px;
    color: #747f8d61;
}
.ChatNetworksDialog-leftbar .tabbar .tab.selected .status-icon {
    color: #fff;
}
.ChatNetworksDialog .status-icon.warn, .ChatNetworksDialog-leftbar .tabbar .tab.selected .status-icon.warn {
    color: #ffad61;
}
.ChatNetworksDialog .status-icon.error, .ChatNetworksDialog-leftbar .tabbar .tab.selected .status-icon.error {
    color: #ff6363;
}
.ChatNetworksDialog .whatsapp-warn {
    margin-right: 6px;
}
.ChatNetworksDialog-content {
    width: 70%;
    height: 100%;
    padding: 0 30px;
    color: #f0f0f1;
    background-color: #25262d;
}
.ChatNetworksDialog-content.inOnboarding {
      background-color: transparent;
      color: #fff !important;
    }
.ChatNetworksDialog-content {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    overflow-y: scroll;

    -webkit-box-shadow: 0px 4px 24px rgba(10, 38, 46, 0.08);

            box-shadow: 0px 4px 24px rgba(10, 38, 46, 0.08);
}
.ChatNetworksDialog-content .center {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        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;
    }
.ChatNetworksDialog-content .bp_Channel_beeper {
        width: 32px;
        height: 32px;
        background-image: url(../../img/beeper.532eb10.svg);
    }
.ChatNetworksDialog-content .network-icon {
        height: 32px;
        -webkit-box-flex: 0;
            -ms-flex: 0 0 24px;
                flex: 0 0 24px;
        margin-right: 12px;
    }
.network-icon {
    height: 32px;
    width: 32px;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 24px;
            flex: 0 0 24px;
    margin-right: 12px;
}
.ChatNetworksDialog-content .panel-title {
    font-weight: 700;
    font-size: 36px;
    line-height: 40px;
    width: 300px;
    margin-bottom: 24px;
}
.ChatNetworksDialog-content .panel-title.panel-title-standout {
      width: -webkit-fit-content !important;
      width: -moz-fit-content !important;
      width: fit-content !important;
      line-height: 38.4px;
    }
.ChatNetworksDialog-content .panel-title.panel-title-standout > * {
        display: block;
      }
.ChatNetworksDialog-content .facebook-banner {
    width: 100%;
    height: 160px;
    margin-bottom: 80px;
    background-size: cover;
    background-position: center center;
    position: relative;
    border-radius: 8px;
}
.ChatNetworksDialog-content .facebook-profile {
    position: absolute;
    bottom: -50px;
    left: 30px;
    height: 140px;
    width: 140px;
    border-radius: 50%;
    border: 4px white solid;
    background-size: cover;
    background-position: center center;
}
.messenger-gradient {
  background: radial-gradient(108.96% 108.96% at 19.25% 99.47%, #0099ff 0%, #a033ff 60.98%, #ff5280 93.48%, #ff7061 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -moz-background-clip: text;
  -moz-text-fill-color: transparent;
  -webkit-text-fill-color: transparent;
}
.facebook-gradient {
    background: radial-gradient(108.96% 108.96% at 19.25% 99.47%, #0099ff 0%, #a033ff 60.98%, #ff5280 93.48%, #ff7061 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -moz-text-fill-color: transparent;
    -webkit-text-fill-color: transparent;
}
.instagram-gradient {
    background: linear-gradient(45deg, #b31f88, #d03158);
    background-clip: text;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -moz-text-fill-color: transparent;
    -webkit-text-fill-color: transparent;
}
.ChatNetworksDialog-content .facebook-screen-name {
    font-size: 12px;
    color: #757575;
}
.ChatNetworksDialog-content .twitter-banner {
    width: 100%;
    height: 160px;
    margin-bottom: 80px;
    background-size: cover;
    background-position: center center;
    position: relative;
    border-radius: 8px;
}
.ChatNetworksDialog-content .twitter-profile {
    position: absolute;
    bottom: -50px;
    left: 30px;
    height: 140px;
    width: 140px;
    border-radius: 50%;
    border: 4px white solid;
    background-size: cover;
    background-position: center center;
}
.ChatNetworksDialog-content .twitter-screen-name {
    font-size: 12px;
    color: #757575;
}
.ChatNetworksDialog-content .telegram-phone {
    font-size: 12px;
    color: #757575;
    margin-left: 10px;
}
.ChatNetworksDialog-content .instagram-username {
    font-size: 12px;
    color: #757575;
    margin-left: 10px;
}
.ChatNetworksDialog-content .slack-username {
    font-size: 12px;
    color: #757575;
    margin-left: 10px;
}
.bp_Lifeboat {
    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-flow: column;
            flex-flow: column;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: inherit;
}
.imessage-startup-alert .bp_Lifeboat {
        position: absolute;
        bottom: 0;
        margin-bottom: 25px;
    }
.ChatNetworksDialog-content-imessage {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    overflow: hidden;
}
.ChatNetworksDialog-content-imessage details.logs {
        overflow: hidden;
    }
.ChatNetworksDialog-content-imessage details.logs pre {
            overflow: scroll;
            font-size: 12px !important;
            height: 90%;
        }
.ChatNetworksDialog-content-imessage details.logs pre .line.level-info {
                    color: blue;
                }
.ChatNetworksDialog-content-imessage details.logs pre .line.level-warn {
                    color: orange;
                }
.ChatNetworksDialog-content-imessage details.logs pre .line.level-error {
                    color: red;
                }
.ChatNetworksDialog-content-imessage details.logs pre .line.level-fatal {
                    color: purple;
                }
.ChatNetworksDialog .login, .ChatNetworksDialog input[type='submit'].login {
    padding: 12px 20px;
    border-radius: 6px;
    margin: 10px 0;
    color: white;
    font-size: 1.6rem;
    border: none;
}
.error-pill {
    color: rgb(221, 61, 61);
    border: 1px solid rgb(221, 61, 61);
    border-radius: 6px;
    padding: 6px 10px;
    display: inline-block;
}
.error-pill.warning {
        color: #FFCE51;
        border-color: #FFCE51;
    }
.error-pill.new-design {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        padding: 18px 24px;
        -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;
    }
.error-pill.figma {
      background: #25262d;
      border: 1px solid #E0474F;
      -webkit-box-sizing: border-box;
              box-sizing: border-box;
      border-radius: 8px;
      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;
      padding: 16px;
    }
.ChatNetworksDialog .input {
    padding: 12px 20px !important;
    border-radius: 6px;
    margin: 10px 0;
    border: 2px solid rgba(231, 231, 231, 0.2) !important;
    font-size: 1.6rem !important;
    display: block;
    margin: 0;
    outline: none;
    -webkit-transition: 150ms border-color;
    transition: 150ms border-color;
    background-color: #454854 !important;
    font-weight: normal;
    color: #F8F8FB;
    font-family: Arial, Helvetica, sans-serif;
}
.ChatNetworksDialog .input[type=number].no-spin::-webkit-inner-spin-button, .ChatNetworksDialog .input[type=number].no-spin::-webkit-outer-spin-button {
            -webkit-appearance: none;
                    appearance: none;
            margin: 0;
        }
.ChatNetworksDialog .phoneDropdownButton {
  background-color: rgba(231, 231, 231, 0.2) !important;
}
.ChatNetworksDialog .phoneDropdownButton .selected-flag:hover, .ChatNetworksDialog .phoneDropdownButton .selected-flag:focus, .ChatNetworksDialog .phoneDropdownButton .selected-flag.open {
        background-color: #4F5056 !important;
    }
.ChatNetworksDialog .searchInput {
  margin: 0;
  background-color: #454854 !important;
  padding: 1px !important;
}
.ChatNetworksDialog .countryDropdown {
  background-color: #454854 !important;
}
.react-tel-input .country-list {
  border-radius: 6px !important;
}
.react-tel-input .country-list .country:hover {
  background-color: #747f8d26 !important;
}
.react-tel-input .country-list .country.highlight {
  background-color: rgba(231, 231, 231, 0.2) !important;
}
.ChatNetworksDialog .bp_ButtonBlueBorder.bp_ButtonDisabled {
        color: rgba(255, 255, 255, 0.6);
    }
.ChatNetworksDialog .input:focus {
    border-color: #238cf5;
}
.ChatNetworksDialog .login.facebook {
    background-color: #0a7cff;
}
.ChatNetworksDialog .login.facebook:hover {
    background-color: #4d4dff;
}
.ChatNetworksDialog .login.googlechat {
    background-color: #0f9d58;
}
.ChatNetworksDialog .login.googlechat:hover {
    background-color: #23aa69;
}
.ChatNetworksDialog .login.discord {
    background-color: #7289da;
}
.ChatNetworksDialog .login.discord:hover {
    background-color: #677bc4;
}
.ChatNetworksDialog .login.instagram {
    background-image: linear-gradient(45deg, #b31f88, #d03158);
}
.ChatNetworksDialog .login.instagram:hover {
    background-image: linear-gradient(45deg, #d03158, #b31f88);
}
.ChatNetworksDialog .login.skype {
    background-color: #1da1f2;
}
.ChatNetworksDialog .login.skype:hover {
    background-color: #0078ca;
}
.ChatNetworksDialog .login.slack {
    background-color: #4a154b;
}
.ChatNetworksDialog .login.slack:hover {
    background-color: rgba(74, 21, 75, 0.9);
}
.ChatNetworksDialog .input.telegram {
    width: 300px;
    height: unset;
}
.ChatNetworksDialog .input.telegram.phoneInput {
        padding: 10px 20px 10px 48px !important;
    }
.ChatNetworksDialog .input.telegram:hover, .ChatNetworksDialog .input.telegram:focus {
    border-color: #5782a3;
}
.ChatNetworksDialog .login.telegram {
    background-color: #5782a3;
}
.ChatNetworksDialog .login.telegram:hover {
    background-color: #456f92;
}
.ChatNetworksDialog .login.twitter {
    background-color: #1da1f2;
}
.ChatNetworksDialog .login.twitter:hover {
    background-color: #1a91da;
}
.ChatNetworksDialog .login.whatsapp {
    background-color: #00bfa5;
}
.ChatNetworksDialog .login.whatsapp:hover {
    background-color: #00d1b5;
}
.ChatNetworksDialog .login.signal {
    background-color: #4c83f2;
}
.ChatNetworksDialog .login.signal {
    background-color: #4c83f2;
}
.ChatNetworksDialog .login.amp {
    background-color: #1a73e8;
}
.ChatNetworksDialog .login.amp:hover {
    background-color: #10458c;
}
.ChatNetworksDialog .shutdown-bridge {
    cursor: default;
    margin-left: 10px;
    font-size: 12px;
}
.ChatNetworksDialog .bridge-info {
    position: absolute;
    bottom: 10px;
    right: 10px;
    font-size: 11px;
    color: #b1b1b1;
    max-width: 64%;
    max-height: 45%;
}
.ChatNetworksDialog .bridge-info:hover {
    overflow: scroll;
}
.ChatNetworksDialog .bridge-info .info {
    display: none;
}
.ChatNetworksDialog .bridge-info:hover .pi {
    display: none;
}
.ChatNetworksDialog .bridge-info:hover .info {
    display: block;
    display: inline;
    margin-left: 10px;
}
.ChatNetworksDialog .puppet-list {
    padding: 10px;
    margin-top: 30px;
    margin-bottom: 30px;
    width: 100%;
}
.ChatNetworksDialog .puppet {
    border-radius: 3px;
    padding: 4px 13px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -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;
    align-items: center;
    width: 100%;
}
.ChatNetworksDialog .puppet .logout {
    margin-left: 10px;
}
.ChatNetworksDialog .spinner {
    margin-top: 30px;
    height: 24px;
}
.ChatNetworksDialog .puppet-spinner {
    height: 16px;
}
.ChatNetworksDialog-content .instructions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    font-size: 16px;
    width: 280px;
    margin-right: 24px;
}
.ChatNetworksDialog-content .instructions .row {
        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;
        margin-bottom: 8px;
    }
.ChatNetworksDialog-content .instructions .row .num {
            font-weight: bold;
            margin-right: 12px;
        }
.ChatNetworksDialog .bp-qr-wrapper {
    width: 280px;
    height: 280px;
    border-radius: 8px;
    border: 0.25px solid #d0d1d8;
    background-color: #454854;
    padding: 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 280px;
            flex: 0 0 280px;
}
.ChatNetworksDialog .bp-qr-reload {
    background-color: #454854;
    border-radius: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.bp_DiscordServerDropdown {
  min-width: 200px;
  margin: 0 16px;
}
.bp_featureSupportTable > p {
    font-size: 14px;
    line-height: 20px;
  }
.bp_featureSupportTable .boxWrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-flow: row;
            flex-flow: row;
  }
.bp_featureSupportTable .box {
    width: 208px;
    height: -webkit-min-content;
    height: -moz-min-content;
    height: min-content;
    background: #25262d;
    border: 0.25px solid rgba(208, 209, 216, 0.16);
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    border-radius: 8px;
    padding: 16px;
    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;
  }
.bp_featureSupportTable .bp_featureRow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    font-size: 14px;
    line-height: 16px;
  }
.bp_featureSupportTable .bp_featureRow:not(:last-of-type) {
      margin-bottom: 6px;
    }
.bp_featureSupportTable .bp_featureRow .bp_icon {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-flow: row;
              flex-flow: row;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      height: 18px;
    }
.bp_featureSupportTable .bp_featureRow .bp_icon > :first-child {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
      }
.bp_BridgeTileToggle {
  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: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-top: 1px solid #5C5D62;
}
.bp_BridgeTileToggle .chatNetworks {
      margin: 6px;
  }
/*
Copyright 2018 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ShareDialog hr {
    margin-top: 25px;
    margin-bottom: 25px;
    border-color: #c8c8cd;
}
.mx_ShareDialog_content {
    margin: 10px 0;
}
.mx_ShareDialog_matrixto {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    border-radius: 5px;
    border: solid 1px #c8c8cd;
    margin-bottom: 10px;
    margin-top: 30px;
    padding: 10px;
}
.mx_ShareDialog_matrixto a {
    text-decoration: none;
}
.mx_ShareDialog_matrixto_link {
    -ms-flex-negative: 1;
        flex-shrink: 1;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mx_ShareDialog_matrixto_copy {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    cursor: default;
    margin-left: 20px;
    display: inherit;
}
.mx_ShareDialog_matrixto_copy::after {
    content: "";
    -webkit-mask-image: url(../../img/feather-customised/clipboard.24dd87a.svg);
            mask-image: url(../../img/feather-customised/clipboard.24dd87a.svg);
    background-color: #b9bec6;
    margin-left: 5px;
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
}
.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;
    width: 256px;
    margin-right: 64px;
}
.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-right: 10px;
    margin-bottom: 10px;
}
/*
Copyright Michael Telatynski <7t3chguy@gmail.com>

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SlashCommandHelpDialog .mx_SlashCommandHelpDialog_headerRow h2 {
    margin-bottom: 2px;
}
.mx_SlashCommandHelpDialog .mx_Dialog_content {
    margin-top: 12px;
    margin-bottom: 34px;
}
/*
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_TabbedIntegrationManagerDialog .mx_Dialog {
    width: 60%;
    height: 70%;
    overflow: hidden;
    padding: 0;
    max-width: none;
    max-width: initial;
    max-height: none;
    max-height: initial;
    position: relative;
}
.mx_TabbedIntegrationManagerDialog_container {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
.mx_TabbedIntegrationManagerDialog_container .mx_TabbedIntegrationManagerDialog_currentManager {
        width: 100%;
        height: 100%;
        border-top: 1px solid #4958F5;
    }
.mx_TabbedIntegrationManagerDialog_container .mx_TabbedIntegrationManagerDialog_currentManager iframe {
            background-color: #fff;
            border: 0;
            width: 100%;
            height: 100%;
        }
.mx_TabbedIntegrationManagerDialog_tab {
    display: inline-block;
    border: 1px solid #4958F5;
    border-bottom: 0;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    padding: 10px 8px;
    margin-right: 5px;
}
.mx_TabbedIntegrationManagerDialog_currentTab {
    background-color: #4958F5;
    color: #202127;
}
/*
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
/*
 * To avoid visual glitching of two modals stacking briefly, we customise the
 * terms dialog sizing when it will appear for the integration manager so that
 * it gets the same basic size as the IM's own modal.
 */
.mx_TermsDialog_forIntegrationManager .mx_Dialog {
    width: 60%;
    height: 70%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}
.mx_TermsDialog_termsTableHeader {
    font-weight: bold;
    text-align: left;
}
.mx_TermsDialog_termsTable {
    font-size: 1.2rem;
    width: 100%;
}
.mx_TermsDialog_service, .mx_TermsDialog_summary {
    padding-right: 10px;
}
.mx_TermsDialog_link {
    display: inline-block;
    -webkit-mask-image: url(../../img/external-link.a8d3e9b.svg);
            mask-image: url(../../img/external-link.a8d3e9b.svg);
    background-color: #4958F5;
    width: 10px;
    height: 10px;
}
/*
Copyright 2019 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_UploadConfirmDialog_fileIcon {
    margin-right: 5px;
}
.mx_UploadConfirmDialog_previewOuter {
    text-align: center;
}
.mx_UploadConfirmDialog_previewInner {
    display: inline-block;
    text-align: left;
}
.mx_UploadConfirmDialog_imagePreview {
    max-height: 300px;
    max-width: 100%;
    border-radius: 4px;
    border: 1px solid #9fa9ba;
}
/*
Copyright 2019 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_UserSettingsDialog_settingsIcon::before {
    -webkit-mask-image: url(../../img/element-icons/settings.6b381af.svg);
            mask-image: url(../../img/element-icons/settings.6b381af.svg);
}
.mx_UserSettingsDialog_inboxIcon::before {
  -webkit-mask-image: url(../../img/beeper/inbox-filled16.36115d6.svg);
          mask-image: url(../../img/beeper/inbox-filled16.36115d6.svg);
}
.mx_UserSettingsDialog_appearanceIcon::before {
    -webkit-mask-image: url(../../img/element-icons/settings/appearance.cdebd40.svg);
            mask-image: url(../../img/element-icons/settings/appearance.cdebd40.svg);
}
.mx_UserSettingsDialog_emojiIcon::before {
  -webkit-mask-image: url(../../img/element-icons/room/composer/emoji.52d7369.svg);
          mask-image: url(../../img/element-icons/room/composer/emoji.52d7369.svg);
}
.mx_UserSettingsDialog_stickerIcon::before {
  -webkit-mask-image: url(../../img/element-icons/room/composer/sticker.8dbe5ec.svg);
          mask-image: url(../../img/element-icons/room/composer/sticker.8dbe5ec.svg);
}
.mx_UserSettingsDialog_chatSettingsIcon::before {
  -webkit-mask-image: url(../../img/element-icons/chat-bubbles.1167151.svg);
          mask-image: url(../../img/element-icons/chat-bubbles.1167151.svg);
}
.mx_UserSettingsDialog_voiceIcon::before {
    -webkit-mask-image: url(../../img/element-icons/call/voice-call.85a7c92.svg);
            mask-image: url(../../img/element-icons/call/voice-call.85a7c92.svg);
}
.mx_UserSettingsDialog_imessageIcon::before {
    -webkit-mask-image: url(../../img/beeper/apple16.ff582e2.svg);
            mask-image: url(../../img/beeper/apple16.ff582e2.svg)
}
.mx_UserSettingsDialog_bellIcon::before {
    -webkit-mask-image: url(../../img/element-icons/notifications.d298b39.svg);
            mask-image: url(../../img/element-icons/notifications.d298b39.svg);
}
.mx_UserSettingsDialog_preferencesIcon::before {
    -webkit-mask-image: url(../../img/element-icons/settings/preference.82bfabd.svg);
            mask-image: url(../../img/element-icons/settings/preference.82bfabd.svg);
}
.mx_UserSettingsDialog_contactsIcon::before {
  -webkit-mask-image: url(../../img/beeper/contact16.618d890.svg);
          mask-image: url(../../img/beeper/contact16.618d890.svg);
}
.mx_UserSettingsDialog_sidebarIcon::before {
    -webkit-mask-image: url(../../img/element-icons/settings/sidebar.bad60e6.svg);
            mask-image: url(../../img/element-icons/settings/sidebar.bad60e6.svg);
}
.mx_UserSettingsDialog_securityIcon::before {
    -webkit-mask-image: url(../../img/element-icons/security.66f2fa6.svg);
            mask-image: url(../../img/element-icons/security.66f2fa6.svg);
}
.mx_UserSettingsDialog_helpIcon::before {
    -webkit-mask-image: url(../../img/element-icons/settings/help.68b703f.svg);
            mask-image: url(../../img/element-icons/settings/help.68b703f.svg);
}
.mx_UserSettingsDialog_labsIcon::before {
    -webkit-mask-image: url(../../img/element-icons/settings/lab-flags.6fbe5e2.svg);
            mask-image: url(../../img/element-icons/settings/lab-flags.6fbe5e2.svg);
}
.mx_UserSettingsDialog_mjolnirIcon::before {
    -webkit-mask-image: url(../../img/element-icons/room/composer/emoji.52d7369.svg);
            mask-image: url(../../img/element-icons/room/composer/emoji.52d7369.svg);
}
.mx_UserSettingsDialog_flairIcon::before {
    -webkit-mask-image: url(../../img/element-icons/settings/flair.4227a88.svg);
            mask-image: url(../../img/element-icons/settings/flair.4227a88.svg);
}
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_WidgetCapabilitiesPromptDialog .text-muted {
        font-size: 1.2rem;
    }
.mx_WidgetCapabilitiesPromptDialog .mx_Dialog_content {
        margin-bottom: 16px;
    }
.mx_WidgetCapabilitiesPromptDialog .mx_WidgetCapabilitiesPromptDialog_cap {
        margin-top: 20px;
        font-size: 1.5rem;
        line-height: 1.5rem;
    }
.mx_WidgetCapabilitiesPromptDialog .mx_WidgetCapabilitiesPromptDialog_cap .mx_WidgetCapabilitiesPromptDialog_byline {
            color: #b9bec6;
            margin-left: 26px;
            font-size: 1.2rem;
            line-height: 1.2rem;
        }
.mx_WidgetCapabilitiesPromptDialog .mx_Dialog_buttons {
        margin-top: 40px;
    }
.mx_WidgetCapabilitiesPromptDialog .mx_SettingsFlag {
        line-height: calc(1.4rem + 7px + 7px);
        color: #b9bec6;
        font-size: 1.2rem;
    }
.mx_WidgetCapabilitiesPromptDialog .mx_SettingsFlag .mx_ToggleSwitch {
            display: inline-block;
            vertical-align: middle;
            margin-right: 8px;
            width: 3.2rem;
            height: 1.5rem;
        }
.mx_WidgetCapabilitiesPromptDialog .mx_SettingsFlag .mx_ToggleSwitch.mx_ToggleSwitch_on > .mx_ToggleSwitch_ball {
                left: calc(100% - 1.5rem);
            }
.mx_WidgetCapabilitiesPromptDialog .mx_SettingsFlag .mx_ToggleSwitch .mx_ToggleSwitch_ball {
                width: 1.5rem;
                height: 1.5rem;
                border-radius: 1.5rem;
            }
.mx_WidgetCapabilitiesPromptDialog .mx_SettingsFlag .mx_SettingsFlag_label {
            display: inline-block;
            vertical-align: middle;
        }
/*
Copyright 2019 Travis Ralston

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_WidgetOpenIDPermissionsDialog .mx_SettingsFlag .mx_ToggleSwitch {
        display: inline-block;
        vertical-align: middle;
        margin-right: 8px;
    }
.mx_WidgetOpenIDPermissionsDialog .mx_SettingsFlag .mx_SettingsFlag_label {
        display: inline-block;
        vertical-align: middle;
    }
/*
Copyright 2018, 2019, 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AccessSecretStorageDialog_reset {
    position: relative;
    padding-left: 24px;
    margin-top: 7px;
}
.mx_AccessSecretStorageDialog_reset::before {
        content: "";
        display: inline-block;
        position: absolute;
        height: 16px;
        width: 16px;
        left: 0;
        top: 2px;
        background-image: url(../../img/element-icons/warning-badge.713e1ca.svg);
        background-size: contain;
    }
.mx_AccessSecretStorageDialog_reset .mx_AccessSecretStorageDialog_reset_link {
        color: #FF5B55;
    }
.mx_AccessSecretStorageDialog_titleWithIcon::before {
    content: '';
    display: inline-block;
    width: 24px;
    height: 24px;
    margin-right: 8px;
    position: relative;
    top: 5px;
    background-color: #f0f0f1;
}
.mx_AccessSecretStorageDialog_resetBadge::before {
    background-image: url(../../img/element-icons/warning-badge.713e1ca.svg);
    background-size: 24px;
    background-color: transparent;
}
.mx_AccessSecretStorageDialog_secureBackupTitle::before {
    -webkit-mask-image: url(../../img/feather-customised/secure-backup.329cb1c.svg);
            mask-image: url(../../img/feather-customised/secure-backup.329cb1c.svg);
}
.mx_AccessSecretStorageDialog_securePhraseTitle::before {
    -webkit-mask-image: url(../../img/feather-customised/secure-phrase.a9d3725.svg);
            mask-image: url(../../img/feather-customised/secure-phrase.a9d3725.svg);
}
.mx_AccessSecretStorageDialog_keyStatus {
    height: 30px;
}
.mx_AccessSecretStorageDialog_passPhraseInput {
    width: 300px;
    border: 1px solid #4958F5;
    border-radius: 5px;
}
.mx_AccessSecretStorageDialog_recoveryKeyEntry {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.mx_AccessSecretStorageDialog_recoveryKeyEntry_textInput {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
}
.mx_AccessSecretStorageDialog_recoveryKeyEntry_entryControlSeparatorText {
    margin: 16px;
}
.mx_AccessSecretStorageDialog_recoveryKeyFeedback::before {
        content: "";
        display: inline-block;
        vertical-align: bottom;
        width: 20px;
        height: 20px;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: 20px;
                mask-size: 20px;
        margin-right: 5px;
    }
.mx_AccessSecretStorageDialog_recoveryKeyFeedback_valid {
    color: #4958F5;
}
.mx_AccessSecretStorageDialog_recoveryKeyFeedback_valid::before {
        -webkit-mask-image: url(../../img/feather-customised/check.5745b4e.svg);
                mask-image: url(../../img/feather-customised/check.5745b4e.svg);
        background-color: #4958F5;
    }
.mx_AccessSecretStorageDialog_recoveryKeyFeedback_invalid {
    color: #FF5B55;
}
.mx_AccessSecretStorageDialog_recoveryKeyFeedback_invalid::before {
        -webkit-mask-image: url(../../img/feather-customised/x.9662221.svg);
                mask-image: url(../../img/feather-customised/x.9662221.svg);
        background-color: #FF5B55;
    }
.mx_AccessSecretStorageDialog_recoveryKeyEntry_fileInput {
    display: none;
}
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CreateCrossSigningDialog {
    width: 560px;
}
.mx_CreateCrossSigningDialog details .mx_AccessibleButton {
        margin: 1em 0;
    }
.mx_CreateCrossSigningDialog .mx_Dialog_title {
    /* TODO: Consider setting this for all dialog titles. */
    margin-bottom: 1em;
}
/*
Copyright 2018 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CreateKeyBackupDialog .mx_Dialog_title {
    /* TODO: Consider setting this for all dialog titles. */
    margin-bottom: 1em;
}
.mx_CreateKeyBackupDialog_primaryContainer {
    /* FIXME: plinth colour in new theme(s). background-color: $accent; */
    padding: 20px;
}
.mx_CreateKeyBackupDialog_primaryContainer::after {
    content: "";
    clear: both;
    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;
        -ms-flex: none;
            flex: none;
    width: 250px;
    border: 1px solid #4958F5;
    border-radius: 5px;
    padding: 10px;
    margin-bottom: 1em;
}
.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 {
    width: 262px;
    padding: 20px;
    color: #888;
    background-color: #424650;
    margin-right: 12px;
}
.mx_CreateKeyBackupDialog_recoveryKeyButtons {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -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;
    }
/*
Copyright 2018 New Vector Ltd
Copyright 2019, 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CreateSecretStorageDialog {
    width: 560px;
}
.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;
        min-width: 0;
        font-weight: 600;
    }
.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 {
    /* TODO: Consider setting this for all dialog titles. */
    margin-bottom: 1em;
}
.mx_CreateSecretStorageDialog_titleWithIcon::before {
    content: '';
    display: inline-block;
    width: 24px;
    height: 24px;
    margin-right: 8px;
    position: relative;
    top: 5px;
    background-color: #f0f0f1;
}
.mx_CreateSecretStorageDialog_secureBackupTitle::before {
    -webkit-mask-image: url(../../img/feather-customised/secure-backup.329cb1c.svg);
            mask-image: url(../../img/feather-customised/secure-backup.329cb1c.svg);
}
.mx_CreateSecretStorageDialog_securePhraseTitle::before {
    -webkit-mask-image: url(../../img/feather-customised/secure-phrase.a9d3725.svg);
            mask-image: url(../../img/feather-customised/secure-phrase.a9d3725.svg);
}
.mx_CreateSecretStorageDialog_centeredTitle, .mx_CreateSecretStorageDialog_centeredBody {
    text-align: center;
}
.mx_CreateSecretStorageDialog_primaryContainer {
    /* FIXME: plinth colour in new theme(s). background-color: $accent; */
    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 {
    content: "";
    clear: both;
    display: block;
}
.mx_CreateSecretStorageDialog_primaryContainer .mx_StyledRadioButton {
    margin-bottom: 16px;
    padding: 11px;
}
.mx_CreateSecretStorageDialog_optionTitle {
    color: #f0f0f1;
    font-weight: 600;
    font-size: 1.8rem;
    padding-bottom: 10px;
}
.mx_CreateSecretStorageDialog_optionIcon {
    display: inline-block;
    width: 24px;
    height: 24px;
    margin-right: 8px;
    position: relative;
    top: 5px;
    background-color: #f0f0f1;
}
.mx_CreateSecretStorageDialog_optionIcon_securePhrase {
    -webkit-mask-image: url(../../img/feather-customised/secure-phrase.a9d3725.svg);
            mask-image: url(../../img/feather-customised/secure-phrase.a9d3725.svg);
}
.mx_CreateSecretStorageDialog_optionIcon_secureBackup {
    -webkit-mask-image: url(../../img/feather-customised/secure-backup.329cb1c.svg);
            mask-image: url(../../img/feather-customised/secure-backup.329cb1c.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: 0px;
}
.mx_CreateSecretStorageDialog_passPhraseMatch {
    width: 200px;
    margin-left: 20px;
}
.mx_CreateSecretStorageDialog_recoveryKeyContainer {
    display: inline-block;
}
.mx_CreateSecretStorageDialog_recoveryKey {
    font-weight: bold;
    text-align: center;
    padding: 8px 12px;
    color: #888;
    background-color: #424650;
    border-radius: 8px;
    word-spacing: 1em;
    margin-bottom: 12px;
    font-size: 18px;
}
.mx_CreateSecretStorageDialog_recoveryKeyButtons {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    grid-gap: 16px;
    gap: 16px;
}
.mx_CreateSecretStorageDialog_recoveryKeyButtons_copyBtn {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
.mx_CreateSecretStorageDialog_recoveryKeyCopyButtonText {
    overflow-y: hidden;
}
.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 {
    width: 20px;
    height: 20px;
}
/*
Copyright 2018 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_KeyBackupFailedDialog .mx_Dialog_title {
    margin-bottom: 32px;
}
.mx_KeyBackupFailedDialog_title {
    position: relative;
    padding-left: 45px;
    padding-bottom: 10px;
}
.mx_KeyBackupFailedDialog_title::before {
        -webkit-mask: url(../../img/e2e/lock-warning-filled.993fb6c.svg);
                mask: url(../../img/e2e/lock-warning-filled.993fb6c.svg);
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        background-color: #f0f0f1;
        content: "";
        position: absolute;
        top: -6px;
        right: 0;
        bottom: 0;
        left: 0;
    }
.mx_KeyBackupFailedDialog .mx_Dialog_buttons {
    margin-top: 36px;
}
/*
Copyright 2018 New Vector Ltd
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RestoreKeyBackupDialog_keyStatus {
    height: 30px;
}
.mx_RestoreKeyBackupDialog_primaryContainer {
    /* FIXME: plinth colour in new theme(s). background-color: $accent; */
    padding: 20px;
}
.mx_RestoreKeyBackupDialog_passPhraseInput, .mx_RestoreKeyBackupDialog_recoveryKeyInput {
    width: 300px;
    border: 1px solid #4958F5;
    border-radius: 5px;
    padding: 10px;
}
.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; /* Empirically measured */
}
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_NetworkDropdown {
    height: 32px;
    position: relative;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    padding-right: 32px;
    margin-left: auto;
    margin-right: 9px;
    margin-top: 12px;
}
.mx_NetworkDropdown .mx_AccessibleButton {
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
    }
.mx_NetworkDropdown_menu {
    min-width: 204px;
    margin: 0;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    border-radius: 4px;
    background-color: hsla(216, 21%, 14%, 1);
    max-height: calc(100vh - 20px);
    overflow-y: auto;
}
.mx_NetworkDropdown_menu_network {
    font-weight: bold;
}
.mx_NetworkDropdown_server {
    padding: 12px 0;
    border-bottom: 1px solid rgba(208, 209, 216, 0.6);
}
.mx_NetworkDropdown_server .mx_NetworkDropdown_server_title {
        padding: 0 10px;
        font-size: 1.5rem;
        font-weight: 600;
        line-height: 2.0rem;
        margin-bottom: 4px;
        position: relative;
    }
.mx_NetworkDropdown_server .mx_NetworkDropdown_server_title .mx_AccessibleButton {
            position: absolute;
            display: inline;
            right: 10px;
            height: 16px;
            width: 16px;
            margin-top: 2px;
        }
.mx_NetworkDropdown_server .mx_NetworkDropdown_server_title .mx_AccessibleButton::after {
                content: "";
                position: absolute;
                width: 16px;
                height: 16px;
                -webkit-mask-repeat: no-repeat;
                        mask-repeat: no-repeat;
                -webkit-mask-position: center;
                        mask-position: center;
                -webkit-mask-size: contain;
                        mask-size: contain;
                -webkit-mask-image: url(../../img/feather-customised/x.9662221.svg);
                        mask-image: url(../../img/feather-customised/x.9662221.svg);
                background-color: #FF5B55;
            }
.mx_NetworkDropdown_server .mx_NetworkDropdown_server_subtitle {
        padding: 0 10px;
        font-size: 1.0rem;
        line-height: 1.4rem;
        margin-top: -4px;
        margin-bottom: 4px;
        color: #b9bec6;
    }
.mx_NetworkDropdown_server .mx_NetworkDropdown_server_network {
        font-size: 1.2rem;
        line-height: 1.6rem;
        padding: 4px 10px;
        cursor: default;
        position: relative;

        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
.mx_NetworkDropdown_server .mx_NetworkDropdown_server_network[aria-checked=true]::after {
            content: "";
            position: absolute;
            width: 16px;
            height: 16px;
            right: 10px;
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            -webkit-mask-position: center;
                    mask-position: center;
            -webkit-mask-size: contain;
                    mask-size: contain;
            -webkit-mask-image: url(../../img/feather-customised/check.5745b4e.svg);
                    mask-image: url(../../img/feather-customised/check.5745b4e.svg);
            background-color: #4958F5;
        }
.mx_NetworkDropdown_server_add:hover, .mx_NetworkDropdown_server_network:hover {
        background-color: #454854;
    }
.mx_NetworkDropdown_server_add {
    padding: 16px 10px 16px 32px;
    position: relative;
    border-radius: 0 0 4px 4px;
}
.mx_NetworkDropdown_server_add::before {
        content: "";
        position: absolute;
        width: 16px;
        height: 16px;
        left: 7px;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: contain;
                mask-size: contain;
        -webkit-mask-image: url(../../img/feather-customised/plus.38ae979.svg);
                mask-image: url(../../img/feather-customised/plus.38ae979.svg);
        background-color: #b9bec6;
    }
.mx_NetworkDropdown_handle {
    position: relative;
}
.mx_NetworkDropdown_handle::after {
        content: "";
        position: absolute;
        width: 26px;
        height: 26px;
        right: -27.5px;
        top: -3px;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: contain;
                mask-size: contain;
        -webkit-mask-image: url(../../img/feather-customised/chevron-down-thin.f9a2477.svg);
                mask-image: url(../../img/feather-customised/chevron-down-thin.f9a2477.svg);
        background-color: #f0f0f1;
    }
.mx_NetworkDropdown_handle .mx_NetworkDropdown_handle_server {
        color: #b9bec6;
        font-size: 1.2rem;
    }
.mx_NetworkDropdown_dialog .mx_Dialog {
    width: 45vw;
}
/*
Copyright 2017 Vector Creations Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AccessibleButton {
    cursor: default;
    -webkit-app-region: no-drag;
}
.mx_AccessibleButton_disabled {
    cursor: default;
}
.mx_AccessibleButton_hasKind {
    padding: 7px 18px;
    text-align: center;
    border-radius: 8px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    font-size: 1.4rem;
    border: none;
}
.mx_AccessibleButton_kind_primary {
    color: #ffffff;
    background-color: #4958F5;
    border: 1px solid #4958F5;
    font-weight: 600;
}
.mx_AccessibleButton_kind_primary_outline {
    color: #4958F5;
    background-color: transparent;
    border: 1px solid #4958F5;
    font-weight: 600;
}
.mx_AccessibleButton_kind_secondary {
    color: #4958F5;
    font-weight: 600;
}
.mx_AccessibleButton_kind_primary.mx_AccessibleButton_disabled, .mx_AccessibleButton_kind_primary_outline.mx_AccessibleButton_disabled {
    opacity: 0.4;
}
.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_primary_sm {
    padding: 5px 12px;
    color: #ffffff;
    background-color: #4958F5;
}
.mx_AccessibleButton_kind_primary_sm.mx_AccessibleButton_disabled {
    opacity: 0.4;
}
.mx_AccessibleButton_kind_danger {
    color: #ffffff;
    background-color: #FF5B55;
}
.mx_AccessibleButton_kind_danger_outline {
    color: #FF5B55;
    background-color: transparent;
    border: 1px solid #FF5B55;
}
.mx_AccessibleButton_kind_danger.mx_AccessibleButton_disabled {
    color: #ffffff;
    background-color: #f5b6bb;
}
.mx_AccessibleButton_kind_danger_outline.mx_AccessibleButton_disabled {
    color: #f5b6bb;
    border-color: #f5b6bb;
}
.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_danger_sm {
    padding: 5px 12px;
    color: #ffffff;
    background-color: #FF5B55;
}
.mx_AccessibleButton_kind_danger_sm.mx_AccessibleButton_disabled {
    color: #ffffff;
    background-color: #f5b6bb;
}
.mx_AccessibleButton_kind_link {
    color: #4958F5;
}
.mx_AccessibleButton_kind_link.mx_AccessibleButton_disabled {
    opacity: 0.4;
}
.mx_AccessibleButton_kind_link_inline {
    color: #4958F5;
    font-size: inherit;
    padding: 0 2px;
}
.mx_AccessibleButton_kind_link_inline.mx_AccessibleButton_disabled {
    opacity: 0.4;
}
.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_link_sm {
    padding: 5px 12px;
    color: #4958F5;
}
.mx_AccessibleButton_kind_link_sm.mx_AccessibleButton_disabled {
    opacity: 0.4;
}
.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_confirm_sm {
    background-color: #4958F5;
}
.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_confirm_sm::before {
        -webkit-mask-image: url(../../img/feather-customised/check.5745b4e.svg);
                mask-image: url(../../img/feather-customised/check.5745b4e.svg);
    }
.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_cancel_sm {
    background-color: #FF5B55;
}
.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_cancel_sm::before {
        -webkit-mask-image: url(../../img/feather-customised/x.9662221.svg);
                mask-image: url(../../img/feather-customised/x.9662221.svg);
    }
.mx_AccessibleButton_kind_confirm_sm, .mx_AccessibleButton_kind_cancel_sm {
    padding: 0px;
    width: 16px;
    height: 16px;
    border-radius: 100%;
    position: relative;
    display: block;
}
.mx_AccessibleButton_kind_confirm_sm::before, .mx_AccessibleButton_kind_cancel_sm::before {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: #ffffff;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: 80%;
                mask-size: 80%;
    }
/*
Copyright 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AddressSelector {
    position: absolute;
    background-color: hsla(216, 21%, 14%, 1);
    width: 485px;
    max-height: 116px;
    overflow-y: auto;
    border-radius: 3px;
    border: solid 1px #4958F5;
    cursor: default;
    z-index: 1;
}
.mx_AddressSelector.mx_AddressSelector_empty {
    display: none;
}
.mx_AddressSelector_addressListElement .mx_AddressTile {
    background-color: hsla(216, 21%, 14%, 1);
    border: solid 1px hsla(216, 21%, 14%, 1);
}
.mx_AddressSelector_addressListElement.mx_AddressSelector_selected {
    background-color: #25262d;
}
.mx_AddressSelector_addressListElement.mx_AddressSelector_selected .mx_AddressTile {
    background-color: #25262d;
    border: solid 1px #25262d;
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AddressTile {
    display: inline-block;
    border-radius: 3px;
    background-color: rgba(74, 73, 74, 0.1);
    border: solid 1px rgba(231, 231, 231, 0.2);
    line-height: 2.6rem;
    color: #f0f0f1;
    font-size: 1.4rem;
    font-weight: normal;
    margin-right: 4px;
}
.mx_AddressTile.mx_AddressTile_error {
    background-color: rgba(255, 0, 100, 0.1);
    color: #FF5B55;
    border-color: #FF5B55;
}
.mx_AddressTile_network {
    display: inline-block;
    position: relative;
    padding-left: 2px;
    padding-right: 4px;
    vertical-align: middle;
}
.mx_AddressTile_avatar {
    display: inline-block;
    position: relative;
    padding-left: 2px;
    padding-right: 7px;
    vertical-align: middle;
}
.mx_AddressTile_mx {
    display: inline-block;
    margin: 0;
    border: 0;
    padding: 0;
}
.mx_AddressTile_name {
    display: inline-block;
    padding-right: 4px;
    font-weight: 600;
    overflow: hidden;
    height: 26px;
    vertical-align: middle;
}
.mx_AddressTile_name.mx_AddressTile_justified {
    width: 180px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    vertical-align: middle;
}
.mx_AddressTile_id {
    display: inline-block;
    padding-right: 11px;
}
.mx_AddressTile_id.mx_AddressTile_justified {
    width: 200px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    vertical-align: middle;
}
.mx_AddressTile_unknownMx {
    display: inline-block;
    font-weight: 600;
    padding-right: 11px;
}
.mx_AddressTile_unknownMxl.mx_AddressTile_justified {
    width: 380px; /* name + id width */
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    vertical-align: middle;
}
.mx_AddressTile_email {
    display: inline-block;
    font-weight: 600;
    padding-right: 11px;
}
.mx_AddressTile_email.mx_AddressTile_justified {
    width: 200px; /* same as id width */
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    vertical-align: middle;
}
.mx_AddressTile_unknown {
    display: inline-block;
    padding-right: 11px;
}
.mx_AddressTile_unknown.mx_AddressTile_justified {
    width: 380px; /* name + id width */
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    vertical-align: middle;
}
.mx_AddressTile_dismiss {
    display: inline-block;
    padding-right: 11px;
    padding-left: 1px;
    cursor: default;
}
.mx_AddressTile_dismiss object {
    pointer-events: none;
}
.AppControls {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    max-height: 32px;
    -webkit-app-region: no-drag;
}
.AppControls-button {
    padding: 0 5px;
}
.AppControls-button, .AppControls-button svg {
    height: 100%;
}
.AppControls-button svg {
    width: 36px;
    height: 32px;
}
.AppControls-button:hover {
    background-color: #ebecee;
    color: #000;
}
.AppControls-close:hover {
    color: #fff;
    background-color: #d71526;
}
.AppControls-macplaceholder {
    display: block;
    width: 62px;
}
.AppControls-macbutton {
    margin: 0 3px;
}
.AppControls-macclose {
    background: #ff5c5c;
    font-size: 9pt;
    width: 11px;
    height: 11px;
    border: 1px solid #e33e41;
    border-radius: 50%;
    display: inline-block;
}
.AppControls-macclose:active {
    background: #c14645;
    border: 1px solid #b03537;
}
.AppControls-macclose:active .AppControls-macclosebutton {
    color: #4e0002;
}
.AppControls-macclosebutton {
    color: #820005;
    visibility: hidden;
    cursor: default;
}
.AppControls-macminimize {
    background: #ffbd4c;
    font-size: 9pt;
    line-height: 11px;
    margin-left: 4px;
    width: 11px;
    height: 11px;
    border: 1px solid #e09e3e;
    border-radius: 50%;
    display: inline-block;
}
.AppControls-macminimize:active {
    background: #c08e38;
    border: 1px solid #af7c33;
}
.AppControls-macminimize:active .AppControls-macminimizebutton {
    color: #5a2607;
}
.AppControls-macminimizebutton {
    color: #9a5518;
    visibility: hidden;
    cursor: default;
}
.AppControls-maczoom {
    background: #00ca56;
    font-size: 9pt;
    line-height: 11px;
    margin-left: 6px;
    width: 11px;
    height: 11px;
    border: 1px solid #14ae46;
    border-radius: 50%;
    display: inline-block;
}
.AppControls-maczoom:active {
    background: #029740;
    border: 1px solid #128435;
}
.AppControls-maczoom:active .AppControls-maczoombutton {
    color: #003107;
}
.AppControls-maczoombutton {
    color: #006519;
    visibility: hidden;
    cursor: default;
}
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_DesktopBuildsNotice {
    text-align: center;
    padding: 0 16px;
}
.mx_DesktopBuildsNotice > * {
        vertical-align: middle;
    }
.mx_DesktopBuildsNotice > img {
        margin-right: 8px;
    }
/*
Copyright 2021 Šimon Brandner <simon.bra.ag@gmail.com>

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.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 {
            width: 50%;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -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 {
                margin: 4px;
                padding: 4px;
                border-width: 2px;
                border-radius: 8px;
                border-style: solid;
                border-color: transparent;
            }
.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:hover, .mx_desktopCapturerSourcePicker .mx_desktopCapturerSourcePicker_tab .mx_desktopCapturerSourcePicker_source .mx_desktopCapturerSourcePicker_source_thumbnail:focus {
                    border-color: #4958F5;
                }
.mx_desktopCapturerSourcePicker .mx_desktopCapturerSourcePicker_tab .mx_desktopCapturerSourcePicker_source .mx_desktopCapturerSourcePicker_source_name {
                margin: 0 4px;
                white-space: nowrap;
                text-overflow: ellipsis;
                overflow: hidden;
            }
/*
Copyright 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_DirectorySearchBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-left: 9px;
    padding-right: 9px;
}
.mx_DirectorySearchBox_joinButton {
    display: table-cell;
    padding: 3px;
    padding-left: 10px;
    padding-right: 10px;
    background-color: #25262d;
    border-radius: 3px;
    background-image: url(../../img/icon-return.cb24475.svg);
    background-position: 8px 70%;
    background-repeat: no-repeat;
    text-indent: 18px;
    font-weight: 600;
    font-size: 1.2rem;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    cursor: default;
}
.mx_DirectorySearchBox_clear {
    background-color: #FF5B55;
    -webkit-mask: url(../../img/cancel.4b9715b.svg);
            mask: url(../../img/cancel.4b9715b.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-size: 10px;
            mask-size: 10px;
    width: 15px;
    height: 15px;
    cursor: default;
}
/*
Copyright 2017 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_Dropdown {
    position: relative;
    color: #f0f0f1;
}
.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;
    position: relative;
    border-radius: 12px;
    border: 2px solid rgba(231, 231, 231, 0.2);
    font-size: 1.2rem;
    -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: #238CF5;
}
/* Disable dropdown highlight on focus */
.mx_Dropdown_input.mx_AccessibleButton:focus {
    -webkit-filter: none;
            filter: none;
}
.mx_Dropdown_arrow {
    width: 10px;
    height: 6px;
    padding-right: 9px;
    -webkit-mask: url(../../img/feather-customised/dropdown-arrow.1a22ebc.svg);
            mask: url(../../img/feather-customised/dropdown-arrow.1a22ebc.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    background: #f0f0f1;
}
.mx_Dropdown_option {
    height: 35px;
    line-height: 3.5rem;
    padding-left: 8px;
    padding-right: 8px;
}
.mx_Dropdown_input > .mx_Dropdown_option {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -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 img, .mx_Dropdown_option .mx_Dropdown_option_emoji {
    margin: 5px;
    width: 16px;
    vertical-align: middle;
}
.mx_Dropdown_option_emoji {
    font-size: 1.6rem;
    line-height: 1.6rem;
}
input.mx_Dropdown_option, input.mx_Dropdown_option:focus {
    font-weight: normal;
    border: 0;
    padding-top: 0;
    padding-bottom: 0;
    width: 60%;
}
.mx_Dropdown_menu {
    position: absolute;
    left: -1px;
    right: -1px;
    top: 100%;
    z-index: 2;
    margin: 0;
    padding: 0px;
    border-radius: 4px;
    border: 1px solid #238CF5;
    background-color: hsla(216, 21%, 14%, 1);
    max-height: 200px;
    overflow-y: auto;
}
.mx_Dropdown_menu .mx_Dropdown_option {
    height: auto;
    min-height: 35px;
}
.mx_Dropdown_menu .mx_Dropdown_option_highlight {
    background-color: #32343E;
}
.mx_Dropdown_searchPrompt {
    font-weight: normal;
    margin-left: 5px;
    margin-bottom: 5px;
}
/*
Copyright 2017, 2019 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_EditableItemList {
    margin-top: 12px;
    margin-bottom: 10px;
}
.mx_EditableItem {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 5px;
}
.mx_EditableItem_delete {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
    margin-right: 5px;
    cursor: default;
    vertical-align: middle;
    width: 14px;
    height: 14px;
    -webkit-mask-image: url(../../img/feather-customised/cancel.23c2689.svg);
            mask-image: url(../../img/feather-customised/cancel.23c2689.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    background-color: #FF5B55;
    -webkit-mask-size: 100%;
            mask-size: 100%;
}
.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;
    width: calc(100% - 14px);
    overflow-x: hidden;
    text-overflow: ellipsis;
}
.mx_EditableItemList_label {
    margin-bottom: 5px;
}
/*
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ErrorBoundary {
    width: 100%;
    height: 100%;
    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;
    background-color: #3f4047;
}
.mx_ErrorBoundary_body {
    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: 400px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.mx_ErrorBoundary_body .mx_AccessibleButton {
        margin-top: 5px;
    }
/*
Copyright 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_EventListSummary {
    position: relative;
}
.mx_TextualEvent.mx_EventListSummary_summary {
    font-size: 1.4rem;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
}
.mx_EventListSummary_avatars {
    display: inline-block;
    margin-right: 8px;
    padding-top: 8px;
    line-height: 1.2rem;
}
.mx_EventListSummary_avatars .mx_BaseAvatar {
    margin-right: -4px;
    cursor: default;
}
.mx_EventListSummary_toggle {
    color: #4958F5;
    cursor: default;
    float: right;
    margin-right: 10px;
    margin-top: 8px;
}
.mx_EventListSummary_line {
    border-bottom: 1px solid #404040;
    margin-left: 63px;
    line-height: 3.0rem;
}
.mx_MatrixChat_useCompactLayout .mx_EventListSummary {
        font-size: 1.3rem;
    }
.mx_MatrixChat_useCompactLayout .mx_EventListSummary .mx_EventTile_line {
            line-height: 2.0rem;
        }
.mx_MatrixChat_useCompactLayout .mx_EventListSummary_line {
        line-height: 2.2rem;
    }
.mx_MatrixChat_useCompactLayout .mx_EventListSummary_toggle {
        margin-top: 3px;
    }
.mx_MatrixChat_useCompactLayout .mx_TextualEvent.mx_EventListSummary_summary {
        font-size: 1.3rem;
    }
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
/* TODO: Consider unifying with general input styles in _light.scss */
.mx_Field {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    min-width: 0;
    position: relative;
    margin: 1.5em 0 1em 0;
    border-radius: 4px;
    -webkit-transition: border-color 0.25s;
    transition: border-color 0.25s;
    border: 1px solid rgba(231, 231, 231, 0.2);
}
.mx_Field_prefix {
    border-right: 1px solid rgba(231, 231, 231, 0.2);
}
.mx_Field_postfix {
    border-left: 1px solid rgba(231, 231, 231, 0.2);
}
.mx_Field input, .mx_Field select, .mx_Field textarea {
    font-family: inherit;
    font-weight: normal;
    font-size: 1.4rem;
    border: none;
    border-radius: 4px;
    padding: 8px 9px;
    color: #f0f0f1;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    min-width: 0;
}
.mx_Field select {
    -moz-appearance: none;
    -webkit-appearance: none;
}
.mx_Field_select::before {
    content: "";
    position: absolute;
    top: 15px;
    right: 10px;
    width: 10px;
    height: 6px;
    -webkit-mask: url(../../img/feather-customised/dropdown-arrow.1a22ebc.svg);
            mask: url(../../img/feather-customised/dropdown-arrow.1a22ebc.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    background-color: #f0f0f1;
    z-index: 1;
    pointer-events: none;
}
.mx_Field:focus-within {
    border-color: #238CF5;
}
.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 {
    -webkit-transition: color 0.25s ease-in 0s;
    transition: color 0.25s ease-in 0s;
    color: transparent;
}
.mx_Field input::-moz-placeholder, .mx_Field textarea::-moz-placeholder {
    -moz-transition: color 0.25s ease-in 0s;
    transition: color 0.25s ease-in 0s;
    color: transparent;
}
.mx_Field input:-ms-input-placeholder, .mx_Field textarea:-ms-input-placeholder {
    -ms-transition: color 0.25s ease-in 0s;
    transition: color 0.25s ease-in 0s;
    color: transparent;
}
.mx_Field input::-ms-input-placeholder, .mx_Field textarea::-ms-input-placeholder {
    -ms-transition: color 0.25s ease-in 0s;
    transition: color 0.25s ease-in 0s;
    color: transparent;
}
.mx_Field input::placeholder, .mx_Field textarea::placeholder {
    -webkit-transition: color 0.25s ease-in 0s;
    transition: color 0.25s ease-in 0s;
    color: transparent;
}
.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 {
    -webkit-transition: color 0.25s ease-in 0.1s;
    transition: color 0.25s ease-in 0.1s;
    color: #888;
}
.mx_Field input:placeholder-shown:focus::-moz-placeholder, .mx_Field textarea:placeholder-shown:focus::-moz-placeholder, .mx_Field.mx_Field_placeholderIsHint input::-moz-placeholder {
    -moz-transition: color 0.25s ease-in 0.1s;
    transition: color 0.25s ease-in 0.1s;
    color: #888;
}
.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 {
    -ms-transition: color 0.25s ease-in 0.1s;
    transition: color 0.25s ease-in 0.1s;
    color: #888;
}
.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 {
    -ms-transition: color 0.25s ease-in 0.1s;
    transition: color 0.25s ease-in 0.1s;
    color: #888;
}
.mx_Field input:-moz-placeholder-shown:focus::placeholder, .mx_Field textarea:-moz-placeholder-shown:focus::placeholder {
    -moz-transition: color 0.25s ease-in 0.1s;
    transition: color 0.25s ease-in 0.1s;
    color: #888;
}
.mx_Field input:-ms-input-placeholder:focus::placeholder, .mx_Field textarea:-ms-input-placeholder:focus::placeholder {
    -ms-transition: color 0.25s ease-in 0.1s;
    transition: color 0.25s ease-in 0.1s;
    color: #888;
}
.mx_Field input:placeholder-shown:focus::placeholder, .mx_Field textarea:placeholder-shown:focus::placeholder, .mx_Field.mx_Field_placeholderIsHint input::placeholder {
    -webkit-transition: color 0.25s ease-in 0.1s;
    transition: color 0.25s ease-in 0.1s;
    color: #888;
}
.mx_Field label {
    -webkit-transition:
        font-size 0.25s ease-out 0.1s,
        color 0.25s ease-out 0.1s,
        top 0.25s ease-out 0.1s,
        margin-left 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,
        top 0.25s ease-out 0.1s,
        margin-left 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,
        top 0.25s ease-out 0.1s,
        margin-left 0.25s ease-out 0.1s,
        transform 0.25s ease-out 0.1s;
    transition:
        font-size 0.25s ease-out 0.1s,
        color 0.25s ease-out 0.1s,
        top 0.25s ease-out 0.1s,
        margin-left 0.25s ease-out 0.1s,
        transform 0.25s ease-out 0.1s,
        -webkit-transform 0.25s ease-out 0.1s;
    color: #f0f0f1;
    background-color: transparent;
    font-size: 1.4rem;
    -webkit-transform: translateY(0);
            transform: translateY(0);
    position: absolute;
    left: 0px;
    margin: 7px 8px;
    padding: 2px;
    pointer-events: none;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: calc(100% - 20px);
}
.mx_Field input:not(:-moz-placeholder-shown) + label, .mx_Field textarea:not(:-moz-placeholder-shown) + label {
    -moz-transition:
        font-size 0.25s ease-out 0s,
        color 0.25s ease-out 0s,
        transform 0.25s ease-out 0s,
        top 0.25s ease-out 0s,
        margin-left 0.25s ease-out 0.1s,
        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,
        top 0.25s ease-out 0s,
        margin-left 0.25s ease-out 0.1s,
        background-color 0.25s ease-out 0s;
    font-size: 1.0rem;
    top: -25px;
    margin-left: 0;
    padding: 0 2px 0 0;
    pointer-events: initial;
}
.mx_Field input:not(:-ms-input-placeholder) + label, .mx_Field textarea:not(:-ms-input-placeholder) + label {
    -ms-transition:
        font-size 0.25s ease-out 0s,
        color 0.25s ease-out 0s,
        transform 0.25s ease-out 0s,
        top 0.25s ease-out 0s,
        margin-left 0.25s ease-out 0.1s,
        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,
        top 0.25s ease-out 0s,
        margin-left 0.25s ease-out 0.1s,
        background-color 0.25s ease-out 0s;
    font-size: 1.0rem;
    top: -25px;
    margin-left: 0;
    padding: 0 2px 0 0;
    pointer-events: initial;
}
.mx_Field_labelAlwaysTopLeft label, .mx_Field select + label, .mx_Field input:focus + label, .mx_Field input:not(:placeholder-shown) + label, .mx_Field textarea:focus + label, .mx_Field textarea:not(:placeholder-shown) + label {
    -webkit-transition:
        font-size 0.25s ease-out 0s,
        color 0.25s ease-out 0s,
        top 0.25s ease-out 0s,
        margin-left 0.25s ease-out 0.1s,
        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,
        top 0.25s ease-out 0s,
        margin-left 0.25s ease-out 0.1s,
        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,
        top 0.25s ease-out 0s,
        margin-left 0.25s ease-out 0.1s,
        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,
        top 0.25s ease-out 0s,
        margin-left 0.25s ease-out 0.1s,
        background-color 0.25s ease-out 0s,
        -webkit-transform 0.25s ease-out 0s;
    font-size: 1.0rem;
    top: -25px;
    margin-left: 0;
    padding: 0 2px 0 0;
    pointer-events: initial;
}
.mx_Field input:focus + label, .mx_Field select:focus + label, .mx_Field textarea:focus + label {
    color: #238CF5;
}
.mx_Field select:disabled, .mx_Field select:disabled + label, .mx_Field input:disabled, .mx_Field input:disabled + label, .mx_Field textarea:disabled, .mx_Field textarea:disabled + label {
    color: #888;
    opacity: .5;
}
.mx_Field_valid.mx_Field, .mx_Field_valid.mx_Field:focus-within {
        border-color: #4958F5;
    }
.mx_Field_valid.mx_Field label, .mx_Field_valid.mx_Field:focus-within label {
        color: #4958F5;
    }
.mx_Field_invalid.mx_Field, .mx_Field_invalid.mx_Field:focus-within {
        border-color: #FF5B55;
    }
.mx_Field_invalid.mx_Field label, .mx_Field_invalid.mx_Field:focus-within label {
        color: #FF5B55;
    }
.mx_Field_tooltip {
    margin-top: -12px;
    margin-left: 4px;
    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: medium none currentColor;
    border: initial;
    border-radius: 0;
    border-radius: initial;
}
.mx_Field .mx_CountryDropdown {
    width: 7.8rem;
}
/*
Copyright 2017 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_InlineSpinner {
    display: inline;
}
.mx_InlineSpinner img, .mx_InlineSpinner_icon {
    margin: 0px 6px;
    vertical-align: -3px;
}
@-webkit-keyframes spin {
    from {
        -webkit-transform: rotateZ(0deg);
                transform: rotateZ(0deg);
    }
    to {
        -webkit-transform: rotateZ(360deg);
                transform: rotateZ(360deg);
    }
}
@keyframes spin {
    from {
        -webkit-transform: rotateZ(0deg);
                transform: rotateZ(0deg);
    }
    to {
        -webkit-transform: rotateZ(360deg);
                transform: rotateZ(360deg);
    }
}
.mx_InlineSpinner_icon {
    display: inline-block !important;
}
/*
Copyright 2019 - 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_InteractiveTooltip_wrapper {
    position: fixed;
    z-index: 10000;
}
.mx_InteractiveTooltip {
    border-radius: 8px;
    background-color: hsla(216, 21%, 14%, 1);
    color: #f0f0f1;
    position: absolute;
    z-index: 10001;
    -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%);
}
.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 {
    position: absolute;
    left: calc(50% - 8px);
    top: -8px;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-bottom: 8px solid hsla(216, 21%, 14%, 1);
    border-right: 8px solid transparent;
}
@supports ((-webkit-clip-path: polygon(0% 0%, 100% 100%, 0% 100%)) or (clip-path: polygon(0% 0%, 100% 100%, 0% 100%))) {
    .mx_InteractiveTooltip_chevron_top {
        height: 16px;
        width: 16px;
        background-color: inherit;
        border: none;
        -webkit-clip-path: polygon(0% 0%, 100% 100%, 0% 100%);
                clip-path: polygon(0% 0%, 100% 100%, 0% 100%);
        -webkit-transform: rotate(135deg);
                transform: rotate(135deg);
        border-radius: 0 0 0 3px;
        top: calc(-8px / 1.414);
    }
}
.mx_InteractiveTooltip_chevron_bottom {
    position: absolute;
    left: calc(50% - 8px);
    bottom: -8px;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-top: 8px solid hsla(216, 21%, 14%, 1);
    border-right: 8px solid transparent;
}
@supports ((-webkit-clip-path: polygon(0% 0%, 100% 100%, 0% 100%)) or (clip-path: polygon(0% 0%, 100% 100%, 0% 100%))) {
    .mx_InteractiveTooltip_chevron_bottom {
        height: 16px;
        width: 16px;
        background-color: inherit;
        border: none;
        -webkit-clip-path: polygon(0% 0%, 100% 100%, 0% 100%);
                clip-path: polygon(0% 0%, 100% 100%, 0% 100%);
        -webkit-transform: rotate(-45deg);
                transform: rotate(-45deg);
        border-radius: 0 0 0 3px;
        bottom: calc(-8px / 1.414);
    }
}
/*
Copyright 2019 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ManageIntegsButton_error {
    position: relative;
    float: right;
    cursor: not-allowed;
}
.mx_ManageIntegsButton_error img {
    position: absolute;
    right: -5px;
    top: -5px;
}
.mx_ManageIntegsButton_errorPopup {
    position: absolute;
    top: 110%;
    left: -275%;
    width: 550%;
    padding: 30%;
    font-size: 10pt;
    line-height: 1.5em;
    border-radius: 5px;
    background-color: #4958F5;
    color: #202127;
    text-align: center;
    z-index: 1000;
}
.mx_ManageIntegsButton_error .mx_ManageIntegsButton_errorPopup {
    display: none;
}
.mx_ManageIntegsButton_error:hover .mx_ManageIntegsButton_errorPopup {
    display: inline;
}
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MiniAvatarUploader {
    position: relative;
    width: -webkit-min-content;
    width: -moz-min-content;
    width: min-content;
}
.mx_MiniAvatarUploader .mx_Tooltip {
        display: inline-block;
        position: absolute;
        z-index: unset;
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        left: 72px;
        top: 0;
    }
.mx_MiniAvatarUploader .mx_MiniAvatarUploader_indicator {
        position: absolute;

        height: 26px;
        width: 26px;

        right: -6px;
        bottom: -6px;

        background-color: hsla(216, 21%, 14%, 1);
        border-radius: 50%;
        z-index: 1;
    }
.mx_MiniAvatarUploader .mx_MiniAvatarUploader_indicator .mx_MiniAvatarUploader_cameraIcon {
            height: 100%;
            width: 100%;

            background-color: #737D8C;
            -webkit-mask-position: center;
                    mask-position: center;
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            -webkit-mask-image: url(../../img/element-icons/camera.a81a395.svg);
                    mask-image: url(../../img/element-icons/camera.a81a395.svg);
            -webkit-mask-size: 16px;
                    mask-size: 16px;
            z-index: 2;
        }
.mx_MiniAvatarUploader_input {
    display: none;
}
/*
Copyright 2019 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_PowerSelector {
    width: 100%;
}
.mx_PowerSelector .mx_Field select, .mx_PowerSelector .mx_Field input {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}
/*
Copyright 2020, 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
progress.mx_ProgressBar {
    height: 6px;
    width: 60px;
    overflow: hidden;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    border: none;

    border-radius: 6px;
}
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: #4958F5;
}
progress.mx_ProgressBar::-moz-progress-bar {
        background-color: #4958F5;
    }
progress.mx_ProgressBar::-webkit-progress-value {
        background-color: #4958F5;
    }
progress.mx_ProgressBar {
    background-color: rgba(141,151,165, 0.2);
}
progress.mx_ProgressBar::-webkit-progress-bar {
        background-color: rgba(141,151,165, 0.2);
    }
progress.mx_ProgressBar ::-webkit-progress-value {
        -webkit-transition: width 1s;
        transition: width 1s;
    }
progress.mx_ProgressBar ::-moz-progress-bar {
        -moz-transition: padding-bottom 1s;
        transition: padding-bottom 1s;
        padding-bottom: var(--value);
        transform-origin: 0 0;
        transform: rotate(-90deg) translateX(-15px);
        padding-left: 15px;

        height: 0;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_QRCode img {
        border-radius: 8px;
    }
/*
Copyright 2018 Vector Creations Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ReplyChain {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    border-radius: 8px;
    padding: 4px;
    background: rgb(0 0 0 / 10%);
    margin: 0px -4px;
    margin-bottom: 0px;
}
.mx_ReplyChain .bp_ReplyThread_avatar {
        margin-left: -1px;
    }
.mx_ReplyChain .mx_EventTile_body, .mx_ReplyChain .bp_ReplyThread_replyTo, .mx_ReplyChain .bp_ReplyThread_toggle {
        opacity: 0.75;
    }
.mx_ReplyChain .bp_ReplyThread_avatar {
        margin-right: 5px;
    }
.mx_ReplyChain .bp_ReplyThread_avatar .mx_BaseAvatar_image {
            border-radius: 2px;
        }
.mx_ReplyChain .mx_ReplyChain_show {
        -webkit-appearance: none;
           -moz-appearance: none;
                appearance: none;
        background: none;
        border: none;
        padding: 0;
        margin: 0;
        font-size: inherit;
        font-family: inherit;
        line-height: inherit;
        cursor: default;
        color: inherit;
    }
.mx_ReplyChain .mx_ReplyChain_show:hover {
            color: #0086e6;
        }
.mx_ReplyChain.mx_ReplyChain_color1 {
        border-left-color: #c03d33;
    }
.mx_ReplyChain.mx_ReplyChain_color2 {
        border-left-color: #4fad2d;
    }
.mx_ReplyChain.mx_ReplyChain_color3 {
        border-left-color: #d09306;
    }
.mx_ReplyChain.mx_ReplyChain_color4 {
        border-left-color: #168acd;
    }
.mx_ReplyChain.mx_ReplyChain_color5 {
        border-left-color: #8544d6;
    }
.mx_ReplyChain.mx_ReplyChain_color6 {
        border-left-color: #cd4073;
    }
.mx_ReplyChain.mx_ReplyChain_color7 {
        border-left-color: #2996ad;
    }
.mx_ReplyChain.mx_ReplyChain_color8 {
        border-left-color: #ce671b;
    }
.mx_ReplyChain--expanded .mx_EventTile_body {
        display: block;
        overflow-y: scroll !important;
    }
.mx_ReplyChain--expanded .mx_EventTile_collapsedCodeBlock {
        display: block !important;
    }
.mx_EventTile_messageIn .mx_ReplyChain {
    background: hsla(var(--default-avatar-hue),
                46%,
                81%,
                0.07) !important;
    background: hsla(var(--avatar-hue,
                var(--default-avatar-hue)),
                var(--reply-bg-saturation),
                var(--reply-bg-lightness),
                var(--reply-bg-opacity)) !important;
}
.mx_EventTile_messageIn .bp_ReplyThread_replyTo strong {
        color: hsla(var(--default-avatar-hue),
                100%,
                95%,
                0.8);
        color: hsla(var(--avatar-hue,
                var(--default-avatar-hue)),
                var(--reply-to-color-saturation),
                var(--reply-to-color-lightness),
                var(--reply-to-color-opacity));
        font-weight: bold;
        font-size: 13px;
    }
.mx_EventTile_messageIn .mx_ReplyTile {
        color: hsla(var(--default-avatar-hue),
            100%,
            95%,
            0.8);
        color: hsla(var(--avatar-hue,
            var(--default-avatar-hue)),
            var(--reply-to-color-saturation),
            var(--reply-to-color-lightness),
            var(--reply-to-color-opacity));
    }
/*
Copyright 2018 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.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 {
    margin: 0 -5px;
    padding: 0 5px;
    cursor: col-resize;
}
.mx_ResizeHandle.mx_ResizeHandle_vertical {
    margin: -5px 0;
    padding: 5px 0;
    cursor: row-resize;
}
.mx_ResizeHandle.mx_ResizeHandle_horizontal > div {
    width: 1px;
    height: 100%;
}
.mx_ResizeHandle.mx_ResizeHandle_vertical > div {
    height: 1px;
}
.mx_Pill.mx_Pill {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    vertical-align: baseline;
    border-radius: 2px;
    font-size: 14px;
    line-height: 16px;
    position: relative;
    cursor: default;
    background: rgba(37, 38, 45, 0.4);
    padding: 2px;
    color: #efeff0;
}
.mx_Pill.mx_Pill .mx_BaseAvatar_center, .mx_Pill.mx_Pill .mx_BaseAvatar {
        display: none;
    }
.mx_AtRoomPill.mx_AtRoomPill, .mx_UserPill_me.mx_UserPill_me {
    color: #F09C74;
}
.mx_UserPill.mx_UserPill {
    padding-left: 1em;
}
.mx_UserPill.mx_UserPill::before {
        content: '@' !important;
        position: absolute;
        left: 0;
    }
.mx_RoomPill.mx_RoomPill, .mx_GroupPill.mx_GroupPill {
    padding-left: 0.75em;
}
.mx_RoomPill.mx_RoomPill::before, .mx_GroupPill.mx_GroupPill::before {
        content: '#' !important;
        position: absolute;
        left: 0;
    }
.mx_UserPill_selected {
    background-color: #4958F5 !important;
}
.mx_Markdown_BOLD {
    font-weight: bold;
}
.mx_Markdown_ITALIC {
    font-style: italic;
    /*
    // interestingly, *not* using the explicit italic font
    // variant seems yield better results.

    // compensate for Nunito italics being terrible
    // https://github.com/google/fonts/issues/1726
    transform: skewX(-14deg);
    display: inline-block;
    */
}
.mx_Markdown_CODE {
    padding: .2em 0;
    margin: 0;
    font-size: 85%;
    background-color: rgba(0, 0, 0, 0.04);
    border-radius: 3px;
}
.mx_Markdown_HR {
    display: block;
    background: #e9e9e9;
}
.mx_Markdown_STRIKETHROUGH {
    text-decoration: line-through;
}
/*
Copyright 2017 Vector Creations Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RoleButton {
    margin-left: 4px;
    margin-right: 4px;
    cursor: default;
    display: inline-block;
}
.mx_RoleButton object {
    pointer-events: none;
}
.mx_RoleButton_tooltip {
    display: inline-block;
    position: relative;
    top: -25px;
    left: 6px;
}
/*
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RoomAliasField {
    -webkit-box-flex: 0;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    min-width: 0;
    max-width: 100%;
}
.mx_RoomAliasField input {
        width: 150px;
        padding-left: 0;
        padding-right: 0;
    }
.mx_RoomAliasField input::-webkit-input-placeholder {
        color: #888;
        font-weight: normal;
    }
.mx_RoomAliasField input::-moz-placeholder {
        color: #888;
        font-weight: normal;
    }
.mx_RoomAliasField input:-ms-input-placeholder {
        color: #888;
        font-weight: normal;
    }
.mx_RoomAliasField input::-ms-input-placeholder {
        color: #888;
        font-weight: normal;
    }
.mx_RoomAliasField input::placeholder {
        color: #888;
        font-weight: normal;
    }
.mx_RoomAliasField .mx_Field_prefix, .mx_RoomAliasField .mx_Field_postfix {
        color: #888;
        border-left: none;
        border-right: none;
        font-weight: 600;
        padding: 9px 10px;
        -webkit-box-flex: 0;
            -ms-flex: 0 0 auto;
                flex: 0 0 auto;
    }
.mx_RoomAliasField .mx_Field_postfix {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        max-width: calc(100% - 180px);
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.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 {
        position: relative;
        width: 100%;
        padding: 7px 32px;
        text-align: center;
        border-radius: 8px;
        display: inline-block;
        font-size: 1.4rem;
        font-weight: 600;
        border: 1px solid rgba(231, 231, 231, 0.2);
        color: #f0f0f1;
    }
.mx_SSOButtons .mx_SSOButton > img {
            -o-object-fit: contain;
               object-fit: contain;
            position: absolute;
            left: 8px;
            top: 4px;
        }
.mx_SSOButtons .mx_SSOButton:hover {
        background-color: rgba(141,151,165, 0.1);
    }
.mx_SSOButtons .mx_SSOButton_default {
        color: #4958F5;
        background-color: transparent;
        border-color: #4958F5;
    }
.mx_SSOButtons .mx_SSOButton_default.mx_SSOButton_primary {
        color: #ffffff;
        background-color: #4958F5;
    }
.mx_SSOButtons .mx_SSOButton_mini {
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        width: 50px;
        height: 50px;
        min-width: 50px;
        padding: 12px;
    }
.mx_SSOButtons .mx_SSOButton_mini > img {
            left: 12px;
            top: 12px;
        }
.mx_SSOButtons .mx_SSOButton_mini + .mx_SSOButton_mini {
            margin-left: 16px;
        }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ServerPicker {
    margin-bottom: 14px;
    border-bottom: 1px solid rgba(141, 151, 165, 0.2);
    display: grid;
    grid-template-columns: auto -webkit-min-content;
    grid-template-columns: auto min-content;
    grid-template-rows: auto auto auto;
    font-size: 1.4rem;
    line-height: 2.0rem;
}
.mx_ServerPicker > h3 {
        font-weight: 600;
        margin: 0 0 20px;
        grid-column: 1;
        grid-row: 1;
    }
.mx_ServerPicker .mx_ServerPicker_help {
        width: 20px;
        height: 20px;
        background-color: #8e99a4;
        border-radius: 10px;
        grid-column: 2;
        grid-row: 1;
        margin-left: auto;
        text-align: center;
        color: #ffffff;
        font-size: 16px;
        position: relative;
    }
.mx_ServerPicker .mx_ServerPicker_help::before {
            content: '';
            width: 24px;
            height: 24px;
            position: absolute;
            top: -2px;
            left: -2px;
            -webkit-mask-position: center;
                    mask-position: center;
            -webkit-mask-size: contain;
                    mask-size: contain;
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            -webkit-mask-image: url(../../img/element-icons/i.80d84f3.svg);
                    mask-image: url(../../img/element-icons/i.80d84f3.svg);
            background: #ffffff;
        }
.mx_ServerPicker .mx_ServerPicker_server {
        color: #ffffff;
        grid-column: 1;
        grid-row: 2;
    }
.mx_ServerPicker .mx_ServerPicker_change {
        padding: 0;
        font-size: inherit;
        grid-column: 2;
        grid-row: 2;
    }
.mx_ServerPicker .mx_ServerPicker_desc {
        margin-top: 4px;
        color: #8D97A5;
        grid-column: 1 / 2;
        grid-row: 3;
        margin-bottom: 16px;
    }
.mx_ServerPicker_helpDialog .mx_Dialog_content {
        width: 456px;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_Slider {
    position: relative;
    margin: 0px;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
}
.mx_Slider_dotContainer {
    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;
}
.mx_Slider_bar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    position: absolute;
    height: 1em;
    width: 100%;
    padding: 0 0.5em;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.mx_Slider_bar > hr {
    width: 100%;
    height: 0.4em;
    background-color: #c1c9d6;
    border: 0;
}
.mx_Slider_selection {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: calc(100% - 1em);
    height: 1em;
    position: absolute;
    pointer-events: none;
}
.mx_Slider_selectionDot {
    position: absolute;
    width: 2.4em;
    height: 2.4em;
    background-color: #4958F5;
    border-radius: 50%;
    z-index: 10;
}
.mx_Slider_selectionText {
    color: #b9bec6;
    font-size: 1.4rem;
    position: relative;
    text-align: center;
    top: 30px;
    width: 100%;
}
.mx_Slider_selection > hr {
    margin: 0;
    border: 0.2em solid #4958F5;
}
.mx_Slider_dot {
    height: 1em;
    width: 1em;
    border-radius: 50%;
    background-color: #c1c9d6;
    z-index: 0;
}
.mx_Slider_dotActive {
    background-color: #4958F5;
}
.mx_Slider_dotValue {
    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;
    color: #c1c9d6;
}
.mx_Slider_labelContainer {
    width: 1em;
}
.mx_Slider_label {
    position: relative;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    left: -50%;
}
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2021 Šimon Brandner <simon.bra.ag@gmail.com>

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.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;
            justify-content: center;
    width: 100%;
    height: 100%;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
.mx_MatrixChat_middlePanel .mx_Spinner {
    height: auto;
}
@keyframes spin {
    from {
        -webkit-transform: rotateZ(0deg);
                transform: rotateZ(0deg);
    }
    to {
        -webkit-transform: rotateZ(360deg);
                transform: rotateZ(360deg);
    }
}
.mx_Spinner_icon {
    background-color: #E3E8F0;
    -webkit-mask: url(../../img/spinner/spinner-background.42a9b9d.svg);
            mask: url(../../img/spinner/spinner-background.42a9b9d.svg);
    -webkit-mask-size: 100%;
            mask-size: 100%;

    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;

    width: 100%;
    height: 100%;
}
.mx_Spinner_icon::before {
        background-color: #737D8C;
        -webkit-mask: url(../../img/spinner/spinner-foreground.cfdb46a.svg);
                mask: url(../../img/spinner/spinner-foreground.cfdb46a.svg);
        -webkit-mask-size: 100%;
                mask-size: 100%;

        width: 100%;
        height: 100%;

        content: "";
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;

        -webkit-animation: 1s linear spin infinite;

                animation: 1s linear spin infinite;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.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: 1.6rem;
            width: 1.6rem;
            size: 0.5rem;

            border: 0.15rem solid rgba(185,190,198, 0.5);
            -webkit-box-sizing: border-box;
                    box-sizing: border-box;
            border-radius: 0.4rem;
        }
.mx_Checkbox input[type=checkbox] + label > .mx_Checkbox_background .mx_Checkbox_checkmark {
                display: none;

                height: 100%;
                width: 100%;
                -webkit-mask-image: url(../../img/feather-customised/check.5745b4e.svg);
                        mask-image: url(../../img/feather-customised/check.5745b4e.svg);
                -webkit-mask-position: center;
                        mask-position: center;
                -webkit-mask-size: 100%;
                        mask-size: 100%;
                -webkit-mask-repeat: no-repeat;
                        mask-repeat: no-repeat;
            }
.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 {
            opacity: 0.5;
            cursor: not-allowed;
        }
.mx_Checkbox input[type=checkbox].focus-visible + label .mx_Checkbox_background {
                outline-width: 2px;
                outline-style: solid;
                outline-color: Highlight;
            }
/* WebKit gets its native focus styles. */
@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: #ffffff;
    }
.mx_Checkbox.mx_Checkbox_kind_solid input[type=checkbox]:checked + label > .mx_Checkbox_background {
        background: #4958F5;
        border-color: #4958F5;
    }
.mx_Checkbox.mx_Checkbox_kind_outline input[type=checkbox] + label > .mx_Checkbox_background .mx_Checkbox_checkmark {
        background: #4958F5;
    }
.mx_Checkbox.mx_Checkbox_kind_outline input[type=checkbox]:checked + label > .mx_Checkbox_background {
        background: transparent;
        border-color: #4958F5;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
/**
* This component expects the parent to specify a positive padding and
* width
*/
.mx_StyledRadioButton {
    position: relative;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;
    -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;
                flex-grow: 1;

        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;
        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: 1.6rem;
        width: 1.6rem;
    }
.mx_StyledRadioButton input[type=radio] {
        margin: 0;
        padding: 0;
        -webkit-appearance: none;
           -moz-appearance: none;
                appearance: none;
    }
.mx_StyledRadioButton input[type=radio] + div {
            -ms-flex-negative: 0;
                flex-shrink: 0;
            -webkit-box-flex: 0;
                -ms-flex-positive: 0;
                    flex-grow: 0;

            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;

            -webkit-box-sizing: border-box;

                    box-sizing: border-box;
            height: 1.6rem;
            width: 1.6rem;
            margin-left: 2px;

            border: 0.15rem solid #c1c6cd;
            border-radius: 1.6rem;
        }
.mx_StyledRadioButton input[type=radio] + div > div {
                -webkit-box-sizing: border-box;
                        box-sizing: border-box;

                height: 0.8rem;
                width: 0.8rem;

                border-radius: 0.8rem;
            }
.mx_StyledRadioButton input[type=radio].focus-visible + div {
                outline-width: 2px;
                outline-style: solid;
                outline-color: Highlight;
            }
/* WebKit gets its native focus styles. */
@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: #4958F5;
            }
.mx_StyledRadioButton input[type=radio]:checked + div > div {
                    background: #4958F5;
                }
.mx_StyledRadioButton input[type=radio]:disabled + div, .mx_StyledRadioButton input[type=radio]:disabled + div + span {
                opacity: 0.5;
                cursor: not-allowed;
            }
.mx_StyledRadioButton input[type=radio]:disabled + div {
                border-color: #c1c6cd;
            }
.mx_StyledRadioButton input[type=radio]:checked:disabled + div > div {
                background-color: #c1c6cd;
            }
.mx_StyledRadioButton .mx_StyledRadioButton_innerLabel {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        position: relative;
        top: 4px;
    }
.mx_StyledRadioButton_outlined {
    border: 1px solid #3a3c46;
    border-radius: 8px;
}
.mx_StyledRadioButton_checked {
    border-color: #4958F5;
}
/*
Copyright 2017 Michael Telatynski <7t3chguy@gmail.com>

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SyntaxHighlight {
    /* inhibit hljs styling */
    background: none !important;
    color: #c8c8cd !important;
}
/*
Copyright 2019 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_TextWithTooltip_target {
    display: inline;
}
.mx_TextWithTooltip_tooltip {
    display: none;
}
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ToggleSwitch {
    cursor: not-allowed;
    -webkit-transition: background-color 0.20s ease-out 0.1s;
    transition: background-color 0.20s ease-out 0.1s;

    width: 4.4rem;
    height: 2.0rem;
    border-radius: 1.5rem;
    padding: 2px;

    background-color: #454854;
    opacity: 0.5;
}
.mx_ToggleSwitch_enabled {
    cursor: default;
    opacity: 1;
}
.mx_ToggleSwitch.mx_ToggleSwitch_on {
    background-color: #4958F5;
}
.mx_ToggleSwitch.mx_ToggleSwitch_on > .mx_ToggleSwitch_ball {
        left: calc(100% - 2.0rem);
    }
.mx_ToggleSwitch_ball {
    position: relative;
    width: 2.0rem;
    height: 2.0rem;
    border-radius: 2.0rem;
    background-color: #fff;
    -webkit-transition: left 0.15s ease-out 0.1s;
    transition: left 0.15s ease-out 0.1s;
    left: 0;
}
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
@-webkit-keyframes mx_fadein {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes mx_fadein {
    from { opacity: 0; }
    to { opacity: 1; }
}
@-webkit-keyframes mx_fadeout {
    from { opacity: 1; }
    to { opacity: 0; }
}
@keyframes mx_fadeout {
    from { opacity: 1; }
    to { opacity: 0; }
}
.mx_Tooltip_chevron {
    position: absolute;
    left: -7px;
    top: 10px;
    width: 0;
    height: 0;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
}
.mx_Tooltip_chevron::after {
    content: '';
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-right: 6px solid #25262d;
    border-bottom: 6px solid transparent;
    position: absolute;
    top: -6px;
    left: 1px;
}
.mx_Tooltip {
    display: none;
    position: fixed;
    z-index: 10002;
    padding: 3px 5px;
    pointer-events: none;
    line-height: 1.4rem;
    font-size: 1.2rem;
    font-weight: 500;
    max-width: 200px;
    word-break: break-word;
    margin-right: 50px;
    border: 0;
    text-align: center;
    background-color: #25262d;
    -webkit-box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.25);
            box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.25);
    -webkit-backdrop-filter: blur(7.5px);
            backdrop-filter: blur(7.5px);
    border-radius: 3px;
    opacity: 0;
}
.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_withChevron .mx_Tooltip_chevron {
        display: block;
    }
.mx_Field_tooltip {
    background-color: #25262d;
    color: #f0f0f1;
    border: 1px solid #000000;
    text-align: unset;
}
.mx_Field_tooltip .mx_Tooltip_chevron {
        display: unset;
    }
.mx_Tooltip_title {
    font-weight: 600;
}
.mx_Tooltip_sub {
    opacity: 0.7;
    margin-top: 4px;
}
/*
Copyright 2017 New Vector Ltd.
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_TooltipButton {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-left: 5px;

    border: 2px solid #dbdbdb;
    border-radius: 20px;
    color: #dbdbdb;

    -webkit-transition: opacity 0.2s ease-in;

    transition: opacity 0.2s ease-in;
    opacity: 0.6;

    line-height: 1.1rem;
    text-align: center;

    cursor: default;
}
.mx_TooltipButton:hover {
    opacity: 1.0;
}
.mx_TooltipButton_container {
    position: relative;
    top: -18px;
    left: 4px;
}
.mx_TooltipButton_helpText {
    width: 400px;
    text-align: start;
    line-height: 17px !important;
}
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_Validation {
    position: relative;
}
.mx_Validation_details {
    padding-left: 20px;
    margin: 0;
}
.mx_Validation_description + .mx_Validation_details {
    margin: 1em 0 0;
}
.mx_Validation_detail {
    position: relative;
    font-weight: normal;
    list-style: none;
    margin-bottom: 0.5em;
}
.mx_Validation_detail:last-child {
        margin-bottom: 0;
    }
.mx_Validation_detail::before {
        content: "";
        position: absolute;
        width: 14px;
        height: 14px;
        top: 0;
        left: -18px;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: contain;
                mask-size: contain;
    }
.mx_Validation_detail.mx_Validation_valid {
        color: #4958F5;
    }
.mx_Validation_detail.mx_Validation_valid::before {
            -webkit-mask-image: url(../../img/feather-customised/check.5745b4e.svg);
                    mask-image: url(../../img/feather-customised/check.5745b4e.svg);
            background-color: #4958F5;
        }
.mx_Validation_detail.mx_Validation_invalid {
        color: #FF5B55;
    }
.mx_Validation_detail.mx_Validation_invalid::before {
            -webkit-mask-image: url(../../img/feather-customised/x.9662221.svg);
                    mask-image: url(../../img/feather-customised/x.9662221.svg);
            background-color: #FF5B55;
        }
/*
Copyright 2019 Tulir Asokan <tulir@maunium.net>

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_EmojiPicker {
    border-radius: 12px;
    width: 345px;
    height: 450px;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;
    -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-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
}
.mx_EmojiPicker_header {
    padding: 4px 8px 0;
    border-bottom: 1px solid #616b7f;
}
.mx_EmojiPicker_anchor {
    border: none;
    padding: 8px 8px 6px;
    border-bottom: 2px solid transparent;
    background-color: transparent;
    border-radius: 4px 4px 0 0;

    width: 36px;
    height: 38px;
}
.mx_EmojiPicker_anchor:not(:disabled) {
        cursor: default;
    }
.mx_EmojiPicker_anchor:not(:disabled):hover {
        background-color: #32343E;
        border-bottom: 2px solid #4958F5;
    }
.mx_EmojiPicker_anchor.mx_EmojiPicker_anchor_slim {
        width: 32px;
        height: 34px;
    }
.mx_EmojiPicker_anchor::before {
    background-color: #f0f0f1;
    content: '';
    display: inline-block;
    -webkit-mask-size: 100%;
            mask-size: 100%;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    width: 100%;
    height: 100%;
}
.mx_EmojiPicker_anchor:disabled::before {
    background-color: #32343E;
}
.mx_EmojiPicker_anchor_activity::before { -webkit-mask-image: url(../../img/emojipicker/activity.921ec9f.svg); mask-image: url(../../img/emojipicker/activity.921ec9f.svg); }
.mx_EmojiPicker_anchor_custom::before { -webkit-mask-image: url(../../img/emojipicker/custom.e1cd0fd.svg); mask-image: url(../../img/emojipicker/custom.e1cd0fd.svg); }
.mx_EmojiPicker_anchor_flags::before { -webkit-mask-image: url(../../img/emojipicker/flags.1a8855e.svg); mask-image: url(../../img/emojipicker/flags.1a8855e.svg); }
.mx_EmojiPicker_anchor_foods::before { -webkit-mask-image: url(../../img/emojipicker/foods.c6b220a.svg); mask-image: url(../../img/emojipicker/foods.c6b220a.svg); }
.mx_EmojiPicker_anchor_nature::before { -webkit-mask-image: url(../../img/emojipicker/nature.6540b99.svg); mask-image: url(../../img/emojipicker/nature.6540b99.svg); }
.mx_EmojiPicker_anchor_objects::before { -webkit-mask-image: url(../../img/emojipicker/objects.4d34f58.svg); mask-image: url(../../img/emojipicker/objects.4d34f58.svg); }
.mx_EmojiPicker_anchor_people::before { -webkit-mask-image: url(../../img/emojipicker/people.e918580.svg); mask-image: url(../../img/emojipicker/people.e918580.svg); }
.mx_EmojiPicker_anchor_places::before { -webkit-mask-image: url(../../img/emojipicker/places.7310322.svg); mask-image: url(../../img/emojipicker/places.7310322.svg); }
.mx_EmojiPicker_anchor_recent::before { -webkit-mask-image: url(../../img/emojipicker/recent.13b42e2.svg); mask-image: url(../../img/emojipicker/recent.13b42e2.svg); }
.mx_EmojiPicker_anchor_symbols::before { -webkit-mask-image: url(../../img/emojipicker/symbols.15a557d.svg); mask-image: url(../../img/emojipicker/symbols.15a557d.svg); }
.mx_EmojiPicker_anchor_visible {
    border-bottom: 2px solid #4958F5;
}
.mx_EmojiPicker_search {
    margin: 8px;
    border-radius: 4px;
    border: 1px solid rgba(231, 231, 231, 0.2);
    background-color: hsla(216, 21%, 14%, 1);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.mx_EmojiPicker_search input {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        border: none;
        padding: 8px 12px;
        border-radius: 4px 0;
    }
.mx_EmojiPicker_search button {
        border: none;
        background-color: inherit;
        margin: 0;
        padding: 8px;
        -ms-flex-item-align: center;
            align-self: center;
        width: 32px;
        height: 32px;
    }
.mx_EmojiPicker_search_clear {
    cursor: default;
}
.mx_EmojiPicker_search_icon {
    width: 16px;
    margin: 8px;
}
.mx_EmojiPicker_search_icon:not(.mx_EmojiPicker_search_clear) {
    pointer-events: none;
}
.mx_EmojiPicker_search_icon::after {
    -webkit-mask: url(../../img/emojipicker/search.973c315.svg) no-repeat;
            mask: url(../../img/emojipicker/search.973c315.svg) no-repeat;
    -webkit-mask-size: 100%;
            mask-size: 100%;
    background-color: #f0f0f1;
    content: '';
    display: inline-block;
    width: 100%;
    height: 100%;
}
.mx_EmojiPicker_search_clear::after {
    -webkit-mask-image: url(../../img/emojipicker/delete.f7344c5.svg);
            mask-image: url(../../img/emojipicker/delete.f7344c5.svg);
}
.mx_EmojiPicker_category {
    padding: 0 12px;
    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_EmojiPicker_category_label {
    width: 304px;
}
.mx_EmojiPicker_list {
    width: 304px;
    padding: 0;
    margin: 0;
}
.mx_EmojiPicker_list.bp_quickReactMenuItem {
        width: 338px;
    }
.mx_EmojiPicker_item_wrapper {
    display: inline-block;
    list-style: none;
    width: 38px;
    cursor: default;
}
.bp_quickReactMenuItem .mx_EmojiPicker_item_wrapper {
    margin: 2px;
  }
@-webkit-keyframes emoji-bubble-in {
    0% {
        -webkit-transform: scale(0) rotate(10deg);
                transform: scale(0) rotate(10deg);
    }
    70% {
        -webkit-transform: scale(1.2) rotate(-10deg);
                transform: scale(1.2) rotate(-10deg);
    }
    100% {
        -webkit-transform: scale(1) rotate(0deg);
                transform: scale(1) rotate(0deg);
    }
}
@keyframes emoji-bubble-in {
    0% {
        -webkit-transform: scale(0) rotate(10deg);
                transform: scale(0) rotate(10deg);
    }
    70% {
        -webkit-transform: scale(1.2) rotate(-10deg);
                transform: scale(1.2) rotate(-10deg);
    }
    100% {
        -webkit-transform: scale(1) rotate(0deg);
                transform: scale(1) rotate(0deg);
    }
}
.mx_EmojiPicker_category_skintone {
    -webkit-transition: all ease 0.1s;
    transition: all ease 0.1s;
}
.mx_EmojiPicker_category_skintone .mx_ContextualMenu {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        max-width: 230px;
    }
.mx_EmojiPicker_category_skintone .mx_EmojiPicker_item_wrapper {
        -webkit-transform: scale(0) rotate(10deg);
                transform: scale(0) rotate(10deg);
        -webkit-animation: emoji-bubble-in 0.25s ease forwards;
                animation: emoji-bubble-in 0.25s ease forwards;
        -webkit-animation-delay: var(--animation-delay);
                animation-delay: var(--animation-delay);
    }
.mx_EmojiPicker_item_wrapper:focus .mx_EmojiPicker_item {
        background-color: #32343E;
    }
.mx_EmojiPicker_item {
    display: inline-block;
    font-size: 2.0rem;
    padding: 5px;
    width: 100%;
    height: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    text-align: center;
    border-radius: 8px;
}
.mx_EmojiPicker_item:hover {
        background-color: #32343E;
    }
.mx_EmojiPicker_item:focus {
        background-color: #32343E;
    }
.mx_EmojiPicker_item_selected {
    color: rgba(0, 0, 0, .5);
    border: 1px solid #4958F5;
    padding: 4px;
}
.mx_EmojiPicker_category_label, .mx_EmojiPicker_preview_name {
    font-size: 1.6rem;
    font-weight: 600;
    margin: 0;
}
.mx_EmojiPicker_footer {
    border-top: 1px solid #616b7f;
    min-height: 72px;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.mx_EmojiPicker_preview_emoji {
    font-size: 3.2rem;
    padding: 8px 16px;
}
.mx_EmojiPicker_preview_text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -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: #c8c8cd;
    font-size: 1.4rem;
}
.mx_EmojiPicker_shortcode::before, .mx_EmojiPicker_shortcode::after {
        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_GifPicker {
  width: 345px;
  height: 450px;
  border-radius: 4px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.mx_GifPicker_scrollPanel {
  overflow-y: scroll;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 0px;
          flex: 1 1 0;
  max-height: 450px;
  width: 100%;
}
.mx_GifPicker_initialNotice {
  text-align: center;
  margin: auto;
}
.mx_GifPicker_thumbnail video {
  border: 2px solid #3a3c46;
  border-radius: 6px;
  margin-bottom: 0.8em;
  cursor: default;
  width: 100%;
  height: auto;
}
.mx_GifPicker_thumbnail video:hover {
      border-color: rgba(249, 248, 248, 0.2);
  }
/*
Copyright 2018, 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CreateEvent::before {
        background-color: #b9bec6;
        -webkit-mask-image: url(../../img/element-icons/chat-bubbles.1167151.svg);
                mask-image: url(../../img/element-icons/chat-bubbles.1167151.svg);
    }
/*
Copyright 2017 Vector Creations Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_DateSeparator {
    clear: both;
    margin: 4px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    font-size: 1.4rem;
    color: #d0d1d8;
}
.mx_DateSeparator > hr {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 0px;
            flex: 1 1 0;
    height: 0;
    border: none;
}
.mx_DateSeparator > div {
    margin: 0 25px;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
}
/*
Copyright 2019, 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_EventTileBubble {
    background-color: #25262d;
    padding: 10px;
    border-radius: 8px;
    margin: 10px auto;
    max-width: 75%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) -webkit-min-content;
    grid-template-columns: 24px minmax(0, 1fr) min-content;
}
.mx_EventTileBubble::before, .mx_EventTileBubble::after {
        position: relative;
        grid-column: 1;
        grid-row: 1 / 4;
        width: 16px;
        height: 16px;
        content: "";
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: contain;
                mask-size: contain;
        margin-top: 4px;
    }
.mx_EventTileBubble .mx_EventTileBubble_title, .mx_EventTileBubble .mx_EventTileBubble_subtitle {
        overflow-wrap: break-word;
    }
.mx_EventTileBubble .mx_EventTileBubble_title {
        font-weight: 600;
        font-size: 1.5rem;
        grid-column: 2;
        grid-row: 1;
    }
.mx_EventTileBubble .mx_EventTileBubble_subtitle {
        font-size: 1.2rem;
        grid-column: 2;
        grid-row: 2;
    }
/*
Copyright 2017 Vector Creations Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MEmoteBody {
    white-space: pre-wrap;
}
.mx_MEmoteBody_sender {
    cursor: default;
}
/*
Copyright 2015 - 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
/* Remove the border and padding for iframes for download links. */
.mx_MFileBody_download iframe {
    margin: 0px;
    padding: 0px;
    border: none;
    width: 100%;
    /* Set the height of the iframe to be 1 line of text.
     * Iframes don't automatically size themselves to fit their content.
     * So either we have to fix the height of the iframe using CSS or
     * use javascript's cross-origin postMessage API to communicate how
     * big the content of the iframe is. */
    height: 1.5em;
}
.mx_EventTile_messageOut .mx_MFileBody_info .mx_MFileBody_info_icon {
        background-color: #124dc7;
    }
.mx_EventTile_messageOut .mx_MFileBody_info_hint {
        color: white;
    }
.mx_EventTile_messageOut .mx_MFileBody_info_filename, .mx_EventTile_messageOut .mx_MFileBody_info_size {
        color: white;
    }
.mx_EventTile_messageIn .mx_MFileBody_info .mx_MFileBody_info_icon {
        background-color: hsla(#131B3A, 97%, 15%, 1);
        background-color: hsla(var(--avatar-hue, #131B3A), 97%, 15%, 1);
    }
.mx_EventTile_messageIn .mx_MFileBody_info_hint {
        color: hsla(220, 83%, 62%, 1)
    }
.mx_EventTile_messageIn.mx_EventTile_file .mx_EventTile_content-caption {
        background: transparent;
    }
.mx_EventTile_file .mx_MTextBody.mx_EventTile_caption {
    padding-left: 0px;
}
.mx_MFileBody-container, .mx_MFileBody, .mx_MFileBody_info, .mx_EventTile_file .mx_EventTile_content.mx_EventTile_content-caption {
    width: 100%;
}
.mx_MFileBody_info {
    cursor: default;
    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;
}
.mx_MFileBody_info .mx_MFileBody_info_icon {
        background-color: teal;
        border-radius: 20px;
        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;
        width: 37px;
        height: 37px;
        position: relative;
        vertical-align: middle;
        margin-right: 12px;
    }
.mx_MFileBody_info .mx_MFileBody_info_icon .bp_icon {
            height: 20px; 
        }
.mx_MFileBody_info .mx_MFileBody_info_icon .bp_icon svg {
                margin-top: 0;
            }
.mx_MFileBody_info .mx_MFileBody_info_icon .bp_icon svg path {
                    fill: white;
                }
.mx_MFileBody_info .mx_MFileBody_info_details {
        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;
    }
.mx_MFileBody_info .mx_MFileBody_info_size {
        font-weight: 400;
        font-size: 12px;
        line-height: 16px;
        letter-spacing: 0.45px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
.mx_MFileBody_info .mx_MFileBody_info_timestamp {
        margin-left: auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
.mx_MFileBody_info .mx_MFileBody_info_filename {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        display: inline-block;
        vertical-align: middle;
        font-weight: 500;
        font-size: 12px;
        line-height: 16px;
        letter-spacing: 0.45px;
    }
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MImageBody_thumbnail--blurhash {
    position: absolute;
    left: 0;
    top: 0;
}
.mx_MImageBody_thumbnail {
    -o-object-fit: contain;
       object-fit: contain;
    border-radius: 8px;

    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;
    height: 100%;
    width: 100%;
    overflow: hidden;
}
.mx_MImageBody_thumbnail .mx_Blurhash > canvas {
        -webkit-animation: mx--anim-pulse 1.75s infinite cubic-bezier(.4, 0, .6, 1);
                animation: mx--anim-pulse 1.75s infinite cubic-bezier(.4, 0, .6, 1);
    }
.mx_MImageBody_thumbnail.sticker {
      height: 200px;
    }
.mx_no-image-placeholder {
  background-color: #35363D;
  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_MImageBody_thumbnail_container {
    overflow: hidden;
    position: relative;
}
.mx_MImageBody_gifLabel {
    position: absolute;
    display: block;
    top: 0px;
    left: 14px;
    padding: 5px;
    border-radius: 5px;
    background: rgba(0, 0, 0, 0.7);
    border: 2px solid rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 1);
    pointer-events: none;
}
.mx_HiddenImagePlaceholder {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    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;
    text-align: center;

    cursor: default;
    background-color: #454854;
}
.mx_HiddenImagePlaceholder .mx_HiddenImagePlaceholder_button {
        color: #4958F5;
    }
.mx_HiddenImagePlaceholder .mx_HiddenImagePlaceholder_button span.mx_HiddenImagePlaceholder_eye {
            margin-right: 8px;

            background-color: #4958F5;
            -webkit-mask-image: url(../../img/feather-customised/eye.52aa0d2.svg);
                    mask-image: url(../../img/feather-customised/eye.52aa0d2.svg);
            display: inline-block;
            width: 18px;
            height: 14px;
        }
.mx_HiddenImagePlaceholder .mx_HiddenImagePlaceholder_button span:not(.mx_HiddenImagePlaceholder_eye) {
            vertical-align: text-bottom;
        }
.mx_EventTile:hover .mx_HiddenImagePlaceholder {
    background-color: hsla(216, 21%, 14%, 1);
}
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MJitsiWidgetEvent::before {
        background-color: #b9bec6;
        -webkit-mask-image: url(../../img/element-icons/call/video-call.55bc086.svg);
                mask-image: url(../../img/element-icons/call/video-call.55bc086.svg);
    }
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MNoticeBody {
    white-space: pre-wrap;
    opacity: 0.6;
}
/* @import "../../../css/views/messages/_MStickerBody.scss"; */
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_EventTile_line--reply-chain .mx_EventTile_caption {
  padding: 0px;
  background-color: transparent !important;
}
.mx_EventTile_caption {
    margin-top: -6px;
    padding: 10px 10px 4px;
}
.mx_EventTile_caption .mx_EventTile_body {
      display: inline-block;
      width: 100%;
    }
.mx_EventTile_messageOut .mx_EventTile_caption, .mx_EventTile_messageOut .mx_EventTile_content-caption {
      background: #3577FF;
  }
.mx_EventTile_messageIn .mx_EventTile_caption {
      background: #35363d;
  }
.mx_EventTile_messageIn:not(.mx_EventTile_hasReply, .mx_EventTile_file) .mx_EventTile_content-caption {
    background: hsla(
        var(--default-avatar-hue),
        100%,
        70%,
        0.07);
    background: hsla(
        var(--avatar-hue, var(--default-avatar-hue)),
        var(--message-bg-saturation),
        var(--message-bg-lightness),
        var(--message-bg-opacity)
    );
  }
.mx_EventTile_messageIn:not(.mx_EventTile_hasReply) .mx_EventTile_caption{
    background: transparent;
  }
/*
Copyright 2020 - 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_EventTile_content.mx_EventTile_content-caption .mx_MVideoBody {
        margin-inline: auto;
        display: block;
        border-radius: 0;
        margin-bottom: 6px;
        width: 100% !important;
    }
span.mx_MVideoBody .mx_SenderInfo_wrapper {
        line-height: 2.2rem;
    }
span.mx_MVideoBody .mx_SenderInfo_wrapper + span .mx_MVideoBody {
            border-top-left-radius: 0;
            border-top-right-radius: 0;
        }
span.mx_MVideoBody video.mx_MVideoBody {
        max-height: 500px;
        max-width: 100%;
        width: auto;
        height: auto;
        border-radius: 8px;
        background-color: #000;
    }
/*
Copyright 2019 New Vector Ltd
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MessageActionBar {
    position: absolute;
    visibility: hidden;
    cursor: default;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 32px;
    line-height: 2.4rem;
    border-radius: 8px;
    background: hsla(216, 21%, 14%, 1);
    border: 1px solid rgba(231, 231, 231, 0.2);
    top: -32px;
    right: 8px;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    z-index: 1;
}
.mx_MessageActionBar::before {
        content: '';
        position: absolute;
        width: calc(10px + 48px + 100% + 8px);
        height: calc(20px + 100%);
        top: -12px;
        left: -58px;
        z-index: -1;
        cursor: auto;
        cursor: initial;
    }
.mx_MessageActionBar > * {
        white-space: nowrap;
        display: inline-block;
        position: relative;
        margin: 2px;
    }
.mx_MessageActionBar > *:hover {
            background: rgba(141,151,165, 0.2);
            border-radius: 6px;
            z-index: 1;
        }
.mx_MessageActionBar_maskButton {
    width: 28px;
    height: 28px;
}
.mx_MessageActionBar_maskButton::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    -webkit-mask-size: 18px;
            mask-size: 18px;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    background-color: #737D8C;
}
.mx_MessageActionBar_maskButton:hover::after {
    background-color: #f0f0f1;
}
.mx_MessageActionBar_reactButton::after {
    -webkit-mask-image: url(../../img/element-icons/room/message-bar/emoji.af14771.svg);
            mask-image: url(../../img/element-icons/room/message-bar/emoji.af14771.svg);
}
.mx_MessageActionBar_replyButton::after {
    -webkit-mask-image: url(../../img/element-icons/room/message-bar/reply.5812741.svg);
            mask-image: url(../../img/element-icons/room/message-bar/reply.5812741.svg);
}
.mx_MessageActionBar_threadButton::after {
    -webkit-mask-image: url(../../img/element-icons/message/thread.bad77e9.svg);
            mask-image: url(../../img/element-icons/message/thread.bad77e9.svg);
}
.mx_MessageActionBar_editButton::after {
    -webkit-mask-image: url(../../img/element-icons/room/message-bar/edit.688678e.svg);
            mask-image: url(../../img/element-icons/room/message-bar/edit.688678e.svg);
}
.mx_MessageActionBar_optionsButton::after {
    -webkit-mask-image: url(../../img/element-icons/context-menu.829cc1a.svg);
            mask-image: url(../../img/element-icons/context-menu.829cc1a.svg);
}
.mx_MessageActionBar_resendButton::after {
    -webkit-mask-image: url(../../img/element-icons/retry.6cd23ad.svg);
            mask-image: url(../../img/element-icons/retry.6cd23ad.svg);
}
.mx_MessageActionBar_cancelButton::after {
    -webkit-mask-image: url(../../img/element-icons/trashcan.3b626db.svg);
            mask-image: url(../../img/element-icons/trashcan.3b626db.svg);
}
.mx_MessageActionBar_downloadButton::after {
    -webkit-mask-size: 14px;
            mask-size: 14px;
    -webkit-mask-image: url(../../img/download.77a8400.svg);
            mask-image: url(../../img/download.77a8400.svg);
}
.mx_MessageActionBar_expandMessageButton::after {
    -webkit-mask-size: 12px;
            mask-size: 12px;
    -webkit-mask-image: url(../../img/element-icons/expand-message.272d305.svg);
            mask-image: url(../../img/element-icons/expand-message.272d305.svg);
}
.mx_MessageActionBar_collapseMessageButton::after {
    -webkit-mask-size: 12px;
            mask-size: 12px;
    -webkit-mask-image: url(../../img/element-icons/collapse-message.644a2ee.svg);
            mask-image: url(../../img/element-icons/collapse-message.644a2ee.svg);
}
.mx_MessageActionBar_downloadButton.mx_MessageActionBar_downloadSpinnerButton::after {
    background-color: transparent;
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MessageTimestamp {
    color: #d0d1d8;
    font-size: 1.0rem;
    -webkit-font-feature-settings: "tnum";
            font-feature-settings: "tnum";
    font-variant-numeric: tabular-nums;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
/*
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MjolnirBody {
    opacity: 0.4;
}
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ReactionsRow {
    margin: 6px 0;
    color: #f0f0f1;
}
.mx_ReactionsRow .mx_ReactionsRow_addReactionButton {
        position: relative;
        display: inline-block;
        visibility: hidden;
        width: 24px;
        height: 24px;
        vertical-align: middle;
        margin-left: 4px;
        margin-right: 4px;
    }
.mx_ReactionsRow .mx_ReactionsRow_addReactionButton::before {
            content: '';
            position: absolute;
            height: 100%;
            width: 100%;
            -webkit-mask-size: 16px;
                    mask-size: 16px;
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            -webkit-mask-position: center;
                    mask-position: center;
            background-color: #8D97A5;
            -webkit-mask-image: url(../../img/element-icons/room/message-bar/emoji.af14771.svg);
                    mask-image: url(../../img/element-icons/room/message-bar/emoji.af14771.svg);
        }
.mx_ReactionsRow .mx_ReactionsRow_addReactionButton.mx_ReactionsRow_addReactionButton_active {
            visibility: visible;
        }
.mx_ReactionsRow .mx_ReactionsRow_addReactionButton:hover::before, .mx_ReactionsRow .mx_ReactionsRow_addReactionButton.mx_ReactionsRow_addReactionButton_active::before {
                background-color: #f0f0f1;
            }
.mx_EventTile:hover .mx_ReactionsRow_addReactionButton {
    visibility: visible;
}
.mx_ReactionsRow_showAll {
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    font-size: inherit;
    font-family: inherit;
    line-height: inherit;
    cursor: default;
    text-decoration: none;
    font-size: 1.2rem;
    line-height: 2.0rem;
    margin-left: 4px;
    vertical-align: middle;
    color: #8D97A5;
}
.mx_ReactionsRow_showAll:hover {
        color: #f0f0f1;
    }
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ReactionsRowButton {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    line-height: 2.0rem;
    margin-right: 6px;
    padding: 1px 6px;
    border: 1px solid #616b7f;
    border-radius: 10px;
    background-color: #454854;
    cursor: default;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    vertical-align: middle;
}
.mx_ReactionsRowButton:hover {
        border-color: #b9bec6;
    }
.mx_ReactionsRowButton.mx_ReactionsRowButton_selected {
        background-color: #1f6954;
        border-color: #4958F5;
    }
.mx_ReactionsRowButton.mx_ReactionsRowButton_error {
        background-color: #331313;
        border-color: #E0474F;
    }
.mx_ReactionsRowButton.mx_AccessibleButton_disabled {
        cursor: not-allowed;
    }
.mx_ReactionsRowButton .mx_ReactionsRowButton_content {
        max-width: 100px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        padding-right: 4px;
        -ms-flex-item-align: center;
            align-self: center;
    }
.mx_ReactionsRowButton .mx_ReactionsRowButton_error_dot {
        background-color: #E0474F;
        border-radius: 100px;
        width: 8px;
        height: 8px;
        margin: auto;
        margin-left: 4px;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
    http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RedactedBody {
    white-space: pre-wrap;
    color: #b9bec6;
    vertical-align: middle;

    padding-left: 20px;
    padding-right: 50px;
    position: relative;
}
.mx_RedactedBody::before {
        height: 14px;
        width: 14px;
        background-color: #b9bec6;
        -webkit-mask-image: url(../../img/feather-customised/trash.custom.1e6ecd4.svg);
                mask-image: url(../../img/feather-customised/trash.custom.1e6ecd4.svg);
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: contain;
                mask-size: contain;
        content: '';
        position: absolute;
        top: 1px;
        left: 0;
    }
/*
Copyright 2017 Vector Creations Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RoomAvatarEvent {
    opacity: 0.5;
    overflow-y: hidden;
}
.mx_RoomAvatarEvent_avatar {
    display: inline;
    position: relative;
    top: 5px;
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SenderProfile_displayName {
    font-weight: 600;
}
.mx_SenderProfile_mxid {
    font-weight: 600;
    font-size: 1.1rem;
    margin-left: 5px;
    opacity: 0.5;
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_TextualEvent {
    opacity: 0.5;
    overflow-y: hidden;
}
.mx_TextualEvent a {
        color: #4958F5;
        cursor: default;
    }
/*
Copyright 2015, 2016 OpenMarket Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
    http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_UnknownBody {
    white-space: pre-wrap;
}
/*
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_EventTile_content.mx_ViewSourceEvent {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    opacity: 0.6;
    font-size: 1.2rem;
    width: 100%;
}
.mx_EventTile_content.mx_ViewSourceEvent pre, .mx_EventTile_content.mx_ViewSourceEvent code {
        -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 {
        visibility: hidden;
        border-radius: 0;
        padding: 0;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: 0 center;
                mask-position: 0 center;
        -webkit-mask-size: auto 12px;
                mask-size: auto 12px;
        width: 12px;
        background-color: #4958F5;
        -webkit-mask-image: url(../../img/element-icons/maximise-expand.2c239ea.svg);
                mask-image: url(../../img/element-icons/maximise-expand.2c239ea.svg);
    }
.mx_EventTile_content.mx_ViewSourceEvent.mx_ViewSourceEvent_expanded .mx_ViewSourceEvent_toggle {
        -webkit-mask-position: 0 bottom;
                mask-position: 0 bottom;
        margin-bottom: 5px;
        -webkit-mask-image: url(../../img/element-icons/minimise-collapse.a59edfc.svg);
                mask-image: url(../../img/element-icons/minimise-collapse.a59edfc.svg);
    }
.mx_EventTile:hover .mx_ViewSourceEvent_toggle {
        visibility: visible;
    }
/*
Copyright 2019, 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_cryptoEvent.mx_cryptoEvent_icon::before {
        background-color: #ffffff;
        -webkit-mask-image: url(../../img/e2e/normal.76f0c09.svg);
                mask-image: url(../../img/e2e/normal.76f0c09.svg);
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: 80%;
                mask-size: 80%;
    }
.mx_cryptoEvent.mx_cryptoEvent_icon::after {
        -webkit-mask-image: url(../../img/e2e/normal.76f0c09.svg);
                mask-image: url(../../img/e2e/normal.76f0c09.svg);
        background-color: #b9bec6;
    }
.mx_cryptoEvent.mx_cryptoEvent_icon_verified::after {
        -webkit-mask-image: url(../../img/e2e/verified.5be6c9f.svg);
                mask-image: url(../../img/e2e/verified.5be6c9f.svg);
        background-color: #4958F5;
    }
.mx_cryptoEvent.mx_cryptoEvent_icon_warning::after {
        -webkit-mask-image: url(../../img/e2e/warning.78bb264.svg);
                mask-image: url(../../img/e2e/warning.78bb264.svg);
        background-color: #FF5B55;
    }
.mx_cryptoEvent .mx_cryptoEvent_state, .mx_cryptoEvent .mx_cryptoEvent_buttons {
        grid-column: 3;
        grid-row: 1 / 4;
    }
.mx_cryptoEvent .mx_cryptoEvent_buttons {
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        grid-gap: 5px;
        gap: 5px;
    }
.mx_cryptoEvent .mx_cryptoEvent_state {
        width: 130px;
        padding: 10px 20px;
        margin: auto 0;
        text-align: center;
        color: #8D97A5;
        overflow-wrap: break-word;
        font-size: 1.2rem;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_BaseCard {
    padding: 0 8px;
    overflow: hidden;
    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;
}
.mx_BaseCard .mx_BaseCard_header {
        margin: 4px 0;
    }
.mx_BaseCard .mx_BaseCard_header > h2 {
            margin: 0 44px;
            font-size: 1.8rem;
            font-weight: 600;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
.mx_BaseCard .mx_BaseCard_header .mx_BaseCard_back, .mx_BaseCard .mx_BaseCard_header .mx_BaseCard_close {
            position: absolute;
            background-color: rgba(141, 151, 165, 0.2);
            height: 20px;
            width: 20px;
            margin: 12px;
            top: 0;
            border-radius: 50%;
        }
.mx_BaseCard .mx_BaseCard_header .mx_BaseCard_back::before, .mx_BaseCard .mx_BaseCard_header .mx_BaseCard_close::before {
                content: "";
                position: absolute;
                height: inherit;
                width: inherit;
                top: 0;
                left: 0;
                -webkit-mask-repeat: no-repeat;
                        mask-repeat: no-repeat;
                -webkit-mask-position: center;
                        mask-position: center;
                background-color: #b9bec6;
            }
.mx_BaseCard .mx_BaseCard_header .mx_BaseCard_back {
            left: 0;
        }
.mx_BaseCard .mx_BaseCard_header .mx_BaseCard_back::before {
                -webkit-transform: rotate(90deg);
                        transform: rotate(90deg);
                -webkit-mask-size: 22px;
                        mask-size: 22px;
                -webkit-mask-image: url(../../img/feather-customised/chevron-down.5278abe.svg);
                        mask-image: url(../../img/feather-customised/chevron-down.5278abe.svg);
            }
.mx_BaseCard .mx_BaseCard_header .mx_BaseCard_close {
            right: 0;
        }
.mx_BaseCard .mx_BaseCard_header .mx_BaseCard_close::before {
                -webkit-mask-image: url(../../img/icons-close.11ff07c.svg);
                        mask-image: url(../../img/icons-close.11ff07c.svg);
                -webkit-mask-size: 8px;
                        mask-size: 8px;
            }
.mx_BaseCard .mx_AutoHideScrollbar {
        margin-right: -8px;
        padding-right: 8px;
        min-height: 0;
        width: 100%;
        height: 100%;
    }
.mx_BaseCard .mx_BaseCard_Group {
        margin: 20px 0 16px;
    }
.mx_BaseCard .mx_BaseCard_Group > * {
            margin-left: 12px;
            margin-right: 12px;
        }
.mx_BaseCard .mx_BaseCard_Group > h1 {
            color: #8D97A5;
            font-size: 1.2rem;
            font-weight: 500;
        }
.mx_BaseCard .mx_BaseCard_Group .mx_BaseCard_Button {
            padding: 10px 10px 10px 12px;
            margin: 0;
            position: relative;
            font-size: 1.3rem;
            height: 20px;
            line-height: 20px;
            border-radius: 8px;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
        }
.mx_BaseCard .mx_BaseCard_Group .mx_BaseCard_Button .mx_BaseCard_Button_sublabel {
                color: #8D97A5;
                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: unset;
                }
.mx_BaseCard .mx_BaseCard_footer {
        padding-top: 4px;
        text-align: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: distribute;
            justify-content: space-around;
    }
.mx_BaseCard .mx_BaseCard_footer .mx_AccessibleButton_kind_secondary {
            color: #737D8C;
            background-color: rgba(141, 151, 165, 0.2);
            font-weight: 600;
            font-size: 1.4rem;
        }
.mx_BaseCard .mx_BaseCard_footer .mx_AccessibleButton_disabled {
            cursor: not-allowed;
        }
.mx_FilePanel.mx_BaseCard, .mx_UserInfo.mx_BaseCard, .mx_NotificationPanel.mx_BaseCard, .mx_MemberList.mx_BaseCard {
        padding: 32px 0 0;
    }
.mx_FilePanel.mx_BaseCard .mx_AutoHideScrollbar, .mx_UserInfo.mx_BaseCard .mx_AutoHideScrollbar, .mx_NotificationPanel.mx_BaseCard .mx_AutoHideScrollbar, .mx_MemberList.mx_BaseCard .mx_AutoHideScrollbar {
            margin-right: unset;
            padding-right: unset;
        }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_EncryptionInfo_spinner .mx_Spinner {
        margin-top: 25px;
        margin-bottom: 15px;
    }
.mx_EncryptionInfo_spinner {

    text-align: center;
}
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RoomSummaryCard .mx_BaseCard_header {
        text-align: center;
        margin-top: 20px;
    }
.mx_RoomSummaryCard .mx_BaseCard_header h2 {
            font-weight: 600;
            font-size: 1.8rem;
            margin: 12px 0 4px;
        }
.mx_RoomSummaryCard .mx_BaseCard_header .mx_RoomSummaryCard_alias {
            font-size: 1.3rem;
            color: #737D8C;
        }
.mx_RoomSummaryCard .mx_BaseCard_header .mx_RoomSummaryCard_topic {
            font-size: 1.3rem;
            color: #737D8C;
        }
.mx_RoomSummaryCard .mx_BaseCard_header h2, .mx_RoomSummaryCard .mx_BaseCard_header .mx_RoomSummaryCard_alias {
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: pre-wrap;
        }
.mx_RoomSummaryCard .mx_BaseCard_header .mx_RoomSummaryCard_avatar {
            display: -webkit-inline-box;
            display: -ms-inline-flexbox;
            display: inline-flex;
        }
.mx_RoomSummaryCard .mx_BaseCard_header .mx_RoomSummaryCard_avatar .mx_RoomSummaryCard_e2ee {
                display: inline-block;
                position: relative;
                width: 54px;
                height: 54px;
                border-radius: 50%;
                background-color: #737d8c;
                margin-top: -3px;
                margin-left: -10px;
                border: 3px solid #25262d;
            }
.mx_RoomSummaryCard .mx_BaseCard_header .mx_RoomSummaryCard_avatar .mx_RoomSummaryCard_e2ee::before {
                    content: '';
                    position: absolute;
                    top: 13px;
                    left: 13px;
                    height: 28px;
                    width: 28px;
                    -webkit-mask-size: cover;
                            mask-size: cover;
                    -webkit-mask-repeat: no-repeat;
                            mask-repeat: no-repeat;
                    -webkit-mask-position: center;
                            mask-position: center;
                    -webkit-mask-image: url(../../img/e2e/disabled.6c5c6be.svg);
                            mask-image: url(../../img/e2e/disabled.6c5c6be.svg);
                    background-color: #ffffff;
                }
.mx_RoomSummaryCard .mx_BaseCard_header .mx_RoomSummaryCard_avatar .mx_RoomSummaryCard_e2ee_normal {
                background-color: #424446;
            }
.mx_RoomSummaryCard .mx_BaseCard_header .mx_RoomSummaryCard_avatar .mx_RoomSummaryCard_e2ee_normal::before {
                    -webkit-mask-image: url(../../img/e2e/normal.76f0c09.svg);
                            mask-image: url(../../img/e2e/normal.76f0c09.svg);
                }
.mx_RoomSummaryCard .mx_BaseCard_header .mx_RoomSummaryCard_avatar .mx_RoomSummaryCard_e2ee_verified {
                background-color: #0dbd8b;
            }
.mx_RoomSummaryCard .mx_BaseCard_header .mx_RoomSummaryCard_avatar .mx_RoomSummaryCard_e2ee_verified::before {
                    -webkit-mask-image: url(../../img/e2e/verified.5be6c9f.svg);
                            mask-image: url(../../img/e2e/verified.5be6c9f.svg);
                }
.mx_RoomSummaryCard .mx_BaseCard_header .mx_RoomSummaryCard_avatar .mx_RoomSummaryCard_e2ee_warning {
                background-color: #ff5b55;
            }
.mx_RoomSummaryCard .mx_BaseCard_header .mx_RoomSummaryCard_avatar .mx_RoomSummaryCard_e2ee_warning::before {
                    -webkit-mask-image: url(../../img/e2e/warning.78bb264.svg);
                            mask-image: url(../../img/e2e/warning.78bb264.svg);
                }
.mx_RoomSummaryCard .mx_RoomSummaryCard_aboutGroup .mx_RoomSummaryCard_Button {
            padding-left: 44px;
        }
.mx_RoomSummaryCard .mx_RoomSummaryCard_aboutGroup .mx_RoomSummaryCard_Button::before {
                content: '';
                position: absolute;
                top: 8px;
                left: 10px;
                height: 24px;
                width: 24px;
                -webkit-mask-repeat: no-repeat;
                        mask-repeat: no-repeat;
                -webkit-mask-position: center;
                        mask-position: center;
                background-color: #8e99a4;
            }
.mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button {
            padding: 0;
            height: auto;
            color: #8D97A5;
        }
.mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_icon_app {
                padding: 10px 48px 10px 12px;
                text-overflow: ellipsis;
                overflow: hidden;
            }
.mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_icon_app .mx_BaseAvatar_image {
                    vertical-align: top;
                    margin-right: 12px;
                }
.mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_icon_app span {
                    color: #f0f0f1;
                }
.mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_pinToggle, .mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_maximise, .mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_minimise, .mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_options {
                position: absolute;
                top: 0;
                height: 100%;
                width: 24px;
                padding: 12px 4px;
                -webkit-box-sizing: border-box;
                        box-sizing: border-box;
                min-width: 24px;
            }
.mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_pinToggle:hover::after, .mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_maximise:hover::after, .mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_minimise:hover::after, .mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_options:hover::after {
                        content: '';
                        position: absolute;
                        height: 24px;
                        width: 24px;
                        top: 8px;
                        left: 0;
                        border-radius: 12px;
                        background-color: rgba(141, 151, 165, 0.1);
                    }
.mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_pinToggle::before, .mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_maximise::before, .mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_minimise::before, .mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_options::before {
                    content: '';
                    position: absolute;
                    height: 16px;
                    width: 16px;
                    -webkit-mask-repeat: no-repeat;
                            mask-repeat: no-repeat;
                    -webkit-mask-position: center;
                            mask-position: center;
                    -webkit-mask-size: 16px;
                            mask-size: 16px;
                    background-color: #8e99a4;
                }
.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.65783fb.svg);
                            mask-image: url(../../img/element-icons/room/pin-upright.65783fb.svg);
                }
.mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_maximise {
                right: 32px;
            }
.mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_maximise::before {
                    -webkit-mask-size: 14px;
                            mask-size: 14px;
                    -webkit-mask-image: url(../../img/element-icons/maximise-expand.2c239ea.svg);
                            mask-image: url(../../img/element-icons/maximise-expand.2c239ea.svg);
                }
.mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_minimise {
                right: 32px;
            }
.mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_minimise::before {
                    -webkit-mask-size: 14px;
                            mask-size: 14px;
                    -webkit-mask-image: url(../../img/element-icons/minimise-collapse.a59edfc.svg);
                            mask-image: url(../../img/element-icons/minimise-collapse.a59edfc.svg);
                    background-color: #4958F5;
                }
.mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_options {
                right: 8px;
                display: none;
            }
.mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_options::before {
                    -webkit-mask-image: url(../../img/element-icons/room/ellipsis.b82ece6.svg);
                            mask-image: url(../../img/element-icons/room/ellipsis.b82ece6.svg);
                }
.mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button .mx_RoomSummaryCard_app_options.mx_RoomSummaryCard_maximised_widget {
                    right: 8px;
                }
.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: #4958F5;
                }
.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: unset;
                }
.mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button::before {
                content: unset;
            }
.mx_RoomSummaryCard .mx_RoomSummaryCard_appsGroup .mx_RoomSummaryCard_Button::after {
                top: 8px;
                pointer-events: none;
            }
.mx_RoomSummaryCard .mx_AccessibleButton_kind_link {
        padding: 0;
        margin-top: 12px;
        margin-bottom: 12px;
        font-size: 1.3rem;
        font-weight: 600;
    }
.mx_RoomSummaryCard_icon_people::before {
    -webkit-mask-image: url(../../img/element-icons/room/members.88c3e93.svg);
            mask-image: url(../../img/element-icons/room/members.88c3e93.svg);
}
.mx_RoomSummaryCard_icon_files::before {
    -webkit-mask-image: url(../../img/element-icons/room/files.5709c0c.svg);
            mask-image: url(../../img/element-icons/room/files.5709c0c.svg);
}
.mx_RoomSummaryCard_icon_threads::before {
    -webkit-mask-image: url(../../img/element-icons/message/thread.bad77e9.svg);
            mask-image: url(../../img/element-icons/message/thread.bad77e9.svg);
}
.mx_RoomSummaryCard_icon_share::before {
    -webkit-mask-image: url(../../img/element-icons/room/share.54dc3fb.svg);
            mask-image: url(../../img/element-icons/room/share.54dc3fb.svg);
}
.mx_RoomSummaryCard_icon_settings::before {
    -webkit-mask-image: url(../../img/element-icons/settings.6b381af.svg);
            mask-image: url(../../img/element-icons/settings.6b381af.svg);
}
.mx_RoomSummaryCard_icon_pencil::before {
    -webkit-mask-image: url(../../img/element-icons/pencil.bd50147.svg);
            mask-image: url(../../img/element-icons/pencil.bd50147.svg);
}
.mx_RoomSummaryCard_icon_export::before {
    -webkit-mask-image: url(../../img/element-icons/export.4a4f177.svg);
            mask-image: url(../../img/element-icons/export.4a4f177.svg);
}
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_UserInfo.mx_BaseCard {
    padding-top: 0;
    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;
    overflow-y: auto;
    font-size: 1.2rem;
}
.mx_UserInfo.mx_BaseCard .mx_UserInfo_cancel {
        cursor: default;
        position: absolute;
        top: 0;
        border-radius: 4px;
        background-color: #25262d;
        margin: 9px;
        z-index: 1;
    }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_cancel div {
            height: 16px;
            width: 16px;
            padding: 4px;
            -webkit-mask-image: url(../../img/minimise.871d2de.svg);
                    mask-image: url(../../img/minimise.871d2de.svg);
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            -webkit-mask-position: 7px center;
                    mask-position: 7px center;
            background-color: #b9bec6;
        }
.mx_UserInfo.mx_BaseCard h2 {
        font-size: 1.8rem;
        font-weight: 600;
        margin: 18px 0 0 0;
    }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_container {
        padding: 8px 16px;
    }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_separator {
        border-bottom: 1px solid rgba(240,240,241, .1);
    }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_memberDetailsContainer {
        padding-top: 0;
        padding-bottom: 0;
        margin-bottom: 8px;
    }
.mx_UserInfo.mx_BaseCard .mx_RoomTile_nameContainer {
        width: 154px;
    }
.mx_UserInfo.mx_BaseCard .mx_RoomTile_badge {
        display: none;
    }
.mx_UserInfo.mx_BaseCard .mx_RoomTile_name {
        width: 160px;
    }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_avatar {
        margin: 24px 32px 0 32px;
    }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_avatar > div {
        max-width: 30vh;
        margin: 0 auto;
        -webkit-transition: 0.5s;
        transition: 0.5s;
    }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_avatar > div > div {
        /* use padding-top instead of height to make this element square,
        as the % in padding is a % of the width (including margin,
        that's why we had to put the margin to center on a parent div),
        and not a % of the parent height. */
        padding-top: 100%;
        position: relative;
    }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_avatar > div > div * {
        border-radius: 100%;
        position: absolute;
        top: 0;
        left: 0;
        width: 100% !important;
        height: 100% !important;
    }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_avatar .mx_BaseAvatar_initial {
        z-index: 1;
        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;
        font-size: 6rem !important;
        width: 100% !important;
        -webkit-transition: font-size 0.5s;
        transition: font-size 0.5s;
    }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_avatar .mx_BaseAvatar .mx_BaseAvatar_initial + .mx_BaseAvatar_image {
            cursor: default;
        }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_avatar .mx_BaseAvatar.mx_BaseAvatar_image {
            cursor: -webkit-zoom-in;
            cursor: zoom-in;
        }
.mx_UserInfo.mx_BaseCard h3 {
        text-transform: uppercase;
        color: #8D97A5;
        font-weight: 600;
        font-size: 1.2rem;
        margin: 4px 0;
    }
.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.8rem;
            line-height: 2.5rem;
            -webkit-box-flex: 1;
                -ms-flex: 1;
                    flex: 1;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
        }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_profile h2 span {
                display: -webkit-box;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 2;

                overflow: hidden;
                word-break: break-all;
                text-overflow: ellipsis;
            }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_profile h2 .mx_E2EIcon {
                margin-top: 3px;
                margin-right: 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 {
        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;

        margin: 6px 0;
    }
.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;
            margin: 11px 0 12px 0;
        }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_memberDetails .mx_UserInfo_profileField .mx_Field {
            margin: 0;
        }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_field {
        cursor: default;
        color: #4958F5;
        line-height: 1.6rem;
        margin: 8px 0;
    }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_field.mx_UserInfo_destructive {
            color: #FF5B55;
        }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_statusMessage {

        font-size: 1.1rem;
        line-height: 16px;
        opacity: 0.5;
        overflow: hidden;
        word-break: break-word;
        text-overflow: ellipsis;
        display: -webkit-box;
        max-height: calc(16px * 3);
        -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_container:not(.mx_UserInfo_separator) {
        padding-top: 16px;
        padding-bottom: 0;
    }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_container:not(.mx_UserInfo_separator) > :not(h3) {
            margin-left: 8px;
        }
.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: #4958F5;
                }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_devices .mx_UserInfo_device.mx_UserInfo_device_unverified .mx_UserInfo_device_trusted {
                    color: #FF5B55;
                }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_devices .mx_UserInfo_device .mx_UserInfo_device_name {
                -webkit-box-flex: 1;
                    -ms-flex: 1;
                        flex: 1;
                margin-right: 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;
            margin: 2px 5px 0 0;
            width: 12px;
            height: 12px;
        }
.mx_UserInfo.mx_BaseCard .mx_UserInfo_devices .mx_UserInfo_expand {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            margin-top: 11px;
        }
.mx_UserInfo.mx_BaseCard .mx_AccessibleButton.mx_AccessibleButton_hasKind {
        padding: 8px 18px;
    }
.mx_UserInfo.mx_BaseCard .mx_AccessibleButton.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_primary {
            color: #202127;
            background-color: #4958F5;
        }
.mx_UserInfo.mx_BaseCard .mx_AccessibleButton.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_danger {
            color: #d80915;
            background-color: rgba(255, 75, 85, 0.16);
        }
.mx_UserInfo.mx_UserInfo_smallAvatar .mx_UserInfo_avatar > div {
        max-width: 72px;
        margin: 0 auto;
    }
.mx_UserInfo.mx_UserInfo_smallAvatar .mx_UserInfo_avatar .mx_BaseAvatar_initial {
        font-size: 40px !important;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_VerificationPanel_verified_section .mx_E2EIcon, .mx_VerificationPanel_reciprocate_section .mx_E2EIcon {
        margin: 20px auto !important;
    }
.mx_UserInfo .mx_EncryptionPanel_cancel {
        -webkit-mask: url(../../img/feather-customised/cancel.23c2689.svg);
                mask: url(../../img/feather-customised/cancel.23c2689.svg);
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: cover;
                mask-size: cover;
        width: 14px;
        height: 14px;
        background-color: #d0d1d8;
        cursor: default;
        position: absolute;
        z-index: 100;
        top: 14px;
        right: 14px;
    }
.mx_UserInfo .mx_VerificationPanel_qrCode {
        padding: 4px 4px 0 4px;
        background: white;
        border-radius: 4px;
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        max-width: 100%;
        margin: 0 auto !important;
    }
.mx_UserInfo .mx_VerificationPanel_qrCode canvas {
            height: auto !important;
            width: 100% !important;
            max-width: 240px;
        }
.mx_UserInfo .mx_VerificationPanel_reciprocate_section .mx_AccessibleButton {
            width: 100%;
            -webkit-box-sizing: border-box;
                    box-sizing: border-box;
            padding: 10px;
            display: block;
            margin: 10px 0;
        }
.mx_Dialog .mx_VerificationPanel_QRPhase_startOptions, .mx_CompleteSecurity_body .mx_VerificationPanel_QRPhase_startOptions {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-top: 10px;
        margin-bottom: 10px;
        -webkit-box-align: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }
.mx_Dialog .mx_VerificationPanel_QRPhase_startOptions > .mx_VerificationPanel_QRPhase_betweenText, .mx_CompleteSecurity_body .mx_VerificationPanel_QRPhase_startOptions > .mx_VerificationPanel_QRPhase_betweenText {
            width: 50px;
            vertical-align: middle;
            text-align: center;
            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_Dialog .mx_VerificationPanel_QRPhase_startOptions .mx_VerificationPanel_QRPhase_startOption, .mx_CompleteSecurity_body .mx_VerificationPanel_QRPhase_startOptions .mx_VerificationPanel_QRPhase_startOption {
            background-color: #454854;
            border-radius: 10px;
            -webkit-box-flex: 1;
                -ms-flex: 1;
                    flex: 1;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            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;
            position: relative;
            max-width: 310px;
            -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                    justify-content: space-between;
        }
.mx_Dialog .mx_VerificationPanel_QRPhase_startOptions .mx_VerificationPanel_QRPhase_startOption canvas, .mx_Dialog .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_CompleteSecurity_body .mx_VerificationPanel_QRPhase_startOptions .mx_VerificationPanel_QRPhase_startOption .mx_VerificationPanel_QRPhase_noQR {
                width: 220px !important;
                height: 220px !important;
                background-color: #fff;
                border-radius: 4px;
                vertical-align: middle;
                text-align: center;
                padding: 10px;
            }
.mx_Dialog .mx_VerificationPanel_QRPhase_startOptions .mx_VerificationPanel_QRPhase_startOption > p, .mx_CompleteSecurity_body .mx_VerificationPanel_QRPhase_startOptions .mx_VerificationPanel_QRPhase_startOption > p {
                margin-top: 0;
                font-weight: 700;
            }
.mx_Dialog .mx_VerificationPanel_QRPhase_startOptions .mx_VerificationPanel_QRPhase_startOption .mx_VerificationPanel_QRPhase_helpText, .mx_CompleteSecurity_body .mx_VerificationPanel_QRPhase_startOptions .mx_VerificationPanel_QRPhase_startOption .mx_VerificationPanel_QRPhase_helpText {
                font-size: 1.4rem;
                margin: 30px 0;
                text-align: center;
            }
.mx_Dialog .mx_VerificationPanel_verified_section .mx_AccessibleButton, .mx_CompleteSecurity_body .mx_VerificationPanel_verified_section .mx_AccessibleButton {
            float: right;
        }
.mx_Dialog .mx_VerificationPanel_reciprocate_section .mx_AccessibleButton, .mx_CompleteSecurity_body .mx_VerificationPanel_reciprocate_section .mx_AccessibleButton {
            margin-left: 10px;
            padding: 7px 40px;
        }
.mx_Dialog .mx_VerificationPanel_reciprocate_section .mx_VerificationPanel_reciprocateButtons, .mx_CompleteSecurity_body .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;
        }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_WidgetCard {
    height: 100%;
    display: contents;
}
.mx_WidgetCard .mx_AppTileFullWidth {
        max-width: unset;
        width: auto !important;
        margin: 0px 8px 0px 8px;
        height: 100%;
        border: 0;
    }
.mx_WidgetCard .mx_BaseCard_header {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
    }
.mx_WidgetCard .mx_BaseCard_header > h2 {
            margin-right: 0;
            -webkit-box-flex: 1;
                -ms-flex-positive: 1;
                    flex-grow: 1;
        }
.mx_WidgetCard .mx_BaseCard_header .mx_WidgetCard_optionsButton {
            position: relative;
            margin-right: 44px;
            height: 20px;
            width: 20px;
            min-width: 20px;
            padding: 0;
        }
.mx_WidgetCard .mx_BaseCard_header .mx_WidgetCard_optionsButton::before {
                content: "";
                position: absolute;
                width: 20px;
                height: 20px;
                top: 0;
                left: 4px;
                -webkit-mask-repeat: no-repeat;
                        mask-repeat: no-repeat;
                -webkit-mask-position: center;
                        mask-position: center;
                -webkit-mask-size: contain;
                        mask-size: contain;
                -webkit-mask-image: url(../../img/element-icons/room/ellipsis.b82ece6.svg);
                        mask-image: url(../../img/element-icons/room/ellipsis.b82ece6.svg);
                background-color: #737D8C;
            }
.mx_WidgetCard_maxPinnedTooltip {
    background-color: #FF5B55;
    color: #ffffff;
}
/*
Copyright 2019 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AliasSettings_editable {
    border: 0px;
    border-bottom: 1px solid rgba(249, 248, 248, 0.2);
    padding: 0px;
    min-width: 240px;
}
.mx_AliasSettings_editable:focus {
    border-bottom: 1px solid #4958F5;
    outline: none;
    -webkit-box-shadow: none;
            box-shadow: none;
}
.mx_AliasSettings summary {
        cursor: default;
        color: #4958F5;
        font-weight: 600;
        list-style: none;
    }
.mx_AliasSettings summary::-webkit-details-marker {
            display: none;
        }
.mx_AliasSettings .mx_AliasSettings_localAliasHeader {
        margin-top: 35px;
    }
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AppsDrawer {
    margin: 8px;
    margin-right: calc(8px / 2);
    margin-bottom: 0;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -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_maximise {
        margin-bottom: 8px;
    }
.mx_AppsDrawer .mx_AppsContainer_resizerHandleContainer {
        width: 100%;
        height: 10px;
        display: block;
        position: relative;
    }
.mx_AppsDrawer .mx_AppsContainer_resizerHandle {
        cursor: ns-resize;
        width: 100% !important;
        height: 100% !important;
        position: absolute;
        bottom: 50% !important;
    }
.mx_AppsDrawer .mx_AppsContainer_resizerHandle::after {
            content: '';
            position: absolute;
            border-radius: 3px;

            height: 4px;
            bottom: 0;
            left: calc(50% - 32px);
            right: calc(50% - 32px);
        }
.mx_AppsDrawer:hover .mx_AppsContainer_resizerHandle::after {
            opacity: 0.8;
            background: #f0f0f1;
        }
.mx_AppsDrawer:hover .mx_ResizeHandle_horizontal::before {
            position: absolute;
            left: 3px;
            top: 50%;
            -webkit-transform: translate(0, -50%);
                    transform: translate(0, -50%);

            height: 64px;
            width: 4px;
            border-radius: 4px;

            content: '';

            background-color: #f0f0f1;
            opacity: 0.8;
        }
.mx_AppsContainer_resizer {
    margin-bottom: 8px;
}
.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;
            justify-content: center;
    height: 100%;
    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-radius: 10px 0 0 10px;
    }
.mx_AppsContainer .mx_AppTile:last-of-type {
        border-right-width: 8px;
        border-radius: 0 10px 10px 0;
    }
.mx_AppsContainer .mx_ResizeHandle_horizontal {
        position: relative;
    }
.mx_AppsContainer .mx_ResizeHandle_horizontal > div {
            width: 0;
        }
.mx_AppsDrawer_2apps .mx_AppTile {
    width: 50%;
}
.mx_AppsDrawer_2apps .mx_AppTile:nth-child(3) {
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
        width: 0 !important;
        min-width: 240px !important;
    }
.mx_AppsDrawer_3apps .mx_AppTile {
    width: 33%;
}
.mx_AppsDrawer_3apps .mx_AppTile:nth-child(3) {
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
        width: 0 !important;
        min-width: 240px !important;
    }
.mx_AppTile {
    width: 50%;
    min-width: 240px;
    border: 8px solid #424650;
    border-left-width: 5px;
    border-right-width: 5px;
    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-sizing: border-box;
            box-sizing: border-box;
    background-color: #424650;
}
.mx_AppTileFullWidth {
    width: 100% !important;
    margin: 0;
    padding: 0;
    border: 8px solid #424650;
    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;
    background-color: #424650;
}
.mx_AppTile_mini {
    width: 100%;
    margin: 0;
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    height: 200px;
}
.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 {
    width: 100%;
    height: 100%;
}
.mx_AppTileMenuBar {
    margin: 0;
    font-size: 1.2rem;
    background-color: #424650;
    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: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 100%;
    padding-top: 2px;
    padding-bottom: 8px;
}
.mx_AppTileMenuBarTitle {
    line-height: 20px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mx_AppTileMenuBarTitle .mx_WidgetAvatar {
        margin-right: 12px;
    }
.mx_AppTileMenuBarTitle > :last-child {
    margin-left: 9px;
}
.mx_AppTileMenuBarWidgets {
    float: right;
    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;
}
.mx_AppTileMenuBar_iconButton {
    width: 12px;
    height: 12px;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: 0 center;
            mask-position: 0 center;
    -webkit-mask-size: auto 12px;
            mask-size: auto 12px;
    background-color: #f0f0f1;
    margin: 0 5px;
}
.mx_AppTileMenuBar_iconButton.mx_AppTileMenuBar_iconButton_minWidget {
        -webkit-mask-size: auto 10px;
                mask-size: auto 10px;
        -webkit-mask-image: url(../../img/element-icons/minimise-collapse.a59edfc.svg);
                mask-image: url(../../img/element-icons/minimise-collapse.a59edfc.svg);
    }
.mx_AppTileMenuBar_iconButton.mx_AppTileMenuBar_iconButton_maxWidget {
        -webkit-mask-size: auto 10px;
                mask-size: auto 10px;
        -webkit-mask-image: url(../../img/element-icons/maximise-expand.2c239ea.svg);
                mask-image: url(../../img/element-icons/maximise-expand.2c239ea.svg);
    }
.mx_AppTileMenuBar_iconButton.mx_AppTileMenuBar_iconButton_popout {
        -webkit-mask-image: url(../../img/feather-customised/widget/external-link.7ab6751.svg);
                mask-image: url(../../img/feather-customised/widget/external-link.7ab6751.svg);
    }
.mx_AppTileMenuBar_iconButton.mx_AppTileMenuBar_iconButton_menu {
        -webkit-mask-image: url(../../img/element-icons/room/ellipsis.b82ece6.svg);
                mask-image: url(../../img/element-icons/room/ellipsis.b82ece6.svg);
    }
.mx_AppTileBody {
    height: 100%;
    width: 100%;
    overflow: hidden;
    border-radius: 8px;
    background-color: rgba(141, 151, 165, 0.2);
}
.mx_AppTileBody_mini {
    height: 200px;
    width: 100%;
    overflow: hidden;
    border-radius: 8px;
}
.mx_AppTile .mx_AppTileBody, .mx_AppTileFullWidth .mx_AppTileBody, .mx_AppTile_mini .mx_AppTileBody_mini {
    height: inherit;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
.mx_AppTileBody_mini iframe {
    border: none;
    width: 100%;
    height: 100%;
}
.mx_AppTileBody iframe {
    width: 100%;
    height: 100%;
    overflow: hidden;
    border: none;
    padding: 0;
    margin: 0;
    display: block;
}
.mx_AppPermissionWarning {
    text-align: center;
    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;
    font-size: 1.6rem;
}
.mx_AppPermissionWarning_row {
    margin-bottom: 12px;
}
.mx_AppPermissionWarning_smallText {
    font-size: 1.2rem;
}
.mx_AppPermissionWarning_bolder {
    font-weight: 600;
}
.mx_AppPermissionWarning h4 {
    margin: 0;
    padding: 0;
}
.mx_AppPermissionWarning_helpIcon {
    margin-top: 1px;
    margin-right: 2px;
    width: 10px;
    height: 10px;
    display: inline-block;
}
.mx_AppPermissionWarning_helpIcon::before {
    display: inline-block;
    background-color: #4958F5;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-size: 12px;
            mask-size: 12px;
    width: 12px;
    height: 12px;
    -webkit-mask-position: center;
            mask-position: center;
    content: '';
    vertical-align: middle;
    -webkit-mask-image: url(../../img/feather-customised/help-circle.03fb6cf.svg);
            mask-image: url(../../img/feather-customised/help-circle.03fb6cf.svg);
}
.mx_AppPermissionWarning_tooltip {
    -webkit-box-shadow: none;
            box-shadow: none;
    background-color: rgba(38, 39, 43, 0.82);
    color: #ffffff;
    border: none;
    border-radius: 3px;
    padding: 6px 8px;
}
.mx_AppPermissionWarning_tooltip ul {
        list-style-position: inside;
        padding-left: 2px;
        margin-left: 0;
    }
.mx_AppLoading {
    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;
    font-weight: bold;
    position: relative;
    height: 100%;
    background-color: rgba(141, 151, 165, 0.2) !important;
    border-radius: 8px;
}
.mx_AppLoading .mx_Spinner {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
.mx_AppLoading_spinner_fadeIn {
    -webkit-animation-fill-mode: backwards;
            animation-fill-mode: backwards;
    -webkit-animation-duration: 200ms;
            animation-duration: 200ms;
    -webkit-animation-delay: 500ms;
            animation-delay: 500ms;
    -webkit-animation-name: mx_AppLoading_spinner_fadeIn_animation;
            animation-name: mx_AppLoading_spinner_fadeIn_animation;
}
@-webkit-keyframes mx_AppLoading_spinner_fadeIn_animation {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes mx_AppLoading_spinner_fadeIn_animation {
    from { opacity: 0; }
    to { opacity: 1; }
}
.mx_AppLoading iframe {
    display: none;
}
.mx_AppsDrawer_resizing .mx_AppTile_persistedWrapper {
    z-index: 1;
}
.mx_Autocomplete {
    position: absolute;
    bottom: 0;
    z-index: 1001;
    width: 100%;
    border: 1px solid #404040;
    background: hsla(216, 21%, 14%, 1);
    border-bottom: none;
    border-radius: 8px 8px 0 0;
    overflow: clip;
    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-shadow: 0px -16px 32px rgba(0, 0, 0, 0.28);
            box-shadow: 0px -16px 32px rgba(0, 0, 0, 0.28);
}
.mx_Autocomplete_ProviderSection {
    border-bottom: 1px solid #404040;
    width: 100%;
}
/* a "block" completion takes up a whole line */
.mx_Autocomplete_Completion_block {
    min-height: 34px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    padding: 0 12px;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    cursor: default;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    color: #f0f0f1;
}
.mx_Autocomplete_Completion_block * {
    margin: 0 3px;
}
.mx_Autocomplete_Completion_pill {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    border-radius: 8px;
    height: 3.4rem;
    padding: 0.8rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    cursor: default;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    color: #f0f0f1;
}
.mx_Autocomplete_Completion_pill > * {
    margin-right: 0.3rem;
}
/* styling for common completion elements */
.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 {
    margin: 12px;
    height: 100%;
    overflow-y: scroll;
    max-height: 35vh;
}
.mx_Autocomplete_Completion_container_truncate .mx_Autocomplete_Completion_title, .mx_Autocomplete_Completion_container_truncate .mx_Autocomplete_Completion_subtitle, .mx_Autocomplete_Completion_container_truncate .mx_Autocomplete_Completion_description {
        /* Ellipsis for long names/subtitles/descriptions */
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
.mx_Autocomplete_Completion.selected, .mx_Autocomplete_Completion:hover {
    background: #454854;
    outline: none;
}
.mx_Autocomplete_provider_name {
    margin: 12px;
    color: #f0f0f1;
    font-weight: 400;
    opacity: 0.4;
}
/*
Copyright 2018 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.m_RoomView_auxPanel_stateViews {
    padding: 5px;
    padding-left: 19px;
    border-bottom: 1px solid #404040;
}
.m_RoomView_auxPanel_stateViews_span a {
    text-decoration: none;
    color: inherit;
}
.m_RoomView_auxPanel_stateViews_span[data-severity=warning] {
    font-weight: bold;
    color: orange;
}
.m_RoomView_auxPanel_stateViews_span[data-severity=alert] {
    font-weight: bold;
    color: red;
}
.m_RoomView_auxPanel_stateViews_span[data-severity=normal] {
    font-weight: normal;
}
.m_RoomView_auxPanel_stateViews_span[data-severity=notice] {
    font-weight: normal;
    color: #a2a2a2;
}
.m_RoomView_auxPanel_stateViews_delim {
    padding: 0 5px;
    color: #a2a2a2;
}
/*
Copyright 2019 New Vector Ltd
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_BasicMessageComposer {
    position: relative;
}
.mx_BasicMessageComposer .mx_Pill {
        background: #35363d;
    }
.mx_BasicMessageComposer .mx_BasicMessageComposer_inputEmpty > :first-child::before {
        content: var(--placeholder);
        width: 0;
        height: 0;
        overflow: visible;
        display: inline-block;
        pointer-events: none;
        white-space: nowrap;
        color: #76767b;
    }
.mx_BasicMessageComposer .mx_BasicMessageComposer_inputEmpty--colourful > :first-child::before {
        content: var(--placeholder);
        width: 0;
        height: 0;
        overflow: visible;
        display: inline-block;
        pointer-events: none;
        white-space: nowrap;
        color: rgb(255 255 255 / 50%);
        font-size: 14px;
        font-weight: 500;
    }
@-webkit-keyframes visualbell {
        from { background-color: #800; }
        to { background-color: hsla(216, 21%, 14%, 1); }
    }
@keyframes visualbell {
        from { background-color: #800; }
        to { background-color: hsla(216, 21%, 14%, 1); }
    }
.mx_BasicMessageComposer.mx_BasicMessageComposer_input_error {
        -webkit-animation: 0.2s visualbell;
                animation: 0.2s visualbell;
    }
.mx_BasicMessageComposer .mx_BasicMessageComposer_input {
        white-space: pre-wrap;
        word-wrap: break-word;
        outline: none;
        overflow-x: hidden;
    }
.mx_BasicMessageComposer .mx_BasicMessageComposer_input.mx_BasicMessageComposer_input_shouldShowPillAvatar {
            padding: 14px 0;
            color: #efeff0;
        }
.mx_BasicMessageComposer .mx_BasicMessageComposer_input.mx_BasicMessageComposer_input_disabled {
            pointer-events: none;
        }
.mx_BasicMessageComposer .mx_BasicMessageComposer_AutoCompleteWrapper {
        position: relative;
        height: 0;
    }
.mx_Dialog_body .mx_BasicMessageComposer_AutoCompleteWrapper {
        position: fixed;
        width: 350px;
    }
.mx_Dialog_body .mx_BasicMessageComposer_AutoCompleteWrapper::-webkit-scrollbar {
            display: none;
        }
.mx_Dialog_body .mx_BasicMessageComposer_AutoCompleteWrapper {
        -ms-overflow-style: none;
        scrollbar-width: none;
}
.bp_BannerCloseButtonWrapper {
  background: #585E74;
  border-radius: 80px;
  margin-right: 10px;
  width: 30px;
  height: 30px;
  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;
  cursor: default;
}
.bp_BannerCloseButton {
    -webkit-mask: url(../../img/feather-customised/cancel.23c2689.svg);
            mask: url(../../img/feather-customised/cancel.23c2689.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    width: 16px;
    height: 16px;
    border-radius: 80px;
    background: #F0F0F1;
}
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_E2EIcon {
    width: 16px;
    height: 16px;
    margin: 0 9px;
    position: relative;
    display: block;
}
.mx_E2EIcon_warning::before, .mx_E2EIcon_warning::after, .mx_E2EIcon_normal::before, .mx_E2EIcon_normal::after, .mx_E2EIcon_verified::before, .mx_E2EIcon_verified::after {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: contain;
                mask-size: contain;
    }
.mx_E2EIcon::before {
    background-color: #ffffff;
    -webkit-mask-image: url(../../img/e2e/normal.76f0c09.svg);
            mask-image: url(../../img/e2e/normal.76f0c09.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-size: 80%;
            mask-size: 80%;
}
.mx_E2EIcon_bordered {
    -webkit-mask-image: url(../../img/e2e/normal.76f0c09.svg);
            mask-image: url(../../img/e2e/normal.76f0c09.svg);
    background-color: #454854;
}
.mx_E2EIcon_bordered::after {
        -webkit-mask-size: 75%;
                mask-size: 75%;
    }
.mx_E2EIcon_bordered::before {
        -webkit-mask-size: 60%;
                mask-size: 60%;
    }
.mx_E2EIcon_warning::after {
    -webkit-mask-image: url(../../img/e2e/warning.78bb264.svg);
            mask-image: url(../../img/e2e/warning.78bb264.svg);
    background-color: #FF5B55;
}
.mx_E2EIcon_normal::after {
    -webkit-mask-image: url(../../img/e2e/normal.76f0c09.svg);
            mask-image: url(../../img/e2e/normal.76f0c09.svg);
    background-color: #b9bec6;
}
.mx_E2EIcon_verified::after {
    -webkit-mask-image: url(../../img/e2e/verified.5be6c9f.svg);
            mask-image: url(../../img/e2e/verified.5be6c9f.svg);
    background-color: #4958F5;
}
/*
Copyright 2019 New Vector Ltd
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_EditMessageComposer {

    padding: 3px;
    overflow: visible !important;
}
.mx_EditMessageComposer .mx_BasicMessageComposer_input {
        border-radius: 4px;
        border: solid 1px #404040;
        background-color: hsla(216, 21%, 14%, 1);
        max-height: 200px;
        padding: 3px 6px;
    }
.mx_EditMessageComposer .mx_BasicMessageComposer_input:focus {
            border-color: rgba(73,88,245, 0.5);
        }
.mx_EditMessageComposer .mx_EditMessageComposer_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;
        padding: 5px;
        position: absolute;
        left: 0;
        background: #454854;
        z-index: 100;
        right: 0;
        margin: 0 -110px 0 0;
        padding-right: 147px;
    }
.mx_EditMessageComposer .mx_EditMessageComposer_buttons .mx_AccessibleButton {
            margin-left: 5px;
            padding: 5px 40px;
        }
.mx_EventTile_last .mx_EditMessageComposer_buttons {
    position: static;
    margin-right: -147px;
}
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_EntityTile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    color: #f0f0f1;
    cursor: default;
}
.mx_EntityTile .mx_E2EIcon {
        margin: 0;
        position: absolute;
        bottom: 2px;
        right: 7px;
        z-index: 6;
    }
.mx_EntityTile:hover {
    padding-right: 30px;
    position: relative;
}
.mx_EntityTile:hover::before {
    content: "";
    position: absolute;
    top: calc(50% - 8px);
    right: -8px;
    -webkit-mask: url(../../img/member_chevron.4163a20.png);
            mask: url(../../img/member_chevron.4163a20.png);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    width: 16px;
    height: 16px;
    background-color: #b9bec6;
}
.mx_EntityTile_invite {
    display: table-cell;
    vertical-align: middle;
    margin-left: 10px;
    width: 26px;
}
.mx_EntityTile_avatar, .mx_GroupRoomTile_avatar {
    padding-left: 3px;
    padding-right: 12px;
    padding-top: 4px;
    padding-bottom: 4px;
    position: relative;
}
.mx_EntityTile_name, .mx_GroupRoomTile_name {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 0px;
            flex: 1 1 0;
    overflow: hidden;
    font-size: 1.4rem;
    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 {
    font-style: italic;
    color: #f0f0f1;
}
.mx_EntityTile_invitePlaceholder .mx_EntityTile_name {
    font-style: italic;
    color: #f0f0f1;
}
.mx_EntityTile_unavailable .mx_EntityTile_avatar, .mx_EntityTile_unavailable .mx_EntityTile_name, .mx_EntityTile_offline_beenactive .mx_EntityTile_avatar, .mx_EntityTile_offline_beenactive .mx_EntityTile_name {
    opacity: 0.5;
}
.mx_EntityTile_offline_neveractive .mx_EntityTile_avatar, .mx_EntityTile_offline_neveractive .mx_EntityTile_name {
    opacity: 0.25;
}
.mx_EntityTile_unknown .mx_EntityTile_avatar, .mx_EntityTile_unknown .mx_EntityTile_name {
    opacity: 0.25;
}
.mx_EntityTile_subtext {
    font-size: 1.1rem;
    opacity: 0.5;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: clip;
}
.mx_EntityTile_power {
    -webkit-padding-start: 6px;
            padding-inline-start: 6px;
    font-size: 1.0rem;
    color: #8D97A5;
    max-width: 6em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.mx_EntityTile:hover .mx_EntityTile_power {
    display: none;
}
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_GroupLayout .mx_EventTile > .mx_SenderProfile {
            line-height: 2.0rem;
            margin-left: 64px;
        }
.mx_GroupLayout .mx_EventTile > .mx_EventTile_avatar {
            position: absolute;
            z-index: 9;
        }
.mx_GroupLayout .mx_EventTile .mx_EventTile_line, .mx_GroupLayout .mx_EventTile .mx_EventTile_reply {
            line-height: 2.2rem;
        }
/* Compact layout overrides */
.mx_MatrixChat_useCompactLayout .mx_EventTile {
        padding-top: 4px;
    }
.mx_MatrixChat_useCompactLayout .mx_EventTile .mx_EventTile_line, .mx_MatrixChat_useCompactLayout .mx_EventTile .mx_EventTile_reply {
            padding-top: 0;
            padding-bottom: 0;
        }
.mx_MatrixChat_useCompactLayout .mx_EventTile.mx_EventTile_info {
            padding-top: 0px;
            font-size: 1.3rem;
        }
.mx_MatrixChat_useCompactLayout .mx_EventTile.mx_EventTile_info .mx_EventTile_line, .mx_MatrixChat_useCompactLayout .mx_EventTile.mx_EventTile_info .mx_EventTile_reply {
                line-height: 2.0rem;
            }
.mx_MatrixChat_useCompactLayout .mx_EventTile.mx_EventTile_info .mx_EventTile_avatar {
                top: 4px;
            }
.mx_MatrixChat_useCompactLayout .mx_EventTile .mx_SenderProfile {
            font-size: 1.3rem;
        }
.mx_MatrixChat_useCompactLayout .mx_EventTile.mx_EventTile_emote {
            padding-top: 8px;
        }
.mx_MatrixChat_useCompactLayout .mx_EventTile.mx_EventTile_emote .mx_EventTile_avatar {
                top: 2px;
            }
.mx_MatrixChat_useCompactLayout .mx_EventTile.mx_EventTile_emote .mx_EventTile_line, .mx_MatrixChat_useCompactLayout .mx_EventTile.mx_EventTile_emote .mx_EventTile_reply {
                padding-top: 0px;
                padding-bottom: 1px;
            }
.mx_MatrixChat_useCompactLayout .mx_EventTile.mx_EventTile_emote.mx_EventTile_continuation {
            padding-top: 0;
        }
.mx_MatrixChat_useCompactLayout .mx_EventTile.mx_EventTile_emote.mx_EventTile_continuation .mx_EventTile_line, .mx_MatrixChat_useCompactLayout .mx_EventTile.mx_EventTile_emote.mx_EventTile_continuation .mx_EventTile_reply {
                padding-top: 0px;
                padding-bottom: 0px;
            }
.mx_MatrixChat_useCompactLayout .mx_EventTile .mx_EventTile_avatar {
            top: 2px;
        }
.mx_MatrixChat_useCompactLayout .mx_EventTile .mx_EventTile_e2eIcon {
            top: 3px;
        }
.mx_MatrixChat_useCompactLayout .mx_EventTile .mx_EventTile_readAvatars {
            top: -2rem;
        }
.mx_MatrixChat_useCompactLayout .mx_EventTile .mx_EventTile_content .markdown-body p, .mx_MatrixChat_useCompactLayout .mx_EventTile .mx_EventTile_content .markdown-body ul, .mx_MatrixChat_useCompactLayout .mx_EventTile .mx_EventTile_content .markdown-body ol, .mx_MatrixChat_useCompactLayout .mx_EventTile .mx_EventTile_content .markdown-body dl, .mx_MatrixChat_useCompactLayout .mx_EventTile .mx_EventTile_content .markdown-body blockquote, .mx_MatrixChat_useCompactLayout .mx_EventTile .mx_EventTile_content .markdown-body pre, .mx_MatrixChat_useCompactLayout .mx_EventTile .mx_EventTile_content .markdown-body table {
                margin-bottom: 4px;
            }
.mx_MatrixChat_useCompactLayout .mx_RoomView_MessageList h2 {
        margin-top: 6px;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_IRCLayout {
    --name-width: 70px;

    line-height: 1.8rem !important;
}
.mx_IRCLayout .mx_EventTile > a {
            text-decoration: none;
            min-width: 45px;
        }
.mx_IRCLayout .mx_EventTile {

        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;
        padding-top: 0;
}
.mx_IRCLayout .mx_EventTile > * {
            margin-right: 5px;
        }
.mx_IRCLayout .mx_EventTile .mx_ThreadInfo {
            margin-right: 0;
            margin-left: 0;
        }
.mx_IRCLayout .mx_EventTile > .mx_EventTile_msgOption {
            -webkit-box-ordinal-group: 6;
                -ms-flex-order: 5;
                    order: 5;
            -ms-flex-negative: 0;
                flex-shrink: 0;
        }
.mx_IRCLayout .mx_EventTile > .mx_EventTile_msgOption .mx_EventTile_readAvatars {
                top: 0.2rem;
            }
.mx_IRCLayout .mx_EventTile .mx_EventTile_line, .mx_IRCLayout .mx_EventTile .mx_EventTile_reply {
            padding: 0;
            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-ordinal-group: 4;
                -ms-flex-order: 3;
                    order: 3;
            -webkit-box-flex: 1;
                -ms-flex-positive: 1;
                    flex-grow: 1;
            -ms-flex-negative: 1;
                flex-shrink: 1;
            min-width: 0;
        }
.mx_IRCLayout .mx_EventTile > .mx_EventTile_avatar {
            -webkit-box-ordinal-group: 2;
                -ms-flex-order: 1;
                    order: 1;
            position: relative;
            top: 0;
            left: 0;
            -ms-flex-negative: 0;
                flex-shrink: 0;
            height: 1.8rem;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
        }
.mx_IRCLayout .mx_EventTile > .mx_EventTile_avatar > .mx_BaseAvatar, .mx_IRCLayout .mx_EventTile > .mx_EventTile_avatar > .mx_BaseAvatar > * {
                height: 1.4rem !important;
                width: 1.4rem !important;
                font-size: 1.0rem !important;
                line-height: 1.5rem !important;
            }
.mx_IRCLayout .mx_EventTile .mx_MessageTimestamp {
            font-size: 1.0rem;
            width: 45px;
            text-align: right;
        }
.mx_IRCLayout .mx_EventTile > .mx_EventTile_e2eIcon {
            position: absolute;
            right: unset;
            left: unset;
            top: 0;

            padding: 0;

            -ms-flex-negative: 0;

                flex-shrink: 0;
            -webkit-box-flex: 0;
                -ms-flex-positive: 0;
                    flex-grow: 0;

            height: 1.8rem;

            background-position: center;
        }
.mx_IRCLayout .mx_EventTile .mx_EventTile_line .mx_EventTile_e2eIcon, .mx_IRCLayout .mx_EventTile .mx_EventTile_line .mx_TextualEvent, .mx_IRCLayout .mx_EventTile .mx_EventTile_line .mx_MTextBody {
                display: inline-block;
            }
.mx_IRCLayout .mx_EventTile .mx_EvenTile_line .mx_MessageActionBar, .mx_IRCLayout .mx_EventTile .mx_EvenTile_line .mx_ReplyChain_wrapper {
            display: block;
        }
.mx_IRCLayout .mx_EventTile .mx_EventTile_reply {
            -webkit-box-ordinal-group: 5;
                -ms-flex-order: 4;
                    order: 4;
        }
.mx_IRCLayout .mx_EventTile .mx_EditMessageComposer_buttons {
            position: relative;
        }
.mx_IRCLayout .mx_EventTile .mx_ReactionsRow {
            padding-left: 0;
            padding-right: 0;
        }
.mx_IRCLayout .mx_EventTile_emote > .mx_EventTile_avatar {
            margin-left: calc(var(--name-width) + 14px + 5px);
        }
.mx_IRCLayout blockquote {
        margin: 0;
    }
.mx_IRCLayout .mx_EventListSummary > .mx_EventTile_line {
            padding-left: calc(var(--name-width) + 14px + 45px + 3 * 5px);
        }
.mx_IRCLayout .mx_EventListSummary .mx_EventListSummary_avatars {
            padding: 0;
            margin: 0 9px 0 0;
        }
.mx_IRCLayout .mx_EventTile.mx_EventTile_info .mx_EventTile_avatar {
            left: calc(var(--name-width) + 10px + 14px);
            top: 0;
        }
.mx_IRCLayout .mx_EventTile.mx_EventTile_info .mx_EventTile_line {
            left: calc(var(--name-width) + 10px + 14px);
        }
.mx_IRCLayout .mx_EventTile.mx_EventTile_info .mx_TextualEvent {
            line-height: 1.8rem;
        }
.mx_IRCLayout .mx_EventTile:hover.mx_EventTile_verified .mx_EventTile_line, .mx_IRCLayout .mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line, .mx_IRCLayout .mx_EventTile:hover.mx_EventTile_unknown .mx_EventTile_line {
        padding-left: 0;
        border-left: 0;
    }
.mx_IRCLayout .mx_SenderProfile {
        width: var(--name-width);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-ordinal-group: 3;
            -ms-flex-order: 2;
                order: 2;
        -ms-flex-negative: 0;
            flex-shrink: 0;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }
.mx_IRCLayout .mx_SenderProfile > .mx_SenderProfile_displayName {
            width: 100%;
            text-align: end;
            overflow: hidden;
            text-overflow: ellipsis;
        }
.mx_IRCLayout .mx_SenderProfile > .mx_SenderProfile_mxid {
            visibility: collapse;
        }
.mx_IRCLayout .mx_SenderProfile:hover {
        overflow: visible;
        z-index: 10;
    }
.mx_IRCLayout .mx_SenderProfile:hover > .mx_SenderProfile_displayName {
            overflow: visible;
        }
.mx_IRCLayout .mx_SenderProfile:hover > .mx_SenderProfile_mxid {
            visibility: visible;
        }
.mx_IRCLayout .mx_ReplyChain {
        margin: 0;
    }
.mx_IRCLayout .mx_ReplyChain .mx_SenderProfile {
            -webkit-box-ordinal-group: unset;
                -ms-flex-order: unset;
                    order: unset;
            max-width: unset;
            width: unset;
            background: transparent;
        }
.mx_IRCLayout .mx_ReplyChain .mx_EventTile_emote > .mx_EventTile_avatar {
                margin-left: 0;
                margin-left: initial;
            }
.mx_IRCLayout .mx_ReplyChain .mx_MessageTimestamp {
            width: auto;
            width: initial;
        }
/**
         * adding the icon back in the document flow
         * if it's not present, there's no unwanted wasted space
         */
.mx_IRCLayout .mx_ReplyChain .mx_EventTile_e2eIcon {
            position: relative;
            -webkit-box-ordinal-group: 0;
                -ms-flex-order: -1;
                    order: -1;
        }
.mx_IRCLayout .mx_ProfileResizer {
        position: absolute;
        height: 100%;
        width: 15px;
        left: calc(80px + var(--name-width));
        cursor: col-resize;
        z-index: 100;
    }
.mx_IRCLayout .mx_Flair > img {
        height: 1.4rem !important;
        width: 1.4rem !important;
    }
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
@charset "utf-8";
.mx_JumpToBottomButton {
    z-index: 1000;
    position: absolute;
    bottom: 12px;
    right: 24px;
    width: 38px;
    height: 50px;
    text-align: center;
}
.mx_JumpToBottomButton_badge {
    position: relative;
    top: -12px;
    border-radius: 16px;
    font-weight: bold;
    font-size: 1.2rem;
    line-height: 1.4rem;
    text-align: center;
    display: inline-block;
    padding: 0 4px;
    color: #202127;
    background-color: #b9bec6;
}
.mx_JumpToBottomButton_highlight .mx_JumpToBottomButton_badge {
    color: #25262d;
    background-color: #FF5B55;
}
.mx_JumpToBottomButton_scrollDown {
    position: relative;
    display: block;
    height: 38px;
    border-radius: 19px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    background: hsla(216, 21%, 14%, 1);
    border: 1.3px solid #b9bec6;
    cursor: default;
}
.mx_JumpToBottomButton_scrollDown::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    -webkit-mask-image: url(../../img/feather-customised/chevron-down-thin.f9a2477.svg);
            mask-image: url(../../img/feather-customised/chevron-down-thin.f9a2477.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-size: contain;
            mask-size: contain;
    background: #b9bec6;
}
.bp_LinkPreview {

    margin-top: 2px;
    border-radius: 12px;
    overflow: hidden;
    cursor: default;
}
.bp_LinkPreview a {
        text-decoration: none;
        color: unset;
    }
.bp_LinkPreview_CoverImage {
        -o-object-fit: cover;
           object-fit: cover;
        margin-bottom: -6px;
    }
.bp_LinkPreview_InfoBox {
        background-color: #35363d;
        padding: 10px;
    }
.bp_LinkPreview_url {
        font-size: 12px;
        color: #B547E9;
        margin: 4px 0;
    }
.bp_LinkPreview_description {
        font-size: 13px;
        color: #949598;
    }
.bp_LinkPreview .bp_LinkPreview_InfoBox {
        background: hsla(
            var(--default-avatar-hue),
            100%,
            70%,
            0.07);
        background: hsla(
            var(--avatar-hue, var(--default-avatar-hue)),
            var(--message-bg-saturation),
            var(--message-bg-lightness),
            var(--message-bg-opacity)
        );
    }
.line_limit {
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-box-orient: vertical;
  display: -webkit-box;
}
.line_limit.one {
      -webkit-line-clamp: 1;
  }
.line_limit.two {
      -webkit-line-clamp: 2;
  }
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_LinkPreviewWidget {
    margin-top: 15px;
    margin-right: 15px;
    margin-bottom: 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-left: 2px solid #ddd;
    border-radius: 2px;
    color: #888;
}
.mx_LinkPreviewWidget_image {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100px;
            flex: 0 0 100px;
    text-align: center;
    cursor: default;
}
.mx_LinkPreviewWidget_caption {
    margin-left: 15px;
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    overflow: hidden;
}
.mx_LinkPreviewWidget_title {
    font-weight: bold;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.mx_LinkPreviewWidget_title .mx_LinkPreviewWidget_siteName {
        font-weight: normal;
    }
.mx_LinkPreviewWidget_description {
    margin-top: 8px;
    white-space: normal;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
.mx_MatrixChat_useCompactLayout .mx_LinkPreviewWidget {
        margin-top: 6px;
        margin-bottom: 6px;
    }
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MemberInfo {
    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;
    overflow-y: auto;
    margin-top: 8px;
}
.mx_MemberInfo_name {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.mx_MemberInfo_name > .mx_E2EIcon {
    margin-right: 0;
}
.mx_MemberInfo_cancel {
    height: 16px;
    width: 16px;
    padding: 10px 0 10px 10px;
    cursor: default;
    -webkit-mask-image: url(../../img/minimise.871d2de.svg);
            mask-image: url(../../img/minimise.871d2de.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: 16px center;
            mask-position: 16px center;
    background-color: #b9bec6;
}
.mx_MemberInfo_name h2 {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    overflow-x: auto;
    max-height: 50px;
}
.mx_MemberInfo h2 {
    font-size: 1.8rem;
    font-weight: 600;
    margin: 16px 0 16px 15px;
}
.mx_MemberInfo_container {
    margin: 0 16px 16px 16px;
}
.mx_MemberInfo .mx_RoomTile_nameContainer {
    width: 154px;
}
.mx_MemberInfo .mx_RoomTile_badge {
    display: none;
}
.mx_MemberInfo .mx_RoomTile_name {
    width: 160px;
}
.mx_MemberInfo_avatar {
    background: rgba(38, 39, 43, 0.82);
    margin-bottom: 16px;
}
.mx_MemberInfo_avatar > img {
    height: auto;
    width: 100%;
    max-height: 30vh;
    -o-object-fit: contain;
       object-fit: contain;
    display: block;
}
.mx_MemberInfo_avatar .mx_BaseAvatar.mx_BaseAvatar_image {
    cursor: -webkit-zoom-in;
    cursor: zoom-in;
}
.mx_MemberInfo_profile {
    margin-bottom: 16px;
}
.mx_MemberInfo h3 {
    text-transform: uppercase;
    color: rgba(208, 209, 216, 0.6);
    font-weight: bold;
    font-size: 1.2rem;
    margin: 4px 0;
}
.mx_MemberInfo_profileField {
    font-size: 1.5rem;
    position: relative;
}
.mx_MemberInfo_buttons {
    margin-bottom: 16px;
}
.mx_MemberInfo_field {
    cursor: default;
    font-size: 1.5rem;
    color: #f0f0f1;
    margin-left: 8px;
    line-height: 2.3rem;
}
.mx_MemberInfo_createRoom {
    cursor: default;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 0 8px;
}
.mx_MemberInfo_createRoom_label {
    width: auto !important;
    width: initial !important;
    cursor: default;
}
.mx_MemberInfo label {
    font-size: 1.3rem;
}
.mx_MemberInfo label .mx_MemberInfo_label_text {
    display: inline-block;
    max-width: 180px;
    vertical-align: text-top;
}
.mx_MemberInfo input[type="radio"] {
    vertical-align: -2px;
    margin-right: 5px;
    margin-left: 8px;
}
.mx_MemberInfo_statusMessage {
    font-size: 1.1rem;
    opacity: 0.5;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: clip;
}
.mx_MemberInfo .mx_MemberInfo_scrollContainer {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MemberList, .mx_GroupMemberList, .mx_GroupRoomList {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    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;
}
.mx_MemberList .mx_Spinner, .mx_GroupMemberList .mx_Spinner, .mx_GroupRoomList .mx_Spinner {
        -webkit-box-flex: 1;
            -ms-flex: 1 0 auto;
                flex: 1 0 auto;
    }
.mx_MemberList .mx_SearchBox, .mx_GroupMemberList .mx_SearchBox, .mx_GroupRoomList .mx_SearchBox {
        margin-bottom: 5px;
    }
.mx_MemberList h2, .mx_GroupMemberList h2, .mx_GroupRoomList h2 {
        text-transform: uppercase;
        color: #f0f0f1;
        font-weight: 600;
        font-size: 1.3rem;
        padding-left: 3px;
        padding-right: 12px;
        margin-top: 8px;
        margin-bottom: 4px;
    }
.mx_MemberList .mx_AutoHideScrollbar, .mx_GroupMemberList .mx_AutoHideScrollbar, .mx_GroupRoomList .mx_AutoHideScrollbar {
        -webkit-box-flex: 1;
            -ms-flex: 1 1 0px;
                flex: 1 1 0;
    }
.mx_MemberList .mx_RightPanel_scopeHeader, .mx_GroupMemberList .mx_RightPanel_scopeHeader, .mx_GroupRoomList .mx_RightPanel_scopeHeader {
        margin-top: -8px;
    }
.mx_GroupMemberList_query, .mx_GroupRoomList_query {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
}
.mx_MemberList_chevron {
    position: absolute;
    right: 35px;
    margin-top: -15px;
}
.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: 1.2rem;
    }
.mx_MemberList_wrapper {
    padding: 10px;
}
.mx_MemberList_invite {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    position: relative;
    background-color: #4958F5;
    border-radius: 4px;
    margin: 5px 9px 9px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    color: white;
    font-weight: 600;
}
.mx_MemberList_invite.mx_AccessibleButton_disabled {
    background-color: #888;
    cursor: not-allowed;
}
.mx_MemberList_invite span {
    padding: 8px 0;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
}
.mx_MemberList_invite span::before {
        content: '';
        display: inline-block;
        background-color: white;
        -webkit-mask-image: url(../../img/element-icons/room/invite.946a71b.svg);
                mask-image: url(../../img/element-icons/room/invite.946a71b.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;
        height: 20px;
        margin-right: 5px;
    }
.mx_MemberList_inviteCommunity span::before {
    -webkit-mask-image: url(../../img/icon-invite-people.d82f491.svg);
            mask-image: url(../../img/icon-invite-people.d82f491.svg);
}
.mx_MemberList_addRoomToCommunity span::before {
    -webkit-mask-image: url(../../img/icons-room-add.bd36e26.svg);
            mask-image: url(../../img/icons-room-add.bd36e26.svg);
}
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2018 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MessageComposer_wrapper {
    vertical-align: middle;
    margin: auto;
    position: relative;
    padding-left: 10px;
}
.mx_MessageComposer_replaced_wrapper {
    margin-left: auto;
    margin-right: auto;
}
.mx_MessageComposer_replaced_valign {
    height: 60px;
    display: table-cell;
    vertical-align: middle;
}
.mx_MessageComposer_roomReplaced_icon {
    float: left;
    margin-right: 20px;
    margin-top: 5px;
    width: 31px;
    height: 31px;
}
.mx_MessageComposer_roomReplaced_header {
    font-weight: bold;
}
.mx_MessageComposer_autocomplete_wrapper {
    position: relative;
    height: 0;
}
.mx_MessageComposer_row {
    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_MessageComposer .mx_MessageComposer_avatar {
    position: absolute;
    left: 26px;
}
.mx_MessageComposer .mx_MessageComposer_avatar .mx_BaseAvatar {
    display: block;
}
.mx_MessageComposer_composecontrols {
    width: 100%;
}
.mx_MessageComposer_e2eIcon.mx_E2EIcon {
    position: absolute;
    left: 20px;
    margin-right: 0;
    margin-left: 3px;
    width: 12px;
    height: 12px;
}
.mx_MessageComposer_noperm_error {
    width: 100%;
    height: 60px;
    font-style: italic;
    color: #888;
    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;
    text-align: center;
}
.mx_MessageComposer_input_wrapper {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    cursor: text;
}
.mx_MessageComposer_input {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    vertical-align: middle;
    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: 60px;
    -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-size: 1.4rem;
    margin-right: 6px;
}
.mx_MessageComposer_editor {
    width: 100%;
    max-height: 120px;
    min-height: 19px;
    overflow-y: auto;
    overflow-x: hidden;
    word-break: break-word;
}
.mx_MessageComposer_editor > :first-child {
    margin-top: 0 !important;
}
.mx_MessageComposer_editor > :last-child {
    margin-bottom: 0 !important;
}
@keyframes visualbell {
    from { background-color: #800; }
    to { background-color: hsla(216, 21%, 14%, 1); }
}
.mx_MessageComposer_input_error {
    -webkit-animation: 0.2s visualbell;
            animation: 0.2s visualbell;
}
.mx_MessageComposer_input pre {
    background-color: rgba(0, 0, 0, 0.04);
    border-radius: 3px;
    padding: 10px;
}
.mx_MessageComposer_input textarea {
    display: block;
    width: 100%;
    padding: 0px;
    margin-top: 6px;
    margin-bottom: 6px;
    border: 0px;
    resize: none;
    outline: none;
    -webkit-box-shadow: none;
            box-shadow: none;
    color: #f0f0f1;
    background-color: hsla(216, 21%, 14%, 1);
    font-size: 1.4rem;
    max-height: 120px;
    overflow: auto;
}
/* hack for FF as vertical alignment of custom placeholder text is broken */
.mx_MessageComposer_input textarea::-moz-placeholder {
    line-height: 100%;
    color: #4958F5;
    opacity: 1.0;
}
.mx_MessageComposer_input textarea::-webkit-input-placeholder {
    color: #4958F5;
}
.mx_MessageComposer_button_highlight {
    background: rgba(73,88,245, 0.25);
}
.mx_MessageComposer_button_highlight::before {
        background-color: #4958F5 !important;
    }
.mx_MessageComposer_button_highlight--colourful {
    opacity: 1 !important;
}
.mx_MessageComposer_button_colored::before {
        background-color: linear-gradient(120deg, #a93fe9 12px, #4958f5) !important;
    }
.mx_ContextualMenu .mx_MessageComposer_button {
        width: auto;
    }
.mx_ContextualMenu .mx_MessageComposer_button > div {
            width: 28px;
        }
.mx_ContextualMenu .mx_MessageComposer_button:hover {
            background-color: transparent;
        }
.mx_ContextualMenu .mx_MessageComposer_button:hover svg {
                fill: #4958F5;
            }
.mx_MessageComposer_button {
    --size: 26px;
    position: relative;
    cursor: default;
    height: var(--size);
    line-height: var(--size);
    width: var(--size);
    border-radius: 100%;
    margin-right: 6px;
}
.mx_MessageComposer_button:last-child {
        margin-right: auto;
    }
.mx_MessageComposer_button {

    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;
    border-radius: 50%;
    opacity: 0.64;
}
.mx_MessageComposer_button .bp_icon svg {
        fill: hsla(0, 0%, 100%, 0.5);
    }
.mx_MessageComposer_button .bp_icon {
      margin-top: 4px;
    }
.mx_MessageComposer_button:hover {
        opacity: 1;
    }
.mx_MessageComposer_button.mx_MessageComposer_hangup:not(.mx_AccessibleButton_disabled)::before {
        background-color: #FF5B55;
    }
.mx_MessageComposer_stickers::before {
    -webkit-mask-image: url(../../img/element-icons/room/composer/sticker.8dbe5ec.svg);
            mask-image: url(../../img/element-icons/room/composer/sticker.8dbe5ec.svg);
}
.mx_MessageComposer_scheduleMessage {
  width: 24px;
  height: 24px;
  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_MessageComposer_scheduleMessage:before {
      content: '';
      display: block;
      width: 18px;
      height: 18px;
      -webkit-mask-image: url(../../img/beeper/schedule16.3b677a6.svg);
              mask-image: url(../../img/beeper/schedule16.3b677a6.svg);
      -webkit-mask-size: cover;
              mask-size: cover;
      background: hsla(0, 0%, 100%, 0.5);
  }
.mx_MessageComposer_scheduleMessage.colored:before {
      background: linear-gradient(120deg, #a93fe9 12px, #4958f5);
  }
.mx_MessageComposer_scheduleMessage.narrow:before {
      margin-right: 12px;
  }
.mx_MessageComposer_location::before {
    -webkit-mask-image: url(../../img/element-icons/room/composer/location.91f5613.svg);
            mask-image: url(../../img/element-icons/room/composer/location.91f5613.svg);
}
.mx_MessageComposer_buttonMenu svg {
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
    -webkit-transform-origin: center;
            transform-origin: center;
}
.mx_MessageComposer_closeButtonMenu svg {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
    -webkit-transform-origin: center;
            transform-origin: center;
}
.mx_MessageComposer_sendMessage {
    cursor: default;
    position: relative;
    width: 32px;
    height: 32px;
    border-radius: 100%;
    background-color: #4958F5;
}
.mx_MessageComposer_sendMessage::before {
        position: absolute;
        height: 16px;
        width: 16px;
        top: 8px;
        left: 9px;

        -webkit-mask-image: url(../../img/element-icons/send-message.a4e9cf8.svg);

                mask-image: url(../../img/element-icons/send-message.a4e9cf8.svg);
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-size: contain;
                mask-size: contain;
        -webkit-mask-position: center;
                mask-position: center;

        background-color: white;
        content: '';
    }
.mx_MessageComposer_formatting {
    cursor: default;
    margin: 0 11px;
    width: 24px;
    height: 18px;
}
.mx_MessageComposer_formatbar_wrapper {
    width: 100%;
    background-color: #25262d;
    -webkit-box-shadow: inset 0 1px 0 0 rgba(0, 0, 0, 0.08);
            box-shadow: inset 0 1px 0 0 rgba(0, 0, 0, 0.08);
}
.mx_MessageComposer_formatbar {
    margin: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    height: 30px;

    -webkit-box-sizing: border-box;

            box-sizing: border-box;
    padding-left: 62px;

    -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;
    font-size: 1.0rem;
    color: #888;
}
.mx_MessageComposer_formatbar * {
    margin-right: 4px;
}
.mx_MessageComposer_format_button, .mx_MessageComposer_formatbar_cancel, .mx_MessageComposer_formatbar_markdown {
    cursor: default;
}
.mx_MessageComposer_formatbar_cancel {
    margin-right: 22px;
}
.mx_MessageComposer_formatbar_markdown {
    height: 17px;
    width: 30px;
    margin-right: 64px;
}
.mx_MessageComposer_input_markdownIndicator {
    height: 10px;
    width: 12px;
    padding: 4px 4px 4px 0;
}
.mx_MessageComposer_formatbar_markdown, .mx_MessageComposer_input_markdownIndicator {
    cursor: default;
    -webkit-mask-image: url(../../img/markdown.6905ba8.svg);
            mask-image: url(../../img/markdown.6905ba8.svg);
    -webkit-mask-size: contain;
            mask-size: contain;
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    background-color: #8e99a4;
}
.mx_MessageComposer_formatbar_markdown.mx_MessageComposer_markdownDisabled, .mx_MessageComposer_input_markdownIndicator.mx_MessageComposer_markdownDisabled {
        opacity: 0.2;
    }
.mx_MatrixChat_useCompactLayout .mx_MessageComposer_input {
        min-height: 40px;
    }
.mx_MatrixChat_useCompactLayout .mx_MessageComposer_noperm_error {
        height: 50px;
    }
/**
 * Unstable compact mode
 */
.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_MessageComposer_Menu .mx_CallContextMenu_item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    max-width: unset;
    width: 100%;
}
.mx_MessageComposer_Menu .mx_ContextualMenu {
    min-width: 200px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    padding: 5px 10px 5px 0;
    margin-right: 18px;
    margin-bottom: -12px;
}
/*
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MessageComposerFormatBar {
    display: none;
    width: calc(32px * 6);
    height: 32px;
    position: absolute;
    cursor: default;
    border-radius: 8px;
    background-color: hsla(216, 21%, 14%, 1);
    border: 1px solid rgba(231, 231, 231, 0.2);
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    z-index: 1000;
}
.mx_MessageComposerFormatBar.mx_MessageComposerFormatBar_shown {
        display: block;
    }
.mx_MessageComposerFormatBar > * {
        white-space: nowrap;
        display: inline-block;
        position: relative;
        margin: 2px;
    }
.mx_MessageComposerFormatBar > *:hover {
            background: rgba(141,151,165, 0.2);
            border-radius: 6px;
            z-index: 1;
        }
.mx_MessageComposerFormatBar .mx_MessageComposerFormatBar_button {
        width: 28px;
        height: 28px;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        vertical-align: middle;
    }
.mx_MessageComposerFormatBar .mx_MessageComposerFormatBar_button::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center;
                mask-position: center;
        background-color: #737D8C;
    }
.mx_MessageComposerFormatBar .mx_MessageComposerFormatBar_button:hover::after {
        background-color: #f0f0f1;
    }
.mx_MessageComposerFormatBar .mx_MessageComposerFormatBar_buttonIconBold::after {
        -webkit-mask-image: url(../../img/element-icons/room/format-bar/bold.0d80ac7.svg);
                mask-image: url(../../img/element-icons/room/format-bar/bold.0d80ac7.svg);
    }
.mx_MessageComposerFormatBar .mx_MessageComposerFormatBar_buttonIconItalic::after {
        -webkit-mask-image: url(../../img/element-icons/room/format-bar/italic.bf18054.svg);
                mask-image: url(../../img/element-icons/room/format-bar/italic.bf18054.svg);
    }
.mx_MessageComposerFormatBar .mx_MessageComposerFormatBar_buttonIconStrikethrough::after {
        -webkit-mask-image: url(../../img/element-icons/room/format-bar/strikethrough.0264f7b.svg);
                mask-image: url(../../img/element-icons/room/format-bar/strikethrough.0264f7b.svg);
    }
.mx_MessageComposerFormatBar .mx_MessageComposerFormatBar_buttonIconQuote::after {
        -webkit-mask-image: url(../../img/element-icons/room/format-bar/quote.560cd8f.svg);
                mask-image: url(../../img/element-icons/room/format-bar/quote.560cd8f.svg);
    }
.mx_MessageComposerFormatBar .mx_MessageComposerFormatBar_buttonIconCode::after {
        -webkit-mask-image: url(../../img/element-icons/room/format-bar/code.27444ba.svg);
                mask-image: url(../../img/element-icons/room/format-bar/code.27444ba.svg);
    }
.mx_MessageComposerFormatBar .mx_MessageComposerFormatBar_buttonIconInsertLink::after {
        -webkit-mask-image: url(../../img/element-icons/link.8f4b1fc.svg);
                mask-image: url(../../img/element-icons/link.8f4b1fc.svg);
        -webkit-mask-size: 18px;
                mask-size: 18px;
    }
.mx_MessageComposerFormatBar_buttonTooltip {
    white-space: nowrap;
    font-size: 1.3rem;
    font-weight: 600;
    min-width: 54px;
    text-align: center;
}
.mx_MessageComposerFormatBar_buttonTooltip .mx_MessageComposerFormatBar_tooltipShortcut {
        font-size: 0.9rem;
        opacity: 0.7;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.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_AccessibleButton_kind_link {
        padding: 0;
        font-size: inherit;
    }
.mx_NewRoomIntro .mx_NewRoomIntro_buttons {
        margin-top: 28px;
    }
.mx_NewRoomIntro .mx_NewRoomIntro_buttons .mx_AccessibleButton {
            line-height: 2.4rem;
            display: inline-block;
        }
.mx_NewRoomIntro .mx_NewRoomIntro_buttons .mx_AccessibleButton + .mx_AccessibleButton {
                margin-left: 12px;
            }
.mx_NewRoomIntro .mx_NewRoomIntro_buttons .mx_AccessibleButton:not(.mx_AccessibleButton_kind_primary_outline)::before {
                content: '';
                display: inline-block;
                background-color: white;
                -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;
                height: 20px;
                margin-right: 5px;
                vertical-align: text-bottom;
            }
.mx_NewRoomIntro .mx_NewRoomIntro_buttons .mx_NewRoomIntro_inviteButton::before {
            -webkit-mask-image: url(../../img/element-icons/room/invite.946a71b.svg);
                    mask-image: url(../../img/element-icons/room/invite.946a71b.svg);
        }
.mx_NewRoomIntro > h2 {
        margin-top: 24px;
        font-size: 2.4rem;
        font-weight: 600;
    }
.mx_NewRoomIntro > p {
        margin: 0;
        font-size: 1.5rem;
        color: #737D8C;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_NotificationBadge {
}
.mx_NotificationBadge:not(.mx_NotificationBadge_visible) {
        display: none;
    }
.mx_NotificationBadge.mx_NotificationBadge_visible {
        background-color: #61708b;
        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_highlighted {
            background-color: #FF5B55;
        }
.mx_NotificationBadge.mx_NotificationBadge_visible.mx_NotificationBadge_dot {
            background-color: #f0f0f1;

            width: 6px;
            height: 6px;
            border-radius: 6px;
        }
.mx_NotificationBadge.mx_NotificationBadge_visible.mx_NotificationBadge_2char {
            width: 1.6rem;
            height: 1.6rem;
            border-radius: 1.6rem;
        }
.mx_NotificationBadge.mx_NotificationBadge_visible.mx_NotificationBadge_3char {
            width: 2.6rem;
            height: 1.6rem;
            border-radius: 1.6rem;
        }
.mx_NotificationBadge.mx_NotificationBadge_visible .mx_NotificationBadge_count {
            font-size: 1.0rem;
            line-height: 1.4rem;
            color: #fff;
        }
/*
Copyright 2017 Travis Ralston

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_PinnedEventTile {
    min-height: 40px;
    width: 100%;
    padding: 0 4px 12px;

    display: grid;
    grid-template-areas:
        "avatar name remove"
        "content content content"
        "footer footer footer";
    grid-template-rows: -webkit-max-content auto -webkit-max-content;
    grid-template-rows: max-content auto max-content;
    grid-template-columns: 24px auto 24px;
    grid-row-gap: 12px;
    grid-column-gap: 8px;
}
.mx_PinnedEventTile + .mx_PinnedEventTile {
        padding: 12px 4px;
        border-top: 1px solid #000000;
    }
.mx_PinnedEventTile .mx_PinnedEventTile_senderAvatar {
        grid-area: avatar;
    }
.mx_PinnedEventTile .mx_PinnedEventTile_sender {
        grid-area: name;
        font-weight: 600;
        font-size: 1.5rem;
        line-height: 2.4rem;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }
.mx_PinnedEventTile .mx_PinnedEventTile_unpinButton {
        visibility: hidden;
        grid-area: remove;
        position: relative;
        width: 24px;
        height: 24px;
        border-radius: 8px;
    }
.mx_PinnedEventTile .mx_PinnedEventTile_unpinButton:hover {
            background-color: rgba(92, 100, 112, 0.3);
        }
.mx_PinnedEventTile .mx_PinnedEventTile_unpinButton::before {
            content: "";
            position: absolute;
            height: inherit;
            width: inherit;
            background: #737D8C;
            -webkit-mask-position: center;
                    mask-position: center;
            -webkit-mask-size: 8px;
                    mask-size: 8px;
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            -webkit-mask-image: url(../../img/image-view/close.97d1731.svg);
                    mask-image: url(../../img/image-view/close.97d1731.svg);
        }
.mx_PinnedEventTile .mx_PinnedEventTile_message {
        grid-area: content;
    }
.mx_PinnedEventTile .mx_PinnedEventTile_footer {
        grid-area: footer;
        font-size: 10px;
        line-height: 12px;
    }
.mx_PinnedEventTile .mx_PinnedEventTile_footer .mx_PinnedEventTile_timestamp {
            font-size: inherit;
            line-height: inherit;
            color: #737D8C;
        }
.mx_PinnedEventTile .mx_PinnedEventTile_footer .mx_AccessibleButton_kind_link {
            padding: 0;
            margin-left: 12px;
            font-size: inherit;
            line-height: inherit;
        }
.mx_PinnedEventTile:hover .mx_PinnedEventTile_unpinButton {
            visibility: visible;
        }
.bp_Poll {
    color: #f0f0f1;
}
.bp_PollTitle {
    font-weight: bold;
    font-size: 16px;
}
.bp_PollAnswer {
    margin:  16px 0 8px;
}
.bp_PollAnswer .bp_Select {
        border: 1px solid #ffffff50;
        min-width: 100px;
    }
.bp_PollAnswer .bp_Select.selected {
            border-color: #fff;
            background-color: #ffffff30;
        }
.bp_PollAnswer .bp_Select_wrapper .checkmark {
          border-color: #ffffff50;
      }
.bp_PollAnswer .bp_Select_wrapper input:checked ~ .checkmark {
          border-color: #fff;
      }
.bp_PollCreation {
  padding: 12px 18px;
}
/*
Copyright 2020 Tulir Asokan <tulir@maunium.net>

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ReplyTile {
    position: relative;
    padding: 2px 0;
    font-size: 1.4rem;
    line-height: 1.6rem;
}
.mx_ReplyTile.mx_ReplyTile_audio .mx_MFileBody_info_icon::before {
        -webkit-mask-image: url(../../img/element-icons/speaker.7124b41.svg);
                mask-image: url(../../img/element-icons/speaker.7124b41.svg);
    }
.mx_ReplyTile.mx_ReplyTile_video .mx_MFileBody_info_icon::before {
        -webkit-mask-image: url(../../img/element-icons/call/video-call.55bc086.svg);
                mask-image: url(../../img/element-icons/call/video-call.55bc086.svg);
    }
.mx_ReplyTile .mx_MFileBody .mx_MFileBody_info {
            margin: 5px 0;
        }
.mx_ReplyTile .mx_MFileBody .mx_MFileBody_download {
            display: none;
        }
.mx_ReplyTile > a {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        text-decoration: none;
        color: #f0f0f1;
    }
.mx_ReplyTile .mx_RedactedBody {
        padding: 4px 0 2px 20px;
    }
.mx_ReplyTile .mx_RedactedBody::before {
            height: 13px;
            width: 13px;
            top: 5px;
        }
.mx_ReplyTile .mx_EventTile_content {

        text-overflow: ellipsis;
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-height: 2.2rem;
    }
.mx_ReplyTile .mx_EventTile_content .mx_EventTile_body.mx_EventTile_bigEmoji {
            line-height: 2.2rem !important;
            font-size: 1.4rem !important;
        }
.mx_ReplyTile .mx_EventTile_content .mx_EventTile_lineNumbers {
            display: none;
        }
.mx_ReplyTile .mx_EventTile_content .mx_EventTile_pre_container > pre {
            overflow-x: scroll;
            overflow-y: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -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_EventTile_content .markdown-body p {
            line-height: 2.2rem;
        }
.mx_ReplyTile.mx_ReplyTile_info {
        padding-top: 0;
    }
.mx_ReplyTile .mx_SenderProfile {
        font-size: 1.4rem;
        line-height: 1.7rem;

        display: inline-block;
        padding: 0;
        margin: 0;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
/* @import "../../../css/views/rooms/_ReplyPreview.scss"; */
/* @import "../../../css/views/rooms/_RoomBreadcrumbs.scss"; */
/* @import "../../../css/views/rooms/_RoomBreadcrumbs2.scss"; */
/* @import "../../../css/views/rooms/_RoomDropTarget.scss"; */
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MatrixChat_wrapper--linux .mx_RoomHeader, .mx_MatrixChat_wrapper--windows .mx_RoomHeader {
        -webkit-app-region: unset;
    }
.mx_RoomHeader {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background-color: hsla(216, 21%, 14%, 1);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    position: relative;
}
.mx_RoomHeader .bp_invisibleDraggableHeader {
        height: 15px;
    }
.mx_RoomHeader .mx_RoomHeader_e2eIcon {
        height: 12px;
        width: 12px;
    }
.mx_RoomHeader .mx_RoomHeader_e2eIcon .mx_E2EIcon {
            margin: 0;
            position: absolute;
            height: 12px;
            width: 12px;
        }
.mx_RoomHeader .mx_RoomHeader_rightActions .mx_RoomHeader_rightActions_static {
        opacity: 1;
        grid-gap: 10px;
        gap: 10px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }
.mx_RoomHeader:hover {
        max-height: 100px;
        
    }
.mx_RoomHeader:hover .mx_RoomHeader_topic, .mx_RoomHeader:hover .mx_RoomHeader_rightActions, .mx_RoomHeader:hover .mx_RoomHeader_rightActions span > div, .mx_RoomHeader:hover .mx_RoomHeader_leftActions span > div {
            opacity: 1;
        }
.mx_RoomHeader:hover .mx_RoomHeader_rightActions span, .mx_RoomHeader:hover .mx_RoomHeader_leftActions span {
            grid-gap: 10px;
            gap: 10px;
        }
.mx_RoomHeader:hover .mx_RoomHeader_centerActions.mx_RoomHeader_centerActions--topic {
            -webkit-transform: scale(0.75) translateY(-15px);
                    transform: scale(0.75) translateY(-15px);
        }
.mx_RoomHeader_name-container { 
    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_RoomHeader_tooltip {
    margin-right: 0;
}
.mx_RoomHeader_wrapper {
    padding: 11px 16px;
    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;
    min-width: 0;
    background: inherit;
    z-index: 2;
}
.mx_RoomHeader_wrapper .mx_InviteOnlyIcon_large {
        margin: 0;
    }
.mx_RoomHeader_spinner {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    height: 36px;
    padding-left: 12px;
    padding-right: 12px;
}
.mx_RoomHeader_textButton {
    /* align images in buttons (eg spinners) */
    vertical-align: middle;
    border: 0px;
    border-radius: 8px;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Apple Color Emoji", "Twemoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif, "Noto Color Emoji", "Inter";
    font-size: 1.4rem;
    color: white;
    background-color: rgba(169, 63, 233, 1);
    width: auto;
    padding: 7px;
    padding-left: 1.5em;
    padding-right: 1.5em;
    cursor: default;
    display: inline-block;
    outline: none;
    margin-right: 8px;
    margin-top: -5px;
}
.mx_RoomHeader_textButton:hover {
    cursor: default;
}
.mx_RoomHeader_textButton_danger {
    background-color: #FF5B55;
}
.mx_RoomHeader_cancelButton {
    cursor: default;
    padding-left: 12px;
    padding-right: 12px;
}
.mx_RoomHeader_buttons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-app-region: no-drag;
}
.mx_RoomHeader_info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.mx_RoomHeader_simpleHeader {
    line-height: 5.2rem;
    color: #f0f0f1;
    font-size: 1.8rem;
    font-weight: 600;
    overflow: hidden;
    margin-left: 63px;
    text-overflow: ellipsis;
    width: 100%;
}
.mx_RoomHeader_simpleHeader .mx_RoomHeader_cancelButton {
        float: right;
    }
.mx_RoomHeader_simpleHeader .mx_RoomHeader_icon {
        margin-left: 14px;
        margin-right: 24px;
        vertical-align: -4px;
    }
.mx_RoomHeader_name {
    -webkit-box-flex: 0;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
    overflow: hidden;
    color: #efeff0;
    font-weight: 600;
    font-size: 1.4rem;
    line-height: 16px;
    border-radius: 6px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.mx_RoomHeader_name .mx_RoomHeader_nametext {
        line-height: 2;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        font-size: 15px;
        color: rgb(255 255 255 / 80%);
    }
.mx_RoomHeader_name .mx_RoomHeader_chevron {
        -ms-flex-item-align: center;
            align-self: center;
        width: 16px;
        height: 16px;
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: contain;
                mask-size: contain;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-image: url(../../img/feather-customised/chevron-down.5278abe.svg);
                mask-image: url(../../img/feather-customised/chevron-down.5278abe.svg);
        background-color: #8D97A5;
    }
.mx_RoomHeader_name[aria-expanded=true] .mx_RoomHeader_chevron {
            -webkit-transform: rotate(180deg);
                    transform: rotate(180deg);
        }
.mx_RoomHeader_settingsHint {
    color: #a2a2a2 !important;
}
.mx_RoomHeader_searchStatus {
    font-weight: normal;
    opacity: 0.6;
}
.mx_RoomHeader_name, .mx_RoomHeader_avatar {
    cursor: default;
}
.mx_RoomHeader_leftActions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-right: 10px;
    -ms-flex-preferred-size: min-content;
        flex-basis: min-content;
}
.mx_RoomHeader_leftActions, .mx_RoomHeader_leftActions {
    -webkit-box-flex: 0;
        -ms-flex: 0;
            flex: 0;
}
.mx_RoomHeader_centerActions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    grid-gap: 4px;
    gap: 4px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    min-width: 0;
    overflow: hidden;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
.mx_RoomHeader_rightActions, .mx_RoomHeader_leftActions, .mx_RoomHeader_centerActions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
.mx_RoomHeader_rightActions span {
    margin-left: auto;
}
.mx_RoomHeader_leftActions span {
    margin-right: auto;
}
.mx_RoomHeader_leftActions span, .mx_RoomHeader_rightActions span{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    color: #76767b;
    fill: #76767b;
    will-change: gap;
    grid-gap: 0px;
    gap: 0px;
    -webkit-transition-delay: 200ms;
            transition-delay: 200ms;
}
.mx_RoomHeader_leftActions span .mx_AccessibleButton:hover, .mx_RoomHeader_rightActions span .mx_AccessibleButton:hover {
        color: #fff;
        fill: #fff;
    }
.mx_RoomHeader_centerActions, .mx_RoomHeader_topicContainer, .mx_RoomHeader_rightActions, .mx_RoomHeader_leftActions, .mx_RoomHeader_rightActions span, .mx_RoomHeader_leftActions span, .mx_RoomHeader_leftActions span > div, .mx_RoomHeader_rightActions span > div, .mx_RoomHeader, .mx_RoomHeader_topic {
    -webkit-transition: all 300ms ease 100ms;
    transition: all 300ms ease 100ms;
}
.mx_RoomHeader_rightActions span > div:not(.mx_HeaderButtons), .mx_RoomHeader_topic, .mx_RoomHeader_leftActions span > div:not(.mx_RoomHeader_addContact) {
    opacity: 0;
}
.mx_RoomHeader_topic {
    z-index: -1;
    border-bottom: 1px solid hsl(0deg 0% 100% / 10%);
    padding: 2px 10px;
    color: #d0d1d8;
    background: inherit;
    font-weight: 400;
    font-size: 1.3rem;
    margin: auto;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.2em;
    max-height: 2.4em;
    -webkit-user-select: text;
       -moz-user-select: text;
        -ms-user-select: text;
            user-select: text;
    text-align: center;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
}
.mx_RoomHeader_topic.mx_RoomHeader_topic--empty {
        padding: 0;
    }
.mx_RoomHeader_topicContainer {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
    text-align: center;
    background-color: transparent;
    z-index: 12;
    top: 100%;
    position: absolute;
    left: 0;
    right: 0;
}
.mx_RoomHeader_avatar {
    -webkit-box-flex: 0;
        -ms-flex: 0;
            flex: 0;
    position: relative;
}
.mx_RoomHeader_avatar .mx_BaseAvatar_image {
    -o-object-fit: cover;
       object-fit: cover;
}
.mx_RoomHeader_BridgedIcon {
    width: 18px;
    height: 18px;
    border-radius: 80px;
    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_RoomHeader_BridgedIcon .nv_BridgedIcon {
        width: 18px;
        height: 18px;
        background-size: 18px;
    }
.mx_RoomHeader_button {
    position: relative;
    margin-left: 1px;
    margin-right: 1px;
    cursor: default;
    height: 32px;
    width: 32px;
    border-radius: 100%;
}
.mx_RoomHeader_button::before {
        content: '';
        position: absolute;
        top: 4px;
        left: 4px;
        height: 24px;
        width: 24px;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-size: contain;
                mask-size: contain;
    }
.mx_RoomHeader_button::before {
    background-color: rgb(255 255 255 / 50%)
}
.mx_RoomHeader_forgetButton::before {
    -webkit-mask-image: url(../../img/element-icons/leave.bb917e7.svg);
            mask-image: url(../../img/element-icons/leave.bb917e7.svg);
    width: 26px;
}
.mx_RoomHeader_appsButton::before {
    -webkit-mask-image: url(../../img/element-icons/room/apps.5ee9f78.svg);
            mask-image: url(../../img/element-icons/room/apps.5ee9f78.svg);
}
.mx_RoomHeader_appsButton_highlight::before {
    background-color: #4958F5;
}
.mx_RoomHeader_searchButton::before {
    -webkit-mask-image: url(../../img/element-icons/room/search-inset.e66c731.svg);
            mask-image: url(../../img/element-icons/room/search-inset.e66c731.svg);
}
.mx_RoomHeader_voiceCallButton::before {
    -webkit-mask-image: url(../../img/element-icons/call/voice-call.85a7c92.svg);
            mask-image: url(../../img/element-icons/call/voice-call.85a7c92.svg);
    -webkit-mask-size: 20px;
            mask-size: 20px;
    -webkit-mask-position: center;
            mask-position: center;
}
.mx_RoomHeader_videoCallButton::before {
    -webkit-mask-image: url(../../img/element-icons/call/video-call.55bc086.svg);
            mask-image: url(../../img/element-icons/call/video-call.55bc086.svg);
}
@media only screen and (max-width: 480px) {
    .mx_RoomHeader_wrapper {
        padding: 0;
        margin: 0;
    }
    .mx_RoomHeader {
        overflow: hidden;
    }
}
/* @import "../../../css/views/rooms/_RoomList.scss"; */
/* @import "../../../css/views/rooms/_RoomList2.scss"; */
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.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;
            justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
}
.mx_RoomPreviewBar h3 {
        font-size: 1.8rem;
        font-weight: 600;
    }
.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;
        }
.mx_RoomPreviewBar h3, .mx_RoomPreviewBar .mx_RoomPreviewBar_message p {
        word-break: break-all;
        word-break: break-word;
    }
.mx_RoomPreviewBar .mx_Spinner {
        width: auto;
        height: auto;
        margin: 10px 10px 10px 0;
        -webkit-box-flex: 0;
            -ms-flex: 0 0 auto;
                flex: 0 0 auto;
    }
.mx_RoomPreviewBar .mx_RoomPreviewBar_footer {
        font-size: 1.2rem;
        line-height: 2.0rem;
    }
.mx_RoomPreviewBar .mx_RoomPreviewBar_footer .mx_Spinner {
            vertical-align: middle;
            display: inline-block;
        }
.mx_RoomPreviewBar_actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.mx_RoomPreviewBar_message {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -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;
            -ms-flex: 1 0 0px;
                flex: 1 0 0;
        min-width: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
.mx_RoomPreviewBar_panel .mx_RoomPreviewBar_message > * {
            margin: 4px;
        }
.mx_RoomPreviewBar_dialog {
    margin: auto;
    -webkit-box-sizing: content;
            box-sizing: content;
    width: 400px;
    border-radius: 4px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 20px;
    text-align: center;
}
.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 0;
        }
.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_inviter {
    font-weight: 600;
}
a.mx_RoomPreviewBar_inviter {
    text-decoration: underline;
    cursor: default;
}
/* @import "../../../css/views/rooms/_RoomSublist2.scss"; */
/* @import "../../../css/views/rooms/_RoomTile.scss"; */
/* @import "../../../css/views/rooms/_RoomTile2.scss"; */
/*
Copyright 2018 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RoomUpgradeWarningBar {
    max-height: 235px;
    background-color: #424650;
    padding-left: 20px;
    padding-right: 20px;
    overflow: scroll;
}
.mx_RoomUpgradeWarningBar_wrapped {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    text-align: center;
    -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;
            justify-content: center;
    -webkit-align-items: center;
}
.mx_RoomUpgradeWarningBar_header {
    color: #FF5B55;
    font-weight: bold;
}
.mx_RoomUpgradeWarningBar_body {
    color: #FF5B55;
}
.mx_RoomUpgradeWarningBar_upgradelink {
    color: #FF5B55;
    text-decoration: underline;
}
.mx_RoomUpgradeWarningBar_small {
    color: #888;
    font-size: 70%;
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SearchBar {
    height: 56px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    border-bottom: 1px solid #404040;
}
.mx_SearchBar .mx_SearchBar_input {
        -webkit-box-flex: 1;
            -ms-flex: 1 1 0px;
                flex: 1 1 0;
        margin-left: 22px;
    }
.mx_SearchBar .mx_SearchBar_searchButton {
        cursor: default;
        width: 37px;
        height: 37px;
        background-color: #4958F5;
        -webkit-mask: url(../../img/feather-customised/search-input.044bfa7.svg);
                mask: url(../../img/feather-customised/search-input.044bfa7.svg);
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center;
                mask-position: center;
    }
.mx_SearchBar .mx_SearchBar_buttons {
        display: inherit;
    }
.mx_SearchBar .mx_SearchBar_button {
        border: 0;
        margin: 0 0 0 22px;
        padding: 5px;
        font-size: 1.5rem;
        cursor: default;
        color: #f0f0f1;
        border-bottom: 2px solid #4958F5;
        font-weight: 600;
    }
.mx_SearchBar .mx_SearchBar_unselected {
        color: rgba(208, 209, 216, 0.6);
        border-color: transparent;
    }
.mx_SearchBar .mx_SearchBar_cancel {
        background-color: #FF5B55;
        -webkit-mask: url(../../img/cancel.4b9715b.svg);
                mask: url(../../img/cancel.4b9715b.svg);
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: 14px;
                mask-size: 14px;
        padding: 9px;
        margin: 0 12px 0 3px;
        cursor: default;
    }
/*
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SendMessageComposer {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    font-size: 1.4rem;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-right: 6px;
    min-width: 0;
}
.mx_SendMessageComposer .mx_BasicMessageComposer {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        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: 44px;
    }
.mx_SendMessageComposer .mx_BasicMessageComposer .mx_BasicMessageComposer_input {
            margin: auto 0;
            max-height: 140px;
            overflow-y: auto;
        }
.mx_SendMessageComposer .mx_BasicMessageComposer .mx_BasicMessageComposer_input > :first-child {
                line-height: 16px;
            }
.mx_Stickers_content {
    overflow: hidden;
}
.mx_Stickers_content_container {
    overflow: hidden;
    height: 300px;
}
#mx_persistedElement_stickerPicker .mx_AppTileFullWidth {
        height: unset;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        border-left: none;
        border-right: none;
        border-bottom: none;
    }
#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 {
    display: inline;
    cursor: default;
    color: #4958F5;
}
.mx_Stickers_hideStickers {
    z-index: 2001;
}
/* @import "../../../css/views/rooms/_UserOnlineDot.scss"; */
/*
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_VoiceRecordComposerTile_stop {
    width: 28px;
    height: 28px;
    border: 2px solid #E3E8F0;
    border-radius: 32px;
    margin-right: 8px;
    position: relative;
}
.mx_VoiceRecordComposerTile_stop::after {
        content: '';
        width: 14px;
        height: 14px;
        position: absolute;
        top: 7px;
        left: 7px;
        border-radius: 2px;
        background-color: #ff5b55;
    }
.mx_VoiceRecordComposerTile_delete {
    width: 24px;
    height: 24px;
    vertical-align: middle;
    margin-right: 8px;
    background-color: #8D97A5;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-size: contain;
            mask-size: contain;
    -webkit-mask-image: url(../../img/element-icons/trashcan.3b626db.svg);
            mask-image: url(../../img/element-icons/trashcan.3b626db.svg);
}
.mx_VoiceRecordComposerTile_uploadingState {
    margin-right: 10px;
    color: #737D8C;
}
.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;
    margin-right: 12px;

    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;

            content: '';
            background-color: #ff5b55;
            width: 10px;
            height: 10px;
            position: absolute;
            left: 12px;
            border-radius: 10px;
        }
@-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;
    }
}
/*
Copyright 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
@charset "utf-8";
.mx_TopUnreadMessagesBar {
    z-index: 1000;
    position: absolute;
    top: 24px;
    right: 24px;
    width: 38px;
}
.mx_TopUnreadMessagesBar::after {
    content: "";
    position: absolute;
    top: -8px;
    left: 10.5px;
    width: 4px;
    height: 4px;
    border-radius: 16px;
    background-color: #25262d;
    border: 6px solid #4958F5;
    pointer-events: none;
}
.mx_TopUnreadMessagesBar_scrollUp {
    height: 38px;
    border-radius: 19px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    background: hsla(216, 21%, 14%, 1);
    border: 1.3px solid #b9bec6;
    cursor: default;
}
.mx_TopUnreadMessagesBar_scrollUp::before {
    content: "";
    position: absolute;
    width: 36px;
    height: 36px;
    -webkit-mask-image: url(../../img/feather-customised/chevron-down-thin.f9a2477.svg);
            mask-image: url(../../img/feather-customised/chevron-down-thin.f9a2477.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-size: contain;
            mask-size: contain;
    background: #b9bec6;
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
}
.mx_TopUnreadMessagesBar_markAsRead {
    display: block;
    width: 18px;
    height: 18px;
    background: hsla(216, 21%, 14%, 1);
    border: 1.3px solid #b9bec6;
    border-radius: 10px;
    margin: 5px auto;
}
.mx_TopUnreadMessagesBar_markAsRead::before {
    content: "";
    position: absolute;
    width: 18px;
    height: 18px;
    -webkit-mask-image: url(../../img/cancel.4b9715b.svg);
            mask-image: url(../../img/cancel.4b9715b.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-size: 10px;
            mask-size: 10px;
    -webkit-mask-position: 4px 4px;
            mask-position: 4px 4px;
    background: #b9bec6;
}
/*
Copyright 2018 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_WhoIsTypingTile {
    margin-left: -18px;
    padding-top: 18px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
/* position the indicator in the same place horizontally as .mx_EventTile_avatar. */
.mx_WhoIsTypingTile_avatars {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 83px;
            flex: 0 0 83px;
    text-align: center;
}
.mx_WhoIsTypingTile_avatars > :not(:first-child) {
    margin-left: -12px;
}
.mx_WhoIsTypingTile_avatars .mx_BaseAvatar_initial {
    padding-top: 1px;
}
.mx_WhoIsTypingTile_avatars .mx_BaseAvatar {
    border: 1px solid hsla(216, 21%, 14%, 1);
    border-radius: 40px;
}
.mx_WhoIsTypingTile_remainingAvatarPlaceholder {
    position: relative;
    display: inline-block;
    color: #f0f0f1;
    background-color: #E3E8F0;
    border: 1px solid hsla(216, 21%, 14%, 1);
    border-radius: 40px;
    width: 24px;
    height: 24px;
    line-height: 2.4rem;
    font-size: 0.8em;
    vertical-align: top;
    text-align: center;
}
.mx_WhoIsTypingTile_label {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    font-size: 1.4rem;
    font-weight: 600;
    color: #d0d1d8;
}
.mx_WhoIsTypingTile_label > span {
    background-image: url(../../img/typing-indicator-2x.0eb9f0e.gif);
    background-size: 25px;
    background-position: left bottom;
    background-repeat: no-repeat;
    padding-bottom: 15px;
    display: block;
}
.mx_MatrixChat_useCompactLayout .mx_WhoIsTypingTile {
        padding-top: 4px;
    }
.bp_WhoIsTypingTile {
    height: 12px;
    padding: 2px 16px 6px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    font-size: 12px;
}
/*
Copyright 2019, 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AvatarSetting_avatar {
    width: 90px;
    min-width: 90px;
    height: 90px;
    margin-top: 8px;
    position: relative;
}
.mx_AvatarSetting_avatar .mx_AvatarSetting_hover {
        -webkit-transition: opacity 0.08s cubic-bezier(.46, .03, .52, .96);
        transition: opacity 0.08s cubic-bezier(.46, .03, .52, .96);
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;

        pointer-events: none;

        line-height: 90px;
        text-align: center;
    }
.mx_AvatarSetting_avatar .mx_AvatarSetting_hover > span {
            color: #fff;
            position: relative;
            font-weight: 500;
        }
.mx_AvatarSetting_avatar .mx_AvatarSetting_hover .mx_AvatarSetting_hoverBg {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;

            opacity: 0.5;
            background-color: #454545;
            border-radius: 90px;
        }
.mx_AvatarSetting_avatar.mx_AvatarSetting_avatar_hovering .mx_AvatarSetting_hover {
        opacity: 1;
    }
.mx_AvatarSetting_avatar:not(.mx_AvatarSetting_avatar_hovering) .mx_AvatarSetting_hover {
        opacity: 0;
    }
.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 {
        cursor: default;
        -o-object-fit: cover;
           object-fit: cover;
    }
.mx_AvatarSetting_avatar > img, .mx_AvatarSetting_avatar .mx_AvatarSetting_avatarPlaceholder {
        display: block;
        height: 90px;
        width: inherit;
        border-radius: 90px;
        cursor: default;
    }
.mx_AvatarSetting_avatar .mx_AvatarSetting_avatarPlaceholder::before {
        background-color: #454545;
        -webkit-mask: url(../../img/feather-customised/user.7a4d23d.svg);
                mask: url(../../img/feather-customised/user.7a4d23d.svg);
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-size: 36px;
                mask-size: 36px;
        -webkit-mask-position: center;
                mask-position: center;
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
    }
.mx_AvatarSetting_avatar .mx_AvatarSetting_uploadButton {
        width: 32px;
        height: 32px;
        border-radius: 32px;
        background-color: #e7e7e7;

        position: absolute;
        bottom: 0;
        right: 0;
    }
.mx_AvatarSetting_avatar .mx_AvatarSetting_uploadButton::before {
        content: "";
        display: block;
        width: 100%;
        height: 100%;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: 55%;
                mask-size: 55%;
        background-color: #454545;
        -webkit-mask-image: url(../../img/feather-customised/edit.fd55ec2.svg);
                mask-image: url(../../img/feather-customised/edit.fd55ec2.svg);
    }
.mx_AvatarSetting_avatar .mx_AvatarSetting_avatarPlaceholder {
    background-color: #F4F6FA;
}
/*
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CrossSigningPanel_statusList {
    border-spacing: 0;
}
.mx_CrossSigningPanel_statusList td {
        padding: 0;
    }
.mx_CrossSigningPanel_statusList td: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;
    }
/*
Copyright 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_DevicesPanel {
    width: auto;
    max-width: 880px;
}
.mx_DevicesPanel hr {
        opacity: 0.2;
        border: none;
        border-bottom: 1px solid #f0f0f1;
    }
.mx_DevicesPanel--pending-deletion {
        pointer-events: none;
        opacity: 0.4;
    }
.mx_DevicesPanel_header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-block: 10px;
}
.mx_DevicesPanel_header .mx_DevicesPanel_header_title {
        font-size: 1.8rem;
        font-weight: 600;
        color: #f0f0f1;
        margin-right: 12px;
    }
.mx_DevicesPanel_header .mx_DevicesPanel_selectButton {
        padding-top: 9px;
    }
.mx_DevicesPanel_header .mx_E2EIcon {
        width: 24px;
        height: 24px;
        margin-left: 0;
        margin-right: 5px;
    }
.mx_DevicesPanel_deleteButton {
    margin-top: 10px;
}
.mx_DevicesPanel_device {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    margin-block: 10px;
    min-height: 35px;
}
.mx_DevicesPanel_icon, .mx_DevicesPanel_checkbox {
    margin-left: 9px;
    margin-top: 2px;
}
.mx_DevicesPanel_deviceInfo {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
}
.mx_DevicesPanel_deviceName {
    color: #f0f0f1;
}
.mx_DevicesPanel_lastSeen {
    font-size: 1.2rem;
}
.mx_DevicesPanel_deviceButtons {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    grid-gap: 9px;
    gap: 9px;
}
.mx_DevicesPanel_renameForm {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    grid-gap: 5px;
    gap: 5px;
}
.mx_DevicesPanel_renameForm .mx_Field_input {
        width: 240px;
        margin: 0;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_E2eAdvancedPanel_settingLongDescription {
    margin-right: 150px;
}
/*
Copyright 2019 New Vector Ltd
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ExistingEmailAddress {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-bottom: 5px;
}
.mx_ExistingEmailAddress_delete {
    margin-right: 5px;
    cursor: default;
    vertical-align: middle;
}
.mx_ExistingEmailAddress_email, .mx_ExistingEmailAddress_promptText {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    margin-right: 10px;
}
.mx_ExistingEmailAddress_confirmBtn {
    margin-left: 5px;
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_IntegrationManager .mx_Dialog {
    width: 60%;
    height: 70%;
    overflow: hidden;
    padding: 0px;
    max-width: none;
    max-width: initial;
    max-height: none;
    max-height: initial;
}
.mx_IntegrationManager iframe {
    background-color: #fff;
    border: 0px;
    width: 100%;
    height: 100%;
}
.mx_IntegrationManager_loading h3 {
    text-align: center;
}
.mx_IntegrationManager_error {
    text-align: center;
    padding-top: 20px;
}
.mx_IntegrationManager_error h3 {
    color: #FF5B55;
}
/*
Copyright 2015 - 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_UserNotifSettings_grid {
    width: calc(100% + 12px);
    display: grid;
    grid-template-columns: auto repeat(3, 62px);
    place-items: center center;
    grid-gap: 8px;
    margin-top: 40px;
}
.mx_UserNotifSettings_grid .mx_StyledRadioButton {
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }
.mx_UserNotifSettings_grid .mx_StyledRadioButton .mx_StyledRadioButton_content {
            display: none;
        }
.mx_UserNotifSettings_grid .mx_StyledRadioButton .mx_StyledRadioButton_spacer {
            display: none;
        }
.mx_UserNotifSettings_gridRowContainer {
    display: contents;
}
.mx_UserNotifSettings_gridRow {
    display: contents;
}
.mx_UserNotifSettings_gridRowLabel {
    justify-self: start;
    float: left;
}
.mx_UserNotifSettings_gridRowHeading {
    font-size: 1.8rem;
    font-weight: 600;
}
.mx_UserNotifSettings_gridColumnLabel {
    color: #737D8C;
    font-size: 1.2rem;
    font-weight: 600;
}
.mx_UserNotifSettings {
    color: #f0f0f1;
}
.mx_UserNotifSettings .mx_UserNotifSettings_floatingSection {
        margin-top: 40px;
    }
.mx_UserNotifSettings .mx_UserNotifSettings_floatingSection > div:first-child {
            font-size: 1.8rem;
            font-weight: 600;
        }
.mx_UserNotifSettings .mx_UserNotifSettings_floatingSection > table {
            border-collapse: collapse;
            border-spacing: 0;
            margin-top: 8px;
        }
.mx_UserNotifSettings .mx_UserNotifSettings_floatingSection > table tr > td:first-child {
                padding-right: 8px;
            }
.mx_UserNotifSettings .mx_UserNotifSettings_clearNotifsButton {
        margin-top: 8px;
    }
.mx_UserNotifSettings .mx_TagComposer {
        margin-top: 35px;
    }
.mx_UserNotifSettings .mx_UserNotifSettings_advanced {
        margin-top: 30px;
    }
.mx_UserNotifSettings .mx_UserNotifSettings_advanced summary {
            cursor: default;
        }
.mx_AccessibleButton.mx_NotificationSound_browse {
    margin-right: 10px;
}
/*
Copyright 2019 New Vector Ltd
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ExistingPhoneNumber {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-bottom: 5px;
}
.mx_ExistingPhoneNumber_delete {
    margin-right: 5px;
    cursor: default;
    vertical-align: middle;
}
.mx_ExistingPhoneNumber_address, .mx_ExistingPhoneNumber_promptText {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    margin-right: 10px;
}
.mx_ExistingPhoneNumber_confirmBtn {
    margin-left: 5px;
}
.mx_ExistingPhoneNumber_verification {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.mx_ExistingPhoneNumber_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;
}
/*
Copyright 2019, 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ProfileSettings_controls_topic > textarea {
        font-family: inherit;
        resize: vertical;
    }
.mx_ProfileSettings_profile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.mx_ProfileSettings_controls {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    margin-right: 54px;
}
.mx_ProfileSettings_controls .mx_SettingsTab_subheading {
        margin-top: 0;
    }
.mx_ProfileSettings_controls .mx_Field #profileTopic {
    height: 4em;
}
.mx_ProfileSettings_hostingSignup {
    margin-left: 20px;
}
.mx_ProfileSettings_avatarUpload {
    display: none;
}
.mx_ProfileSettings_profileForm {
    margin-right: 100px;
}
.mx_ProfileSettings_buttons {
    margin-top: 10px;
    margin-bottom: 28px;
}
.mx_ProfileSettings_buttons > .mx_AccessibleButton_kind_link {
        padding-left: 0;
        padding-right: 0;
        margin-right: 10px;
    }
/*
Copyright 2018 New Vector Ltd
Copyright 2019, 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SecureBackupPanel_sigValid, .mx_SecureBackupPanel_sigInvalid, .mx_SecureBackupPanel_deviceVerified, .mx_SecureBackupPanel_deviceNotVerified {
    font-weight: bold;
}
.mx_SecureBackupPanel_sigValid, .mx_SecureBackupPanel_deviceVerified {
    color: #76cfa5;
}
.mx_SecureBackupPanel_sigInvalid, .mx_SecureBackupPanel_deviceNotVerified {
    color: #ba6363;
}
.mx_SecureBackupPanel_deviceName {
    font-style: italic;
}
.mx_SecureBackupPanel_buttonRow {
    margin: 1em 0;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-flow: wrap;
        flex-flow: wrap;
    grid-row-gap: 10px;
    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 td {
        padding: 0;
    }
.mx_SecureBackupPanel_statusList td:first-of-type {
            -webkit-padding-end: 1em;
                    padding-inline-end: 1em;
        }
/*
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SetIdServer .mx_Field_input {
    margin-right: 100px;
}
.mx_SetIdServer_tooltip {
    max-width: 120px;
}
/*
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SetIntegrationManager {
    margin-top: 10px;
    margin-bottom: 10px;
}
.mx_SetIntegrationManager > .mx_SettingsTab_heading {
    margin-bottom: 10px;
}
.mx_SetIntegrationManager > .mx_SettingsTab_heading > .mx_SettingsTab_subheading {
    display: inline-block;
    padding-left: 5px;
    margin-top: 0px;
}
.mx_SetIntegrationManager .mx_ToggleSwitch {
    display: inline-block;
    float: right;
    top: 9px;
}
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_UpdateCheckButton_summary {
    margin-left: 16px;
}
.mx_UpdateCheckButton_summary .mx_AccessibleButton_kind_link {
        padding: 0;
    }
/*
Copyright 2019, 2020 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SettingsTab {
    color: #f0f0f1;
}
.mx_SettingsTab_warningText {
    color: #FF5B55;
}
.mx_SettingsTab_heading {
    font-size: 2.0rem;
    font-weight: 600;
    color: #f0f0f1;
    margin-bottom: 10px;
}
.mx_SettingsTab_heading:nth-child(n + 2) {
    margin-top: 30px;
}
.mx_SettingsTab_subheading {
    font-size: 1.6rem;
    display: block;
    font-weight: 600;
    color: #f0f0f1;
    margin-bottom: 10px;
    margin-top: 22px;
}
.mx_SettingsTab_subsectionText {
    color: #d0d1d8;
    font-size: 1.4rem;
    display: block;
    margin: 10px 80px 10px 0;
}
.mx_SettingsTab_section .mx_SettingsFlag {
        margin-right: 80px;
        margin-bottom: 10px;
    }
.mx_SettingsTab_section > p {
        margin-right: 80px;
    }
.mx_SettingsTab_section.mx_SettingsTab_subsectionText .mx_SettingsFlag {
        margin-right: 0 !important;
    }
.mx_SettingsTab_section .mx_SettingsFlag .mx_SettingsFlag_label {
    vertical-align: middle;
    display: inline-block;
    font-size: 1.4rem;
    color: #f0f0f1;
    max-width: calc(100% - 4.8rem);
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding-right: 10px;
}
.mx_SettingsTab_section .mx_SettingsFlag .mx_SettingsFlag_microcopy {
    margin-top: 4px;
    font-size: 1.2rem;
    line-height: 1.5rem;
    color: #737D8C;
}
.mx_SettingsTab_section .mx_SettingsFlag .mx_ToggleSwitch {
    float: right;
}
.mx_SettingsTab_linkBtn {
    cursor: default;
    color: #4958F5;
    word-break: break-all;
}
.mx_SettingsTab a {
    color: #238CF5;
}
.mx_SettingsTab_toggleWithDescription {
    margin-top: 24px;
}
.bp_SettingsField input {
    background-color: transparent;
}
.bp_LabsUserSettingsTab .mx_StyledRadioButton_content {
        font-size: 12px;
    }
.bp_LabsUserSettingsTab .bp_SettingsField {
        margin-top: 2px;
    }
.bp_LabsUserSettingsTab .mx_SettingsFlag_microcopy {
        display: block;
    }
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_GeneralRoomSettingsTab_profileSection {
    margin-top: 10px;
}
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RolesRoomSettingsTab ul {
    margin-bottom: 0;
}
.mx_RolesRoomSettingsTab_unbanBtn {
    margin-right: 10px;
    margin-bottom: 5px;
}
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SecurityRoomSettingsTab .mx_SettingsTab_showAdvanced {
        padding: 0;
        margin-bottom: 16px;
    }
.mx_SecurityRoomSettingsTab_warning {
    display: block;
}
.mx_SecurityRoomSettingsTab_warning img {
        vertical-align: middle;
        margin-right: 5px;
        margin-left: 3px;
        margin-bottom: 5px;
    }
.mx_SecurityRoomSettingsTab_encryptionSection {
    padding-bottom: 24px;
    border-bottom: 1px solid #000000;
    margin-bottom: 32px;
}
/*
Copyright 2020 - 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AppearanceUserSettingsTab > .mx_SettingsTab_SubHeading {
        margin-bottom: 32px;
    }
.mx_AppearanceUserSettingsTab .mx_SettingsFlag {
        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: 10px;
    }
.mx_AppearanceUserSettingsTab_Advanced {
    color: #f0f0f1;
}
.mx_AppearanceUserSettingsTab_Advanced > * {
        margin-bottom: 16px;
    }
.mx_AppearanceUserSettingsTab_Advanced .mx_AppearanceUserSettingsTab_AdvancedToggle {
        color: #4958F5;
        cursor: default;
    }
.mx_AppearanceUserSettingsTab_Advanced .mx_AppearanceUserSettingsTab_systemFont {
        margin-left: calc(1.6rem + 10px);
    }
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_GeneralUserSettingsTab_changePassword .mx_Field {
    margin-right: 100px;
}
.mx_SettingsTab_refresh {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    grid-gap: 5px;
    gap: 5px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.mx_SettingsTab_refresh .mx_SettingsTab_refreshIcon--refreshing {
        -webkit-animation: 1s linear 0s infinite normal none running spin;
                animation: 1s linear 0s infinite normal none running spin;
    }
.mx_SettingsTab_refresh .bp_icon {
        height: 16px;
        cursor: default;
    }
.mx_GeneralUserSettingsTab_accountSection .mx_SettingsTab_subheading:nth-child(n + 1), .mx_GeneralUserSettingsTab_discovery .mx_SettingsTab_subheading:nth-child(n + 2), .mx_SetIdServer .mx_SettingsTab_subheading {
    margin-top: 24px;
}
.mx_GeneralUserSettingsTab_accountSection .mx_Spinner, .mx_GeneralUserSettingsTab_discovery .mx_Spinner {
    -webkit-box-pack: left;
        -ms-flex-pack: left;
            justify-content: left;
}
.mx_GeneralUserSettingsTab_accountSection .mx_EmailAddresses, .mx_GeneralUserSettingsTab_accountSection .mx_PhoneNumbers, .mx_GeneralUserSettingsTab_discovery .mx_ExistingEmailAddress, .mx_GeneralUserSettingsTab_discovery .mx_ExistingPhoneNumber, .mx_GeneralUserSettingsTab_languageInput {
    margin-right: 100px;
}
.mx_GeneralUserSettingsTab_warningIcon {
    vertical-align: middle;
}
@keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
                transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
                transform: rotate(360deg);
    }
}
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_HelpUserSettingsTab_debugButton {
    margin-bottom: 5px;
    margin-top: 5px;
}
.mx_HelpUserSettingsTab span.mx_AccessibleButton {
    word-break: break-word;
}
.mx_HelpUserSettingsTab code {
    word-break: break-all;
    -webkit-user-select: all;
       -moz-user-select: all;
        -ms-user-select: all;
            user-select: all;
}
.mx_HelpUserSettingsTab_copy {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-radius: 5px;
    border: solid 1px #c8c8cd;
    margin-bottom: 10px;
    margin-top: 10px;
    padding: 10px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    max-width: 100%;
}
.mx_HelpUserSettingsTab_copy .mx_HelpUserSettingsTab_copyButton {
        -ms-flex-negative: 0;
            flex-shrink: 0;
        width: 20px;
        height: 20px;
        cursor: default;
        margin-left: 20px;
        display: block;
    }
.mx_HelpUserSettingsTab_copy .mx_HelpUserSettingsTab_copyButton::before {
            content: "";

            -webkit-mask-image: url(../../img/feather-customised/clipboard.24dd87a.svg);

                    mask-image: url(../../img/feather-customised/clipboard.24dd87a.svg);
            background-color: #b9bec6;
            width: 20px;
            height: 20px;
            display: block;
            background-repeat: no-repeat;
        }
/*
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MjolnirUserSettingsTab .mx_Field {
    margin-right: 100px;
}
.mx_MjolnirUserSettingsTab_listItem {
    margin-bottom: 2px;
}
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_NotificationUserSettingsTab .mx_SettingsTab_heading {
    margin-bottom: 10px;
}
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_PreferencesUserSettingsTab .mx_Field {
        margin-right: 100px;
    }
.mx_PreferencesUserSettingsTab .mx_SettingsTab_section {
        margin-bottom: 30px;
    }
.mx_PreferencesUserSettingsTab .mx_SettingsTab_section > details > summary {
                cursor: default;
                color: #f0f0f1;
            }
.mx_PreferencesUserSettingsTab .mx_SettingsTab_section > details + .mx_SettingsFlag {
                margin-top: 20px;
            }
.mx_PreferencesUserSettingsTab .mx_SettingsTab_section .mx_AccessibleButton_kind_link {
            padding: 0;
            font-size: inherit;
        }
.mx_PreferencesUserSettingsTab .mx_PreferencesUserSettingsTab_CommunityMigrator {
        margin-right: 200px;
    }
.mx_PreferencesUserSettingsTab .mx_PreferencesUserSettingsTab_CommunityMigrator > div {
            font-weight: 600;
            font-size: 1.5rem;
            line-height: 1.8rem;
            color: #f0f0f1;
            margin: 16px 0;
        }
.mx_PreferencesUserSettingsTab .mx_PreferencesUserSettingsTab_CommunityMigrator > div .mx_BaseAvatar {
                margin-right: 12px;
                vertical-align: middle;
            }
.mx_PreferencesUserSettingsTab .mx_PreferencesUserSettingsTab_CommunityMigrator > div .mx_AccessibleButton {
                float: right;
            }
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SecurityUserSettingsTab_bulkOptions .mx_AccessibleButton {
    margin-right: 10px;
}
.mx_SecurityUserSettingsTab_ignoredUser {
    margin-bottom: 5px;
}
.mx_SecurityUserSettingsTab_ignoredUser .mx_AccessibleButton {
    margin-right: 10px;
}
.mx_SecurityUserSettingsTab .mx_SettingsTab_section .mx_AccessibleButton_kind_link {
            padding: 0;
            font-size: inherit;
        }
.mx_SecurityUserSettingsTab .mx_SecurityUserSettingsTab_warning {
        color: #FF5B55;
        position: relative;
        padding-left: 40px;
        margin-top: 30px;
    }
.mx_SecurityUserSettingsTab .mx_SecurityUserSettingsTab_warning::before {
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            -webkit-mask-position: 0 center;
                    mask-position: 0 center;
            -webkit-mask-size: 2.4rem;
                    mask-size: 2.4rem;
            position: absolute;
            width: 2.4rem;
            height: 2.4rem;
            content: "";
            top: 0;
            left: 0;
            background-color: #FF5B55;
            -webkit-mask-image: url(../../img/feather-customised/alert-triangle.38aca3a.svg);
                    mask-image: url(../../img/feather-customised/alert-triangle.38aca3a.svg);
        }
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_VoiceUserSettingsTab .mx_Field {
    margin-right: 100px;
}
.mx_VoiceUserSettingsTab_missingMediaPermissions {
    margin-bottom: 15px;
}
/*
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.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 {
            position: relative;
            height: 80px;
            width: 80px;
            background-color: #8D97A5;
            border-radius: 16px;
        }
.mx_SpaceBasicSettings .mx_SpaceBasicSettings_avatarContainer img.mx_SpaceBasicSettings_avatar {
            width: 80px;
            height: 80px;
            -o-object-fit: cover;
               object-fit: cover;
            border-radius: 16px;
        }
.mx_SpaceBasicSettings .mx_SpaceBasicSettings_avatarContainer div.mx_SpaceBasicSettings_avatar {
            cursor: default;
        }
.mx_SpaceBasicSettings .mx_SpaceBasicSettings_avatarContainer div.mx_SpaceBasicSettings_avatar::before {
                content: "";
                position: absolute;
                height: 80px;
                width: 80px;
                top: 0;
                left: 0;
                background-color: #ffffff;
                -webkit-mask-repeat: no-repeat;
                        mask-repeat: no-repeat;
                -webkit-mask-position: center;
                        mask-position: center;
                -webkit-mask-size: 20px;
                        mask-size: 20px;
                -webkit-mask-image: url(../../img/element-icons/camera.a81a395.svg);
                        mask-image: url(../../img/element-icons/camera.a81a395.svg);
            }
.mx_SpaceBasicSettings .mx_SpaceBasicSettings_avatarContainer > input[type="file"] {
            display: none;
        }
.mx_SpaceBasicSettings .mx_SpaceBasicSettings_avatarContainer > .mx_AccessibleButton_kind_link {
            display: inline-block;
            padding: 0;
            margin: auto 16px;
            color: #368bd6;
        }
.mx_SpaceBasicSettings .mx_SpaceBasicSettings_avatarContainer > .mx_SpaceBasicSettings_avatar_remove {
            color: #FF5B55;
        }
.mx_SpaceBasicSettings .mx_AccessibleButton_hasKind {
        padding: 8px 22px;
        margin-left: auto;
        display: block;
        width: -webkit-min-content;
        width: -moz-min-content;
        width: min-content;
    }
.mx_SpaceBasicSettings .mx_AccessibleButton_disabled {
        cursor: not-allowed;
    }
/*
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SpaceChildrenPicker {
    margin: 16px 0;
}
.mx_SpaceChildrenPicker .mx_StyledRadioButton + .mx_StyledRadioButton {
        margin-top: 16px;
    }
.mx_SpaceChildrenPicker .mx_SearchBox {
        margin: 0 0 15px 0;
        -webkit-box-flex: 0;
            -ms-flex-positive: 0;
                flex-grow: 0;
        border-radius: 8px;
    }
.mx_SpaceChildrenPicker .mx_SpaceChildrenPicker_noResults {
        display: block;
        margin-top: 24px;
    }
/*
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu_background {
        background-color: #000;
        opacity: 0.6;
        left: 68px;
    }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu {
        padding: 24px;
        width: 480px;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        background-color: hsla(216, 21%, 14%, 1);
        position: relative;
    }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu > div > h2 {
                font-weight: 600;
                font-size: 1.8rem;
                margin-top: 4px;
            }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu > div > p {
                font-size: 1.5rem;
                color: #737D8C;
            }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu > div .mx_SpaceFeedbackPrompt {
                border-top: 1px solid rgba(231, 231, 231, 0.2);
                padding-top: 12px;
                margin-top: 16px;
            }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenuType {
            position: relative;
            padding: 16px 32px 16px 72px;
            width: 432px;
            -webkit-box-sizing: border-box;
                    box-sizing: border-box;
            border-radius: 8px;
            border: 1px solid rgba(231, 231, 231, 0.2);
            font-size: 1.5rem;
            margin: 20px 0;
        }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenuType > h3 {
        font-weight: 600;
        margin: 0 0 4px;
    }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenuType > span {
        color: #737D8C;
    }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenuType::before {
        position: absolute;
        content: '';
        width: 32px;
        height: 32px;
        top: 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;
        background-color: #8D97A5;
    }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenuType:hover {
        border-color: #4958F5;
    }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenuType:hover::before {
            background-color: #4958F5;
        }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenuType:hover > span {
            color: #f0f0f1;
        }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenuType_public::before {
            -webkit-mask-image: url(../../img/globe.8201f08.svg);
                    mask-image: url(../../img/globe.8201f08.svg);
        }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenuType_private::before {
            -webkit-mask-image: url(../../img/element-icons/lock.1f264bd.svg);
                    mask-image: url(../../img/element-icons/lock.1f264bd.svg);
        }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenu_back {
            width: 28px;
            height: 28px;
            position: relative;
            background-color: rgba(141,151,165, 0.2);
            border-radius: 14px;
            margin-bottom: 12px;
        }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_SpaceCreateMenu_back::before {
                content: "";
                position: absolute;
                height: 28px;
                width: 28px;
                top: 0;
                left: 0;
                background-color: #8D97A5;
                -webkit-transform: rotate(90deg);
                        transform: rotate(90deg);
                -webkit-mask-repeat: no-repeat;
                        mask-repeat: no-repeat;
                -webkit-mask-position: 2px 3px;
                        mask-position: 2px 3px;
                -webkit-mask-size: 24px;
                        mask-size: 24px;
                -webkit-mask-image: url(../../img/feather-customised/chevron-down.5278abe.svg);
                        mask-image: url(../../img/feather-customised/chevron-down.5278abe.svg);
            }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_AccessibleButton_kind_primary {
            padding: 8px 22px;
            margin-left: auto;
            display: block;
            width: -webkit-min-content;
            width: -moz-min-content;
            width: min-content;
        }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_AccessibleButton_kind_link {
            padding: 0;
            font-size: inherit;
        }
.mx_SpaceCreateMenu_wrapper .mx_ContextualMenu .mx_AccessibleButton_disabled {
            cursor: not-allowed;
        }
.mx_SpaceFeedbackPrompt {
    font-size: 1.5rem;
    line-height: 2.4rem;
}
.mx_SpaceFeedbackPrompt > span {
        color: #737D8C;
        position: relative;
        font-size: inherit;
        line-height: inherit;
        margin-right: auto;
    }
.mx_SpaceFeedbackPrompt .mx_AccessibleButton_kind_link {
        color: #4958F5;
        position: relative;
        padding: 0;
        margin-left: 8px;
        font-size: inherit;
        line-height: inherit;
    }
/*
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SpacePublicShare .mx_AccessibleButton {
        position: relative;
        padding: 16px 32px 16px 72px;
        width: 432px;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        border-radius: 8px;
        border: 1px solid rgba(231, 231, 231, 0.2);
        font-size: 1.5rem;
        margin: 20px 0;
    }
.mx_SpacePublicShare .mx_AccessibleButton > h3 {
        font-weight: 600;
        margin: 0 0 4px;
    }
.mx_SpacePublicShare .mx_AccessibleButton > span {
        color: #737D8C;
    }
.mx_SpacePublicShare .mx_AccessibleButton::before {
        position: absolute;
        content: '';
        width: 32px;
        height: 32px;
        top: 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;
        background-color: #8D97A5;
    }
.mx_SpacePublicShare .mx_AccessibleButton:hover {
        border-color: #4958F5;
    }
.mx_SpacePublicShare .mx_AccessibleButton:hover::before {
            background-color: #4958F5;
        }
.mx_SpacePublicShare .mx_AccessibleButton:hover > span {
            color: #f0f0f1;
        }
.mx_SpacePublicShare .mx_AccessibleButton.mx_SpacePublicShare_shareButton::before {
            -webkit-mask-image: url(../../img/element-icons/link.8f4b1fc.svg);
                    mask-image: url(../../img/element-icons/link.8f4b1fc.svg);
        }
.mx_SpacePublicShare .mx_AccessibleButton.mx_SpacePublicShare_inviteButton::before {
            -webkit-mask-image: url(../../img/element-icons/room/invite.946a71b.svg);
                    mask-image: url(../../img/element-icons/room/invite.946a71b.svg);
        }
/*
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_InlineTermsAgreement_cbContainer {
    margin-bottom: 10px;
    font-size: 1.4rem;
}
.mx_InlineTermsAgreement_cbContainer a {
        color: #4958F5;
        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 {
    display: inline-block;
    -webkit-mask-image: url(../../img/external-link.a8d3e9b.svg);
            mask-image: url(../../img/external-link.a8d3e9b.svg);
    background-color: #4958F5;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-size: contain;
            mask-size: contain;
    width: 12px;
    height: 12px;
    margin-left: 3px;
    vertical-align: middle;
}
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AnalyticsToast .mx_AccessibleButton_kind_danger_outline {
        background-color: #4958F5;
        color: #ffffff;
        border: 1px solid #4958F5;
        font-weight: 600;
    }
.mx_AnalyticsToast .mx_AccessibleButton_kind_primary {
        background-color: #4958F5;
        color: #ffffff;
        border: 1px solid #4958F5;
        font-weight: 600;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_NonUrgentEchoFailureToast .mx_NonUrgentEchoFailureToast_icon {
        display: inline-block;
        width: 1.8rem;
        height: 1.8rem;
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: contain;
                mask-size: contain;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        background-color: #fff;
        -webkit-mask-image: url(../../img/element-icons/cloud-off.33cd28e.svg);
                mask-image: url(../../img/element-icons/cloud-off.33cd28e.svg);
        margin-right: 8px;
    }
.mx_NonUrgentEchoFailureToast span {
        vertical-align: middle;
    }
.mx_NonUrgentEchoFailureToast .mx_AccessibleButton {
        padding: 0;
    }
/*
Copyright 2019 New Vector Ltd.
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_VerificationShowSas_decimalSas {
    text-align: center;
    font-weight: bold;
    padding-left: 3px;
    padding-right: 3px;
}
.mx_VerificationShowSas_decimalSas span {
    margin-left: 5px;
    margin-right: 5px;
}
.mx_VerificationShowSas_emojiSas {
    text-align: center;
    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;
    margin: 25px 0;
}
.mx_VerificationShowSas_emojiSas_block {
    display: inline-block;
    margin-bottom: 16px;
    position: relative;
    width: 52px;
}
.mx_Dialog .mx_VerificationShowSas_emojiSas_block, .mx_AuthPage_modal .mx_VerificationShowSas_emojiSas_block {
    width: 60px;
}
.mx_VerificationShowSas_emojiSas_emoji {
    font-size: 3.2rem;
}
.mx_VerificationShowSas_emojiSas_label {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 1.2rem;
}
.mx_VerificationShowSas_emojiSas_break {
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
}
.mx_VerificationShowSas_buttonRow {
    text-align: center;
    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;
    grid-gap: 9px;
    gap: 9px;
}
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2020 - 2021 The Matrix.org Foundation C.I.C.
Copyright 2021 Šimon Brandner <simon.bra.ag@gmail.com>

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
[data-whatinput="mouse"] .mx_CallViewButtons.mx_CallViewButtons_hidden {
    opacity: 0.001;
    pointer-events: none;
}
.mx_CallViewButtons {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    bottom: 24px;
    opacity: 1;
    -webkit-transition: opacity 0.5s;
    transition: opacity 0.5s;
    z-index: 200;
    grid-gap: 18px;
    gap: 18px;
}
.mx_CallViewButtons .mx_CallViewButtons_button {
        cursor: default;

        background-color: #ffffff;

        border-radius: 100%;
        height: 40px;
        width: 40px;

        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_CallViewButtons .mx_CallViewButtons_button::before {
            content: '';
            display: inline-block;

            -webkit-mask-repeat: no-repeat;

                    mask-repeat: no-repeat;
            -webkit-mask-size: contain;
                    mask-size: contain;
            -webkit-mask-position: center;
                    mask-position: center;

            background-color: #737D8C;

            height: 24px;
            width: 24px;
        }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_on {
            background-color: #ffffff;
        }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_on::before {
                background-color: #737D8C;
            }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_on.mx_CallViewButtons_button_mic::before {
                -webkit-mask-image: url(../../img/voip/call-view/mic-on.42e5b4f.svg);
                        mask-image: url(../../img/voip/call-view/mic-on.42e5b4f.svg);
            }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_on.mx_CallViewButtons_button_vid::before {
                -webkit-mask-image: url(../../img/voip/call-view/cam-on.2f20559.svg);
                        mask-image: url(../../img/voip/call-view/cam-on.2f20559.svg);
            }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_on.mx_CallViewButtons_button_screensharing {
                background-color: #4958F5;
            }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_on.mx_CallViewButtons_button_screensharing::before {
                    -webkit-mask-image: url(../../img/voip/call-view/screensharing.6633902.svg);
                            mask-image: url(../../img/voip/call-view/screensharing.6633902.svg);
                    background-color: white;
                }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_on.mx_CallViewButtons_button_sidebar::before {
                -webkit-mask-image: url(../../img/voip/call-view/sidebar-on.201da9d.svg);
                        mask-image: url(../../img/voip/call-view/sidebar-on.201da9d.svg);
            }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_off {
            background-color: #737D8C;
        }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_off::before {
                background-color: #ffffff;
            }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_off.mx_CallViewButtons_button_mic::before {
                -webkit-mask-image: url(../../img/voip/call-view/mic-off.9f7b143.svg);
                        mask-image: url(../../img/voip/call-view/mic-off.9f7b143.svg);
            }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_off.mx_CallViewButtons_button_vid::before {
                -webkit-mask-image: url(../../img/voip/call-view/cam-off.8a4f251.svg);
                        mask-image: url(../../img/voip/call-view/cam-off.8a4f251.svg);
            }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_off.mx_CallViewButtons_button_screensharing {
                background-color: #ffffff;
            }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_off.mx_CallViewButtons_button_screensharing::before {
                    -webkit-mask-image: url(../../img/voip/call-view/screensharing.6633902.svg);
                            mask-image: url(../../img/voip/call-view/screensharing.6633902.svg);
                    background-color: #737D8C;
                }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_off.mx_CallViewButtons_button_sidebar {
                background-color: #ffffff;
            }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_off.mx_CallViewButtons_button_sidebar::before {
                    -webkit-mask-image: url(../../img/voip/call-view/sidebar-off.6aeab15.svg);
                            mask-image: url(../../img/voip/call-view/sidebar-off.6aeab15.svg);
                    background-color: #737D8C;
                }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_dialpad::before {
            -webkit-mask-image: url(../../img/voip/call-view/dialpad.76f693e.svg);
                    mask-image: url(../../img/voip/call-view/dialpad.76f693e.svg);
        }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_hangup {
            background-color: #FF5B55;
        }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_hangup::before {
                -webkit-mask-image: url(../../img/voip/call-view/hangup.ddd2375.svg);
                        mask-image: url(../../img/voip/call-view/hangup.ddd2375.svg);
                background-color: white;
            }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_more::before {
            -webkit-mask-image: url(../../img/voip/call-view/more.645220c.svg);
                    mask-image: url(../../img/voip/call-view/more.645220c.svg);
        }
.mx_CallViewButtons .mx_CallViewButtons_button.mx_CallViewButtons_button_invisible {
            visibility: hidden;
            pointer-events: none;
            position: absolute;
        }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CallContainer {
    position: absolute;
    right: 20px;
    bottom: 72px;
    z-index: 100;
    pointer-events: none;
}
.mx_CallContainer .mx_AppTile_persistedWrapper div {
        min-width: 350px;
    }
/*
Copyright 2021 Šimon Brandner <simon.bra.ag@gmail.com>

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CallPreview {
    position: fixed;
    left: 0;
    top: 0;

    pointer-events: initial;
}
.mx_CallPreview .mx_VideoFeed_remote.mx_VideoFeed_voice {
        min-height: 150px;
    }
.mx_CallPreview .mx_VideoFeed_local {
        border-radius: 8px;
        overflow: hidden;
    }
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CallView {
    border-radius: 8px;
    background-color: #25262d;
    padding-left: 8px;
    padding-right: 8px;
    pointer-events: initial;
}
.mx_CallView_large {
    padding-bottom: 10px;
    margin: 8px;
    margin-right: calc(8px / 2);
    margin-bottom: 10px;
    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;
}
.mx_CallView_large .mx_CallView_voice {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
    }
.mx_CallView_large.mx_CallView_belowWidget {
        margin-top: 0;
    }
.mx_CallView_pip {
    width: 320px;
    padding-bottom: 8px;
    background-color: #F4F6FA;
    -webkit-box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.20);
            box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.20);
    border-radius: 8px;
}
.mx_CallView_pip .mx_CallView_video_hold, .mx_CallView_pip .mx_CallView_voice {
        height: 180px;
    }
.mx_CallView_pip .mx_CallViewButtons {
        bottom: 13px;
    }
.mx_CallView_pip .mx_CallViewButtons_button {
        width: 34px;
        height: 34px;
    }
.mx_CallView_pip .mx_CallViewButtons_button::before {
            width: 22px;
            height: 22px;
        }
.mx_CallView_pip .mx_CallView_holdTransferContent {
        padding-top: 10px;
        padding-bottom: 25px;
    }
.mx_CallView_content {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    border-radius: 8px;
}
.mx_CallView_content > .mx_VideoFeed {
        width: 100%;
        height: 100%;
    }
.mx_CallView_content > .mx_VideoFeed.mx_VideoFeed_voice {
            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_CallView_content > .mx_VideoFeed .mx_VideoFeed_video {
            height: 100%;
            background-color: #000;
        }
.mx_CallView_content > .mx_VideoFeed .mx_VideoFeed_mic {
            left: 10px;
            bottom: 10px;
        }
.mx_CallView_voice {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    background-color: #25262d;
}
.mx_CallView_voice_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_CallView_voice_avatarsContainer div:not(.bp_Avatar) {
        margin-left: 12px;
        margin-right: 12px;
    }
.mx_CallView_voice .mx_CallView_holdTransferContent .mx_CallView_voice_avatarContainer {
        border-radius: 2000px;
        overflow: hidden;
        position: relative;
    }
.mx_CallView_holdTransferContent {
    height: 20px;
    padding-top: 20px;
    padding-bottom: 15px;
    color: #202127;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
}
.mx_CallView_holdTransferContent .mx_AccessibleButton_hasKind {
        padding: 0px;
        font-weight: bold;
    }
.mx_CallView_video {
    width: 100%;
    height: 100%;
    z-index: 30;
    overflow: hidden;
}
.mx_CallView_video_hold {
    overflow: hidden;
}
.mx_CallView_video_hold .mx_VideoFeed {
        visibility: hidden;
    }
.mx_CallView_video_holdBackground {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    -webkit-filter: blur(20px);
            filter: blur(20px);
}
.mx_CallView_video_holdBackground::after {
        content: '';
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        right: 0;
        background-color: rgba(0, 0, 0, 0.6);
    }
.mx_CallView_video .mx_CallView_holdTransferContent {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    font-weight: bold;
    color: #202127;
    text-align: center;
}
.mx_CallView_video .mx_CallView_holdTransferContent::before {
        display: block;
        margin-left: auto;
        margin-right: auto;
        content: '';
        width: 40px;
        height: 40px;
        background-image: url(../../img/voip/paused.77799b3.svg);
        background-position: center;
        background-size: cover;
    }
.mx_CallView_pip .mx_CallView_video .mx_CallView_holdTransferContent::before {
        width: 30px;
        height: 30px;
    }
.mx_CallView_video .mx_CallView_holdTransferContent .mx_AccessibleButton_hasKind {
        padding: 0px;
    }
.mx_CallView_presenting {
    position: absolute;
    margin-top: 18px;
    padding: 4px 8px;
    border-radius: 4px;
    color: white;
    background-color: #17191c;
}
/*
Copyright 2021 Šimon Brandner <simon.bra.ag@gmail.com>

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CallViewForRoom {
    overflow: hidden;
}
.mx_CallViewForRoom .mx_CallViewForRoom_ResizeWrapper {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
.mx_CallViewForRoom .mx_CallViewForRoom_ResizeWrapper:hover .mx_CallViewForRoom_ResizeHandle {
            width: 100% !important;

            display: -webkit-box;

            display: -ms-flexbox;

            display: flex;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
        }
.mx_CallViewForRoom .mx_CallViewForRoom_ResizeWrapper:hover .mx_CallViewForRoom_ResizeHandle::after {
                content: '';
                border-radius: 4px;

                height: 4px;
                width: 100%;
                max-width: 64px;

                background-color: #f0f0f1;
            }
/*
Copyright 2021 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CallViewHeader {
    height: 44px;
    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: left;
        -ms-flex-pack: left;
            justify-content: left;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    cursor: default;
}
.mx_CallViewHeader_callType {
    font-size: 1.2rem;
    font-weight: bold;
    vertical-align: middle;
}
.mx_CallViewHeader_secondaryCallInfo::before {
        content: '·';
        margin-left: 6px;
        margin-right: 6px;
    }
.mx_CallViewHeader_controls {
    margin-left: auto;
}
.mx_CallViewHeader_button {
    display: inline-block;
    vertical-align: middle;
    cursor: default;
}
.mx_CallViewHeader_button::before {
        content: '';
        display: inline-block;
        height: 20px;
        width: 20px;
        vertical-align: middle;
        background-color: #737D8C;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-size: contain;
                mask-size: contain;
        -webkit-mask-position: center;
                mask-position: center;
    }
.mx_CallViewHeader_button_fullscreen::before {
        -webkit-mask-image: url(../../img/element-icons/call/fullscreen.43be138.svg);
                mask-image: url(../../img/element-icons/call/fullscreen.43be138.svg);
    }
.mx_CallViewHeader_button_expand::before {
        -webkit-mask-image: url(../../img/element-icons/call/expand.7ef9f56.svg);
                mask-image: url(../../img/element-icons/call/expand.7ef9f56.svg);
    }
.mx_CallViewHeader_callInfo {
    margin-left: 12px;
    margin-right: 16px;
}
.mx_CallViewHeader_roomName {
    font-weight: bold;
    font-size: 12px;
    line-height: normal;
    line-height: initial;
    height: 15px;
}
.mx_CallView_secondaryCall_roomName {
    margin-left: 4px;
}
.mx_CallViewHeader_callTypeSmall {
    font-size: 12px;
    color: #737D8C;
    line-height: normal;
    line-height: initial;
    height: 15px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 240px;
}
.mx_CallViewHeader_callTypeIcon {
    display: inline-block;
    margin-right: 6px;
    height: 16px;
    width: 16px;
    vertical-align: middle;
}
.mx_CallViewHeader_callTypeIcon::before {
        content: '';
        display: inline-block;
        vertical-align: top;

        height: 16px;
        width: 16px;
        background-color: #737D8C;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-size: contain;
                mask-size: contain;
        -webkit-mask-position: center;
                mask-position: center;
    }
.mx_CallViewHeader_callTypeIcon.mx_CallViewHeader_callTypeIcon_voice::before {
        -webkit-mask-image: url(../../img/element-icons/call/voice-call.85a7c92.svg);
                mask-image: url(../../img/element-icons/call/voice-call.85a7c92.svg);
    }
.mx_CallViewHeader_callTypeIcon.mx_CallViewHeader_callTypeIcon_video::before {
        -webkit-mask-image: url(../../img/element-icons/call/video-call.55bc086.svg);
                mask-image: url(../../img/element-icons/call/video-call.55bc086.svg);
    }
/*
Copyright 2021 Šimon Brandner <simon.bra.ag@gmail.com>

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CallViewSidebar {
    position: absolute;
    right: 16px;
    bottom: 16px;
    z-index: 100;

    overflow: auto;

    height: calc(100% - 32px);
    width: 20%;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    grid-gap: 12px;
    gap: 12px;
}
.mx_CallViewSidebar > .mx_VideoFeed {
        width: 100%;
        border-radius: 4px;
    }
.mx_CallViewSidebar > .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;
                    justify-content: center;

            background-color: #394049;
        }
.mx_CallViewSidebar > .mx_VideoFeed .mx_VideoFeed_video {
            border-radius: 4px;
        }
.mx_CallViewSidebar > .mx_VideoFeed .mx_VideoFeed_mic {
            left: 6px;
            bottom: 6px;
        }
.mx_CallViewSidebar.mx_CallViewSidebar_pipMode {
        top: 16px;
        bottom: unset;
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: flex-end;
        grid-gap: 4px;
        gap: 4px;
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_DialPad {
    display: grid;
    grid-row-gap: 16px;
    row-gap: 16px;
    grid-column-gap: 0px;
    -webkit-column-gap: 0px;
       -moz-column-gap: 0px;
            column-gap: 0px;
    margin-top: 24px;
    margin-left: auto;
    margin-right: auto;

    /* squeeze the dial pad buttons together horizontally */
    grid-template-columns: repeat(3, 1fr);
}
.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;
            justify-content: center;

    width: 40px;
    height: 40px;
    background-color: #E3E8F0;
    border-radius: 40px;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    vertical-align: middle;
    margin-left: auto;
    margin-right: auto;
}
.mx_DialPad_button .mx_DialPad_buttonSubText {
    font-size: 8px;
}
.mx_DialPad_dialButton {
    /* Always show the dial button in the center grid column */
    grid-column: 2;
    background-color: #4958F5;
}
.mx_DialPad_dialButton::before {
        content: '';
        display: inline-block;
        height: 40px;
        width: 40px;
        vertical-align: middle;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-size: 20px;
                mask-size: 20px;
        -webkit-mask-position: center;
                mask-position: center;
        background-color: #FFF;
        -webkit-mask-image: url(../../img/element-icons/call/voice-call.85a7c92.svg);
                mask-image: url(../../img/element-icons/call/voice-call.85a7c92.svg);
    }
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_DialPadContextMenu_dialPad .mx_DialPad {
    grid-row-gap: 16px;
    row-gap: 16px;
    grid-column-gap: 32px;
    -webkit-column-gap: 32px;
       -moz-column-gap: 32px;
            column-gap: 32px;
}
.mx_DialPadContextMenuWrapper {
    padding: 15px;
}
.mx_DialPadContextMenu_header {
    border: none;
    margin-top: 32px;
    margin-left: 20px;
    margin-right: 20px;

    /* a separator between the input line and the dial buttons */
    border-bottom: 1px solid #c1c6cd;
    -webkit-transition: border-bottom 0.25s;
    transition: border-bottom 0.25s;
}
.mx_DialPadContextMenu_cancel {
    float: right;
    -webkit-mask: url(../../img/feather-customised/cancel.23c2689.svg);
            mask: url(../../img/feather-customised/cancel.23c2689.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-size: cover;
            mask-size: cover;
    width: 14px;
    height: 14px;
    background-color: #9fa9ba;
    cursor: default;
}
.mx_DialPadContextMenu_header:focus-within {
    border-bottom: 1px solid #4958F5;
}
.mx_DialPadContextMenu_title {
    color: #b9bec6;
    font-size: 12px;
    font-weight: 600;
}
.mx_DialPadContextMenu_dialled {
    height: 1.5em;
    font-size: 18px;
    font-weight: 600;
    border: none;
    margin: 0px;
}
.mx_DialPadContextMenu_dialled input {
    font-size: 18px;
    font-weight: 600;
    overflow: hidden;
    max-width: 185px;
    text-align: left;
    padding: 8px 0px;
    background-color: rgb(0, 0, 0, 0);
}
.mx_DialPadContextMenu_dialPad {
    margin: 16px;
}
/*
Copyright 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_Dialog_dialPadWrapper .mx_Dialog {
    padding: 0px;
}
.mx_DialPadModal {
    width: 292px;
    height: 370px;
    padding: 16px 0px 0px 0px;
}
.mx_DialPadModal_header {
    margin-top: 32px;
    margin-left: 40px;
    margin-right: 40px;

    /* a separator between the input line and the dial buttons */
    border-bottom: 1px solid #c1c6cd;
    -webkit-transition: border-bottom 0.25s;
    transition: border-bottom 0.25s;
}
.mx_DialPadModal_header:focus-within {
    border-bottom: 1px solid #4958F5;
}
.mx_DialPadModal_title {
    color: #b9bec6;
    font-size: 12px;
    font-weight: 600;
}
.mx_DialPadModal_cancel {
    float: right;
    -webkit-mask: url(../../img/feather-customised/cancel.23c2689.svg);
            mask: url(../../img/feather-customised/cancel.23c2689.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-size: cover;
            mask-size: cover;
    width: 14px;
    height: 14px;
    background-color: #9fa9ba;
    cursor: default;
    margin-right: 16px;
}
.mx_DialPadModal_field {
    border: none;
    margin: 0px;
    height: 30px;
}
.mx_DialPadModal_field .mx_Field_postfix {
    /* Remove border separator between postfix and field content */
    border-left: none;
}
.mx_DialPadModal_field input {
    font-size: 18px;
    font-weight: 600;
}
.mx_DialPadModal_dialPad {
    margin-left: 16px;
    margin-right: 16px;
    margin-top: 16px;
}
/*
Copyright 2015, 2016, 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_VideoFeed {
    overflow: hidden;
    position: relative;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    border: transparent 2px solid;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.mx_VideoFeed.mx_VideoFeed_voice {
        background-color: #25262d;
        aspect-ratio: 16 / 9;
    }
.mx_VideoFeed .mx_VideoFeed_video {
        width: 100%;
        background-color: transparent;
    }
.mx_VideoFeed .mx_VideoFeed_video.mx_VideoFeed_video_mirror {
            -webkit-transform: scale(-1, 1);
                    transform: scale(-1, 1);
        }
.mx_VideoFeed .mx_VideoFeed_mic {
        position: absolute;
        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;

        width: 24px;
        height: 24px;

        background-color: rgba(0, 0, 0, 0.5);
        border-radius: 100%;
    }
.mx_VideoFeed .mx_VideoFeed_mic::before {
            position: absolute;
            content: "";
            width: 16px;
            height: 16px;
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            -webkit-mask-size: contain;
                    mask-size: contain;
            -webkit-mask-position: center;
                    mask-position: center;
            background-color: white;
            border-radius: 7px;
        }
.mx_VideoFeed .mx_VideoFeed_mic.mx_VideoFeed_mic_muted::before {
            -webkit-mask-image: url(../../img/voip/mic-muted.d4c8cf9.svg);
                    mask-image: url(../../img/voip/mic-muted.d4c8cf9.svg);
        }
.mx_VideoFeed .mx_VideoFeed_mic.mx_VideoFeed_mic_unmuted::before {
            -webkit-mask-image: url(../../img/voip/mic-unmuted.523e72c.svg);
                    mask-image: url(../../img/voip/mic-unmuted.523e72c.svg);
        }
/* Beeper changed */
.reset-style, .reset-style * {
  all: revert;
}
.bp_row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}
.bp_row.center {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
.bp_col {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.mx_Dialog_buttons {    
    text-align: left;
}
.bp_VerificationPanel_QR {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.bp_VerificationPanel_QR .description {
        margin-left: 20px;
    }
.bp_VerificationRequestDialog .mx_Dialog_header {
    display: none;
}
.bp_Splash {
    z-index: 10001;
}
.bp_Splash .mx_Dialog_title {
        color: #fff;
    }
.bp_Splash .mx_Field label {
        color: rgba(231, 231, 231, 0.2);
    }
.bp_Splash .mx_Field input, .bp_Splash .mx_Field select, .bp_Splash .mx_Field textarea {
        color: #fff;
    }
.bp_Splash .mx_Dialog button, .bp_Splash .mx_Dialog input[type='submit'], .bp_Splash .mx_Dialog_buttons button, .bp_Splash .mx_Dialog_buttons input[type='submit'], .bp_Splash .mx_AccessibleButton_hasKind:not(.mx_AccessibleButton_kind_link) {
        color: #fff;
    }
.bp_Splash .mx_Dialog_title {
        font-size: 32px;
        font-weight: 800;
    }
.bp_Splash .mx_Dialog_fixedWidth {
        max-width: 562px;
    }
.bp_Splash .mx_Dialog_cancelButton {
        display: none;
    }
.bp_Splash .mx_AccessSecretStorageDialog_recoveryKeyFeedback_valid {
        color: #999;
    }
.bp_Splash .mx_AccessSecretStorageDialog_recoveryKeyFeedback_valid:before {
            background-color: #999;
        }
.bp_Splash .mx_Dialog_background {
        background: #131B3A;
        opacity: 1;
        pointer-events: none;

        background-image: url(../../themes/beeper/img/beeper-text.c6147d1.png);
        background-position-x: center;
        background-position-y: 20px;
        background-repeat: no-repeat;
        background-size: 120px;
    }
.bp_Splash .mx_Dialog_background:before, .bp_Splash .mx_Dialog_background:after {
            content: '';
            display: block;
            width: 240px;
            height: 90px;
            position: absolute;
            -webkit-filter: blur(100px);
                    filter: blur(100px);
        }
.bp_Splash .mx_Dialog_background:before {
            background: linear-gradient(
                177.05deg,
                rgb(255, 155, 113) 3.09%,
                rgb(230, 96, 206) 96.24%
            );
            left: 30%;
            bottom: 30%;
            -webkit-transform: translateX(-50%) translateY(50%);
                    transform: translateX(-50%) translateY(50%);
        }
.bp_Splash .mx_Dialog_background:after {
            background: linear-gradient(
                177.05deg,
                rgb(181, 71, 233) 3.09%, 
                rgb(73, 88, 245) 96.24%
            );
            right: 30%;
            top: 30%;
            -webkit-transform: translateX(50%) translateY(-50%);
                    transform: translateX(50%) translateY(-50%);
        }
.bp_Splash_framed .mx_Dialog {
            background: none;
            -webkit-box-shadow: none;
                    box-shadow: none;
            padding: 0;
            overflow: visible;
        }
.bp_Splash_framed .mx_Dialog:before, .bp_Splash_framed .mx_Dialog:after {
                display: block;
                content: '';
                position: absolute;
                background-size: contain;
                background-repeat: no-repeat;
                display: block;
                width: 240px;
                height: 120px;
                z-index: -1;
            }
.bp_Splash_framed .mx_Dialog:before {
                background-image: url(../../themes/beeper/img/balloon-left.efdf596.svg);
                left: -120px;
                bottom: -75px;
                background-position-y: bottom;
            }
.bp_Splash_framed .mx_Dialog:after {
                background-image: url(../../themes/beeper/img/balloon-right.7433800.svg);
                right: -120px;
                top: -45px;
            }
.bp_Splash_framed .mx_Dialog .mx_Dialog_body {
                background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(0.01%, rgba(19, 27, 58, 0)), to(rgba(19, 27, 58, 0.4))),
                    -webkit-gradient(linear, left bottom, left top, from(#32384E), to(#32384E));
                background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(19, 27, 58, 0) 0.01%, rgba(19, 27, 58, 0.4) 100%),
                    linear-gradient(0deg, #32384E, #32384E);
                -webkit-box-shadow: 0px 8px 48px rgba(19, 27, 58, 0.36);
                        box-shadow: 0px 8px 48px rgba(19, 27, 58, 0.36);
                border-radius: 16px;
                padding: 40px;
            }
/**
 * Buttons
 */
.mx_Dialog button, .mx_Dialog input[type='submit'], .mx_Dialog_buttons button, .mx_Dialog_buttons input[type='submit'], .mx_AccessibleButton_hasKind:not(.mx_AccessibleButton_kind_link):not(.mx_AccessibleButton_kind_link_inline):not(.mx_MatrixChat_splashButtons) {
    -webkit-box-shadow: inset 0px 0px 0px 2px #585E74;
            box-shadow: inset 0px 0px 0px 2px #585E74;
    background: none;
    color: #f0f0f1;
    border-radius: 28px;
    padding: 4px 24px;
    border: none;
}
.mx_Dialog button.mx_Dialog_primary, .mx_Dialog input[type='submit'].mx_Dialog_primary, .mx_Dialog_buttons button.mx_Dialog_primary, .mx_Dialog_buttons input[type='submit'].mx_Dialog_primary, .mx_AccessibleButton_kind_primary {
    -webkit-box-shadow: inset 0px 0px 0px 2px #4958F5 !important;
            box-shadow: inset 0px 0px 0px 2px #4958F5 !important;
}
.mx_Dialog button.danger, .mx_Dialog input[type='submit'].danger, .mx_Dialog_buttons button.danger, .mx_Dialog_buttons input[type='submit'].danger, .mx_AccessibleButton_kind_danger {
    -webkit-box-shadow: inset 0px 0px 0px 2px #E0474F !important;
            box-shadow: inset 0px 0px 0px 2px #E0474F !important;
}
.mx_Dialog_buttons, .mx_SecureBackupPanel_buttonRow {
    margin-bottom: -10px;
}
.mx_Dialog_buttons > *, .mx_SecureBackupPanel_buttonRow > * {
        margin-bottom: 10px;
        margin-right: 8px;
    }
.mx_TabbedView_tabLabel {
    border-radius: 12px;
}
.mx_TabbedView_maskedIcon {
    margin-right: 8px;
}
.mx_TabbedView_tabLabel_text {
    padding-right: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mx_QuestionDialog {
    max-width: 500px;
}
.bp_GoogleContactLoginDialog > .mx_Dialog_content {
        margin-bottom: 24px;
    }
.bp_GoogleContactLoginDialog > .mx_Dialog_buttons {
        text-align: center;
        margin-bottom: 0;
    }
.bp_GoogleContactLoginDialog > .mx_Dialog_buttons > button {
            -webkit-box-shadow: unset !important;
                    box-shadow: unset !important;
            padding: 0;
            margin: 0;
        }
.bp_Dialog_small {
    width: auto;
}
.bp_Dialog_small .mx_Dialog_content {
        margin: 1rem 0 0 0;
    }
.mx_MatrixChat > .mx_ResizeHandle, .mx_RightPanel_ResizeWrapper .mx_ResizeHandle {
    margin: 0px -9.5px 0px -2.5px;
    -webkit-box-shadow: hsl(0deg 0% 100% / 10%) 1px 0px 0px 0px inset;
            box-shadow: hsl(0deg 0% 100% / 10%) 1px 0px 0px 0px inset;
}
.mx_MatrixChat > .mx_ResizeHandle {
    margin-right: -9px;
}
.mx_RightPanel_ResizeWrapper .mx_ResizeHandle {
    left: -3px !important;
}
.mx_MatrixChat.resizing {
    cursor: col-resize;
}
.mx_MatrixChat:not(.resizing) .bp_LeftPanel {
        -webkit-transition: width .2s ease-in-out;
        transition: width .2s ease-in-out;
    }
.mx_MatrixChat > .mx_ResizeHandle:hover, .mx_MatrixChat.resizing > .mx_ResizeHandle, .mx_RightPanel_ResizeWrapper .mx_ResizeHandle:hover, .mx_RightPanel_ResizeWrapper .mx_ResizeHandle.resizing {
    -webkit-box-shadow: inset 4px 0px 0px 0px #5280FF;
            box-shadow: inset 4px 0px 0px 0px #5280FF;
}
.bp_Spinner_block {
    margin: 30px 0;
}
@media
not screen and (-webkit-min-device-pixel-ratio: 2), not screen and (        min-device-pixel-ratio: 2), not screen and (                -webkit-min-device-pixel-ratio: 2), not screen and (                min-resolution: 192dpi), not screen and (                min-resolution: 2dppx) { 

  /* non-Retina-specific stuff here */
  span.emoji {
    margin-right: 4px;
  }
}
.link {
  color: #4958F5;
}
.link:hover {
    text-decoration: underline;
  }
.monospace {
  font-family: monospace !important;
}
.baseText {
  color: rgb(255 255 255);
}
.line_limit {
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-box-orient: vertical;
  display: -webkit-box;
}
.line_limit.one {
    -webkit-line-clamp: 1;
  }
.line_limit.two {
    -webkit-line-clamp: 2;
  }
.mx_DateSeparator {
    font-size: 14px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-bottom: 8px;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
}
.mx_RoomView_dateSeparator_container .mx_DateSeparator>div, .mx_DateSeparator > div {
    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;
    border-radius: 20px;
    border: none;
    height: 24px;
    font-weight: 400;
    padding: 0 10px;
    font-size: 12px;
    background: rgb(255 255 255 / 7%);
    color: rgb(255 255 255 / 50%);
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
/* Remove the border and padding for iframes for download links. */
.mx_MFileBody_download iframe {
    margin: 0px;
    padding: 0px;
    border: none;
    width: 100%;
    /* Set the height of the iframe to be 1 line of text.
     * Iframes don't automatically size themselves to fit their content.
     * So either we have to fix the height of the iframe using CSS or
     * use javascript's cross-origin postMessage API to communicate how
     * big the content of the iframe is. */
    height: 1.5em;
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MImageBody {
    display: block;
}
.mx_MImageBody_thumbnail_container {
    overflow: hidden;
    position: relative;
}
.mx_MImageBody_thumbnail_spinner {
    position: static;
}
.mx_MImageBody_thumbnail_spinner > * {
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
}
.mx_MImageBody_gifLabel {
    position: absolute;
    display: block;
    top: 0px;
    left: 14px;
    padding: 0 5px;
    border-radius: 7px;
    background: rgba(0, 0, 0, 0.7);
    border: 2px solid rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 1);
    pointer-events: none;
}
.mx_HiddenImagePlaceholder {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    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;
    text-align: center;

    cursor: default;
    background-color: #454854;
}
.mx_HiddenImagePlaceholder .mx_HiddenImagePlaceholder_button {
        color: #4958F5;
    }
.mx_HiddenImagePlaceholder .mx_HiddenImagePlaceholder_button span.mx_HiddenImagePlaceholder_eye {
            margin-right: 8px;

            background-color: #4958F5;
            -webkit-mask-image: url(../../img/feather-customised/eye.52aa0d2.svg);
                    mask-image: url(../../img/feather-customised/eye.52aa0d2.svg);
            display: inline-block;
            width: 18px;
            height: 14px;
        }
.mx_HiddenImagePlaceholder .mx_HiddenImagePlaceholder_button span:not(.mx_HiddenImagePlaceholder_eye) {
            vertical-align: text-bottom;
        }
.mx_EventTile:hover .mx_HiddenImagePlaceholder {
    background-color: #25262d;
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MNoticeBody {
    opacity: 0.6;
}
/*
Copyright 2018 New Vector Ltd.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MStickerBody_tooltip {
    position: absolute;
    top: 50%;
}
.mx_MStickerBody_hidden {
    max-width: 220px;
    text-decoration: none;
    text-align: center;
    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;
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
/*
Copyright 2019 New Vector Ltd
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MessageActionBar {
    position: absolute;
    visibility: hidden;
    cursor: default;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 24px;
    line-height: 24px;
    border-radius: 4px;
    background: #424650;
    top: -18px;
    right: 8px;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    z-index: 1;
}
.mx_MessageActionBar::before {
        content: '';
        position: absolute;
        width: calc(10px + 48px + 100% + 8px);
        height: calc(20px + 100%);
        top: -20px;
        left: -58px;
        z-index: -1;
        cursor: auto;
        cursor: initial;
    }
.mx_MessageActionBar > * {
        white-space: nowrap;
        display: inline-block;
        position: relative;
        border: 1px solid #616b7f;
        margin-left: -1px;
    }
.mx_MessageActionBar > *:hover {
            border-color: #b9bec6;
            z-index: 1;
        }
.mx_MessageActionBar > *:first-child {
            border-radius: 3px 0 0 3px;
        }
.mx_MessageActionBar > *:last-child {
            border-radius: 0 3px 3px 0;
        }
.mx_MessageActionBar > *:only-child {
            border-radius: 3px;
        }
.mx_MessageActionBar_maskButton {
    width: 27px;
}
.mx_MessageActionBar_maskButton::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    background-color: #b9bec6;
}
.mx_MessageActionBar_reactButton::after {
    -webkit-mask-image: url(../../img/element-icons/room/message-bar/emoji.af14771.svg);
            mask-image: url(../../img/element-icons/room/message-bar/emoji.af14771.svg);
}
.mx_MessageActionBar_replyButton::after {
    -webkit-mask-image: url(../../img/element-icons/room/message-bar/reply.5812741.svg);
            mask-image: url(../../img/element-icons/room/message-bar/reply.5812741.svg);
}
.mx_MessageActionBar_editButton::after {
    -webkit-mask-image: url(../../img/element-icons/room/message-bar/edit.688678e.svg);
            mask-image: url(../../img/element-icons/room/message-bar/edit.688678e.svg);
}
.mx_MessageActionBar_optionsButton::after {
    -webkit-mask-image: url(../../img/element-icons/context-menu.829cc1a.svg);
            mask-image: url(../../img/element-icons/context-menu.829cc1a.svg);
}
.mx_MessageTimestamp {
    color: #d0d1d8;
    font-size: 13px;
}
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ReactionsRow {
    margin: 6px 0;
    color: #f0f0f1;
}
.mx_ReactionsRow_showAll {
    text-decoration: none;
    font-size: 10px;
    font-weight: 600;
    margin-left: 6px;
    vertical-align: top;
}
.mx_ReactionsRow_showAll:hover, .mx_ReactionsRow_showAll:link, .mx_ReactionsRow_showAll:visited {
        color: #4958F5;
    }
/*
Copyright 2019 New Vector Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ReactionsRowButton {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 20px;
    line-height: 21px;
    margin-right: 6px;
    padding: 0 6px;
    border-radius: 10px;
    background-color: #424650;
    cursor: default;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    font-size: 12px;
}
.mx_ReactionsRowButton:hover {
        background-color: #fff;
        -webkit-box-shadow: inset #1d1c1d80 0 0 0 1px;
                box-shadow: inset #1d1c1d80 0 0 0 1px;
    }
.mx_ReactionsRowButton.mx_ReactionsRowButton_selected {
        background-color: #1d9bd11a;
        -webkit-box-shadow: inset #1d9bd1 0 0 0 1px;
                box-shadow: inset #1d9bd1 0 0 0 1px;
    }
.mx_ReactionsRowButton_content {
    max-width: 100px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-right: 4px;
    -ms-flex-item-align: center;
        align-self: center;
}
/*
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ReactionsRowButtonTooltip_reactedWith {
    opacity: 0.7;
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SenderProfile_name {
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_TextualEvent {
    font-size: 13px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin: 0 0 8px;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
}
.mx_TextualEvent > div {
    font-weight: 600;
    background: rgba(90, 105, 115, 0.50);
    height: 25px;
    line-height: 25px;
    border-radius: 15px;
    padding: 0 12px;
    color: #ffffff;
}
.mx_TextualEvent > div, .mx_EventListSummary_summary {
    display: block;
    max-width: 70%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/*
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_EventTile_content.mx_ViewSourceEvent {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    opacity: 0.6;
    font-size: 12px;
}
.mx_EventTile_content.mx_ViewSourceEvent pre, .mx_EventTile_content.mx_ViewSourceEvent code {
        -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 {
        width: 12px;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: 0 center;
                mask-position: 0 center;
        -webkit-mask-size: auto 12px;
                mask-size: auto 12px;
        visibility: hidden;
        background-color: #4958F5;
        -webkit-mask-image: url(../../img/element-icons/maximise-expand.2c239ea.svg);
                mask-image: url(../../img/element-icons/maximise-expand.2c239ea.svg);
    }
.mx_EventTile_content.mx_ViewSourceEvent.mx_ViewSourceEvent_expanded .mx_ViewSourceEvent_toggle {
        -webkit-mask-position: 0 bottom;
                mask-position: 0 bottom;
        margin-bottom: 7px;
        -webkit-mask-image: url(../../img/element-icons/minimise-collapse.a59edfc.svg);
                mask-image: url(../../img/element-icons/minimise-collapse.a59edfc.svg);
    }
.mx_EventTile_content.mx_ViewSourceEvent:hover .mx_ViewSourceEvent_toggle {
        visibility: visible;
    }
/*
Copyright 2019, 2020 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_cryptoEvent {

    display: block;
    text-align: center;
    margin: 8px 0;
}
.mx_cryptoEvent.mx_cryptoEvent_icon .mx_cryptoEvent_title::before {
        display: inline-block;
        width: 16px;
        height: 18px;
        vertical-align: middle;
        content: "";
        background-image: url(../../img/e2e/normal.76f0c09.svg);
        background-repeat: no-repeat;
        background-size: 100%;
        margin-right: 4px;
    }
.mx_cryptoEvent.mx_cryptoEvent_icon_verified .mx_cryptoEvent_title::before {
        background-image: url(../../img/e2e/verified.5be6c9f.svg);
    }
.mx_cryptoEvent.mx_cryptoEvent_icon_warning .mx_cryptoEvent_title::before {
        background-image: url(../../img/e2e/warning.78bb264.svg);
    }
.mx_cryptoEvent .mx_cryptoEvent_title, .mx_cryptoEvent .mx_cryptoEvent_subtitle, .mx_cryptoEvent .mx_cryptoEvent_state {
        overflow-wrap: break-word;
    }
.mx_cryptoEvent .mx_cryptoEvent_title {
        font-weight: 600;
        font-size: 15px;
    }
.mx_cryptoEvent .mx_cryptoEvent_state, .mx_cryptoEvent .mx_cryptoEvent_subtitle {
        font-size: 12px;
    }
.mx_cryptoEvent .mx_cryptoEvent_buttons {
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
.mx_cryptoEvent .mx_cryptoEvent_state {
        width: 130px;
        padding: 10px 20px;
        margin: auto 0;
        text-align: center;
        color: #8e99a4;
    }
.bp_newChatButton {
  border-radius: 6px;
  width: 24px;
  height: 24px;
  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;
  cursor: default;
}
.bp_newChatButton.active, .bp_newChatButton:hover {
    background-color: #32343E;
  }
.newChatArrow { 
  -webkit-transform: rotate(180deg); 
          transform: rotate(180deg);
  position: absolute;
  color: #35363D;
  z-index: 1005;
}
.contactLabel {
    background-color: #4F5056;
    border-radius: 4px;
    padding: 0 4px;
    margin-right: 4px;
    color: #F7F7F7
}
.bp_newChatDropdown {
    background-color: #35363D;
    -webkit-box-shadow: 0px 10px 44px rgba(0, 0, 0, 0.16);
            box-shadow: 0px 10px 44px rgba(0, 0, 0, 0.16);
    border: 1px solid #ffffff20;
    padding: 10px 6px;
    width: 280px;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    border-radius: 12px;
    position: absolute;
    z-index: 999;
    -webkit-transform: scale(0);
            transform: scale(0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    justify-items: flex-start;
    text-align: left;
    max-height: 500px;
}
.bp_newChatDropdown.show {
        -webkit-animation: growOut 225ms ease-in-out forwards;
                animation: growOut 225ms ease-in-out forwards;
        -webkit-transform-origin: 30px 0px;
                transform-origin: 30px 0px;
    }
.bp_newChatDropdown.hide {
      -webkit-animation: shrinkIn 100ms ease-in-out forwards;
              animation: shrinkIn 100ms ease-in-out forwards;
      -webkit-transform-origin: 30px 0px;
              transform-origin: 30px 0px;
 
    }
.bp_newChatDropdown .contactItem {
        border-radius: 8px;
        cursor: default;
    }
.bp_newChatDropdown .contactItem.active, .bp_newChatDropdown .contactItem:hover {
    background-color: #25262dcc;
    background-color: var(--room-tile-bg-hover);
  }
.bp_newChatDropdown .contactItem.active.nohover, .bp_newChatDropdown .contactItem:hover.nohover {
      background-color: unset;
    }
.bp_newChatDropdown .contactItem {
        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;
        padding: 4px;
}
.bp_newChatDropdown .contactItem .contactTitle {
            font-size: 14px;
            font-weight: 500;
            margin-bottom: 2px;
        }
.bp_newChatDropdown .contactItem .contactSubtitle {
            font-size: 12px;
        }
.bp_newChatDropdown .contactItem .contactSubtitle .label {
              background-color: #4F5056;
              border-radius: 4px;
              padding: 0 4px;
              margin-right: 4px;
              color: #F7F7F7
            }
.bp_newChatDropdown .contactItem .contactTitle, .bp_newChatDropdown .contactItem .contactSubtitle {
            word-break: break-all;
        }
.bp_newChatDropdown .contactItem .contactLoaderColor {
            background-color: #4F5056;
            opacity: 1;
            -webkit-transition: opacity 1s ease-in-out;
            transition: opacity 1s ease-in-out;
        }
.bp_newChatDropdown .contactItem .contactLoaderColor.fade {
                opacity: .3;
            }
@-webkit-keyframes growOut {
        0% {
            -webkit-transform: scale(0);
                    transform: scale(0);
            opacity: .5;
        }
        80% {
            -webkit-transform: scale(1.085);
                    transform: scale(1.085);
        }
        100% {
            -webkit-transform: scale(1);
                    transform: scale(1);
            opacity: 1;
        }
    }
@keyframes growOut {
        0% {
            -webkit-transform: scale(0);
                    transform: scale(0);
            opacity: .5;
        }
        80% {
            -webkit-transform: scale(1.085);
                    transform: scale(1.085);
        }
        100% {
            -webkit-transform: scale(1);
                    transform: scale(1);
            opacity: 1;
        }
    }
@-webkit-keyframes shrinkIn {
        0% {
            -webkit-transform: scale(1);
                    transform: scale(1);
            opacity: 1;
        }
        100% {
            -webkit-transform: scale(0);
                    transform: scale(0);
            opacity: .5;
        }
    }
@keyframes shrinkIn {
        0% {
            -webkit-transform: scale(1);
                    transform: scale(1);
            opacity: 1;
        }
        100% {
            -webkit-transform: scale(0);
                    transform: scale(0);
            opacity: .5;
        }
    }
#newChatUserSearchInput, #confirmConnectionSearchInput {
  padding: 6px;
  border-radius: 6px;
  background-color: #4F5056;
  color: #F8F8FB;
  border: none;
  margin: 0 4px 4px;
}
#newChatUserSearchInput input, #confirmConnectionSearchInput input {
    all: unset;
    width: 100%;
  }
.loadGoogleContactsButton, .newContactItem {
    border-radius: 8px;
    cursor: default;
}
.loadGoogleContactsButton.active, .loadGoogleContactsButton:hover, .newContactItem.active, .newContactItem:hover {
    background-color: #25262dcc;
    background-color: var(--room-tile-bg-hover);
  }
.loadGoogleContactsButton.active.nohover, .loadGoogleContactsButton:hover.nohover, .newContactItem.active.nohover, .newContactItem:hover.nohover {
      background-color: unset;
    }
.loadGoogleContactsButton, .newContactItem {
    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;
    min-height: 40px;
}
.contactError {
  text-align: center;
  font-size: 12px;
  padding: 6px 12px;
  background-color: #E04950;
  border-radius: 8px;
  margin: 6px 0;
  color: #fff;
  word-break: break-word;
}
.bp_newChat_contactDetail .header {
    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-bottom: 6px;
  }
.bp_newChat_contactDetail .backButton {
    border-radius: 8px;
    cursor: default;
  }
.bp_newChat_contactDetail .backButton.active, .bp_newChat_contactDetail .backButton:hover {
    background-color: #25262dcc;
    background-color: var(--room-tile-bg-hover);
  }
.bp_newChat_contactDetail .backButton.active.nohover, .bp_newChat_contactDetail .backButton:hover.nohover {
      background-color: unset;
    }
.bp_newChat_contactDetail .backButton {
    width: 32px;
    height: 32px;
    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;
    margin: 0 10px 0 6px;
}
.bp_newChat_contactDetail .contactDetailItem {
    border-radius: 8px;
    cursor: default;
  }
.bp_newChat_contactDetail .contactDetailItem.active, .bp_newChat_contactDetail .contactDetailItem:hover {
    background-color: #25262dcc;
    background-color: var(--room-tile-bg-hover);
  }
.bp_newChat_contactDetail .contactDetailItem.active.nohover, .bp_newChat_contactDetail .contactDetailItem:hover.nohover {
      background-color: unset;
    }
.bp_newChat_contactDetail .contactDetailItem {
    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;
    padding: 4px;
}
.bp_newChat_contactDetail .networksLoader {
    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;
  }
.mx_EventListSummary {
    position: relative;
    font-size: 13px;
}
.mx_EventListSummary_avatars {
    display: none;
}
.mx_EventListSummary_toggle {
    color: #4958F5;
    cursor: default;
    position: absolute;
    right: 8px;
    top: 8px;
    z-index: 2;
}
.mx_EventListSummary .mx_EventTile_line {
        margin: 0;
        padding: 0;
    }
.mx_EventListSummary .mx_EventTile_info {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }
.mx_EventListSummary .mx_TextualEvent.mx_EventListSummary_summary {
        font-weight: 600;
        background: #98a2aa;
        height: 25px;
        line-height: 25px;
        border-radius: 15px;
        padding: 0 12px;
        color: #ffffff;
    }
.mx_MatrixChat_useCompactLayout .mx_EventListSummary {
        font-size: 13px;
    }
.mx_MatrixChat_useCompactLayout .mx_EventListSummary .mx_EventTile_line {
            line-height: 20px;
        }
.mx_MatrixChat_useCompactLayout .mx_EventListSummary_line {
        line-height: 22px;
    }
.mx_MatrixChat_useCompactLayout .mx_EventListSummary_toggle {
        margin-top: 6px;
    }
.nv_BridgedIcon {
    width: 16px;
    height: 16px;
    position: relative;
    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-color: revert;
    background-repeat: no-repeat;
    opacity: 1;
    -webkit-mask: revert;
            mask: revert;
    -webkit-transform: scale(1);
            transform: scale(1);
    image-rendering: crisp-edges;
    -webkit-mask-image: none;
            mask-image: none;
}
.nv_BridgedIcon::before {
    content: "";
    -ms-flex-negative: 0;
        flex-shrink: 0;
    display: block;
    height: 100%;
    width: 100%;
    background-repeat: no-repeat;
    background-size: contain;
}
.nv_BridgedIcon_facebook {
    background-image: url(../../img/social/lineart-color/dark/messenger.1544eb2.svg);
}
.nv_BridgedIcon_googlechat, .nv_BridgedIcon_hangouts {
    background-image: url(../../img/social/lineart-color/dark/gchat.bc14811.svg);
}
.nv_BridgedIcon_telegram {
    background-image: url(../../img/social/lineart-color/dark/telegram.77fa320.svg);
}
.nv_BridgedIcon_whatsapp {
    background-image: url(../../img/social/lineart-color/dark/whatsapp.2210499.svg);
}
.nv_BridgedIcon_gmessages {
    background-image: url(../../img/social/lineart-color/dark/gmessages.4a37a9f.svg);
}
.nv_BridgedIcon_instagram {
    background-image: url(../../img/social/lineart-color/dark/instagram.e9184e9.svg);
}
.nv_BridgedIcon_twitter {
    background-image: url(../../img/social/lineart-color/dark/twitter.972096c.svg);
}
.nv_BridgedIcon_slack {
    background-image: url(../../img/social/lineart-color/dark/slack.4310255.svg);
}
.nv_BridgedIcon_beeper {
    background-image: url(../../img/social/lineart-color/dark/beeper.c685f80.svg);
}
.nv_BridgedIcon_matrix {
    background-image: url(../../img/social/lineart-color/dark/matrix.512ad87.svg);
}
.nv_BridgedIcon_discord {
    background-image: url(../../img/social/lineart-color/dark/discord.6daf490.svg);
}
.nv_BridgedIcon_skype {
    background-image: url(../../img/social/lineart-color/skype.ca8a916.svg);
}
.nv_BridgedIcon_androidmessages {
    background-image: url(../../img/social/lineart-color/sms.ca23784.svg);
}
.nv_BridgedIcon_android-sms, .nv_BridgedIcon_androidsms {
    background-image: url(../../img/social/lineart-color/dark/android.ccaf23f.svg);
}
.nv_BridgedIcon_imessage, .nv_BridgedIcon_imessagecloud, .nv_BridgedIcon_imessage-sms, .nv_BridgedIcon_imessage-nosip, .nv_BridgedIcon_imessage-ios {
    background-image: url(../../img/social/lineart-color/dark/imessage.aedae37.svg);
}
.nv_BridgedIcon_signal {
    background-image: url(../../img/social/lineart-color/dark/signal.315d199.svg);
    background-color: revert;
}
.nv_BridgedIcon_linkedin {
    background-image: url(../../img/social/lineart-color/dark/linkedin.2297fef.svg);
    background-color: revert;
}
.mx_EventTile_message .mx_EventTile_line:not(.mx_MImageBody, .mx_MVideoBody), .mx_EventTile_message .mx_MTextBody.mx_EventTile_content, .mx_EventTile_messageOut .mx_EventTile_line .mx_EventTile_content {
    max-width: revert;
}
.mx_EventTile_content-caption {
    max-width: 400px !important;
}
.mx_EventTile_message .mx_EventTile_line .mx_MImageBody .mx_MImageBody_thumbnail, .mx_Blurhash {
    max-height: min(50vh, 480px);
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: center;
       object-position: center;
    margin: 0 auto;
}
.mx_EventTile_line--caption {
    position: static;
}
.mx_EventTile_reactionsContainer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    width: 100%;
    grid-gap: 5px;
    gap: 5px;
}
.bp_SendIndicator-tooltip {
    display: inline-block;
    color: #ffffff;
    line-height: 0;
    width: 16px;
}
.mx_MessageTimestamp-media-container .bp_SendIndicator {
    margin-left: 0;
}
.bp_SendIndicator {
    margin-left: 5px;
}
.mx_EventTile_video .mx_EventTile_reactionsContainer {
    padding-left: 8px;
    width: calc(100% - 20px);
}
.mx_EventTile_message .mx_EventTile_line :not(.mx_MImageBody, .mx_MVideoBody) {
    max-width: revert;
}
.mx_EventTile_line .mx_MessageReply, .mx_EventTile_line .mx_ReplyChain_wrapper, .mx_EventTile_line .mx_ReplyChain_wrapper div {
        max-width: 100%;
    }
.mx_EventTile_line .mx_ReplyTile a {
        max-width: revert;
    }
.mx_EventTile_messageOut .mx_BaseAvatar {
        border-color: hsla(0, 0%, 100%, 0.15);
    }
.mx_EventTile_messageOut .mx_MImageBody + .mx_ReactionsRow .mx_ReactionsRowButton .mx_BaseAvatar {
        border-color: hsla(var(--default-avatar-hue), 5%, 22%);
        border-color: hsla(var(--avatar-hue, var(--default-avatar-hue)), 5%, 22%);
    }
.mx_EventTile_messageOut .mx_ReactionsRow {
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
    }
.mx_EventTile_messageOut .mx_EventTile_reactionsContainer {
        background-color: #3577ff;
    }
.mx_EventTile_image .mx_EventTile_line--reply-chain {
        padding: 4px 8px !important;   
        max-width: 375px !important;
        background-color: hsla(
            var(--default-avatar-hue),
            100%,
            70%,
            0.07) !important;
        background-color: hsla(
            var(--avatar-hue, var(--default-avatar-hue)),
            var(--message-bg-saturation),
            var(--message-bg-lightness),
            var(--message-bg-opacity)
        ) !important;
    }
.mx_EventTile_image .mx_EventTile_line--reply-chain .mx_MImageBody {
            background-color: hsla(
                var(--default-avatar-hue),
                100%,
                70%,
                0.07);
            background-color: hsla(
                var(--avatar-hue, var(--default-avatar-hue)),
                var(--message-bg-saturation),
                var(--message-bg-lightness),
                var(--message-bg-opacity)
            );
        }
.mx_EventTile_image .mx_EventTile_line--reply-chain.mx_EventTile_line--self  {
            background-color: #3577ff !important;
        }
.mx_EventTile_image .mx_EventTile_line--reply-chain.mx_EventTile_line--self .mx_MImageBody {
                background-color: #3577ff !important;
            }
.mx_EventTile_image .mx_MImageBody-container .mx_SenderInfo_wrapper {
        padding: 0 5px;
    }
.mx_EventTile_image .mx_EventTile_reactionsContainer .mx_ReactionsRow {
            margin-left: 5px;
        }
.mx_EventTile_image .mx_EventTile_reactionsContainer .mx_MessageTimestamp {
            margin-right: 10px;
        }
.mx_ReactionsRowButton_selected .mx_BaseAvatar {
    border-color: #6996f2;
}
.mx_EventTile_messageIn .mx_MTextBody + .mx_ReactionsRow .mx_ReactionsRowButton:not(.mx_ReactionsRowButton_selected) .mx_BaseAvatar, .mx_EventTile_messageIn .mx_EventTile_caption .mx_ReactionsRow .mx_ReactionsRowButton:not(.mx_ReactionsRowButton_selected) .mx_BaseAvatar {
        border-color: hsla(var(--default-avatar-hue), 5%, 22%);
        border-color: hsla(var(--avatar-hue, var(--default-avatar-hue)), 5%, 22%);
    }
.mx_EventTile_messageIn .mx_ReactionsRowButton:not(.mx_ReactionsRowButton_selected) .mx_BaseAvatar {
        border-color: hsla(var(--default-avatar-hue), 5%, 30%);
        border-color: hsla(var(--avatar-hue, var(--default-avatar-hue)), 5%, 30%);
    }
.mx_ReactionsRow {
    border-radius: 17px;
    grid-gap: 5px;
    gap: 5px;
}
.mx_ReactionsRow .mx_ReactionsRow_addReaction {
        border-radius: 17px;
        width: 36px;
        height: 25px;
        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_ReactionsRow .mx_ReactionsRow_addReaction .bp_icon {
            height: 16px;
        }
.mx_ReactionsRow .mx_ReactionsRow_addReaction svg {
            margin-top: 0;
        }
.mx_ReactionsRow .mx_ReactionsRowButton {
        padding-right: 2px;
    }
.mx_ReactionsRow .mx_ReactionsRowButton {
        height: 25px;
        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;
        border: none;
        -webkit-box-shadow: none;
                box-shadow: none;
        border-radius: 17px;
        margin-right: 0;
        background-color: transparent;
    }
.mx_ReactionsRow .mx_ReactionsRowButton .mx_ReactionsRowButton_content {
            font-size: 20px;
        }
.mx_ReactionsRow .mx_ReactionsRowButton .mx_ReactionsRowButton_count {
            height: auto;
            padding-right: 12px;
        }
.mx_ReactionsRow .mx_ReactionsRowButton .bp_EventListSummary_avatars {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
        }
.mx_ReactionsRow .mx_ReactionsRowButton .bp_EventListSummary_avatars .mx_BaseAvatar {
                margin-right: -5px;
                border-radius: 9999px;
                border-width: 1px;
                border-style: solid;
            }
.mx_ReactionsRow .mx_ReactionsRowButton .bp_EventListSummary_avatars .mx_BaseAvatar:first-child {
                    z-index: 3;
                }
.mx_ReactionsRow .mx_ReactionsRowButton .bp_EventListSummary_avatars .mx_BaseAvatar:nth-child(2) {
                    z-index: 2;
                }
.mx_ReactionsRow .mx_ReactionsRowButton .bp_EventListSummary_avatars .mx_BaseAvatar:last-child {
                    z-index: 1;
                }
.mx_EventTile_line--reply-chain .mx_SenderInfo_wrapper {
        -webkit-box-ordinal-group: 0;
            -ms-flex-order: -1;
                order: -1;
    }
.mx_EventTile_line--reply-chain .mx_MTextBody {
        width: 100%;
    }
.mx_EventTile_message .mx_SenderProfile, .mx_EventTile_sticker .mx_SenderProfile {
    color: revert;
}
.mx_SenderProfile_displayName {
    font-weight: bold;
    color: hsla(
        var(--default-avatar-hue),
        100%,
        95%,
        0.5
    );
    color: hsla(
        var(--avatar-hue, var(--default-avatar-hue)),
        var(--sender-name-saturation),
        var(--sender-name-lightness),
        0.5
    );
}
.mx_EventTile_file.mx_EventTile_message .mx_MessageTimestamp {
    bottom: 0;
}
.mx_EventTile_message .mx_MessageTimestamp:not(.mx_MessageReadReceipt), .mx_EventTile_sticker .mx_MessageTimestamp {
    position: relative;
    font-size: 10px;
    margin-left: 5px;
}
.mx_ReplyTile .mx_MTextBody {
    padding-right: 0;
}
.mx_EventTile_messageOut .mx_MessageTimestamp {
        color: hsla(0, 0%, 100%, 0.5);
    }
.mx_EventTile_messageOut .mx_ReactionsRowButton, .mx_EventTile_messageOut .mx_ReactionsRow_addReaction {
        background-color: hsla(0, 0%, 100%, 0.15);
        color: white;
    }
.mx_MessageTimestamp-media-container {
    background: rgba(140, 140, 140, 0.4);
    -webkit-backdrop-filter: blur(5px);
            backdrop-filter: blur(5px);
    padding: 0 5px;
    border-radius: 12px;
}
.mx_MessageTimestamp-media-container .mx_MessageTimestamp {
        color: #ffffff;
        opacity: 0.6;
        margin-left: 0 !important;
    }
.mx_EventTile_messageIn.mx_EventTile_video .mx_SenderInfo_wrapper + .mx_MVideoBody .mx_MVideoBody {
            border-radius: 0;
        }
.mx_EventTile_messageIn.mx_EventTile_video .mx_EventTile_reactionsContainer {
            width: 100%;
        }
.mx_EventTile_messageIn.mx_EventTile_video .mx_EventTile_reactionsContainer .mx_MessageTimestamp {
                margin-right: 15px;
            }
.mx_EventTile_messageIn.mx_EventTile_video .mx_EventTile_caption .mx_SenderInfo_wrapper {
            padding: 0;
        }
.mx_EventTile_messageIn.mx_EventTile_video .mx_SenderInfo_wrapper {
            width: 100%;
            padding: 0 5px;
        }
.mx_EventTile_messageIn .mx_ReactionsRowButton, .mx_EventTile_messageIn .mx_ReactionsRow_addReaction, .mx_EventTile_messageIn .mx_MImageBody-container + .mx_EventTile_reactionsContainer, .mx_EventTile_messageIn.mx_EventTile_video .mx_EventTile_reactionsContainer, .mx_EventTile_messageIn .mx_MImageBody-container .mx_SenderInfo_wrapper, .mx_EventTile_messageIn.mx_EventTile_video .mx_EventTile_line:not(.mx_EventTile_line--caption) .mx_SenderInfo_wrapper {
        background-color: hsla(
            var(--default-avatar-hue),
            29%,
            72%,
            0.15);
        background-color: hsla(
            var(--avatar-hue, var(--default-avatar-hue)),
            var(--reaction-saturation),
            var(--reaction-lightness),
            var(--reaction-opacity)
        );
        color: hsla(
            var(--default-avatar-hue),
            29%,
            80%,
            1
        );
        color: hsla(
            var(--avatar-hue, var(--default-avatar-hue)),
            var(--add-reaction-saturation),
            var(--add-reaction-lightness),
            1
        );
    }
.mx_EventTile_messageIn .mx_ReactionsRowButton.mx_ReactionsRowButton_selected, .mx_EventTile_messageIn .mx_ReactionsRow_addReaction.mx_ReactionsRowButton_selected, .mx_EventTile_messageIn .mx_MImageBody-container + .mx_EventTile_reactionsContainer.mx_ReactionsRowButton_selected, .mx_EventTile_messageIn.mx_EventTile_video .mx_EventTile_reactionsContainer.mx_ReactionsRowButton_selected, .mx_EventTile_messageIn .mx_MImageBody-container .mx_SenderInfo_wrapper.mx_ReactionsRowButton_selected, .mx_EventTile_messageIn.mx_EventTile_video .mx_EventTile_line:not(.mx_EventTile_line--caption) .mx_SenderInfo_wrapper.mx_ReactionsRowButton_selected {
            background-color: #4d82ee;
            color: white;
        }
.mx_EventTile_messageIn.mx_EventTile_sticker .mx_MessageTimestamp {
            position: absolute;
            right: 5px;
            bottom: 5px;
            -webkit-backdrop-filter: blur(5px);
                    backdrop-filter: blur(5px);
            padding: 0 5px;
            border-radius: 12px;
            background: rgba(140, 140, 140, 0.4);
            color: #ffffff;
            opacity: 0.6;
        }
.mx_EventTile_messageIn .mx_MessageTimestamp-media-container .mx_MessageTimestamp {
        color: #ffffff;
    }
.mx_EventTile_messageIn .mx_MessageTimestamp {
        color: hsla(
            var(--default-avatar-hue),
            29%,
            80%,
            0.5
        );
        color: hsla(
            var(--avatar-hue, var(--default-avatar-hue)),
            var(--timestamp-saturation),
            var(--timestamp-lightness),
            0.5
        );
    }
.mx_EventTile_messageIn.mx_EventTile_linkPreview .mx_MessageBody .mx_EventTile_avatar {
        grid-row: 2 / 4;
    }
.mx_EventTile_messageIn .mx_SenderInfo_wrapper {
        margin-top: 0;
    }
.mx_EventTile {
    max-width: 100%;
    position: relative;
}
.mx_EventTile .mx_MFileBody::before {
        background-color: #4958F5;
    }
.mx_EventTile_reply {
    cursor: default;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
}
.mx_MessageBody {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.mx_EventTile_sidepad {
    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%;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
}
.mx_EventTile_message .mx_EventTile_line .mx_MImageBody {
            background: #35363d;
        }
.mx_EventTile_message .mx_EventTile_line .mx_MImageBody * {
                max-width: unset;
            }
.mx_EventTile_message .mx_EventTile_line .mx_MImageBody.sticker {
              background: transparent;
            }
.mx_EventTile_message .mx_EventTile_line [data-mx-emoticon] {
            height: 16px;
            position: relative;
            top: 2px;
        }
.mx_EventTile_message .mx_EventTile_line .mx_ReplyTile .mx_MImageBody {
                background: transparent;
            }
.mx_EventTile_message .mx_EventTile_line .mx_ReplyTile .mx_MImageBody * {
                    max-width: unset;
                }
.mx_EventTile_message .mx_EventTile_controls {
        visibility: hidden;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
    }
.mx_EventTile_message .mx_EventTile_controls a {
            background: #d0d1d8;
            background: var(--message-actions-fg);
            display: inline-block;
            width: 16px;
            height: 16px;
            margin-right: 8px;
        }
.mx_EventTile_message .mx_EventTile_controls a:last-child {
                margin-right: 0;
            }
.mx_EventTile_message .mx_EventTile_controls a:hover {
                background: #4958f5;
            }
.mx_EventTile_message .mx_EventTile_controls a.mx_EventTile_replyButton {
            -webkit-mask: url(../../themes/beeper/img/icon-reply.73e1198.svg);
                    mask: url(../../themes/beeper/img/icon-reply.73e1198.svg);
        }
.mx_EventTile_message .mx_EventTile_controls a.mx_EventTile_emojiButton {
            -webkit-mask: url(../../themes/beeper/img/icon-emoji.5d53a3a.svg);
                    mask: url(../../themes/beeper/img/icon-emoji.5d53a3a.svg);
        }
.mx_EventTile_message .mx_EventTile_controls a.mx_EventTile_moreButton {
            -webkit-mask: url(../../themes/beeper/img/icon-more.a2cb038.svg);
                    mask: url(../../themes/beeper/img/icon-more.a2cb038.svg);
        }
.mx_EventTile_message:hover .mx_EventTile_controls, .mx_EventTile_message.mx_EventTile_active .mx_EventTile_controls {
            visibility: visible;
        }
.mx_EventTile_message .mx_MessageReply {
        width: 100%;
    }
.mx_EventTile_message .mx_MessageReply .mx_ReplyChain_wrapper {
            width: 100%;
        }
.mx_EventTile_messageIn .mx_MessageBody {
        width: 100%;
        display: grid;
        grid-template-columns: 32px fit-content(calc(var(--room-view-width) - 37px - 6px - 50px)) minmax(15%, auto);
    }
.mx_EventTile_messageIn .mx_MessageBody .mx_SenderInfo_wrapper {
            grid-column: 2 / 4;
        }
.mx_EventTile_messageIn .mx_MessageBody .mx_EventTile_avatar {
            margin-right: 4px;
            grid-row: 1 / 4;
            height: 28px;
            align-self: flex-end;
        }
.mx_EventTile_messageIn .mx_MessageBody .mx_EventTile_line {
            grid-column: 2 / 3;
            -webkit-box-align: start;
                -ms-flex-align: start;
                    align-items: flex-start;
        }
.mx_EventTile_messageIn .mx_MessageBody .mx_EventTile_footer {
            grid-column: 2 / 3;
        }
.mx_EventTile_messageIn .mx_MessageBody .mx_ReactionsRow, .mx_EventTile_messageIn .mx_MessageBody .bp_LinkPreview {
            grid-column: 2 / 4;
            -webkit-box-pack: start;
                -ms-flex-pack: start;
                    justify-content: flex-start;
        }
.mx_EventTile_messageIn.mx_EventTile_dm .mx_MessageBody {
            grid-template-columns: 0px fit-content(calc(var(--room-view-width) - 37px - 6px - 50px)) minmax(15%, auto);
        }
.mx_EventTile_messageIn .mx_EventTile_sidepad {
        margin-left: 6px;
        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%;
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: flex-end;
    }
.mx_EventTile_messageIn .mx_SenderInfo_wrapper .mx_SenderInfo_name {
            font-weight: 600;
        }
.mx_EventTile_messageIn .mx_EventTile_edited {
        margin-right: 4px;
    }
.mx_EventTile_messageIn .mx_MessageReply {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        grid-column: 2 / 3;
    }
.mx_EventTile_messageIn .mx_EventTile_readAvatars {
        margin-left: 4px;
    }
.mx_EventTile_messageIn .mx_ReplyChain {
        background: rgba(37, 38, 45, 0.4);
    }
.mx_EventTile_messageOut .mx_MessageBody {
        display: grid;
        grid-template-columns: fit-content(24px) fit-content(calc(var(--room-view-width) - 37px - 6px - 50px)) minmax(15%, auto);
        direction: rtl;
    }
.mx_EventTile_messageOut .mx_MessageBody > * {
            direction: ltr;
        }
.mx_EventTile_messageOut .mx_EventTile_avatar {
        display: none;
    }
.mx_EventTile_messageOut .mx_EventTile_edited {
        margin-left: 4px;
    }
.mx_EventTile_messageOut .mx_EventTile_sidepad {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        margin-right: 4px;
    }
.mx_EventTile_messageOut .mx_EventTile_controls {
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: flex-end;
    }
.mx_EventTile_messageOut .mx_ReactionsRow, .mx_EventTile_messageOut .bp_LinkPreview {
        grid-column: 1 / 4;
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: flex-end;
    }
.mx_EventTile_messageOut .mx_EventTile_status {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
            -ms-flex-direction: row-reverse;
                flex-direction: row-reverse;
    }
.mx_EventTile_messageOut .mx_EventTile_status .mx_EventTile_readAvatars {
            margin-right: 4px;
        }
.mx_EventTile_messageOut .mx_MessageReply {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
            -ms-flex-direction: row-reverse;
                flex-direction: row-reverse;
    }
.mx_EventTile_messageOut .mx_LinkPreviewWidget {
        color: #D0D1D8;
    }
.mx_EventTile_body {
    font-size: 14px;
}
.mx_EventTile_body.mx_EventTile_bigEmoji {
        font-size: 48px !important;
        line-height: 57px !important;
    }
.mx_EventTile_body.mx_EventTile_bigEmoji [data-mx-emoticon] {
            height: 48px;
        }
.mx_EventTile_body.mx_EventTile_bigEmoji + .mx_EventTile_reactionsContainer {
            border-top-left-radius: inherit;
            border-top-right-radius: inherit;
            border-bottom-left-radius: inherit;
            border-bottom-right-radius: inherit;
            padding: 0 5px;
        }
.mx_EventTile_bigEmoji + .mx_EventTile_reactionsContainer {
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
    border-bottom-left-radius: inherit;
    border-bottom-right-radius: inherit;
    padding: 0 5px;
}
.mx_EventTile_emoji .mx_EventTile_line, .mx_EventTile_sticker .mx_EventTile_line {
        background: transparent !important;
    }
.mx_EventTile_message, .mx_EventTile_sticker {
    margin-bottom: 2px;
}
.mx_EventTile_message .mx_EventTile_line, .mx_EventTile_sticker .mx_EventTile_line {
        font-size: 14px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        position: relative;
        padding: 4px 8px;
    }
.mx_EventTile_message.mx_EventTile_messageOut .mx_MessageBody .mx_EventTile_line, .mx_EventTile_sticker.mx_EventTile_messageOut .mx_MessageBody .mx_EventTile_line {
        border-radius: 12px 4px 4px 12px;
    }
.mx_EventTile_message.mx_EventTile_messageIn .mx_MessageBody .mx_EventTile_line, .mx_EventTile_sticker.mx_EventTile_messageIn .mx_MessageBody .mx_EventTile_line {
        border-radius: 4px 12px 12px 4px;
    }
.mx_EventTile_message.mx_EventTile_last .mx_EventTile_line, .mx_EventTile_message.mx_EventTile_lastInGroup .mx_EventTile_line, .mx_EventTile_message.mx_EventTile_lastInSection .mx_EventTile_line, .mx_EventTile_sticker.mx_EventTile_last .mx_EventTile_line, .mx_EventTile_sticker.mx_EventTile_lastInGroup .mx_EventTile_line, .mx_EventTile_sticker.mx_EventTile_lastInSection .mx_EventTile_line {
            border-bottom-left-radius: 12px !important;
            border-bottom-right-radius: 12px !important;
        }
.mx_EventTile_message.mx_EventTile_firstInGroup .mx_EventTile_line, .mx_EventTile_sticker.mx_EventTile_firstInGroup .mx_EventTile_line {
        border-top-left-radius: 12px !important;
        border-top-right-radius: 12px !important;
    }
.mx_EventTile_message .mx_Spinner_icon, .mx_EventTile_sticker .mx_Spinner_icon {
        margin-top: 4px;
        margin-bottom: 4px;
    }
.mx_EventTile_message .mx_EventTile_content, .mx_EventTile_sticker .mx_EventTile_content {
        max-width: 100%;
        width: 100%;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
    }
.mx_EventTile_message .mx_EventTile_content .hljs, .mx_EventTile_sticker .mx_EventTile_content .hljs {
            display: inline !important;
        }
.mx_EventTile_message .mx_EventTile_content .mx_MImageBody-container, .mx_EventTile_message .mx_EventTile_content .mx_MImageBody_thumbnail, .mx_EventTile_sticker .mx_EventTile_content .mx_MImageBody-container, .mx_EventTile_sticker .mx_EventTile_content .mx_MImageBody_thumbnail {
            background: none;
        }
.mx_EventTile_message .mx_EventTile_content-caption .mx_MImageBody-container, .mx_EventTile_sticker .mx_EventTile_content-caption .mx_MImageBody-container {
                max-width: revert;
            }
.mx_EventTile_message .mx_EventTile_content-caption .mx_MImageBody, .mx_EventTile_sticker .mx_EventTile_content-caption .mx_MImageBody {
                margin-inline: auto;
                margin-bottom: 6px;
            }
.mx_EventTile_message .mx_EventTile_content-caption .mx_MImageBody .mx_MImageBody_thumbnail, .mx_EventTile_sticker .mx_EventTile_content-caption .mx_MImageBody .mx_MImageBody_thumbnail {
                    border-radius: 0;
                }
.mx_EventTile_message.mx_EventTile_messageOut .mx_EventTile_line, .mx_EventTile_sticker.mx_EventTile_messageOut .mx_EventTile_line {
        margin-left: 0;
    }
.mx_EventTile_message .mx_SenderInfo_wrapper, .mx_EventTile_sticker .mx_SenderInfo_wrapper {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        font-size: 12px;
    }
.mx_EventTile_message .mx_SenderInfo_wrapper .mx_MessageTimestamp, .mx_EventTile_sticker .mx_SenderInfo_wrapper .mx_MessageTimestamp {
            margin-left: 4px;
        }
.mx_EventTile_message .mx_SenderProfile, .mx_EventTile_sticker .mx_SenderProfile {
        display: inline;
        font-weight: 600;
        cursor: default;
    }
.mx_EventTile_message .mx_EventTile_avatar, .mx_EventTile_sticker .mx_EventTile_avatar {
        cursor: default;
        -webkit-user-select: none;
           -moz-user-select: none;
            -ms-user-select: none;
                user-select: none;
        -ms-flex-item-align: start;
            align-self: flex-start;
    }
.mx_EventTile_message .mx_ReplyChain, .mx_EventTile_sticker .mx_ReplyChain {
        margin-bottom: 4px;
    }
.mx_EventTile_message .mx_ReplyChain .mx_DateSeparator, .mx_EventTile_sticker .mx_ReplyChain .mx_DateSeparator {
            display: none;
        }
.mx_EventTile_message .mx_ReplyChain .mx_EventTile_message, .mx_EventTile_sticker .mx_ReplyChain .mx_EventTile_message {
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
        }
.mx_EventTile_message .mx_ReplyChain_header, .mx_EventTile_sticker .mx_ReplyChain_header {
        font-size: 12px;
    }
.mx_EventTile_message .mx_ReplyChain_header a, .mx_EventTile_sticker .mx_ReplyChain_header a {
            text-decoration: underline;
        }
.mx_EventTile_continuation .mx_SenderProfile_wrapper {
        margin-bottom: 0;
    }
.mx_ReplyChain {
    background: rgba(37, 38, 45, 0.4);
    padding: 4px 8px;
    border-radius: 8px;
}
.mx_ReplyChain .nv_DateSeparator {
        display: none;
    }
.bp_ReplyThread_replyTo {
    font-size: 12px;
    line-height: 14px;
    font-weight: 400;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.bp_ReplyThread_replyToIcon {
    -webkit-mask: url(../../themes/beeper/img/icon-replied-to.86a87e7.svg);
            mask: url(../../themes/beeper/img/icon-replied-to.86a87e7.svg);
    background: currentColor;
    display: inline-block;
    width: 14px;
    height: 14px;
}
.mx_EventTile_lastInSection:not(.mx_EventTile_emoji, .mx_EventTile_image, .mx_EventTile_file, .mx_EventTile_sticker, .mx_EventTile_video)
    .mx_EventTile_line:before {
    position: absolute;
    bottom: -0px;
    width: 11px;
    height: 14px;
    display: inline-block;
    content: "";
    -webkit-mask: url(../../img/message-tail.bd053e0.svg) no-repeat 50% 50%;
            mask: url(../../img/message-tail.bd053e0.svg) no-repeat 50% 50%;
    -webkit-mask-size: cover;
            mask-size: cover;
}
.mx_EventTile_messageOut .mx_MessageBody {
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
            -ms-flex-direction: row-reverse;
                flex-direction: row-reverse;
    }
.mx_EventTile_messageOut.mx_EventTile_lastInSection .mx_EventTile_line:before {
        background-color: #3577ff;
        right: -5px;
        -webkit-mask-size: cover;
                mask-size: cover;
    }
.mx_EventTile_messageIn.mx_EventTile_lastInSection .mx_EventTile_line:before {
        background-color: hsla(
            var(--default-avatar-hue),
            100%,
            70%,
            0.07);
        background-color: hsla(
            var(--avatar-hue, var(--default-avatar-hue)),
            var(--message-bg-saturation),
            var(--message-bg-lightness),
            var(--message-bg-opacity)
        );
        left: -5px;
        -webkit-transform: rotateY(180deg);
                transform: rotateY(180deg);
    }
.mx_EventTile_messageIn .mx_EventTile_line {
        background: #35363d;
        color: #f0f0f1;
    }
.mx_EventTile_messageIn .mx_EventTile_line {
        background: hsla(
            var(--default-avatar-hue),
            100%,
            70%,
            0.07);
        background: hsla(
            var(--avatar-hue, var(--default-avatar-hue)),
            var(--message-bg-saturation),
            var(--message-bg-lightness),
            var(--message-bg-opacity)
        );
        color: hsla(
            var(--default-avatar-hue),
            100%,
            90%,
            1);
        color: hsla(
            var(--avatar-hue, var(--default-avatar-hue)),
            var(--message-color-saturation),
            var(--message-color-lightness),
            var(--message-color-opacity)
        );
    }
.mx_EventTile_messageIn .mx_EventTile_content.mx_EventTile_bigEmoji {
            background: transparent;
        }
.mx_EventTile_messageOut:not(.mx_EventTile_emoji, .mx_EventTile_image, .mx_EventTile_sticker)
    .mx_EventTile_line {
    background: #3577ff !important;
}
.mx_EventTile_messageOut.mx_EventTile_emoji .mx_ReplyChain_wrapper, .mx_EventTile_messageOut.mx_EventTile_image .mx_ReplyChain_wrapper, .mx_EventTile_messageOut.mx_EventTile_sticker .mx_ReplyChain_wrapper {
            background: #3577ff !important;
        }
.mx_EventTile_messageOut .mx_EventTile_line {
        background-position: bottom right;
        background-size: 440px;

        padding: 4px 8px;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
    }
.mx_EventTile_messageOut .mx_EventTile_line .mx_EventTile_content {
            color: #ffffff !important;
        }
.mx_EventTile_messageOut .mx_EventTile_line .mx_EventTile_content.mx_EventTile_bigEmoji {
                background: transparent;
                -webkit-margin-start: auto;
                        margin-inline-start: auto;
            }
.mx_EventTile_messageOut .mx_EventTile_line .mx_EventTile_content .mx_EventTile_body.markdown-body {
                color: #ffffff;
            }
.mx_EventTile_messageOut .mx_EventTile_line .mx_EventTile_content a:not(.mx_Pill) {
                color: #ffffff;
            }
.mx_EventTile_messageOut .mx_EventTile_line .mx_Pill {
            background: rgba(37, 38, 45, 0.4);
            color: #efeff0;
        }
.mx_EventTile_messageOut .mx_EventTile_line .mx_AtRoomPill, .mx_EventTile_messageOut .mx_EventTile_line .mx_UserPill_me {
            color: #F09C74;
        }
.mx_EventTile_messageOut .mx_EventTile_line .mx_ReplyChain {
            background: rgba(55, 58, 67, 0.24);
            color: #ffffff;
        }
.mx_EventTile_messageOut .mx_Spinner_icon {
        background-color: #ffffff;
    }
.mx_EventTile_messageOut .bp_ReplyThread_toggle {
        margin-left: 4px;
        color: #ffffff;
    }
.mx_EventTile_reply .mx_EventTile_content {
        background: none;
        color: #f0f0f1;
        padding: 0;
    }
.mx_EventTile_reply .mx_EventTile_content .mx_EventTile_body.markdown-body {
            color: #f0f0f1;
        }
.mx_EventTile_reply .mx_EventTile_body {
        line-clamp: 2;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
.mx_EventTile_droplet {
    margin-bottom: 8px;
}
.mx_EventTile_readAvatars {
    position: relative;
    display: inline-block;
    width: 14px;
    height: 14px;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    z-index: 1;
}
.mx_EventTile_readAvatars:empty {
    width: 0;
    display: none;
    margin: 0;
}
.mx_EventTile_status {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    line-height: 14px;
}
.mx_EventTile_readAvatars .mx_BaseAvatar {
    position: absolute;
    display: inline-block;
    height: 1.4rem;
    width: 1.4rem;
}
.mx_EventTile_readAvatarRemainder {
    color: #d0d1d8;
    font-size: 1.1rem;
    position: absolute;
}
.mx_EventTile_sending .mx_EventTile_statusGroup::after, .mx_EventTile_notSent .mx_EventTile_statusGroup::after {
        margin-left: 5px;
        color: #4958F5;
        content: url(../../themes/nova-light/img/dialogs_sending.fa027fc.svg);
    }
.mx_EventTile_message:hover .mx_MessageActionBar {
        visibility: visible;
        right: -85px;
    }
.mx_EventTile_edited {
    font-size: 12px;
    line-height: 14px;
}
.mx_EventTile_message.mx_EventTile_messageOut .mx_EventTile_edited {
}
.mx_EventTile_message.mx_EventTile_messageIn .mx_EventTile_edited {
    color: #98a2aa;
}
.mx_EventTile .mx_EditMessageComposer .mx_BasicMessageComposer_input:focus {
    color: #f0f0f1;
    border-color: #4958F5;
}
.mx_EventTile .mx_EditMessageComposer .mx_EditMessageComposer_buttons {
    position: static;
    background: none;
    margin: 0;
    padding: 3px 4px 4px 4px;
}
.mx_EventTile .mx_EditMessageComposer .mx_EditMessageComposer_buttons .mx_AccessibleButton {
        border-radius: 3px;
    }
.mx_EventTile:not(.mx_EventTile_droplet) .mx_EditMessageComposer_buttons .mx_AccessibleButton {
    border-bottom-right-radius: 9px;
}
.mx_EventTile .mx_EditMessageComposer .mx_BasicMessageComposer_input {
    border-radius: 8px 8px 3px 3px;
    margin: 6px 4px 0 4px;
    padding: 6px 6px;
}
.mx_EventTile_image .mx_SenderProfile_name, .mx_EventTile_video .mx_SenderProfile_name {
        margin: 9px 0 6px 14px;
        display: block;
    }
.mx_EventTile_image .mx_EventTile_line, .mx_EventTile_video .mx_EventTile_line {
        padding: 0;
        overflow: hidden;
    }
.mx_EventTile_image .mx_EventTile_line::before, .mx_EventTile_image .mx_EventTile_line::after, .mx_EventTile_video .mx_EventTile_line::before, .mx_EventTile_video .mx_EventTile_line::after {
            display: none;
        }
.mx_EventTile_line > .mx_MVideoBody, .mx_MImageBody_thumbnail_container {
    line-height: 0;
}
.mx_EventTile_image .mx_EventTile_line, .mx_EventTile_video .mx_EventTile_line {
    background: none;
}
.mx_EventTile_image .mx_MImageBody_thumbnail_container .mx_MImageBody_thumbnail, .mx_EventTile_sticker .mx_MImageBody_thumbnail_container .mx_MImageBody_thumbnail {
            position: static;
            -o-object-fit: contain;
               object-fit: contain;
        }
.mx_EventTile_sticker .mx_MImageBody_thumbnail_container > div:first-child {
            display: none;
        }
.mx_EventTile_image.mx_EventTile_continuation .mx_EventTile_line, .mx_EventTile_video.mx_EventTile_continuation .mx_EventTile_line, .mx_EventTile_image.mx_EventTile_messageOut .mx_EventTile_line {
        background: none;
        -webkit-box-shadow: none;
                box-shadow: none;
    }
.mx_EventTile_e2eIcon {
    position: absolute;
    top: 7px;
    right: 11px;
    width: 15px;
    height: 15px;
    display: block;
    opacity: 0.2;
    background-repeat: no-repeat;
    background-size: contain;
}
.mx_EventTile_e2eIcon_undecryptable, .mx_EventTile_e2eIcon_unverified {
    background-image: url(../../img/e2e/warning.78bb264.svg);
    opacity: 1;
}
.mx_EventTile_e2eIcon_unknown {
    background-image: url(../../img/e2e/warning.78bb264.svg);
    opacity: 1;
}
.mx_EventTile_e2eIcon_unencrypted {
    background-image: url(../../img/e2e/warning.78bb264.svg);
    opacity: 1;
}
.mx_EventTile_e2eIcon_hidden {
    display: none;
}
.mx_EventTile_keyRequestInfo {
    margin-top: 3px;
    font-size: 13px;
    color: #acacac;
}
.mx_EventTile_keyRequestInfo .mx_TooltipButton {
        font-size: 10px;
        border: 1px solid #acacac;
        color: #acacac;
    }
.mx_MNoticeBody.mx_EventTile_content {
    font-size: 13px;
    color: #acacac;
    opacity: 1;
    min-height: 30px;
}
.mx_EventTile .mx_ReactionsRow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
}
.mx_EventTile .mx_ReactionsRow:empty {
        display: none;
    }
.mx_MTextBody {
    white-space: pre-wrap;
}
.mx_EventTile_body.markdown-body {
    font-family: inherit;
    color: inherit;
    line-height: 2.2rem;
    white-space: normal !important;
}
.mx_EventTile_body.markdown-body .mx_EventTile_pre_container, .mx_EventTile_body.markdown-body code {
        font-size: 13px !important;
    }
.mx_EventTile_body.markdown-body blockquote {
        color: #f0f0f1;
        padding-left: 7px;
        margin: 6px 0;
        border-left: 2px solid #4958F5;
        vertical-align: middle;
    }
.mx_EventTile_body.markdown-body code {
        border-radius: 3px;
        padding: 1px 5px;
        line-height: 1.45;
    }
.mx_EventTile_body.markdown-body code::before, .mx_EventTile_body.markdown-body code::after {
            content: "";
        }
.mx_EventTile_body.markdown-body pre {
        padding: 5px 10px;
    }
.mx_EventTile_body.markdown-body pre code {
            padding: 0;
            white-space: pre-wrap;
            word-break: break-all;
        }
.mx_EventTile_body.markdown-body pre .mx_EventTile_lineNumbers {
            float: left;
            margin: 0 0.5em 0 -1em;
            color: gray;
        }
.mx_EventTile_body.markdown-body pre .mx_EventTile_lineNumber {
            text-align: right;
            display: block;
            padding-left: 1em;
        }
.mx_EventTile_body.markdown-body > code, .mx_EventTile_body.markdown-body pre {
        background-color: rgba(255, 255, 255, 0.65);
    }
.mx_EventTile_body.markdown-body ul, .mx_EventTile_body.markdown-body ol, .mx_EventTile_body.markdown-body dl, .mx_EventTile_body.markdown-body blockquote, .mx_EventTile_body.markdown-body pre, .mx_EventTile_body.markdown-body table {
        margin-bottom: 3px;
        margin-top: 3px;
    }
.mx_EventTile_body.markdown-body ol, .mx_EventTile_body.markdown-body ul {
        padding: 0 0 0 1.2em;
    }
.mx_EventTile_body.markdown-body > blockquote:first-child {
        margin-top: 3px !important;
    }
.mx_EventTile_body.markdown-body > blockquote:last-child {
        margin-bottom: 3px !important;
    }
.mx_EventTile_body.markdown-body > .mx_EventTile_pre_container:first-child pre {
        border-top-left-radius: 8px;
        border-top-right-radius: 8px;
    }
.mx_EventTile_body.markdown-body > .mx_EventTile_pre_container:last-child pre {
        border-bottom-left-radius: 8px;
        border-bottom-right-radius: 8px;
    }
.mx_EventTile_body.markdown-body p {
        line-height: 2.2rem;
    }
.mx_EventTile_body {

    /* These are technically the same, but use both */
    overflow-wrap: break-word;
    word-wrap: break-word;

    -ms-word-break: break-all;
    /* This is the dangerous one in WebKit, as it breaks things wherever */
    word-break: break-all;
    /* Instead use this non-standard one: */
    word-break: break-word;

    /* Adds a hyphen where the word breaks, if supported (No Blink) */
    -ms-hyphens: auto;
    hyphens: unset;
}
.mx_EventTile_messageOut .mx_EventTile_body.markdown-body blockquote {
        color: #25262d;
    }
.mx_EventTile_messageOut .mx_EventTile_body.markdown-body a {
        text-decoration: underline;
    }
.mx_EventTile_reply .mx_MImageBody {
    max-width: 320px;
}
.mx_EventTile_inThread.mx_EventTile_selected {
    margin-bottom: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid #25262d;
}
.bp_ReplyThread_toggle {
    opacity: 0.75;
    border: 1px solid currentColor;
    border-radius: 50px;
    text-decoration: none !important;
    padding: 0 4px;
    cursor: default;
}
.bp_bookmarksIcon {
    width: 12px;
    height: 12px;
    background-image: url(../../img/icons-bookmarks.faf8f6b.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 10px;
    display: block;
}
.bp_notDeliveredText {
    color: #E0474F;
}
/* Spoiler stuff */
.mx_EventTile_spoiler {
    cursor: default;
}
.mx_EventTile_spoiler_reason {
    color: #d0d1d8;
    font-size: 1.1rem;
}
.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;
}
.mx_MessageReadReceipt {
    position: relative;
    font-size: 12px;
    height: 100%;
    margin-top: 4px;
    margin-bottom: 4px;
    color: hsla(240, 100%, 93%, 0.5);
    color: var(--read-receipt-fg);
}
.mx_MessageReadReceipt.mx_MessageReadReceipt--own {
        -ms-flex-item-align: end;
            align-self: flex-end;
        text-align: right;
    }
.mx_MessageReadReceipt.mx_MessageReadReceipt--third-party {
        -ms-flex-item-align: start;
            align-self: flex-start;
        margin-left: 28px;
    }
.mx_ReadReceiptTooltip {
    overflow: auto;
    max-height: 400px;
}
.mx_ReadReceiptTooltip.bp_PopperTooltip {
        background: #34393a;
        border: 0.348108px solid rgba(0, 0, 0, 0.2);
    }
.mx_ReadReceiptTooltip .bp_PopperTooltipArrow {
        display: none;
    }
.mx_EventTile_messageOut .mx_EventTile_bigEmoji .mx_MTextBody__details-wrapper, .mx_EventTile_messageOut .mx_EventTile_bigEmoji .mx_MTextBody__details-wrapper .mx_MessageTimestamp {
    color: hsla(240, 100%, 93%, 0.5);
    color: var(--read-receipt-fg);
}
.mx_EventTile_bigEmoji .mx_MTextBody__details-wrapper {
    float: unset;
}
.mx_EventTile_line--reply-chain .mx_EventTile_bigEmoji .mx_MTextBody__details-wrapper {
    position: absolute;
    right: 7px;
    bottom: 0;
}
.mx_MTextBody__details-wrapper {
    float: right;
}
.mx_MTextBody__detail {
    display: inline-block;
}
.mx_MTextBody__spinner {
    margin-left: 6px;
}
.mx_MemberRow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    grid-gap: 7px;
    gap: 7px;
}
.mx_MemberRow-name {
        font-weight: 500;
        font-size: 12px;
        line-height: 14px;
        letter-spacing: -0.174054px;
        color: hsla(var(--default-avatar-hue), 100%, 88%, 1);
        color: hsla(var(--avatar-hue, var(--default-avatar-hue)), 100%, var(--read-receipt-tooltip-fg), 1);
        opacity: 0.9;
    }
.mx_EventTile_gallery .mx_EventTile_line {
        padding: 0 !important;
        background: transparent !important;
        overflow: hidden;
    }
.mx_EventTile_gallery .mx_MessageTimestamp-media-container {
        position: absolute;
        right: 5px;
        bottom: 5px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        grid-gap: 5px;
        gap: 5px;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: baseline;
            -ms-flex-align: baseline;
                align-items: baseline;
    }
.mx_JumpToBottomButton {
    z-index: 1000;
    position: absolute;
    bottom: 12px;
    right: 17px;
    width: 42px;
    height: 42px;
    text-align: center;
}
.mx_JumpToBottomButton .mx_JumpToBottomButton_scrollDown {
        position: relative;
        height: 42px;
        border-radius: 50%;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        background: #25262d;
        cursor: default;
    
        border: 2px solid #404040;
    }
.mx_JumpToBottomButton .mx_JumpToBottomButton_scrollDown:hover {
            background-color: #404040;
        }
.mx_JumpToBottomButton .mx_JumpToBottomButton_scrollDown::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        -webkit-mask: url(../../themes/beeper/img/icon-jump-to-bottom.c3b5349.svg);
                mask: url(../../themes/beeper/img/icon-jump-to-bottom.c3b5349.svg);
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center;
                mask-position: center;
        background: #A8A8A8;
    }
.mx_JumpToBottomButton_badge {
    pointer-events: none;

    position: absolute;
    bottom: 0;
    right: 0;
    top: auto;

    border-radius: 50%;
    width: 16px;
    height: 16px;

    font-weight: bold;
    font-size: 12px;

    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;
    padding: 0;


    color: #25262d;
    background-color: #d80915;
}
.mx_JumpToBottomButton_unread {
    position: absolute;
    bottom: 10px;
    left: 50%;
    z-index: 1000;
}
.mx_JumpToBottomButton_unread .mx_JumpToBottomButton_scrollDown {
        -webkit-transform: translateX(-50%);
                transform: translateX(-50%);
        background: #4958F5;
        color: white;
        font-size: 12px;
        font-weight: bold;
        height: 26px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        padding: 0 16px;
    }
.mx_JumpToBottomButton_unread .mx_JumpToBottomButton_scrollDown:before {
            content: none;
            position: static;
            width: 9px;
            height: 10px;
            margin-right: 6px;
            -webkit-mask: url(../../themes/beeper/img/icon-jump-to-bottom-unread.444e646.svg);
                    mask: url(../../themes/beeper/img/icon-jump-to-bottom-unread.444e646.svg);
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            -webkit-mask-position: center;
                    mask-position: center;
            background: white;
        }
.bp_TopUnreadMessagesBar {
    z-index: 1000;
    position: absolute;
    top: 32px;
    left: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.bp_TopUnreadMessagesBar_scrollUp {
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    background: #4958F5;
    color: white;
    font-size: 12px;
    font-weight: bold;
    height: 26px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 0 16px;
    border-radius: 30px;
    border: 1.3px solid #b9bec6;
}
.bp_TopUnreadMessagesBar_scrollUp:before {
      content: "";
      position: static;
      width: 9px;
      height: 10px;
      margin-right: 6px;
      -webkit-mask: url(../../themes/beeper/img/icon-jump-to-bottom-unread.444e646.svg);
              mask: url(../../themes/beeper/img/icon-jump-to-bottom-unread.444e646.svg);
      -webkit-mask-repeat: no-repeat;
              mask-repeat: no-repeat;
      -webkit-mask-position: center;
              mask-position: center;
      -webkit-transform: rotate(180deg);
              transform: rotate(180deg);
      background: white;
  }
.mx_TopUnreadMessagesBar::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 4px;
    border-radius: 16px;
    background-color: #25262d;
    border: 6px solid #4958F5;
    pointer-events: none;
}
.mx_TopUnreadMessagesBar_scrollUp {
    position: relative;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    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;

    -webkit-box-sizing: border-box;

            box-sizing: border-box;
    background: #25262d;
    -webkit-box-shadow: none;
            box-shadow: none;

    cursor: default;

    border: 2px solid #404040;
}
.mx_TopUnreadMessagesBar_scrollUp:hover {
        background-color: #404040;
    }
.mx_TopUnreadMessagesBar_scrollUp::before {
    content: "";
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    -webkit-mask: url(../../themes/nova-light/img/icon-jump-to-bottom.c3b5349.svg);
            mask: url(../../themes/nova-light/img/icon-jump-to-bottom.c3b5349.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    background: #A8A8A8;
}
.mx_TopUnreadMessagesBar_markAsRead {
    border: 2px solid #404040;
    position: absolute;
    left: 55%;
}
.mx_TopUnreadMessagesBar_markAsRead:hover {
        background-color: #404040;
    }
.mx_ReplyPreview {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    position: relative;
    height: 49px;
    padding-right: 59px;
    width: 100%;
    overflow: hidden;
    border-radius: 8px;
    background: #25262d;
}
.mx_ReplyPreview_wrapper {
    padding-left: 49px;
    height: 49px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    cursor: default;
}
.mx_ReplyPreview_wrapper::before {
        content: url(../../themes/nova-light/img/icon-reply.92e6c6b.svg);
        position: absolute;
        left: 12px;
        top: 15px;
    }
.mx_ReplyPreview_wrapper .mx_SenderProfile {
        margin-bottom: 3px;
    }
.mx_ReplyPreview_wrapper .mx_SenderProfile_name {
            font-size: 13px;
            color: #4958F5;
        }
.mx_ReplyPreview_thumbnail {
    height: 36px;
    width: 36px;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    margin-right: 7px;
    overflow: hidden;
    border-radius: 2px;
}
.mx_ReplyPreview_thumbnail > img {
        -o-object-fit: cover;
           object-fit: cover;
    }
.mx_ReplyPreview_content {
    width: 100%;
}
.mx_ReplyPreview_contentText {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 13px;
}
.mx_ReplyPreview_cancel {
    position: absolute;
    right: 18px;
    top: 12px;
    cursor: default;
    z-index: 2;
}
.mx_ReplyPreview_cancel img {
        padding: 5px;
    }
.bp_ReplyPreview_avatar {
    margin-right: 16px;
}
.bp_ReplyPreview_inThread .mx_ReplyPreview_wrapper {
        height: auto;
        padding-left: 0;
    }
.bp_ReplyPreview_inThread .mx_ReplyPreview_wrapper::before {
            display: none;
        }
.mx_MessageComposer {
    background: transparent;
    border: none;
    border-radius: 0;
    margin: 0 !important;
    position: relative;
    padding: 0 16px 0 16px;
}
.mx_MessageComposer--narrow .mx_Waveform {
        width: 0;
        overflow: hidden;
      }
.mx_MessageComposer .mx_ReplyPreview {
        margin-bottom: 8px;
    }
.mx_MessageComposer_inThread {
    }
.mx_MessageComposer_inThread .mx_ReplyPreview {
            margin-bottom: 0;
        }
.mx_MessageComposer_wrapper {
    padding: 0 16px;
    padding-left: 5px;
    background: var(--chatview__composer__backgroundcolor);
    border-color: var(--chatview__composer__bordercolor);
    border-radius: var(--chatview__composer__borderradius);
    border-width: var(--chatview__composer__borderwidth);
    border-style: var(--chatview__composer__borderstyle);
}
.mx_MessageComposer_wrapper .mx_BasicMessageComposer .mx_BasicMessageComposer_input.mx_BasicMessageComposer_input_shouldShowPillAvatar {
      color: #ffffff;
    }
.mx_MessageComposer_wrapper .mx_MessageComposer_send {
      background: hsla(220, 83%, 62%, 1);
      -webkit-background-clip: text;
              background-clip: text;
    }
.mx_MessageComposer_e2eIcon.mx_E2EIcon {
    left:5px;
}
.mx_MessageComposer_send {
    background: linear-gradient(120deg, #a93fe9 12px, #4958f5);
    background-clip: text;
    text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 1.4rem;
    font-weight: 600;
    line-height: 16px;
    margin-left: 6px;
}
.mx_MessageComposer_send.mx_AccessibleButton_disabled {
        background-image: none;
        background-color: rgb(255 255 255 / 50%);
    }
.bp_PotentialLinkPreview {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -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;
  height: 75px;
  margin-bottom: 8px;
  padding-left: 16px;
}
.bp_PotentialLinkPreview .mx_ReplyPreview_cancel {
    position: relative;
    top: unset;
  }
.bp_PotentialLinkPreview .bp_PotentialLinkPreviewImage {
    background-color: #bbb;
    border-radius: 8px;
    width: 100px;
    height: 70px;
    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;
    margin-right: 12px;
    -o-object-fit: cover;
       object-fit: cover;
  }
.bp_PotentialLinkPreview .bp_LinkPreview_Image {
    border-radius: 8px;
  }
.mx_RoomTile {
    -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;
    cursor: default;
    margin: 0;
    height: 62px;
    padding: 8px 10px;
    position: relative;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
}
.mx_RoomTile.mx_RoomTile_menuDisplayed, .mx_RoomTile:hover {
        background: #F2F3F5;
    }
.mx_RoomTile * {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}
.mx_RoomTile_selected, .mx_RoomTile_selected:hover, .mx_RoomTile_selected.mx_RoomTile_menuDisplayed {
    background-color: #d0d1d829;
    color: #202127;
}
.mx_RoomTile_unread .mx_RoomTile_name, .mx_RoomTile_highlight .mx_RoomTile_name {
    color: #424961;
}
.mx_RoomTile_avatar {
    -webkit-box-flex: 0;
        -ms-flex: 0;
            flex: 0;
    width: 46px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
}
.mx_RoomTile_content {
    margin-left: 10px;
    line-height: 18px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    min-width: 0;
    vertical-align: middle;
    padding: 2px 0;
}
.mx_RoomTile_labelContainer {
    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;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    min-width: 0;
}
.mx_RoomTile_name {
    font-weight: 600;
    font-size: 13px;
    color: #424961;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mx_RoomTile_eventPreview {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 13px;
    color: #98a2aa;
}
.mx_RoomTile_eventSender {
    color: #4958F5;
    margin-right: 4px;
}
.mx_RoomTile_eventText {
    color: #98a2aa;
}
.mx_RoomTile_statusGroup {
    text-align: right;
    -webkit-box-flex: 0;
        -ms-flex: 0;
            flex: 0;
    min-width: 52px;
}
.mx_RoomTile_badge {
    display: inline-block;
    height: 18px;
    min-width: 18px;
    border-radius: 9px;
    text-align: center;
    font-weight: 600;
    background: #4958F5;
    color: #202127;
    font-size: 12px;
    font-weight: 600;
    padding: 0 4px;
}
.mx_RoomTile_badge.mx_RoomTile_badgeMuted {
    background: #98a2aa;
}
.mx_RoomTile_notifications {
    position: absolute;
    bottom: 8px;
    right: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    z-index: 2;
}
.mx_RoomTile_statusGroup .mx_MessageTimestamp {
    font-size: 13px;
    color: #98a2aa;
}
.mx_RoomTile_selected .mx_RoomTile_name, .mx_RoomTile_selected .mx_RoomTile_eventText, .mx_RoomTile_selected .mx_RoomTile_eventSender, .mx_RoomTile_selected .mx_MessageTimestamp {
    color: #202127;
}
.mx_RoomTile_selected .mx_RoomTile_badge {
    color: #4958F5;
    background: #c1e2f4;
}
.mx_RoomTile_dm {
    display: block;
    position: absolute;
    bottom: 0;
    right: -5px;
    z-index: 2;
}
.mx_RoomTile_e2eIcon.mx_E2EIcon {
    height: 14px;
    width: 14px;
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
    margin: 0;
}
.nv_RoomTile_bridgedIcon {
    height: 14px;
    width: 14px;
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    margin: 0;
}
.collapsed .mx_RoomTile {
        margin: 0;
        padding: 0;
        position: relative;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }
.collapsed .mx_RoomTile_name {
        display: none;
    }
.collapsed .mx_RoomTile_content {
        display: none;
    }
.collapsed .mx_RoomTile_notifications .mx_RoomTile_pinned {
            display: none;
        }
.collapsed .mx_RoomTile_menuButton {
        display: none;
    }
.mx_RoomTile_menuDisplayed .mx_RoomTile_menuButton, .mx_LeftPanel_container:not(.collapsed) .mx_RoomTile:focus-within .mx_RoomTile_menuButton, .mx_LeftPanel_container:not(.collapsed) .mx_RoomTile:hover .mx_RoomTile_menuButton {
        display: block;
    }
.mx_DNDRoomTile {
    -webkit-transform: none;
            transform: none;
    -webkit-transition: -webkit-transform 0.2s;
    transition: -webkit-transform 0.2s;
    transition: transform 0.2s;
    transition: transform 0.2s, -webkit-transform 0.2s;
}
.mx_DNDRoomTile_dragging {
    -webkit-transform: scale(1.05, 1.05);
            transform: scale(1.05, 1.05);
}
.mx_RoomTile_arrow {
    position: absolute;
    right: 0px;
}
.mx_RoomTile.mx_RoomTile_transparent {
    background-color: transparent;
}
.mx_RoomTile.mx_RoomTile_transparent:focus {
    background-color: rgba(0, 0, 0, 0.1);
}
.mx_GroupInviteTile .mx_RoomTile_name {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
.mx_RoomTile_pinned {
    height: 18px;
    width: 18px;
    display: inline-block;
    background: #98a2aa;
    -webkit-mask: url(../../themes/nova-light/img/icon-dialogs-pinned.be4b518.svg);
            mask: url(../../themes/nova-light/img/icon-dialogs-pinned.be4b518.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: 50% 50%;
            mask-position: 50% 50%;
}
.mx_RoomTile_nameGroup::before {
        display: inline-block;
        height: 13px;
        width: 18px;
        content: '';
        background: #000;
        -webkit-mask: url(../../themes/nova-light/img/icon-dialogs-chat.2551437.svg);
                mask: url(../../themes/nova-light/img/icon-dialogs-chat.2551437.svg);
        -webkit-mask-position: bottom center;
                mask-position: bottom center;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        margin: auto 3px auto auto;
    }
.mx_RoomTile_selected .mx_RoomTile_pinned {
        background: rgba(255, 255, 255, 0.7);
    }
.mx_RoomTile_selected .mx_RoomTile_nameGroup::before {
        background: #202127;
    }
.nv_RoomList_archivedBtn .mx_RoomTile_badge {
    background: #98a2aa;
}
.nv_RoomTileGroup {
}
.nv_RoomTileGroup_label {
    background: #F2F3F5;
    color: #979797;
    font-weight: 600;
    padding: 7px 0 7px 18px;
    font-size: 13px;
}
.nv_RoomTileGroup_dragContainer {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
.nv_RoomTileGroup_dragItem {
    height: 62px;
}
.nv_RoomTileGroup_dragItemDragging .mx_RoomTile {
        background: #f2f2f2;
    }
.nv_RoomTileGroup_dragItemDragging .mx_RoomTile_selected {
        background: #4958F5;
    }
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2017 Vector Creations Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RoomList {
    /* take up remaining space below TopLeftMenu */
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    min-height: 0;
    overflow-y: hidden;
    padding-right: 0;
}
.mx_RoomList_wrapper {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
.mx_RoomList .mx_ResizeHandle {
    position: relative;
}
/* hide resize handles next to collapsed / empty sublists */
.mx_RoomList .mx_RoomSubList:not(.mx_RoomSubList_nonEmpty) + .mx_ResizeHandle {
    display: none;
}
.mx_RoomList_expandButton {
    margin-left: 8px;
    cursor: default;
    padding-left: 12px;
    padding-right: 12px;
}
.mx_RoomList_emptySubListTip_container {
    padding-left: 18px;
    padding-right: 18px;
    padding-top: 8px;
    padding-bottom: 7px;
}
.mx_RoomList_emptySubListTip {
    font-size: 13px;
    padding: 5px;
    border: 1px dashed #4958F5;
    color: #f0f0f1;
    background-color: rgba(255,255,255,0.5);
    border-radius: 4px;
    line-height: 16px;
}
.mx_RoomList_emptySubListTip .mx_RoleButton {
    vertical-align: -2px;
}
.mx_RoomList_headerButtons {
    position: absolute;
    right: 60px;
}
.nv_RoomList_archivedBtn {
    height: 62px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    cursor: default;
    padding: 8px 10px;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
}
.nv_RoomList_archivedBtn:hover {
        background-color: #F2F3F5;
    }
.nv_RoomList_archivedBtn_icon {
        width: 46px;
        height: 46px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        border-radius: 40px;
        background-color: #bbb;
        -ms-flex-negative: 0;
            flex-shrink: 0;
    }
.nv_RoomList_archivedBtn_icon::before {
            width: 100%;
            display: block;
            content: '';
            -webkit-mask: url(../../themes/nova-light/img/icon-dialog-archived.38f561d.svg);
                    mask: url(../../themes/nova-light/img/icon-dialog-archived.38f561d.svg);
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            -webkit-mask-position: center center;
                    mask-position: center center;
            background-color: #fff;
        }
.nv_RoomList_archivedBtn_content {
        margin-left: 10px;
        line-height: 18px;
        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-pack: distribute;
            justify-content: space-around;
    }
.nv_RoomList_archivedBtn_label {
        font-weight: 600;
        font-size: 13px;
        color: #000000;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
.nv_RoomList_archivedBtn_description {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        font-size: 13px;
        color: #98a2aa;
    }
.nv_RoomList_RoomList_archived {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #fff;
    z-index: 100;
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
    -webkit-transition: -webkit-transform 0.2s ease-out;
    transition: -webkit-transform 0.2s ease-out;
    transition: transform 0.2s ease-out;
    transition: transform 0.2s ease-out, -webkit-transform 0.2s ease-out;
}
.nv_RoomList_RoomList_archivedVisible {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    -webkit-box-shadow: 2px 0 0 rgba(0, 0, 0, .3);
            box-shadow: 2px 0 0 rgba(0, 0, 0, .3);
}
.nv_RoomList_RoomList_archived_header {
    height: 54px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    line-height: 18px;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
}
.nv_RoomList_RoomList_archived_headerIcon {
    height: 54px;
    width: 54px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.nv_RoomList_RoomList_archived_headerIcon::before {
        content: url(../../themes/nova-light/img/icon-dialog-back.f393c95.svg);
        margin: auto;
    }
.nv_RoomList_RoomList_archived_headerLabel {
    font-weight: 600;
    font-size: 15px;
    color: #000000;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mx_LeftPanel {
    position: relative;
}
.mx_LeftPanel_container.collapsed .nv_RoomList_archivedBtn_content, .mx_LeftPanel_container.collapsed .nv_RoomList_RoomList_archived_headerLabel {
    display: none;
}
.mx_LeftPanel_container.collapsed .nv_RoomList_RoomList_archived_headerIcon {
        width: 66px;
    }
.mx_LeftPanel_container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    /* LeftPanel without tag panel 190px */
    min-width: 190px;
    max-width: 550px;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
}
.mx_LeftPanel_menuRow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.mx_LeftPanel_menuRow .mx_SearchBox {
        -webkit-box-flex: 1;
            -ms-flex: 1 1 0px;
                flex: 1 1 0;
        min-width: 0;
        height: 32px;
        margin: 0 12px 0 0;
        background-color: #FBFBFB;
        border: 2px solid #7CCEF2;
    }
.mx_LeftPanel_menuRow .mx_SearchBox input {
            font-size: 13px;
            font-weight: 400;
            background-image: none !important;
            padding-left: 11px;
        }
.mx_LeftPanel_menuRow .mx_SearchBox input::-webkit-input-placeholder {
            color: #98a2aa;
        }
.mx_LeftPanel_menuRow .mx_SearchBox input::-moz-placeholder {
            color: #98a2aa;
        }
.mx_LeftPanel_menuRow .mx_SearchBox input:-ms-input-placeholder {
            color: #98a2aa;
        }
.mx_LeftPanel_menuRow .mx_SearchBox input::-ms-input-placeholder {
            color: #98a2aa;
        }
.mx_LeftPanel_menuRow .mx_SearchBox input::placeholder {
            color: #98a2aa;
        }
.mx_LeftPanel_menuRow .mx_SearchBox_blurred {
        border-color: #F2F3F5;
        background-color: #F2F3F5 !important;
    }
.mx_LeftPanel_container.collapsed {
    min-width: unset;
    /* Collapsed LeftPanel 67px */
    -webkit-box-flex: 0;
        -ms-flex: 0 0 66px;
            flex: 0 0 66px;
}
.mx_LeftPanel_container.collapsed.mx_LeftPanel_container_hasTagPanel {
    /* TagPanel 70px + Collapsed LeftPanel 67px */
    -webkit-box-flex: 0;
        -ms-flex: 0 0 136px;
            flex: 0 0 136px;
    min-width: 260px;
}
.mx_LeftPanel_tagPanelContainer {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 70px;
            flex: 0 0 70px;
    height: 100%;
}
.mx_LeftPanel_hideButton {
    position: absolute;
    top: 10px;
    right: 0px;
    padding: 8px;
    cursor: default;
}
.mx_LeftPanel {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    overflow: hidden;
    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;
}
.mx_LeftPanel .mx_AppTile_mini {
    height: 132px;
}
.mx_LeftPanel .mx_RoomList_scrollbar {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;

    -webkit-box-flex: 1;

        -ms-flex: 1 1 0px;

            flex: 1 1 0;

    overflow-y: auto;
    z-index: 6;
}
.mx_LeftPanel .mx_BottomLeftMenu {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;

    border-top: 1px solid transparent;
    margin-left: 16px; /* gutter */
    margin-right: 16px; /* gutter */
    -webkit-box-flex: 0;
        -ms-flex: 0 0 60px;
            flex: 0 0 60px;
    z-index: 1;
}
.mx_LeftPanel_container.collapsed .mx_BottomLeftMenu {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 160px;
            flex: 0 0 160px;
    margin-bottom: 9px;
}
.mx_LeftPanel .mx_BottomLeftMenu_options {
    margin-top: 18px;
}
.mx_BottomLeftMenu_options object {
    pointer-events: none;
}
.mx_BottomLeftMenu_options > div {
    display: inline-block;
}
.mx_BottomLeftMenu_options .mx_RoleButton {
    margin-left: 0px;
    margin-right: 10px;
    height: 30px;
}
.mx_BottomLeftMenu_options .mx_BottomLeftMenu_settings {
    float: right;
}
.mx_BottomLeftMenu_options .mx_BottomLeftMenu_settings .mx_RoleButton {
    margin-right: 0px;
}
.mx_LeftPanel_container.collapsed .mx_BottomLeftMenu_settings {
    float: none;
}
.mx_MatrixChat_useCompactLayout .mx_LeftPanel .mx_BottomLeftMenu {
        -webkit-box-flex: 0;
            -ms-flex: 0 0 45px;
                flex: 0 0 45px;
    }
.mx_MatrixChat_useCompactLayout .mx_LeftPanel_container.collapsed .mx_BottomLeftMenu {
        -webkit-box-flex: 0;
            -ms-flex: 0 0 160px;
                flex: 0 0 160px;
    }
.mx_MatrixChat_useCompactLayout .mx_LeftPanel .mx_BottomLeftMenu_options {
        margin-top: 12px;
    }
.mx_LeftPanel_explore {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    overflow: hidden;
    -webkit-transition: -webkit-flex-basis 0.2s;
    transition: -webkit-flex-basis 0.2s;
    transition: flex-basis 0.2s;
    transition: flex-basis 0.2s, -webkit-flex-basis 0.2s, -ms-flex-preferred-size 0.2s;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}
.mx_LeftPanel_explore.mx_LeftPanel_explore_hidden {
        -ms-flex-preferred-size: 0;
            flex-basis: 0;
    }
.mx_LeftPanel_explore .mx_AccessibleButton {
        font-size: 14px;
        margin: 4px 0 1px 9px;
        padding: 9px;
        padding-left: 42px;
        font-weight: 600;
        color: #8e99a4;
        position: relative;
        border-radius: 4px;
    }
.mx_LeftPanel_explore .mx_AccessibleButton:hover {
            background-color: #25262d;
        }
.mx_LeftPanel_explore .mx_AccessibleButton::before {
            cursor: default;
            -webkit-mask-image: url(../../img/element-icons/roomlist/explore.1523e65.svg);
                    mask-image: url(../../img/element-icons/roomlist/explore.1523e65.svg);
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            -webkit-mask-position: center center;
                    mask-position: center center;
            content: "";
            left: 14px;
            top: 10px;
            width: 16px;
            height: 16px;
            background-color: #8e99a4;
            position: absolute;
        }
.mx_RoomView_MessageList {
    padding: 0 16px;
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
/* a word of explanation about the flex-shrink values employed here:
   there are 3 priotized categories of screen real-estate grabbing,
   each with a flex-shrink difference of 4 order of magnitude,
   so they ideally wouldn't affect each other.
   lowest category: .mx_RoomSubList
        flex-shrink: 10000000
        distribute size of items within the same category by their size
   middle category: .mx_RoomSubList.resized-sized
        flex-shrink: 1000
        applied when using the resizer, will have a max-height set to it,
        to limit the size
   highest category: .mx_RoomSubList.resized-all
        flex-shrink: 1
        small flex-shrink value (1), is only added if you can drag the resizer so far
        so in practice you can only assign this category if there is enough space.
*/
.mx_RoomSubList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
.mx_RoomSubList_nonEmpty .mx_AutoHideScrollbar_offset {
    padding-bottom: 4px;
}
.mx_RoomSubList_labelContainer {
    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-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    margin: 0 8px;
    padding: 0 8px;
    height: 36px;
}
.mx_RoomSubList_labelContainer.focus-visible:focus-within {
    background-color: #e4e4e4;
}
.mx_RoomSubList_label {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    cursor: default;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 0 6px;
}
.mx_RoomSubList_label > span {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    text-transform: uppercase;
    color: #424961;
    font-weight: 700;
    font-size: 12px;
    margin-left: 8px;
}
.mx_RoomSubList_badge > div {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    border-radius: 8px;
    font-weight: 600;
    font-size: 12px;
    padding: 0 5px;
    color: #ffffff;
    background-color: #424961;
    cursor: default;
}
.mx_RoomSubList_addRoom, .mx_RoomSubList_badge {
    margin-left: 7px;
}
.mx_RoomSubList_addRoom {
    background-color: rgba(92, 100, 112, 0.3);
    border-radius: 10px;
    height: 16px;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 16px;
            flex: 0 0 16px;
    position: relative;
}
.mx_RoomSubList_addRoom::before {
        background-color: #f0f0f1;
        -webkit-mask: url(../../img/icons-room-add.bd36e26.svg);
                mask: url(../../img/icons-room-add.bd36e26.svg);
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: center;
                mask-position: center;
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
    }
.mx_RoomSubList_badgeHighlight > div {
    color: #202127;
    background-color: #d80915;
}
.mx_RoomSubList_chevron {
    pointer-events: none;
    -webkit-mask: url(../../img/feather-customised/dropdown-arrow.1a22ebc.svg);
            mask: url(../../img/feather-customised/dropdown-arrow.1a22ebc.svg);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-transition: -webkit-transform 0.2s ease-in;
    transition: -webkit-transform 0.2s ease-in;
    transition: transform 0.2s ease-in;
    transition: transform 0.2s ease-in, -webkit-transform 0.2s ease-in;
    width: 10px;
    height: 6px;
    margin-left: 2px;
    background-color: #424961;
}
.mx_RoomSubList_chevronDown {
    -webkit-transform: rotateZ(0deg);
            transform: rotateZ(0deg);
}
.mx_RoomSubList_chevronUp {
    -webkit-transform: rotateZ(180deg);
            transform: rotateZ(180deg);
}
.mx_RoomSubList_chevronRight {
    -webkit-transform: rotateZ(-90deg);
            transform: rotateZ(-90deg);
}
.mx_RoomSubList_scroll {
    /* let rooms list grab as much space as it needs (auto),
       potentially overflowing and showing a scrollbar */
    -webkit-box-flex: 0;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
    padding: 0 8px;
}
.collapsed .mx_RoomSubList_scroll {
        padding: 0;
    }
.collapsed .mx_RoomSubList_labelContainer {
        margin-right: 8px;
        margin-left: 2px;
        padding: 0;
    }
.collapsed .mx_RoomSubList_addRoom {
        margin-left: 3px;
        margin-right: 10px;
    }
.collapsed .mx_RoomSubList_label > span {
        display: none;
    }
.mx_RoomSubList:not(.resized-all) > .mx_RoomSubList_scroll {

    /*
    // for now, we remove the bottomOverflow entirely as we don't want to
    // lose the screen real-estate due to a bg-colored gradient, but we also
    // don't want to use drop shadows and risk a confusing hierarchy of cards.
    // so, instead, we hard-clip at the bottom but soft-clip at the top.
    &.mx_IndicatorScrollbar_bottomOverflow::after {
        bottom: 0;
        transition: background-image 0.1s ease-in;
        margin: 0px -8px;
        background: linear-gradient(to bottom, rgba(0,0,0,0.1), rgba(0,0,0,0.0));
    }
    */
}
.mx_RoomSubList:not(.resized-all) > .mx_RoomSubList_scroll.mx_IndicatorScrollbar_topOverflow::before, .mx_RoomSubList:not(.resized-all) > .mx_RoomSubList_scroll.mx_IndicatorScrollbar_bottomOverflow::after {
        position: sticky;
        left: 0;
        right: 0;
        height: 8px;
        content: "";
        display: block;
        z-index: 100;
        pointer-events: none;
    }
.mx_RoomSubList:not(.resized-all) > .mx_RoomSubList_scroll.mx_IndicatorScrollbar_topOverflow > .mx_AutoHideScrollbar_offset {
        margin-top: -8px;
    }
.mx_RoomSubList:not(.resized-all) > .mx_RoomSubList_scroll.mx_IndicatorScrollbar_bottomOverflow > .mx_AutoHideScrollbar_offset {
        margin-bottom: -8px;
    }
.mx_RoomSubList:not(.resized-all) > .mx_RoomSubList_scroll.mx_IndicatorScrollbar_topOverflow::before {
        top: 0;
        -webkit-transition: background-image 0.1s ease-in;
        transition: background-image 0.1s ease-in;
        background: -webkit-gradient(linear, left bottom, left top, from(rgba(34, 38, 46, 0)), to(rgba(34, 38, 46, 1)));
        background: linear-gradient(to top, rgba(34, 38, 46, 0), rgba(34, 38, 46, 1));
    }
.nv_RoomSubList_archived {
    position: absolute;
    z-index: 5000;
}
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2019 The Matrix.org Foundation C.I.C.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ContextualMenu_wrapper {
    position: fixed;
    z-index: 10000;
}
.mx_ContextualMenu_background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 1.0;
    z-index: 10000;
}
.mx_ContextualMenu {
    border-radius: 12px;
    border: 1px solid #404040;
    background-color: #25262d;
    color: #f0f0f1;
    position: absolute;
    font-size: 1.4rem;
    z-index: 10001;
}
.mx_ContextualMenu_right {
    right: 0;
}
.mx_ContextualMenu.mx_ContextualMenu_withChevron_right {
    right: 8px;
}
.mx_ContextualMenu_chevron_right {
    position: absolute;
    right: -8px;
    top: 0px;
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-left: 8px solid #25262d;
    border-bottom: 8px solid transparent;
}
.mx_ContextualMenu_left {
    left: 0;
}
.mx_ContextualMenu.mx_ContextualMenu_withChevron_left {
    left: 8px;
}
.mx_ContextualMenu_chevron_left {
    display: none;
}
.mx_ContextualMenu_top {
    top: 0;
}
.mx_ContextualMenu.mx_ContextualMenu_withChevron_top {
    top: 8px;
}
.mx_ContextualMenu_chevron_top {
    position: absolute;
    left: 0px;
    top: -8px;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-bottom: 8px solid #25262d;
    border-right: 8px solid transparent;
}
.mx_ContextualMenu_bottom {
    bottom: 0;
}
.mx_ContextualMenu.mx_ContextualMenu_withChevron_bottom {
    bottom: 8px;
}
.mx_ContextualMenu_chevron_bottom {
    position: absolute;
    left: 0px;
    bottom: -8px;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-top: 8px solid #25262d;
    border-right: 8px solid transparent;
}
.mx_ContextualMenu_spinner {
    display: block;
    margin: 0 auto;
}
/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MessageContextMenu {
    padding: 6px 0;
}
.mx_MessageContextMenu_field {
    display: block;
    padding: 6px 12px;
    cursor: default;
    white-space: nowrap;
}
.mx_MessageContextMenu_field:hover {
        background: #454854;
    }
.mx_MessageContextMenu_field.mx_MessageContextMenu_fieldSet {
    font-weight: bold;
}
.bp_ChatSectionContextMenu-settings {
    max-width: 300px;
    padding: 0 20px;
}
.bp_ChatSectionContextMenu-settings .mx_SettingsFlag {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: flex-end;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        grid-gap: 5px;
        gap: 5px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
            -ms-flex-direction: row-reverse;
                flex-direction: row-reverse;
        text-align: left;
    }
.bp_ChatSectionContextMenu-settings .mx_SettingsRadio {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: flex-end;
        text-align: left;
        -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;
        grid-gap: 10px;
        gap: 10px;
        margin: 10px 0;
    }
.bp_ChatSectionContextMenu-settings .mx_SettingsFlag_microcopy {
        display: none;
    }
.bp_ChatSectionContextMenu-settings .bp_SettingsField {
        margin: 0;
        min-width: 70px;
        max-width: 70px;
    }
.mx_VerificationShowSas_emojiSas {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    margin-left: -16px;
}
.mx_VerificationShowSas_emojiSas_block {
    margin-left: 16px;
    width: auto;
}
.mx_VerificationShowSas_emojiSas_block .mx_VerificationShowSas_emojiSas_emoji {
        font-family: 'Sofia Pro';
        font-size: 48px;
        line-height: 1;
    }
.mx_VerificationShowSas_emojiSas_block .mx_VerificationShowSas_emojiSas_label {
        margin-top: 8px;
    }
.mx_VerificationShowSas_emojiSas_break {
    display: none;
}
/* new room list */
.bp_ShowMoreGroups {
    padding: 8px;
    text-align: center;
    color: #ADABB5;
    font-size: 12px;
    height: 50px;
}
.bp_Channels_scrollHelper {
    overflow-y: scroll;
    height: 100%;
    padding-top: 14px;
}
.bp_Channels_scrollHelper::-webkit-scrollbar {
        width: 0;  /* Remove scrollbar space */
        background: transparent;  /* Optional: just make scrollbar invisible */
    }
.bp_ProtocolsToggle {
    margin: 2px 6px 10px 6px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
.bp_ProtocolsToggle img, .bp_ProtocolsToggle .bp_Avatar {
        width: 32px;
        height: 32px;
        border-radius: 8px;
    }
.bp_ProtocolsToggle_active img, .bp_ProtocolsToggle_active .bp_Avatar {
            border: 2px solid #2e3038;
            margin: -4px;
            width: 36px;
            height: 36px;
            -webkit-box-shadow: 0 0 0 1px rgba(185,190,198, .5);
                    box-shadow: 0 0 0 1px rgba(185,190,198, .5);
        }
.bp_ProtocolsToggle .bp_newChatButton_border {
        background-color: #202127;
        width: 38px;
        height: 38px;
        border-radius: 32px;
        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;
    }
.bp_ProtocolsToggle .bp_newChatButton_border .bp_newChatButton {
        border-radius: 32px;
        background: radial-gradient(100% 100% at 50% 0%, rgba(240, 240, 241, 0.28) 0%, rgba(46, 48, 56, 0.28) 91.15%),
    #373a43;
        background-blend-mode: multiply, normal;
        border: 0.5px solid #0B1023;
        width: 34px;
        height: 34px;
        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;
        }
.bp_ProtocolsToggle .bp_newChatButton_border .bp_newChatButton .bp_newChatIcon {
            background-image: url(../../img/new-message-dark.b82dcd1.svg);
            background-repeat: no-repeat;
            background-position: center;
            background-size: cover;
            width: 16px;
            height: 17px;
        }
.bp_ProtocolsToggle .bp_ProtocolsToggle {
    opacity: 0.64;
}
.bp_ProtocolsToggle .mx_AccessibleButton
  .bp_ProtocolsToggle
  .bp_ProtocolsToggle_collapsed
  > .bp_Channel_protocolIcon, .bp_ProtocolsToggle .bp_ProtocolsToggle:before {
  background: none;
}
.bp_ProtocolsToggle .bp_Channel_protocol:before, .bp_ProtocolsToggle .bp_ProtocolsToggle:before {
  border: none;
}
.bp_ProtocolsToggle .bp_Channel_protocol {
    background-color: #35363d;
    border: 1px solid #4f5056;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-shadow: inset 0.89px -1.67433px 4px rgba(34, 35, 40, 0.2), inset 0.89px -1.67px 4px rgba(68, 69, 78, 0.8);
            box-shadow: inset 0.89px -1.67433px 4px rgba(34, 35, 40, 0.2), inset 0.89px -1.67px 4px rgba(68, 69, 78, 0.8);
    border-radius: 8px;
    width: 32px;
    height: 32px;
}
.bp_ProtocolsToggle .bp_Channel_badge {
        position: absolute;
        top: -4px;
        right: -4px;
        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;
        line-height: 18px;
        width: 18px;
        height: 18px;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        font-size: 10px;
        font-weight: 700;
        border-radius: 50%;
        color: white;
        border: 1px solid #25262dcc;
        border: 1px solid var(--room-tile-bg-hover);
    }
.bp_ProtocolsToggle .bp_Channel_badge.unread {
            background: #e0474f;
        }
.bp_ProtocolsToggle .bp_Channel_badge_icon {
        position: absolute;
        width: 16px;
        height: 16px;
        top: -6px;
        left: -5px;
        }
.bp_ProtocolsToggle .bp_Channel_badge_icon.warning {
            width: 20px;
            height: 20px;
            top: -8px;
            left: -8px;
            background-image: url(../../img/warning-stroke.072147d.svg);
        }
.bp_ProtocolsToggle .bp_Channel_badge_icon.error {
            background-image: url(../../img/x-stroke.ab96061.svg);
        }
.bp_Channel_beeper::before, .bp_Channel_low::before, .bp_Channel_protocol::before, .bp_ProtocolsToggle::before, .bp_Channel_bookmarks::before {
        background-repeat: no-repeat;
        background-position: center;
        background-size: 80%;
        content: '';
        width: 32px;
        height: 32px;
        border-radius: 8px;
    }
.bp_Channel_beeper::before, .bp_Channel_low::before, .bp_Channel_bookmarks::before {
        background: #202127;
    }
.bp_Channel_beeper.bp_Channel_active::before, .bp_Channel_low.bp_Channel_active::before, .bp_Channel_bookmarks.bp_Channel_active::before {
            border: 2px solid #35363d;
            -webkit-box-sizing: border-box;
                    box-sizing: border-box;
            -webkit-box-shadow: 0px 0px 0px 1px #76767b, inset 0.890257px -1.67433px 2px #222328,
    inset 0.89px -1.67px 4px #44454e;
                    box-shadow: 0px 0px 0px 1px #76767b, inset 0.890257px -1.67433px 2px #222328,
    inset 0.89px -1.67px 4px #44454e;
            border-radius: 8px;
            width: 32px;
            height: 32px;
            margin: 0;
        }
.bp_Channel_protocol::before, .bp_ProtocolsToggle::before {
        background-color: transparent;
        border: 1px solid rgba(208, 209, 216, 0.2);
    }
.bp_Channel_protocol.hasNetworkError::before, .bp_ProtocolsToggle.hasNetworkError::before {
            background: #FFCE5133;
        }
.bp_Channel_protocol.bp_Channel_active::before, .bp_ProtocolsToggle.bp_Channel_active::before {
            background-color: rgba(255, 255, 255, 0.4);
            border-color: rgba(208, 209, 216, 0.2);
            margin: -2px;
            width: 36px;
            height: 36px;
            -webkit-box-shadow: 0 0 0 1px rgba(185,190,198, .5);
                    box-shadow: 0 0 0 1px rgba(185,190,198, .5);
        }
.bp_Channel_beeper.hasWarning::before, .bp_Channel_low.hasWarning::before, .bp_Channel_protocol.hasWarning::before {
            background-color: #FFCE5130;
        }
.bp_Channel_beeper.hasError::before, .bp_Channel_low.hasError::before, .bp_Channel_protocol.hasError::before {
            background-color: #E0474F30;
        }
.bp_Channel_beeper::before {
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
}
.bp_Channel_low {
    position: relative;
}
.bp_Channel_low .bp_Channel_lowIcon {
        background-size: 24px;
        background-position: center;
        background-repeat: no-repeat;

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex;
        width: 100%;
        height: 100%;
        position: absolute;
    }
.bp_Channel_bookmarks {
    position: relative;
}
.bp_Channel_bookmarks .bp_Channel_bookmarksIcon {
        background-size: 17px;
        background-position: center;
        background-repeat: no-repeat;

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex;
        width: 100%;
        height: 100%;
        top: 2px;
        position: absolute;
    }
.bp_ProtocolsToggle {
}
.bp_ProtocolsToggle .icon {
        position: absolute;
        width: 100%;
        height: 100%;
        -webkit-mask-image: url(../../themes/beeper/img/icon-arrow.e88d390.svg);
                mask-image: url(../../themes/beeper/img/icon-arrow.e88d390.svg);
        -webkit-mask-size: contain;
                mask-size: contain;
        background-color: currentColor;
    }
.bp_ProtocolsToggle_collapsed .icon {
            -webkit-transform: rotateZ(180deg);
                    transform: rotateZ(180deg);
        }
.mx_ToastContainer .mx_Toast_toast {
        border-radius: 16px;
    }
.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon.mx_Toast_icon_verification::after {
                width: 25px;
                height: 25px;
                background: url(../../themes/beeper/img/icon-shield.f662510.svg);
                -webkit-mask-image: none;
                        mask-image: none;
            }
.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon.mx_Toast_icon_verification_warning::before {
                    width: 25px;
                    height: 25px;
                    background-color: transparent;
                    background: url(../../themes/beeper/img/icon-shield.f662510.svg);
                    -webkit-mask-image: none;
                            mask-image: none;
                }
.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon.mx_Toast_icon_verification_warning::after {
                    -webkit-mask-image: none;
                            mask-image: none;
                    background-color: transparent;
                }
.mx_Toast_title {
    font-size: 14px;
    font-weight: 400;
}
.bp_UserMenu {
    height: 24px;
    width: 24px;
    position: relative;
    -webkit-app-region: no-drag;
    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;
}
.bp_UserMenu::before {
        content: '';
        width: 16px;
        height: 16px;
        -webkit-mask-image: url(../../themes/beeper/img/icon-settings.49797d6.svg);
                mask-image: url(../../themes/beeper/img/icon-settings.49797d6.svg);
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-size: contain;
                mask-size: contain;
        -webkit-mask-position: center;
                mask-position: center;
        background-color: hsla(215, 21%, 76%, 0.33);
    }
.bp_UserMenu {
    cursor: default;
}
.bp_UserMenu:hover::before {
            background-color: #aaa;
        }
.nv_RoomSublist2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 100%;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    padding-bottom: 15px;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
}
.nv_RoomSublist2_collapsed, .nv_RoomSublist2_empty {
        padding-bottom: 0;
    }
.nv_RoomSublist2_collapsed:last-child .nv_RoomSublist2_headerContainer {
        margin-bottom: 0;
    }
.nv_RoomSublist2_headerContainer {
    height: 37px;
}
.nv_RoomSublist2_headerContainer .nv_RoomSublist2_sticky {
        background: #ebecee;
        border-top: 1px solid rgba(0, 0, 0, 0.05);
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        padding: 8px 43px 8px 26px;
        z-index: 2;
        position: relative;
        height: 37px;
    }
.nv_RoomSublist2_headerContainer .nv_RoomSublist2_sticky_active {
            position: absolute;
        }
.nv_RoomSublist2_headerContainer .nv_RoomSublist2_sticky_active.nv_RoomSublist2_sticky_showScroll {
            padding-right: 41px;
            margin-right: 4px;
            width: calc(100% - 4px);
        }
.nv_RoomSublist2_headerContainer .nv_RoomSublist2_sticky_active.nv_RoomSublist2_sticky_showScroll .nv_RoomSublist2_menuButton {
                right: 12px;
            }
.nv_RoomSublist2_headerContainer .nv_RoomSublist2_badgeContainer {
        position: absolute;
        top: 11px;
        left: 7px;
    }
.nv_RoomSublist2_headerContainer .nv_RoomSublist2_LabelContainer {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
    }
.nv_RoomSublist2_headerContainer .nv_RoomSublist2_Label {
        -ms-flex-negative: 0;
            flex-shrink: 0;
        margin-right: 9px;
        font-weight: 600;
        color: #000000;
    }
.nv_RoomSublist2_headerContainer .nv_RoomSublist2_menuButton {
        position: absolute;
        top: 6px;
        right: 16px;
        height: 27px;
        width: 27px;
    }
.nv_RoomSublist2_headerContainer .nv_RoomSublist2_menuButton::before {
            position: absolute;
            content: '';
            width: 100%;
            height: 100%;
            -webkit-mask-image: url(../../themes/nova-light/img/icon-more.9e7692b.svg);
                    mask-image: url(../../themes/nova-light/img/icon-more.9e7692b.svg);
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            -webkit-mask-size: contain;
                    mask-size: contain;
            -webkit-mask-position: center;
                    mask-position: center;
            background-color: #999999;
        }
.nv_RoomSublist2:first-child .nv_RoomSublist2_sticky {
    border-top: none;
}
.nv_RoomSublist2_sticky .nv_RoomSublist2_restRoomsSection, .nv_RoomSublist2_sticky .nv_RoomSublist2_badgeContainer {
        visibility: hidden;
    }
.nv_RoomSublist2_collapsed .nv_RoomSublist2_restRoomsSection, .nv_RoomSublist2_collapsed .nv_RoomSublist2_badgeContainer, .nv_RoomSublist2_sticky_active .nv_RoomSublist2_restRoomsSection, .nv_RoomSublist2_sticky_active .nv_RoomSublist2_badgeContainer {
        visibility: visible;
    }
.nv_RoomSublist2_restRoomsSection {
    min-width: 0;
    width: 100%;
    color: #000000;
    padding-right: 15px;
}
.nv_RoomSublist2_restRoomsSection > div {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
.nv_RoomSublist2_LabelContainer .nv_RoomSublist2_restRoomsSection, .nv_RoomSublist2_restRoomsSection_inconsiderable {
    color: rgba(208, 209, 216, 0.8);
}
.nv_RoomSublist2_footerContainer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    height: 38px;
    padding: 10px 15px 9px 97px;
}
.nv_RoomSublist2_moreButton {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    margin-left: auto;
}
.nv_RoomSublist2_badgeContainer .nv_RoomSublist2_backButton {
        height: 15px;
        width: 15px;
        visibility: visible;
    }
.nv_RoomSublist2_badgeContainer .nv_RoomSublist2_backButton::before {
            position: absolute;
            content: '';
            width: 15px;
            height: 15px;
            -webkit-mask-image: url(../../themes/nova-light/img/icon-dialog-back.f393c95.svg);
                    mask-image: url(../../themes/nova-light/img/icon-dialog-back.f393c95.svg);
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            -webkit-mask-size: contain;
                    mask-size: contain;
            -webkit-mask-position: center;
                    mask-position: center;
            background-color: #999999;
        }
.mx_RoomSublist2_contextMenu {
    padding: 20px 16px;
    width: 250px;
}
.mx_RoomSublist2_contextMenu hr {
        margin-top: 16px;
        margin-bottom: 16px;
        margin-right: 16px;
        border: 1px solid #f0f0f1;
        opacity: 0.1;
    }
.mx_RoomSublist2_contextMenu .mx_RoomSublist_contextMenu_title {
        font-size: 1.5rem;
        line-height: 2.0rem;
        font-weight: 600;
        margin-bottom: 4px;
    }
.mx_RoomSublist2_contextMenu .mx_RadioButton, .mx_RoomSublist2_contextMenu .mx_Checkbox {
        margin-top: 8px;
    }
.nv_RoomSublist2_forTag {
    padding: 0;
}
.nv_RoomSublist2_forTag .nv_RoomTile2:last-child {
        margin-bottom: 16px;
    }
.nv_RoomSublist2_forTag .nv_RoomSublist2_headerContainer {
        height: 45px;
    }
.nv_RoomSublist2_forTag .nv_RoomSublist2_sticky {
        height: 45px;
        border-bottom: 1px solid #e6e6e6;
        background-color: #f2f3f5;
        padding-left: 35px;
    }
.nv_RoomSublist2_forTag .nv_RoomSublist2_menuButton {
        top: auto;
    }
.nv_RoomSublist2_forTag .nv_RoomSublist2_badgeContainer {
        top: auto;
        left: 12px;
    }
.nv_RoomList2 {
    width: 100%;
    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-wrap: nowrap;
        flex-wrap: nowrap;
}
.nv_RoomTile2 {
    position: relative;
    padding: 4px 8px;
    padding-left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-radius: 8px;
}
.nv_RoomTile2:hover {
      background-color: rgba(208, 209, 216, 0.16);
      -webkit-transition-timing-function: cubic-bezier(0.17, 0.67, 0.83, 0.67);
              transition-timing-function: cubic-bezier(0.17, 0.67, 0.83, 0.67);
      -webkit-transition-duration: 0.3s;
              transition-duration: 0.3s;
    }
.nv_RoomTile2 .mx_DecoratedRoomAvatar {
      margin: 0 6px 0 0;
    }
.nv_RoomTile2.isUnread .nv_RoomTile2_content .nv_RoomTile2_nameContainer .nv_MessageTimestamp {
            color: #5280FF;
            font-weight: 700;
        }
.nv_RoomTile2.isMuted.isUnread .nv_RoomTile2_content .nv_RoomTile2_nameContainer .nv_MessageTimestamp {
                color: #5280FF;
                font-weight: 700;
            }
.nv_RoomTile2.isMuted .bp_RoomTile2_unreadCountCircle {
            background: #A1A4B0;

            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;


        }
.nv_RoomTile2.hasMentions .bp_RoomTile2_unreadCountCircle {
            background: #FF9B71;
            color: #995D44; 
        }
.nv_RoomTile2.hasMentions .nv_RoomTile2_content .nv_RoomTile2_nameContainer .nv_MessageTimestamp {
            color: #FF9B71;
        }
.nv_RoomTile2.nv_RoomTile2_favourite.isUnread .nv_RoomTile2_nameContainer::before, .nv_RoomTile2.nv_RoomTile2_favourite.hasMentions .nv_RoomTile2_nameContainer::before {
                display: inline-block;
                content: '';
                width: 8px;
                height: 8px;
                min-width: 8px;
                border-radius: 4px;                
                margin-right: 4px;
            }
.nv_RoomTile2.nv_RoomTile2_favourite.isUnread .nv_RoomTile2_nameContainer::after, .nv_RoomTile2.nv_RoomTile2_favourite.hasMentions .nv_RoomTile2_nameContainer::after {
                display: block;
                content: '';
                max-width: 2px;
                height: 1px;
                -webkit-box-flex: 1;
                    -ms-flex: 1;
                        flex: 1;
            }
.nv_RoomTile2.nv_RoomTile2_favourite.isUnread .nv_RoomTile2_nameContainer::before {
            background: #5280FF;
        }
.nv_RoomTile2.nv_RoomTile2_favourite.hasMentions .nv_RoomTile2_nameContainer::before {
            background: #FF9B71;
        }
.bp_RoomTile2_unreadCountCircle {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 16px;
    min-width: 16px;
    height: 16px;
    line-height: 16px;
    border-radius: 8px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    background: #4958F5;
    font-size: 12px;
    font-weight: 500;
    color: #fff;
}
.mx_DecoratedRoomAvatar {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  border: 3px solid transparent;
  border-radius: 50%;
  padding: 3px;
  margin: -6px;
}
.mx_DecoratedRoomAvatar.isFavorite {
    margin: 0;
  }
.mx_DecoratedRoomAvatar.isFavorite.isUnread {
        border-color: #5280FF;
    }
.mx_DecoratedRoomAvatar.isFavorite.isMuted {
        border-color: #d0d1d850;
    }
.mx_DecoratedRoomAvatar.isFavorite.hasMentions {
        border-color: #FF9B71;
    }
.mx_DecoratedRoomAvatar .nv_NotificationBadge {
    position: absolute;
    bottom: 3px;
    left: 6px;
    height: 8px;
    width: 8px;
    border-radius: 50%;
    background-color: #25262d;
}
.mx_DecoratedRoomAvatar .nv_NotificationBadge::before {
        height: 4px;
        width: 4px;
        z-index: 1;
    }
.nv_RoomTile2_active, .nv_RoomTile2_unread.nv_RoomTile2_active {
    background-color: #d0d1d829;
    color: #f0f0f1;
}
.nv_RoomTile2_active:hover, .nv_RoomTile2_unread.nv_RoomTile2_active:hover {
      background-color: #d0d1d829;
    }
.nv_RoomTile2_active .mx_DecoratedRoomAvatar .nv_NotificationBadge, .nv_RoomTile2_unread.nv_RoomTile2_active .mx_DecoratedRoomAvatar .nv_NotificationBadge {
        background-color: #d0d1d829;
    }
.nv_RoomTile2_selected .mx_DecoratedRoomAvatar::after {
        content: "";
        width: 42px;
        height: 42px;
        grid-column: 1;
        grid-row: 1;
        position: absolute;
        top: 0;
        left: 0;
        background-color: #00cc73;
        border-radius: 50%;
    }
.nv_RoomTile2_selected .mx_DecoratedRoomAvatar::before {
        content: "";
        width: 17px;
        height: 14px;
        grid-column: 1;
        grid-row: 1;
        -webkit-mask-image: url(../../img/feather-customised/check.5745b4e.svg);
                mask-image: url(../../img/feather-customised/check.5745b4e.svg);
        -webkit-mask-size: 100%;
                mask-size: 100%;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        position: absolute;
        top: 14px;
        left: 12px;
        background-color: #ffffff;
        z-index: 1;
    }
.nv_RoomTile2_selected .mx_DecoratedRoomAvatar .nv_BridgedIcon {
        z-index: 2;
    }
.nv_RoomTile2_bridgedIcon_selected {
    background-color: #00cc73;
    border-radius: 50%;
}
.nv_RoomTile2_bridgedIcon_selected::before {
        background-image: none !important;
        content: "";
        width: 17px;
        height: 14px;
        grid-column: 1;
        grid-row: 1;
        -webkit-mask-image: url(../../img/feather-customised/check.5745b4e.svg);
                mask-image: url(../../img/feather-customised/check.5745b4e.svg);
        -webkit-mask-size: 100%;
                mask-size: 100%;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        background-color: #ffffff;
        z-index: 1;
    }
.nv_RoomTile2_badgeContainer {
    position: absolute;
    left: 15px;
    top: 19px;
}
.bp_RoomTile2_contextButtonWrapper {
    background-color: rgba(219, 222, 253, 1);
    min-width: 16px;
    width: 16px;
    height: 16px;
    border-radius: 80px;
    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;
}
.bp_RoomTile2_contextButtonWrapper .bp_RoomTile2_contextButton {
        width: 16px;
        height: 16px;
        background-color: rgba(73, 88, 245, 1);
        -webkit-mask: url(../../themes/beeper/img/icon-more.a2cb038.svg);
                mask: url(../../themes/beeper/img/icon-more.a2cb038.svg);
        -webkit-mask-size: cover;
                mask-size: cover;
    }
.nv_RoomTile2_content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-width: 0;
    -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;
    width: 100%;
}
.nv_RoomTile2_content .nv_RoomTile2_nameContainer {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        max-height: 18px;
        line-height: 14px;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        max-width: 100%;
    }
.nv_RoomTile2_content .nv_RoomTile2_nameContainer .nv_RoomTile2_bridgedIcon {
            width: 16px;
            height: 16px;
            margin-left: 6px;
        }
.nv_RoomTile2_content .nv_RoomTile2_nameContainer .bp_RoomTile2_contextButtonWrapper {
          margin-left: 4px;
        }
.nv_RoomTile2_content .nv_RoomTile2_nameContainer .nv_RoomTile2_name {
            line-height: 2em;
            -webkit-box-flex: 1;
                -ms-flex: 1;
                    flex: 1;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }
.nv_RoomTile2_content .nv_RoomTile2_nameContainer .nv_RoomTile2_nameHasUnreadEvents {
                font-weight: 700;
            }
.nv_RoomTile2_content .nv_RoomTile2_nameContainer .nv_RoomTile2_nameFavourite {
                -webkit-box-flex: unset;
                    -ms-flex: unset;
                        flex: unset;
            }
.nv_RoomTile2_content .nv_RoomTile2_nameContainer .nv_RoomTile2_nameWithPreview > img {
                height: 8px;
                margin-left: 4px;
            }
.nv_RoomTile2_content .nv_RoomTile2_nameContainer .nv_MessageTimestamp {
            font-weight: 400;
            position: relative;
            margin-left: 8px;
            font-size: 10px;
            color: rgba(208, 209, 216, 0.8);
        }
.nv_RoomTile2_content .nv_RoomTile2_nameContainer .nv_RoomTile2_favouriteIcon, .nv_RoomTile2_content .nv_RoomTile2_nameContainer .nv_RoomTile2_inviteIcon {
            width: 12px;
            height: 12px;
            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;
            margin-left: 4px;
        }
.nv_RoomTile2_content .nv_RoomTile2_nameContainer .nv_RoomTile2_favouriteIcon::before, .nv_RoomTile2_content .nv_RoomTile2_nameContainer .nv_RoomTile2_inviteIcon::before {
                content: "";

                margin: 0;
                border-radius: 0;
                width: 12px;
                height: 12px;
                -webkit-mask-repeat: no-repeat;
                        mask-repeat: no-repeat;
                -webkit-mask-size: contain;
                        mask-size: contain;
                -webkit-mask-position: center;
                        mask-position: center;
            }
.nv_RoomTile2_content .nv_RoomTile2_nameContainer .nv_RoomTile2_favouriteIcon::before {
            -webkit-mask-image: url(../../themes/beeper/img/icon-star.1a6a9ba.svg);
                    mask-image: url(../../themes/beeper/img/icon-star.1a6a9ba.svg);
            background-color: #D0D1D8;
            width: 8px;
            height: 8px;
        }
.nv_RoomTile2_content .nv_RoomTile2_nameContainer .nv_RoomTile2_inviteIcon::before {
            -webkit-mask-image: url(../../themes/beeper/img/icon-invite.23b6141.svg);
                    mask-image: url(../../themes/beeper/img/icon-invite.23b6141.svg);
            background-color: #F69139;
        }
.nv_RoomTile2_content .nv_RoomTile2_nameContainer .nv_RoomTile2_favouriteIcon {
            -webkit-box-flex: 1;
                -ms-flex: 1;
                    flex: 1;
            -webkit-box-pack: start;
                -ms-flex-pack: start;
                    justify-content: flex-start;
        }
.nv_RoomTile2_content .nv_RoomTile2_favouriteIcon {
        width: 8px;
        height: 8px;
    }
.nv_RoomTile2_content .nv_RoomTile2_messagePreview {
        overflow: hidden;
        color: rgba(208, 209, 216, 0.8);
        font-size: 12px;
        line-height: 14px;
        width: 100%;
        text-overflow: ellipsis;
        white-space: nowrap;
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        margin-left: 4px;
    }
.nv_RoomTile2_content .nv_RoomTile2_messagePreview > img {
        height: 10px;
        margin-right: 2px;
    }
.nv_RoomTile2_smallRow {
    padding: 10px 12px;
}
.nv_RoomTile2_smallRow .nv_RoomTile2_content {
        margin: 3px 0 3px 14px;
        -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;
        overflow: hidden;
    }
.nv_RoomTile2_smallRow .nv_RoomTile2_nameWithPreview > img {
            height: 8px;
            margin-left: 4px;
        }
.nv_RoomTile2_smallRow .nv_BridgedIcon {
        -webkit-filter: none;
                filter: none;
        position: static;
        -ms-flex-negative: 0;
            flex-shrink: 0;
    }
.nv_RoomTile2_smallRow .nv_RoomTile2_badgeContainer {
        left: 7px;
        top: 7px;
    }
.mx_RoomTile2_contextMenu .mx_IconizedContextMenu_icon {
    position: relative;
    width: 16px;
    height: 16px;
}
.mx_RoomTile2_contextMenu .mx_IconizedContextMenu_icon::before {
        content: '';
        width: 16px;
        height: 16px;
        position: absolute;
        -webkit-mask-position: center;
                mask-position: center;
        -webkit-mask-size: contain;
                mask-size: contain;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        background: #f0f0f1;
    }
.nv_RoomTile2_contextMenu_activeRow.mx_AccessibleButton, .nv_RoomTile2_contextMenu_activeRow .mx_AccessibleButton, .nv_RoomTile2_contextMenu_activeRow .mx_IconizedContextMenu_label {
        color: #4958F5 !important;
    }
.nv_RoomTile2_contextMenu_activeRow .mx_IconizedContextMenu_icon::before {
        background-color: #4958F5;
    }
.nv_RoomTile2_iconStar::before {
    -webkit-mask-image: url(../../themes/beeper/img/icon-heart.b356070.svg);
            mask-image: url(../../themes/beeper/img/icon-heart.b356070.svg);
}
.nv_RoomTile2_iconArchive::before {
    -webkit-mask-image: url(../../img/beeper/low-priority16.0b59810.svg);
            mask-image: url(../../img/beeper/low-priority16.0b59810.svg);
}
.nv_RoomTile2_iconUnarchive::before {
    -webkit-mask-image: url(../../img/beeper/inbox16.410dd9b.svg);
            mask-image: url(../../img/beeper/inbox16.410dd9b.svg)
}
.nv_RoomTile2_iconPin::before {
    -webkit-mask-image: url(../../themes/beeper/img/icon-pin.2d50a6a.svg);
            mask-image: url(../../themes/beeper/img/icon-pin.2d50a6a.svg);
}
.nv_RoomTile2_iconCopyLink::before {
    -webkit-mask-image: url(../../img/element-icons/link.8f4b1fc.svg);
            mask-image: url(../../img/element-icons/link.8f4b1fc.svg);
}
.nv_RoomTile2_iconSettings::before {
    -webkit-mask-image: url(../../img/element-icons/settings.6b381af.svg);
            mask-image: url(../../img/element-icons/settings.6b381af.svg);
}
.nv_RoomTile2_iconSignOut::before {
    -webkit-mask-image: url(../../img/element-icons/leave.bb917e7.svg);
            mask-image: url(../../img/element-icons/leave.bb917e7.svg);
}
.nv_RoomTile_iconBellCrossed::before {
    -webkit-mask-image: url(../../themes/beeper/img/icon-mute.4ebd80b.svg);
            mask-image: url(../../themes/beeper/img/icon-mute.4ebd80b.svg);
}
.nv_RoomTile_iconCheckmark::before {
    -webkit-mask-image: url(../../themes/beeper/img/icon-bubble-tick.f8a6e5b.svg);
            mask-image: url(../../themes/beeper/img/icon-bubble-tick.f8a6e5b.svg);
    -webkit-mask-size: 20px !important;
            mask-size: 20px !important;
}
.nv_RoomTile_iconMarkUnread::before {
    -webkit-mask-image: url(../../themes/beeper/img/icon-mark-unread.b47799a.svg);
            mask-image: url(../../themes/beeper/img/icon-mark-unread.b47799a.svg);
    -webkit-mask-size: 20px !important;
            mask-size: 20px !important;
}
.nv_RoomTile2_iconUnstar::before {
    -webkit-mask-image: url(../../themes/beeper/img/icon-heart-cross.9e598b6.svg);
            mask-image: url(../../themes/beeper/img/icon-heart-cross.9e598b6.svg);
}
.nv_RoomTile2_contextMenu_redRow .nv_AccessibleButton, .nv_RoomTile2_contextMenu_redRow .mx_IconizedContextMenu_label {
        color: #d80915 !important;
    }
.nv_RoomTile2_contextMenu_redRow .mx_IconizedContextMenu_icon::before {
        background-color: #d80915;
    }
.nv_RoomTile2_iconDelete::before {
    -webkit-mask-image: url(../../img/icon-trash.fe3f35b.svg);
            mask-image: url(../../img/icon-trash.fe3f35b.svg);
}
.nv_RoomTile_iconUnpin::before {
    -webkit-mask-image: url(../../themes/beeper/img/icon-unpin.ec472da.svg);
            mask-image: url(../../themes/beeper/img/icon-unpin.ec472da.svg);
    padding-top: 1px;
}
.nv_RoomTile_iconPin::before {
    -webkit-mask-image: url(../../themes/beeper/img/icon-pin-upright.047b9ec.svg);
            mask-image: url(../../themes/beeper/img/icon-pin-upright.047b9ec.svg);
    padding-top: 1px;
}
.nv_RoomTile_iconChecked::before {
    -webkit-mask-image: url(../../themes/beeper/img/icon-checkmark.34b1d4a.svg);
            mask-image: url(../../themes/beeper/img/icon-checkmark.34b1d4a.svg);
}
.nv_RoomTile_iconUnmute::before {
    -webkit-mask-image: url(../../themes/beeper/img/icon-unmute.cb3aea8.svg);
            mask-image: url(../../themes/beeper/img/icon-unmute.cb3aea8.svg);
}
.nv_RoomTile2_dm .mx_BaseAvatar_image {
    border-radius: 50%;
}
.nv_RoomTile2_invite {
}
.nv_RoomTile2_favourite {
    max-width: 120px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 0;
    padding: 6px;
    border-radius: 8px !important;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.nv_RoomTile2_favourite .nv_NotificationBadge {
        position: absolute;
        right: 2px;
        top: 2px;
    }
.nv_RoomTile2_favourite .bp_RoomTile2_contextButtonWrapper {
        position: absolute;
        z-index: 1;
        left: 0px;
        top: 4px;

    }
.nv_RoomTile2_favourite .mx_BaseAvatar_image {
        border-radius: 50%;
    }
.nv_RoomTile2_favourite .mx_BaseAvatar_initial {
        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;
    }
.nv_RoomTile2_favourite .nv_RoomTile2_content {
        margin-top: 5px;
        margin-left: 0;
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
    }
.nv_RoomTile2_favourite .nv_RoomTile2_nameContainer {
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }
.nv_RoomTile2_favourite .nv_RoomTile2_nameContainer .nv_NotificationBadge {
            width: auto;
            height: auto;
        }
.nv_RoomTile2_favourite .nv_RoomTile2_nameContainer .nv_NotificationBadge::before {
                width: 8px;
                height: 8px;
                margin: 0;
                margin-right: 4px;
            }
.nv_RoomTile2_favourite .nv_RoomTile2_nameContainer .nv_RoomTile2_name {
            font-size: 12px;
            line-height: inherit;
            text-align: center;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
        }
.nv_NotificationBadge {
    width: 15px;
    height: 15px;
    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;
}
.nv_NotificationBadge::before {
        border-radius: 50%;
        content: "";
        width: 9px;
        height: 9px;
        margin: 2px;
        background: #D0D1D8;
    }
.nv_NotificationBadge_unread::before, .nv_NotificationBadge_unread:hover::before {
        background: #4958F5;
    }
.nv_NotificationBadge_mention::before, .nv_NotificationBadge_mention:hover::before {
        background: #FF6161;
    }
.bp_Button {
    /* align images in buttons (eg spinners) */
    vertical-align: middle;
    border: 0px;
    border-radius: 28px;
  
    /* font-family: Sofia-Pro; */
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
    width: auto;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    display: inline-block;
    outline: none;
    padding: 6px 24px;

    cursor: default;
}
.bp_ButtonPrimary {
  color: #fff;
  background: linear-gradient(120deg, #A93FE9 12px, #4958F5 502px);
}
.bp_ButtonPrimary:hover {
    -webkit-box-shadow: 0px 4px 16px rgba(133, 73, 238, 0.24), 0px 2px 12px rgba(130, 74, 239, 0.24);
            box-shadow: 0px 4px 16px rgba(133, 73, 238, 0.24), 0px 2px 12px rgba(130, 74, 239, 0.24);
  }
.bp_ButtonPrimary.bp_ButtonActive {
    background: linear-gradient(120deg, #A93FE9 12px, #4958F5 502px);
  }
.bp_ButtonPrimary.bp_ButtonError {
    background: #E0474F;
  }
.bp_ButtonPrimary.bp_ButtonError:hover {
      -webkit-box-shadow: none;
              box-shadow: none;
    }
.bp_ButtonPrimary.bp_ButtonError.bp_ButtonActive {
      background: #993A3A;
    }
.bp_ButtonPrimary.bp_ButtonDisabled {
    background: #76767B;
    color: #4F5056;
    cursor: not-allowed;
  }
.bp_ButtonPrimary.bp_ButtonDisabled:hover {
      -webkit-box-shadow: none;
              box-shadow: none;
    }
.bp_ButtonSecondary {
  border-color: #454854;
  border-width: 2px !important;
  border-style: solid !important;

  font-weight: 400;

  padding: 2px 22px;

  background: transparent;
  color: #f0f0f1;
  font-size: 14px;
}
.bp_ButtonSecondary:hover {
    -webkit-box-shadow: none;
            box-shadow: none;
    -webkit-filter: drop-shadow(0px 2px 12px rgba(37, 38, 45, 0.24));
            filter: drop-shadow(0px 2px 12px rgba(37, 38, 45, 0.24))
  }
.bp_ButtonSecondary.bp_ButtonActive {
    border-color: #2E3038;
  }
.bp_ButtonSecondary.bp_ButtonError {
    border-color: #E0474F;
  }
.bp_ButtonSecondary.bp_ButtonError.bp_ButtonActive {
      border-color: #993A3A;
    }
.bp_ButtonSecondary.bp_ButtonDisabled {
    color: #202127;
    border-color: #25262D;
    cursor: not-allowed;
  }
.bp_ButtonSecondary.bp_ButtonDisabled:hover {
      -webkit-box-shadow: none;
              box-shadow: none;
      -webkit-filter: none;
              filter: none;
    }
.bp_ButtonSecondary.bp_ButtonBlueBorder {
    border-color: #4958F5;
  }
.bp_ButtonSecondary.bp_ButtonBlueBorder.bp_ButtonActive {
      border-color: #2C3593;
    }
.bp_ButtonSecondary.bp_ButtonBlueBorder.bp_ButtonDisabled {
      border-color: #3A46C4;
      background-color: rgba(0,0,0,0.2);
    }
/************************************************************************/
/************************************************************************/
/************************************************************************/
/************************************************************************/
.bp_Button2 {
    position: relative;
    /* align images in buttons (eg spinners) */
    vertical-align: middle;
    border: 0px;
    border-radius: 28px;
  
    /* font-family: Sofia-Pro; */
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    width: auto;
    min-height: 40px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    display: inline-block;
    outline: none;
    padding: 6px 24px;

    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;
    grid-gap: 0.5rem;

    cursor: default;
}
.bp_Button2.loading {
      opacity: 0.6;
    }
.bp_Button2 .bp_Button2_text.loading {
      opacity: 0;
    }
.bp_Button2 .bp_icon div {
      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;
    }
.bp_Button2 .bp_Button2_spinner {
      position: absolute;
      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;
    }
.bp_Button2 .bp_Button2_spinner.bp_Button2_spinner--relative {
        position: relative;
        grid-gap: 0.75rem;
      }
.bp_Button2Primary {
  background: linear-gradient(120deg, #a93fe9 12px, #4958f5 502px);
  color: #F7F7F7;
  border: 0px solid transparent;
}
.bp_Button2Primary:hover {
    border-color: transparent;
    color: #F7F7F7;
    -webkit-box-shadow: 0px 4px 16px rgba(133, 73, 238, 0.24), 0px 2px 12px rgba(130, 74, 239, 0.24);
            box-shadow: 0px 4px 16px rgba(133, 73, 238, 0.24), 0px 2px 12px rgba(130, 74, 239, 0.24);
  }
.bp_Button2Primary.error {
      border-color: #CE484F;
      background: #CE484F;
      color: #F7F7F7;
  }
.bp_Button2Primary.error:hover {
        -webkit-box-shadow: none;
                box-shadow: none;
      }
.bp_Button2Primary.disabled {
      color: #4F5056;
      background: #76767B;
      border-color: #4F5056;
      cursor: not-allowed;
  }
.bp_Button2Primary.disabled:hover {
        -webkit-box-shadow: none;
                box-shadow: none;
      }
.bp_Button2Primary.small {
      border-width: 1px;
      padding: 8px 16px;
      font-size: 12px;
      height: 32px;
  }
.bp_Button2Secondary {
  background: transparent;
  color: #D2D2D4;
  border: 2px solid #68686D;
}
.bp_Button2Secondary:hover {
    border-color: #949598;
    color: #C3C4C5;
  }
.bp_Button2Secondary.error {
      border-color: #E04950;
  }
.bp_Button2Secondary.disabled {
      color: #4F5056;
      border-color: #4F5056;
      cursor: not-allowed;
  }
.bp_Button2Secondary.small {
      border-width: 1px;
      padding: 8px 16px;
      font-size: 12px;
      height: 32px;
  }
.bp_ButtonPurple {
    background: linear-gradient(120deg, #A93FE9 12px, #4958F5 502px);
    color: #F7F7F7;
    border: 2px solid transparent;
}
.bp_ButtonPurple:hover {
        color: #F7F7F7;
        border-color: transparent;
        -webkit-box-shadow: 0px 4px 16px rgba(133, 73, 238, 0.24), 0px 2px 12px rgba(130, 74, 239, 0.24);
                box-shadow: 0px 4px 16px rgba(133, 73, 238, 0.24), 0px 2px 12px rgba(130, 74, 239, 0.24);
    }
.bp_ButtonPurple.disabled {
        background-color: #76767B;
        color: #4F5056;
        border-color: #4F5056;
        cursor: not-allowed;
    }
.bp_TextButton {
  color:#4958F5;
  -webkit-text-decoration-color: #4958F5;
          text-decoration-color: #4958F5;
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
  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;
  height: 40px;
}
.bp_TextButton:hover {
    -webkit-text-decoration-line: underline;
            text-decoration-line: underline;
  }
.bp_TextButton.disabled {
    color: #4F5056;
  }
.bp_TextButton.disabled:hover {
      -webkit-text-decoration-line: none;
              text-decoration-line: none;
    }
.textButtonHover {
    color:#fff;
    -webkit-text-decoration-color: #fff;
            text-decoration-color: #fff;
    -webkit-text-decoration-line: none;
            text-decoration-line: none;
    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;
}
.textButtonHover:hover {
      -webkit-text-decoration-line: underline;
              text-decoration-line: underline;
    }
.textButtonHover.disabled {
      color: #4F5056;
    }
.textButtonHover.disabled:hover {
        -webkit-text-decoration-line: none;
                text-decoration-line: none;
      }
.bp_Authentication .bp_TextButton {
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      color: #fff;
      background-color: #ffffff10;
      padding: 4px 6px;
      width: -webkit-fit-content;
      width: -moz-fit-content;
      width: fit-content;
      height: -webkit-fit-content;
      height: -moz-fit-content;
      height: fit-content;
      border-radius: 6px;
  }
.bp_Authentication .bp_TextButton:hover {
          background-color: #ffffff15;
          text-decoration: none;
      }
.bp_Authentication .bp_TextButton:active {
          background-color: #ffffff25;
      }
.bp_Spinner {
    display: inline-block;
    border-top-color: #E3E8F0;
    border-right-color: #E3E8F0;
    border-style: solid;
    border-radius: 99999px;
    border-width: 1px;
    border-bottom-color: #737D8C;
    border-left-color: #737D8C;
    -webkit-animation: 1s linear 0s infinite normal none running spin;
            animation: 1s linear 0s infinite normal none running spin;
    width: var(--spinner-size);
    height: var(--spinner-size);
    --spinner-size: 3rem;
}
@keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
                transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
                transform: rotate(360deg);
    }
}
.bp_Divider {
    opacity: 0.4;
    border: 0;
    border-bottom-width: 1px;
    width: 100%;
    border-color: #5C5D62;
    border-style: solid;
    margin: 0;
    height: 0;
}
.bp_TextInput {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 5px 12px !important;
  outline: none;
  border: 0px;
  color: #F8F8FB;
  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;
}
.bp_TextInput:not(.bp_TextInput_bordered) {
    background-color: #454854;
    border-radius: 50px;
  }
.bp_TextInput.bp_TextInput_bordered {
    border-radius: 8px;
    border: 1px solid #A1A4B0;
  }
.bp_TextInput.bp_TextInput_bordered:focus {
      border: 1px solid #4958F5;
    }
.bp_TextInput.bp_TextInput_bordered.error {
      border: 1px solid #E0474F;
    }
.bp_TextInput {

  color-scheme: dark;
}
/******************************************/
/******************************************/
/******************************************/
.bp_TextInput2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  min-width: 0;
  position: relative;
  margin: 1.5em 0 1em 0;
  border-radius: 12px;
  -webkit-transition: border-color 0.25s;
  transition: border-color 0.25s;
  border: 2px solid rgba(231, 231, 231, 0.2);

  background-color: #25262d;
}
.bp_TextInput2.bp_TextInput2_EvenMargins {
    margin: 1.5em 0;
  }
.bp_TextInput2.error {
      border-color: #E04950 !important;
  }
.bp_TextInput2 input {
    font-family: inherit;
    font-weight: normal;
    font-size: 1.4rem;
    border: none;
    border-radius: 12px;
    padding: 10px 16px;
    color: #f0f0f1;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    min-width: 0;
}
.bp_TextInput2:focus-within :not(.error) {
  border-color: #238CF5;
}
.bp_TextInput2 input:focus {
    outline: 0;
}
.bp_TextInput2 input::-webkit-input-placeholder {
    -webkit-transition: color 0.25s ease-in 0s;
    transition: color 0.25s ease-in 0s;
    color: transparent;
}
.bp_TextInput2 input::-moz-placeholder {
    -moz-transition: color 0.25s ease-in 0s;
    transition: color 0.25s ease-in 0s;
    color: transparent;
}
.bp_TextInput2 input:-ms-input-placeholder {
    -ms-transition: color 0.25s ease-in 0s;
    transition: color 0.25s ease-in 0s;
    color: transparent;
}
.bp_TextInput2 input::-ms-input-placeholder {
    -ms-transition: color 0.25s ease-in 0s;
    transition: color 0.25s ease-in 0s;
    color: transparent;
}
.bp_TextInput2 input::placeholder {
    -webkit-transition: color 0.25s ease-in 0s;
    transition: color 0.25s ease-in 0s;
    color: transparent;
}
.mx_Field input:placeholder-shown:focus::-webkit-input-placeholder {
    -webkit-transition: color 0.25s ease-in 0.1s;
    transition: color 0.25s ease-in 0.1s;
    color: #888;
}
.mx_Field input:placeholder-shown:focus::-moz-placeholder {
    -moz-transition: color 0.25s ease-in 0.1s;
    transition: color 0.25s ease-in 0.1s;
    color: #888;
}
.mx_Field input:placeholder-shown:focus:-ms-input-placeholder {
    -ms-transition: color 0.25s ease-in 0.1s;
    transition: color 0.25s ease-in 0.1s;
    color: #888;
}
.mx_Field input:placeholder-shown:focus::-ms-input-placeholder {
    -ms-transition: color 0.25s ease-in 0.1s;
    transition: color 0.25s ease-in 0.1s;
    color: #888;
}
.mx_Field input:-moz-placeholder-shown:focus::placeholder {
    -moz-transition: color 0.25s ease-in 0.1s;
    transition: color 0.25s ease-in 0.1s;
    color: #888;
}
.mx_Field input:-ms-input-placeholder:focus::placeholder {
    -ms-transition: color 0.25s ease-in 0.1s;
    transition: color 0.25s ease-in 0.1s;
    color: #888;
}
.mx_Field input:placeholder-shown:focus::placeholder {
    -webkit-transition: color 0.25s ease-in 0.1s;
    transition: color 0.25s ease-in 0.1s;
    color: #888;
}
.bp_TextInput2 label {
  -webkit-transition:
      font-size 0.25s ease-out 0.1s,
      color 0.25s ease-out 0.1s,
      opacity 0.25s ease-out 0.1s,
      top 0.25s ease-out 0.1s,
      margin-left 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,
      opacity 0.25s ease-out 0.1s,
      top 0.25s ease-out 0.1s,
      margin-left 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,
      opacity 0.25s ease-out 0.1s,
      top 0.25s ease-out 0.1s,
      margin-left 0.25s ease-out 0.1s,
      transform 0.25s ease-out 0.1s;
  transition:
      font-size 0.25s ease-out 0.1s,
      color 0.25s ease-out 0.1s,
      opacity 0.25s ease-out 0.1s,
      top 0.25s ease-out 0.1s,
      margin-left 0.25s ease-out 0.1s,
      transform 0.25s ease-out 0.1s,
      -webkit-transform 0.25s ease-out 0.1s;
  color: #f0f0f1;
  opacity: .6;
  background-color: transparent;
  font-size: 1.4rem;
  -webkit-transform: translateY(0);
          transform: translateY(0);
  position: absolute;
  left: 0px;
  margin: 7px 0 0 16px;
  padding: 2px;
  pointer-events: none;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: calc(100% - 20px);
}
.bp_TextInput2 input:not(:-moz-placeholder-shown) + label {
    font-size: 1.0rem;
    transform: translateY(-26px);
    pointer-events: initial;
}
.bp_TextInput2 input:not(:-ms-input-placeholder) + label {
    font-size: 1.0rem;
    transform: translateY(-26px);
    pointer-events: initial;
}
.bp_TextInput2_labelAlwaysTopLeft label, .bp_TextInput2 input:focus + label, .bp_TextInput2 input:not(:placeholder-shown) + label {
    font-size: 1.0rem;
    -webkit-transform: translateY(-26px);
            transform: translateY(-26px);
    pointer-events: initial;
}
.bp_TextInput2 input:focus + label {
    opacity: 1;
}
.bp_TextInput2 input:disabled, .bp_TextInput2 input:disabled + label {
    color: #888;
    opacity: .5;
}
.bp_Icon {

    margin-top: 3px;
}
.bp_Icon.blue {
      fill: #4D82EE;
    }
.bp_Icon.red {
      fill: #E0474F;
    }
.bp_Icon.yellow {
      fill: #FFCE51;
    }
.bp_Icon.gray {
      fill: #76767b;
    }
.bp_Icon.green {
      fill:#00C853;
    }
.bp_card {
    background-color: hsla(216, 21%, 14%, 1);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(0.01%, rgba(19, 27, 58, 0)), to(rgba(19, 27, 58, 0.4))), #32384E;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(19, 27, 58, 0) 0.01%, rgba(19, 27, 58, 0.4) 100%), #32384E;
    color: #f0f0f1;
    position: relative;
    -webkit-box-shadow: 2px 15px 30px 0 rgb(0 0 0 / 48%);
            box-shadow: 2px 15px 30px 0 rgb(0 0 0 / 48%);
    border-radius: 20px;
    padding: 24px;
}
.bp_card-content {
    overflow: auto;
    height: 100%;
    width: 100%;
}
.bp_card-small {
    width: 300px;
    height: 200px
}
.bp_card-medium {
    width: 500px;
    height: 400px;
}
.bp_card-large {
    width: 800px;
    height: 650px;
}
.bp_card-dynamic {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
}
.bp_Checkbox input {
        display: none;
    }
.bp_Checkbox .checkmark {
      width: 16px;
      height: 16px;
      border-radius: 4px;
      border: 2px solid #76767B;
      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;
      -webkit-box-flex: 0;
          -ms-flex: 0 0 auto;
              flex: 0 0 auto;
    }
.bp_Checkbox .checkmark .bp_icon {
          display: none;
      }
.bp_Checkbox input:checked ~ .checkmark {
      border-color: #4D82EE;
    }
.bp_Checkbox input:checked ~ .checkmark .bp_icon {
        display: block;
      }
.bp_Checkbox label {
        border: 0.25px solid rgba(208, 209, 216, 0.16);
        border-radius: 8px;
        padding: 16px;
        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;
        max-width: 400px;
    }
.bp_Checkbox label.selected {
            border-color: #4D82EE;
        }
.bp_Select_wrapper input {
      display: none;
  }
.bp_Select_wrapper label {
      cursor: default;
      position: relative;
  }
.bp_Select_wrapper.grid {
    display: grid;
    grid-template-columns: 144px 144px 144px 144px;
    grid-gap: 12px;
  }
.bp_Select_wrapper .checkmark {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    border: 2px solid #76767B;
    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;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
  }
.bp_Select_wrapper .checkmark .bp_icon {
        display: none;
    }
.bp_Select_wrapper .radio {
    width: 18px;
    height: 18px;
    background-color: #F8F8FB;
    border: 2px solid #A1A4B0;
    border-radius: 100%;
    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;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
  }
.bp_Select_wrapper .radio .bp_icon {
        display: none;
    }
.bp_Select_wrapper input:checked ~ .checkmark {
    border-color: #4D82EE;
  }
.bp_Select_wrapper input:checked ~ .checkmark .bp_icon {
      display: block;
    }
.bp_Select_wrapper input:checked ~ .radio .bp_icon {
      display: block;
    }
.bp_Select {
    border: 0.25px solid rgba(208, 209, 216, 0.16);
    border-radius: 8px;
    padding: 16px;
    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;
}
.bp_Select.selected {
        border-color: #4D82EE;
        background-color: #C8D4E715;
    }
.bp_Select.disabled {
        background-color: #2e3038;
        opacity: .5;
        cursor: not-allowed;
    }
.bp_Select.center {
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }
/********** Deprecated */
.bp-radio {
  background-color: #25262d;
  border: 0.25px solid rgba(208, 209, 216, 0.16);
  border-radius: 8px;
  padding: 16px;
  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;
  max-width: 400px;
}
.bp-radio.bp-radio-disabled {
    background-color: #2e3038;
  }
.mx_MatrixChat_wrapper--windows .bp_LeftPanel, .mx_MatrixChat_wrapper--linux .bp_LeftPanel {
        background-color: #202020;
    }
.mx_MatrixChat_wrapper--windows .bp_LeftPanel.bp_LeftPanel--transparent, .mx_MatrixChat_wrapper--linux .bp_LeftPanel.bp_LeftPanel--transparent {
            background-color: hsl(0deg 0% 100% / 0%);
            background-color: var(--left-panel-bg);
        }
.bp_LeftPanel {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 384px;
    min-width: 247px;
    max-width: 624px;
    background-color: #202020;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    padding: 0;
    overflow: hidden;
    }
.bp_LeftPanel.bp_LeftPanel--transparent {
        background-color: hsl(0deg 0% 100% / 0%);
        background-color: var(--left-panel-bg);
    }
.bp_LeftPanel .bp_LeftPanel_contentWrapper {
        position: relative;
        width: 100%;
        height: 100%;
        -webkit-transition: -webkit-transform 100ms ease;
        transition: -webkit-transform 100ms ease;
        transition: transform 100ms ease;
        transition: transform 100ms ease, -webkit-transform 100ms ease;
        -webkit-transform: translateX(0px);
                transform: translateX(0px);
    }
.bp_LeftPanel .bp_LeftPanel_contentWrapper--search {
        -webkit-transition: -webkit-transform 75ms ease;
        transition: -webkit-transform 75ms ease;
        transition: transform 75ms ease;
        transition: transform 75ms ease, -webkit-transform 75ms ease;
        -webkit-transform: translateX(-100%);
                transform: translateX(-100%);
        -webkit-transform: translateX(var(--offset, -100%));
                transform: translateX(var(--offset, -100%));
    }
.bp_LeftPanel .bp_LeftPanel_content {
        width: 100%;
        height: 100%;
        position: absolute;
        inset: 0;
        overflow: auto;
    }
.bp_LeftPanel .bp_LeftPanel_content::-webkit-scrollbar-thumb {
            display: none;
        }
.bp_LeftPanel .bp_LeftPanel_content:first-of-type {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column
        }
.bp_LeftPanel .bp_LeftPanel_content:nth-of-type(2), .bp_LeftPanel .bp_LeftPanel_content:last-of-type {
            margin-left: -10px;
            width: calc(100% + 6px);
        }
.bp_LeftPanel .bp_LeftPanel_content:nth-of-type(2) {
            -webkit-transform: translateX(100%);
                    transform: translateX(100%);
        }
.bp_LeftPanel .bp_LeftPanel_content:last-of-type {
            -webkit-transform: translateX(200%);
                    transform: translateX(200%);
        }
.bp_LeftPanel .flex-center {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        height: 12px;
    }
.bp_LeftPanel ._LeftPanel-action {
        cursor: default;
        width: 15px;
        padding: 0px 5px;
        display: inline-block;
        height: 10px;
        color: hsla(215, 21%, 76%, 0.33);
    }
.bp_LeftPanel ._LeftPanel-action .bp_icon {
            height: 22px;
        }
.bp_LeftPanel .bp_ProtocolsToggle .icon {
        background-color: #949598;
    }
.bp_LeftPanel .rooms {
        overflow-anchor: none;
        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;
        overflow-y: scroll;
        overflow-x: hidden;
        padding: 0;
    }
.bp_LeftPanel .rooms::-webkit-scrollbar {
            display: none;
        }
.bp_LeftPanel .rooms_actions {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            position: relative;
            padding: 5px 18px;
        }
.bp_LeftPanel .rooms_actions .mx_AccessibleButton {
                position: absolute;
                right: 0;
            }
.bp_LeftPanel .rooms_filters {
            -webkit-box-align: baseline;
                -ms-flex-align: baseline;
                    align-items: baseline;
            grid-gap: 10px;
            gap: 10px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
        }
.bp_LeftPanel .rooms .unread_hint {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            padding: 8px;
            text-align: center;
            color: rgba(255, 255, 255, 0.5);
            color: rgba(var(--base), 0.5);
            font-size: 12px;
            height: 25px;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            padding: 20px;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
        }
.bp_LeftPanel .rooms_subtitle-container {
            background: #3f4047;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                    justify-content: space-between;
            -webkit-box-align: end;
                -ms-flex-align: end;
                    align-items: flex-end;
            margin-bottom: 0;
            margin-bottom: 0;
            width: 100%;
            z-index: 11;
            min-height: 20px;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            padding-right: 10px;
            position: sticky;
            top: -0.5px;
            top: var(--top, -0.5px);
            margin-left: -17px;
        }
.bp_LeftPanel .rooms_subtitle {
            color: rgb(255, 255, 255);
            color: rgb(var(--base));
            font-size: 14px;
            font-weight: 700;
            margin-left: 0;
            margin-bottom: 0;
            cursor: default;
            margin-top: 0;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            grid-gap: 5px;
            gap: 5px;
            opacity: 1;
            padding-left: 38px;
        }
.bp_LeftPanel .rooms_subtitle-collapse {
                padding: 0 5px;
                opacity: 0;
            }
.bp_LeftPanel .rooms_mark-read {
            background-image: url(../../img/icons-sweep.0e45a65.svg);
            background-size: 15px;
            width: 15px;
            background-repeat: no-repeat;
            height: 11px;
            -ms-flex-item-align: end;
                align-self: flex-end;
            cursor: default;
            padding: 5px;
            display: inline-block;
            background-position: center;
        }
.bp_LeftPanel .rooms .rooms_scroll-container {
            position: relative;
            overflow: auto;
            overflow-x: hidden;
            margin-right: -6px;
            height: 100%;
            padding-bottom: 64px;
        }
.bp_LeftPanel .rooms .rooms_scroll-container::-webkit-scrollbar {
                display: none;
            }
.bp_LeftPanel .rooms .unread.rooms__section > .bp_RoomTile:first-child .outline {
                        margin: 4px 4px 0px 4px;
                    }
.bp_LeftPanel .rooms .unread.rooms__section > .bp_RoomTile:last-child:not(:only-child) .outline {
                        margin: 0px 4px 4px 4px;
                    }
.bp_LeftPanel .rooms .unread.rooms__section > .bp_RoomTile .outline {
                    margin: 0px 4px;
                }
.bp_LeftPanel .rooms .favourites {
            margin-top: 0;
            margin-bottom: 0;
            z-index: 8;
            margin-right: 0;
            position: relative;
            padding: 0 10px;
            border-radius: 10px;
            position: sticky;
            top: 0;
            z-index: 8;
        }
.bp_LeftPanel .rooms .favourites.rooms__section {
                background-color: transparent;
            }
.bp_LeftPanel .rooms .favourites__icons {
                margin-right: -6px;
            }
.bp_LeftPanel .rooms .favourites__row {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                width: 100%;
                -webkit-box-pack: space-evenly;
                    -ms-flex-pack: space-evenly;
                        justify-content: space-evenly;
                grid-gap: 12px;
                gap: 12px;
            }
.bp_LeftPanel .rooms .favourites__tiles {
                -webkit-box-flex: 1;
                    -ms-flex: 1;
                        flex: 1;
                grid-gap: 0px;
                gap: 0px;
                grid-row-gap: 12px;
                row-gap: 12px;
                overflow: hidden;
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -ms-flex-wrap: wrap;
                    flex-wrap: wrap;
                padding: 10px;
                border-radius: 10px;
                -ms-flex-pack: distribute;
                    justify-content: space-around;
                padding-left: 0;
            }
.bp_LeftPanel .unread.rooms__section .bp_RoomTile.active .outline {
                    background: #3f4047;
                }
.bp_LeftPanel .unread.rooms__section .bp_RoomTile:focus .outline {
                    background: #3f4047;
                }
.bp_LeftPanel .rooms__section {
            border-radius: 10px;
            background-color: #25262d;
        }
.bp_LeftPanel .rooms__section.unread {
                background-color: #32343E;
            }
.bp_invisibleDraggableHeader {
    -webkit-user-select: none;
    -webkit-app-region: drag;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 50px;
    z-index: 1;
}
.bp_Header {
    -webkit-user-select: none;
    -webkit-app-region: drag;
    margin-top: 10px;
    height: 44px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 0 10px;
}
.bp_Header .userAvatar {
        cursor: default;
    }
.bp_Header .controls {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: flex-end;
        -webkit-box-flex: 0;
            -ms-flex: 0;
                flex: 0;
        grid-gap: 7px;
        gap: 7px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
            -ms-flex-direction: row-reverse;
                flex-direction: row-reverse;
        margin-left: auto;
        margin-right: 0px;
    }
.bp_Header .controls .newChatButton:before {
            -webkit-mask-image: url(../../img/icon-pencil.326b7e9.svg);
                    mask-image: url(../../img/icon-pencil.326b7e9.svg);
            -webkit-mask-size: 16px;
                    mask-size: 16px;
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            -webkit-mask-position: center;
                    mask-position: center;
        }
.bp_Header .controls .mx_AccessibleButton:before {
            background-color: hsla(215, 21%, 76%, 0.33);
        }
.bp_Header .controls .newChatButton {
            width: 24px;
            height: 24px;
            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;
        }
.bp_Header .controls .newChatButton:before {
                content: "";
                display: block;
                width: 24px;
                height: 24px;
                -webkit-mask-image: url(../../img/icon-new-chat.dfb9ddb.svg);
                        mask-image: url(../../img/icon-new-chat.dfb9ddb.svg);
                -webkit-mask-size: cover;
                        mask-size: cover;
            }
.bp_Header .controls .bp_UserMenu {
            cursor: default;
            width: 24px;
            height: 24px;
        }
.bp_Header .controls .bp_UserMenu:before {
                -webkit-mask-image: url(../../themes/beeper/img/icon-settings-outline.e73c1ea.svg);
                        mask-image: url(../../themes/beeper/img/icon-settings-outline.e73c1ea.svg);
            }
.bp_Header .controls .mx_AccessibleButton:hover:not(.mx_AccessibleButton_disabled):before {
            background-color: #828282;
        }
.bp_LeftPanel .spaceBar {
    padding: 4px 10px;
    margin-bottom: 3px;
    color: #949598;
}
.bp_LeftPanel .spaceBar .spaceBar_plus {
        -webkit-mask-image: url(../../img/social/lineart/add-space.b91886d.svg);
                mask-image: url(../../img/social/lineart/add-space.b91886d.svg);
        width: 30px;
        height: 30px;
        background-color: white;
        opacity: 0.33;
        background-image: none;
        -webkit-mask-size: 24px;
                mask-size: 24px;
        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;
        -webkit-mask-position: 4px 6px;
                mask-position: 4px 6px;
    }
.bp_LeftPanel .spaceBar .spaceBar_plus:hover {
            opacity: 0.66;
        }
.bp_LeftPanel .spaceBar .grid {
        display: grid;
        grid-gap: 6px;
        grid-template-columns: repeat(auto-fill, 32px);
        position: relative;
        top: 0px;
    }
.bp_LeftPanel .spaceBar .grid > * {
            min-width: 32px;
        }
.bp_LeftPanel .spaceBar .grid .bp_ProtocolsToggle {
            margin: 0;
        }
.bp_LeftPanel .spaceBar .grid .bp_ProtocolsToggle {
            grid-row-start: 1;
            grid-column-end: -2;
            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;
        }
.bp_LeftPanel .spaceBar .grid .bp_ProtocolsToggle:hover .icon {
                opacity: 0.66;
            }
.bp_LeftPanel .spaceBar .grid .bp_ProtocolsToggle:before {
                border: none;
                background: none;
            }
.bp_LeftPanel .spaceBar .grid .bp_ProtocolsToggle .icon {
                -webkit-mask-image: url(../../img/social/lineart/expand.a1e4885.svg);
                        mask-image: url(../../img/social/lineart/expand.a1e4885.svg);
                background-color: white;
                opacity: 0.33;
                width: 24px;
                height: 24px;
                background-position: center;
                background-repeat: no-repeat;
            }
.bp_LeftPanel .spaceBar .grid .plus {
            width: 44px;
            height: 44px;
            margin: -9px;
            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;
            grid-row-start: 1;
            grid-column-end: -1;
        }
.bp_LeftPanel .spaceBar .grid .plus.grid-end {
                grid-column-end: -1;
            }
.bp_LeftPanel .spaceBar .grid .plus .bp_icon {
                height: 16px;
            }
.bp_LeftPanel .spaceBar.collapsed {
        height: 30px;
        overflow: hidden;
        position: relative;
        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: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
    }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem {
        position: relative;
        border-radius: 8px;
        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;
        -webkit-box-shadow: none;
                box-shadow: none;
        border: none;
        width: 32px;
        height: 32px;
        background: none;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem_network {
            font-size: 6px;
            margin: 0;
            text-align: center;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            width: 100%;
            padding-bottom: 6px;
        }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem img {
            width: 20px;
            height: 20px;
            border-radius: 3px;
        }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem:hover img, .bp_LeftPanel .spaceBar .bp_SpaceBarItem:hover .bp_Avatar {
            -webkit-filter: revert;
                    filter: revert;
        }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem_image {
            width: 30px;
            height: 30px;
            background-size: 24px;
            background-position: center;
            background-repeat: no-repeat;
            background-color: white;
            opacity: 0.33;
            background-image: none;
            -webkit-mask-size: 24px;
                    mask-size: 24px;
            -webkit-mask-repeat: no-repeat;
                    mask-repeat: no-repeat;
            -webkit-mask-position: center;
                    mask-position: center;
        }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.inbox {
                -webkit-mask-image: url(../../img/social/lineart/smart-inbox.04b2d4e.svg);
                        mask-image: url(../../img/social/lineart/smart-inbox.04b2d4e.svg);
            }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.bookmarks {
                -webkit-mask-image: url(../../img/social/lineart/bookmarks.3f3eb77.svg);
                        mask-image: url(../../img/social/lineart/bookmarks.3f3eb77.svg);
                background-size: 24px;
            }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.history {
                -webkit-mask-image: url(../../img/social/lineart/all-messages.11edd11.svg);
                        mask-image: url(../../img/social/lineart/all-messages.11edd11.svg);
                background-size: 24px;
            }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem:hover .bp_SpaceBarItem_image.inbox, .bp_LeftPanel .spaceBar .bp_SpaceBarItem.active .bp_SpaceBarItem_image.inbox {
                    -webkit-mask-image: url(../../img/social/lineart/smart-inbox.04b2d4e.svg);
                            mask-image: url(../../img/social/lineart/smart-inbox.04b2d4e.svg);
                }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem:hover .bp_SpaceBarItem_image.bookmarks, .bp_LeftPanel .spaceBar .bp_SpaceBarItem.active .bp_SpaceBarItem_image.bookmarks {
                    -webkit-mask-image: url(../../img/social/lineart/bookmarks.3f3eb77.svg);
                            mask-image: url(../../img/social/lineart/bookmarks.3f3eb77.svg);
                }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem:hover .bp_SpaceBarItem_image.history, .bp_LeftPanel .spaceBar .bp_SpaceBarItem.active .bp_SpaceBarItem_image.history {
                    -webkit-mask-image: url(../../img/social/lineart/all-messages.11edd11.svg);
                            mask-image: url(../../img/social/lineart/all-messages.11edd11.svg);
                }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem .bp_SpaceBarItem_badge {
            position: absolute;
            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;
            line-height: 18px;
            -webkit-box-sizing: border-box;
                    box-sizing: border-box;
            font-size: 10px;
            font-weight: 700;
            border-radius: 50%;
            border: none;
            height: 16px;
            width: 16px;
            top: -3px;
            right: -3px;
            color: #000000;
            background-color: #ffffff;
        }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem .bp_SpaceBarItem_badge_icon {
                width: 16px;
                height: 16px;
                position: absolute;
                top: -2px;
                right: -4px;
                left: revert;
            }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem .bp_SpaceBarItem_badge_icon.error {
                    background-image: url(../../img/x-stroke.ab96061.svg);
                }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem.active, .bp_LeftPanel .spaceBar .bp_SpaceBarItem.active:hover {
            background-color: rgb(255 255 255 / 7%);
            -webkit-box-shadow: none;
                    box-shadow: none;
        }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem.active .bp_SpaceBarItem_image, .bp_LeftPanel .spaceBar .bp_SpaceBarItem.active:hover .bp_SpaceBarItem_image {
                opacity: 1;
            }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem:hover {
            background-color: rgb(44 42 47);
        }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem:hover .bp_SpaceBarItem_image {
                opacity: 0.66;
            }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem:hover .bp_SpaceBarItem_badge, .bp_LeftPanel .spaceBar .bp_SpaceBarItem.active .bp_SpaceBarItem_badge {
                top: -3px;
                right: -3px;
            }
.bp_LeftPanel .spaceBar .bp_SpaceBarItem:hover .bp_SpaceBarItem_badge_icon, .bp_LeftPanel .spaceBar .bp_SpaceBarItem.active .bp_SpaceBarItem_badge_icon {
                    top: -2px;
                    right: -4px;
                    left: revert;
                }
.bp_LeftPanel .message-list {
    overflow: auto;
    padding-left: 5px;
    padding-bottom: 10px;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
.bp_LeftPanel .message-list .mx_EventTile_messageOut .mx_MessageBody, .bp_LeftPanel .message-list .mx_EventTile_messageIn .mx_MessageBody {
        grid-template-columns: 32px minmax(auto, -webkit-max-content) minmax(35%, auto);
        grid-template-columns: 32px minmax(auto, max-content) minmax(35%, auto);
    }
.bp_LeftPanel .message-list .mx_EventTile_line .mx_SenderInfo_wrapper {
        display: none;
    }
.bp_LeftPanel .message-list .mx_SenderProfile_displayName {
        margin-left: 4px;
    }
.bp_LeftPanel .message-list .message-tile {
        margin: 0 5px;
    }
.bp_LeftPanel .message-list .mx_SenderInfo_wrapper {
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    }
.bp_LeftPanel .message-list .mx_EventTile_line {
        grid-column-start: 2;
        grid-column-end: -1;
    }
.bp_LeftPanel .message-list .mx_EventTile {
        list-style: none;
        width: 100%;
        padding: 0 5px;
    }
.read {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    position: relative;
    overflow-anchor: none;
    -webkit-transition: opacity 250ms ease;
    transition: opacity 250ms ease;
}
.read:hover .bp_RoomTile, .read .opaque .bp_RoomTile, .read:focus-within .bp_RoomTile {
            opacity: 1;
        }
.read:hover .bp_RoomTile:first-of-type, .read .opaque .bp_RoomTile:first-of-type, .read:focus-within .bp_RoomTile:first-of-type {
                opacity: 1;
            }
.read:hover .bp_RoomTile:nth-of-type(2), .read .opaque .bp_RoomTile:nth-of-type(2), .read:focus-within .bp_RoomTile:nth-of-type(2) {
                opacity: 1;
            }
.read:hover .bp_RoomTile:nth-of-type(3), .read .opaque .bp_RoomTile:nth-of-type(3), .read:focus-within .bp_RoomTile:nth-of-type(3) {
                opacity: 1;
            }
.read .bp_RoomTile {
        -webkit-transition: opacity 250ms ease;
        transition: opacity 250ms ease;
        opacity: 0;
    }
.read .bp_RoomTile:is(.focus-visible) {
            opacity: 1;
        }
.read .bp_RoomTile:first-of-type {
            opacity: 0.25;
        }
.read .bp_RoomTile:nth-of-type(2) {
            opacity: 0.2;
        }
.read .bp_RoomTile:nth-of-type(3) {
            opacity: 0.15;
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.bp_SpaceBarItem_image--protocol {
        background-color: revert;
        opacity: 0.9;
    }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem:hover .bp_SpaceBarItem_image.bp_SpaceBarItem_image--protocol {
        opacity: 1;
    }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.bp_SpaceBarItem_image--protocol, .mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.bp_SpaceBarItem_image--protocol:hover {
            -webkit-mask-image: none;
                    mask-image: none;
            -ms-interpolation-mode: nearest-neighbor;
                image-rendering: -webkit-optimize-contrast;
                image-rendering: pixelated;
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.androidsms {
            background-image: url(../../img/social/lineart-color/dark/android.ccaf23f.svg);
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.beeper {
            background-image: url(../../img/social/lineart-color/dark/beeper.c685f80.svg);
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.discord {
            background-image: url(../../img/social/lineart-color/dark/discord.6daf490.svg);
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.facebook {
            background-image: url(../../img/social/lineart-color/dark/messenger.1544eb2.svg);
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.googlechat {
            background-image: url(../../img/social/lineart-color/dark/gchat.bc14811.svg);
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.hangouts {
            background-image: url(../../img/social/lineart-color/dark/hangouts.f13cf77.svg);
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.imessage {
            background-image: url(../../img/social/lineart-color/dark/imessage.aedae37.svg);
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.instagram {
            background-image: url(../../img/social/lineart-color/dark/instagram.e9184e9.svg);
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.linkedin {
            background-image: url(../../img/social/lineart-color/dark/linkedin.2297fef.svg);
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.matrix {
            background-image: url(../../img/social/lineart-color/dark/matrix.512ad87.svg);
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.signal {
            background-image: url(../../img/social/lineart-color/dark/signal.315d199.svg);
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.slack {
            background-image: url(../../img/social/lineart-color/dark/slack.4310255.svg);
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.telegram {
            background-image: url(../../img/social/lineart-color/dark/telegram.77fa320.svg);
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.twitter {
            background-image: url(../../img/social/lineart-color/dark/twitter.972096c.svg);
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.whatsapp {
            background-image: url(../../img/social/lineart-color/dark/whatsapp.2210499.svg);
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image.gmessages {
            background-image: url(../../img/social/lineart-color/dark/gmessages.4a37a9f.svg);
        }
.mx_MatrixChat_wrapper .bp_LeftPanel .spaceBar .bp_SpaceBarItem_image:not(.bp_SpaceBarItem_image--protocol) {
        background-color: #ffffff !important;
    }
.spaceBarItemTooltip {
    padding: 4px 6px;
}
.bp_RoomTile {
    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;
    cursor: default;
    margin: 2pt 0;
    padding: 0;
    height: 64px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}
.bp_RoomTile .bp_Icon {
        margin-top: 0;
    }
.bp_RoomTile .flex {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
.bp_RoomTile .gap-5 {
        grid-gap: 5px;
        gap: 5px;
    }
.bp_RoomTile .favourite-avatar .mx_BaseAvatar_image {
            -webkit-clip-path: url(#cutout);
                    clip-path: url(#cutout);
        }
.bp_RoomTile .favourite-indicator {
        position: absolute;
        top: 34px;
        right: 10px;
        z-index: 5;
        height: 13px;
        width: 13px;
        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;
    }
.bp_RoomTile .favourite-indicator .bp_icon {
            height: 20px;
        }
.bp_RoomTile .details .row.info {
        -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: end;
            -ms-flex-pack: end;
                justify-content: flex-end;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        background-color: transparent;
    }
.bp_RoomTile .outline {
        border-radius: 8px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        padding: 7px 8px 7px 2px;
        -webkit-transition: background 0.16s ease-in-out;
        transition: background 0.16s ease-in-out;
        position: relative;
    }
.bp_RoomTile .avatar {
        margin-right: 4px;
    }
.bp_RoomTile .details {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        overflow: hidden;
        padding-left: 0;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        padding-top: 0;
    }
.bp_RoomTile .details .row {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            margin-bottom: 0;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
        }
.bp_RoomTile .details .row.block {
                display: block;
            }
.bp_RoomTile .details .row > * {
                line-height: 1.17;
            }
.bp_RoomTile .details .row:last-child {
                margin-bottom: 0;
                -webkit-box-flex: 1;
                    -ms-flex: 1;
                        flex: 1;
                -webkit-box-align: start;
                    -ms-flex-align: start;
                        align-items: flex-start;
                padding-bottom: 0;
            }
.bp_RoomTile .name {
        overflow: hidden;
        text-overflow: ellipsis;
        padding: 0 2px 2px 0px;
        font-size: 14px;
        font-weight: 600;
        white-space: nowrap;
        color: #ffffff;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
    }
.bp_RoomTile .bridgeIcon_container {
        -webkit-box-ordinal-group: 2;
            -ms-flex-order: 1;
                order: 1;
        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;
        grid-gap: 5px;
        gap: 5px;
        align-self: flex-start;
    }
.bp_RoomTile .active-indicator {
        color: #7e7f84;
    }
.bp_RoomTile .active-indicator.pin {
            -webkit-transform: rotate(35deg);
                    transform: rotate(35deg);
        }
.bp_RoomTile .bridgeIcon {
        min-width: 19px;
        margin-right: 0;
        -webkit-mask-size: 19px;
                mask-size: 19px;
        height: 15px;
    }
.bp_RoomTile .timestamp {
        -ms-flex-item-align: start;
            align-self: flex-start;
        padding-top: 2px;
        font-weight: 500;
        white-space: nowrap;
        margin-left: 8px;
        padding-right: 2px;
        min-width: 26px;
        text-align: end;
        color: rgb(255 255 255 / 50%);
        font-size: 10px;
    }
.bp_RoomTile .preview {
        color: #b1bfd0;
        width: 100%;
        font-size: 12px;
        line-height: 16px;
        font-weight: 500;
        overflow: hidden;
        text-overflow: ellipsis;
        letter-spacing: -.25px;
        top: -2px;
        position: relative;
    }
.bp_RoomTile .preview .mss .bp_icon {
                display: inline-block;
            }
.bp_RoomTile .preview > span {
            width: 100%;
            white-space: nowrap;
            text-overflow: ellipsis;
            display: -webkit-box;
            overflow: hidden;
            white-space: revert;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            color: rgb(255 255 255 / 50%);
            word-break: break-word;
            font-size: 12.5px;
        }
.bp_RoomTile:not(.small) {
        margin-bottom: 2px;
        padding: 0 17px 0 10px;
    }
.bp_RoomTile:not(.small).active .outline {
                background-color: rgba(255, 255, 255, 0.12);
                background-color: rgba(var(--base), 0.12);
            }
.bp_RoomTile:not(.small) .outline {
            -webkit-box-flex: 1;
                -ms-flex: 1;
                    flex: 1;
            min-width: 0;
            display: grid;
            height: 100%;
            margin-right: 0px;
            grid-template-columns: 10px 58px 1fr auto;
            margin-left: 0;
            overflow: hidden;
            padding-bottom: 0;
            border-radius: 10px;
            padding: 6px 17px 6px 0;
            -webkit-box-sizing: border-box;
                    box-sizing: border-box;    
            padding-right: 4px;
            -webkit-transition: revert;
            transition: revert;
        }
.bp_RoomTile:not(.small) .outline > div {
                width: 100%;
                height: 100%;
            }
.bp_RoomTile:not(.small) .outline .mx_BaseAvatar, .bp_RoomTile:not(.small) .outline .mx_BaseAvatar_image {
                width: 48px;
                height: 48px;
                line-height: 48px;
                margin-right: 0;
            }
.bp_RoomTile:not(.small) .outline .mx_BaseAvatar .mx_BaseAvatar_initial, .bp_RoomTile:not(.small) .outline .mx_BaseAvatar_image .mx_BaseAvatar_initial {
                    top: 50%;
                    left: 50%;
                    -webkit-transform: translate(-50%, -50%);
                            transform: translate(-50%, -50%);
                }
.bp_RoomTile:not(.small).isInvite .outline {
                border-bottom-right-radius: 10px;
                border-top-right-radius: 10px;
                margin-right: 0px;
            }
.bp_RoomTile:not(.small).isInvite .preview {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
            }
.bp_RoomTile:not(.small).isInvite .bridgeIcon {
                -ms-flex-item-align: end;
                    align-self: flex-end;
            }
/**
* Note from Annie!
* This is new Tooltip styles for BEEKIT Tooltip. This is not currently being imported anywhere
* so we don't mess up existed .bp_Tooltip stuff. 

* When we want to switch to use Beekit Tooltip, we can start using this. 
* Too much work for BE, but didn't want to lose the progress I made. 

* Updated Feb 1st 2022
*/
.bp_Tooltip {
  --tooltipBackground: #25262d;
  --tooltipText: #b9bec6;
}
.bp_Tooltip.bp_TooltipRed {
    --tooltipBackground: #CE484F;
    --tooltipText: #F7F7F7;
  }
.bp_Tooltip {

  border-radius: 4px;
  -webkit-box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.5);
          box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.5);
  padding: 8px;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
  display: none;
  position: fixed;
  z-index: 10002;
  pointer-events: none;
  line-height: 1.4rem;
  font-size: 1.2rem;
  font-weight: 600;
  max-width: 200px;
  word-break: break-word;

  background-color: #25262d;

  background-color: var(--tooltipBackground);
  color: white;
  color: var(--tooltipText);
  text-align: center;
}
.bp_Tooltip .bp_Tooltip_chevron {
      display: none;
  }
.bp_Tooltip.bp_Tooltip_visible {
      -webkit-animation: mx_fadein 0.2s forwards;
              animation: mx_fadein 0.2s forwards;
  }
.bp_Tooltip.bp_Tooltip_invisible {
      -webkit-animation: mx_fadeout 0.1s forwards;
              animation: mx_fadeout 0.1s forwards;
  }
.bp_Tooltip_basicStyles {
  border-radius: 4px;
  -webkit-box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.5);
          box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.5);
  padding: 8px;
  z-index: 10002;
  line-height: 1.4rem;
  font-size: 1.2rem;
  font-weight: 600;

  background-color: #25262d;

  background-color: var(--tooltipBackground, #25262d);
  color: white;
  color: var(--tooltipText, #b9bec6);
  text-align: center;
}
.bp_Tooltip_chevron {
  position: absolute;
  width: 0;
  height: 0;
  content: '';
  border-top: 6px solid transparent;
  border-right: 6px solid #25262d;
  border-right: 6px solid var(--tooltipBackground, #25262d);
  border-bottom: 6px solid transparent;
  top: -6px;
  left: 1px;
}
.bp_Tooltip_chevron.bottom {
    top: 27px;
    left: 45%;
    -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
  }
.bp_Tooltip_chevron.top {
    top: -9px;
    left: 45%;
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
  }
.bp_Tooltip_chevron.right {
    top: 9px;
    left: 54px;
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
  }
.bp_Tooltip_withChevron .bp_Tooltip_chevron {
      display: block;
  }
/**************************************************************************
***************************************************************************
***************************************************************************/
/**
* Popper Tooltip
**/
.bp_PopperTooltip {
  --tooltipBackground: #25262d;
  --tooltipBorder: #25262d;

  background-color: #25262d;

  background-color: var(--tooltipBackground);
  border-radius: 4px;
  -webkit-box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.5);
          box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.5);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: 8px;
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;

  z-index: 9999;
  line-height: 1.4rem;
  font-size: 1.2rem;
  font-weight: 600;
  color: #b9bec6;
}
.bp_PopperTooltip[data-popper-interactive='false'] {
  pointer-events: none;
}
.bp_PopperTooltipArrow {
  height: 16px;
  position: absolute;
  width: 16px;
  pointer-events: none;
}
.bp_PopperTooltipArrow::before {
  content: '';
  display: block;
  border: 8px solid transparent;
}
.bp_PopperTooltip[data-popper-placement*='bottom'] .bp_PopperTooltipArrow { top: -16px; }
.bp_PopperTooltip[data-popper-placement*='bottom'] .bp_PopperTooltipArrow::before { border-bottom-color: var(--tooltipBorder); }
.bp_PopperTooltip[data-popper-placement*='top'] .bp_PopperTooltipArrow { bottom: -16px; }
.bp_PopperTooltip[data-popper-placement*='top'] .bp_PopperTooltipArrow::before { border-top-color: var(--tooltipBorder); }
.bp_PopperTooltip[data-popper-placement*='right'] .bp_PopperTooltipArrow { left: -16px; }
.bp_PopperTooltip[data-popper-placement*='right'] .bp_PopperTooltipArrow::before { border-right-color: var(--tooltipBorder); }
.bp_PopperTooltip[data-popper-placement*='left'] .bp_PopperTooltipArrow { right: -16px; }
.bp_PopperTooltip[data-popper-placement*='left'] .bp_PopperTooltipArrow::before { border-left-color: var(--tooltipBorder); }
.bp_MainPanel {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    background-color: #1e1e1e;
    position: relative;
}
.bp_TitleBar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background-color: #3f4047;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
    -webkit-app-region: drag;
}
:where(.bp_RoomToast_wrapper) {
  position: absolute;
  bottom: 18px;
  left: 15px;
  right: 12px;

  opacity: 0;

  -webkit-transition: opacity .5s;

  transition: opacity .5s;
}
:where(.bp_RoomToast_wrapper).shown {
    opacity: 1;
  }
.bp_RoomToast {
  background-color: #3f4047;
  border-radius: 8px;
  padding: 12px;
  padding-left: 24px;
  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: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.bp_RoomToast.error {
    border: 2px solid #E04950;
    background-color: #3F333A;
  }
.bp_RoomListToast_wrapper {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  max-height: 0;
}
.bp_RoomListToast_wrapper.shown {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    max-height: 500px;
    -webkit-transition: max-height .5s ease-in;
    transition: max-height .5s ease-in;
  }
.bp_RoomListToast {
  background-color: #25262d;
  border: 1px solid #76767b;
  border-radius: 8px;
  padding: 12px;
  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: 8px;
}
.bp_RoomListToast.error {
    border: 2px solid #E04950;
    background-color: #3F333A;
  }
.option-icon {
    width: 64px;
    height: 64px;
    vertical-align: bottom;
}
.beekit-wizard-step {
    display: grid;
    grid-template-rows: 40px 1fr 64px;
    width: 100%;
    height: 100%;
    color: #fff;
}
.beekit-wizard-step-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-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
.beekit-wizard-step-actions {
    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: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    height: 100%;
}
.beekit-wizard-question-actions {
    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: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
}
.mx_ChatNetworksDialogV2 .bridge-settings {
        display: grid;
        grid-template-columns: 3fr 7fr;
        grid-column-gap: 8px;
        -webkit-column-gap: 8px;
           -moz-column-gap: 8px;
                column-gap: 8px;
        grid-row-gap: 8px;
        row-gap: 8px;
        margin-bottom: 12px;
    }
.mx_ChatNetworksDialogV2 .actionbar {
      margin-top: 20px;
      display: grid;
      grid-gap: 8px;
      gap: 8px;
      grid-template-rows: 1fr;
      grid-auto-columns: -webkit-max-content;
      grid-auto-columns: max-content;
      grid-auto-flow: column;
  }
.mx_ChatNetworksDialogV2 .actionbar.column {
          margin-top: 20px;
          grid-auto-flow: row;
      }
.statusIcon_loading {
  width: 20px;
  height: 20px;
  border: 2px solid rgba(255, 255, 255, .2);
  border: 2px solid rgba(var(--base), .2);
  border-radius: 100px;
}
.mx_RoomSubList_badge > div, .mx_RoomTile_unreadNotify .mx_RoomTile_badge {
    background-color: #4958F5;
}
.mx_RoomSubList_scroll {
    padding: 0;
}
.nv_RoomView_messagePanel_useStraitLayout.nv_RoomView_direct .mx_EventTile_messageIn .mx_EventTile_line {
            margin-left: 0;
        }
.nv_RoomView_messagePanel_useStraitLayout .mx_EventTile_bubbleContainer.mx_EventTile_continuation .mx_MessageBody {
            -webkit-box-pack: unset;
                -ms-flex-pack: unset;
                    justify-content: unset;
        }
.nv_RoomView_messagePanel_useStraitLayout .mx_EventTile_bubbleContainer .mx_EventTile_line {
            background: white;
            grid-column: 1/4;
        }
.nv_RoomView_messagePanel_useStraitLayout .mx_EventTile_bubbleContainer .mx_EventTile_line .mx_EventTileBubble.mx_CreateEvent {
                background-color: #F0F0F1;
            }
.nv_RoomView_messagePanel_useStraitLayout {
}
.nv_RoomView_messagePanel_useStraitLayout .mx_EventTile_messageOut .mx_EventTile_avatar {
        display: none;
    }
.nv_RoomView_messagePanel_useStraitLayout .mx_EventTile_messageOut {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
            -ms-flex-direction: row-reverse;
                flex-direction: row-reverse;
    }
.nv_RoomView_messagePanel_useStraitLayout .mx_EventTile_messageOut ::-moz-selection {
            background: rgba(0, 0, 0, 0.2);
        }
.nv_RoomView_messagePanel_useStraitLayout .mx_EventTile_messageOut ::selection {
            background: rgba(0, 0, 0, 0.2);
        }
.nv_RoomView_messagePanel_useStraitLayout .mx_EventTile .mx_ReactionsRow {
    }
.nv_RoomView_messagePanel_useStraitLayout .mx_EventTile_message:hover .mx_MessageActionBar {
            visibility: visible;
            left: -85px;
            right: auto;
            right: initial;
        }
.mx_EventTile_file .mx_EventTile_line {
        min-width: 268px;
    }
.mx_EventTile_file .mx_SenderProfile_wrapper {
        margin-bottom: 9px;
    }
.mx_EventTile_file.mx_EventTile_continuation .mx_SenderProfile_wrapper {
        margin-bottom: 0;
    }
.mx_EventTile_file .mx_MFileBody {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }
.mx_EventTile_file .mx_MFileBody_download > a, .mx_EventTile_file .mx_MFileBody_downloadLink {
        display: block;
        font-weight: 600;
        color: #f0f0f1;
        margin-bottom: 6px;
    }
.mx_EventTile_file .mx_MImageBody_size {
        color: #98a2aa;
    }
.mx_AutoHideScrollbar {
    scrollbar-width: 4px;
}
::-webkit-scrollbar {
    width: 4px;
    height: 4px;
}
.mx_RightPanel {
    overflow: hidden;
    max-width: 550px;
}
.mx_RoomHeader_avatar .nv_BridgedIcon {
    height: 12px;
    width: 12px;
    display: block;
    position: absolute;
    bottom: 0;
    right: -3px;
    z-index: 1;
    margin: 0;
}
.mx_RoomBreadcrumbs .mx_RoomBreadcrumbs_crumb .mx_RoomTile_badge {
    background-color: #4958F5;
    font-size: 10px;
    height: 14px;
    min-width: 14px;
}
.mx_RoomBreadcrumbs {
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
}
.mx_MImageBody {
    margin-right: 0;
}
.mx_EventTile_line .mx_ReplyChain_wrapper {
    margin-left: 0;
}
.mx_MatrixChat > .mx_LeftPanel2:hover + .mx_ResizeHandle_horizontal::before, .mx_MatrixChat > .mx_ResizeHandle_horizontal:hover::before {
        display: none;
    }
.mx_RoomSublist2_contextMenu .mx_AccessibleButton {
        padding: 7px 15px;
        text-align: center;
        border-radius: 4px;
        display: inline-block;
        font-size: 1.4rem;
        color: #ffffff;
        background-color: #419fd9;
        font-weight: 600;
        margin: 0;
    }
.mx_RoomSublist2_contextMenu .mx_AccessibleButton:first-child {
        margin-right: 8px;
    }
.mx_RoomView_MessageList li .mx_EventTile_message .mx_MessageBody {
    position: relative;
}
.mx_RoomView_MessageList li .mx_EventTile_message .mx_MessageBody::before {
        pointer-events: none;
        content: "";
        left: -18px;
        right: -18px;
        top: -2px;
        bottom: -2px;
        position: absolute;
        -webkit-animation-play-state: running;
                animation-play-state: running;
        -webkit-animation-play-state: initial;
                animation-play-state: initial;
    }
@-webkit-keyframes highlight {
    0% { background-color: rgba(65, 159, 217, 0); }
        10.0% {
            background-color: #25271f;
        }
    100.0% { background-color: rgba(65, 159, 217, 0); }
}
@keyframes highlight {
    0% { background-color: rgba(65, 159, 217, 0); }
        10.0% {
            background-color: #25271f;
        }
    100.0% { background-color: rgba(65, 159, 217, 0); }
}
.nv_AccentedEvent_highlight {
    -webkit-animation-name: highlight;
            animation-name: highlight;
    -webkit-animation-duration: 3s;
            animation-duration: 3s;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    -webkit-animation-iteration-count: 1;
            animation-iteration-count: 1;
    -webkit-animation-play-state: running;
            animation-play-state: running;
}
.mx_CallView_holdTransferContent {
    color: #fff;
}
.mx_ReplyChain_wrapper .mx_ReplyChain {
        border-radius: 4px;
        margin-bottom: 2px;
    }
.mx_ReplyChain_wrapper .mx_ReplyChain:first-child {
        border-top-left-radius: 8px;
        border-top-right-radius: 8px;
    }
.mx_ReplyChain_wrapper .mx_ReplyChain:last-child {
        margin-bottom: 4px;
        border-bottom-left-radius: 8px;
        border-bottom-right-radius: 8px;
    }
.mx_RightPanel_headerButton, .mx_RoomHeader_button {
    opacity: 0.6;
}
.mx_RightPanel_headerButton:hover, .mx_RoomHeader_button:hover {
        opacity: 1;
        background: transparent;
    }
.mx_ToastContainer .mx_Toast_toast, .mx_ToastContainer.mx_ToastContainer_stacked::before {
    background-color: #25262d;
}
.nv_RoomView_messagePanel_useStraitLayout .mx_EventTile_bubbleContainer .mx_EventTile_line {
    background: #25262d;
}
.nv_RoomView_messagePanel_useStraitLayout .mx_EventTile_bubbleContainer .mx_EventTile_line .mx_EventTileBubble.mx_CreateEvent {
        background-color: #35363d;
    }
.bp_SpaceBarItem_badge_icon.warning {
        background-image: url(../../img/warning-stroke-dark.2f1c9d3.svg) !important;
    }
.bp_SpaceBarItem_badge_icon.error {
        background-image: url(../../img/x-stroke-dark.d150096.svg) !important;
    }
.bp_Avatar_bg_1 {
    background-color: #D391F2;
  }
.bp_Avatar_bg_2 {
    background-color: #929BF9;
  }
.bp_Avatar_bg_3 {
    background-color: #FFC3AA;
  }
.bp_Avatar_bg_4 {
    background-color: #F0A0E2;
  }
.mx_EventTile_body.markdown-body > code, .mx_EventTile_body.markdown-body pre {
      background-color: rgba(0, 0, 0, 0.65);
  }
pre code.hljs{display:block;overflow-x:auto;padding:1em}
code.hljs{padding:3px 5px}
/*!
  Theme: GitHub Dark
  Description: Dark theme as seen on github.com
  Author: github.com
  Maintainer: @Hirse
  Updated: 2021-05-15

  Outdated base version: https://github.com/primer/github-syntax-dark
  Current colors taken from GitHub's CSS
*/
.hljs{color:#c9d1d9;background:#0d1117}
.hljs-doctag, .hljs-keyword, .hljs-meta .hljs-keyword, .hljs-template-tag, .hljs-template-variable, .hljs-type, .hljs-variable.language_{color:#ff7b72}
.hljs-title, .hljs-title.class_, .hljs-title.class_.inherited__, .hljs-title.function_{color:#d2a8ff}
.hljs-attr, .hljs-attribute, .hljs-literal, .hljs-meta, .hljs-number, .hljs-operator, .hljs-selector-attr, .hljs-selector-class, .hljs-selector-id, .hljs-variable{color:#79c0ff}
.hljs-meta .hljs-string, .hljs-regexp, .hljs-string{color:#a5d6ff}
.hljs-built_in, .hljs-symbol{color:#ffa657}
.hljs-code, .hljs-comment, .hljs-formula{color:#8b949e}
.hljs-name, .hljs-quote, .hljs-selector-pseudo, .hljs-selector-tag{color:#7ee787}
.hljs-subst{color:#c9d1d9}
.hljs-section{color:#1f6feb;font-weight:700}
.hljs-bullet{color:#f2cc60}
.hljs-emphasis{color:#c9d1d9;font-style:italic}
.hljs-strong{color:#c9d1d9;font-weight:700}
.hljs-addition{color:#aff5b4;background-color:#033a16}
.hljs-deletion{color:#ffdcd7;background-color:#67060c}


/*# sourceMappingURL=theme-dark.css.map*/