/* Telegram skin — only when #app has .ui-telegram.
   Own Aura markup; Discord (.ui-discord) is never affected. */

#app.discord-app.ui-telegram {
  --tg-blue: #8774e1;
  --tg-blue-deep: #7b71c6;
  --tg-primary-tint: rgba(135, 116, 225, 0.14);
  --tg-sidebar: #212121;
  --tg-sidebar-hover: #2c2c2c;
  --tg-sidebar-active: #5f54b0;
  --tg-chat: #0e0e0e;
  --tg-header: #212121;
  --tg-bubble: #212121;
  --tg-bubble-me: #766ac8;
  --tg-text: #ffffff;
  --tg-muted: #aaaaaa;
  --tg-input: #212121;
  --tg-input-border: transparent;
  --tg-divider: rgba(255, 255, 255, 0.08);
  --tg-links: #8774e1;
  --tg-float-gap: 16px;
  --tg-float-radius: 20px;
  --tg-middle-column-width: 740px;
  --tg-right-column-width: 452px;
  --tg-header-top: var(--tg-float-gap);
  --tg-header-h: 56px;
  --tg-header-gap: 12px;
  /* Space below floating header for message content / sticky date */
  --tg-sticky-date-top: calc(var(--tg-header-top) + var(--tg-header-h) + var(--tg-header-gap));
  /* Message fade under header capsule / above composer (TG Web A) */
  --tg-msg-fade-top: calc(var(--tg-header-top) + var(--tg-header-h));
  --tg-msg-fade-bottom: var(--tg-composer-clearance, 88px);
  --tg-msg-scroll-w: 8px;
  --rail-width: 0px;
  --sidebar-width: 420px;
  --aura-bottom-bar-h: 0px;
  --aura-bottom-bar-gap: 0px;
  display: grid;
  grid-template-columns: var(--sidebar-width) var(--tg-float-gap) minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
  gap: 0;
  /* Flush top/bottom/right to the window — only left inset for the sidebar float */
  padding: 0 0 0 var(--tg-float-gap);
  box-sizing: border-box;
  background: #000000;
  color: var(--tg-text);
  font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

#app.ui-telegram .app-toolbar,
#app.ui-telegram .server-rail,
#app.ui-telegram .user-panel {
  display: none !important;
}

/* TG: drag the right edge of the left panel (like Telegram Web A). */
#app.ui-telegram .sidebar-resize {
  display: block !important;
  top: 0;
  right: 0;
  z-index: 40;
  width: 10px;
  height: 100%;
  cursor: ew-resize;
  touch-action: none;
  background: transparent;
}

#app.ui-telegram .sidebar-resize::after {
  left: auto;
  right: 3px;
  width: 2px;
  background: transparent;
}

#app.ui-telegram .sidebar-resize:hover::after,
#app.discord-app.ui-telegram.is-resizing-sidebar .sidebar-resize::after {
  background: var(--tg-blue);
}

#app.ui-telegram .channel-sidebar {
  position: relative;
  z-index: 3;
  grid-column: 1;
  grid-row: 1;
  display: flex;
  min-width: 0;
  min-height: 0;
  flex-direction: column;
  /* Float: inset from top/bottom; chat stays edge-to-edge */
  align-self: stretch;
  margin-block: var(--tg-float-gap);
  border: 0 !important;
  border-radius: var(--tg-float-radius) !important;
  background: var(--tg-sidebar) !important;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.05),
    0 1px 2px rgba(0, 0, 0, 0.28) !important;
  overflow: hidden !important;
  isolation: isolate;
}

#app.ui-telegram .discord-content {
  min-width: 0;
  min-height: 0;
  border-radius: 0;
  overflow: hidden;
  background: var(--tg-chat);
}

#app.ui-telegram #homeSidebar {
  position: relative;
  display: flex;
  min-height: 0;
  flex: 1 1 auto;
  flex-direction: column;
}

#app.ui-telegram #homeSidebar.is-left-searching {
  min-height: 0;
  flex: 1 1 auto;
}

/* TG NewChatButton FAB — pop in + slide out (transition both ways). */
#app.ui-telegram .tg-new-chat-btn {
  position: absolute;
  right: 16px;
  bottom: 16px;
  z-index: 20;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--tg-blue);
  color: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35), 0 4px 14px rgba(0, 0, 0, 0.28);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(64px) scale(0.88);
  transition:
    opacity 0.2s ease 0s,
    transform 0.32s cubic-bezier(0.4, 0, 0.7, 0.2) 0s,
    visibility 0s linear 0.34s,
    background 0.15s ease;
}

#app.ui-telegram .channel-sidebar:hover .tg-new-chat-btn,
#app.ui-telegram .channel-sidebar:focus-within .tg-new-chat-btn,
#app.ui-telegram .tg-new-chat-btn:focus-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0) scale(1);
  transition:
    opacity 0.14s ease 0s,
    transform 0.42s cubic-bezier(0.22, 1.55, 0.36, 1) 0s,
    visibility 0s linear 0s,
    background 0.15s ease;
}

#app.ui-telegram .tg-new-chat-btn:hover {
  background: #9789e8;
}

#app.ui-telegram .channel-sidebar:hover .tg-new-chat-btn:active,
#app.ui-telegram .tg-new-chat-btn:active {
  transform: translateY(0) scale(0.96);
}

#app.ui-telegram .tg-new-chat-btn svg {
  width: 22px;
  height: 22px;
}

#app.ui-telegram .tg-new-chat-btn[hidden] {
  display: none !important;
}

#app.ui-telegram #serverSidebar {
  display: flex;
  min-height: 0;
  flex: 1 1 auto;
  flex-direction: column;
}

#app.ui-telegram .home-scroll,
#app.ui-telegram .channel-scroll {
  flex: 1 1 auto;
  min-height: 0;
  padding: 0;
  background: transparent;
  overflow: auto;
}

/* —— Left: menu + search —— */
#app.ui-telegram .tg-left-header {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 0 0 auto;
  padding: 10px 12px 8px;
}

#app.ui-telegram .tg-left-header[hidden] {
  display: flex !important;
}

#app.ui-telegram .tg-left-header__menu {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--tg-muted);
  cursor: pointer;
}

#app.ui-telegram .tg-left-header__menu:hover {
  background: var(--tg-sidebar-hover);
  color: var(--tg-text);
}

#app.ui-telegram .tg-left-header__menu svg {
  width: 28px;
  height: 28px;
}

#app.ui-telegram .tg-left-header__search {
  position: relative;
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  min-width: 0;
  height: 46px;
  padding: 0 14px 0 46px;
  border-radius: 23px;
  background: #2c2c2c;
  color: var(--tg-muted);
}

#app.ui-telegram .tg-left-header__search-icon,
#app.ui-telegram .tg-left-header__search > svg.tg-left-header__search-icon {
  position: absolute;
  left: 14px;
  width: 24px;
  height: 24px;
  pointer-events: none;
}

#app.ui-telegram .tg-left-header__search input {
  width: 100%;
  min-width: 0;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--tg-text);
  font: inherit;
  font-size: 16px;
}

#app.ui-telegram .tg-left-header__search input::placeholder {
  color: var(--tg-muted);
}

#app.ui-telegram .tg-side-menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 8px;
  z-index: 80;
  display: flex;
  flex-direction: column;
  width: min(276px, calc(100% - 16px));
  padding: 6px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 12px;
  background: #252525;
  color: var(--tg-text);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.52);
  box-sizing: border-box;
  transform-origin: 18px 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: scale(0.92) translateY(-8px);
  transition:
    opacity 0.16s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.2s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 0.2s;
}

#app.ui-telegram .tg-side-menu.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: scale(1) translateY(0);
  transition:
    opacity 0.16s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.2s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 0s;
}

#app.ui-telegram .tg-side-menu.is-closing {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: scale(0.92) translateY(-8px);
}

#app.ui-telegram .tg-side-menu.is-open,
#app.ui-telegram .tg-side-menu.is-closing {
  display: flex !important;
}

#app.ui-telegram .tg-side-menu.hidden:not(.is-closing):not(.is-open),
#app.ui-telegram .tg-side-menu[hidden]:not(.is-closing):not(.is-open) {
  display: none !important;
}

#app.ui-telegram .tg-side-menu__account {
  display: flex;
  align-items: center;
  gap: 10px;
  width: calc(100% + 12px);
  min-height: 48px;
  margin: -6px -6px 4px;
  padding: 8px 12px;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 0;
  background: #202020;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

#app.ui-telegram .tg-side-menu__account:hover {
  background: #282828;
}

#app.ui-telegram .tg-side-menu__avatar.discord-avatar {
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  min-width: 30px;
  min-height: 30px;
  max-width: 30px;
  max-height: 30px;
  aspect-ratio: 1;
  border-radius: 50%;
  overflow: hidden;
  font-size: 12px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

#app.ui-telegram .tg-side-menu__avatar > i {
  display: none !important;
}

#app.ui-telegram .tg-side-menu__account strong {
  min-width: 0;
  overflow: hidden;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#app.ui-telegram .tg-side-menu__item {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 0 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
}

#app.ui-telegram .tg-side-menu__item:hover {
  background: rgba(255, 255, 255, 0.07);
}

#app.ui-telegram .tg-side-menu__item svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: #aaa;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#app.ui-telegram .tg-side-menu__item em {
  color: #777;
  font-size: 11px;
  font-style: normal;
  font-weight: 500;
}

#app.ui-telegram .tg-left-header__lead {
  position: relative;
  flex: 0 0 46px;
  width: 46px;
  height: 46px;
}

#app.ui-telegram .tg-left-header__lead .tg-left-header__back,
#app.ui-telegram .tg-left-header__lead .tg-left-header__menu {
  position: absolute;
  inset: 0;
  margin: 0;
}

#app.ui-telegram .tg-left-header__back {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--tg-muted);
  cursor: pointer;
  opacity: 0;
  transform: translateX(-10px) scale(0.86);
  pointer-events: none;
}

#app.ui-telegram .tg-left-header__back:hover {
  background: var(--tg-sidebar-hover);
  color: var(--tg-text);
}

#app.ui-telegram .tg-left-header__back svg {
  width: 28px;
  height: 28px;
}

#app.ui-telegram .tg-left-header.is-search-mode .tg-left-header__back {
  opacity: 1;
  transform: translateX(0) scale(1);
  pointer-events: auto;
}

#app.ui-telegram .tg-left-header.is-search-mode .tg-left-header__menu {
  opacity: 0;
  transform: translateX(-8px) scale(0.86);
  pointer-events: none;
}

#app.ui-telegram .tg-left-header:not(.is-search-mode) .tg-left-header__menu {
  opacity: 1;
  transform: translateX(0) scale(1);
  pointer-events: auto;
}

#app.ui-telegram .tg-left-header.is-search-mode .tg-left-header__search {
  flex: 1 1 auto;
}

#app.ui-telegram .channel-sidebar.is-left-searching {
  position: relative;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.03),
    0 1px 2px rgba(0, 0, 0, 0.34) !important;
}

#app.ui-telegram .channel-sidebar.is-left-searching::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: inherit;
  background: linear-gradient(
    180deg,
    #212121 0%,
    #1f1f1f 6%,
    #1c1c1c 11%,
    #181818 16%,
    #141414 21%,
    #101010 25%,
    #0c0c0c 28%,
    #090909 30%,
    #070707 32%,
    #070707 100%
  );
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.42s cubic-bezier(0.22, 1, 0.36, 1);
}

#app.ui-telegram .channel-sidebar.is-left-searching.is-left-search-enter::before {
  opacity: 0;
}

#app.ui-telegram .channel-sidebar.is-left-searching:not(.is-left-search-exit)::before {
  opacity: 1;
}

#app.ui-telegram .channel-sidebar.is-left-searching.is-left-search-exit.is-left-search-return::before {
  opacity: 0;
  transition: opacity 0.9s cubic-bezier(0.22, 1, 0.36, 1) 0.18s;
}

#app.ui-telegram .channel-sidebar.is-left-searching.is-left-search-exit:not(.is-left-search-return)::before {
  opacity: 1;
  transition: opacity 0.24s cubic-bezier(0.4, 0, 0.2, 1);
}

#app.ui-telegram .channel-sidebar.is-left-searching > *:not(.sidebar-resize) {
  position: relative;
  z-index: 1;
  background: transparent !important;
}

#app.ui-telegram #homeSidebar.is-left-searching .home-scroll {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-height: 0;
  flex: 1 1 0%;
  height: 0;
  overflow: hidden;
  background: transparent !important;
}

#app.ui-telegram #homeSidebar.is-left-searching .tg-left-header {
  grid-row: 1;
}

#app.ui-telegram #homeSidebar.is-left-searching .tg-left-search {
  grid-row: 2;
  min-height: 0;
}

#app.ui-telegram #homeSidebar.is-left-searching:not(.is-left-search-exit) .home-nav,
#app.ui-telegram #homeSidebar.is-left-searching:not(.is-left-search-exit) .home-divider,
#app.ui-telegram #homeSidebar.is-left-searching:not(.is-left-search-exit) .home-dm-header,
#app.ui-telegram #homeSidebar.is-left-searching:not(.is-left-search-exit) .dm-list {
  display: none !important;
}

#app.ui-telegram #homeSidebar.is-left-searching.is-left-search-exit .home-scroll {
  display: flex;
  flex-direction: column;
  height: auto;
  overflow: auto;
}

#app.ui-telegram #homeSidebar.is-left-searching.is-left-search-exit .tg-left-search {
  position: absolute;
  inset: 0;
  top: 62px;
  z-index: 4;
  height: auto;
  pointer-events: none;
}

#app.ui-telegram #homeSidebar.is-left-searching .tg-left-search__tabs-shell {
  position: relative;
  z-index: 3;
}

#app.ui-telegram .tg-left-header.is-search-mode {
  position: relative;
  z-index: 2;
  background: transparent !important;
  box-shadow: none;
}

#app.ui-telegram .tg-left-header__menu,
#app.ui-telegram .tg-left-header__back {
  transition:
    opacity 0.24s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
    background 0.15s ease,
    color 0.15s ease;
}

#app.ui-telegram .tg-left-header__search {
  transition:
    box-shadow 0.28s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}

#app.ui-telegram .tg-left-header.is-search-mode .tg-left-header__search {
  transform: scale(1);
}

#app.ui-telegram .tg-left-header.is-search-enter .tg-left-header__search {
  transform: scale(0.985);
}

#app.ui-telegram .tg-left-search {
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: 100%;
  padding: 0;
  overflow: visible;
  background: transparent;
  opacity: 0;
  transform: translateY(10px);
  pointer-events: none;
  transition:
    opacity 0.32s cubic-bezier(0.22, 1, 0.36, 1) 0.04s,
    transform 0.36s cubic-bezier(0.22, 1, 0.36, 1) 0.04s;
}

#app.ui-telegram #homeSidebar.is-left-searching.is-left-search-enter .tg-left-search,
#app.ui-telegram #homeSidebar.is-left-searching.is-left-search-enter .tg-left-search__tabs-shell,
#app.ui-telegram #homeSidebar.is-left-searching.is-left-search-enter .tg-left-search__content,
#app.ui-telegram #homeSidebar.is-left-searching.is-left-search-enter .tg-left-search__panel {
  opacity: 0;
  transform: translateY(12px);
}

#app.ui-telegram #homeSidebar.is-left-searching:not(.is-left-search-enter):not(.is-left-search-exit) .tg-left-search {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

#app.ui-telegram #homeSidebar.is-left-search-exit:not(.is-left-search-return) .tg-left-search {
  opacity: 0;
  flex: 0 0 0;
  max-height: 0;
  min-height: 0;
  overflow: hidden;
  transform: translateY(6px);
  pointer-events: none;
  transition:
    opacity 0.22s cubic-bezier(0.4, 0, 0.2, 1) 0s,
    transform 0.26s cubic-bezier(0.4, 0, 0.2, 1) 0s,
    max-height 0.28s cubic-bezier(0.4, 0, 0.2, 1) 0.08s,
    flex 0.28s cubic-bezier(0.4, 0, 0.2, 1) 0.08s;
}

#app.ui-telegram #homeSidebar.is-left-search-exit:not(.is-left-search-return) .tg-left-search__tabs-shell {
  opacity: 0;
  transform: translateY(-8px);
  transition:
    opacity 0.18s cubic-bezier(0.4, 0, 0.2, 1) 0s,
    transform 0.22s cubic-bezier(0.4, 0, 0.2, 1) 0s;
}

#app.ui-telegram #homeSidebar.is-left-search-exit:not(.is-left-search-return) .tg-left-search__content {
  opacity: 0;
  transform: translateY(6px);
  transition:
    opacity 0.18s cubic-bezier(0.4, 0, 0.2, 1) 0.02s,
    transform 0.22s cubic-bezier(0.4, 0, 0.2, 1) 0.02s;
}

#app.ui-telegram #homeSidebar.is-left-search-exit:not(.is-left-search-return) .tg-left-search__panel {
  opacity: 0;
  transform: translateY(6px);
  transition:
    opacity 0.18s cubic-bezier(0.4, 0, 0.2, 1) 0.02s,
    transform 0.22s cubic-bezier(0.4, 0, 0.2, 1) 0.02s;
}

#app.ui-telegram #homeSidebar.is-left-search-exit .dm-list {
  display: block !important;
  opacity: 0;
  visibility: visible;
  transform: translateY(10px);
  pointer-events: none;
  /* Lock opacity at 0 so display:none → block does not flash the list. */
  transition: none;
}

#app.ui-telegram #homeSidebar.is-left-search-return .dm-list {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
  transition:
    opacity 0.42s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.46s cubic-bezier(0.22, 1, 0.36, 1);
}

#app.ui-telegram #homeSidebar.is-left-search-return .tg-left-header.is-search-mode {
  background: var(--tg-sidebar) !important;
  transition: background 0.82s cubic-bezier(0.22, 1, 0.36, 1) 0.22s;
}

#app.ui-telegram .tg-left-search.hidden,
#app.ui-telegram .tg-left-search[hidden] {
  display: none !important;
}

#app.ui-telegram #homeSidebar .home-divider,
#app.ui-telegram #homeSidebar .home-dm-header,
#app.ui-telegram #homeSidebar .dm-list {
  transition:
    opacity 0.44s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.48s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 0s;
}

#app.ui-telegram #homeSidebar.is-left-searching.is-left-search-enter .home-nav,
#app.ui-telegram #homeSidebar.is-left-searching.is-left-search-enter .home-divider,
#app.ui-telegram #homeSidebar.is-left-searching.is-left-search-enter .home-dm-header,
#app.ui-telegram #homeSidebar.is-left-searching.is-left-search-enter .dm-list,
#app.ui-telegram #homeSidebar.is-left-searching.is-left-search-enter .tg-new-chat-btn {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

#app.ui-telegram #homeSidebar.is-left-searching:not(.is-left-search-enter):not(.is-left-search-exit) .home-divider,
#app.ui-telegram #homeSidebar.is-left-searching:not(.is-left-search-enter):not(.is-left-search-exit) .home-dm-header,
#app.ui-telegram #homeSidebar.is-left-searching:not(.is-left-search-enter):not(.is-left-search-exit) .dm-list,
#app.ui-telegram #homeSidebar.is-left-searching:not(.is-left-search-enter):not(.is-left-search-exit) .tg-new-chat-btn {
  display: none !important;
  opacity: 0;
  transform: translateY(8px);
  pointer-events: none;
  visibility: hidden;
  transition-delay: 0s;
}

#app.ui-telegram .tg-left-header.is-search-mode.is-search-exit .tg-left-header__back {
  opacity: 1;
  transform: translateX(0) scale(1);
  pointer-events: auto;
}

#app.ui-telegram .tg-left-header.is-search-mode.is-search-exit .tg-left-header__menu {
  opacity: 0;
  transform: translateX(-8px) scale(0.86);
  pointer-events: none;
}

#app.ui-telegram #homeSidebar.is-left-search-return .tg-left-header.is-search-mode.is-search-exit .tg-left-header__back {
  opacity: 0;
  transform: translateX(-10px) scale(0.86);
  pointer-events: none;
  transition:
    opacity 0.34s cubic-bezier(0.22, 1, 0.36, 1) 0.28s,
    transform 0.38s cubic-bezier(0.22, 1, 0.36, 1) 0.28s;
}

#app.ui-telegram #homeSidebar.is-left-search-return .tg-left-header.is-search-mode.is-search-exit .tg-left-header__menu {
  opacity: 1;
  transform: translateX(0) scale(1);
  pointer-events: auto;
  transition:
    opacity 0.34s cubic-bezier(0.22, 1, 0.36, 1) 0.28s,
    transform 0.38s cubic-bezier(0.22, 1, 0.36, 1) 0.28s;
}

#app.ui-telegram .tg-left-header.is-search-mode.is-search-exit .tg-left-header__search {
  transform: scale(1);
}

#app.ui-telegram .tg-left-search__tabs-shell {
  display: flex;
  flex: 0 0 auto;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  padding: 8px 16px 14px;
  overflow: visible;
  opacity: 0;
  transform: translateY(12px);
  transition:
    opacity 0.34s cubic-bezier(0.22, 1, 0.36, 1) 0.06s,
    transform 0.38s cubic-bezier(0.22, 1, 0.36, 1) 0.06s;
}

#app.ui-telegram .tg-left-search__content {
  display: flex;
  min-height: 0;
  flex: 1 1 0%;
  flex-direction: column;
  position: relative;
  overflow: hidden;
  opacity: 0;
  transform: translateY(12px);
  transition:
    opacity 0.34s cubic-bezier(0.22, 1, 0.36, 1) 0.06s,
    transform 0.38s cubic-bezier(0.22, 1, 0.36, 1) 0.06s;
}

#app.ui-telegram .tg-left-search__panel {
  position: relative;
  display: flex;
  min-height: 0;
  flex: 1 1 0%;
  flex-direction: column;
  overflow: hidden;
  opacity: 1;
  transform: translateY(0);
  transition:
    opacity 0.28s ease 0.12s,
    transform 0.32s cubic-bezier(0.22, 1, 0.36, 1) 0.12s;
}

#app.ui-telegram #homeSidebar.is-left-searching:not(.is-left-search-enter):not(.is-left-search-exit) .tg-left-search__tabs-shell,
#app.ui-telegram #homeSidebar.is-left-searching:not(.is-left-search-enter):not(.is-left-search-exit) .tg-left-search__content {
  opacity: 1;
  transform: translateY(0);
}

#app.ui-telegram .tg-left-search__status,
#app.ui-telegram .tg-people-search__status {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 24px 20px;
  color: #8b8b8b;
  font-size: 14px;
  line-height: 1.45;
  text-align: center;
  pointer-events: none;
}

#app.ui-telegram .tg-left-search__tabs {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 8px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.28);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 1px 2px rgba(0, 0, 0, 0.22);
  overflow: visible;
}

#app.ui-telegram .tg-left-search__tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  flex-shrink: 0;
  box-sizing: border-box;
  min-height: 38px;
  height: auto;
  min-width: 96px;
  padding: 10px 20px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  color: #a8a8a8;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.25;
  white-space: nowrap;
  overflow: visible;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

#app.ui-telegram .tg-left-search__tab:hover {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.1);
  color: #e2e2e2;
}

#app.ui-telegram .tg-left-search__tab.is-active {
  border-color: rgba(135, 116, 225, 0.45);
  background: var(--tg-blue);
  color: #fff;
}

#app.ui-telegram .tg-left-search__panel.hidden,
#app.ui-telegram .tg-left-search__panel[hidden] {
  display: none !important;
}

#app.ui-telegram .tg-left-search__placeholder {
  margin: 0;
  padding: 0 24px;
  color: var(--tg-muted);
  font-size: 14px;
  line-height: 1.45;
  text-align: center;
}

#app.ui-telegram .tg-left-search__status.hidden,
#app.ui-telegram .tg-people-search__status.hidden {
  display: none !important;
}

#app.ui-telegram .tg-people-search__list:not(:empty) ~ .tg-people-search__status {
  display: none !important;
}

#app.ui-telegram .tg-people-search {
  display: flex;
  min-height: 0;
  flex: 1 1 auto;
  flex-direction: column;
  padding: 4px 8px 12px;
  overflow: hidden;
}

#app.ui-telegram .tg-people-search.hidden,
#app.ui-telegram .tg-people-search[hidden] {
  display: none !important;
}

#app.ui-telegram .tg-people-search__title {
  flex: 0 0 auto;
  padding: 10px 10px 7px;
  color: #8b8b8b;
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
}

#app.ui-telegram .tg-people-search__list {
  position: relative;
  z-index: 2;
  display: flex;
  min-height: 0;
  flex: 1 1 0%;
  flex-direction: column;
  overflow-x: hidden;
  overflow-y: auto;
}

#app.ui-telegram .tg-people-search__list:empty {
  display: none;
}

#app.ui-telegram .tg-people-search__item {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 64px;
  padding: 8px 10px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: #fff;
  text-align: left;
  cursor: pointer;
  box-sizing: border-box;
}

#app.ui-telegram .tg-people-search__item:hover,
#app.ui-telegram .tg-people-search__item.is-active {
  background: rgba(255, 255, 255, 0.07);
}

#app.ui-telegram .tg-people-search__avatar {
  position: relative;
  width: 48px;
  height: 48px;
  min-width: 48px;
  border-radius: 50%;
}

#app.ui-telegram .tg-people-search__avatar > i {
  display: none !important;
}

#app.ui-telegram .tg-channels-search__avatar {
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(135, 116, 225, 0.16);
  color: var(--tg-blue);
}

#app.ui-telegram .tg-channels-search__avatar > svg {
  width: 24px;
  height: 24px;
}

#app.ui-telegram .tg-people-search__copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 3px;
}

#app.ui-telegram .tg-people-search__copy strong {
  overflow: hidden;
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#app.ui-telegram .tg-people-search__copy span {
  overflow: hidden;
  color: var(--tg-muted);
  font-size: 14px;
  line-height: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#app.ui-telegram #homeSidebar.is-left-searching:not(.is-left-search-exit):not(.is-left-search-return) .home-nav,
#app.ui-telegram #homeSidebar.is-left-searching:not(.is-left-search-exit):not(.is-left-search-return) .home-divider,
#app.ui-telegram #homeSidebar.is-left-searching:not(.is-left-search-exit):not(.is-left-search-return) .home-dm-header,
#app.ui-telegram #homeSidebar.is-left-searching:not(.is-left-search-exit):not(.is-left-search-return) .dm-list,
#app.ui-telegram #homeSidebar.is-left-searching:not(.is-left-search-exit):not(.is-left-search-return) .tg-new-chat-btn,
#app.ui-telegram #homeSidebar.is-people-searching .home-nav,
#app.ui-telegram #homeSidebar.is-people-searching .home-divider,
#app.ui-telegram #homeSidebar.is-people-searching .home-dm-header,
#app.ui-telegram #homeSidebar.is-people-searching .dm-list,
#app.ui-telegram #homeSidebar.is-people-searching .tg-new-chat-btn {
  display: none !important;
  visibility: hidden;
  pointer-events: none;
}

/* —— Folder-like tabs (скрыты в TG — папок пока нет) —— */
#app.ui-telegram .home-nav {
  display: none !important;
}

#app.ui-telegram .home-nav::-webkit-scrollbar {
  display: none;
}

#app.ui-telegram .home-nav__item {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  justify-content: center;
  min-height: 32px;
  padding: 0 14px;
  border-radius: 999px;
  background: #181818;
  color: var(--tg-muted);
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
}

#app.ui-telegram .home-nav__item.active {
  background: var(--tg-blue);
  color: #fff;
}

#app.ui-telegram .home-nav__badge {
  display: inline-grid;
  place-items: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 9px;
  background: var(--tg-blue);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
}

#app.ui-telegram .home-nav__badge[hidden] {
  display: none !important;
}

#app.ui-telegram .home-nav__item.active .home-nav__badge {
  background: #fff;
  color: var(--tg-blue);
}

#app.ui-telegram .home-nav__badge--muted {
  background: #3a3a3a;
  color: #fff;
}

#app.ui-telegram .home-nav__icon {
  display: none !important;
}

#app.ui-telegram .home-nav__label--full {
  display: none !important;
}

#app.ui-telegram .home-nav__label--short {
  display: inline !important;
}

#app.ui-telegram .home-divider {
  display: none;
}

#app.ui-telegram .home-dm-header {
  display: none !important;
}

#app.ui-telegram .dm-unread-rail {
  display: none !important;
}

#app.ui-telegram .dm-unread-flyer {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
#app.ui-telegram .dm-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0 0 12px;
}

#app.ui-telegram .dm-item,
#app.ui-telegram .channel-item.dm-item {
  position: relative;
  display: grid !important;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 72px;
  margin: 0;
  padding: 8px 10px !important;
  border: 0;
  border-radius: 14px !important;
  background: transparent;
  color: var(--tg-text);
  text-align: left;
  cursor: pointer;
  box-sizing: border-box;
}

#app.ui-telegram .dm-item:hover,
#app.ui-telegram .channel-item.dm-item:hover {
  background: var(--tg-sidebar-hover);
}

#app.ui-telegram .dm-item.active,
#app.ui-telegram .channel-item.dm-item.active {
  background: var(--tg-sidebar-active);
}

#app.ui-telegram .dm-item.active .dm-item__meta-time {
  color: rgba(255, 255, 255, 0.9);
}

#app.ui-telegram .dm-item__avatar,
#app.ui-telegram .dm-item .dm-item__avatar {
  width: 54px;
  height: 54px;
  border-radius: 50%;
}

#app.ui-telegram .dm-item__avatar > i:not(.avatar-typing-badge) {
  display: none !important;
}

#app.ui-telegram .dm-item__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  min-width: 0;
  align-self: center;
}

#app.ui-telegram .dm-item__title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding-right: 48px;
}

#app.ui-telegram .dm-item__name {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #fff;
  font-size: 17px !important;
  font-weight: 600 !important;
  line-height: 21px !important;
}

#app.ui-telegram .dm-item__meta-time {
  position: absolute;
  top: 10px;
  right: 12px;
  z-index: 1;
  margin: 0;
  color: #707070;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.2;
  pointer-events: none;
}

#app.ui-telegram .dm-item__subtitle-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  /* No unread badge: preview reaches near the time column edge */
  padding-right: 12px;
}

#app.ui-telegram .dm-item:has(> .dm-item__badge) .dm-item__subtitle-row {
  padding-right: 42px;
}

#app.ui-telegram .dm-item__subtitle {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--tg-muted, #8b8b8b);
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  text-align: left;
}

#app.ui-telegram .dm-item__subtitle-nick {
  font-weight: 600 !important;
}

/* Unread count — Telegram Web A ChatBadge (gray circle under time) */
#app.ui-telegram .dm-item__badge {
  position: absolute;
  right: 12px;
  bottom: 11px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  box-sizing: border-box;
  min-width: 24px;
  width: auto;
  height: 24px;
  padding: 0 6px;
  border-radius: 999px;
  background: #4e4e4e;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  line-height: 24px;
  text-align: center;
  letter-spacing: 0;
  pointer-events: none;
}

/* Single-digit circle: fixed size so “1” sits dead-center */
#app.ui-telegram .dm-item__badge:not([data-wide]) {
  width: 24px;
  min-width: 24px;
  padding: 0;
}

#app.ui-telegram .dm-item.active .dm-item__badge {
  background: rgba(255, 255, 255, 0.9);
  color: var(--tg-sidebar-active);
}

#app.ui-telegram .home-empty {
  padding: 28px 16px;
  color: var(--tg-muted);
  text-align: center;
}

#app.ui-telegram .server-header {
  min-height: 56px;
  padding: 0 16px;
  border: 0;
  background: var(--tg-header);
  color: var(--tg-text);
  box-shadow: 0 1px 0 var(--tg-divider);
}

#app.ui-telegram .channel-category {
  display: none;
}

#app.ui-telegram .channel-list .channel-item {
  margin: 0;
  padding: 10px 16px;
  border-radius: 0;
}

#app.ui-telegram .channel-list .channel-item.active {
  background: var(--tg-sidebar-active);
}

/* —— Main chat —— */
#app.ui-telegram .discord-content {
  grid-column: 3;
  grid-row: 1;
  min-width: 0;
  min-height: 0;
  border: 0 !important;
  /* Flush to top / bottom / right of the window — no clip gap above messages */
  border-radius: 0 !important;
  overflow: hidden;
  background: var(--tg-chat) !important;
  box-shadow: none !important;
}

#app.ui-telegram .friends-view {
  display: none !important;
  background: var(--tg-chat) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

#app.ui-telegram .friends-header {
  min-height: 56px;
  padding: 0 16px;
  border-bottom: 1px solid var(--tg-divider);
  background: var(--tg-header);
}

#app.ui-telegram .friends-tab.active,
#app.ui-telegram .friends-add {
  background: var(--tg-primary-tint);
  color: var(--tg-blue);
}

#app.ui-telegram .discord-workspace {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

#app.ui-telegram #toggleMembers {
  display: none !important;
}

/* Right ChatInfo column — floating card, never flush to screen edges.
   Wide track is driven by .discord-workspace:not(.members-hidden) (see below). */

#app.ui-telegram .members-panel,
#app.ui-telegram .discord-workspace .members-panel,
#app.ui-telegram #membersPanel {
  display: none !important;
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open,
#app.ui-telegram #membersPanel.members-panel--profile.is-panel-motion {
  display: flex !important;
  flex-direction: column !important;
  position: fixed !important;
  top: var(--tg-float-gap) !important;
  right: var(--tg-float-gap) !important;
  bottom: var(--tg-float-gap) !important;
  left: auto !important;
  grid-column: auto !important;
  grid-row: auto !important;
  width: var(--tg-right-column-width) !important;
  min-width: var(--tg-right-column-width) !important;
  max-width: var(--tg-right-column-width) !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: var(--tg-float-radius) !important;
  background: var(--tg-sidebar) !important;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.05),
    0 1px 2px rgba(0, 0, 0, 0.28) !important;
  opacity: 1 !important;
  visibility: visible !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
  z-index: 40 !important;
  transform-origin: center right;
  will-change: transform;
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open:not(.is-panel-motion) {
  transform: translate3d(0, 0, 0);
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  min-width: 100%;
  height: 100%;
  border-radius: inherit;
  background: #0f0f0f;
  box-shadow: none;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
  -webkit-overflow-scrolling: touch;
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile.is-own-profile .tg-profile-status,
#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile.is-own-profile #tgProfileFriendAction,
#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile.is-own-profile .tg-list-item--switch,
#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile.is-own-profile #tgSharedMedia {
  display: none !important;
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile.is-own-profile .tg-chat-extra {
  padding-bottom: 12px;
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile.is-group-profile .tg-profile-meta,
#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile.is-group-profile #tgProfileFriendAction {
  display: none !important;
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile.is-group-profile .tg-profile-hero {
  min-height: 248px;
  height: 248px;
  background: #0f0f0f;
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile.is-group-profile .tg-profile-hero .dm-profile__banner {
  opacity: 0 !important;
  pointer-events: none !important;
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile.is-group-profile .tg-profile-hero .dm-profile__avatar,
#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile.is-group-profile .tg-profile-hero .dm-profile__avatar.discord-avatar {
  --_size: 120px;
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile.is-group-profile .tg-profile-hero .dm-profile__avatar > i,
#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile.is-group-profile .tg-profile-hero .dm-profile__avatar i,
#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile.is-group-profile .tg-profile-hero .dm-profile__avatar::after {
  display: none !important;
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile.is-group-profile {
  position: relative;
}

#app.ui-telegram .tg-info-head__edit:not(.hidden) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

#app.ui-telegram .tg-info-head:has(.tg-info-head__edit:not(.hidden)) .tg-info-head__spacer {
  display: none;
}

#app.ui-telegram .tg-group-members {
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
  align-self: stretch;
  height: fit-content;
  min-height: 0;
  margin: 0;
  padding: 4px 0 6px;
  background: #212121;
  border-radius: 16px;
}

#app.ui-telegram .tg-group-members.hidden,
#app.ui-telegram .tg-group-members[hidden] {
  display: none !important;
}

#app.ui-telegram .tg-group-member {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 8px 14px;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  font: inherit;
  box-sizing: border-box;
}

#app.ui-telegram .tg-group-member:hover {
  background: rgba(255, 255, 255, 0.04);
}

#app.ui-telegram .tg-group-member__avatar,
#app.ui-telegram .tg-group-member__avatar.discord-avatar {
  flex: 0 0 44px;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px;
  border-radius: 50%;
}

#app.ui-telegram .tg-group-member__avatar > i,
#app.ui-telegram .tg-group-member__avatar i {
  display: none !important;
}

#app.ui-telegram .tg-group-member__info {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

#app.ui-telegram .tg-group-member__title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

#app.ui-telegram .tg-group-member__name {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.25;
  white-space: nowrap;
  text-overflow: ellipsis;
}

#app.ui-telegram .tg-group-member__badge {
  flex: 0 0 auto;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(135, 116, 225, 0.22);
  color: #c5b6f5;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.3;
}

#app.ui-telegram .tg-group-member__badge--owner {
  background: rgba(135, 116, 225, 0.28);
  color: #d2c6ff;
}

#app.ui-telegram .tg-group-member__status {
  color: #8a8a8a;
  font-size: 13px;
  line-height: 1.25;
}

#app.ui-telegram .tg-group-member__status.is-online {
  color: var(--tg-blue);
}

#app.ui-telegram .tg-group-fab {
  position: absolute;
  right: 22px;
  bottom: 22px;
  z-index: 6;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #8774e1;
  color: #fff;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
}

#app.ui-telegram .tg-group-fab:hover {
  background: #9685e8;
}

#app.ui-telegram .tg-group-fab.hidden,
#app.ui-telegram .tg-group-fab[hidden] {
  display: none !important;
}

#app.ui-telegram .tg-group-fab svg {
  width: 28px;
  height: 28px;
}

#app.ui-telegram #tgGroupAddMembersFab svg {
  width: 30px;
  height: 30px;
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open .tg-group-invite {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  height: 100%;
  background: #0f0f0f;
  color: var(--tg-text);
  overflow: hidden;
  position: relative;
}

#app.ui-telegram .tg-group-invite.hidden,
#app.ui-telegram .tg-group-invite[hidden] {
  display: none !important;
}

#app.ui-telegram .tg-group-invite__header {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 4px;
  height: 56px;
  min-height: 56px;
  padding: 0 12px 0 6px;
  background: var(--tg-sidebar);
}

#app.ui-telegram .tg-group-invite__back {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--tg-muted);
  cursor: pointer;
}

#app.ui-telegram .tg-group-invite__back:hover {
  background: rgba(255, 255, 255, 0.06);
  color: var(--tg-text);
}

#app.ui-telegram .tg-group-invite__back svg {
  width: 24px;
  height: 24px;
}

#app.ui-telegram .tg-group-invite__header h2 {
  flex: 1 1 auto;
  margin: 0;
  padding: 0 4px;
  overflow: hidden;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#app.ui-telegram .tg-group-invite__chips {
  display: flex;
  flex: 0 0 auto;
  gap: 10px;
  padding: 4px 16px 8px;
  overflow-x: auto;
  scrollbar-width: none;
}

#app.ui-telegram .tg-group-invite__chips::-webkit-scrollbar {
  display: none;
}

#app.ui-telegram .tg-group-invite__chips[hidden] {
  display: none !important;
}

#app.ui-telegram .tg-group-invite__chip {
  position: relative;
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
}

#app.ui-telegram .tg-group-invite__chip .discord-avatar {
  width: 48px !important;
  height: 48px !important;
  border-radius: 50%;
}

#app.ui-telegram .tg-group-invite__chip .discord-avatar > i {
  display: none !important;
}

#app.ui-telegram .tg-group-invite__chip::after {
  content: "";
  position: absolute;
  top: -2px;
  right: -2px;
  width: 18px;
  height: 18px;
  border: 2px solid #0f0f0f;
  border-radius: 50%;
  background: var(--tg-muted) center / 10px 10px no-repeat
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3C/svg%3E");
}

#app.ui-telegram .tg-group-invite__search {
  flex: 0 0 auto;
  padding: 8px 12px 12px;
}

#app.ui-telegram .tg-group-invite__search input {
  width: 100%;
  box-sizing: border-box;
  padding: 11px 14px;
  border: 1.5px solid var(--tg-blue);
  border-radius: 12px;
  outline: none;
  background: transparent;
  color: var(--tg-text);
  font: inherit;
  font-size: 15px;
}

#app.ui-telegram .tg-group-invite__search input::placeholder {
  color: var(--tg-muted);
}

#app.ui-telegram .tg-group-invite__list {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
  overflow-y: auto;
  padding: 0 0 88px;
  overscroll-behavior: contain;
}

#app.ui-telegram .tg-group-invite__empty {
  margin: 24px 16px;
  color: var(--tg-muted);
  font-size: 15px;
  text-align: center;
}

#app.ui-telegram .tg-group-invite__item {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  margin: 0;
  padding: 10px 16px;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  font: inherit;
  box-sizing: border-box;
}

#app.ui-telegram .tg-group-invite__item:hover {
  background: rgba(255, 255, 255, 0.04);
}

#app.ui-telegram .tg-group-invite__avatar,
#app.ui-telegram .tg-group-invite__avatar.discord-avatar {
  flex: 0 0 48px;
  width: 48px !important;
  height: 48px !important;
  min-width: 48px;
  border-radius: 50%;
}

#app.ui-telegram .tg-group-invite__avatar > i,
#app.ui-telegram .tg-group-invite__avatar i {
  display: none !important;
}

#app.ui-telegram .tg-group-invite__copy {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

#app.ui-telegram .tg-group-invite__copy strong {
  overflow: hidden;
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.25;
  white-space: nowrap;
  text-overflow: ellipsis;
}

#app.ui-telegram .tg-group-invite__copy span {
  color: var(--tg-muted);
  font-size: 13px;
  line-height: 1.25;
}

#app.ui-telegram .tg-group-invite__check {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 2px solid var(--tg-muted);
  border-radius: 50%;
  color: transparent;
  box-sizing: border-box;
}

#app.ui-telegram .tg-group-invite__check svg {
  width: 14px;
  height: 14px;
  opacity: 0;
}

#app.ui-telegram .tg-group-invite__item.is-selected .tg-group-invite__check {
  border-color: var(--tg-blue);
  background: var(--tg-blue);
  color: #fff;
}

#app.ui-telegram .tg-group-invite__item.is-selected .tg-group-invite__check svg {
  opacity: 1;
}

#app.ui-telegram .tg-group-invite__fab[hidden],
#app.ui-telegram .tg-group-invite__fab:disabled {
  display: none !important;
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open .tg-group-edit {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  background: #0f0f0f;
  color: var(--tg-text);
}

#app.ui-telegram .tg-group-edit.hidden,
#app.ui-telegram .tg-group-edit[hidden] {
  display: none !important;
}

#app.ui-telegram .tg-group-edit__header {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 4px;
  height: 56px;
  min-height: 56px;
  padding: 0 12px 0 6px;
  background: var(--tg-sidebar);
}

#app.ui-telegram .tg-group-edit__back {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--tg-muted);
  cursor: pointer;
}

#app.ui-telegram .tg-group-edit__back:hover {
  background: rgba(255, 255, 255, 0.06);
  color: var(--tg-text);
}

#app.ui-telegram .tg-group-edit__back svg {
  width: 24px;
  height: 24px;
}

#app.ui-telegram .tg-group-edit__header h2 {
  flex: 1 1 auto;
  margin: 0;
  padding: 0 4px;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.2;
}

#app.ui-telegram .tg-group-edit__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  min-height: 0;
  overflow-y: auto;
  padding: 20px 16px 100px;
}

#app.ui-telegram .tg-group-edit__avatar {
  position: relative;
  display: grid;
  place-items: center;
  width: 120px;
  height: 120px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
}

#app.ui-telegram .tg-group-edit__avatar-preview {
  display: grid;
  place-items: center;
  width: 120px;
  height: 120px;
  overflow: hidden;
  border-radius: 50%;
  background: #2c2c2c;
  color: #fff;
  font-size: 42px;
  font-weight: 600;
  background-size: cover;
  background-position: center;
}

#app.ui-telegram .tg-group-edit__avatar-badge {
  position: absolute;
  right: 4px;
  bottom: 4px;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.55);
  color: #fff;
  box-shadow: 0 0 0 2px #0f0f0f;
}

#app.ui-telegram .tg-group-edit__avatar-badge svg {
  width: 18px;
  height: 18px;
}

#app.ui-telegram .tg-group-edit__remove-photo {
  margin: -4px 0 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #e53935;
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
}

#app.ui-telegram .tg-group-edit__remove-photo.hidden {
  display: none !important;
}

#app.ui-telegram .tg-group-edit__field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

#app.ui-telegram .tg-group-edit__label {
  color: var(--tg-blue);
  font-size: 13px;
  font-weight: 600;
}

#app.ui-telegram .tg-group-edit__field input {
  width: 100%;
  box-sizing: border-box;
  padding: 12px 14px;
  border: 1.5px solid var(--tg-blue);
  border-radius: 12px;
  outline: none;
  background: transparent;
  color: var(--tg-text);
  font: inherit;
  font-size: 16px;
}

#app.ui-telegram .tg-group-edit__delete {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  margin-top: 18px;
  padding: 14px 16px;
  border: 0;
  border-radius: 14px;
  background: rgba(229, 57, 53, 0.12);
  color: #ff6b67;
  font: inherit;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
}

#app.ui-telegram .tg-group-edit__delete.hidden,
#app.ui-telegram .tg-group-edit__delete[hidden] {
  display: none !important;
}

#app.ui-telegram .tg-group-edit__delete svg {
  width: 22px;
  height: 22px;
}

#app.ui-telegram .tg-group-edit__delete:hover {
  background: rgba(229, 57, 53, 0.18);
}

#app.ui-telegram .tg-group-edit__fab[hidden],
#app.ui-telegram .tg-group-edit__fab:disabled {
  display: none !important;
}

.friend-request-prompt.friend-request-prompt--telegram {
  left: 16px;
  bottom: 16px;
  width: min(388px, calc(100vw - 32px));
  padding: 12px 12px 8px;
  border: 0;
  border-radius: 12px;
  background: #212121;
  color: #fff;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.46);
}

.friend-request-prompt--telegram .friend-request-prompt__avatar {
  display: grid;
  width: 48px;
  height: 48px;
  min-width: 48px;
  overflow: hidden;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
}

/* Telegram does not draw a presence badge on this avatar. */
.friend-request-prompt--telegram .friend-request-prompt__avatar i,
.friend-request-prompt--telegram .friend-request-prompt__avatar::after {
  display: none !important;
  content: none !important;
}

.friend-request-prompt--telegram .friend-request-prompt__copy {
  gap: 2px;
}

.friend-request-prompt--telegram .friend-request-prompt__copy strong {
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  line-height: 20px;
}

.friend-request-prompt--telegram .friend-request-prompt__copy span {
  color: #aaa;
  font-size: 13px;
  line-height: 18px;
}

/* Telegram Desktop-style text actions instead of Discord's filled buttons. */
.friend-request-prompt--telegram .friend-request-prompt__actions {
  display: flex;
  justify-content: flex-end;
  gap: 2px;
  margin-top: 6px;
}

.friend-request-prompt--telegram .friend-request-prompt__actions button {
  width: auto;
  min-height: 34px;
  padding: 0 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  transition:
    background 0.15s ease,
    color 0.15s ease;
}

.friend-request-prompt--telegram .friend-request-prompt__accept {
  color: #8774e1;
}

.friend-request-prompt--telegram .friend-request-prompt__accept:hover:not(:disabled) {
  background: rgba(135, 116, 225, 0.14);
  filter: none;
}

.friend-request-prompt--telegram .friend-request-prompt__reject {
  color: #aaa;
}

.friend-request-prompt--telegram .friend-request-prompt__reject:hover:not(:disabled) {
  background: rgba(255, 255, 255, 0.07);
  color: #fff;
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile:hover,
#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile:focus-within {
  scrollbar-color: rgba(255, 255, 255, 0.22) transparent;
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile::-webkit-scrollbar {
  width: 6px;
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile::-webkit-scrollbar-track {
  background: transparent;
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile::-webkit-scrollbar-thumb {
  border-radius: 6px;
  background: transparent;
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile:hover::-webkit-scrollbar-thumb,
#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile:focus-within::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.22);
}

#app.ui-telegram #membersPanel.members-panel--profile.is-open .dm-profile:hover::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.32);
}

#app.ui-telegram .dm-profile__scroll {
  flex: 0 0 auto;
  min-height: 0;
  overflow: visible;
  display: flex;
  flex-direction: column;
  background: #0f0f0f;
}

#app.ui-telegram .dm-profile.is-group-profile .dm-profile__scroll {
  padding-bottom: 72px;
}

@property --tg-expand {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

#app.ui-telegram .tg-profile-hero {
  position: relative;
  top: auto;
  z-index: 4;
  flex: 0 0 auto;
  display: block;
  isolation: isolate;
  overflow: hidden;
  background: var(--tg-sidebar);
  min-height: 310px;
  height: 310px;
  width: 100%;
  box-sizing: border-box;
  --tg-expand: 0;
  --tg-avatar: 122px;
  transition: --tg-expand 0.34s cubic-bezier(0.22, 0.82, 0.2, 1);
}

#app.ui-telegram .tg-profile-hero.is-expand-instant {
  transition: none !important;
}

#app.ui-telegram .tg-profile-hero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  height: 46%;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 0.62) 100%);
  opacity: var(--tg-expand);
}

#app.ui-telegram .tg-profile-hero .dm-profile__banner {
  position: absolute;
  inset: 0;
  z-index: 0;
  height: 100% !important;
  min-height: 100%;
  width: 100% !important;
  border-radius: 0 !important;
  opacity: calc(1 - var(--tg-expand) * 0.92);
  pointer-events: none;
  transition: none;
}

#app.ui-telegram .tg-profile-hero .profile-banner-actions {
  display: none !important;
}

#app.ui-telegram .tg-profile-hero .dm-profile__body {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1;
  display: block !important;
  flex: none !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-sizing: border-box !important;
}

#app.ui-telegram .tg-profile-identity {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  text-align: center;
  transform: none !important;
  pointer-events: none;
}

#app.ui-telegram .tg-profile-hero .dm-profile__avatar-btn,
#app.ui-telegram .tg-profile-identity .dm-profile__avatar-btn,
#app.ui-telegram #dmProfileAvatarBtn {
  position: absolute !important;
  inset: auto !important;
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  bottom: auto !important;
  display: grid !important;
  place-items: center;
  width: calc(var(--tg-avatar) + (100% - var(--tg-avatar)) * var(--tg-expand)) !important;
  height: calc(var(--tg-avatar) + (100% - var(--tg-avatar)) * var(--tg-expand)) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: calc(999px * (1 - var(--tg-expand))) !important;
  background: transparent !important;
  cursor: pointer;
  transform: translate(-50%, -50%) !important;
  float: none !important;
  overflow: hidden !important;
  pointer-events: auto;
  z-index: 1;
}

#app.ui-telegram .tg-profile-hero .dm-profile__avatar,
#app.ui-telegram .tg-profile-hero .dm-profile__avatar.discord-avatar,
#app.ui-telegram #dmProfileAvatar {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: inherit !important;
  box-shadow: none !important;
  outline: none !important;
  overflow: hidden !important;
  font-size: calc(40px + 28px * var(--tg-expand)) !important;
  float: none !important;
  transform: none !important;
}

#app.ui-telegram .tg-profile-hero .dm-profile__avatar img,
#app.ui-telegram .tg-profile-hero .dm-profile__avatar .discord-avatar__img,
#app.ui-telegram .tg-profile-hero .dm-profile__avatar span,
#app.ui-telegram #dmProfileAvatar img,
#app.ui-telegram #dmProfileAvatar span {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: inherit !important;
  margin: 0 !important;
}

#app.ui-telegram .tg-profile-hero .dm-profile__avatar::after,
#app.ui-telegram #dmProfileAvatar::after {
  display: none !important;
  content: none !important;
}

#app.ui-telegram .tg-profile-hero .dm-profile__avatar > i,
#app.ui-telegram .tg-profile-hero .dm-profile__avatar i,
#app.ui-telegram #dmProfileAvatar > i,
#app.ui-telegram #dmProfileAvatar i {
  display: none !important;
}

#app.ui-telegram .tg-profile-text {
  position: absolute;
  z-index: 3;
  left: calc(50% * (1 - var(--tg-expand)) + 16px * var(--tg-expand));
  top: calc((50% + 73px) * (1 - var(--tg-expand)) + (100% - 62px) * var(--tg-expand));
  max-width: calc(100% - 32px);
  transform: translateX(calc(-50% * (1 - var(--tg-expand))));
  text-align: center;
  pointer-events: auto;
}

#app.ui-telegram .tg-profile-hero.is-expanded .tg-profile-text {
  text-align: left;
}

#app.ui-telegram .tg-profile-hero .dm-profile__nick,
#app.ui-telegram .tg-profile-identity .dm-profile__nick {
  display: block;
  width: auto;
  max-width: 100%;
  margin: 0 !important;
  color: #fff !important;
  font-size: calc(22px - 2px * var(--tg-expand)) !important;
  font-weight: 600 !important;
  line-height: 1.25;
  text-align: inherit !important;
  cursor: default;
  text-shadow: 0 1px 2px rgba(0, 0, 0, calc(0.35 * var(--tg-expand)));
}

#app.ui-telegram .tg-profile-hero .dm-profile__nick:hover {
  text-decoration: none !important;
}

#app.ui-telegram .tg-profile-status {
  width: auto;
  max-width: 100%;
  margin: 6px 0 0 !important;
  color: rgba(255, 255, 255, 0.78);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.3;
  text-align: inherit !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, calc(0.35 * var(--tg-expand)));
}

#app.ui-telegram .tg-profile-hero .dm-profile__about,
#app.ui-telegram .tg-profile-hero .dm-profile__since {
  display: none !important;
}

#app.ui-telegram .tg-info-head {
  display: flex;
  position: sticky;
  top: 0;
  z-index: 6;
  flex: 0 0 auto;
  align-items: center;
  gap: 2px;
  height: 56px;
  min-height: 56px;
  /* Keep hover circles inside --tg-float-radius so they are not clipped */
  padding: 0 20px 0 8px;
  background: #0f0f0f;
  color: var(--tg-text);
  border-bottom: none;
  transition: background 0.34s cubic-bezier(0.22, 0.82, 0.2, 1);
}

/* Expanded avatar — solid grey bar stays above the photo (photo does not fill under it) */
#app.ui-telegram .dm-profile.is-profile-expanded .tg-info-head {
  background: #212121;
}

#app.ui-telegram .tg-info-head__btn {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--tg-muted);
  cursor: pointer;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

#app.ui-telegram .tg-info-head__btn:hover {
  background: rgba(255, 255, 255, 0.08);
  color: var(--tg-text);
}

#app.ui-telegram .tg-info-head__btn svg {
  display: block;
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
  margin: 0;
}

#app.ui-telegram .tg-info-head__edit svg {
  width: 20px;
  height: 20px;
}

#app.ui-telegram .tg-info-head__title {
  flex: 1 1 auto;
  margin: 0;
  padding: 0 4px 0 2px;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.2;
  text-align: left;
}

#app.ui-telegram .tg-info-head__spacer {
  display: none;
}

#app.ui-telegram .tg-chat-extra {
  flex: 0 0 auto;
  padding: 12px 10px 0;
}

#app.ui-telegram .tg-chat-extra__card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 14px;
  background: var(--tg-sidebar);
}

#app.ui-telegram .tg-profile-friend-action {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  min-height: 52px;
  padding: 0 16px;
  border: 0;
  background: transparent;
  color: #a99af0;
  font-size: 15px;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
}

#app.ui-telegram .tg-profile-friend-action:hover {
  background: rgba(135, 116, 225, 0.1);
}

#app.ui-telegram .tg-profile-friend-action.hidden {
  display: none !important;
}

#app.ui-telegram .tg-profile-friend-action svg {
  flex: 0 0 26px;
  width: 26px;
  height: 26px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#app.ui-telegram .tg-profile-friend-action + .tg-list-item {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

#app.ui-telegram .tg-profile-meta {
  display: flex;
  flex-direction: column;
}

#app.ui-telegram .tg-profile-meta + .tg-profile-friend-action,
#app.ui-telegram .tg-profile-meta + .tg-list-item {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .tg-profile-meta .tg-settings-meta__row--bio .tg-settings-meta__value {
  margin: 0;
}

#app.ui-telegram .tg-list-item {
  display: flex;
  align-items: center;
  gap: 20px;
  width: 100%;
  margin: 0;
  padding: 14px 16px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--tg-text);
  text-align: left;
  cursor: pointer;
  box-sizing: border-box;
}

#app.ui-telegram .tg-list-item + .tg-list-item {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

#app.ui-telegram .tg-list-item--static {
  cursor: default;
}

#app.ui-telegram .tg-list-item--switch {
  cursor: pointer;
  min-height: 56px;
}

#app.ui-telegram .tg-list-item:hover {
  background: rgba(255, 255, 255, 0.04);
}

#app.ui-telegram .tg-list-item--static:hover {
  background: transparent;
}

#app.ui-telegram .tg-list-item__icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 28px;
  height: 28px;
  color: var(--tg-blue);
}

#app.ui-telegram .tg-list-item__icon svg {
  width: 24px;
  height: 24px;
}

#app.ui-telegram .tg-list-item__text {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

#app.ui-telegram .tg-list-item__title {
  color: var(--tg-text);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.3;
  word-break: break-word;
}

#app.ui-telegram .tg-list-item__title--single {
  line-height: 1.3;
  font-size: 16px;
}

#app.ui-telegram .tg-list-item__subtitle {
  color: #8a8a8a;
  font-size: 14px;
  line-height: 1.25;
}

#app.ui-telegram .tg-switch {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  width: 40px;
  height: 24px;
}

#app.ui-telegram .tg-switch input {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

#app.ui-telegram .tg-switch__track {
  position: relative;
  display: block;
  width: 40px;
  height: 24px;
  border-radius: 999px;
  background: #4e4e4e;
  transition: background 0.15s ease;
}

#app.ui-telegram .tg-switch__thumb {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
  transition: transform 0.15s ease;
}

#app.ui-telegram .tg-switch input:checked + .tg-switch__track {
  background: var(--tg-blue);
}

#app.ui-telegram .tg-switch input:checked + .tg-switch__track .tg-switch__thumb {
  transform: translateX(16px);
}

#app.ui-telegram .tg-shared-media {
  flex: 0 0 auto;
  min-height: 220px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 12px 10px 12px;
  overflow: hidden;
  background: transparent;
}

#app.ui-telegram .tg-shared-media.is-members-tab {
  min-height: 0;
  overflow: visible;
}

#app.ui-telegram .tg-shared-tabs {
  --tab-radius: 999px;
  flex: 0 0 auto;
  overflow: hidden;
  padding: 10px 8px;
  border-radius: 16px;
  background: #212121;
  overscroll-behavior: contain;
  touch-action: pan-x;
}

#app.ui-telegram .tg-shared-tabs::-webkit-scrollbar {
  display: none;
}

#app.ui-telegram .tg-shared-tabs__scroller {
  position: relative;
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  touch-action: pan-x;
}

#app.ui-telegram .tg-shared-tabs__scroller::-webkit-scrollbar {
  display: none;
}

#app.ui-telegram .tg-shared-tabs__row {
  display: flex;
  align-items: center;
  gap: 0;
  width: max-content;
  min-width: max-content;
}

#app.ui-telegram .tg-shared-tabs__tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  flex: 0 0 auto;
  min-width: auto;
  margin: 0;
  padding: 8px 14px;
  border: 0;
  border-radius: var(--tab-radius);
  background: transparent;
  color: #aaaaaa;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  font-family: inherit;
  -webkit-appearance: none;
  appearance: none;
}

#app.ui-telegram .dm-profile.is-group-profile .tg-shared-tabs__tab {
  padding: 8px 14px;
}

#app.ui-telegram .tg-shared-tabs__tab:hover {
  color: #fff;
}

#app.ui-telegram .tg-shared-tabs__tab.is-active {
  color: #c5b6f5;
  background: rgba(135, 116, 225, 0.22);
}

#app.ui-telegram .tg-shared-tabs__mask {
  display: none !important;
}

#app.ui-telegram .tg-shared-body {
  flex: 0 0 auto;
  min-height: 180px;
  display: flex;
  flex-direction: column;
  background: #0f0f0f;
  border-radius: 16px;
  overflow: hidden;
}

#app.ui-telegram .tg-shared-media.is-members-tab .tg-shared-body {
  min-height: 0;
  background: transparent;
  overflow: visible;
}

#app.ui-telegram .tg-shared-list {
  flex: 0 0 auto;
  min-height: 0;
  overflow: visible;
  overscroll-behavior: contain;
}

#app.ui-telegram .tg-shared-list--grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2px;
  padding: 2px;
  align-content: start;
}

#app.ui-telegram .tg-shared-list--rows {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 4px 0 8px;
}

#app.ui-telegram .tg-shared-tile {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 1;
  margin: 0;
  padding: 0;
  border: 0;
  overflow: hidden;
  background: #1a1a1a;
  cursor: pointer;
}

#app.ui-telegram .tg-shared-tile img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#app.ui-telegram .tg-shared-tile.is-video::after {
  content: "";
  position: absolute;
  right: 6px;
  bottom: 6px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 40% 50%, #fff 0 28%, transparent 29%),
    rgba(0, 0, 0, 0.45);
}

#app.ui-telegram .tg-shared-row {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 10px 14px;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  font: inherit;
}

#app.ui-telegram .tg-shared-row:hover {
  background: rgba(255, 255, 255, 0.04);
}

#app.ui-telegram .tg-shared-row__icon {
  flex: 0 0 40px;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(135, 116, 225, 0.16);
  color: #8774e1;
}

#app.ui-telegram .tg-shared-row__icon svg {
  width: 20px;
  height: 20px;
}

#app.ui-telegram .tg-shared-row__text {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

#app.ui-telegram .tg-shared-row__title {
  overflow: hidden;
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.25;
  white-space: nowrap;
  text-overflow: ellipsis;
}

#app.ui-telegram .tg-shared-row__sub {
  overflow: hidden;
  color: #707579;
  font-size: 13px;
  line-height: 1.25;
  white-space: nowrap;
  text-overflow: ellipsis;
}

#app.ui-telegram .tg-shared-spinner {
  width: 42px;
  height: 42px;
  margin: auto;
  border: 3px solid rgba(135, 116, 225, 0.22);
  border-top-color: #8774e1;
  border-radius: 50%;
  animation: tg-shared-spin 0.75s linear infinite;
}

#app.ui-telegram .tg-shared-spinner.hidden {
  display: none !important;
}

@keyframes tg-shared-spin {
  to {
    transform: rotate(360deg);
  }
}

#app.ui-telegram .tg-shared-empty {
  flex: 1 1 auto;
  display: grid;
  place-items: center;
  max-width: none;
  min-height: 180px;
  padding: 24px 16px;
  color: #707579;
  font-size: 15px;
  line-height: 1.35;
  text-align: center;
}

#app.ui-telegram .tg-shared-empty.hidden {
  display: none !important;
}

.tg-shared-ctx {
  position: fixed;
  z-index: 240;
  display: flex;
  padding: 4px;
  border-radius: 999px;
  background: rgba(33, 33, 33, 0.96);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.55);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.tg-shared-ctx.hidden,
.tg-shared-ctx[hidden] {
  display: none !important;
}

.tg-shared-ctx__btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 10px 16px 10px 12px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #fff;
  font: 500 14px/1.2 inherit;
  white-space: nowrap;
  cursor: pointer;
}

.tg-shared-ctx__btn:hover {
  background: rgba(255, 255, 255, 0.06);
}

.tg-shared-ctx__icon {
  display: inline-flex;
  width: 20px;
  height: 20px;
  color: #d7d7d7;
  flex: 0 0 auto;
}

.tg-shared-ctx__icon svg {
  display: block;
  width: 20px;
  height: 20px;
}

.tg-shared-ctx__label {
  color: #fff;
}

#app.ui-telegram .dm-profile__footer {
  display: none !important;
}

#app.ui-telegram .discord-chat {
  position: relative;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: minmax(0, 1fr) !important;
  min-width: 0;
  min-height: 0;
  margin-right: 0 !important;
  overflow: hidden;
  background: transparent !important;
  box-shadow: none !important;
}

/* Header like TG MiddleHeader: align top with left sidebar header (56px) */
#app.ui-telegram .discord-header {
  position: absolute;
  top: var(--tg-header-top);
  left: 16px;
  right: 16px;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex: 0 0 auto;
  width: auto;
  max-width: var(--tg-middle-column-width);
  min-height: var(--tg-header-h);
  height: var(--tg-header-h);
  margin: 0 auto !important;
  padding: 0 10px 0 8px;
  border: none !important;
  border-bottom: none !important;
  border-radius: 28px;
  background: var(--tg-header) !important;
  box-shadow:
    0 1px 2px rgba(0, 0, 0, 0.22),
    0 2px 10px rgba(0, 0, 0, 0.28);
  box-sizing: border-box;
  transform: none;
  pointer-events: none;
  overflow: visible;
}

#app.ui-telegram .discord-header > * {
  pointer-events: auto;
}

#app.ui-telegram .discord-header__channel {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex: 1 1 auto;
  align-self: center;
  height: auto;
  max-height: 100%;
  margin: 0;
  padding: 4px 8px 4px 0;
  border-radius: 28px 0 0 28px;
  box-sizing: border-box;
  overflow: visible;
}

#app.ui-telegram .discord-header__channel .hash,
#app.ui-telegram .discord-header__channel .header-bullet,
#app.ui-telegram .discord-header__channel #channelDivider {
  display: none !important;
}

#app.ui-telegram .discord-header__channel.is-dm-peer,
#app.ui-telegram .discord-header__channel.is-group {
  cursor: pointer;
  margin: 0 !important;
  padding: 0 8px 0 0px !important;
  border-radius: 25px 0 0 25px !important;
  background: transparent !important;
}

#app.ui-telegram .discord-header__channel.is-group:hover {
  background: transparent !important;
}

#app.ui-telegram .discord-header__channel #dmHeaderAvatar,
#app.ui-telegram .header-avatar,
#app.ui-telegram #dmHeaderAvatar {
  flex: 0 0 44px !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
  margin: 0 !important;
  margin-left: -1px !important;
  align-self: center !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  border-radius: 50% !important;
  font-size: 15px !important;
}

#app.ui-telegram .discord-header__channel #dmHeaderAvatar.hidden {
  display: none !important;
}

#app.ui-telegram .discord-header__info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-self: center;
  gap: 0;
  min-width: 0;
  flex: 1 1 auto;
  padding: 0;
  overflow: visible;
}

#app.ui-telegram .discord-header__title-wrap {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  line-height: 1.2;
}

#app.ui-telegram .discord-header__edit {
  display: none !important;
}

#app.ui-telegram .discord-header__title,
#app.ui-telegram .discord-header strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--tg-text);
  font-size: 16px;
  font-weight: 600;
  /* line-height > font-size so overflow:hidden doesn't clip glyph tops */
  line-height: 24px;
  margin: 0;
  padding: 0;
}

#app.ui-telegram .discord-header__channel #channelTopic,
#app.ui-telegram .discord-header__info > #channelTopic {
  display: block !important;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--tg-muted);
  font-size: 13px;
  line-height: 18px;
  margin: 0;
  padding: 0;
}

#app.ui-telegram .discord-header__channel #channelTopic.hidden,
#app.ui-telegram .discord-header__info > #channelTopic.hidden {
  display: none !important;
}

#app.ui-telegram .discord-header__actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 2px;
  height: 100%;
  margin: 0;
  padding: 0;
  transform: none !important;
}

#app.ui-telegram .discord-header__actions .members-toggle-btn {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  margin: 0;
  padding: 0;
  border-radius: 50%;
  color: var(--tg-muted);
  line-height: 0;
}

#app.ui-telegram .discord-header__actions .members-toggle-btn:hover {
  background: rgba(255, 255, 255, 0.08);
  color: var(--tg-text);
}

#app.ui-telegram #addFriendsToDmBtn,
#app.ui-telegram .invite-group-btn {
  display: none !important;
}

/* Messages fill the pane; wallpaper comes from .chat-view behind. */
#app.ui-telegram .messages,
#app.ui-telegram #messages.discord-messages {
  flex: none;
  min-height: 0;
  padding: var(--tg-sticky-date-top) 0 var(--tg-composer-clearance, 80px);
  background-color: transparent !important;
  background-image: none !important;
}

#app.ui-telegram .date-separator {
  justify-content: center;
  gap: 0;
  margin: 14px 0 16px;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  cursor: default;
  user-select: none;
  pointer-events: none;
}

#app.ui-telegram .date-separator::before,
#app.ui-telegram .date-separator::after {
  display: none;
}

#app.ui-telegram .date-separator span,
#app.ui-telegram .date-separator__chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 5px 12px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.45);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #fff;
  opacity: 1;
  font-weight: 700;
  font-size: 13px;
  line-height: 18px;
  -webkit-font-smoothing: antialiased;
  box-sizing: border-box;
  cursor: pointer;
  pointer-events: auto;
}

#app.ui-telegram .dm-welcome:not(.dm-welcome--official):not(.dm-welcome--empty) {
  display: none !important;
}

#app.ui-telegram #messages.discord-messages.has-dm-empty-hint {
  justify-content: center;
}

#app.ui-telegram #messages.discord-messages.has-dm-empty-hint::before {
  display: none !important;
}

#app.ui-telegram .dm-welcome--empty {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: min(100%, var(--tg-middle-column-width));
  margin: 0 auto;
  padding: 0 24px !important;
  box-sizing: border-box;
  pointer-events: none;
  animation: tg-dm-empty-in 0.34s cubic-bezier(0.22, 0.82, 0.2, 1) both;
}

@keyframes tg-dm-empty-in {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

#app.ui-telegram .dm-welcome__empty-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: min(100%, 320px);
  margin: 0;
  padding: 28px 28px 24px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 24px;
  background:
    linear-gradient(165deg, rgba(135, 116, 225, 0.12) 0%, rgba(18, 18, 18, 0.62) 52%),
    rgba(20, 20, 20, 0.72);
  box-shadow:
    0 24px 48px rgba(0, 0, 0, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.07);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  text-align: center;
}

#app.ui-telegram .dm-welcome__empty-wave {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  flex: 0 0 56px;
  margin: 0 0 2px;
  border-radius: 50%;
  background: rgba(94, 181, 247, 0.14);
  font-size: 28px;
  line-height: 1;
  transform-origin: 70% 70%;
  animation: tg-dm-empty-wave 2.2s ease-in-out infinite;
}

@keyframes tg-dm-empty-wave {
  0%,
  100% {
    transform: rotate(0deg);
  }

  20% {
    transform: rotate(16deg);
  }

  40% {
    transform: rotate(-8deg);
  }

  60% {
    transform: rotate(12deg);
  }

  80% {
    transform: rotate(-4deg);
  }
}

#app.ui-telegram .dm-welcome__empty-name {
  margin: 0;
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.01em;
}

#app.ui-telegram .dm-welcome__empty-hint {
  margin: 2px 0 0;
  padding: 9px 18px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.05);
  color: rgba(255, 255, 255, 0.74);
  font-size: 14px;
  line-height: 1.35;
  letter-spacing: 0.01em;
}

#app.ui-telegram .dm-welcome {
  color: var(--tg-muted);
}

#app.ui-telegram .dm-welcome--official {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start;
  gap: 0;
  width: 100%;
  max-width: min(100%, var(--tg-middle-column-width));
  margin: 0 auto;
  padding: 56px 24px 36px;
  box-sizing: border-box;
  text-align: center !important;
}

#app.ui-telegram .dm-welcome--official .dm-welcome__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: min(360px, 100%);
  padding: 28px 22px 24px;
  border-radius: 16px;
  background: rgba(0, 0, 0, 0.58);
  box-sizing: border-box;
}

#app.ui-telegram .dm-welcome--official .dm-welcome__avatar--official {
  width: 96px;
  height: 96px;
  margin: 0 0 14px;
}

#app.ui-telegram .dm-welcome--official .dm-welcome__name {
  margin: 0 0 10px;
  color: #fff;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.15;
  text-align: center;
}

#app.ui-telegram .dm-welcome--official .dm-welcome__text {
  margin: 0;
  width: auto;
  max-width: none;
  padding: 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 15px;
  line-height: 1.45;
  text-align: center;
}

#app.ui-telegram .dm-welcome--official .dm-welcome__text--notice {
  margin-top: 10px;
  color: rgba(255, 255, 255, 0.55);
  font-size: 14px;
}

/* TG: notice is already in the welcome block — don't float a second copy */
#app.ui-telegram .official-composer-notice {
  display: none !important;
}

/* Bubbles — full-width hit row to left panel; bubble stays in middle column */
#app.ui-telegram .discord-message {
  position: relative;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  justify-items: start;
  column-gap: 0 !important;
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  margin: 3px 0;
  /* Keep bubbles clear of the edge scrollbar */
  padding: 1px max(8px, calc((100% - var(--tg-middle-column-width)) / 2)) !important;
  padding-right: max(8px, calc((100% - var(--tg-middle-column-width)) / 2)) !important;
  border-radius: 0;
  background: transparent !important;
  box-shadow: none !important;
}

#app.ui-telegram .discord-message:hover {
  background: transparent !important;
}

#app.ui-telegram .discord-message.is-compact {
  margin-top: 2px;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  border-radius: 0;
}

#app.ui-telegram .discord-message:not(.is-compact) {
  margin-top: 8px;
}

#app.ui-telegram .discord-message.is-me {
  justify-items: end;
  margin-left: 0;
  margin-right: 0;
  border-radius: 0;
  background: transparent !important;
}

#app.ui-telegram .discord-message.is-me.is-compact {
  border-radius: 0;
}

#app.ui-telegram .discord-message.is-me:hover {
  background: transparent !important;
}

#app.ui-telegram .discord-message__avatar,
#app.ui-telegram .discord-message.is-compact .discord-message__avatar {
  display: none !important;
}

/*
 * Group peers + bubble width (permanent fix).
 * Do NOT use max-width: % on fit-content bubbles inside minmax(0,1fr):
 * circular % basis collapses width to ~1 glyph (vertical SOS/да/лол).
 *
 * Avatar gutter: ALWAYS keep a 40px column. Never display:none the avatar —
 * that removes it from the grid and shifts the bubble left (unlike Telegram,
 * where every bubble in a cluster stays aligned and only the last shows photo).
 */
#app.ui-telegram .discord-message.is-tg-group-peer {
  grid-template-columns: 40px minmax(0, 1fr) !important;
  column-gap: 8px !important;
  align-items: end;
  justify-items: start;
}

#app.ui-telegram .discord-message.is-tg-group-peer > .discord-message__toolbar {
  grid-column: 1 / -1;
}

#app.ui-telegram .discord-message.is-tg-group-peer > .discord-message__avatar {
  grid-column: 1;
  display: grid !important;
  visibility: hidden;
  pointer-events: none;
  width: 36px;
  height: 36px;
  margin: 0 0 1px;
  place-self: end start;
  overflow: hidden;
  border-radius: 50%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  font-size: 13px;
}

#app.ui-telegram .discord-message.is-tg-group-peer.is-cluster-end > .discord-message__avatar {
  visibility: visible;
  pointer-events: auto;
}

#app.ui-telegram
  .discord-message.is-tg-group-peer.is-compact:not(.is-cluster-end)
  > .discord-message__avatar {
  /* Keep slot size; hide photo (visibility already hidden) */
  background: transparent !important;
}

#app.ui-telegram
  .discord-message.is-tg-group-peer.is-cluster-end.is-compact
  > .discord-message__avatar {
  height: 36px;
  border-radius: 50%;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

#app.ui-telegram .discord-message.is-tg-group-peer .discord-message__compact-time {
  display: none !important;
}

#app.ui-telegram .discord-message.is-tg-group-peer > .discord-message__content {
  grid-column: 2;
  justify-self: start;
  max-width: min(400px, 68vw) !important;
  min-width: 72px !important;
}

#app.ui-telegram .discord-message__content {
  position: relative;
  display: inline-flex !important;
  flex-direction: column;
  box-sizing: border-box;
  width: max-content !important;
  max-width: min(420px, 72vw) !important;
  min-width: 56px !important;
  gap: 0;
  padding: 6px 10px 4px;
  border-radius: 14px 14px 14px 4px;
  background: var(--tg-bubble);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.18);
  color: var(--tg-text);
  font-size: 15px;
  line-height: 1.35;
  word-break: normal !important;
  overflow-wrap: anywhere;
  justify-self: start;
}

#app.ui-telegram .discord-message.is-me .discord-message__content {
  border-radius: 14px 14px 4px 14px;
  background: var(--tg-bubble-me);
  justify-self: end;
  min-width: 64px !important;
}

#app.ui-telegram .discord-message.is-compact .discord-message__content {
  padding-top: 5px;
  padding-bottom: 4px;
  border-radius: 14px 14px 14px 4px;
}

#app.ui-telegram .discord-message.is-me.is-compact .discord-message__content {
  border-radius: 14px 14px 4px 14px;
}

#app.ui-telegram .discord-message__body {
  position: relative;
  width: auto;
  max-width: 100%;
  min-width: auto;
  padding-bottom: 2px;
}

#app.ui-telegram .discord-message__header {
  margin: 0 0 2px;
}

#app.ui-telegram .discord-message.is-me .discord-message__header,
#app.ui-telegram .discord-message.is-compact .discord-message__header {
  display: none;
}

#app.ui-telegram .discord-message__nick {
  color: var(--tg-blue);
  font-size: 14px;
  font-weight: 400;
  white-space: nowrap;
}

#app.ui-telegram .discord-message.is-tg-group-peer .discord-message__nick {
  color: var(--tg-peer-name, var(--tg-blue));
}

#app.ui-telegram .discord-message__nick--link,
#app.ui-telegram .discord-message__nick--link:hover,
#app.ui-telegram .discord-system-message__nick.discord-message__nick--link,
#app.ui-telegram .discord-system-message__nick.discord-message__nick--link:hover {
  color: inherit;
  text-decoration: none !important;
  text-underline-offset: 0;
}

#app.ui-telegram .discord-message__time:not(.discord-message__time--inline) {
  display: none !important;
}

#app.ui-telegram .discord-message__time--inline {
  display: inline-block;
  float: right;
  margin: 4px 0 0 10px;
  color: rgba(255, 255, 255, 0.55);
  font-size: 11px;
  font-weight: 400;
  line-height: 1.2;
  white-space: nowrap;
  user-select: none;
}

#app.ui-telegram .discord-message.is-me .discord-message__time--inline {
  color: rgba(255, 255, 255, 0.55);
}

#app.ui-telegram .discord-message__text {
  color: var(--tg-text);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.35;
  word-break: normal !important;
  overflow-wrap: anywhere;
}

#app.ui-telegram .discord-message__toolbar {
  display: none !important;
}

/* Keep ПКМ menu measurable/visible while Discord toolbar stays hidden */
#app.ui-telegram .discord-message.is-actions-open > .discord-message__toolbar {
  display: block !important;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 220;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
  pointer-events: none;
}

#app.ui-telegram .discord-message.is-actions-open .discord-message__toolbar-btn,
#app.ui-telegram .discord-message.is-actions-open .discord-message__toolbar-sep {
  display: none !important;
}

#app.ui-telegram .discord-message.is-actions-open .discord-message__toolbar-more {
  display: block;
  position: static;
  width: 0;
  height: 0;
  pointer-events: none;
}

#app.ui-telegram .discord-message.is-actions-open .discord-message__menu:not(.hidden) {
  display: flex !important;
  pointer-events: auto;
}

#app.ui-telegram .discord-message__menu {
  min-width: 220px;
  max-width: min(280px, calc(100vw - 24px));
  padding: 6px 0;
  border: 0;
  border-radius: 12px;
  background: #1c1c1c;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.06),
    0 12px 28px rgba(0, 0, 0, 0.55);
}

#app.ui-telegram .discord-message__menu-item {
  gap: 14px;
  min-height: 40px;
  padding: 10px 16px;
  border-radius: 0;
  color: #fff;
  font: 500 15px/1.2 "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

#app.ui-telegram .discord-message__menu-item:hover {
  background: rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .discord-message__menu-item.is-danger {
  color: #ff6b6b;
}

#app.ui-telegram .discord-message__menu-item.is-danger:hover {
  background: rgba(255, 107, 107, 0.1);
}

#app.ui-telegram .discord-message__menu-icon {
  width: 22px;
  height: 22px;
  color: inherit;
}

#app.ui-telegram .discord-message__menu-sep {
  height: 1px;
  margin: 4px 12px;
  background: rgba(255, 255, 255, 0.08);
}

#app.ui-telegram .discord-message__link {
  color: var(--tg-links);
}

#app.ui-telegram .discord-message.is-me .discord-message__link {
  color: #fff;
  text-decoration: underline;
}

#app.ui-telegram .discord-message__forward {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0 0 2px;
  padding: 0;
  border: 0;
}

#app.ui-telegram .discord-message__forward--tg .discord-message__forward-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  color: rgba(255, 255, 255, 0.95);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.25;
}

#app.ui-telegram .discord-message__forward--tg .discord-message__forward-icon {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  color: rgba(255, 255, 255, 0.95);
}

#app.ui-telegram .discord-message__forward--tg .discord-message__forward-label {
  color: inherit;
  font-size: inherit;
  font-weight: 500;
}

#app.ui-telegram .discord-message__forward--tg .discord-message__forward-avatar {
  display: grid;
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  place-items: center;
  overflow: hidden;
  border-radius: 50%;
  color: #fff;
  font-size: 8px;
  font-weight: 700;
}

#app.ui-telegram .discord-message__forward--tg .discord-message__forward-name {
  color: inherit;
  font-size: inherit;
  font-weight: 600;
}

#app.ui-telegram .discord-message:not(.is-me) .discord-message__forward--tg .discord-message__forward-header {
  color: var(--tg-blue);
}

#app.ui-telegram .discord-message:not(.is-me) .discord-message__forward--tg .discord-message__forward-icon {
  color: var(--tg-blue);
}

#app.ui-telegram .composer-reply-preview.is-forward .composer-reply-preview__icon--forward {
  color: #e7a06a;
}

#app.ui-telegram .composer-reply-preview__icon--forward[hidden],
#app.ui-telegram .composer-reply-preview__icon--reply[hidden] {
  display: none !important;
}

/* Forward recipients modal — Telegram
   Modal lives outside #app, so use .is-tg-forward (set in JS). */
#forwardMessageModal.is-tg-forward.modal-backdrop {
  display: grid !important;
  place-items: center;
  align-items: stretch;
  justify-content: stretch;
  padding: 0;
  background: rgba(0, 0, 0, 0.55);
  backdrop-filter: none;
}

#forwardMessageModal.is-tg-forward.modal-backdrop.hidden {
  display: none !important;
}

#forwardMessageModal.is-tg-forward .forward-message-modal,
#forwardMessageModal.is-tg-forward .invite-modal {
  position: relative;
  display: flex !important;
  flex-direction: column;
  width: min(100%, 420px) !important;
  max-width: 100%;
  height: min(100%, 720px);
  max-height: min(100vh, 720px) !important;
  margin: auto;
  padding: 0 !important;
  border: 0;
  border-radius: 16px;
  background: #212121 !important;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.45);
  overflow: hidden;
}

#forwardMessageModal.is-tg-forward .invite-modal__close {
  position: absolute;
  top: 10px;
  left: 10px;
  right: auto;
  z-index: 2;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: transparent;
  color: #aaa;
  font-size: 22px;
  line-height: 1;
}

#forwardMessageModal.is-tg-forward .invite-modal__title {
  margin: 0 !important;
  padding: 16px 48px 10px !important;
  color: #fff;
  font: 600 18px/1.25 "Segoe UI", "Helvetica Neue", Arial, sans-serif !important;
  text-align: center;
}

#forwardMessageModal.is-tg-forward .invite-modal__sub {
  display: none !important;
}

#forwardMessageModal.is-tg-forward .forward-message-modal__search {
  margin: 0 14px 8px;
}

#forwardMessageModal.is-tg-forward .forward-message-modal__search-icon {
  color: #8a8a8a;
}

#forwardMessageModal.is-tg-forward .forward-message-modal__search input,
#forwardMessageModal.is-tg-forward .invite-modal__search input {
  height: 40px !important;
  padding: 0 14px 0 40px !important;
  border: 0 !important;
  border-radius: 22px !important;
  outline: none !important;
  box-shadow: none !important;
  background: #181818 !important;
  color: #fff !important;
  font-size: 15px !important;
}

#forwardMessageModal.is-tg-forward .forward-message-modal__search input:focus,
#forwardMessageModal.is-tg-forward .invite-modal__search input:focus {
  border: 0 !important;
  box-shadow: 0 0 0 2px rgba(135, 116, 225, 0.55) !important;
  background: #181818 !important;
}

#forwardMessageModal.is-tg-forward .forward-message-modal__search input::placeholder {
  color: #8a8a8a;
}

#forwardMessageModal.is-tg-forward .invite-modal__list {
  flex: 1;
  max-height: none !important;
  margin: 0 !important;
  padding: 4px 0 8px !important;
  overflow: auto;
}

#forwardMessageModal.is-tg-forward .forward-target {
  gap: 12px;
  min-height: 64px;
  padding: 8px 16px !important;
  border-radius: 0 !important;
  background: transparent !important;
}

#forwardMessageModal.is-tg-forward .forward-target:hover {
  background: rgba(255, 255, 255, 0.04) !important;
}

#forwardMessageModal.is-tg-forward .forward-target__avatar {
  width: 48px;
  height: 48px;
  flex-basis: 48px;
  font-size: 18px;
}

#forwardMessageModal.is-tg-forward .forward-target__title {
  color: #fff;
  font-size: 16px;
  font-weight: 500;
}

#forwardMessageModal.is-tg-forward .forward-target__sub {
  color: #8a8a8a;
  font-size: 14px;
}

#forwardMessageModal.is-tg-forward .forward-target__arrow {
  display: none !important;
}

#forwardMessageModal.is-tg-forward .forward-target__check {
  display: grid !important;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  place-items: center;
  margin-left: auto;
  border: 2px solid #5a5a5a;
  border-radius: 50%;
  color: transparent;
  background: transparent;
  box-sizing: border-box;
}

#forwardMessageModal.is-tg-forward .forward-target__check svg {
  width: 14px;
  height: 14px;
  opacity: 0;
}

#forwardMessageModal.is-tg-forward .forward-target.is-selected .forward-target__check {
  border-color: var(--tg-blue, #8774e1);
  background: var(--tg-blue, #8774e1);
  color: #fff;
}

#forwardMessageModal.is-tg-forward .forward-target.is-selected .forward-target__check svg {
  opacity: 1;
}

#forwardMessageModal.is-tg-forward .forward-message-modal__footer {
  display: block !important;
  flex: 0 0 auto;
  padding: 10px 16px calc(12px + env(safe-area-inset-bottom, 0px));
  background: #212121;
}

#forwardMessageModal.is-tg-forward .forward-message-modal__submit {
  display: block;
  width: 100%;
  min-height: 48px;
  border: 0;
  border-radius: 12px;
  background: var(--tg-blue, #8774e1);
  color: #fff;
  font: 600 15px/1.2 "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  cursor: pointer;
}

#forwardMessageModal.is-tg-forward .forward-message-modal__submit:disabled {
  opacity: 0.45;
  cursor: default;
}

/* TG: flash full message row (not only bubble) for ~2s */
#app.ui-telegram .discord-message.is-search-jump {
  position: relative;
  animation: none;
  background: transparent !important;
  isolation: isolate;
}

#app.ui-telegram .discord-message.is-search-jump::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 6;
  pointer-events: none;
  background: rgba(0, 0, 0, 0.5);
  animation: tg-msg-jump-flash 2s ease forwards;
}

@keyframes tg-msg-jump-flash {
  0% {
    opacity: 0;
  }
  12% {
    opacity: 1;
  }
  55% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

#app.ui-telegram .discord-message__reply {
  display: block;
  justify-self: stretch;
  width: 100%;
  max-width: none;
  margin: 0 0 6px;
  padding: 0;
  color: inherit;
  font-size: inherit;
  line-height: inherit;
}

#app.ui-telegram .discord-message.is-me .discord-message__reply {
  justify-self: stretch;
}

#app.ui-telegram .discord-message__reply-spine {
  display: none;
}

#app.ui-telegram .discord-message__reply-avatar {
  display: none !important;
}

#app.ui-telegram .discord-message__reply-bar {
  display: flex;
  width: 100%;
  align-items: stretch;
  gap: 0;
  margin: 0;
  padding: 4px 8px 4px 0;
  border: 0;
  border-radius: 6px;
  background: rgba(0, 0, 0, 0.18);
  text-align: left;
  cursor: pointer;
}

#app.ui-telegram .discord-message__reply-bar::before {
  content: "";
  flex: 0 0 2px;
  align-self: stretch;
  margin: 0 8px 0 0;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.85);
}

#app.ui-telegram .discord-message:not(.is-me) .discord-message__reply-bar::before {
  background: var(--tg-blue);
}

#app.ui-telegram .discord-message__reply-meta {
  display: flex;
  min-width: 0;
  flex: 1;
  flex-direction: column;
  gap: 1px;
  overflow: hidden;
}

#app.ui-telegram .discord-message__reply-nick {
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.25;
}

#app.ui-telegram .discord-message__reply-nick::before {
  content: none;
}

#app.ui-telegram .discord-message:not(.is-me) .discord-message__reply-nick {
  color: var(--tg-blue);
}

#app.ui-telegram .discord-message__reply-text {
  color: rgba(255, 255, 255, 0.92);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.3;
  white-space: normal;
  text-overflow: unset;
  overflow: visible;
  word-break: break-word;
}

#app.ui-telegram .discord-message__reply-nick:hover,
#app.ui-telegram .discord-message__reply-bar:hover .discord-message__reply-text {
  text-decoration: none;
}

/* Reply bubble: hug content (no forced 220px min-width for short quotes) */
#app.ui-telegram .discord-message.is-me .discord-message__content:has(.discord-message__reply),
#app.ui-telegram .discord-message__content:has(.discord-message__reply) {
  min-width: 72px !important;
}

/* Composer reply — Telegram Web A embedded preview */
#app.ui-telegram .discord-composer.has-reply {
  gap: 0;
}

#app.ui-telegram .discord-composer.has-reply .composer-reply-preview {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin: 0;
  padding: 8px 10px 6px 8px;
  border: 0;
  border-radius: 24px 24px 0 0;
  background: #1c1c1c;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.04),
    0 1px 2px rgba(0, 0, 0, 0.24);
  box-sizing: border-box;
}

#app.ui-telegram .composer-reply-preview__discord {
  display: none;
}

#app.ui-telegram .composer-reply-preview__telegram {
  display: flex;
  min-width: 0;
  flex: 1;
  align-items: center;
  gap: 8px;
}

#app.ui-telegram .discord-composer.has-reply .discord-composer__row {
  border-radius: 0 0 24px 24px;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.04),
    0 1px 2px rgba(0, 0, 0, 0.24);
}

#app.ui-telegram .composer-reply-preview__icon {
  color: #e7a06a;
}

#app.ui-telegram .composer-reply-preview__body {
  border-left-color: #e7a06a;
  padding-left: 8px;
}

#app.ui-telegram .composer-reply-preview__name {
  color: #e7a06a;
  font-size: 14px;
}

#app.ui-telegram .composer-reply-preview__text {
  color: #fff;
  font-size: 14px;
}

#app.ui-telegram .composer-reply-preview__close {
  width: 32px;
  height: 32px;
  flex-basis: 32px;
  color: #e7a06a;
}

#app.ui-telegram .composer-reply-preview__close:hover {
  color: #ffc08a;
  background: rgba(255, 255, 255, 0.06);
}

/* Composer — TG Web A: pill + mic, same height, centered icons. */
#app.ui-telegram .discord-composer {
  position: absolute;
  left: 50%;
  bottom: 0;
  z-index: 6;
  display: flex;
  flex-direction: column;
  width: min(100%, var(--tg-middle-column-width));
  margin: 0 !important;
  /* Bottom matches left panel float gap so pill aligns with sidebar edge */
  padding: 6px 0 var(--tg-float-gap) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: translateX(-50%);
  box-sizing: border-box;
  pointer-events: none;
}

#app.ui-telegram .discord-composer > * {
  pointer-events: auto;
}

#app.ui-telegram .scroll-to-bottom-host {
  left: 50%;
  right: auto;
  bottom: calc(var(--tg-composer-clearance, 88px) - 2px);
  width: min(100%, var(--tg-middle-column-width));
  padding: 0;
  box-sizing: border-box;
  transform: translateX(-50%);
  z-index: 7;
}

#app.ui-telegram .scroll-to-bottom {
  background: rgba(33, 33, 33, 0.88);
  color: #cfcfcf;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow:
    0 1px 2px rgba(0, 0, 0, 0.35),
    0 0 0 1px rgba(255, 255, 255, 0.04);
}

#app.ui-telegram .scroll-to-bottom:hover {
  background: rgba(48, 48, 48, 0.95);
  color: #fff;
}

#app.ui-telegram .scroll-to-bottom svg {
  width: 22px;
  height: 22px;
}

#app.ui-telegram .discord-composer__row {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0;
  width: 100%;
  min-height: 48px;
  padding: 4px 4px 4px 46px;
  border-radius: 24px;
  background: var(--tg-input);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.04),
    0 1px 2px rgba(0, 0, 0, 0.24);
  cursor: default;
  box-sizing: border-box;
}

#app.ui-telegram .discord-composer__attach {
  position: absolute;
  top: 50%;
  left: 5px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  margin: 0;
  transform: translateY(-50%);
}

#app.ui-telegram .composer-add-icon--plus {
  display: none !important;
}

#app.ui-telegram .composer-add-icon--clip {
  display: block !important;
  width: 31px;
  height: 31px;
  transform: rotate(22deg);
  transform-origin: center;
}

#app.ui-telegram .discord-composer__add {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--tg-muted);
  line-height: 0;
}

#app.ui-telegram .discord-composer__add svg {
  display: block;
}

#app.ui-telegram .discord-composer__add:hover,
#app.ui-telegram .discord-composer__attach.is-open .discord-composer__add {
  background: rgba(255, 255, 255, 0.06);
  color: var(--tg-blue);
}

/* Attach menu — Telegram Web A style */
#app.ui-telegram .composer-attach-menu {
  left: 0;
  bottom: calc(100% + 10px);
  min-width: 220px;
  padding: 6px 0;
  border: 0;
  border-radius: 14px;
  background: #2c2c2c;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.04),
    0 10px 28px rgba(0, 0, 0, 0.45);
  transform-origin: 18px 100%;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

#app.ui-telegram .composer-attach-menu.is-open {
  visibility: visible;
  pointer-events: auto;
}

/* Bridge the gap so hover doesn't flicker when moving to the menu */
#app.ui-telegram .composer-attach-menu::before {
  content: '';
  position: absolute;
  left: -8px;
  right: -8px;
  top: 100%;
  height: 18px;
}

#app.ui-telegram .composer-attach-menu__item--discord {
  display: none !important;
}

#app.ui-telegram .composer-attach-menu__item--tg {
  display: flex;
}

#app.ui-telegram .composer-attach-menu__item {
  gap: 16px;
  min-height: 48px;
  padding: 10px 18px;
  border-radius: 0;
  color: #fff;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.25;
}

#app.ui-telegram .composer-attach-menu__item:hover {
  background: rgba(255, 255, 255, 0.06);
  color: #fff;
}

#app.ui-telegram .composer-attach-menu__icon {
  width: 24px;
  height: 24px;
  color: rgba(255, 255, 255, 0.72);
}

#app.ui-telegram .composer-attach-menu__icon svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
}

#app.ui-telegram .composer-attach-menu__label {
  flex: 1;
  min-width: 0;
}

#app.ui-telegram .discord-composer__field {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  gap: 0;
  min-width: 0;
  min-height: 40px;
  padding: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

#app.ui-telegram .discord-composer__field textarea,
#app.ui-telegram .discord-composer input {
  flex: 1 1 auto;
  align-self: center;
  min-width: 0;
  height: 40px;
  min-height: 40px;
  max-height: min(40vh, 280px);
  margin: 0;
  padding: 10px 4px;
  border: 0;
  box-sizing: border-box;
  color: var(--tg-text) !important;
  background: transparent !important;
  font-size: 15px;
  line-height: 20px;
  resize: none;
  /* Keep sizing stable; JS owns multi-line height. Switching field-sizing on first
     character used to bump composer clearance and nudge the chat down. */
  field-sizing: fixed;
}

#app.ui-telegram .discord-composer__field textarea::placeholder,
#app.ui-telegram .discord-composer input::placeholder {
  color: var(--tg-muted);
}

#app.ui-telegram .discord-composer__tools {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  align-self: center;
  margin: 0;
}

#app.ui-telegram .discord-composer__emoji {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: var(--tg-muted);
  line-height: 0;
}

#app.ui-telegram .discord-composer__emoji svg {
  display: block;
  width: 27px;
  height: 27px;
}

#app.ui-telegram .discord-composer__emoji:hover,
#app.ui-telegram .discord-composer__emoji[aria-expanded='true'] {
  color: var(--tg-blue);
  background: rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .tg-composer-action {
  position: relative;
  display: grid !important;
  place-items: center;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  margin: 0 0 0 2px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--tg-blue);
  color: #fff;
  line-height: 0;
  cursor: pointer;
  box-shadow: none;
  overflow: hidden;
  isolation: isolate;
}

#app.ui-telegram .tg-composer-action[hidden] {
  display: grid !important;
}

#app.ui-telegram .tg-composer-action:hover {
  filter: brightness(1.06);
}

#app.ui-telegram .tg-composer-action__icon {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  transition:
    opacity 0.28s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.34s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: opacity, transform;
  pointer-events: none;
}

#app.ui-telegram .tg-composer-action__icon svg {
  display: block;
  width: 22px;
  height: 22px;
}

#app.ui-telegram .tg-composer-action__icon--mic {
  opacity: 1;
  transform: scale(1) rotate(0deg);
  z-index: 1;
}

#app.ui-telegram .tg-composer-action__icon--send {
  opacity: 0;
  transform: scale(0.35) rotate(-55deg);
  z-index: 2;
}

#app.ui-telegram .tg-composer-action.is-send .tg-composer-action__icon--mic {
  opacity: 0;
  transform: scale(0.35) rotate(45deg);
}

#app.ui-telegram .tg-composer-action.is-send .tg-composer-action__icon--send {
  opacity: 1;
  transform: scale(1) rotate(0deg);
}

@media (prefers-reduced-motion: reduce) {
  #app.ui-telegram .tg-composer-action__icon {
    transition-duration: 0.01ms;
  }
}

#app.ui-telegram .discord-composer__row.is-voice-recording {
  padding-left: 4px;
}

#app.ui-telegram .discord-composer__row.is-voice-recording .discord-composer__attach {
  display: none !important;
}

#app.ui-telegram .discord-composer__row.is-voice-recording .discord-composer__field textarea,
#app.ui-telegram .discord-composer__row.is-voice-recording .discord-composer__tools {
  display: none !important;
}

#app.ui-telegram .tg-voice-record-bar {
  display: none;
  flex: 1 1 auto;
  align-items: center;
  gap: 6px;
  min-width: 0;
  min-height: 40px;
  padding: 0 2px 0 0;
}

#app.ui-telegram .discord-composer__row.is-voice-recording .tg-voice-record-bar {
  display: flex;
}

#app.ui-telegram .tg-voice-record-bar__btn {
  flex: 0 0 40px;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--tg-muted);
  cursor: pointer;
  line-height: 0;
}

#app.ui-telegram .tg-voice-record-bar__btn:hover {
  background: rgba(255, 255, 255, 0.06);
  color: var(--tg-text);
}

#app.ui-telegram .tg-voice-record-bar__cancel {
  color: #e53935;
}

#app.ui-telegram .tg-voice-record-bar__cancel:hover {
  color: #ff6b66;
  background: rgba(229, 57, 53, 0.12);
}

#app.ui-telegram .tg-voice-record-bar__btn svg {
  display: block;
  width: 22px;
  height: 22px;
}

#app.ui-telegram .tg-voice-record-bar__pause.is-paused .tg-voice-record-bar__icon-pause {
  display: none;
}

#app.ui-telegram .tg-voice-record-bar__pause.is-paused .tg-voice-record-bar__icon-mic {
  display: block !important;
}

#app.ui-telegram .tg-voice-record-bar__pause:not(.is-paused) .tg-voice-record-bar__icon-mic {
  display: none !important;
}

#app.ui-telegram .tg-voice-record-bar__main {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  height: 36px;
  padding: 0 12px 0 10px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .tg-voice-record-bar__dot {
  flex: 0 0 8px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #e53935;
  box-shadow: 0 0 0 0 rgba(229, 57, 53, 0.45);
  animation: tg-voice-dot-pulse 1.2s ease-in-out infinite;
}

#app.ui-telegram .discord-composer__row.is-voice-recording.is-voice-paused .tg-voice-record-bar__dot {
  animation: none;
  opacity: 0.55;
}

@keyframes tg-voice-dot-pulse {
  0%,
  100% {
    box-shadow: 0 0 0 0 rgba(229, 57, 53, 0.4);
    opacity: 1;
  }
  50% {
    box-shadow: 0 0 0 6px rgba(229, 57, 53, 0);
    opacity: 0.85;
  }
}

#app.ui-telegram .tg-voice-record-bar__canvas {
  display: block;
  flex: 1 1 auto;
  width: 100%;
  max-width: 100%;
  height: 20px;
  min-width: 48px;
}

#app.ui-telegram .tg-voice-record-bar__timer {
  flex: 0 0 auto;
  color: var(--tg-text);
  font-size: 14px;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  white-space: nowrap;
}

#app.ui-telegram .discord-message__attachment--voice {
  margin: 0;
  max-width: none;
  background: transparent;
  box-shadow: none;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

#app.ui-telegram .discord-message__attachment--voice .discord-message__attachment-actions {
  display: none;
}

#app.ui-telegram .tg-voice-note {
  display: grid;
  grid-template-columns: 45px minmax(0, 1fr);
  align-items: center;
  gap: 6px 10px;
  min-width: 240px;
  max-width: 340px;
  padding: 2px 0 0;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
  caret-color: transparent;
}

#app.ui-telegram .tg-voice-note *,
#app.ui-telegram .tg-voice-note__play,
#app.ui-telegram .tg-voice-note__wave,
#app.ui-telegram .tg-voice-note__canvas,
#app.ui-telegram .tg-voice-note__meta,
#app.ui-telegram .tg-voice-note__duration {
  -webkit-user-select: none !important;
  user-select: none !important;
  -webkit-touch-callout: none;
}

#app.ui-telegram .tg-voice-note__play {
  grid-row: 1 / span 2;
  display: grid;
  place-items: center;
  width: 45px;
  height: 45px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #fff;
  color: var(--tg-blue);
  cursor: pointer;
  line-height: 0;
}

#app.ui-telegram .discord-message.is-me .tg-voice-note__play {
  color: var(--tg-bubble-me);
}

#app.ui-telegram .tg-voice-note__play svg {
  display: block;
  width: 18px;
  height: 18px;
}

#app.ui-telegram .tg-voice-note__wave {
  position: relative;
  width: 100%;
  height: 32px;
  cursor: pointer;
}

#app.ui-telegram .tg-voice-note__canvas {
  display: block;
  width: 100%;
  height: 32px;
}

#app.ui-telegram .tg-voice-note__meta {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  color: rgba(255, 255, 255, 0.72);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

#app.ui-telegram .discord-message.is-me .tg-voice-note__meta {
  color: rgba(255, 255, 255, 0.78);
}

#app.ui-telegram .tg-voice-note__unread {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.9;
}

#app.ui-telegram .tg-voice-note.is-played .tg-voice-note__unread {
  display: none;
}

/* Audio file attachment (mp3 etc.) — Telegram music-message layout */
#app.ui-telegram .discord-message__attachment--audio {
  position: relative;
  max-width: 300px;
  margin: 0;
}

#app.ui-telegram .discord-message__body:has(.discord-message__attachment--audio) > .discord-message__text:has(.discord-message__edited) {
  margin: 0 0 4px;
  line-height: 1.2;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.55);
}

#app.ui-telegram .discord-message__attachment--audio .discord-message__attachment-actions {
  top: 0;
  right: 0;
}

#app.ui-telegram .tg-audio {
  display: grid;
  grid-template-columns: 45px minmax(0, 1fr);
  align-items: center;
  gap: 0 12px;
  min-width: 220px;
  max-width: 300px;
  padding: 2px 2px 2px 0;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
}

#app.ui-telegram .tg-audio__el {
  display: none;
}

#app.ui-telegram .tg-audio__play {
  display: grid;
  place-items: center;
  width: 45px;
  height: 45px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #fff;
  color: var(--tg-blue);
  cursor: pointer;
  line-height: 0;
  flex-shrink: 0;
}

#app.ui-telegram .discord-message.is-me .tg-audio__play {
  color: var(--tg-bubble-me);
}

#app.ui-telegram .tg-audio__play svg {
  display: block;
  width: 18px;
  height: 18px;
  margin-left: 1px;
}

#app.ui-telegram .tg-audio.is-playing .tg-audio__play svg {
  margin-left: 0;
}

#app.ui-telegram .tg-audio__main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 0;
}

#app.ui-telegram .tg-audio__title {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
}

#app.ui-telegram .tg-audio__title:hover {
  text-decoration: underline;
}

#app.ui-telegram .discord-message.is-me .tg-audio__title {
  color: #fff;
}

#app.ui-telegram .tg-audio__sub {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  color: rgba(255, 255, 255, 0.55);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
}

#app.ui-telegram .discord-message.is-me .tg-audio__sub {
  color: rgba(255, 255, 255, 0.7);
}

#app.ui-telegram .tg-audio__sep {
  opacity: 0.7;
}

#app.ui-telegram .tg-audio__size {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#app.ui-telegram .tg-audio__seek {
  width: 100%;
  padding: 1px 0;
  cursor: pointer;
  touch-action: none;
}

#app.ui-telegram .tg-audio__seek-track {
  position: relative;
  height: 3px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.28);
}

#app.ui-telegram .discord-message.is-me .tg-audio__seek-track {
  background: rgba(255, 255, 255, 0.32);
}

#app.ui-telegram .tg-audio__seek-progress {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 0;
  border-radius: inherit;
  background: #fff;
}

#app.ui-telegram .tg-audio__seek-grabber {
  position: absolute;
  right: -5px;
  top: 50%;
  width: 10px;
  height: 10px;
  margin-top: -5px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  opacity: 0;
  transition: opacity 0.12s ease;
}

#app.ui-telegram .tg-audio.is-playing .tg-audio__seek-grabber,
#app.ui-telegram .tg-audio__seek:hover .tg-audio__seek-grabber,
#app.ui-telegram .tg-audio__seek:focus-visible .tg-audio__seek-grabber {
  opacity: 1;
}

/* Group invite message — Telegram preview style */
#app.ui-telegram .discord-message--invite .discord-message__content {
  min-width: min(248px, 78%);
  max-width: min(292px, 84%);
  padding: 10px 12px 8px;
}

#app.ui-telegram .tg-invite-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

#app.ui-telegram .tg-invite-card__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--tg-blue);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
}

#app.ui-telegram .tg-invite-card__eyebrow svg {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  opacity: 0.95;
}

#app.ui-telegram .discord-message.is-me .tg-invite-card__eyebrow {
  color: rgba(255, 255, 255, 0.95);
}

#app.ui-telegram .tg-invite-card__preview {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 10px 10px 10px 12px;
  border-radius: 10px;
  border-left: 3px solid var(--tg-blue);
  background: rgba(0, 0, 0, 0.22);
}

#app.ui-telegram .discord-message.is-me .tg-invite-card__preview {
  border-left-color: rgba(255, 255, 255, 0.55);
  background: rgba(0, 0, 0, 0.16);
}

#app.ui-telegram .tg-invite-card__row {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

#app.ui-telegram .tg-invite-card__avatar {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  overflow: hidden;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  font-size: 17px;
  font-weight: 700;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .tg-invite-card__avatar.has-photo {
  background-size: cover;
  background-position: center;
}

#app.ui-telegram .tg-invite-card__info {
  min-width: 0;
  flex: 1;
}

#app.ui-telegram .tg-invite-card__title {
  display: block;
  overflow: hidden;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#app.ui-telegram .tg-invite-card__sub {
  margin-top: 3px;
  overflow: hidden;
  color: rgba(255, 255, 255, 0.55);
  font-size: 13px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#app.ui-telegram .discord-message.is-me .tg-invite-card__sub {
  color: rgba(255, 255, 255, 0.68);
}

#app.ui-telegram .tg-invite-card__note {
  margin: 0;
  color: rgba(255, 255, 255, 0.72);
  font-size: 14px;
  line-height: 1.35;
}

#app.ui-telegram .discord-message.is-me .tg-invite-card__note {
  color: rgba(255, 255, 255, 0.84);
}

#app.ui-telegram .tg-invite-card__foot {
  display: flex;
  margin: 0;
  padding-top: 2px;
}

#app.ui-telegram .tg-invite-card__btn {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  margin: 0;
  padding: 9px 14px;
  border: 0;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: background 0.12s ease;
}

#app.ui-telegram .tg-invite-card__btn:hover:not(:disabled) {
  background: rgba(255, 255, 255, 0.18);
}

#app.ui-telegram .tg-invite-card__btn:disabled {
  opacity: 0.72;
  cursor: default;
}

#app.ui-telegram .discord-message:not(.is-me) .tg-invite-card__btn {
  background: var(--tg-blue);
}

#app.ui-telegram .discord-message:not(.is-me) .tg-invite-card__btn:hover:not(:disabled) {
  filter: brightness(1.06);
  background: var(--tg-blue);
}

#app.ui-telegram .tg-invite-card__status {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 8px 12px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.72);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
}

#app.ui-telegram .tg-invite-card__status.is-accepted {
  color: #a7f3c0;
  background: rgba(52, 211, 153, 0.14);
}

#app.ui-telegram .discord-message.is-me .tg-invite-card__status.is-accepted {
  color: rgba(255, 255, 255, 0.9);
  background: rgba(255, 255, 255, 0.12);
}

#app.ui-telegram .tg-invite-card__meta {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 4px;
  min-height: 14px;
  margin-top: -2px;
}

#app.ui-telegram .tg-invite-card .discord-message__time--inline {
  float: none;
  margin: 0;
}

#app.ui-telegram .emoji-picker {
  right: 8px;
  bottom: calc(100% + 12px);
  width: min(360px, calc(100vw - 48px));
  height: min(420px, 58vh);
  border: 0;
  border-radius: 16px;
  background: #212121;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.06),
    0 12px 40px rgba(0, 0, 0, 0.55);
  transform-origin: calc(100% - 28px) 100%;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  animation: none !important;
}

#app.ui-telegram .emoji-picker.is-open {
  visibility: visible;
  pointer-events: auto;
}

#app.ui-telegram .emoji-picker__search {
  height: 40px;
  margin: 12px 12px 6px;
  padding: 0 14px;
  border-radius: 20px;
  background: #181818;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

#app.ui-telegram .emoji-picker__search:focus-within {
  background: #181818;
  box-shadow: inset 0 0 0 2px var(--tg-blue);
}

#app.ui-telegram .emoji-picker__search-icon {
  color: var(--tg-muted);
}

#app.ui-telegram .emoji-picker__search input,
#app.ui-telegram #emojiPickerSearch {
  color: var(--tg-text) !important;
  font-size: 15px !important;
  line-height: 22px !important;
}

#app.ui-telegram .emoji-picker__search input::placeholder {
  color: #8a8a8a;
}

#app.ui-telegram .emoji-picker__cats {
  gap: 0;
  padding: 2px 8px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .emoji-picker__cat {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border-radius: 10px;
  font-size: 20px;
  opacity: 0.55;
  transition: background 0.12s ease, opacity 0.12s ease;
}

#app.ui-telegram .emoji-picker__cat:hover {
  background: rgba(255, 255, 255, 0.06);
  opacity: 0.9;
  transform: none;
}

#app.ui-telegram .emoji-picker__cat.is-active {
  background: transparent;
  opacity: 1;
  box-shadow: inset 0 -2px 0 var(--tg-blue);
}

#app.ui-telegram .emoji-picker__heading {
  padding: 12px 14px 4px;
  color: #8a8a8a;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: lowercase;
}

#app.ui-telegram .emoji-picker__grid {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  grid-auto-rows: 42px;
  align-content: start;
  align-items: stretch;
  gap: 0;
  padding: 2px 6px 8px;
  scrollbar-color: rgba(255, 255, 255, 0.18) transparent;
}

#app.ui-telegram .emoji-picker__grid::-webkit-scrollbar {
  width: 6px;
}

#app.ui-telegram .emoji-picker__grid::-webkit-scrollbar-thumb {
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.18);
  background-clip: border-box;
}

#app.ui-telegram .emoji-picker__item {
  display: grid !important;
  place-items: center;
  width: 100%;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  aspect-ratio: auto;
  border-radius: 10px;
  font-size: 26px !important;
  line-height: 1 !important;
  overflow: hidden;
  transition: background 0.1s ease;
  transform: none !important;
}

#app.ui-telegram .emoji-picker__item:hover,
#app.ui-telegram .emoji-picker__item:focus-visible {
  background: rgba(255, 255, 255, 0.08);
  outline: none;
  transform: none !important;
}

#app.ui-telegram .emoji-picker__empty {
  color: var(--tg-muted);
  font-size: 14px;
}

#app.ui-telegram .emoji-picker__footer {
  gap: 12px;
  min-height: 52px;
  padding: 8px 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  background: #181818;
}

#app.ui-telegram .emoji-picker__preview {
  width: 36px;
  height: 36px;
  flex-basis: 36px;
  border-radius: 10px;
  background: #212121;
  font-size: 26px;
}

#app.ui-telegram .emoji-picker__preview-name {
  color: #cfcfcf;
  font-size: 14px;
  font-weight: 500;
}

#app.ui-telegram .profile-card,
#app.ui-telegram .dm-profile {
  background: #0f0f0f;
}

#app.ui-telegram .profile-banner-btn {
  background: rgba(0, 0, 0, 0.35);
}

#app.ui-telegram .discord-typing {
  color: var(--tg-muted);
  padding-left: 16px;
}

/* Telegram Web A proportions and chrome. Kept strictly inside ui-telegram. */
#app.discord-app.ui-telegram {
  --tg-chat: #000000;
  --tg-input: #212121;
  --tg-middle-column-width: 740px;
  --tg-right-column-width: 452px;
  --tg-composer-clearance: 88px;
  --tg-msg-fade-bottom: var(--tg-composer-clearance);
  --tg-panel-motion-duration: 0.42s;
  --tg-panel-motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
  /* No CSS gap after chat — a 0px 3rd track + gap left a dead strip before the screen edge. */
  gap: 0 !important;
  /* sidebar | float spacer | chat | right track (0 when closed, panel width when open) */
  grid-template-columns:
    var(--sidebar-width) var(--tg-float-gap) minmax(0, 1fr) 0px !important;
  transition: grid-template-columns var(--tg-panel-motion-duration) var(--tg-panel-motion-ease);
  overflow: hidden;
}

#app.discord-app.ui-telegram:has(.discord-workspace:not(.members-hidden)),
#app.discord-app.ui-telegram:has(.discord-workspace.tg-pins-open) {
  /* +2× float gap: space between chat scrollbar and floating profile card */
  grid-template-columns:
    var(--sidebar-width) var(--tg-float-gap) minmax(0, 1fr)
    calc(var(--tg-right-column-width) + (2 * var(--tg-float-gap))) !important;
}

#app.discord-app.ui-telegram:has(.discord-workspace.no-members-panel-motion),
html.aura-no-motion #app.discord-app.ui-telegram {
  transition: none !important;
}

#app.ui-telegram .channel-sidebar {
  width: auto !important;
  min-width: 0;
  border: 0 !important;
  border-radius: var(--tg-float-radius) !important;
  background: var(--tg-sidebar) !important;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.05),
    0 1px 2px rgba(0, 0, 0, 0.28) !important;
  overflow: hidden !important;
  isolation: isolate;
}

#app.ui-telegram .tg-left-header {
  position: sticky;
  top: 0;
  z-index: 12;
  height: 62px;
  min-height: 62px;
  padding: 8px 12px;
  background: var(--tg-sidebar);
  transition: background 0.44s cubic-bezier(0.22, 1, 0.36, 1);
}

#app.ui-telegram .tg-left-header.is-search-mode {
  background: transparent !important;
  box-shadow: none;
}

#app.ui-telegram .tg-left-header__menu {
  width: 46px;
  height: 46px;
}

#app.ui-telegram .tg-left-header__menu svg {
  width: 28px;
  height: 28px;
}

#app.ui-telegram .tg-left-header__search {
  height: 46px;
  padding: 0 14px 0 46px;
  border: 0;
  border-radius: 23px;
  background: #2c2c2c;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.015);
}

#app.ui-telegram .tg-left-header__search:focus-within {
  border-color: transparent;
  background: #2c2c2c;
  box-shadow: inset 0 0 0 2px var(--tg-blue);
}

#app.ui-telegram .tg-left-header__search-icon {
  left: 14px;
  width: 24px;
  height: 24px;
}

#app.ui-telegram .tg-left-header__search input {
  font-size: 16px;
}

#app.ui-telegram .home-nav {
  display: none !important;
}

#app.ui-telegram .dm-list {
  padding: 4px 8px 80px;
}

#app.ui-telegram .dm-item {
  position: relative;
  width: 100%;
  height: 72px;
  min-height: 72px;
  margin: 0;
  padding: 8px 10px !important;
  border: 0;
  border-radius: 14px !important;
  box-sizing: border-box;
}

#app.ui-telegram .dm-item + .dm-item {
  margin-top: 0;
}

#app.ui-telegram .dm-item:hover {
  background: var(--tg-sidebar-hover);
}

#app.ui-telegram .dm-item.active {
  background: var(--tg-sidebar-active);
}

#app.ui-telegram .dm-item__avatar {
  width: 54px;
  height: 54px;
  flex-basis: 54px;
}

#app.ui-telegram .dm-item__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  align-self: center;
}

#app.ui-telegram .dm-item__title-row {
  min-height: 0;
  align-items: center;
  padding-right: 56px;
}

#app.ui-telegram .dm-item__name {
  font-size: 17px !important;
  font-weight: 600 !important;
  line-height: 21px !important;
  color: #fff !important;
}

#app.ui-telegram .dm-item__subtitle {
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  color: var(--tg-muted, #8b8b8b) !important;
}

#app.ui-telegram .dm-item.active .dm-item__subtitle {
  color: rgba(255, 255, 255, 0.85) !important;
}

#app.ui-telegram .dm-item__meta-time {
  position: absolute;
  top: 10px;
  right: 12px;
  z-index: 1;
  align-self: auto;
  margin: 0;
  font-size: 12px;
  line-height: 16px;
  pointer-events: none;
}


#app.ui-telegram .dm-item__badge {
  position: absolute;
  right: 12px;
  bottom: 11px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-width: 24px;
  height: 24px;
  padding: 0;
  border-radius: 999px;
  background: #4e4e4e;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  line-height: 24px;
  text-align: center;
}

#app.ui-telegram .dm-item__badge[data-wide] {
  width: auto;
  padding: 0 6px;
}

#app.ui-telegram .dm-item--official .dm-item__name {
  flex: 0 1 auto;
  width: auto;
  max-width: calc(100% - 120px);
}

#app.ui-telegram .dm-item--official .dm-item__title-row {
  justify-content: flex-start;
  gap: 6px;
}

#app.ui-telegram .dm-item__official-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  flex: 0 0 auto;
  width: auto;
  min-width: 0;
  height: 18px;
  padding: 0 5px;
  border: 0;
  border-radius: 3px;
  background: var(--tg-blue);
  color: #fff;
}

#app.ui-telegram .dm-item__official-badge .official-badge__icon {
  width: 13px;
  height: 13px;
  flex: 0 0 13px;
}

#app.ui-telegram .dm-item__official-badge .official-badge__label {
  display: block;
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  line-height: 18px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  transform: translateY(-1px);
}

#app.ui-telegram .discord-header__official-badge,
#app.ui-telegram .discord-message__official-badge,
#app.ui-telegram .dm-welcome__official-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  width: auto;
  min-width: 0;
  height: 18px;
  padding: 0 5px;
  border: 0;
  border-radius: 3px;
  background: var(--tg-blue);
  color: #fff;
}

#app.ui-telegram .discord-header__official-badge .official-badge__icon,
#app.ui-telegram .discord-message__official-badge .official-badge__icon,
#app.ui-telegram .dm-welcome__official-badge .official-badge__icon {
  width: 13px;
  height: 13px;
  flex: 0 0 13px;
}

#app.ui-telegram .discord-header__official-badge .official-badge__label,
#app.ui-telegram .discord-message__official-badge .official-badge__label,
#app.ui-telegram .dm-welcome__official-badge .official-badge__label {
  display: block;
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  line-height: 18px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  transform: translateY(-1px);
}

#app.ui-telegram .dm-welcome__title-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
}

#app.ui-telegram .dm-welcome__title-row .dm-welcome__name {
  margin: 0;
}

/* TG chat wallpaper — two presets (pattern = current jpg, classic = tiled svg) */
#app.discord-app.ui-telegram::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-color: #0a0a0a;
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.72), rgba(0, 0, 0, 0.72)),
    url("/assets/tg-chat-wallpaper.jpg?v=2");
  background-repeat: no-repeat;
  background-size: cover, cover;
  background-position: center center;
  opacity: 1;
  -webkit-mask-image: none;
  mask-image: none;
}

#app.discord-app.ui-telegram[data-tg-wallpaper="classic"]::before {
  background-color: #120f1c;
  background-image: url("/assets/tg-chat-wallpaper.svg?v=3");
  background-size: 420px 420px;
  background-repeat: repeat;
  background-position: center center;
  opacity: 0.78;
  -webkit-mask-image: none;
  mask-image: none;
}

#app.discord-app.ui-telegram > * {
  position: relative;
  z-index: 1;
}

#app.ui-telegram .discord-content {
  background: transparent !important;
}

#app.ui-telegram .chat-view.is-tg-idle > .discord-header,
#app.ui-telegram .chat-view.is-tg-idle .discord-workspace {
  display: none !important;
}

#app.ui-telegram .chat-view.is-tg-idle {
  background: transparent;
  pointer-events: none;
}

#app.ui-telegram .chat-view.is-tg-idle.members-open,
#app.ui-telegram .chat-view.is-tg-idle.pins-open,
#app.ui-telegram .chat-view.is-tg-idle.has-voice-call {
  pointer-events: auto;
}

/* One grid cell only — header floats over chat (no leftover 48px Discord header track). */
#app.ui-telegram .chat-view {
  position: relative;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: minmax(0, 1fr) !important;
  background-color: transparent;
}

#app.ui-telegram .chat-view > .discord-header,
#app.ui-telegram .chat-view > .discord-workspace {
  grid-area: 1 / 1 !important;
}

#app.ui-telegram .chat-view::before {
  content: none !important;
  display: none !important;
}

/* Floating header capsule — same top edge as left tg-left-header (56px) */
#app.ui-telegram .discord-header {
  position: absolute;
  top: var(--tg-header-top);
  left: 16px;
  right: 16px;
  z-index: 5;
  grid-column: 1;
  grid-row: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: auto;
  max-width: var(--tg-middle-column-width);
  min-width: 0;
  height: var(--tg-header-h);
  min-height: var(--tg-header-h);
  margin: 0 auto !important;
  padding: 0 10px 0 8px;
  border: none !important;
  border-radius: 28px;
  background: var(--tg-header) !important;
  box-shadow:
    0 1px 2px rgba(0, 0, 0, 0.22),
    0 2px 10px rgba(0, 0, 0, 0.28);
  box-sizing: border-box;
  transform: none;
  pointer-events: none;
  overflow: visible;
}

/* Active group voice — bar under header (same width) */
#app.ui-telegram .tg-voice-call-banner {
  position: absolute;
  top: calc(var(--tg-header-top) + var(--tg-header-h) + 8px);
  left: 16px;
  right: 16px;
  z-index: 5;
  grid-column: 1;
  grid-row: 1;
  display: flex;
  align-items: center;
  gap: 10px;
  width: auto;
  max-width: var(--tg-middle-column-width);
  min-width: 0;
  height: 48px;
  margin: 0 auto !important;
  padding: 0 10px 0 12px;
  border: none;
  border-radius: 24px;
  background: var(--tg-header) !important;
  box-shadow:
    0 1px 2px rgba(0, 0, 0, 0.22),
    0 2px 10px rgba(0, 0, 0, 0.28);
  box-sizing: border-box;
  pointer-events: auto;
}

#app.ui-telegram .tg-voice-call-banner.hidden,
#app.ui-telegram .tg-voice-call-banner[hidden] {
  display: none !important;
}

#app.ui-telegram .chat-view.has-tg-voice-banner {
  --tg-voice-banner-stack: 56px;
  --tg-sticky-date-top: calc(
    var(--tg-header-top) + var(--tg-header-h) + var(--tg-voice-banner-stack) + var(--tg-header-gap)
  );
  --tg-msg-fade-top: calc(var(--tg-header-top) + var(--tg-header-h) + var(--tg-voice-banner-stack));
}

#app.ui-telegram .tg-voice-call-banner__avatars {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  margin-right: 2px;
}

#app.ui-telegram .tg-voice-call-banner__avatar {
  width: 28px;
  height: 28px;
  margin-left: -8px;
  border: 2px solid var(--tg-header, #212121);
  border-radius: 50%;
  box-sizing: border-box;
  background-size: cover;
  background-position: center;
  overflow: hidden;
  flex: 0 0 auto;
}

#app.ui-telegram .tg-voice-call-banner__avatar:first-child {
  margin-left: 0;
}

#app.ui-telegram .tg-voice-call-banner__avatar > span {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
}

#app.ui-telegram .tg-voice-call-banner__avatar > i {
  display: none;
}

#app.ui-telegram .tg-voice-call-banner__more {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  margin-left: -8px;
  border: 2px solid var(--tg-header, #212121);
  border-radius: 50%;
  background: #3a3a3a;
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  box-sizing: border-box;
}

#app.ui-telegram .tg-voice-call-banner__text {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-width: 0;
  gap: 1px;
}

#app.ui-telegram .tg-voice-call-banner__text strong {
  overflow: hidden;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#app.ui-telegram .tg-voice-call-banner__text small {
  overflow: hidden;
  color: var(--tg-muted, #aaaaaa);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#app.ui-telegram .tg-voice-call-banner__join {
  flex: 0 0 auto;
  height: 32px;
  padding: 0 14px;
  border: 0;
  border-radius: 16px;
  background: #31b545;
  color: #fff;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}

#app.ui-telegram .tg-voice-call-banner__join:hover {
  background: #2aa03d;
}

#app.ui-telegram .discord-header > * {
  pointer-events: auto;
}

#app.ui-telegram .discord-header__channel {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex: 1 1 auto;
  align-self: center;
  height: auto;
  max-height: 100%;
  margin: 0;
  padding: 4px 8px 4px 0;
  border-radius: 28px 0 0 28px;
  box-sizing: border-box;
  overflow: visible;
}

#app.ui-telegram .header-avatar {
  flex: 0 0 44px !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
  margin: 0 !important;
  margin-left: -1px !important;
  align-self: center !important;
  overflow: hidden !important;
  border-radius: 50% !important;
}

#app.ui-telegram .header-avatar i {
  display: none;
}

#app.ui-telegram .discord-header__info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-self: center;
  gap: 0;
  min-width: 0;
  flex: 1 1 auto;
  padding: 0;
  overflow: visible;
}

#app.ui-telegram .discord-header__title-wrap {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  line-height: 1.2;
}

#app.ui-telegram .discord-header__channel strong {
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  color: var(--tg-text);
  margin: 0;
  padding: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#app.ui-telegram .discord-header__info > #channelTopic {
  color: var(--tg-muted);
  font-size: 13px;
  line-height: 18px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#app.ui-telegram .discord-header__actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 2px;
  height: 42px;
  transform: none !important;
}

#app.ui-telegram .invite-group-btn {
  display: none !important;
}

#app.ui-telegram .voice-call-btn {
  order: 2;
  margin-left: 0;
}

#app.ui-telegram .tg-search-wrap {
  order: 1;
}

#app.ui-telegram .pins-header-wrap {
  order: 3;
  position: relative;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  margin: 0;
}

#app.ui-telegram .pins-header-wrap.is-official-hidden,
#app.ui-telegram .pins-header-wrap:has(.pins-toggle-btn.hidden),
#app.ui-telegram .pins-header-wrap:has(.pins-toggle-btn[hidden]) {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

#app.ui-telegram .tg-header-more {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 80;
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: max-content;
  min-width: 268px;
  max-width: min(320px, calc(100vw - 24px));
  padding: 8px;
  border-radius: 14px;
  background: #212121;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.06),
    0 14px 36px rgba(0, 0, 0, 0.55);
  color: #fff;
  user-select: none;
  box-sizing: border-box;
  transform-origin: calc(100% - 18px) 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: scale(0.94) translateY(-6px);
  transition:
    opacity 0.16s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.2s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 0.2s;
}

#app.ui-telegram .tg-header-more.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: scale(1) translateY(0);
  transition:
    opacity 0.16s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.2s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 0s;
}

#app.ui-telegram .tg-header-more.is-closing {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: scale(0.94) translateY(-6px);
}

#app.ui-telegram .tg-header-more.is-open,
#app.ui-telegram .tg-header-more.is-closing {
  display: flex !important;
}

#app.ui-telegram .tg-header-more.hidden:not(.is-closing):not(.is-open),
#app.ui-telegram .tg-header-more[hidden]:not(.is-closing):not(.is-open) {
  display: none !important;
}

#app.ui-telegram .tg-header-more__item {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 10px 12px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: rgba(255, 255, 255, 0.95);
  font: 400 15px/1.25 "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  letter-spacing: 0.01em;
  text-align: left;
  cursor: pointer;
  box-sizing: border-box;
}

#app.ui-telegram .tg-header-more__item:hover {
  background: rgba(255, 255, 255, 0.08);
}

#app.ui-telegram .tg-header-more__item.is-disabled,
#app.ui-telegram .tg-header-more__item:disabled {
  opacity: 0.45;
  cursor: default;
}

#app.ui-telegram .tg-header-more__item--danger {
  color: #e53935;
}

#app.ui-telegram .tg-header-more__item--danger:hover {
  background: rgba(229, 57, 53, 0.12);
}

#app.ui-telegram .tg-header-more__icon {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  color: inherit;
  opacity: 0.92;
  line-height: 0;
}

#app.ui-telegram .tg-header-more__icon svg {
  display: block;
  width: 22px;
  height: 22px;
}

#app.ui-telegram .tg-header-more__label {
  flex: 1 1 auto;
  min-width: 0;
  white-space: nowrap;
}

#app.ui-telegram .tg-header-more__sep {
  height: 1px;
  margin: 4px 8px;
  background: rgba(255, 255, 255, 0.08);
}

#app.ui-telegram .tg-header-more__sep.hidden,
#app.ui-telegram .tg-header-more__item.hidden {
  display: none !important;
}

#app.ui-telegram .tg-header-more__icon .pin-icon {
  width: 20px;
  height: 20px;
  background-color: currentColor;
  -webkit-mask: url('/icons/pin.png') center / contain no-repeat;
  mask: url('/icons/pin.png') center / contain no-repeat;
}

/* TG pins: right floating column — Telegram Web A style */
#app.ui-telegram .pins-panel {
  position: fixed !important;
  top: var(--tg-float-gap) !important;
  right: var(--tg-float-gap) !important;
  bottom: var(--tg-float-gap) !important;
  left: auto !important;
  z-index: 40 !important;
  width: var(--tg-right-column-width) !important;
  min-width: var(--tg-right-column-width) !important;
  max-width: var(--tg-right-column-width) !important;
  max-height: none !important;
  border: 0 !important;
  border-radius: var(--tg-float-radius) !important;
  background: var(--tg-sidebar, #212121) !important;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.06),
    0 8px 28px rgba(0, 0, 0, 0.45) !important;
  pointer-events: auto !important;
}

#app.ui-telegram .pins-panel__header {
  gap: 12px;
  min-height: 56px;
  padding: 10px 8px 10px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  color: #fff;
  font-size: 16px;
  font-weight: 600;
}

#app.ui-telegram .pins-panel__header .pin-icon {
  display: none;
}

#app.ui-telegram .pins-panel__header strong {
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0;
}

#app.ui-telegram .pins-panel__close {
  display: grid !important;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  color: var(--tg-muted, #aaaaaa);
}

#app.ui-telegram .pins-panel__close:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
}

#app.ui-telegram .pins-panel__close svg {
  width: 22px;
  height: 22px;
}

#app.ui-telegram .pins-panel__body {
  flex: 1 1 auto;
  min-height: 0;
  padding: 6px 0 12px;
  overflow: auto;
}

#app.ui-telegram .pins-panel__item {
  display: grid;
  gap: 2px;
  width: 100%;
  margin: 0;
  padding: 10px 16px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #fff;
  text-align: left;
  cursor: pointer;
}

#app.ui-telegram .pins-panel__item + .pins-panel__item {
  border-top: 1px solid rgba(255, 255, 255, 0.04);
}

#app.ui-telegram .pins-panel__item:hover {
  background: rgba(255, 255, 255, 0.05);
}

#app.ui-telegram .pins-panel__item-head {
  align-items: center;
}

#app.ui-telegram .pins-panel__nick {
  color: var(--tg-blue, #8774e1);
  font-size: 14px;
  font-weight: 500;
}

#app.ui-telegram .pins-panel__time {
  color: var(--tg-muted, #aaaaaa);
  font-size: 12px;
}

#app.ui-telegram .pins-panel__preview {
  color: rgba(255, 255, 255, 0.85);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.35;
  white-space: normal;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

#app.ui-telegram .pins-panel__tip {
  display: none !important;
}

#app.ui-telegram .pins-panel__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-height: 280px;
  padding: 32px 28px;
  text-align: center;
  color: var(--tg-muted, #aaaaaa);
}

#app.ui-telegram .pins-panel__empty-art {
  display: grid;
  place-items: center;
  width: 88px;
  height: 88px;
  border-radius: 50%;
  background: rgba(135, 116, 225, 0.14);
  color: var(--tg-blue, #8774e1);
}

#app.ui-telegram .pins-panel__empty-art svg {
  width: 40px;
  height: 40px;
}

#app.ui-telegram .pins-panel__empty p {
  margin: 0;
  max-width: 260px;
  color: var(--tg-muted, #aaaaaa);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.45;
}

#app.ui-telegram .pins-panel__empty-hint {
  margin: 0;
  max-width: 260px;
  color: rgba(170, 170, 170, 0.75);
  font-size: 13px;
  line-height: 1.4;
}

#app.ui-telegram .discord-message__menu-icon .pin-icon {
  width: 18px;
  height: 18px;
  background-color: currentColor;
  -webkit-mask: url('/icons/pin.png') center / contain no-repeat;
  mask: url('/icons/pin.png') center / contain no-repeat;
}

#app.ui-telegram .discord-search {
  order: 1;
  display: flex;
  align-items: center;
  width: 38px;
  height: 38px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--tg-muted);
  box-sizing: border-box;
  transition: background 0.12s ease, color 0.12s ease;
}

#app.ui-telegram .discord-search__lead {
  display: none;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin-right: 8px;
  color: var(--tg-muted);
  line-height: 0;
}

#app.ui-telegram .discord-search__lead svg {
  display: block;
  width: 20px;
  height: 20px;
}

#app.ui-telegram .tg-search-calendar {
  display: none !important;
  order: 4;
}

#app.ui-telegram .tg-search-date-input {
  position: fixed !important;
  left: 0;
  top: 0;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* TG MiddleHeader search mode — like Web A */
#app.ui-telegram .discord-header.is-searching .discord-header__info {
  display: none !important;
}

#app.ui-telegram .discord-header.is-searching .discord-header__channel {
  flex: 0 0 auto;
  max-width: none;
  padding-right: 0 !important;
}

#app.ui-telegram .discord-header.is-searching .discord-header__actions {
  flex: 1 1 auto;
  min-width: 0;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
}

#app.ui-telegram .discord-header.is-searching .discord-search {
  order: 1;
  flex: 1 1 auto;
  width: auto !important;
  min-width: 0;
  height: 36px;
  padding: 0 6px 0 12px;
  overflow: hidden;
  border-radius: 18px;
  background: #2c2c2c;
  color: var(--tg-muted);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
  transform-origin: right center;
  transition:
    width 0.26s ease,
    max-width 0.26s ease,
    padding 0.26s ease,
    border-radius 0.26s ease,
    background 0.22s ease,
    box-shadow 0.22s ease;
}

#app.ui-telegram .discord-header.is-searching .discord-search__lead {
  display: grid;
  place-items: center;
  opacity: 1;
  transition: opacity 0.18s ease;
}

#app.ui-telegram .discord-header.is-searching .discord-search input {
  width: auto;
  flex: 1 1 auto;
  min-width: 0;
  opacity: 1;
  pointer-events: auto;
  padding: 0;
  background: transparent;
  border: 0;
  outline: none;
  box-shadow: none;
  color: var(--tg-text);
  font-size: 16px;
  line-height: 20px;
  transition: opacity 0.18s ease;
}

#app.ui-telegram .discord-header.is-searching .discord-search input::placeholder {
  font-size: 16px;
  line-height: 20px;
  color: var(--tg-muted);
  opacity: 1;
}

#app.ui-telegram .discord-header.is-searching .discord-search__action {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  color: var(--tg-muted);
  transition: opacity 0.18s ease;
}

#app.ui-telegram .discord-header.is-searching.is-search-closing .tg-search-wrap {
  /* width driven by JS for a stable px→px shrink; keep flex-end so it collapses to the right */
  flex-grow: 0;
  flex-shrink: 0;
}

#app.ui-telegram .discord-header.is-searching.is-search-closing .discord-search {
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
  padding: 0 !important;
}

#app.ui-telegram .discord-header.is-searching.is-search-closing .discord-search__lead,
#app.ui-telegram .discord-header.is-searching.is-search-closing .discord-search input,
#app.ui-telegram .discord-header.is-searching.is-search-closing .discord-search__action,
#app.ui-telegram .discord-header.is-searching.is-search-closing .tg-search-nav {
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Keep avatar + calendar fixed while the field shrinks — no mid-anim layout swap */

#app.ui-telegram .tg-search-nav {
  display: none;
  flex: 0 0 auto;
  align-items: center;
  gap: 0;
  margin-right: 2px;
}

#app.ui-telegram .discord-header.is-searching .tg-search-nav:not(.hidden) {
  display: flex;
}

#app.ui-telegram .tg-search-nav__btn {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--tg-muted);
  cursor: pointer;
}

#app.ui-telegram .tg-search-nav__btn:hover:not(:disabled) {
  background: rgba(255, 255, 255, 0.06);
  color: var(--tg-text);
}

#app.ui-telegram .tg-search-nav__btn:disabled {
  opacity: 0.35;
  cursor: default;
}

#app.ui-telegram .tg-search-nav__btn svg {
  display: block;
  width: 18px;
  height: 18px;
}

/* TG search wrap — always a box so open/close grows from the icon (right) */
#app.ui-telegram .tg-search-wrap {
  display: flex;
  position: relative;
  flex: 0 0 38px;
  align-items: center;
  justify-content: center;
  order: 1;
  width: 38px;
  height: 38px;
  min-width: 38px;
  max-width: 38px;
  overflow: visible;
  z-index: 6;
  transition:
    flex-basis 0.26s ease,
    width 0.26s ease,
    max-width 0.26s ease,
    min-width 0.26s ease;
}

#app.ui-telegram .discord-header.is-searching {
  overflow: visible;
}

#app.ui-telegram .discord-header.is-searching .discord-header__actions {
  overflow: visible;
}

#app.ui-telegram .discord-header.is-searching .tg-search-wrap {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  order: 1;
  width: auto;
  min-width: 0;
  max-width: none;
  height: 38px;
  overflow: visible;
  z-index: 6;
  transition:
    flex-basis 0.28s ease,
    width 0.28s ease,
    max-width 0.28s ease,
    min-width 0.28s ease;
}

#app.ui-telegram .discord-header.is-searching .tg-search-wrap .discord-search {
  flex: 1 1 auto;
  width: 100% !important;
  order: unset;
  transition:
    width 0.28s ease,
    max-width 0.28s ease,
    min-width 0.28s ease,
    flex-basis 0.28s ease,
    padding 0.28s ease,
    border-radius 0.28s ease,
    background 0.22s ease,
    box-shadow 0.22s ease,
    opacity 0.18s ease;
}

/* TG middle search curtain (below search field) — like Web A MiddleSearchResult */
#tgMiddleSearch {
  display: none !important;
}

#app.ui-telegram #tgMiddleSearch.tg-middle-search:not(.hidden) {
  display: flex !important;
  flex-direction: column;
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  z-index: 7;
  width: 100%;
  max-height: min(58vh, 480px);
  margin: 0;
  padding: 4px 0 8px;
  overflow: hidden;
  border-radius: 12px;
  background: var(--tg-header);
  box-shadow:
    0 4px 14px rgba(0, 0, 0, 0.32),
    0 1px 2px rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
  pointer-events: auto;
}

@property --tg-scroll-thumb {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}

#app.ui-telegram .tg-middle-search__list {
  --tg-scroll-thumb: transparent;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
  max-height: min(58vh, 480px);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--tg-scroll-thumb) transparent;
  transition: --tg-scroll-thumb 0.22s ease;
}

#app.ui-telegram .tg-middle-search__list::-webkit-scrollbar {
  width: 6px;
}

#app.ui-telegram .tg-middle-search__list::-webkit-scrollbar-track {
  background: transparent;
}

#app.ui-telegram .tg-middle-search__list::-webkit-scrollbar-thumb {
  border-radius: 6px;
  background: var(--tg-scroll-thumb);
  transition: background 0.22s ease;
}

#app.ui-telegram #tgMiddleSearch:hover .tg-middle-search__list,
#app.ui-telegram .tg-middle-search__list:hover,
#app.ui-telegram .tg-middle-search__list:focus-within,
#app.ui-telegram .tg-middle-search__list:active {
  --tg-scroll-thumb: rgba(255, 255, 255, 0.22);
}

#app.ui-telegram #tgMiddleSearch:hover .tg-middle-search__list::-webkit-scrollbar-thumb:hover,
#app.ui-telegram .tg-middle-search__list:hover::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.32);
}

#app.ui-telegram .tg-middle-search__empty {
  padding: 28px 20px 32px;
  color: var(--tg-muted);
  font-size: 15px;
  line-height: 20px;
  text-align: center;
}

#app.ui-telegram .tg-middle-search__item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 8px 14px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  box-sizing: border-box;
}

#app.ui-telegram .tg-middle-search__item:hover,
#app.ui-telegram .tg-middle-search__item.is-active {
  background: rgba(255, 255, 255, 0.05);
}

#app.ui-telegram .tg-middle-search__avatar {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  margin-top: 1px;
  border-radius: 50%;
  overflow: hidden;
}

#app.ui-telegram .tg-middle-search__body {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

#app.ui-telegram .tg-middle-search__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

#app.ui-telegram .tg-middle-search__name {
  margin: 0;
  min-width: 0;
  overflow: hidden;
  color: var(--tg-text);
  font-size: 15px;
  font-weight: 500;
  line-height: 20px;
  white-space: nowrap;
  text-overflow: ellipsis;
}

#app.ui-telegram .tg-middle-search__time {
  flex: 0 0 auto;
  color: #707579;
  font-size: 13px;
  line-height: 18px;
  white-space: nowrap;
}

#app.ui-telegram .tg-middle-search__text {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  color: #aaaaaa;
  font-size: 14px;
  line-height: 19px;
  word-break: break-word;
}

#app.ui-telegram .tg-middle-search__text mark,
#app.ui-telegram .tg-middle-search__text .matching-text-highlight {
  padding: 0 2px;
  border-radius: 4px;
  background: #4a90c9;
  color: #fff;
  font-style: normal;
  font-weight: 500;
}

#app.ui-telegram .discord-header.is-searching .discord-search__glyph--search {
  display: none !important;
}

#app.ui-telegram .discord-header.is-searching .discord-search__glyph--clear {
  display: grid !important;
}

#app.ui-telegram .discord-header.is-searching .voice-call-btn,
#app.ui-telegram .discord-header.is-searching .pins-header-wrap,
#app.ui-telegram .discord-header.is-searching #addFriendsToDmBtn,
#app.ui-telegram .discord-header.is-searching .invite-group-btn {
  display: none !important;
}

#app.ui-telegram .discord-header.is-searching .tg-search-calendar {
  display: grid !important;
  place-items: center;
  align-self: center;
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  margin: 0 6px 0 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--tg-muted);
  line-height: 0;
  pointer-events: auto;
  transition: opacity 0.18s ease, background 0.12s ease, color 0.12s ease;
}

#app.ui-telegram .discord-header.is-searching .tg-search-calendar:hover {
  background: rgba(255, 255, 255, 0.08);
  color: var(--tg-text);
}

#app.ui-telegram .discord-header.is-searching .tg-search-calendar svg {
  display: block;
  width: 26px;
  height: 26px;
}

.tg-date-picker-root {
  position: fixed;
  inset: 0;
  z-index: 400;
  display: grid;
  place-items: center;
  padding: 20px;
  box-sizing: border-box;
}

.tg-date-picker-root.hidden,
.tg-date-picker-root[hidden] {
  display: none !important;
}

.tg-date-picker-root__backdrop {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: rgba(0, 0, 0, 0.62);
  cursor: pointer;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

.tg-date-picker {
  position: relative;
  z-index: 1;
  width: min(420px, calc(100vw - 40px));
  padding: 20px 20px 16px;
  border-radius: 20px;
  background: linear-gradient(180deg, #2a2a2a 0%, #1c1c1c 100%);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.08),
    0 24px 64px rgba(0, 0, 0, 0.65);
  color: #fff;
  user-select: none;
}

.tg-date-picker__caption {
  margin: 0 0 14px;
  color: #aaa;
  font: 500 13px/1.2 "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  letter-spacing: 0.02em;
  text-align: center;
}

.tg-date-picker__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 14px;
}

.tg-date-picker__title {
  flex: 1 1 auto;
  min-width: 0;
  text-align: center;
  font: 700 20px/1.2 "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  color: #fff;
  text-transform: capitalize;
}

.tg-date-picker__nav {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.04);
  color: #cfcfcf;
  cursor: pointer;
  transition: background 0.12s ease, color 0.12s ease;
}

.tg-date-picker__nav:hover:not(:disabled) {
  background: rgba(135, 116, 225, 0.22);
  color: #fff;
}

.tg-date-picker__nav:disabled {
  opacity: 0.28;
  cursor: default;
}

.tg-date-picker__nav svg {
  width: 22px;
  height: 22px;
}

.tg-date-picker__weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
  margin-bottom: 8px;
}

.tg-date-picker__weekdays span {
  display: grid;
  place-items: center;
  height: 32px;
  color: #8774e1;
  font: 600 13px/1 "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  text-transform: lowercase;
}

.tg-date-picker__grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
}

.tg-date-picker__day {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 1;
  margin: 0;
  padding: 0 0 4px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  font: 600 16px/1 "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  cursor: pointer;
  transition: background 0.12s ease, color 0.12s ease, box-shadow 0.12s ease;
}

.tg-date-picker__day.is-empty {
  visibility: hidden;
  pointer-events: none;
}

/* Дни с сообщениями — светлые, кликабельные */
.tg-date-picker__day.is-active {
  color: #f5f5f5;
}

.tg-date-picker__day.is-active:hover {
  background: rgba(135, 116, 225, 0.28);
  color: #fff;
}

.tg-date-picker__day.is-today {
  color: #fff;
  box-shadow: inset 0 0 0 2px #8774e1;
}

.tg-date-picker__day.is-today:hover {
  background: rgba(135, 116, 225, 0.3);
}

/* Прошлые дни без сообщений — тусклые */
.tg-date-picker__day.is-blank {
  color: #5a5a5a;
  cursor: default;
}

.tg-date-picker__day.is-blank:hover {
  background: transparent;
  color: #5a5a5a;
}

/* Будущие дни — ещё темнее */
.tg-date-picker__day.is-future {
  color: #3a3a3a;
  cursor: default;
}

.tg-date-picker__day.is-future:hover {
  background: transparent;
  color: #3a3a3a;
}

.tg-date-picker__day.has-messages::after {
  content: "";
  position: absolute;
  bottom: 7px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #8774e1;
  box-shadow: 0 0 0 2px rgba(135, 116, 225, 0.18);
}

.tg-date-picker__hint {
  margin: 14px 2px 0;
  color: #8a8a8a;
  font: 400 12px/1.35 "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  text-align: center;
}

#app.ui-telegram .date-separator.is-date-jump span {
  background: rgba(135, 116, 225, 0.72);
  color: #fff !important;
  opacity: 1 !important;
  box-shadow: 0 0 0 2px rgba(135, 116, 225, 0.4);
  transform: scale(1.04);
  transition: background 0.15s ease, transform 0.15s ease;
}

#app.ui-telegram .discord-search:hover:not(:focus-within):not(.has-value) {
  background: rgba(255, 255, 255, 0.08);
  color: var(--tg-text);
}

#app.ui-telegram .discord-search input {
  width: 0;
  min-width: 0;
  flex: 0 0 0;
  padding: 0;
  opacity: 0;
  pointer-events: none;
  font-size: 14px;
  color: var(--tg-text);
  transition: opacity 0.12s ease;
}

/* TG "Button smaller translucent round" */
#app.ui-telegram .discord-header__actions .members-toggle-btn,
#app.ui-telegram .pins-toggle-btn {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  margin: 0;
  padding: 0;
  border-radius: 50%;
  color: var(--tg-muted);
  background: transparent;
  line-height: 0;
}

#app.ui-telegram .discord-header__actions .members-toggle-btn:hover,
#app.ui-telegram .pins-toggle-btn:hover {
  background: rgba(255, 255, 255, 0.08);
  color: var(--tg-text);
}

#app.ui-telegram .discord-header__actions .members-toggle-btn svg {
  display: block;
  width: 22px;
  height: 22px;
}

#app.ui-telegram .pins-toggle-btn .pin-icon {
  width: 5px;
  height: 19px;
  background: radial-gradient(circle, currentColor 0 1.8px, transparent 2px) center / 5px 6.4px repeat-y;
  -webkit-mask: none;
  mask: none;
}

/* Never half-open: without is-searching stay as icon only */
#app.ui-telegram .discord-header:not(.is-searching) .discord-search:focus-within,
#app.ui-telegram .discord-header:not(.is-searching) .discord-search.has-value {
  width: 38px;
  padding: 0;
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
  color: var(--tg-muted);
}

#app.ui-telegram .discord-header:not(.is-searching) .discord-search:focus-within input,
#app.ui-telegram .discord-header:not(.is-searching) .discord-search.has-value input {
  width: 0;
  flex: 0 0 0;
  opacity: 0;
  pointer-events: none;
}

#app.ui-telegram .discord-header:not(.is-searching) .discord-search:hover {
  background: rgba(255, 255, 255, 0.08);
  color: var(--tg-text);
}

/* Discord side search panel is not used in Telegram */
#app.ui-telegram .chat-search-panel,
#app.ui-telegram .discord-workspace.search-open .chat-search-panel {
  display: none !important;
}

#app.ui-telegram .discord-workspace.search-open .discord-chat {
  width: 100% !important;
}

#app.ui-telegram .discord-search__action {
  position: relative;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: inherit;
  line-height: 0;
  cursor: pointer;
}

#app.ui-telegram .discord-search__glyph {
  grid-area: 1 / 1;
  display: grid;
  place-items: center;
  line-height: 0;
}

#app.ui-telegram .discord-search__glyph--clear {
  display: none;
}

#app.ui-telegram .discord-search.has-value .discord-search__glyph--search {
  display: none;
}

#app.ui-telegram .discord-search.has-value .discord-search__glyph--clear {
  display: grid;
}

#app.ui-telegram .discord-search__glyph svg {
  display: block;
  width: 22px;
  height: 22px;
}

#app.ui-telegram .discord-workspace {
  position: relative;
  z-index: 1;
  grid-area: 1 / 1 !important;
  /* Full-bleed scroll area; chat content stays visually centered. */
  grid-template-columns: minmax(0, 1fr) !important;
  padding: 0 !important;
  background: transparent !important;
  min-height: 0;
  height: 100%;
  align-self: stretch;
}

#app.ui-telegram .discord-chat {
  position: relative;
  grid-column: 1;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: minmax(0, 1fr) !important;
  width: 100%;
  min-width: 0;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  box-sizing: border-box;
  overflow: hidden;
}

#app.ui-telegram .voice-call-stage,
#app.ui-telegram .voice-call-stage.hidden,
#app.ui-telegram #voiceCallStage {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
}

/* Messages fill whole chat (under floating header + composer). Wallpaper = .chat-view. */
#app.ui-telegram #messages.discord-messages {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  width: auto !important;
  height: auto !important;
  max-height: none !important;
  z-index: 1;
  display: flex !important;
  flex-direction: column !important;
  overflow-x: hidden !important;
  overflow-y: scroll !important;
  overflow-anchor: none !important;
  overscroll-behavior: contain;
  padding-top: var(--tg-sticky-date-top);
  padding-bottom: var(--tg-composer-clearance, 80px);
  /* No side pad — scrollbar must sit flush to the window edge (Fitts) */
  padding-left: 0;
  padding-right: 0;
  margin: 0 !important;
  background-color: transparent !important;
  background-image: none !important;
  box-sizing: border-box !important;
  /* Fade messages under floating header + above composer (Telegram Web A) */
  -webkit-mask-image:
    linear-gradient(
      to bottom,
      transparent 0,
      #000 var(--tg-msg-fade-top),
      #000 calc(100% - var(--tg-msg-fade-bottom)),
      transparent 100%
    ),
    linear-gradient(#000, #000);
  -webkit-mask-size:
    calc(100% - var(--tg-msg-scroll-w)) 100%,
    var(--tg-msg-scroll-w) 100%;
  -webkit-mask-position: 0 0, 100% 0;
  -webkit-mask-repeat: no-repeat, no-repeat;
  mask-image:
    linear-gradient(
      to bottom,
      transparent 0,
      #000 var(--tg-msg-fade-top),
      #000 calc(100% - var(--tg-msg-fade-bottom)),
      transparent 100%
    ),
    linear-gradient(#000, #000);
  mask-size:
    calc(100% - var(--tg-msg-scroll-w)) 100%,
    var(--tg-msg-scroll-w) 100%;
  mask-position: 0 0, 100% 0;
  mask-repeat: no-repeat, no-repeat;
}

#app.ui-telegram #messages.discord-messages > .message-day-group,
#app.ui-telegram #messages.discord-messages > .dm-welcome {
  flex: 0 0 auto;
}

#app.ui-telegram #messages.discord-messages::before {
  content: "" !important;
  display: block !important;
  flex: 1 0 auto;
  min-height: 0;
  width: 100%;
  order: -1;
}

#app.ui-telegram #messages.discord-messages.is-date-jumping::before {
  flex: 0 0 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
}

#app.ui-telegram #messages.discord-messages::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  background: transparent;
}

#app.ui-telegram #messages.discord-messages::-webkit-scrollbar-button,
#app.ui-telegram #messages.discord-messages::-webkit-scrollbar-button:start:decrement,
#app.ui-telegram #messages.discord-messages::-webkit-scrollbar-button:end:increment,
#app.ui-telegram #messages.discord-messages::-webkit-scrollbar-button:vertical:start:decrement,
#app.ui-telegram #messages.discord-messages::-webkit-scrollbar-button:vertical:end:increment,
#app.ui-telegram #messages.discord-messages::-webkit-scrollbar-button:single-button,
#app.ui-telegram #messages.discord-messages::-webkit-scrollbar-button:double-button,
#app.ui-telegram #messages.discord-messages::-webkit-scrollbar-button:vertical:single-button:start,
#app.ui-telegram #messages.discord-messages::-webkit-scrollbar-button:vertical:single-button:end {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

#app.ui-telegram #messages.discord-messages::-webkit-scrollbar-track,
#app.ui-telegram #messages.discord-messages::-webkit-scrollbar-track-piece,
#app.ui-telegram #messages.discord-messages::-webkit-scrollbar-corner {
  background: transparent !important;
  border: 0 !important;
  margin: 0 !important;
}

@property --tg-msg-scroll-thumb {
  syntax: '<color>';
  inherits: true;
  initial-value: rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .discord-chat {
  --tg-msg-scroll-thumb: rgba(255, 255, 255, 0.06);
  transition: --tg-msg-scroll-thumb 0.45s ease;
}

#app.ui-telegram .discord-chat:hover,
#app.ui-telegram .discord-chat.is-pointer-inside {
  --tg-msg-scroll-thumb: rgba(255, 255, 255, 0.18);
}

#app.ui-telegram #messages.discord-messages::-webkit-scrollbar-thumb {
  min-height: 40px;
  border: 0 !important;
  border-radius: 99px;
  background-color: var(--tg-msg-scroll-thumb) !important;
  background-clip: border-box !important;
  box-shadow: none !important;
}

#app.ui-telegram #messages.discord-messages::-webkit-scrollbar-thumb:hover {
  background-color: rgba(255, 255, 255, 0.26) !important;
  border: 0 !important;
}

#app.ui-telegram #messages.discord-messages::-webkit-scrollbar-thumb:active {
  background-color: rgba(255, 255, 255, 0.32) !important;
  border: 0 !important;
}

@supports not selector(::-webkit-scrollbar) {
  #app.ui-telegram #messages.discord-messages {
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.1) transparent;
  }

  #app.ui-telegram .home-scroll {
    scrollbar-width: thin;
    scrollbar-color: #4d4d4d transparent;
  }
}

#app.ui-telegram .discord-typing,
#app.ui-telegram .mention-picker,
#app.ui-telegram .official-composer-notice {
  position: absolute;
  left: 50%;
  z-index: 5;
  width: min(100%, var(--tg-middle-column-width));
  margin: 0 !important;
  transform: translateX(-50%);
  box-sizing: border-box;
  pointer-events: none;
  background: transparent !important;
}

#app.ui-telegram .discord-typing {
  bottom: calc(var(--tg-composer-clearance, 80px) - 8px);
}

#app.ui-telegram .mention-picker,
#app.ui-telegram .official-composer-notice {
  bottom: calc(var(--tg-composer-clearance, 80px) - 8px);
  pointer-events: auto;
}

#app.ui-telegram .message-day-group {
  display: block;
  position: relative;
  width: 100%;
}

#app.ui-telegram .message-day-group .date-separator {
  position: sticky;
  /* Scrollport padding already clears the header; top:0 sticks just under it */
  top: 0;
  z-index: 4;
  margin: 14px 0 16px;
  pointer-events: none;
}

/* Keep sticky confined to its day — prevents two chips stacking while scrolling */
#app.ui-telegram .date-separator {
  position: sticky;
  top: 0;
  z-index: 4;
  margin: 14px 0 16px;
  pointer-events: none;
  cursor: default;
}

/* During jump-to-date, freeze sticky so scroll math is stable */
#app.ui-telegram #messages.discord-messages.is-date-jumping .date-separator {
  position: static !important;
  top: auto !important;
}

#app.ui-telegram .date-separator span,
#app.ui-telegram .date-separator__chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 5px 12px;
  border-radius: 14px;
  background: rgba(28, 28, 28, 0.52);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  color: #fff !important;
  opacity: 1 !important;
  font-size: 13px;
  font-weight: 700;
  line-height: 18px;
  letter-spacing: 0.01em;
  -webkit-font-smoothing: antialiased;
  transition: background 0.12s ease;
  box-sizing: border-box;
  cursor: pointer;
  pointer-events: auto;
}

#app.ui-telegram .date-separator:hover span,
#app.ui-telegram .date-separator:hover .date-separator__chip,
#app.ui-telegram .date-separator span:hover,
#app.ui-telegram .date-separator__chip:hover,
#app.ui-telegram .date-separator span:focus-visible,
#app.ui-telegram .date-separator__chip:focus-visible {
  background: rgba(48, 48, 48, 0.72);
}

#app.ui-telegram .discord-message {
  width: 100%;
  max-width: none;
  margin: 3px 0;
  margin-left: 0;
  margin-right: 0;
  padding: 1px max(8px, calc((100% - var(--tg-middle-column-width)) / 2)) !important;
  padding-right: max(8px, calc((100% - var(--tg-middle-column-width)) / 2)) !important;
  border-radius: 0;
  background: transparent !important;
}

#app.ui-telegram .discord-message:not(.is-compact) {
  margin-top: 8px;
}

#app.ui-telegram .discord-message.is-compact {
  margin-top: 2px;
}

#app.ui-telegram .discord-message.is-me {
  margin-right: 0;
  border-radius: 0;
  background: transparent !important;
}

#app.ui-telegram .discord-message__content {
  max-width: min(420px, 72vw) !important;
  padding: 6px 9px 5px;
  border-radius: 12px 12px 12px 4px;
  font-size: 16px;
  line-height: 1.3;
}

#app.ui-telegram .discord-message.is-me .discord-message__content {
  border-radius: 12px 12px 4px 12px;
}

#app.ui-telegram .discord-message:not(:has(+ .discord-message.is-compact)) .discord-message__content::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: -5px;
  width: 9px;
  height: 13px;
  background: var(--tg-bubble);
  clip-path: polygon(100% 0, 100% 100%, 0 100%, 55% 74%);
}

#app.ui-telegram .discord-message.is-me:not(:has(+ .discord-message.is-compact)) .discord-message__content::after {
  right: -5px;
  left: auto;
  background: var(--tg-bubble-me);
  clip-path: polygon(0 0, 45% 74%, 100% 100%, 0 100%);
}

#app.ui-telegram .discord-message__text {
  font-size: 16px;
  font-weight: 500;
  line-height: 1.3;
  word-break: normal !important;
  overflow-wrap: anywhere;
}

#app.ui-telegram .discord-message__body {
  position: relative;
  padding-bottom: 0;
}

#app.ui-telegram .discord-message__text {
  padding-right: 42px;
}

#app.ui-telegram .discord-message.is-me .discord-message__text {
  padding-right: 64px;
}

#app.ui-telegram .discord-message.is-me.has-read-receipt .discord-message__text {
  padding-right: 72px;
}

/* Emoji-only: slightly larger than text, not Discord jumbo */
#app.ui-telegram .discord-message__text.is-emoji-only {
  letter-spacing: 0.02em;
  padding-right: 42px;
}

#app.ui-telegram .discord-message.is-me .discord-message__text.is-emoji-only {
  padding-right: 64px;
}

#app.ui-telegram .discord-message.is-me.has-read-receipt .discord-message__text.is-emoji-only {
  padding-right: 72px;
}

#app.ui-telegram .discord-message__text.is-emoji-only.is-emoji-jumbo {
  font-size: 32px !important;
  line-height: 1.15 !important;
}

#app.ui-telegram .discord-message__text.is-emoji-only.is-emoji-large {
  font-size: 28px !important;
  line-height: 1.2 !important;
}

#app.ui-telegram
  .discord-message__text.is-emoji-only:not(.is-emoji-jumbo):not(.is-emoji-large) {
  font-size: 24px !important;
  line-height: 1.25 !important;
}

#app.ui-telegram .discord-message:has(> .discord-message__content .discord-message__text.is-emoji-only)
  .discord-message__content {
  padding-top: 6px;
  padding-bottom: 5px;
}

#app.ui-telegram .discord-message__time--inline {
  position: absolute;
  right: 0;
  bottom: 1px;
  float: none;
  margin: 0;
  font-size: 11px;
  line-height: 14px;
  white-space: nowrap;
  overflow: visible;
}

/* Telegram: no Discord «+» next to reactions; time stays on text row */
#app.ui-telegram .discord-message__reaction-add {
  display: none !important;
}

#app.ui-telegram .discord-message__reactions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  width: 100%;
  margin-top: 6px;
  line-height: 0;
}

#app.ui-telegram .discord-message__reaction {
  height: 26px;
  min-height: 26px;
  max-height: 26px;
  padding: 0 7px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.22);
  border-color: transparent;
}

#app.ui-telegram .discord-message__reaction:hover {
  background: rgba(0, 0, 0, 0.32);
}

#app.ui-telegram .discord-message__reaction.is-me {
  border-color: rgba(94, 181, 247, 0.55);
  background: rgba(94, 181, 247, 0.18);
}

#app.ui-telegram .discord-message.is-me .discord-message__reaction {
  background: rgba(0, 0, 0, 0.14);
}

#app.ui-telegram .discord-message.is-me .discord-message__reaction.is-me {
  border-color: rgba(255, 255, 255, 0.35);
  background: rgba(255, 255, 255, 0.14);
}

#app.ui-telegram .discord-message__reaction-count {
  color: rgba(255, 255, 255, 0.75);
  font-size: 13px;
}

#app.ui-telegram .discord-message__reaction.is-me .discord-message__reaction-count {
  color: rgba(255, 255, 255, 0.9);
}

#app.ui-telegram .discord-message__body:has(> .discord-message__reactions) {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: 10px;
  align-items: end;
}

#app.ui-telegram .discord-message__body:has(> .discord-message__reactions) > .discord-message__text {
  grid-column: 1;
  grid-row: 1;
  padding-right: 0;
}

#app.ui-telegram .discord-message__body:has(> .discord-message__reactions) > .discord-message__time--inline {
  grid-column: 2;
  grid-row: 1;
  position: static;
  float: none;
  margin: 0;
  align-self: end;
}

#app.ui-telegram .discord-message__body:has(> .discord-message__reactions) > .discord-message__reactions {
  grid-column: 1 / -1;
  grid-row: 2;
}

#app.ui-telegram
  .discord-message__body:has(> .discord-message__reactions)
  > :not(.discord-message__text):not(.discord-message__time--inline):not(.discord-message__reactions) {
  grid-column: 1 / -1;
}

#app.ui-telegram .chat-view:has(.discord-header__channel.is-dm-peer) .discord-message__header {
  display: none;
}

#app.ui-telegram .discord-message.is-me.has-read-receipt .tg-msg-ticks {
  display: inline-flex;
  align-items: center;
  margin-left: 4px;
  color: #fff;
  font-weight: 400;
  white-space: nowrap;
  font-size: 14px;
  line-height: 1;
  vertical-align: -1px;
  user-select: none;
  -webkit-user-select: none;
  pointer-events: none;
}

#app.ui-telegram .discord-message.is-me.has-read-receipt .tg-msg-ticks .tg-msg-tick {
  display: inline-block;
  font-style: normal;
  line-height: 1;
  color: inherit;
  user-select: none;
  -webkit-user-select: none;
}

#app.ui-telegram .discord-message.is-me.has-read-receipt .tg-msg-ticks .tg-msg-tick::before {
  content: "✓";
}

#app.ui-telegram .discord-message.is-me.has-read-receipt .tg-msg-ticks .tg-msg-tick + .tg-msg-tick {
  margin-left: -0.42em;
}

#app.ui-telegram .discord-message.is-me.has-read-receipt .tg-msg-ticks[data-read='0'] {
  color: #fff;
  opacity: 0.92;
}

#app.ui-telegram .discord-message.is-media-only.is-me.has-read-receipt .tg-msg-ticks,
#app.ui-telegram .discord-message.is-media-only.is-me.has-read-receipt .tg-msg-ticks[data-read='0'] {
  color: #fff;
}

#app.ui-telegram .discord-system-message:not(.tg-call-bubble) {
  display: flex !important;
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  margin: 10px 0;
  min-height: 0;
  /* Same middle-column band as bubbles */
  padding-left: max(8px, calc((100% - var(--tg-middle-column-width)) / 2)) !important;
  padding-right: max(8px, calc((100% - var(--tg-middle-column-width)) / 2)) !important;
  grid-template-columns: none !important;
  column-gap: 0 !important;
  text-align: center;
  color: rgba(255, 255, 255, 0.72);
  font-size: 13px;
  line-height: 1.35;
}

#app.ui-telegram .discord-system-message.is-tg-system .discord-system-message__icon,
#app.ui-telegram .discord-system-message:not(.tg-call-bubble) .discord-system-message__icon {
  display: none !important;
}

#app.ui-telegram .discord-system-message:not(.tg-call-bubble) .discord-system-message__content {
  display: inline;
  max-width: min(420px, 88%);
  margin: 0;
  padding: 5px 12px;
  border-radius: 12px;
  background: rgba(50, 50, 50, 0.72);
  box-shadow: none;
  color: rgba(255, 255, 255, 0.78);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.35;
  text-align: center;
  overflow-wrap: anywhere;
}

#app.ui-telegram .discord-system-message:not(.tg-call-bubble) .discord-system-message__nick {
  color: #fff;
  font-weight: 600;
  text-decoration: none;
}

#app.ui-telegram .discord-system-message:not(.tg-call-bubble) .discord-system-message__nick:hover {
  text-decoration: none;
}

#app.ui-telegram .discord-system-message:not(.tg-call-bubble) .discord-system-message__action,
#app.ui-telegram .discord-system-message:not(.tg-call-bubble) .discord-system-message__group-rename-name {
  color: rgba(255, 255, 255, 0.78);
  font-weight: 400;
}

#app.ui-telegram .discord-system-message:not(.tg-call-bubble) .discord-system-message__group-rename-name {
  color: #fff;
  font-weight: 600;
}

#app.ui-telegram .discord-system-message:not(.tg-call-bubble) .discord-system-message__time,
#app.ui-telegram .discord-system-message:not(.tg-call-bubble) .discord-system-message__edit-group {
  display: none !important;
}

#app.ui-telegram .discord-system-message + .discord-system-message:not(.tg-call-bubble) {
  margin-top: 6px;
}

/* Call events — same lane as chat bubbles (left peer / right me), with avatar gutter in groups */
#app.ui-telegram .tg-call-bubble {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  justify-items: start;
  align-items: end;
  width: 100%;
  max-width: none;
  min-height: 0 !important;
  margin: 6px 0;
  padding: 1px max(8px, calc((100% - var(--tg-middle-column-width)) / 2)) !important;
  box-sizing: border-box;
  font-size: inherit;
}

#app.ui-telegram .tg-call-bubble .discord-system-message__icon {
  display: none;
}

#app.ui-telegram .tg-call-bubble.is-me {
  justify-items: end;
}

#app.ui-telegram .tg-call-bubble.is-peer {
  justify-items: start;
}

/* Match group peer message column (40px avatar + 8px gap) */
#app.ui-telegram
  .chat-view:has(.discord-header__channel.is-group)
  .tg-call-bubble.is-peer {
  grid-template-columns: 40px minmax(0, 1fr) !important;
  column-gap: 8px !important;
}

#app.ui-telegram
  .chat-view:has(.discord-header__channel.is-group)
  .tg-call-bubble.is-peer::before {
  content: "";
  grid-column: 1;
  width: 36px;
  height: 36px;
}

#app.ui-telegram
  .chat-view:has(.discord-header__channel.is-group)
  .tg-call-bubble.is-peer
  .tg-call-bubble__card {
  grid-column: 2;
  justify-self: start;
}

#app.ui-telegram .tg-call-bubble__card {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-width: 168px;
  max-width: min(420px, 72vw);
  padding: 10px 12px 8px;
  border-radius: 14px 14px 14px 4px;
  background: var(--tg-bubble);
  color: #fff;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.18);
}

#app.ui-telegram .tg-call-bubble.is-me .tg-call-bubble__card {
  border-radius: 14px 14px 4px 14px;
  background: var(--tg-bubble-me);
}

#app.ui-telegram .tg-call-bubble.is-peer .tg-call-bubble__card::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: -5px;
  width: 9px;
  height: 13px;
  background: var(--tg-bubble);
  clip-path: polygon(100% 0, 100% 100%, 0 100%, 55% 74%);
}

#app.ui-telegram .tg-call-bubble.is-me .tg-call-bubble__card::after {
  content: "";
  position: absolute;
  right: -5px;
  bottom: 0;
  left: auto;
  width: 9px;
  height: 13px;
  background: var(--tg-bubble-me);
  clip-path: polygon(0 0, 0 100%, 100% 100%, 45% 74%);
}

#app.ui-telegram .tg-call-bubble__icon {
  display: grid;
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
  place-items: center;
  margin-top: 1px;
  color: rgba(255, 255, 255, 0.95);
}

#app.ui-telegram .tg-call-bubble__icon svg {
  width: 22px;
  height: 22px;
  transform: rotate(6deg);
}

#app.ui-telegram .tg-call-bubble__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

#app.ui-telegram .tg-call-bubble__title {
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
}

#app.ui-telegram .tg-call-bubble__meta {
  display: flex;
  align-items: center;
  gap: 5px;
  min-height: 16px;
}

#app.ui-telegram .tg-call-bubble__arrow {
  display: inline-grid;
  width: 14px;
  height: 14px;
  place-items: center;
}

#app.ui-telegram .tg-call-bubble__arrow svg {
  width: 12px;
  height: 12px;
}

#app.ui-telegram .tg-call-bubble__arrow.is-bad {
  color: #ff6b6b;
}

#app.ui-telegram .tg-call-bubble__arrow.is-ok {
  color: #5ecf6a;
}

#app.ui-telegram .tg-call-bubble__duration {
  color: rgba(255, 255, 255, 0.72);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

#app.ui-telegram .tg-call-bubble__time {
  margin-left: auto;
  color: rgba(255, 255, 255, 0.55);
  font-size: 12px;
  line-height: 1;
}

#app.ui-telegram .discord-typing {
  bottom: 72px;
  padding-right: 12px;
  padding-left: 14px;
  font-size: 12px;
}

#app.ui-telegram .official-composer-notice:not(.hidden) {
  display: none !important;
}

#app.ui-telegram .official-composer-notice__icon {
  margin: 0;
}

#app.ui-telegram .official-composer-notice__text {
  margin: 0;
  max-width: 320px;
  text-align: center;
  color: rgba(255, 255, 255, 0.82);
}

@media (max-width: 1100px) {
  #app.discord-app.ui-telegram {
    grid-template-columns:
      var(--sidebar-width) var(--tg-float-gap) minmax(0, 1fr) 0px !important;
  }
}

@media (max-width: 760px) {
  #app.discord-app.ui-telegram {
    grid-template-columns:
      var(--sidebar-width) var(--tg-float-gap) minmax(0, 1fr) 0px !important;
  }

  #app.ui-telegram .chat-view,
  #app.ui-telegram .discord-workspace {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #app.ui-telegram .discord-header {
    left: 10px;
    right: 10px;
    width: auto;
    max-width: none;
  }

  #app.ui-telegram .discord-chat {
    grid-column: 1;
  }
}

/* Nick semibold; last message regular + muted (Telegram Web A). */
#app.discord-app.ui-telegram .dm-item .dm-item__name,
#app.discord-app.ui-telegram .channel-item.dm-item .dm-item__name {
  font-size: 17px !important;
  line-height: 21px !important;
  font-weight: 600 !important;
  color: #fff !important;
}
#app.discord-app.ui-telegram .dm-item .dm-item__subtitle,
#app.discord-app.ui-telegram .channel-item.dm-item .dm-item__subtitle {
  font-size: 16px !important;
  line-height: 20px !important;
  font-weight: 400 !important;
  color: var(--tg-muted, #8b8b8b) !important;
}
#app.discord-app.ui-telegram .dm-item.active .dm-item__subtitle,
#app.discord-app.ui-telegram .channel-item.dm-item.active .dm-item__subtitle {
  color: rgba(255, 255, 255, 0.85) !important;
}

/* Media viewer — Telegram-like chrome for avatar / photo */
#app.ui-telegram .media-viewer {
  background: rgba(0, 0, 0, 0.78);
}

#app.ui-telegram .media-viewer__top {
  padding: 10px 12px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.55), transparent);
}

#app.ui-telegram .media-viewer__action {
  border: 0;
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
  color: #fff;
}

#app.ui-telegram .media-viewer__action:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
}

#app.ui-telegram .media-viewer__close svg {
  stroke: currentColor;
}

#app.ui-telegram .header-avatar.has-photo {
  cursor: pointer;
}

#app.ui-telegram .discord-header__channel strong,
#app.ui-telegram .discord-header__channel .discord-header__title--editable,
#app.ui-telegram .discord-header__channel .discord-header__title--editable:hover,
#app.ui-telegram .discord-header__channel.is-dm-peer .discord-header__title--editable:hover,
#app.ui-telegram #roomName,
#app.ui-telegram #roomName:hover {
  text-decoration: none !important;
  background: transparent !important;
  cursor: pointer;
}

/* ===== TG Group create flow (FAB menu + in-sidebar steps) ===== */

#app.ui-telegram .tg-new-chat-btn__icon {
  width: 22px;
  height: 22px;
}

#app.ui-telegram .tg-new-chat-btn__icon[hidden] {
  display: none;
}

#app.ui-telegram .tg-new-chat-menu {
  display: none !important;
}

#app.ui-telegram .tg-new-chat-menu.is-closing {
  animation: tgNewChatMenuOut 0.16s cubic-bezier(0.4, 0, 0.2, 1) forwards;
  display: block !important;
}

#app.ui-telegram .tg-new-chat-menu.hidden:not(.is-closing),
#app.ui-telegram .tg-new-chat-menu[hidden]:not(.is-closing) {
  display: none !important;
}

@keyframes tgNewChatMenuOut {
  from {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  to {
    opacity: 0;
    transform: translateY(8px) scale(0.92);
  }
}

@keyframes tgNewChatMenuIn {
  from {
    opacity: 0;
    transform: translateY(8px) scale(0.92);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

#app.ui-telegram .tg-new-chat-menu__item {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #fff;
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  text-align: left;
}

#app.ui-telegram .tg-new-chat-menu__item:hover {
  background: rgba(255, 255, 255, 0.07);
}

#app.ui-telegram .tg-new-chat-menu__item svg {
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
  color: #aaaaaa;
}

#app.ui-telegram #homeSidebar.tg-fab-menu-open .tg-new-chat-btn {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0) scale(1);
  transition:
    opacity 0.14s ease 0s,
    transform 0.42s cubic-bezier(0.22, 1.55, 0.36, 1) 0s,
    visibility 0s linear 0s,
    background 0.15s ease;
}

/* Panel replaces the chat list */
#app.ui-telegram #homeSidebar.is-group-creating .home-scroll {
  display: none !important;
}

#app.ui-telegram .tg-group-create {
  display: flex;
  min-height: 0;
  flex: 1 1 0%;
  flex-direction: column;
  height: 0;
  overflow: hidden;
  animation: tgGroupCreateIn 0.22s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes tgGroupCreateIn {
  from {
    opacity: 0;
    transform: translateX(24px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

#app.ui-telegram .tg-group-create.hidden,
#app.ui-telegram .tg-group-create[hidden] {
  display: none !important;
}

#app.ui-telegram .tg-group-create__header {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
}

#app.ui-telegram .tg-group-create__back {
  display: grid;
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--tg-muted);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

#app.ui-telegram .tg-group-create__back:hover {
  background: var(--tg-sidebar-hover);
  color: var(--tg-text);
}

#app.ui-telegram .tg-group-create__back svg {
  width: 24px;
  height: 24px;
}

#app.ui-telegram .tg-group-create__header h2 {
  overflow: hidden;
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#app.ui-telegram .tg-group-create__step {
  display: flex;
  min-height: 0;
  flex: 1 1 0%;
  flex-direction: column;
}

#app.ui-telegram .tg-group-create__step.hidden,
#app.ui-telegram .tg-group-create__step[hidden] {
  display: none !important;
}

#app.ui-telegram .tg-group-create__chips {
  display: flex;
  flex: 0 0 auto;
  gap: 10px;
  padding: 8px 12px 4px;
  overflow-x: auto;
  scrollbar-width: none;
}

#app.ui-telegram .tg-group-create__chips::-webkit-scrollbar {
  display: none;
}

#app.ui-telegram .tg-group-create__chip {
  position: relative;
  display: grid;
  width: 52px;
  flex: 0 0 auto;
  place-items: center;
  border: 0;
  background: transparent;
  cursor: pointer;
}

#app.ui-telegram .tg-group-create__chip .discord-avatar {
  width: 46px;
  height: 46px;
  border-radius: 50%;
}

#app.ui-telegram .tg-group-create__chip .discord-avatar > i {
  display: none !important;
}

#app.ui-telegram .tg-group-create__chip::after {
  content: "";
  position: absolute;
  top: -2px;
  right: -2px;
  width: 18px;
  height: 18px;
  border: 2px solid var(--tg-panel-bg, #212121);
  border-radius: 50%;
  background: var(--tg-muted) center / 10px 10px no-repeat
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3C/svg%3E");
}

#app.ui-telegram .tg-group-create__search {
  flex: 0 0 auto;
  padding: 8px 12px;
}

#app.ui-telegram .tg-group-create__search input {
  width: 100%;
  box-sizing: border-box;
  padding: 9px 14px;
  border: 0;
  border-radius: 10px;
  outline: none;
  background: var(--tg-sidebar-hover);
  color: var(--tg-text);
  font: inherit;
  font-size: 15px;
}

#app.ui-telegram .tg-group-create__search input::placeholder {
  color: var(--tg-muted);
}

#app.ui-telegram .tg-group-create__list {
  display: flex;
  min-height: 0;
  flex: 1 1 0%;
  flex-direction: column;
  overflow-y: auto;
  padding-bottom: 84px;
}

#app.ui-telegram .tg-group-create__empty {
  margin: 0;
  padding: 28px 20px;
  color: var(--tg-muted);
  font-size: 14px;
  text-align: center;
}

/* member row = tg-people-search__item + round checkbox */
#app.ui-telegram .tg-group-create__item {
  grid-template-columns: 48px minmax(0, 1fr) 26px;
}

#app.ui-telegram .tg-group-create__check {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  box-sizing: border-box;
  border: 2px solid var(--tg-muted);
  border-radius: 50%;
  color: #fff;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

#app.ui-telegram .tg-group-create__check svg {
  width: 14px;
  height: 14px;
  opacity: 0;
  transform: scale(0.4);
  transition: opacity 0.15s ease, transform 0.18s cubic-bezier(0.22, 1.55, 0.36, 1);
}

#app.ui-telegram .tg-group-create__item.is-selected .tg-group-create__check {
  border-color: var(--tg-blue);
  background: var(--tg-blue);
}

#app.ui-telegram .tg-group-create__item.is-selected .tg-group-create__check svg {
  opacity: 1;
  transform: scale(1);
}

/* info step */
#app.ui-telegram .tg-group-create__identity {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 16px;
  padding: 14px 16px 18px;
}

#app.ui-telegram .tg-group-create__avatar {
  position: relative;
  display: grid;
  width: 64px;
  height: 64px;
  flex: 0 0 auto;
  place-items: center;
  overflow: hidden;
  border: 0;
  border-radius: 50%;
  background: rgba(135, 116, 225, 0.16);
  color: var(--tg-blue);
  cursor: pointer;
  transition: background 0.15s ease;
}

#app.ui-telegram .tg-group-create__avatar:hover {
  background: rgba(135, 116, 225, 0.28);
}

#app.ui-telegram .tg-group-create__avatar svg {
  width: 28px;
  height: 28px;
}

#app.ui-telegram .tg-group-create__avatar img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#app.ui-telegram .tg-group-create__identity input {
  min-width: 0;
  flex: 1 1 auto;
  padding: 10px 0;
  border: 0;
  border-bottom: 2px solid var(--tg-sidebar-hover);
  outline: none;
  background: transparent;
  color: var(--tg-text);
  font: inherit;
  font-size: 16px;
  transition: border-color 0.15s ease;
}

#app.ui-telegram .tg-group-create__identity input:focus {
  border-bottom-color: var(--tg-blue);
}

#app.ui-telegram .tg-group-create__identity input::placeholder {
  color: var(--tg-muted);
}

#app.ui-telegram .tg-group-create__members-title {
  flex: 0 0 auto;
  margin: 0;
  padding: 6px 16px 8px;
  color: var(--tg-blue);
  font-size: 14px;
  font-weight: 600;
}

/* FAB turns into the action button while creating */
#app.ui-telegram #homeSidebar.is-group-creating .tg-new-chat-btn {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0) scale(1);
  transition:
    opacity 0.14s ease 0s,
    transform 0.42s cubic-bezier(0.22, 1.55, 0.36, 1) 0s,
    visibility 0s linear 0s,
    background 0.15s ease;
}

#app.ui-telegram #homeSidebar.is-group-creating.tg-fab-disabled .tg-new-chat-btn {
  opacity: 0.45;
  pointer-events: none;
  transform: translateY(0) scale(1);
  transition:
    opacity 0.18s ease 0s,
    transform 0.42s cubic-bezier(0.22, 1.55, 0.36, 1) 0s,
    visibility 0s linear 0s,
    background 0.15s ease;
}

#app.ui-telegram #homeSidebar.is-tg-settings {
  overflow: hidden;
}

#app.ui-telegram #homeSidebar.is-tg-settings .home-scroll {
  pointer-events: none;
}

#app.ui-telegram #homeSidebar.is-tg-settings .tg-new-chat-btn,
#app.ui-telegram #homeSidebar.is-tg-settings .tg-new-chat-menu,
#app.ui-telegram #homeSidebar.is-tg-settings .tg-group-create {
  display: none !important;
}

#app.ui-telegram .tg-settings-panel {
  position: absolute;
  inset: 0;
  z-index: 40;
  display: flex;
  min-height: 0;
  flex-direction: column;
  overflow: hidden;
  background: var(--tg-sidebar);
  animation: tgSettingsIn 0.24s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes tgSettingsIn {
  from {
    opacity: 0;
    transform: translateX(-18px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

#app.ui-telegram .tg-settings-panel.is-leaving {
  display: flex !important;
  animation: tgSettingsOut 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes tgSettingsOut {
  from {
    opacity: 1;
    transform: translateX(0);
  }
  to {
    opacity: 0;
    transform: translateX(-14px);
  }
}

#app.ui-telegram .tg-settings-panel.hidden:not(.is-leaving),
#app.ui-telegram .tg-settings-panel[hidden]:not(.is-leaving) {
  display: none !important;
}

#app.ui-telegram .tg-settings-panel__header {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 4px;
  min-height: 56px;
  padding: 6px 8px;
}

#app.ui-telegram .tg-settings-panel__header h2 {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  color: #fff;
  font-size: 18px;
  font-weight: 600;
}

#app.ui-telegram .tg-settings-panel__back,
#app.ui-telegram .tg-settings-panel__icon-btn {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--tg-muted);
  cursor: pointer;
}

#app.ui-telegram .tg-settings-panel__back:hover,
#app.ui-telegram .tg-settings-panel__icon-btn:hover {
  background: var(--tg-sidebar-hover);
  color: #fff;
}

#app.ui-telegram .tg-settings-panel__back svg,
#app.ui-telegram .tg-settings-panel__icon-btn svg {
  width: 24px;
  height: 24px;
}

#app.ui-telegram .tg-settings-panel__body {
  position: absolute;
  inset: 0;
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 8px 16px 24px;
  opacity: 0;
  visibility: hidden;
  transform: translateX(18px);
  pointer-events: none;
  transition:
    opacity 0.24s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.28s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 0.28s;
}

#app.ui-telegram .tg-settings-panel__pages {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}

#app.ui-telegram .tg-settings-panel__body.is-active {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
  pointer-events: auto;
  transition:
    opacity 0.24s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.28s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 0s;
}

#app.ui-telegram .tg-settings-panel__body.is-active.is-leaving.is-exit-forward {
  opacity: 0;
  transform: translateX(-20px);
  pointer-events: none;
}

#app.ui-telegram .tg-settings-panel__body.is-active.is-leaving.is-exit-back {
  opacity: 0;
  transform: translateX(20px);
  pointer-events: none;
}

#app.ui-telegram .tg-settings-panel__body.is-entering.is-enter-forward:not(.is-active) {
  opacity: 0;
  transform: translateX(20px);
}

#app.ui-telegram .tg-settings-panel__body.is-entering.is-enter-back:not(.is-active) {
  opacity: 0;
  transform: translateX(-20px);
}

#app.ui-telegram .tg-settings-panel__body.hidden:not(.is-leaving):not(.is-entering),
#app.ui-telegram .tg-settings-panel__body[hidden]:not(.is-leaving):not(.is-entering) {
  display: none !important;
}

#app.ui-telegram .tg-settings-panel__body.is-leaving,
#app.ui-telegram .tg-settings-panel__body.is-entering {
  display: block !important;
}

#app.ui-telegram .tg-settings-panel__hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 12px 8px 20px;
  text-align: center;
}

#app.ui-telegram .tg-settings-panel__avatar.discord-avatar {
  flex: 0 0 auto;
  width: 96px;
  height: 96px;
  min-width: 96px;
  min-height: 96px;
  max-width: 96px;
  max-height: 96px;
  aspect-ratio: 1;
  border-radius: 50%;
  overflow: hidden;
  font-size: 36px;
  font-weight: 700;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

#app.ui-telegram .tg-settings-panel__avatar > i {
  display: none !important;
}

#app.ui-telegram .tg-settings-panel__hero strong {
  margin: 12px 0 2px;
  color: #fff;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
}

#app.ui-telegram .tg-settings-panel__hero p {
  margin: 0;
  color: var(--tg-muted);
  font-size: 14px;
}

#app.ui-telegram .tg-settings-panel__nav {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 16px 0 0;
  padding: 8px 6px;
  border-radius: 16px;
  background: #181818;
}

#app.ui-telegram .tg-settings-panel__nav-item {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 0 10px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
}

#app.ui-telegram .tg-settings-panel__nav-item:hover {
  background: rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .tg-settings-panel__nav-icon {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  color: #aaa;
}

#app.ui-telegram .tg-settings-panel__nav-icon svg {
  width: 20px;
  height: 20px;
}

#app.ui-telegram .tg-settings-panel__meta {
  display: flex;
  flex-direction: column;
  margin: 4px 0 0;
  padding: 0;
  border-radius: 16px;
  background: #181818;
  overflow: hidden;
}

#app.ui-telegram .tg-settings-meta__row {
  padding: 12px 16px;
}

#app.ui-telegram .tg-settings-meta__row + .tg-settings-meta__row {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .tg-settings-meta__label {
  display: block;
  margin: 0 0 4px;
  color: var(--tg-blue);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
}

#app.ui-telegram .tg-settings-meta__value {
  display: block;
  color: #fff;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.35;
  word-break: break-word;
}

#app.ui-telegram .tg-settings-meta__row--bio .tg-settings-meta__value {
  margin: 0;
  white-space: pre-wrap;
}

#app.ui-telegram .tg-settings-meta__row--bio.is-empty .tg-settings-meta__value {
  color: #8a8a8a;
}

#app.ui-telegram .tg-settings-panel__avatar-btn {
  display: grid;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
  border-radius: 50%;
  transition: transform 0.16s ease, filter 0.16s ease;
}

#app.ui-telegram .tg-settings-panel__avatar-btn:hover {
  transform: scale(1.03);
}

#app.ui-telegram .tg-settings-panel__avatar-btn:active {
  transform: scale(0.98);
}

#app.ui-telegram .tg-settings-panel__avatar-btn:not(.has-photo) {
  cursor: default;
}

#app.ui-telegram .tg-settings-panel__avatar-btn:not(.has-photo):hover {
  transform: none;
}

#app.ui-telegram .tg-settings-panel__avatar-edit {
  position: relative;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 96px;
  height: 96px;
  margin: 8px auto 20px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

#app.ui-telegram .tg-settings-panel__camera {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.42);
  color: #fff;
}

#app.ui-telegram .tg-settings-panel__camera svg {
  width: 28px;
  height: 28px;
}

#app.ui-telegram .tg-settings-panel__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0 0 14px;
  color: var(--tg-muted);
  font-size: 13px;
}

#app.ui-telegram .tg-settings-panel__field input,
#app.ui-telegram .tg-settings-panel__field textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  background: #181818;
  color: #fff;
  font: inherit;
  font-size: 16px;
  resize: none;
  outline: none;
}

#app.ui-telegram .tg-settings-panel__field input:focus,
#app.ui-telegram .tg-settings-panel__field textarea:focus {
  border-color: var(--tg-blue);
}

#app.ui-telegram .tg-settings-panel__error {
  margin: 0;
  color: #ff8a80;
  font-size: 13px;
}

#app.ui-telegram .tg-settings-panel__error.hidden,
#app.ui-telegram .tg-settings-panel__error[hidden] {
  display: none !important;
}

#app.ui-telegram .tg-settings-panel__header-actions {
  position: relative;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
}

#app.ui-telegram .tg-settings-panel__header h2 {
  transition: opacity 0.18s ease;
}

#app.ui-telegram .tg-settings-panel.is-title-fade .tg-settings-panel__header h2 {
  opacity: 0.55;
}

#app.ui-telegram .tg-settings-panel__nav {
  padding: 8px 6px;
  border-radius: 16px;
  background: #181818;
}

#app.ui-telegram .tg-settings-panel__nav-item {
  min-height: 52px;
  padding: 8px 10px;
  border-radius: 12px;
  gap: 14px;
}

#app.ui-telegram .tg-settings-panel__nav-icon {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: #fff;
}

#app.ui-telegram .tg-settings-panel__nav-icon--appearance {
  background: #5eb5f7;
}

#app.ui-telegram .tg-settings-panel__nav-icon--interface {
  background: #eb7b4b;
}

#app.ui-telegram .tg-settings-panel__nav-icon--animations {
  background: #8774e1;
}

#app.ui-telegram .tg-settings-panel__nav-icon--voice {
  background: #4caf50;
}

#app.ui-telegram .tg-settings-panel__nav-icon--idea {
  background: #e8a017;
}

#app.ui-telegram .tg-settings-panel__nav-label {
  margin: 0 0 6px;
  padding: 0 10px;
  color: #8774e1;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
}

#app.ui-telegram .tg-settings-panel__nav--feedback {
  margin-top: 12px;
}

#app.ui-telegram .tg-settings-idea {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 8px 12px 24px;
  box-sizing: border-box;
}

#app.ui-telegram .tg-settings-idea__hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 8px 8px 4px;
  text-align: center;
}

#app.ui-telegram .tg-settings-idea__hero-icon {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 16px;
  background: linear-gradient(145deg, #e8a017, #c27a00);
  color: #fff;
  box-shadow: 0 8px 24px rgba(232, 160, 23, 0.28);
}

#app.ui-telegram .tg-settings-idea__hero-icon svg {
  width: 28px;
  height: 28px;
}

#app.ui-telegram .tg-settings-idea__lead {
  margin: 0;
  max-width: 320px;
  color: rgba(255, 255, 255, 0.62);
  font-size: 14px;
  line-height: 1.4;
}

#app.ui-telegram .tg-settings-idea__card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px;
  border-radius: 16px;
  background: #181818;
}

#app.ui-telegram .tg-settings-idea__section-label {
  margin: 0;
  color: #8774e1;
  font-size: 13px;
  font-weight: 600;
}

#app.ui-telegram .tg-settings-idea__section-label em {
  margin-left: 4px;
  color: rgba(255, 255, 255, 0.4);
  font-style: normal;
  font-weight: 500;
}

#app.ui-telegram .tg-settings-idea__cats,
.suggest-idea-cats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

#app.ui-telegram .tg-settings-idea__cats--iface,
.tg-settings-idea__cats--iface {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .tg-settings-idea__cats--iface[hidden],
.tg-settings-idea__cats--iface[hidden] {
  display: none !important;
}

#app.ui-telegram .tg-settings-idea__cat,
.tg-settings-idea__cat {
  margin: 0;
  padding: 8px 12px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.72);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}

#app.ui-telegram .tg-settings-idea__cat.is-active,
.tg-settings-idea__cat.is-active {
  border-color: transparent;
  background: #8774e1;
  color: #fff;
}

#app.ui-telegram .tg-settings-idea__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

#app.ui-telegram .tg-settings-idea__field span {
  color: rgba(255, 255, 255, 0.45);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

#app.ui-telegram .tg-settings-idea__field input,
#app.ui-telegram .tg-settings-idea__field textarea {
  width: 100%;
  margin: 0;
  padding: 11px 12px;
  border: 0;
  border-radius: 12px;
  background: #2c2c2c;
  color: #fff;
  font: 400 15px / 1.35 "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  outline: none;
  box-sizing: border-box;
  resize: vertical;
}

#app.ui-telegram .tg-settings-idea__field input:focus,
#app.ui-telegram .tg-settings-idea__field textarea:focus {
  box-shadow: inset 0 0 0 2px #8774e1;
}

#app.ui-telegram .tg-settings-idea__photos,
.tg-settings-idea__photos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

#app.ui-telegram .tg-settings-idea__photo,
.tg-settings-idea__photo {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 1;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px dashed rgba(255, 255, 255, 0.16);
  border-radius: 14px;
  background: #121212;
  color: rgba(255, 255, 255, 0.55);
  cursor: pointer;
}

#app.ui-telegram .tg-settings-idea__photo.has-photo,
.tg-settings-idea__photo.has-photo {
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.08);
}

#app.ui-telegram .tg-settings-idea__photo img,
.tg-settings-idea__photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#app.ui-telegram .tg-settings-idea__photo-add,
.tg-settings-idea__photo-add {
  display: grid;
  justify-items: center;
  gap: 4px;
  color: rgba(255, 255, 255, 0.55);
  font-size: 12px;
}

#app.ui-telegram .tg-settings-idea__photo-add svg,
.tg-settings-idea__photo-add svg {
  width: 22px;
  height: 22px;
}

#app.ui-telegram .tg-settings-idea__photo-add em,
.tg-settings-idea__photo-add em {
  font-style: normal;
}

#app.ui-telegram .tg-settings-idea__photo-remove,
.tg-settings-idea__photo-remove {
  position: absolute;
  top: 6px;
  right: 6px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.62);
  color: #fff;
  font-size: 16px;
  line-height: 1;
}

#app.ui-telegram .tg-settings-idea__error {
  margin: 0;
  color: #ff8f8f;
  font-size: 13px;
}

#app.ui-telegram .tg-settings-idea__error.hidden {
  display: none !important;
}

#app.ui-telegram .tg-settings-idea__submit {
  width: 100%;
  min-height: 46px;
  margin: 4px 0 0;
  border: 0;
  border-radius: 12px;
  background: #8774e1;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
}

#app.ui-telegram .tg-settings-idea__submit:hover {
  background: #9584ea;
}

#app.ui-telegram .tg-settings-idea__submit:disabled {
  opacity: 0.65;
  cursor: wait;
}

#app.ui-telegram .tg-settings-panel__nav-icon svg {
  width: 18px;
  height: 18px;
}

#app.ui-telegram .tg-settings-panel__nav-text {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 2px;
}

#app.ui-telegram .tg-settings-panel__nav-title {
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.2;
}

#app.ui-telegram .tg-settings-panel__nav-sub {
  color: #8a8a8a;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.25;
}

#app.ui-telegram .tg-settings-panel__meta {
  padding: 0;
  border-radius: 16px;
}

#app.ui-telegram .tg-settings-more {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  z-index: 50;
  display: flex;
  min-width: 196px;
  flex-direction: column;
  padding: 6px;
  border-radius: 12px;
  background: #1c1c1c;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.06),
    0 12px 28px rgba(0, 0, 0, 0.55);
  transform-origin: calc(100% - 18px) 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: scale(0.92) translateY(-8px);
  transition:
    opacity 0.16s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.2s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 0.2s;
}

#app.ui-telegram .tg-settings-more.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: scale(1) translateY(0);
  transition:
    opacity 0.16s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.2s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 0s;
}

#app.ui-telegram .tg-settings-more.is-open,
#app.ui-telegram .tg-settings-more.is-closing {
  display: flex !important;
}

#app.ui-telegram .tg-settings-more.is-closing {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: scale(0.92) translateY(-8px);
}

#app.ui-telegram .tg-settings-more.hidden:not(.is-closing):not(.is-open),
#app.ui-telegram .tg-settings-more[hidden]:not(.is-closing):not(.is-open) {
  display: none !important;
}

#app.ui-telegram .tg-settings-more__item {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 10px 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
}

#app.ui-telegram .tg-settings-more__item:hover {
  background: rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .tg-settings-more__item--danger {
  color: #ff8a80;
}

#app.ui-telegram .tg-settings-more__icon {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  color: inherit;
}

#app.ui-telegram .tg-settings-more__icon svg {
  width: 20px;
  height: 20px;
}

#app.ui-telegram .tg-settings-card {
  margin: 0 0 12px;
  padding: 14px;
  border-radius: 16px;
  background: #181818;
}

#app.ui-telegram .tg-settings-card--list {
  padding: 6px;
}

#app.ui-telegram .tg-settings-card__label {
  margin: 0 0 10px;
  color: var(--tg-muted);
  font-size: 13px;
}

#app.ui-telegram .tg-settings-card__hint {
  margin: 8px 0 0;
  color: var(--tg-muted);
  font-size: 13px;
  text-align: center;
}

#app.ui-telegram .tg-settings-banner-preview {
  height: 72px;
  margin: 0 0 12px;
  border-radius: 12px;
  background: linear-gradient(135deg, #5865f2, #2c2f33);
}

#app.ui-telegram .tg-settings-swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

#app.ui-telegram .tg-settings-swatch {
  width: 28px;
  height: 28px;
  margin: 0;
  padding: 0;
  border: 2px solid transparent;
  border-radius: 50%;
  background: var(--swatch);
  cursor: pointer;
}

#app.ui-telegram .tg-settings-swatch.is-active {
  border-color: #fff;
  box-shadow: 0 0 0 2px var(--tg-blue);
}

#app.ui-telegram .tg-settings-choice,
#app.ui-telegram .tg-settings-toggle {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 52px;
  margin: 0;
  padding: 8px 10px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: #fff;
  text-align: left;
  cursor: pointer;
}

#app.ui-telegram .tg-settings-choice:hover,
#app.ui-telegram .tg-settings-toggle:hover {
  background: rgba(255, 255, 255, 0.05);
}

#app.ui-telegram .tg-settings-choice.is-soon {
  opacity: 0.55;
  cursor: default;
}

#app.ui-telegram .tg-settings-choice__text {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 2px;
}

#app.ui-telegram .tg-settings-choice__text strong {
  font-size: 15px;
  font-weight: 500;
}

#app.ui-telegram .tg-settings-choice__text small {
  color: #8a8a8a;
  font-size: 13px;
}

#app.ui-telegram .tg-settings-choice__check {
  display: grid;
  width: 22px;
  height: 22px;
  color: var(--tg-blue);
  opacity: 0;
}

#app.ui-telegram .tg-settings-choice.is-active .tg-settings-choice__check {
  opacity: 1;
}

#app.ui-telegram .tg-settings-choice__check svg {
  width: 22px;
  height: 22px;
}

#app.ui-telegram .tg-settings-switch {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  width: 38px;
  height: 22px;
  border-radius: 11px;
  background: #555;
  transition: background 0.16s ease;
}

#app.ui-telegram .tg-settings-switch.is-on,
#app.ui-telegram .tg-settings-toggle.is-on .tg-settings-switch {
  background: var(--tg-blue);
}

#app.ui-telegram .tg-settings-switch__knob {
  width: 18px;
  height: 18px;
  margin-left: 2px;
  border-radius: 50%;
  background: #fff;
  transition: transform 0.16s ease;
}

#app.ui-telegram .tg-settings-switch.is-on .tg-settings-switch__knob,
#app.ui-telegram .tg-settings-toggle.is-on .tg-settings-switch__knob {
  transform: translateX(16px);
}

#app.ui-telegram .tg-settings-toggle.is-disabled {
  opacity: 0.45;
}

#app.ui-telegram .tg-settings-select {
  width: 100%;
  padding: 11px 12px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  background: #212121;
  color: #fff;
  font: inherit;
  font-size: 15px;
}

#app.ui-telegram .tg-settings-range {
  width: 100%;
  accent-color: var(--tg-blue);
}

#app.ui-telegram .tg-settings-panel__field em {
  float: right;
  font-style: normal;
  color: #fff;
}

#app.ui-telegram .tg-settings-anim-hero {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 16px;
  padding: 16px;
  overflow: hidden;
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(135, 116, 225, 0.18), rgba(24, 24, 24, 0.96) 58%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .tg-settings-anim-hero__glow {
  position: absolute;
  top: -28px;
  right: -18px;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(135, 116, 225, 0.35), transparent 68%);
  pointer-events: none;
}

#app.ui-telegram .tg-settings-anim-hero__main {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

#app.ui-telegram .tg-settings-anim-hero__icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #8774e1;
  color: #fff;
  box-shadow: 0 8px 20px rgba(135, 116, 225, 0.28);
}

#app.ui-telegram .tg-settings-anim-hero__icon svg {
  width: 22px;
  height: 22px;
}

#app.ui-telegram .tg-settings-anim-hero__copy {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

#app.ui-telegram .tg-settings-anim-hero__copy strong {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.25;
}

#app.ui-telegram .tg-settings-anim-hero__copy small {
  color: #9a9a9a;
  font-size: 13px;
  line-height: 1.35;
}

#app.ui-telegram .tg-settings-anim-hero__actions {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}

#app.ui-telegram .tg-settings-anim-hero__pill {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(94, 181, 247, 0.16);
  color: #8fd0ff;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.01em;
}

#app.ui-telegram .tg-settings-anim-hero__pill.is-off {
  background: rgba(255, 255, 255, 0.08);
  color: #9a9a9a;
}

#app.ui-telegram .tg-settings-anim-hero__switch {
  display: inline-flex;
  margin: 0;
  padding: 4px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  cursor: pointer;
}

#app.ui-telegram .tg-settings-anim-hero__switch:hover {
  background: rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .tg-settings-anim-hero__switch.is-on .tg-settings-switch {
  background: var(--tg-blue);
}

#app.ui-telegram .tg-settings-anim-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#app.ui-telegram .tg-settings-anim-section__head {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 0 4px 2px;
}

#app.ui-telegram .tg-settings-anim-section__title {
  color: var(--tg-blue);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

#app.ui-telegram .tg-settings-anim-section__hint {
  color: #8a8a8a;
  font-size: 13px;
  line-height: 1.35;
}

#app.ui-telegram .tg-settings-anim-list {
  padding: 0;
  overflow: hidden;
}

#app.ui-telegram .tg-settings-anim-row {
  gap: 14px;
  min-height: 58px;
  padding: 10px 14px;
  border-radius: 0;
}

#app.ui-telegram .tg-settings-anim-row + .tg-settings-anim-row {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .tg-settings-anim-row__icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  color: #fff;
}

#app.ui-telegram .tg-settings-anim-row__icon svg {
  width: 18px;
  height: 18px;
}

#app.ui-telegram .tg-settings-anim-row__icon--chat {
  background: #5eb5f7;
}

#app.ui-telegram .tg-settings-anim-row__icon--members {
  background: #eb7b4b;
}

#app.ui-telegram .tg-settings-anim-row__icon--avatars {
  background: #57c7a7;
}

#app.ui-telegram .tg-settings-anim-row__icon--ui {
  background: #8774e1;
}

#app.ui-telegram .tg-settings-anim-list.is-disabled {
  opacity: 0.55;
}

#app.ui-telegram .tg-settings-anim-list.is-disabled .tg-settings-anim-row {
  pointer-events: none;
}

#app.ui-telegram .tg-settings-appear-preview {
  margin: 0 0 16px;
  overflow: hidden;
  border-radius: 16px;
  background: #181818;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .tg-settings-appear-preview__banner {
  height: 88px;
  background: linear-gradient(135deg, #5865f2, #2c2f33);
}

#app.ui-telegram .tg-settings-appear-preview__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  margin-top: -36px;
  padding: 0 16px 18px;
}

#app.ui-telegram .tg-settings-appear-preview__avatar-btn {
  margin: 0;
}

#app.ui-telegram .tg-settings-appear-preview__nick {
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.2;
}

#app.ui-telegram .tg-settings-appear-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 14px;
}

#app.ui-telegram .tg-settings-appear-section__head {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 0 4px;
}

#app.ui-telegram .tg-settings-wallpaper-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

#app.ui-telegram .tg-settings-wallpaper {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0;
  padding: 8px;
  border: 2px solid transparent;
  border-radius: 16px;
  background: #181818;
  color: var(--tg-text);
  text-align: left;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}

#app.ui-telegram .tg-settings-wallpaper:hover {
  background: #1f1f1f;
}

#app.ui-telegram .tg-settings-wallpaper.is-active {
  border-color: var(--tg-blue);
}

#app.ui-telegram .tg-settings-wallpaper__preview {
  display: block;
  width: 100%;
  height: 88px;
  border-radius: 12px;
  background-color: #0a0a0a;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
}

#app.ui-telegram .tg-settings-wallpaper__preview--pattern {
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.68), rgba(0, 0, 0, 0.68)),
    url("/assets/tg-chat-wallpaper.jpg?v=2");
  background-size: cover, cover;
}

#app.ui-telegram .tg-settings-wallpaper__preview--classic {
  position: relative;
  background-color: #120f1c;
  background-image: url("/assets/tg-chat-wallpaper.svg?v=3");
  background-size: 140px 140px;
  background-repeat: repeat;
  background-position: center;
}

#app.ui-telegram .tg-settings-wallpaper__preview--classic::after {
  content: none;
  display: none;
}

#app.ui-telegram .tg-settings-wallpaper__meta {
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding: 0 2px 2px;
}

#app.ui-telegram .tg-settings-wallpaper__meta strong {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
}

#app.ui-telegram .tg-settings-wallpaper__meta small {
  color: var(--tg-muted);
  font-size: 12px;
  line-height: 1.3;
}

#app.ui-telegram .tg-settings-wallpaper__check {
  position: absolute;
  top: 14px;
  right: 14px;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--tg-blue);
  color: #fff;
  opacity: 0;
  transform: scale(0.85);
  transition: opacity 0.15s ease, transform 0.15s ease;
}

#app.ui-telegram .tg-settings-wallpaper.is-active .tg-settings-wallpaper__check {
  opacity: 1;
  transform: scale(1);
}

#app.ui-telegram .tg-settings-wallpaper__check svg {
  width: 16px;
  height: 16px;
}

#app.ui-telegram .tg-settings-savebar {
  position: sticky;
  bottom: 10px;
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 18px 0 4px;
  padding: 12px 12px 12px 10px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  background:
    linear-gradient(135deg, rgba(135, 116, 225, 0.12), rgba(24, 24, 24, 0.98) 52%),
    #181818;
  box-shadow:
    0 14px 36px rgba(0, 0, 0, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(12px);
  animation: tg-settings-savebar-in 0.26s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes tg-settings-savebar-in {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

#app.ui-telegram .tg-settings-savebar.hidden {
  display: none !important;
}

#app.ui-telegram .tg-settings-panel__body:has(.tg-settings-savebar:not(.hidden)) {
  padding-bottom: 12px;
}

#app.ui-telegram #tgSettingsPageAppearance.is-banner-picker-open {
  padding-bottom: 88px;
}

#app.ui-telegram #tgSettingsPageAppearance.is-banner-picker-open:has(.tg-settings-savebar:not(.hidden)) {
  padding-bottom: 104px;
}

#app.ui-telegram .tg-settings-savebar__main {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

#app.ui-telegram .tg-settings-savebar__icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(255, 183, 77, 0.14);
  color: #ffb74d;
}

#app.ui-telegram .tg-settings-savebar__icon svg {
  width: 18px;
  height: 18px;
}

#app.ui-telegram .tg-settings-savebar__copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

#app.ui-telegram .tg-settings-savebar__copy strong {
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.25;
}

#app.ui-telegram .tg-settings-savebar__copy small {
  color: #9a9a9a;
  font-size: 12px;
  line-height: 1.3;
}

#app.ui-telegram .tg-settings-savebar__actions {
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
}

#app.ui-telegram .tg-settings-savebar__btn {
  min-height: 38px;
  padding: 0 16px;
  border: 0;
  border-radius: 999px;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: transform 0.14s ease, background 0.14s ease, opacity 0.14s ease;
}

#app.ui-telegram .tg-settings-savebar__btn--ghost {
  background: rgba(255, 255, 255, 0.07);
  color: #fff;
}

#app.ui-telegram .tg-settings-savebar__btn--ghost:hover {
  background: rgba(255, 255, 255, 0.11);
}

#app.ui-telegram .tg-settings-savebar__btn--primary {
  background: linear-gradient(135deg, #8774e1, #5eb5f7);
  color: #fff;
  box-shadow: 0 6px 18px rgba(94, 181, 247, 0.28);
}

#app.ui-telegram .tg-settings-savebar__btn--primary:hover {
  transform: translateY(-1px);
}

#app.ui-telegram .tg-settings-savebar__btn:disabled {
  opacity: 0.55;
  cursor: default;
  transform: none;
}

#app.ui-telegram .tg-settings-banner-custom-wrap {
  position: relative;
}

#app.ui-telegram .tg-settings-banner-custom-btn {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 52px;
  margin: 0;
  padding: 8px 10px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.03);
  color: #fff;
  text-align: left;
  cursor: pointer;
}

#app.ui-telegram .tg-settings-banner-custom-btn:hover,
#app.ui-telegram .tg-settings-banner-custom-btn.is-active {
  border-color: rgba(94, 181, 247, 0.35);
  background: rgba(94, 181, 247, 0.08);
}

#app.ui-telegram .tg-settings-banner-custom-btn__swatch {
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #5865f2;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
}

#app.ui-telegram .tg-settings-banner-custom-btn__meta {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

#app.ui-telegram .tg-settings-banner-custom-btn__meta strong {
  font-size: 15px;
  font-weight: 500;
}

#app.ui-telegram .tg-settings-banner-custom-btn__meta small {
  color: #8a8a8a;
  font-size: 13px;
}

#app.ui-telegram .tg-settings-banner-custom-btn__icon {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  color: #8a8a8a;
}

#app.ui-telegram .tg-settings-color-picker {
  position: absolute;
  z-index: 30;
  top: auto;
  bottom: calc(100% + 8px);
  left: 0;
  right: 0;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  background: #1e1f22;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
}

#app.ui-telegram .tg-settings-color-picker.hidden {
  display: none !important;
}

#app.ui-telegram .tg-settings-color-picker__sv {
  position: relative;
  height: 132px;
  overflow: hidden;
  border-radius: 10px;
  background: hsl(var(--picker-hue, 230), 100%, 50%);
  cursor: crosshair;
  touch-action: none;
}

#app.ui-telegram .tg-settings-color-picker__sv-white,
#app.ui-telegram .tg-settings-color-picker__sv-black {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

#app.ui-telegram .tg-settings-color-picker__sv-white {
  background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0));
}

#app.ui-telegram .tg-settings-color-picker__sv-black {
  background: linear-gradient(to top, #000, rgba(0, 0, 0, 0));
}

#app.ui-telegram .tg-settings-color-picker__cursor {
  position: absolute;
  z-index: 2;
  width: 16px;
  height: 16px;
  border: 2px solid #fff;
  border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.45);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

#app.ui-telegram .tg-settings-color-picker__controls {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 12px;
}

#app.ui-telegram .tg-settings-color-picker__preview {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #5865f2;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
}

#app.ui-telegram .tg-settings-color-picker__hue {
  flex: 1 1 auto;
  width: 100%;
  height: 14px;
  margin: 0;
  border-radius: 999px;
  background: linear-gradient(
    to right,
    #f00 0%,
    #ff0 17%,
    #0f0 33%,
    #0ff 50%,
    #00f 67%,
    #f0f 83%,
    #f00 100%
  );
  appearance: none;
  cursor: pointer;
}

#app.ui-telegram .tg-settings-color-picker__hue::-webkit-slider-thumb {
  width: 16px;
  height: 16px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: transparent;
  appearance: none;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.35);
}

#app.ui-telegram .tg-settings-color-picker__hex {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
  color: #8a8a8a;
  font-size: 13px;
}

#app.ui-telegram .tg-settings-color-picker__hex input {
  flex: 1 1 auto;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  background: #212121;
  color: #fff;
  font: inherit;
  font-size: 14px;
}

#app.ui-telegram .tg-settings-iface-hero {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0 0 16px;
  padding: 16px;
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(235, 123, 75, 0.16), rgba(24, 24, 24, 0.96) 58%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .tg-settings-iface-hero__icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  color: #fff;
}

#app.ui-telegram .tg-settings-iface-hero__icon svg {
  width: 22px;
  height: 22px;
}

#app.ui-telegram .tg-settings-iface-hero__icon--discord {
  background: #5865f2;
}

#app.ui-telegram .tg-settings-iface-hero__icon--telegram {
  background: #5eb5f7;
}

#app.ui-telegram .tg-settings-iface-hero__icon--standard {
  background: #666;
}

#app.ui-telegram .tg-settings-iface-hero__icon--vk {
  background: #0077ff;
}

#app.ui-telegram .tg-settings-iface-hero__copy {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

#app.ui-telegram .tg-settings-iface-hero__copy strong {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
}

#app.ui-telegram .tg-settings-iface-hero__copy small {
  color: #9a9a9a;
  font-size: 13px;
  line-height: 1.35;
}

#app.ui-telegram .tg-settings-iface-list {
  padding: 0;
  overflow: hidden;
}

#app.ui-telegram .tg-settings-iface-row {
  gap: 14px;
  min-height: 58px;
  padding: 10px 14px;
  border-radius: 0;
}

#app.ui-telegram .tg-settings-iface-row + .tg-settings-iface-row {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .tg-settings-iface-row__icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  color: #fff;
}

#app.ui-telegram .tg-settings-iface-row__icon svg {
  width: 18px;
  height: 18px;
}

#app.ui-telegram .tg-settings-iface-row__icon--discord {
  background: #5865f2;
}

#app.ui-telegram .tg-settings-iface-row__icon--telegram {
  background: #5eb5f7;
}

#app.ui-telegram .tg-settings-iface-row__icon--standard {
  background: #666;
}

#app.ui-telegram .tg-settings-iface-row__icon--vk {
  background: #0077ff;
}

#app.ui-telegram .tg-settings-iface-note {
  margin: 4px 4px 0;
  color: #8a8a8a;
  font-size: 13px;
  line-height: 1.4;
}

#app.ui-telegram .tg-settings-voice-hero {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 16px;
  padding: 16px;
  overflow: hidden;
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(76, 175, 80, 0.18), rgba(24, 24, 24, 0.96) 58%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .tg-settings-voice-hero__glow {
  position: absolute;
  top: -28px;
  right: -18px;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(76, 175, 80, 0.32), transparent 68%);
  pointer-events: none;
}

#app.ui-telegram .tg-settings-voice-hero__main {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

#app.ui-telegram .tg-settings-voice-hero__icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #4caf50;
  color: #fff;
  box-shadow: 0 8px 20px rgba(76, 175, 80, 0.28);
}

#app.ui-telegram .tg-settings-voice-hero__icon svg {
  width: 22px;
  height: 22px;
}

#app.ui-telegram .tg-settings-voice-hero__copy {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

#app.ui-telegram .tg-settings-voice-hero__copy strong {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.25;
}

#app.ui-telegram .tg-settings-voice-hero__copy small {
  color: #9a9a9a;
  font-size: 13px;
  line-height: 1.35;
}

#app.ui-telegram .tg-settings-voice-hero__pill {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  min-height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(94, 181, 247, 0.16);
  color: #8fd0ff;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-align: center;
}

#app.ui-telegram .tg-settings-voice-hero__pill.is-off {
  background: rgba(255, 138, 128, 0.14);
  color: #ff8a80;
}

#app.ui-telegram .tg-settings-voice-devices {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 6px 8px;
}

#app.ui-telegram .tg-settings-voice-field {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 6px;
  cursor: pointer;
}

#app.ui-telegram .tg-settings-voice-field + .tg-settings-voice-field {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

#app.ui-telegram .tg-settings-voice-field__icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 36px;
  height: 36px;
  margin-top: 2px;
  border-radius: 50%;
  color: #fff;
}

#app.ui-telegram .tg-settings-voice-field__icon svg {
  width: 18px;
  height: 18px;
}

#app.ui-telegram .tg-settings-voice-field__icon--input {
  background: #57c7a7;
}

#app.ui-telegram .tg-settings-voice-field__icon--output {
  background: #5eb5f7;
}

#app.ui-telegram .tg-settings-voice-field__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

#app.ui-telegram .tg-settings-voice-field__label {
  color: var(--tg-blue);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

#app.ui-telegram .tg-settings-select--voice {
  padding-right: 34px;
  background-image:
    linear-gradient(45deg, transparent 50%, #8a8a8a 50%),
    linear-gradient(135deg, #8a8a8a 50%, transparent 50%);
  background-position:
    calc(100% - 18px) calc(50% + 2px),
    calc(100% - 12px) calc(50% + 2px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}

#app.ui-telegram .tg-settings-voice-volume {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 14px 16px;
}

#app.ui-telegram .tg-settings-voice-slider {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#app.ui-telegram .tg-settings-voice-slider__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

#app.ui-telegram .tg-settings-voice-slider__label {
  color: #fff;
  font-size: 15px;
  font-weight: 500;
}

#app.ui-telegram .tg-settings-voice-slider__value {
  color: var(--tg-blue);
  font-size: 14px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

#app.ui-telegram .tg-settings-voice-range {
  width: 100%;
  height: 8px;
  margin: 0;
  appearance: none;
  background: transparent;
  --tg-voice-fill: 100%;
  cursor: pointer;
}

#app.ui-telegram .tg-settings-voice-range::-webkit-slider-runnable-track {
  height: 8px;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    #8774e1 0%,
    #5eb5f7 var(--tg-voice-fill),
    rgba(255, 255, 255, 0.12) var(--tg-voice-fill),
    rgba(255, 255, 255, 0.12) 100%
  );
}

#app.ui-telegram .tg-settings-voice-range::-webkit-slider-thumb {
  appearance: none;
  width: 18px;
  height: 18px;
  margin-top: -5px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
}

#app.ui-telegram .tg-settings-voice-range::-moz-range-track {
  height: 8px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
}

#app.ui-telegram .tg-settings-voice-range::-moz-range-progress {
  height: 8px;
  border-radius: 999px;
  background: linear-gradient(90deg, #8774e1, #5eb5f7);
}

#app.ui-telegram .tg-settings-voice-range::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border: 0;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
}

#app.ui-telegram .tg-settings-voice-list {
  padding: 0;
  overflow: hidden;
}

#app.ui-telegram .tg-settings-voice-row {
  gap: 14px;
  min-height: 58px;
  padding: 10px 14px;
  border-radius: 0;
}

#app.ui-telegram .tg-settings-voice-row__icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  color: #fff;
}

#app.ui-telegram .tg-settings-voice-row__icon svg {
  width: 18px;
  height: 18px;
}

#app.ui-telegram .tg-settings-voice-row__icon--deafen {
  background: #8774e1;
}

/* TG photo send modal */
.tg-photo-send {
  position: fixed;
  inset: 0;
  z-index: 100050;
  display: grid;
  place-items: center;
  padding: 24px;
  box-sizing: border-box;
}

.tg-photo-send.hidden,
.tg-photo-send[hidden] {
  display: none !important;
}

.tg-photo-send__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  margin: 0;
  padding: 0;
  background: rgba(0, 0, 0, 0.72);
  cursor: pointer;
}

.tg-photo-send__dialog {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: min(560px, calc(100vw - 32px));
  max-height: min(780px, calc(100dvh - 48px));
  border-radius: 16px;
  background: #212121;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.55);
  overflow: hidden;
}

.tg-photo-send__head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  min-height: 56px;
  padding: 8px 12px;
  box-sizing: border-box;
}

.tg-photo-send__title {
  margin: 0;
  flex: 1 1 auto;
  color: #fff;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.2;
}

.tg-photo-send__icon-btn {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: rgba(255, 255, 255, 0.82);
  cursor: pointer;
}

.tg-photo-send__icon-btn:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
}

.tg-photo-send__icon-btn svg {
  width: 22px;
  height: 22px;
}

.tg-photo-send__preview {
  flex: 1 1 auto;
  display: grid;
  place-items: center;
  min-height: 180px;
  padding: 8px 16px 12px;
  overflow: auto;
  background: #000;
}

.tg-photo-send__image {
  display: block;
  max-width: 100%;
  max-height: min(520px, calc(100dvh - 220px));
  width: auto;
  height: auto;
  border-radius: 10px;
  object-fit: contain;
  user-select: none;
}

.tg-photo-send__bar {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  margin: 10px 12px 12px;
  padding: 4px 4px 4px 4px;
  border-radius: 24px;
  background: #2c2c2c;
  box-sizing: border-box;
}

.tg-photo-send__caption {
  flex: 1 1 auto;
  min-width: 0;
  height: 40px;
  margin: 0;
  padding: 0 4px;
  border: 0;
  background: transparent;
  color: #fff;
  font: 400 15px / 1.3 "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  outline: none;
}

.tg-photo-send__caption::placeholder {
  color: rgba(255, 255, 255, 0.42);
}

.tg-photo-send__send {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #8774e1;
  color: #fff;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(135, 116, 225, 0.35);
}

.tg-photo-send__send:hover {
  background: #9584ea;
}

.tg-photo-send__send.is-busy,
.tg-photo-send__send:disabled {
  opacity: 0.65;
  cursor: wait;
}

.tg-photo-send__send svg {
  width: 20px;
  height: 20px;
  margin-left: 1px;
}

html.is-tg-photo-send-open #emojiPicker:not(.hidden) {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  bottom: 96px !important;
  top: auto !important;
  transform: translateX(-50%) !important;
  z-index: 100060 !important;
}

/* Image-only message: no bubble, time overlay on photo */
#app.ui-telegram .discord-message.is-media-only .discord-message__content {
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  max-width: min(78%, 420px);
  overflow: hidden;
  border-radius: 14px;
}

#app.ui-telegram .discord-message.is-me.is-media-only .discord-message__content {
  background: transparent !important;
  border-radius: 14px;
}

#app.ui-telegram .discord-message.is-media-only .discord-message__body {
  padding: 0;
}

#app.ui-telegram .discord-message.is-media-only .discord-message__attachment {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 0;
  border-radius: 14px;
  overflow: hidden;
}

#app.ui-telegram .discord-message.is-media-only .discord-message__attachment img {
  width: 100%;
  max-width: 100%;
  max-height: min(420px, 55vh);
  height: auto;
  object-fit: contain;
  background: #000;
  border-radius: 14px;
}

#app.ui-telegram .discord-message.is-media-only .discord-message__attachment-edit {
  display: none !important;
}

#app.ui-telegram .discord-message.is-media-only .discord-message__time--inline {
  right: 8px;
  bottom: 8px;
  padding: 2px 7px;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.45);
  color: #fff !important;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

#app.ui-telegram .discord-message.is-media-only .discord-message__content::after {
  display: none !important;
}

/* Image + caption: photo flush top/left/right, caption footer below */
#app.ui-telegram .discord-message.is-media-caption .discord-message__content {
  padding: 0 !important;
  overflow: hidden;
  max-width: min(78%, 420px);
  width: min(78%, 420px);
}

#app.ui-telegram .discord-message.is-media-caption .discord-message__body {
  display: flex;
  flex-direction: column;
  padding: 0;
  width: 100%;
}

#app.ui-telegram .discord-message.is-media-caption .discord-message__attachment {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 0;
  border-radius: 0;
  overflow: hidden;
  line-height: 0;
}

#app.ui-telegram .discord-message.is-media-caption .discord-message__attachment img {
  display: block;
  width: 100%;
  max-width: 100%;
  max-height: min(420px, 55vh);
  height: auto;
  object-fit: contain;
  background: #000;
  border-radius: 0;
}

#app.ui-telegram .discord-message.is-media-caption .discord-message__attachment-edit {
  display: none !important;
}

#app.ui-telegram .discord-message.is-media-caption .discord-message__text {
  position: relative;
  margin: 0;
  padding: 7px 10px 6px;
  padding-right: 58px;
  font-size: 16px;
  line-height: 1.3;
  word-break: break-word;
}

#app.ui-telegram .discord-message.is-media-caption:not(.is-me) .discord-message__text {
  padding-right: 48px;
}

#app.ui-telegram .discord-message.is-media-caption .discord-message__time--inline {
  position: absolute;
  right: 9px;
  bottom: 6px;
  float: none;
  margin: 0;
  padding: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.55);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

#app.ui-telegram .discord-message.is-media-caption.is-me .discord-message__time--inline {
  color: rgba(255, 255, 255, 0.55);
}

/* —— Telegram YouTube / link webpage preview —— */
#app.ui-telegram .discord-message__embeds {
  width: 100%;
  max-width: 100%;
  margin-top: 6px;
  gap: 8px;
}

#app.ui-telegram .tg-webpage {
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 100%;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

#app.ui-telegram .tg-webpage__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  padding: 0 0 2px 8px;
  border-left: 2px solid rgba(255, 255, 255, 0.55);
}

#app.ui-telegram .discord-message:not(.is-me) .tg-webpage__text {
  border-left-color: #6cb7f5;
}

#app.ui-telegram .tg-webpage__site {
  color: rgba(255, 255, 255, 0.92);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.25;
  text-decoration: none;
}

#app.ui-telegram .tg-webpage__site:hover {
  text-decoration: underline;
}

#app.ui-telegram .tg-webpage__title {
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.25;
  text-decoration: none;
  word-break: break-word;
}

#app.ui-telegram .tg-webpage__title:hover {
  text-decoration: underline;
}

#app.ui-telegram .tg-webpage__desc {
  color: rgba(255, 255, 255, 0.72);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.3;
  word-break: break-word;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
}

#app.ui-telegram .tg-webpage__desc--pending {
  visibility: hidden;
  min-height: 1.2em;
  pointer-events: none;
  user-select: none;
}

#app.ui-telegram .tg-webpage__media {
  position: relative;
  width: 100%;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  border-radius: 8px;
  background: #000;
}

#app.ui-telegram .tg-webpage__play {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background-color: #111;
  background-position: center;
  background-size: cover;
  cursor: pointer;
}

#app.ui-telegram .tg-webpage__media.is-playing iframe,
#app.ui-telegram .tg-webpage iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

#app.ui-telegram .discord-message__text a {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 2px;
  word-break: break-all;
}

#app.ui-telegram .discord-message:not(.is-me) .discord-message__text a {
  color: #6cb7f5;
}

/* —— Telegram DM voice call panel
   Overlay вне #app. Полное окно — по центру; свёрнутое — сплющенная панель справа. */
.voice-call-overlay.is-tg-call {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: transparent;
  backdrop-filter: none;
  pointer-events: none;
}

.voice-call-overlay.is-tg-call.hidden,
#app.ui-telegram .voice-call-overlay.hidden {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.voice-call-overlay.is-tg-call .voice-call-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: min(300px, calc(100vw - 40px));
  height: auto;
  min-height: 460px;
  max-height: min(580px, calc(100vh - 48px));
  padding: 0 0 22px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  background: #1c1c1e;
  box-shadow: 0 18px 56px rgba(0, 0, 0, 0.5);
  text-align: center;
  pointer-events: auto;
}

.voice-call-overlay.is-tg-call.is-expanded .voice-call-card {
  width: min(380px, calc(100vw - 28px));
  min-height: 560px;
  max-height: min(760px, calc(100vh - 28px));
}

.voice-call-overlay.is-tg-call .voice-call-bg {
  position: absolute;
  inset: 0;
  display: block;
  background: #2a2a2a center / cover no-repeat;
  transform: scale(1.06);
  filter: brightness(0.55) saturate(1.05);
  pointer-events: none;
}

.voice-call-overlay.is-tg-call .voice-call-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.08) 34%, rgba(0, 0, 0, 0.35) 68%, rgba(0, 0, 0, 0.78) 100%);
}

.voice-call-overlay.is-tg-call .voice-call-chrome {
  position: relative;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  flex: 0 0 auto;
  padding: 12px 12px 0;
  box-sizing: border-box;
}

.voice-call-overlay.is-tg-call .voice-call-chrome-btn {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.28);
  color: rgba(255, 255, 255, 0.95);
  cursor: pointer;
  backdrop-filter: blur(8px);
}

.voice-call-overlay.is-tg-call .voice-call-chrome-btn:hover {
  background: rgba(0, 0, 0, 0.42);
}

.voice-call-overlay.is-tg-call .voice-call-chrome-btn svg {
  width: 18px;
  height: 18px;
}

.voice-call-overlay.is-tg-call .voice-call-avatar {
  position: relative;
  z-index: 2;
  display: grid;
  width: 96px;
  height: 96px;
  margin-top: 28px;
  place-items: center;
  border: 3px solid rgba(255, 255, 255, 0.92);
  border-radius: 50%;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
}

.voice-call-overlay.is-tg-call .voice-call-title,
.voice-call-overlay.is-tg-call .voice-call-status {
  position: relative;
  z-index: 2;
  margin: 0;
  color: #fff;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
}

.voice-call-overlay.is-tg-call .voice-call-title {
  margin-top: 14px;
  padding: 0 16px;
  font-size: 22px;
  font-weight: 650;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.voice-call-overlay.is-tg-call .voice-call-status {
  margin-top: 4px;
  color: rgba(255, 255, 255, 0.84);
  font-size: 14px;
  font-weight: 400;
}

.voice-call-overlay.is-tg-call .voice-call-actions {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 22px;
  margin-top: auto;
  padding: 28px 16px 4px;
}

.voice-call-overlay.is-tg-call .voice-call-actions .voice-call-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  width: auto;
  height: auto;
  min-width: 64px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #fff;
  box-shadow: none;
}

.voice-call-overlay.is-tg-call .voice-call-actions .voice-call-btn:hover {
  background: transparent;
  filter: brightness(1.08);
}

.voice-call-overlay.is-tg-call .voice-call-btn__icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
  backdrop-filter: blur(10px);
}

.voice-call-overlay.is-tg-call .voice-call-btn__icon svg {
  width: 24px;
  height: 24px;
}

.voice-call-overlay.is-tg-call .voice-call-btn__label {
  display: block;
  max-width: 84px;
  color: rgba(255, 255, 255, 0.9);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.15;
  text-align: center;
  white-space: nowrap;
}

.voice-call-overlay.is-tg-call .voice-call-btn--mute.is-muted .voice-call-btn__icon {
  background: rgba(255, 255, 255, 0.32);
}

.voice-call-overlay.is-tg-call .voice-call-btn--accept .voice-call-btn__icon {
  background: #31b545;
}

.voice-call-overlay.is-tg-call .voice-call-btn--reject .voice-call-btn__icon,
.voice-call-overlay.is-tg-call .voice-call-btn--hangup .voice-call-btn__icon {
  background: #e53935;
}

.voice-call-overlay.is-tg-call .voice-call-btn--reject .voice-call-btn__icon svg,
.voice-call-overlay.is-tg-call .voice-call-btn--hangup .voice-call-btn__icon svg {
  transform: rotate(135deg);
}

/* Сплющенная вертикальная tech-панель справа (без свечений) */
.voice-call-mini-bar.is-tg-call {
  top: 50%;
  right: 16px;
  left: auto;
  z-index: 1410;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  width: 88px;
  max-width: none;
  padding: 14px 10px 12px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 22px;
  background: linear-gradient(180deg, #1c222a 0%, #12151a 100%);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.4);
  transform: translateY(-50%);
  backdrop-filter: blur(12px);
  will-change: right;
}

.voice-call-mini-bar.is-tg-call::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: repeating-linear-gradient(
    0deg,
    transparent 0,
    transparent 2px,
    rgba(255, 255, 255, 0.012) 2px,
    rgba(255, 255, 255, 0.012) 3px
  );
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__main {
  position: relative;
  z-index: 1;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 4px 2px 8px;
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: #fff;
  text-align: center;
  cursor: pointer;
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__main:hover {
  background: rgba(255, 255, 255, 0.05);
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__avatar {
  position: relative;
  z-index: 1;
  width: 46px;
  height: 46px;
  margin-top: 2px;
  border: 2px solid rgba(255, 255, 255, 0.55);
  font-size: 15px;
  box-shadow: none;
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  width: 100%;
  min-width: 0;
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__text strong {
  width: 100%;
  overflow: hidden;
  color: #f2f4f7;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__text small {
  color: #9aa3ad;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1.2;
  white-space: nowrap;
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__divider {
  position: relative;
  z-index: 1;
  width: 36px;
  height: 1px;
  margin: 2px 0 10px;
  background: rgba(255, 255, 255, 0.14);
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__actions {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__mute,
.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__hangup {
  display: grid;
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  place-items: center;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  box-shadow: none;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__mute {
  background: rgba(255, 255, 255, 0.06);
  color: #e8eef5;
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__mute:hover {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.18);
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__mute.is-muted {
  background: rgba(255, 255, 255, 0.14);
  border-color: rgba(255, 255, 255, 0.22);
  color: #fff;
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__mute svg {
  width: 18px;
  height: 18px;
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__mic-off {
  display: none;
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__mute.is-muted .voice-call-mini-bar__mic {
  display: none;
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__mute.is-muted .voice-call-mini-bar__mic-off {
  display: block;
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__hangup {
  background: #e53935;
  border-color: rgba(255, 255, 255, 0.08);
  color: #fff;
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__hangup:hover {
  background: #ef5350;
}

.voice-call-mini-bar.is-tg-call .voice-call-mini-bar__hangup svg {
  width: 18px;
  height: 18px;
  transform: rotate(135deg);
}

@media (max-width: 720px) {
  .voice-call-overlay.is-tg-call {
    padding: 12px;
  }

  .voice-call-overlay.is-tg-call .voice-call-card {
    width: min(300px, calc(100vw - 24px));
    min-height: 420px;
  }

  .voice-call-mini-bar.is-tg-call {
    top: auto;
    bottom: 96px;
    right: 12px;
    left: auto;
    transform: none;
  }
}