/*!****************************************************************************************************************************************************************************************!*\ !*** css ../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!../../node_modules/postcss-loader/dist/cjs.js??postcss!./res/themes/light-custom/css/light-custom.pcss ***! \****************************************************************************************************************************************************************************************/ @layer compound{ @layer cpd-semantic, custom, cpd-base; }/* Copyright 2024 New Vector Ltd. Copyright 2020 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. *//* * SCSS variables defining a range of font sizes. * * These are defined in `rem` so that they scale with the `font-size` of the root element (which is adjustable via the * "Font size" setting). They exist to make the job of converting designs (which tend to be based in pixels) into CSS * easier. *//* * These variables are now *deprecated* and should not be used in new code; instead Compound typographic tokens * should be used. Direct equivalents for these old font size tokens are listed below; where no equivalent exists, * that suggests that the design is using a non-standard font size and should be updated. * * In fact, modern Figma designs should actually use a named Typography style such as "Web/font/heading/sm/semibold", * translates directly to `font: var(--cpd-font-heading-sm-semibold)`. *//* Compound equivalent: --cpd-font-size-body-xs *//* Compound equivalent: --cpd-font-size-body-sm *//* Compound equivalent: --cpd-font-size-body-md *//* Compound equivalent: --cpd-font-size-body-lg *//* Compound equivalent: --cpd-font-size-heading-sm *//* Compound equivalent: --cpd-font-size-heading-md *//* Compound equivalent: --cpd-font-size-heading-lg *//* Compound equivalent: --cpd-font-size-heading-xl *//* * Nunito. * Includes extended Latin and Vietnamese character sets * Current URLs are taken from * https://github.com/alexeiva/NunitoFont/releases/tag/v3.500 * ...in order to include cyrillic. * * Previously, they were * https://fonts.googleapis.com/css?family=Nunito:400,400i,600,600i,700,700i&subset=latin-ext,vietnamese * * We explicitly do not include Nunito's italic variants, as they are not italic enough * and it's better to rely on the browser's built-in obliquing behaviour. *//* Grab the other fonts from the current theme, so we can override to Inter *//* in custom fonts if needed. *//* the 'src' links are relative to the bundle.css, which is in a subdirectory. *//* Twemoji COLR */@font-face { font-family: "Twemoji"; font-weight: 400; src: url(../../fonts/Twemoji_Mozilla/TwemojiMozilla-colr.666a113.woff2) format("woff2"); }/* For at least Chrome on Windows 10, we have to explictly add extra weights for the emoji to appear in bold messages, etc. */@font-face { font-family: "Twemoji"; font-weight: 600; src: url(../../fonts/Twemoji_Mozilla/TwemojiMozilla-colr.666a113.woff2) format("woff2"); }@font-face { font-family: "Twemoji"; font-weight: 700; src: url(../../fonts/Twemoji_Mozilla/TwemojiMozilla-colr.666a113.woff2) format("woff2"); }/* Nunito as the default, for old time's sake on legacy themes. *//* the 'src' links are relative to the bundle.css, which is in a subdirectory. */@font-face { font-family: "Nunito"; font-style: normal; font-weight: 400; src: url(../../fonts/Nunito/Nunito-Regular.d3e2991.ttf) format("truetype"); }@font-face { font-family: "Nunito"; font-style: normal; font-weight: 600; src: url(../../fonts/Nunito/Nunito-SemiBold.58f5995.ttf) format("truetype"); }@font-face { font-family: "Nunito"; font-style: normal; font-weight: 700; src: url(../../fonts/Nunito/Nunito-Bold.b3a1698.ttf) format("truetype"); }:root { /* This is set to Twemoji when the user opts into the bundled emoji font */ --emoji-font-family: ""; }/* Nunito lacks combining diacritics, so these will fall through to the next font. Helevetica's diacritics sometimes do not combine nicely (on OSX, at least) and result in a huge horizontal mess. Arial empirically gets it right, hence prioritising Arial here. *//* 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. *//* unified palette *//* try to use these colors when possible *//* typical text (dark-on-white in light skin) *//* Commonly used in headings and relevant alt text *//* used for dialog box text *//* used for focusing form controls *//* button UI (white-on-green in light skin) *//* informational plinth *//* left-panel style muted accent color *//* used by RoomDropTarget *//* used by Autocomplete *//* selected for hoverover & selected event tiles *//* used for the hairline dividers in RoomView *//* used for the border of input text fields *//* apart from login forms, which have stronger border *//* used for UserSettings EditableText *//* scrollbars *//* context menus *//* ******************** *//* Legacy theme backports *//* Legacy theme backports *//* ******************** *//* XXX: Color from dark theme *//* All of these are from dark theme *//** * Creating a `semantic` color scale. This will not be needed with the new * visual language, but necessary during the transition period * This abstract the `green` away from where accent shades are used * Take: `background: rgba($accent, 0.1);` * would be transformed to: `background: $accent-300;` * * To use under very rare circumstances, always prefer the semantics defined * in https://compound.element.io/?path=/docs/tokens-semantic-colors--docs *//* ******************** *//* ******************** *//* $event-highlight-bg-color shares this value, *//* so to not make their order dependent on who depends on who, have a shared value *//* defined before both *//* event timestamp *//* e2e *//*** ImageView ***//* Tabbed views *//* Buttons *//* TODO: Verify color *//* Toggle switch *//* See non-legacy _light for variable information *//* Bubble tiles *//* pinned events indicator *//* Location sharing *//* ******************** *//* ******************** */body { color-scheme: light; }/* diff highlight colors */.hljs-addition { background: #dfd; }.hljs-deletion { background: #fdd; }/* Copyright 2024 New Vector Ltd. Copyright 2019 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. *//* Colors from Figma Compound https://www.figma.com/file/X4XTH9iS2KGJ2wFKDqkyed/Compound?node-id=559%3A741 *//* --timeline-background-color *//* still needs alpha at .5 *//* still needs alpha at .59 *//* --roomlist-highlights-color *//* --sidebar-color *//* --roomlist-background-color *//* these were #f2f5f8 instead of #f3f8fd, but close enough *//* --timeline-text-color *//* was #212121 *//* was #45474a *//* was #4e5054 *//* was #232f32 *//* --roomlist-text-secondary-color *//* --roomlist-separator-color *//* originally #e5e5e5, but close enough *//* --timeline-text-secondary-color *//* was #747474 *//* was #888888 *//* --primary-color *//* --warning-color *//* still needs alpha at 0.5 *//* --timeline-highlights-color *//* redirect some variables away from their hardcoded values in the light theme *//* --eventbubble colors *//** * Variation of the accent color. * Generate this colour scale using LeonardoColor * TODO: Add link *//* autogenerated by rethemendex.sh *//* Copyright 2024 New Vector Ltd. Copyright 2021 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. *//** * 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-enter-active { opacity: 1; -webkit-transition: opacity 300ms ease; transition: opacity 300ms ease; }.mx_rtg--fade-exit { opacity: 1; }.mx_rtg--fade-exit-active { opacity: 0; -webkit-transition: opacity 300ms ease; transition: opacity 300ms ease; }:root { --hover-transition: 0.08s cubic-bezier(0.46, 0.03, 0.52, 0.96); /* quadratic */ }@-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; } }@-webkit-keyframes mx_ImageView_panel_keyframes { from { opacity: 0; } to { opacity: 1; } }@keyframes mx_ImageView_panel_keyframes { from { opacity: 0; } to { opacity: 1; } }@media (prefers-reduced-motion) { @-webkit-keyframes mx--anim-pulse { /* Override all keyframes in reduced-motion */ } @keyframes mx--anim-pulse { /* Override all keyframes in reduced-motion */ } @-webkit-keyframes mx_Dialog_lightbox_background_keyframes { /* Override all keyframes in reduced-motion */ } @keyframes mx_Dialog_lightbox_background_keyframes { /* Override all keyframes in reduced-motion */ } @-webkit-keyframes mx_ImageView_panel_keyframes { /* Override all keyframes in reduced-motion */ } @keyframes mx_ImageView_panel_keyframes { /* Override all keyframes in reduced-motion */ } .mx_rtg--fade-enter-active { -webkit-transition: none; transition: none; } .mx_rtg--fade-exit-active { -webkit-transition: none; transition: none; } }/* Copyright 2024 New Vector Ltd. Copyright 2019-2023 The Matrix.org Foundation C.I.C Copyright 2017-2019 New Vector Ltd Copyright 2017 Vector Creations Ltd Copyright 2015, 2016 OpenMarket Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. *//* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. *//* SCSS variables representing a range of standard lengths. * * Avoid using these in new code: we cannot adjust their values without causing massive confusion, so they are * effectively equivalent to using hardcoded values. * * In future, we plan to introduce variables named according to their purpose rather than their size. Additionally, * we want switch to custom CSS properties (https://github.com/vector-im/element-web/issues/21656), so we might have * `--spacing-standard` or something. For now, you might as well use hardcoded px values for lengths (except for font * sizes, for which see the `$font-px` variables). */.maplibregl-map{font:12px/20px Helvetica Neue,Arial,Helvetica,sans-serif;overflow:hidden;position:relative;-webkit-tap-highlight-color:rgb(0,0,0,0)}.maplibregl-canvas{left:0;position:absolute;top:0}.maplibregl-map:-webkit-full-screen{height:100%;width:100%}.maplibregl-map:-ms-fullscreen{height:100%;width:100%}.maplibregl-map:fullscreen{height:100%;width:100%}.maplibregl-ctrl-group button.maplibregl-ctrl-compass{-ms-touch-action:none;touch-action:none}.maplibregl-canvas-container.maplibregl-interactive,.maplibregl-ctrl-group button.maplibregl-ctrl-compass{cursor:-webkit-grab;cursor:grab;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.maplibregl-canvas-container.maplibregl-interactive.maplibregl-track-pointer{cursor:pointer}.maplibregl-canvas-container.maplibregl-interactive:active,.maplibregl-ctrl-group button.maplibregl-ctrl-compass:active{cursor:-webkit-grabbing;cursor:grabbing}.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}.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}.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}.maplibregl-canvas-container.maplibregl-touch-drag-pan.maplibregl-cooperative-gestures,.maplibregl-canvas-container.maplibregl-touch-drag-pan.maplibregl-cooperative-gestures .maplibregl-canvas{-ms-touch-action:pan-x pan-y;touch-action:pan-x pan-y}.maplibregl-ctrl-bottom-left,.maplibregl-ctrl-bottom-right,.maplibregl-ctrl-top-left,.maplibregl-ctrl-top-right{pointer-events:none;position:absolute;z-index:2}.maplibregl-ctrl-top-left{left:0;top:0}.maplibregl-ctrl-top-right{right:0;top:0}.maplibregl-ctrl-bottom-left{bottom:0;left:0}.maplibregl-ctrl-bottom-right{bottom:0;right:0}.maplibregl-ctrl{clear:both;pointer-events:auto;-webkit-transform:translate(0);transform:translate(0)}.maplibregl-ctrl-top-left .maplibregl-ctrl{float:left;margin:10px 0 0 10px}.maplibregl-ctrl-top-right .maplibregl-ctrl{float:right;margin:10px 10px 0 0}.maplibregl-ctrl-bottom-left .maplibregl-ctrl{float:left;margin:0 0 10px 10px}.maplibregl-ctrl-bottom-right .maplibregl-ctrl{float:right;margin:0 10px 10px 0}.maplibregl-ctrl-group{background:#fff;border-radius:4px}.maplibregl-ctrl-group:not(:empty){-webkit-box-shadow:0 0 0 2px rgba(0,0,0,.1);box-shadow:0 0 0 2px rgba(0,0,0,.1)}@media (forced-colors:active){.maplibregl-ctrl-group:not(:empty){-webkit-box-shadow:0 0 0 2px ButtonText;box-shadow:0 0 0 2px ButtonText}}.maplibregl-ctrl-group button{background-color:transparent;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;display:block;height:29px;outline:none;padding:0;width:29px}.maplibregl-ctrl-group button+button{border-top:1px solid #ddd}.maplibregl-ctrl button .maplibregl-ctrl-icon{background-position:50%;background-repeat:no-repeat;display:block;height:100%;width:100%}@media (forced-colors:active){.maplibregl-ctrl-icon{background-color:transparent}.maplibregl-ctrl-group button+button{border-top:1px solid ButtonText}}.maplibregl-ctrl button::-moz-focus-inner{border:0;padding:0}.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}.maplibregl-ctrl button:disabled{cursor:not-allowed}.maplibregl-ctrl button:disabled .maplibregl-ctrl-icon{opacity:.25}@media (hover:hover){.maplibregl-ctrl button:not(:disabled):hover{background-color:rgba(0,0,0,.05)}}.maplibregl-ctrl button:not(:disabled):active{background-color:rgba(0,0,0,.05)}.maplibregl-ctrl-group button:focus:focus-visible{-webkit-box-shadow:0 0 2px 2px #0096ff;box-shadow:0 0 2px 2px #0096ff}.maplibregl-ctrl-group button:focus:not(:focus-visible){-webkit-box-shadow:none;box-shadow:none}.maplibregl-ctrl-group button:focus:first-child{border-radius:4px 4px 0 0}.maplibregl-ctrl-group button:focus:last-child{border-radius:0 0 4px 4px}.maplibregl-ctrl-group button:focus:only-child{border-radius:inherit}.maplibregl-ctrl button.maplibregl-ctrl-zoom-out .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-zoom-in .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5'/%3E%3C/svg%3E")}@media (forced-colors:active){.maplibregl-ctrl button.maplibregl-ctrl-zoom-out .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-zoom-in .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5'/%3E%3C/svg%3E")}}@media (forced-colors:active) and (prefers-color-scheme:light){.maplibregl-ctrl button.maplibregl-ctrl-zoom-out .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 29 29'%3E%3Cpath d='M10 13c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h9c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-zoom-in .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 29 29'%3E%3Cpath d='M14.5 8.5c-.75 0-1.5.75-1.5 1.5v3h-3c-.75 0-1.5.75-1.5 1.5S9.25 16 10 16h3v3c0 .75.75 1.5 1.5 1.5S16 19.75 16 19v-3h3c.75 0 1.5-.75 1.5-1.5S19.75 13 19 13h-3v-3c0-.75-.75-1.5-1.5-1.5'/%3E%3C/svg%3E")}}.maplibregl-ctrl button.maplibregl-ctrl-fullscreen .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-shrink .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 29 29'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1z'/%3E%3C/svg%3E")}@media (forced-colors:active){.maplibregl-ctrl button.maplibregl-ctrl-fullscreen .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-shrink .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1z'/%3E%3C/svg%3E")}}@media (forced-colors:active) and (prefers-color-scheme:light){.maplibregl-ctrl button.maplibregl-ctrl-fullscreen .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 29 29'%3E%3Cpath d='M24 16v5.5c0 1.75-.75 2.5-2.5 2.5H16v-1l3-1.5-4-5.5 1-1 5.5 4 1.5-3zM6 16l1.5 3 5.5-4 1 1-4 5.5 3 1.5v1H7.5C5.75 24 5 23.25 5 21.5V16zm7-11v1l-3 1.5 4 5.5-1 1-5.5-4L6 13H5V7.5C5 5.75 5.75 5 7.5 5zm11 2.5c0-1.75-.75-2.5-2.5-2.5H16v1l3 1.5-4 5.5 1 1 5.5-4 1.5 3h1z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-shrink .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 29 29'%3E%3Cpath d='M18.5 16c-1.75 0-2.5.75-2.5 2.5V24h1l1.5-3 5.5 4 1-1-4-5.5 3-1.5v-1zM13 18.5c0-1.75-.75-2.5-2.5-2.5H5v1l3 1.5L4 24l1 1 5.5-4 1.5 3h1zm3-8c0 1.75.75 2.5 2.5 2.5H24v-1l-3-1.5L25 5l-1-1-5.5 4L17 5h-1zM10.5 13c1.75 0 2.5-.75 2.5-2.5V5h-1l-1.5 3L5 4 4 5l4 5.5L5 12v1z'/%3E%3C/svg%3E")}}.maplibregl-ctrl button.maplibregl-ctrl-compass .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23333' viewBox='0 0 29 29'%3E%3Cpath d='m10.5 14 4-8 4 8z'/%3E%3Cpath fill='%23ccc' d='m10.5 16 4 8 4-8z'/%3E%3C/svg%3E")}@media (forced-colors:active){.maplibregl-ctrl button.maplibregl-ctrl-compass .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff' viewBox='0 0 29 29'%3E%3Cpath d='m10.5 14 4-8 4 8z'/%3E%3Cpath fill='%23ccc' d='m10.5 16 4 8 4-8z'/%3E%3C/svg%3E")}}@media (forced-colors:active) and (prefers-color-scheme:light){.maplibregl-ctrl button.maplibregl-ctrl-compass .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 29 29'%3E%3Cpath d='m10.5 14 4-8 4 8z'/%3E%3Cpath fill='%23ccc' d='m10.5 16 4 8 4-8z'/%3E%3C/svg%3E")}}.maplibregl-ctrl button.maplibregl-ctrl-globe .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='none' stroke='%23333' viewBox='0 0 22 22'%3E%3Ccircle cx='11' cy='11' r='8.5'/%3E%3Cpath d='M17.5 11c0 4.819-3.02 8.5-6.5 8.5S4.5 15.819 4.5 11 7.52 2.5 11 2.5s6.5 3.681 6.5 8.5Z'/%3E%3Cpath d='M13.5 11c0 2.447-.331 4.64-.853 6.206-.262.785-.562 1.384-.872 1.777-.314.399-.58.517-.775.517s-.461-.118-.775-.517c-.31-.393-.61-.992-.872-1.777C8.831 15.64 8.5 13.446 8.5 11s.331-4.64.853-6.206c.262-.785.562-1.384.872-1.777.314-.399.58-.517.775-.517s.461.118.775.517c.31.393.61.992.872 1.777.522 1.565.853 3.76.853 6.206Z'/%3E%3Cpath d='M11 7.5c-1.909 0-3.622-.166-4.845-.428-.616-.132-1.08-.283-1.379-.434a1.3 1.3 0 0 1-.224-.138q.07-.058.224-.138c.299-.151.763-.302 1.379-.434C7.378 5.666 9.091 5.5 11 5.5s3.622.166 4.845.428c.616.132 1.08.283 1.379.434.105.053.177.1.224.138q-.07.058-.224.138c-.299.151-.763.302-1.379.434-1.223.262-2.936.428-4.845.428ZM4.486 6.436ZM11 16.5c-1.909 0-3.622-.166-4.845-.428-.616-.132-1.08-.283-1.379-.434a1.3 1.3 0 0 1-.224-.138 1.3 1.3 0 0 1 .224-.138c.299-.151.763-.302 1.379-.434C7.378 14.666 9.091 14.5 11 14.5s3.622.166 4.845.428c.616.132 1.08.283 1.379.434.105.053.177.1.224.138a1.3 1.3 0 0 1-.224.138c-.299.151-.763.302-1.379.434-1.223.262-2.936.428-4.845.428Zm-6.514-1.064ZM11 12.5c-2.46 0-4.672-.222-6.255-.574-.796-.177-1.406-.38-1.805-.59a1.5 1.5 0 0 1-.39-.272.3.3 0 0 1-.047-.064.3.3 0 0 1 .048-.064c.066-.073.189-.167.389-.272.399-.21 1.009-.413 1.805-.59C6.328 9.722 8.54 9.5 11 9.5s4.672.222 6.256.574c.795.177 1.405.38 1.804.59.2.105.323.2.39.272a.3.3 0 0 1 .047.064.3.3 0 0 1-.048.064 1.4 1.4 0 0 1-.389.272c-.399.21-1.009.413-1.804.59-1.584.352-3.796.574-6.256.574Zm-8.501-1.51v.002zm0 .018v.002zm17.002.002v-.002zm0-.018v-.002z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-globe-enabled .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='none' stroke='%2333b5e5' viewBox='0 0 22 22'%3E%3Ccircle cx='11' cy='11' r='8.5'/%3E%3Cpath d='M17.5 11c0 4.819-3.02 8.5-6.5 8.5S4.5 15.819 4.5 11 7.52 2.5 11 2.5s6.5 3.681 6.5 8.5Z'/%3E%3Cpath d='M13.5 11c0 2.447-.331 4.64-.853 6.206-.262.785-.562 1.384-.872 1.777-.314.399-.58.517-.775.517s-.461-.118-.775-.517c-.31-.393-.61-.992-.872-1.777C8.831 15.64 8.5 13.446 8.5 11s.331-4.64.853-6.206c.262-.785.562-1.384.872-1.777.314-.399.58-.517.775-.517s.461.118.775.517c.31.393.61.992.872 1.777.522 1.565.853 3.76.853 6.206Z'/%3E%3Cpath d='M11 7.5c-1.909 0-3.622-.166-4.845-.428-.616-.132-1.08-.283-1.379-.434a1.3 1.3 0 0 1-.224-.138q.07-.058.224-.138c.299-.151.763-.302 1.379-.434C7.378 5.666 9.091 5.5 11 5.5s3.622.166 4.845.428c.616.132 1.08.283 1.379.434.105.053.177.1.224.138q-.07.058-.224.138c-.299.151-.763.302-1.379.434-1.223.262-2.936.428-4.845.428ZM4.486 6.436ZM11 16.5c-1.909 0-3.622-.166-4.845-.428-.616-.132-1.08-.283-1.379-.434a1.3 1.3 0 0 1-.224-.138 1.3 1.3 0 0 1 .224-.138c.299-.151.763-.302 1.379-.434C7.378 14.666 9.091 14.5 11 14.5s3.622.166 4.845.428c.616.132 1.08.283 1.379.434.105.053.177.1.224.138a1.3 1.3 0 0 1-.224.138c-.299.151-.763.302-1.379.434-1.223.262-2.936.428-4.845.428Zm-6.514-1.064ZM11 12.5c-2.46 0-4.672-.222-6.255-.574-.796-.177-1.406-.38-1.805-.59a1.5 1.5 0 0 1-.39-.272.3.3 0 0 1-.047-.064.3.3 0 0 1 .048-.064c.066-.073.189-.167.389-.272.399-.21 1.009-.413 1.805-.59C6.328 9.722 8.54 9.5 11 9.5s4.672.222 6.256.574c.795.177 1.405.38 1.804.59.2.105.323.2.39.272a.3.3 0 0 1 .047.064.3.3 0 0 1-.048.064 1.4 1.4 0 0 1-.389.272c-.399.21-1.009.413-1.804.59-1.584.352-3.796.574-6.256.574Zm-8.501-1.51v.002zm0 .018v.002zm17.002.002v-.002zm0-.018v-.002z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-terrain .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='%23333' viewBox='0 0 22 22'%3E%3Cpath d='m1.754 13.406 4.453-4.851 3.09 3.09 3.281 3.277.969-.969-3.309-3.312 3.844-4.121 6.148 6.886h1.082v-.855l-7.207-8.07-4.84 5.187L6.169 6.57l-5.48 5.965v.871ZM.688 16.844h20.625v1.375H.688Zm0 0'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-terrain-enabled .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='%2333b5e5' viewBox='0 0 22 22'%3E%3Cpath d='m1.754 13.406 4.453-4.851 3.09 3.09 3.281 3.277.969-.969-3.309-3.312 3.844-4.121 6.148 6.886h1.082v-.855l-7.207-8.07-4.84 5.187L6.169 6.57l-5.48 5.965v.871ZM.688 16.844h20.625v1.375H.688Zm0 0'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23333' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate:disabled .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23aaa' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3Cpath fill='red' d='m14 5 1 1-9 9-1-1z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-active .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%2333b5e5' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-active-error .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23e58978' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-background .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%2333b5e5' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-background-error .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23e54e33' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3C/svg%3E")}.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 (forced-colors:active){.maplibregl-ctrl button.maplibregl-ctrl-geolocate .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23fff' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate:disabled .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23999' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3Cpath fill='red' d='m14 5 1 1-9 9-1-1z'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-active .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%2333b5e5' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-active-error .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23e58978' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-background .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%2333b5e5' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-background-error .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23e54e33' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3C/svg%3E")}}@media (forced-colors:active) and (prefers-color-scheme:light){.maplibregl-ctrl button.maplibregl-ctrl-geolocate .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3C/svg%3E")}.maplibregl-ctrl button.maplibregl-ctrl-geolocate:disabled .maplibregl-ctrl-icon{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' fill='%23666' viewBox='0 0 20 20'%3E%3Cpath d='M10 4C9 4 9 5 9 5v.1A5 5 0 0 0 5.1 9H5s-1 0-1 1 1 1 1 1h.1A5 5 0 0 0 9 14.9v.1s0 1 1 1 1-1 1-1v-.1a5 5 0 0 0 3.9-3.9h.1s1 0 1-1-1-1-1-1h-.1A5 5 0 0 0 11 5.1V5s0-1-1-1m0 2.5a3.5 3.5 0 1 1 0 7 3.5 3.5 0 1 1 0-7'/%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3Cpath fill='red' d='m14 5 1 1-9 9-1-1z'/%3E%3C/svg%3E")}}@-webkit-keyframes maplibregl-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes maplibregl-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}a.maplibregl-ctrl-logo{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='23' fill='none'%3E%3Cpath fill='%23000' fill-opacity='.4' fill-rule='evenodd' d='M17.408 16.796h-1.827l2.501-12.095h.198l3.324 6.533.988 2.19.988-2.19 3.258-6.533h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.929 5.644h-.098l-2.914-5.644-.757-1.71-.345 1.71zm1.958-3.42-.726 3.663a1.255 1.255 0 0 1-1.232 1.011h-1.827a1.255 1.255 0 0 1-1.229-1.509l2.501-12.095a1.255 1.255 0 0 1 1.23-1.001h.197a1.25 1.25 0 0 1 1.12.685l3.19 6.273 3.125-6.263a1.25 1.25 0 0 1 1.123-.695h.181a1.255 1.255 0 0 1 1.227.991l1.443 6.71a5 5 0 0 1 .314-.787l.009-.016a4.6 4.6 0 0 1 1.777-1.887c.782-.46 1.668-.667 2.611-.667a4.6 4.6 0 0 1 1.7.32l.306.134c.21-.16.474-.256.759-.256h1.694a1.255 1.255 0 0 1 1.212.925 1.255 1.255 0 0 1 1.212-.925h1.711c.284 0 .545.094.755.252.613-.3 1.312-.45 2.075-.45 1.356 0 2.557.445 3.482 1.4q.47.48.763 1.064V4.701a1.255 1.255 0 0 1 1.255-1.255h1.86A1.255 1.255 0 0 1 54.44 4.7v9.194h2.217c.19 0 .37.043.532.118v-4.77c0-.356.147-.678.385-.906a2.42 2.42 0 0 1-.682-1.71c0-.665.267-1.253.735-1.7a2.45 2.45 0 0 1 1.722-.674 2.43 2.43 0 0 1 1.705.675q.318.302.504.683V4.7a1.255 1.255 0 0 1 1.255-1.255h1.744A1.255 1.255 0 0 1 65.812 4.7v3.335a4.8 4.8 0 0 1 1.526-.246c.938 0 1.817.214 2.59.69a4.47 4.47 0 0 1 1.67 1.743v-.98a1.255 1.255 0 0 1 1.256-1.256h1.777c.233 0 .451.064.639.174a3.4 3.4 0 0 1 1.567-.372c.346 0 .861.02 1.285.232a1.25 1.25 0 0 1 .689 1.004 4.7 4.7 0 0 1 .853-.588c.795-.44 1.675-.647 2.61-.647 1.385 0 2.65.39 3.525 1.396.836.938 1.168 2.173 1.168 3.528q-.001.515-.056 1.051a1.255 1.255 0 0 1-.947 1.09l.408.952a1.255 1.255 0 0 1-.477 1.552c-.418.268-.92.463-1.458.612-.613.171-1.304.244-2.049.244-1.06 0-2.043-.207-2.886-.698l-.015-.008c-.798-.48-1.419-1.135-1.818-1.963l-.004-.008a5.8 5.8 0 0 1-.548-2.512q0-.429.053-.843a1.3 1.3 0 0 1-.333-.086l-.166-.004c-.223 0-.426.062-.643.228-.03.024-.142.139-.142.59v3.883a1.255 1.255 0 0 1-1.256 1.256h-1.777a1.255 1.255 0 0 1-1.256-1.256V15.69l-.032.057a4.8 4.8 0 0 1-1.86 1.833 5.04 5.04 0 0 1-2.484.634 4.5 4.5 0 0 1-1.935-.424 1.25 1.25 0 0 1-.764.258h-1.71a1.255 1.255 0 0 1-1.256-1.255V7.687a2.4 2.4 0 0 1-.428.625c.253.23.412.561.412.93v7.553a1.255 1.255 0 0 1-1.256 1.255h-1.843a1.25 1.25 0 0 1-.894-.373c-.228.23-.544.373-.894.373H51.32a1.255 1.255 0 0 1-1.256-1.255v-1.251l-.061.117a4.7 4.7 0 0 1-1.782 1.884 4.77 4.77 0 0 1-2.485.67 5.6 5.6 0 0 1-1.485-.188l.009 2.764a1.255 1.255 0 0 1-1.255 1.259h-1.729a1.255 1.255 0 0 1-1.255-1.255v-3.537a1.255 1.255 0 0 1-1.167.793h-1.679a1.25 1.25 0 0 1-.77-.263 4.5 4.5 0 0 1-1.945.429c-.885 0-1.724-.21-2.495-.632l-.017-.01a5 5 0 0 1-1.081-.836 1.255 1.255 0 0 1-1.254 1.312h-1.81a1.255 1.255 0 0 1-1.228-.99l-.782-3.625-2.044 3.939a1.25 1.25 0 0 1-1.115.676h-.098a1.25 1.25 0 0 1-1.116-.68l-2.061-3.994zM35.92 16.63l.207-.114.223-.15q.493-.356.735-.785l.061-.118.033 1.332h1.678V9.242h-1.694l-.033 1.267q-.133-.329-.526-.658l-.032-.028a3.2 3.2 0 0 0-.668-.428l-.27-.12a3.3 3.3 0 0 0-1.235-.23q-1.136-.001-1.974.493a3.36 3.36 0 0 0-1.3 1.382q-.445.89-.444 2.074 0 1.2.51 2.107a3.8 3.8 0 0 0 1.382 1.381 3.9 3.9 0 0 0 1.893.477q.795 0 1.455-.33zm-2.789-5.38q-.576.675-.575 1.762 0 1.102.559 1.794.576.675 1.645.675a2.25 2.25 0 0 0 .934-.19 2.2 2.2 0 0 0 .468-.29l.178-.161a2.2 2.2 0 0 0 .397-.561q.244-.5.244-1.15v-.115q0-.708-.296-1.267l-.043-.077a2.2 2.2 0 0 0-.633-.709l-.13-.086-.047-.028a2.1 2.1 0 0 0-1.073-.285q-1.052 0-1.629.692zm2.316 2.706c.163-.17.28-.407.28-.83v-.114c0-.292-.06-.508-.15-.68a.96.96 0 0 0-.353-.389.85.85 0 0 0-.464-.127c-.4 0-.56.114-.664.239l-.01.012c-.148.174-.275.45-.275.945 0 .506.122.801.27.99.097.11.266.224.68.224.303 0 .504-.09.687-.269zm7.545 1.705a2.6 2.6 0 0 0 .331.423q.319.33.755.548l.173.074q.65.255 1.49.255 1.02 0 1.844-.493a3.45 3.45 0 0 0 1.316-1.4q.493-.904.493-2.089 0-1.909-.988-2.913-.988-1.02-2.584-1.02-.898 0-1.575.347a3 3 0 0 0-.415.262l-.199.166a3.4 3.4 0 0 0-.64.82V9.242h-1.712v11.553h1.729l-.017-5.134zm.53-1.138q.206.29.48.5l.155.11.053.034q.51.296 1.119.297 1.07 0 1.645-.675.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.435 0-.835.16a2 2 0 0 0-.284.136 2 2 0 0 0-.363.254 2.2 2.2 0 0 0-.46.569l-.082.162a2.6 2.6 0 0 0-.213 1.072v.115q0 .707.296 1.267l.135.211zm.964-.818a1.1 1.1 0 0 0 .367.385.94.94 0 0 0 .476.118c.423 0 .59-.117.687-.23.159-.194.28-.478.28-.95 0-.53-.133-.8-.266-.952l-.021-.025c-.078-.094-.231-.221-.68-.221a1 1 0 0 0-.503.135l-.012.007a.86.86 0 0 0-.335.343c-.073.133-.132.324-.132.614v.115a1.4 1.4 0 0 0 .14.66zm15.7-6.222q.347-.346.346-.856a1.05 1.05 0 0 0-.345-.79 1.18 1.18 0 0 0-.84-.329q-.51 0-.855.33a1.05 1.05 0 0 0-.346.79q0 .51.346.855.345.346.856.346.51 0 .839-.346zm4.337 9.314.033-1.332q.191.403.59.747l.098.081a4 4 0 0 0 .316.224l.223.122a3.2 3.2 0 0 0 1.44.322 3.8 3.8 0 0 0 1.875-.477 3.5 3.5 0 0 0 1.382-1.366q.527-.89.526-2.09 0-1.184-.444-2.073a3.24 3.24 0 0 0-1.283-1.399q-.823-.51-1.942-.51a3.5 3.5 0 0 0-1.527.344l-.086.043-.165.09a3 3 0 0 0-.33.214q-.432.315-.656.707a2 2 0 0 0-.099.198l.082-1.283V4.701h-1.744v12.095zm.473-2.509a2.5 2.5 0 0 0 .566.7q.117.098.245.18l.144.08a2.1 2.1 0 0 0 .975.232q1.07 0 1.645-.675.576-.69.576-1.778 0-1.102-.576-1.777-.56-.691-1.645-.692a2.2 2.2 0 0 0-1.015.235q-.22.113-.415.282l-.15.142a2.1 2.1 0 0 0-.42.594q-.223.479-.223 1.1v.115q0 .705.293 1.26zm2.616-.293c.157-.191.28-.479.28-.967 0-.51-.13-.79-.276-.961l-.021-.026c-.082-.1-.232-.225-.67-.225a.87.87 0 0 0-.681.279l-.012.011c-.154.155-.274.38-.274.807v.115c0 .285.057.499.144.669a1.1 1.1 0 0 0 .367.405c.137.082.28.123.455.123.423 0 .59-.118.686-.23zm8.266-3.013q.345-.13.724-.14l.069-.002q.493 0 .642.099l.247-1.794q-.196-.099-.717-.099a2.3 2.3 0 0 0-.545.063 2 2 0 0 0-.411.148 2.2 2.2 0 0 0-.4.249 2.5 2.5 0 0 0-.485.499 2.7 2.7 0 0 0-.32.581l-.05.137v-1.48h-1.778v7.553h1.777v-3.884q0-.546.159-.943a1.5 1.5 0 0 1 .466-.636 2.5 2.5 0 0 1 .399-.253 2 2 0 0 1 .224-.099zm9.784 2.656.05-.922q0-1.743-.856-2.698-.838-.97-2.584-.97-1.119-.001-2.007.493a3.46 3.46 0 0 0-1.4 1.382q-.493.906-.493 2.106 0 1.07.428 1.975.428.89 1.332 1.432.906.526 2.255.526.973 0 1.668-.185l.044-.012.135-.04q.613-.184.984-.421l-.542-1.267q-.3.162-.642.274l-.297.087q-.51.131-1.3.131-.954 0-1.497-.444a1.6 1.6 0 0 1-.192-.193q-.366-.44-.512-1.234l-.004-.021zm-5.427-1.256-.003.022h3.752v-.138q-.011-.727-.288-1.118a1 1 0 0 0-.156-.176q-.46-.428-1.316-.428-.986 0-1.494.604-.379.45-.494 1.234zm-27.053 2.77V4.7h-1.86v12.095h5.333V15.15zm7.103-5.908v7.553h-1.843V9.242h1.843z'/%3E%3Cpath fill='%23fff' d='m19.63 11.151-.757-1.71-.345 1.71-1.12 5.644h-1.827L18.083 4.7h.197l3.325 6.533.988 2.19.988-2.19L26.839 4.7h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.93 5.644h-.098l-2.913-5.644zm14.836 5.81q-1.02 0-1.893-.478a3.8 3.8 0 0 1-1.381-1.382q-.51-.906-.51-2.106 0-1.185.444-2.074a3.36 3.36 0 0 1 1.3-1.382q.839-.494 1.974-.494a3.3 3.3 0 0 1 1.234.231 3.3 3.3 0 0 1 .97.575q.396.33.527.659l.033-1.267h1.694v7.553H37.18l-.033-1.332q-.279.593-1.02 1.053a3.17 3.17 0 0 1-1.662.444zm.296-1.482q.938 0 1.58-.642.642-.66.642-1.711v-.115q0-.708-.296-1.267a2.2 2.2 0 0 0-.807-.872 2.1 2.1 0 0 0-1.119-.313q-1.053 0-1.629.692-.575.675-.575 1.76 0 1.103.559 1.795.577.675 1.645.675zm6.521-6.237h1.711v1.4q.906-1.597 2.83-1.597 1.596 0 2.584 1.02.988 1.005.988 2.914 0 1.185-.493 2.09a3.46 3.46 0 0 1-1.316 1.399 3.5 3.5 0 0 1-1.844.493q-.954 0-1.662-.329a2.67 2.67 0 0 1-1.086-.97l.017 5.134h-1.728zm4.048 6.22q1.07 0 1.645-.674.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.592 0-1.12.296-.51.28-.822.823-.296.527-.296 1.234v.115q0 .708.296 1.267.313.543.823.855.51.296 1.119.297z'/%3E%3Cpath fill='%23e1e3e9' d='M51.325 4.7h1.86v10.45h3.473v1.646h-5.333zm7.12 4.542h1.843v7.553h-1.843zm.905-1.415a1.16 1.16 0 0 1-.856-.346 1.17 1.17 0 0 1-.346-.856 1.05 1.05 0 0 1 .346-.79q.346-.329.856-.329.494 0 .839.33a1.05 1.05 0 0 1 .345.79 1.16 1.16 0 0 1-.345.855q-.33.346-.84.346zm7.875 9.133a3.17 3.17 0 0 1-1.662-.444q-.723-.46-1.004-1.053l-.033 1.332h-1.71V4.701h1.743v4.657l-.082 1.283q.279-.658 1.086-1.119a3.5 3.5 0 0 1 1.778-.477q1.119 0 1.942.51a3.24 3.24 0 0 1 1.283 1.4q.445.888.444 2.072 0 1.201-.526 2.09a3.5 3.5 0 0 1-1.382 1.366 3.8 3.8 0 0 1-1.876.477zm-.296-1.481q1.069 0 1.645-.675.577-.69.577-1.778 0-1.102-.577-1.776-.56-.691-1.645-.692a2.12 2.12 0 0 0-1.58.659q-.642.641-.642 1.694v.115q0 .71.296 1.267a2.4 2.4 0 0 0 .807.872 2.1 2.1 0 0 0 1.119.313zm5.927-6.237h1.777v1.481q.263-.757.856-1.217a2.14 2.14 0 0 1 1.349-.46q.527 0 .724.098l-.247 1.794q-.149-.099-.642-.099-.774 0-1.416.494-.626.493-.626 1.58v3.883h-1.777V9.242zm9.534 7.718q-1.35 0-2.255-.526-.904-.543-1.332-1.432a4.6 4.6 0 0 1-.428-1.975q0-1.2.493-2.106a3.46 3.46 0 0 1 1.4-1.382q.889-.495 2.007-.494 1.744 0 2.584.97.855.956.856 2.7 0 .444-.05.92h-5.43q.18 1.005.708 1.45.542.443 1.497.443.79 0 1.3-.131a4 4 0 0 0 .938-.362l.542 1.267q-.411.263-1.119.46-.708.198-1.711.197zm1.596-4.558q.016-1.02-.444-1.432-.46-.428-1.316-.428-1.728 0-1.991 1.86z'/%3E%3Cpath d='M5.074 15.948a.484.657 0 0 0-.486.659v1.84a.484.657 0 0 0 .486.659h4.101a.484.657 0 0 0 .486-.659v-1.84a.484.657 0 0 0-.486-.659zm3.56 1.16H5.617v.838h3.017z' style='fill:%23fff;fill-rule:evenodd;stroke-width:1.03600001'/%3E%3Cg style='stroke-width:1.12603545'%3E%3Cpath d='M-9.408-1.416c-3.833-.025-7.056 2.912-7.08 6.615-.02 3.08 1.653 4.832 3.107 6.268.903.892 1.721 1.74 2.32 2.902l-.525-.004c-.543-.003-.992.304-1.24.639a1.87 1.87 0 0 0-.362 1.121l-.011 1.877c-.003.402.104.787.347 1.125.244.338.688.653 1.23.656l4.142.028c.542.003.99-.306 1.238-.641a1.87 1.87 0 0 0 .363-1.121l.012-1.875a1.87 1.87 0 0 0-.348-1.127c-.243-.338-.688-.653-1.23-.656l-.518-.004c.597-1.145 1.425-1.983 2.348-2.87 1.473-1.414 3.18-3.149 3.2-6.226-.016-3.59-2.923-6.684-6.993-6.707m-.006 1.1v.002c3.274.02 5.92 2.532 5.9 5.6-.017 2.706-1.39 4.026-2.863 5.44-1.034.994-2.118 2.033-2.814 3.633-.018.041-.052.055-.075.065q-.013.004-.02.01a.34.34 0 0 1-.226.084.34.34 0 0 1-.224-.086l-.092-.077c-.699-1.615-1.768-2.669-2.781-3.67-1.454-1.435-2.797-2.762-2.78-5.478.02-3.067 2.7-5.545 5.975-5.523m-.02 2.826c-1.62-.01-2.944 1.315-2.955 2.96-.01 1.646 1.295 2.988 2.916 2.999h.002c1.621.01 2.943-1.316 2.953-2.961.011-1.646-1.294-2.988-2.916-2.998m-.005 1.1c1.017.006 1.829.83 1.822 1.89s-.83 1.874-1.848 1.867c-1.018-.006-1.829-.83-1.822-1.89s.83-1.874 1.848-1.868m-2.155 11.857 4.14.025c.271.002.49.305.487.676l-.013 1.875c-.003.37-.224.67-.495.668l-4.14-.025c-.27-.002-.487-.306-.485-.676l.012-1.875c.003-.37.224-.67.494-.668' style='color:%23000;font-style:normal;font-variant:normal;font-weight:400;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:%23000;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;text-orientation:mixed;dominant-baseline:auto;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;clip-rule:evenodd;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:%23000;solid-opacity:1;vector-effect:none;fill:%23000;fill-opacity:.4;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto' transform='translate(15.553 2.85)scale(.88807)'/%3E%3Cpath d='M-9.415-.316C-12.69-.338-15.37 2.14-15.39 5.207c-.017 2.716 1.326 4.041 2.78 5.477 1.013 1 2.081 2.055 2.78 3.67l.092.076a.34.34 0 0 0 .225.086.34.34 0 0 0 .227-.083l.019-.01c.022-.009.057-.024.074-.064.697-1.6 1.78-2.64 2.814-3.634 1.473-1.414 2.847-2.733 2.864-5.44.02-3.067-2.627-5.58-5.901-5.601m-.057 8.784c1.621.011 2.944-1.315 2.955-2.96.01-1.646-1.295-2.988-2.916-2.999-1.622-.01-2.945 1.315-2.955 2.96s1.295 2.989 2.916 3' style='clip-rule:evenodd;fill:%23e1e3e9;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:.4' transform='translate(15.553 2.85)scale(.88807)'/%3E%3Cpath d='M-11.594 15.465c-.27-.002-.492.297-.494.668l-.012 1.876c-.003.371.214.673.485.675l4.14.027c.271.002.492-.298.495-.668l.012-1.877c.003-.37-.215-.672-.485-.674z' style='clip-rule:evenodd;fill:%23fff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:.4' transform='translate(15.553 2.85)scale(.88807)'/%3E%3C/g%3E%3C/svg%3E");background-repeat:no-repeat;cursor:pointer;display:block;height:23px;margin:0 0 -4px -4px;overflow:hidden;width:88px}a.maplibregl-ctrl-logo.maplibregl-compact{width:14px}@media (forced-colors:active){a.maplibregl-ctrl-logo{background-color:transparent;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='23' fill='none'%3E%3Cpath fill='%23000' fill-opacity='.4' fill-rule='evenodd' d='M17.408 16.796h-1.827l2.501-12.095h.198l3.324 6.533.988 2.19.988-2.19 3.258-6.533h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.929 5.644h-.098l-2.914-5.644-.757-1.71-.345 1.71zm1.958-3.42-.726 3.663a1.255 1.255 0 0 1-1.232 1.011h-1.827a1.255 1.255 0 0 1-1.229-1.509l2.501-12.095a1.255 1.255 0 0 1 1.23-1.001h.197a1.25 1.25 0 0 1 1.12.685l3.19 6.273 3.125-6.263a1.25 1.25 0 0 1 1.123-.695h.181a1.255 1.255 0 0 1 1.227.991l1.443 6.71a5 5 0 0 1 .314-.787l.009-.016a4.6 4.6 0 0 1 1.777-1.887c.782-.46 1.668-.667 2.611-.667a4.6 4.6 0 0 1 1.7.32l.306.134c.21-.16.474-.256.759-.256h1.694a1.255 1.255 0 0 1 1.212.925 1.255 1.255 0 0 1 1.212-.925h1.711c.284 0 .545.094.755.252.613-.3 1.312-.45 2.075-.45 1.356 0 2.557.445 3.482 1.4q.47.48.763 1.064V4.701a1.255 1.255 0 0 1 1.255-1.255h1.86A1.255 1.255 0 0 1 54.44 4.7v9.194h2.217c.19 0 .37.043.532.118v-4.77c0-.356.147-.678.385-.906a2.42 2.42 0 0 1-.682-1.71c0-.665.267-1.253.735-1.7a2.45 2.45 0 0 1 1.722-.674 2.43 2.43 0 0 1 1.705.675q.318.302.504.683V4.7a1.255 1.255 0 0 1 1.255-1.255h1.744A1.255 1.255 0 0 1 65.812 4.7v3.335a4.8 4.8 0 0 1 1.526-.246c.938 0 1.817.214 2.59.69a4.47 4.47 0 0 1 1.67 1.743v-.98a1.255 1.255 0 0 1 1.256-1.256h1.777c.233 0 .451.064.639.174a3.4 3.4 0 0 1 1.567-.372c.346 0 .861.02 1.285.232a1.25 1.25 0 0 1 .689 1.004 4.7 4.7 0 0 1 .853-.588c.795-.44 1.675-.647 2.61-.647 1.385 0 2.65.39 3.525 1.396.836.938 1.168 2.173 1.168 3.528q-.001.515-.056 1.051a1.255 1.255 0 0 1-.947 1.09l.408.952a1.255 1.255 0 0 1-.477 1.552c-.418.268-.92.463-1.458.612-.613.171-1.304.244-2.049.244-1.06 0-2.043-.207-2.886-.698l-.015-.008c-.798-.48-1.419-1.135-1.818-1.963l-.004-.008a5.8 5.8 0 0 1-.548-2.512q0-.429.053-.843a1.3 1.3 0 0 1-.333-.086l-.166-.004c-.223 0-.426.062-.643.228-.03.024-.142.139-.142.59v3.883a1.255 1.255 0 0 1-1.256 1.256h-1.777a1.255 1.255 0 0 1-1.256-1.256V15.69l-.032.057a4.8 4.8 0 0 1-1.86 1.833 5.04 5.04 0 0 1-2.484.634 4.5 4.5 0 0 1-1.935-.424 1.25 1.25 0 0 1-.764.258h-1.71a1.255 1.255 0 0 1-1.256-1.255V7.687a2.4 2.4 0 0 1-.428.625c.253.23.412.561.412.93v7.553a1.255 1.255 0 0 1-1.256 1.255h-1.843a1.25 1.25 0 0 1-.894-.373c-.228.23-.544.373-.894.373H51.32a1.255 1.255 0 0 1-1.256-1.255v-1.251l-.061.117a4.7 4.7 0 0 1-1.782 1.884 4.77 4.77 0 0 1-2.485.67 5.6 5.6 0 0 1-1.485-.188l.009 2.764a1.255 1.255 0 0 1-1.255 1.259h-1.729a1.255 1.255 0 0 1-1.255-1.255v-3.537a1.255 1.255 0 0 1-1.167.793h-1.679a1.25 1.25 0 0 1-.77-.263 4.5 4.5 0 0 1-1.945.429c-.885 0-1.724-.21-2.495-.632l-.017-.01a5 5 0 0 1-1.081-.836 1.255 1.255 0 0 1-1.254 1.312h-1.81a1.255 1.255 0 0 1-1.228-.99l-.782-3.625-2.044 3.939a1.25 1.25 0 0 1-1.115.676h-.098a1.25 1.25 0 0 1-1.116-.68l-2.061-3.994zM35.92 16.63l.207-.114.223-.15q.493-.356.735-.785l.061-.118.033 1.332h1.678V9.242h-1.694l-.033 1.267q-.133-.329-.526-.658l-.032-.028a3.2 3.2 0 0 0-.668-.428l-.27-.12a3.3 3.3 0 0 0-1.235-.23q-1.136-.001-1.974.493a3.36 3.36 0 0 0-1.3 1.382q-.445.89-.444 2.074 0 1.2.51 2.107a3.8 3.8 0 0 0 1.382 1.381 3.9 3.9 0 0 0 1.893.477q.795 0 1.455-.33zm-2.789-5.38q-.576.675-.575 1.762 0 1.102.559 1.794.576.675 1.645.675a2.25 2.25 0 0 0 .934-.19 2.2 2.2 0 0 0 .468-.29l.178-.161a2.2 2.2 0 0 0 .397-.561q.244-.5.244-1.15v-.115q0-.708-.296-1.267l-.043-.077a2.2 2.2 0 0 0-.633-.709l-.13-.086-.047-.028a2.1 2.1 0 0 0-1.073-.285q-1.052 0-1.629.692zm2.316 2.706c.163-.17.28-.407.28-.83v-.114c0-.292-.06-.508-.15-.68a.96.96 0 0 0-.353-.389.85.85 0 0 0-.464-.127c-.4 0-.56.114-.664.239l-.01.012c-.148.174-.275.45-.275.945 0 .506.122.801.27.99.097.11.266.224.68.224.303 0 .504-.09.687-.269zm7.545 1.705a2.6 2.6 0 0 0 .331.423q.319.33.755.548l.173.074q.65.255 1.49.255 1.02 0 1.844-.493a3.45 3.45 0 0 0 1.316-1.4q.493-.904.493-2.089 0-1.909-.988-2.913-.988-1.02-2.584-1.02-.898 0-1.575.347a3 3 0 0 0-.415.262l-.199.166a3.4 3.4 0 0 0-.64.82V9.242h-1.712v11.553h1.729l-.017-5.134zm.53-1.138q.206.29.48.5l.155.11.053.034q.51.296 1.119.297 1.07 0 1.645-.675.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.435 0-.835.16a2 2 0 0 0-.284.136 2 2 0 0 0-.363.254 2.2 2.2 0 0 0-.46.569l-.082.162a2.6 2.6 0 0 0-.213 1.072v.115q0 .707.296 1.267l.135.211zm.964-.818a1.1 1.1 0 0 0 .367.385.94.94 0 0 0 .476.118c.423 0 .59-.117.687-.23.159-.194.28-.478.28-.95 0-.53-.133-.8-.266-.952l-.021-.025c-.078-.094-.231-.221-.68-.221a1 1 0 0 0-.503.135l-.012.007a.86.86 0 0 0-.335.343c-.073.133-.132.324-.132.614v.115a1.4 1.4 0 0 0 .14.66zm15.7-6.222q.347-.346.346-.856a1.05 1.05 0 0 0-.345-.79 1.18 1.18 0 0 0-.84-.329q-.51 0-.855.33a1.05 1.05 0 0 0-.346.79q0 .51.346.855.345.346.856.346.51 0 .839-.346zm4.337 9.314.033-1.332q.191.403.59.747l.098.081a4 4 0 0 0 .316.224l.223.122a3.2 3.2 0 0 0 1.44.322 3.8 3.8 0 0 0 1.875-.477 3.5 3.5 0 0 0 1.382-1.366q.527-.89.526-2.09 0-1.184-.444-2.073a3.24 3.24 0 0 0-1.283-1.399q-.823-.51-1.942-.51a3.5 3.5 0 0 0-1.527.344l-.086.043-.165.09a3 3 0 0 0-.33.214q-.432.315-.656.707a2 2 0 0 0-.099.198l.082-1.283V4.701h-1.744v12.095zm.473-2.509a2.5 2.5 0 0 0 .566.7q.117.098.245.18l.144.08a2.1 2.1 0 0 0 .975.232q1.07 0 1.645-.675.576-.69.576-1.778 0-1.102-.576-1.777-.56-.691-1.645-.692a2.2 2.2 0 0 0-1.015.235q-.22.113-.415.282l-.15.142a2.1 2.1 0 0 0-.42.594q-.223.479-.223 1.1v.115q0 .705.293 1.26zm2.616-.293c.157-.191.28-.479.28-.967 0-.51-.13-.79-.276-.961l-.021-.026c-.082-.1-.232-.225-.67-.225a.87.87 0 0 0-.681.279l-.012.011c-.154.155-.274.38-.274.807v.115c0 .285.057.499.144.669a1.1 1.1 0 0 0 .367.405c.137.082.28.123.455.123.423 0 .59-.118.686-.23zm8.266-3.013q.345-.13.724-.14l.069-.002q.493 0 .642.099l.247-1.794q-.196-.099-.717-.099a2.3 2.3 0 0 0-.545.063 2 2 0 0 0-.411.148 2.2 2.2 0 0 0-.4.249 2.5 2.5 0 0 0-.485.499 2.7 2.7 0 0 0-.32.581l-.05.137v-1.48h-1.778v7.553h1.777v-3.884q0-.546.159-.943a1.5 1.5 0 0 1 .466-.636 2.5 2.5 0 0 1 .399-.253 2 2 0 0 1 .224-.099zm9.784 2.656.05-.922q0-1.743-.856-2.698-.838-.97-2.584-.97-1.119-.001-2.007.493a3.46 3.46 0 0 0-1.4 1.382q-.493.906-.493 2.106 0 1.07.428 1.975.428.89 1.332 1.432.906.526 2.255.526.973 0 1.668-.185l.044-.012.135-.04q.613-.184.984-.421l-.542-1.267q-.3.162-.642.274l-.297.087q-.51.131-1.3.131-.954 0-1.497-.444a1.6 1.6 0 0 1-.192-.193q-.366-.44-.512-1.234l-.004-.021zm-5.427-1.256-.003.022h3.752v-.138q-.011-.727-.288-1.118a1 1 0 0 0-.156-.176q-.46-.428-1.316-.428-.986 0-1.494.604-.379.45-.494 1.234zm-27.053 2.77V4.7h-1.86v12.095h5.333V15.15zm7.103-5.908v7.553h-1.843V9.242h1.843z'/%3E%3Cpath fill='%23fff' d='m19.63 11.151-.757-1.71-.345 1.71-1.12 5.644h-1.827L18.083 4.7h.197l3.325 6.533.988 2.19.988-2.19L26.839 4.7h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.93 5.644h-.098l-2.913-5.644zm14.836 5.81q-1.02 0-1.893-.478a3.8 3.8 0 0 1-1.381-1.382q-.51-.906-.51-2.106 0-1.185.444-2.074a3.36 3.36 0 0 1 1.3-1.382q.839-.494 1.974-.494a3.3 3.3 0 0 1 1.234.231 3.3 3.3 0 0 1 .97.575q.396.33.527.659l.033-1.267h1.694v7.553H37.18l-.033-1.332q-.279.593-1.02 1.053a3.17 3.17 0 0 1-1.662.444zm.296-1.482q.938 0 1.58-.642.642-.66.642-1.711v-.115q0-.708-.296-1.267a2.2 2.2 0 0 0-.807-.872 2.1 2.1 0 0 0-1.119-.313q-1.053 0-1.629.692-.575.675-.575 1.76 0 1.103.559 1.795.577.675 1.645.675zm6.521-6.237h1.711v1.4q.906-1.597 2.83-1.597 1.596 0 2.584 1.02.988 1.005.988 2.914 0 1.185-.493 2.09a3.46 3.46 0 0 1-1.316 1.399 3.5 3.5 0 0 1-1.844.493q-.954 0-1.662-.329a2.67 2.67 0 0 1-1.086-.97l.017 5.134h-1.728zm4.048 6.22q1.07 0 1.645-.674.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.592 0-1.12.296-.51.28-.822.823-.296.527-.296 1.234v.115q0 .708.296 1.267.313.543.823.855.51.296 1.119.297z'/%3E%3Cpath fill='%23e1e3e9' d='M51.325 4.7h1.86v10.45h3.473v1.646h-5.333zm7.12 4.542h1.843v7.553h-1.843zm.905-1.415a1.16 1.16 0 0 1-.856-.346 1.17 1.17 0 0 1-.346-.856 1.05 1.05 0 0 1 .346-.79q.346-.329.856-.329.494 0 .839.33a1.05 1.05 0 0 1 .345.79 1.16 1.16 0 0 1-.345.855q-.33.346-.84.346zm7.875 9.133a3.17 3.17 0 0 1-1.662-.444q-.723-.46-1.004-1.053l-.033 1.332h-1.71V4.701h1.743v4.657l-.082 1.283q.279-.658 1.086-1.119a3.5 3.5 0 0 1 1.778-.477q1.119 0 1.942.51a3.24 3.24 0 0 1 1.283 1.4q.445.888.444 2.072 0 1.201-.526 2.09a3.5 3.5 0 0 1-1.382 1.366 3.8 3.8 0 0 1-1.876.477zm-.296-1.481q1.069 0 1.645-.675.577-.69.577-1.778 0-1.102-.577-1.776-.56-.691-1.645-.692a2.12 2.12 0 0 0-1.58.659q-.642.641-.642 1.694v.115q0 .71.296 1.267a2.4 2.4 0 0 0 .807.872 2.1 2.1 0 0 0 1.119.313zm5.927-6.237h1.777v1.481q.263-.757.856-1.217a2.14 2.14 0 0 1 1.349-.46q.527 0 .724.098l-.247 1.794q-.149-.099-.642-.099-.774 0-1.416.494-.626.493-.626 1.58v3.883h-1.777V9.242zm9.534 7.718q-1.35 0-2.255-.526-.904-.543-1.332-1.432a4.6 4.6 0 0 1-.428-1.975q0-1.2.493-2.106a3.46 3.46 0 0 1 1.4-1.382q.889-.495 2.007-.494 1.744 0 2.584.97.855.956.856 2.7 0 .444-.05.92h-5.43q.18 1.005.708 1.45.542.443 1.497.443.79 0 1.3-.131a4 4 0 0 0 .938-.362l.542 1.267q-.411.263-1.119.46-.708.198-1.711.197zm1.596-4.558q.016-1.02-.444-1.432-.46-.428-1.316-.428-1.728 0-1.991 1.86z'/%3E%3Cpath d='M5.074 15.948a.484.657 0 0 0-.486.659v1.84a.484.657 0 0 0 .486.659h4.101a.484.657 0 0 0 .486-.659v-1.84a.484.657 0 0 0-.486-.659zm3.56 1.16H5.617v.838h3.017z' style='fill:%23fff;fill-rule:evenodd;stroke-width:1.03600001'/%3E%3Cg style='stroke-width:1.12603545'%3E%3Cpath d='M-9.408-1.416c-3.833-.025-7.056 2.912-7.08 6.615-.02 3.08 1.653 4.832 3.107 6.268.903.892 1.721 1.74 2.32 2.902l-.525-.004c-.543-.003-.992.304-1.24.639a1.87 1.87 0 0 0-.362 1.121l-.011 1.877c-.003.402.104.787.347 1.125.244.338.688.653 1.23.656l4.142.028c.542.003.99-.306 1.238-.641a1.87 1.87 0 0 0 .363-1.121l.012-1.875a1.87 1.87 0 0 0-.348-1.127c-.243-.338-.688-.653-1.23-.656l-.518-.004c.597-1.145 1.425-1.983 2.348-2.87 1.473-1.414 3.18-3.149 3.2-6.226-.016-3.59-2.923-6.684-6.993-6.707m-.006 1.1v.002c3.274.02 5.92 2.532 5.9 5.6-.017 2.706-1.39 4.026-2.863 5.44-1.034.994-2.118 2.033-2.814 3.633-.018.041-.052.055-.075.065q-.013.004-.02.01a.34.34 0 0 1-.226.084.34.34 0 0 1-.224-.086l-.092-.077c-.699-1.615-1.768-2.669-2.781-3.67-1.454-1.435-2.797-2.762-2.78-5.478.02-3.067 2.7-5.545 5.975-5.523m-.02 2.826c-1.62-.01-2.944 1.315-2.955 2.96-.01 1.646 1.295 2.988 2.916 2.999h.002c1.621.01 2.943-1.316 2.953-2.961.011-1.646-1.294-2.988-2.916-2.998m-.005 1.1c1.017.006 1.829.83 1.822 1.89s-.83 1.874-1.848 1.867c-1.018-.006-1.829-.83-1.822-1.89s.83-1.874 1.848-1.868m-2.155 11.857 4.14.025c.271.002.49.305.487.676l-.013 1.875c-.003.37-.224.67-.495.668l-4.14-.025c-.27-.002-.487-.306-.485-.676l.012-1.875c.003-.37.224-.67.494-.668' style='color:%23000;font-style:normal;font-variant:normal;font-weight:400;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:%23000;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;text-orientation:mixed;dominant-baseline:auto;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;clip-rule:evenodd;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:%23000;solid-opacity:1;vector-effect:none;fill:%23000;fill-opacity:.4;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto' transform='translate(15.553 2.85)scale(.88807)'/%3E%3Cpath d='M-9.415-.316C-12.69-.338-15.37 2.14-15.39 5.207c-.017 2.716 1.326 4.041 2.78 5.477 1.013 1 2.081 2.055 2.78 3.67l.092.076a.34.34 0 0 0 .225.086.34.34 0 0 0 .227-.083l.019-.01c.022-.009.057-.024.074-.064.697-1.6 1.78-2.64 2.814-3.634 1.473-1.414 2.847-2.733 2.864-5.44.02-3.067-2.627-5.58-5.901-5.601m-.057 8.784c1.621.011 2.944-1.315 2.955-2.96.01-1.646-1.295-2.988-2.916-2.999-1.622-.01-2.945 1.315-2.955 2.96s1.295 2.989 2.916 3' style='clip-rule:evenodd;fill:%23e1e3e9;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:.4' transform='translate(15.553 2.85)scale(.88807)'/%3E%3Cpath d='M-11.594 15.465c-.27-.002-.492.297-.494.668l-.012 1.876c-.003.371.214.673.485.675l4.14.027c.271.002.492-.298.495-.668l.012-1.877c.003-.37-.215-.672-.485-.674z' style='clip-rule:evenodd;fill:%23fff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:.4' transform='translate(15.553 2.85)scale(.88807)'/%3E%3C/g%3E%3C/svg%3E")}}@media (forced-colors:active) and (prefers-color-scheme:light){a.maplibregl-ctrl-logo{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='23' fill='none'%3E%3Cpath fill='%23000' fill-opacity='.4' fill-rule='evenodd' d='M17.408 16.796h-1.827l2.501-12.095h.198l3.324 6.533.988 2.19.988-2.19 3.258-6.533h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.929 5.644h-.098l-2.914-5.644-.757-1.71-.345 1.71zm1.958-3.42-.726 3.663a1.255 1.255 0 0 1-1.232 1.011h-1.827a1.255 1.255 0 0 1-1.229-1.509l2.501-12.095a1.255 1.255 0 0 1 1.23-1.001h.197a1.25 1.25 0 0 1 1.12.685l3.19 6.273 3.125-6.263a1.25 1.25 0 0 1 1.123-.695h.181a1.255 1.255 0 0 1 1.227.991l1.443 6.71a5 5 0 0 1 .314-.787l.009-.016a4.6 4.6 0 0 1 1.777-1.887c.782-.46 1.668-.667 2.611-.667a4.6 4.6 0 0 1 1.7.32l.306.134c.21-.16.474-.256.759-.256h1.694a1.255 1.255 0 0 1 1.212.925 1.255 1.255 0 0 1 1.212-.925h1.711c.284 0 .545.094.755.252.613-.3 1.312-.45 2.075-.45 1.356 0 2.557.445 3.482 1.4q.47.48.763 1.064V4.701a1.255 1.255 0 0 1 1.255-1.255h1.86A1.255 1.255 0 0 1 54.44 4.7v9.194h2.217c.19 0 .37.043.532.118v-4.77c0-.356.147-.678.385-.906a2.42 2.42 0 0 1-.682-1.71c0-.665.267-1.253.735-1.7a2.45 2.45 0 0 1 1.722-.674 2.43 2.43 0 0 1 1.705.675q.318.302.504.683V4.7a1.255 1.255 0 0 1 1.255-1.255h1.744A1.255 1.255 0 0 1 65.812 4.7v3.335a4.8 4.8 0 0 1 1.526-.246c.938 0 1.817.214 2.59.69a4.47 4.47 0 0 1 1.67 1.743v-.98a1.255 1.255 0 0 1 1.256-1.256h1.777c.233 0 .451.064.639.174a3.4 3.4 0 0 1 1.567-.372c.346 0 .861.02 1.285.232a1.25 1.25 0 0 1 .689 1.004 4.7 4.7 0 0 1 .853-.588c.795-.44 1.675-.647 2.61-.647 1.385 0 2.65.39 3.525 1.396.836.938 1.168 2.173 1.168 3.528q-.001.515-.056 1.051a1.255 1.255 0 0 1-.947 1.09l.408.952a1.255 1.255 0 0 1-.477 1.552c-.418.268-.92.463-1.458.612-.613.171-1.304.244-2.049.244-1.06 0-2.043-.207-2.886-.698l-.015-.008c-.798-.48-1.419-1.135-1.818-1.963l-.004-.008a5.8 5.8 0 0 1-.548-2.512q0-.429.053-.843a1.3 1.3 0 0 1-.333-.086l-.166-.004c-.223 0-.426.062-.643.228-.03.024-.142.139-.142.59v3.883a1.255 1.255 0 0 1-1.256 1.256h-1.777a1.255 1.255 0 0 1-1.256-1.256V15.69l-.032.057a4.8 4.8 0 0 1-1.86 1.833 5.04 5.04 0 0 1-2.484.634 4.5 4.5 0 0 1-1.935-.424 1.25 1.25 0 0 1-.764.258h-1.71a1.255 1.255 0 0 1-1.256-1.255V7.687a2.4 2.4 0 0 1-.428.625c.253.23.412.561.412.93v7.553a1.255 1.255 0 0 1-1.256 1.255h-1.843a1.25 1.25 0 0 1-.894-.373c-.228.23-.544.373-.894.373H51.32a1.255 1.255 0 0 1-1.256-1.255v-1.251l-.061.117a4.7 4.7 0 0 1-1.782 1.884 4.77 4.77 0 0 1-2.485.67 5.6 5.6 0 0 1-1.485-.188l.009 2.764a1.255 1.255 0 0 1-1.255 1.259h-1.729a1.255 1.255 0 0 1-1.255-1.255v-3.537a1.255 1.255 0 0 1-1.167.793h-1.679a1.25 1.25 0 0 1-.77-.263 4.5 4.5 0 0 1-1.945.429c-.885 0-1.724-.21-2.495-.632l-.017-.01a5 5 0 0 1-1.081-.836 1.255 1.255 0 0 1-1.254 1.312h-1.81a1.255 1.255 0 0 1-1.228-.99l-.782-3.625-2.044 3.939a1.25 1.25 0 0 1-1.115.676h-.098a1.25 1.25 0 0 1-1.116-.68l-2.061-3.994zM35.92 16.63l.207-.114.223-.15q.493-.356.735-.785l.061-.118.033 1.332h1.678V9.242h-1.694l-.033 1.267q-.133-.329-.526-.658l-.032-.028a3.2 3.2 0 0 0-.668-.428l-.27-.12a3.3 3.3 0 0 0-1.235-.23q-1.136-.001-1.974.493a3.36 3.36 0 0 0-1.3 1.382q-.445.89-.444 2.074 0 1.2.51 2.107a3.8 3.8 0 0 0 1.382 1.381 3.9 3.9 0 0 0 1.893.477q.795 0 1.455-.33zm-2.789-5.38q-.576.675-.575 1.762 0 1.102.559 1.794.576.675 1.645.675a2.25 2.25 0 0 0 .934-.19 2.2 2.2 0 0 0 .468-.29l.178-.161a2.2 2.2 0 0 0 .397-.561q.244-.5.244-1.15v-.115q0-.708-.296-1.267l-.043-.077a2.2 2.2 0 0 0-.633-.709l-.13-.086-.047-.028a2.1 2.1 0 0 0-1.073-.285q-1.052 0-1.629.692zm2.316 2.706c.163-.17.28-.407.28-.83v-.114c0-.292-.06-.508-.15-.68a.96.96 0 0 0-.353-.389.85.85 0 0 0-.464-.127c-.4 0-.56.114-.664.239l-.01.012c-.148.174-.275.45-.275.945 0 .506.122.801.27.99.097.11.266.224.68.224.303 0 .504-.09.687-.269zm7.545 1.705a2.6 2.6 0 0 0 .331.423q.319.33.755.548l.173.074q.65.255 1.49.255 1.02 0 1.844-.493a3.45 3.45 0 0 0 1.316-1.4q.493-.904.493-2.089 0-1.909-.988-2.913-.988-1.02-2.584-1.02-.898 0-1.575.347a3 3 0 0 0-.415.262l-.199.166a3.4 3.4 0 0 0-.64.82V9.242h-1.712v11.553h1.729l-.017-5.134zm.53-1.138q.206.29.48.5l.155.11.053.034q.51.296 1.119.297 1.07 0 1.645-.675.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.435 0-.835.16a2 2 0 0 0-.284.136 2 2 0 0 0-.363.254 2.2 2.2 0 0 0-.46.569l-.082.162a2.6 2.6 0 0 0-.213 1.072v.115q0 .707.296 1.267l.135.211zm.964-.818a1.1 1.1 0 0 0 .367.385.94.94 0 0 0 .476.118c.423 0 .59-.117.687-.23.159-.194.28-.478.28-.95 0-.53-.133-.8-.266-.952l-.021-.025c-.078-.094-.231-.221-.68-.221a1 1 0 0 0-.503.135l-.012.007a.86.86 0 0 0-.335.343c-.073.133-.132.324-.132.614v.115a1.4 1.4 0 0 0 .14.66zm15.7-6.222q.347-.346.346-.856a1.05 1.05 0 0 0-.345-.79 1.18 1.18 0 0 0-.84-.329q-.51 0-.855.33a1.05 1.05 0 0 0-.346.79q0 .51.346.855.345.346.856.346.51 0 .839-.346zm4.337 9.314.033-1.332q.191.403.59.747l.098.081a4 4 0 0 0 .316.224l.223.122a3.2 3.2 0 0 0 1.44.322 3.8 3.8 0 0 0 1.875-.477 3.5 3.5 0 0 0 1.382-1.366q.527-.89.526-2.09 0-1.184-.444-2.073a3.24 3.24 0 0 0-1.283-1.399q-.823-.51-1.942-.51a3.5 3.5 0 0 0-1.527.344l-.086.043-.165.09a3 3 0 0 0-.33.214q-.432.315-.656.707a2 2 0 0 0-.099.198l.082-1.283V4.701h-1.744v12.095zm.473-2.509a2.5 2.5 0 0 0 .566.7q.117.098.245.18l.144.08a2.1 2.1 0 0 0 .975.232q1.07 0 1.645-.675.576-.69.576-1.778 0-1.102-.576-1.777-.56-.691-1.645-.692a2.2 2.2 0 0 0-1.015.235q-.22.113-.415.282l-.15.142a2.1 2.1 0 0 0-.42.594q-.223.479-.223 1.1v.115q0 .705.293 1.26zm2.616-.293c.157-.191.28-.479.28-.967 0-.51-.13-.79-.276-.961l-.021-.026c-.082-.1-.232-.225-.67-.225a.87.87 0 0 0-.681.279l-.012.011c-.154.155-.274.38-.274.807v.115c0 .285.057.499.144.669a1.1 1.1 0 0 0 .367.405c.137.082.28.123.455.123.423 0 .59-.118.686-.23zm8.266-3.013q.345-.13.724-.14l.069-.002q.493 0 .642.099l.247-1.794q-.196-.099-.717-.099a2.3 2.3 0 0 0-.545.063 2 2 0 0 0-.411.148 2.2 2.2 0 0 0-.4.249 2.5 2.5 0 0 0-.485.499 2.7 2.7 0 0 0-.32.581l-.05.137v-1.48h-1.778v7.553h1.777v-3.884q0-.546.159-.943a1.5 1.5 0 0 1 .466-.636 2.5 2.5 0 0 1 .399-.253 2 2 0 0 1 .224-.099zm9.784 2.656.05-.922q0-1.743-.856-2.698-.838-.97-2.584-.97-1.119-.001-2.007.493a3.46 3.46 0 0 0-1.4 1.382q-.493.906-.493 2.106 0 1.07.428 1.975.428.89 1.332 1.432.906.526 2.255.526.973 0 1.668-.185l.044-.012.135-.04q.613-.184.984-.421l-.542-1.267q-.3.162-.642.274l-.297.087q-.51.131-1.3.131-.954 0-1.497-.444a1.6 1.6 0 0 1-.192-.193q-.366-.44-.512-1.234l-.004-.021zm-5.427-1.256-.003.022h3.752v-.138q-.011-.727-.288-1.118a1 1 0 0 0-.156-.176q-.46-.428-1.316-.428-.986 0-1.494.604-.379.45-.494 1.234zm-27.053 2.77V4.7h-1.86v12.095h5.333V15.15zm7.103-5.908v7.553h-1.843V9.242h1.843z'/%3E%3Cpath fill='%23fff' d='m19.63 11.151-.757-1.71-.345 1.71-1.12 5.644h-1.827L18.083 4.7h.197l3.325 6.533.988 2.19.988-2.19L26.839 4.7h.181l2.6 12.095h-1.81l-1.218-5.644-.362-1.71-.658 1.71-2.93 5.644h-.098l-2.913-5.644zm14.836 5.81q-1.02 0-1.893-.478a3.8 3.8 0 0 1-1.381-1.382q-.51-.906-.51-2.106 0-1.185.444-2.074a3.36 3.36 0 0 1 1.3-1.382q.839-.494 1.974-.494a3.3 3.3 0 0 1 1.234.231 3.3 3.3 0 0 1 .97.575q.396.33.527.659l.033-1.267h1.694v7.553H37.18l-.033-1.332q-.279.593-1.02 1.053a3.17 3.17 0 0 1-1.662.444zm.296-1.482q.938 0 1.58-.642.642-.66.642-1.711v-.115q0-.708-.296-1.267a2.2 2.2 0 0 0-.807-.872 2.1 2.1 0 0 0-1.119-.313q-1.053 0-1.629.692-.575.675-.575 1.76 0 1.103.559 1.795.577.675 1.645.675zm6.521-6.237h1.711v1.4q.906-1.597 2.83-1.597 1.596 0 2.584 1.02.988 1.005.988 2.914 0 1.185-.493 2.09a3.46 3.46 0 0 1-1.316 1.399 3.5 3.5 0 0 1-1.844.493q-.954 0-1.662-.329a2.67 2.67 0 0 1-1.086-.97l.017 5.134h-1.728zm4.048 6.22q1.07 0 1.645-.674.577-.69.576-1.762 0-1.119-.576-1.777-.558-.675-1.645-.675-.592 0-1.12.296-.51.28-.822.823-.296.527-.296 1.234v.115q0 .708.296 1.267.313.543.823.855.51.296 1.119.297z'/%3E%3Cpath fill='%23e1e3e9' d='M51.325 4.7h1.86v10.45h3.473v1.646h-5.333zm7.12 4.542h1.843v7.553h-1.843zm.905-1.415a1.16 1.16 0 0 1-.856-.346 1.17 1.17 0 0 1-.346-.856 1.05 1.05 0 0 1 .346-.79q.346-.329.856-.329.494 0 .839.33a1.05 1.05 0 0 1 .345.79 1.16 1.16 0 0 1-.345.855q-.33.346-.84.346zm7.875 9.133a3.17 3.17 0 0 1-1.662-.444q-.723-.46-1.004-1.053l-.033 1.332h-1.71V4.701h1.743v4.657l-.082 1.283q.279-.658 1.086-1.119a3.5 3.5 0 0 1 1.778-.477q1.119 0 1.942.51a3.24 3.24 0 0 1 1.283 1.4q.445.888.444 2.072 0 1.201-.526 2.09a3.5 3.5 0 0 1-1.382 1.366 3.8 3.8 0 0 1-1.876.477zm-.296-1.481q1.069 0 1.645-.675.577-.69.577-1.778 0-1.102-.577-1.776-.56-.691-1.645-.692a2.12 2.12 0 0 0-1.58.659q-.642.641-.642 1.694v.115q0 .71.296 1.267a2.4 2.4 0 0 0 .807.872 2.1 2.1 0 0 0 1.119.313zm5.927-6.237h1.777v1.481q.263-.757.856-1.217a2.14 2.14 0 0 1 1.349-.46q.527 0 .724.098l-.247 1.794q-.149-.099-.642-.099-.774 0-1.416.494-.626.493-.626 1.58v3.883h-1.777V9.242zm9.534 7.718q-1.35 0-2.255-.526-.904-.543-1.332-1.432a4.6 4.6 0 0 1-.428-1.975q0-1.2.493-2.106a3.46 3.46 0 0 1 1.4-1.382q.889-.495 2.007-.494 1.744 0 2.584.97.855.956.856 2.7 0 .444-.05.92h-5.43q.18 1.005.708 1.45.542.443 1.497.443.79 0 1.3-.131a4 4 0 0 0 .938-.362l.542 1.267q-.411.263-1.119.46-.708.198-1.711.197zm1.596-4.558q.016-1.02-.444-1.432-.46-.428-1.316-.428-1.728 0-1.991 1.86z'/%3E%3Cpath d='M5.074 15.948a.484.657 0 0 0-.486.659v1.84a.484.657 0 0 0 .486.659h4.101a.484.657 0 0 0 .486-.659v-1.84a.484.657 0 0 0-.486-.659zm3.56 1.16H5.617v.838h3.017z' style='fill:%23fff;fill-rule:evenodd;stroke-width:1.03600001'/%3E%3Cg style='stroke-width:1.12603545'%3E%3Cpath d='M-9.408-1.416c-3.833-.025-7.056 2.912-7.08 6.615-.02 3.08 1.653 4.832 3.107 6.268.903.892 1.721 1.74 2.32 2.902l-.525-.004c-.543-.003-.992.304-1.24.639a1.87 1.87 0 0 0-.362 1.121l-.011 1.877c-.003.402.104.787.347 1.125.244.338.688.653 1.23.656l4.142.028c.542.003.99-.306 1.238-.641a1.87 1.87 0 0 0 .363-1.121l.012-1.875a1.87 1.87 0 0 0-.348-1.127c-.243-.338-.688-.653-1.23-.656l-.518-.004c.597-1.145 1.425-1.983 2.348-2.87 1.473-1.414 3.18-3.149 3.2-6.226-.016-3.59-2.923-6.684-6.993-6.707m-.006 1.1v.002c3.274.02 5.92 2.532 5.9 5.6-.017 2.706-1.39 4.026-2.863 5.44-1.034.994-2.118 2.033-2.814 3.633-.018.041-.052.055-.075.065q-.013.004-.02.01a.34.34 0 0 1-.226.084.34.34 0 0 1-.224-.086l-.092-.077c-.699-1.615-1.768-2.669-2.781-3.67-1.454-1.435-2.797-2.762-2.78-5.478.02-3.067 2.7-5.545 5.975-5.523m-.02 2.826c-1.62-.01-2.944 1.315-2.955 2.96-.01 1.646 1.295 2.988 2.916 2.999h.002c1.621.01 2.943-1.316 2.953-2.961.011-1.646-1.294-2.988-2.916-2.998m-.005 1.1c1.017.006 1.829.83 1.822 1.89s-.83 1.874-1.848 1.867c-1.018-.006-1.829-.83-1.822-1.89s.83-1.874 1.848-1.868m-2.155 11.857 4.14.025c.271.002.49.305.487.676l-.013 1.875c-.003.37-.224.67-.495.668l-4.14-.025c-.27-.002-.487-.306-.485-.676l.012-1.875c.003-.37.224-.67.494-.668' style='color:%23000;font-style:normal;font-variant:normal;font-weight:400;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:%23000;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;text-orientation:mixed;dominant-baseline:auto;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;clip-rule:evenodd;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:%23000;solid-opacity:1;vector-effect:none;fill:%23000;fill-opacity:.4;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto' transform='translate(15.553 2.85)scale(.88807)'/%3E%3Cpath d='M-9.415-.316C-12.69-.338-15.37 2.14-15.39 5.207c-.017 2.716 1.326 4.041 2.78 5.477 1.013 1 2.081 2.055 2.78 3.67l.092.076a.34.34 0 0 0 .225.086.34.34 0 0 0 .227-.083l.019-.01c.022-.009.057-.024.074-.064.697-1.6 1.78-2.64 2.814-3.634 1.473-1.414 2.847-2.733 2.864-5.44.02-3.067-2.627-5.58-5.901-5.601m-.057 8.784c1.621.011 2.944-1.315 2.955-2.96.01-1.646-1.295-2.988-2.916-2.999-1.622-.01-2.945 1.315-2.955 2.96s1.295 2.989 2.916 3' style='clip-rule:evenodd;fill:%23e1e3e9;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:.4' transform='translate(15.553 2.85)scale(.88807)'/%3E%3Cpath d='M-11.594 15.465c-.27-.002-.492.297-.494.668l-.012 1.876c-.003.371.214.673.485.675l4.14.027c.271.002.492-.298.495-.668l.012-1.877c.003-.37-.215-.672-.485-.674z' style='clip-rule:evenodd;fill:%23fff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:2.47727823;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:.4' transform='translate(15.553 2.85)scale(.88807)'/%3E%3C/g%3E%3C/svg%3E")}}.maplibregl-ctrl.maplibregl-ctrl-attrib{background-color:hsla(0,0%,100%,.5);margin:0;padding:0 5px}@media screen{.maplibregl-ctrl-attrib.maplibregl-compact{background-color:#fff;border-radius:12px;-webkit-box-sizing:content-box;box-sizing:content-box;color:#000;margin:10px;min-height:20px;padding:2px 24px 2px 0;position:relative}.maplibregl-ctrl-attrib.maplibregl-compact-show{padding:2px 28px 2px 8px;visibility:visible}.maplibregl-ctrl-bottom-left>.maplibregl-ctrl-attrib.maplibregl-compact-show,.maplibregl-ctrl-top-left>.maplibregl-ctrl-attrib.maplibregl-compact-show{border-radius:12px;padding:2px 8px 2px 28px}.maplibregl-ctrl-attrib.maplibregl-compact .maplibregl-ctrl-attrib-inner{display:none}.maplibregl-ctrl-attrib-button{background-color:hsla(0,0%,100%,.5);background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill-rule='evenodd' viewBox='0 0 20 20'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E");border:0;border-radius:12px;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;display:none;height:24px;outline:none;position:absolute;right:0;top:0;width:24px}.maplibregl-ctrl-attrib summary.maplibregl-ctrl-attrib-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;list-style:none}.maplibregl-ctrl-attrib summary.maplibregl-ctrl-attrib-button::-webkit-details-marker{display:none}.maplibregl-ctrl-bottom-left .maplibregl-ctrl-attrib-button,.maplibregl-ctrl-top-left .maplibregl-ctrl-attrib-button{left:0}.maplibregl-ctrl-attrib.maplibregl-compact .maplibregl-ctrl-attrib-button,.maplibregl-ctrl-attrib.maplibregl-compact-show .maplibregl-ctrl-attrib-inner{display:block}.maplibregl-ctrl-attrib.maplibregl-compact-show .maplibregl-ctrl-attrib-button{background-color:rgba(0,0,0,.05)}.maplibregl-ctrl-bottom-right>.maplibregl-ctrl-attrib.maplibregl-compact:after{bottom:0;right:0}.maplibregl-ctrl-top-right>.maplibregl-ctrl-attrib.maplibregl-compact:after{right:0;top:0}.maplibregl-ctrl-top-left>.maplibregl-ctrl-attrib.maplibregl-compact:after{left:0;top:0}.maplibregl-ctrl-bottom-left>.maplibregl-ctrl-attrib.maplibregl-compact:after{bottom:0;left:0}}@media screen and (forced-colors:active){.maplibregl-ctrl-attrib.maplibregl-compact:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%23fff' fill-rule='evenodd' viewBox='0 0 20 20'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E")}}@media screen and (forced-colors:active) and (prefers-color-scheme:light){.maplibregl-ctrl-attrib.maplibregl-compact:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill-rule='evenodd' viewBox='0 0 20 20'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E")}}.maplibregl-ctrl-attrib a{color:rgba(0,0,0,.75);text-decoration:none}.maplibregl-ctrl-attrib a:hover{color:inherit;text-decoration:underline}.maplibregl-attrib-empty{display:none}.maplibregl-ctrl-scale{background-color:hsla(0,0%,100%,.75);border:2px solid #333;border-top:#333;-webkit-box-sizing:border-box;box-sizing:border-box;color:#333;font-size:10px;padding:0 5px;white-space:nowrap}.maplibregl-popup{display:-webkit-box;display:-ms-flexbox;display:flex;left:0;pointer-events:none;position:absolute;top:0;will-change:transform}.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}.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}.maplibregl-popup-anchor-left{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.maplibregl-popup-anchor-right{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.maplibregl-popup-tip{border:10px solid transparent;height:0;width:0;z-index:1}.maplibregl-popup-anchor-top .maplibregl-popup-tip{-ms-flex-item-align:center;align-self:center;border-bottom-color:#fff;border-top:none}.maplibregl-popup-anchor-top-left .maplibregl-popup-tip{-ms-flex-item-align:start;align-self:flex-start;border-bottom-color:#fff;border-left:none;border-top:none}.maplibregl-popup-anchor-top-right .maplibregl-popup-tip{-ms-flex-item-align:end;align-self:flex-end;border-bottom-color:#fff;border-right:none;border-top:none}.maplibregl-popup-anchor-bottom .maplibregl-popup-tip{-ms-flex-item-align:center;align-self:center;border-bottom:none;border-top-color:#fff}.maplibregl-popup-anchor-bottom-left .maplibregl-popup-tip{-ms-flex-item-align:start;align-self:flex-start;border-bottom:none;border-left:none;border-top-color:#fff}.maplibregl-popup-anchor-bottom-right .maplibregl-popup-tip{-ms-flex-item-align:end;align-self:flex-end;border-bottom:none;border-right:none;border-top-color:#fff}.maplibregl-popup-anchor-left .maplibregl-popup-tip{-ms-flex-item-align:center;align-self:center;border-left:none;border-right-color:#fff}.maplibregl-popup-anchor-right .maplibregl-popup-tip{-ms-flex-item-align:center;align-self:center;border-left-color:#fff;border-right:none}[dir=rtl] .maplibregl-popup-anchor-left{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}[dir=rtl] .maplibregl-popup-anchor-right{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}[dir=rtl] .maplibregl-popup-anchor-top-left .maplibregl-popup-tip{-ms-flex-item-align:end;align-self:flex-end}[dir=rtl] .maplibregl-popup-anchor-top-right .maplibregl-popup-tip{-ms-flex-item-align:start;align-self:flex-start}[dir=rtl] .maplibregl-popup-anchor-bottom-left .maplibregl-popup-tip{-ms-flex-item-align:end;align-self:flex-end}[dir=rtl] .maplibregl-popup-anchor-bottom-right .maplibregl-popup-tip{-ms-flex-item-align:start;align-self:flex-start}.maplibregl-popup-close-button{background-color:transparent;border:0;border-radius:0 3px 0 0;cursor:pointer;position:absolute;right:0;top:0}.maplibregl-popup-close-button:hover{background-color:rgba(0,0,0,.05)}.maplibregl-popup-content{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:15px 10px;pointer-events:auto;position:relative}.maplibregl-popup-anchor-top-left .maplibregl-popup-content{border-top-left-radius:0}.maplibregl-popup-anchor-top-right .maplibregl-popup-content{border-top-right-radius:0}.maplibregl-popup-anchor-bottom-left .maplibregl-popup-content{border-bottom-left-radius:0}.maplibregl-popup-anchor-bottom-right .maplibregl-popup-content{border-bottom-right-radius:0}.maplibregl-popup-track-pointer{display:none}.maplibregl-popup-track-pointer *{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.maplibregl-map:hover .maplibregl-popup-track-pointer{display:-webkit-box;display:-ms-flexbox;display:flex}.maplibregl-map:active .maplibregl-popup-track-pointer{display:none}.maplibregl-marker{left:0;position:absolute;top:0;-webkit-transition:opacity .2s;transition:opacity .2s;will-change:transform}.maplibregl-user-location-dot,.maplibregl-user-location-dot:before{background-color:#1da1f2;border-radius:50%;height:15px;width:15px}.maplibregl-user-location-dot:before{-webkit-animation:maplibregl-user-location-dot-pulse 2s infinite;animation:maplibregl-user-location-dot-pulse 2s infinite;content:"";position:absolute}.maplibregl-user-location-dot:after{border:2px solid #fff;border-radius:50%;-webkit-box-shadow:0 0 3px rgba(0,0,0,.35);box-shadow:0 0 3px rgba(0,0,0,.35);-webkit-box-sizing:border-box;box-sizing:border-box;content:"";height:19px;left:-2px;position:absolute;top:-2px;width:19px}@media (prefers-reduced-motion:reduce){.maplibregl-user-location-dot:before{-webkit-animation:none;animation:none}}@-webkit-keyframes maplibregl-user-location-dot-pulse{0%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}70%{opacity:0;-webkit-transform:scale(3);transform:scale(3)}to{opacity:0;-webkit-transform:scale(1);transform:scale(1)}}@keyframes maplibregl-user-location-dot-pulse{0%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}70%{opacity:0;-webkit-transform:scale(3);transform:scale(3)}to{opacity:0;-webkit-transform:scale(1);transform:scale(1)}}.maplibregl-user-location-dot-stale{background-color:#aaa}.maplibregl-user-location-dot-stale:after{display:none}.maplibregl-user-location-accuracy-circle{background-color:#1da1f233;border-radius:100%;height:1px;width:1px}.maplibregl-crosshair,.maplibregl-crosshair .maplibregl-interactive,.maplibregl-crosshair .maplibregl-interactive:active{cursor:crosshair}.maplibregl-boxzoom{background:#fff;border:2px dotted #202020;height:0;left:0;opacity:.5;position:absolute;top:0;width:0}.maplibregl-cooperative-gesture-screen{-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:rgba(0,0,0,.4);color:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:1.4em;inset:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;line-height:1.2;opacity:0;padding:1rem;pointer-events:none;position:absolute;-webkit-transition:opacity 1s ease 1s;transition:opacity 1s ease 1s;z-index:99999}.maplibregl-cooperative-gesture-screen.maplibregl-show{opacity:1;-webkit-transition:opacity .05s;transition:opacity .05s}.maplibregl-cooperative-gesture-screen .maplibregl-mobile-message{display:none}@media (hover:none),(pointer:coarse){.maplibregl-cooperative-gesture-screen .maplibregl-desktop-message{display:none}.maplibregl-cooperative-gesture-screen .maplibregl-mobile-message{display:block}}.maplibregl-pseudo-fullscreen{height:100%!important;left:0!important;position:fixed!important;top:0!important;width:100%!important;z-index:99999}:root { --container-border-width: 8px; --container-gap-width: 8px; /* only even numbers should be used because otherwise we get 0.5px margin values. */ --transition-short: 0.1s; --transition-standard: 0.3s; --buttons-dialog-gap-row: 8px; --buttons-dialog-gap-column: 8px; --MBody-border-radius: 8px; --EventTileBubble_margin-block: 10px; --MessageTimestamp-width: 46px; /* 8 + 30 (avatar) + 8 */ /* 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. */ --dialog-zIndex-wrapper-default: 4000; --dialog-zIndex-static-background: 4009; --dialog-zIndex-static: calc(var(--dialog-zIndex-static-background) + 1); /* 4010 */ --dialog-zIndex-standard-background: calc(var(--dialog-zIndex-static) + 1); /* 4011 */ --dialog-zIndex-standard: calc(var(--dialog-zIndex-standard-background) + 1); /* 4012 */ }#matrixchat { /* This is required to ensure Compound tooltips correctly draw where they should with z-index: auto */ contain: strict; }#mx_ContextualMenu_Container, #mx_PersistedElement_container, #mx_Dialog_Container, #mx_Dialog_StaticContainer { /* This is required to ensure Compound tooltips correctly draw where they should with z-index: auto */ isolation: isolate; }/** * Disable pointer events inside the persistentElement container when the room-list is being resized. * This is necessary to avoid the pointer events from being hijacked by the content rendered inside * that div. */:root:has(.mx_Separator[data-separator="active"]) #mx_PersistedElement_container { pointer-events: none; }/** * We need to increase the specificity of the selector to override the * custom property set by the design tokens package */[class^="cpd-theme"][class^="cpd-theme"] { /** * The design tokens package currently does not expose the fallback fonts * We want to keep on re-using `$font-family` to not break custom themes * and because we can to use `Twemoji` to display emoji rather than using * system ones */ --cpd-font-family-sans: var(--font-family, "Nunito", var(--emoji-font-family), "Apple Color Emoji", "Segoe UI Emoji", "Arial", "Helvetica", sans-serif, "Noto Color Emoji"); }@media (prefers-reduced-motion) { :root { --transition-short: 0; --transition-standard: 0; } }html { /* hack to stop overscroll bounce on OSX and iOS. N.B. Breaks things when we have legitimate horizontal overscroll */ height: 100%; overflow: hidden; /* Stop similar overscroll bounce in Firefox Nightly for macOS */ -ms-scroll-chaining: none; overscroll-behavior: none; }body { /* !important because compound overrides these font settings for body */ font: var(--cpd-font-body-md-regular) !important; letter-spacing: var(--cpd-font-letter-spacing-body-md) !important; /** * We want to apply Inter Dynamic metrics (https://rsms.me/inter/dynmetrics/) * We need to tweak the `letter-spacing` property and doing so, disables by * default the optional ligatures * `font-feature-settings` allows us to override this behaviour and have the * correct ligatures and the proper dynamic metric spacing. */ -webkit-font-feature-settings: "kern" 1, "liga" 1, "calt" 1 !important; font-feature-settings: "kern" 1, "liga" 1, "calt" 1 !important; background-color: var(--timeline-background-color); color: var(--timeline-text-color); border: 0px; margin: 0px; /* needed to match the designs correctly on macOS */ /* see https://github.com/vector-im/element-web/issues/11425 */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }pre, code { font-family: "Fira Code", "", "Apple Color Emoji", "Segoe UI Emoji", "Courier", monospace, "Noto Color Emoji"; font-family: var(--font-family-monospace, "Fira Code", var(--emoji-font-family), "Apple Color Emoji", "Segoe UI Emoji", "Courier", monospace, "Noto Color Emoji"); font-size: 100% !important; }.error, .warning, .text-error, .text-warning { color: #ff5b55; color: var(--alert, #ff5b55); }.text-success { color: #0dbd8b; color: var(--accent-color, #0dbd8b); }.text-muted { color: #61708b; }.text-primary { color: var(--timeline-text-color); }.text-secondary { color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_Verified { color: #0dbd8b; }.mx_Untrusted { color: #ff5b55; }b { /* On Firefox, the default weight for `` is `bolder` which results in no bold */ /* effect since we only have specific weights of our fonts available. */ font-weight: bold; }a:hover, a:link, a:visited { color: var(--primary-color); }:not(.mx_no_textinput):not(.mx_textinput):not(.mx_Field) > input[type="text"], :not(.mx_no_textinput):not(.mx_textinput):not(.mx_Field) > input[type="search"], :not(.mx_no_textinput):not(.mx_textinput):not(.mx_Field) > input[type="password"] { padding: 9px; font: var(--cpd-font-body-md-semibold); font-weight: var(--cpd-font-weight-semibold); 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; }/* FIXME THEME - Tint by CSS rather than referencing a duplicate asset */input[type="text"].mx_textinput_icon.mx_textinput_search, input[type="search"].mx_textinput_icon.mx_textinput_search { background-image: url(../../icons/search.7258145.svg); }/* dont search UI as not all browsers support it, *//* we implement it ourselves where needed instead */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; }/* Override Firefox's UA style so we get a consistent look across browsers */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="password"], textarea { background-color: transparent; color: var(--timeline-text-color); }/* Required by Firefox */textarea { color: var(--timeline-text-color); }input[type="text"]:focus, input[type="password"]:focus, textarea:focus { outline: none; -webkit-box-shadow: none; box-shadow: none; }/* This is used to hide the standard outline added by browsers for *//* accessible (focusable) components. Not intended for buttons, but *//* should be used on things like focusable containers where the outline *//* is usually not helping anyone. */*:focus:not(:focus-visible) { outline: none; }/* override defaults */fieldset { display: inline-block; margin-inline: unset; padding-block: unset; padding-inline: unset; min-inline-size: unset; border: none; }summary { cursor: pointer; }legend { padding-inline: unset; border: none; }/* .mx_textinput is a container for a text input *//* + some other controls like buttons, ... *//* it has the appearance of a text box so the controls *//* appear to be part of the input */.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: var(--timeline-text-color); }.mx_Dialog :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type="text"], .mx_Dialog :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type="search"], .mx_Dialog .mx_textinput, .mx_MatrixChat_wrapper :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type="text"], .mx_MatrixChat_wrapper :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type="search"], .mx_MatrixChat_wrapper .mx_textinput { display: block; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: transparent; color: #9fa9ba; border-radius: 4px; border: 1px solid var(--secondary-hairline-color); /* these things should probably not be defined globally */ 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: var(--cpd-color-text-secondary); }.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: var(--cpd-color-text-secondary); }.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: var(--cpd-color-text-secondary); }.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: var(--cpd-color-text-secondary); }.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: var(--cpd-color-text-secondary); }/* Prevent ugly dotted highlight around selected elements in Firefox */::-moz-focus-inner { border: 0; }/* These are magic constants which are excluded from tinting, to let themes *//* (which only have CSS) tell the app what their non-tinted *//* colourscheme is by inspecting the stylesheet DOM. *//* They are not used for layout!! */#mx_theme_accentColor { color: #0dbd8b; color: var(--accent-color, #0dbd8b); }#mx_theme_secondaryAccentColor { color: var(--roomlist-background-color); }.mx_Dialog_wrapper { position: fixed; z-index: 4000; z-index: var(--dialog-zIndex-wrapper-default); 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_border { z-index: calc(calc(calc(4009 + 1) + 1) + 1); z-index: var(--dialog-zIndex-standard); position: relative; width: 100%; max-width: -webkit-fit-content; max-width: -moz-fit-content; max-width: fit-content; -webkit-box-sizing: border-box; box-sizing: border-box; max-height: calc(100% - var(--cpd-space-6x)); 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_lightbox .mx_Dialog_border { /* The lightbox isn't so much of a dialog as a fullscreen overlay. We don't want the glass border. */ display: contents; }.mx_Dialog { background-color: var(--timeline-background-color); color: var(--timeline-text-secondary-color); font-size: 0.9375rem; position: relative; padding: var(--cpd-space-8x) var(--cpd-space-10x); -webkit-box-sizing: border-box; box-sizing: border-box; overflow-y: auto; }.mx_Dialog_staticWrapper .mx_Dialog { z-index: calc(4009 + 1); z-index: var(--dialog-zIndex-static); contain: content; }.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; }/* Styles copied/inspired by GroupLayout, ReplyTile, and EventTile variants. */.mx_Dialog .markdown-body { font: var(--cpd-font-body-md-regular) !important; letter-spacing: var(--cpd-font-letter-spacing-body-md); font-family: inherit !important; white-space: normal !important; line-height: inherit !important; background-color: inherit; color: inherit; /* Make h1 and h2 the same size as h3. */ }/* inherit the colour from the dark or light theme by default (but not for code blocks) */.mx_Dialog .markdown-body pre, .mx_Dialog .markdown-body code { font-family: "Fira Code", "", "Apple Color Emoji", "Segoe UI Emoji", "Courier", monospace, "Noto Color Emoji" !important; font-family: var(--font-family-monospace, "Fira Code", var(--emoji-font-family), "Apple Color Emoji", "Segoe UI Emoji", "Courier", monospace, "Noto Color Emoji") !important; background-color: #f3f8fd; }/* this selector wrongly applies to code blocks too but we will unset it in the next one */.mx_Dialog .markdown-body code { white-space: pre-wrap; /* don't collapse spaces in inline code blocks */ }.mx_Dialog .markdown-body pre { /* have to use overlay rather than auto otherwise Linux and Windows */ /* Chrome gets very confused about vertical spacing: */ /* https://github.com/vector-im/vector-web/issues/754 */ overflow-x: overlay; overflow-y: visible; }.mx_Dialog .markdown-body pre::-webkit-scrollbar-corner { background: transparent; }.mx_Dialog .markdown-body pre code { white-space: pre; /* we want code blocks to be scrollable and not wrap */ }.mx_Dialog .markdown-body pre code > * { display: inline; }.mx_Dialog .markdown-body h1, .mx_Dialog .markdown-body h2, .mx_Dialog .markdown-body h3, .mx_Dialog .markdown-body h4, .mx_Dialog .markdown-body h5, .mx_Dialog .markdown-body h6 { font-family: inherit !important; color: inherit; }.mx_Dialog .markdown-body h1, .mx_Dialog .markdown-body h2 { font-size: 1.5em; border-bottom: none !important; /* override GFM */ }.mx_Dialog .markdown-body a { color: var(--primary-color); }.mx_Dialog .markdown-body blockquote { border-left: 2px solid var(--cpd-color-border-interactive-primary); color: #2e2f32; color: var(--secondary-content, #2e2f32); border-radius: 2px; padding: 0 10px; }.mx_Dialog_fixedWidth { width: 60vw; max-width: 704px; }.mx_Dialog_background { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--sidebar-color-50pct); z-index: calc(calc(4009 + 1) + 1); z-index: var(--dialog-zIndex-standard-background); }.mx_Dialog_background.mx_Dialog_staticBackground { z-index: 4009; z-index: var(--dialog-zIndex-static-background); }.mx_Dialog_wrapperWithStaticUnder .mx_Dialog_background { /* Roughly half of what it would normally be - we don't want to black out */ /* the app, just make it clear that the dialogs are stacked. */ 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_titleImage { vertical-align: sub; width: 25px; height: 25px; margin-left: -2px; margin-right: 4px; margin-bottom: 2px; }.mx_Dialog_title { color: var(--timeline-text-color); display: inline-block; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; letter-spacing: var(--cpd-font-letter-spacing-heading-lg); }.mx_Dialog_title.danger { color: #ff5b55; color: var(--alert, #ff5b55); }.mx_Dialog_header { position: relative; padding: 0; -webkit-padding-end: 20px; padding-inline-end: 20px; /* Reserve room for the close button */ margin-bottom: var(--cpd-space-2x); }.mx_Dialog_header.mx_Dialog_headerWithButton > .mx_Dialog_title { text-align: center; }.mx_Dialog_cancelButton { width: 20px; height: 20px; padding: var(--cpd-space-1x); border-radius: 14px; background-color: var(--cpd-color-bg-subtle-secondary); }.mx_Dialog_cancelButton:hover { background-color: var(--cpd-color-bg-subtle-primary); }.mx_Dialog_cancelButton svg { width: inherit; height: inherit; vertical-align: top; color: var(--cpd-color-icon-secondary); }.mx_Dialog_cancelButton{ position: absolute; top: var(--cpd-space-4x); right: var(--cpd-space-4x); }.mx_Dialog_content { margin: 24px 0 68px; font: var(--cpd-font-body-md-regular); color: var(--timeline-text-color); word-wrap: break-word; }.mx_Dialog_buttons { margin-top: 20px; -webkit-margin-start: auto; margin-inline-start: auto; text-align: right; }.mx_Dialog_buttons .mx_Dialog_buttons_additive { /* The consumer is responsible for positioning their elements. */ float: left; }.mx_Dialog_buttons .mx_Dialog_buttons_row { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; text-align: left; text-align: initial; -webkit-margin-start: auto; margin-inline-start: auto; /* default gap among elements */ -webkit-column-gap: 8px; -moz-column-gap: 8px; column-gap: 8px; -webkit-column-gap: var(--buttons-dialog-gap-column); -moz-column-gap: var(--buttons-dialog-gap-column); column-gap: var(--buttons-dialog-gap-column); row-gap: 8px; row-gap: var(--buttons-dialog-gap-row); }.mx_Dialog_buttons .mx_Dialog_buttons_row button { margin: 0 !important; /* override the margin settings */ }/* 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. */.mx_Dialog button:not( .mx_EncryptionUserSettingsTab button, .mx_EncryptionCard button, .mx_UserProfileSettings button, .mx_ShareDialog button, .mx_UnpinAllDialog button, .mx_ThemeChoicePanel_CustomTheme button, .mx_Dialog_nonDialogButton, .mx_AccessibleButton, .mx_IdentityServerPicker button, .mx_AccessSecretStorageDialog button, .mx_InviteDialog_section button, .mx_InviteDialog_editor button, [class|="maplibregl"] ), .mx_Dialog_buttons button:not(.mx_Dialog_nonDialogButton, .mx_AccessibleButton), .mx_Dialog input[type="submit"], .mx_Dialog_buttons input[type="submit"] { /* align images in buttons (eg spinners) */ vertical-align: middle; border: 0px; border-radius: 24px; font: var(--cpd-font-body-md-regular); color: white; background-color: var(--cpd-color-bg-action-primary-rest); width: auto; padding: 7px; padding-left: 1.5em; padding-right: 1.5em; cursor: pointer; display: inline-block; /* flip colours for the secondary ones */ }.mx_Dialog button:not( .mx_EncryptionUserSettingsTab button, .mx_EncryptionCard button, .mx_UserProfileSettings button, .mx_ShareDialog button, .mx_UnpinAllDialog button, .mx_ThemeChoicePanel_CustomTheme button, .mx_Dialog_nonDialogButton, .mx_AccessibleButton, .mx_IdentityServerPicker button, .mx_AccessSecretStorageDialog button, .mx_InviteDialog_section button, .mx_InviteDialog_editor button, [class|="maplibregl"] ):not(:focus-visible), .mx_Dialog_buttons button:not(.mx_Dialog_nonDialogButton, .mx_AccessibleButton):not(:focus-visible), .mx_Dialog input[type="submit"]:not(:focus-visible), .mx_Dialog_buttons input[type="submit"]:not(:focus-visible) { outline: none; }.mx_Dialog button:not( .mx_EncryptionUserSettingsTab button, .mx_EncryptionCard button, .mx_UserProfileSettings button, .mx_ShareDialog button, .mx_UnpinAllDialog button, .mx_ThemeChoicePanel_CustomTheme button, .mx_Dialog_nonDialogButton, .mx_AccessibleButton, .mx_IdentityServerPicker button, .mx_AccessSecretStorageDialog button, .mx_InviteDialog_section button, .mx_InviteDialog_editor button, [class|="maplibregl"] ), .mx_Dialog_buttons button:not(.mx_Dialog_nonDialogButton, .mx_AccessibleButton), .mx_Dialog input[type="submit"], .mx_Dialog_buttons input[type="submit"]{ margin-left: 0px; margin-right: 8px; margin-right: 8px; margin-right: var(--buttons-dialog-gap-column); margin-bottom: 5px; font-weight: var(--cpd-font-weight-semibold); border: 1px solid var(--cpd-color-border-interactive-secondary); color: var(--cpd-color-text-primary); background-color: transparent; font-family: inherit; }.mx_Dialog button:not( .mx_Dialog_nonDialogButton, [class|="maplibregl"], .mx_AccessibleButton, .mx_UserProfileSettings button, .mx_ThemeChoicePanel_CustomTheme button, .mx_UnpinAllDialog button, .mx_ShareDialog button, .mx_EncryptionUserSettingsTab button ):last-child { margin-right: 0px; }.mx_Dialog button:not( .mx_Dialog_nonDialogButton, [class|="maplibregl"], .mx_AccessibleButton, .mx_UserProfileSettings button, .mx_ThemeChoicePanel_CustomTheme button, .mx_UnpinAllDialog button, .mx_ShareDialog button, .mx_EncryptionUserSettingsTab button, .mx_InviteDialog_section button, .mx_InviteDialog_editor button ):focus, .mx_Dialog input[type="submit"]:focus, .mx_Dialog_buttons button:not(.mx_Dialog_nonDialogButton, .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, [class|="maplibregl"]), .mx_Dialog input[type="submit"].mx_Dialog_primary, .mx_Dialog_buttons button:not( .mx_Dialog_nonDialogButton, .mx_AccessibleButton, .mx_UserProfileSettings button, .mx_ThemeChoicePanel_CustomTheme button, .mx_UnpinAllDialog button, .mx_ShareDialog button, .mx_EncryptionUserSettingsTab button ), .mx_Dialog_buttons input[type="submit"].mx_Dialog_primary { color: var(--cpd-color-text-on-solid-primary); background-color: var(--cpd-color-bg-action-primary-rest); border-color: var(--cpd-color-bg-action-primary-rest); min-width: 156px; }.mx_Dialog button.danger:not(.mx_Dialog_nonDialogButton, [class|="maplibregl"]), .mx_Dialog input[type="submit"].danger, .mx_Dialog_buttons button.danger:not( .mx_Dialog_nonDialogButton, .mx_AccessibleButton, .mx_UserProfileSettings button, .mx_ThemeChoicePanel_CustomTheme button, .mx_UnpinAllDialog button, .mx_ShareDialog button, .mx_EncryptionUserSettingsTab button ), .mx_Dialog_buttons input[type="submit"].danger { background-color: var(--cpd-color-bg-critical-primary); border: solid 1px var(--cpd-color-bg-critical-primary); color: var(--cpd-color-text-on-solid-primary); }.mx_Dialog button.warning:not(.mx_Dialog_nonDialogButton, [class|="maplibregl"]), .mx_Dialog input[type="submit"].warning { border: solid 1px var(--cpd-color-border-critical-subtle); color: var(--cpd-color-text-critical-primary); }.mx_Dialog button:not( .mx_Dialog_nonDialogButton, [class|="maplibregl"], .mx_AccessibleButton, .mx_UserProfileSettings button, .mx_ThemeChoicePanel_CustomTheme button, .mx_UnpinAllDialog button, .mx_ShareDialog button, .mx_EncryptionUserSettingsTab button ):disabled, .mx_Dialog input[type="submit"]:disabled, .mx_Dialog_buttons button:not(.mx_Dialog_nonDialogButton, .mx_AccessibleButton):disabled, .mx_Dialog_buttons input[type="submit"]:disabled { background-color: var(--timeline-text-secondary-color); border: solid 1px var(--timeline-text-secondary-color); opacity: 0.7; }/* Spinner Dialog overide *//* This is not a real dialog, so we shouldn't show a glass border */.mx_Dialog_wrapper.mx_Dialog_spinner .mx_Dialog_border { display: contents; }.mx_Dialog_wrapper.mx_Dialog_spinner .mx_Dialog { inline-size: auto; block-size: 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; }/* TODO: Review mx_GeneralButton usage to see if it can use a different class *//* These classes were brought in from the old UserSettings and are included here to avoid *//* breaking the app. *//* Ref: https://github.com/vector-im/element-web/issues/8420 */.mx_GeneralButton { /* align images in buttons (eg spinners) */ vertical-align: middle; border: 0px; border-radius: 24px; font: var(--cpd-font-body-md-regular); color: white; background-color: var(--cpd-color-bg-action-primary-rest); width: auto; padding: 7px; padding-left: 1.5em; padding-right: 1.5em; cursor: pointer; display: inline-block; }.mx_GeneralButton:not(:focus-visible) { outline: none; }.mx_GeneralButton{ display: inline; margin: auto; }.mx_TextInputDialog_label { text-align: left; padding-bottom: 12px; }.mx_TextInputDialog_input { font-size: 0.9375rem; border-radius: 3px; border: 1px solid #e7e7e7; padding: 9px; color: var(--timeline-text-color); background-color: var(--timeline-background-color); }.mx_button_row { margin-top: 69px; }/* username colors *//* used by SenderProfile & RoomPreviewBar */.mx_Username_color1 { color: var(--cpd-color-text-decorative-1); }.mx_Username_color2 { color: var(--cpd-color-text-decorative-2); }.mx_Username_color3 { color: var(--cpd-color-text-decorative-3); }.mx_Username_color4 { color: var(--cpd-color-text-decorative-4); }.mx_Username_color5 { color: var(--cpd-color-text-decorative-5); }.mx_Username_color6 { color: var(--cpd-color-text-decorative-6); }.mx_AppWarning, .mx_AppPermission { 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-align: center; -ms-flex-align: center; align-items: center; }.mx_lineClamp { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; -webkit-line-clamp: var(--mx-line-clamp, 1); overflow: hidden; }/* This class is used extensively in element-web and are included here for compatibility with the existing timeline and layout. /* TODO: Review mx_MessageTimestamp usage after finishing migration of timeline tiles to shared components. *//* https://github.com/element-hq/element-web/issues/31651 */.mx_MessageTimestamp { color: var(--cpd-color-text-secondary) !important; /* override anchor color */ font-size: 0.625rem; -webkit-font-feature-settings: "tnum"; font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; display: block; /* enable the width setting below */ width: 46px; width: var(--MessageTimestamp-width); white-space: nowrap; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; text-decoration: none; }/* Copyright 2025 New Vector Ltd. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. *//* * Mobile web: safe areas (notch / home indicator), stable viewport height (dvh), * reduced horizontal overflow, and slightly larger tap targets where it matters. *//* iOS: avoid arbitrary text inflation in landscape / after zoom */html { -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-size-adjust: 100%; }/* Main app shell: respect safe areas from viewport-fit=cover */#matrixchat { -webkit-box-sizing: border-box; box-sizing: border-box; padding-left: env(safe-area-inset-left, 0px); padding-right: env(safe-area-inset-right, 0px); padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px); }.mx_LeftPanel_mobileBackdrop { display: none; }@media screen and (max-width: 768px) { /* Dynamic viewport — mitigates 100vh including mobile browser chrome where supported */ html { height: 100%; min-height: 100dvh; } body { min-height: 100dvh; } .mx_AuthPage { min-height: 100dvh; height: auto; -webkit-box-sizing: border-box; box-sizing: border-box; padding-left: env(safe-area-inset-left, 0px); padding-right: env(safe-area-inset-right, 0px); padding-bottom: env(safe-area-inset-bottom, 0px); } /* Avoid horizontal “wobble” scroll on narrow layouts */ .mx_MatrixChat_wrapper, .mx_MatrixChat, .mx_MainSplit { max-width: 100%; overflow-x: hidden; } /* Mobile room-list drawer: hidden by default, opened via top header button */ .mx_MatrixChat { position: relative; } .mx_MatrixChat > .mx_ResizeHandle { display: none; } /* Panel from react-resizable-panels keeps id="left-panel"; target wrapper by class to avoid duplicate ids. */ .mx_MatrixChat .mx_LeftPanel_outerWrapper { position: absolute; top: 64px; left: 0; height: calc(100% - 64px); width: min(92vw, 380px); max-width: 92vw; z-index: 30; -webkit-box-shadow: 0 8px 32px rgb(0 0 0 / 25%); box-shadow: 0 8px 32px rgb(0 0 0 / 25%); } .mx_MatrixChat .mx_LeftPanel_outerWrapper.mx_LeftPanel_outerWrapper_collapsed { display: none; } .mx_LeftPanel_mobileBackdrop.mx_LeftPanel_mobileBackdrop_visible { display: block; position: absolute; top: 64px; left: 0; right: 0; bottom: 0; z-index: 20; border: 0; padding: 0; margin: 0; background: rgb(0 0 0 / 35%); cursor: pointer; } .mx_LeftPanel_mobileCloseButton { display: -webkit-inline-box !important; display: -ms-inline-flexbox !important; display: inline-flex !important; } /* Dialogs: usable width on phones */ .mx_Dialog_fixedWidth { width: calc(100vw - var(--cpd-space-8x)); max-width: min(704px, 100%); } .mx_Dialog_border { margin-inline: auto; } /* Primary chrome: minimum touch target ~44 CSS px (accessibility) */ .mx_MessageComposer_actions .mx_AccessibleButton, .mx_RoomHeader .mx_AccessibleButton, .mx_LegacyRoomListHeader .mx_AccessibleButton { min-width: 40px; min-height: 40px; -webkit-box-sizing: border-box; box-sizing: border-box; } /* Faster taps on controls (no 300ms delay on legacy WebKit) */ .mx_MessageComposer_actions button, .mx_RoomHeader button, .mx_LeftPanel button { -ms-touch-action: manipulation; touch-action: manipulation; } }@media screen and (max-width: 480px) { .mx_Dialog { padding: var(--cpd-space-6x) var(--cpd-space-4x); } .mx_Dialog_content { margin: 16px 0 48px; } .mx_Dialog_cancelButton { top: var(--cpd-space-3x); right: var(--cpd-space-3x); } }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_BeaconListItem { -webkit-box-sizing: border-box; box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; padding: 12px 0; border-bottom: 1px solid #f4f6fa; border-bottom: 1px solid var(--system, #f4f6fa); cursor: pointer; }.mx_BeaconListItem_avatarIcon { -webkit-box-flex: 0; -ms-flex: 0 0; flex: 0 0; height: 32px; width: 32px; }.mx_BeaconListItem_avatar { -webkit-box-flex: 0; -ms-flex: 0 0; flex: 0 0; -webkit-box-sizing: border-box; box-sizing: border-box; margin-right: 8px; border: 2px solid #5c56f5; border-radius: 50%; }.mx_BeaconListItem_info { -webkit-box-flex: 1; -ms-flex: 1 1 0px; flex: 1 1 0; 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; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }.mx_BeaconListItem_status { /* override beacon status padding */ padding: 0 !important; margin-bottom: 8px; }.mx_BeaconListItem_status .mx_BeaconStatus_label { font-weight: var(--cpd-font-weight-semibold); }.mx_BeaconListItem_lastUpdated { color: #2e2f32; color: var(--tertiary-content, #2e2f32); font-size: 0.625rem; }.mx_BeaconListItem_interactions { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_BeaconStatus { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 8px; color: var(--color); font-size: 0.75rem; }.mx_BeaconStatus_Loading, .mx_BeaconStatus_Stopped { --color: var(--tertiary-content, #2e2f32); }.mx_BeaconStatus_Active, .mx_BeaconStatus_Error { --color: var(--timeline-text-color); }.mx_BeaconStatus_icon { height: 32px; width: 32px; -webkit-box-flex: 0; -ms-flex: 0 0 32px; flex: 0 0 32px; margin-right: 8px; }.mx_BeaconStatus_description { -webkit-box-flex: 1; -ms-flex: 1 1 0px; flex: 1 1 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; line-height: 0.875rem; padding-right: 8px; white-space: nowrap; overflow: hidden; }.mx_BeaconStatus_description .mx_BeaconStatus_description_status { text-overflow: ellipsis; overflow: hidden; }.mx_BeaconStatus_expiryTime { color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_BeaconStatus_label { margin-bottom: 2px; overflow: hidden; text-overflow: ellipsis; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_BeaconStatusTooltip { position: absolute; top: 42px; max-width: 150px; height: 38px; -webkit-box-sizing: content-box; box-sizing: content-box; padding-top: 8px; }.mx_BeaconStatusTooltip_inner { position: relative; height: 100%; border-radius: 4px; background: var(--timeline-background-color); -webkit-box-shadow: 4px 4px 12px 0 rgba(118, 131, 156, 0.6); box-shadow: 4px 4px 12px 0 rgba(118, 131, 156, 0.6); }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_BeaconViewDialog_wrapper .mx_Dialog { padding: 0px; /* Unset contain and position to allow the close button to appear outside the dialog */ contain: unset; position: static; position: initial; }.mx_BeaconViewDialog { /* subtract 0.5px to prevent single-pixel margin due to rounding */ width: calc(80vw - 0.5px); height: calc(80vh - 0.5px); overflow: hidden; /* sidebar is absolutely positioned inside */ position: relative; }.mx_BeaconViewDialog .mx_Dialog_header { margin: 0px; padding: 0px; position: static; position: initial; }.mx_BeaconViewDialog .mx_Dialog_header .mx_Dialog_title { display: none; }.mx_BeaconViewDialog .mx_Dialog_header .mx_Dialog_cancelButton { z-index: 4010; position: fixed; right: 5vw; top: 5vh; width: 20px; height: 20px; background-color: #ffffff; }.mx_BeaconViewDialog_map { width: 80vw; height: 80vh; border-radius: 8px; }.mx_BeaconViewDialog_mapFallbackMessage { color: #2e2f32; color: var(--secondary-content, #2e2f32); margin-bottom: 16px; }.mx_BeaconViewDialog_viewListButton { position: absolute; top: 24px; left: 24px; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_DialogOwnBeaconStatus { position: absolute; bottom: 32px; width: 300px; margin-left: -150px; left: 50%; -webkit-box-sizing: border-box; box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: stretch; -ms-flex-pack: stretch; justify-content: stretch; background: var(--timeline-background-color); border-radius: 8px; -webkit-box-shadow: 4px 4px 12px 0 rgba(118, 131, 156, 0.6); box-shadow: 4px 4px 12px 0 rgba(118, 131, 156, 0.6); padding: 0 12px; }.mx_DialogOwnBeaconStatus_avatarIcon { -webkit-box-flex: 0; -ms-flex: 0 0; flex: 0 0; height: 32px; width: 32px; margin: 8px 0 8px 0; }.mx_DialogOwnBeaconStatus_avatar { -webkit-box-flex: 0; -ms-flex: 0 0; flex: 0 0; -webkit-box-sizing: border-box; box-sizing: border-box; border: 2px solid #5c56f5; border-radius: 50%; margin: 8px 0 8px 0; }.mx_DialogOwnBeaconStatus_status { -webkit-box-flex: 1; -ms-flex: 1 1; flex: 1 1; padding-right: 0; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_DialogSidebar { position: absolute; top: 0; left: 0; height: 100%; width: 265px; 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; padding: 16px; background-color: var(--timeline-background-color); -webkit-box-shadow: 0px 4px 4px rgba(118, 131, 156, 0.6); box-shadow: 0px 4px 4px rgba(118, 131, 156, 0.6); }.mx_DialogSidebar .mx_DialogSidebar_header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-flex: 0; -ms-flex: 0 0; flex: 0 0; margin-bottom: 16px; color: var(--timeline-text-color); }.mx_DialogSidebar .mx_DialogSidebar_header .mx_DialogSidebar_closeButtonIcon { color: #2e2f32; color: var(--tertiary-content, #2e2f32); }.mx_DialogSidebar .mx_DialogSidebar_list { list-style: none; padding: 0; margin: 0; -webkit-box-flex: 1; -ms-flex: 1 1 0px; flex: 1 1 0; width: 100%; overflow: auto; }.mx_DialogSidebar_noResults { font: var(--cpd-font-body-md-regular); color: #2e2f32; color: var(--secondary-content, #2e2f32); }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_LeftPanelLiveShareWarning { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 4px; text-align: center; background-color: #0dbd8b; background-color: var(--accent-color, #0dbd8b); color: #fff; font-size: 0.625rem; /* panel backdrops overlay the whole sidepanel */ /* go above to get hover for title */ z-index: 1; }.mx_LeftPanelLiveShareWarning__error { background-color: #ff5b55; background-color: var(--alert, #ff5b55); }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_LiveTimeRemaining { color: #2e2f32; color: var(--secondary-content, #2e2f32); font-size: 0.75rem; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_OwnBeaconStatus_button { margin-left: 8px; }.mx_EventTile[data-layout="bubble"] .mx_OwnBeaconStatus_button { /* align to top to make room for timestamp */ /* in bubble view */ -ms-flex-item-align: start; align-self: start; }.mx_OwnBeaconStatus_destructiveButton { /* override button link_inline styles */ color: #ff5b55 !important; color: var(--alert, #ff5b55) !important; font-weight: var(--cpd-font-weight-semibold) !important; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_ShareLatestLocation_icon { height: 13px; width: 13px; color: #2e2f32; color: var(--secondary-content, #2e2f32); }/* double class to be more specific than the general mx_CopyableText CSS rule *//* override copyable text style to make compact */.mx_CopyableText.mx_ShareLatestLocation_copy .mx_CopyableText_copyButton { height: 13px; margin-left: 8px !important; position: relative; top: -1px; width: 13px; }.mx_CopyableText.mx_ShareLatestLocation_copy .mx_CopyableText_copyButton::before { background-color: #2e2f32; background-color: var(--secondary-content, #2e2f32); height: 13px; width: 13px; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_StyledLiveBeaconIcon { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 0; flex-shrink: 0; -webkit-box-sizing: border-box; box-sizing: border-box; border-width: 2px; border-style: solid; border-radius: 50%; background-color: #5c56f5; border-color: #5c56f5; padding: 2px; /* colors icon */ color: white; }.mx_StyledLiveBeaconIcon.mx_StyledLiveBeaconIcon_error { background-color: #ff5b55; background-color: var(--alert, #ff5b55); border-color: #ff5b55; border-color: var(--alert, #ff5b55); }.mx_StyledLiveBeaconIcon.mx_StyledLiveBeaconIcon_idle { background-color: #6f7882; background-color: var(--quaternary-content, #6f7882); border-color: #6f7882; border-color: var(--quaternary-content, #6f7882); }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_KebabContextMenu_icon { width: 24px; height: 24px; color: var(--icon-button-color, var(--cpd-color-icon-tertiary)); }/* Copyright 2024 New Vector Ltd. Copyright 2023 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_PollDetailHeader { /* override accessiblebutton style */ font-size: 0.9375rem !important; }.mx_PollDetailHeader_icon { height: 16px; width: 16px; margin-right: 8px; vertical-align: middle; }/* Copyright 2024 New Vector Ltd. Copyright 2023 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_PollListItem { width: 100%; }.mx_PollListItem_content { width: 100%; display: grid; -webkit-box-pack: left; -ms-flex-pack: left; justify-content: left; -webkit-box-align: center; -ms-flex-align: center; align-items: center; grid-gap: 8px; gap: 8px; grid-template-columns: auto auto auto; grid-template-rows: auto; cursor: pointer; color: var(--timeline-text-color); }.mx_PollListItem_icon { height: 14px; width: 14px; color: #6f7882; color: var(--quaternary-content, #6f7882); padding-left: 8px; }.mx_PollListItem_question { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }/* Copyright 2024 New Vector Ltd. Copyright 2023 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_PollListItemEnded { width: 100%; }.mx_PollListItemEnded_content { 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; color: var(--timeline-text-color); cursor: pointer; }.mx_PollListItemEnded_title { display: grid; -webkit-box-pack: left; -ms-flex-pack: left; justify-content: left; -webkit-box-align: center; -ms-flex-align: center; align-items: center; grid-gap: 8px; gap: 8px; grid-template-columns: -webkit-min-content 1fr -webkit-min-content; grid-template-columns: min-content 1fr min-content; grid-template-rows: auto; }.mx_PollListItemEnded_icon { height: 14px; width: 14px; color: #6f7882; color: var(--quaternary-content, #6f7882); padding-left: 8px; }.mx_PollListItemEnded_date { font-size: 0.75rem; color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_PollListItemEnded_question { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.mx_PollListItemEnded_answers { display: grid; grid-gap: 8px; gap: 8px; margin-top: 12px; }.mx_PollListItemEnded_voteCount { /* 6px to match PollOption padding */ margin: 8px 0 0 6px; }/* Copyright 2024 New Vector Ltd. Copyright 2019-2023 The Matrix.org Foundation C.I.C. Copyright 2015, 2016 OpenMarket Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_AppPermission { font-size: 0.75rem; width: 100%; /* make mx_AppPermission fill width of mx_AppTileBody so that scroll bar appears on the edge */ overflow-y: scroll; }.mx_AppPermission .mx_AppPermission_bolder, .mx_AppPermission .mx_AppPermission_content_bolder { font-weight: var(--cpd-font-weight-semibold); }.mx_AppPermission .mx_AppPermission_content { margin-block: auto; /* place at the center */ }.mx_AppPermission .mx_AppPermission_content > div { margin-block: 12px; }.mx_AppPermission .mx_AppPermission_content .mx_TextWithTooltip_target--helpIcon { display: inline-block; height: 0.875rem; /* align with characters on the same line */ vertical-align: middle; }.mx_AppPermission .mx_AppPermission_content .mx_TextWithTooltip_target--helpIcon .mx_Icon { color: #0dbd8b; color: var(--accent-color, #0dbd8b); }/* Copyright 2024 New Vector Ltd. Copyright 2023 Suguru Hirahara SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_AppWarning { font-size: 1rem; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }.mx_AppWarning h4 { margin: 0; padding: 0; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_FilterDropdown .mx_Dropdown_menu { margin-top: 4px; left: auto; left: initial; right: -12px; width: 232px; padding: 12px; border: 1px solid #6f7882; border: 1px solid var(--quinary-content, #6f7882); border-radius: 8px; -webkit-box-shadow: 0px 1px 3px rgb(23, 25, 28, 0.05); box-shadow: 0px 1px 3px rgb(23, 25, 28, 0.05); background-color: #f4f6fa; background-color: var(--system, #f4f6fa); }.mx_FilterDropdown .mx_Dropdown_menu .mx_Dropdown_option_highlight { background-color: transparent; }.mx_FilterDropdown .mx_Dropdown_input { height: 24px; background-color: transparent; border-color: transparent; color: #2e2f32; color: var(--secondary-content, #2e2f32); border-radius: 4px; }.mx_FilterDropdown .mx_Dropdown_input:focus, .mx_FilterDropdown .mx_Dropdown_input:hover { background-color: #6f7882; background-color: var(--quinary-content, #6f7882); border-color: #6f7882; border-color: var(--quinary-content, #6f7882); }.mx_FilterDropdown .mx_Dropdown_arrow { color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_FilterDropdown_option { position: relative; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 8px 0 8px 20px; font-size: 0.75rem; line-height: 0.9375rem; color: var(--timeline-text-color); }.mx_FilterDropdown_optionSelectedIcon { height: 14px; width: 14px; position: absolute; top: 8px; left: 0; }.mx_FilterDropdown_optionLabel { font-weight: var(--cpd-font-weight-semibold); display: block; }.mx_FilterDropdown_optionDescription { color: #2e2f32; color: var(--secondary-content, #2e2f32); margin-top: 4px; }/* Copyright 2024 New Vector Ltd. Copyright 2023 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_FilterTabGroup { color: var(--timeline-text-color); }.mx_FilterTabGroup label { margin-right: 12px; cursor: pointer; }.mx_FilterTabGroup label span { display: inline-block; line-height: 1.5rem; }.mx_FilterTabGroup input[type="radio"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; margin: 0; padding: 0; }.mx_FilterTabGroup input[type="radio"]:focus + span, .mx_FilterTabGroup input[type="radio"]:hover + span { color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_FilterTabGroup input[type="radio"]:checked + span { color: #0dbd8b; color: var(--accent-color, #0dbd8b); font-weight: var(--cpd-font-weight-semibold); /* underline */ -webkit-box-shadow: 0 1.5px 0 0 currentColor; box-shadow: 0 1.5px 0 0 currentColor; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_LearnMore_button { margin-left: 4px; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_EnableLiveShare { -webkit-box-flex: 1; -ms-flex: 1 1 0px; flex: 1 1 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-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 32px 16px; text-align: center; -webkit-box-sizing: border-box; box-sizing: border-box; }.mx_EnableLiveShare_heading { padding-top: 24px; }.mx_EnableLiveShare_icon { height: 58px; width: 58px; }.mx_EnableLiveShare_description { padding: 0 24px; margin-bottom: 32px; line-height: 1.25rem; }.mx_EnableLiveShare_button { margin-top: 32px; height: 48px; width: 100%; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_LiveDurationDropdown { margin-bottom: 16px; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_LocationShareMenu { width: 375px; height: 460px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_MapError { padding: 100px 32px 0; text-align: center; --mx-map-error-icon-color: var(--secondary-content, #2e2f32); --mx-map-error-icon-size: 58px; }.mx_MapError.mx_MapError_isMinimised { height: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 24px; background-color: var(--panels, var(--cpd-color-gray-600)); font-size: 0.75rem; line-height: 1rem; --mx-map-error-icon-color: var(--alert, #ff5b55); --mx-map-error-icon-size: 26px; }.mx_MapError.mx_MapError_isMinimised .mx_MapError_message { margin: 0; max-width: 275px; }.mx_MapError.mx_MapError_isMinimised .mx_MapError_heading { padding-top: 8px; /* override h3 heading size */ font-size: inherit !important; font-weight: normal !important; }.mx_MapError_message { margin: 16px 0 32px; }.mx_MapError_heading { padding-top: 24px; }.mx_MapError_icon { height: var(--mx-map-error-icon-size); width: var(--mx-map-error-icon-size); color: var(--mx-map-error-icon-color); }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_MapFallback { -webkit-box-sizing: border-box; box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; z-index: 0; background-color: #f4f6fa; background-color: var(--system, #f4f6fa); }.mx_MapFallback_bg { position: absolute; top: 0; left: 0; min-height: 100%; min-width: 100%; color: #6f7882; color: var(--quinary-content, #6f7882); z-index: -1; pointer-events: none; }.mx_MapFallback_icon { width: 65px; margin-bottom: 16px; color: #6f7882; color: var(--quaternary-content, #6f7882); }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_Marker_defaultColor { color: #0dbd8b; color: var(--accent-color, #0dbd8b); }.mx_Marker_border { width: 42px; height: 42px; border-radius: 50%; -webkit-filter: drop-shadow(0px 3px 5px rgb(0, 0, 0, 0.2)); filter: drop-shadow(0px 3px 5px rgb(0, 0, 0, 0.2)); background-color: currentColor; 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; }/* caret down */.mx_Marker_border::before { content: ""; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid currentColor; position: absolute; bottom: -4px; }.mx_Marker_icon { color: white; height: 20px; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_ShareDialogButtons { position: absolute; width: 100%; height: 0; top: 0; }.mx_ShareDialogButtons_button { -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: pointer; height: 24px; width: 24px; border-radius: 50%; background-color: #6f7882; background-color: var(--quinary-content, #6f7882); opacity: 0.8; text-align: center; color: #2e2f32; color: var(--secondary-content, #2e2f32); position: absolute; top: 16px; }.mx_ShareDialogButtons_button:hover, .mx_ShareDialogButtons_button:focus { opacity: 1; }.mx_ShareDialogButtons_button.left { left: 16px; }.mx_ShareDialogButtons_button.right { right: 16px; }.mx_ShareDialogButtons_button-icon { width: 20px; height: 20px; margin: 2px; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_ShareType { -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; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 60px 12px 32px; color: var(--timeline-text-color); }.mx_ShareType .mx_ShareType_wrapper_options { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; row-gap: 12px; width: 100%; margin-top: 12px; }.mx_ShareType .mx_ShareType_wrapper_options .mx_ShareType_option { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; padding: 8px 20px; background: none; border: 1px solid #6f7882; border: 1px solid var(--quinary-content, #6f7882); border-radius: 8px; font-size: 0.9375rem; font-family: inherit; line-height: inherit; color: var(--timeline-text-color); }.mx_ShareType .mx_ShareType_wrapper_options .mx_ShareType_option:hover, .mx_ShareType .mx_ShareType_wrapper_options .mx_ShareType_option:focus { border-color: #0dbd8b; border-color: var(--accent-color, #0dbd8b); }.mx_ShareType_badge { height: 60px; width: 60px; margin-bottom: 20px; background-color: #0dbd8b; background-color: var(--accent-color, #0dbd8b); border-radius: 50%; border: 14px solid #0dbd8b; border: 14px solid var(--accent-color, #0dbd8b); /* colors icon */ color: white; -webkit-box-sizing: border-box; box-sizing: border-box; }.mx_ShareType_heading { padding-bottom: 32px; text-align: center; }.mx_ShareType_option-icon { height: 40px; width: 40px; -webkit-box-sizing: border-box; box-sizing: border-box; margin-right: 12px; -webkit-box-flex: 0; -ms-flex: 0 0 40px; flex: 0 0 40px; border-width: 2px; border-style: solid; border-radius: 50%; /* Live is styled by StyledLiveBeaconIcon */ }.mx_ShareType_option-icon.Own { border-color: #0dbd8b; border-color: var(--accent-color, #0dbd8b); }.mx_ShareType_option-icon.Pin { border-color: #0dbd8b; border-color: var(--accent-color, #0dbd8b); background-color: #0dbd8b; background-color: var(--accent-color, #0dbd8b); padding: 7px; /* colors icon */ color: white; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_ZoomButtons { position: absolute; bottom: 32px; right: 24px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; row-gap: 8px; }.mx_ZoomButtons .mx_ZoomButtons_button { border-radius: 4px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 24px; width: 24px; background: var(--timeline-background-color); -webkit-box-shadow: 0px 4px 12px rgb(0, 0, 0, 0.25); box-shadow: 0px 4px 12px rgb(0, 0, 0, 0.25); }.mx_ZoomButtons .mx_ZoomButtons_button .mx_ZoomButtons_icon { height: 12px; width: 12px; color: var(--timeline-text-color); }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_MBeaconBody { position: relative; height: 220px; max-width: 325px; width: 100%; border-radius: 8px; border-radius: var(--MBody-border-radius); overflow: hidden; }.mx_MBeaconBody.mx_MBeaconBody_withoutMap { height: auto; }.mx_MBeaconBody.mx_MBeaconBody_withoutMap .mx_MBeaconBody_chin { position: relative; background-color: transparent; }.mx_MBeaconBody_withoutMapContent { background-color: var(--panels, var(--cpd-color-gray-600)); border-radius: 4px; }.mx_MBeaconBody_withoutMapInfoLastUpdated { /* 48px lines up with icon in BeaconStatus */ margin-top: -8px; padding: 0 8px 8px 48px; color: #2e2f32; color: var(--tertiary-content, #2e2f32); font-size: 0.625rem; }.mx_MBeaconBody_map { height: 100%; width: 100%; z-index: 0; /* keeps the entire map under the message action bars */ cursor: pointer; }.mx_MBeaconBody_mapFallback, .mx_MBeaconBody_mapError { /* pushes spinner/icon up */ /* to appear more centered with the footer */ padding-bottom: 50px !important; }.mx_MBeaconBody_mapErrorInteractive { cursor: pointer; }.mx_MBeaconBody_mapFallback { cursor: default; }.mx_MBeaconBody_chin { position: absolute; bottom: 0; width: 100%; background-color: var(--cpd-color-bg-canvas-default); opacity: 0.85; }.mx_EventTile[data-layout="bubble"] .mx_EventTile_line .mx_MBeaconBody { max-width: 100%; width: 450px; }.mx_ReplyTile .mx_MBeaconBody { /* Prevent clicking a beacon within a reply */ pointer-events: none; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_MediaProcessingError_Icon { margin-right: 4px; vertical-align: text-top; }/* Copyright 2024 New Vector Ltd. Copyright 2023 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_PollOption { border: 1px solid #6f7882; border: 1px solid var(--quinary-content, #6f7882); border-radius: 8px; padding: 6px 12px; background-color: var(--timeline-background-color); }.mx_PollOption .mx_StyledRadioButton_content, .mx_PollOption .mx_PollOption_endedOption { padding-top: 2px; margin-right: 0px; }.mx_PollOption .mx_StyledRadioButton_spacer { display: none; }.mx_PollOption, /* label has cursor: default in user-agent stylesheet */ /* override */ .mx_PollOption_live-option { cursor: pointer; }.mx_PollOption_content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }.mx_PollOption_optionVoteCount { color: #2e2f32; color: var(--secondary-content, #2e2f32); font-size: 0.75rem; white-space: nowrap; }.mx_PollOption_winnerIcon { height: 12px; width: 12px; color: var(--cpd-color-icon-accent-tertiary); margin-right: 4px; vertical-align: middle; }.mx_PollOption_checked .mx_PollOption_popularityBackground .mx_PollOption_popularityAmount { background-color: var(--cpd-color-icon-primary); }/* override checked radio button styling to show checkmark instead */.mx_PollOption_checked .mx_StyledRadioButton_checked input[type="radio"]:checked + div { border-color: var(--cpd-color-icon-primary); background-color: var(--cpd-color-icon-primary); }.mx_PollOption_checked .mx_StyledRadioButton_checked input[type="radio"]:checked + div div { background: none; }.mx_PollOption_checked .mx_StyledRadioButton_checked input[type="radio"]:checked + div div svg { color: var(--cpd-color-icon-on-solid-primary); width: 12px; height: 12px; margin: -2px; display: block; }.mx_PollOption_ended.mx_PollOption_checked .mx_PollOption_popularityBackground .mx_PollOption_popularityAmount { background-color: var(--cpd-color-icon-accent-tertiary); }/* override checked radio button styling to show checkmark instead */.mx_PollOption_ended.mx_PollOption_checked .mx_StyledRadioButton_checked input[type="radio"]:checked + div { border-color: var(--cpd-color-icon-accent-tertiary); background-color: var(--cpd-color-icon-accent-tertiary); }/* options not actionable in these states */.mx_PollOption_checked, .mx_PollOption_ended { pointer-events: none; }.mx_PollOption_popularityBackground { width: 100%; height: 8px; margin-right: 12px; border-radius: 8px; background-color: #f4f6fa; background-color: var(--system, #f4f6fa); margin-top: 8px; }.mx_PollOption_popularityBackground .mx_PollOption_popularityAmount { width: 0%; height: 8px; border-radius: 8px; background-color: var(--cpd-color-icon-primary); }/* Copyright 2024 New Vector Ltd. Copyright 2024 The Matrix.org Foundation C.I.C. Copyright 2019 New Vector Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. *//* * These used to live in General User Settings. These components are horribly duplicative * but share the same styles. For now I'm putting them here so I can renamed the general * tab sensibly and before I can refactor these components. */.mx_AddRemoveThreepids_existing { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }.mx_AddRemoveThreepids_existing_address, .mx_AddRemoveThreepids_existing_promptText { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; margin-right: 10px; }.mx_AddRemoveThreepids_existing_button { margin-left: 5px; }.mx_EmailAddressesPhoneNumbers_verify { display: -webkit-box; display: -ms-flexbox; display: flex; }.mx_EmailAddressesPhoneNumbers_existing_button { -webkit-box-pack: right; -ms-flex-pack: right; justify-content: right; }.mx_EmailAddressesPhoneNumbers_verify_instructions { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_CurrentDeviceSection_deviceDetails { /* align with text of session tile */ margin-left: 56px; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_DeviceDetailHeading { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }.mx_DeviceDetailHeading_renameCta { -ms-flex-negative: 0; flex-shrink: 0; }.mx_DeviceDetailHeading_renameForm { display: grid; grid-gap: 16px; gap: 16px; -webkit-box-pack: left; -ms-flex-pack: left; justify-content: left; grid-template-columns: 100%; }.mx_DeviceDetailHeading_renameFormButtons { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; gap: 8px; }.mx_DeviceDetailHeading_renameFormButtons .mx_Spinner { width: auto; -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; }.mx_DeviceDetailHeading_renameFormInput { /* override field styles */ margin: 0 0 4px 0 !important; }.mx_DeviceDetailHeading_renameFormHeading { margin: 0; }.mx_DeviceDetailHeading_renameFormError { color: #ff5b55; color: var(--alert, #ff5b55); padding-right: 4px; display: block; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_DeviceDetails { 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; margin-top: 16px; padding: 24px; border-radius: 8px; border: 1px solid #6f7882; border: 1px solid var(--quinary-content, #6f7882); }.mx_DeviceDetails_section { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #6f7882; border-bottom: 1px solid var(--quinary-content, #6f7882); display: grid; grid-gap: 24px; gap: 24px; -webkit-box-pack: left; -ms-flex-pack: left; justify-content: left; grid-template-columns: 100%; }.mx_DeviceDetails_section:last-child { padding-bottom: 0; border-bottom: 0; margin-bottom: 0; }.mx_DeviceDetails_sectionHeading { margin: 0; }.mx_DeviceDetails_sectionHeading .mx_DeviceDetails_sectionSubheading { display: block; font-size: 0.75rem; color: #2e2f32; color: var(--secondary-content, #2e2f32); line-height: 0.875rem; margin-top: 4px; }.mx_DeviceDetails_metadataTable { font: var(--cpd-font-body-sm-regular); color: #2e2f32; color: var(--secondary-content, #2e2f32); width: 100%; border-spacing: 0; }.mx_DeviceDetails_metadataTable th { text-transform: uppercase; font-weight: normal; text-align: left; }.mx_DeviceDetails_metadataTable td { padding-top: 8px; }.mx_DeviceDetails_metadataTable .mxDeviceDetails_metadataLabel { width: 160px; }.mx_DeviceDetails_metadataTable .mxDeviceDetails_metadataValue { color: var(--timeline-text-color); }.mx_DeviceDetails_signOutButtonContent { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 4px; }.mx_DeviceDetails_pushNotifications { display: block; }.mx_DeviceDetails_pushNotifications .mx_ToggleSwitch { float: right; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_DeviceExpandDetailsButton { height: 32px; width: 32px; background: transparent; border-radius: 4px; color: var(--icon-button-color, var(--cpd-color-icon-tertiary)); --icon-transform: rotate(-90deg); }.mx_DeviceExpandDetailsButton:hover { background: #6f7882; background: var(--quinary-content, #6f7882); }.mx_DeviceExpandDetailsButton.mx_DeviceExpandDetailsButton_expanded { --icon-transform: rotate(0deg); background: #f4f6fa; background: var(--system, #f4f6fa); }.mx_DeviceExpandDetailsButton.mx_DeviceExpandDetailsButton_expanded:hover { background: #6f7882; background: var(--quinary-content, #6f7882); }.mx_DeviceExpandDetailsButton_icon { height: 24px; width: 24px; -webkit-transition: all 0.3s; transition: all 0.3s; -webkit-transform: var(--icon-transform); transform: var(--icon-transform); -webkit-transform-origin: center; transform-origin: center; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_DeviceSecurityCard { width: 100%; 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-sizing: border-box; box-sizing: border-box; padding: 16px; border: 1px solid #6f7882; border: 1px solid var(--quinary-content, #6f7882); border-radius: 8px; }.mx_DeviceSecurityCard_icon { -webkit-box-flex: 0; -ms-flex: 0 0 40px; flex: 0 0 40px; 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-right: 16px; border-radius: 8px; height: 40px; width: 40px; color: var(--icon-color); background-color: var(--background-color); }.mx_DeviceSecurityCard_icon.Verified { --icon-color: #0dbd8b; --background-color: var(--cpd-color-green-300); }.mx_DeviceSecurityCard_icon.Unverified { --icon-color: #ff5b55; --background-color: var(--cpd-color-red-300); }.mx_DeviceSecurityCard_icon.Inactive { --icon-color: var(--secondary-content, #2e2f32); --background-color: var(--panels, var(--cpd-color-gray-600)); }.mx_DeviceSecurityCard_content { -webkit-box-flex: 1; -ms-flex: 1 1; flex: 1 1; }.mx_DeviceSecurityCard_heading { margin: 0 0 4px 0; }.mx_DeviceSecurityCard_description { margin: 0; font: var(--cpd-font-body-sm-regular); color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_DeviceSecurityCard_actions { margin-top: 16px; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_DeviceTile { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; }.mx_DeviceTile_interactive { cursor: pointer; }.mx_DeviceTile_info { -webkit-box-flex: 1; -ms-flex: 1 1 0px; flex: 1 1 0; }.mx_DeviceTile_metadata { margin-top: 4px; font: var(--cpd-font-body-sm-regular); color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_DeviceTile_inactiveIcon { height: 14px; margin-right: 8px; vertical-align: middle; }.mx_DeviceTile_actions { display: grid; grid-gap: 8px; gap: 8px; grid-auto-flow: column; margin-left: 8px; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_DeviceTypeIcon { -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; position: relative; margin-right: 8px; /* creates space for verification icon to overlap */ padding: 0 8px 8px 0; }.mx_DeviceTypeIcon_deviceIconWrapper { --background-color: var(--panels, var(--cpd-color-gray-600)); --icon-color: var(--secondary-content, #2e2f32); height: 40px; width: 40px; -webkit-box-sizing: border-box; box-sizing: border-box; border: 8px solid var(--background-color); border-radius: 50%; color: #2e2f32; color: var(--secondary-content, #2e2f32); color: var(--icon-color); background-color: var(--background-color); }.mx_DeviceTypeIcon_selected .mx_DeviceTypeIcon_deviceIconWrapper { --background-color: var(--timeline-text-color); --icon-color: var(--timeline-background-color); }.mx_DeviceTypeIcon_deviceIcon { height: 24px; width: 24px; }.mx_DeviceTypeIcon_verificationIcon { position: absolute; bottom: 0; right: 0; height: 24px; width: 24px; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 4px; border: 1px solid #6f7882; border: 1px solid var(--quinary-content, #6f7882); border-radius: 50%; background-color: var(--timeline-background-color); color: var(--v-icon-color); }.mx_DeviceTypeIcon_verificationIcon.verified { --v-icon-color: #0dbd8b; }.mx_DeviceTypeIcon_verificationIcon.unverified { --v-icon-color: #ff5b55; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_FilteredDeviceList .mx_Dropdown { -webkit-box-flex: 1; -ms-flex: 1 0 80px; flex: 1 0 80px; }.mx_FilteredDeviceList_list { list-style-type: none; display: grid; grid-gap: 16px; gap: 16px; margin: 0; padding: 0 16px; }.mx_FilteredDeviceList_listItem { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }.mx_FilteredDeviceList_securityCard { margin-bottom: 32px; }.mx_FilteredDeviceList_noResults { width: 100%; text-align: center; margin-bottom: 32px; }.mx_FilteredDeviceList_headerButton { -ms-flex-negative: 0; flex-shrink: 0; /* override inline button styling */ display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; gap: 8px; }.mx_FilteredDeviceList_deviceDetails { /* align with text of session tile */ margin-left: 88px; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_FilteredDeviceListHeader { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-sizing: border-box; box-sizing: border-box; gap: 16px; width: 100%; height: 48px; padding: 0 16px; margin-bottom: 32px; background-color: var(--panels, var(--cpd-color-gray-600)); border-radius: 8px; color: #2e2f32; color: var(--secondary-content, #2e2f32); }/* Higher specificity selector to override the flex-start value */.mx_FilteredDeviceListHeader .mx_AccessibleButton.mx_AccessibleButton_hasKind { -ms-flex-item-align: center; align-self: center; }.mx_FilteredDeviceListHeader_label { -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_SecurityRecommendations_spacing { height: 16px; }/* Copyright 2024,2025 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_SelectableDeviceTile { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; }.mx_SelectableDeviceTile_checkbox { -webkit-box-flex: 1; -ms-flex: 1 0; flex: 1 0; }.mx_SelectableDeviceTile_checkbox > div { margin-top: auto; margin-bottom: auto; margin-right: var(--cpd-space-1x); }/* * Copyright 2025 New Vector Ltd. * * SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial * Please see LICENSE files in the repository root for full details. */.mx_KeyStoragePanel_toggleRow { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_SettingsSubsection { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; }.mx_SettingsSubsection.mx_SettingsSubsection_newUi { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: var(--cpd-space-6x); }.mx_SettingsSubsection *[role="separator"] { /** * The gap between subsections is 32px and inside the subsection is 24px. * The separator separates the subsections, so it should have the same gap as the subsections. * We add 12px and the separator spacing (8px) to the top margin to make the separator visually centered between the subsections. * !important because it's overriding compound margin. */ margin-top: var(--cpd-space-5x) !important; }.mx_SettingsSubsection_description { margin-top: 8px; }.mx_SettingsSubsection_text { width: 100%; -webkit-box-sizing: inherit; box-sizing: inherit; color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_SettingsSubsection_content { width: 100%; display: grid; grid-gap: var(--cpd-space-4x); gap: var(--cpd-space-4x); /* setting minwidth 0 makes columns definitely sized fixing horizontal overflow */ grid-template-columns: minmax(0, 1fr); justify-items: flex-start; margin-top: 24px; }.mx_SettingsSubsection_content summary { color: #0dbd8b; color: var(--accent-color, #0dbd8b); }.mx_SettingsSubsection_content details[open] summary { margin-bottom: 8px; }.mx_SettingsSubsection_content.mx_SettingsSubsection_contentStretch { justify-items: stretch; }.mx_SettingsSubsection_content.mx_SettingsSubsection_noHeading { margin-top: 0; }.mx_SettingsSubsection_content.mx_SettingsSubsection_content_newUi { gap: var(--cpd-space-6x); margin-top: 0; }.mx_SettingsSubsection_content .mx_SettingsSubsection_dropdown { min-width: 360px; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_SettingsSubsectionHeading { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; gap: 8px; }.mx_SettingsSubsectionHeading_heading { -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_QuickThemeSwitcher { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }.mx_QuickThemeSwitcher .mx_Dropdown { min-width: 100px; margin-left: auto; height: -webkit-min-content; height: -moz-min-content; height: min-content; }.mx_QuickThemeSwitcher .mx_Dropdown_menu { max-height: 70px; }.mx_QuickThemeSwitcher_heading { font-weight: var(--cpd-font-weight-semibold); font-size: 0.75rem; line-height: 0.9375rem; color: #2e2f32; color: var(--secondary-content, #2e2f32); text-transform: uppercase; display: inline-block; margin: 0; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_Caption { font: var(--cpd-font-body-sm-regular); color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_Caption.mx_Caption_error { color: #ff5b55; color: var(--alert, #ff5b55); }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. *//* * Compound icon * {@link https://www.figma.com/file/X4XTH9iS2KGJ2wFKDqkyed} */.mx_Icon { -webkit-box-sizing: border-box; box-sizing: border-box; }.mx_Icon_accent { color: #0dbd8b; color: var(--accent-color, #0dbd8b); }.mx_Icon_bg-accent-light { background-color: var(--accent-color-300); }.mx_Icon_alert { color: #ff5b55; color: var(--alert, #ff5b55); }.mx_Icon_circle-40 { border-radius: 20px; -webkit-box-flex: 0; -ms-flex: 0 0 40px; flex: 0 0 40px; height: 40px; padding: 0 12px; width: 40px; }.mx_Icon_8 { -webkit-box-flex: 0; -ms-flex: 0 0 8px; flex: 0 0 8px; height: 8px; width: 8px; }.mx_Icon_10 { -webkit-box-flex: 0; -ms-flex: 0 0 10px; flex: 0 0 10px; height: 10px; width: 10px; }.mx_Icon_12 { -webkit-box-flex: 0; -ms-flex: 0 0 12px; flex: 0 0 12px; height: 12px; width: 12px; }.mx_Icon_16 { -webkit-box-flex: 0; -ms-flex: 0 0 16px; flex: 0 0 16px; height: 16px; width: 16px; }.mx_Icon_24 { -webkit-box-flex: 0; -ms-flex: 0 0 24px; flex: 0 0 24px; height: 24px; width: 24px; }.mx_Icon_32 { -webkit-box-flex: 0; -ms-flex: 0 0 32px; flex: 0 0 32px; height: 32px; width: 32px; }/* Copyright 2024 New Vector Ltd. Copyright 2023 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_SuccessDialog { text-align: center; }.mx_SuccessDialog .mx_Icon { margin-bottom: 16px; }.mx_SuccessDialog .mx_Dialog_header { margin: 0 0 16px; padding: 0; }.mx_SuccessDialog .mx_Dialog_title { margin: 0; }.mx_SuccessDialog .mx_Dialog_content { color: #2e2f32; color: var(--secondary-content, #2e2f32); margin: 0 0 40px; }.mx_SuccessDialog .mx_Dialog_buttons .mx_Dialog_buttons_row { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }.mx_SuccessDialog .mx_Dialog_buttons .mx_Dialog_buttons_row button.mx_Dialog_primary { height: 48px; min-width: 328px; }/* Copyright 2018-2024 New Vector Ltd. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. *//* make any scrollbar grey and thin */html { scrollbar-color: rgba(0, 0, 0, 0.2) transparent; }/* scrollbar-width is not inherited (but -color is, why?!), *//* so declare it on every element */* { scrollbar-width: thin; }::-webkit-scrollbar { width: 6px; height: 6px; }::-webkit-scrollbar-thumb { border-radius: 3px; background-color: rgba(0, 0, 0, 0.2); }/* make auto-hide scrollbars not transparent again on hover */.mx_AutoHideScrollbar:hover { scrollbar-color: rgba(0, 0, 0, 0.2) transparent; }.mx_AutoHideScrollbar:hover::-webkit-scrollbar-thumb { background-color: rgba(0, 0, 0, 0.2); }/* make scrollbars transparent for autohide scrollbars */.mx_AutoHideScrollbar { overflow-x: hidden; overflow-y: auto; overflow-y: overlay; /* where supported */ -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; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_AutocompleteInput { position: relative; }.mx_AutocompleteInput_search_icon { margin-left: 8px; fill: #2e2f32; fill: var(--secondary-content, #2e2f32); }.mx_AutocompleteInput_editor { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; overflow-x: hidden; overflow-y: auto; border: 1px solid #e7e7e7; border-radius: 4px; -webkit-transition: border-color 0.25s; transition: border-color 0.25s; }.mx_AutocompleteInput_editor > input { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 40%; resize: none; /* `!important` is required to bypass global input styles. */ margin: 0 !important; padding: 8px 9px; border: none !important; color: var(--timeline-text-color) !important; font-weight: normal !important; }.mx_AutocompleteInput_editor > input::-webkit-input-placeholder { color: var(--timeline-text-color) !important; font-weight: normal !important; }.mx_AutocompleteInput_editor > input::-moz-placeholder { color: var(--timeline-text-color) !important; font-weight: normal !important; }.mx_AutocompleteInput_editor > input:-ms-input-placeholder { color: var(--timeline-text-color) !important; font-weight: normal !important; }.mx_AutocompleteInput_editor > input::-ms-input-placeholder { color: var(--timeline-text-color) !important; font-weight: normal !important; }.mx_AutocompleteInput_editor > input::placeholder { color: var(--timeline-text-color) !important; font-weight: normal !important; }.mx_AutocompleteInput_editor--focused { border-color: #0086e6; border-color: var(--links, #0086e6); }.mx_AutocompleteInput_editor--has-suggestions { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }.mx_AutocompleteInput_editor_selection { display: -webkit-box; display: -ms-flexbox; display: flex; margin-left: 8px; }.mx_AutocompleteInput_editor_selection_pill { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-radius: 12px; padding-left: 8px; padding-right: 8px; background-color: var(--cpd-color-text-decorative-1); color: #ffffff; font-size: 0.75rem; }.mx_AutocompleteInput_editor_selection_remove_button svg { vertical-align: middle; }.mx_AutocompleteInput_matches { position: absolute; left: 0; right: 0; background-color: var(--timeline-background-color); border: 1px solid #0086e6; border: 1px solid var(--links, #0086e6); border-top-color: #e7e7e7; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; z-index: 1000; }.mx_AutocompleteInput_suggestion { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 8px; cursor: pointer; }.mx_AutocompleteInput_suggestion > * { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }.mx_AutocompleteInput_suggestion:hover { background-color: #6f7882; background-color: var(--quinary-content, #6f7882); border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; }.mx_AutocompleteInput_suggestion--selected { background-color: #6f7882; background-color: var(--quinary-content, #6f7882); }.mx_AutocompleteInput_suggestion--selected:last-child { border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; }.mx_AutocompleteInput_suggestion_title { margin-right: 8px; }.mx_AutocompleteInput_suggestion_description { color: #2e2f32; color: var(--secondary-content, #2e2f32); font-size: 0.75rem; }/* Copyright 2021-2024 New Vector Ltd. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_BackdropPanel { position: absolute; left: 0; top: 0; height: 100vh; width: 100%; overflow: hidden; -webkit-filter: blur(var(--lp-background-blur)); filter: blur(var(--lp-background-blur)); /* Force a new layer for the backdropPanel so it's better hardware supported */ -webkit-transform: translateZ(0); transform: translateZ(0); }.mx_BackdropPanel--image { position: absolute; top: 0; left: 0; min-height: 100%; z-index: 0; pointer-events: none; overflow: hidden; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }.mx_CompatibilityPage { width: 100%; height: 100%; background-color: #e55; }.mx_CompatibilityPage_box { position: absolute; inset: 0; margin: auto; width: 500px; height: 300px; border: 1px solid; padding: 10px; background-color: #fcc; }/* Copyright 2024 New Vector Ltd. Copyright 2019 The Matrix.org Foundation C.I.C. Copyright 2015, 2016 OpenMarket Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_ContextualMenu_wrapper { position: fixed; z-index: 5000; }.mx_ContextualMenu_background { position: fixed; top: 0; left: 0; width: 100%; height: 100%; opacity: 1; }.mx_ContextualMenu { border-radius: 12px; -webkit-box-shadow: 0px 4px 24px rgb(0, 0, 0, 0.1); box-shadow: 0px 4px 24px rgb(0, 0, 0, 0.1); background-color: var(--cpd-color-bg-canvas-default); border: var(--cpd-border-width-1) solid var(--cpd-color-border-interactive-secondary); color: var(--timeline-text-color); position: absolute; z-index: 5001; width: -webkit-max-content; width: -moz-max-content; width: max-content; }.mx_ContextualMenu_right { right: 16px; }.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 var(--timeline-background-color); 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 var(--timeline-background-color); 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 var(--timeline-background-color); 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 var(--timeline-background-color); 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 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_ErrorMessage { -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #ff5b55; color: var(--alert, #ff5b55); display: -webkit-box; display: -ms-flexbox; display: flex; font-size: 0.75rem; gap: 8px; line-height: 1.2em; min-height: 2.4em; }/* Copyright 2024 New Vector Ltd. Copyright 2015, 2016 OpenMarket Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */@-webkit-keyframes mx_FileDropTarget_animation { from { opacity: 0; } to { opacity: 0.95; } }@keyframes mx_FileDropTarget_animation { from { opacity: 0; } to { opacity: 0.95; } }.mx_FileDropTarget { min-width: 0; width: 100%; height: 100%; font-size: 1.125rem; text-align: center; pointer-events: none; background-color: var(--timeline-background-color); 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_FileDropTarget_animation; animation: mx_FileDropTarget_animation; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; }@-webkit-keyframes mx_FileDropTarget_image_animation { from { -webkit-transform: scaleX(0); transform: scaleX(0); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } }@keyframes mx_FileDropTarget_image_animation { from { -webkit-transform: scaleX(0); transform: scaleX(0); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } }.mx_FileDropTarget_image { width: 32px; -webkit-animation: mx_FileDropTarget_image_animation; animation: mx_FileDropTarget_image_animation; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; margin-bottom: 16px; }/* Copyright 2024 New Vector Ltd. Copyright 2016 OpenMarket Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.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; /* 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_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%; gap: var(--cpd-space-6x); }/* Overrides for the attachment body tiles */.mx_FilePanel .mx_EventTile { word-break: break-word; padding-top: 0; }.mx_FilePanel .mx_EventTile + .mx_EventTile { border-top: 1px solid var(--cpd-color-gray-400); padding-top: var(--cpd-space-6x); }.mx_FilePanel .mx_EventTile .mx_EventTile_line { -webkit-padding-start: 0; padding-inline-start: 0; }.mx_FilePanel .mx_EventTile .mx_MFileBody [data-type="download"] { margin-top: var(--cpd-space-4x); }/* anchor link as wrapper */.mx_FilePanel .mx_EventTile .mx_EventTile_senderDetailsLink { text-decoration: none; margin-bottom: var(--cpd-space-1x); display: block; }.mx_FilePanel .mx_EventTile .mx_EventTile_senderDetailsLink .mx_EventTile_senderDetails { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: -2px; gap: var(--cpd-space-2x); -webkit-box-align: center; -ms-flex-align: center; align-items: center; }.mx_FilePanel .mx_EventTile .mx_EventTile_senderDetailsLink .mx_EventTile_senderDetails .mx_DisambiguatedProfile { color: #acacac; /* for ellipsis. Color of displayName and mxid is inherited */ }.mx_FilePanel .mx_EventTile .mx_EventTile_senderDetailsLink .mx_EventTile_senderDetails .mx_MessageTimestamp { margin-left: auto; font: var(--cpd-font-body-xs-regular); color: var(--cpd-color-text-secondary); }.mx_FilePanel .mx_EventTile_line { -webkit-margin-end: 0; margin-inline-end: 0; -webkit-padding-start: 0; padding-inline-start: 0; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_GenericDropdownMenu_button { padding: 3px 4px 3px 8px; border-radius: 4px; line-height: 1.5; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; font-size: 0.75rem; color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_GenericDropdownMenu_button svg { width: 18px; height: 18px; float: right; }.mx_GenericDropdownMenu_button:hover, .mx_GenericDropdownMenu_button[aria-expanded="true"] { background: #6f7882; background: var(--quinary-content, #6f7882); }.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper .mx_ContextualMenu { position: static; position: initial; font-size: 0.75rem; color: #2e2f32; color: var(--secondary-content, #2e2f32); padding-top: 10px; padding-bottom: 10px; border: 1px solid #6f7882; border: 1px solid var(--quinary-content, #6f7882); -webkit-box-shadow: 0 1px 3px rgb(23, 25, 28, 0.05); box-shadow: 0 1px 3px rgb(23, 25, 28, 0.05); }.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper .mx_ContextualMenu_chevron_top { left: auto; right: 22px; border-bottom-color: #6f7882; border-bottom-color: var(--quinary-content, #6f7882); }.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper .mx_ContextualMenu_chevron_top::after { content: ""; border: inherit; border-bottom-color: var(--timeline-background-color); position: absolute; top: 1px; left: -8px; }.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper .mx_GenericDropdownMenu_divider { display: block; height: 0; margin-left: 4px; margin-right: 19px; border-top: 1px solid #6f7882; border-top: 1px solid var(--quinary-content, #6f7882); }.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper .mx_GenericDropdownMenu_Option { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 10px 20px 10px 30px; position: relative; }.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper .mx_GenericDropdownMenu_Option > .mx_GenericDropdownMenu_Option--label { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; margin: 0; }.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper .mx_GenericDropdownMenu_Option > .mx_GenericDropdownMenu_Option--label span:first-child { color: var(--timeline-text-color); font-weight: var(--cpd-font-weight-semibold); }.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper .mx_GenericDropdownMenu_Option.mx_GenericDropdownMenu_Option--header > .mx_GenericDropdownMenu_Option--label span:first-child { font-size: 0.9375rem; }.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper .mx_GenericDropdownMenu_Option.mx_GenericDropdownMenu_Option--item:hover { background-color: #f5f8fa; background-color: var(--menu-selected-color, #f5f8fa); }.mx_ContextualMenu_wrapper.mx_GenericDropdownMenu_wrapper .mx_GenericDropdownMenu_Option.mx_GenericDropdownMenu_Option--item .mx_GenericDropdownMenu_Option--checkIcon { width: 16px; height: 16px; margin-left: -22px; margin-right: 6px; color: var(--timeline-text-color); display: inline-block; vertical-align: middle; }/* Copyright 2019-2024 New Vector Ltd. Copyright 2017 Vector Creations Ltd Copyright 2016 OpenMarket Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_HomePage { max-width: 960px; 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: var(--cpd-font-weight-semibold); font-size: 2rem; line-height: 1.375; margin-bottom: 4px; }.mx_HomePage_default h2 { margin-top: 4px; font-weight: var(--cpd-font-weight-semibold); font-size: 1.125rem; line-height: 1.5625rem; color: #61708b; }.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; /* top: 20px top padding + 40px icon + 13px margin */ width: 160px; min-height: 132px; 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: var(--cpd-font-weight-semibold); font-size: 0.9375rem; line-height: 1.25rem; color: #fff; /* on all themes */ background-color: #0dbd8b; background-color: var(--accent-color, #0dbd8b); }.mx_HomePage_default .mx_HomePage_default_buttons .mx_AccessibleButton svg { top: 20px; left: 60px; /* (160px-40px)/2 */ width: 40px; height: 40px; position: absolute; color: #fff; /* on all themes */ }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_LargeLoader { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: 100%; }.mx_LargeLoader .mx_Spinner { -webkit-box-flex: initial; -ms-flex: initial; flex: initial; height: auto; margin-bottom: 32px; margin-top: 33vh; }.mx_LargeLoader .mx_LargeLoader_text { font-size: 24px; font-weight: var(--cpd-font-weight-semibold); padding: 0 16px; position: relative; text-align: center; }/* Copyright 2024 New Vector Ltd. Copyright 2020 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_MatrixChat--with-avatar .mx_LeftPanel, .mx_MatrixChat--with-avatar .mx_LeftPanel .mx_LeftPanel_roomListContainer { background-color: transparent; }.mx_LeftPanel_outerWrapper { 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: 50%; position: relative; }.mx_LeftPanel_outerWrapper_collapsed { display: none; }.mx_LeftPanel_wrapper, .mx_LeftPanel { --collapsedWidth: 68px; }.mx_LeftPanel_panel .mx_LeftPanel_outerWrapper { height: 100%; max-width: none; }.mx_LeftPanel_panel .mx_LeftPanel_wrapper--user { width: 100%; }.mx_LeftPanel_wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; height: 100%; /* ensure space panel is still scrollable with an outer wrapper */ }.mx_LeftPanel_wrapper .mx_LeftPanel_wrapper--user { background-color: var(--roomlist-background-color); display: -webkit-box; display: -ms-flexbox; display: flex; overflow: hidden; position: relative; /* For enhanced visibility under contrast control */ outline: 1px solid transparent; }.mx_LeftPanel_wrapper .mx_LeftPanel_wrapper--user[data-collapsed] { max-width: var(--collapsedWidth); }.mx_LeftPanel { background-color: var(--roomlist-background-color); /* Create a row-based flexbox for the space panel and the room list */ display: -webkit-box; display: -ms-flexbox; display: flex; contain: content; position: relative; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; overflow: hidden; /* Note: The 'room list' in this context is actually everything that isn't the tag */ }/* panel, such as the menu options, breadcrumbs, filtering, etc */.mx_LeftPanel .mx_LeftPanel_roomListContainer { background-color: var(--roomlist-background-color); -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; min-width: 0; /* Create another flexbox (this time a column) for the room list components */ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_userHeader { /* 12px top, 12px sides, 20px bottom (using 13px bottom to account * for internal whitespace in the breadcrumbs) */ padding: 12px; -ms-flex-negative: 0; flex-shrink: 0; /* to convince safari's layout engine the flexbox is fine */ /* Create another flexbox column for the rows to stack within */ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_breadcrumbsContainer { overflow-y: hidden; overflow-x: scroll; margin: 12px 12px 0 12px; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; /* Create yet another flexbox, this time within the row, to ensure items stay */ /* aligned correctly. This is also a row-based flexbox. */ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; contain: content; }.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_breadcrumbsContainer.mx_IndicatorScrollbar_leftOverflow { -webkit-mask-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(5%, black)); -webkit-mask-image: linear-gradient(90deg, transparent, black 5%); mask-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(5%, black)); mask-image: linear-gradient(90deg, transparent, black 5%); }.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_breadcrumbsContainer.mx_IndicatorScrollbar_rightOverflow { -webkit-mask-image: -webkit-gradient(linear, left top, right top, from(black), color-stop(95%, black), to(transparent)); -webkit-mask-image: linear-gradient(90deg, black, black 95%, transparent); mask-image: -webkit-gradient(linear, left top, right top, from(black), color-stop(95%, black), to(transparent)); mask-image: linear-gradient(90deg, black, black 95%, transparent); }.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_breadcrumbsContainer.mx_IndicatorScrollbar_rightOverflow.mx_IndicatorScrollbar_leftOverflow { -webkit-mask-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(5%, black), color-stop(95%, black), to(transparent)); -webkit-mask-image: linear-gradient(90deg, transparent, black 5%, black 95%, transparent); mask-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(5%, black), color-stop(95%, black), to(transparent)); mask-image: linear-gradient(90deg, transparent, black 5%, black 95%, transparent); }.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer { margin: 0 12px; padding: 12px 0 8px; border-bottom: 1px solid #6f7882; border-bottom: 1px solid var(--quinary-content, #6f7882); -ms-flex-negative: 0; flex-shrink: 0; /* to convince safari's layout engine the flexbox is fine */ /* Create a flexbox to organize the inputs */ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer + .mx_LegacyRoomListHeader { margin-top: 12px; }.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer .mx_LeftPanel_dialPadButton, .mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer .mx_LeftPanel_exploreButton, .mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer .mx_LeftPanel_mobileCloseButton { width: 20px; height: 20px; padding: var(--cpd-space-1-5x); border-radius: 8px; background-color: var(--roomlist-highlights-color); margin-left: 8px; /* For enhanced visibility under contrast control */ outline: 1px solid transparent; }.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer .mx_LeftPanel_dialPadButton svg, .mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer .mx_LeftPanel_exploreButton svg, .mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer .mx_LeftPanel_mobileCloseButton svg { width: inherit; height: inherit; display: block; color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer .mx_LeftPanel_dialPadButton:hover, .mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer .mx_LeftPanel_exploreButton:hover, .mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer .mx_LeftPanel_mobileCloseButton:hover { background-color: #2e2f32; background-color: var(--tertiary-content, #2e2f32); }.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer .mx_LeftPanel_dialPadButton:hover svg, .mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer .mx_LeftPanel_exploreButton:hover svg, .mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer .mx_LeftPanel_mobileCloseButton:hover svg { color: var(--timeline-background-color); }.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer .mx_LeftPanel_mobileCloseButton { display: none; }.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LegacyRoomListHeader:first-child { margin-top: 12px; }.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_roomListWrapper { /* Make the y-scrollbar more responsive */ padding-right: 2px; overflow: hidden; margin-top: 10px; /* so we're not up against the search/filter */ -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; /* needed in Safari to properly set flex-basis */ }.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_roomListWrapper.mx_LeftPanel_roomListWrapper_stickyBottom { padding-bottom: 32px; }.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_roomListWrapper.mx_LeftPanel_roomListWrapper_stickyTop { padding-top: 32px; }.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_actualRoomListContainer { position: relative; /* for sticky headers */ height: 100%; /* ensure scrolling still works */ }/* These styles override the defaults for the minimized (66px) layout */.mx_LeftPanel.mx_LeftPanel_minimized { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; min-width: 0; min-width: initial; width: auto !important; width: initial !important; }.mx_LeftPanel.mx_LeftPanel_minimized .mx_LeftPanel_roomListContainer { width: var(--collapsedWidth); }.mx_LeftPanel.mx_LeftPanel_minimized .mx_LeftPanel_roomListContainer .mx_LeftPanel_userHeader { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }.mx_LeftPanel.mx_LeftPanel_minimized .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer { /* Organize the flexbox into a centered column layout */ -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }.mx_LeftPanel.mx_LeftPanel_minimized .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer .mx_LeftPanel_dialPadButton { margin-left: 0; margin-top: 8px; background-color: transparent; }.mx_LeftPanel.mx_LeftPanel_minimized .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer .mx_LeftPanel_exploreButton { margin-left: 0; margin-top: 8px; }.mx_LeftPanel.mx_LeftPanel_minimized .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer .mx_LeftPanel_mobileCloseButton { display: none; }.mx_LeftPanel_newRoomList { /* Thew new rooms list is not designed to be collapsed to just icons. */ /* 224 + 68(spaces bar) was deemed by design to be a good minimum for the left panel. */ --collapsedWidth: 224px; /* Important to force the color on ED titlebar until we remove the old room list */ background-color: var(--cpd-color-bg-canvas-default) !important; }#left-panel .mx_LeftPanel_wrapper--user { /* * Disable background when using the new room list. * This background sometimes shows when the panel is resized and it looks like a thicker border. */ background: none; }/* Copyright 2019-2024 New Vector Ltd. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.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%; }.mx_MainSplit > .mx_RightPanel_ResizeWrapper:hover .mx_ResizeHandle--horizontal::before { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-150%, -50%); transform: translate(-150%, -50%); height: 64px; /* to match width of the ones on roomlist */ width: 4px; border-radius: 4px; content: ""; background-color: var(--timeline-text-color); opacity: 0.8; }/* Copyright 2024 New Vector Ltd. Copyright 2015, 2016 OpenMarket Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_MatrixChat_splash { position: relative; height: 100%; }.mx_MatrixChat_wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; 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-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-height: 0; }.mx_Appbar { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-height: 64px; border-bottom: 1px solid var(--cpd-color-gray-400); background-color: var(--timeline-background-color); z-index: 10; }.mx_Appbar_menuToggle { 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; width: 40px; height: 40px; margin-left: var(--cpd-space-3x); border: 0; border-radius: 8px; background: var(--cpd-color-bg-subtle-secondary); color: var(--cpd-color-icon-primary); cursor: pointer; }.mx_Appbar_content { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; display: -webkit-box; display: -ms-flexbox; display: flex; }.mx_Appbar_roomSummary { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: var(--cpd-space-3x); min-width: 0; padding-inline: var(--cpd-space-3x); }.mx_Appbar_roomSummaryName { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: var(--cpd-font-heading-sm-semibold); color: var(--timeline-text-color); }.mx_AppShell_content { background-color: var(--timeline-background-color); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; min-height: 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--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; /* to match width of the ones on roomlist */ width: 4px; border-radius: 4px; content: " "; background-color: var(--timeline-text-color); opacity: 0.8; }/* Copyright 2024 New Vector Ltd. Copyright 2023 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_MessagePanel_myReadMarker { height: 0; margin: 0; padding: 0; border: 0; }.mx_MessagePanel_myReadMarker hr { border-top: solid 1px #0dbd8b; border-top: solid 1px var(--accent-color, #0dbd8b); border-bottom: solid 1px #0dbd8b; border-bottom: solid 1px var(--accent-color, #0dbd8b); margin-top: 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; }/* Copyright 2024 New Vector Ltd. Copyright 2020 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_NonUrgentToastContainer { position: absolute; bottom: 30px; left: 28px; z-index: 101; /* same level as other toasts */ }.mx_NonUrgentToastContainer .mx_NonUrgentToastContainer_toast { padding: 10px 12px; border-radius: 8px; width: 320px; font-size: 0.8125rem; margin-top: 8px; /* We don't use variables on the colours because we want it to be the same */ /* in all themes. */ background-color: #17191c; color: #fff; }/* Copyright 2024,2025 New Vector Ltd. Copyright 2021 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_QuickSettingsButton { /* !important override compound */ border-radius: 8px !important; margin: 12px auto 12px; }.mx_QuickSettingsButton svg { fill: #2e2f32; fill: var(--secondary-content, #2e2f32); }.mx_QuickSettingsButton:not(.expanded):hover { /** * override compound default background color when hovered * should disappear when the space panel will be migrated to compound */ background-color: #6f7882 !important; background-color: var(--quaternary-content, #6f7882) !important; color: var(--timeline-text-color); }.mx_QuickSettingsButton:not(.expanded):hover svg { fill: var(--timeline-text-color); }.mx_QuickSettingsButton.expanded { /** * override compound default background color when hovered * should disappear when the space panel will be migrated to compound */ background-color: transparent !important; /* align with settings icon */ margin-left: 21px; margin-right: 8px; width: 100%; }/** * modify internal css of the compound component * dirty but we need to add the label into the indicator icon button **/.mx_QuickSettingsButton.expanded > div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }.mx_QuickSettingsButton.expanded svg { /* align with settings label */ margin-right: 14px; /* required to set the icon width when into a flex container */ width: 24px; -ms-flex-negative: 0; flex-shrink: 0; }.mx_QuickSettingsButton.expanded .mx_QuickSettingsButton_label { /* !important override compound */ color: #2e2f32 !important; color: var(--secondary-content, #2e2f32) !important; }.mx_QuickSettingsButton_ContextMenuWrapper .mx_ContextualMenu { padding: 16px; width: -webkit-max-content; width: -moz-max-content; width: max-content; min-width: 200px; contain: unset; /* let the dropdown paint beyond the context menu */ }.mx_QuickSettingsButton_ContextMenuWrapper .mx_ContextualMenu > div > h2 { font-weight: var(--cpd-font-weight-semibold); font-size: 0.9375rem; line-height: 1.5rem; color: var(--cpd-color-text-secondary); margin: 0 0 16px; }.mx_QuickSettingsButton_ContextMenuWrapper .mx_ContextualMenu .mx_AccessibleButton_hasKind { display: block; margin-top: 4px; }.mx_QuickSettingsButton_ContextMenuWrapper .mx_ContextualMenu > div > h4 { font-weight: var(--cpd-font-weight-semibold); font-size: 0.75rem; line-height: 0.9375rem; text-transform: uppercase; color: var(--cpd-color-text-secondary); margin: 20px 0 12px; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; }.mx_QuickSettingsButton_ContextMenuWrapper .mx_ContextualMenu .mx_QuickSettingsButton_moreOptionsButton { margin-left: var(--cpd-space-7x); font-size: 0.9375rem; line-height: 1.5rem; color: var(--cpd-color-text-primary); position: relative; margin-bottom: 16px; }.mx_QuickSettingsButton_ContextMenuWrapper .mx_ContextualMenu .mx_QuickSettingsButton_option { margin-bottom: var(--cpd-space-3x); }.mx_QuickSettingsButton_ContextMenuWrapper .mx_ContextualMenu .mx_QuickSettingsButton_option label { /* Correctly line up icons and text. */ display: -webkit-box; display: -ms-flexbox; display: flex; }.mx_QuickSettingsButton_ContextMenuWrapper_new_room_list .mx_QuickThemeSwitcher { margin-top: var(--cpd-space-2x); }.mx_QuickSettingsButton_icon { margin-right: var(--cpd-space-1x); color: #2e2f32; color: var(--secondary-content, #2e2f32); width: 18px; height: 18px; margin-top: auto; margin-bottom: auto; }/* Copyright 2024 New Vector Ltd. Copyright 2020 The Matrix.org Foundation C.I.C. Copyright 2015, 2016 OpenMarket Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.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-left: 1px solid var(--cpd-color-gray-400); -webkit-box-sizing: border-box; box-sizing: border-box; height: 100%; contain: strict; background-color: var(--cpd-color-bg-canvas-default); }.mx_RightPanel .mx_RoomView_MessageList { padding: 14px 18px; /* top and bottom is 4px smaller to balance with the padding set above */ }.mx_RightPanel .mx_MemberList, .mx_RightPanel .mx_MemberInfo { -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; }/* Copyright 2024 New Vector Ltd. Copyright 2020 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. *//* Note: this component expects to be contained within a flexbox */.mx_RoomSearch { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; border-radius: 8px; background-color: var(--roomlist-highlights-color); /* keep border thickness consistent to prevent movement */ border: 1px solid transparent; height: 28px; padding: 1px; /* Create a flexbox for the icons (easier to manage) */ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; cursor: pointer; }.mx_RoomSearch .mx_RoomSearch_icon { width: 20px; height: 20px; color: #2e2f32; color: var(--secondary-content, #2e2f32); margin-left: var(--cpd-space-2x); -ms-flex-negative: 0; flex-shrink: 0; }.mx_RoomSearch .mx_RoomSearch_spotlightTriggerText { color: var(--cpd-color-text-secondary); -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; /* the following rules are to match that of a real input field */ overflow: hidden; margin: 9px; font: var(--cpd-font-body-sm-semibold); }.mx_RoomSearch .mx_RoomSearch_shortcutPrompt { border-radius: 6px; background-color: var(--roomlist-highlights-color); padding: 2px 4px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; font-size: 0.75rem; line-height: 0.9375rem; font-family: inherit; font-weight: var(--cpd-font-weight-semibold); color: var(--timeline-text-secondary-color); margin-right: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.mx_RoomSearch.mx_RoomSearch_minimized { height: 32px; min-height: 32px; width: 32px; -webkit-box-sizing: border-box; box-sizing: border-box; }.mx_RoomSearch.mx_RoomSearch_minimized .mx_RoomSearch_icon { margin: 0 auto; padding: 1px; -ms-flex-item-align: center; align-self: center; }.mx_RoomSearch.mx_RoomSearch_minimized .mx_RoomSearch_shortcutPrompt { display: none; }.mx_RoomSearch:hover { background-color: #2e2f32; background-color: var(--tertiary-content, #2e2f32); }.mx_RoomSearch:hover .mx_RoomSearch_spotlightTriggerText { color: var(--timeline-background-color); }.mx_RoomSearch:hover .mx_RoomSearch_shortcutPrompt { background-color: var(--timeline-background-color); color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_RoomSearch:hover .mx_RoomSearch_icon { color: var(--timeline-background-color); }/* Copyright 2024 New Vector Ltd. Copyright 2015, 2016 OpenMarket Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */:root { --RoomView_MessageList-padding: 18px; }.mx_LeftPanel_panel .mx_RoomView_wrapper { height: 100%; }.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 the amount of layers rendered by constraining what actually needs re-layering via css */ 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: relative; }.mx_RoomView .mx_MainSplit { -webkit-box-flex: 1; -ms-flex: 1 1 0px; flex: 1 1 0; }.mx_RoomView .mx_MessageComposer { width: 100%; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; margin-right: 2px; padding-bottom: 1em; }.mx_RoomView_auxPanel_hiddenHighlights { border-bottom: 1px solid var(--roomlist-separator-color); padding: 10px 26px; color: #ff5b55; color: var(--alert, #ff5b55); cursor: pointer; }.mx_RoomView_messagePanel { width: 100%; overflow-y: auto; -webkit-box-flex: 1; -ms-flex: 1 1 0px; flex: 1 1 0; overflow-anchor: none; }.mx_RoomView_messagePanelSearchSpinner { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; background-image: url(../../img/typing-indicator-2x.e13c259.gif); background-position: center 367px; background-size: 25px; background-repeat: no-repeat; position: relative; }.mx_RoomView_messagePanelSearchSpinner svg { color: var(--timeline-text-secondary-color); width: 50px; height: 50px; position: absolute; top: 286px; left: calc(50% - 25px); }.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; container-type: size; container-name: roomview; }.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); margin-right: calc(var(--container-gap-width) / 2); }.mx_RoomView_statusArea { width: 100%; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; max-height: 0px; background-color: var(--timeline-background-color); z-index: 1000; overflow: hidden; -webkit-transition: all 0.2s ease-out; transition: all 0.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 var(--roomlist-separator-color); height: 1px; }.mx_RoomView_messageListWrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; position: relative; }.mx_RoomView_searchResultsPanel .mx_RoomView_messageListWrapper { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }.mx_RoomView_searchResultsPanel .mx_RoomView_messageListWrapper > .mx_RoomView_MessageList > li > ol { list-style-type: none; }.mx_RoomView_searchResultsPanel a { text-decoration: none; color: inherit; }.mx_RoomView_empty { font-size: 0.8125rem; padding: 0 24px; margin-right: 30px; text-align: center; margin-bottom: 80px; /* visually center the content (intentional offset) */ }.mx_RoomView_MessageList { list-style-type: none; padding: 18px; padding: var(--RoomView_MessageList-padding); /* mx_ProfileResizer depends on this value */ 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; }.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; }.mx_RoomView--local .mx_ScrollPanel .mx_RoomView_MessageList { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }.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_MatrixChat_useCompactLayout .mx_RoomView_MessageList { margin-bottom: 4px; }.mx_MatrixChat_useCompactLayout .mx_RoomView_MessageList h2 { margin-top: 6px; }.mx_MatrixChat_useCompactLayout .mx_RoomView_statusAreaBox { min-height: 42px; }/* Copyright 2024 New Vector Ltd. Copyright 2015, 2016 OpenMarket Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_SearchBox { -webkit-box-flex: 1; -ms-flex: 1 1 0px; flex: 1 1 0; min-width: 0; min-height: 36px; /* to avoid jumping when the X to clear shows/hides */ }.mx_SearchBox.mx_SearchBox_blurred:not(:hover) { background-color: transparent; }.mx_SearchBox .mx_SearchBox_closeButton { cursor: pointer; height: 16px; width: 16px; padding: 9px; }.mx_SearchBox .mx_SearchBox_closeButton svg { height: inherit; width: inherit; color: var(--cpd-color-icon-secondary); }/* Copyright 2024,2025 New Vector Ltd. Copyright 2021 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_SpaceRoomView_landing .mx_AccessibleButton_kind_link { font-size: inherit; }.mx_SpaceRoomView_landing .mx_SearchBox { margin: 24px 0 16px; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_noResults { text-align: center; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_noResults > div { font-size: 0.9375rem; line-height: 1.5rem; color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_listHeader { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-flow: wrap; flex-flow: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 12px; font-size: 0.9375rem; line-height: 1.5rem; color: var(--timeline-text-color); margin-bottom: 12px; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_listHeader .mx_SpaceHierarchy_listHeader_header { grid-column-start: 1; font-weight: var(--cpd-font-weight-semibold); margin: 0; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_listHeader .mx_SpaceHierarchy_listHeader_buttons { grid-column-start: 2; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-flow: wrap; flex-flow: wrap; gap: 12px; min-height: 32px; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_listHeader .mx_SpaceHierarchy_listHeader_buttons .mx_AccessibleButton { padding: 4px 12px; font-weight: normal; }.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; /* to account for the 1px border */ }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_error { position: relative; font-weight: var(--cpd-font-weight-semibold); color: #ff5b55; color: var(--alert, #ff5b55); font-size: 0.9375rem; line-height: 1.125rem; 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(../../icons/error-solid.7cb2e4d.svg); background-size: cover; background-repeat: no-repeat; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomCount > h3 { display: inline; font-weight: var(--cpd-font-weight-semibold); font-size: 1.125rem; line-height: 1.375rem; color: var(--timeline-text-color); }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomCount > span { margin-left: 8px; font-size: 0.9375rem; line-height: 1.5rem; color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_subspace_toggle { position: absolute; left: -1px; top: 10px; height: 16px; width: 16px; border-radius: 4px; background-color: var(--timeline-background-color); }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_subspace_toggle svg { width: inherit; height: inherit; color: #2e2f32; color: var(--tertiary-content, #2e2f32); -webkit-transform: rotate(270deg); transform: rotate(270deg); }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_subspace_toggle.mx_SpaceHierarchy_subspace_toggle_shown svg { -webkit-transform: rotate(0deg); transform: rotate(0deg); }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_subspace_children { position: relative; padding-left: 12px; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list { list-style: none; padding: 0; margin: 0; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper { list-style: none; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile { position: relative; padding: 8px 16px; border-radius: 8px; -webkit-box-sizing: border-box; box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 6px 12px; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_roomTile_item { font-weight: var(--cpd-font-weight-semibold); font-size: 0.9375rem; line-height: 1.125rem; display: grid; grid-template-columns: 20px auto; grid-gap: 6px 8px; gap: 6px 8px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; /* wrap action buttons */ }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_roomTile_item .mx_SpaceHierarchy_roomTile_avatar { grid-row: 1; grid-column: 1; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_roomTile_item .mx_SpaceHierarchy_roomTile_name { grid-row: 1; grid-column: 2; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_roomTile_item .mx_SpaceHierarchy_roomTile_name .mx_InfoTooltip, .mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_roomTile_item .mx_SpaceHierarchy_roomTile_name .mx_SpaceHierarchy_roomTile_joined { margin-left: 12px; color: #2e2f32; color: var(--tertiary-content, #2e2f32); font-size: 0.75rem; line-height: 0.9375rem; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_roomTile_item .mx_SpaceHierarchy_roomTile_name .mx_InfoTooltip { display: inline-block; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_roomTile_item .mx_SpaceHierarchy_roomTile_name .mx_SpaceHierarchy_roomTile_joined { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; vertical-align: middle; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_roomTile_item .mx_SpaceHierarchy_roomTile_name .mx_SpaceHierarchy_roomTile_joined svg { width: 20px; height: 20px; color: #0dbd8b; color: var(--accent-color, #0dbd8b); }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_roomTile_item .mx_SpaceHierarchy_roomTile_info { grid-row: 2; grid-column: 2; font: var(--cpd-font-body-md-regular); font-weight: normal; font-weight: initial; line-height: 1.125rem; color: #2e2f32; color: var(--secondary-content, #2e2f32); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_actions { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-column-gap: 12px; -moz-column-gap: 12px; column-gap: 12px; margin-left: auto; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_actions .mx_AccessibleButton { line-height: 1.5rem; padding: 4px 16px; display: inline-block; visibility: hidden; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_actions .mx_AccessibleButton_kind_danger_outline, .mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile .mx_SpaceHierarchy_actions .mx_AccessibleButton_kind_primary_outline { padding: 3px 16px; /* to account for the 1px border */ }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile:hover, .mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile:focus-within { background-color: var(--sidebar-color); }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile:hover .mx_AccessibleButton, .mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile:focus-within .mx_AccessibleButton { visibility: visible; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_list li.mx_SpaceHierarchy_roomTileWrapper .mx_SpaceHierarchy_roomTile.mx_SpaceHierarchy_joining .mx_AccessibleButton { visibility: visible; padding: 4px 18px; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_roomTile::before, .mx_SpaceRoomView_landing .mx_SpaceHierarchy_subspace_children::before { content: ""; position: absolute; background-color: var(--sidebar-color); width: 1px; height: 100%; left: 6px; top: 0; }.mx_SpaceRoomView_landing .mx_SpaceHierarchy_actions .mx_SpaceHierarchy_actionsText { font-weight: normal; font-size: 0.75rem; line-height: 0.9375rem; color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_SpaceRoomView_landing > hr { border: none; height: 1px; background-color: rgb(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 2024 New Vector Ltd. Copyright 2021 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_SpacePanel { --activeBackground-color: var(--roomlist-highlights-color); --activeBorder-color: var(--timeline-text-color); --activeBorder-transparent-gap: 1px; --gutterSize: 14px; --height-nested: 24px; --height-topLevel: 32px; background-color: var(--sidebar-color); -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; padding: 0; margin: 0; position: relative; /* Fix for the blurred avatar-background */ z-index: 1; /* For enhanced visibility under contrast control */ outline: 1px solid transparent; /* Create another flexbox so the Panel fills the container */ 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.collapsed { width: 68px; }.mx_SpacePanel.newUi.mx_SpacePanel_hidden { display: none; }.mx_SpacePanel.newUi { background-color: var(--cpd-color-bg-canvas-default); border-right: 1px solid var(--cpd-color-bg-subtle-primary); }.mx_SpacePanel .mx_SpacePanel_toggleCollapse { position: absolute; width: 18px; height: 18px; border-radius: 50%; background-color: #2e2f32; background-color: var(--tertiary-content, #2e2f32); top: 19px; /* v-align with avatar */ right: -8px; }.mx_SpacePanel .mx_SpacePanel_toggleCollapse svg { height: inherit; width: inherit; display: inline-block; color: var(--timeline-background-color); /* Slight alignment tweak to center the asset */ margin-left: 1px; }.mx_SpacePanel .mx_SpacePanel_toggleCollapse:not(.expanded) { opacity: 0; }.mx_SpacePanel .mx_SpacePanel_toggleCollapse.expanded svg { -webkit-transform: rotate(180deg); transform: rotate(180deg); /* Slight alignment tweak to center the asset */ margin-left: -1px; }.mx_SpacePanel:hover .mx_SpacePanel_toggleCollapse, .mx_SpacePanel .mx_SpacePanel_toggleCollapse:focus-visible { opacity: 1; /* For enhanced visibility under contrast control */ outline: 1px solid transparent; }.mx_SpacePanel ul { margin: 0; list-style: none; padding: 0; }.mx_SpacePanel .mx_SpaceButton_toggleCollapse { cursor: pointer; }.mx_SpacePanel .mx_SpaceItem_dragging .mx_SpaceButton_toggleCollapse { visibility: hidden; }.mx_SpacePanel .mx_SpaceItem { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -ms-flex-flow: wrap; flex-flow: wrap; }.mx_SpacePanel .mx_SpaceItem.mx_SpaceItem_narrow { -ms-flex-item-align: baseline; align-self: baseline; }.mx_SpacePanel .mx_SpaceItem.collapsed > .mx_SpaceButton > .mx_SpaceButton_toggleCollapse { padding: 0 10px; margin: 0 -10px; }.mx_SpacePanel .mx_SpaceItem.collapsed > .mx_SpaceTreeLevel { display: none; }.mx_SpacePanel .mx_SpaceItem_new { position: relative; }.mx_SpacePanel .mx_SpaceItem:not(.hasSubSpaces) > .mx_SpaceButton { margin-left: var(--gutterSize); min-width: 40px; }.mx_SpacePanel .mx_SpaceButton { border-radius: 8px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 4px 4px 4px 0; width: 100%; cursor: pointer; }.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_active:not(.mx_SpaceButton_narrow) .mx_SpaceButton_selectionWrapper { background-color: var(--activeBackground-color); }.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_active.mx_SpaceButton_narrow .mx_SpaceButton_selectionWrapper { padding: var(--activeBorder-transparent-gap); border: 3px var(--activeBorder-color) 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); min-width: 0; }.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_narrow .mx_SpaceButton_selectionWrapper { -webkit-box-flex: initial; -ms-flex: initial; flex: initial; width: 32px; }.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_name { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; margin-left: 8px; white-space: nowrap; display: block; text-overflow: ellipsis; overflow: hidden; font: var(--cpd-font-body-md-regular); }.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_toggleCollapse { height: 20px; width: var(--gutterSize); -ms-flex-negative: 0; flex-shrink: 0; padding: 10px 0; }.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_toggleCollapse svg { width: 20px; height: inherit; display: inline-block; color: #2e2f32; color: var(--tertiary-content, #2e2f32); /* Re-align with parent */ margin-left: -3px; }.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_icon { /* Calculate height excluding padding to allow svg to inherit */ width: calc(var(--height-topLevel) - 14px); height: calc(var(--height-topLevel) - 14px); -ms-flex-negative: 0; flex-shrink: 0; border-radius: 8px; padding: 7px; background-color: var(--roomlist-highlights-color); }.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_icon svg { width: inherit; height: inherit; display: block; color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_new .mx_SpaceButton_icon { background-color: transparent; background-color: initial; }.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_new .mx_SpaceButton_icon svg { color: var(--timeline-text-color); -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; /* TODO transition */ }.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_newCancel .mx_SpaceButton_icon svg { -webkit-transform: rotate(45deg); transform: rotate(45deg); }.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_menuButton { width: 16px; height: 16px; padding: var(--cpd-space-0-5x); -ms-flex-negative: 0; flex-shrink: 0; margin-top: auto; margin-bottom: auto; display: none; position: absolute; right: 4px; }.mx_SpacePanel .mx_SpaceButton .mx_SpaceButton_menuButton svg { width: inherit; height: inherit; display: block; color: var(--timeline-text-color); }.mx_SpacePanel .mx_SpaceTreeLevel { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; max-width: 250px; min-width: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }.mx_SpacePanel .mx_SpaceTreeLevel .mx_SpaceTreeLevel { /* Indent subspaces */ padding-left: 16px; }.mx_SpacePanel .mx_SpaceButton_avatarWrapper { position: relative; line-height: 0; }.mx_SpacePanel .mx_SpacePanel_badgeContainer { /* Create a flexbox to make aligning dot badges easier */ 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; /* centering */ background-clip: padding-box; }.mx_SpacePanel .mx_SpacePanel_badgeContainer .mx_NotificationBadge_dot { /* make the smaller dot occupy the same width for centering */ margin: 0 -1px 0 0; border: 3px solid var(--sidebar-color); }.mx_SpacePanel .mx_SpacePanel_badgeContainer .mx_NotificationBadge_2char, .mx_SpacePanel .mx_SpacePanel_badgeContainer .mx_NotificationBadge_3char { margin: -5px -5px 0 0; border: 2px solid var(--sidebar-color); }.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; }.mx_SpacePanel .mx_SpaceItem:not(.mx_SpaceItem_new) .mx_SpaceButton:hover:not(.mx_SpaceButton_narrow):not(.mx_SpaceButton_invite) .mx_SpaceButton_name, .mx_SpacePanel .mx_SpaceItem:not(.mx_SpaceItem_new) .mx_SpaceButton:focus-within:not(.mx_SpaceButton_narrow):not(.mx_SpaceButton_invite) .mx_SpaceButton_name, .mx_SpacePanel .mx_SpaceItem:not(.mx_SpaceItem_new) .mx_SpaceButton_hasMenuOpen:not(.mx_SpaceButton_narrow):not(.mx_SpaceButton_invite) .mx_SpaceButton_name { max-width: calc(100% - 56px); }/* root space buttons are bigger and not indented */.mx_SpacePanel > .mx_AutoHideScrollbar { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 0 0 16px 0; scrollbar-gutter: stable; }.mx_SpacePanel > .mx_AutoHideScrollbar.mx_IndicatorScrollbar_topOverflow { -webkit-mask-image: linear-gradient(to bottom, transparent, black 16px); mask-image: linear-gradient(to bottom, transparent, black 16px); }.mx_SpacePanel > .mx_AutoHideScrollbar.mx_IndicatorScrollbar_bottomOverflow { -webkit-mask-image: linear-gradient( to top, transparent, rgb(255, 255, 255, 30%) 4px, rgb(255, 255, 255, 55%) 8px, rgb(255, 255, 255, 75%) 12px, black 16px ); mask-image: linear-gradient( to top, transparent, rgb(255, 255, 255, 30%) 4px, rgb(255, 255, 255, 55%) 8px, rgb(255, 255, 255, 75%) 12px, black 16px ); }.mx_SpacePanel > .mx_AutoHideScrollbar.mx_IndicatorScrollbar_topOverflow.mx_IndicatorScrollbar_bottomOverflow { /* This stacks two gradients on top of one another, which lets us have a fixed pixel offset from both top and bottom for the colour stops. Note the top fade is much smaller because the spaces start close to the top, so otherwise a large gradient suddenly appears when you scroll down. */ -webkit-mask-image: linear-gradient(to bottom, transparent, black 16px), linear-gradient( to top, transparent, rgb(255, 255, 255, 30%) 4px, rgb(255, 255, 255, 55%) 8px, rgb(255, 255, 255, 75%) 12px, black 16px ); mask-image: linear-gradient(to bottom, transparent, black 16px), linear-gradient( to top, transparent, rgb(255, 255, 255, 30%) 4px, rgb(255, 255, 255, 55%) 8px, rgb(255, 255, 255, 75%) 12px, black 16px ); -webkit-mask-position: 0% 0%, 0% 100%; mask-position: 0% 0%, 0% 100%; -webkit-mask-size: calc(100% - 10px) 50%, calc(100% - 10px) 50%; mask-size: calc(100% - 10px) 50%, calc(100% - 10px) 50%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; }.mx_SpacePanel .mx_UserMenu { padding-bottom: 12px; border-bottom: 1px solid var(--cpd-color-gray-400); margin: 12px 14px 4px 18px; width: -webkit-min-content; width: -moz-min-content; width: min-content; max-width: 226px; }/* Display the container and img here as block elements so they don't take * up extra vertical space. */.mx_SpacePanel .mx_UserMenu .mx_UserMenu_userAvatar_BaseAvatar { display: block; }.mx_SpacePanel.newUi .mx_UserMenu { margin-top: var(--cpd-space-4x); border-bottom: none; }.mx_SpacePanel_contextMenu { max-width: 360px; }.mx_SpacePanel_contextMenu .mx_SpacePanel_contextMenu_header { margin: 12px 16px 12px; font-weight: var(--cpd-font-weight-semibold); font-size: 0.9375rem; line-height: 1.125rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.mx_SpacePanel_contextMenu .mx_SpacePanel_contextMenu_separatorLabel { color: #2e2f32; color: var(--tertiary-content, #2e2f32); font-size: 0.625rem; line-height: 0.75rem; font-weight: var(--cpd-font-weight-semibold); }.mx_SpacePanel_sharePublicSpace { margin: 0; }.mx_SpacePanel_Tooltip_KeyboardShortcut kbd { font-family: inherit; text-transform: capitalize; }/* Copyright 2025 Element Creations Ltd. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_SpacePillButton { position: relative; padding: 16px 32px 16px 72px; width: 432px; -webkit-box-sizing: border-box; box-sizing: border-box; border-radius: 8px; border: 1px solid #e7e7e7; font-size: 1.0625rem; font-weight: var(--cpd-font-weight-semibold); margin: 20px 0; }.mx_SpacePillButton > div { margin-top: 4px; font-weight: normal; font-size: 0.9375rem; color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_SpacePillButton svg { position: absolute; content: ""; width: 28px; height: 28px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); left: 22px; color: #2e2f32; color: var(--tertiary-content, #2e2f32); }.mx_SpacePillButton:hover { border-color: var(--cpd-color-bg-action-primary-rest); }.mx_SpacePillButton:hover svg { color: var(--cpd-color-icon-primary); }.mx_SpacePillButton:hover > span { color: var(--timeline-text-color); }/* Copyright 2024 New Vector Ltd. Copyright 2021 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_SpaceRoomView { --innerWidth: 428px; overflow-y: auto; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; }.mx_SpaceRoomView .mx_MainSplit > div:first-child { padding: 80px 60px; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-height: 100%; overflow-y: auto; }.mx_SpaceRoomView .mx_MainSplit > div:first-child h1 { margin: 0; font-size: 1.5rem; font-weight: var(--cpd-font-weight-semibold); color: var(--timeline-text-color); width: -webkit-max-content; width: -moz-max-content; width: max-content; }.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_SpaceRoomView_description { font-size: 0.9375rem; color: #2e2f32; color: var(--secondary-content, #2e2f32); margin-top: 12px; margin-bottom: 24px; max-width: var(--innerWidth); }.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_AddExistingToSpace { max-width: var(--innerWidth); }.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_AddExistingToSpace .mx_AddExistingToSpace_content { height: calc(100vh - 360px); max-height: 400px; }.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_SpaceRoomView_buttons { display: block; margin-top: 44px; width: var(--innerWidth); text-align: right; /* button alignment 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; /* override default styles */ }.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_Field { max-width: var(--innerWidth); }.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_Field + .mx_Field { margin-top: 28px; }.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_SpaceRoomView_errorText { font-weight: var(--cpd-font-weight-semibold); font-size: 0.75rem; line-height: 0.9375rem; color: #ff5b55; color: var(--alert, #ff5b55); margin-bottom: 28px; }.mx_SpaceRoomView .mx_MainSplit > div:first-child .mx_AccessibleButton_disabled { cursor: not-allowed; }.mx_SpaceRoomView .mx_SpaceRoomView_landing { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; min-width: 0; }.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_header .mx_BaseAvatar { width: 80px; }.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_name { margin: 24px 0 16px; font-size: 0.9375rem; color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_name > span { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column; flex-flow: column; gap: 12px 0; }.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_name > span h1 { display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%; }.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_name .mx_SpaceRoomView_landing_inviter .mx_BaseAvatar { margin-right: 4px; vertical-align: middle; }.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_infoBar { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; gap: 12px; -ms-flex-wrap: wrap; flex-wrap: wrap; line-height: 1.5rem; }.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_infoBar .mx_SpaceRoomView_landing_infoBar_interactive { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 12px 12px; }.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_infoBar .mx_SpaceRoomView_landing_infoBar_interactive .mx_FacePile { display: inline-block; cursor: pointer; /* For enhanced visibility under contrast control */ outline: 1px solid transparent; }.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_infoBar .mx_SpaceRoomView_landing_infoBar_interactive .mx_SpaceRoomView_landing_inviteButton, .mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_infoBar .mx_SpaceRoomView_landing_infoBar_interactive .mx_SpaceRoomView_landing_settingsButton { position: relative; }.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_infoBar .mx_SpaceRoomView_landing_infoBar_interactive .mx_SpaceRoomView_landing_inviteButton svg, .mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_infoBar .mx_SpaceRoomView_landing_infoBar_interactive .mx_SpaceRoomView_landing_settingsButton svg { position: absolute; }.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_infoBar .mx_SpaceRoomView_landing_infoBar_interactive .mx_SpaceRoomView_landing_inviteButton { padding: 4px 18px 4px 40px; height: -webkit-min-content; height: -moz-min-content; height: min-content; }.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_infoBar .mx_SpaceRoomView_landing_infoBar_interactive .mx_SpaceRoomView_landing_inviteButton svg { left: 8px; height: 16px; width: 16px; color: var(--cpd-color-icon-on-solid-primary); }.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_infoBar .mx_SpaceRoomView_landing_infoBar_interactive .mx_SpaceRoomView_landing_settingsButton { width: 24px; height: 24px; }.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_infoBar .mx_SpaceRoomView_landing_infoBar_interactive .mx_SpaceRoomView_landing_settingsButton svg { left: 0; top: 0; height: 24px; width: 24px; color: #2e2f32; color: var(--tertiary-content, #2e2f32); }.mx_SpaceRoomView .mx_SpaceRoomView_landing .mx_SpaceRoomView_landing_topic { font-size: 0.9375rem; 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_inviteTeammates .mx_SpaceRoomView_inviteTeammates_buttons { color: #2e2f32; color: var(--secondary-content, #2e2f32); 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; /* to center icons */ color: var(--cpd-color-text-primary); font-weight: var(--cpd-font-weight-semibold); text-decoration: underline; }.mx_SpaceRoomView .mx_SpaceRoomView_inviteTeammates .mx_SpaceRoomView_inviteTeammates_buttons .mx_AccessibleButton svg { position: absolute; height: 24px; width: 24px; top: 0; left: 0; color: var(--cpd-color-icon-primary); }.mx_SpaceRoomView .mx_SpaceRoomView_inviteTeammates .mx_SpaceRoomView_inviteTeammates_buttons .mx_AccessibleButton + .mx_AccessibleButton { margin-left: 32px; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_SplashPage { position: relative; height: 100%; }.mx_SplashPage::before { content: ""; display: block; position: absolute; z-index: -1; opacity: 0.6; background-image: radial-gradient( 53.85% 66.75% at 87.55% 0%, hsl(250deg, 76%, 71%, 0.261) 0%, hsl(250deg, 100%, 88%, 0) 100% ), radial-gradient(41.93% 41.93% at 0% 0%, hsl(222deg, 29%, 20%, 0.28) 0%, hsl(250deg, 100%, 88%, 0) 100%), radial-gradient(100% 100% at 0% 0%, hsl(250deg, 100%, 88%, 0.174) 0%, hsl(0deg, 100%, 86%, 0) 100%), radial-gradient(106.35% 96.26% at 100% 0%, hsl(250deg, 100%, 88%, 0.4) 0%, hsl(167deg, 76%, 82%, 0) 100%); /* blur to reduce color banding issues due to alpha-blending multiple gradients */ -webkit-filter: blur(8px); filter: blur(8px); inset: -9px; -webkit-mask: /* mask to dither resulting combined gradient */ url(../../img/noise.8322d5a.png), /* gradient to apply different amounts of dithering to different parts of the gradient */ linear-gradient( to bottom, /* 10% dithering at the top */ rgb(0, 0, 0, 0.9) 20%, /* 80% dithering at the bottom */ rgb(0, 0, 0, 0.2) 100% ); -webkit-mask: /* mask to dither resulting combined gradient */ url(../../img/noise.8322d5a.png), /* gradient to apply different amounts of dithering to different parts of the gradient */ linear-gradient( to bottom, /* 10% dithering at the top */ rgb(0, 0, 0, 0.9) 20%, /* 80% dithering at the bottom */ rgb(0, 0, 0, 0.2) 100% ); mask: /* mask to dither resulting combined gradient */ url(../../img/noise.8322d5a.png), /* gradient to apply different amounts of dithering to different parts of the gradient */ linear-gradient( to bottom, /* 10% dithering at the top */ rgb(0, 0, 0, 0.9) 20%, /* 80% dithering at the bottom */ rgb(0, 0, 0, 0.2) 100% ); mask: /* mask to dither resulting combined gradient */ url(../../img/noise.8322d5a.png), /* gradient to apply different amounts of dithering to different parts of the gradient */ linear-gradient( to bottom, /* 10% dithering at the top */ rgb(0, 0, 0, 0.9) 20%, /* 80% dithering at the bottom */ rgb(0, 0, 0, 0.2) 100% ); }/* Copyright 2024 New Vector Ltd. Copyright 2021 The Matrix.org Foundation C.I.C. Copyright 2019 New Vector Ltd Copyright 2017 Travis Ralston SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_TabbedView { margin: 0; padding: 0 0 0 var(--cpd-space-8x); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; inset: 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: 220px; max-width: 220px; position: fixed; margin: 0; /* Remove the default value */ padding: 0; /* Remove the default value */ }.mx_TabbedView_tabsOnLeft .mx_TabbedView_tabPanel { margin-left: 280px; /* 220px sidebar + 60px padding */ -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }.mx_TabbedView_tabsOnLeft .mx_TabbedView_tabLabel:hover, .mx_TabbedView_tabsOnLeft .mx_TabbedView_tabLabel_active { color: #ffffff; }.mx_TabbedView_tabsOnLeft .mx_TabbedView_tabLabel_active { background-color: var(--cpd-color-bg-subtle-secondary); /* For enhanced visibility under contrast control */ outline: 1px solid transparent; }.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: #2e2f32; color: var(--tertiary-content, #2e2f32); }.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: #0dbd8b; color: var(--accent-color, #0dbd8b); }.mx_TabbedView_tabsOnTop .mx_TabbedView_tabLabel_active .mx_TabbedView_tabLabel_text { color: #0dbd8b; color: var(--accent-color, #0dbd8b); }.mx_TabbedView_tabLabels { color: #45474a; }.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: pointer; padding-block: var(--cpd-space-2x); padding-inline: var(--cpd-space-3x) var(--cpd-space-4x); -webkit-box-sizing: border-box; box-sizing: border-box; min-block-size: 40px; min-inline-size: 40px; border-radius: 24px; font: var(--cpd-font-body-md-medium); position: relative; -webkit-transition: color 0.1s, background-color 0.1s; transition: color 0.1s, background-color 0.1s; }.mx_TabbedView_tabLabel svg { width: 20px; height: 20px; margin-right: var(--cpd-space-3x); }.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; /* firefox */ }.mx_TabbedView_tabPanelContent { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; overflow: auto; min-height: 0; /* firefox */ }/* Hide the labels on tabs, showing only the icons, on narrow viewports. */@media (max-width: 1024px) { .mx_TabbedView_tabsOnLeft.mx_TabbedView_responsive .mx_TabbedView_tabLabel_text { display: none; } .mx_TabbedView_tabsOnLeft.mx_TabbedView_responsive .mx_TabbedView_tabPanel { margin-left: 72px; /* 40px sidebar + 32px padding */ } .mx_TabbedView_tabsOnLeft.mx_TabbedView_responsive .mx_TabbedView_tabLabels { width: auto; } .mx_TabbedView_tabsOnLeft.mx_TabbedView_responsive .mx_TabbedView_tabLabel { padding-inline: 0 0; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .mx_TabbedView_tabsOnLeft.mx_TabbedView_responsive .mx_TabbedView_tabLabel svg { margin-right: 0; } }/* * Copyright 2024 New Vector Ltd. * Copyright 2024 The Matrix.org Foundation C.I.C. * * SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial * Please see LICENSE files in the repository root for full details. */.mx_ThreadsActivityCentre_container { display: -webkit-box; display: -ms-flexbox; display: flex; }.mx_ThreadsActivityCentreButton { /* !important override compound */ border-radius: 8px !important; margin: 18px auto auto auto; }.mx_ThreadsActivityCentreButton.expanded { /** * override compound default background color when hovered * should disappear when the space panel will be migrated to compound */ background-color: transparent !important; /* align with settings icon */ margin-left: 21px; margin-right: 8px; width: 100%; }/** * modify internal css of the compound component * dirty but we need to add the `Threads` label into the indicator icon button **/.mx_ThreadsActivityCentreButton.expanded > div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }.mx_ThreadsActivityCentreButton.expanded > div::before { inline-size: 8px; block-size: 8px; left: 17px; }.mx_ThreadsActivityCentreButton.expanded .mx_ThreadsActivityCentreButton_Icon { /* align with settings label */ margin-right: 14px; /* required to set the icon width when into a flex container */ width: 24px; -ms-flex-negative: 0; flex-shrink: 0; }.mx_ThreadsActivityCentreButton.expanded .mx_ThreadsActivityCentreButton_Text { /* !important override compound */ color: #2e2f32 !important; color: var(--secondary-content, #2e2f32) !important; }.mx_ThreadsActivityCentreButton:not(.expanded):hover, .mx_ThreadsActivityCentreButton:not(.expanded):hover .mx_ThreadsActivityCentreButton_Icon { /* !important override compound */ background-color: #6f7882 !important; background-color: var(--quaternary-content, #6f7882) !important; fill: var(--timeline-text-color); }.mx_ThreadsActivityCentreButton .mx_ThreadsActivityCentreButton_Icon { fill: #2e2f32; fill: var(--secondary-content, #2e2f32); }.mx_ThreadsActivityCentre_rows { overflow-y: scroll; /* Let some space at the top and the bottom of the pop-up */ max-height: calc(100vh - 200px); }.mx_ThreadsActivityCentre_rows .mx_ThreadsActivityCentreRow { height: 48px; }/* Make the label of the MenuItem stay on one line and truncate with ellipsis if needed */.mx_ThreadsActivityCentre_rows .mx_ThreadsActivityCentreRow > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; /* Arbitrary size, keep the TAC as the wanted width */ width: 202px; }.mx_ThreadsActivityCentre_emptyCaption { padding-left: 16px; padding-right: 16px; font-size: 13px; }/* Copyright 2024 New Vector Ltd. Copyright 2019-2021 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_ToastContainer { position: absolute; top: 0; left: 70px; z-index: 101; padding: 4px; display: grid; grid-template-rows: 1fr 14px 6px; }.mx_ToastContainer.mx_ToastContainer_stacked::before { content: ""; margin: 0 4px; grid-row: 2 / 4; grid-column: 1; background-color: #f4f6fa; background-color: var(--system, #f4f6fa); -webkit-box-shadow: 0px 4px 20px rgb(0, 0, 0, 0.5); box-shadow: 0px 4px 20px rgb(0, 0, 0, 0.5); border-radius: 8px; }.mx_ToastContainer .mx_Toast_toast { grid-row: 1 / 3; grid-column: 1; background-color: var(--cpd-color-bg-canvas-default); color: var(--timeline-text-color); -webkit-box-shadow: 0px 4px 24px rgb(0, 0, 0, 0.1); box-shadow: 0px 4px 24px rgb(0, 0, 0, 0.1); border: var(--cpd-border-width-1) solid var(--cpd-color-border-interactive-secondary); border-radius: 12px; 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; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: var(--cpd-space-3x); }.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon svg { width: 22px; height: 22px; grid-column: 1; }.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon .mx_Toast_title { grid-column: 2; }.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon .mx_Toast_body { grid-column: 2 / 4; }.mx_ToastContainer .mx_Toast_toast.mx_Toast_hasIcon .mx_Toast_closebutton { grid-column: 3; }.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 { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-column-gap: 8px; -moz-column-gap: 8px; column-gap: 8px; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; }.mx_ToastContainer .mx_Toast_toast .mx_Toast_title h2 { margin: 0; font: var(--cpd-font-body-lg-semibold); display: inline; width: auto; }.mx_ToastContainer .mx_Toast_toast .mx_Toast_body { grid-column: 1 / 3; grid-row: 2; }.mx_ToastContainer .mx_Toast_toast .mx_Toast_buttons { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-column-gap: 5px; -moz-column-gap: 5px; column-gap: 5px; }.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_description { max-width: 272px; overflow: hidden; text-overflow: ellipsis; margin: 4px 0 11px 0; color: #2e2f32; color: var(--secondary-content, #2e2f32); font: var(--cpd-font-body-sm-regular); }.mx_ToastContainer .mx_Toast_toast .mx_Toast_description a { text-decoration: none; }.mx_ToastContainer .mx_Toast_toast .mx_Toast_deviceID { font-size: 0.625rem; }/* Copyright 2024 New Vector Ltd. Copyright 2015, 2016 , 2021 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_UploadBar { /* line up with the shield area in the composer */ padding: 5px 21px 0; position: relative; display: grid; grid-template: "icon filename cancel" auto "progress progress progress" auto / -webkit-min-content auto -webkit-min-content; grid-template: "icon filename cancel" auto "progress progress progress" auto / min-content auto min-content; grid-gap: var(--cpd-space-1-5x); gap: var(--cpd-space-1-5x); }.mx_UploadBar > svg { grid-area: icon; height: 18px; width: 18px; color: #61708b; align-self: center; }.mx_UploadBar .mx_UploadBar_filename { grid-area: filename; color: #61708b; position: relative; font-size: 0.9375rem; vertical-align: middle; }.mx_UploadBar .mx_UploadBar_cancel { grid-area: cancel; height: 16px; width: 16px; color: #61708b; align-self: center; }.mx_UploadBar .mx_ProgressBar { grid-area: progress; width: 100%; }.mx_ThreadView .mx_UploadBar { padding-left: 0; }/* Copyright 2024 New Vector Ltd. Copyright 2020 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.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_AccessibleButton .mx_UserMenu_userAvatar { position: relative; }.mx_UserMenu .mx_AccessibleButton .mx_UserMenu_userAvatar .mx_BaseAvatar { pointer-events: none; /* makes the avatar non-draggable */ }.mx_UserMenu .mx_UserMenu_contextMenuButton { width: 100%; }.mx_UserMenu .mx_UserMenu_name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: var(--cpd-font-weight-semibold); font-size: 0.9375rem; line-height: 1.5rem; margin-left: 10px; }.mx_IconizedContextMenu.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; /* Create a flexbox to organize the header a bit easier */ 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 { /* Create another flexbox of columns to handle large user IDs */ 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); /* 40px = 32px theme button + 8px margin to theme button */ }.mx_UserMenu_contextMenu .mx_UserMenu_contextMenu_header .mx_UserMenu_contextMenu_name .mx_UserMenu_contextMenu_displayName, .mx_UserMenu_contextMenu .mx_UserMenu_contextMenu_header .mx_UserMenu_contextMenu_name .mx_UserMenu_contextMenu_userId { font: var(--cpd-font-body-lg-regular); /* Automatically grow subelements to fit the container */ -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: 100%; /* Ellipsize text overflow */ 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: var(--cpd-font-weight-semibold); }.mx_UserMenu_contextMenu .mx_UserMenu_contextMenu_header .mx_UserMenu_contextMenu_themeButton { -ms-flex-negative: 0; flex-shrink: 0; margin-left: 8px; /* to make alignment easier, create flexbox for the image */ 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; /* For enhanced visibility under contrast control */ outline: 1px solid transparent; /* Compound overrides to match transitional designs */ padding: var(--cpd-space-2x); }.mx_UserMenu_contextMenu .mx_UserMenu_contextMenu_header .mx_UserMenu_contextMenu_themeButton svg { width: 16px; height: 16px; }.mx_UserMenu_contextMenu .mx_UserMenu_contextMenu_header.mx_UserMenu_contextMenu_guestPrompts { padding-top: 0; display: inline-block; }.mx_UserMenu_contextMenu .mx_UserMenu_contextMenu_header.mx_UserMenu_contextMenu_guestPrompts > span { font-weight: var(--cpd-font-weight-semibold); display: block; }.mx_UserMenu_contextMenu .mx_UserMenu_contextMenu_header.mx_UserMenu_contextMenu_guestPrompts > span + span { margin-top: 8px; }.mx_UserMenu_contextMenu .mx_IconizedContextMenu_icon svg { color: var(--icon-button-color, var(--cpd-color-icon-tertiary)); }/* Copyright 2024 New Vector Ltd. Copyright 2015, 2016 OpenMarket Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_ViewSource pre { font-size: 0.75rem; padding: 0.5em 1em; word-wrap: break-word; white-space: pre-wrap; overflow-wrap: anywhere; }.mx_ViewSource .mx_ViewSource_header { border-bottom: 1px solid #6f7882; border-bottom: 1px solid var(--quinary-content, #6f7882); padding-bottom: 12px; margin-bottom: 12px; font-family: monospace; }.mx_ViewSource .mx_ViewSource_header .mx_CopyableText { word-break: break-all; }.mx_ViewSource .mx_ViewSource_heading { font-size: 1.0625rem; font-weight: 400; color: var(--timeline-text-color); margin-top: 12px; }.mx_ViewSource .mx_ViewSource_details { margin-top: 12px; }.mx_ViewSource .mx_CopyableText_border { -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; }/* Copyright 2024 New Vector Ltd. Copyright 2020 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_CompleteSecurity_header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }.mx_E2EIcon.mx_CompleteSecurity_headerIcon { width: 24px; height: 24px; margin-right: 4px; display: inline-block; }.mx_E2EIcon.mx_CompleteSecurity_heroIcon { width: 128px; height: 128px; margin: 0 auto; }.mx_CompleteSecurity_skip { width: 20px; height: 20px; padding: var(--cpd-space-1x); border-radius: 14px; background-color: var(--cpd-color-bg-subtle-secondary); }.mx_CompleteSecurity_skip:hover { background-color: var(--cpd-color-bg-subtle-primary); }.mx_CompleteSecurity_skip svg { width: inherit; height: inherit; vertical-align: top; color: var(--cpd-color-icon-secondary); }.mx_CompleteSecurity_skip{ position: absolute; right: 24px; }.mx_CompleteSecurity_body { font-size: 0.9375rem; }.mx_CompleteSecurity_waiting { color: #2e2f32; color: var(--tertiary-content, #2e2f32); }.mx_CompleteSecurity_actionRow { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; margin-top: 1.75rem; }.mx_CompleteSecurity_actionRow .mx_AccessibleButton { -webkit-margin-start: 18px; margin-inline-start: 18px; }.mx_CompleteSecurity_actionRow .mx_AccessibleButton.warning { color: #ff5b55; color: var(--alert, #ff5b55); }/* Copyright 2024 New Vector Ltd. Copyright 2019-2023 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_ConfirmSessionLockTheftView { 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_ConfirmSessionLockTheftView_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; }/* Copyright 2019-2024 New Vector Ltd. Copyright 2015, 2016 OpenMarket Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_Login_submit { width: 100%; margin-top: 24px; margin-bottom: 24px; }.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; color: var(--alert, #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; /* Only used here */ }.mx_Login_type_container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: var(--timeline-text-color); }.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 #0dbd8b; border-bottom: 1px dashed var(--accent-color, #0dbd8b); }div.mx_AccessibleButton_kind_link.mx_Login_forgot { display: block; margin-top: 24px; }div.mx_AccessibleButton_kind_link.mx_Login_forgot.mx_AccessibleButton_disabled { cursor: not-allowed; }.mx_Login_spinner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-line-pack: center; align-content: center; padding: 14px; }.mx_Login_fullWidthButton { width: 100%; margin-bottom: 16px; }/* Copyright 2024 New Vector Ltd. Copyright 2015-2024 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_LoginSplashView_migrationProgress { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; height: 100%; }.mx_LoginSplashView_migrationProgress .mx_ProgressBar { height: 8px; width: 600px; border-radius: 8px; }.mx_LoginSplashView_migrationProgress .mx_ProgressBar::-moz-progress-bar { border-radius: 8px; }.mx_LoginSplashView_migrationProgress .mx_ProgressBar::-webkit-progress-bar, .mx_LoginSplashView_migrationProgress .mx_ProgressBar::-webkit-progress-value { border-radius: 8px; }.mx_LoginSplashView_splashButtons { text-align: center; width: 100%; position: absolute; bottom: 30px; }.mx_LoginSplashView_syncError { color: #ffffff; background-color: #df2a8b; /* Only used here */ border-radius: 5px; display: table; padding: 30px; position: absolute; top: 100px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); }/* Copyright 2024 New Vector Ltd. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_MobileRegister_body { padding: 32px; height: 100vh; overflow-y: auto; -webkit-box-sizing: border-box; box-sizing: border-box; }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_Register_mainContent { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; min-height: 270px; }.mx_Register_mainContent p { font: var(--cpd-font-body-md-regular); color: var(--timeline-text-color); }.mx_Register_mainContent p.secondary { color: var(--timeline-text-secondary-color); }.mx_Register_mainContent > img:first-child { margin-bottom: 16px; width: -webkit-max-content; width: -moz-max-content; width: max-content; }.mx_Register_mainContent .mx_Login_submit { margin-bottom: 0; }.mx_Register_footerActions { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding-top: 16px; margin-top: 16px; border-top: 1px solid rgb(141, 151, 165, 0.2); }.mx_Register_footerActions > * { -ms-flex-preferred-size: content; flex-basis: content; }/* Copyright 2024 New Vector Ltd. Copyright 2023 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_SessionLockStolenView h1 { font-weight: var(--cpd-font-weight-semibold); font-size: 2rem; text-align: center; }.mx_SessionLockStolenView h2 { margin: 0; font-weight: 500; font-size: 1.5rem; text-align: center; }/* Copyright 2024 New Vector Ltd. Copyright 2021 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_SetupEncryptionBody { width: 600px; }/* Copyright 2024 New Vector Ltd. Copyright 2021 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_PlayPauseButton { position: relative; width: 32px; height: 32px; min-width: 32px; /* for when the button is used in a flexbox */ min-height: 32px; /* for when the button is used in a flexbox */ border-radius: 32px; background-color: #f4f6fa; background-color: var(--system, #f4f6fa); /* !important override compound icon button */ padding: var(--cpd-space-1-5x) !important; -webkit-box-sizing: border-box; box-sizing: border-box; }.mx_PlayPauseButton svg { width: 20px; height: 20px; }.mx_PlayPauseButton[disabled] svg { opacity: 0.5; }/* Copyright 2024 New Vector Ltd. Copyright 2021, 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. *//* Dev note: there's no actual component called . These classes *//* are shared amongst multiple voice message components. *//* Container for live recording and playback controls */.mx_MediaBody.mx_VoiceMessagePrimaryContainer { /* The waveform (right) has a 1px padding on it that we want to account for, otherwise */ /* inherit from mx_MediaBody */ padding-right: 11px; /* Cheat at alignment a bit */ 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_MediaBody.mx_VoiceMessagePrimaryContainer .mx_RecordingPlayback_timelineLayoutMiddle { min-width: 0; /* Prevent a blowout */ }/* Waveforms are present in live recording only */.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_Waveform { /* default, overridden in JS */ --barHeight: 1; }.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_Waveform .mx_Waveform_bar { background-color: #6f7882; background-color: var(--quaternary-content, #6f7882); height: 100%; -webkit-transform: scaleY(max(0.05, var(--barHeight))); transform: scaleY(max(0.05, var(--barHeight))); }.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_Waveform .mx_Waveform_bar.mx_Waveform_bar_100pct { /* Small animation to remove the mechanical feel of progress */ -webkit-transition: background-color 250ms ease; transition: background-color 250ms ease; background-color: #2e2f32; background-color: var(--secondary-content, #2e2f32); }.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_Clock { width: 2.625rem; /* we're not using a monospace font, so fake it */ min-width: 2.625rem; /* force sensible layouts in awkward flexboxes (file panel, for example) */ padding-right: 6px; /* with the fixed width this ends up as a visual 8px most of the time, as intended. */ padding-left: 8px; /* isolate from recording circle / play control */ }.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_RecordingPlayback_timelineLayoutMiddle { margin-left: 8px; margin-right: 6px; position: relative; display: inline-block; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; height: 30px; }/* same height as mx_Waveform, needed for automatic vertical centering */.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_RecordingPlayback_timelineLayoutMiddle .mx_Waveform { left: 0; top: 0; }.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_RecordingPlayback_timelineLayoutMiddle .mx_SeekBar { position: absolute; left: 0; height: 30px; top: -2px; /* visually vertically centered */ /* Hide the hairline progress bar since we're at 100% height. Need to have distinct rules */ /* because CSS is weird. */ background: none; /* Make the thumb easier to see. Like the SeekBar original styles, these need to be */ /* distinct. We make it transparent so it doesn't show up on the UI, but also larger */ }.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_RecordingPlayback_timelineLayoutMiddle .mx_SeekBar::before { background: none; }.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_RecordingPlayback_timelineLayoutMiddle .mx_SeekBar::-moz-range-progress { background: none; }/* move and drag the thumb regardless of hitting the thumb, however. */.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_RecordingPlayback_timelineLayoutMiddle .mx_SeekBar::-webkit-slider-thumb { width: 10px; height: 10px; background-color: transparent; }/* so it's easier to grab by mouse users in some browsers. Most browsers let the user */.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_RecordingPlayback_timelineLayoutMiddle .mx_SeekBar::-moz-range-thumb { width: 10px; height: 10px; background-color: transparent; }/* For timeline-rendered playback, the clock is on the other side of the waveform. */.mx_MediaBody.mx_VoiceMessagePrimaryContainer .mx_RecordingPlayback_timelineLayoutMiddle + .mx_Clock { text-align: right; /* Take the padding off the clock because it's accounted for by the `timelineLayoutMiddle` */ padding: 0; }/* Copyright 2024 New Vector Ltd. Copyright 2021 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. *//* CSS inspiration from: *//* * https://www.w3schools.com/howto/howto_js_rangeslider.asp *//* * https://stackoverflow.com/a/28283806 *//* * https://css-tricks.com/styling-cross-browser-compatible-range-inputs-css/ */.mx_SeekBar { /* default, overridden in JS */ --fillTo: 1; /* Dev note: we deliberately do not have the -ms-track (and friends) selectors because we don't */ /* need to support IE. */ -webkit-appearance: none; -moz-appearance: none; appearance: none; /* default style override */ width: 100%; height: 1px; background: #6f7882; background: var(--quaternary-content, #6f7882); outline: none; /* remove blue selection border */ position: relative; /* for before+after pseudo elements later on */ cursor: pointer; /* This is for webkit support, but we can't limit the functionality of it to just webkit */ /* browsers. Firefox responds to webkit-prefixed values now, which means we can't use media */ /* Increase clickable area for the slider (approximately same size as browser default) */ /* We do it this way to keep the same padding and margins of the element, avoiding margin math. */ }.mx_SeekBar::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; /* default style override */ /* Dev note: This needs to be duplicated with the -moz-range-thumb selector */ /* because otherwise Edge (webkit) will fail to see the styles and just refuse */ /* to apply them. */ width: 8px; height: 8px; border-radius: 8px; background-color: #2e2f32; background-color: var(--tertiary-content, #2e2f32); cursor: pointer; }.mx_SeekBar::-moz-range-thumb { width: 8px; height: 8px; border-radius: 8px; background-color: #2e2f32; background-color: var(--tertiary-content, #2e2f32); cursor: pointer; /* Firefox adds a border on the thumb */ border: none; }/* in firefox, so it's just wasted CPU/GPU time. */.mx_SeekBar::before { /* ::before to ensure it ends up under the thumb */ content: ""; background-color: #2e2f32; background-color: var(--tertiary-content, #2e2f32); /* Absolute positioning to ensure it overlaps with the existing bar */ position: absolute; top: 0; left: 0; /* Sizing to match the bar */ width: 100%; height: 1px; /* And finally dynamic width without overly hurting the rendering engine. */ -webkit-transform-origin: 0 100%; transform-origin: 0 100%; -webkit-transform: scaleX(var(--fillTo)); transform: scaleX(var(--fillTo)); }/* This is firefox's built-in support for the above, with 100% less hacks. */.mx_SeekBar::-moz-range-progress { background-color: #2e2f32; background-color: var(--tertiary-content, #2e2f32); height: 1px; }/* or support queries to selectively apply the rule. An upside is that this CSS doesn't work */.mx_SeekBar:disabled { opacity: 0.5; }/* Source: https://front-back.com/expand-clickable-areas-for-a-better-touch-experience/ */.mx_SeekBar::after { content: ""; position: absolute; top: -6px; bottom: -6px; left: 0; right: 0; }/* Copyright 2024 New Vector Ltd. Copyright 2021 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_Waveform { position: relative; height: 30px; /* tallest bar can only be 30px */ top: 1px; /* because of our border trick (see below), we're off by 1px of aligntment */ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; /* so the bars grow from the middle */ overflow: hidden; /* this is cheaper than a `max-height: calc(100% - 4px)` in the bar's CSS. */ /* A bar is meant to be a 2x2 circle when at zero height, and otherwise a 2px wide line */ }/* with rounded caps. */.mx_Waveform .mx_Waveform_bar { width: 0; /* 0px width means we'll end up using the border as our width */ border: 1px solid transparent; /* transparent means we'll use the background colour */ border-radius: 2px; /* rounded end caps, based on the border */ min-height: 0; /* like the width, we'll rely on the border to give us height */ max-height: 100%; /* this makes the `height: 42%` work on the element */ margin-left: 1px; /* we want 2px between each bar, so 1px on either side for balance */ margin-right: 1px; /* background color is handled by the parent components */ }/* Copyright 2024 New Vector Ltd. Copyright 2020 The Matrix.org Foundation C.I.C. Copyright 2019 New Vector Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_AuthBody { width: 500px; font-size: 0.75rem; color: var(--timeline-text-secondary-color); background-color: var(--timeline-background-color); border-radius: 0 var(--cpd-space-6x) var(--cpd-space-6x) 0; padding: 25px 60px; -webkit-box-sizing: border-box; box-sizing: border-box; }.mx_AuthBody strong { font-weight: var(--cpd-font-weight-semibold); }.mx_AuthBody.mx_AuthBody_flex { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }.mx_AuthBody h1 { font-size: 1.5rem; font-weight: var(--cpd-font-weight-semibold); margin-top: 8px; color: var(--timeline-text-color); }.mx_AuthBody h2 { font: var(--cpd-font-body-md-semibold); color: var(--timeline-text-secondary-color); }.mx_AuthBody h2.mx_AuthBody_centered { text-align: center; }.mx_AuthBody a:link, .mx_AuthBody a:hover, .mx_AuthBody a:visited { color: #0dbd8b; color: var(--accent-color, #0dbd8b); text-decoration: none; }.mx_AuthBody fieldset { display: block; }.mx_AuthBody .mx_AuthBody_icon { width: 44px; height: 44px; }.mx_AuthBody .mx_AuthBody_lockIcon { color: #2e2f32; color: var(--secondary-content, #2e2f32); height: 32px; width: 32px; }.mx_AuthBody .mx_AuthBody_text { margin-bottom: 48px; margin-top: 0; }.mx_AuthBody input[type="text"], .mx_AuthBody input[type="password"] { color: var(--timeline-text-color); }.mx_AuthBody .mx_Field label { color: var(--timeline-text-secondary-color); }.mx_AuthBody .mx_Field input, .mx_AuthBody .mx_Field select { color: var(--timeline-text-color); background-color: var(--timeline-background-color); }.mx_AuthBody .mx_Field input:not(:-moz-placeholder) + label, .mx_AuthBody .mx_Field textarea:not(:-moz-placeholder) + label { background-color: var(--timeline-background-color); }.mx_AuthBody .mx_Field input:not(:-ms-input-placeholder) + label, .mx_AuthBody .mx_Field textarea:not(:-ms-input-placeholder) + label { background-color: var(--timeline-background-color); }.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 { background-color: var(--timeline-background-color); }.mx_AuthBody input.error { color: #ff5b55; color: var(--alert, #ff5b55); }.mx_AuthBody .mx_Login_submit { height: 32px; margin-top: 16px; }.mx_AuthBody .mx_ErrorMessage { margin-bottom: 12px; margin-top: 2px; }.mx_AuthBody .mx_Field input { -webkit-box-sizing: border-box; box-sizing: border-box; }.mx_AuthBody .mx_Field_select::before { background-color: var(--timeline-text-color); }.mx_AuthBody .mx_Dropdown { color: var(--timeline-text-color); }.mx_AuthBody .mx_Dropdown_arrow { color: var(--timeline-text-color); }.mx_AuthBody .mx_Dropdown_menu { background-color: var(--timeline-background-color); }.mx_AuthBody .mx_Dropdown_menu .mx_Dropdown_option_highlight { background-color: #dddddd; }/* specialisation for password reset views */.mx_AuthBody.mx_AuthBody_forgot-password { font: var(--cpd-font-body-md-regular); color: var(--timeline-text-color); padding: 50px 32px; min-height: 600px; }.mx_AuthBody.mx_AuthBody_forgot-password h1 { margin: 24px 0; }.mx_AuthBody.mx_AuthBody_forgot-password .mx_AuthBody_button-container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }.mx_AuthBody.mx_AuthBody_forgot-password .mx_Login_submit { margin: 0 0 16px; }.mx_AuthBody.mx_AuthBody_forgot-password .mx_AuthBody_text { margin-bottom: 32px; }.mx_AuthBody.mx_AuthBody_forgot-password .mx_AuthBody_text p { margin: 0 0 8px; }.mx_AuthBody.mx_AuthBody_forgot-password .mx_AuthBody_sign-in-instead-button { font-weight: var(--cpd-font-weight-semibold); padding: 4px; }.mx_AuthBody.mx_AuthBody_forgot-password .mx_AuthBody_fieldRow { margin-bottom: 24px; }.mx_AuthBody.mx_AuthBody_forgot-password .mx_AccessibleButton.mx_AccessibleButton_hasKind { background: none; }.mx_AuthBody.mx_AuthBody_forgot-password .mx_AccessibleButton.mx_AccessibleButton_hasKind:disabled { cursor: default; opacity: 0.4; }.mx_AuthBody_did-not-receive { -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #2e2f32; color: var(--secondary-content, #2e2f32); display: -webkit-box; display: -ms-flexbox; display: flex; gap: 8px; }.mx_AuthBody_resend-button { -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-radius: 8px; color: #0dbd8b; color: var(--accent-color, #0dbd8b); display: -webkit-box; display: -ms-flexbox; display: flex; gap: 4px; padding: 4px; }.mx_AuthBody_resend-button:hover { background-color: #f4f6fa; background-color: var(--system, #f4f6fa); }.mx_AuthBody_emailPromptIcon { width: 57px; }.mx_AuthBody_emailPromptIcon--shifted { margin-bottom: -17px; /* Prevent layout jump by relative positioning. */ position: relative; top: -17px; /* This icon is higher than the other icons. Shift up to prevent icon jumping. */ width: 57px; }.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; /* height of the submit button + register link */ padding-top: 28px; text-align: center; }.mx_AuthBody_paddedFooter .mx_AuthBody_paddedFooter_title { margin-top: 16px; font-size: 0.9375rem; line-height: 1.5rem; }.mx_AuthBody_paddedFooter .mx_AuthBody_paddedFooter_title .mx_InlineSpinner svg { vertical-align: sub; margin-right: 5px; }.mx_AuthBody_paddedFooter .mx_AuthBody_paddedFooter_subtitle { margin-top: 8px; font-size: 0.625rem; line-height: 0.875rem; }.mx_AuthBody_changeFlow { display: block; text-align: center; }.mx_AuthBody_changeFlow > a { font-weight: var(--cpd-font-weight-semibold); }.mx_SSOButtons + .mx_AuthBody_changeFlow { margin-top: 24px; }.mx_AuthBody_spinner { margin: 1em 0; }@media only screen and (max-width: 480px) { .mx_AuthBody { border-radius: 4px; width: auto; max-width: 500px; padding: 10px; } }/* Copyright 2019-2024 New Vector Ltd. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_AuthFooter { text-align: center; width: 100%; font: var(--cpd-font-body-md-regular); opacity: 0.72; padding: 20px 0; background: -webkit-gradient(linear, left top, left bottom, from(rgb(0, 0, 0, 0)), to(rgb(0, 0, 0, 0.8))); background: linear-gradient(rgb(0, 0, 0, 0), rgb(0, 0, 0, 0.8)); }.mx_AuthFooter a:link, .mx_AuthFooter a:hover, .mx_AuthFooter a:visited { color: #ffffff; margin: 0 22px; }/* Copyright 2019-2024 New Vector Ltd. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.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-2024 New Vector Ltd. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.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-2024 New Vector Ltd. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_AuthPage { width: 100%; max-width: 100vw; 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: #2e3649; height: 100dvh; overflow-x: hidden; overflow-y: auto; }.mx_AuthPage_modal { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 100%; max-width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; margin: 100px auto auto; padding-inline: var(--cpd-space-4x); border-radius: var(--cpd-space-6x); background-color: var(--timeline-background-color-50pct); }.mx_AuthPage_modal > * { -webkit-box-flex: 1; -ms-flex: 1 1 320px; flex: 1 1 320px; min-width: 0; }@media only screen and (max-height: 768px) {.mx_AuthPage_modal { margin-top: 50px } }@media only screen and (max-width: 480px) {.mx_AuthPage_modal { margin-top: 0; padding-inline: 0; border-radius: 0 } }.mx_AuthPage_modal.mx_AuthPage_modal_withBlur { /* Apply a blurred shadow around the modal */ -webkit-box-shadow: 0 2px 4px 0 rgb(0, 0, 0, 0.33); box-shadow: 0 2px 4px 0 rgb(0, 0, 0, 0.33); }.mx_AuthPage_modal.mx_AuthPage_modal_withBlur .mx_AuthPage_modalContent { /* Make the modal's background semitransparent */ background-color: rgb(255, 255, 255, 0.59); }/* Copyright 2024 New Vector Ltd. Copyright 2020 The Matrix.org Foundation C.I.C. Copyright 2019 New Vector Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_CompleteSecurityBody { color: var(--timeline-text-color); background-color: var(--timeline-background-color); border-radius: 4px; padding: 20px 20px 60px 20px; -webkit-box-sizing: border-box; box-sizing: border-box; }.mx_CompleteSecurityBody h2 { font-size: 1.5rem; font-weight: var(--cpd-font-weight-semibold); margin-top: 0; }.mx_CompleteSecurityBody h3 { font: var(--cpd-font-body-md-semibold); }.mx_CompleteSecurityBody a:link, .mx_CompleteSecurityBody a:hover, .mx_CompleteSecurityBody a:visited { color: #0dbd8b; color: var(--accent-color, #0dbd8b); text-decoration: none; }/* Copyright 2019-2024 New Vector Ltd. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.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 2024 New Vector Ltd. Copyright 2023 The Matrix.org Foundation C.I.C. Copyright 2017 Vector Creations Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_InteractiveAuthEntryComponents .mx_InteractiveAuthEntryComponents_termsSubmit { margin-top: 20px; margin-bottom: 5px; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; /* prevent overflowing */ }.mx_InteractiveAuthEntryComponents_msisdnWrapper { text-align: center; }.mx_InteractiveAuthEntryComponents_msisdnEntry { font-size: 200%; font-weight: bold; border: 1px solid #c7c7c7; border: 1px solid var(--strong-input-border-color, #c7c7c7); border-radius: 3px; width: 6em; }.mx_InteractiveAuthEntryComponents_msisdnEntry:focus { border: 1px solid #0dbd8b; border: 1px solid var(--accent-color, #0dbd8b); }.mx_InteractiveAuthEntryComponents_msisdnSubmit { margin-top: 4px; margin-bottom: 5px; }/* XXX: This should be a common button class */.mx_InteractiveAuthEntryComponents_msisdnSubmit:disabled { background-color: var(--timeline-text-secondary-color); 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; }/* "Resend" button/link */.mx_InteractiveAuthEntryComponents_emailWrapper .mx_AccessibleButton_kind_link_inline { /* We need this to be an inline-block so positioning works correctly */ display: inline-block !important; }/* Spinner as end adornment of the "resend" button/link */.mx_InteractiveAuthEntryComponents_emailWrapper .mx_AccessibleButton_kind_link_inline .mx_Spinner { /* Spinners are usually block elements, but we need it as inline element */ display: -webkit-inline-box !important; display: -ms-inline-flexbox !important; display: inline-flex !important; /* Spinners by default fill all available width, but we don't want that */ width: auto !important; /* We need to center the spinner relative to the button/link */ vertical-align: middle !important; }/* Copyright 2019-2024 New Vector Ltd. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_AuthBody_language { width: 100%; }.mx_AuthBody_language .mx_Dropdown_input { border: none; font: var(--cpd-font-body-md-semibold); color: var(--timeline-text-color); width: auto; }.mx_AuthBody_language .mx_Dropdown_arrow { color: var(--timeline-text-color); }/* Copyright 2024 New Vector Ltd. Copyright 2022 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.mx_LoginWithQRSection p { margin-top: 0; margin-bottom: 16px; }.mx_LoginWithQRSection .mx_AccessibleButton_kind_primary + p { color: var(--cpd-color-text-secondary); margin-top: var(--cpd-space-2x); }.mx_LoginWithQRSection .mx_AccessibleButton svg { margin-right: 12px; }.mx_AuthPage .mx_LoginWithQR .mx_AccessibleButton { display: block !important; }.mx_AuthPage .mx_LoginWithQR .mx_AccessibleButton + .mx_AccessibleButton { margin-top: 8px; }.mx_AuthPage .mx_LoginWithQR{ font-size: 0.9375rem; }.mx_UserSettingsDialog .mx_LoginWithQR { font: var(--cpd-font-body-md-regular); }.mx_UserSettingsDialog .mx_LoginWithQR h1 { font-size: 1.5rem; margin-bottom: 0; }.mx_UserSettingsDialog .mx_LoginWithQR h2 { margin-top: 24px; }.mx_UserSettingsDialog .mx_LoginWithQR .mx_QRCode { margin: 28px 0; }.mx_UserSettingsDialog .mx_LoginWithQR .mx_LoginWithQR_qrWrapper { display: -webkit-box; display: -ms-flexbox; display: flex; }.mx_LoginWithQR { min-height: 350px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }.mx_LoginWithQR h1 > svg.normal { color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_LoginWithQR h1 > svg.error { color: #ff5b55; color: var(--alert, #ff5b55); }.mx_LoginWithQR h1 > svg.success { color: #0dbd8b; color: var(--accent-color, #0dbd8b); }.mx_LoginWithQR h1 > svg{ height: 1.3em; margin-right: 8px; vertical-align: middle; }.mx_LoginWithQR .mx_LoginWithQR_confirmationDigits { text-align: center; margin: 48px auto; font-weight: var(--cpd-font-weight-semibold); font-size: 1.5rem; color: var(--timeline-text-color); }.mx_LoginWithQR .mx_LoginWithQR_confirmationAlert { border: 1px solid #6f7882; border: 1px solid var(--quaternary-content, #6f7882); border-radius: 8px; padding: 8px; line-height: 1.5em; display: -webkit-box; display: -ms-flexbox; display: flex; }.mx_LoginWithQR .mx_LoginWithQR_confirmationAlert svg { height: 30px; }.mx_LoginWithQR .mx_LoginWithQR_separator { margin: 1em 0; }.mx_LoginWithQR ol { -webkit-padding-start: 0; padding-inline-start: 0; list-style: none; }/* list markers do not support the outlined number styling we need */.mx_LoginWithQR ol li { position: relative; padding-left: var(--cpd-space-7x); color: 1px solid var(--cpd-color-text-secondary); margin-bottom: var(--cpd-space-4x); line-height: 20px; text-align: left; text-align: initial; }/* Circled number list item marker */.mx_LoginWithQR ol li::before { content: counter(list-item); position: absolute; left: 0; display: inline-block; width: 20px; height: 20px; line-height: 20px; border-radius: 50%; border: 1px solid var(--cpd-color-text-secondary); -webkit-box-sizing: border-box; box-sizing: border-box; text-align: center; }.mx_LoginWithQR label[for="mx_LoginWithQR_checkCode"] { margin-top: var(--cpd-space-6x); color: var(--cpd-color-text-primary); margin-bottom: var(--cpd-space-1x); }.mx_LoginWithQR .mx_LoginWithQR_icon { width: 56px; height: 56px; border-radius: 8px; -webkit-box-sizing: border-box; box-sizing: border-box; padding: var(--cpd-space-3x); gap: 10px; background-color: var(--cpd-color-bg-subtle-secondary); }.mx_LoginWithQR .mx_LoginWithQR_icon svg { color: var(--cpd-color-icon-secondary); }.mx_LoginWithQR .mx_LoginWithQR_icon.mx_LoginWithQR_icon--success { background-color: var(--cpd-color-bg-success-subtle); }.mx_LoginWithQR .mx_LoginWithQR_icon.mx_LoginWithQR_icon--success svg { color: var(--cpd-color-icon-success-primary); }.mx_LoginWithQR .mx_LoginWithQR_icon.mx_LoginWithQR_icon--critical { background-color: var(--cpd-color-bg-critical-subtle); }.mx_LoginWithQR .mx_LoginWithQR_icon.mx_LoginWithQR_icon--critical svg { color: var(--cpd-color-icon-critical-primary); }.mx_LoginWithQR .mx_LoginWithQR_checkCode_input { margin-bottom: var(--cpd-space-1x); text-align: left; text-align: initial; }.mx_LoginWithQR .mx_LoginWithQR_checkCode_input input { /* Workaround for one of the input rules in _common.pcss being not specific enough */ padding: 0; -webkit-padding-start: calc(40px / 2 - (1ch / 2)); padding-inline-start: calc(40px / 2 - (1ch / 2)); }.mx_LoginWithQR .mx_LoginWithQR_heading { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 12px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }.mx_LoginWithQR .mx_LoginWithQR_BackButton { height: 28px; border-radius: 28px; padding: 4px; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: var(--cpd-color-bg-subtle-secondary); }.mx_LoginWithQR .mx_LoginWithQR_BackButton svg { height: 100%; }.mx_LoginWithQR .mx_LoginWithQR_breadcrumbs { font-size: 0.8125rem; color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_LoginWithQR .mx_LoginWithQR_main { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: var(--timeline-text-color); text-align: center; }.mx_LoginWithQR .mx_LoginWithQR_main p { color: #2e2f32; color: var(--secondary-content, #2e2f32); }.mx_LoginWithQR.mx_LoginWithQR_error .mx_LoginWithQR_main { max-width: 400px; margin: 0 auto; }.mx_LoginWithQR .mx_LoginWithQR_buttons { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 16px; margin-top: var(--cpd-space-6x); }.mx_LoginWithQR .mx_LoginWithQR_buttons .mx_AccessibleButton { width: 300px; height: 48px; -webkit-box-sizing: border-box; box-sizing: border-box; }.mx_LoginWithQR .mx_QRCode { border-radius: 8px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }.mx_LoginWithQR .mx_LoginWithQR_spinner { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; 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%; }/* Copyright 2024 New Vector Ltd. Copyright 2020 The Matrix.org Foundation C.I.C. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */progress.mx_PassphraseField_progress { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 100%; border: 0; height: 4px; position: absolute; top: -10px; left: 0; 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; color: var(--alert, #ff5b55); }progress.mx_PassphraseField_progress::-moz-progress-bar { background-color: #ff5b55; background-color: var(--alert, #ff5b55); }progress.mx_PassphraseField_progress::-webkit-progress-value { background-color: #ff5b55; background-color: var(--alert, #ff5b55); }progress.mx_PassphraseField_progress[value="2"], progress.mx_PassphraseField_progress[value="3"] { color: var(--cpd-color-text-decorative-5); }progress.mx_PassphraseField_progress[value="2"]::-moz-progress-bar, progress.mx_PassphraseField_progress[value="3"]::-moz-progress-bar { background-color: var(--cpd-color-text-decorative-5); }progress.mx_PassphraseField_progress[value="2"]::-webkit-progress-value, progress.mx_PassphraseField_progress[value="3"]::-webkit-progress-value { background-color: var(--cpd-color-text-decorative-5); }progress.mx_PassphraseField_progress[value="4"] { color: #0dbd8b; color: var(--accent-color, #0dbd8b); }progress.mx_PassphraseField_progress[value="4"]::-moz-progress-bar { background-color: #0dbd8b; background-color: var(--accent-color, #0dbd8b); }progress.mx_PassphraseField_progress[value="4"]::-webkit-progress-value { background-color: #0dbd8b; background-color: var(--accent-color, #0dbd8b); }/* Copyright 2019-2024 New Vector Ltd. SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */.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; }/* Invert image colours in dark mode. */.cpd-theme-dark .mx_WelcomePage_logo { -webkit-filter: invert(1); filter: invert(1); }/* Copyright 2024 New Vector Ltd. Copyright 2015, 2016 OpenMarket Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial Please see LICENSE files in the repository root for full details. */button.mx_BaseAvatar { /*