/*!*******************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/left/NewChatButton.scss ***!
  \*******************************************************************************************************************************************************************************************************/
.NewChatButton {
  position: absolute;
  z-index: var(--z-chat-float-button);
  right: 1rem;
  bottom: 1rem;
  transform: translateY(5rem);
  transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.NewChatButton[dir=rtl] {
  right: auto;
  left: 1rem;
}
body.no-page-transitions .NewChatButton {
  transform: none !important;
  opacity: 0;
  transition: opacity 0.15s;
}
body.no-page-transitions .NewChatButton.revealed {
  opacity: 1;
}
.NewChatButton.revealed {
  transform: translateY(0);
}
.NewChatButton > .Button .icon-new-chat-filled,
.NewChatButton > .Button .icon-close {
  position: absolute;
}
.NewChatButton > .Button:not(.active) .icon-new-chat-filled {
  animation: grow-icon 0.4s ease-out;
}
.NewChatButton > .Button:not(.active) .icon-close {
  animation: hide-icon 0.4s forwards ease-out;
}
.NewChatButton > .Button.active .icon-close {
  animation: grow-icon 0.4s ease-out;
}
.NewChatButton > .Button.active .icon-new-chat-filled {
  animation: hide-icon 0.4s forwards ease-out;
}
/*!***********************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/left/main/ChatFolderTabList.module.scss ***!
  \***********************************************************************************************************************************************************************************************************************/
@layer component.chatFolderTabList {
  .ChatFolderTabList-module__root {
    --fade-mask-height: 2.625rem;
    position: absolute;
    z-index: 10;
    top: 0.25rem;
    inset-inline: 0.5rem;
    transition: opacity var(--layer-transition);
  }
  .ChatFolderTabList-module__hidden {
    pointer-events: none;
    opacity: 0.25;
  }
  .ChatFolderTabList-module__badge {
    flex-shrink: 0;
    min-width: 1.25rem;
    height: 1.25rem;
    margin-inline-start: 0.25rem;
    padding: 0 0.3125rem;
    border-radius: 0.75rem;
    font-size: 0.75rem;
    font-weight: var(--font-weight-medium);
    line-height: 1.25rem;
    color: white;
    text-align: center;
    background: var(--color-gray);
  }
  .ChatFolderTabList-module__badgeActive {
    background: var(--color-primary);
  }
  html.theme-dark .ChatFolderTabList-module__tabList {
    border: 1px solid var(--color-borders);
    box-shadow: none;
  }
}
/*!*****************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/left/ConnectionStatusOverlay.scss ***!
  \*****************************************************************************************************************************************************************************************************************/
.connection-state-wrapper {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 1;
  transition: transform 300ms ease, opacity 300ms ease;
}
.connection-state-wrapper:not(.open) {
  transform: translateY(-3rem);
  opacity: 0;
}
.connection-state-wrapper:not(.shown) {
  display: none;
}

#ConnectionStatusOverlay {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  height: 2.9375rem;
  margin: 0.375rem 0.5rem;
  padding: 0 0.75rem;
  border-radius: var(--border-radius-default);
  background: var(--color-yellow);
}
#ConnectionStatusOverlay.interactive {
  cursor: var(--custom-cursor, pointer);
}
#ConnectionStatusOverlay > .Spinner {
  --spinner-size: 1.75rem;
}
#ConnectionStatusOverlay > .state-text {
  flex: 1;
  margin-inline-start: 1.875rem;
  padding-bottom: 0.0625rem;
  font-size: 0.9375rem;
  font-weight: var(--font-weight-medium);
  color: var(--color-text-lighter);
  white-space: nowrap;
}
#ConnectionStatusOverlay .Transition {
  width: 100%;
  min-width: 0;
}
#ConnectionStatusOverlay .Transition > .Transition_slide {
  display: flex;
  align-items: center;
  width: 100%;
}
@media (max-width: 950px) {
  #ConnectionStatusOverlay > .state-text {
    margin-inline-start: 1.25rem;
  }
}
/*!*************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/left/main/LeftMainHeader.scss ***!
  \*************************************************************************************************************************************************************************************************************/
#LeftMainHeader {
  position: relative;
}
#LeftMainHeader .main-menu {
  width: 2.5rem;
  /* stylelint-disable-next-line plugin/no-low-performance-animation-properties */
  transition: width var(--layer-transition);
}
#LeftMainHeader .DropdownMenuFiller {
  width: 2.5rem;
  height: 2.5rem;
}
#LeftMainHeader .story-file-input {
  display: none;
}
#LeftMainHeader .DropdownMenu.rtl {
  position: absolute;
  transition: var(--slide-transition) transform;
}
#LeftMainHeader .DropdownMenu.rtl.right-aligned {
  transform: translateX(calc(clamp(var(--left-column-min-width), var(--left-column-width), var(--left-column-max-width)) - 4.375rem));
}
#LeftMainHeader .DropdownMenu.rtl.disable-transition {
  transition: none;
}
#LeftMainHeader .animated-menu-icon {
  position: absolute;
}
#LeftMainHeader .animated-menu-icon::before, #LeftMainHeader .animated-menu-icon::after {
  content: "";
  position: absolute;
  left: 0;
}
#LeftMainHeader .animated-menu-icon::before {
  top: -0.3125rem;
}
#LeftMainHeader .animated-menu-icon::after {
  top: 0.3125rem;
}
#LeftMainHeader .animated-menu-icon, #LeftMainHeader .animated-menu-icon::before, #LeftMainHeader .animated-menu-icon::after {
  transform: rotate(0);
  width: 1.125rem;
  height: 0.125rem;
  border-radius: 0.125rem;
  background-color: var(--color-text-secondary);
  transition: transform 0.25s;
}
#LeftMainHeader .animated-menu-icon.state-back {
  transform: rotate(180deg);
}
#LeftMainHeader .animated-menu-icon.state-back::before {
  transform: rotate(45deg) scaleX(0.75) translate(0.375rem, -0.1875rem);
}
#LeftMainHeader .animated-menu-icon.state-back::after {
  transform: rotate(-45deg) scaleX(0.75) translate(0.375rem, 0.1875rem);
}
#LeftMainHeader .animated-menu-icon.no-animation {
  transition: none;
}
#LeftMainHeader .animated-menu-icon.no-animation::before, #LeftMainHeader .animated-menu-icon.no-animation::after {
  transition: none;
}
#LeftMainHeader .hide-menu-button {
  overflow: hidden;
  width: 0;
  visibility: hidden;
}
#LeftMainHeader .hide-menu-button .animated-menu-icon::before {
  transform: rotate(45deg) scaleX(0.75) translate(0.375rem, -0.1875rem);
}
#LeftMainHeader .hide-menu-button .animated-menu-icon::after {
  transform: rotate(-45deg) scaleX(0.75) translate(0.375rem, 0.1875rem);
}
#LeftMainHeader .forum-search-button {
  margin-left: 0.75rem;
}
#LeftMainHeader .SearchInput--no-left-margin {
  margin-left: 0;
}
#LeftMainHeader .MenuItem .Toggle {
  margin-inline-start: auto;
}
#LeftMainHeader .MenuItem.compact .Toggle {
  transform: scale(0.75);
  margin-inline-end: -0.125rem;
}
#LeftMainHeader .MenuItem.compact .Switcher {
  transform: scale(0.75);
}
#LeftMainHeader .extra-spacing {
  position: relative;
  margin-left: 0.5rem;
}
#LeftMainHeader .StatusButton .emoji-status-effect {
  top: 50%;
  left: 50%;
}
#LeftMainHeader .StatusButton .emoji-status {
  --custom-emoji-size: 1.5rem;
  overflow: visible;
  color: var(--color-primary);
}
#LeftMainHeader .StatusButton .StarIcon {
  width: 1.5rem;
  height: 1.5rem;
}
.Transition_slide:not(.Transition_slide-active) #LeftMainHeader .Menu .bubble {
  transition: none !important;
}
#LeftMainHeader .SearchInput {
  transition: opacity var(--layer-transition);
}
#LeftMainHeader .SearchInput--hidden {
  pointer-events: none;
  opacity: 0;
}
#LeftMainHeader .left-search-picker-item {
  padding-right: 0;
  font-weight: var(--font-weight-medium);
  color: var(--color-text-secondary);
}
#LeftMainHeader .left-search-picker-item[dir=rtl] {
  right: -0.125rem;
  left: auto;
}

#LeftMainHeader .account-menu-item,
.Menu.main-menu.in-portal .account-menu-item {
  --custom-emoji-size: 1rem;
}
#LeftMainHeader .account-menu-item-test,
.Menu.main-menu.in-portal .account-menu-item-test {
  position: absolute;
  z-index: 1;
  bottom: 0.0625rem;
  inset-inline-start: 2.875rem;
  font-size: 0.5rem;
  font-weight: var(--font-weight-medium);
  color: var(--color-text-secondary);
}
#LeftMainHeader .account-menu-item .account-avatar,
.Menu.main-menu.in-portal .account-menu-item .account-avatar {
  margin-inline: 0.375rem 1.125rem;
}
#LeftMainHeader .account-menu-item .title,
.Menu.main-menu.in-portal .account-menu-item .title {
  overflow: hidden;
  min-width: 0;
}
#LeftMainHeader .account-menu-item .fullName,
.Menu.main-menu.in-portal .account-menu-item .fullName {
  margin: 0;
  padding-top: 0.1875rem;
  font-size: 1em;
  line-height: 1;
}

#LeftMainHeader .Menu.main-menu .bubble,
.Menu.main-menu.in-portal .bubble {
  overflow-y: auto;
  max-width: 20rem;
  max-height: calc(100 * var(--vh) - 3.75rem);
}
/*!*******************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/left/main/LeftMain.scss ***!
  \*******************************************************************************************************************************************************************************************************/
#LeftColumn-main {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--color-background);
}
#LeftColumn-main > .Transition {
  overflow: hidden;
  flex: 1;
}
#LeftColumn-main .ChatFolders {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 100%;
}
#LeftColumn-main .ChatFolders .tabs-placeholder {
  height: 2.625rem;
  /* stylelint-disable-next-line plugin/no-low-performance-animation-properties */
  transition: height 150ms ease;
}
#LeftColumn-main .ChatFolders .tabs-placeholder:not(.open) {
  height: 0;
}
#LeftColumn-main .ChatFolders--tabs-sidebar-shown .chat-list {
  padding-top: 0;
}
#LeftColumn-main .ChatFolders-content {
  position: relative;
  display: flex;
  flex: 1;
  flex-direction: column;
  min-height: 0;
}
#LeftColumn-main .ChatFolders-content > .Transition {
  overflow: hidden;
  flex: 1;
}
#LeftColumn-main .ChatFolders-content.with-tabs > .Transition {
  margin-top: 2.5rem;
}
#LeftColumn-main .ChatFolders-content.with-tabs .chat-list {
  padding-top: 1.375rem;
}
#LeftColumn-main .ChatFolders > .Transition {
  overflow: hidden;
  flex: 1;
}
#LeftColumn-main .RecentContacts,
#LeftColumn-main .LeftSearch,
#LeftColumn-main .search-content {
  overflow-y: auto;
  height: 100%;
}
#LeftColumn-main .btn-update {
  position: absolute;
  z-index: var(--z-chat-float-button);
  bottom: 1rem;
  left: 50%;
  transform: translateX(-50%);
  margin: 0 auto;
  white-space: nowrap;
}
#LeftColumn-main .btn-update.opacity-transition {
  transition: background-color 0.2s, color 0.2s, opacity 0.15s ease;
}
/*!****************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/left/LeftColumn.scss ***!
  \****************************************************************************************************************************************************************************************************/
#NewChat {
  height: 100%;
}

.left-header {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  height: var(--header-height);
  padding: 0.375rem 0.8125rem 0.5rem 0.8125rem;
  background-color: var(--color-background);
  transition: background-color 150ms;
}
.left-header.secondary {
  background-color: var(--color-background-secondary);
}
.left-header h3 {
  -webkit-user-select: none;
          user-select: none;
  overflow: hidden;
  margin-right: auto;
  margin-bottom: 0;
  margin-left: 1.375rem;
  font-size: 1.25rem;
  font-weight: var(--font-weight-medium);
  text-overflow: ellipsis;
  white-space: nowrap;
}
.left-header .SearchInput {
  margin-left: 0.625rem;
}
.left-header .Button.smaller {
  width: 2.5rem;
  height: 2.5rem;
}
.left-header .Button.smaller + .DropdownMenu {
  margin-left: 0.25rem;
}
body.is-tauri.is-macos #Main:not(.is-fullscreen):not(.folders-sidebar-visible) .left-header:not(#TopicListHeader) {
  padding-left: var(--window-controls-width);
}
@media (max-width: 600px) {
  .left-header {
    padding: 0.5rem;
  }
}
/*!*******************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/middle/ScrollDownButton.module.scss ***!
  \*******************************************************************************************************************************************************************************************************************/
.ScrollDownButton-module__root {
  pointer-events: auto;
  -webkit-user-select: none;
          user-select: none;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: opacity 0.2s ease;
}
.ScrollDownButton-module__root:not(:first-child) {
  margin-top: 0.5rem;
}
@media (max-width: 600px) {
  .ScrollDownButton-module__root:not(:first-child) {
    margin-top: 1rem;
  }
}

.ScrollDownButton-module__button {
  color: var(--color-composer-button);
  box-shadow: 0 1px 2px var(--color-default-shadow);
}
.ScrollDownButton-module__button:hover, .ScrollDownButton-module__button:active, .ScrollDownButton-module__button:focus {
  color: revert-layer;
}
@media (max-width: 600px) {
  .ScrollDownButton-module__button {
    width: 2.875rem;
    height: 2.875rem;
  }
}

.ScrollDownButton-module__icon {
  font-size: 1.75rem;
}

.ScrollDownButton-module__unread-count {
  pointer-events: none;
  position: absolute;
  top: -0.3125rem;
  right: -0.3125rem;
  min-width: 1.5rem;
  height: 1.5rem;
  padding: 0 0.4375rem;
  border: 1px solid var(--color-background);
  border-radius: 0.75rem;
  font-size: 0.875rem;
  font-weight: var(--font-weight-medium);
  line-height: 1.5rem;
  color: white;
  text-align: center;
  background-color: var(--color-active);
}
@media (max-width: 600px) {
  .ScrollDownButton-module__unread-count {
    top: -0.6875rem;
    right: auto;
  }
}
/*!************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/middle/FloatingActionButtons.module.scss ***!
  \************************************************************************************************************************************************************************************************************************/
.FloatingActionButtons-module__root {
  --base-bottom-pos: 5.3125rem;
  --translate-y: 4.5rem;
  --unread-count-button-offset: 3.5rem;
  pointer-events: none;
  position: absolute;
  z-index: var(--z-scroll-down-button);
  right: max(1rem, env(safe-area-inset-right));
  bottom: var(--base-bottom-pos);
  transform: translate(0, var(--translate-y));
  opacity: 0;
  transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.2s ease;
}
body.no-page-transitions .FloatingActionButtons-module__root {
  --translate-y: 0 !important;
  transition: opacity 0.15s;
}
.FloatingActionButtons-module__root.FloatingActionButtons-module__revealed {
  --translate-y: 0;
  opacity: 1;
}
.FloatingActionButtons-module__root.FloatingActionButtons-module__revealed .FloatingActionButtons-module__unread {
  pointer-events: auto;
}
.FloatingActionButtons-module__root.FloatingActionButtons-module__revealed.FloatingActionButtons-module__no-composer.FloatingActionButtons-module__no-extra-shift {
  --translate-y: 4rem;
}
.FloatingActionButtons-module__root.FloatingActionButtons-module__hide-scroll-down {
  --translate-y: var(--unread-count-button-offset);
}
.FloatingActionButtons-module__root.FloatingActionButtons-module__hide-scroll-down .FloatingActionButtons-module__unread {
  pointer-events: none;
  opacity: 0;
}
@media (max-width: 600px) {
  .FloatingActionButtons-module__root {
    right: 0.5rem;
    bottom: 4.5rem;
  }
  body:not(.keyboard-visible) .FloatingActionButtons-module__root {
    bottom: calc(4.5rem + env(safe-area-inset-bottom));
  }
}
@media (max-width: 600px) {
  body.FloatingActionButtons-module__is-symbol-menu-open .FloatingActionButtons-module__root {
    bottom: calc(var(--base-bottom-pos) + var(--symbol-menu-height));
  }
}

.FloatingActionButtons-module__hidden {
  pointer-events: none;
  opacity: 0;
}

.FloatingActionButtons-module__unreadCountButton {
  transition: opacity 0.2s ease, transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.FloatingActionButtons-module__transformDown {
  transform: translateY(var(--unread-count-button-offset));
}

.FloatingActionButtons-module__transformDownDouble {
  transform: translateY(calc(var(--unread-count-button-offset) * 2));
}

.FloatingActionButtons-module__unread {
  pointer-events: none;
}
/*!***************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/middle/FrozenAccountPlaceholder.module.scss ***!
  \***************************************************************************************************************************************************************************************************************************/
.FrozenAccountPlaceholder-module__root {
  cursor: pointer;
}
.FrozenAccountPlaceholder-module__root:hover {
  opacity: 0.85;
}

.FrozenAccountPlaceholder-module__title {
  font-size: 1rem;
  font-weight: var(--font-weight-medium);
  line-height: 1rem;
  color: var(--color-error);
}

.FrozenAccountPlaceholder-module__subtitle {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  line-height: 1rem;
  color: var(--color-text-secondary);
}
/*!*************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/middle/panes/AudioPlayer.scss ***!
  \*************************************************************************************************************************************************************************************************************/
.AudioPlayer {
  display: flex;
  align-items: center;
  margin-left: auto;
}
body.no-page-transitions .AudioPlayer {
  transition: none !important;
}
.AudioPlayer > .Button, .AudioPlayer > .playback-rate-menu {
  flex-shrink: 0;
  margin: 0.125rem;
}
.AudioPlayer .player-button {
  --color-text-secondary: var(--color-primary);
  --color-text-secondary-rgb: var(--color-primary-shade-rgb);
  --color-primary-shade: var(--color-active);
  --color-white: var(--color-background-own);
  margin: 0.125rem;
}
.AudioPlayer .player-button.smaller .icon {
  margin-top: -0.0625rem;
  font-size: 1.625rem;
}
.AudioPlayer .player-button .icon {
  position: absolute;
  margin-top: -0.0625rem;
  font-size: 1.9375rem;
}
.AudioPlayer .player-button .icon.icon-play {
  margin-left: 0.125rem;
}
.AudioPlayer .player-button .icon-play,
.AudioPlayer .player-button .icon-pause {
  transform: scale(1);
  opacity: 1;
  transition: opacity 0.4s, transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.AudioPlayer .player-button.play .icon-pause, .AudioPlayer .player-button.pause .icon-play, .AudioPlayer .player-button.loading .icon-play, .AudioPlayer .player-button.loading .icon-pause {
  transform: scale(0.5);
  opacity: 0;
}
.AudioPlayer .volume-button-wrapper {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.AudioPlayer .volume-button-wrapper .volume-slider-wrapper {
  position: absolute;
  top: 2.625rem;
  width: 8rem;
}
.AudioPlayer .volume-button-wrapper .volume-slider-spacer {
  cursor: var(--custom-cursor, default);
  position: absolute;
  bottom: 0;
  transform: translateY(100%);
  width: 8rem;
  height: 1rem;
  visibility: hidden;
}
.AudioPlayer .volume-button-wrapper:hover .volume-slider-spacer,
.AudioPlayer .volume-button-wrapper .volume-slider-spacer:hover {
  visibility: visible;
}
.AudioPlayer .volume-button-wrapper .volume-slider {
  cursor: var(--custom-cursor, default);
  position: absolute;
  bottom: -1rem;
  transform: translateY(100%);
  width: 8rem;
  padding: 0.75rem;
  border-radius: 0.5rem;
  visibility: hidden;
  opacity: 0;
  background: var(--color-background);
  box-shadow: 0 1px 2px var(--color-default-shadow);
  transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;
}
.AudioPlayer .volume-button-wrapper .volume-slider .RangeSlider {
  margin: 0;
}
.AudioPlayer .volume-button-wrapper .volume-slider .RangeSlider input[type=range] {
  margin-bottom: 0;
}
.AudioPlayer .volume-button-wrapper:hover .volume-slider,
.AudioPlayer .volume-button-wrapper .volume-slider:hover,
.AudioPlayer .volume-button-wrapper .volume-slider-spacer:hover + .volume-slider {
  visibility: visible;
  opacity: 1;
}
.AudioPlayer .playback-wrapper {
  position: relative;
}
.AudioPlayer .playback-backdrop {
  position: absolute;
  z-index: calc(var(--z-menu-backdrop) + 1);
  top: 0;
  right: 0;
  width: 5rem;
  height: 4rem;
}
.AudioPlayer .playback-button.on-top {
  z-index: calc(var(--z-menu-backdrop) + 2);
}
.AudioPlayer .playback-button.applied {
  --color-text-secondary: var(--color-primary);
}
.AudioPlayer .playback-button .playback-button-inner {
  padding: 0.125rem 0.25rem;
  border: 2px solid;
  border-radius: 0.375rem;
  font-size: 0.75rem;
  font-weight: bold;
  font-variant-numeric: tabular-nums;
  transition: 0.15s color ease-out;
}
.AudioPlayer .playback-button .playback-button-inner.small {
  transform: scale(0.83);
}
.AudioPlayer .playback-button .playback-button-inner.tiny {
  transform: scale(0.75);
}
.AudioPlayer-content {
  cursor: var(--custom-cursor, pointer);
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  flex-shrink: 1;
  justify-content: center;
  max-width: 14rem;
  padding: 0 0.5rem;
  border-radius: var(--border-radius-messages-small);
}
.AudioPlayer-content:hover {
  background-color: var(--color-interactive-element-hover);
}
.right-column-shown .AudioPlayer-content {
  max-width: 10rem;
}
.AudioPlayer .AudioPlayer-content .title {
  overflow: hidden;
  display: block;
  margin-top: 0.125rem;
  font-size: 0.875rem !important;
  font-weight: var(--font-weight-medium);
  line-height: 1rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.is-ios .AudioPlayer .AudioPlayer-content .title {
  font-size: 0.9375rem !important;
  line-height: 1.125rem;
}
.AudioPlayer-content .subtitle {
  overflow: hidden;
  margin: 0.125rem 0 0;
  font-size: 0.8125rem !important;
  line-height: 0.9375rem;
  color: var(--color-text-secondary);
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.is-ios .AudioPlayer-content .subtitle {
  font-size: 0.9375rem !important;
  line-height: 1.125rem;
}
@media (min-width: 1440px) {
  .AudioPlayer-content {
    max-width: 24rem;
  }
  .right-column-shown .AudioPlayer-content {
    max-width: 14rem;
  }
}
.AudioPlayer.full-width-player {
  position: absolute;
  top: 0;
  transform: translateY(-100%);
  width: 100%;
  height: 2.875rem;
  padding-top: 0.375rem;
  padding-right: max(0.5rem, env(safe-area-inset-right));
  padding-bottom: 0.375rem;
  padding-left: max(0.75rem, env(safe-area-inset-left));
  background-color: var(--color-background);
  transition: transform var(--slide-transition);
}
.AudioPlayer.full-width-player::before {
  pointer-events: none;
  content: "";
  position: absolute;
  top: -0.1875rem;
  right: 0;
  left: 0;
  display: block;
  height: 0.125rem;
  box-shadow: 0 0.125rem 0.125rem var(--color-light-shadow);
}
.AudioPlayer.full-width-player::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -100%;
  right: 0;
  left: 0;
  height: inherit;
  background-color: inherit;
}
.AudioPlayer.full-width-player .AudioPlayer-content {
  flex-grow: 1;
  max-width: none;
}
.AudioPlayer .playback-rate-menu .bubble {
  min-width: auto;
}
.AudioPlayer .playback-rate-menu .bubble .icon-check, .AudioPlayer .playback-rate-menu .bubble .icon-placeholder {
  margin-right: 0.25rem;
  margin-left: 0.25rem;
}
/*!**************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/middle/PinnedMessageNavigation.module.scss ***!
  \**************************************************************************************************************************************************************************************************************************/
.PinnedMessageNavigation-module__pinned-message-border {
  position: relative;
  overflow: hidden;
  width: 0.125rem;
  min-width: 0.125rem;
  height: 2.25rem;
  margin: 0.125rem 0;
}

.PinnedMessageNavigation-module__pinned-message-border-wrapper-1 {
  width: 0.125rem;
  height: 2.25rem;
  border-radius: 0.0625rem;
  background: var(--color-primary);
}

.PinnedMessageNavigation-module__pinned-message-border-wrapper {
  will-change: transform;
  position: relative;
  background-color: var(--color-primary-opacity-hover);
  transition: transform 0.25s ease-in-out;
}

.PinnedMessageNavigation-module__pinned-message-border-mark {
  will-change: transform;
  position: absolute;
  top: 0;
  left: 0;
  transform: translateY(var(--translate-y));
  width: 0.125rem;
  height: var(--height);
  border-radius: 0.0625rem;
  background: var(--color-primary);
  transition: transform 0.25s ease-in-out;
}
/*!****************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/middle/panes/HeaderPinnedMessage.module.scss ***!
  \****************************************************************************************************************************************************************************************************************************/
.HeaderPinnedMessage-module__root {
  cursor: var(--custom-cursor, default);
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  margin-left: auto;
  background: var(--color-background);
}
.HeaderPinnedMessage-module__root .Button {
  margin-left: 0.25rem;
}
.HeaderPinnedMessage-module__root .Button.tiny {
  margin-right: 0.625rem;
}
body.no-page-transitions .HeaderPinnedMessage-module__root {
  transition: none !important;
}
body.no-page-transitions .HeaderPinnedMessage-module__root .ripple-container {
  display: none;
}
.HeaderPinnedMessage-module__root > .Button {
  flex-shrink: 0;
}

@media (min-width: 1276px) {
  .HeaderPinnedMessage-module__mini {
    transform: translate3d(0, 0, 0);
    transition: opacity 0.15s ease, transform var(--layer-transition);
  }
  body.no-right-column-animations .HeaderPinnedMessage-module__mini {
    transition: opacity 0.15s ease;
  }
  #Main.right-column-open .HeaderPinnedMessage-module__mini {
    transform: translate3d(calc(var(--right-column-width) * -1), 0, 0);
  }
}

.HeaderPinnedMessage-module__fullWidth {
  position: absolute;
  top: 0;
  transform: translateY(-100%);
  width: 100%;
  height: 2.875rem;
  padding-top: 0.375rem;
  padding-right: max(0.5rem, env(safe-area-inset-right));
  padding-bottom: 0.375rem;
  padding-left: max(0.75rem, env(safe-area-inset-left));
  background-color: var(--color-background);
  transition: transform var(--slide-transition);
}
.HeaderPinnedMessage-module__fullWidth::before {
  pointer-events: none;
  content: "";
  position: absolute;
  top: -0.1875rem;
  right: 0;
  left: 0;
  display: block;
  height: 0.125rem;
  box-shadow: 0 0.125rem 0.125rem var(--color-light-shadow);
}
.HeaderPinnedMessage-module__fullWidth::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -100%;
  right: 0;
  left: 0;
  height: inherit;
  background-color: inherit;
}
.HeaderPinnedMessage-module__fullWidth {
  height: 3.5rem;
}
.HeaderPinnedMessage-module__fullWidth .HeaderPinnedMessage-module__pinnedMessage {
  flex: 1;
  margin-top: 0;
  margin-bottom: 0;
}
.HeaderPinnedMessage-module__fullWidth .HeaderPinnedMessage-module__messageText {
  max-width: none !important;
}

.HeaderPinnedMessage-module__loading {
  --spinner-size: 1.5rem;
}

.HeaderPinnedMessage-module__pinListIcon {
  position: absolute;
  transition: 0.25s ease-in-out opacity, 0.25s ease-in-out transform;
}

.HeaderPinnedMessage-module__pinListIconHidden {
  transform: scale(0.6);
  opacity: 0;
}

.HeaderPinnedMessage-module__pinnedMessage {
  cursor: var(--custom-cursor, pointer);
  position: relative;
  z-index: 1;
  overflow: hidden;
  display: flex;
  flex-shrink: 1;
  align-items: center;
  margin-top: -0.25rem;
  margin-bottom: -0.25rem;
  padding: 0.25rem;
  padding-left: 0.375rem;
  border-radius: var(--border-radius-messages-small);
  background-color: var(--color-background);
}
.HeaderPinnedMessage-module__pinnedMessage:hover:not(.HeaderPinnedMessage-module__no-hover) {
  background-color: var(--color-interactive-element-hover);
}

.HeaderPinnedMessage-module__messageTextTransition {
  overflow: hidden;
  width: 100%;
  height: 1.125rem;
}

.HeaderPinnedMessage-module__messageText {
  overflow: hidden;
  flex-grow: 1;
  min-width: 15rem;
  max-width: 15rem;
  margin-top: 0.125rem;
  margin-inline-start: 0.375rem;
  transition: 0.25s ease-in-out transform;
}
.HeaderPinnedMessage-module__messageText.HeaderPinnedMessage-module__withMedia {
  transform: translateX(2.625rem);
  min-width: 12.375rem;
  max-width: 12.375rem;
  margin-right: 2.625rem;
}
.HeaderPinnedMessage-module__messageText.HeaderPinnedMessage-module__withMedia[dir=rtl] {
  transform: translateX(-0.25rem);
}
.HeaderPinnedMessage-module__messageText .emoji-small {
  width: 1rem;
  height: 1rem;
}
@media (min-width: 1440px) and (max-width: 1500px) {
  .HeaderPinnedMessage-module__messageText {
    max-width: 14rem;
  }
}

.HeaderPinnedMessage-module__title {
  height: 1rem;
  margin-bottom: 0.125rem;
  font-size: 0.875rem;
  font-weight: var(--font-weight-medium);
  line-height: 1rem;
  color: var(--color-primary);
  text-align: initial;
  white-space: pre;
}
body.is-ios .HeaderPinnedMessage-module__title {
  font-size: 0.9375rem;
}

.HeaderPinnedMessage-module__summary {
  --custom-emoji-size: 1.125rem;
  overflow: hidden;
  height: 1.125rem;
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.125rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.is-ios .HeaderPinnedMessage-module__summary {
  font-size: 0.9375rem;
}

.HeaderPinnedMessage-module__inlineButton,
.HeaderPinnedMessage-module__inlineButton.Button.tiny {
  overflow: hidden;
  display: block;
  flex-shrink: 1;
  width: auto;
  max-width: 10rem;
  height: 2rem;
  padding: 0 0.75rem;
  border-radius: 1.5rem;
  font-weight: var(--font-weight-medium);
  text-overflow: ellipsis;
  text-transform: none;
  white-space: nowrap;
}

.HeaderPinnedMessage-module__pictogramTransition {
  position: absolute;
  overflow: hidden;
  width: 2.25rem !important;
  height: 2.25rem;
  margin-top: 0.125rem;
  margin-inline-start: 0.5rem;
}

.HeaderPinnedMessage-module__pinnedThumb {
  overflow: hidden;
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  border-radius: 0.25rem;
}
.HeaderPinnedMessage-module__pinnedThumb + .HeaderPinnedMessage-module__messageText {
  max-width: 12rem;
}

@media (max-width: 600px) {
  .HeaderPinnedMessage-module__pinnedMessage {
    flex-grow: 1;
    max-width: unset;
    margin-top: -0.1875rem;
    padding-top: 0;
    padding-bottom: 0;
  }
  .HeaderPinnedMessage-module__pinnedMessage::before {
    top: 0.125rem;
    bottom: 0.125rem;
  }
  .HeaderPinnedMessage-module__pinnedMessage .HeaderPinnedMessage-module__messageText {
    max-width: none;
  }
}
/*!********************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/middle/MiddleHeader.scss ***!
  \********************************************************************************************************************************************************************************************************/
.MiddleHeader {
  position: relative;
  z-index: var(--z-middle-header);
  display: flex;
  flex-shrink: 0;
  align-items: center;
  width: 100%;
  height: var(--header-height);
  padding-top: 0.25rem;
  padding-right: max(0.8125rem, env(safe-area-inset-right));
  padding-bottom: 0.25rem;
  padding-left: max(1.4375rem, env(safe-area-inset-left));
  background: var(--color-background);
}
.MiddleHeader .Transition {
  width: 100%;
  min-width: 0;
}
.MiddleHeader .Transition > .Transition_slide {
  display: flex;
  align-items: center;
  width: 100%;
}
.MiddleHeader .back-button {
  position: relative;
  margin-right: 0.5rem;
  margin-left: -0.5rem;
}
.MiddleHeader .back-button .unread-count {
  pointer-events: none;
  position: absolute;
  top: -0.25rem;
  right: -0.5rem;
  min-width: 1.25rem;
  height: 1.25rem;
  padding: 0 0.375rem;
  border-radius: 0.625rem;
  font-size: 0.75rem;
  font-weight: var(--font-weight-medium);
  line-height: 1.25rem;
  color: white;
  text-align: center;
  background: var(--color-gray);
}
.MiddleHeader .back-button .unread-count.active {
  background: var(--color-primary);
}
@media (max-width: 600px) {
  .MiddleHeader .back-button {
    margin-left: 0;
  }
}
.MiddleHeader .chat-info-wrapper {
  flex-grow: 1;
  min-width: 0;
}
.MiddleHeader .header-tools {
  z-index: 1;
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: flex-end;
  margin-left: auto;
  background-color: var(--color-background);
}
body.no-page-transitions .MiddleHeader .header-tools,
body.no-page-transitions .MiddleHeader .header-tools .AudioPlayer,
body.no-page-transitions .MiddleHeader .header-tools .HeaderActions {
  transition: none !important;
}
body.no-right-column-animations .MiddleHeader .header-tools,
body.no-right-column-animations .MiddleHeader .header-tools .HeaderActions {
  transition: none !important;
}
#Main.right-column-animating .MiddleHeader .header-tools {
  pointer-events: none;
}
@media (min-width: 1276px) {
  .MiddleHeader .header-tools {
    transform: translate3d(0, 0, 0);
    transition: transform var(--layer-transition);
  }
  #Main.right-column-open .MiddleHeader .header-tools {
    transform: translate3d(calc(var(--right-column-width) * -1), 0, 0);
  }
}
.MiddleHeader h3 {
  unicode-bidi: plaintext;
  overflow: hidden;
  margin: 0;
  font-size: 1.125rem;
  font-weight: var(--font-weight-medium);
  line-height: 1.5rem;
  text-overflow: ellipsis;
  white-space: pre;
}
body.is-ios .MiddleHeader h3, body.is-macos .MiddleHeader h3 {
  font-size: 1.0625rem;
  font-weight: var(--font-weight-semibold);
}
@media (max-width: 600px) {
  .MiddleHeader h3 {
    overflow: hidden;
    display: block;
    text-overflow: ellipsis;
  }
}
@media (min-width: 1275px) {
  #Main.right-column-open .MiddleHeader h3 {
    max-width: calc(100% - var(--right-column-width));
  }
}
.MiddleHeader .ChatInfo {
  cursor: var(--custom-cursor, pointer);
  display: flex;
  align-items: center;
  padding: 0.0625rem 0 0.0625rem 0.0625rem;
}
.MiddleHeader .ChatInfo .info {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  justify-content: center;
  min-width: 0;
}
.MiddleHeader .ChatInfo .title {
  --custom-emoji-size: 1.375rem;
  display: flex;
  align-items: center;
}
.MiddleHeader .ChatInfo .title .VerifiedIcon {
  width: 1.25rem;
  height: 1.25rem;
}
.MiddleHeader .ChatInfo .saved-dialog-avatar {
  position: absolute;
}
.MiddleHeader .ChatInfo .overlay-avatar {
  margin-left: 2.125rem;
}
.MiddleHeader .ChatInfo .overlay-avatar .inner {
  outline: 2px solid var(--color-background);
}
.MiddleHeader .ChatInfo .status,
.MiddleHeader .ChatInfo .typing-status {
  unicode-bidi: plaintext;
}
@media (min-width: 1275px) {
  #Main.right-column-open .MiddleHeader .ChatInfo .status,
  #Main.right-column-open .MiddleHeader .ChatInfo .typing-status {
    max-width: calc(100% - var(--right-column-width));
  }
}
.MiddleHeader .ChatInfo .custom-emoji {
  color: var(--color-primary);
}
.MiddleHeader .ChatInfo .story-circle {
  max-width: 2.625rem !important;
  max-height: 2.625rem !important;
}
.MiddleHeader .ChatInfo .message-count-transition {
  height: 1.125rem;
}
@media (max-width: 600px) {
  .MiddleHeader .ChatInfo {
    -webkit-user-select: none;
            user-select: none;
  }
}
.MiddleHeader .ChatInfo .Avatar, .MiddleHeader .topic-header-icon {
  width: 2.5rem !important;
  height: 2.5rem !important;
  margin-right: 0.625rem;
}
.MiddleHeader .topic-header-icon {
  --custom-emoji-size: 2.25rem;
  font-size: 2.25rem;
}
.MiddleHeader .topic-header-icon .emoji-small {
  width: 1.25rem;
  height: 1.25rem;
}
.MiddleHeader .topic-header-icon .topic-icon-letter {
  font-size: 1.25rem;
}
.MiddleHeader .topic-header-icon.general-forum-icon {
  color: var(--color-text-secondary);
}
.MiddleHeader .Avatar {
  font-size: 1.0625rem;
}
.MiddleHeader .status {
  color: var(--color-text-secondary);
}
.MiddleHeader .status.online {
  color: var(--color-primary);
}
.MiddleHeader .status,
.MiddleHeader .typing-status {
  overflow: hidden;
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.125rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.MiddleHeader .status .ellipsis,
.MiddleHeader .typing-status .ellipsis {
  display: inline-flex;
}
.MiddleHeader .status .font-emoji,
.MiddleHeader .typing-status .font-emoji {
  line-height: 1rem;
}
.MiddleHeader .HeaderActions {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: flex-end;
  margin-left: auto;
}
.MiddleHeader .HeaderActions .Button {
  margin-left: 0.25rem;
}
.MiddleHeader .HeaderActions .Button.tiny {
  margin-right: 0.625rem;
}
.MiddleHeader .HeaderActions .toggle-right-pane-button.active {
  color: var(--color-primary);
  opacity: 1;
}
.MiddleHeader .HeaderActions .badge-button {
  position: relative;
  overflow: visible;
}
.MiddleHeader .HeaderActions .badge {
  position: absolute;
  top: 0;
  right: 0;
  flex-shrink: 0;
  min-width: 1rem;
  height: 1rem;
  border-radius: 0.5rem;
  font-size: 0.75rem;
  font-weight: var(--font-weight-medium);
  line-height: 1rem;
  color: white;
  text-align: center;
  background: var(--color-primary);
}
@media (max-width: 925px) {
  body.is-tauri.is-macos #Main:not(.left-column-open):not(.is-fullscreen) .MiddleHeader {
    padding-left: var(--window-controls-width);
  }
  body.is-tauri.is-macos #Main:not(.left-column-open):not(.is-fullscreen) .MiddleHeader .back-button {
    margin-left: -0.5rem;
  }
}
@media (max-width: 600px) {
  .MiddleHeader {
    position: relative;
    padding-right: max(0.5rem, env(safe-area-inset-right));
    padding-left: max(0.5rem, env(safe-area-inset-left));
  }
}

@keyframes fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/*!******************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/middle/panes/BotAdPane.module.scss ***!
  \******************************************************************************************************************************************************************************************************************/
.BotAdPane-module__root {
  position: absolute;
  top: 0;
  transform: translateY(-100%);
  width: 100%;
  height: 2.875rem;
  padding-top: 0.375rem;
  padding-right: max(0.5rem, env(safe-area-inset-right));
  padding-bottom: 0.375rem;
  padding-left: max(0.75rem, env(safe-area-inset-left));
  background-color: var(--color-background);
  transition: transform var(--slide-transition);
}
.BotAdPane-module__root::before {
  pointer-events: none;
  content: "";
  position: absolute;
  top: -0.1875rem;
  right: 0;
  left: 0;
  display: block;
  height: 0.125rem;
  box-shadow: 0 0.125rem 0.125rem var(--color-light-shadow);
}
.BotAdPane-module__root::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -100%;
  right: 0;
  left: 0;
  height: inherit;
  background-color: inherit;
}
.BotAdPane-module__root {
  cursor: var(--custom-cursor, pointer);
  display: flex;
  gap: 0.5rem;
  align-items: center;
  height: auto;
  padding-right: max(1rem, env(safe-area-inset-right));
  padding-left: max(1rem, env(safe-area-inset-left));
  line-height: 1.25;
  transition: background-color 0.2s, transform var(--slide-transition);
}
.BotAdPane-module__root:hover {
  background-color: var(--color-background-selected);
}

.BotAdPane-module__content {
  display: flex;
  flex-grow: 1;
  gap: 0.5rem;
  align-items: center;
  color: var(--color-text);
}

.BotAdPane-module__info {
  display: flex;
  gap: 0.25rem;
  align-items: center;
  color: var(--accent-color);
}

.BotAdPane-module__avatar {
  --radius: 0.25rem;
  flex-shrink: 0;
}

.BotAdPane-module__title, .BotAdPane-module__info {
  font-size: calc(var(--message-text-size, 1rem) - 0.125rem);
  font-weight: var(--font-weight-medium);
  line-height: 1.25rem;
}

.BotAdPane-module__text {
  font-size: 0.8125rem;
}

.BotAdPane-module__aboutAd {
  font-size: 0.6875rem;
}
/*!****************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/middle/panes/BotVerificationPane.module.scss ***!
  \****************************************************************************************************************************************************************************************************************************/
.BotVerificationPane-module__root {
  position: absolute;
  top: 0;
  transform: translateY(-100%);
  width: 100%;
  height: 2.875rem;
  padding-top: 0.375rem;
  padding-right: max(0.5rem, env(safe-area-inset-right));
  padding-bottom: 0.375rem;
  padding-left: max(0.75rem, env(safe-area-inset-left));
  background-color: var(--color-background);
  transition: transform var(--slide-transition);
}
.BotVerificationPane-module__root::before {
  pointer-events: none;
  content: "";
  position: absolute;
  top: -0.1875rem;
  right: 0;
  left: 0;
  display: block;
  height: 0.125rem;
  box-shadow: 0 0.125rem 0.125rem var(--color-light-shadow);
}
.BotVerificationPane-module__root::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -100%;
  right: 0;
  left: 0;
  height: inherit;
  background-color: inherit;
}
.BotVerificationPane-module__root {
  display: flex;
  justify-content: center;
  height: auto;
  padding-inline: 1rem;
  font-size: 0.875rem;
  color: var(--color-text-secondary);
}

.BotVerificationPane-module__icon {
  --custom-emoji-size: 1rem;
  padding-inline-end: 0.125rem;
}
/*!****************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/middle/panes/ChatReportPane.scss ***!
  \****************************************************************************************************************************************************************************************************************/
.ChatReportPane {
  position: absolute;
  top: 0;
  transform: translateY(-100%);
  width: 100%;
  height: 2.875rem;
  padding-top: 0.375rem;
  padding-right: max(0.5rem, env(safe-area-inset-right));
  padding-bottom: 0.375rem;
  padding-left: max(0.75rem, env(safe-area-inset-left));
  background-color: var(--color-background);
  transition: transform var(--slide-transition);
}
.ChatReportPane::before {
  pointer-events: none;
  content: "";
  position: absolute;
  top: -0.1875rem;
  right: 0;
  left: 0;
  display: block;
  height: 0.125rem;
  box-shadow: 0 0.125rem 0.125rem var(--color-light-shadow);
}
.ChatReportPane::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -100%;
  right: 0;
  left: 0;
  height: inherit;
  background-color: inherit;
}
.ChatReportPane {
  display: flex;
  align-items: center;
}
body.no-page-transitions .ChatReportPane .ripple-container {
  display: none;
}
.ChatReportPane--Button {
  flex: 1 1 50%;
  margin-left: 0.25rem;
  white-space: nowrap;
}
.ChatReportPane--Checkbox {
  margin-top: -1rem !important;
}
/*!******************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/middle/panes/PaidMessageChargePane.module.scss ***!
  \******************************************************************************************************************************************************************************************************************************/
.PaidMessageChargePane-module__root {
  position: absolute;
  top: 0;
  transform: translateY(-100%);
  width: 100%;
  height: 2.875rem;
  padding-top: 0.375rem;
  padding-right: max(0.5rem, env(safe-area-inset-right));
  padding-bottom: 0.375rem;
  padding-left: max(0.75rem, env(safe-area-inset-left));
  background-color: var(--color-background);
  transition: transform var(--slide-transition);
}
.PaidMessageChargePane-module__root::before {
  pointer-events: none;
  content: "";
  position: absolute;
  top: -0.1875rem;
  right: 0;
  left: 0;
  display: block;
  height: 0.125rem;
  box-shadow: 0 0.125rem 0.125rem var(--color-light-shadow);
}
.PaidMessageChargePane-module__root::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -100%;
  right: 0;
  left: 0;
  height: inherit;
  background-color: inherit;
}
.PaidMessageChargePane-module__root {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: auto;
  padding-inline: 1rem;
  font-size: 0.875rem;
  color: var(--color-text-secondary);
}

.PaidMessageChargePane-module__message {
  margin-bottom: 0.375rem;
  font-size: 1rem;
}

.PaidMessageChargePane-module__messageStars {
  font-weight: var(--font-weight-medium);
}
/*!********************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/middle/MiddleHeaderPanes.module.scss ***!
  \********************************************************************************************************************************************************************************************************************/
.MiddleHeaderPanes-module__root {
  position: absolute;
  z-index: calc(var(--z-middle-header) - 1);
  top: 3.5rem;
  left: 0;
  width: 100%;
  clip-path: inset(0 0 -100vh 0);
}
.MiddleHeaderPanes-module__root::before {
  pointer-events: none;
  content: "";
  position: absolute;
  z-index: -100;
  top: -2px;
  right: 0;
  left: 0;
  height: 2px;
  box-shadow: 0 2px 2px var(--color-light-shadow);
}
.MiddleHeaderPanes-module__root_withRightColumnAnimation {
  /* stylelint-disable-next-line plugin/no-low-performance-animation-properties */
  transition: width var(--layer-transition);
}
.MiddleHeaderPanes-module__root {
  /* stylelint-disable-next-line plugin/selector-tag-no-without-class */
}
.MiddleHeaderPanes-module__root > div:last-child {
  box-shadow: 0 2px 2px var(--color-light-shadow);
}
@media (min-width: 1276px) {
  #Main.right-column-open .MiddleHeaderPanes-module__root {
    width: calc(100% - var(--right-column-width));
  }
}
/*!********************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/middle/MiddleColumn.scss ***!
  \********************************************************************************************************************************************************************************************************/
#MiddleColumn {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
  min-width: 0;
  height: 100%;
}
#MiddleColumn .messages-layout {
  --slide-transition: 450ms cubic-bezier(0.25, 1, 0.5, 1);
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 100%;
}
#MiddleColumn .messages-layout > .Transition {
  overflow: hidden;
  width: 100%;
  height: 100%;
}
#MiddleColumn .messages-layout > .Transition > .Transition_slide {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#MiddleColumn .Composer .composer-wrapper {
  transform: scaleX(1) translateX(0);
  transition: transform var(--select-transition), border-bottom-right-radius var(--select-transition);
}
#MiddleColumn .Composer .composer-wrapper::before {
  transform: scaleX(-1) translateX(0);
  transition: transform var(--select-transition);
}
body.no-message-composer-animations #MiddleColumn .Composer .composer-wrapper, body.no-message-composer-animations #MiddleColumn .Composer .composer-wrapper::before {
  transition: none !important;
}
#MiddleColumn .Composer .message-input-wrapper, #MiddleColumn .Composer::before {
  opacity: 1;
  transition: opacity var(--select-transition);
}
body.no-message-composer-animations #MiddleColumn .Composer .message-input-wrapper, body.no-message-composer-animations #MiddleColumn .Composer::before {
  transition: none !important;
}
#MiddleColumn .Composer > .Button {
  transform: scale(1);
  opacity: 1;
  /* stylelint-disable plugin/no-low-performance-animation-properties */
  transition: border-radius 0.15s, opacity var(--select-transition), transform var(--select-transition), background-color 0.15s, color 0.15s;
}
body.no-message-composer-animations #MiddleColumn .Composer > .Button {
  transition: none !important;
}
#MiddleColumn .Composer.hover-disabled, #MiddleColumn .Composer:not(.shown) {
  pointer-events: none;
}
#MiddleColumn .Composer:not(.shown) .ComposerEmbeddedMessage {
  height: 0;
}
#MiddleColumn .Composer:not(.shown) .composer-wrapper {
  transform: scaleX(var(--composer-hidden-scale, 1)) translateX(var(--composer-translate-x, 0));
  border-bottom-right-radius: var(--border-radius-messages);
}
#MiddleColumn .Composer:not(.shown) .composer-wrapper::before {
  transform: scaleX(-1) translateX(200%);
}
#MiddleColumn .Composer:not(.shown) #editable-message-text {
  height: var(--base-height) !important;
}
#MiddleColumn .Composer:not(.shown) .message-input-wrapper, #MiddleColumn .Composer:not(.shown)::before {
  opacity: 0;
}
#MiddleColumn .Composer:not(.shown) > .Button {
  transform: scale(0.5);
  opacity: 0 !important;
}
#MiddleColumn .messaging-disabled {
  transform: scaleX(1);
  transition: transform var(--select-transition);
}
#MiddleColumn .messaging-disabled .messaging-disabled-inner span {
  opacity: 1;
  transition: opacity var(--select-transition);
}
body.no-page-transitions #MiddleColumn .messaging-disabled .messaging-disabled-inner span {
  transition: none !important;
}
body.no-page-transitions #MiddleColumn .messaging-disabled {
  transition: none !important;
}
#MiddleColumn .messaging-disabled:not(.shown) {
  pointer-events: none;
  transform: scaleX(var(--composer-hidden-scale, 1));
}
#MiddleColumn .messaging-disabled:not(.shown) .messaging-disabled-inner span {
  opacity: 0;
}
#MiddleColumn .messaging-disabled-inner {
  width: 100%;
  padding: 1rem;
  border-radius: var(--border-radius-messages);
  color: var(--color-text-secondary);
  text-align: center;
  background: var(--color-background);
  box-shadow: 0 1px 2px var(--color-default-shadow);
}
#MiddleColumn .middle-column-footer {
  --base-height: 3rem;
  position: relative;
  z-index: var(--z-middle-footer);
  transform: translate3d(0, 0, 0);
  display: flex;
  align-items: flex-end;
  width: 100%;
  max-width: var(--messages-container-width);
  padding: 0 1rem;
  transition: top 200ms, transform var(--layer-transition);
}
#MiddleColumn .middle-column-footer::before {
  content: "";
  position: absolute;
  top: -0.5625rem;
  right: 0;
  left: 0;
  height: 1px;
  opacity: 0;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 2%, rgba(255, 255, 255, 0.4) 98%, rgba(255, 255, 255, 0) 100%);
  transition: opacity 350ms ease;
}
@media (max-width: 600px) {
  #MiddleColumn .middle-column-footer::before {
    right: -2%;
    left: -2%;
  }
}
body.no-page-transitions #MiddleColumn .middle-column-footer {
  transition: none !important;
}
body.no-right-column-animations #MiddleColumn .middle-column-footer {
  transition: top 200ms !important;
}
#MiddleColumn .middle-column-footer:not(.no-composer) {
  top: 0;
  padding-bottom: 0;
}
@media (max-width: 600px) {
  #MiddleColumn .middle-column-footer:not(.no-composer) {
    padding-bottom: env(safe-area-inset-bottom);
  }
  body.keyboard-visible #MiddleColumn .middle-column-footer:not(.no-composer) {
    top: env(safe-area-inset-bottom);
  }
}
#MiddleColumn .middle-column-footer.with-notch::before {
  opacity: 0.75;
}
html.theme-dark #MiddleColumn .middle-column-footer::before {
  background: var(--action-message-bg);
}
@media (min-width: 1276px) {
  #MiddleColumn .middle-column-footer {
    width: calc(100% - var(--right-column-width));
  }
  #Main.right-column-open #MiddleColumn .middle-column-footer {
    transform: translate3d(calc(var(--right-column-width) / -2), 0, 0);
  }
}
@media (max-width: 600px) {
  #MiddleColumn .middle-column-footer {
    padding: 0 0.5rem;
  }
  body.is-symbol-menu-open #MiddleColumn .middle-column-footer {
    transform: translate3d(0, calc(-1 * (var(--symbol-menu-height))), 0);
  }
}
@media (max-width: 600px) {
  #MiddleColumn {
    overflow: hidden;
  }
}

/* Common styles for message list fade-out shadow */
.Composer,
.MessageSelectToolbar,
.messaging-disabled {
  margin-bottom: 1.25rem;
}
@media (max-width: 600px) {
  .Composer,
  .MessageSelectToolbar,
  .messaging-disabled {
    margin-bottom: 0.5rem;
  }
}

.Composer,
.MessageSelectToolbar,
.composer-button,
.messaging-disabled {
  position: relative;
  display: flex;
  justify-content: center;
  width: 100%;
}

.mask-image-disabled .MessageSelectToolbar-inner,
.mask-image-disabled .composer-button {
  border-radius: var(--border-radius-messages);
  box-shadow: 0 0.25rem 0.5rem 0.125rem var(--color-default-shadow);
}

.mask-image-disabled .messaging-disabled {
  border-radius: var(--border-radius-messages);
}

.middle-column-footer-button-container {
  position: absolute;
  display: flex;
  justify-content: center;
  width: 100%;
  padding-bottom: 1.25rem;
}
.middle-column-footer-button-container .unpin-all-button {
  --button-text-color: var(--color-primary);
}
.middle-column-footer-button-container .unpin-all-button .icon-unpin {
  margin-inline-start: -0.4375rem;
  margin-inline-end: 0.75rem;
  font-size: 1.5rem;
  color: var(--color-text-secondary);
  transition: color 0.15s;
}
.middle-column-footer-button-container .composer-button {
  transform: scaleX(1);
  height: var(--base-height);
  transition: transform var(--select-transition), background-color 0.15s, color 0.15s;
}
.select-mode-active + .middle-column-footer .middle-column-footer-button-container .composer-button {
  transform: scaleX(var(--unpin-hidden-scale));
  box-shadow: none;
}
.middle-column-footer-button-container .open-chat-button {
  --button-text-color: var(--color-primary);
}
.mask-image-disabled .middle-column-footer-button-container::before {
  background: unset;
}
@media (max-width: 600px) {
  .middle-column-footer-button-container {
    margin-left: -0.5rem;
    padding-bottom: calc(0.75rem + env(safe-area-inset-bottom));
  }
}

.resize-handle {
  cursor: ew-resize;
  position: absolute;
  z-index: var(--z-resize-handle);
  top: 0;
  bottom: 0;
  left: 0;
  width: 0.25rem;
}
/*!*********************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/right/AddChatMembers.scss ***!
  \*********************************************************************************************************************************************************************************************************/
.AddChatMembers {
  position: relative;
  overflow: hidden;
  height: 100%;
  padding: 1rem;
  background: var(--color-background-secondary);
}
.AddChatMembers-inner {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 100%;
}
/*!*****************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/common/gift/SavedGift.module.scss ***!
  \*****************************************************************************************************************************************************************************************************************/
.SavedGift-module__root {
  cursor: var(--custom-cursor, pointer);
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  align-items: center;
  min-width: 0;
  padding: 0.625rem;
  padding-top: 0.875rem;
  border-radius: 0.625rem;
  background-color: var(--color-background);
}
.SavedGift-module__root::before {
  pointer-events: none;
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  border-radius: 0.625rem;
  opacity: 0;
  background-color: var(--color-hover-overlay);
}
.SavedGift-module__root:hover::before {
  opacity: 0.75;
}

.SavedGift-module__star {
  font-size: 0.75rem;
}

.SavedGift-module__priceBadge {
  position: absolute;
  bottom: 0.5rem;
  overflow: visible;
  height: 1.5rem;
  margin-top: 0.625rem;
  padding-block: 0.375rem;
  font-size: 0.6875rem;
  font-weight: var(--font-weight-semibold);
  line-height: 1;
  background-color: var(--color-light-shadow);
  -webkit-backdrop-filter: blur(0.5rem);
          backdrop-filter: blur(0.5rem);
}

.SavedGift-module__topIcon {
  position: absolute;
  top: 0.25rem;
  left: 0.25rem;
  color: white;
}

.SavedGift-module__hiddenGift {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  font-size: 1.25rem;
  color: white;
  background-color: var(--color-light-shadow);
  -webkit-backdrop-filter: blur(0.5rem);
          backdrop-filter: blur(0.5rem);
}

.SavedGift-module__radialPattern {
  position: absolute;
  inset: 0;
}

.SavedGift-module__stickerWrapper {
  position: relative;
}
/*!************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/story/MediaStory.module.scss ***!
  \************************************************************************************************************************************************************************************************************/
.MediaStory-module__root {
  position: relative;
  overflow: hidden;
}

.MediaStory-module__wrapper {
  cursor: var(--custom-cursor, pointer);
  overflow: hidden;
  height: 0;
  padding-bottom: 179%;
}

.MediaStory-module__media {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.MediaStory-module__mainIcon {
  font-size: 1.25rem;
  line-height: 0.9375rem;
  vertical-align: -0.1875rem;
}

.MediaStory-module__overlayIcon {
  position: absolute;
  z-index: 1;
  font-size: 0.75rem;
  line-height: 1;
  color: white;
  filter: drop-shadow(0 0 0.25rem black);
}

.MediaStory-module__pinnedIcon {
  top: 0.25rem;
  right: 0.25rem;
}

.MediaStory-module__viewsCount {
  bottom: 0.25rem;
  left: 0.25rem;
  display: flex;
  gap: 0.125rem;
  align-items: center;
}

.MediaStory-module__duration {
  right: 0.25rem;
  bottom: 0.25rem;
}

.MediaStory-module__contextMenu {
  position: relative;
  z-index: var(--z-right-column-menu);
}
/*!******************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/common/AnimatedTabItem.module.scss ***!
  \******************************************************************************************************************************************************************************************************************/
.AnimatedTabItem-module__item {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.375rem 0.75rem;
  font-weight: var(--font-weight-medium);
  white-space: nowrap;
  transition: opacity 0.15s;
}
.AnimatedTabItem-module__item:hover {
  opacity: 0.85;
}

.AnimatedTabItem-module__icon {
  margin-right: 0.375rem;
}
/*!******************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/common/AnimatedTabList.module.scss ***!
  \******************************************************************************************************************************************************************************************************************/
.AnimatedTabList-module__container,
.AnimatedTabList-module__clipPathContainer {
  display: flex;
  flex-shrink: 0;
  flex-wrap: nowrap;
  gap: var(--tab-gap-size, 0.25rem);
  align-items: flex-end;
  justify-content: flex-start;
  padding-inline: 0.5rem;
  font-size: 0.9375rem;
  font-weight: var(--font-weight-medium);
}

.AnimatedTabList-module__container {
  -webkit-user-select: none;
          user-select: none;
  position: relative;
  z-index: 1;
  overflow-x: auto;
  color: var(--color-text-secondary);
  opacity: 0;
  mask-image: linear-gradient(to right, transparent, black 0.5rem, black calc(100% - 0.5rem), transparent);
  transition: background-color 150ms, opacity 150ms;
}
.AnimatedTabList-module__container::-webkit-scrollbar {
  height: 0;
}
.AnimatedTabList-module__container::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0);
  box-shadow: 0 0 1px rgba(255, 255, 255, 0.01);
}
.AnimatedTabList-module__container.AnimatedTabList-module__isVisible {
  opacity: 1;
}

.AnimatedTabList-module__clipPathContainer {
  will-change: clip-path;
  isolation: isolate;
  position: absolute;
  z-index: 3;
  right: 0;
  left: 0;
  contain: layout style paint;
  overflow: hidden;
  width: fit-content;
  color: var(--color-primary);
  background-color: var(--color-interactive-element-hover);
  transition: var(--slide-transition) clip-path;
}
.AnimatedTabList-module__clipPathContainer.AnimatedTabList-module__noAnimation {
  transition: none;
}
/*!******************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/right/gifts/StarGiftCollectionList.module.scss ***!
  \******************************************************************************************************************************************************************************************************************************/
.StarGiftCollectionList-module__tabList {
  margin-inline: 0.5rem;
}
/*!************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/right/stories/StoryAlbumList.module.scss ***!
  \************************************************************************************************************************************************************************************************************************/
.StoryAlbumList-module__tabList {
  margin-inline: 0.5rem;
}
/*!*********************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/right/Profile.module.scss ***!
  \*********************************************************************************************************************************************************************************************************/
.Profile-module__root {
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  height: 100%;
}
.Profile-module__root .FloatingActionButton {
  z-index: 3;
}
.active-vt-rightColumn .Profile-module__root .FloatingActionButton {
  view-transition-name: var(--_vtn);
}
.Profile-module__root .FloatingActionButton.revealed {
  transition-delay: 0.2s;
}

.Profile-module__hidden {
  display: none;
}

.Profile-module__profileInfo {
  background-color: var(--color-background-secondary);
}
.Profile-module__profileInfo .ProfileInfo {
  --profile-info-bg: var(--color-background-secondary);
}
.Profile-module__profileInfo .ChatInfo {
  grid-area: chat_info;
}
.Profile-module__profileInfo .ChatInfo .status.online {
  color: var(--color-primary);
}
.Profile-module__profileInfo .ChatExtra .narrow {
  margin-bottom: 0;
}
.Profile-module__profileInfo .ChatExtra [dir="rtl"] .Switcher {
  margin-right: auto;
  margin-left: 0;
}

.Profile-module__chatExtraBlock {
  margin: 1rem;
  margin-bottom: 0;
  margin-inline-end: max(1rem - var(--scrollbar-width), 0px);
}
.active-vt-rightColumn .Profile-module__chatExtraBlock {
  view-transition-name: var(--_vtn);
}

.Profile-module__sharedMediaTabs {
  --fade-mask-color: var(--color-background-secondary);
  position: sticky;
  z-index: 2;
  top: 1rem;
  margin-top: 1rem;
  padding-inline: 1rem;
  padding-inline-end: max(1rem - var(--scrollbar-width), 0px);
}
.active-vt-rightColumn .Profile-module__sharedMediaTabs {
  view-transition-name: var(--_vtn);
}
.Profile-module__sharedMediaTabs::before {
  pointer-events: none;
  content: "";
  position: absolute;
  z-index: 0;
  top: -1rem;
  left: 0;
  width: 100%;
  height: calc(100% + 1rem);
  background: linear-gradient(to bottom, var(--fade-mask-color, var(--color-background)) 0%, transparent 100%);
  -webkit-backdrop-filter: blur(0.5rem);
          backdrop-filter: blur(0.5rem);
  mask-image: linear-gradient(to bottom, black 65%, transparent 100%);
}
html.theme-dark .Profile-module__sharedMediaTabs::before {
  -webkit-backdrop-filter: blur(1rem);
          backdrop-filter: blur(1rem);
  mask-image: linear-gradient(to bottom, black 85%, transparent 100%);
}

.Profile-module__nothingFoundGifts {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-top: 5rem;
}
.Profile-module__nothingFoundGifts .Profile-module__description {
  unicode-bidi: plaintext;
  margin-block: 1rem;
  font-size: 1rem;
  font-weight: var(--font-weight-medium);
  color: var(--color-text-secondary);
  text-align: center;
}
.Profile-module__nothingFoundGifts .Link {
  font-weight: var(--font-weight-medium);
  color: var(--color-links);
  transition: opacity 0.15s ease-in;
}
.Profile-module__nothingFoundGifts .Link:active, .Profile-module__nothingFoundGifts .Link:hover {
  text-decoration: none;
  opacity: 0.85;
}

.Profile-module__sharedMedia {
  position: relative;
  display: flex;
  flex: 1 0 auto;
  flex-direction: column;
  margin-top: 1rem;
}
.active-vt-rightColumn .Profile-module__sharedMedia {
  view-transition-name: var(--_vtn);
}
.Profile-module__sharedMedia .info .Transition {
  flex-grow: 0;
}
.Profile-module__sharedMedia .Profile-module__sharedMediaIsland {
  overflow: hidden;
  margin: 0 1rem 1rem;
  padding: 0;
  margin-inline-end: max(1rem - var(--scrollbar-width), 0px);
}
.Profile-module__sharedMedia .Profile-module__sharedMediaIsland .ListItem-button {
  border-radius: 1rem;
}
.Profile-module__sharedMedia .Profile-module__sharedMediaIslandContainer {
  display: flex;
  flex-direction: column;
}
.Profile-module__sharedMedia .Profile-module__savedDialogsIsland {
  overflow: clip;
  height: auto;
}
.Profile-module__sharedMedia .Profile-module__savedDialogs {
  overflow: visible !important;
  height: auto !important;
}
.Profile-module__sharedMedia .Profile-module__savedDialogs .Chat {
  position: static;
}

.Profile-module__content {
  transition: transform var(--layer-transition);
}
.Profile-module__content.Profile-module__showContentPanel {
  transform: translateY(3rem);
}
.Profile-module__content.Profile-module__noTransition {
  transition: none;
}
.Profile-module__content.Profile-module__emptyList {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  height: 100%;
  padding-top: 5rem;
}
.Profile-module__content.Profile-module__emptyList .Spinner {
  --spinner-size: 2.75rem;
}
.Profile-module__content.Profile-module__storiesArchiveList, .Profile-module__content.Profile-module__storiesList, .Profile-module__content.Profile-module__mediaList, .Profile-module__content.Profile-module__gifList, .Profile-module__content.Profile-module__previewMediaList, .Profile-module__content.Profile-module__giftsList {
  display: grid;
  grid-auto-rows: 1fr;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.0625rem;
}
.Profile-module__content.Profile-module__storiesArchiveList, .Profile-module__content.Profile-module__storiesList, .Profile-module__content.Profile-module__mediaList, .Profile-module__content.Profile-module__gifList, .Profile-module__content.Profile-module__previewMediaList {
  overflow: hidden;
  margin-inline-start: var(--scrollbar-width);
  border-radius: var(--border-radius-island);
}
.Profile-module__content.Profile-module__giftsList {
  gap: 0.625rem;
  margin-inline-start: var(--scrollbar-width);
  padding-inline-end: max(0.5rem - var(--scrollbar-width), 0px);
}
.Profile-module__content.Profile-module__documentsList {
  padding: 1.25rem;
}
.Profile-module__content.Profile-module__documentsList .File + .File {
  margin-top: 1.25rem;
}
.Profile-module__content.Profile-module__linksList {
  padding: 1.25rem;
}
.Profile-module__content.Profile-module__linksList .ProgressSpinner,
.Profile-module__content.Profile-module__linksList .message-transfer-progress {
  display: none;
}
.Profile-module__content.Profile-module__audioList, .Profile-module__content.Profile-module__voiceList {
  padding: 1.25rem;
}
.Profile-module__content.Profile-module__audioList .Audio .media-loading, .Profile-module__content.Profile-module__voiceList .Audio .media-loading {
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.Profile-module__content.Profile-module__audioList .Audio + .Audio, .Profile-module__content.Profile-module__voiceList .Audio + .Audio {
  margin-top: 1.25rem;
}
.Profile-module__content.Profile-module__similarChannelsList, .Profile-module__content.Profile-module__similarBotsList, .Profile-module__content.Profile-module__commonChatsList, .Profile-module__content.Profile-module__membersList, .Profile-module__content.Profile-module__giftsList {
  padding: 0.5rem;
}
@media (max-width: 600px) {
  .Profile-module__content.Profile-module__similarChannelsList, .Profile-module__content.Profile-module__similarBotsList, .Profile-module__content.Profile-module__commonChatsList, .Profile-module__content.Profile-module__membersList, .Profile-module__content.Profile-module__giftsList {
    padding: 0;
  }
}
.Profile-module__content.Profile-module__similarBotsList .ListItem.blured, .Profile-module__content.Profile-module__similarChannelsList .ListItem.blured {
  filter: opacity(0.8);
}
.Profile-module__content.Profile-module__similarBotsList .Profile-module__showMoreBots,
.Profile-module__content.Profile-module__similarBotsList .Profile-module__showMoreChannels, .Profile-module__content.Profile-module__similarChannelsList .Profile-module__showMoreBots,
.Profile-module__content.Profile-module__similarChannelsList .Profile-module__showMoreChannels {
  z-index: 1;
  width: calc(100% - 1rem);
  margin: 0 auto;
  margin-top: -1.8125rem;
  border-radius: var(--border-radius-default-small);
  box-shadow: -1rem 0 1rem 1rem var(--color-background), -1rem 0 1rem 0.3125rem var(--color-background);
}
.Profile-module__content.Profile-module__similarBotsList .Profile-module__moreSimilar, .Profile-module__content.Profile-module__similarChannelsList .Profile-module__moreSimilar {
  margin-top: 1rem;
  font-size: 0.8125rem;
  text-align: center;
}

.Profile-module__contentCategoriesPanel {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  transition: transform var(--layer-transition), opacity 0.2s ease;
}
.Profile-module__contentCategoriesPanel.Profile-module__hiddenPanel {
  transform: translateY(-100%);
  opacity: 0;
}
.Profile-module__contentCategoriesPanel.Profile-module__noTransition {
  transition: none;
}

.active-vt-profileGifts .Profile-module__savedGift {
  view-transition-name: var(--_vtn);
}
/*!******************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/right/RightHeader.scss ***!
  \******************************************************************************************************************************************************************************************************/
.RightHeader {
  pointer-events: auto;
  display: flex;
  align-items: center;
  height: var(--header-height);
  padding: 0.5rem 0.8125rem;
  background-color: var(--color-background);
  transition: background-color 150ms;
}
.RightHeader.secondary {
  background-color: var(--color-background-secondary);
}
.active-vt-rightColumn .RightHeader {
  view-transition-name: var(--_vtn);
}
.RightHeader .close-button {
  flex-shrink: 0;
}
.RightHeader > .Transition {
  flex: 1;
  height: 100%;
}
.RightHeader > .Transition > .Transition_slide {
  display: flex;
  align-items: center;
}
.RightHeader .title {
  margin-bottom: 0;
  margin-left: 1.1875rem;
  font-size: 1.25rem;
  font-weight: var(--font-weight-medium);
}
.RightHeader .header {
  margin-left: 1.375rem;
}
.RightHeader .header .title {
  margin-left: 0;
  font-size: 1rem;
}
.RightHeader .header .subtitle {
  font-size: 0.875rem;
  color: var(--color-text-secondary);
}
.RightHeader .tools {
  display: flex;
  margin-left: auto;
}
.RightHeader .SearchInput {
  margin-left: 1rem;
}
@media (min-width: 600px) {
  .RightHeader .SearchInput {
    margin-right: 1rem;
  }
}
.RightHeader .DropdownMenu {
  margin-left: auto;
}
@media (max-width: 600px) {
  body.is-tauri.is-macos #Main:not(.is-fullscreen) .RightHeader {
    padding-left: var(--window-controls-width);
  }
}
@media (max-width: 600px) {
  .RightHeader {
    padding: 0.5rem;
  }
}

.active-vt-rightColumn::view-transition-group(.rightHeader) {
  z-index: 10;
}
/*!****************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/right/statistics/BoostStatistics.module.scss ***!
  \****************************************************************************************************************************************************************************************************************************/
.BoostStatistics-module__root {
  overflow-x: hidden;
  overflow-y: scroll;
  padding: 1rem;
  background-color: var(--color-background-secondary);
}

.BoostStatistics-module__noResults {
  padding: 0.75rem 0 0 0;
  font-size: 0.9375rem;
  color: var(--color-text-secondary);
  text-align: center;
}

.BoostStatistics-module__section-header {
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-secondary);
}

.BoostStatistics-module__section {
  padding: 1.5rem;
}

.BoostStatistics-module__user .status {
  overflow: hidden;
}

.BoostStatistics-module__stats {
  margin-bottom: 0;
  padding: 0.75rem 0 0 0;
  border: none;
}

.BoostStatistics-module__down {
  margin-right: 0.5rem;
  font-size: 1.5rem;
}

.BoostStatistics-module__loadMoreSpinner {
  margin-inline-end: 1rem;
}

.BoostStatistics-module__status {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.BoostStatistics-module__info {
  flex-grow: 1;
}

.BoostStatistics-module__month {
  margin: 0;
  color: var(--color-text-secondary);
}

.BoostStatistics-module__quantity {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.BoostStatistics-module__floatingBadge {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-links);
}

.BoostStatistics-module__floatingBadgeButtonColor {
  margin-left: 0.5rem;
  padding: 0 0.5rem 0 0.375rem;
  border-radius: 1rem;
  background-color: var(--color-primary-opacity);
}

.BoostStatistics-module__floatingBadgeWarning {
  color: var(--color-orange);
  background: var(--color-light-coral);
}

.BoostStatistics-module__floatingBadgeButton {
  padding: 0.125rem 0.75rem 0.125rem 0.5625rem;
}

.BoostStatistics-module__floatingBadgeIcon {
  margin-right: 0.125rem;
  font-size: 0.875rem;
}

.BoostStatistics-module__floatingBadgeValue {
  font-size: 0.875rem;
  font-weight: var(--font-weight-medium);
}

.BoostStatistics-module__content {
  padding: 0.5rem 0;
}

.BoostStatistics-module__boostSection {
  display: flex;
  flex-direction: column-reverse;
}

.BoostStatistics-module__giveawayIcon {
  width: 2.75rem;
  height: 2.75rem;
}

.BoostStatistics-module__primaryLink {
  position: relative;
  margin: 0 1rem 0.5rem;
}

.BoostStatistics-module__copy {
  position: absolute;
  z-index: 1;
  top: 50%;
  right: 0.5rem;
  transform: translate(0, -50%);
}
/*!***********************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/right/statistics/MonetizationStatistics.module.scss ***!
  \***********************************************************************************************************************************************************************************************************************************/
.MonetizationStatistics-module__root {
  overflow-x: hidden;
  overflow-y: hidden;
  height: 100%;
  padding: 1rem;
}

.MonetizationStatistics-module__graph {
  margin-bottom: 1rem;
  opacity: 1;
  transition: opacity 0.3s ease;
}
.MonetizationStatistics-module__graph:last-of-type {
  margin-bottom: 0;
}
.MonetizationStatistics-module__graph.MonetizationStatistics-module__hidden {
  margin: 0;
  opacity: 0;
}

.MonetizationStatistics-module__charts {
  display: flex;
  flex-direction: column;
}

.MonetizationStatistics-module__ready {
  overflow-y: scroll !important;
}

.MonetizationStatistics-module__balanceSection {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 1rem;
}

.MonetizationStatistics-module__balanceTitle {
  font-size: 0.9375rem;
  font-weight: var(--font-weight-semibold);
}

.MonetizationStatistics-module__availableReward {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 0.5rem;
  line-height: 1.6875rem;
}

.MonetizationStatistics-module__rewardValue {
  font-size: 1.875rem;
}

.MonetizationStatistics-module__decimalPart {
  font-size: 1.375rem;
}

.MonetizationStatistics-module__integer {
  font-size: 1rem;
}

.MonetizationStatistics-module__decimalUsdPart {
  font-size: 0.6875rem;
}

.MonetizationStatistics-module__toncoinIcon {
  margin-inline: 0 0.5rem;
  font-size: 1.5rem;
  color: var(--color-primary);
}

.MonetizationStatistics-module__textBottom {
  margin-top: 0.5rem;
  font-size: 0.875rem;
  color: var(--color-text-secondary);
}
/*!******************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/right/RightColumn.scss ***!
  \******************************************************************************************************************************************************************************************************/
#RightColumn {
  position: absolute;
  z-index: var(--z-right-column);
  top: 0;
  right: 0;
  transform: translate3d(var(--right-column-width), 0, 0);
  width: var(--right-column-width);
  height: 100%;
  padding-right: env(safe-area-inset-right);
  border-left: 1px solid var(--color-borders);
  background: var(--color-background-secondary);
  transition: transform var(--layer-transition);
}
body.no-page-transitions #RightColumn, body.no-right-column-animations #RightColumn {
  transition: none !important;
}
#RightColumn > .Transition {
  --slide-background-color: var(--color-background-secondary);
  overflow: hidden;
  height: calc(100% - var(--header-height));
}
#RightColumn .panel-content {
  border-top: 1px solid transparent;
  transition: border-top-color 0.2s ease-in-out;
}
#RightColumn .panel-content.scrolled {
  border-top-color: var(--color-borders);
}
#RightColumn .Management .section > .ChatInfo,
#RightColumn .Management > .custom-scroll > .ChatInfo,
#RightColumn .Management > .panel-content > .ChatInfo {
  margin: 1rem 0;
  padding: 0 1.5rem;
  text-align: center;
}
#RightColumn .Management .section > .ChatInfo .Avatar,
#RightColumn .Management > .custom-scroll > .ChatInfo .Avatar,
#RightColumn .Management > .panel-content > .ChatInfo .Avatar {
  margin: 0 auto 0.5rem;
}
#RightColumn .Management .section > .ChatInfo .Avatar.no-photo,
#RightColumn .Management > .custom-scroll > .ChatInfo .Avatar.no-photo,
#RightColumn .Management > .panel-content > .ChatInfo .Avatar.no-photo {
  cursor: var(--custom-cursor, default) !important;
}
#RightColumn .Management .section > .ChatInfo .title,
#RightColumn .Management > .custom-scroll > .ChatInfo .title,
#RightColumn .Management > .panel-content > .ChatInfo .title {
  display: flex;
  align-items: center;
  justify-content: center;
}
#RightColumn .Management .section > .ChatInfo .title h3,
#RightColumn .Management > .custom-scroll > .ChatInfo .title h3,
#RightColumn .Management > .panel-content > .ChatInfo .title h3 {
  font-size: 1.25rem;
  font-weight: var(--font-weight-medium);
  line-height: 2rem;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}
#RightColumn .Management .section > .ChatInfo .title .emoji,
#RightColumn .Management > .custom-scroll > .ChatInfo .title .emoji,
#RightColumn .Management > .panel-content > .ChatInfo .title .emoji {
  width: 1.5rem;
  height: 1.5rem;
  background-size: 1.5rem;
}
#RightColumn .Management .section > .ChatInfo .status,
#RightColumn .Management > .custom-scroll > .ChatInfo .status,
#RightColumn .Management > .panel-content > .ChatInfo .status {
  font-size: 0.875rem;
  color: #868e96;
}
@media (max-width: 1275px) {
  #RightColumn {
    border-left: none;
    box-shadow: 0 0.25rem 0.5rem 0.125rem var(--color-default-shadow);
  }
}
@media (max-width: 600px) {
  #RightColumn {
    transform: translate3d(110vw, 0, 0);
    width: 100vw;
  }
}

#RightColumn-wrapper {
  pointer-events: none;
  position: absolute;
  z-index: var(--z-right-column);
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  visibility: hidden;
}
#RightColumn-wrapper.is-hidden {
  display: none;
}
#RightColumn-wrapper .overlay-backdrop {
  position: absolute;
  z-index: -1;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0;
  background: black;
}
@media (max-width: 600px) {
  #RightColumn-wrapper .overlay-backdrop {
    transition: opacity var(--layer-transition);
  }
  body.no-page-transitions #RightColumn-wrapper .overlay-backdrop, body.no-right-column-animations #RightColumn-wrapper .overlay-backdrop {
    transition: none;
  }
}
#RightColumn-wrapper .section-info_push {
  line-height: 1rem;
}
#RightColumn-wrapper .align-checkbox-with-list-buttons {
  padding-inline-start: 4.25rem;
}
#Main.right-column-shown #RightColumn-wrapper {
  visibility: visible;
}
#Main.right-column-open #RightColumn-wrapper #RightColumn {
  pointer-events: auto;
  transform: translate3d(0, 0, 0);
}
@media (max-width: 600px) {
  #Main.right-column-open #RightColumn-wrapper .overlay-backdrop {
    opacity: var(--layer-blackout-opacity);
  }
}
@media (max-width: 1275px) {
  #RightColumn-wrapper {
    position: fixed;
  }
}
/*!***************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/main/FoldersSidebar.module.scss ***!
  \***************************************************************************************************************************************************************************************************************/
.FoldersSidebar-module__root {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  width: var(--folders-sidebar-width);
  height: 100%;
  background-color: var(--color-background-sidebar);
}
.FoldersSidebar-module__root .Menu .bubble {
  --offset-y: 3.5rem;
  --offset-x: 1rem;
  overflow-y: auto;
  max-height: calc(100 * var(--vh) - 3.5rem);
}
.FoldersSidebar-module__root .MenuItem .Toggle {
  margin-inline-start: auto;
}
.FoldersSidebar-module__root .MenuItem.compact .Toggle {
  transform: scale(0.75);
  margin-inline-end: -0.125rem;
}
.FoldersSidebar-module__root .MenuItem.compact .Switcher {
  transform: scale(0.75);
}
.FoldersSidebar-module__root .account-menu-item {
  --custom-emoji-size: 1rem;
}
.FoldersSidebar-module__root .account-menu-item-test {
  position: absolute;
  z-index: 1;
  bottom: 0.0625rem;
  left: 2.875rem;
  font-size: 0.5rem;
  font-weight: var(--font-weight-medium);
  color: var(--color-text-secondary);
}
.FoldersSidebar-module__root .account-menu-item .account-avatar {
  margin-inline: 0.375rem 1.125rem;
}
.FoldersSidebar-module__root .account-menu-item .fullName {
  margin: 0;
  padding-top: 0.1875rem;
  font-size: 1em;
  line-height: 1;
}

.FoldersSidebar-module__tabs {
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  padding-inline: 0;
  font-size: 0.625rem;
  line-height: 0.75rem;
  background-color: var(--color-background-sidebar);
}

.FoldersSidebar-module__icon {
  font-size: 1.5rem;
  color: var(--color-text-secondary);
}

.FoldersSidebar-module__menuButton {
  width: var(--folders-sidebar-width);
  height: 3.5rem;
  border-radius: 0;
}

.FoldersSidebar-module__divider {
  width: 100%;
  height: 1px;
  background-color: var(--color-interactive-buffered);
}

.FoldersSidebar-module__hideMenuButton {
  visibility: hidden;
}
/*!***************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/main/GameModal.scss ***!
  \***************************************************************************************************************************************************************************************************/
.GameModal .modal-dialog {
  justify-content: center;
  max-width: 80%;
  height: 100%;
  margin: 0;
  border: none;
  background-color: transparent;
  box-shadow: none;
}
.GameModal .modal-header {
  display: none;
}
.GameModal .modal-content {
  overflow: hidden;
}
.GameModal .game-frame {
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: var(--border-radius-modal);
}
@media (max-width: 600px) {
  .GameModal .modal-dialog {
    max-width: 100% !important;
    border-radius: 0;
    background-color: var(--color-background);
  }
  .GameModal .modal-header {
    display: flex;
    padding: 0.5rem;
  }
  .GameModal .modal-content {
    max-height: none;
    padding: 0;
  }
  .GameModal .game-frame {
    border-radius: 0;
  }
}
/*!********************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/main/visualEffects/ConfettiContainer.module.scss ***!
  \********************************************************************************************************************************************************************************************************************************/
.ConfettiContainer-module__root {
  pointer-events: none;
  position: fixed;
  z-index: var(--z-confetti);
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
}
/*!****************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/main/visualEffects/WaveContainer.module.scss ***!
  \****************************************************************************************************************************************************************************************************************************/
.WaveContainer-module__root {
  pointer-events: none;
  position: fixed;
  z-index: var(--z-overlay-effects);
  inset: 0;
}

.WaveContainer-module__wave {
  --wave-width: 100vw;
  --wave-pos-top: 0%;
  --wave-pos-left: 0%;
  position: absolute;
  top: var(--wave-pos-top);
  left: var(--wave-pos-left);
  aspect-ratio: 1/1;
  width: var(--wave-width);
  border-radius: 50%;
  background-image: radial-gradient(circle, transparent 52%, rgba(255, 255, 255, 0.0235294118) 60%, transparent 68%);
  -webkit-backdrop-filter: url(#wave-filter);
          backdrop-filter: url(#wave-filter);
  animation: WaveContainer-module__waveGrow 1.5s ease-in;
}

@keyframes WaveContainer-module__waveGrow {
  from {
    transform: scale(0);
  }
  to {
    transform: scale(2.2);
  }
}
/*!**********************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/main/Main.scss ***!
  \**********************************************************************************************************************************************************************************************/
#Main {
  overflow: hidden;
  height: 100%;
  text-align: left;
}
#Main.folders-sidebar-visible {
  grid-template-columns: auto auto 1fr;
}
@media (min-width: 1276px) {
  #Main {
    position: relative;
  }
}
@media (max-width: 600px) {
  #Main {
    height: calc(var(--vh, 1vh) * 100);
  }
}
@media (min-width: 926px) {
  #Main {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: 100%;
  }
}

.has-call-header {
  --call-header-height: 2rem;
}
.has-call-header #LeftColumn, .has-call-header #MiddleColumn, .has-call-header #RightColumn-wrapper {
  height: calc(100% - var(--call-header-height));
  margin-top: var(--call-header-height);
}

#LeftColumn {
  --left-column-min-width: 16rem;
  --left-column-max-width: 26.5rem;
  position: relative;
  overflow: hidden;
  width: 33vw;
  min-width: var(--left-column-min-width);
  max-width: var(--left-column-max-width);
  height: 100%;
  background-color: var(--color-background);
}
@media (min-width: 926px) {
  #LeftColumn {
    --left-column-max-width: 40vw;
  }
  .folders-sidebar-visible #LeftColumn {
    --left-column-max-width: calc(40vw - var(--folders-sidebar-width));
  }
}
@media (min-width: 1276px) {
  #LeftColumn {
    --left-column-max-width: 33vw;
    width: 25vw;
  }
  .folders-sidebar-visible #LeftColumn {
    --left-column-max-width: calc(33vw - var(--folders-sidebar-width));
  }
}
@media (max-width: 925px) {
  #LeftColumn {
    position: fixed;
    top: 0;
    left: 0;
    transform: translate3d(-5rem, 0, 0);
    width: 26.5rem !important;
    height: calc(var(--vh, 1vh) * 100);
    transition: transform var(--layer-transition);
  }
  #LeftColumn::after {
    pointer-events: none;
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: block;
    opacity: 0;
    background: black;
    transition: opacity var(--layer-transition);
  }
  body.no-page-transitions #LeftColumn::after {
    transition: none;
  }
  body.is-android #LeftColumn::after {
    display: none;
  }
  body.is-android #Main.left-column-animating #LeftColumn::after, body.is-android #Main:not(.left-column-open) #LeftColumn::after {
    display: block;
  }
  body:not(.is-android) #Main:not(.left-column-open) #LeftColumn::after, body.android-left-blackout-open #LeftColumn::after {
    opacity: var(--layer-blackout-opacity);
  }
  body.no-page-transitions #LeftColumn {
    transition: none;
  }
  #Main.left-column-open #LeftColumn {
    transform: translate3d(0, 0, 0);
  }
  #Main.history-animation-disabled #LeftColumn {
    transition: none;
  }
  #Main.history-animation-disabled #LeftColumn:after {
    transition: none;
  }
}
@media (max-width: 600px) {
  #LeftColumn {
    --left-column-max-width: calc(100vw - env(safe-area-inset-left));
    left: env(safe-area-inset-left) !important;
    transform: translate3d(-20vw, 0, 0);
    width: calc(100vw - env(safe-area-inset-left)) !important;
    max-width: none;
    height: calc(var(--vh, 1vh) * 100);
  }
  body.is-symbol-menu-open #LeftColumn::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: var(--color-background);
  }
}

#Main.history-animation-disabled #RightColumn {
  transition: none;
}
#Main.history-animation-disabled #RightColumn .overlay-backdrop {
  transition: none;
}
@media (max-width: 600px) {
  #RightColumn {
    height: calc(var(--vh, 1vh) * 100 + 1px);
  }
}

#Main.history-animation-disabled .overlay-backdrop {
  transition: none;
}

#MiddleColumn {
  border-left: 1px solid var(--color-borders);
}
#Main.history-animation-disabled #MiddleColumn {
  transition: none;
}
#Main.history-animation-disabled #MiddleColumn:after {
  transition: none;
}
@media (max-width: 925px) {
  #MiddleColumn {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translate3d(0, 0, 0);
    max-width: none;
    transition: transform var(--layer-transition);
  }
  body.no-page-transitions #MiddleColumn {
    transition: none;
  }
  #Main.left-column-open #MiddleColumn {
    transform: translate3d(26.5rem, 0, 0);
  }
  body.no-right-column-animations #Main.right-column-open #MiddleColumn, body.no-right-column-animations #Main.right-column-shown #MiddleColumn {
    transition: none;
  }
}
@media (max-width: 600px) {
  #MiddleColumn {
    border-left: none;
  }
  #Main.left-column-open #MiddleColumn {
    transform: translate3d(100vw, 0, 0);
  }
  #Main.right-column-open #MiddleColumn {
    transform: translate3d(-20vw, 0, 0);
  }
}

@media (max-width: 925px) {
  .folders-sidebar-visible #LeftColumn {
    left: var(--folders-sidebar-width) !important;
    width: 21.5rem !important;
  }
}
/*!***********************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/main/LockScreen.module.scss ***!
  \***********************************************************************************************************************************************************************************************************/
.LockScreen-module__container {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.LockScreen-module__wrapper {
  z-index: 2;
  display: inline-flex;
  flex-direction: column;
  max-width: 20rem;
  padding: 1.5rem 1rem 0;
  border-radius: var(--border-radius-default);
  color: var(--color-text);
  background: var(--color-background);
}
.LockScreen-module__wrapper[dir=rtl] {
  text-align: right;
}

.LockScreen-module__icon {
  width: 10rem;
  height: 10rem;
  margin: 0 auto 1rem;
}

.LockScreen-module__help {
  margin-top: 2rem;
}

/*# sourceMappingURL=BundleMain.057d6a42a5a971e60579.css.map*/