/* Author: Nesynov David Viktorovich (Несынов Давид Викторович). (c) 2026 GranaDzyak. All rights reserved. */
/* ГранаДзяк — оболочка ленты (структура как у Дзена, визуал Мама Грана) | © Несынов Давид Викторович */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  background: var(--mg-black, #070706);
}

body {
  min-height: 100dvh;
  background:
    radial-gradient(circle at 88% -10%, rgba(242, 138, 45, 0.12), transparent 32rem),
    radial-gradient(circle at 8% 40%, rgba(106, 215, 255, 0.04), transparent 24rem),
    var(--mg-black);
  color: var(--mg-ivory);
  font: 15px/1.55 var(--body);
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.055;
  mix-blend-mode: screen;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; border: none; background: none; }
::selection { background: var(--mg-amber); color: var(--mg-ink); }
:focus-visible { outline: 2px solid var(--mg-amber); outline-offset: 3px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }

.shell { position: relative; z-index: 1; min-height: 100dvh; display: flex; flex-direction: column; }
/* зона статус-бара телефона — тот же фон, что шапка/плашка, без серой полосы */
.shell::before {
  content: "";
  position: fixed;
  z-index: 210;
  top: 0;
  left: 0;
  right: 0;
  height: env(safe-area-inset-top, 0px);
  background: rgba(7, 7, 6, 0.96);
  pointer-events: none;
}
html:not(.has-works-bar) .shell::before { background: rgba(7, 7, 6, 0.96); }
html.has-works-bar .shell::before {
  background: linear-gradient(180deg, rgba(7, 7, 6, 0.98) 0%, rgba(7, 7, 6, 0.96) 100%);
}
/* safe-area рисует works-bar или topnav — отдельная полоска не нужна */
.shell:has(.topnav)::before { display: none; }
.shell:has(.works-bar)::before { display: none; }
html.has-works-bar .shell::before { display: none; }
html.has-works-bar {
  background: #0e0b08;
}
html.has-works-bar body {
  background:
    radial-gradient(circle at 88% -10%, rgba(242, 138, 45, 0.12), transparent 32rem),
    radial-gradient(circle at 8% 40%, rgba(106, 215, 255, 0.04), transparent 24rem),
    #0e0b08;
}
html[data-theme="light"].has-works-bar,
html[data-theme="light"].has-works-bar body {
  background: #fbf3e6;
}
html[data-theme="light"] .shell::before { background: #fbf3e6; }
html[data-theme="light"]:not(.has-works-bar) .shell::before { background: #f5ede0; }
html.gdz-has-install-bar .shell {
  padding-top: var(--gdz-install-bar-h, 58px);
}
html.gdz-standalone {
  overscroll-behavior: none;
}

/* ── ТЕХРАБОТЫ ───────────────────────────────────────────────────────── */
.works-bar {
  position: relative;
  z-index: 201;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: calc(8px + var(--gdz-safe-top, 0px)) clamp(72px, 14vw, 96px) 8px 16px;
  border-bottom: 1px solid var(--mg-border-amber);
  background:
    linear-gradient(90deg, transparent, rgba(242, 138, 45, 0.16) 30%, rgba(242, 138, 45, 0.16) 70%, transparent),
    #0e0b08;
  color: var(--mg-ivory);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0.01em;
  text-align: center;
}
.works-bar__dot {
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--mg-amber);
  box-shadow: 0 0 0 0 rgba(242, 138, 45, 0.55);
  animation: works-pulse 2.2s ease-out infinite;
}
.works-bar__link {
  color: var(--mg-amber-lite);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: rgba(248, 180, 90, 0.45);
  text-underline-offset: 3px;
  white-space: nowrap;
}
.works-bar__link:hover { color: var(--mg-hi); text-decoration-color: currentColor; }
@keyframes works-pulse {
  0% { box-shadow: 0 0 0 0 rgba(242, 138, 45, 0.55); }
  70%, 100% { box-shadow: 0 0 0 8px rgba(242, 138, 45, 0); }
}
html.no-anim .works-bar__dot { animation: none; }
@media (max-width: 560px) {
  .works-bar { font-size: 12.5px; padding-left: 12px; padding-right: 12px; gap: 8px; align-items: flex-start; text-align: left; }
  .works-bar__dot { margin-top: 5px; }
}
html[data-theme="light"] .works-bar {
  background: linear-gradient(90deg, transparent, rgba(242, 138, 45, 0.14) 30%, rgba(242, 138, 45, 0.14) 70%, transparent), #fbf3e6;
  border-bottom-color: rgba(168, 67, 36, 0.22);
  color: #3a2c1c;
}
html[data-theme="light"] .works-bar__link { color: #b4501c; text-decoration-color: rgba(180, 80, 28, 0.4); }
html[data-theme="light"] .works-bar__link:hover { color: #7a2f10; }
html.grana-on-works-bar .works-bar {
  min-height: 52px;
  padding-right: clamp(76px, 19vw, 112px);
  align-items: flex-end;
  padding-bottom: 2px;
}
.grana-visitor.is-bar { z-index: 160; pointer-events: none; }
.grana-visitor.is-bar .grana-visitor__hit,
.grana-visitor.is-bar .grana-visitor__tip { pointer-events: auto; }

/* ── TOP NAV ─────────────────────────────────────────────────────────── */
.topnav {
  position: sticky;
  top: 0;
  z-index: 200;
  min-height: var(--nav-h);
  height: calc(var(--nav-h) + var(--gdz-safe-top));
  padding-top: var(--gdz-safe-top);
  border-bottom: 1px solid var(--mg-border);
  background: rgba(7, 7, 6, 0.92);
  -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
}

.topnav__inner {
  max-width: var(--shell-max);
  margin: 0 auto;
  height: 100%;
  padding: 0 16px;
  display: flex;
  align-items: center;
  gap: 14px;
}

.brand {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-shrink: 0;
  max-width: min(360px, 54vw);
}

.brand__mark {
  width: 52px;
  height: 52px;
  object-fit: contain;
  background: transparent;
  filter: drop-shadow(0 0 14px rgba(242, 138, 45, 0.45));
  flex-shrink: 0;
  margin-right: 2px;
}

.brand__text { line-height: 1.05; min-width: 0; }
.brand__title {
  font: 700 clamp(1.05rem, 2.2vw, 1.35rem)/0.95 var(--display);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--mg-hi);
  white-space: nowrap;
}
.brand__grana { color: #fff; }
.brand__dzyak { color: #F28A2D; }
.brand__tag {
  margin-top: 4px;
  font: 500 9px/1.25 var(--mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mg-gold);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.topnav__search {
  flex: 1;
  max-width: 420px;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid rgba(212, 161, 75, 0.22);
  border-radius: 999px;
  background: rgba(16, 14, 11, 0.9);
  color: var(--mg-muted);
  transition: border-color .2s var(--ease), box-shadow .2s;
}
.topnav__search:hover,
.topnav__search:focus-within {
  border-color: var(--mg-amber);
  box-shadow: var(--mg-glow);
  color: var(--mg-ivory);
}
.topnav__search span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.topnav__actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 6px;
}

.icon-btn {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  border: 1px solid transparent;
  color: var(--mg-copy);
  transition: .2s var(--ease);
  position: relative;
}
.icon-btn:hover {
  color: var(--mg-ivory);
  border-color: var(--mg-border);
  background: rgba(212, 161, 75, 0.06);
}
.icon-btn .dot {
  position: absolute;
  top: 9px;
  right: 9px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--mg-amber);
  box-shadow: 0 0 8px rgba(242, 138, 45, 0.8);
}

.avatar-btn {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #3a2a18, #1a120c);
  border: 1px solid rgba(212, 161, 75, 0.4);
  color: var(--mg-amber-lite);
  font: 700 13px/1 var(--display);
}

/* ── LAYOUT ──────────────────────────────────────────────────────────── */
.layout {
  flex: 1;
  max-width: var(--shell-max);
  width: 100%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: var(--sidebar-w) minmax(0, 1fr) 280px;
  gap: 0;
  min-height: calc(100dvh - var(--nav-h) - var(--gdz-safe-top) - var(--gdz-install-bar-h, 0px));
}

.sidebar {
  position: sticky;
  top: calc(var(--nav-h) + var(--gdz-safe-top));
  align-self: start;
  height: calc(100dvh - var(--nav-h) - var(--gdz-safe-top) - var(--gdz-install-bar-h, 0px));
  width: var(--sidebar-w);
  padding: 18px 12px 24px;
  border-right: 1px solid rgba(246, 230, 197, 0.06);
  overflow-y: auto;
  overflow-x: hidden;
  transition: transform .45s var(--ease), opacity .35s var(--ease), visibility 0s;
}
.layout { transition: grid-template-columns .4s var(--ease); }
.sidebar { scrollbar-width: thin; }
.side-toggle {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  margin: 0 4px 10px auto;
  padding: 0;
  border: 1px solid rgba(212, 161, 75, 0.22);
  border-radius: 50%;
  background: rgba(16, 14, 11, 0.6);
  color: var(--mg-amber-lite);
  cursor: pointer;
  transition: margin .4s var(--ease), border-color .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease), color .25s var(--ease);
}
.side-toggle span {
  display: block;
  font-size: 18px;
  line-height: 1;
  transform: translateX(-1px);
  transition: transform .4s var(--ease);
}
.side-toggle:hover {
  background: var(--grad-cta);
  color: var(--mg-ink);
  border-color: transparent;
  box-shadow: var(--mg-glow);
}
.side-edge { display: none !important; }
@media (min-width: 861px) {
  body.side-collapsed .layout { --sidebar-w: 72px; }
  body.side-collapsed .sidebar {
    padding: 18px 10px 24px;
    scrollbar-width: none;
  }
  body.side-collapsed .sidebar::-webkit-scrollbar { display: none; }
  body.side-collapsed .side-toggle span { transform: translateX(1px) rotate(180deg); }
  /* оранжевый язычок вплотную к правому краю меню, посередине экрана; едет вместе с краем */
  .side-toggle {
    position: fixed;
    z-index: 60;
    top: calc(50% + (var(--nav-h) + var(--gdz-safe-top)) / 2 - 36px);
    left: calc(var(--sidebar-w) - 8px);
    width: 16px;
    height: 64px;
    opacity: .7;
    margin: 0;
    border: 0;
    border-radius: 0 10px 10px 0;
    background: var(--grad-cta);
    color: var(--mg-ink);
    box-shadow: 4px 0 16px rgba(0, 0, 0, 0.3), 0 0 14px rgba(242, 138, 45, 0.25);
    transition: left .4s var(--ease), width .25s var(--ease), opacity .25s var(--ease), box-shadow .25s var(--ease);
  }
  .side-toggle span { font-size: 15px; font-weight: 700; }
  .side-toggle:hover, .side-toggle:focus-visible {
    opacity: 1;
    width: 22px;
    box-shadow: 4px 0 18px rgba(0, 0, 0, 0.35), var(--mg-glow);
  }
  body.side-collapsed .side-link {
    position: relative;
    justify-content: center;
    gap: 0;
    padding: 0;
  }
  body.side-collapsed .side-link > span:not(.soc-badge),
  body.side-collapsed .side-group__chev,
  body.side-collapsed .side-block { display: none; }
  body.side-collapsed .side-group > .side-link:not(summary) { display: none; }
  body.side-collapsed .side-link svg { width: 22px; height: 22px; opacity: .85; }
  body.side-collapsed .side-link .soc-badge {
    position: absolute;
    top: 3px;
    right: 3px;
    margin: 0;
    min-width: 18px;
    padding: 0 5px;
    font-size: 10px;
    line-height: 16px;
    background: #c8402a;
    color: #fff;
    box-shadow: 0 0 0 2px var(--mg-bg, #0c0a08);
  }
}

.side-link {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 0 12px;
  border-radius: 12px;
  color: var(--mg-copy);
  font: 600 11px/1.1 var(--display);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  transition: .2s var(--ease);
  white-space: nowrap;
}
.side-link svg {
  width: 20px;
  height: 20px;
  opacity: 0.75;
  flex-shrink: 0;
}
.side-link:hover {
  color: var(--mg-ivory);
  background: rgba(212, 161, 75, 0.06);
}
.side-link.is-active {
  color: var(--mg-ink);
  background: var(--grad-cta);
  box-shadow: var(--mg-glow);
}
.side-link.is-active svg { opacity: 1; color: var(--mg-ink); }

.side-block { margin-top: 22px; padding: 0 8px; }
.side-block__title {
  margin-bottom: 10px;
  color: var(--mg-gold);
  font: 500 10px/1 var(--mono);
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.topic-chip {
  display: inline-flex;
  margin: 0 6px 6px 0;
  padding: 6px 10px;
  border: 1px solid var(--mg-border);
  border-radius: 999px;
  color: var(--mg-copy);
  font-size: 12px;
  background: rgba(16, 14, 11, 0.7);
  transition: .2s;
}
.topic-chip.is-active {
  color: var(--mg-ink);
  border-color: transparent;
  background: var(--grad-cta);
  font-weight: 700;
}
.side-more {
  display: inline-block;
  margin-top: 8px;
  color: var(--mg-gold);
  font: 500 11px/1.3 var(--mono);
  letter-spacing: 0.06em;
}
.side-more:hover { color: var(--mg-amber-lite); }
.topic-cloud { max-height: 220px; overflow-y: auto; padding-right: 2px; }
.card__topic {
  position: absolute;
  left: 10px;
  bottom: 10px;
  z-index: 2;
  padding: 4px 8px;
  border-radius: 6px;
  background: rgba(7, 7, 6, 0.78);
  border: 1px solid rgba(212, 161, 75, 0.3);
  color: var(--mg-hi);
  font: 500 10px/1 var(--mono);
  letter-spacing: 0.04em;
}
.cover--photo {
  background-size: cover;
  background-position: center;
  background-color: #0d0b08;
  position: relative;
  overflow: hidden;
}
.cover--progressive {
  background: linear-gradient(135deg, #1a1610 0%, #2a2218 50%, #14110c 100%);
}
.cover__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 1;
  display: block;
}
.req { color: var(--mg-amber); }
.field-hint {
  margin-top: 8px;
  color: var(--mg-muted);
  font-size: 12px;
}
.photo-preview {
  margin-top: 10px;
  height: 160px;
  border-radius: 12px;
  border: 1px solid var(--mg-border);
  background-size: cover;
  background-position: center;
}
.topic-pick-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 8px;
  max-height: 220px;
  overflow-y: auto;
  padding: 2px;
}
.topic-pick {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 8px 10px;
  border: 1px solid var(--mg-border);
  border-radius: 10px;
  cursor: pointer;
  color: var(--mg-copy);
  font-size: 12px;
  background: rgba(7, 7, 6, 0.35);
}
.topic-pick input { accent-color: var(--mg-amber); }
.topic-pick.is-on {
  border-color: var(--mg-amber);
  color: var(--mg-ivory);
  background: rgba(242, 138, 45, 0.1);
}
.topics-page-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px;
}
.topic-card {
  text-align: left;
  padding: 16px;
  border: 1px solid var(--mg-border);
  border-radius: 14px;
  background: rgba(16, 14, 11, 0.88);
  transition: .2s var(--ease);
}
.topic-card b {
  display: block;
  font: 600 1rem/1.2 var(--display);
  text-transform: uppercase;
  color: var(--mg-hi);
}
.topic-card span {
  display: block;
  margin-top: 8px;
  color: var(--mg-muted);
  font-size: 12px;
}
.topic-card:hover,
.topic-card.is-active {
  border-color: rgba(242, 138, 45, 0.5);
  box-shadow: var(--mg-glow);
}
a.topic-card { display: block; color: inherit; text-decoration: none; }
a.topic-card b::after { content: " ›"; color: var(--mg-amber, #f28a2d); }
.topic-card--all { border-color: rgba(242, 138, 45, 0.4); background: rgba(242, 138, 45, 0.08); }
.subtopics { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 14px; }
.subtopics .topic-chip { margin: 0; }
@media (max-width: 760px) {
  .subtopics { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-left: -2px; padding: 2px 2px 4px; }
  .subtopics::-webkit-scrollbar { display: none; }
  .subtopics .topic-chip { flex: 0 0 auto; }
}

.main {
  min-width: 0;
  padding: 20px 22px 100px;
}
@media (min-width: 861px) {
  .layout,
  .topnav__inner { max-width: none; }
  .main {
    justify-self: center;
    width: 100%;
    max-width: 1040px;
  }
}

.rail {
  position: sticky;
  top: calc(var(--nav-h) + var(--gdz-safe-top));
  align-self: start;
  height: calc(100dvh - var(--nav-h) - var(--gdz-safe-top) - var(--gdz-install-bar-h, 0px));
  padding: 18px 14px 24px 8px;
  border-left: 1px solid rgba(246, 230, 197, 0.06);
  overflow-y: auto;
}

/* ── BUTTONS ─────────────────────────────────────────────────────────── */
.btn {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 10px;
  border: 1px solid rgba(212, 161, 75, 0.34);
  background: rgba(212, 161, 75, 0.06);
  color: var(--mg-ivory);
  font: 600 12px/1 var(--display);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  transition: transform .2s var(--ease), border-color .2s, filter .2s, background .2s;
}
.btn:hover { transform: translateY(-1px); border-color: var(--mg-amber); }
.btn--cta {
  border-color: transparent;
  background: var(--grad-cta);
  color: var(--mg-ink);
  box-shadow: var(--mg-glow);
}
.btn--cta:hover { filter: brightness(1.06); color: var(--mg-ink); }
.btn--ghost { background: transparent; }
.btn--sm { min-height: 34px; padding: 6px 12px; font-size: 11px; }
.btn--danger { border-color: rgba(168, 67, 36, 0.5); color: #E8C3B3; }
.btn.is-on {
  border-color: transparent;
  background: var(--grad-cta);
  color: var(--mg-ink);
}

.home-logo {
  display: flex;
  align-items: center;
  gap: clamp(16px, 3vw, 28px);
  margin: 6px 0 22px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.home-logo__mark {
  width: clamp(88px, 14vw, 128px);
  height: clamp(88px, 14vw, 128px);
  object-fit: contain;
  flex-shrink: 0;
  background: transparent;
  filter: drop-shadow(0 0 22px rgba(242, 138, 45, 0.4));
}
.home-logo__text {
  min-width: 0;
  flex: 1;
}
.home-logo__title {
  margin: 0;
  font: 700 clamp(2.2rem, 5.5vw, 3.6rem)/0.92 var(--display);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #fff;
}
.home-logo__title .brand__dzyak { color: #F28A2D; }
.home-logo__tag {
  margin-top: 10px;
  font: 600 clamp(0.72rem, 1.5vw, 0.95rem)/1.35 var(--mono);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mg-amber-lite);
  max-width: 28ch;
}

.stay {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 22px 0;
}
.stay__item {
  padding: 14px 16px 16px;
  border-radius: 14px;
  border: 1px solid rgba(212, 161, 75, 0.28);
  background: #100e0b;
  position: relative;
  isolation: isolate;
}
.plan-card {
  position: relative;
  isolation: isolate;
  border-radius: 14px;
}
.plan-card > *,
.stay__item > * {
  position: relative;
  z-index: 1;
}
.plan-card::before,
.stay__item::before {
  content: "";
  position: absolute;
  inset: -1px;
  padding: 1.5px;
  border-radius: 15px;
  background: conic-gradient(
    from var(--pick-angle),
    rgba(212, 161, 75, 0.28) 0deg,
    var(--mg-amber-lite) 70deg,
    var(--mg-amber) 130deg,
    var(--mg-orange) 180deg,
    var(--mg-amber) 230deg,
    var(--mg-amber-lite) 290deg,
    rgba(212, 161, 75, 0.28) 360deg
  );
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
  opacity: 0;
  transition: opacity .45s var(--ease);
  animation: plan-ring 6s linear infinite;
  pointer-events: none;
  z-index: 0;
}
.plan-card.is-picked::before,
.stay__item.is-picked::before {
  opacity: 1;
}
.plan-card.is-picked,
.stay__item.is-picked {
  box-shadow: 0 0 28px rgba(242, 138, 45, 0.12);
  transition: box-shadow .45s var(--ease);
}
.btn--pick {
  margin-top: 12px;
  border-color: transparent;
  background: var(--grad-cta);
  color: var(--mg-ink);
  opacity: .82;
  transition: opacity .35s var(--ease), transform .2s var(--ease), box-shadow .35s var(--ease);
}
.btn--pick:hover { color: var(--mg-ink); }
.is-picked .btn--pick {
  opacity: 1;
  box-shadow: var(--mg-glow);
  background-image:
    linear-gradient(105deg, transparent 35%, rgba(255, 240, 210, 0.38) 50%, transparent 65%),
    var(--grad-cta);
  background-size: 250% 100%, 100% 100%;
  background-repeat: no-repeat;
  animation: gold-btn 3.2s ease-in-out infinite;
}
@property --pick-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}
@keyframes plan-ring {
  to { --pick-angle: 360deg; }
}
@keyframes gold-btn {
  0% { background-position: 130% 0, 0 0; }
  100% { background-position: -30% 0, 0 0; }
}
html.no-anim .plan-card::before, html.no-anim .stay__item::before, html.no-anim .is-picked .btn--pick { animation: none; }
.stay__kicker {
  font: 600 11px/1.3 var(--mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mg-amber-lite);
  margin-bottom: 6px;
}
.stay__item b {
  display: block;
  font: 700 1.05rem/1.2 var(--display);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--mg-hi);
}
.stay__item p {
  margin: 8px 0 12px;
  color: var(--mg-copy);
  font-size: 14px;
  line-height: 1.4;
}
.stay__item .btn { margin-top: 0; }
@media (max-width: 860px) {
  .stay { grid-template-columns: 1fr; }
}

.ad-slot {
  clear: both;
  margin: 1.8em 0;
  font-family: var(--body, inherit);
}
.sub-strip {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 14px; border: 1px solid var(--mg-border); border-radius: 14px;
  background: linear-gradient(100deg, rgba(242, 138, 45, .1), rgba(16, 14, 11, .6) 60%);
  font-family: var(--body, inherit); line-height: 1.3;
}
.sub-strip__text { display: grid; gap: 2px; min-width: 0; }
.sub-strip__text b { font-size: 15px; color: var(--mg-ivory, #f6e6c5); }
.sub-strip__text span { font-size: 12.5px; color: var(--mg-muted); }
.sub-strip .btn { flex-shrink: 0; text-decoration: none; }
.post-content > .sub-strip { margin: 1.6em 0 0; }
.ad-slot .stay { margin: 0; }
.ad-slot .stay p { margin: 0; }
.ad-slot .stay p.muted { margin-top: 8px; }
.ad-partner {
  position: relative;
  display: flex;
  gap: 14px;
  align-items: center;
  padding: 16px;
  border: 1px solid var(--mg-border);
  border-radius: 14px;
  background: var(--mg-card);
}
.ad-partner__label {
  position: absolute;
  top: 8px;
  right: 12px;
  font: 600 10px/1 var(--mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(246, 230, 197, 0.4);
}
.ad-partner__img {
  width: 120px;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 10px;
  flex: none;
}
.ad-partner__body b { display: block; font: 700 1.05rem/1.2 var(--display); color: var(--mg-ivory); }
.ad-partner__body p { margin: 6px 0 10px; font-size: 14px; line-height: 1.45; color: var(--mg-copy); }
@media (max-width: 860px) {
  .ad-slot .stay {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: 82%;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 2px 2px 6px;
    scrollbar-width: none;
  }
  .ad-slot .stay::-webkit-scrollbar { display: none; }
  .ad-slot .stay__item { scroll-snap-align: start; }
}

/* ── FEED ────────────────────────────────────────────────────────────── */
.page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}
.page-head--feed { align-items: center; margin-bottom: 14px; }
.page-head--feed .filters { margin-bottom: 0; }
.page-kicker {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--mg-gold);
  font: 600 11px/1 var(--mono);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.page-kicker::before {
  content: "";
  width: 24px;
  height: 1px;
  background: currentColor;
}
.page-kicker--logo::before {
  width: 22px;
  height: 22px;
  background: url("brand-cube.png") center / cover no-repeat;
  border-radius: 6px;
  box-shadow: 0 0 12px rgba(242, 138, 45, 0.45);
}
.page-title {
  margin-top: 8px;
  font: 700 clamp(1.8rem, 4vw, 2.6rem)/0.95 var(--display);
  letter-spacing: -0.02em;
  text-transform: uppercase;
  color: var(--mg-hi);
}

.filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 18px;
}
.filter {
  min-height: 36px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid rgba(212, 161, 75, 0.2);
  background: rgba(16, 14, 11, 0.75);
  color: var(--mg-copy);
  font-size: 13px;
  font-weight: 500;
  transition: .2s;
}
.filter:hover { color: var(--mg-ivory); border-color: var(--mg-border); }
.filter.is-active {
  color: var(--mg-ink);
  background: var(--grad-cta);
  border-color: transparent;
  font-weight: 700;
}

.feed { display: grid; gap: 14px; }

.card {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--mg-border);
  border-radius: var(--mg-radius-md);
  background: linear-gradient(150deg, rgba(23, 19, 14, 0.95), rgba(12, 10, 8, 0.98));
  transition: transform .25s var(--ease), border-color .25s, box-shadow .25s;
}
.card:hover {
  transform: translateY(-2px);
  border-color: rgba(242, 138, 45, 0.45);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35), var(--mg-glow);
}
.card--video { grid-template-columns: 280px minmax(0, 1fr); }
.card--image { grid-template-columns: 1fr; }
.card--image .card__cover { aspect-ratio: 16/9; max-height: 280px; }

.card__cover {
  position: relative;
  min-height: 148px;
  overflow: hidden;
  background: #0d0b08;
}
.card__cover-art {
  width: 100%;
  height: 100%;
  min-height: 148px;
}
.card__badge {
  position: absolute;
  left: 10px;
  top: 10px;
  padding: 4px 8px;
  border-radius: 6px;
  background: rgba(7, 7, 6, 0.78);
  border: 1px solid rgba(212, 161, 75, 0.3);
  color: var(--mg-gold);
  font: 500 9px/1 var(--mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.card__duration {
  position: absolute;
  right: 10px;
  bottom: 10px;
  padding: 3px 7px;
  border-radius: 6px;
  background: rgba(0, 0, 0, 0.75);
  color: var(--mg-hi);
  font: 600 11px/1 var(--mono);
}
.card__play {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: rgba(7, 7, 6, 0.25);
  opacity: 0;
  transition: opacity .2s;
}
.card:hover .card__play { opacity: 1; }
.card__play span {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--grad-cta);
  color: var(--mg-ink);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

.card__body {
  padding: 16px 18px 14px;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.card__channel {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  color: var(--mg-muted);
  font-size: 12px;
}
.card__channel-name {
  color: var(--mg-ivory);
  font-weight: 600;
}
.card__channel-name:hover { color: var(--mg-amber-lite); }
.card__title {
  font: 600 clamp(1.05rem, 2vw, 1.35rem)/1.2 var(--display);
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--mg-hi);
}
.card__title:hover { color: var(--mg-amber-lite); }
.card__excerpt {
  margin-top: 8px;
  color: var(--mg-copy);
  font-size: 14px;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: anywhere;
}
.card__meta {
  margin-top: auto;
  padding-top: 14px;
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
}
.meta-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 0 10px;
  border-radius: 8px;
  color: var(--mg-muted);
  font-size: 12px;
  font-weight: 600;
  transition: .15s;
}
.meta-btn:hover { color: var(--mg-ivory); background: rgba(212, 161, 75, 0.08); }
.meta-btn.is-on { color: var(--mg-amber); }
.meta-btn.card__edit { margin-left: auto; border: 1px solid rgba(212, 161, 75, 0.35); color: var(--mg-amber); }
.meta-btn--down.is-on { color: #e07a6a; }
.meta-btn svg { width: 16px; height: 16px; flex-shrink: 0; }
.btn svg { width: 16px; height: 16px; flex-shrink: 0; }
.btn.is-dislike.is-on {
  color: #f0a090;
  border-color: rgba(224, 122, 106, 0.45);
  background: rgba(224, 122, 106, 0.12);
}

.react-bar {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}
.react-bar--compact {
  gap: 2px;
}
.react-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 32px;
  padding: 0 8px;
  border-radius: 999px;
  border: 1px solid rgba(212, 161, 75, 0.18);
  background: rgba(16, 14, 11, 0.45);
  color: var(--mg-copy);
  font-size: 12px;
  font-weight: 600;
  transition: .15s;
}
.react-btn:hover {
  border-color: rgba(242, 138, 45, 0.45);
  background: rgba(242, 138, 45, 0.1);
}
.react-btn.is-on {
  border-color: rgba(242, 138, 45, 0.7);
  background: rgba(242, 138, 45, 0.18);
  color: var(--mg-ivory);
  box-shadow: 0 0 0 1px rgba(242, 138, 45, 0.2);
}
.react-btn__emoji {
  font-size: 15px;
  line-height: 1;
}
.react-btn__n {
  font-variant-numeric: tabular-nums;
  color: var(--mg-muted);
}
.react-btn.is-on .react-btn__n { color: var(--mg-amber); }

.engage {
  position: relative;
  display: inline-flex;
  align-items: stretch;
  border-radius: 10px;
  border: 1px solid rgba(212, 161, 75, 0.18);
  background: rgba(16, 14, 11, 0.35);
  overflow: visible;
}
.engage.is-on {
  border-color: rgba(242, 138, 45, 0.55);
  background: rgba(242, 138, 45, 0.12);
}
.engage--down.is-on {
  border-color: rgba(224, 122, 106, 0.5);
  background: rgba(224, 122, 106, 0.12);
}
.engage__vote,
.engage__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 34px;
  padding: 0 10px;
  border: 0;
  background: transparent;
  color: var(--mg-muted);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.engage__vote { border-radius: 10px 0 0 10px; }
.engage__count {
  position: relative;
  border-left: 1px solid rgba(212, 161, 75, 0.14);
  border-radius: 0 10px 10px 0;
  color: var(--mg-copy);
  font-variant-numeric: tabular-nums;
  min-width: 2.2em;
}
.engage__vote:hover,
.engage__count:hover { color: var(--mg-ivory); background: rgba(212, 161, 75, 0.08); }
.engage.is-on .engage__vote,
.engage.is-on .engage__count { color: var(--mg-amber); }
.engage--down.is-on .engage__vote,
.engage--down.is-on .engage__count { color: #f0a090; }
.engage--react {
  border-radius: 999px;
  gap: 0;
}
.engage--react .engage__vote {
  border-radius: 999px;
  padding: 0 8px;
  min-height: 32px;
}
.engage--react .engage__count {
  border-radius: 999px;
  border-left: 0;
  margin-left: -4px;
  padding: 0 8px 0 4px;
  min-height: 32px;
  background: transparent;
}
.engage--react.is-on .engage__vote {
  border: 1px solid rgba(242, 138, 45, 0.7);
  background: rgba(242, 138, 45, 0.18);
}
.post-actions .engage {
  min-height: 40px;
}
.post-actions .engage__vote,
.post-actions .engage__count {
  min-height: 40px;
  padding: 0 12px;
  font-size: 13px;
}
.card__meta .engage {
  min-height: 32px;
}
.card__meta .engage__vote,
.card__meta .engage__count {
  min-height: 32px;
  padding: 0 8px;
}
.voters-tip {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 8px);
  transform: translateX(-50%);
  z-index: 40;
  min-width: 160px;
  max-width: 220px;
  padding: 8px 10px;
  border-radius: 12px;
  border: 1px solid rgba(212, 161, 75, 0.28);
  background: #14110e;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45);
  text-align: left;
  white-space: normal;
}
.voters-tip::after {
  content: "";
  position: absolute;
  left: -12px;
  right: -12px;
  top: 100%;
  height: 14px;
}
.voters-tip__more:hover { color: var(--mg-amber-lite, #ffb062); }
.voters-tip__item {
  font-size: 12px;
  color: var(--mg-ivory);
  padding: 2px 0;
}
.voters-tip__empty {
  font-size: 12px;
  color: var(--mg-muted);
}
.voters-tip__more {
  display: block;
  width: 100%;
  margin-top: 6px;
  padding: 4px 0 0;
  border: 0;
  border-top: 1px solid rgba(246, 230, 197, 0.1);
  background: transparent;
  color: var(--mg-amber);
  font-size: 11px;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}
.people-modal__body {
  max-height: min(60vh, 420px);
  overflow: auto;
  margin-top: 8px;
}
.people-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.people-list__row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 10px;
  color: var(--mg-ivory);
  text-decoration: none;
}
.people-list__row:hover { background: rgba(212, 161, 75, 0.1); }
.people-list__row--static { cursor: default; opacity: 0.85; }
.people-list__row--post { align-items: stretch; }
.people-list__thumb {
  width: 48px;
  height: 48px;
  border-radius: 8px;
  overflow: hidden;
  flex-shrink: 0;
  background: #1a1714;
}
.people-list__thumb .cover {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
}
.people-list__name {
  font-size: 14px;
  font-weight: 600;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.people-list__meta {
  font-size: 12px;
  font-weight: 500;
}
.channel-stat-btn {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
  text-align: left;
}
.channel-stat-btn:hover { color: var(--mg-amber-lite); }
.channel-stat-btn b { color: var(--mg-ivory); }
.stat .channel-stat-btn {
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  width: 100%;
}

.post-reactions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  margin: -6px 0 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(246, 230, 197, 0.08);
}
.post-reactions__label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--mg-muted);
}
.post-reactions .react-bar {
  gap: 6px;
}
.post-reactions .react-btn {
  min-height: 36px;
  padding: 0 10px;
}

.load-more {
  display: flex;
  justify-content: center;
  margin-top: 8px;
}

/* ── COVER PATTERNS ──────────────────────────────────────────────────── */
.cover {
  width: 100%;
  height: 100%;
  min-height: inherit;
  position: relative;
}
.cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 40%, rgba(7, 7, 6, 0.55));
  pointer-events: none;
}
.cover--warm-signal {
  background:
    radial-gradient(circle at 30% 35%, rgba(248, 180, 90, 0.75), transparent 28%),
    radial-gradient(circle at 70% 60%, rgba(230, 95, 30, 0.45), transparent 35%),
    linear-gradient(135deg, #392518, #120D08);
}
.cover--amber-grid {
  background:
    repeating-linear-gradient(90deg, transparent 0 22px, rgba(242, 138, 45, 0.12) 23px 24px),
    repeating-linear-gradient(0deg, transparent 0 22px, rgba(242, 138, 45, 0.08) 23px 24px),
    radial-gradient(circle at 60% 40%, rgba(248, 180, 90, 0.4), transparent 40%),
    linear-gradient(160deg, #2a1c10, #0a0908);
}
.cover--cyber-night {
  background:
    repeating-linear-gradient(90deg, transparent 0 26px, rgba(106, 215, 255, 0.08) 27px 28px),
    radial-gradient(circle at 70% 30%, rgba(106, 215, 255, 0.35), transparent 30%),
    linear-gradient(145deg, #11171B, #070706);
}
.cover--gold-paper {
  background:
    radial-gradient(circle at 20% 20%, rgba(212, 161, 75, 0.35), transparent 40%),
    linear-gradient(145deg, #2a2215, #100e0b 50%, #1a140e);
}
.cover--rust-stage {
  background:
    radial-gradient(circle at 50% 80%, rgba(168, 67, 36, 0.45), transparent 40%),
    radial-gradient(circle at 30% 30%, rgba(242, 138, 45, 0.25), transparent 35%),
    linear-gradient(180deg, #1a100c, #070706);
}
.cover--lab-teal {
  background:
    radial-gradient(circle at 40% 40%, rgba(106, 215, 255, 0.22), transparent 40%),
    radial-gradient(circle at 80% 70%, rgba(242, 138, 45, 0.18), transparent 30%),
    linear-gradient(135deg, #0f1a1c, #0a0908);
}
.cover--folk-dust {
  background:
    radial-gradient(circle at 35% 45%, rgba(248, 180, 90, 0.5), transparent 32%),
    radial-gradient(circle at 75% 25%, rgba(212, 161, 75, 0.25), transparent 28%),
    linear-gradient(150deg, #2c1f12, #0c0a08);
}
.cover--violet-fog {
  background:
    radial-gradient(circle at 60% 40%, rgba(120, 90, 180, 0.35), transparent 40%),
    radial-gradient(circle at 20% 70%, rgba(242, 138, 45, 0.2), transparent 35%),
    linear-gradient(160deg, #16101c, #070706);
}

a.avatar { cursor: pointer; }
.avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  font: 700 10px/1 var(--display);
  color: var(--mg-ink);
  background: var(--grad-cta);
}
.avatar--lg { width: 56px; height: 56px; font-size: 18px; }
.avatar--sm { width: 36px; height: 36px; font-size: 12px; }
.avatar--xl { width: 88px; height: 88px; font-size: 28px; border: 3px solid rgba(7, 7, 6, 0.85); }

/* ── RAIL WIDGETS ────────────────────────────────────────────────────── */
.widget {
  margin-bottom: 14px;
  padding: 14px;
  border: 1px solid var(--mg-border);
  border-radius: 14px;
  background: rgba(16, 14, 11, 0.85);
}
.widget__title {
  margin-bottom: 12px;
  color: var(--mg-gold);
  font: 500 10px/1 var(--mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.mini-ch {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border-top: 1px solid rgba(246, 230, 197, 0.06);
}
.mini-ch:first-of-type { border-top: 0; padding-top: 0; }
.mini-ch__info { min-width: 0; flex: 1; }
.mini-ch__name {
  font-weight: 600;
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mini-ch__meta { color: var(--mg-muted); font-size: 11px; }

/* ── POST PAGE ───────────────────────────────────────────────────────── */
.post-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 22px;
}
.post-layout--reading {
  grid-template-columns: minmax(0, 1fr) 260px;
}
.post-layout--reading .post-content {
  max-width: 72ch;
  margin-inline: auto;
  font-size: 1.08rem;
  line-height: 1.75;
}
.post-layout--reading .post-aside .related-card { display: none; }
.post-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid var(--mg-border);
}
.post-nav .btn.is-disabled {
  opacity: 0.45;
  pointer-events: none;
}
.reading-upsell { margin-top: 18px; }
.reading-comments-toggle { margin: 16px 0; }
.player { position: relative; }
.player__endless {
  position: absolute;
  right: 12px;
  top: 12px;
  z-index: 3;
  background: rgba(12, 10, 8, 0.82);
  color: #f7f4ef;
  border-color: rgba(255, 255, 255, 0.18);
}
.autoplay-overlay {
  position: absolute;
  inset: 0;
  z-index: 4;
  display: grid;
  place-items: center;
  background: rgba(8, 6, 4, 0.72);
}
.autoplay-overlay__card {
  background: #16120e;
  color: #f7f4ef;
  border-radius: 16px;
  padding: 18px 20px;
  max-width: 320px;
  text-align: center;
  border: 1px solid rgba(255, 255, 255, 0.12);
}
.autoplay-overlay__actions {
  display: flex;
  gap: 8px;
  justify-content: center;
  margin-top: 12px;
}
.aod-sticky {
  position: static;
}
.aod-card {
  display: block;
  text-decoration: none;
  color: inherit;
}
.aod-card__cover {
  aspect-ratio: 16 / 10;
  border-radius: 12px;
  background: #1a1510 center/cover no-repeat;
  margin-bottom: 10px;
}
.aod-card__cover--empty { background: linear-gradient(135deg, #2a2218, #15110d); }
.aod-card__title {
  font: 650 1rem/1.3 var(--display);
  color: var(--mg-hi);
}
.aod-card__excerpt {
  margin-top: 6px;
  font-size: 13px;
  color: var(--mg-muted);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.aod-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 14px;
}
.aod-candidate {
  border: 1px solid var(--mg-border);
  border-radius: 16px;
  padding: 14px;
  background: var(--mg-card, #fff);
}
.aod-candidate__cover {
  aspect-ratio: 16 / 10;
  border-radius: 10px;
  background: #1a1510 center/cover no-repeat;
  margin-bottom: 10px;
}
.aod-candidate__meta { font-size: 13px; color: var(--mg-muted); margin: 8px 0; }
.quote-fab {
  position: absolute;
  z-index: 40;
  border: 0;
  border-radius: 999px;
  padding: 8px 14px;
  background: #1a1510;
  color: #f7f4ef;
  font: 600 13px/1 var(--sans, system-ui);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
  cursor: pointer;
}
.channel-toc__series { margin-top: 10px; }
.channel-toc__series ul { margin: 6px 0 0; padding-left: 18px; }
.bonus-list { margin: 10px 0 0; padding-left: 18px; }
.bonus-list li { margin: 8px 0; }
.share-url-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.share-url-row .share-url { flex: 1; min-width: 180px; }
.post-hero {
  overflow: hidden;
  border: 1px solid var(--mg-border);
  border-radius: 20px;
  background: #0d0b08;
}
.post-hero__cover {
  width: 100%;
  max-width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 0;
  box-sizing: border-box;
}
@media (min-width: 861px) {
  .post-hero__cover {
    aspect-ratio: 16 / 8;
    min-height: 220px;
  }
}
.post-hero__body { padding: 22px 24px 8px; }
.post-author {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.post-author__who {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex: 1;
}
.post-author__meta { min-width: 0; }
.post-author__stats {
  font-size: 12px;
  overflow-wrap: anywhere;
}
.post-author__sub {
  flex-shrink: 0;
  white-space: nowrap;
}
.post-hero__title {
  font: 700 clamp(1.6rem, 4vw, 2.5rem)/1.12 var(--article-display);
  text-transform: none;
  color: var(--mg-hi);
  letter-spacing: -0.015em;
  overflow-wrap: anywhere;
  word-break: break-word;
  font-style: italic;
}
.post-hero__lead {
  margin-top: 12px;
  color: var(--mg-copy);
  font: italic 17px/1.55 var(--article-display);
  max-width: 60ch;
  overflow-wrap: anywhere;
}
.post-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 18px 0;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(246, 230, 197, 0.08);
}
.post-content {
  padding: 8px 4px 24px;
  color: var(--mg-copy);
  font: 17.5px/1.78 var(--article-body);
  max-width: 66ch;
  font-optical-sizing: auto;
}
.post-content p + p { margin-top: 1.15em; }
.post-content strong { color: var(--mg-ivory); font-weight: 650; }
.post-content em,
.post-rich em {
  font-style: italic;
  color: var(--mg-hi);
  font-family: var(--article-display);
  font-weight: 500;
}
.post-content .post-lede,
.post-rich .post-lede {
  font-family: var(--article-display);
  font-style: italic;
  font-size: 1.12em;
  line-height: 1.45;
  color: var(--mg-hi);
}
.post-content .post-accent,
.post-rich .post-accent {
  display: block;
  margin: 0.15em 0;
  padding-left: 0.85em;
  border-left: 2px solid rgba(242, 138, 45, 0.55);
  font-family: var(--article-display);
  font-style: italic;
  font-size: 1.06em;
  line-height: 1.55;
  color: var(--mg-hi);
}
.post-content .post-sign,
.post-rich .post-sign {
  display: inline-block;
  margin-top: 0.85em;
  font: 600 13px/1.4 var(--display);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--mg-muted);
}
.post-content > p:first-of-type::first-letter,
.post-content > .post-rich:first-of-type > p:first-of-type::first-letter {
  font-family: var(--article-display);
  font-weight: 600;
  font-size: 1.35em;
  color: var(--mg-amber-lite);
  margin-right: 1px;
}

.player {
  position: relative;
  aspect-ratio: 16/9;
  background: #090807;
  display: grid;
  place-items: center;
  overflow: hidden;
}
.player--ready .player__poster { display: none; }
.player[data-video-url] .player__poster { display: none; }
.player[data-video-url] .player__video { display: block; }
.player__video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #000;
  display: block;
}
.player__poster {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
}
.player__poster .cover,
.player__poster .cover--photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.player__btn {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--grad-cta);
  color: var(--mg-ink);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5), var(--mg-glow);
  z-index: 2;
}
.player__missing {
  position: absolute;
  inset: auto 14px 14px;
  z-index: 3;
  color: var(--mg-muted);
  font-size: 12px;
  text-align: center;
}
.create-type-picks--bar {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  flex: 1;
  max-width: 320px;
  margin: 0 auto;
}
.create-type-picks--lg {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  max-width: 640px;
}
.create-type-pick--card {
  display: grid;
  gap: 8px;
  text-align: left;
  padding: 22px 18px;
  min-height: 120px;
}
.create-type-pick--card strong {
  font: 700 1.1rem/1.2 var(--display);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--mg-hi);
}
.create-type-pick--card span {
  color: var(--mg-muted);
  font: 400 13px/1.4 var(--body);
  text-transform: none;
  letter-spacing: 0;
}
.create-chooser {
  padding: 8px 0 24px;
}
.create-type-pick {
  appearance: none;
  border: 1px solid rgba(212, 161, 75, 0.28);
  border-radius: 10px;
  background: rgba(16, 14, 11, 0.75);
  color: var(--mg-copy);
  font: 600 12px/1.2 var(--display);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 12px 8px;
  cursor: pointer;
}
.create-type-pick.is-on {
  border-color: var(--mg-amber);
  color: var(--mg-hi);
  background: rgba(242, 138, 45, 0.16);
  box-shadow: inset 0 0 0 1px rgba(242, 138, 45, 0.25);
}
.video-hero-drop {
  margin: 0 0 18px;
}
.video-hero-drop.is-hidden,
.video-hero-drop[hidden] {
  display: none !important;
}
.video-hero-drop__box {
  min-height: 220px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 12px;
  padding: 28px 20px;
  text-align: center;
  border-style: dashed;
  border-width: 2px;
}
.video-hero-drop__title {
  font: 700 1.35rem/1.1 var(--display);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--mg-hi);
}
.video-hero-drop__text {
  max-width: 28em;
  color: var(--mg-muted);
  font-size: 14px;
  line-height: 1.45;
}
.video-preview-panel {
  display: grid;
  gap: 14px;
  margin-bottom: 8px;
}
.video-preview-panel[hidden] {
  display: none !important;
}
.video-preview-panel__player {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  border: 1px solid rgba(212, 161, 75, 0.28);
  background: #0a0908;
}
.video-preview-panel__player video {
  display: block;
  width: 100%;
  max-height: min(52vh, 480px);
  background: #000;
  vertical-align: top;
}
.video-preview-panel__meta {
  display: grid;
  gap: 10px;
}
.video-preview-panel__name {
  color: var(--mg-ivory);
  font-size: 14px;
  line-height: 1.4;
  word-break: break-word;
}
.video-cover-picker {
  padding: 14px;
  border-radius: 14px;
  border: 1px solid rgba(212, 161, 75, 0.22);
  background: rgba(255, 248, 235, 0.03);
}
.video-cover-picker__h {
  font: 700 0.95rem/1.2 var(--display);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--mg-hi);
  margin-bottom: 6px;
}
.cover-frame-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin: 12px 0;
}
.cover-frame-strip__empty {
  grid-column: 1 / -1;
  color: var(--mg-muted);
  font-size: 13px;
  padding: 10px 0;
}
.cover-frame {
  appearance: none;
  border: 2px solid transparent;
  border-radius: 10px;
  padding: 0;
  overflow: hidden;
  cursor: pointer;
  background: #12100e;
  aspect-ratio: 16 / 9;
}
.cover-frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cover-frame span {
  display: grid;
  place-items: center;
  height: 100%;
  color: var(--mg-muted);
  font-size: 12px;
}
.cover-frame.is-on {
  border-color: var(--mg-amber);
  box-shadow: 0 0 0 1px rgba(242, 138, 45, 0.45);
}
.cover-scrub {
  display: grid;
  gap: 10px;
}
.cover-scrub__label {
  display: grid;
  gap: 8px;
  color: var(--mg-copy);
  font-size: 13px;
}
.cover-scrub__label input[type="range"] {
  width: 100%;
  accent-color: var(--mg-amber);
}
@media (max-width: 720px) {
  .cover-frame-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .video-preview-panel__player video {
    max-height: 42vh;
  }
}
.video-drop-preview {
  min-height: 88px;
  display: grid;
  place-items: center;
  padding: 14px;
  color: var(--mg-muted);
  font-size: 13px;
  text-align: center;
}
.video-drop-preview.is-on {
  color: var(--mg-ivory);
  background: rgba(242, 138, 45, 0.08);
}
.article-editor__content--video-desc {
  min-height: 160px;
  margin-top: 8px;
}
.player__time {
  position: absolute;
  left: 14px;
  bottom: 14px;
  z-index: 2;
  padding: 4px 8px;
  border-radius: 6px;
  background: rgba(0, 0, 0, 0.7);
  font: 600 12px/1 var(--mono);
}

.comments { margin-top: 8px; }
.comments__title {
  margin-bottom: 14px;
  font: 600 1.2rem/1 var(--display);
  text-transform: uppercase;
}
.comments__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 12px;
}
.comment-form {
  display: grid;
  gap: 10px;
  margin-bottom: 18px;
}
.comment-form__reply {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 10px;
  border: 1px solid rgba(246, 230, 197, 0.14);
  background: rgba(246, 230, 197, 0.06);
  color: var(--mg-muted);
  font-size: 13px;
}
.comment-form__reply-cancel {
  border: 0;
  background: transparent;
  color: var(--mg-ivory);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  padding: 0 4px;
}
.comment-form textarea {
  min-height: 88px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid var(--mg-border);
  background: #0a0908;
  resize: vertical;
}
.comment {
  display: grid;
  grid-template-columns: 36px 1fr;
  gap: 12px;
  padding: 14px 0;
  border-top: 1px solid rgba(246, 230, 197, 0.07);
}
.comment--reply {
  margin-left: 28px;
  grid-template-columns: 28px 1fr;
  padding-left: 8px;
  border-left: 2px solid rgba(246, 230, 197, 0.12);
}
.comment.is-new {
  margin-left: -8px;
  margin-right: -8px;
  padding-left: 8px;
  padding-right: 8px;
  border-radius: 12px;
  background: rgba(242, 184, 75, 0.1);
  border-top-color: transparent;
  box-shadow: inset 3px 0 0 rgba(242, 184, 75, 0.75);
}
.comment__head { display: flex; align-items: center; flex-wrap: wrap; gap: 2px 0; }
.comment__author { font-weight: 700; color: var(--mg-ivory); }
.comment__time { color: var(--mg-muted); font-size: 12px; margin-left: 8px; }
.comment__author-heart {
  display: inline-flex;
  margin-left: 8px;
  color: #e2556f;
}
.comment__reply-to {
  margin-top: 2px;
  font-size: 12px;
  color: var(--mg-muted);
}
.comment__text { margin-top: 4px; color: var(--mg-copy); }
.comment__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
}
.comment__act {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border: 0;
  background: transparent;
  color: var(--mg-muted);
  font: 600 12px/1 var(--sans);
  padding: 4px 6px;
  border-radius: 8px;
  cursor: pointer;
}
.comment__act:hover { color: var(--mg-ivory); background: rgba(246, 230, 197, 0.06); }
.comment__act.is-on { color: var(--mg-gold, #d4b483); }
.comment__act--heart.is-on { color: #e2556f; }

/* ── CHANNEL ─────────────────────────────────────────────────────────── */
.channel-cover {
  position: relative;
  height: auto;
  aspect-ratio: 3.42 / 1;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid var(--mg-border);
}
.channel-cover__title {
  position: absolute;
  left: 20px;
  right: 16px;
  bottom: 16px;
  z-index: 1;
}
.channel-cover__name {
  margin: 0;
  font: 700 clamp(1.45rem, 2.6vw, 2rem)/1.05 var(--display);
  text-transform: uppercase;
  color: #f6ead4;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.65);
}
.channel-cover__handle {
  margin-top: 6px;
  color: #e4c48a;
  font: 500 13px/1.3 var(--mono);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.7);
}
.channel-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 16px;
  margin-top: 16px;
  padding: 0 8px 18px;
  position: relative;
}
.channel-head__info { flex: 1; min-width: 200px; }
.channel-head__name {
  font: 700 clamp(1.6rem, 3vw, 2.2rem)/1 var(--display);
  text-transform: uppercase;
  color: var(--mg-hi);
}
.channel-head__handle { color: var(--mg-gold); font: 500 12px/1.4 var(--mono); margin-top: 4px; }
.channel-head__desc { margin-top: 0; color: var(--mg-copy); max-width: 60ch; }
.channel-goal {
  margin: 12px 0 0;
  padding: 10px 14px;
  border: 1px solid rgba(242, 138, 45, 0.35);
  border-radius: 12px;
  background: rgba(242, 138, 45, 0.1);
  color: var(--mg-ivory);
  font-size: 14px;
  line-height: 1.4;
  max-width: 52ch;
}
.channel-goal a { color: var(--mg-amber-lite); text-decoration: underline; text-underline-offset: 2px; }
.channel-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 12px;
  color: var(--mg-muted);
  font-size: 13px;
}
.channel-stats b { color: var(--mg-ivory); font-weight: 700; }
.channel-stats .channel-stat-btn { color: var(--mg-muted); }
.channel-stats .channel-stat-btn:hover { color: var(--mg-amber-lite); }
.tabs {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  margin-bottom: 16px;
  padding-bottom: 2px;
  padding-right: 4px;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.tabs::-webkit-scrollbar { display: none; }
.tabs::after {
  content: "";
  flex: 0 0 18px;
}
.tab {
  flex: 0 0 auto;
  min-height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid transparent;
  color: var(--mg-muted);
  font: 500 11px/1 var(--mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.tab:hover { color: var(--mg-ivory); }
.tab.is-active {
  color: var(--mg-ivory);
  border-color: var(--mg-border);
  background: rgba(212, 161, 75, 0.08);
}

/* ── STUDIO ──────────────────────────────────────────────────────────── */
.studio {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr);
  gap: 18px;
}
.studio-nav {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.studio-panel {
  padding: 18px;
  border: 1px solid var(--mg-border);
  border-radius: 16px;
  background: rgba(16, 14, 11, 0.88);
}
.stats-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}
.stat {
  padding: 14px;
  border: 1px solid var(--mg-border);
  border-radius: 12px;
  background: rgba(7, 7, 6, 0.4);
}
.stat b {
  display: block;
  font: 700 1.4rem/1 var(--display);
  color: var(--mg-amber-lite);
  text-transform: uppercase;
}
.stat span {
  display: block;
  margin-top: 6px;
  color: var(--mg-muted);
  font-size: 12px;
}
.table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.table th {
  text-align: left;
  padding: 10px 8px;
  color: var(--mg-gold);
  font: 500 10px/1 var(--mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--mg-border);
}
.table td {
  padding: 12px 8px;
  border-bottom: 1px solid rgba(246, 230, 197, 0.06);
  vertical-align: middle;
}
.table tr:hover td { background: rgba(212, 161, 75, 0.04); }
.badge {
  display: inline-flex;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid rgba(212, 161, 75, 0.3);
  color: var(--mg-gold);
  font: 500 10px/1 var(--mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.badge--draft { color: var(--mg-muted); border-color: rgba(148, 136, 115, 0.35); }
.form-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; max-width: 560px; }
[hidden] { display: none !important; }
.field label {
  display: block;
  margin-bottom: 6px;
  color: var(--mg-gold);
  font: 500 10px/1 var(--mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.field input,
.field textarea,
.field select {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--mg-border);
  background: #0a0908;
}
.field textarea { min-height: 120px; resize: vertical; }
.pass-field {
  position: relative;
  display: block;
}
.pass-field input {
  padding-right: 46px;
}
.pass-toggle {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  display: inline-grid;
  place-items: center;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--mg-muted, #948873);
  cursor: pointer;
  padding: 0;
}
.pass-toggle:hover,
.pass-toggle:focus-visible {
  color: var(--mg-gold, #d4a14b);
  background: rgba(212, 161, 75, 0.1);
  outline: none;
}
.pass-toggle[aria-pressed="true"] {
  color: var(--mg-hi, #f6e6c5);
}
.pass-toggle svg {
  display: block;
  pointer-events: none;
}
.form-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }

/* ── SEARCH / SETTINGS ───────────────────────────────────────────────── */
.search-box {
  display: flex;
  gap: 10px;
  margin-bottom: 18px;
}
.search-box input {
  flex: 1;
  min-height: 48px;
  padding: 0 16px;
  border-radius: 12px;
  border: 1px solid var(--mg-border);
  background: #0a0908;
}
.search-sections { display: grid; gap: 22px; }
.search-section h3 {
  margin-bottom: 12px;
  font: 600 1rem/1 var(--display);
  text-transform: uppercase;
  color: var(--mg-hi);
}

.settings-list { display: grid; gap: 10px; max-width: 520px; }
.setting {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px;
  border: 1px solid var(--mg-border);
  border-radius: 12px;
  background: rgba(16, 14, 11, 0.85);
}
.setting__title { font-weight: 600; color: var(--mg-ivory); }
.setting__desc { margin-top: 4px; color: var(--mg-muted); font-size: 13px; }
.switch {
  width: 48px;
  height: 28px;
  border-radius: 999px;
  border: 1px solid var(--mg-border);
  background: #0a0908;
  position: relative;
  flex-shrink: 0;
}
.switch::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--mg-muted);
  transition: .2s var(--ease);
}
.switch.is-on {
  background: rgba(242, 138, 45, 0.2);
  border-color: var(--mg-amber);
}
.switch.is-on::after {
  left: 23px;
  background: var(--mg-amber);
}

/* помощник набора */
.typing-set { max-width: 520px; margin: 22px 0; }
.typing-set__head { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
.typing-set__title { margin: 0; font: 700 1.15rem/1.2 var(--display); color: var(--mg-hi); }
.typing-set__badge { padding: 3px 9px; border: 1px solid rgba(120, 200, 140, .45); border-radius: 999px; background: rgba(60, 140, 80, .14); color: #9fdcae; font-size: 11px; font-weight: 600; letter-spacing: .02em; }
.typing-set__lead { margin: 0 0 12px; color: var(--mg-muted); font-size: 13px; line-height: 1.5; }
.setting--sub { margin-left: 14px; }
.typing-set.is-off .setting--sub { opacity: .45; }
.typing-set__select { flex-shrink: 0; max-width: 46%; min-height: 36px; padding: 0 10px; border: 1px solid var(--mg-border); border-radius: 10px; background: #0a0908; color: var(--mg-ivory); font: inherit; font-size: 13px; }
.typing-btn { position: fixed; right: 12px; bottom: 10px; z-index: 90; display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px; border: 1px solid rgba(212, 161, 75, .5); border-radius: 999px; background: rgba(16, 14, 11, .94); color: var(--mg-hi); font-size: 13px; font-weight: 600; box-shadow: 0 6px 20px rgba(0, 0, 0, .45); touch-action: none; }
.typing-btn[hidden] { display: none; }
.typing-btn i { font-style: normal; color: var(--mg-amber); }
.typing-btn--free { touch-action: none; opacity: .82; }
.typing-btn.is-drag { opacity: 1; box-shadow: 0 10px 28px rgba(0, 0, 0, .55); cursor: grabbing; }
.typing-tip { position: fixed; z-index: 95; max-width: min(320px, calc(100vw - 24px)); padding: 6px 10px; border: 1px solid rgba(212, 161, 75, .4); border-radius: 8px; background: rgba(16, 14, 11, .96); color: var(--mg-ivory); font-size: 12px; line-height: 1.35; pointer-events: none; opacity: 0; transform: translateY(4px); transition: opacity .15s, transform .15s; }
.typing-tip.is-on { opacity: 1; transform: none; }
@media (max-width: 720px) {
  .setting--sub { margin-left: 8px; }
  .setting--wrap { flex-wrap: wrap; gap: 10px; }
  .setting--wrap .typing-set__select { width: 100%; max-width: none; }
}

/* ── NOTIFS / TOAST / BOTTOM NAV ─────────────────────────────────────── */
.dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: min(320px, calc(100vw - 24px));
  padding: 8px;
  border: 1px solid var(--mg-border);
  border-radius: 14px;
  background: #0d0c0b;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.55);
  display: none;
  z-index: 300;
}
.dropdown.is-open { display: block; }
.dropdown__item {
  display: block;
  width: 100%;
  text-align: left;
  padding: 12px;
  border-radius: 10px;
  color: var(--mg-copy);
  font-size: 13px;
}
.dropdown__item:hover { background: rgba(212, 161, 75, 0.08); color: var(--mg-ivory); }
.dropdown__item b { display: block; color: var(--mg-ivory); margin-bottom: 2px; }

.toast {
  position: fixed;
  z-index: 1000;
  left: 50%;
  bottom: 84px;
  transform: translate(-50%, 12px);
  max-width: calc(100% - 28px);
  padding: 12px 16px;
  border: 1px solid var(--mg-gold);
  border-radius: 10px;
  background: rgba(13, 12, 11, 0.97);
  color: var(--mg-ivory);
  font-size: 14px;
  opacity: 0;
  pointer-events: none;
  transition: .2s;
}
.toast.is-on { opacity: 1; transform: translate(-50%, 0); }

.bottom-nav {
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 150;
  padding: 8px 10px calc(8px + env(safe-area-inset-bottom));
  border-top: 1px solid var(--mg-border);
  background: rgba(7, 7, 6, 0.96);
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
}
.bottom-nav__inner {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 4px;
  max-width: 520px;
  margin: 0 auto;
}
.bnav {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-height: 52px;
  justify-content: center;
  border-radius: 12px;
  color: var(--mg-muted);
  font: 500 9px/1 var(--mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.bnav.is-active { color: var(--mg-amber-lite); background: rgba(242, 138, 45, 0.08); }
.bnav svg { width: 20px; height: 20px; }

.empty {
  padding: 48px 20px;
  text-align: center;
  border: 1px dashed var(--mg-border);
  border-radius: 16px;
  color: var(--mg-muted);
}
.empty b { display: block; margin-bottom: 8px; color: var(--mg-ivory); font: 600 1.2rem/1 var(--display); text-transform: uppercase; }

.verified {
  display: inline-grid;
  place-items: center;
  width: 16px;
  height: 16px;
  margin-left: 4px;
  border-radius: 50%;
  background: var(--mg-amber);
  color: var(--mg-ink);
  font-size: 10px;
  font-weight: 800;
  vertical-align: middle;
}

.related-card {
  display: grid;
  grid-template-columns: 88px 1fr;
  gap: 10px;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(246, 230, 197, 0.06);
}
.related-card:last-child { border: 0; margin: 0; padding: 0; }
.related-card__cover {
  height: 64px;
  border-radius: 8px;
  overflow: hidden;
}
.related-card__title {
  font: 600 13px/1.25 var(--display);
  text-transform: uppercase;
  color: var(--mg-hi);
}
.related-card__meta { margin-top: 4px; color: var(--mg-muted); font-size: 11px; }

/* ── RESPONSIVE ──────────────────────────────────────────────────────── */
/* when right rail hidden, expand main (desktop/tablet with sidebar) */
.layout:has(.rail[hidden]) {
  grid-template-columns: var(--sidebar-w) minmax(0, 1fr);
}

@media (max-width: 1100px) {
  .layout { grid-template-columns: var(--sidebar-w) minmax(0, 1fr); }
  .rail { display: none; }
  .post-layout { grid-template-columns: minmax(0, 1fr); }
  .brand__tag { display: none; }
  /* на узком экране rail скрыт — плавающий диск только между 861 и 1100 */
  body.is-home-radio .radio-disc--float {
    display: block !important;
  }
}
@media (max-width: 860px) {
  body.is-home-radio .radio-disc--float {
    display: none !important;
  }
}

@media (max-width: 860px) {
  html, body {
    overflow-x: hidden;
    max-width: 100%;
  }
  .layout,
  .layout:has(.rail[hidden]),
  .layout:has(.sidebar) {
    grid-template-columns: minmax(0, 1fr);
  }
  .layout { min-width: 0; }
  .sidebar, .rail { display: none !important; }
  .bottom-nav { display: block; z-index: 200; }
  .main {
    min-width: 0;
    max-width: 100%;
    overflow-x: hidden;
    padding: 14px 14px calc(128px + env(safe-area-inset-bottom, 0px));
  }
  .topnav__inner {
    gap: 8px;
    padding: 0 10px;
  }
  .brand {
    gap: 10px;
    max-width: min(48vw, 190px);
  }
  .brand__tag { display: none; }
  .brand__mark { width: 40px; height: 40px; }
  .brand__title { font-size: 1.05rem; letter-spacing: 0.01em; }
  .topnav__actions { gap: 4px; }
  .topnav__actions .btn--sm {
    min-height: 40px;
    padding: 0 11px;
    font-size: 11px;
  }
  .icon-btn {
    width: 40px;
    height: 40px;
    border-radius: 11px;
  }
  .home-logo {
    gap: 12px;
    margin: 2px 0 14px;
    align-items: center;
  }
  .home-logo__mark {
    width: 72px;
    height: 72px;
  }
  .home-logo__title {
    font-size: clamp(1.55rem, 8vw, 2.1rem);
    line-height: 0.95;
  }
  .home-logo__tag {
    margin-top: 6px;
    letter-spacing: 0.08em;
    max-width: none;
    font-size: 0.68rem;
    line-height: 1.35;
  }
  .topnav__search span { display: none; }
  .topnav__search {
    flex: 0 0 auto;
    max-width: 40px;
    justify-content: center;
    padding: 0;
    width: 40px;
    height: 40px;
    border-radius: 12px;
  }
  .page-head {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    margin-bottom: 14px;
  }
  .page-head .btn,
  .page-head .btn--cta {
    width: 100%;
  }
  .filters {
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 8px;
    margin: 0 -14px 16px;
    padding: 2px 14px 8px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .filters::-webkit-scrollbar { display: none; }
  .filter {
    flex: 0 0 auto;
    min-height: 40px;
    padding: 0 14px;
  }
  .card, .card--video { grid-template-columns: 1fr; }
  .card__cover, .card__cover-art { min-height: 180px; aspect-ratio: 16/9; }
  .card__body {
    padding: 14px 14px 12px;
    min-width: 0;
  }
  .card__title {
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  .card__meta { gap: 2px; }
  .meta-btn {
    min-height: 40px;
    padding: 0 8px;
  }
  .search-box {
    flex-direction: column;
    gap: 10px;
  }
  .search-box input,
  .search-box .btn {
    width: 100%;
    min-height: 48px;
  }
  .topic-cloud {
    max-height: none;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0 0 8px;
  }
  .topic-chip {
    margin: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
  }
  .channel-head {
    margin-top: 12px;
    padding: 0 4px 14px;
    gap: 12px;
  }
  .channel-head__info { min-width: 0; flex: 1 1 100%; }
  .channel-head__desc { max-width: none; }
  .channel-stats { gap: 12px; }
  .post-actions .btn {
    flex: 1 1 calc(50% - 8px);
    min-width: 0;
  }
  .post-hero__body {
    padding: 14px 14px 6px;
  }
  .post-author {
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .post-author__sub {
    width: 100%;
    margin-top: 2px;
    min-height: 42px;
  }
  .post-hero__title {
    font-size: clamp(1.25rem, 6.2vw, 1.7rem);
    line-height: 1.12;
  }
  .post-hero__lead {
    max-width: none;
    font-size: 15px;
  }
  .channel-head .btn,
  .channel-head .btn--cta,
  .channel-head .btn--sm {
    width: 100%;
    min-height: 44px;
  }
  .post-content,
  .post-rich,
  .article-body {
    max-width: none;
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  .studio { grid-template-columns: minmax(0, 1fr); min-width: 0; overflow-x: hidden; }
  .studio-nav {
    flex-direction: row;
    overflow-x: auto;
    gap: 6px;
    margin: 0;
    padding: 0 0 4px;
    max-width: 100%;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .studio-nav::-webkit-scrollbar { display: none; }
  .studio-nav .side-link,
  .studio-nav [data-studio-tab] {
    flex: 0 0 auto;
  }
  .tabs {
    margin: 0 -14px 16px;
    padding: 2px 14px 8px;
    max-width: none;
    width: auto;
  }
  .tab {
    min-height: 36px;
    padding: 0 10px;
    font-size: 10px;
    letter-spacing: 0.05em;
  }
  .post-hero {
    max-width: 100%;
  }
  .post-hero__cover {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9;
  }
  .studio-panel { padding: 14px; }
  .stats-grid { grid-template-columns: 1fr; }
  .table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .form-grid { max-width: none; }
  .field input,
  .field textarea,
  .field select,
  .search-box input,
  .pass-field input {
    font-size: 16px;
  }
  .pass-toggle {
    width: 40px;
    height: 40px;
    right: 4px;
  }
  .pass-field input { padding-right: 48px; }
  .toast {
    bottom: calc(96px + env(safe-area-inset-bottom, 0px));
    max-width: calc(100% - 20px);
  }
  .empty { padding: 36px 16px; }
  .dropdown {
    right: 0;
    max-width: min(320px, calc(100vw - 16px));
  }
  .img-crop {
    padding: 8px;
    align-items: end;
  }
  .img-crop__card {
    width: 100%;
    max-height: min(96dvh, 100%);
    overflow: auto;
    border-radius: 16px 16px 0 0;
    padding: 14px 12px calc(12px + env(safe-area-inset-bottom, 0px));
  }
  .bnav {
    min-height: 54px;
    gap: 3px;
    font-size: 8px;
    letter-spacing: 0.04em;
  }
  .card:hover .card__play { opacity: 1; }
  .card__play { opacity: 0.92; }
  .article-editor__top {
    gap: 8px;
    padding: 10px 10px;
  }
  .article-editor__top .btn { min-height: 40px; }
  .article-editor__content {
    padding: 12px 12px 28px;
    font-size: 16px;
  }
  .create-type-pick { min-height: 44px; }
  .video-editor,
  .video-trim,
  .frame-strip,
  .cover-frame-strip {
    max-width: 100%;
    overflow-x: auto;
  }
}

@media (max-width: 480px) {
  .page-title { font-size: 1.45rem; }
  .page-kicker { letter-spacing: 0.12em; }
  .channel-cover { height: auto; aspect-ratio: 3.42 / 1; }
  .avatar--xl { width: 68px; height: 68px; }
  .main { padding-left: 12px; padding-right: 12px; }
  .filters { margin-left: -12px; margin-right: -12px; padding-left: 12px; padding-right: 12px; }
  .card__cover, .card__cover-art { min-height: 168px; }
  .home-logo__mark { width: 64px; height: 64px; }
  .topnav__actions .btn--sm { padding: 0 10px; }
  .brand { max-width: min(46vw, 168px); }
}

@media (max-width: 360px) {
  .brand__title { font-size: 0.95rem; }
  .brand__mark { width: 36px; height: 36px; }
  .topnav__search,
  .icon-btn {
    width: 36px;
    height: 36px;
  }
  .bnav span { font-size: 7.5px; }
}

/* ── AUTH ────────────────────────────────────────────────────────────── */
.auth-overlay {
  position: fixed;
  inset: 0;
  z-index: 500;
  display: grid;
  place-items: center;
  padding: 16px;
  background: rgba(7, 7, 6, 0.72);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}
.auth-overlay[hidden] { display: none !important; }

.share-url-row {
  display: flex;
  gap: 8px;
  margin: 0 0 10px;
}
.share-url {
  flex: 1;
  min-width: 0;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--mg-border);
  background: rgba(0, 0, 0, 0.35);
  color: var(--mg-ivory);
  font-size: 13px;
}
.share-copy-full {
  width: 100%;
  margin: 0 0 10px;
  justify-content: center;
}
.share-chat-btn {
  width: 100%;
  margin: 0 0 14px;
  justify-content: center;
  border-color: rgba(242, 138, 45, 0.55);
  color: var(--mg-amber-lite, #ffb062);
}
.share-chat-btn:hover { background: rgba(242, 138, 45, 0.12); }
.share-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.share-opt {
  padding: 12px 10px;
  border-radius: 12px;
  border: 1px solid var(--mg-border);
  background: rgba(255, 255, 255, 0.03);
  color: var(--mg-ivory);
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}
.share-opt:hover {
  border-color: rgba(212, 161, 75, 0.45);
  background: rgba(212, 161, 75, 0.08);
}
.channel-head {
  flex-wrap: wrap;
  gap: 10px;
}
.channel-head > .btn {
  align-self: flex-start;
}
.auth-modal {
  position: relative;
  width: min(440px, 100%);
  max-height: min(92dvh, 720px);
  overflow: auto;
  padding: 22px 20px 18px;
  border: 1px solid var(--mg-border);
  border-radius: 18px;
  background: linear-gradient(160deg, rgba(23, 19, 14, 0.98), rgba(10, 9, 8, 0.98));
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.55), var(--mg-glow);
}
.auth-brand {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 2px 36px 16px 0;
  background: transparent;
}
.auth-brand__mark {
  width: 64px;
  height: 64px;
  object-fit: contain;
  background: transparent;
  filter: drop-shadow(0 0 16px rgba(242, 138, 45, 0.4));
  flex-shrink: 0;
}
.auth-brand__text { min-width: 0; }
.auth-brand__text .brand__title {
  font-size: 1.45rem;
}
.widget-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  background: transparent;
}
.widget-brand__cube {
  width: 56px;
  height: 56px;
  object-fit: contain;
  background: transparent;
  flex-shrink: 0;
  filter: drop-shadow(0 0 12px rgba(242, 138, 45, 0.35));
}
.widget-brand__text { min-width: 0; }
.widget-brand__text .widget__title { margin: 0; }
.widget-brand__text p { margin-top: 6px; }
.auth-modal__close {
  position: absolute;
  right: 12px;
  top: 10px;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  color: var(--mg-muted);
  font-size: 22px;
  line-height: 1;
}
.auth-modal__close:hover { color: var(--mg-ivory); background: rgba(212,161,75,.08); }
.auth-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-bottom: 16px;
  padding: 4px;
  border-radius: 12px;
  border: 1px solid var(--mg-border);
  background: rgba(7, 7, 6, 0.45);
}
.auth-tab {
  min-height: 40px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1px solid transparent;
  color: var(--mg-muted);
  font: 600 12px/1 var(--display);
  letter-spacing: .06em;
  text-transform: uppercase;
}
.auth-tab.is-active {
  color: var(--mg-ink);
  border-color: transparent;
  background: var(--grad-cta);
  box-shadow: var(--mg-glow);
}
.auth-modal__title {
  font: 700 1.55rem/1 var(--display);
  text-transform: uppercase;
  color: var(--mg-hi);
}
.auth-bind {
  display: grid;
  gap: 12px;
  margin: 0 0 8px;
}
.auth-bind p {
  margin: 0;
  line-height: 1.45;
}
.auth-modal__lead {
  margin: 8px 0 14px;
  color: var(--mg-copy);
  font-size: 14px;
}
.auth-form { max-width: none; width: 100%; }
.auth-demo {
  margin-top: 6px;
  padding-top: 14px;
  border-top: 1px solid rgba(246, 230, 197, 0.08);
}
.auth-demo__row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}
.auth-demo__hint {
  margin-top: 8px;
  color: var(--mg-muted);
  font-size: 12px;
}
.auth-error {
  margin: 0 0 12px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(168, 67, 36, 0.45);
  background: rgba(168, 67, 36, 0.12);
  color: #E8C3B3;
  font-size: 13px;
}
#nav-create[hidden], #btn-auth[hidden], #btn-profile[hidden] { display: none !important; }

@media (max-width: 860px) {
  .auth-overlay {
    align-items: end;
    place-items: end center;
    padding: 0;
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  .auth-modal {
    width: 100%;
    max-width: none;
    max-height: min(94dvh, 100%);
    border-radius: 18px 18px 0 0;
    padding: 18px 16px calc(16px + env(safe-area-inset-bottom, 0px));
    -webkit-overflow-scrolling: touch;
  }
  .auth-modal__close {
    width: 42px;
    height: 42px;
    right: 8px;
    top: 8px;
  }
  .auth-brand { margin-right: 40px; gap: 12px; }
  .auth-brand__mark { width: 52px; height: 52px; }
  .auth-brand__text .brand__title { font-size: 1.25rem; }
  .auth-tabs { margin-bottom: 12px; }
  .auth-tab { min-height: 42px; }
  .auth-form .form-actions { margin-top: 4px; }
  .auth-form .form-actions .btn {
    width: 100%;
    min-height: 48px;
  }
}

/* Радио Грана — диск (плавающий + в шапке + в rail) */
.nav-radio-slot {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 0;
  height: 44px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  flex-shrink: 0;
  transition: width 0.35s var(--ease), opacity 0.35s var(--ease);
}
.nav-radio-slot.is-measuring,
.nav-radio-slot.is-active {
  width: 44px;
}
.nav-radio-slot.is-measuring {
  opacity: 0;
  pointer-events: none;
}
.nav-radio-slot.is-active {
  opacity: 1;
  pointer-events: auto;
}

.widget--radio {
  text-align: center;
  padding-bottom: 8px;
}
.radio-rail__hint {
  font-size: 12px;
  line-height: 1.4;
  margin: 0 0 10px;
}
.radio-rail__player {
  width: 100%;
  max-width: 240px;
  margin: 0 auto;
}
.radio-rail__link {
  display: inline-block;
  margin-top: 10px;
  font: 600 11px/1.3 var(--mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mg-gold);
}
.radio-rail__link:hover {
  color: var(--mg-amber-lite);
}

/* Виниловый проигрыватель — компактно в правой колонке */
.turntable {
  width: 100%;
  max-width: 240px;
  margin: 0 auto;
}
.rail .turntable {
  max-width: 220px;
}
.turntable__svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}
.turntable__disc-fo {
  overflow: visible;
}
.turntable__disc-inner {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
}
.turntable__disc-inner .radio-disc--hero {
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
}
.turntable__disc-inner .radio-disc__rotor {
  box-shadow:
    0 10px 26px rgba(0, 0, 0, 0.58),
    0 2px 0 rgba(255, 255, 255, 0.04);
}
.turntable.is-playing .turntable__disc-inner .radio-disc__rotor {
  box-shadow:
    0 10px 26px rgba(0, 0, 0, 0.58),
    0 2px 0 rgba(255, 255, 255, 0.04),
    0 0 18px rgba(242, 138, 45, 0.12);
}
.turntable__disc-fo.is-fly-source .radio-disc {
  opacity: 0.45;
  transition: opacity 0.35s ease;
}
.turntable__tonearm {
  transform-origin: 0 0;
  transition: transform 1.35s cubic-bezier(0.33, 0.08, 0.2, 1);
}

:root {
  --radio-disc-deg: 0deg;
}

.radio-disc {
  border: none;
  background: transparent;
  border-radius: 50%;
  padding: 0;
  cursor: pointer;
  color: inherit;
  font: inherit;
  overflow: visible;
}

.radio-disc--float {
  position: fixed;
  right: max(14px, env(safe-area-inset-right));
  bottom: max(18px, env(safe-area-inset-bottom));
  z-index: 160;
  width: 96px;
  height: 96px;
}

body.is-home-radio .radio-disc--float {
  display: none !important;
}

.radio-disc--hero {
  position: relative;
  width: min(168px, 52vw);
  aspect-ratio: 1;
  height: auto;
  margin: 0 auto;
}

.radio-disc--hero .radio-disc__rotor {
  box-shadow:
    0 18px 42px rgba(0, 0, 0, 0.62),
    0 2px 0 rgba(255, 255, 255, 0.05);
}

.radio-disc--hero:hover .radio-disc__rotor {
  box-shadow:
    0 18px 42px rgba(0, 0, 0, 0.62),
    0 2px 0 rgba(255, 255, 255, 0.05),
    0 0 24px rgba(242, 138, 45, 0.16);
}

.radio-disc--nav {
  position: relative;
  width: 44px;
  height: 44px;
  flex-shrink: 0;
}

.radio-disc--ghost {
  position: fixed !important;
  z-index: 10050;
  margin: 0;
  pointer-events: none;
}

.radio-disc.is-flying-source {
  animation: radio-disc-pulse 0.82s var(--ease);
}

@keyframes radio-disc-pulse {
  0%, 100% { filter: none; }
  40% { filter: drop-shadow(0 0 18px rgba(242, 138, 45, 0.55)); }
}

.radio-disc__rotor {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: #09090b;
  border: 1px solid rgba(255, 255, 255, 0.07);
  box-shadow:
    0 14px 32px rgba(0, 0, 0, 0.58),
    0 2px 0 rgba(255, 255, 255, 0.04);
  overflow: hidden;
  transform: rotate(var(--radio-disc-deg, 0deg));
  transition: box-shadow 0.35s ease, border-color 0.35s ease;
}

.radio-disc--nav .radio-disc__rotor {
  box-shadow:
    0 6px 16px rgba(0, 0, 0, 0.5),
    0 1px 0 rgba(255, 255, 255, 0.04);
}

.radio-disc:hover .radio-disc__rotor {
  border-color: rgba(255, 255, 255, 0.12);
}

.radio-disc--float:hover .radio-disc__rotor {
  box-shadow:
    0 14px 32px rgba(0, 0, 0, 0.58),
    0 2px 0 rgba(255, 255, 255, 0.04),
    0 0 16px rgba(242, 138, 45, 0.14);
}

.radio-disc:focus-visible {
  outline: 2px solid var(--mg-amber);
  outline-offset: 4px;
}

.radio-disc.is-playing .radio-disc__rotor {
  border-color: rgba(242, 138, 45, 0.28);
}

.radio-disc__grooves {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background:
    repeating-radial-gradient(
      circle at center,
      rgba(255, 255, 255, 0.028) 0 0.35px,
      transparent 0.35px 2.6px
    ),
    radial-gradient(circle at 36% 28%, rgba(255, 255, 255, 0.09), transparent 42%),
    radial-gradient(circle at 68% 78%, rgba(255, 255, 255, 0.03), transparent 36%),
    linear-gradient(145deg, #17171a 0%, #0b0b0d 52%, #050506 100%);
  opacity: 0.96;
}

.radio-disc__rim {
  position: absolute;
  inset: 1.5%;
  border-radius: 50%;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.08),
    inset 0 0 0 3px rgba(0, 0, 0, 0.45);
  pointer-events: none;
}

.radio-disc__label-paper {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 2;
  width: 44%;
  height: 44%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background:
    radial-gradient(circle at 38% 32%, #f6e8c9 0%, #d4b56a 48%, #a8843f 100%);
  box-shadow:
    inset 0 0 0 1px rgba(0, 0, 0, 0.18),
    inset 0 2px 8px rgba(255, 255, 255, 0.22),
    0 1px 4px rgba(0, 0, 0, 0.35);
  -webkit-mask: radial-gradient(circle, transparent 0 17%, #000 18% 100%);
  mask: radial-gradient(circle, transparent 0 17%, #000 18% 100%);
}

.radio-disc--nav .radio-disc__label-paper {
  width: 50%;
  height: 50%;
  -webkit-mask: radial-gradient(circle, transparent 0 19%, #000 20% 100%);
  mask: radial-gradient(circle, transparent 0 19%, #000 20% 100%);
}

.radio-disc__spindle {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 3;
  width: 6.2%;
  height: 6.2%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #2a2927, #070706 70%);
  box-shadow:
    inset 0 1px 3px rgba(0, 0, 0, 0.85),
    0 0 0 1px rgba(255, 255, 255, 0.06);
}

.radio-disc--nav .radio-disc__spindle {
  width: 8%;
  height: 8%;
}

.radio-disc__waves {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  pointer-events: none;
  overflow: visible;
}

.radio-disc__wave {
  position: absolute;
  inset: -2%;
  border-radius: 50%;
  border: 1px solid rgba(242, 138, 45, 0.22);
  opacity: 0;
  transform: scale(1);
}

.radio-disc.is-playing .radio-disc__wave {
  animation: radio-disc-wave 5.2s ease-in-out infinite;
}

.radio-disc.is-playing .radio-disc__wave:nth-child(2) {
  animation-delay: 1.75s;
}

.radio-disc.is-playing .radio-disc__wave:nth-child(3) {
  animation-delay: 3.5s;
}

.radio-disc--nav.is-playing .radio-disc__wave {
  animation-name: radio-disc-wave-sm;
}

@keyframes radio-disc-wave {
  0% { transform: scale(1); opacity: 0.28; }
  70% { opacity: 0.08; }
  100% { transform: scale(1.55); opacity: 0; }
}

@keyframes radio-disc-wave-sm {
  0% { transform: scale(1); opacity: 0.24; }
  70% { opacity: 0.06; }
  100% { transform: scale(1.42); opacity: 0; }
}

.radio-disc__label {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

.radio-disc__label-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.radio-disc__arc-text {
  fill: #241c0e;
  font-family: Oswald, sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.radio-disc__arc-text--hint {
  fill: #5c4518;
  font-family: var(--mono);
  font-weight: 500;
  letter-spacing: 0.22em;
}

.radio-disc--hero .radio-disc__arc-text--title {
  font-size: 8.6px;
  letter-spacing: 0.03em;
}

.radio-disc--hero .radio-disc__arc-text--hint {
  font-size: 6.5px;
}

.radio-disc--float .radio-disc__arc-text--title {
  font-size: 6.8px;
  letter-spacing: 0.02em;
}

.radio-disc--float .radio-disc__arc-text--hint {
  font-size: 5.5px;
  letter-spacing: 0.18em;
}

.radio-disc__label-flat {
  position: absolute;
  left: 50%;
  top: 27%;
  transform: translate(-50%, -50%);
  font-family: Oswald, sans-serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 1;
  color: #241c0e;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.radio-disc--nav .radio-disc__label-flat {
  font-size: 11px;
  top: 26%;
}

.radio-disc__hint {
  position: absolute;
  left: 50%;
  bottom: 12%;
  transform: translateX(-50%);
  font-family: var(--mono);
  font-size: clamp(5px, 10%, 7px);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #5c4518;
  opacity: 0.92;
  white-space: nowrap;
}

.radio-disc--nav .radio-disc__hint {
  display: none;
}

.radio-disc.is-playing .radio-disc__hint,
.radio-disc.is-playing .radio-disc__arc-text--hint {
  animation: radio-disc-live 2.4s ease-in-out infinite;
  color: #6a5020;
}

@keyframes radio-disc-live {
  0%, 100% { opacity: 0.72; }
  50% { opacity: 0.92; }
}

@media (max-width: 860px) {
  /* на мобилке радио — через страницу/слот в навбаре, не поверх кнопок поста */
  .radio-disc--float {
    display: none !important;
  }

  .nav-radio-slot.is-measuring,
  .nav-radio-slot.is-active {
    width: 40px;
  }

  .radio-disc--nav {
    width: 40px;
    height: 40px;
  }
}

html.no-anim { scroll-behavior: auto; }
html.no-anim *, html.no-anim *::before, html.no-anim *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
html.no-anim .turntable__tonearm {
    transition-duration: 1.35s !important;
  }

/* -- Beta feedback chip (как ГранаСкоп) -------------------------------- */
.gdz-beta-chip {
  position: fixed;
  top: calc(var(--nav-h) + var(--gdz-safe-top) + var(--gdz-install-bar-h, 0px) + 8px);
  left: max(10px, env(safe-area-inset-left, 0px));
  z-index: 250;
  min-height: 28px;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid var(--mg-border);
  background: rgba(7, 7, 6, 0.82);
  color: var(--mg-amber);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35);
}
.gdz-beta-chip:hover {
  border-color: var(--mg-amber);
  color: var(--mg-amber-lite);
}
/* компьютер: BETA — вкладка у правого края, как на телефоне, чтобы не закрывать меню */
@media (min-width: 861px) {
  .gdz-beta-chip {
    top: auto;
    left: auto;
    right: 0;
    bottom: 120px;
    min-height: 0;
    padding: 10px 5px;
    border-left: 0;
    border-radius: 0 10px 10px 0;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
  }
}
.gdz-beta-sheet {
  position: fixed;
  inset: 0;
  z-index: 1350;
  display: grid;
  place-items: end center;
  padding: 16px;
  padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  background: rgba(0, 0, 0, 0.62);
}
.gdz-beta-sheet[hidden] { display: none !important; }
.gdz-beta-card {
  width: min(480px, 100%);
  max-height: min(80vh, 640px);
  overflow: auto;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid var(--mg-border);
  background: #15120f;
  box-shadow: var(--mg-glow);
  color: var(--mg-ivory);
}
.gdz-beta-card header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
}
.gdz-beta-card h2 {
  margin: 0;
  font: 700 1.15rem/1.1 var(--display);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--mg-hi);
}
.gdz-beta-x {
  width: 36px;
  height: 36px;
  border: none;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.06);
  color: var(--mg-muted);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.gdz-beta-x:hover { color: var(--mg-ivory); background: rgba(212, 161, 75, 0.12); }
.gdz-beta-card > p {
  color: var(--mg-muted);
  font-size: 0.92rem;
  line-height: 1.45;
  margin: 0 0 12px;
}
.gdz-beta-card label {
  display: block;
  margin: 10px 0 6px;
  color: var(--mg-amber);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.gdz-beta-card textarea,
.gdz-beta-card input {
  width: 100%;
  box-sizing: border-box;
  padding: 12px;
  border-radius: 10px;
  border: 1px solid var(--mg-border);
  background: rgba(7, 7, 6, 0.75);
  color: var(--mg-ivory);
  font-size: 16px;
  resize: vertical;
}
.gdz-beta-send {
  width: 100%;
  margin-top: 14px;
  min-height: 44px;
}
.gdz-beta-copied {
  margin: 10px 0 0;
  font-size: 12px;
  color: var(--mg-amber-lite);
  font-weight: 600;
}
.gdz-beta-link {
  display: block;
  margin-top: 12px;
  text-align: center;
  font-size: 12px;
  color: var(--mg-amber);
  text-decoration: underline;
}
.gdz-beta-alt {
  margin: 12px 0 0;
  text-align: center;
  font-size: 13px;
  color: var(--mg-muted);
}
.gdz-beta-alt .gdz-beta-link {
  display: inline;
  margin: 0;
  font-size: 13px;
}
@media (max-width: 860px) {
  .gdz-beta-chip {
    top: auto;
    left: auto;
    right: 0;
    bottom: calc(96px + env(safe-area-inset-bottom, 0px));
    min-height: 0;
    padding: 10px 4px;
    border-left: 0;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    border-radius: 0 10px 10px 0;
    font-size: 9px;
  }
}

/* -- PWA install banner (mobile) --------------------------------------- */
.gdz-install-banner {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: calc(var(--gdz-safe-top) + 8px) 12px 10px;
  border-radius: 0 0 14px 14px;
  background: linear-gradient(135deg, rgba(18, 14, 10, 0.98), rgba(7, 7, 6, 0.99));
  border: 1px solid rgba(242, 138, 45, 0.35);
  border-top: none;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
.gdz-install-banner__icon {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  object-fit: cover;
  flex-shrink: 0;
  box-shadow: 0 0 0 1px rgba(242, 138, 45, 0.35), 0 0 14px rgba(242, 138, 45, 0.3);
}
.gdz-install-banner__text {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 12px;
  line-height: 1.3;
  color: var(--mg-muted);
}
.gdz-install-banner__text strong {
  color: var(--mg-hi);
  font-size: 13px;
  font-family: var(--display);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.gdz-install-banner__btn {
  flex-shrink: 0;
  border: none;
  border-radius: 999px;
  padding: 8px 12px;
  font: 700 12px/1 var(--display);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--mg-ink);
  background: var(--grad-cta);
  box-shadow: var(--mg-glow);
}
.gdz-install-banner__close {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border: none;
  border-radius: 10px;
  background: transparent;
  color: var(--mg-muted);
  font-size: 22px;
  line-height: 1;
}
.gdz-install-banner__close:hover { color: var(--mg-ivory); background: rgba(212,161,75,.08); }

.gdz-install-mini {
  position: fixed;
  top: calc(var(--nav-h) + var(--gdz-safe-top) + 6px);
  left: 50%;
  transform: translateX(-50%);
  z-index: 980;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: calc(100vw - 24px);
  min-height: 40px;
  padding: 6px 12px 6px 6px;
  border: 1px solid rgba(242, 138, 45, 0.55);
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(28, 20, 12, 0.96), rgba(10, 9, 8, 0.98));
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(242, 138, 45, 0.15), 0 0 18px rgba(242, 138, 45, 0.22);
  color: var(--mg-hi);
  font: 700 12px/1.1 var(--display);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  cursor: pointer;
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}
.gdz-install-mini:hover,
.gdz-install-mini:focus-visible {
  border-color: rgba(242, 138, 45, 0.85);
  color: var(--mg-ivory);
  outline: none;
}
.gdz-install-mini__icon {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  object-fit: cover;
  flex-shrink: 0;
  box-shadow: 0 0 0 1px rgba(242, 138, 45, 0.35);
}
.gdz-install-mini span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.gdz-install-mini svg {
  flex-shrink: 0;
  opacity: 0.85;
}

.gdz-ios-sheet {
  position: fixed;
  inset: 0;
  z-index: 1300;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 16px;
  padding-bottom: calc(16px + var(--gdz-safe-bottom));
  background: rgba(0, 0, 0, 0.55);
}
.gdz-ios-sheet__card {
  position: relative;
  width: min(420px, 100%);
  border-radius: 18px;
  padding: 20px 18px 18px;
  background: linear-gradient(160deg, rgba(23, 19, 14, 0.98), rgba(10, 9, 8, 0.98));
  border: 1px solid var(--mg-border);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.55), var(--mg-glow);
}
.gdz-ios-sheet__close {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 36px;
  height: 36px;
  border: none;
  border-radius: 10px;
  background: transparent;
  color: var(--mg-muted);
  font-size: 22px;
}
.gdz-ios-sheet__card h3 {
  margin: 0 0 12px;
  font: 700 1.25rem/1 var(--display);
  text-transform: uppercase;
  color: var(--mg-hi);
}
.gdz-ios-sheet__steps {
  margin: 0 0 12px;
  padding-left: 20px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--mg-copy);
}
.gdz-ios-sheet__steps li { margin-bottom: 8px; }
.gdz-ios-sheet__note {
  margin: 0 0 14px;
  font-size: 12px;
  color: var(--mg-muted);
}
.gdz-ios-sheet__ok {
  width: 100%;
  min-height: 44px;
  border: none;
  border-radius: 12px;
  font: 700 13px/1 var(--display);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mg-ink);
  background: var(--grad-cta);
}

.gdz-auth-download {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin: 0 0 16px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(16, 14, 11, 0.9);
  border: 1px solid rgba(242, 138, 45, 0.3);
}
.gdz-auth-download img {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  flex-shrink: 0;
}
.gdz-auth-download__text {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 12px;
  line-height: 1.35;
  color: var(--mg-muted);
}
.gdz-auth-download__text strong {
  color: var(--mg-hi);
  font-size: 13px;
}
.gdz-auth-download__btn {
  flex-shrink: 0;
  border: none;
  border-radius: 999px;
  padding: 8px 14px;
  font: 800 12px/1 var(--display);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--mg-ink);
  background: var(--grad-cta);
}

@media (min-width: 861px) {
  .gdz-install-banner { display: none !important; }
  .gdz-install-mini { display: none !important; }
  html.gdz-has-install-bar .shell { padding-top: 0; }
}

html.gdz-standalone .gdz-install-banner { display: none !important; }
html.gdz-standalone .gdz-install-mini { display: none !important; }

/* ── Channel media + article editor ─────────────────────────────────── */
.channel-cover--photo {
  background-size: cover;
  background-position: center;
  background-color: #0d0b08;
}
.channel-cover--photo::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 46%;
  background: linear-gradient(transparent, rgba(7, 7, 6, 0.78));
  pointer-events: none;
}
.channel-cover .cover { width: 100%; height: 100%; min-height: 180px; }
.channel-live-preview {
  margin-bottom: 18px;
  padding: 12px;
  border: 1px solid var(--mg-border);
  border-radius: 16px;
  background: rgba(16, 14, 11, 0.7);
}
.channel-live-preview .channel-cover { height: 120px; margin-bottom: 0; aspect-ratio: auto; }
.channel-live-preview .channel-cover__title { display: none; }
.channel-live-preview__row {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: -36px;
  padding: 0 8px 4px;
  position: relative;
}
.form-grid--wide { max-width: 720px; }
.media-field { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
.media-drop {
  border: 1px dashed rgba(212, 161, 75, 0.45);
  border-radius: 14px;
  background: rgba(7, 7, 6, 0.55);
  cursor: pointer;
  transition: border-color .2s, box-shadow .2s, background .2s;
}
.media-drop:hover, .media-drop.is-drag {
  border-color: var(--mg-amber);
  box-shadow: var(--mg-glow);
  background: rgba(242, 138, 45, 0.06);
}
.media-drop.is-need {
  border-color: var(--mg-amber) !important;
  box-shadow: 0 0 0 2px rgba(242, 138, 45, 0.35), var(--mg-glow);
  animation: gdz-need-pulse 1.1s ease-in-out 2;
}
@keyframes gdz-need-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.01); }
}
.media-drop__preview {
  position: relative;
  min-height: 120px;
  display: grid;
  place-items: center;
  padding: 16px;
  color: var(--mg-muted);
  font-size: 13px;
  text-align: center;
  background-size: cover;
  background-position: center;
  border-radius: 14px;
  overflow: hidden;
}
.media-drop__preview::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
  pointer-events: none;
}
.media-drop__preview--round {
  width: 120px;
  height: 120px;
  min-height: 120px;
  margin: 12px auto;
  border-radius: 50%;
  border: 2px solid rgba(242, 138, 45, 0.35);
}
.media-drop__preview--banner { width: 100%; min-height: 140px; aspect-ratio: 16 / 4; }
.media-drop__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.avatar[style*="background-image"] {
  background-color: #1a140e;
}

body.gdz-crop-open { overflow: hidden; }
.img-crop {
  position: fixed;
  inset: 0;
  z-index: 12000;
  display: grid;
  place-items: center;
  padding: 16px;
  background: rgba(0, 0, 0, 0.72);
}
.img-crop__card {
  width: min(560px, 100%);
  border: 1px solid rgba(212, 161, 75, 0.35);
  border-radius: 16px;
  background: linear-gradient(160deg, rgba(23, 19, 14, 0.98), rgba(10, 9, 8, 0.99));
  padding: 16px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
}
.img-crop__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.img-crop__title {
  font: 700 1rem/1.2 var(--display);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--mg-hi);
}
.img-crop__hint {
  margin: 6px 0 0;
  color: var(--mg-muted);
  font-size: 13px;
  line-height: 1.4;
}
.img-crop__x {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  border: 1px solid rgba(212, 161, 75, 0.25);
  background: rgba(7, 7, 6, 0.55);
  color: var(--mg-ivory);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.img-crop__stage {
  display: flex;
  justify-content: center;
  margin: 0 0 14px;
  padding: 8px 0 12px;
  overflow: visible;
}
.img-crop__viewport {
  position: relative;
  overflow: hidden;
  background: #0a0908;
  border: 1px solid rgba(212, 161, 75, 0.35);
  touch-action: none;
  user-select: none;
  cursor: grab;
}
.img-crop__viewport:active { cursor: grabbing; }
.img-crop__viewport--round {
  width: min(300px, 72vw);
  height: min(300px, 72vw);
  border-radius: 50%;
}
.img-crop__viewport--banner {
  width: 100%;
  aspect-ratio: 16 / 4;
  border-radius: 12px;
}
.img-crop__viewport--cover {
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 12px;
}
.img-crop__viewport--inline {
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: 12px;
}
.img-crop__canvas {
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.img-crop__hit {
  position: absolute;
  inset: 0;
  z-index: 2;
  cursor: grab;
  background: transparent;
}
.img-crop__hit:active { cursor: grabbing; }
.gdz-redirect__card { max-width: 480px; }
.gdz-redirect__link {
  display: block;
  margin: 4px 0 16px;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid rgba(242, 138, 45, 0.45);
  background: rgba(242, 138, 45, 0.1);
  color: var(--mg-hi);
  font: 700 1.15rem/1.35 var(--display);
  letter-spacing: 0.02em;
  text-align: center;
  text-decoration: none;
  word-break: break-all;
}
.gdz-redirect__link:hover {
  border-color: var(--mg-amber);
  background: rgba(242, 138, 45, 0.18);
}
.gdz-redirect__actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 4px;
}
.gdz-redirect__actions .btn {
  width: 100%;
  justify-content: center;
  text-align: center;
  text-decoration: none;
}
.img-crop__zoom {
  display: grid;
  gap: 8px;
  margin-bottom: 14px;
  color: var(--mg-copy);
  font-size: 13px;
}
.img-crop__zoom input[type="range"] {
  width: 100%;
  accent-color: var(--mg-amber);
}
.img-crop__actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.post-figure {
  margin: 1.25em 0;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--mg-border);
  position: relative;
  z-index: 2;
}
.post-figure img {
  display: block;
  width: 100%;
  height: auto;
}
.post-figure--left,
.editor-figure--left {
  float: left !important;
  display: block !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  width: 46%;
  max-width: 420px;
  margin: 0.35em 1em 0.8em 0 !important;
  clear: left;
  z-index: 2;
  opacity: 1 !important;
  pointer-events: auto !important;
}
.post-figure--right,
.editor-figure--right {
  float: right !important;
  display: block !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  width: 46%;
  max-width: 420px;
  margin: 0.35em 0 0.8em 1em !important;
  clear: right;
  z-index: 2;
  opacity: 1 !important;
  pointer-events: auto !important;
}
.post-figure--center,
.editor-figure--center {
  float: none !important;
  display: block !important;
  clear: both !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  margin: 1em auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  z-index: 2;
  opacity: 1 !important;
  pointer-events: auto !important;
}
.post-figure--center.post-figure--size-s,
.editor-figure--center.editor-figure--size-s { width: 28% !important; max-width: 220px; }
.post-figure--center.post-figure--size-m,
.editor-figure--center.editor-figure--size-m { width: 42% !important; max-width: 340px; }
.post-figure--center.post-figure--size-l,
.editor-figure--center.editor-figure--size-l { width: 62% !important; max-width: 520px; }
.post-figure--center.post-figure--size-full,
.editor-figure--center.editor-figure--size-full {
  width: 100% !important;
  max-width: none;
}
.post-figure--full,
.editor-figure--full,
.post-figure--full.post-figure--size-s,
.editor-figure--full.editor-figure--size-s,
.post-figure--full.post-figure--size-m,
.editor-figure--full.editor-figure--size-m,
.post-figure--full.post-figure--size-l,
.editor-figure--full.editor-figure--size-l,
.post-figure--full.post-figure--size-full,
.editor-figure--full.editor-figure--size-full {
  float: none !important;
  display: block !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  width: 100% !important;
  max-width: none;
  margin: 1em 0 !important;
  clear: both !important;
  z-index: 2;
  opacity: 1 !important;
  pointer-events: auto !important;
}
.post-figure--inline,
.editor-figure--inline {
  float: none !important;
  display: block !important;
  clear: both !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  margin: 1em auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  z-index: 2;
  opacity: 1 !important;
  pointer-events: auto !important;
}
.post-figure--behind,
.editor-figure--behind {
  position: absolute !important;
  left: 4% !important;
  right: 4% !important;
  width: auto !important;
  max-width: none;
  float: none !important;
  z-index: 0 !important;
  opacity: 0.92;
  margin: 0 !important;
  pointer-events: auto;
}
.post-figure--front,
.editor-figure--front {
  position: absolute !important;
  left: 8% !important;
  right: 8% !important;
  width: auto !important;
  max-width: none;
  float: none !important;
  z-index: 3 !important;
  margin: 0 !important;
  opacity: 1 !important;
}
.post-figure--size-s,
.editor-figure--size-s { width: 28%; max-width: 220px; }
.post-figure--size-m,
.editor-figure--size-m { width: 42%; max-width: 340px; }
.post-figure--size-l,
.editor-figure--size-l { width: 62%; max-width: 520px; }
.post-figure--size-full,
.editor-figure--size-full {
  width: 100%;
  max-width: none;
}
.post-figure--inline.post-figure--size-full,
.editor-figure--inline.editor-figure--size-full,
.post-figure--center.post-figure--size-full,
.editor-figure--center.editor-figure--size-full {
  width: 100% !important;
  max-width: none;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.post-figure--behind.post-figure--size-full,
.editor-figure--behind.editor-figure--size-full,
.post-figure--front.post-figure--size-full,
.editor-figure--front.editor-figure--size-full {
  left: 0 !important;
  right: 0 !important;
  width: auto !important;
}

body.gdz-editor-open { overflow: hidden; }
#article-editor-root {
  position: fixed;
  inset: 0;
  z-index: 900;
}
.article-editor {
  height: 100%;
  background: rgba(7, 7, 6, 0.98);
}
.article-editor__form {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 100dvh;
}
.article-editor__top {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  flex-shrink: 0;
  padding: 10px 14px;
  padding-top: calc(10px + env(safe-area-inset-top, 0px));
  border-bottom: 1px solid var(--mg-border);
  background: rgba(10, 9, 8, 0.96);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
.article-editor__top-title {
  flex: 1;
  font: 700 13px/1 var(--display);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mg-gold);
}
.article-editor__top-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.article-editor__body {
  flex: 1;
  display: grid;
  grid-template-columns: minmax(300px, 340px) minmax(0, 1fr);
  min-height: 0;
}
.article-editor__side {
  border-right: 1px solid var(--mg-border);
  background: rgba(16, 14, 11, 0.96);
  overflow: auto;
  padding: 12px 14px 24px;
}
.article-editor__side.is-collapsed .article-editor__side-panel { display: none; }
.article-editor__side-toggle {
  width: 100%;
  margin-bottom: 12px;
  min-height: 40px;
  border-radius: 10px;
  border: 1px solid var(--mg-border);
  color: var(--mg-ivory);
  background: rgba(7, 7, 6, 0.55);
  font: 600 11px/1 var(--display);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
}
.article-editor__side-panel { display: grid; gap: 16px; }
.article-editor__side-block {
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(212, 161, 75, 0.2);
  background: rgba(7, 7, 6, 0.45);
}
.article-editor__side-block--tip {
  border-style: dashed;
  background: rgba(242, 138, 45, 0.05);
}
.article-editor__side-h {
  font: 700 12px/1.2 var(--display);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--mg-hi);
  margin-bottom: 8px;
}
.article-editor__side-note {
  margin: 0 0 10px;
  font-size: 12px;
  line-height: 1.4;
  color: var(--mg-muted);
}
.article-editor__side-select {
  width: 100%;
  min-height: 44px;
  border-radius: 10px;
  border: 1px solid rgba(212, 161, 75, 0.3);
  background: rgba(7, 7, 6, 0.75);
  color: var(--mg-ivory);
  font: 500 14px/1.3 var(--body);
  padding: 0 12px;
}
.editor-topic-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-height: min(42vh, 360px);
  overflow-y: auto;
  padding-right: 4px;
}
.editor-topic {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  width: 100%;
  margin: 0;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(212, 161, 75, 0.22);
  background: rgba(16, 14, 11, 0.75);
  color: var(--mg-ivory);
  cursor: pointer;
  transition: border-color .15s, background .15s;
}
.editor-topic input {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin: 2px 0 0;
  accent-color: var(--mg-amber);
}
.editor-topic__text {
  flex: 1;
  min-width: 0;
  font: 500 14px/1.35 var(--body);
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.editor-topic.is-on {
  border-color: var(--mg-amber);
  background: rgba(242, 138, 45, 0.14);
  box-shadow: inset 0 0 0 1px rgba(242, 138, 45, 0.25);
}
.editor-topic.is-on .editor-topic__text {
  color: var(--mg-hi);
  font-weight: 600;
}
.article-editor__side .media-drop__preview--banner {
  min-height: 96px;
  aspect-ratio: auto;
}
.article-editor__canvas-wrap {
  overflow: auto;
  min-width: 0;
  padding: 18px 16px 48px;
  background:
    radial-gradient(circle at 80% 0%, rgba(242, 138, 45, 0.08), transparent 40%),
    #070706;
}
.article-editor__canvas {
  max-width: 780px;
  width: 100%;
  margin: 0 auto;
  min-width: 0;
}
.article-editor__title {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  border: 0;
  background: transparent;
  color: var(--mg-hi);
  font: 700 clamp(1.6rem, 3.6vw, 2.6rem)/1.2 var(--display);
  letter-spacing: -0.02em;
  text-transform: none;
  margin-bottom: 12px;
  outline: none;
  overflow-wrap: break-word;
  word-break: normal;
  white-space: pre-wrap;
  resize: vertical;
  min-height: 2.4em;
  max-height: 8em;
}
.article-editor__title::placeholder {
  color: rgba(246, 230, 197, 0.35);
  text-transform: none;
}
.article-editor__excerpt {
  width: 100%;
  min-height: 64px;
  margin-bottom: 18px;
  border: 1px solid rgba(212, 161, 75, 0.22);
  border-radius: 12px;
  background: rgba(16, 14, 11, 0.65);
  color: var(--mg-copy);
  padding: 12px 14px;
  resize: vertical;
}
.article-editor__content {
  position: relative;
  min-width: 0;
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
  min-height: min(62dvh, 640px);
  padding: 18px 16px 40px;
  color: var(--mg-ivory);
  font: 17px/1.65 var(--body);
  outline: none;
  border-radius: 12px;
  border: 1px solid rgba(212, 161, 75, 0.38);
  background: rgba(16, 14, 11, 0.72);
  box-shadow: inset 0 0 0 1px rgba(242, 138, 45, 0.08);
  overflow-x: hidden;
  overflow-wrap: break-word;
  word-break: normal;
  /* normal + nbsp из JS: без «дыр» от pre-wrap и без склейки слов */
  white-space: normal;
  text-align: left;
  line-break: auto;
}
.article-editor__content::after {
  content: "";
  display: table;
  clear: both;
}
.mod-list {
  display: grid;
  gap: 12px;
}
.mod-card {
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid rgba(212, 161, 75, 0.28);
  background: rgba(16, 14, 11, 0.72);
}
.mod-card__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.mod-card__status {
  font-size: 12px;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.12);
}
.mod-card__status--open {
  color: #f8b45a;
  border-color: rgba(242, 138, 45, 0.45);
}
.mod-card__status--confirmed {
  color: #e85d5d;
}
.mod-card__status--dismissed {
  color: #8dcf8a;
}
.mod-card__reasons {
  margin: 0;
  padding-left: 1.2em;
  color: var(--mg-copy);
  font-size: 14px;
  line-height: 1.45;
}
.mod-card__meta {
  margin-top: 10px;
  font-size: 12px;
}
.mod-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.article-editor__charcount {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin-top: 10px;
  padding: 0 2px;
  font: 500 12px/1.35 var(--body);
  color: rgba(232, 214, 180, 0.72);
  letter-spacing: 0.02em;
}
.article-editor__stat span[data-stat-symbols],
.article-editor__stat span[data-stat-spaces],
.article-editor__stat span[data-stat-punct],
.article-editor__stat span[data-stat-total] {
  color: var(--mg-ivory);
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  margin-right: 4px;
}
.article-editor__stat--total {
  color: rgba(246, 230, 197, 0.88);
}
.article-editor__charcount.is-warn {
  color: #d4a14b;
}
.article-editor__charcount.is-over {
  color: #e85d5d;
  font-weight: 700;
}
.article-editor__spell-status {
  font: 500 12px/1.3 var(--body);
  color: rgba(232, 214, 180, 0.72);
  max-width: 14em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.article-editor__tool[data-spell-toggle].is-on {
  border-color: rgba(242, 138, 45, 0.7);
  color: var(--mg-hi);
  background: rgba(242, 138, 45, 0.14);
}
::highlight(gdz-spell) {
  text-decoration-line: underline;
  text-decoration-style: wavy;
  text-decoration-color: #ff3b30;
  background-color: rgba(255, 59, 48, 0.14);
}
span.gdz-spell-err {
  text-decoration-line: underline;
  text-decoration-style: wavy;
  text-decoration-thickness: 2px;
  text-decoration-color: #ff3b30;
  text-underline-offset: 3px;
  background: rgba(255, 59, 48, 0.12);
  border-radius: 2px;
  cursor: context-menu;
  color: inherit;
  font: inherit;
}
.gdz-spell-pop {
  position: fixed;
  z-index: 10050;
  min-width: 200px;
  max-width: min(300px, calc(100vw - 16px));
  padding: 10px;
  border-radius: 12px;
  border: 1px solid rgba(255, 59, 48, 0.45);
  background: #14110d;
  box-shadow: 0 14px 44px rgba(0, 0, 0, 0.6);
  display: grid;
  gap: 4px;
}
.gdz-spell-pop[hidden] { display: none !important; }
.gdz-spell-pop__label {
  font: 600 11px/1.2 var(--body);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255, 140, 130, 0.85);
  padding: 4px 6px 0;
}
.gdz-spell-pop__word {
  font: 700 15px/1.3 var(--body);
  color: #ff8a80;
  padding: 2px 6px 8px;
}
.gdz-spell-pop__empty {
  font: 13px/1.35 var(--body);
  color: rgba(232, 214, 180, 0.55);
  padding: 6px;
}
.gdz-spell-pop__item {
  appearance: none;
  border: 1px solid rgba(212, 161, 75, 0.22);
  background: rgba(255, 255, 255, 0.03);
  color: var(--mg-ivory);
  border-radius: 8px;
  padding: 8px 10px;
  text-align: left;
  font: 500 14px/1.3 var(--body);
  cursor: pointer;
}
.gdz-spell-pop__item:hover {
  border-color: rgba(242, 138, 45, 0.65);
  background: rgba(242, 138, 45, 0.12);
}
.gdz-spell-pop__item--mute {
  margin-top: 6px;
  font-size: 12px;
  color: rgba(232, 214, 180, 0.78);
}
.article-editor__content:focus {
  border-color: rgba(242, 138, 45, 0.72);
  box-shadow:
    inset 0 0 0 1px rgba(242, 138, 45, 0.18),
    0 0 0 3px rgba(242, 138, 45, 0.12);
}
.article-editor__content.is-drag {
  border-color: var(--mg-amber);
  box-shadow: inset 0 0 0 2px rgba(242, 138, 45, 0.55);
  background: rgba(242, 138, 45, 0.05);
}
.article-editor__content:empty::before,
.article-editor__content[data-placeholder]:not(:focus):has(> p:only-child:empty)::before,
.article-editor__content[data-placeholder]:not(:focus):has(> p:only-child > br:only-child)::before {
  content: attr(data-placeholder);
  display: block;
  white-space: pre-line;
  color: rgba(232, 214, 180, 0.72);
  font: 16px/1.55 var(--body);
  max-width: 36em;
  pointer-events: none;
}
.article-editor__content p { margin: 0 0 0.9em; }
.article-editor__content > p,
.article-editor__content > h1,
.article-editor__content > h2,
.article-editor__content > h3,
.article-editor__content > h4,
.article-editor__content > ul,
.article-editor__content > ol,
.article-editor__content > blockquote,
.article-editor__content > div {
  max-width: 100%;
  min-width: 0;
  overflow-wrap: break-word;
  word-break: normal;
  white-space: normal;
  text-indent: 0;
  padding-left: 0;
}
/* Текст поверх фото только для режима «Под текстом» */
.article-editor__content .editor-figure--behind ~ p,
.article-editor__content .editor-figure--behind ~ h1,
.article-editor__content .editor-figure--behind ~ h2,
.article-editor__content .editor-figure--behind ~ h3,
.article-editor__content .editor-figure--behind ~ h4,
.article-editor__content .editor-figure--behind ~ ul,
.article-editor__content .editor-figure--behind ~ ol,
.article-editor__content .editor-figure--behind ~ blockquote,
.article-editor__content .editor-figure--behind ~ div,
.post-body .post-figure--behind ~ p,
.post-body .post-figure--behind ~ h1,
.post-body .post-figure--behind ~ h2,
.post-body .post-figure--behind ~ h3,
.post-body .post-figure--behind ~ h4,
.post-rich .post-figure--behind ~ p {
  position: relative;
  z-index: 1;
}
.article-editor__content span,
.article-editor__content font,
.article-editor__content b,
.article-editor__content i,
.article-editor__content u,
.article-editor__content s,
.article-editor__content a {
  white-space: normal;
  overflow-wrap: break-word;
  word-break: normal;
}
.editor-figure {
  margin: 1em 0;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--mg-border);
  cursor: pointer;
  transition: box-shadow .15s, outline-color .15s;
  position: relative;
  z-index: 2;
}
.editor-figure img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 70vh;
  object-fit: contain;
  background: #0a0908;
}
.editor-figure.is-selected {
  outline: 2px solid var(--mg-amber);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(242, 138, 45, 0.2);
  z-index: 4;
}
.editor-figure--behind.is-selected,
.editor-figure--front.is-selected {
  z-index: 5;
}
.post-body,
.article-body,
.post-rich {
  position: relative;
  isolation: isolate;
}
.post-body > p,
.article-body > p,
.post-rich > p {
  position: static;
  z-index: auto;
}

@media (max-width: 900px) {
  .article-editor__body { grid-template-columns: 1fr; }
  .article-editor__side {
    border-right: 0;
    border-bottom: 1px solid var(--mg-border);
    max-height: 38vh;
  }
  .article-editor__top-title { display: none; }
  .article-editor__content { min-height: 48dvh; font-size: 16px; }
  .article-editor__ribbon { border-radius: 10px; }
  .article-editor__tabs {
    overflow-x: auto;
    scrollbar-width: none;
  }
  .article-editor__tabs::-webkit-scrollbar { display: none; }
  .article-editor__panel {
    flex-wrap: wrap;
    gap: 6px;
  }
  .article-editor__select { max-width: 100%; }
}

.post-heading {
  margin: 1.4em 0 0.55em;
  font: 700 clamp(1.25rem, 2.4vw, 1.7rem)/1.15 var(--display);
  letter-spacing: -0.01em;
  color: var(--mg-hi);
}
.post-content h1.post-heading,
.post-rich h1,
.article-body h1 { font-size: clamp(1.55rem, 3vw, 2rem); }
.post-content h2.post-heading,
.post-rich h2,
.article-body h2 { font-size: clamp(1.3rem, 2.6vw, 1.65rem); }
.post-content h3.post-heading,
.post-rich h3,
.article-body h3 { font-size: clamp(1.15rem, 2.2vw, 1.35rem); }
.post-content h4.post-heading,
.post-rich h4,
.article-body h4 { font-size: 1.08rem; color: var(--mg-ivory); }
.post-content blockquote,
.post-rich blockquote,
.article-body blockquote {
  margin: 1em 0;
  padding: 10px 14px;
  border-left: 3px solid var(--mg-amber);
  background: rgba(242, 138, 45, 0.08);
  color: var(--mg-copy);
  border-radius: 0 10px 10px 0;
}
.article-editor__toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin: 0 0 10px;
  padding: 8px;
  border: 1px solid var(--mg-border);
  border-radius: 12px;
  background: rgba(16, 14, 11, 0.85);
}
.article-editor__tool {
  min-height: 36px;
  min-width: 36px;
  padding: 0 10px;
  border-radius: 9px;
  border: 1px solid rgba(212, 161, 75, 0.28);
  background: rgba(7, 7, 6, 0.7);
  color: var(--mg-ivory);
  font: 700 12px/1 var(--display);
  cursor: pointer;
}
.article-editor__tool:hover {
  border-color: var(--mg-amber);
  box-shadow: var(--mg-glow);
}
.article-editor__tool--photo {
  background: linear-gradient(135deg, #f28a2d, #d4a14b);
  color: #120e0a;
  border-color: transparent;
}
.article-editor__toolbar-sep {
  width: 1px;
  height: 22px;
  background: rgba(212, 161, 75, 0.28);
  margin: 0 4px;
}
.article-editor__dropstrip {
  margin: 0 0 12px;
  padding: 12px 14px;
  border: 1px dashed rgba(242, 138, 45, 0.55);
  border-radius: 12px;
  color: var(--mg-muted);
  font-size: 13px;
  text-align: center;
  cursor: pointer;
  background: rgba(242, 138, 45, 0.04);
}
.article-editor__dropstrip.is-drag,
.article-editor__content.is-drag {
  border-color: var(--mg-amber);
  box-shadow: inset 0 0 0 2px rgba(242, 138, 45, 0.45);
  background: rgba(242, 138, 45, 0.08);
  color: var(--mg-ivory);
}
.article-editor__content h1,
.article-editor__content h2,
.article-editor__content h3,
.article-editor__content h4 {
  margin: 1.05em 0 0.4em;
  font-family: var(--display);
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--mg-hi);
  line-height: 1.15;
}
.article-editor__content h1 { font-size: 2rem; }
.article-editor__content h2 { font-size: 1.55rem; }
.article-editor__content h3 { font-size: 1.3rem; }
.article-editor__content h4 { font-size: 1.12rem; color: var(--mg-ivory); }
.article-editor__content blockquote {
  margin: 1em 0;
  padding: 10px 14px;
  border-left: 3px solid var(--mg-amber);
  background: rgba(242, 138, 45, 0.08);
  color: var(--mg-copy);
  border-radius: 0 10px 10px 0;
}

/* ── Thin Word ribbon (tabs + one panel row) ─────────────────────────── */
.article-editor__ribbon {
  position: sticky;
  top: -18px;
  z-index: 6;
  margin: 0 0 10px;
  border: 1px solid rgba(212, 161, 75, 0.28);
  border-radius: 12px;
  background: #0c0a08;
  overflow: visible;
}
.article-editor__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  border-bottom: 1px solid rgba(212, 161, 75, 0.22);
  background: rgba(7, 7, 6, 0.75);
  padding: 0 6px;
}
.article-editor__tab {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--mg-muted);
  font: 600 11px/1 var(--display);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 9px 12px 8px;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
}
.article-editor__tab:hover {
  color: var(--mg-ivory);
}
.article-editor__tab.is-on {
  color: var(--mg-hi);
  border-bottom-color: var(--mg-amber);
}
.article-editor__panels {
  min-height: 52px;
}
.article-editor__panel {
  display: none;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 10px;
  padding: 8px 10px;
  min-height: 52px;
}
.article-editor__panel.is-on {
  display: flex;
}
.article-editor__cluster {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.article-editor__cluster-label {
  font: 600 10px/1 var(--display);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mg-gold);
  margin-right: 2px;
}
.article-editor__vsep {
  width: 1px;
  align-self: stretch;
  min-height: 28px;
  background: rgba(212, 161, 75, 0.22);
}
.article-editor__soft {
  font-size: 12px;
  color: var(--mg-muted);
}
.article-editor__select {
  min-height: 32px;
  max-width: 168px;
  border-radius: 8px;
  border: 1px solid rgba(212, 161, 75, 0.28);
  background: rgba(7, 7, 6, 0.85);
  color: var(--mg-ivory);
  font: 500 12px/1.2 var(--body);
  padding: 0 8px;
}
.article-editor__select--size { max-width: 64px; }
.article-editor__tool {
  min-height: 32px;
  min-width: 32px;
  padding: 0 8px;
  border-radius: 8px;
  border: 1px solid rgba(212, 161, 75, 0.28);
  background: rgba(7, 7, 6, 0.7);
  color: var(--mg-ivory);
  font: 700 12px/1 var(--display);
  cursor: pointer;
}
.article-editor__tool:hover {
  border-color: var(--mg-amber);
}
.article-editor__tool--wide {
  min-width: auto;
  padding: 0 10px;
  font: 600 11px/1 var(--display);
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.article-editor__tool--photo {
  background: linear-gradient(135deg, #f28a2d, #d4a14b);
  color: #120e0a;
  border-color: transparent;
}
.article-editor__colorwrap { position: relative; }
.article-editor__palette {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 20;
  display: grid;
  grid-template-columns: repeat(7, 22px);
  gap: 6px;
  padding: 10px;
  border-radius: 12px;
  border: 1px solid var(--mg-border);
  background: rgba(16, 14, 11, 0.98);
  box-shadow: 0 12px 28px rgba(0,0,0,.45);
}
.article-editor__swatch {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  border: 1px solid rgba(255,255,255,.25);
  cursor: pointer;
  padding: 0;
}
.article-editor__swatch:hover { transform: scale(1.08); }
.article-editor__histwrap { position: relative; }
.article-editor__history {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 30;
  width: min(320px, 78vw);
  max-height: 280px;
  overflow: auto;
  border-radius: 12px;
  border: 1px solid var(--mg-border);
  background: rgba(12, 10, 8, 0.98);
  box-shadow: 0 16px 36px rgba(0,0,0,.5);
  padding: 6px;
}
.article-editor__history-head {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px 10px 6px;
  font: 700 12px/1.2 var(--display);
  text-transform: uppercase;
  color: var(--mg-hi);
  border-bottom: 1px solid rgba(212,161,75,.2);
  margin-bottom: 4px;
}
.article-editor__history-head span {
  font: 400 11px/1.3 var(--body);
  color: var(--mg-muted);
  text-transform: none;
  letter-spacing: 0;
}
.article-editor__history-item {
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  text-align: left;
  border: 0;
  background: transparent;
  color: var(--mg-ivory);
  padding: 8px 10px;
  border-radius: 8px;
  cursor: pointer;
  font: 500 13px/1.3 var(--body);
}
.article-editor__history-item small { color: var(--mg-muted); font-size: 11px; }
.article-editor__history-item:hover { background: rgba(242, 138, 45, 0.12); }
.article-editor__history-item.is-now {
  background: rgba(242, 138, 45, 0.18);
  color: var(--mg-hi);
}
.article-editor__history-empty {
  padding: 12px;
  color: var(--mg-muted);
  font-size: 13px;
}

.article-editor__content table,
.post-rich table,
.editor-table,
.post-table {
  width: 100%;
  border-collapse: collapse;
  margin: 1em 0;
  background: rgba(16, 14, 11, 0.55);
}
.article-editor__content th,
.article-editor__content td,
.post-rich th,
.post-rich td {
  border: 1px solid rgba(212, 161, 75, 0.4);
  padding: 8px 10px;
  vertical-align: top;
}
.article-editor__content th,
.post-rich th {
  background: rgba(242, 138, 45, 0.12);
  font-weight: 700;
  color: var(--mg-hi);
}
.article-editor__content ul,
.article-editor__content ol,
.post-rich ul,
.post-rich ol {
  margin: 0.7em 0 0.7em 1.3em;
}
.article-editor__content blockquote,
.post-rich blockquote {
  margin: 1em 0;
  padding: 0.6em 0 0.6em 1em;
  border-left: 3px solid var(--mg-amber);
  color: var(--mg-copy);
}
.post-hr,
.article-editor__content hr {
  border: 0;
  border-top: 1px solid rgba(212, 161, 75, 0.35);
  margin: 1.4em 0;
  clear: both;
}
.post-hr--solid,
.article-editor__content hr[data-hr="solid"] {
  border-top: 1px solid rgba(212, 161, 75, 0.45);
}
.post-hr--thick,
.article-editor__content hr[data-hr="thick"] {
  border-top: 3px solid rgba(242, 138, 45, 0.75);
}
.post-hr--dashed,
.article-editor__content hr[data-hr="dashed"] {
  border-top: 2px dashed rgba(212, 161, 75, 0.55);
}
.post-hr--dotted,
.article-editor__content hr[data-hr="dotted"] {
  border-top: 2px dotted rgba(212, 161, 75, 0.7);
}
.post-hr--double,
.article-editor__content hr[data-hr="double"] {
  border-top: 4px double rgba(242, 138, 45, 0.65);
}
.post-rich { margin: 0.2em 0 1em; color: var(--mg-ivory); font: 17.5px/1.72 var(--article-body); }
.post-rich a { color: var(--mg-amber); text-decoration: underline; }
.article-editor__content a { color: var(--mg-amber); }

@media (max-width: 900px) {
  .article-editor__select { max-width: 42vw; }
  .article-editor__vsep { display: none; }
}

/* Грана / заказы 13.* — фирменный назар (глаз от сглаза) у пароля
   Эталон: инструкция/grana-brand/nazar-eye.css
   Кнопка: .pass-toggle.pass-toggle--nazar  (или .auth-pass-toggle--nazar / .field-password__toggle--nazar)
   Открыт: aria-pressed="true" или .is-open  → веко скрыто
*/

.pass-toggle--nazar,
.auth-pass-toggle--nazar,
.field-password__toggle--nazar {
  border-radius: 50% !important;
  width: 40px;
  height: 40px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(circle at 35% 30%, rgba(255, 255, 255, 0.22), transparent 45%),
    linear-gradient(160deg, #1a1a1a 0%, #0a0a0a 55%, #2a2a2a 100%) !important;
  border: 1.5px solid rgba(247, 244, 239, 0.35) !important;
  color: #f7f4ef;
  box-shadow:
    0 0 0 1px rgba(0, 0, 0, 0.5),
    0 4px 14px rgba(0, 0, 0, 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.pass-toggle--nazar:hover,
.pass-toggle--nazar:focus-visible,
.auth-pass-toggle--nazar:hover,
.field-password__toggle--nazar:hover {
  border-color: rgba(247, 244, 239, 0.55) !important;
  box-shadow:
    0 0 0 1px rgba(0, 0, 0, 0.45),
    0 0 18px rgba(247, 244, 239, 0.18),
    0 6px 16px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
  outline: none;
}

.pass-toggle--nazar[aria-pressed="true"],
.pass-toggle--nazar.is-open,
.auth-pass-toggle--nazar.is-open,
.field-password__toggle--nazar[aria-pressed="true"],
.field-password.is-visible .field-password__toggle--nazar {
  border-color: rgba(247, 244, 239, 0.7) !important;
  box-shadow:
    0 0 0 1px rgba(0, 0, 0, 0.4),
    0 0 22px rgba(247, 244, 239, 0.28),
    0 4px 14px rgba(0, 0, 0, 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.nazar-eye {
  display: block;
  width: 28px;
  height: 28px;
  pointer-events: none;
  transition: transform 0.28s cubic-bezier(0.34, 1.4, 0.64, 1);
}

.pass-toggle--nazar[aria-pressed="true"] .nazar-eye,
.pass-toggle--nazar.is-open .nazar-eye,
.auth-pass-toggle--nazar.is-open .nazar-eye,
.field-password.is-visible .nazar-eye {
  transform: scale(1.06);
  animation: nazar-blink 2.8s ease-in-out infinite;
}

.nazar-eye__lid {
  display: block;
}

.pass-toggle--nazar[aria-pressed="true"] .nazar-eye__lid,
.pass-toggle--nazar.is-open .nazar-eye__lid,
.auth-pass-toggle--nazar.is-open .nazar-eye__lid,
.field-password.is-visible .nazar-eye__lid {
  display: none;
}

@keyframes nazar-blink {
  0%, 92%, 100% { transform: scale(1.06); }
  95% { transform: scale(1.06, 0.72); }
  97% { transform: scale(1.06); }
}

html.no-anim .pass-toggle--nazar[aria-pressed="true"] .nazar-eye, html.no-anim .pass-toggle--nazar.is-open .nazar-eye, html.no-anim .auth-pass-toggle--nazar.is-open .nazar-eye, html.no-anim .field-password.is-visible .nazar-eye {
    animation: none;
  }

/* ── Browse switch + YouTube video ─────────────────────────────────── */
.browse-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 0 0 18px;
  padding: 6px;
  border-radius: 16px;
  background: rgba(0,0,0,.06);
  border: 1px solid var(--mg-border);
}
.browse-switch__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  border-radius: 12px;
  text-decoration: none;
  font: 650 0.95rem/1 var(--display);
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--mg-muted);
  background: transparent;
}
.browse-switch__btn.is-on {
  background: #16120e;
  color: #f7f4ef;
  box-shadow: 0 8px 20px rgba(0,0,0,.18);
}
.layout--watch {
  grid-template-columns: var(--sidebar-w) minmax(0, 1fr) !important;
}
.layout--watch .rail[hidden] { display: none !important; }
@media (max-width: 860px) {
  .layout--watch { grid-template-columns: minmax(0, 1fr) !important; }
}
.yt-home { max-width: 1180px; margin: 0 auto; }
.yt-home__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.yt-home__actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.yt-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 22px 16px;
}
.yt-card {
  display: block;
  text-decoration: none;
  color: inherit;
  min-width: 0;
}
.yt-card__thumb {
  position: relative;
  aspect-ratio: 16 / 9;
  border-radius: 14px;
  overflow: hidden;
  background: #14110d;
}
.yt-card__thumb img,
.yt-card__thumb .cover,
.yt-card__thumb > div {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.yt-card__thumb-empty {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #2a2218, #12100c);
}
.yt-card__play {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: rgba(0,0,0,.28);
  opacity: 0;
  transition: opacity .18s ease;
  color: #fff;
}
.yt-card:hover .yt-card__play { opacity: 1; }
.yt-card__dur {
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 2;
  background: rgba(0,0,0,.82);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 4px;
}
.yt-card__row {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 10px;
  margin-top: 10px;
  align-items: start;
  width: 100%;
}
.yt-card__body {
  min-width: 0;
  overflow: hidden;
}
.yt-card__title {
  font: 650 0.98rem/1.35 var(--display);
  color: var(--mg-hi);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: normal;
  overflow-wrap: anywhere;
}
.yt-card__meta {
  margin-top: 4px;
  font-size: 13px;
  color: var(--mg-muted);
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.yt-live-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
  padding: 14px 16px;
  border-radius: 14px;
  background: linear-gradient(90deg, #8b1e1e, #c45c26);
  color: #fff;
  text-decoration: none;
  font-weight: 700;
}
.yt-live-banner--quiet {
  background: rgba(196,92,38,.12);
  color: var(--mg-hi);
  border: 1px solid rgba(196,92,38,.28);
}
.yt-live-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(255,255,255,.25);
  animation: ytPulse 1.2s ease infinite;
}
@keyframes ytPulse {
  50% { transform: scale(1.15); opacity: .7; }
}

/* Watch page (YouTube-like) */
.yt-watch {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 20px;
  align-items: start;
  max-width: 1280px;
  margin: 0 auto;
}
.yt-watch__player {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 16px;
  overflow: hidden;
  background: #000;
}
.yt-watch__player .player__video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #000;
  display: block;
}
.yt-watch__player .player__poster,
.yt-watch__player .player__poster .cover,
.yt-watch__player .cover {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.yt-watch__steps {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 12px;
}
.yt-watch__steps .btn { justify-content: center; min-height: 46px; }
.yt-watch__steps .btn[disabled] { opacity: .45; cursor: default; }
@media (min-width: 861px) { .yt-watch__steps { display: flex; justify-content: flex-end; } .yt-watch__steps .btn { min-width: 180px; } }
.yt-watch__title {
  margin: 14px 0 6px;
  font: 700 1.35rem/1.25 var(--display);
  color: var(--mg-hi);
}
.yt-watch__stats { color: var(--mg-muted); font-size: 14px; margin-bottom: 14px; }
.yt-watch__channel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding: 12px 0;
  border-top: 1px solid var(--mg-border);
  border-bottom: 1px solid var(--mg-border);
}
.yt-watch__who { display: flex; align-items: center; gap: 12px; min-width: 0; }
.yt-watch__ch-name {
  font-weight: 700;
  color: var(--mg-hi);
  text-decoration: none;
}
.yt-watch__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 14px 0;
}
.yt-watch__desc {
  padding: 14px 16px;
  border-radius: 14px;
  background: rgba(0,0,0,.04);
  border: 1px solid var(--mg-border);
  color: var(--mg-copy);
  line-height: 1.5;
  margin-bottom: 18px;
}
.yt-watch__desc-body { margin-top: 10px; }
.yt-watch__comments { margin-top: 8px; }
.yt-watch__side {
  position: sticky;
  top: 76px;
  max-height: calc(100vh - 96px);
  overflow: auto;
  padding-right: 4px;
}
.yt-watch__side-title {
  font: 650 0.85rem/1 var(--display);
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--mg-muted);
  margin-bottom: 12px;
}
.yt-upnext {
  display: grid;
  grid-template-columns: 168px minmax(0, 1fr);
  gap: 10px;
  text-decoration: none;
  color: inherit;
  margin-bottom: 12px;
}
.yt-upnext__thumb {
  position: relative;
  aspect-ratio: 16 / 9;
  border-radius: 10px;
  overflow: hidden;
  background: #14110d;
}
.yt-upnext__thumb .cover,
.yt-upnext__thumb img,
.yt-upnext__thumb > div {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.yt-upnext__title {
  font: 650 0.9rem/1.3 var(--display);
  color: var(--mg-hi);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.yt-upnext__meta { margin-top: 4px; font-size: 12px; color: var(--mg-muted); }

@media (max-width: 980px) {
  .yt-watch { grid-template-columns: 1fr; }
  .yt-watch__side { position: static; max-height: none; }
  .yt-upnext { grid-template-columns: 140px minmax(0, 1fr); }
}

/* Watch player polish */
.yt-watch__player.player {
  margin: 0;
  border-radius: 16px;
  background: #000;
}
.yt-watch__player .player__endless {
  position: absolute;
  right: 12px;
  top: 12px;
  bottom: auto;
  z-index: 3;
  opacity: .92;
}
.yt-watch__player .player__btn {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: rgba(0,0,0,.55);
  border: 2px solid rgba(255,255,255,.85);
  color: #fff;
}
.yt-watch__player .player__missing {
  position: absolute;
  inset: auto 12px 12px 12px;
  color: #fff;
  background: rgba(180,40,40,.9);
  padding: 8px 12px;
  border-radius: 8px;
}
.layout--watch .main {
  max-width: none;
  padding-left: 18px;
  padding-right: 18px;
}
@media (max-width: 720px) {
  .browse-switch { margin-bottom: 12px; }
  .yt-grid { grid-template-columns: 1fr 1fr; gap: 14px 10px; }
  .yt-card__row { grid-template-columns: 36px minmax(0,1fr); gap: 8px; }
  .yt-card__title { font-size: 0.88rem; }
  .yt-watch__title { font-size: 1.1rem; }
  .yt-watch__player.player { border-radius: 0; margin-left: -12px; margin-right: -12px; width: calc(100% + 24px); }
  .layout--watch .main { padding-left: 12px; padding-right: 12px; }
}

/* YouTube cards: force column + rich covers */
.yt-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 0;
}
.yt-card__thumb {
  width: 100%;
  flex: 0 0 auto;
}
.yt-card__thumb .cover,
.yt-card__thumb .cover--photo,
.yt-card__thumb .cover--grad,
.yt-card__thumb [class*="cover"] {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 0 !important;
  min-height: 0 !important;
}
.yt-card__play {
  opacity: .55;
}
.yt-card:hover .yt-card__play,
.yt-card:focus-visible .yt-card__play { opacity: 1; }

@media (max-width: 720px) {
  .yt-grid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }
  .yt-card__thumb {
    border-radius: 12px;
  }
  .browse-switch {
    position: static;
    top: auto;
    margin-bottom: 16px;
  }
}

.share-quote {
  margin: 0 0 12px;
  padding: 12px 14px;
  border-left: 3px solid var(--mg-amber, #c45c26);
  background: rgba(196, 92, 38, 0.1);
  border-radius: 0 12px 12px 0;
  color: var(--mg-hi, #f7f4ef);
  font: italic 0.98rem/1.45 var(--body, Georgia, serif);
}
mark.quote-hl {
  background: rgba(242, 138, 45, 0.35);
  color: inherit;
  border-radius: 3px;
  padding: 0 2px;
  box-decoration-break: clone;
}

/* -- Юридические ссылки --------------------------------------------------- */
.legal-note {
  margin: 8px 0 0;
  font-size: 12px;
  line-height: 1.45;
  color: var(--mg-muted, rgba(246, 230, 197, 0.55));
}
.legal-note a,
.site-legal a {
  color: var(--mg-amber-lite);
  text-decoration: underline;
  text-decoration-color: rgba(248, 180, 90, 0.35);
  text-underline-offset: 2px;
}
.legal-note a:hover,
.site-legal a:hover { text-decoration-color: currentColor; }
.auth-legal { margin: 0 0 12px; }
.live-legal { padding: 0 10px 8px; font-size: 11px; }
.site-legal {
  margin-top: 48px;
  padding: 18px 0 8px;
  border-top: 1px solid rgba(246, 230, 197, 0.08);
  font-size: 12px;
  line-height: 1.5;
  color: var(--mg-muted, rgba(246, 230, 197, 0.55));
}
.site-legal__links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  margin-bottom: 6px;
}
.site-legal p { margin: 0; }

/* Программа участников (Дополнение №1) */
.prog { max-width: 980px; }
.prog-lead { margin: 10px 0 18px; color: var(--mg-hi); font-size: 15px; line-height: 1.5; max-width: 62ch; }
.prog-msg:empty { display: none; }
.prog-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.prog-card { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.prog-card p { margin: 0; line-height: 1.5; }
.prog-stats { display: flex; flex-wrap: wrap; gap: 10px; }
.prog-stat { flex: 1 1 110px; padding: 12px 14px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(246, 230, 197, 0.03); }
.prog-stat b { display: block; font: 700 1.5rem/1.1 var(--display); color: var(--mg-hi); }
.prog-stat span { font-size: 12px; color: var(--mg-muted, rgba(246, 230, 197, 0.55)); }
.prog-bar { height: 6px; border-radius: 99px; background: rgba(246, 230, 197, 0.08); overflow: hidden; }
.prog-bar i { display: block; height: 100%; border-radius: inherit; background: var(--grad-cta); transition: width 0.6s ease; }
.prog-rules { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.prog-rules li { padding-left: 46px; position: relative; line-height: 1.45; }
.prog-rules li b { position: absolute; left: 0; top: 0; min-width: 36px; text-align: center; padding: 1px 6px; border-radius: 8px; background: rgba(248, 180, 90, 0.14); color: var(--mg-amber-lite); font-weight: 700; }
.prog-goal { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0 4px; border-top: 1px solid rgba(246, 230, 197, 0.07); }
.prog-goal > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.prog-goal span { font-size: 12px; color: var(--mg-muted, rgba(246, 230, 197, 0.55)); }
.prog-goal em { font-style: normal; font-size: 12px; white-space: nowrap; color: var(--mg-amber-lite); }
.prog-goal.is-done em { color: #9BD49B; }
.prog-sub { font-size: 12px; margin-top: -4px !important; }
.prog-ok { color: #9BD49B; }
.prog-warn { color: #F0B98A; }
.prog-copy, .prog-form--row { display: flex; gap: 8px; flex-wrap: wrap; }
.prog-copy input { flex: 1 1 200px; min-width: 0; }
.prog-form { display: flex; flex-direction: column; gap: 8px; }
.prog-form--row > * { flex: 1 1 140px; min-width: 0; }
.prog-card input:not([type="checkbox"]), .prog-card select, .prog-post textarea {
  width: 100%; min-height: 40px; padding: 8px 12px; border: 1px solid var(--mg-border); border-radius: 10px;
  background: rgba(0, 0, 0, 0.25); color: var(--mg-hi); font: inherit;
}
.prog-check { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.prog-list { margin: 0; padding-left: 18px; display: grid; gap: 4px; font-size: 13px; color: var(--mg-muted, rgba(246, 230, 197, 0.7)); }
.prog-staff { margin-top: 14px; gap: 10px; }
.prog-staff h3 { margin: 10px 0 0; font-size: 14px; color: var(--mg-hi); }
.prog-staff-item { padding: 10px 12px; border: 1px solid var(--mg-border); border-radius: 12px; }
.prog-staff-item p { margin: 6px 0 8px; white-space: pre-wrap; }
.prog-legal { margin-top: 16px; }
.prog-post { margin: 18px 0; display: flex; flex-direction: column; gap: 10px; }
.prog-post__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.prog-post__review { display: flex; flex-direction: column; gap: 8px; }
.prog-post textarea { min-height: 120px; resize: vertical; }
.prog-post__row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.prog-review { padding: 10px 0; border-top: 1px solid rgba(246, 230, 197, 0.07); }
.prog-review span { margin-left: 8px; font-size: 12px; color: var(--mg-muted, rgba(246, 230, 197, 0.55)); }
.prog-review p { margin: 6px 0 0; white-space: pre-wrap; line-height: 1.5; }
.prog-promoted { margin: 0 0 12px; display: flex; flex-direction: column; gap: 6px; }
.prog-promoted__item { color: var(--mg-hi); text-decoration: none; padding: 6px 0; border-top: 1px solid rgba(246, 230, 197, 0.07); }
.prog-promoted__item:hover { color: var(--mg-amber-lite); }
@media (max-width: 760px) {
  .prog-grid { grid-template-columns: 1fr; }
  .prog-stat b { font-size: 1.3rem; }
}.prog-post a, .prog-card a { color: var(--mg-amber-lite); text-decoration: underline; text-decoration-color: rgba(248, 180, 90, 0.35); text-underline-offset: 2px; }
.prog-form.prog-form--row { flex-direction: row; align-items: stretch; }
.prog-form--row > .btn { flex: 0 0 auto; }

/* ===== Платформа 02.10: баланс, поздравления, подписка, куб партнёров, подиум, обращения, чаты, пульт ===== */
.tops-note, .chat-hint, .chat-empty, .fb-form__pd, .fb-rail__lead, .plat-modal__note, .wallet-calc .muted, .fx .muted, .dev-config .muted, .dev-user__acts .muted { color: var(--mg-muted); }
.wallet-calc input, .wallet-calc select, .fx input, .fx select, .dev-search input, .dev-user select, .dev-partner input,
.fb-mod select, .fb-mod textarea, .chat-compose textarea {
  min-height: 40px;
  padding: 8px 12px;
  border-radius: 10px;
  border: 1px solid var(--mg-border);
  background: #0a0908;
  color: var(--mg-hi);
  font: inherit;
  font-size: 14px;
}

/* баланс и «онлайн» в шапке */
.bal-chip, .online-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 34px;
  padding: 0 11px 0 8px;
  border: 1px solid rgba(155, 231, 255, 0.32);
  border-radius: 999px;
  background: rgba(16, 24, 28, 0.78);
  color: var(--mg-hi);
  font: 700 13px/1 var(--mono);
  white-space: nowrap;
  transition: border-color .2s var(--ease), transform .2s var(--ease);
}
.bal-chip[hidden], .online-chip[hidden] { display: none; }
.bal-chip:hover { border-color: #9BE7FF; color: var(--mg-hi); }
.bal-chip__gem { display: inline-grid; width: 18px; height: 18px; }
.bal-chip__gem svg { width: 100%; height: 100%; filter: drop-shadow(0 0 6px rgba(155, 231, 255, .55)); }
.bal-chip.is-pulse { animation: balPulse .7s var(--ease); }
@keyframes balPulse { 0% { transform: scale(1); } 40% { transform: scale(1.14); box-shadow: 0 0 22px rgba(155, 231, 255, .55); } 100% { transform: scale(1); } }
.online-chip { border-color: rgba(120, 210, 120, 0.35); background: rgba(14, 22, 14, 0.78); font-size: 12px; }
.online-chip i { width: 8px; height: 8px; border-radius: 50%; background: #6fd46a; box-shadow: 0 0 0 0 rgba(111, 212, 106, .6); animation: onlineDot 2s infinite; }
.online-chip { gap: 10px; padding: 0 12px 0 10px; }
.online-chip:hover { border-color: rgba(120, 210, 120, 0.7); color: var(--mg-hi); }
.online-chip__reg, .online-chip__on { display: inline-flex; align-items: center; gap: 5px; }
.online-chip__reg { padding-right: 10px; border-right: 1px solid rgba(246, 230, 197, 0.14); }
.online-chip__reg svg { width: 15px; height: 15px; color: #F8B45A; }
.online-chip__lbl { font: 500 11px/1 var(--mono); color: var(--mg-copy); }
.bal-chip.is-loading b { opacity: .55; }
.bal-chip { gap: 9px; }
.bal-chip__cur { display: inline-flex; align-items: center; gap: 4px; }
.bal-chip__cur + .bal-chip__cur { padding-left: 9px; border-left: 1px solid rgba(246, 230, 197, 0.14); }
.bal-chip__sym { display: inline-grid; place-items: center; width: 16px; height: 16px; border-radius: 50%; font: 800 10px/1 var(--display); font-style: normal; }
.bal-chip__sym--r { background: rgba(248, 180, 90, .18); color: #F8B45A; }
.bal-chip__sym--rub { background: rgba(111, 212, 106, .16); color: #8be08a; }
@keyframes onlineDot { 70% { box-shadow: 0 0 0 7px rgba(111, 212, 106, 0); } 100% { box-shadow: 0 0 0 0 rgba(111, 212, 106, 0); } }

/* экран «Поздравляем» */
body.celebrate-open { overflow: hidden; }
.celebrate {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: grid;
  place-items: center;
  padding: 24px 18px 120px;
  background: radial-gradient(ellipse at 50% 38%, rgba(48, 30, 12, .9), rgba(5, 4, 3, .96) 70%);
  animation: celebrateIn .35s var(--ease);
}
@keyframes celebrateIn { from { opacity: 0; } to { opacity: 1; } }
.celebrate__fx { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.celebrate__card { position: relative; text-align: center; max-width: 420px; transition: opacity .45s var(--ease), transform .45s var(--ease); }
.celebrate__kicker { font: 700 clamp(30px, 8vw, 46px)/1.05 var(--display); text-transform: uppercase; letter-spacing: .02em; background: var(--grad-cta); -webkit-background-clip: text; background-clip: text; color: transparent; }
.celebrate__lead { margin-top: 10px; color: var(--mg-copy); font-size: 16px; }
.celebrate__gem { width: clamp(84px, 24vw, 120px); height: clamp(84px, 24vw, 120px); margin: 14px auto 4px; animation: gemFloat 2.4s ease-in-out infinite; }
.celebrate__gem svg { width: 100%; height: 100%; filter: drop-shadow(0 0 26px rgba(155, 231, 255, .7)); }
@keyframes gemFloat { 50% { transform: translateY(-8px) rotate(-4deg); } }
.celebrate__amount { font: 700 clamp(58px, 17vw, 104px)/1 var(--display); color: #E6FAFF; text-shadow: 0 0 34px rgba(155, 231, 255, .55); }
.celebrate__unit { margin-top: 4px; font: 600 18px/1.2 var(--display); text-transform: uppercase; letter-spacing: .08em; color: #9BE7FF; }
.celebrate__why { margin: 14px auto 0; max-width: 32ch; color: var(--mg-copy); font-size: 14px; line-height: 1.45; }
.celebrate__btn {
  position: absolute;
  left: 50%;
  bottom: calc(30px + env(safe-area-inset-bottom, 0px));
  transform: translateX(-50%);
  min-width: min(280px, calc(100% - 48px));
  min-height: 64px;
  padding: 0 34px;
  border: 0;
  border-radius: 999px;
  background: var(--grad-cta);
  color: var(--mg-ink);
  font: 700 24px/1 var(--display);
  text-transform: uppercase;
  letter-spacing: .06em;
  box-shadow: 0 0 0 0 rgba(242, 138, 45, .55), 0 14px 40px rgba(242, 138, 45, .35);
  cursor: pointer;
  animation: wowPulse 1.8s ease-in-out infinite;
}
.celebrate__btn:disabled { animation: none; opacity: .85; }
@keyframes wowPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(242, 138, 45, .5), 0 14px 40px rgba(242, 138, 45, .35); } 50% { box-shadow: 0 0 0 14px rgba(242, 138, 45, 0), 0 14px 40px rgba(242, 138, 45, .45); } }
.celebrate.is-flowing .celebrate__card { opacity: .25; transform: scale(.96); }
.celebrate.is-flowing .celebrate__gem { visibility: hidden; }
.celebrate__fly {
  position: fixed;
  z-index: 1300;
  width: 24px;
  height: 24px;
  pointer-events: none;
  transition: transform .72s cubic-bezier(.5, -0.2, .3, 1), opacity .72s ease-in;
}
.celebrate__fly svg { width: 100%; height: 100%; filter: drop-shadow(0 0 8px rgba(155, 231, 255, .8)); }

/* окончание подписки */
.expiry {
  position: relative;
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  margin: 0 0 20px;
  padding: 18px 20px;
  border: 1px solid rgba(242, 138, 45, .55);
  border-radius: 18px;
  background: linear-gradient(120deg, rgba(242, 138, 45, .16), rgba(16, 14, 11, .92) 55%);
  box-shadow: var(--mg-glow);
}
.expiry__mascot { position: relative; display: block; width: 104px; height: 104px; object-fit: contain; }
.expiry__mascot--cube img { width: 100%; height: 100%; object-fit: contain; animation: tickTock 1s steps(2, jump-none) infinite; transform-origin: 50% 90%; }
@keyframes tickTock { 0% { transform: rotate(-5deg); } 100% { transform: rotate(5deg); } }
.expiry__clock { position: absolute; right: -4px; bottom: -2px; width: 42px; height: 42px; border-radius: 50%; border: 3px solid var(--mg-amber-lite); background: #120e0a; box-shadow: 0 0 14px rgba(242, 138, 45, .5); }
.expiry__clock::before { content: ""; position: absolute; left: 50%; top: 7px; width: 2px; height: 12px; margin-left: -1px; border-radius: 2px; background: var(--mg-hi); transform-origin: 50% 12px; animation: clockHand 60s linear infinite; }
.expiry__clock b { position: absolute; left: 50%; top: 4px; width: 2px; height: 15px; margin-left: -1px; background: var(--mg-amber); transform-origin: 50% 15px; animation: clockHand 4s steps(4) infinite; }
@keyframes clockHand { to { transform: rotate(360deg); } }
.expiry__kicker { font: 600 11px/1 var(--mono); text-transform: uppercase; letter-spacing: .14em; color: var(--mg-amber-lite); }
.expiry__title { display: block; margin-top: 6px; font: 600 clamp(18px, 2.4vw, 24px)/1.2 var(--display); color: var(--mg-hi); }
.expiry__title [data-expiry-left] { font-family: var(--mono); color: var(--mg-amber-lite); white-space: nowrap; }
.expiry__text { margin: 8px 0 12px; color: var(--mg-copy); font-size: 14px; line-height: 1.45; }
.expiry__actions { display: flex; flex-wrap: wrap; gap: 8px; }

/* окно оформления подписки */
.plat-modal { position: fixed; inset: 0; z-index: 1100; display: grid; place-items: center; padding: 16px; background: rgba(3, 3, 2, .72); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.plat-modal__box { position: relative; width: 100%; max-width: 440px; max-height: calc(100dvh - 32px); overflow-y: auto; padding: 24px 22px 20px; border: 1px solid var(--mg-border); border-radius: 18px; background: var(--mg-card); box-shadow: 0 30px 80px rgba(0, 0, 0, .6); }
.plat-modal__box p { color: var(--mg-copy); line-height: 1.5; }
.plat-modal__x { position: absolute; top: 10px; right: 10px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: rgba(246, 230, 197, .06); color: var(--mg-hi); font-size: 22px; line-height: 1; cursor: pointer; }
.plat-modal__title { margin: 8px 0 10px; font: 600 1.5rem/1.15 var(--display); color: var(--mg-hi); }
.plat-check { display: flex; align-items: flex-start; gap: 10px; margin: 12px 0 6px; color: var(--mg-hi); font-size: 14px; line-height: 1.4; cursor: pointer; }
.plat-check input { flex: 0 0 auto; width: 18px; height: 18px; margin-top: 1px; accent-color: var(--mg-amber); }
.plat-modal__note { font-size: 12px; }
.plat-modal__pay { width: 100%; margin-top: 6px; min-height: 48px; font-size: 15px; }
.plat-modal__msg { margin: 10px 0 0; font-size: 13px; }
.plat-modal__msg:empty { display: none; }
.plat-modal__msg.is-ok { color: #8fd98a; }
.plat-modal__msg.is-err { color: #f0a08a; }

/* куб партнёров на главной */
.pcube { position: relative; flex-shrink: 0; width: clamp(120px, 16vw, 160px); aspect-ratio: 1; }
.pcube .pcube__img { width: 100%; height: 100%; }
.pcube__map { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.pcube__map a { cursor: pointer; outline: none; }
.pcube__face { fill: rgba(255, 220, 160, 0); stroke: rgba(255, 220, 160, 0); stroke-width: .6; transition: fill .2s var(--ease), stroke .2s var(--ease); }
.pcube__map a:hover .pcube__face, .pcube__map a:focus-visible .pcube__face { fill: rgba(255, 220, 160, .14); stroke: rgba(255, 230, 190, .7); }
.pcube__logo { pointer-events: none; filter: drop-shadow(0 .4px .8px rgba(0, 0, 0, .7)); }
/* главный партнёр SFEROOM — в одной строке с «ГРАНАДЗЯК»: квадрат со знаком-кубом + длинное слово, в буквах O глаз и Земля */
.sfr-brand {
  --sh: 40px;
  display: flex; flex-direction: row; align-items: center; gap: calc(var(--sh) * .3); flex-shrink: 0;
  text-decoration: none; border-radius: 12px; transition: transform .2s var(--ease), filter .2s var(--ease);
}
@media (min-width: 721px) {
  .home-logo {
    container-type: inline-size;
    display: grid; grid-template-columns: auto auto minmax(0, 1fr); grid-template-rows: 1fr auto auto 1fr;
    row-gap: 0;
  }
  .home-logo > .pcube, .home-logo > .home-logo__mark { grid-row: 1 / -1; align-self: center; }
  .home-logo__text { display: contents; }
  .home-logo__title { grid-column: 2; grid-row: 2; }
  .home-logo__tag { grid-column: 2 / -1; grid-row: 3; }
  /* высота слова подстраивается под свободное место справа от названия, на широком экране ≈ высоте букв «ГРАНАДЗЯК» */
  .sfr-brand { --sh: clamp(22px, calc((100cqi - 548px) / 7.9), 54px); grid-column: 3; grid-row: 2; align-self: center; justify-self: start; margin-left: clamp(4px, 1.4vw, 18px); }
}
.sfr-brand:hover, .sfr-brand:focus-visible { transform: translateY(-2px); filter: brightness(1.1) drop-shadow(0 0 18px rgba(255, 178, 77, .28)); outline: none; }
.sfr-brand__icon { height: calc(var(--sh) * 1.3); width: auto; aspect-ratio: 40 / 44; flex-shrink: 0; filter: drop-shadow(0 0 16px rgba(255, 178, 77, .35)); }
.sfr-brand__word { position: relative; display: block; height: var(--sh); width: auto; aspect-ratio: 1046 / 161; flex-shrink: 0; }
.sfr-brand__word > img { display: block; width: 100%; height: 100%; }
.sfr-brand__word > .sfr-brand__lt { display: none; }
html[data-theme="light"] .sfr-brand__word > .sfr-brand__dk { display: none; }
html[data-theme="light"] .sfr-brand__word > .sfr-brand__lt { display: block; }
.sfr-brand__o {
  position: absolute; top: 50%; width: 15.3%; aspect-ratio: 1;
  transform: translate(-50%, -50%); border-radius: 50%; overflow: hidden; background: #120d08;
  box-shadow: 0 0 0 1px rgba(255, 187, 97, .35);
}
.sfr-brand__o video, .sfr-brand__o img { display: block; width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); }
.sfr-brand__o--eye { left: 57.5%; }
.sfr-brand__o--earth { left: 73.9%; }
@media (max-width: 720px) {
  .home-logo { display: grid; grid-template-columns: auto minmax(0, 1fr); }
  .sfr-brand { --sh: 25px; grid-column: 1 / -1; justify-content: center; margin: 4px 0 0; }
}
.pcube__free, .pcube__name { pointer-events: none; font-family: var(--display); font-weight: 600; fill: rgba(251, 239, 211, .92); paint-order: stroke; stroke: rgba(20, 10, 4, .65); stroke-width: .9px; letter-spacing: .02em; }
.pcube__free { font-size: 5.2px; text-transform: uppercase; }
.pcube__name { font-size: 7px; }

/* статья дня / видео дня — три места */
.podium { margin: 0 0 18px; padding: 16px; border: 1px solid var(--mg-border-amber, var(--mg-border)); border-radius: 16px; background: linear-gradient(160deg, rgba(242, 138, 45, .1), rgba(16, 14, 11, .9) 45%); }
.podium.is-loading { display: none; }
.podium__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.podium__title { margin: 6px 0 0; font: 600 1.3rem/1.15 var(--display); text-transform: uppercase; color: var(--mg-hi); }
.podium__note { margin: 4px 0 0; font-size: 12px; color: var(--mg-muted); }
.podium__head .btn { flex-shrink: 0; }
.podium__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.podium__grid--1 { grid-template-columns: minmax(0, 1fr); }
.podium__grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.podium__card { position: relative; display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid var(--mg-border); border-radius: 12px; background: var(--mg-card); color: var(--mg-hi); transition: transform .2s var(--ease), border-color .2s var(--ease); }
.podium__card:hover { transform: translateY(-2px); border-color: var(--mg-amber); color: var(--mg-hi); }
.podium__card--1 { border-color: rgba(248, 180, 90, .6); box-shadow: var(--mg-glow); }
.podium__cover { display: block; aspect-ratio: 16 / 9; background: linear-gradient(135deg, #2a1d10, #120e0a) center / cover no-repeat; }
.podium__card:not(.has-cover) .podium__cover { aspect-ratio: 16 / 5; background: radial-gradient(circle at 30% 30%, rgba(242, 138, 45, .22), transparent 60%), linear-gradient(135deg, #2a1d10, #120e0a); }
.podium__medal { position: absolute; top: 8px; left: 8px; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; font: 700 14px/1 var(--display); color: #1a1208; box-shadow: 0 2px 10px rgba(0, 0, 0, .5); }
.podium__medal--1 { background: linear-gradient(135deg, #ffe39a, #e0a530); }
.podium__medal--2 { background: linear-gradient(135deg, #f1f1f1, #a9aeb4); }
.podium__medal--3 { background: linear-gradient(135deg, #f2c09a, #b0703f); }
.podium__text { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px 12px; }
.podium__text b { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 14px; line-height: 1.3; }
.podium__text small { color: var(--mg-muted); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.podium__empty { margin: 0; color: var(--mg-copy); font-size: 14px; line-height: 1.5; }

.daily-switch { display: flex; gap: 8px; }
.daily-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; grid-template-areas: "t v a" "c v a"; column-gap: 12px; align-items: center; padding: 10px 0; border-top: 1px solid rgba(246, 230, 197, .07); }
.daily-row__title { grid-area: t; color: var(--mg-hi); font-weight: 600; }
.daily-row__ch { grid-area: c; font-size: 12px; color: var(--mg-muted); }
.daily-row__votes { grid-area: v; font: 600 13px/1 var(--mono); color: var(--mg-amber-lite); white-space: nowrap; }
.daily-row > .btn, .daily-row__mine { grid-area: a; }
.daily-row__mine { font-size: 12px; color: #8fd98a; }
.daily-row.is-voted .daily-row__title { color: var(--mg-amber-lite); }

/* правая колонка: обращения */
.widget--fb .fb-rail__lead { margin: 0 0 8px; font-size: 12px; line-height: 1.45; }
.fb-rail__item { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 9px 0; border-top: 1px solid rgba(246, 230, 197, .07); color: var(--mg-hi); }
.fb-rail__item b { font-size: 13px; font-weight: 500; line-height: 1.35; }
.fb-rail__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.fb-status { display: inline-block; padding: 3px 8px; border-radius: 999px; font: 600 10px/1 var(--mono); text-transform: uppercase; letter-spacing: .06em; border: 1px solid currentColor; }
.fb-status--new { color: var(--mg-amber-lite); }
.fb-status--accepted { color: var(--mg-cyber); }
.fb-status--rejected { color: #e08a6e; }
.fb-status--done { color: #8fd98a; }
.fb-status--in_work { color: #c9a6ff; }

/* кабинет: полоска быстрых разделов */
.cab-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin: 0 0 18px; }
.cab-strip__item { display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: 12px 14px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(16, 14, 11, .85); color: var(--mg-hi); transition: border-color .2s var(--ease); }
.cab-strip__item:hover { border-color: var(--mg-amber); color: var(--mg-hi); }
.cab-strip__item b { font-size: 14px; line-height: 1.3; }
.cab-strip__item small { font-size: 12px; color: var(--mg-muted); }
.cab-strip__item--gem { flex-direction: row; flex-wrap: wrap; align-items: center; column-gap: 8px; border-color: rgba(155, 231, 255, .35); background: rgba(14, 22, 26, .85); }
.cab-strip__item--gem > span { display: inline-grid; width: 22px; height: 22px; }
.cab-strip__item--gem svg { width: 100%; height: 100%; }
.cab-strip__item--gem b { font: 700 20px/1 var(--mono); }
.cab-strip__item--gem small { flex-basis: 100%; }
.cab-strip__item--admin { border-color: rgba(248, 180, 90, .45); background: radial-gradient(120% 140% at 0% 0%, rgba(248, 180, 90, .14), rgba(16, 14, 11, .85) 60%); }

/* «Ещё» на телефоне */
.more-links { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }
.more-links a { display: inline-flex; align-items: center; min-height: 38px; padding: 0 14px; border: 1px solid rgba(212, 161, 75, .28); border-radius: 999px; background: rgba(16, 14, 11, .75); color: var(--mg-hi); font-size: 13px; }

/* кошелёк */
.wallet-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.wallet-card { display: flex; flex-direction: column; gap: 6px; min-width: 0; padding: 16px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(16, 14, 11, .88); }
.wallet-card b { font: 700 clamp(1.3rem, 3vw, 1.9rem)/1.05 var(--display); color: var(--mg-hi); overflow-wrap: anywhere; }
.wallet-card > span:last-child { font-size: 12px; color: var(--mg-muted); }
.wallet-card__icon { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: rgba(246, 230, 197, .06); font: 700 15px/1 var(--display); color: var(--mg-amber-lite); }
.wallet-card__icon svg { width: 22px; height: 22px; }
.wallet-card--gem { border-color: rgba(155, 231, 255, .38); background: linear-gradient(150deg, rgba(92, 200, 242, .14), rgba(16, 14, 11, .9) 60%); }
.wallet-cards ~ .studio-panel, .dev-stats ~ .studio-panel { margin-top: 14px; }
.wallet-calc__row { display: flex; gap: 8px; margin: 10px 0; }
.wallet-calc__row input { flex: 1 1 auto; min-width: 0; }
.wallet-calc__out { display: flex; flex-wrap: wrap; gap: 8px 18px; color: var(--mg-copy); }
.wallet-calc__out b { font: 700 18px/1 var(--mono); color: var(--mg-amber-lite); }
.wallet-card__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; }
.wallet-rank { display: inline-flex; align-items: baseline; gap: 5px; min-width: 0; padding: 5px 10px 5px 9px; border: 1px solid rgba(255, 215, 114, .42); border-radius: 999px; background: linear-gradient(135deg, rgba(255, 215, 114, .2), rgba(248, 160, 70, .08)); color: #ffd772; text-decoration: none; white-space: nowrap; transition: border-color .2s var(--ease), background .2s var(--ease), transform .2s var(--ease); }
.wallet-rank:hover, .wallet-rank:focus-visible { border-color: #ffd772; background: linear-gradient(135deg, rgba(255, 215, 114, .3), rgba(248, 160, 70, .12)); transform: translateY(-1px); }
.wallet-rank__lbl { font: 600 10px/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 215, 114, .72); }
.wallet-card .wallet-rank b { font: 800 16px/1 var(--display); color: #ffd772; }
.wallet-rank small { font-size: 11px; color: var(--mg-muted); }
.wallet-out { padding: 6px 12px; border: 1px solid rgba(139, 224, 138, .42); border-radius: 999px; background: rgba(111, 212, 106, .1); color: #a6eba5; font: 700 11px/1 var(--display); letter-spacing: .06em; text-transform: uppercase; cursor: pointer; transition: border-color .2s var(--ease), background .2s var(--ease); }
.wallet-out:hover, .wallet-out:focus-visible { border-color: #8be08a; background: rgba(111, 212, 106, .2); }
.wallet-withdraw.is-flash { animation: walletFlash 1.4s var(--ease); }
@keyframes walletFlash { 0%, 100% { box-shadow: 0 0 0 0 rgba(139, 224, 138, 0); } 25% { box-shadow: 0 0 0 3px rgba(139, 224, 138, .45); } }
.wallet-places__note { margin: -4px 0 0; font-size: 12px; line-height: 1.45; color: var(--mg-muted); max-width: 72ch; }
.bal-chip__rank { padding: 2px 5px; border-radius: 6px; background: rgba(255, 215, 114, .16); color: #ffd772; font: 800 10px/1 var(--display); font-style: normal; letter-spacing: .02em; }
.fx__grid { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 10px; align-items: start; margin: 12px 0; }
.fx__field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.fx__lbl { font-size: 12px; color: var(--mg-muted); }
.fx__inline { display: flex; gap: 8px; min-width: 0; }
.fx__inline input { flex: 1 1 auto; min-width: 0; font: 700 16px/1 var(--mono); }
.fx__inline select { flex: 0 0 auto; }
.fx__out { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; min-height: 40px; padding: 8px 12px; border-radius: 10px; border: 1px dashed rgba(248, 180, 90, .35); font: 700 16px/1 var(--mono); color: #ffd772; overflow: hidden; text-overflow: ellipsis; }
.fx__all { align-self: flex-start; padding: 0; border: 0; background: none; color: #9BE7FF; font: 600 12px/1.3 inherit; cursor: pointer; }
.fx__all:disabled { color: var(--mg-muted); cursor: default; }
.fx__fee { font-size: 12px; color: var(--mg-muted); min-height: 1.3em; }
.fx__swap { display: grid; place-items: center; width: 40px; height: 40px; margin-top: 22px; border-radius: 50%; border: 1px solid var(--mg-border); background: rgba(246, 230, 197, .05); color: var(--mg-hi); cursor: pointer; transition: transform .25s var(--ease), border-color .2s; }
.fx__swap:hover { border-color: #F8B45A; transform: rotate(180deg); }
.fx__swap svg { width: 20px; height: 20px; transform: rotate(90deg); }
.fx__go { min-width: 200px; }
.fx__go:disabled { opacity: .45; cursor: not-allowed; }
.fx__go.is-confirm { background: #6fd46a; border-color: #6fd46a; color: #0b1a0a; }
.fx__err { min-height: 1.2em; margin: 8px 0 0; font-size: 13px; color: #ff9a8a; }
.wallet-hist__row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; align-items: baseline; padding: 9px 0; border-top: 1px solid rgba(246, 230, 197, .07); font-size: 14px; }
.wallet-hist__row time { font-size: 12px; color: var(--mg-muted); white-space: nowrap; }
.wallet-hist__row b { font-family: var(--mono); }
.is-plus { color: #8fd98a; }
.is-minus { color: #e08a6e; }

/* подписка */
.sub-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.sub-card { display: flex; flex-direction: column; gap: 10px; }
.sub-card p { margin: 0; line-height: 1.5; }
.sub-card__price { font: 700 2.1rem/1 var(--display); color: var(--mg-hi); }
.sub-card__price small { margin-left: 4px; font: 500 13px/1 var(--mono); color: var(--mg-muted); }
.sub-card .btn { margin-top: auto; }
.sub-card.is-on { border-color: var(--mg-amber); box-shadow: var(--mg-glow); }
.sub-card.is-soon { opacity: .72; }
.btn--pick:disabled { cursor: not-allowed; border: 1px solid var(--mg-border); background: rgba(246, 230, 197, .05); color: var(--mg-copy); box-shadow: none; opacity: 1; transform: none; }
.sub-card.is-soon .btn { cursor: not-allowed; border: 1px solid var(--mg-border); background: rgba(246, 230, 197, .05); color: var(--mg-copy); box-shadow: none; opacity: 1; }

/* топ-100 */
.tops-note { margin: -6px 0 14px; font-size: 13px; line-height: 1.45; max-width: 70ch; }
.top-list { border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(16, 14, 11, .88); overflow: hidden; }
.top-row { display: grid; grid-template-columns: 34px 38px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 14px; border-top: 1px solid rgba(246, 230, 197, .06); color: var(--mg-hi); }
.top-row:first-child { border-top: 0; }
.top-row:hover { background: rgba(246, 230, 197, .04); color: var(--mg-hi); }
.top-row__rank { font: 700 15px/1 var(--mono); color: var(--mg-muted); text-align: center; }
.top-row--1 .top-row__rank { color: #ffd772; }
.top-row--2 .top-row__rank { color: #d6dadf; }
.top-row--3 .top-row__rank { color: #e0a070; }
.top-row__av { width: 38px; height: 38px; border-radius: 50%; overflow: hidden; }
.top-row__av img, .top-row__av span { display: grid; place-items: center; width: 100%; height: 100%; object-fit: cover; font: 700 13px/1 var(--display); color: var(--mg-hi); }
.top-row__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.top-row__val { font: 700 14px/1 var(--mono); color: var(--mg-amber-lite); }
.top-row.is-me { background: rgba(248, 180, 90, .1); box-shadow: inset 3px 0 0 #F8B45A; }
.top-row__me { margin-left: 6px; padding: 2px 7px; border-radius: 999px; background: rgba(248, 180, 90, .2); color: #F8B45A; font: 700 11px/1.3 var(--mono); font-style: normal; }
.tops-mine { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "l l b" "n s b"; column-gap: 14px; row-gap: 4px; align-items: center; margin: 0 0 14px; padding: 14px 18px; border: 1px solid rgba(248, 180, 90, .32); border-radius: 14px; background: linear-gradient(140deg, rgba(248, 180, 90, .13), rgba(16, 14, 11, .9) 62%); }
.tops-mine__lbl { grid-area: l; font-size: 12px; color: var(--mg-muted); }
.tops-mine__num { grid-area: n; font: 800 clamp(1.8rem, 4.6vw, 2.5rem)/1 var(--display); color: #ffd772; }
.tops-mine small { grid-area: s; font-size: 13px; color: var(--mg-copy); }
.tops-mine .btn { grid-area: b; }
@media (max-width: 720px) {
  .tops-mine { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "l b" "n b" "s s"; padding: 12px 14px; }
}

/* жалобы и предложения */
.fb-form { display: grid; gap: 12px; margin-bottom: 16px; }
.fb-form > .btn { justify-self: start; }
.fb-form__kinds { display: flex; flex-wrap: wrap; gap: 18px; color: var(--mg-hi); font-size: 14px; }
.fb-form__kinds input { accent-color: var(--mg-amber); margin-right: 6px; }
.fb-form__pd { margin: 0; font-size: 12px; }
.fb-item { margin-bottom: 12px; padding: 16px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(16, 14, 11, .88); }
.fb-item.is-private { border-style: dashed; }
.fb-item__head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.fb-kind { font: 600 10px/1 var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--mg-gold); }
.fb-item__who { margin-left: auto; font-size: 12px; color: var(--mg-muted); }
.fb-item h3 { margin: 10px 0 4px; font-size: 16px; color: var(--mg-hi); }
.fb-item__text { margin: 6px 0 0; color: var(--mg-copy); line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.fb-item__private { margin: 8px 0 0; font-size: 12px; color: var(--mg-amber-lite); }
.fb-answer { margin-top: 12px; padding: 10px 12px; border-left: 3px solid var(--mg-amber); border-radius: 0 10px 10px 0; background: rgba(242, 138, 45, .07); }
.fb-answer b { font-size: 12px; color: var(--mg-amber-lite); }
.fb-answer p { margin: 4px 0 0; color: var(--mg-hi); line-height: 1.5; white-space: pre-wrap; }
.fb-answer + .fb-answer { margin-top: 8px; }
.fb-answer__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.fb-answer__head time, .fb-answer__writer { font-size: 11px; color: var(--mg-muted); }
.fb-answer__own { display: inline-flex; gap: 4px; margin-left: auto; }
.fb-answer__own button { padding: 3px 8px; border: 1px solid rgba(246, 230, 197, .16); border-radius: 999px; background: transparent; color: var(--mg-copy); font: 600 11px/1.2 var(--sans, inherit); cursor: pointer; transition: border-color .2s var(--ease), color .2s var(--ease); }
.fb-answer__own button:hover, .fb-answer__own button:focus-visible { border-color: var(--mg-amber-lite); color: var(--mg-hi); }
.fb-answer__own button[data-pact="fb-answer-del"]:hover { border-color: #e08a6e; color: #f0a48c; }
.fb-answer.is-official { border-left-color: #ffd772; background: linear-gradient(120deg, rgba(255, 215, 114, .12), rgba(242, 138, 45, .05)); }
.fb-answer.is-official .fb-answer__head b { color: #ffd772; }
.fb-answer--edit { display: grid; gap: 8px; }
.fb-answer--edit textarea { width: 100%; min-height: 84px; padding: 10px 12px; border: 1px solid rgba(246, 230, 197, .2); border-radius: 10px; background: rgba(10, 8, 6, .7); color: var(--mg-hi); font: inherit; line-height: 1.5; resize: vertical; }
.fb-answer__acts { display: flex; gap: 8px; }
.fb-official { color: #ffd772; }
.fb-mod__lbl { display: grid; gap: 4px; font-size: 11px; color: var(--mg-muted); }
.fb-steps { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 12px 0 0; padding: 0; list-style: none; }
.fb-step { position: relative; display: inline-flex; align-items: baseline; gap: 6px; padding: 4px 9px; border: 1px solid rgba(246, 230, 197, .12); border-radius: 999px; font-size: 11px; color: var(--mg-muted); }
.fb-step b { font-weight: 600; color: var(--mg-copy); }
.fb-step time { font-size: 10px; }
.fb-step + .fb-step { margin-left: 14px; }
.fb-step + .fb-step::before { content: "→"; position: absolute; left: -16px; top: 50%; transform: translateY(-50%); font-size: 12px; color: rgba(246, 230, 197, .32); }
.fb-step.is-current { border-color: currentColor; }
.fb-step.is-current.fb-step--new { color: var(--mg-amber-lite); }
.fb-step.is-current.fb-step--accepted { color: var(--mg-cyber); }
.fb-step.is-current.fb-step--in_work { color: #c9a6ff; }
.fb-step.is-current.fb-step--done { color: #8fd98a; }
.fb-step.is-current.fb-step--rejected { color: #e08a6e; }
.fb-step.is-current b { color: inherit; }
.fb-item__foot { display: flex; gap: 8px; margin-top: 12px; }
.fb-item__foot:empty { display: none; }
.fb-vote { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 12px; border: 1px solid rgba(212, 161, 75, .28); border-radius: 999px; background: rgba(16, 14, 11, .75); color: var(--mg-copy); font-size: 12px; cursor: pointer; transition: .2s var(--ease); }
.fb-vote:hover { border-color: var(--mg-amber); color: var(--mg-hi); }
.fb-vote.is-on { border-color: transparent; background: var(--grad-cta); color: var(--mg-ink); font-weight: 700; }
.fb-mod { display: grid; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px dashed rgba(246, 230, 197, .14); }
.fb-mod .btn { justify-self: start; }

/* чаты */
.chat-list { display: grid; gap: 12px; }
.chat-card { display: flex; gap: 14px; padding: 14px 16px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(16, 14, 11, .88); }
.chat-card__main { flex: 1 1 auto; min-width: 0; color: var(--mg-hi); }
.chat-card__main:hover { color: var(--mg-hi); }
.chat-card__main h3 { margin: 6px 0 4px; font-size: 16px; }
.chat-card__main p { margin: 0 0 6px; color: var(--mg-copy); font-size: 13px; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.chat-card__topic { font: 600 10px/1 var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--mg-gold); }
.chat-card__meta { display: block; font-size: 12px; color: var(--mg-muted); }
.chat-card__side { display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; gap: 8px; flex-shrink: 0; }
.chat-card__rating { font: 700 14px/1 var(--mono); color: var(--mg-amber-lite); }
.chat-new { display: grid; gap: 10px; margin-bottom: 16px; }
.chat-new[hidden] { display: none; }
.chat-topics { margin-bottom: 14px; }
.chat-head__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ev-page { max-width: 760px; display: grid; gap: 16px; }
.ev-page__head { display: grid; gap: 6px; justify-items: start; }
.ev-page__head h1 { margin: 0; }
.ev-page__head p { margin: 0; }
.ev-list { display: grid; border: 1px solid var(--mg-border); border-radius: 14px; overflow: hidden; }
.ev-row { display: flex; align-items: center; gap: 12px; padding: 12px 14px; color: inherit; text-decoration: none; border-top: 1px solid var(--mg-border); }
.ev-row:first-child { border-top: 0; }
a.ev-row:hover { background: rgba(255,255,255,.04); }
.ev-row.is-new { background: rgba(212,161,75,.08); }
.ev-row__ava { position: relative; flex: none; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--mg-surface-2, rgba(255,255,255,.08)); font-weight: 700; font-size: 14px; }
.ev-row__ava img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.ev-row__kind { position: absolute; right: -4px; bottom: -4px; width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; background: var(--mg-card, #fffdf9); border: 1px solid var(--mg-border); color: var(--mg-amber, #d4a14b); font-style: normal; font-size: 11px; line-height: 1; }
.ev-row__main { flex: 1; min-width: 0; display: grid; gap: 2px; overflow-wrap: anywhere; }
.ev-row__main small { color: var(--mg-muted); font-size: 13px; }
.ev-row__new { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--mg-gold, #d4a14b); }
.chat-size { display: grid; gap: 8px; margin: 12px 0; }
.chat-size__row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 12px 14px; border: 1px solid var(--mg-border); border-radius: 12px; }
.chat-size__row > div { flex: 1 1 140px; min-width: 0; display: grid; gap: 2px; }
.chat-size__row small { color: var(--mg-muted); font-size: 13px; }
.chat-size__row.is-cur { border-color: rgba(242, 138, 45, .6); background: rgba(242, 138, 45, .07); }
.chat-size__now { color: var(--mg-amber); font-size: 13px; font-weight: 600; }
.chat-size__err { margin: 0 0 8px; color: #ff7a6b; font-size: 14px; }
.chat-members { margin-bottom: 12px; }
.chat-members summary { cursor: pointer; color: var(--mg-hi); font-weight: 600; }
.chat-member { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 0; border-top: 1px solid rgba(246, 230, 197, .07); }
.chat-member:first-of-type { margin-top: 10px; }
.chat-member small { font-size: 11px; color: var(--mg-gold); }
.chat-member__acts { display: flex; flex-wrap: wrap; gap: 6px; margin-left: auto; }
.chat-box { display: flex; flex-direction: column; gap: 8px; height: clamp(320px, 56vh, 620px); overflow-y: auto; padding: 12px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(10, 9, 8, .9); overscroll-behavior: contain; }
.chat-empty { margin: auto; text-align: center; }
.chat-msg { align-self: flex-start; max-width: min(82%, 560px); padding: 8px 12px; border-radius: 12px 12px 12px 4px; background: rgba(246, 230, 197, .06); }
.chat-msg.is-mine { align-self: flex-end; border-radius: 12px 12px 4px 12px; background: rgba(242, 138, 45, .16); }
.chat-msg.is-hidden { opacity: .6; }
.chat-msg__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; font-size: 12px; }
.chat-msg__head b { color: var(--mg-hi); }
.chat-msg__head time { color: var(--mg-muted); font-size: 11px; }
.chat-msg__role { padding: 1px 6px; border-radius: 999px; background: rgba(242, 138, 45, .2); color: var(--mg-amber-lite); font-size: 10px; }
.chat-msg__text { margin-top: 3px; color: var(--mg-hi); font-size: 14px; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; }
.chat-msg__acts { display: flex; gap: 10px; margin-top: 2px; }
.chat-msg__acts:empty { display: none; }
.chat-msg__acts button { padding: 0; border: 0; background: none; color: var(--mg-muted); font-size: 11px; cursor: pointer; }
.chat-msg__acts button:hover { color: var(--mg-amber-lite); }
.chat-compose { display: flex; gap: 8px; margin-top: 10px; }
.chat-compose textarea { flex: 1 1 auto; min-width: 0; min-height: 46px; resize: vertical; }
.chat-hint { margin: 6px 0 0; font-size: 12px; }

/* пульт разработчика */
.dev-stats { margin-bottom: 4px; }
.dev-online { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 12px; font-size: 13px; color: var(--mg-hi); }
.dev-online__u { padding: 4px 10px; border-radius: 999px; background: rgba(111, 212, 106, .1); border: 1px solid rgba(111, 212, 106, .3); }
.dev-online__u small { color: var(--mg-muted); }
.dev-search { display: flex; gap: 8px; margin-bottom: 8px; }
.dev-search input { flex: 1 1 auto; min-width: 0; }
.dev-user { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px 0; border-top: 1px solid rgba(246, 230, 197, .07); }
.dev-user__who { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.dev-user__who b { color: var(--mg-hi); }
.dev-user__who small { font-size: 12px; color: var(--mg-muted); overflow-wrap: anywhere; }
.dev-user__gid code { font-size: 11px; padding: 0 4px; border-radius: 4px; background: color-mix(in srgb, var(--mg-hi) 10%, transparent); }
.dev-user__gid--none { color: #c2410c !important; }
.dev-dot { display: inline-block; width: 8px; height: 8px; margin-left: 6px; border-radius: 50%; background: #6fd46a; vertical-align: middle; }
.dev-user__acts { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 6px; max-width: 560px; }
.dev-user__acts select { min-height: 34px; padding: 4px 8px; font-size: 12px; }
.dev-config .form-grid { align-items: end; }
.dev-partner { display: grid; grid-template-columns: 120px repeat(3, minmax(0, 1fr)) auto; gap: 8px; align-items: center; padding: 10px 0; border-top: 1px solid rgba(246, 230, 197, .07); }
.dev-partner b { color: var(--mg-hi); font-size: 13px; }

/* админка */
.admin-head__lead { margin: 8px 0 0; max-width: 60ch; color: var(--mg-copy); font-size: 14px; line-height: 1.5; }
.admin-tabs { display: flex; gap: 8px; margin: 0 0 16px; overflow-x: auto; scrollbar-width: none; }
.admin-tabs::-webkit-scrollbar { display: none; }
.admin-tabs a { flex: 0 0 auto; padding: 8px 14px; border: 1px solid var(--mg-border); border-radius: 999px; background: rgba(246, 230, 197, .03); color: var(--mg-copy); font-size: 13px; text-decoration: none; transition: border-color .2s var(--ease), color .2s var(--ease); }
.admin-tabs a:hover { border-color: rgba(248, 180, 90, .55); color: var(--mg-hi); }
.admin-stats { display: grid; grid-template-columns: 1.35fr 1.15fr 1fr 1fr; gap: 12px; }
.admin-stat { position: relative; display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: 16px 18px; border: 1px solid var(--mg-border); border-radius: 16px; background: rgba(246, 230, 197, .03); color: inherit; text-decoration: none; overflow: hidden; }
.admin-stat b { font: 700 clamp(30px, 4vw, 42px)/1 var(--display); color: var(--mg-hi); }
.admin-stat span { font-size: 13px; color: var(--mg-hi); }
.admin-stat small { font-size: 12px; color: var(--mg-muted, rgba(246, 230, 197, .55)); }
.admin-stat--main { border-color: rgba(248, 180, 90, .4); background: radial-gradient(120% 140% at 0% 0%, rgba(248, 180, 90, .16), rgba(246, 230, 197, .03) 60%); }
.admin-stat--main b { background: var(--grad-cta); -webkit-background-clip: text; background-clip: text; color: transparent; font-size: clamp(38px, 5vw, 54px); }
.admin-stat--live { border-color: rgba(111, 212, 106, .35); background: radial-gradient(120% 140% at 0% 0%, rgba(111, 212, 106, .12), rgba(246, 230, 197, .03) 60%); }
.admin-stat--live b { color: #b9f3b5; }
.admin-stat--warn { border-color: rgba(255, 122, 89, .5); }
.admin-stat--warn b { color: #FFB199; }
a.admin-stat:hover { border-color: rgba(248, 180, 90, .55); }
.admin-note { margin: -4px 0 10px; font-size: 13px; }
#admin-people, #admin-rates, #admin-partners { scroll-margin-top: 84px; }
.admin-count { margin: 4px 0 2px; font-size: 13px; color: var(--mg-copy); }
.admin-count b { color: var(--mg-hi); }
@media (max-width: 860px) {
  .admin-stats { grid-template-columns: 1fr 1fr; gap: 10px; }
  .admin-stat { padding: 14px; border-radius: 14px; }
}

@media (max-width: 860px) {
  .dev-user { grid-template-columns: minmax(0, 1fr); }
  .dev-user__acts { justify-content: flex-start; }
  .dev-partner { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
  .bal-chip { height: 32px; padding: 0 9px 0 7px; font-size: 12px; gap: 6px; }
  .bal-chip__cur { gap: 3px; }
  .bal-chip__cur + .bal-chip__cur { padding-left: 6px; }
  .bal-chip__gem { width: 15px; height: 15px; }
  .bal-chip__sym { width: 14px; height: 14px; font-size: 9px; }
  .bal-chip:not([hidden]) { display: inline-grid; grid-template-columns: auto auto; justify-content: center; align-content: center; column-gap: 7px; row-gap: 2px; height: 36px; padding: 0 10px; border-radius: 12px; }
  .bal-chip__cur:first-child { grid-column: 1 / -1; justify-self: center; font-size: 12px; }
  .bal-chip__cur + .bal-chip__cur { padding-left: 0; border-left: 0; font-size: 10px; }
  .bal-chip__gem { width: 13px; height: 13px; }
  .bal-chip__sym { width: 11px; height: 11px; font-size: 7px; }
  .bal-chip__rank { padding: 1px 4px; font-size: 8px; border-radius: 5px; }
  .fx__grid { grid-template-columns: minmax(0, 1fr); }
  .fx__swap { margin: 0 auto; }
  .fx__swap svg { transform: none; }
  .fx__go { width: 100%; }
  .online-chip { height: 32px; padding: 0 8px; gap: 7px; }
  .online-chip__reg { padding-right: 7px; }
  .online-chip__lbl { display: none; }
  .expiry { grid-template-columns: 64px minmax(0, 1fr); gap: 12px; padding: 14px; }
  .expiry__mascot { width: 64px; height: 64px; }
  .expiry__clock { width: 30px; height: 30px; border-width: 2px; }
  .expiry__clock::before { top: 4px; height: 9px; transform-origin: 50% 9px; }
  .expiry__clock b { top: 3px; height: 10px; transform-origin: 50% 10px; }
  .expiry__text { font-size: 13px; }
  .pcube { width: 124px; }
  .podium { padding: 14px 12px; }
  .podium__head { flex-direction: column; align-items: stretch; }
  .podium__head .btn { align-self: flex-start; }
  .podium__grid, .podium__grid--2 { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .podium__card { flex-direction: row; align-items: stretch; }
  .podium__cover, .podium__card:not(.has-cover) .podium__cover { flex: 0 0 92px; aspect-ratio: auto; min-height: 62px; }
  .podium__medal { top: 6px; left: 6px; width: 24px; height: 24px; font-size: 12px; }
  .podium__text { justify-content: center; padding: 8px 12px; }
  .podium__text b { font-size: 13px; }
  .chat-head__acts .btn { width: auto; flex: 1 1 auto; }
  .daily-row { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "t t" "c v" "a a"; row-gap: 6px; }
  .daily-row > .btn { justify-self: start; }
  .cab-strip { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 4px; }
  .cab-strip__item { flex: 0 0 158px; scroll-snap-align: start; }
  .wallet-cards { gap: 8px; }
  .wallet-card { padding: 12px 10px; }
  .wallet-card__icon { width: 26px; height: 26px; font-size: 13px; }
  .wallet-card__icon svg { width: 18px; height: 18px; }
  .wallet-card__top { gap: 4px; }
  .wallet-rank { gap: 3px; padding: 4px 7px; }
  .wallet-rank__lbl { display: none; }
  .wallet-card .wallet-rank b { font-size: 13px; }
  .wallet-rank small { font-size: 9px; }
  .wallet-out { padding: 5px 8px; font-size: 9px; letter-spacing: .03em; }
  .wallet-hist__row { grid-template-columns: minmax(0, 1fr) auto; }
  .wallet-hist__row time { grid-column: 1; grid-row: 2; }
  .wallet-hist__row b { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
  .tops-tabs { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; }
  .tops-tabs .filter { flex: 0 0 auto; }
  .top-row { grid-template-columns: 26px 34px minmax(0, 1fr) auto; gap: 10px; padding: 10px 12px; }
  .top-row__av { width: 34px; height: 34px; }
  .fb-item { padding: 14px; }
  .fb-item__who { margin-left: 0; flex-basis: 100%; }
  .chat-card { flex-direction: column; gap: 10px; }
  .chat-card__side { flex-direction: row; align-items: center; }
  .chat-box { height: clamp(300px, 52dvh, 520px); }
  .chat-msg { max-width: 88%; }
}
html.no-anim .celebrate, html.no-anim .celebrate__gem, html.no-anim .celebrate__btn, html.no-anim .expiry__mascot--cube img, html.no-anim .expiry__clock::before, html.no-anim .expiry__clock b, html.no-anim .online-chip i, html.no-anim .bal-chip.is-pulse { animation: none; }
/* Продвигаемый материал: плашка досмотра */
.promo-pill { position: fixed; left: 50%; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 190; display: flex; align-items: center; gap: 12px; width: min(460px, calc(100vw - 24px)); padding: 12px 14px 14px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(14, 13, 11, .96); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 18px 50px rgba(0, 0, 0, .55); color: var(--mg-hi, #f3eee4); transform: translateX(-50%); animation: promoPillIn .28s var(--ease, ease) both; overflow: hidden; }
.promo-pill__icon { flex: 0 0 auto; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--mg-gold, #d4b483); color: var(--mg-gold, #d4b483); font: 600 11px/1 var(--mono, monospace); }
.promo-pill__text { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.promo-pill__text b { font: 600 14px/1.3 inherit; }
.promo-pill__text small { color: var(--mg-mid, #b9b1a3); font-size: 12.5px; line-height: 1.35; }
.promo-pill__text small a { color: var(--mg-gold, #d4b483); }
.promo-pill__bar { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(255, 255, 255, .08); }
.promo-pill__bar i { display: block; height: 100%; width: 0; background: var(--mg-gold, #d4b483); transition: width .6s linear; }
.promo-pill.is-done { border-color: rgba(120, 200, 140, .55); }
.promo-pill__check { flex: 0 0 auto; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #3f9b5a; color: #fff; font-weight: 700; animation: promoCheck .4s var(--ease, ease) both; }
@keyframes promoPillIn { from { opacity: 0; transform: translate(-50%, 12px); } to { opacity: 1; transform: translate(-50%, 0); } }
@keyframes promoCheck { from { transform: scale(.4); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@media (max-width: 860px) {
  .promo-pill { bottom: calc(80px + env(safe-area-inset-bottom)); width: calc(100vw - 60px); }
}
html.no-anim .promo-pill, html.no-anim .promo-pill__check { animation: none; }
/* Обращения: скриншоты */
.fb-attach { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 4px 0 12px; }
.fb-attach__hint { color: var(--mg-mid, #b9b1a3); font-size: 12.5px; line-height: 1.4; }
.fb-attach__list:empty { display: none; }
.fb-attach__list, .fb-item__shots { display: flex; flex-wrap: wrap; gap: 8px; width: 100%; }
.fb-shot { position: relative; display: block; width: 96px; height: 72px; margin: 0; border: 1px solid var(--mg-border); border-radius: 10px; overflow: hidden; background: rgba(255, 255, 255, .04); }
.fb-shot img { display: block; width: 100%; height: 100%; object-fit: cover; }
a.fb-shot { transition: border-color .2s var(--ease, ease); }
a.fb-shot:hover { border-color: var(--mg-gold, #d4b483); }
.fb-shot__del { position: absolute; top: 4px; right: 4px; display: grid; place-items: center; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 50%; background: rgba(0, 0, 0, .72); color: #fff; font-size: 16px; line-height: 1; cursor: pointer; }
.fb-item__shots { margin: 10px 0 4px; }
.fb-item__shotnote { margin: 8px 0 0; font-size: 12.5px; }
/* Загрузка видео */
.vprog { position: fixed; left: 50%; top: calc(var(--nav-h, 60px) + var(--gdz-safe-top, 0px) + 10px); z-index: 400; width: min(520px, calc(100vw - 24px)); padding: 14px 16px 12px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(14, 13, 11, .97); box-shadow: 0 18px 50px rgba(0, 0, 0, .6); color: var(--mg-hi, #f3eee4); transform: translateX(-50%); }
.vprog__row { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; }
.vprog__text { font-size: 14px; line-height: 1.35; }
.vprog__pct { font: 600 13px/1 var(--mono, monospace); color: var(--mg-gold, #d4b483); }
.vprog__bar { height: 6px; margin: 10px 0 8px; border-radius: 3px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.vprog__bar i { display: block; height: 100%; width: 0; border-radius: 3px; background: linear-gradient(90deg, #f39a3b, #f0b45e); transition: width .4s linear; }
.vprog small { display: block; color: var(--mg-mid, #b9b1a3); font-size: 12px; line-height: 1.4; }

/* Кабинет: канал сверху */
.avatar--xs { width: 24px; height: 24px; font-size: 10px; }
.cab-hero { margin: 0 0 16px; border: 1px solid var(--mg-border); border-radius: 18px; overflow: hidden; background: rgba(255, 255, 255, .025); }
.cab-hero__banner { position: relative; height: clamp(110px, 18vw, 180px); background: linear-gradient(135deg, #2a1d12, #12100d 60%, #1f1a12) center / cover no-repeat; }
.cab-hero__chip { position: absolute; right: 12px; bottom: 12px; padding: 7px 12px; border: 1px solid rgba(255, 255, 255, .25); border-radius: 999px; background: rgba(0, 0, 0, .55); color: #fff; font: 600 12.5px/1 var(--body); cursor: pointer; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.cab-hero__chip:hover { border-color: var(--mg-amber, #f28a2d); }
.cab-hero__body { display: grid; grid-template-columns: auto 1fr auto; gap: 16px; align-items: start; padding: 0 18px 16px; margin-top: -36px; }
.cab-hero__avatar { position: relative; padding: 0; border: 0; background: none; cursor: pointer; border-radius: 50%; }
.cab-hero__avatar .avatar--xl { width: 96px; height: 96px; border: 4px solid #12100d; }
.cab-hero__cam { position: absolute; right: 2px; bottom: 4px; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--mg-amber, #f28a2d); color: #120e0a; border: 3px solid #12100d; }
.cab-hero__avatar:hover .cab-hero__cam { transform: scale(1.08); }
.cab-hero__info { min-width: 0; padding-top: 48px; }
.cab-hero__name { font: 700 clamp(1.25rem, 2.4vw, 1.6rem)/1.15 var(--display); color: var(--mg-hi); }
.cab-hero__desc { margin: 6px 0 0; color: var(--mg-copy); font-size: 14px; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; max-width: 70ch; }
.cab-hero__actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; align-self: end; }
.cab-hero__channels { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 18px 14px; border-top: 1px solid var(--mg-border); }
.cab-hero__label { font: 600 11px/1 var(--display); letter-spacing: .06em; text-transform: uppercase; color: var(--mg-gold); margin-right: 4px; }
.cab-ch { display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px 5px 6px; border: 1px solid var(--mg-border); border-radius: 999px; background: transparent; color: var(--mg-copy); font: 500 13px/1 var(--body); cursor: pointer; list-style: none; }
.cab-ch::-webkit-details-marker { display: none; }
.cab-ch.is-on { border-color: var(--mg-amber, #f28a2d); color: var(--mg-hi); background: rgba(242, 138, 45, .12); }
.cab-ch--add { padding: 7px 12px; color: var(--mg-gold); border-style: dashed; }
.cab-newch { position: relative; }
.cab-newch[open] .cab-newch__form { display: grid; }
.cab-newch__form { position: absolute; z-index: 30; top: calc(100% + 8px); left: 0; width: min(340px, 86vw); display: none; grid-template-columns: 1fr auto; gap: 8px; padding: 12px; border: 1px solid var(--mg-border); border-radius: 12px; background: #14110d; box-shadow: 0 18px 50px rgba(0, 0, 0, .6); }
.cab-newch__form input { min-width: 0; padding: 8px 10px; border: 1px solid rgba(212, 161, 75, .3); border-radius: 8px; background: rgba(7, 7, 6, .85); color: var(--mg-hi); }
.cab-newch__form p { grid-column: 1 / -1; margin: 0; font-size: 12px; line-height: 1.4; }
.cab-more > summary { cursor: pointer; font: 600 1rem/1.2 var(--display); color: var(--mg-hi); }
.cab-more[open] > summary { margin-bottom: 12px; }
@media (max-width: 760px) {
  .cab-hero__body { grid-template-columns: auto 1fr; gap: 12px; padding: 0 14px 14px; margin-top: -30px; }
  .cab-hero__avatar .avatar--xl { width: 80px; height: 80px; }
  .cab-hero__info { padding-top: 40px; }
  .cab-hero__actions { grid-column: 1 / -1; justify-content: flex-start; }
  .cab-hero__channels { padding: 10px 14px 12px; }
}

/* Путь к монетизации */
.mon-card { margin: 0 0 16px; padding: 14px 16px; border: 1px solid var(--mg-border); border-radius: 14px; background: linear-gradient(135deg, rgba(242, 138, 45, .08), rgba(255, 255, 255, .02)); }
.mon-card.is-open { border-color: rgba(120, 200, 140, .45); }
.mon-card__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 6px 12px; margin-bottom: 10px; }
.mon-card__head b { font: 700 15px/1.2 var(--display); color: var(--mg-hi); }
.mon-card__head .muted { font-size: 13px; }
.mon-card__row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.mon-card__label { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; color: var(--mg-copy); }
.mon-card__label b { color: var(--mg-hi); font-weight: 600; white-space: nowrap; }
.mon-card small { display: block; margin-top: 5px; color: var(--mg-muted); font-size: 12px; }
.mon-bar { height: 8px; margin-top: 7px; border-radius: 99px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.mon-bar i { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, #c45c26, #f0b45e); transition: width .5s; }
.mon-bar--muted i { width: 0 !important; }
@media (max-width: 760px) { .mon-card__row { grid-template-columns: 1fr; gap: 10px; } }

/* Кадрирование: заполнить / целиком */
.img-crop__modes { display: flex; flex-wrap: wrap; gap: 8px; margin: 2px 0 10px; }
.img-crop__seg, .article-editor__seg { display: inline-flex; border: 1px solid rgba(212, 161, 75, .3); border-radius: 10px; overflow: hidden; }
.img-crop__seg[hidden] { display: none; }
.img-crop__seg button { appearance: none; border: 0; background: transparent; color: var(--mg-copy); font: 600 12.5px/1 var(--body); padding: 9px 12px; cursor: pointer; }
.img-crop__seg button + button { border-left: 1px solid rgba(212, 161, 75, .22); }
.img-crop__seg button.is-on { background: rgba(242, 138, 45, .18); color: var(--mg-hi); }

/* Вкладка «Фото»: одна строка */
.article-editor__panel--photo { gap: 6px 8px; padding: 6px 10px; min-height: 0; flex-wrap: wrap; }
.article-editor__panel--photo .article-editor__vsep { min-height: 22px; }
.article-editor__field { display: inline-flex; align-items: center; gap: 6px; font: 600 10px/1 var(--display); letter-spacing: .06em; text-transform: uppercase; color: var(--mg-gold); }
.article-editor__panel--photo .article-editor__select { min-height: 30px; max-width: 190px; }
.article-editor__seg .article-editor__tool { border: 0; border-radius: 0; min-width: 30px; min-height: 30px; background: transparent; }
.article-editor__seg .article-editor__tool + .article-editor__tool { border-left: 1px solid rgba(212, 161, 75, .22); }
.article-editor__seg .article-editor__tool.is-on { background: rgba(242, 138, 45, .2); color: var(--mg-hi); }
.article-editor__panel--photo .article-editor__tool { min-height: 30px; }
.article-editor__tool--danger:hover { border-color: #d9534f; color: #ffb3a8; }
.article-editor__panel--photo:not(.has-photo) .article-editor__field,
.article-editor__panel--photo:not(.has-photo) .article-editor__seg,
.article-editor__panel--photo:not(.has-photo) [data-photo-act] { opacity: .45; }
.article-editor__panel--photo:not(.has-photo)::after { content: "Нажмите на фото в тексте, чтобы настроить его"; font-size: 12px; color: var(--mg-muted); }
@media (max-width: 900px) {
  .article-editor__body { display: block; overflow-y: auto; overscroll-behavior: contain; }
  .article-editor__side { max-height: none; }
  .article-editor__canvas-wrap { overflow: visible; padding: 12px 12px 40px; }
  .article-editor__tabs { flex-wrap: nowrap; }
  .article-editor__ribbon { top: 0; }
  .article-editor__panel.is-on,
  .article-editor__panel--photo { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .article-editor__panel::-webkit-scrollbar { display: none; }
  .article-editor__panel > * { flex: 0 0 auto; }
  .article-editor__palette,
  .article-editor__history { position: fixed; top: auto; left: 12px; right: 12px; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); width: auto; z-index: 1200; }
  .article-editor__palette { grid-template-columns: repeat(auto-fill, minmax(30px, 1fr)); }
  .article-editor__palette .article-editor__swatch { width: 30px; height: 30px; }
  .article-editor__panel--photo:not(.has-photo)::after { white-space: nowrap; }
  .article-editor__field > span { display: none; }
}

/* Фото в тексте: без серых полей, рамки */
.editor-figure img { background: transparent; }
.editor-figure--full img,
.editor-figure--size-full img { max-height: none; object-fit: cover; }
.post-figure--full, .editor-figure--full { border-radius: 12px; }
.post-figure--frame-clean, .editor-figure--frame-clean { border: 0; border-radius: 0; background: none; }
.post-figure--frame-shadow, .editor-figure--frame-shadow { border: 0; border-radius: 14px; box-shadow: 0 14px 40px rgba(0, 0, 0, .5); }
.post-figure--frame-blur, .editor-figure--frame-blur { border: 0; border-radius: 14px; background: #0a0908; isolation: isolate; }
.post-figure--frame-blur::before, .editor-figure--frame-blur::before { content: ""; position: absolute; inset: -30px; background: var(--fig-src) center / cover no-repeat; filter: blur(28px) brightness(.62) saturate(1.15); z-index: 0; }
.post-figure--frame-blur img, .editor-figure--frame-blur img { position: relative; z-index: 1; width: 100%; max-height: min(78vh, 720px); object-fit: contain; background: transparent; }
.article-editor__content figure { scroll-margin-top: 130px; scroll-margin-bottom: 20px; }
.editor-figure.is-importing { opacity: .6; }
.editor-figure.is-importing::after { content: "Сохраняем фото…"; position: absolute; left: 10px; bottom: 10px; z-index: 2; padding: 4px 8px; border-radius: 8px; background: rgba(0, 0, 0, .7); color: #fff; font-size: 12px; }

/* Оглавление */
.toc-box { margin: 0 0 1.6em; padding: 16px 18px 12px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(255, 255, 255, .025); }
.toc-box__title { font: 700 13px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--mg-gold); margin-bottom: 10px; }
.toc-box__list { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; color: var(--mg-muted); counter-reset: toc; }
.toc-box__item { position: relative; padding-left: 1.7em; }
.toc-box__item:not(.toc-box__item--sub) { counter-increment: toc; }
.toc-box__item:not(.toc-box__item--sub)::before { content: counter(toc) "."; position: absolute; left: 0; top: 5px; min-width: 1.3em; color: var(--mg-gold); font: 600 14px/1.4 var(--body); }
.toc-box__item--sub { margin-left: 1.1em; }
.toc-box__item--sub::before { content: ""; position: absolute; left: .5em; top: .95em; width: 5px; height: 5px; border-radius: 50%; border: 1px solid var(--mg-muted); }
.post-body li > ul, .post-body li > ol { margin-top: .25em; margin-bottom: .25em; }
.toc-box__item button, .toc-rail__item button { appearance: none; border: 0; background: none; padding: 5px 0; margin: 0; color: var(--mg-copy); font: 500 15px/1.4 var(--body); text-align: left; cursor: pointer; }
.toc-box__item button:hover { color: var(--mg-amber-lite, #f5b26b); }
.toc-target { scroll-margin-top: 90px; transition: color .4s; }
.toc-target.is-flash { color: var(--mg-amber-lite, #f5b26b); }
.toc-rail { position: fixed; top: 50%; z-index: 60; transform: translateY(-50%); opacity: 0; pointer-events: none; transition: opacity .25s; }
.toc-rail.is-on { opacity: 1; pointer-events: auto; }
.toc-rail__bars { display: flex; flex-direction: column; gap: 7px; padding: 10px 8px; cursor: pointer; }
.toc-rail__bar { display: block; width: 22px; height: 3px; border-radius: 2px; background: rgba(255, 255, 255, .22); transition: background .2s, width .2s; }
.toc-rail__bar--sub { width: 14px; margin-left: 8px; }
.toc-rail__bar.is-past { background: rgba(212, 161, 75, .55); }
.toc-rail__bar.is-on { background: var(--mg-amber, #f28a2d); width: 28px; }
.toc-rail__bar--sub.is-on { width: 20px; }
.toc-rail__pop { position: absolute; left: 0; top: 50%; transform: translate(-6px, -50%); width: 320px; max-height: 70vh; overflow: auto; padding: 14px 16px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(14, 13, 11, .98); box-shadow: 0 20px 60px rgba(0, 0, 0, .6); opacity: 0; visibility: hidden; transition: opacity .18s, transform .18s, visibility .18s; }
.toc-rail:hover .toc-rail__pop, .toc-rail:focus-within .toc-rail__pop { opacity: 1; visibility: visible; transform: translate(0, -50%); }
.toc-rail__title { font: 700 12px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--mg-gold); margin-bottom: 8px; }
.toc-rail__list { margin: 0; padding: 0; list-style: none; }
.toc-rail__item button { font-size: 14px; padding: 6px 0 6px 10px; border-left: 2px solid transparent; width: 100%; }
.toc-rail__item--sub button { padding-left: 22px; font-size: 13.5px; color: var(--mg-muted); }
.toc-rail__item button:hover { color: var(--mg-hi); }
.toc-rail__item.is-on button { border-left-color: var(--mg-amber, #f28a2d); color: var(--mg-hi); }

/* Окно публикации */
body.gdz-pub-open { overflow: hidden; }
.pub-dlg { position: fixed; inset: 0; z-index: 11000; display: grid; place-items: center; padding: 16px; background: rgba(0, 0, 0, .72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.pub-dlg__card { width: min(920px, 100%); max-height: min(92dvh, 100%); overflow: auto; padding: 18px 20px; border: 1px solid var(--mg-border); border-radius: 18px; background: #12100d; box-shadow: 0 30px 90px rgba(0, 0, 0, .7); }
.pub-dlg__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.pub-dlg__head b { font: 700 20px/1.1 var(--display); color: var(--mg-hi); }
.pub-dlg__grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 22px; }
.pub-dlg__col { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.pub-dlg__label { margin-top: 6px; font: 600 11px/1.2 var(--display); letter-spacing: .06em; text-transform: uppercase; color: var(--mg-gold); }
.pub-dlg__label .muted { text-transform: none; letter-spacing: 0; font-weight: 500; }
.pub-dlg__input { width: 100%; padding: 10px 12px; border: 1px solid rgba(212, 161, 75, .3); border-radius: 10px; background: rgba(7, 7, 6, .85); color: var(--mg-hi); font: 400 14.5px/1.45 var(--body); resize: vertical; }
.pub-dlg__input--title { font: 700 17px/1.3 var(--display); }
.pub-dlg__count { align-self: flex-end; font-size: 12px; color: var(--mg-muted); }
.pub-dlg__row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pub-dlg__field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.pub-dlg__toc { margin: 2px 0 0; padding: 0; list-style: none; max-height: 170px; overflow: auto; color: var(--mg-copy); font-size: 14px; line-height: 1.5; }
.pub-dlg__toc li { position: relative; padding-left: 14px; }
.pub-dlg__toc li::before { content: ""; position: absolute; left: 0; top: .62em; width: 6px; height: 6px; border-radius: 50%; background: var(--mg-amber); }
.pub-dlg__toc li.is-sub { margin-left: 16px; color: var(--mg-muted); }
.pub-dlg__toc li.is-sub::before { background: transparent; border: 1px solid var(--mg-muted); }
.pub-dlg__toc li.muted::before { display: none; }
.pub-dlg__hint { margin: 4px 0 0; font-size: 12.5px; color: var(--mg-muted); line-height: 1.4; }
.pub-dlg__cover { position: relative; aspect-ratio: 16 / 9; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(255, 255, 255, .03) center / cover no-repeat; display: grid; place-items: center; color: var(--mg-muted); font-size: 13px; transition: box-shadow .2s; }
.pub-dlg__cover.is-need { box-shadow: 0 0 0 2px var(--mg-amber, #f28a2d); }
.pub-dlg__cover-edit { position: absolute; right: 10px; bottom: 10px; }
.pub-dlg__photos { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; max-height: 210px; overflow: auto; padding: 2px; }
.pub-dlg__ph { aspect-ratio: 4 / 3; border: 1px solid var(--mg-border); border-radius: 10px; background: #0a0908 center / cover no-repeat; cursor: pointer; transition: border-color .15s, transform .15s; }
.pub-dlg__ph:hover { border-color: var(--mg-amber, #f28a2d); transform: translateY(-1px); }
.pub-dlg__ph--add { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; color: var(--mg-gold); font-size: 20px; border-style: dashed; background: rgba(242, 138, 45, .05); }
.pub-dlg__ph--add span { font-size: 11px; color: var(--mg-muted); }
.pub-dlg__actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 16px; }
.pub-dlg__actions { position: sticky; bottom: -18px; z-index: 2; margin: 16px -20px -18px; padding: 12px 20px 14px; background: #12100d; border-top: 1px solid var(--mg-border); }
.pub-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 2px; border-radius: 12px; transition: box-shadow .2s; }
.pub-chips.is-need { animation: pubNeed 1.2s ease; }
@keyframes pubNeed { 0%, 60% { box-shadow: 0 0 0 2px var(--mg-amber, #f28a2d); } 100% { box-shadow: 0 0 0 0 transparent; } }
.pub-chip { min-height: 34px; padding: 6px 12px; border: 1px solid rgba(212, 161, 75, .28); border-radius: 999px; background: rgba(7, 7, 6, .6); color: var(--mg-copy); font: 500 13.5px/1.2 var(--body); cursor: pointer; transition: border-color .15s, background .15s, color .15s; }
.pub-chip:hover { border-color: var(--mg-amber, #f28a2d); color: var(--mg-hi); }
.pub-chip.is-on { border-color: var(--mg-amber, #f28a2d); background: linear-gradient(135deg, #f28a2d, #d9661a); color: #160c04; font-weight: 700; }
.pub-chip--sub { min-height: 30px; padding: 4px 10px; font-size: 12.5px; }
.pub-chip--sub.is-on { background: rgba(242, 138, 45, .2); color: var(--mg-hi); }
.pub-seg { display: inline-flex; align-self: flex-start; padding: 3px; border: 1px solid rgba(212, 161, 75, .28); border-radius: 999px; background: rgba(7, 7, 6, .6); }
.pub-seg__btn { min-height: 32px; padding: 6px 14px; border: 0; border-radius: 999px; background: none; color: var(--mg-copy); font: 600 13px/1 var(--body); cursor: pointer; }
.pub-seg__btn.is-on { background: rgba(242, 138, 45, .22); color: var(--mg-hi); }
.pub-dlg__vup { margin: 0 0 14px; }
.pub-dlg__actions .btn:disabled { opacity: .5; cursor: not-allowed; }
.article-editor__body--solo { grid-template-columns: minmax(0, 1fr); }
.article-editor__side[hidden] { display: none !important; }
.article-editor--video .article-editor__content { min-height: 140px; }
@media (max-width: 760px) {
  .pub-dlg { padding: 0; align-items: end; }
  .pub-dlg__card { border-radius: 18px 18px 0 0; max-height: 94dvh; padding: 16px 14px calc(14px + env(safe-area-inset-bottom)); }
  .pub-dlg__grid { grid-template-columns: 1fr; gap: 10px; }
  .pub-dlg__row { grid-template-columns: 1fr; }
  .pub-dlg__photos { grid-template-columns: repeat(3, 1fr); }
  .pub-chips { max-height: 196px; overflow-y: auto; }
  .pub-dlg__actions { position: sticky; bottom: calc(-14px - env(safe-area-inset-bottom)); margin: 12px -14px 0; padding: 10px 14px; background: #12100d; border-top: 1px solid var(--mg-border); }
  .pub-dlg__actions .btn { flex: 1; }
}
/* Платное оформление в редакторе: кнопки активные, на углу маленький замок */
.is-free-editor [data-paid]:not(select),
.is-free-editor [data-paid-wrap] { position: relative; }
.is-free-editor [data-paid]:not(select)::after,
.is-free-editor [data-paid-wrap]::after {
  content: ""; position: absolute; top: 2px; right: 2px; width: 11px; height: 11px; border-radius: 50%;
  background: var(--mg-amber, #f28a2d) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23120f0b' d='M5 7V5a3 3 0 0 1 6 0v2h.5A1.5 1.5 0 0 1 13 8.5v4A1.5 1.5 0 0 1 11.5 14h-7A1.5 1.5 0 0 1 3 12.5v-4A1.5 1.5 0 0 1 4.5 7H5zm1.6 0h2.8V5a1.4 1.4 0 0 0-2.8 0v2z'/%3E%3C/svg%3E") center / 7px no-repeat;
  box-shadow: 0 0 0 1.5px #12100d; pointer-events: none;
}
.is-free-editor [data-paid-wrap].article-editor__field::after { top: -3px; right: -5px; }
.article-editor__paidwrap { display: inline-flex; }
.article-editor__devtier { margin-left: auto; align-self: center; min-height: 26px; padding: 0 10px; border: 1px dashed rgba(212, 161, 75, .45); border-radius: 999px; background: transparent; color: var(--mg-gold); font: 600 10px/1 var(--display); letter-spacing: .06em; text-transform: uppercase; cursor: pointer; white-space: nowrap; }
.article-editor__devtier:hover { border-color: var(--mg-amber, #f28a2d); color: var(--mg-hi); }
.editor-paywall .plat-modal__box p { font-size: 14px; }
.editor-paywall .btn--ghost { margin-top: 8px; }
.editor-paywall__dev { width: 100%; margin-top: 10px; border-style: dashed; }.editor-paywall .plat-modal__box p { margin: 0 0 10px; }
@media (min-width: 901px) {
  .is-free-editor [data-paid]:not(select)::after,
  .is-free-editor [data-paid-wrap]::after { top: -5px; right: -5px; }
}
/* Подтема в редакторе и на карточке */
.editor-subtopic { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; font: 600 10px/1 var(--display); letter-spacing: .06em; text-transform: uppercase; color: var(--mg-gold); }
.editor-subtopic select { min-height: 40px; padding: 0 10px; border: 1px solid rgba(212, 161, 75, .3); border-radius: 10px; background: rgba(12, 11, 9, .9); color: var(--mg-hi); font: 500 14px/1.2 var(--body, inherit); letter-spacing: 0; text-transform: none; }
.card__topic { max-width: calc(100% - 20px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* прогресс загрузки видео поверх редактора (редактор — z-index 900) */
.vprog { z-index: 1050; }
.article-editor__top-actions button:disabled { opacity: .85; cursor: progress; }
@media (max-width: 760px) {
  body.gdz-editor-open .vprog { top: auto; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); }
}
/* Загрузка видео сразу после выбора файла — статус под плеером */
.vup { margin: 10px 0 12px; padding: 12px 14px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(14, 13, 11, .75); color: var(--mg-hi, #f3eee4); }
.vup[hidden] { display: none; }
.vup__row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 14px; line-height: 1.35; }
.vup__pct { font: 600 14px/1 var(--mono, monospace); color: var(--mg-gold, #d4b483); }
.vup__bar { position: relative; height: 6px; margin: 10px 0 8px; border-radius: 3px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.vup__bar i { display: block; height: 100%; width: 0; border-radius: 3px; background: linear-gradient(90deg, #f39a3b, #f0b45e); transition: width .4s linear; }
.vup__sub { margin: 0; color: var(--mg-mid, #b9b1a3); font-size: 12.5px; line-height: 1.45; }
.vup [data-vup-retry] { margin-top: 10px; }
.vup.is-retry .vup__sub { color: #e8c98a; }
.vup.is-processing .vup__bar i { background: linear-gradient(90deg, #6fa8dc, #9cc7ee); }
.vup.is-indeterminate .vup__bar i { position: absolute; left: 0; animation: vup-slide 1.4s ease-in-out infinite; }
@keyframes vup-slide { 0% { transform: translateX(-100%); } 100% { transform: translateX(340%); } }
.vup.is-done { border-color: rgba(120, 190, 120, .45); }
.vup.is-done .vup__bar i { background: #6fbf73; }
.vup.is-done b::before { content: "✓ "; color: #6fbf73; }
.vup.is-error { border-color: rgba(220, 110, 90, .55); }
.vup.is-error .vup__bar i { background: #d9725e; }
.vup.is-flash { animation: vup-flash .9s ease 2; }
@keyframes vup-flash { 50% { box-shadow: 0 0 0 3px rgba(240, 180, 94, .55); } }
.article-editor__top-actions button.is-wait {
  cursor: not-allowed;
  border-color: rgba(240, 180, 94, .35);
  background: linear-gradient(90deg, rgba(243, 154, 59, .38) var(--p, 0%), rgba(255, 255, 255, .05) var(--p, 0%));
  box-shadow: none;
  color: var(--mg-hi, #f3eee4);
  font-variant-numeric: tabular-nums;
}
html.no-anim .vup.is-indeterminate .vup__bar i, html.no-anim .vup.is-flash { animation: none; }
.article-editor__top-actions button.is-proc {
  background: linear-gradient(90deg, #f6a24a var(--p, 0%), #e8862f var(--p, 0%));
  font-variant-numeric: tabular-nums;
}
.pub-btn__st { font-weight: 500; opacity: .82; }
@media (max-width: 720px) { .pub-btn__w { display: none; } }
/* Статус ролика до выхода на сайт */
.vstate {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 3px 10px; border-radius: 999px; border: 1px solid;
  font: 600 12px/1.4 var(--body, inherit); white-space: nowrap; font-variant-numeric: tabular-nums;
}
.vstate::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.vstate--processing { color: #9cc7ee; border-color: rgba(111, 168, 220, .45); background: rgba(111, 168, 220, .1); }
.vstate--processing::before { animation: vstate-pulse 1.4s ease-in-out infinite; }
.vstate--moderation { color: #f0c27a; border-color: rgba(240, 180, 94, .45); background: rgba(240, 180, 94, .1); }
.vstate--rejected, .vstate--failed { color: #ec9a87; border-color: rgba(220, 110, 90, .5); background: rgba(220, 110, 90, .1); }
@keyframes vstate-pulse { 50% { opacity: .3; } }
.vstate-hint { display: block; margin-top: 4px; max-width: 34ch; color: var(--mg-muted); font-size: 12px; line-height: 1.35; white-space: normal; }
.vstate-page .vstate { margin-bottom: 10px; }
.mod-card__video { display: block; width: 100%; max-width: 420px; aspect-ratio: 16 / 9; margin: 8px 0; border-radius: 10px; background: #000; }
.mod-doc { width: min(900px, 100%); max-height: calc(100dvh - 32px); display: flex; flex-direction: column; }
.mod-doc__view { display: block; width: 100%; height: min(70dvh, 900px); border: 1px solid var(--mg-border); border-radius: 10px; background: #fff; object-fit: contain; }
.mod-card__audio { display: block; width: 100%; max-width: 420px; margin: 8px 0; }
.mod-card__facts { display: grid; gap: 3px; margin: 6px 0 10px; font-size: 13.5px; line-height: 1.4; overflow-wrap: anywhere; }
html.no-anim .vstate--processing::before { animation: none; }
@media (max-width: 720px) {
  .table.table--materials { display: block; overflow: visible; }
  .table--materials thead { display: none; }
  .table--materials tbody { display: block; }
  .table--materials tr {
    display: grid; grid-template-columns: 1fr auto; gap: 8px 12px; align-items: start;
    padding: 12px 14px; margin-bottom: 10px;
    border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(246, 230, 197, 0.02);
  }
  .table--materials tr:hover td { background: none; }
  .table--materials td { display: block; padding: 0; border: 0; }
  .table--materials td:nth-child(1) { font-weight: 600; font-size: 15px; line-height: 1.3; }
  .table--materials td:nth-child(2) { color: var(--mg-muted); font-size: 12px; text-align: right; }
  .table--materials td:nth-child(3) { grid-column: 1 / -1; }
  .table--materials td:nth-child(4) { display: none; }
  .table--materials td:nth-child(5) { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px; white-space: normal !important; }
  .table--materials td[colspan] { grid-column: 1 / -1; }
  .table--materials td[colspan]::before { content: none; }
  .vstate-hint { max-width: none; }
}
/* Админка: удержание аудитории */
#admin-retention { scroll-margin-top: 84px; }
.ret-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.ret-head .widget__title { margin: 0; }
.ret-period { display: inline-flex; padding: 3px; border: 1px solid var(--mg-border); border-radius: 999px; background: rgba(246, 230, 197, .03); }
.ret-period__b { min-height: 32px; padding: 0 14px; border: 0; border-radius: 999px; background: transparent; color: var(--mg-copy); font: 500 13px/1 var(--body, inherit); cursor: pointer; }
.ret-period__b.is-on { background: rgba(248, 180, 90, .18); color: var(--mg-hi); }
.ret-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ret-stats .admin-stat b { font-size: clamp(24px, 3vw, 34px); }
.ret-h { margin: 22px 0 4px; font: 700 15px/1.3 var(--display); letter-spacing: .02em; color: var(--mg-hi); }
.ret-sub { margin: 0 0 10px; font-size: 12.5px; line-height: 1.45; }
.ret-scroll { overflow-x: auto; border: 1px solid var(--mg-border); border-radius: 12px; }
.ret-table { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
.ret-table th, .ret-table td { padding: 9px 12px; text-align: right; white-space: nowrap; border-top: 1px solid rgba(246, 230, 197, .07); color: var(--mg-copy); }
.ret-table th { border-top: 0; font-weight: 600; font-size: 12px; color: var(--mg-muted); background: rgba(246, 230, 197, .03); }
.ret-table th:first-child, .ret-table td:first-child { text-align: left; color: var(--mg-hi); }
.ret-c { background: rgba(111, 212, 106, calc(var(--a, 0) * .45)); color: var(--mg-hi) !important; }
.ret-c--na { color: var(--mg-muted) !important; }
.ret-bad { color: #ffb199 !important; }
.ret-hours { display: grid; grid-template-columns: repeat(24, minmax(0, 1fr)); align-items: end; gap: 3px; height: 120px; padding: 10px 10px 0; border: 1px solid var(--mg-border); border-radius: 12px; }
.ret-hours__col { display: flex; flex-direction: column; justify-content: flex-end; align-items: center; height: 100%; gap: 4px; }
.ret-hours__col i { display: block; width: 100%; min-height: 2px; border-radius: 3px 3px 0 0; background: linear-gradient(180deg, #f0b45e, #c9772b); }
.ret-hours__col span { flex: 0 0 16px; height: 16px; font-size: 10px; color: var(--mg-muted); }
.ret-posts-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ret-posts { padding: 14px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(246, 230, 197, .02); min-width: 0; }
.ret-posts h4 { margin: 0 0 2px; font-size: 14px; color: var(--mg-hi); }
.ret-posts ol { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 8px; }
.ret-posts li { font-size: 13px; color: var(--mg-copy); }
.ret-posts li a { color: var(--mg-hi); text-decoration: none; overflow-wrap: anywhere; }
.ret-posts li a:hover { text-decoration: underline; }
.ret-posts li small { display: block; margin-top: 2px; font-size: 12px; color: var(--mg-muted); }
.ret-posts li small b { color: var(--mg-gold, #d4b483); font-weight: 600; }
.ret-tag { display: inline-block; margin-left: 4px; vertical-align: 1px; padding: 1px 6px; border-radius: 6px; background: rgba(111, 168, 220, .18); color: #9cc7ee; font-size: 11px; }
.dev-user__act { color: #b9d8b5 !important; }
.dev-search select { min-height: 40px; padding: 8px 10px; border: 1px solid var(--mg-border); border-radius: 10px; background: rgba(12, 11, 9, .9); color: var(--mg-hi); font-size: 13px; }
@media (max-width: 860px) {
  .ret-stats { grid-template-columns: 1fr 1fr; }
  .ret-posts-grid { grid-template-columns: 1fr; }
  .dev-search { flex-wrap: wrap; }
  .dev-search input { flex-basis: 100%; }
  .dev-search select { flex: 1 1 auto; }
}

/* Горячие клавиши: кнопка в ленте, окно и страница справки */
.article-editor__tab--keys { margin-left: auto; color: var(--mg-gold); text-transform: none; letter-spacing: .02em; }
.article-editor__tab--keys + .article-editor__devtier { margin-left: 6px; }
.hk-modal__box { max-width: 560px; }
.hk-lead { max-width: 720px; margin: 0 0 18px; color: var(--mg-copy); line-height: 1.5; }
.hk-page { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; max-width: 1040px; }
.hk-page .hk-group { padding: 14px 16px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(16, 14, 11, .85); }
.hk-group + .hk-group { margin-top: 0; }
.hk-modal .hk-group { margin-top: 14px; }
.hk-group__title { margin: 0 0 8px; font: 600 12px/1.2 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--mg-gold); }
.hk-list { display: grid; gap: 6px; margin: 0; }
.hk-row { display: grid; grid-template-columns: minmax(130px, 42%) 1fr; gap: 12px; align-items: baseline; padding: 6px 0; border-top: 1px solid var(--mg-hairline); }
.hk-row:first-child { border-top: 0; }
.hk-row dt { margin: 0; }
.hk-row dd { margin: 0; color: var(--mg-copy); font-size: 14px; line-height: 1.4; }
.hk-row kbd { display: inline-block; padding: 3px 8px; border: 1px solid rgba(212, 161, 75, .38); border-bottom-width: 2px; border-radius: 7px; background: rgba(246, 230, 197, .05); color: var(--mg-hi); font: 600 12px/1.35 ui-monospace, Consolas, monospace; white-space: normal; overflow-wrap: anywhere; }
.hk-plus { display: inline-block; margin-left: 4px; padding: 1px 7px; border-radius: 999px; background: rgba(242, 138, 45, .16); color: var(--mg-amber-lite); font-size: 11px; vertical-align: 1px; }
.hk-note { max-width: 720px; margin: 16px 0 0; color: var(--mg-muted); font-size: 13px; line-height: 1.5; }
@media (max-width: 860px) {
  .hk-page { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .hk-row { grid-template-columns: 1fr; gap: 4px; }
}
/* ── Уведомления ───────────────────────────────────────────────────── */
#notif-dd { width: min(360px, calc(100vw - 24px)); max-height: min(70vh, 520px); overflow-y: auto; overscroll-behavior: contain; }
.notif__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 6px 12px 8px; }
.notif__all { background: none; border: 0; padding: 4px 0; color: var(--mg-gold, #d4a14b); font: inherit; font-size: 12px; cursor: pointer; white-space: nowrap; }
.notif__all:hover { text-decoration: underline; }
.notif__item { position: relative; text-decoration: none; }
.notif__item b { font-weight: 500; color: var(--mg-copy); line-height: 1.35; }
.notif__item.is-unread { background: rgba(212, 161, 75, 0.07); }
.notif__item.is-unread b { font-weight: 700; color: var(--mg-ivory); }
.notif__time { display: flex; align-items: center; gap: 6px; margin-top: 4px; font-size: 12px; color: var(--mg-muted, rgba(240, 232, 214, 0.55)); }
.notif__new { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--mg-gold, #d4a14b); flex: none; }
.notif__badge { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; padding: 0 6px; margin-right: 6px; border-radius: 999px; background: var(--mg-gold, #d4a14b); color: #1a1208; font: 800 12px/1 var(--display, system-ui); flex: none; vertical-align: middle; }
.notif__studio-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.notif__row.is-unread { border-color: rgba(212, 161, 75, 0.45); }
.notif__row.is-unread .setting__title { font-weight: 700; }
.notif__row .setting__title a { color: inherit; }
.notif__mark { flex: none; white-space: nowrap; }
/* ── Новости ГранаДзяк ─────────────────────────────────────────────── */
.notif__kind { display: block; margin-bottom: 3px; font-size: 10px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--mg-gold); }
.notif__sub { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 3px; font-size: 12px; line-height: 1.4; color: var(--mg-copy); }
.notif__foot { display: block; margin: 6px 4px 2px; padding: 10px 8px; border-top: 1px solid var(--mg-border); color: var(--mg-gold); font-size: 13px; text-align: center; text-decoration: none; }
.notif__foot:hover { text-decoration: underline; }
.notif__studio-acts { display: flex; gap: 8px; flex-wrap: wrap; }

.news-page { max-width: 820px; margin: 0 auto; padding: 8px 0 48px; }
.news-head { margin-bottom: 22px; }
.news-badge { display: inline-block; padding: 4px 10px; border: 1px solid rgba(212, 161, 75, 0.45); border-radius: 999px; color: var(--mg-gold); font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.news-head .page-title { margin: 12px 0 8px; line-height: 1.12; }
.news-lead { margin: 0; color: var(--mg-copy); font-size: 16px; line-height: 1.55; }
.news-time { display: block; margin-top: 10px; color: var(--mg-muted); font-size: 13px; }
.news-back { display: inline-block; margin-bottom: 14px; color: var(--mg-gold); font-size: 14px; text-decoration: none; }
.news-back:hover { text-decoration: underline; }
.news-read { display: flex; align-items: center; gap: 8px; margin: -8px 0 22px; padding: 10px 14px; border: 1px solid rgba(212, 161, 75, 0.35); border-radius: 12px; background: rgba(212, 161, 75, 0.06); color: var(--mg-copy); font-size: 14px; line-height: 1.4; }
.news-read::before { content: "◆"; flex: none; color: var(--mg-gold); font-size: 13px; }
.news-read.is-done { border-color: var(--mg-border); background: rgba(255, 255, 255, 0.02); color: var(--mg-muted); }
.news-read.is-done::before { content: "✓"; }
.news-read.is-fast { border-color: rgba(232, 120, 90, 0.45); background: rgba(232, 120, 90, 0.07); }

/* мелкое начисление: «+10» по центру, улетает в баланс, экран не перекрывает */
.gain-pop {
  position: fixed; left: 50%; top: 42%; z-index: 9000;
  display: inline-flex; align-items: center; gap: 10px;
  padding: 12px 20px 12px 14px; border-radius: 999px;
  border: 1px solid rgba(155, 231, 255, 0.45);
  background: rgba(10, 16, 22, 0.88); box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45), 0 0 26px rgba(155, 231, 255, 0.25);
  color: #E6FAFF; pointer-events: none; opacity: 0;
  transform: translate(-50%, -50%) scale(.85);
  transition: transform .55s cubic-bezier(.5, 0, .2, 1), opacity .45s ease;
}
.gain-pop.is-in { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.gain-pop.is-out { opacity: 0; }
.gain-pop__gem { display: inline-grid; width: 26px; height: 26px; }
.gain-pop__gem svg { width: 100%; height: 100%; filter: drop-shadow(0 0 8px rgba(155, 231, 255, .8)); }
.gain-pop__amount { font-size: 22px; font-weight: 800; letter-spacing: .02em; }
.gain-pop__why { color: rgba(230, 250, 255, 0.7); font-size: 13px; white-space: nowrap; }
html.no-anim .gain-pop { transition: opacity .3s ease; }

.news-list { display: grid; gap: 12px; }
.news-card { display: grid; grid-template-columns: 220px 1fr; gap: 16px; padding: 12px; border: 1px solid var(--mg-border); border-radius: 16px; background: rgba(255, 255, 255, 0.02); color: inherit; text-decoration: none; transition: border-color 0.2s, transform 0.2s; }
.news-card:hover { border-color: rgba(212, 161, 75, 0.55); transform: translateY(-1px); }
.news-card.is-unread { border-color: rgba(212, 161, 75, 0.5); background: rgba(212, 161, 75, 0.05); }
.news-card__img { display: block; aspect-ratio: 16 / 10; border-radius: 11px; overflow: hidden; background: #15130f; }
.news-card__img img { width: 100%; height: 100%; object-fit: cover; object-position: top center; display: block; }
.news-card__img--mark { display: grid; place-items: center; color: var(--mg-gold); font-family: inherit; font-size: 34px; font-weight: 800; letter-spacing: 0.04em; background: radial-gradient(circle at 30% 20%, rgba(212, 161, 75, 0.25), transparent 60%), #15130f; }
.news-card__body { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.news-card__meta { display: flex; align-items: center; gap: 6px; color: var(--mg-muted); font-size: 12px; }
.news-card__aud { color: var(--mg-gold); }
.news-card b { color: var(--mg-ivory); font-size: 17px; line-height: 1.3; }
.news-card__short { color: var(--mg-copy); font-size: 14px; line-height: 1.5; }
.news-stats { display: flex; gap: 14px; margin-top: auto; padding-top: 4px; color: var(--mg-muted); font-size: 13px; }

.news-body { color: var(--mg-copy); font-size: 16.5px; line-height: 1.65; }
.news-body h2 { margin: 30px 0 10px; color: var(--mg-ivory); font-size: 21px; line-height: 1.25; }
.news-body p { margin: 0 0 14px; }
.news-body ul { margin: 0 0 16px; padding-left: 22px; }
.news-body li { margin-bottom: 8px; }
.news-body li::marker { color: var(--mg-gold); }
.news-note { padding: 12px 14px; border-left: 3px solid var(--mg-gold); border-radius: 0 10px 10px 0; background: rgba(212, 161, 75, 0.07); }
.news-fig { margin: 18px 0 24px; }
.news-fig a { display: block; border: 1px solid var(--mg-border); border-radius: 14px; overflow: hidden; background: #0d0c0b; }
.news-fig img { display: block; width: auto; max-width: 100%; height: auto; max-height: 720px; margin: 0 auto; }
.news-fig figcaption { margin-top: 8px; color: var(--mg-muted); font-size: 13px; line-height: 1.45; text-align: center; }

.news-react { margin: 32px 0 26px; padding: 18px; border: 1px solid var(--mg-border); border-radius: 16px; background: rgba(255, 255, 255, 0.02); }
.news-react__title { margin-bottom: 12px; color: var(--mg-ivory); font-weight: 700; }
.news-react__btns { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.news-react__btn { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border: 1px solid var(--mg-border); border-radius: 12px; background: transparent; color: var(--mg-copy); font: inherit; cursor: pointer; text-align: left; transition: border-color 0.2s, background 0.2s; }
.news-react__btn span { font-size: 20px; }
.news-react__btn b { flex: 1; font-weight: 600; }
.news-react__btn em { font-style: normal; color: var(--mg-muted); font-variant-numeric: tabular-nums; }
.news-react__btn:hover { border-color: rgba(212, 161, 75, 0.5); }
.news-react__btn.is-on { border-color: var(--mg-gold); background: rgba(212, 161, 75, 0.12); color: var(--mg-ivory); }
.news-react__btn--down.is-on { border-color: #c96a4a; background: rgba(201, 106, 74, 0.12); }

.news-comments h2 { margin: 0 0 12px; color: var(--mg-ivory); font-size: 20px; }
.news-form { margin-bottom: 18px; }
.news-form textarea { width: 100%; min-height: 84px; padding: 12px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(0, 0, 0, 0.35); color: var(--mg-ivory); font: inherit; resize: vertical; }
.news-form textarea:focus { outline: none; border-color: rgba(212, 161, 75, 0.6); }
.news-form__row { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 8px; font-size: 12px; }
.news-comment { padding: 12px 0; border-top: 1px solid var(--mg-border); }
.news-comment__head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 4px; }
.news-comment__head b { color: var(--mg-ivory); }
.news-comment__head time { color: var(--mg-muted); font-size: 12px; }
.news-comment__del { margin-left: auto; background: none; border: 0; padding: 0; color: var(--mg-muted); font: inherit; font-size: 12px; cursor: pointer; }
.news-comment__del:hover { color: #e07a5a; }
.news-comment p { margin: 0; color: var(--mg-copy); line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }

@media (max-width: 640px) {
  .news-card { grid-template-columns: 1fr; gap: 10px; }
  .news-card__img { aspect-ratio: 16 / 9; }
  .news-body { font-size: 16px; }
  .news-react__btns { grid-template-columns: 1fr; }
  .news-form__row { flex-direction: column; align-items: stretch; }
  .news-form__row .btn { width: 100%; }
}.news-comments > .btn { margin-bottom: 14px; }

/* Студия: автопроверка статей */
.side-link__badge { margin-left: auto; min-width: 20px; padding: 1px 7px; border-radius: 999px; background: rgba(242, 178, 45, 0.18); color: var(--mg-amber-lite); font: 700 11px/18px var(--body); text-align: center; }
.side-link__badge.is-hold { background: #c8402a; color: #fff; }
.side-link.is-active .side-link__badge { background: rgba(11, 10, 8, 0.25); color: var(--mg-ink); }
.badge--hold { color: #ffb4a3; border-color: rgba(222, 86, 58, 0.55); background: rgba(200, 64, 42, 0.14); }
.vstate-hint--warn { color: var(--mg-amber-lite); }
.review-alert { display: flex; flex-direction: column; gap: 4px; width: 100%; margin: 0 0 16px; padding: 14px 16px; border: 1px solid rgba(242, 178, 45, 0.45); border-radius: var(--mg-radius-md); background: rgba(242, 160, 45, 0.08); color: var(--mg-ivory); text-align: left; cursor: pointer; font: inherit; transition: border-color 0.2s var(--ease), background 0.2s var(--ease); }
.review-alert b { font-size: 15px; }
.review-alert span { color: var(--mg-copy); font-size: 13px; }
.review-alert:hover { background: rgba(242, 160, 45, 0.13); }
.review-alert.is-hold { border-color: rgba(222, 86, 58, 0.7); background: rgba(200, 64, 42, 0.12); }
.review-alert.is-hold b { color: #ffc2b4; }
.rv-intro { margin: 0 0 18px; max-width: 68ch; }
.rv-empty { padding: 28px 20px; border: 1px dashed var(--mg-hairline); border-radius: var(--mg-radius-md); text-align: center; }
.rv-section { margin: 0 0 26px; }
.rv-section h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 4px; font: 700 18px/1.25 var(--body); }
.rv-section h3 span { padding: 1px 9px; border-radius: 999px; font-size: 12px; line-height: 20px; }
.rv-section--hold h3 { color: #ffb4a3; font-size: 21px; }
.rv-section--hold h3 span { background: #c8402a; color: #fff; }
.rv-section--remarks h3 { color: var(--mg-amber-lite); }
.rv-section--remarks h3 span { background: rgba(242, 178, 45, 0.2); color: var(--mg-amber-lite); }
.rv-section__lead { margin: 0 0 12px; color: var(--mg-copy); font-size: 14px; max-width: 70ch; }
.rv-card { margin: 0 0 12px; padding: 16px; border: 1px solid var(--mg-hairline); border-left-width: 4px; border-radius: var(--mg-radius-md); background: var(--mg-card); transition: opacity 0.2s var(--ease); }
.rv-card.is-hold { border-left-color: #d9533a; background: linear-gradient(90deg, rgba(200, 64, 42, 0.1), transparent 55%), var(--mg-card); }
.rv-card.is-remarks { border-left-color: var(--mg-amber); }
.rv-card.is-busy { opacity: 0.6; pointer-events: none; }
.rv-card__head { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 10px; }
.rv-card__img { flex: none; width: 72px; height: 48px; border-radius: 8px; object-fit: cover; background: var(--mg-hover); }
.rv-card__title { display: block; color: var(--mg-ivory); font-size: 16px; line-height: 1.3; }
.rv-card__meta { margin-top: 3px; color: var(--mg-muted); font-size: 13px; }
.rv-issue { margin: 8px 0; padding: 10px 12px; border-radius: 10px; background: var(--mg-hover); }
.rv-issue b { display: block; margin-bottom: 2px; font-size: 14px; }
.rv-issue p { margin: 0; color: var(--mg-copy); font-size: 14px; line-height: 1.45; }
.rv-issue--block b { color: #ffb4a3; }
.rv-issue--edit b { color: var(--mg-amber-lite); }
.rv-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.rv-other { display: grid; grid-template-columns: 1fr 1fr auto; gap: 10px; align-items: end; margin-top: 12px; padding: 12px; border: 1px solid var(--mg-hairline); border-radius: 12px; }
.rv-other label { display: grid; gap: 4px; font-size: 12px; color: var(--mg-muted); }
.rv-other select { min-height: 40px; padding: 0 10px; border: 1px solid var(--mg-hairline); border-radius: 10px; background: var(--mg-alt); color: var(--mg-ivory); font: inherit; font-size: 14px; }
.rv-other p { grid-column: 1 / -1; margin: 0; font-size: 12px; }
.rv-preview { margin-top: 14px; padding: 14px; border: 1px solid var(--mg-hairline); border-radius: 12px; background: var(--mg-alt); }
.rv-legend { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 10px; font-size: 12px; color: var(--mg-muted); }
.rv-legend span::before { content: ""; display: inline-block; width: 12px; height: 12px; margin-right: 6px; border-radius: 3px; vertical-align: -2px; }
.rv-legend__del::before { background: rgba(214, 70, 50, 0.45); }
.rv-legend__fix::before { background: rgba(70, 180, 110, 0.5); }
.rv-row { position: relative; margin: 0 0 8px; padding: 8px 10px; border-radius: 8px; }
.rv-row p, .rv-row h4 { margin: 0; color: var(--mg-copy); font-size: 14px; line-height: 1.55; }
.rv-row h4 { color: var(--mg-ivory); font-size: 15px; }
.rv-row img { display: block; max-width: 220px; max-height: 130px; border-radius: 6px; object-fit: cover; }
.rv-row.is-del { background: rgba(214, 70, 50, 0.16); box-shadow: inset 3px 0 0 #d9533a; }
.rv-row.is-del p, .rv-row.is-del h4 { text-decoration: line-through; text-decoration-color: rgba(255, 140, 120, 0.7); color: #d9a79c; }
.rv-row.is-del img { opacity: 0.45; }
.rv-row.is-fix { background: rgba(70, 180, 110, 0.08); box-shadow: inset 3px 0 0 #3fae6a; }
.rv-tag { display: inline-block; margin-bottom: 4px; padding: 1px 8px; border-radius: 999px; font: 700 11px/18px var(--body); }
.rv-tag--del { background: rgba(214, 70, 50, 0.3); color: #ffc6b9; }
.rv-tag--fix { background: rgba(70, 180, 110, 0.25); color: #a9efc4; }
.rv-old { padding: 0 2px; border-radius: 3px; background: rgba(214, 70, 50, 0.3); color: #ffc6b9; text-decoration: line-through; }
.rv-new { padding: 0 2px; border-radius: 3px; background: rgba(70, 180, 110, 0.35); color: #d5ffe3; text-decoration: none; font-weight: 600; }
.rv-skip { margin: 4px 0 10px; color: var(--mg-muted); font-size: 12px; text-align: center; }
.mstats { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 6px; font-weight: 500; font-size: 12.5px; color: var(--mg-muted); }
.mstat { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.mstat i { font-style: normal; font-size: 13px; }
.rv-legend__orig::before { background: rgba(232, 184, 80, 0.45); }
.rv-tag--orig { background: rgba(232, 184, 80, 0.22); color: #f3d79a; }
.rv-row.is-orig { background: rgba(232, 184, 80, 0.08); box-shadow: inset 3px 0 0 #d9a83a; }
.rv-num { display: inline-block; margin: 0 6px 4px 0; padding: 1px 7px; border-radius: 999px; background: rgba(255, 255, 255, 0.08); color: var(--mg-muted); font: 600 11px/18px var(--body); }
.rv-jump { padding: 0; border: 0; background: none; color: inherit; font: inherit; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.rv-preview__hint { margin: 0 0 10px; color: var(--mg-muted); font-size: 12px; }
.rv-row.is-flash, .rvc.is-flash { animation: rv-flash 1.4s ease-out; }
@keyframes rv-flash { 0%, 30% { outline: 2px solid #f3d79a; outline-offset: 2px; } 100% { outline: 2px solid transparent; outline-offset: 6px; } }

.rvc-bar { margin: 0 0 18px; padding: 14px 16px; border-radius: 12px; background: rgba(214, 70, 50, 0.1); border: 1px solid rgba(214, 70, 50, 0.35); }
.rvc-bar b { display: block; color: var(--mg-ivory); font-size: 16px; }
.rvc-bar p { margin: 6px 0 0; color: var(--mg-copy); font-size: 14px; line-height: 1.5; }
.rvc-bar .rvc-bar__note { color: var(--mg-muted); font-size: 13px; }
.rvc-bar .rvc-bar__block { color: #ffc6b9; }
.rvc-bar .rv-actions { margin-top: 12px; }
.rvc-legend { display: flex; flex-wrap: wrap; gap: 8px 14px; margin-top: 10px; font-size: 12px; color: var(--mg-muted); }
.rvc-legend span::before { content: ""; display: inline-block; width: 12px; height: 12px; margin-right: 6px; border-radius: 3px; vertical-align: -2px; }
.rvc-legend__del::before { background: rgba(214, 70, 50, 0.55); }
.rvc-legend__orig::before { background: rgba(232, 184, 80, 0.5); }
.rvc-legend__typo::before { background: rgba(214, 70, 50, 0.85); }
.rvc-legend__fix::before { background: rgba(70, 180, 110, 0.6); }
.rvc { position: relative; margin: 0 -12px 1em; padding: 10px 12px 4px; border-radius: 10px; }
.rvc > :last-child { margin-bottom: 0.4em; }
.rvc--del { background: rgba(214, 70, 50, 0.24); box-shadow: inset 4px 0 0 #e0553a; }
.rvc--orig { background: rgba(232, 184, 80, 0.1); box-shadow: inset 4px 0 0 #d9a83a; }
.rvc--fix { box-shadow: inset 4px 0 0 rgba(214, 70, 50, 0.6); }
.rvc-tag { margin-bottom: 6px; color: #ffd2c7; font: 600 12.5px/1.45 var(--body); }
.rvc--orig .rvc-tag { color: #f3d79a; }
.rvc-tag .rv-num { margin-bottom: 0; }
mark.rvc-typo { padding: 0 2px; border-radius: 3px; background: rgba(214, 70, 50, 0.75); color: #fff; }
.rvc-fixto { margin-left: 4px; padding: 0 4px; border-radius: 3px; background: rgba(70, 180, 110, 0.3); color: #c9f7da; font-size: 0.88em; font-weight: 600; white-space: nowrap; }
@media (max-width: 640px) {
  .rvc { margin-left: -8px; margin-right: -8px; padding-left: 10px; padding-right: 10px; }
  .rvc-bar .rv-actions .btn { flex: 1 1 100%; justify-content: center; }
  .rv-card { padding: 13px; }
  .rv-other { grid-template-columns: 1fr; }
  .rv-actions .btn { flex: 1 1 100%; justify-content: center; }
  .rv-row img { max-width: 100%; }
  .rv-section--hold h3 { font-size: 19px; }
}

/* ---------- подарки авторам ---------- */
.gift-btn svg { width: 18px; height: 18px; }
.gift-cover { position: absolute; top: 14px; right: 14px; z-index: 3; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.gift-cover__box { position: relative; display: grid; place-items: center; width: 78px; height: 78px; border-radius: 20px; background: rgba(12, 9, 6, .58); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border: 1px solid rgba(247, 196, 90, .5); box-shadow: 0 12px 30px rgba(0, 0, 0, .35); text-decoration: none; transition: transform .2s ease; }
a.gift-cover__box:hover { transform: translateY(-2px) scale(1.03); }
.gift-cover__box svg { width: 52px; height: 52px; filter: drop-shadow(0 4px 8px rgba(0, 0, 0, .35)); animation: gift-cover-bob 3.4s ease-in-out infinite; }
.gift-cover__n { position: absolute; top: -9px; right: -9px; min-width: 30px; height: 30px; padding: 0 9px; border-radius: 999px; background: linear-gradient(180deg, #ff5a4f, #d92b2b); color: #fff; font: 800 15px/30px system-ui, sans-serif; text-align: center; border: 2px solid rgba(255, 255, 255, .9); box-shadow: 0 4px 12px rgba(217, 43, 43, .45); }
.gift-cover__btn { min-height: 36px; padding: 6px 18px; font-size: 13px; box-shadow: 0 8px 20px rgba(0, 0, 0, .3); }
@keyframes gift-cover-bob { 0%, 100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-3px) rotate(-3deg); } }
html.no-anim .gift-cover__box svg { animation: none; }
.soc-cover.has-gifts .soc-cover__tools { top: auto; bottom: 14px; }
.gift-big { margin: 16px 0 4px; }
.gift-big--end { margin: 18px 0 6px; }
.gift-big__btn { width: 100%; min-height: 58px; gap: 10px; font-size: 17px; letter-spacing: .02em; }
.gift-big .gift-big__btn { font-family: Oswald, Impact, "Arial Narrow", "Segoe UI", sans-serif; }
.gift-big__btn svg { width: 24px; height: 24px; }
@media (max-width: 700px) {
  .gift-cover { top: 8px; right: 8px; gap: 5px; }
  .gift-cover__box { width: 52px; height: 52px; border-radius: 14px; }
  .gift-cover__box svg { width: 34px; height: 34px; }
  .gift-cover__n { top: -7px; right: -7px; min-width: 24px; height: 24px; padding: 0 7px; font-size: 12px; line-height: 20px; }
  .gift-cover__btn { min-height: 28px; padding: 3px 12px; font-size: 12px; }
  .gift-big__btn { min-height: 52px; font-size: 15px; }
}
.gift-btn:not(.btn--cta) { border-color: rgba(240, 192, 78, 0.45); color: #f6d88a; }
.gift-btn:not(.btn--cta):hover { background: rgba(240, 192, 78, 0.1); color: #ffe7a6; }
html.gift-lock { overflow: hidden; }
.gift-ov { position: fixed; inset: 0; z-index: 400; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(4, 3, 2, 0.78); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); animation: gift-fade 0.18s ease-out; }
@keyframes gift-fade { from { opacity: 0; } }

.gift-art { position: relative; display: block; width: 100%; aspect-ratio: 1; border-radius: 14px; overflow: hidden; background: #12100d; isolation: isolate; }
.gift-art img { position: relative; z-index: 1; display: block; width: 100%; height: 100%; object-fit: cover; }
.gift-art--sm { width: 64px; flex: 0 0 64px; border-radius: 12px; }
.gift-art--xs { width: 44px; flex: 0 0 44px; border-radius: 10px; }
.gift-art--xl { width: min(240px, 62vw); margin: 0 auto; border-radius: 22px; }
.gift-art--anim img { position: absolute; inset: 2px; width: calc(100% - 4px); height: calc(100% - 4px); border-radius: 12px; }
.gift-art--xl.gift-art--anim img { inset: 3px; width: calc(100% - 6px); height: calc(100% - 6px); border-radius: 19px; }
.gift-art__aura { position: absolute; left: 50%; top: 50%; z-index: 0; width: 150%; aspect-ratio: 1; margin: -75% 0 0 -75%; background: conic-gradient(from 0deg, #2a2240 0 12%, #b9a2ff 22%, #f4f0ff 28%, #b9a2ff 34%, #2a2240 46% 62%, #8f7ad8 72%, #f4f0ff 78%, #8f7ad8 84%, #2a2240 94%); animation: gift-spin 5s linear infinite; }
.gift-art--anim::before { content: ""; position: absolute; inset: 2px; z-index: 2; pointer-events: none; border-radius: 12px; background: linear-gradient(115deg, transparent 38%, rgba(255, 255, 255, 0.28) 48%, rgba(255, 255, 255, 0.05) 54%, transparent 62%) -160% 0 / 250% 100% no-repeat; animation: gift-sheen 3.4s ease-in-out infinite; }
.gift-art--anim::after { content: ""; position: absolute; inset: 2px; z-index: 2; pointer-events: none; border-radius: 12px; box-shadow: inset 0 0 22px rgba(185, 162, 255, 0.4); animation: gift-pulse 2.8s ease-in-out infinite; }
.gift-art--xl.gift-art--anim::before, .gift-art--xl.gift-art--anim::after { inset: 3px; border-radius: 19px; }
.gift-art__spark { position: absolute; inset: 0; z-index: 3; pointer-events: none; background:
  radial-gradient(circle, #fff 0 1.4px, transparent 2.4px) 18% 22% / 100% 100% no-repeat,
  radial-gradient(circle, #fff 0 1.2px, transparent 2.2px) 80% 30% / 100% 100% no-repeat,
  radial-gradient(circle, #fff 0 1.6px, transparent 2.6px) 70% 82% / 100% 100% no-repeat,
  radial-gradient(circle, #fff 0 1px, transparent 2px) 26% 76% / 100% 100% no-repeat;
  animation: gift-twinkle 2.2s ease-in-out infinite; }
.gift-art--diamond .gift-art__aura { background: conic-gradient(from 0deg, #7ef0ff, #4f7bff, #ff5cd6, #ffe278, #7effbe, #7ef0ff); animation-duration: 3.6s; }
.gift-art--diamond::after { box-shadow: inset 0 0 26px rgba(126, 240, 255, 0.35); animation: gift-pulse 2.4s ease-in-out infinite; }
.gift-art--diamond::before { animation-duration: 2.8s; }
.gift-art--diamond .gift-art__spark { animation-duration: 1.6s; }
@keyframes gift-sheen { 0%, 35% { background-position: -160% 0; } 75%, 100% { background-position: 260% 0; } }
@keyframes gift-spin { to { transform: rotate(360deg); } }
@keyframes gift-pulse { 0%, 100% { opacity: 0.55; } 50% { opacity: 1; } }
@keyframes gift-twinkle { 0%, 100% { opacity: 0.15; transform: scale(0.96); } 50% { opacity: 1; transform: scale(1.02); } }
.gift-shop { position: relative; display: flex; flex-direction: column; width: min(760px, 100%); max-height: min(860px, calc(100dvh - 32px)); border: 1px solid var(--mg-border); border-radius: 22px; background: linear-gradient(180deg, #17130e, #0d0b08); box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6); overflow: hidden; }
.gift-shop__load { padding: 60px 20px; text-align: center; color: var(--mg-muted); }
.gift-shop__x { position: absolute; top: 10px; right: 10px; z-index: 2; width: 38px; height: 38px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.08); color: var(--mg-hi); font-size: 24px; line-height: 1; cursor: pointer; }
.gift-shop__x:hover { background: rgba(255, 255, 255, 0.16); }
.gift-shop__head { padding: 20px 60px 6px 22px; }
.gift-shop__head h2 { margin: 0; font: 600 1.45rem/1.1 var(--display); text-transform: uppercase; letter-spacing: 0.02em; color: var(--mg-hi); }
.gift-shop__head p { margin: 4px 0 0; color: var(--mg-muted); font-size: 14px; }
.gift-shop__head { flex: 0 0 auto; }
.gift-shop__tiers { flex: 0 0 auto; display: flex; gap: 8px; padding: 12px 22px 4px; overflow-x: auto; scrollbar-width: none; }
.gift-shop__tiers::-webkit-scrollbar { display: none; }
.gift-tier { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 0 14px; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 999px; background: rgba(255, 255, 255, 0.04); color: var(--mg-copy); font: 600 14px/1 var(--body); cursor: pointer; }
.gift-tier i { width: 10px; height: 10px; border-radius: 50%; background: var(--tier); box-shadow: 0 0 8px var(--tier); }
.gift-tier.is-on { border-color: var(--tier); background: color-mix(in srgb, var(--tier) 16%, transparent); color: var(--mg-hi); }
.gift-shop__range { margin: 6px 22px 0; color: var(--mg-muted); font-size: 12.5px; }
.gift-shop__grid { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 10px; padding: 12px 22px 16px; overflow-y: auto; overscroll-behavior: contain; }
.gift-tile { display: flex; flex-direction: column; gap: 6px; padding: 6px 6px 10px; border: 1px solid rgba(255, 255, 255, 0.07); border-radius: 16px; background: rgba(255, 255, 255, 0.025); color: var(--mg-hi); text-align: left; cursor: pointer; transition: border-color 0.15s, transform 0.15s, background 0.15s; }
.gift-tile:hover { border-color: rgba(240, 192, 78, 0.4); transform: translateY(-2px); }
.gift-tile.is-on { border-color: #f0c04e; background: rgba(240, 192, 78, 0.1); box-shadow: 0 0 0 1px #f0c04e inset, 0 8px 24px rgba(240, 192, 78, 0.15); }
.gift-tile__name { padding: 0 4px; font-size: 13.5px; font-weight: 600; line-height: 1.2; min-height: 2.4em; }
.gift-tile__price, .gift-tile__count { display: inline-flex; align-items: center; gap: 4px; padding: 0 4px; color: #9be7ff; font: 700 13.5px/1 var(--body); }
.gift-tile__price svg, .gift-shop__price svg, .gift-shop__bal svg, .gift-reveal__sum svg, .gift-lock-note svg { width: 15px; height: 15px; flex: 0 0 auto; }
.gift-tile__count { color: #f6d88a; }
.gift-shop__foot { flex: 0 0 auto; display: grid; gap: 10px; padding: 14px 22px 18px; border-top: 1px solid rgba(255, 255, 255, 0.08); background: rgba(10, 8, 6, 0.92); }
.gift-shop__hint { color: var(--mg-muted); font-size: 14px; }
.gift-shop__chosen { display: flex; align-items: center; gap: 12px; }
.gift-shop__chosen b { display: block; color: var(--mg-hi); font-size: 15.5px; }
.gift-shop__price { display: inline-flex; align-items: center; gap: 5px; margin-top: 4px; color: #9be7ff; font-weight: 700; }
.gift-shop__msg { position: relative; display: block; }
.gift-shop__msg input { width: 100%; min-height: 42px; padding: 0 52px 0 12px; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 12px; background: rgba(255, 255, 255, 0.04); color: var(--mg-hi); font: inherit; }
.gift-shop__msg input:focus { outline: none; border-color: rgba(240, 192, 78, 0.6); }
.gift-shop__msg small { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: var(--mg-muted); font-size: 12px; }
.gift-shop__anon { display: flex; align-items: flex-start; gap: 9px; color: var(--mg-copy); font-size: 13.5px; line-height: 1.35; cursor: pointer; }
.gift-shop__anon input { margin-top: 2px; width: 17px; height: 17px; accent-color: #f0c04e; }
.gift-shop__from { display: flex; align-items: center; gap: 10px; color: var(--mg-copy); font-size: 13.5px; }
.gift-shop__from select { flex: 1; min-width: 0; padding: 7px 10px; border-radius: 10px; border: 1px solid rgba(127,127,127,.28) !important; background: rgba(127,127,127,.08) !important; color: inherit; font: inherit; }
.gift-shop__from option { color: #111; }
.gift-shop__lack { margin: 0; color: #ffb3a1; font-size: 13.5px; }
.gift-shop__lack a { color: #f6d88a; }
.gift-shop__go { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.gift-shop__go .btn { min-width: 150px; }
.gift-shop__bal { display: inline-flex; align-items: center; gap: 6px; color: var(--mg-copy); font-size: 13.5px; }
.gift-sent { padding: 34px 24px 26px; text-align: center; }
.gift-sent h2 { margin: 18px 0 6px; font: 600 1.5rem/1.1 var(--display); text-transform: uppercase; color: var(--mg-hi); }
.gift-sent p { margin: 4px auto; max-width: 46ch; color: var(--mg-copy); }
.gift-sent__art { animation: gift-pop 0.6s cubic-bezier(0.2, 1.4, 0.4, 1); }
.gift-sent__acts { display: flex; gap: 10px; justify-content: center; margin-top: 18px; flex-wrap: wrap; }
@keyframes gift-pop { from { transform: scale(0.4) rotate(-8deg); opacity: 0; } }

.gift-tabn { display: inline-block; min-width: 20px; margin-left: 6px; padding: 2px 6px; border-radius: 999px; background: rgba(240, 192, 78, 0.18); color: #f6d88a; font-size: 12px; font-weight: 700; line-height: 1.2; text-align: center; }
.gift-wall { display: grid; gap: 14px; }
.gift-sum { display: grid; gap: 12px; padding: 18px; border: 1px solid rgba(240, 192, 78, 0.28); border-radius: 18px; background: radial-gradient(120% 140% at 0% 0%, rgba(240, 192, 78, 0.12), transparent 55%), rgba(16, 14, 11, 0.9); }
.gift-sum--empty { gap: 6px; text-align: center; justify-items: center; padding: 26px 18px; }
.gift-sum--empty > b { font: 600 1.25rem/1.1 var(--display); text-transform: uppercase; color: var(--mg-hi); }
.gift-sum--empty .gift-sum__acts { margin-top: 8px; justify-content: center; }
.gift-sum__nums { display: flex; gap: 28px; flex-wrap: wrap; }
.gift-sum__nums b { display: block; font: 600 2rem/1 var(--display); color: var(--mg-hi); }
.gift-sum__nums span { color: var(--mg-muted); font-size: 13px; }
.gift-sum__tiers { display: flex; gap: 8px; flex-wrap: wrap; }
.gift-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border: 1px solid color-mix(in srgb, var(--tier) 45%, transparent); border-radius: 999px; color: var(--mg-copy); font-size: 13px; }
.gift-chip i { width: 8px; height: 8px; border-radius: 50%; background: var(--tier); }
.gift-sum__acts { display: flex; gap: 8px; flex-wrap: wrap; }
.gift-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
.gift-from { padding: 14px 16px; border: 1px solid var(--mg-border); border-radius: 16px; background: rgba(16, 14, 11, 0.92); }
.gift-from__head { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; color: var(--mg-copy); }
.gift-from__head b { color: var(--mg-hi); }
.gift-from__x { margin-left: auto; width: 32px; height: 32px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.07); color: var(--mg-hi); font-size: 20px; cursor: pointer; }
.gift-from__row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 0; border-top: 1px solid rgba(255, 255, 255, 0.06); }
.gift-from__row time { color: var(--mg-muted); font-size: 13px; white-space: nowrap; }
.gift-from__note { margin: 8px 0 0; font-size: 13px; }
.gift-who { display: inline-flex; align-items: center; gap: 9px; min-width: 0; color: var(--mg-hi); text-decoration: none; }
.gift-who b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.gift-who.is-hidden b { color: var(--mg-muted); font-weight: 500; }
.gift-who__av { flex: 0 0 32px; width: 32px; height: 32px; border-radius: 50%; overflow: hidden; }
.gift-who__av img, .gift-who__av span { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; object-fit: cover; color: #fff; font-size: 12px; font-weight: 700; background: #2a241d; }

.gift-panel__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 6px; }
.gift-lock-note { display: flex; align-items: flex-start; gap: 8px; margin: 10px 0; padding: 10px 12px; border-radius: 12px; background: rgba(110, 200, 240, 0.08); color: #bfe9fb; font-size: 13.5px; line-height: 1.4; }
.gift-boxes { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; margin: 14px 0; }
.gift-box { display: grid; gap: 8px; justify-items: center; padding: 14px 12px; border: 1px solid color-mix(in srgb, var(--tier) 35%, transparent); border-radius: 18px; background: radial-gradient(100% 80% at 50% 0%, color-mix(in srgb, var(--tier) 16%, transparent), transparent 70%), rgba(16, 14, 11, 0.92); text-align: center; }
.gift-box__pack { position: relative; width: 92px; height: 92px; border: 0; background: none; cursor: pointer; animation: gift-wiggle 2.6s ease-in-out infinite; }
.gift-box__body { position: absolute; left: 12px; right: 12px; bottom: 6px; height: 54px; border-radius: 8px; background: linear-gradient(180deg, color-mix(in srgb, var(--tier) 85%, #fff 15%), color-mix(in srgb, var(--tier) 70%, #000 30%)); box-shadow: 0 10px 22px rgba(0, 0, 0, 0.45); }
.gift-box__lid { position: absolute; left: 6px; right: 6px; top: 22px; height: 18px; z-index: 1; border-radius: 6px; background: linear-gradient(180deg, color-mix(in srgb, var(--tier) 90%, #fff 10%), color-mix(in srgb, var(--tier) 80%, #000 20%)); }
.gift-box__ribbon { position: absolute; left: 50%; top: 10px; bottom: 6px; z-index: 2; width: 12px; transform: translateX(-50%); background: #b3263a; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15); }
.gift-box__ribbon::before, .gift-box__ribbon::after { content: ""; position: absolute; top: -2px; width: 20px; height: 14px; border: 4px solid #b3263a; border-radius: 50% 50% 0 50%; }
.gift-box__ribbon::before { right: 8px; transform: rotate(-20deg); }
.gift-box__ribbon::after { left: 8px; transform: scaleX(-1) rotate(-20deg); }
.gift-box__pack:hover .gift-box__lid { transform: translateY(-5px) rotate(-4deg); transition: transform 0.2s; }
@keyframes gift-wiggle { 0%, 82%, 100% { transform: rotate(0); } 86% { transform: rotate(-6deg); } 90% { transform: rotate(5deg); } 94% { transform: rotate(-3deg); } }
.gift-box__meta b { display: block; color: var(--mg-hi); font-size: 14.5px; }
.gift-box__meta span { color: var(--mg-muted); font-size: 12.5px; }
.gift-panel__empty { display: grid; gap: 4px; margin: 14px 0; }
.gift-panel__shelf, .gift-panel__set { margin-top: 12px; }
.gift-panel__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.gift-panel__row b { display: block; color: var(--mg-hi); }
.gift-switch { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; }
.gift-switch input { position: absolute; opacity: 0; pointer-events: none; }
.gift-switch__ui { position: relative; flex: 0 0 44px; height: 26px; margin-top: 2px; border-radius: 999px; background: rgba(255, 255, 255, 0.14); transition: background 0.2s; }
.gift-switch__ui::after { content: ""; position: absolute; left: 3px; top: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: transform 0.2s; }
.gift-switch input:checked + .gift-switch__ui { background: #e89a3a; }
.gift-switch input:checked + .gift-switch__ui::after { transform: translateX(18px); }
.gift-switch input:focus-visible + .gift-switch__ui { outline: 2px solid #f0c04e; outline-offset: 2px; }
.gift-switch b { display: block; color: var(--mg-hi); }
.gift-switch small { display: block; margin-top: 2px; font-size: 13px; line-height: 1.4; }

.gift-reveal { position: relative; width: min(420px, 100%); padding: 30px 22px 24px; border: 1px solid rgba(240, 192, 78, 0.35); border-radius: 26px; background: radial-gradient(90% 60% at 50% 30%, rgba(240, 192, 78, 0.16), transparent 70%), #0e0c09; text-align: center; overflow: hidden; animation: gift-pop 0.5s cubic-bezier(0.2, 1.3, 0.4, 1); }
.gift-reveal__rays { position: absolute; left: 50%; top: 150px; width: 640px; height: 640px; margin: -320px 0 0 -320px; background: repeating-conic-gradient(from 0deg, rgba(255, 214, 120, 0.12) 0 8deg, transparent 8deg 20deg); -webkit-mask-image: radial-gradient(circle, #000 20%, transparent 62%); mask-image: radial-gradient(circle, #000 20%, transparent 62%); animation: gift-spin 18s linear infinite; pointer-events: none; }
.gift-reveal > *:not(.gift-reveal__rays) { position: relative; }
.gift-reveal__art { animation: gift-pop 0.7s 0.1s cubic-bezier(0.2, 1.5, 0.4, 1) both; }
.gift-reveal__name { margin: 16px 0 2px; font: 600 1.55rem/1.1 var(--display); text-transform: uppercase; color: #fff4dc; }
.gift-reveal__from { margin: 0; color: rgba(255, 240, 214, 0.74); }
.gift-reveal__msg { margin: 12px auto 0; max-width: 34ch; padding: 10px 14px; border-left: 3px solid #f0c04e; border-radius: 8px; background: rgba(255, 255, 255, 0.06); color: #fff4dc; font-style: italic; text-align: left; }
.gift-reveal__row { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin-top: 10px; }
.gift-reveal__sum { display: flex; align-items: baseline; justify-content: center; gap: 7px; margin-top: 16px; color: #9be7ff; }
.gift-reveal__sum svg { width: 22px; height: 22px; align-self: center; }
.gift-reveal__sum b { font: 600 2.2rem/1 var(--display); }
.gift-reveal__note { margin: 6px 0 16px; color: rgba(255, 240, 214, 0.6); font-size: 13.5px; }
.gift-reveal .btn { min-width: 170px; }
.tops-period { margin-top: -4px; }
.fx__lock { margin: 10px 0 0; padding: 9px 12px; border-radius: 10px; background: rgba(110, 200, 240, 0.08); color: #bfe9fb; font-size: 13.5px; }

@media (max-width: 640px) {
  .gift-ov { padding: 0; align-items: flex-end; }
  .gift-ov--reveal { padding: 14px; align-items: center; }
  .gift-shop { width: 100%; max-height: 92dvh; border-radius: 22px 22px 0 0; border-bottom: 0; }
  .gift-shop__head { padding: 16px 56px 4px 16px; }
  .gift-shop__tiers { flex-wrap: wrap; gap: 6px; padding: 10px 16px 2px; overflow: visible; }
  .gift-tier { min-height: 34px; padding: 0 12px; font-size: 13.5px; }
  .gift-shop__chosen .gift-art--sm { width: 52px; flex-basis: 52px; }
  .gift-shop__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 10px 16px 12px; }
  .gift-tile { padding: 4px 4px 8px; border-radius: 13px; }
  .gift-tile__name { font-size: 12px; padding: 0 2px; }
  .gift-tile__price, .gift-tile__count { font-size: 12px; padding: 0 2px; }
  .gift-shop__foot { padding: 12px 16px calc(14px + env(safe-area-inset-bottom)); gap: 8px; }
  .gift-shop__go .btn { min-width: 0; flex: 0 0 auto; }
  .gift-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .gift-boxes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .gift-sum__nums b { font-size: 1.7rem; }
}
html.no-anim .gift-art--anim::before, html.no-anim .gift-art__aura, html.no-anim .gift-art__spark, html.no-anim .gift-box__pack, html.no-anim .gift-reveal__rays { animation: none; }

/* ---------- Несколько каналов на одном Грана ID ---------- */
.acc-menu { display: grid; gap: 2px; margin: 4px 0; padding: 4px 0; border-top: 1px solid var(--mg-hairline); border-bottom: 1px solid var(--mg-hairline); }
.acc-menu__item { display: flex; align-items: center; gap: 10px; }
.acc-menu__txt { display: block; min-width: 0; line-height: 1.3; }
.acc-menu__txt b { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.acc-menu__plus { display: inline-grid; place-items: center; flex: 0 0 32px; width: 32px; height: 32px; border: 1px dashed var(--mg-border); border-radius: 50%; color: var(--mg-amber-lite); font-size: 20px; line-height: 1; }
.acc-cab { display: grid; gap: 8px; margin-top: 14px; }
.acc-cab__head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.acc-row { display: flex; align-items: center; gap: 12px; width: 100%; padding: 10px 12px; border: 1px solid var(--mg-hairline); border-radius: 14px; background: rgba(255, 255, 255, 0.02); color: var(--mg-copy); text-align: left; }
.acc-row.is-on { border-color: var(--mg-border-amber); background: rgba(242, 138, 45, 0.06); }
.acc-row__txt { flex: 1 1 auto; min-width: 0; display: grid; gap: 2px; font-size: 13px; }
.acc-row__txt b { color: var(--mg-ivory); font-size: 15px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.acc-row__here { flex: 0 0 auto; padding: 4px 10px; border-radius: 999px; background: rgba(242, 138, 45, 0.14); color: var(--mg-amber-lite); font-size: 12px; font-weight: 600; }
.acc-row--add { border-style: dashed; cursor: pointer; }
.acc-row--add:hover { border-color: var(--mg-border); background: rgba(212, 161, 75, 0.06); }
.acc-dlg { position: relative; width: min(480px, 100%); max-height: calc(100dvh - 32px); overflow: auto; border: 1px solid var(--mg-border); border-radius: 22px; background: linear-gradient(180deg, #17130e, #0d0b08); box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6); }
.acc-dlg__body { display: grid; gap: 12px; padding: 24px 22px 22px; }
.acc-dlg__body h2 { margin: 0; padding-right: 40px; font: 600 1.45rem/1.1 var(--display); text-transform: uppercase; letter-spacing: 0.02em; color: var(--mg-hi); }
.acc-dlg__body p { margin: 0; color: var(--mg-copy); line-height: 1.5; }
.acc-dlg__list { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; color: var(--mg-copy); font-size: 14px; }
.acc-dlg__list li { position: relative; padding-left: 22px; }
.acc-dlg__list li::before { content: "✓"; position: absolute; left: 0; color: var(--mg-amber-lite); font-weight: 700; }
.acc-dlg__note { font-size: 13px; color: var(--mg-muted) !important; }
.acc-dlg__plan { display: grid; gap: 2px; padding: 12px 14px; border: 1px solid var(--mg-border-amber); border-radius: 14px; background: rgba(242, 138, 45, 0.07); }
.acc-dlg__plan b { color: var(--mg-hi); }
.acc-dlg__plan span { color: var(--mg-copy); font-size: 13px; }
.acc-dlg__err { color: #ff9a7a !important; font-size: 13px; }
.acc-dlg__btn { width: 100%; justify-content: center; }

/* ---------- Серии ---------- */
.ser-chip { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; margin: 4px 0 14px; padding: 6px 12px; border: 1px solid var(--mg-border-amber); border-radius: 999px; background: rgba(242, 138, 45, 0.07); color: var(--mg-copy); font-size: 13px; text-decoration: none; }
.ser-chip b { color: var(--mg-ivory); font-weight: 600; }
.ser-chip:hover { background: rgba(242, 138, 45, 0.13); }
.ser-chip__k { color: var(--mg-amber-lite); font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.ser-bar { position: relative; height: 4px; border-radius: 4px; background: rgba(255, 255, 255, 0.08); overflow: hidden; }
.ser-bar i { position: absolute; inset: 0 auto 0 0; width: var(--p, 0%); border-radius: inherit; background: linear-gradient(90deg, var(--mg-orange), var(--mg-amber-lite)); }
.ser-nav { display: grid; gap: 12px; margin: 26px 0 8px; padding: 18px; border: 1px solid var(--mg-border); border-radius: 18px; background: linear-gradient(180deg, rgba(242, 138, 45, 0.06), rgba(255, 255, 255, 0.01)); }
.ser-nav__head { display: grid; gap: 10px; }
.ser-nav__head > div:first-child { display: grid; gap: 4px; }
.ser-nav__title { color: var(--mg-hi); font: 600 1.15rem/1.2 var(--display); text-decoration: none; }
.ser-next { position: relative; display: grid; gap: 4px; padding: 14px 48px 14px 16px; border-radius: 14px; background: var(--mg-amber); color: var(--mg-ink); text-decoration: none; transition: transform 0.15s ease, filter 0.15s ease; }
.ser-next:hover { transform: translateY(-1px); filter: brightness(1.06); }
.ser-next b { font-size: 16px; line-height: 1.3; }
.ser-next__k { font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; opacity: 0.75; }
.ser-next__go { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); font-size: 22px; }
.ser-next--end { background: rgba(255, 255, 255, 0.04); color: var(--mg-copy); }
.ser-next--end b { color: var(--mg-ivory); }
.ser-nav__all summary { cursor: pointer; color: var(--mg-copy); font-size: 14px; }
.ser-nav__list { display: grid; gap: 2px; margin: 10px 0 0; padding: 0; list-style: none; }
.ser-nav__row a { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; color: var(--mg-copy); text-decoration: none; font-size: 14px; }
.ser-nav__row a:hover { background: rgba(212, 161, 75, 0.08); }
.ser-nav__row.is-here a { background: rgba(242, 138, 45, 0.1); color: var(--mg-ivory); }
.ser-nav__row.is-read .ser-nav__n { background: rgba(126, 220, 150, 0.14); color: #9fe3b0; }
.ser-nav__n { display: inline-grid; place-items: center; flex: 0 0 26px; height: 26px; border-radius: 50%; background: rgba(255, 255, 255, 0.06); font-size: 12px; font-weight: 700; }
.ser-nav__t { flex: 1 1 auto; min-width: 0; }
.ser-nav__here { flex: 0 0 auto; color: var(--mg-amber-lite); font-size: 12px; }
.ser-prev { color: var(--mg-muted); font-size: 13px; text-decoration: none; }
.ser-prev:hover { color: var(--mg-ivory); }
.ser-shelf { margin: 22px 0; }
.ser-shelf__head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 12px; }
.ser-shelf__head h2 { margin: 0; font: 600 1.25rem/1 var(--display); text-transform: uppercase; color: var(--mg-hi); }
.ser-shelf__row { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(240px, 300px); gap: 14px; overflow-x: auto; padding-bottom: 6px; scroll-snap-type: x mandatory; }
.ser-card { display: grid; grid-template-rows: auto 1fr; overflow: hidden; border: 1px solid var(--mg-hairline); border-radius: 16px; background: var(--mg-card); color: var(--mg-copy); text-decoration: none; scroll-snap-align: start; transition: border-color 0.15s ease, transform 0.15s ease; }
.ser-card:hover { border-color: var(--mg-border); transform: translateY(-2px); }
.ser-card__cover { position: relative; aspect-ratio: 16 / 9; overflow: hidden; }
.ser-card__cover > .cover { width: 100%; height: 100%; }
.ser-card__badge { position: absolute; left: 10px; bottom: 10px; padding: 4px 10px; border-radius: 999px; background: rgba(7, 7, 6, 0.82); color: var(--mg-hi); font-size: 12px; font-weight: 600; }
.ser-card__body { display: grid; align-content: start; gap: 6px; padding: 12px 14px 14px; }
.ser-card__title { color: var(--mg-ivory); font-size: 16px; line-height: 1.3; }
.ser-card__desc { margin: 0; font-size: 13px; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ser-card__meta { color: var(--mg-muted); font-size: 12px; }
.ser-page { display: grid; gap: 22px; }
.ser-page__head { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: 24px; align-items: center; padding: 20px; border: 1px solid var(--mg-border); border-radius: 22px; background: linear-gradient(135deg, rgba(242, 138, 45, 0.08), rgba(255, 255, 255, 0.01)); }
.ser-page__cover { aspect-ratio: 16 / 9; overflow: hidden; border-radius: 14px; }
.ser-page__cover > .cover { width: 100%; height: 100%; }
.ser-page__info { display: grid; gap: 10px; }
.ser-page__info .page-title { margin: 0; }
.ser-page__desc { margin: 0; color: var(--mg-copy); line-height: 1.5; }
.ser-page__meta { color: var(--mg-muted); font-size: 14px; }
.ser-page__cta { margin-top: 4px; }
.ser-page__list { display: grid; gap: 10px; }
.ser-part { display: grid; grid-template-columns: 36px 160px minmax(0, 1fr); gap: 14px; align-items: center; padding: 12px; border: 1px solid var(--mg-hairline); border-radius: 16px; background: var(--mg-card); color: var(--mg-copy); text-decoration: none; }
.ser-part:hover { border-color: var(--mg-border); }
.ser-part.is-read { opacity: 0.78; }
.ser-part__n { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: rgba(242, 138, 45, 0.12); color: var(--mg-amber-lite); font-weight: 700; }
.ser-part__cover { aspect-ratio: 16 / 9; overflow: hidden; border-radius: 10px; }
.ser-part__cover > .cover { width: 100%; height: 100%; }
.ser-part__body { display: grid; gap: 4px; min-width: 0; }
.ser-part__body b { color: var(--mg-ivory); font-size: 16px; line-height: 1.3; }
.ser-part__body p { margin: 0; font-size: 13px; line-height: 1.45; }
.ser-part__meta { color: var(--mg-muted); font-size: 12px; }
.ser-studio { margin-top: 18px; }
.ser-promo { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 22px; padding: 22px; border: 1px solid var(--mg-border); border-radius: 20px; background: linear-gradient(135deg, rgba(242, 138, 45, 0.09), rgba(255, 255, 255, 0.01)); }
.ser-promo__txt { display: grid; gap: 12px; align-content: start; }
.ser-promo__txt h3, .ser-ed__head h3 { margin: 0; font: 600 1.15rem/1 var(--display); text-transform: uppercase; color: var(--mg-hi); }
.ser-promo__txt p { margin: 0; color: var(--mg-copy); line-height: 1.55; }
.ser-promo__list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; font-size: 14px; color: var(--mg-copy); }
.ser-promo__list li { position: relative; padding-left: 22px; }
.ser-promo__list li::before { content: "✓"; position: absolute; left: 0; color: var(--mg-amber-lite); font-weight: 700; }
.ser-promo__buy { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-top: 4px; color: var(--mg-copy); }
.ser-promo__buy b { color: var(--mg-hi); font-size: 1.3rem; }
.ser-promo__demo { display: grid; gap: 12px; align-content: center; }
.ser-demo__card { display: grid; gap: 8px; padding: 16px; border: 1px solid var(--mg-hairline); border-radius: 14px; background: var(--mg-card); }
.ser-demo__card b { color: var(--mg-ivory); font-size: 17px; }
.ser-demo__next { position: relative; display: grid; gap: 2px; padding: 14px 44px 14px 16px; border-radius: 14px; background: var(--mg-amber); color: var(--mg-ink); }
.ser-demo__next span { font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; opacity: 0.75; }
.ser-demo__next i { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); font-style: normal; font-size: 20px; }
.ser-ed { display: grid; gap: 14px; padding: 20px; border: 1px solid var(--mg-border); border-radius: 20px; background: var(--mg-card); }
.ser-ed > .btn { justify-self: start; }
.ser-ed__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px; }
.ser-ed__head > div { display: grid; gap: 6px; max-width: 560px; }
.ser-ed__head p { margin: 0; }
.ser-ed__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; }
.ser-ed__col { display: grid; gap: 12px; align-content: start; min-width: 0; }
.ser-ed__sub { color: var(--mg-ivory); font-weight: 600; font-size: 14px; }
.ser-ed__q { width: 100%; padding: 10px 12px; border: 1px solid var(--mg-hairline); border-radius: 10px; background: var(--mg-alt); color: var(--mg-ivory); }
.ser-ed__foot { display: flex; flex-wrap: wrap; gap: 10px; }
.ser-row { display: flex; align-items: center; gap: 12px; padding: 10px; border: 1px solid var(--mg-hairline); border-radius: 14px; }
.ser-row__cover { flex: 0 0 96px; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 8px; }
.ser-row__cover > .cover { width: 100%; height: 100%; }
.ser-row__txt { flex: 1 1 auto; min-width: 0; display: grid; gap: 2px; font-size: 13px; color: var(--mg-muted); }
.ser-row__txt b { color: var(--mg-ivory); font-size: 15px; }
.ser-row__act { display: flex; gap: 8px; flex: 0 0 auto; }
.ser-empty { display: grid; gap: 4px; padding: 18px; border: 1px dashed var(--mg-border); border-radius: 14px; color: var(--mg-muted); font-size: 14px; }
.ser-empty b { color: var(--mg-ivory); }
.ser-empty--sm { padding: 12px 14px; font-size: 13px; }
.ser-ord__list { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.ser-ord { display: flex; align-items: center; gap: 8px; padding: 8px 8px 8px 10px; border: 1px solid var(--mg-border-amber); border-radius: 12px; background: rgba(242, 138, 45, 0.05); }
.ser-ord__n { display: inline-grid; place-items: center; flex: 0 0 26px; height: 26px; border-radius: 50%; background: var(--mg-amber); color: var(--mg-ink); font-size: 12px; font-weight: 700; }
.ser-ord__t { flex: 1 1 auto; min-width: 0; color: var(--mg-ivory); font-size: 14px; line-height: 1.3; }
.ser-ord__b { flex: 0 0 32px; width: 32px; height: 32px; border: 1px solid var(--mg-hairline); border-radius: 8px; background: rgba(255, 255, 255, 0.04); color: var(--mg-ivory); font-size: 15px; cursor: pointer; }
.ser-ord__b:hover:not(:disabled) { border-color: var(--mg-border); background: rgba(212, 161, 75, 0.1); }
.ser-ord__b:disabled { opacity: 0.3; cursor: default; }
.ser-pick__list { display: grid; gap: 4px; max-height: 420px; overflow: auto; padding-right: 4px; }
.ser-pick { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 2px 10px; align-items: start; padding: 9px 10px; border: 1px solid transparent; border-radius: 10px; cursor: pointer; }
.ser-pick:hover { background: rgba(212, 161, 75, 0.06); }
.ser-pick.is-on { border-color: var(--mg-border-amber); background: rgba(242, 138, 45, 0.06); }
.ser-pick input { grid-row: span 2; width: 18px; height: 18px; margin-top: 2px; accent-color: var(--mg-amber); }
.ser-pick__t { color: var(--mg-ivory); font-size: 14px; line-height: 1.3; }
.ser-pick__d { color: var(--mg-muted); font-size: 12px; }
@media (max-width: 760px) {
  .ser-promo, .ser-ed__grid, .ser-page__head { grid-template-columns: 1fr; }
  .ser-page__head { padding: 14px; gap: 14px; }
}
@media (max-width: 640px) {
  .ser-part { grid-template-columns: 30px minmax(0, 1fr); }
  .ser-part__n { width: 30px; height: 30px; }
  .ser-part__cover { display: none; }
  .ser-row { flex-wrap: wrap; }
  .ser-row__act { width: 100%; }
  .ser-row__act .btn { flex: 1 1 0; justify-content: center; }
  .ser-shelf__row { grid-auto-columns: 78%; }
  .ser-promo, .ser-ed { padding: 16px; }
  .acc-dlg__body { padding: 20px 16px 18px; }
}
/* открытие подарка: коробка трясётся, крышка улетает, затем подарок и салют */
.gift-reveal__box { display: none; position: relative; width: 150px; height: 150px; margin: 30px auto 40px; }
.gift-reveal__box .gift-box__body { left: 18px; right: 18px; bottom: 8px; height: 90px; border-radius: 12px; }
.gift-reveal__box .gift-box__lid { left: 8px; right: 8px; top: 34px; height: 28px; border-radius: 9px; transition: transform 0.45s cubic-bezier(0.3, 1.4, 0.5, 1), opacity 0.45s; }
.gift-reveal__box .gift-box__ribbon { width: 18px; top: 16px; bottom: 8px; transition: opacity 0.3s; }
.gift-reveal.is-packed { min-height: 300px; display: grid; place-items: center; }
.gift-reveal.is-packed > *:not(.gift-reveal__box) { display: none; }
.gift-reveal.is-packed .gift-reveal__box { display: block; animation: gift-shake 0.65s ease-in-out both; }
.gift-reveal.is-opening .gift-box__lid { transform: translateY(-120px) rotate(-28deg); opacity: 0; }
.gift-reveal.is-opening .gift-box__ribbon { opacity: 0; }
.gift-reveal.is-opening .gift-reveal__box { animation: gift-burst 0.5s ease-in both; }
.gift-ov--reveal .celebrate__fx { position: absolute; inset: 0; z-index: 0; }
.gift-ov--reveal .gift-reveal { z-index: 1; }
@keyframes gift-shake { 0% { transform: scale(0.7); } 30% { transform: scale(1.05) rotate(-7deg); } 50% { transform: rotate(7deg); } 70% { transform: rotate(-5deg); } 100% { transform: rotate(0); } }
@keyframes gift-burst { 0% { transform: scale(1); filter: brightness(1); } 100% { transform: scale(1.25); filter: brightness(2.2); opacity: 0.2; } }
html.no-anim .gift-reveal.is-packed .gift-reveal__box, html.no-anim .gift-reveal.is-opening .gift-reveal__box { animation: none; }
/* Узкий экран: аватар и кнопка темы всегда в шапке — кошелёк сокращаем до алмазов */
@media (max-width: 480px) {
  .topnav__inner { gap: 6px; }
  .topnav__actions { gap: 2px; }
  .brand { gap: 7px; max-width: 128px; }
  .brand__mark { width: 34px; height: 34px; }
  .brand__title { font-size: 0.98rem; }
  .topnav__search, .topnav__actions .icon-btn { width: 36px; height: 36px; min-height: 36px; }
  .avatar-btn { width: 36px; height: 36px; }
  #plat-online { display: none; }
  .bal-chip:not([hidden]) { display: inline-flex; grid-template-columns: none; height: 36px; padding: 0 9px; }
  .bal-chip__cur:not(:first-child) { display: none; }
  .bal-chip__cur:first-child { grid-column: auto; }
  .bal-chip__cur:first-child .bal-chip__rank { display: inline-block; margin-left: 2px; }
}

/* Оценка под текстом статьи — дубль верхних кнопок, мельче */
.post-endbar { margin: 28px 0 8px; padding: 14px 0 4px; border-top: 1px solid var(--mg-hairline); display: grid; gap: 10px; }
.post-share-end { margin: 18px 0 4px; }
.post-endbar__title { font-size: 13px; color: var(--mg-muted); }
.post-endbar__row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.post-endbar__row .engage { transform: scale(.92); transform-origin: left center; }
.post-endbar__row .react-bar { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; }
.post-endbar__ch { display: flex; align-items: center; gap: 10px; }
.post-endbar__ch .avatar { width: 30px; height: 30px; font-size: 12px; }
.post-endbar__name { font-weight: 600; font-size: 14px; color: var(--mg-ivory); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.post-endbar__ch .btn { margin-left: auto; }

/* Внизу новости: следующая непрочитанная и соседние */
.news-nav { display: grid; gap: 10px; margin: 22px 0 6px; }
.news-nav__next { position: relative; display: grid; gap: 4px; padding: 16px 48px 16px 18px; border: 1px solid var(--mg-border-amber); border-radius: 14px; background: linear-gradient(135deg, rgba(242, 138, 45, .14), rgba(242, 138, 45, .04)); color: var(--mg-hi); text-decoration: none; }
.news-nav__next small { font-size: 12px; color: var(--mg-amber); letter-spacing: .02em; }
.news-nav__next b { font-size: 16px; line-height: 1.3; }
.news-nav__next i { position: absolute; right: 18px; top: 50%; transform: translateY(-50%); font-style: normal; font-size: 22px; color: var(--mg-amber); transition: transform .2s var(--ease); }
.news-nav__next:hover i { transform: translate(4px, -50%); }
.news-nav__done { padding: 14px 16px; border: 1px dashed var(--mg-border); border-radius: 14px; color: var(--mg-copy); font-size: 14px; }
.news-nav__done a { color: var(--mg-amber); }
.news-nav__pair { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.news-nav__side { display: grid; gap: 3px; min-width: 0; padding: 10px 12px; border: 1px solid var(--mg-hairline); border-radius: 12px; color: var(--mg-copy); text-decoration: none; font-size: 13px; }
.news-nav__side small { color: var(--mg-muted); font-size: 11.5px; }
.news-nav__side span { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.news-nav__side--after { text-align: right; }
.news-nav__side.is-empty { border: 0; padding: 0; }
.news-nav__side:not(.is-empty):hover { border-color: var(--mg-border); color: var(--mg-ivory); }

/* полка подарков в Студии */
.gift-shelf { position: relative; margin-top: 14px; padding: 14px 12px 4px; border-radius: 14px; background: radial-gradient(120% 90% at 50% 0%, rgba(255, 214, 150, 0.09), transparent 65%), linear-gradient(180deg, #1b1611, #120f0b); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05); }
.gift-shelf__row { display: flex; align-items: flex-end; justify-content: center; gap: 10px; min-height: 64px; padding: 0 8px; }
.gift-shelf__board { display: block; height: 12px; margin: 0 -4px 14px; border-radius: 3px; background: linear-gradient(180deg, #a87447 0 30%, #7a5130 30% 100%); box-shadow: 0 8px 12px -4px rgba(0, 0, 0, 0.7), inset 0 1px 0 rgba(255, 230, 190, 0.35); }
.gift-shelf__item { position: relative; display: block; width: 52px; flex: 0 0 52px; text-decoration: none; filter: drop-shadow(0 6px 5px rgba(0, 0, 0, 0.55)); transition: transform 0.15s; }
.gift-shelf__item:hover { transform: translateY(-3px); }
.gift-art--shelf { width: 52px; border-radius: 10px; }
.gift-shelf__n { position: absolute; right: -6px; top: -6px; z-index: 4; min-width: 22px; padding: 2px 5px; border-radius: 999px; background: #f0c04e; color: #1a1206; font: 700 11px/1.2 var(--body); text-align: center; }
.gift-shelf__hint { align-self: center; color: var(--mg-muted); font-size: 13.5px; }
@media (min-width: 720px) { .gift-shelf__item, .gift-art--shelf { width: 60px; flex-basis: 60px; } .gift-shelf__row { min-height: 72px; gap: 14px; } }
html[data-theme="light"] .gift-shelf { background: radial-gradient(120% 90% at 50% 0%, rgba(255, 214, 150, 0.35), transparent 65%), linear-gradient(180deg, #f6efe4, #ece2d2); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.06); }

/* «Вам подарили подарок» при заходе */
.gift-nag { position: relative; width: min(400px, 100%); padding: 26px 22px 20px; border: 1px solid color-mix(in srgb, var(--tier) 40%, transparent); border-radius: 22px; background: radial-gradient(100% 70% at 50% 0%, color-mix(in srgb, var(--tier) 18%, transparent), transparent 70%), linear-gradient(180deg, #17130e, #0d0b08); box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6); text-align: center; animation: gift-pop 0.45s cubic-bezier(0.2, 1.3, 0.4, 1); }
.gift-nag__box { position: relative; display: block; width: 110px; height: 110px; margin: 0 auto 6px; animation: gift-wiggle 2.6s ease-in-out infinite; }
.gift-nag__box .gift-box__body { left: 14px; right: 14px; height: 64px; }
.gift-nag__box .gift-box__lid { left: 7px; right: 7px; top: 26px; height: 21px; }
.gift-nag h2 { margin: 6px 0 8px; font: 600 1.4rem/1.15 var(--display); text-transform: uppercase; color: var(--mg-hi); }
.gift-nag p { margin: 0 auto; max-width: 34ch; color: var(--mg-copy); font-size: 14.5px; line-height: 1.45; }
.gift-nag__acts { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin: 18px 0 12px; }
.gift-nag__acts .btn { min-width: 140px; }
.gift-nag p.gift-nag__where { color: var(--mg-muted); font-size: 12.5px; }
.gift-ov--nag { z-index: 1150; }
.post-endbar, .post-endbar * { font-family: var(--body); }
.gift-shelf__row { gap: 8px; padding: 0 10px; } .gift-shelf__item { flex: 0 1 52px; width: auto; min-width: 34px; } .gift-art--shelf { width: 100%; } .gift-shelf__n { right: -4px; } @media (min-width: 720px) { .gift-shelf__item { flex: 0 1 60px; width: auto; } .gift-shelf__row { gap: 14px; } }

/* подарки в шапке и в кошельке */
.bal-chip__box { display: inline-grid; position: relative; width: 17px; height: 17px; font-style: normal; }
.bal-chip__box svg { width: 100%; height: 100%; filter: drop-shadow(0 0 5px rgba(240, 192, 78, .35)); }
.bal-chip__cur--gift.has-new .bal-chip__box::after { content: ""; position: absolute; top: -2px; right: -3px; width: 7px; height: 7px; border-radius: 50%; background: #ff5a4f; box-shadow: 0 0 0 2px var(--mg-bg, #0b0907); }
.bal-chip__cur--gift.has-new b { color: #f6d88a; }
@media (max-width: 720px) {
  .bal-chip:not([hidden]) { grid-template-columns: auto auto auto; }
  .bal-chip__box { width: 12px; height: 12px; }
}
@media (max-width: 480px) {
  .bal-chip:not([hidden]) { gap: 7px; }
  .bal-chip .bal-chip__cur--gift { display: inline-flex; padding-left: 7px; border-left: 1px solid rgba(246, 230, 197, 0.14); font-size: 12px; }
  .bal-chip__box { width: 14px; height: 14px; }
}
.wallet-gifts { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.wallet-gifts.has-new { border-color: rgba(240, 192, 78, .45); background: radial-gradient(120% 140% at 0% 0%, rgba(240, 192, 78, .12), transparent 55%), var(--mg-panel, rgba(16, 14, 11, .92)); }
.wallet-gifts__box { flex: 0 0 52px; width: 52px; height: 52px; display: grid; place-items: center; border-radius: 14px; background: rgba(240, 192, 78, .1); }
.wallet-gifts__box svg { width: 34px; height: 34px; }
.wallet-gifts__txt { flex: 1 1 220px; min-width: 0; }
.wallet-gifts__txt .widget__title { margin: 0 0 4px; }
.wallet-gifts__txt p { margin: 0; }
.wallet-gifts__acts { display: flex; gap: 8px; flex-wrap: wrap; }

/* шапка помещается на всех ширинах (баланс + подарки + онлайн разработчика) */
@media (max-width: 1365px) {
  .topnav__search { min-width: 0; flex: 1 1 auto; }
  .online-chip__lbl, .bal-chip__cur:not(:first-child) .bal-chip__rank { display: none; }
}
@media (max-width: 1099px) {
  .topnav__search span { display: none; }
  .topnav__search { flex: 0 0 40px; width: 40px; max-width: 40px; min-height: 40px; height: 40px; padding: 0; justify-content: center; border-radius: 12px; }
}
@media (max-width: 420px) {
  .topnav:has(.bal-chip:not([hidden])) .brand__text { display: none; }
  .topnav:has(.bal-chip:not([hidden])) .brand { max-width: 40px; }
}

/* ── СОЦСЕТЬ: моя страница, друзья, сообщения, музыка ─────────────────── */
.side-group { margin: 0; }
.side-group > summary { list-style: none; cursor: pointer; user-select: none; }
.side-group > summary::-webkit-details-marker { display: none; }
.side-group__chev { margin-left: auto; width: 8px; height: 8px; border-right: 1.6px solid currentColor; border-bottom: 1.6px solid currentColor; transform: rotate(45deg) translate(-2px, -2px); opacity: .6; transition: transform .2s; }
.side-group[open] > summary .side-group__chev { transform: rotate(-135deg) translate(-1px, -1px); }
.side-group[open] > .side-link:not(summary) { padding-left: 22px; min-height: 40px; }
.side-link .soc-badge, .bnav .soc-badge { margin-left: auto; }
.bnav { position: relative; }
.bnav .soc-badge { position: absolute; top: 4px; left: calc(50% + 6px); margin: 0; min-width: 18px; padding: 0 5px; font-size: 10px; line-height: 16px; background: #c8402a; color: #fff; }
.btn .soc-badge { margin-left: 4px; background: #c8402a; color: #fff; }
.soc-badge[hidden] { display: none !important; }

.soc-av { position: relative; display: inline-grid; place-items: center; flex-shrink: 0; width: 40px; height: 40px; border-radius: 50%; background: var(--mg-graphite); }
.soc-av img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.soc-av__ini { width: 100%; height: 100%; display: grid; place-items: center; border-radius: 50%; font: 700 15px/1 var(--display); letter-spacing: .02em; color: #fff; background: linear-gradient(135deg, hsl(var(--h, 30) 62% 46%), hsl(calc(var(--h, 30) + 28) 66% 30%)); }
.soc-av__dot { position: absolute; right: 2%; bottom: 2%; width: 26%; height: 26%; min-width: 9px; min-height: 9px; border-radius: 50%; background: #46c46a; border: 2px solid var(--mg-card); }
.soc-av--xs { width: 30px; height: 30px; }
.soc-av--xs .soc-av__ini { font-size: 11px; }
.soc-av--sm { width: 40px; height: 40px; }
.soc-av--md { width: 52px; height: 52px; }
.soc-av--md .soc-av__ini { font-size: 18px; }
.soc-av--lg { width: 64px; height: 64px; }
.soc-av--lg .soc-av__ini { font-size: 22px; }
.soc-av--xl { width: 148px; height: 148px; border: 4px solid var(--mg-black); box-shadow: 0 10px 30px rgba(0,0,0,.45); }
.soc-av--xl .soc-av__ini { font-size: 48px; }
.soc-av--xl .soc-av__dot { border-width: 4px; border-color: var(--mg-black); right: 8%; bottom: 8%; width: 18%; height: 18%; }

.soc-card { padding: 16px; border: 1px solid var(--mg-border); border-radius: 16px; background: rgba(16, 14, 11, 0.88); }
.soc-card + .soc-card { margin-top: 12px; }
.soc-card__head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 12px; color: inherit; }
.soc-card__head h2 { font: 700 13px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--mg-hi); }
.soc-card__head span { color: var(--mg-muted); font-size: 13px; }
a.soc-card__head:hover h2 { color: var(--mg-amber-lite); }
.soc-icon-btn { display: inline-grid; place-items: center; width: 36px; height: 36px; padding: 0; border-radius: 10px; color: var(--mg-copy); }
.soc-icon-btn svg { width: 20px; height: 20px; }
.soc-icon-btn:hover { color: var(--mg-ivory); background: rgba(212, 161, 75, .08); }
.btn.soc-icon-btn { width: 42px; min-height: 42px; padding: 0; }

.soc-more { position: relative; }
.soc-menu { position: absolute; right: 0; top: calc(100% + 6px); z-index: 60; min-width: 220px; padding: 6px; border: 1px solid var(--mg-border); border-radius: 12px; background: #15120f; box-shadow: 0 18px 40px rgba(0,0,0,.55); }
.soc-menu > a, .soc-menu > button { display: block; width: 100%; padding: 10px 12px; border-radius: 8px; text-align: left; font-size: 14px; color: var(--mg-ivory); }
.soc-menu > a:hover, .soc-menu > button:hover { background: rgba(212, 161, 75, .1); }

/* шапка страницы */
.soc-page { box-sizing: border-box; width: 100%; max-width: 1020px; margin: 0 auto; padding-inline: 0; }
.soc-page .soc-grid,
.soc-page .soc-mainc,
.soc-page .soc-wall-head,
.soc-page .soc-compose { width: 100%; min-width: 0; box-sizing: border-box; }
.soc-head { position: relative; margin-bottom: 16px; border: 1px solid var(--mg-border); border-radius: 20px; background: rgba(16, 14, 11, 0.9); }
.soc-cover { position: relative; height: 220px; border-radius: 19px 19px 0 0; overflow: hidden; background: radial-gradient(120% 140% at 85% 0%, hsl(var(--h, 30) 70% 42% / .55), transparent 60%), radial-gradient(90% 120% at 10% 100%, rgba(242,138,45,.28), transparent 60%), linear-gradient(135deg, #1d1813, #0d0b09); background-size: cover; background-position: center; }
.soc-cover.has-img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(7,7,6,.55)); }
.soc-cover__tools { position: absolute; right: 14px; top: 14px; z-index: 2; display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 8px; max-width: calc(100% - 28px); }
.soc-cover__btn { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 0; border-radius: 10px; background: rgba(7,7,6,.6); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: var(--mg-ivory); font: inherit; font-size: 13px; cursor: pointer; }
.soc-cover__btn svg { width: 18px; height: 18px; }
.soc-cover__btn:hover { background: rgba(7,7,6,.8); }
.soc-cover__btn--ok { background: var(--grad-cta); color: var(--mg-ink); font-weight: 600; }
.soc-cover__btn--ok:hover { background: var(--grad-cta); filter: brightness(1.06); }
.soc-cover.is-moving { cursor: grab; touch-action: none; outline: 2px dashed rgba(242,138,45,.75); outline-offset: -2px; }
.soc-cover.is-moving.is-drag { cursor: grabbing; }
.soc-cover.is-moving::after { display: none; }
.soc-cover__tools.is-moving { top: auto; bottom: 14px; }
.soc-cover__hint { padding: 8px 12px; border-radius: 10px; background: rgba(7,7,6,.6); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: var(--mg-ivory); font-size: 13px; }
.pf-dlg { width: min(420px, 100%); }
.pf-stage { position: relative; width: min(300px, 100%); aspect-ratio: 1; margin: 0 auto; overflow: hidden; border-radius: 14px; background: #0b0a08; cursor: grab; touch-action: none; user-select: none; }
.pf-stage.is-drag { cursor: grabbing; }
.pf-stage img { position: absolute; left: 0; top: 0; max-width: none; transform-origin: 0 0; pointer-events: none; }
.pf-ring { position: absolute; inset: 0; background: radial-gradient(circle closest-side, transparent calc(100% - 2px), rgba(255,214,160,.9) calc(100% - 1px), rgba(4,4,3,.6) 100%); pointer-events: none; }
.pf-wait { position: absolute; left: 50%; bottom: 10px; transform: translateX(-50%); padding: 4px 10px; border-radius: 8px; background: rgba(7,7,6,.7); color: var(--mg-ivory); font-size: 12px; pointer-events: none; }
.pf-stage.is-ready .pf-wait { display: none; }
.pf-hint { margin: 12px 0 8px; color: var(--mg-muted); font-size: 13px; text-align: center; }
.pf-zoom { display: block; width: min(300px, 100%); margin: 0 auto; accent-color: #f28a2d; }
.pf-presets { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 12px; }
.soc-head__row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: end; gap: 20px; padding: 0 24px 20px; margin-top: -70px; position: relative; }
.soc-head__av { position: relative; }
.soc-head__avbtn { position: absolute; right: 6px; bottom: 6px; padding: 0; border: 0; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: var(--grad-cta); color: var(--mg-ink); cursor: pointer; box-shadow: 0 4px 14px rgba(0,0,0,.4); }
.soc-head__avbtn svg { width: 20px; height: 20px; }
.soc-head__who { min-width: 0; padding-bottom: 4px; }
.soc-name { font: 700 clamp(1.5rem, 3vw, 2.1rem)/1.05 var(--display); letter-spacing: -.01em; color: var(--mg-hi); overflow-wrap: anywhere; }
.soc-status { margin-top: 6px; color: var(--mg-copy); font-size: 15px; overflow-wrap: anywhere; }
.soc-status--edit { display: block; padding: 0; text-align: left; border-bottom: 1px dashed transparent; }
.soc-status--edit:hover { border-bottom-color: var(--mg-border); }
.soc-status-form { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.soc-status-form input { flex: 1 1 220px; min-width: 0; padding: 9px 12px; border: 1px solid var(--mg-border); border-radius: 10px; background: rgba(7,7,6,.6); }
.soc-seen { margin-top: 6px; color: var(--mg-muted); font-size: 13px; }
.soc-seen.is-on { color: #6fd48c; }
.soc-head__acts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; padding-bottom: 4px; }

.soc-grid { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 16px; align-items: start; }
.soc-side { position: sticky; top: calc(var(--nav-h) + 16px); }
.soc-side .soc-card + .soc-card { margin-top: 12px; }
.soc-info__row { display: flex; justify-content: space-between; gap: 12px; padding: 4px 0; font-size: 14px; }
.soc-info__row span { color: var(--mg-muted); }
.soc-info__about { margin-top: 6px; font-size: 14px; line-height: 1.55; color: var(--mg-copy); overflow-wrap: anywhere; }
.soc-info .btn { margin-top: 10px; }
.soc-friends6 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px 8px; }
.soc-friends6 a { display: grid; justify-items: center; gap: 6px; font-size: 12px; color: var(--mg-copy); text-align: center; min-width: 0; }
.soc-friends6 a span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.soc-friends6 a:hover { color: var(--mg-ivory); }

.soc-photos__strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.soc-photos__it { aspect-ratio: 1; padding: 0; border-radius: 10px; overflow: hidden; background: var(--mg-graphite); }
.soc-photos__it img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.soc-photos__it:hover img { transform: scale(1.04); }

.soc-compose { margin-top: 12px; }
.soc-compose__row { display: flex; gap: 12px; align-items: flex-start; }
.soc-compose textarea { flex: 1; min-width: 0; min-height: 44px; padding: 10px 12px; resize: vertical; border: 1px solid transparent; border-radius: 12px; background: rgba(7,7,6,.55); line-height: 1.45; }
.soc-compose textarea:focus { outline: none; border-color: var(--mg-border); }
.soc-compose__thumbs { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 0 52px; }
.soc-compose__thumb { position: relative; width: 76px; height: 76px; border-radius: 10px; overflow: hidden; }
.soc-compose__thumb img { width: 100%; height: 100%; object-fit: cover; }
.soc-compose__thumb button, .soc-compose__track button { position: absolute; top: 4px; right: 4px; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: rgba(7,7,6,.75); color: #fff; }
.soc-compose__thumb button svg, .soc-compose__track button svg { width: 12px; height: 12px; }
.soc-compose__track { position: relative; display: flex; align-items: center; gap: 10px; margin: 12px 0 0 52px; padding: 10px 40px 10px 12px; border-radius: 10px; background: rgba(242,138,45,.08); font-size: 14px; }
.soc-compose__track svg { width: 18px; height: 18px; flex-shrink: 0; color: var(--mg-amber-lite); }
.soc-compose__track button { top: 50%; transform: translateY(-50%); right: 10px; }
.soc-compose__bar { display: flex; align-items: center; gap: 4px; margin: 12px 0 0 52px; }
.soc-compose__bar .btn { margin-left: auto; }
.soc-tool { display: inline-flex; align-items: center; gap: 6px; padding: 8px 10px; border-radius: 10px; color: var(--mg-copy); font-size: 13px; cursor: pointer; }
.soc-tool svg { width: 18px; height: 18px; }
.soc-tool:hover { color: var(--mg-ivory); background: rgba(212, 161, 75, .08); }

.soc-wall-head { display: flex; align-items: baseline; gap: 8px; margin: 20px 4px 10px; }
.soc-wall-head h2 { font: 700 13px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--mg-hi); }
.soc-wall-head span { color: var(--mg-muted); font-size: 13px; }
.soc-wall-empty { line-height: 1.55; }
.soc-wall-more { display: flex; margin: 14px auto 0; }
.soc-post { margin-top: 12px; }
.soc-post__head { display: flex; align-items: center; gap: 12px; }
.soc-post__who { min-width: 0; flex: 1; display: grid; gap: 2px; }
.soc-post__who a { font-weight: 600; color: var(--mg-hi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.soc-post__who time { font-size: 12px; color: var(--mg-muted); }
.soc-post__text { margin-top: 12px; font-size: 15px; line-height: 1.6; overflow-wrap: anywhere; }
.soc-post__text a, .soc-cm__body a[target], .soc-msg__bubble a { color: var(--mg-amber-lite); text-decoration: underline; text-underline-offset: 2px; }
.soc-ph { display: grid; gap: 4px; margin-top: 12px; border-radius: 12px; overflow: hidden; }
.soc-ph__it { position: relative; padding: 0; background: var(--mg-graphite); overflow: hidden; }
.soc-ph__it img { width: 100%; height: 100%; object-fit: cover; }
.soc-ph--1 .soc-ph__it { max-height: 560px; }
.soc-ph--1 .soc-ph__it img { height: auto; max-height: 560px; margin: 0 auto; object-fit: contain; }
.soc-ph--2 { grid-template-columns: 1fr 1fr; }
.soc-ph--2 .soc-ph__it, .soc-ph--3 .soc-ph__it, .soc-ph--4 .soc-ph__it, .soc-ph--5 .soc-ph__it { aspect-ratio: 1; }
.soc-ph--3 { grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; }
.soc-ph--3 .soc-ph__it:first-child { grid-row: span 2; aspect-ratio: auto; }
.soc-ph--4 { grid-template-columns: 1fr 1fr; }
.soc-ph--5 { grid-template-columns: repeat(6, 1fr); }
.soc-ph--5 .soc-ph__it { grid-column: span 2; }
.soc-ph--5 .soc-ph__it:nth-child(-n+2) { grid-column: span 3; aspect-ratio: 4 / 3; }
.soc-ph__more { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(7,7,6,.55); font: 700 24px/1 var(--display); color: #fff; }
.soc-share { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 14px; margin-top: 12px; padding: 10px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(7,7,6,.45); color: inherit; transition: border-color .2s; }
.soc-share:hover { border-color: var(--mg-amber); }
.soc-share img, .soc-share__ph { width: 132px; height: 88px; border-radius: 10px; object-fit: cover; }
.soc-share__ph { display: grid; place-items: center; background: linear-gradient(135deg, #2a1d12, #120f0c); color: var(--mg-gold); font: 600 11px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; }
.soc-share__body { display: grid; align-content: center; gap: 4px; min-width: 0; }
.soc-share__body small { color: var(--mg-gold); font-size: 12px; }
.soc-share__body b { font: 700 16px/1.25 var(--body); color: var(--mg-hi); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.soc-share__body span { font-size: 13px; color: var(--mg-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.soc-share--preview { grid-template-columns: 96px minmax(0, 1fr); margin: 4px 0 0; }
.soc-share--preview img { width: 96px; height: 64px; }
.soc-post__bar { display: flex; gap: 6px; margin-top: 12px; padding-top: 10px; border-top: 1px solid rgba(212,161,75,.12); }
.soc-react { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 0 12px; border-radius: 999px; background: rgba(212,161,75,.06); color: var(--mg-copy); font-size: 13px; }
.soc-react svg { width: 18px; height: 18px; }
.soc-react:hover { color: var(--mg-ivory); background: rgba(212,161,75,.12); }
.soc-react.is-on { color: #ff6b6b; background: rgba(255, 92, 92, .12); }
.soc-cms { margin-top: 10px; display: grid; gap: 10px; }
.soc-cms__all { justify-self: start; padding: 0; color: var(--mg-amber-lite); font-size: 13px; }
.soc-cm { display: flex; gap: 10px; }
.soc-cm__body { min-width: 0; font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.soc-cm__body > a:first-child { font-weight: 600; color: var(--mg-hi); }
.soc-cm__meta { display: flex; gap: 12px; margin-top: 2px; font-size: 12px; color: var(--mg-muted); }
.soc-cm__meta button { padding: 0; color: var(--mg-muted); font-size: 12px; }
.soc-cm__meta button:hover { color: var(--mg-ivory); }
.soc-cm-form { display: flex; gap: 6px; align-items: center; }
.soc-cm-form input { flex: 1; min-width: 0; padding: 9px 12px; border: 1px solid var(--mg-border); border-radius: 999px; background: rgba(7,7,6,.55); }
.soc-card p a, .soc-wall-empty a, .soc-empty a:not(.btn), .soc-friends > p a { color: var(--mg-amber-lite); text-decoration: underline; text-underline-offset: 2px; }
.soc-closed { display: grid; justify-items: center; gap: 10px; padding: 40px 20px; text-align: center; }
.soc-closed svg { width: 36px; height: 36px; color: var(--mg-gold); }
.soc-empty div { margin-top: 14px; }
.soc-skel .soc-head__who i { display: block; width: 240px; max-width: 60vw; height: 22px; margin-top: 10px; border-radius: 6px; background: rgba(212,161,75,.1); animation: soc-pulse 1.2s ease-in-out infinite; }
.soc-skel .soc-head__who i + i { width: 160px; height: 14px; }
@keyframes soc-pulse { 50% { opacity: .45; } }

/* окна */
.soc-ov { position: fixed; inset: 0; z-index: 1200; display: grid; place-items: center; padding: 16px; background: rgba(4,4,3,.72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); animation: soc-fade .18s ease-out; }
.soc-dlg { width: min(520px, 100%); max-height: calc(100dvh - 32px); overflow: auto; padding: 22px; border: 1px solid var(--mg-border); border-radius: 18px; background: #12100d; box-shadow: 0 30px 80px rgba(0,0,0,.6); }
.soc-dlg__title { margin-bottom: 14px; font: 700 20px/1.15 var(--display); letter-spacing: .02em; text-transform: uppercase; color: var(--mg-hi); }
.soc-dlg__acts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin-top: 16px; }
.soc-dlg__acts .btn--ghost:first-child { margin-right: auto; }
.soc-form { display: grid; gap: 12px; }
.soc-form label { display: grid; gap: 6px; font-size: 13px; color: var(--mg-copy); }
.soc-form input:not([type="checkbox"]):not([type="file"]):not([type="radio"]), .soc-form textarea, .soc-form select { width: 100%; padding: 10px 12px; border: 1px solid var(--mg-border); border-radius: 10px; background: rgba(7,7,6,.6); color: var(--mg-ivory); font-size: 15px; }
.soc-form textarea { resize: vertical; line-height: 1.5; }
.soc-form select option { background: #15120f; }
.soc-form__sub { margin-top: 6px; font: 700 12px/1 var(--display); letter-spacing: .1em; text-transform: uppercase; color: var(--mg-gold); }
.soc-form__note { font-size: 12.5px; line-height: 1.5; }
.soc-form__pair { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.soc-form__pair + .soc-form__note { margin-top: -4px; }
@keyframes soc-fade { from { opacity: 0; } }
.soc-pick { display: grid; gap: 6px; max-height: 50vh; overflow: auto; }
.soc-pick__it { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; text-align: left; background: rgba(212,161,75,.05); }
.soc-pick__it:hover { background: rgba(212,161,75,.12); }
.soc-pick__it svg { width: 20px; height: 20px; color: var(--mg-amber-lite); flex-shrink: 0; }
.soc-pick__it span { display: grid; font-size: 13px; color: var(--mg-muted); }
.soc-pick__it b { font-size: 14px; color: var(--mg-hi); font-weight: 600; }

.soc-lb { position: fixed; inset: 0; z-index: 1300; display: grid; place-items: center; background: rgba(0,0,0,.92); }
.soc-lb { overflow: hidden; touch-action: none; overscroll-behavior: contain; }
.soc-lb img { max-width: 94vw; max-height: 88vh; object-fit: contain; border-radius: 6px; cursor: zoom-in; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; transform-origin: center; }
.soc-lb.is-zoomed img { cursor: grab; border-radius: 0; }
.soc-lb__x, .soc-lb__nav, .soc-lb__n { z-index: 2; }
.soc-lb.is-zoomed .soc-lb__nav, .soc-lb.is-zoomed .soc-lb__n { opacity: 0; pointer-events: none; }
.soc-lb__x { position: absolute; top: 14px; right: 14px; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.1); color: #fff; }
.soc-lb__dl { position: absolute; top: 18px; left: 14px; z-index: 2; padding: 8px 14px; border-radius: 999px; background: rgba(255,255,255,.16); color: #fff; font-weight: 700; }
.soc-lb__x svg { width: 22px; height: 22px; }
.soc-lb__nav { position: absolute; top: 50%; transform: translateY(-50%); width: 52px; height: 52px; border-radius: 50%; background: rgba(255,255,255,.1); color: #fff; font-size: 34px; line-height: 1; }
.soc-lb__prev { left: 14px; }
.soc-lb__next { right: 14px; }
.soc-lb__n { position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%); color: rgba(255,255,255,.75); font-size: 13px; }

/* друзья */
.soc-tabs { display: flex; gap: 6px; margin: 4px 0 16px; overflow-x: auto; scrollbar-width: none; }
.soc-tabs::-webkit-scrollbar { display: none; }
.soc-tab { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; min-height: 38px; padding: 0 14px; border: 1px solid var(--mg-border); border-radius: 999px; color: var(--mg-copy); font: 600 12px/1 var(--display); letter-spacing: .05em; text-transform: uppercase; }
.soc-tab:hover { color: var(--mg-ivory); border-color: var(--mg-amber); }
.soc-tab.is-active { border-color: transparent; background: var(--grad-cta); color: var(--mg-ink); }
.soc-tab .soc-badge { margin-left: 2px; }
.soc-sub { margin: 18px 0 10px; font: 700 13px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--mg-gold); }
.soc-count { margin-bottom: 10px; font-size: 13px; }
.soc-search { display: flex; gap: 8px; margin-bottom: 14px; }
.soc-search input { flex: 1; min-width: 0; padding: 10px 14px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(7,7,6,.6); font-size: 15px; }
.soc-people { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 10px; }
.soc-person { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border: 1px solid var(--mg-border); border-radius: 16px; background: rgba(16,14,11,.88); min-width: 0; }
.soc-person__who { flex: 1; min-width: 0; display: grid; gap: 3px; }
.soc-person__who a { font-weight: 600; color: var(--mg-hi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.soc-person__st { font-size: 13px; color: var(--mg-copy); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.soc-person__seen { font-size: 12px; color: var(--mg-muted); }
.soc-person__seen.is-on { color: #6fd48c; }
.soc-person__acts { display: flex; flex-direction: column; gap: 6px; flex-shrink: 0; }
.soc-feed .soc-post:first-child { margin-top: 0; }

/* сообщения */
.soc-msgs { display: grid; grid-template-columns: 330px minmax(0, 1fr); height: calc(100dvh - var(--nav-h) - var(--works-h, 0px) - 40px); min-height: 480px; border: 1px solid var(--mg-border); border-radius: 18px; overflow: hidden; background: rgba(16,14,11,.9); }
body:has(.mus-bar:not([hidden])) .soc-msgs { height: calc(100dvh - var(--nav-h) - var(--works-h, 0px) - 132px); }
.soc-dlist { display: flex; flex-direction: column; min-height: 0; border-right: 1px solid var(--mg-border); }
.soc-dlist__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 16px; border-bottom: 1px solid rgba(212,161,75,.14); }
.soc-dlist__head h1 { font: 700 20px/1 var(--display); letter-spacing: .02em; text-transform: uppercase; color: var(--mg-hi); }
.soc-dlist__items { flex: 1; overflow-y: auto; padding: 6px; }
.soc-dlist__empty { padding: 16px; font-size: 14px; line-height: 1.5; }
.soc-dlist__it { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 10px; border-radius: 12px; color: inherit; }
.soc-dlist__it:hover { background: rgba(212,161,75,.06); }
.soc-dlist__it.is-active { background: rgba(242,138,45,.12); }
.soc-dlist__body { display: grid; gap: 3px; min-width: 0; }
.soc-dlist__body b { font-weight: 600; color: var(--mg-hi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.soc-dlist__body span { font-size: 13px; color: var(--mg-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.soc-dlist__it.is-unread .soc-dlist__body span { color: var(--mg-ivory); }
.soc-dlist__meta { display: grid; justify-items: end; gap: 6px; font-size: 12px; color: var(--mg-muted); }
.soc-dlist__meta i { min-width: 20px; padding: 0 6px; border-radius: 999px; background: var(--grad-cta); color: var(--mg-ink); font: 700 11px/20px var(--body); font-style: normal; text-align: center; }
.soc-chat { display: flex; flex-direction: column; min-height: 0; min-width: 0; }
.soc-chat__head { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1px solid rgba(212,161,75,.14); }
.soc-chat__back { display: inline-grid; flex-shrink: 0; }
.soc-chat__who { flex: 1; min-width: 0; display: grid; gap: 2px; }
.soc-chat__who a, .soc-chat__who b { font-weight: 600; color: var(--mg-hi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.soc-chat__note { margin: 0; padding: 8px 16px; border-bottom: 1px solid rgba(212,161,75,.14); background: rgba(242,138,45,.08); color: var(--mg-copy); font-size: 13px; line-height: 1.4; }
.soc-gift { display: flex; align-items: center; gap: 12px; min-width: min(260px, 60vw); }
.soc-gift__art { width: 64px; flex: 0 0 64px; border-radius: 12px; }
.soc-gift__art--box { display: grid; place-items: center; aspect-ratio: 1; background: rgba(242,138,45,.14); color: var(--mg-amber); }
.soc-gift__art--box svg { width: 30px; height: 30px; }
.soc-gift__body { display: grid; gap: 4px; justify-items: start; min-width: 0; }
.soc-gift__body b { font-weight: 600; }
.soc-gift__body em { font-style: italic; opacity: .85; font-size: 14px; }
.soc-gift__open { margin-top: 4px; }
.soc-gift__done { font-size: 13px; opacity: .8; }
.soc-msg.is-gift .soc-msg__bubble { padding: 10px 12px 8px; }
.desk-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 8px; padding: 10px 12px; border: 1px solid rgba(242,138,45,.35); border-radius: 12px; background: rgba(242,138,45,.08); font-size: 13px; line-height: 1.4; color: var(--mg-copy); }
.desk-bar span { flex: 1 1 180px; }
.desk-bar__x { width: 28px; height: 28px; border-radius: 8px; color: var(--mg-muted); font-size: 18px; line-height: 1; }
.desk-bar__x:hover { color: var(--mg-ivory); background: rgba(212,161,75,.1); }
.desk-bar--denied { display: block; }
.soc-chat__who span { font-size: 12px; color: var(--mg-muted); }
.soc-chat__who span.is-on { color: #6fd48c; }
.soc-chat__who .soc-chat__count { cursor: pointer; justify-self: start; }
.soc-chat__who .soc-chat__count:hover { color: var(--mg-hi); text-decoration: underline; }
.soc-chat__box { flex: 1; overflow-y: auto; padding: 16px 18px; display: flex; flex-direction: column; gap: 4px; background: radial-gradient(circle at 80% 10%, rgba(242,138,45,.05), transparent 50%); }
.soc-chat__empty { margin: auto; display: grid; justify-items: center; gap: 8px; padding: 30px; text-align: center; color: var(--mg-muted); }
.soc-chat__empty svg { width: 40px; height: 40px; color: var(--mg-gold); }
.soc-chat__empty b { color: var(--mg-hi); font-size: 16px; }
.soc-day { align-self: center; margin: 12px 0 6px; position: sticky; top: 8px; z-index: 3; }
.soc-day span { padding: 4px 12px; border-radius: 999px; background: rgba(212,161,75,.1); color: var(--mg-copy); font-size: 12px; }
.soc-newline { align-self: stretch; display: flex; align-items: center; gap: 10px; margin: 10px 0 4px; color: #d4a14b; font-size: 12px; font-weight: 600; letter-spacing: .02em; }
.soc-newline::before, .soc-newline::after { content: ""; flex: 1; height: 1px; background: rgba(212,161,75,.45); }
.soc-msg { display: flex; align-items: center; gap: 6px; max-width: min(78%, 560px); }
.soc-msg.is-mine { align-self: flex-end; flex-direction: row-reverse; }
.soc-msg__bubble { padding: 8px 12px 6px; border-radius: 16px 16px 16px 4px; background: #221c16; font-size: 15px; line-height: 1.45; overflow-wrap: anywhere; }
.soc-msg.is-mine .soc-msg__bubble { border-radius: 16px 16px 4px 16px; background: linear-gradient(135deg, #8a4a17, #6b3a12); color: #fff3e0; }
.soc-msg__meta { float: right; display: inline-flex; gap: 4px; margin: 6px 0 0 10px; font-size: 11px; color: rgba(246,230,197,.55); }
.soc-msg__tick.is-read { color: #ffd9a0; font-style: normal; }
.soc-msg__tick { font-style: normal; }
.soc-msg__acts { opacity: 0; transition: opacity .15s; }
.soc-msg:hover .soc-msg__acts, .soc-msg:focus-within .soc-msg__acts { opacity: 1; }
.soc-msg__acts button { padding: 4px 6px; border-radius: 6px; color: var(--mg-muted); font-size: 12px; }
.soc-msg__acts button:hover { color: var(--mg-ivory); background: rgba(212,161,75,.1); }
.soc-chat__form { display: flex; align-items: flex-end; gap: 8px; padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid rgba(212,161,75,.14); }
.soc-chat__form textarea { flex: 1; min-width: 0; max-height: 160px; padding: 10px 14px; border: 1px solid var(--mg-border); border-radius: 20px; background: rgba(7,7,6,.6); resize: none; line-height: 1.4; font-size: 15px; }
.soc-send { display: grid; place-items: center; width: 44px; height: 44px; flex-shrink: 0; border-radius: 50%; background: var(--grad-cta); color: var(--mg-ink); }
.soc-send svg { width: 20px; height: 20px; }
.soc-chat__closed { padding: 14px; border-top: 1px solid rgba(212,161,75,.14); text-align: center; color: var(--mg-muted); font-size: 14px; }

/* ещё */
.soc-more-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); gap: 10px; }
.soc-more-link { display: grid; gap: 4px; padding: 14px 16px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(16,14,11,.88); color: inherit; transition: border-color .2s, transform .2s; }
.soc-more-link:hover { border-color: var(--mg-amber); transform: translateY(-1px); }
.soc-more-link b { display: flex; align-items: center; gap: 8px; font: 700 14px/1.1 var(--display); letter-spacing: .05em; text-transform: uppercase; color: var(--mg-hi); }
.soc-more-link span { font-size: 13px; color: var(--mg-muted); }
.soc-report { display: grid; gap: 8px; }
.soc-report.is-done { opacity: .6; }
.soc-report__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.soc-share-btn svg { flex-shrink: 0; }

/* музыка */
.mus-page { max-width: 980px; }
.mus-upload-btn svg { width: 18px; height: 18px; }
.mus-lead { margin: 6px 0 14px; color: var(--mg-copy); font-size: 14px; }
.mus-list { display: grid; gap: 2px; padding: 6px; border: 1px solid var(--mg-border); border-radius: 16px; background: rgba(16,14,11,.88); }
.soc-card .mus-list, .soc-post .mus-list { padding: 0; border: 0; background: none; }
.soc-post .mus-list { margin-top: 12px; padding: 4px; border-radius: 12px; background: rgba(7,7,6,.45); }
.mus-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto auto auto; align-items: center; gap: 12px; padding: 6px 8px; border-radius: 12px; }
.mus-row:hover, .mus-row.is-cur { background: rgba(242,138,45,.08); }
.mus-row.is-hidden { opacity: .5; }
.mus-row__play { position: relative; width: 48px; height: 48px; padding: 0; border-radius: 10px; overflow: hidden; background: linear-gradient(135deg, #2a1d12, #15110d); color: var(--mg-gold); flex-shrink: 0; }
.mus-row__play img { width: 100%; height: 100%; object-fit: cover; }
.mus-row__ph { display: grid; place-items: center; width: 100%; height: 100%; }
.mus-row__ph svg { width: 22px; height: 22px; }
.mus-row__btn { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(7,7,6,.5); color: #fff; opacity: 0; transition: opacity .15s; }
.mus-row__btn svg { width: 22px; height: 22px; }
.mus-row:hover .mus-row__btn, .mus-row.is-cur .mus-row__btn, .mus-row__play:focus-visible .mus-row__btn { opacity: 1; }
.mus-row.is-playing .mus-row__btn { background: rgba(242,138,45,.55); }
.mus-row__main { display: grid; gap: 2px; min-width: 0; }
.mus-row__main b { font-weight: 600; color: var(--mg-hi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mus-row.is-cur .mus-row__main b { color: var(--mg-amber-lite); }
.mus-row__main span { font-size: 13px; color: var(--mg-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mus-badge { display: inline-block; margin-left: 4px; padding: 1px 7px; border-radius: 999px; background: rgba(106,215,255,.12); color: #8fdcff; font: 600 10.5px/16px var(--body); font-style: normal; vertical-align: 1px; }
.mus-badge--warn { background: rgba(200,64,42,.18); color: #ffb3a5; }
.mus-row__plays, .mus-row__dur { font-size: 12.5px; color: var(--mg-muted); font-variant-numeric: tabular-nums; }
.mus-row__plays:not(:empty)::before { content: "▶ "; font-size: 9px; vertical-align: 1px; opacity: .7; }
.mus-like { display: inline-flex; align-items: center; gap: 5px; min-width: 36px; height: 36px; padding: 0 8px; border-radius: 10px; color: var(--mg-muted); font-size: 12.5px; }
.mus-like svg { width: 18px; height: 18px; }
.mus-like:hover { color: var(--mg-ivory); }
.mus-like.is-on { color: #ff6b6b; }
.mus-row__acts { display: inline-flex; align-items: center; gap: 2px; }
.mus-add { display: inline-grid; place-items: center; width: 36px; height: 36px; padding: 0; border-radius: 10px; color: var(--mg-muted); }
.mus-add svg { width: 19px; height: 19px; }
.mus-add:hover { color: var(--mg-ivory); background: rgba(255,255,255,.05); }
.mus-add.is-on { color: var(--mg-amber); }
.mus-add[hidden] { display: none; }
.mus-add-ph { width: 36px; }
.mus-list--compact .mus-row { grid-template-columns: auto minmax(0, 1fr) auto auto auto; gap: 10px; padding: 5px 4px; }
.mus-list--compact .mus-row__play { width: 40px; height: 40px; }
.mus-search { margin-top: 2px; }
.mus-up__x { position: sticky; top: 0; float: right; z-index: 3; width: 40px; height: 40px; margin: -8px -8px 0 8px; border: 1px solid var(--mg-border); border-radius: 50%; background: var(--mg-card, rgba(255,255,255,.9)); color: inherit; font-size: 24px; line-height: 1; cursor: pointer; display: grid; place-items: center; }
.mus-up__x:hover { border-color: var(--accent, #e8772e); color: var(--accent, #e8772e); }
.mus-up__file { position: relative; display: grid !important; place-items: center; min-height: 86px; padding: 14px; border: 1.5px dashed var(--mg-border); border-radius: 14px; text-align: center; cursor: pointer; }
.mus-up__file:hover { border-color: var(--mg-amber); }
.mus-up__file input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.mus-up__file span { font-size: 14px; color: var(--mg-ivory); }
.mus-up__rights { display: flex !important; grid-template-columns: none; align-items: flex-start; gap: 10px !important; padding: 12px; border-radius: 12px; background: rgba(242,138,45,.08); line-height: 1.45; }
.mus-up__rights input { width: 20px; height: 20px; margin-top: 1px; flex-shrink: 0; accent-color: var(--mg-amber); }
.mus-up__rights b { color: var(--mg-hi); }
.mus-row__rights { margin: 2px 0 0; font-size: 12.5px; line-height: 1.4; color: var(--mg-muted); white-space: normal; }
.mus-link { padding: 0; border: 0; background: none; color: var(--mg-amber); font: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.mus-rights { max-width: 560px; max-height: calc(100dvh - 32px); overflow-y: auto; }
.mus-rights__lead { margin: -4px 0 12px; font-size: 14px; line-height: 1.45; }
.mus-rights__bases { display: grid; gap: 8px; }
.mus-rights__base { display: flex !important; align-items: flex-start; gap: 10px !important; padding: 11px 12px; border: 1px solid var(--mg-border); border-radius: 12px; cursor: pointer; line-height: 1.4; font-size: 13px; color: var(--mg-muted); }
.mus-rights__base:has(input:checked) { border-color: var(--mg-amber); background: rgba(242,138,45,.08); }
.mus-rights__base input { width: 18px; height: 18px; margin-top: 2px; flex-shrink: 0; accent-color: var(--mg-amber); }
.mus-rights__base b { display: block; margin-bottom: 2px; font-size: 14px; color: var(--mg-hi); }
.mus-rights__row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 480px) { .mus-rights__row { grid-template-columns: 1fr; } }
.mus-cover { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 14px; padding: 12px; border: 1.5px dashed var(--mg-border); border-radius: 14px; transition: border-color .2s, box-shadow .2s; }
.mus-cover.has-img { border-style: solid; }
.mus-cover.is-need { border-color: #e5484d; box-shadow: 0 0 0 3px rgba(229, 72, 77, .18); }
.mus-cover__pv { width: 112px; height: 112px; border-radius: 12px; overflow: hidden; display: grid; place-items: center; background: rgba(242, 138, 45, .1); color: var(--mg-amber); }
.mus-cover__pv svg { width: 40px; height: 40px; }
.mus-cover__pv img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mus-cover__side { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.mus-cover__side b { color: var(--mg-hi); font-size: 14px; }
.mus-cover__side small { color: var(--mg-muted); font-size: 12px; line-height: 1.35; }
.mus-cover__src { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.mus-cover .mus-cover__src label.btn { display: inline-flex !important; cursor: pointer; }
.mus-cover .mus-cover__av { display: flex !important; align-items: center; gap: 8px !important; font-size: 13px; color: var(--mg-ivory); cursor: pointer; }
.mus-cover__av input { width: 18px; height: 18px; accent-color: var(--mg-amber); }
.mus-cover__gal { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fill, minmax(64px, 1fr)); gap: 6px; max-height: 210px; overflow: auto; }
.mus-cover__pick { aspect-ratio: 1; padding: 0; border: 2px solid transparent; border-radius: 8px; overflow: hidden; cursor: pointer; background: none; }
.mus-cover__pick:hover { border-color: var(--mg-amber); }
.mus-cover__pick img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 480px) {
  .mus-cover { grid-template-columns: 84px minmax(0, 1fr); gap: 10px; }
  .mus-cover__pv { width: 84px; height: 84px; }
}
.mus-up__progress { position: relative; height: 30px; border-radius: 10px; background: rgba(7,7,6,.6); overflow: hidden; }
.mus-up__progress i { position: absolute; inset: 0 auto 0 0; width: 0; background: var(--grad-cta); transition: width .3s; }
.mus-up__progress span { position: relative; display: grid; place-items: center; height: 100%; font-size: 13px; color: var(--mg-ivory); mix-blend-mode: difference; }

.mus-bar { position: fixed; left: 50%; bottom: 14px; z-index: 190; transform: translateX(-50%); width: min(980px, calc(100% - 28px)); display: grid; grid-template-columns: 48px minmax(0, 1.1fr) auto minmax(0, 1.4fr) auto auto auto; align-items: center; gap: 14px; padding: 8px 12px; border: 1px solid var(--mg-border); border-radius: 18px; background: rgba(18,15,12,.96); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: 0 20px 50px rgba(0,0,0,.55); }
.mus-bar[hidden] { display: none; }
.mus-bar__cover { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 10px; overflow: hidden; background: linear-gradient(135deg, #2a1d12, #15110d); color: var(--mg-gold); }
.mus-bar__cover img { width: 100%; height: 100%; object-fit: cover; }
.mus-bar__cover svg { width: 22px; height: 22px; }
.mus-bar__info { display: grid; gap: 2px; min-width: 0; }
.mus-bar__info b { font-weight: 600; color: var(--mg-hi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mus-bar__info span { font-size: 12.5px; color: var(--mg-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mus-bar__ctl { display: flex; align-items: center; gap: 4px; }
.mus-bar__ctl button { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; color: var(--mg-ivory); }
.mus-bar__ctl button svg { width: 20px; height: 20px; }
.mus-bar__ctl button:hover { background: rgba(212,161,75,.1); }
.mus-bar__ctl .mus-bar__pp { width: 44px; height: 44px; background: var(--grad-cta); color: var(--mg-ink); }
.mus-bar__ctl .mus-bar__pp:hover { background: var(--grad-cta); filter: brightness(1.06); }
.mus-bar__seek { display: flex; align-items: center; gap: 8px; min-width: 0; font-size: 12px; color: var(--mg-muted); font-variant-numeric: tabular-nums; }
.mus-bar__seek input { flex: 1; min-width: 0; accent-color: var(--mg-amber); }
.mus-bar__x { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; color: var(--mg-muted); }
.mus-bar__x svg { width: 18px; height: 18px; }
.mus-bar__share { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; color: var(--mg-muted); }
.mus-bar__share svg { width: 18px; height: 18px; }
.mus-bar__share:hover { color: var(--mg-amber); background: rgba(212,161,75,.1); }
.mus-bar__x:hover { color: var(--mg-ivory); background: rgba(212,161,75,.1); }
body.has-mus-bar .main { padding-bottom: 110px; }

@media (max-width: 1100px) {
  .soc-grid { grid-template-columns: 260px minmax(0, 1fr); }
  .soc-msgs { grid-template-columns: 280px minmax(0, 1fr); }
}
@media (max-width: 860px) {
  .soc-head { border-radius: 16px; }
  .soc-cover { height: 150px; border-radius: 15px 15px 0 0; }
  .soc-cover__tools, .soc-cover.has-gifts .soc-cover__tools, .soc-cover__tools.is-moving { top: 10px; bottom: auto; left: 10px; right: auto; justify-content: flex-start; gap: 6px; max-width: calc(100% - 92px); }
  .soc-cover__btn { padding: 6px 10px; font-size: 12.5px; gap: 6px; }
  .soc-cover__btn svg { width: 16px; height: 16px; }
  .soc-cover__hint { display: none; }
  .soc-head__row { grid-template-columns: 1fr; justify-items: center; text-align: center; gap: 12px; margin-top: -64px; padding: 0 16px 16px; }
  .soc-av--xl { width: 116px; height: 116px; }
  .soc-av--xl .soc-av__ini { font-size: 38px; }
  .soc-head__acts { justify-content: center; }
  .soc-status-form { justify-content: center; }
  .soc-status--edit { margin: 6px auto 0; text-align: center; }
  .soc-grid { grid-template-columns: minmax(0, 1fr); justify-items: stretch; }
  .soc-side { position: static; display: contents; }
  .soc-side > .soc-card { margin-top: 0 !important; margin-bottom: 12px; width: 100%; max-width: 100%; }
  .soc-mainc { order: 0; width: 100%; max-width: 100%; }
  .soc-page { max-width: 100%; margin-inline: auto; padding-inline: 0; }
  .main:has(.soc-page) { padding-left: 12px; padding-right: 12px; box-sizing: border-box; }
  .soc-head { width: 100%; margin-inline: 0; box-sizing: border-box; }
  .soc-compose, .soc-wall-head, .soc-card { box-sizing: border-box; max-width: 100%; }
  .soc-friends6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .soc-msgs { display: block; height: calc(100dvh - var(--nav-h) - var(--works-h, 0px) - 168px - env(safe-area-inset-bottom, 0px)); min-height: 320px; border-radius: 16px; }
  .soc-msgs .soc-dlist { height: 100%; border-right: 0; }
  .soc-msgs.has-peer .soc-dlist { display: none; }
  .soc-msgs:not(.has-peer) .soc-chat { display: none; }
  .soc-msgs .soc-chat { height: 100%; }
  .soc-chat__back { display: inline-grid; }
  .soc-msg { max-width: 88%; }
  .soc-msg__acts { display: none; }
  .soc-msg.is-open .soc-msg__acts { display: block; opacity: 1; }
  .mus-bar { bottom: calc(76px + env(safe-area-inset-bottom, 0px)); grid-template-columns: 42px minmax(0, 1fr) auto auto; gap: 10px; padding: 6px 8px; border-radius: 14px; width: calc(100% - 16px); }
  .mus-bar__cover { width: 42px; height: 42px; }
  .mus-bar__seek { grid-column: 1 / -1; order: 5; margin-top: -2px; }
  .mus-bar__ctl [data-mact="prev"] { display: none; }
  .mus-bar__like, .mus-bar__share { display: none; }
  body.has-mus-bar .main { padding-bottom: calc(220px + env(safe-area-inset-bottom, 0px)); }
}
@media (max-width: 560px) {
  .soc-share { grid-template-columns: 96px minmax(0, 1fr); gap: 10px; }
  .soc-share img, .soc-share__ph { width: 96px; height: 72px; }
  .soc-share__body b { font-size: 14.5px; }
  .soc-share__body span { display: none; }
  .soc-friends6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .soc-compose__thumbs, .soc-compose__track, .soc-compose__bar { margin-left: 0; }
  .soc-tool span { display: none; }
  .soc-person { padding: 10px 12px; gap: 12px; }
  .soc-person .soc-av--lg { width: 52px; height: 52px; }
  .mus-row { grid-template-columns: auto minmax(0, 1fr) auto auto; gap: 10px; }
  .mus-row__plays, .mus-row__dur { display: none; }
  .mus-list--compact .mus-row { grid-template-columns: auto minmax(0, 1fr) auto auto; }
  .mus-like span { display: none; }
  .soc-dlg { padding: 18px; border-radius: 16px; }
  .soc-ov { align-items: end; padding: 0; }
  .soc-ov .soc-dlg { width: 100%; max-height: 92dvh; border-radius: 18px 18px 0 0; padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)); }
  .soc-photos__strip { grid-template-columns: repeat(4, 1fr); gap: 4px; }
}

/* короткие ролики ГранаСкопа */
.vid-kind { margin: 0 0 18px; }
.skop-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 14px; }
.skop-card { display: grid; gap: 6px; min-width: 0; color: var(--mg-hi); }
.skop-card__media { position: relative; aspect-ratio: 9 / 16; border-radius: 16px; overflow: hidden; border: 1px solid var(--mg-border); background: linear-gradient(160deg, rgba(42,34,22,.9), rgba(12,11,9,.95)); }
.skop-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; }
.skop-card:hover .skop-card__media img { transform: scale(1.04); }
.skop-card__ph { position: absolute; inset: 0; display: grid; place-items: center; color: var(--mg-amber); }
.skop-card__ph svg { width: 42px; height: 42px; }
.skop-card__views { position: absolute; left: 8px; bottom: 8px; display: inline-flex; align-items: center; gap: 4px; padding: 4px 8px; border-radius: 999px; background: rgba(0,0,0,.6); color: #fff; font-size: 12px; font-weight: 600; }
.skop-card__title { font-size: 14px; font-weight: 600; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.skop-card__author { font-size: 12px; color: var(--mg-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.skop-card--ghost .skop-card__media { animation: skopPulse 1.4s ease-in-out infinite; }
@keyframes skopPulse { 50% { opacity: .55; } }
.skop-empty { display: grid; justify-items: center; gap: 12px; max-width: 560px; margin: 24px auto; padding: 32px 24px; text-align: center; border: 1px solid var(--mg-border); border-radius: 20px; background: rgba(16,14,11,.88); }
.skop-empty b { font: 700 20px/1.25 var(--display); color: var(--mg-ivory); }
.skop-empty p { margin: 0; color: var(--mg-copy); line-height: 1.55; }
.skop-empty__acts { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.skop-more { display: flex; justify-content: center; margin: 22px 0 8px; }
@media (max-width: 560px) {
  .skop-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .skop-empty { padding: 24px 16px; }
}

/* эфиры */
.live-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; margin-top: 18px; }
.live-card { position: relative; display: grid; gap: 8px; padding: 16px 16px 14px; border: 1px solid var(--mg-border); border-radius: 16px; background: linear-gradient(160deg, rgba(42,34,22,.85), rgba(12,11,9,.92)); color: var(--mg-hi); transition: border-color .2s ease, transform .2s ease; }
.live-card:hover { border-color: var(--mg-amber); transform: translateY(-2px); }
.live-card h3 { margin: 0; font: 700 18px/1.25 var(--display); color: var(--mg-ivory); }
.live-card p { margin: 0; font-size: 13px; }
.live-card__badge { justify-self: start; display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: rgba(214,58,46,.16); color: #ff7a6b; font-size: 11px; font-weight: 700; letter-spacing: .06em; }
.live-card__badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #ff4d3d; animation: skopPulse 1.4s ease-in-out infinite; }
.live-grid .empty { grid-column: 1 / -1; }

/* трек внутри статьи */
.post-track { margin: 22px 0; padding: 6px; border: 1px solid var(--mg-border); border-radius: 18px; background: rgba(16,14,11,.88); }
.post-track .mus-row { border: 0; background: transparent; }
.post-track .mus-row__main b { font-size: 15px; }
.post-track .mus-row__main span { font-size: 13px; }
.ed-track { display: flex; align-items: center; gap: 12px; margin: 14px 0; padding: 10px 12px; border: 1px dashed var(--mg-amber); border-radius: 14px; background: rgba(255,190,90,.06); user-select: none; }
.ed-track__ic { display: grid; place-items: center; width: 36px; height: 36px; flex-shrink: 0; border-radius: 10px; background: var(--grad-cta); color: var(--mg-ink); font-size: 18px; }
.ed-track__t { flex: 1; min-width: 0; display: grid; gap: 2px; font-size: 13px; color: var(--mg-copy); }
.ed-track__t b { font-size: 15px; color: var(--mg-hi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ed-track__x { width: 32px; height: 32px; flex-shrink: 0; border: 1px solid var(--mg-border); border-radius: 50%; background: transparent; color: var(--mg-copy); font-size: 18px; line-height: 1; cursor: pointer; }
.ed-track__x:hover { color: var(--mg-ivory); border-color: var(--mg-amber); }
.ed-track .gdz-spell-err { background: none; text-decoration: none; border: 0; }
.soc-share--preview:not(:has(img)) { grid-template-columns: minmax(0, 1fr); }
.browse-switch--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.yt-grid .yt-skop-shelf { grid-column: 1 / -1; margin: 4px 0 12px; }
.yt-skop-shelf { margin: 0 0 20px; padding-bottom: 14px; border-bottom: 1px solid rgba(212,161,75,.16); }
.yt-skop-shelf__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; flex-wrap: wrap; }
.yt-skop-shelf__title { display: inline-flex; align-items: center; gap: 10px; font: 800 17px/1.2 var(--display); color: var(--mg-hi); text-decoration: none; }
.yt-skop-shelf__title img { border-radius: 8px; }
.yt-skop-shelf__all { font-size: 13px; font-weight: 600; color: var(--mg-amber, #f28a2d); text-decoration: none; }
.yt-skop-shelf__all:hover { text-decoration: underline; }
.yt-skop-shelf__track { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 4px; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: thin; }
.yt-skop-card { flex: 0 0 112px; scroll-snap-align: start; text-decoration: none; color: inherit; }
.yt-skop-card img { display: block; width: 112px; height: 198px; object-fit: cover; border-radius: 12px; background: #1a1410; border: 1px solid rgba(212,161,75,.12); }
.yt-skop-card span { display: -webkit-box; margin-top: 6px; font-size: 12px; line-height: 1.3; color: var(--mg-hi); overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
@media (min-width: 900px) {
  .yt-skop-card { flex-basis: 128px; }
  .yt-skop-card img { width: 128px; height: 228px; }
}
.skop-bar { position: relative; display: flex; align-items: center; gap: 14px; margin: -6px 0 18px; padding: 12px 16px; border-radius: 18px; overflow: hidden; color: #fff; text-decoration: none; background: linear-gradient(110deg, #17110c 0%, #2a1a0e 55%, #4a2410 100%); border: 1px solid rgba(255,170,80,.35); box-shadow: 0 10px 28px rgba(0,0,0,.18); transition: transform .18s ease, box-shadow .18s ease; }
.skop-bar:hover { transform: translateY(-1px); box-shadow: 0 14px 32px rgba(0,0,0,.24); }
.skop-bar__ico { width: 44px; height: 44px; flex-shrink: 0; border-radius: 12px; }
.skop-bar__txt { flex: 1; min-width: 0; display: grid; gap: 2px; }
.skop-bar__txt b { font-size: 18px; letter-spacing: .01em; }
.skop-bar__txt small { font-size: 13px; color: rgba(255,236,214,.78); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.skop-bar__pics { display: flex; gap: 6px; }
.skop-bar__pics img { width: 40px; height: 64px; object-fit: cover; border-radius: 8px; border: 1px solid rgba(255,255,255,.18); }
.skop-bar__go { flex-shrink: 0; padding: 10px 18px; border-radius: 999px; background: linear-gradient(135deg, #ffb347, #ff7a1a); color: #1b0f05; font-weight: 800; font-size: 14px; }
@media (max-width: 560px) {
  .skop-bar { gap: 10px; padding: 10px 12px; }
  .skop-bar__pics { display: none; }
  .skop-bar__ico { width: 38px; height: 38px; }
  .skop-bar__txt b { font-size: 16px; }
  .skop-bar__txt small { white-space: normal; font-size: 12px; }
  .skop-bar__go { padding: 9px 14px; font-size: 13px; }
}

/* ── ШОРТСЫ: вертикальная лента в виде ГранаСкопа ─────────────────────── */
html.sk-on, html.sk-on body { overflow: hidden; }
html.sk-on .gdz-beta-chip { display: none; }
.sk-hold { min-height: 70vh; }
.sk-root { position: fixed; inset: 0; z-index: 900; background: #050506; color: #fff; }
.sk-root[hidden] { display: none; }
.sk-feed { position: absolute; inset: 0; overflow-y: auto; scroll-snap-type: y mandatory; overscroll-behavior: contain; scrollbar-width: none; }
.sk-feed::-webkit-scrollbar { display: none; }
.sk-slide { position: relative; height: 100%; display: flex; align-items: center; justify-content: center; scroll-snap-align: start; scroll-snap-stop: always; }
.sk-frame { position: relative; width: 100%; height: 100%; background: #000; overflow: hidden; }
.sk-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #000; }
.sk-slide.is-wide .sk-video { object-fit: contain; }
.sk-tap { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; padding: 0; background: transparent; cursor: pointer; }
.sk-paused { position: absolute; left: 50%; top: 50%; display: grid; place-items: center; width: 76px; height: 76px; margin: -38px 0 0 -38px; border-radius: 50%; background: rgba(0, 0, 0, .45); opacity: 0; transform: scale(.8); transition: opacity .18s, transform .18s; pointer-events: none; }
.sk-paused svg { width: 38px; height: 38px; margin-left: 4px; }
.sk-slide.is-paused .sk-paused { opacity: 1; transform: none; }
.sk-info { position: absolute; left: 14px; right: 80px; bottom: 20px; text-shadow: 0 1px 3px rgba(0, 0, 0, .65); pointer-events: none; }
.sk-info a, .sk-cap { pointer-events: auto; }
.sk-who { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.sk-login { overflow: hidden; color: #fff; font-weight: 700; font-size: 17px; white-space: nowrap; text-overflow: ellipsis; text-decoration: none; }
.sk-views { flex: none; color: rgba(255, 255, 255, .72); font-size: 13px; }
.sk-cap { display: -webkit-box; margin: 6px 0 0; overflow: hidden; font-size: 15px; line-height: 1.4; white-space: pre-line; -webkit-line-clamp: 2; -webkit-box-orient: vertical; cursor: pointer; }
.sk-cap.is-open { display: block; max-height: 42vh; overflow-y: auto; overscroll-behavior: contain; cursor: auto; }
.sk-info.is-cap-open .sk-cap { padding: 10px 12px; border-radius: 12px; background: rgba(10, 9, 8, .78); text-shadow: none; }
.sk-cap-less { display: none; margin: 8px 0 0; padding: 7px 16px; border: 1px solid rgba(255, 255, 255, .3); border-radius: 999px; background: rgba(0, 0, 0, .55); color: #fff; font: inherit; font-weight: 700; font-size: 14px; text-shadow: none; cursor: pointer; pointer-events: auto; }
.sk-info.is-cap-open .sk-cap-less { display: inline-block; }
.sk-music { display: flex; align-items: center; gap: 6px; margin-top: 8px; color: rgba(255, 255, 255, .88); font-size: 13.5px; }
.sk-music svg { flex: none; width: 15px; height: 15px; }
.sk-music span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.sk-rail { position: absolute; right: 8px; bottom: 28px; display: flex; flex-direction: column; align-items: center; gap: 16px; }
.sk-ava { display: grid; place-items: center; width: 48px; height: 48px; border: 2px solid #fff; border-radius: 50%; background: linear-gradient(135deg, #ff9a3c, #e8590c); color: #fff; font-weight: 800; font-size: 16px; text-decoration: none; box-shadow: 0 2px 10px rgba(0, 0, 0, .45); }
.sk-act { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 0; border: 0; background: none; color: #fff; font: inherit; text-decoration: none; cursor: pointer; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .6)); }
.sk-act svg { width: 32px; height: 32px; }
.sk-act b { font-size: 12.5px; font-weight: 700; }
.sk-act:hover, .sk-act:focus-visible { color: #ffb15c; }
.sk-prog { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(255, 255, 255, .22); }
.sk-prog i { display: block; width: 0; height: 100%; background: #ff8a1f; }
.sk-tools { position: absolute; z-index: 2; top: 10px; left: 12px; right: 12px; display: flex; align-items: center; justify-content: space-between; pointer-events: none; }
.sk-tools > * { pointer-events: auto; }
.sk-back { padding: 9px 14px; border-radius: 999px; background: rgba(0, 0, 0, .45); color: #fff; font-weight: 700; font-size: 14px; text-decoration: none; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.sk-tool { display: grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 0; border-radius: 50%; background: rgba(0, 0, 0, .45); color: #fff; cursor: pointer; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.sk-tool svg { width: 22px; height: 22px; }
.sk-tool.is-on { color: #ffb15c; }
.sk-nav { display: none; }
.sk-empty { display: grid; place-content: center; gap: 8px; height: 100%; padding: 24px; color: rgba(255, 255, 255, .8); text-align: center; }
.sk-empty b { color: #fff; font-size: 18px; }
@media (min-width: 761px) {
  .sk-root { background: radial-gradient(70% 60% at 50% 40%, rgba(255, 138, 31, .08), transparent 70%), #0b0a09; }
  .sk-frame { width: auto; height: calc(100% - 32px); max-width: calc(100% - 220px); aspect-ratio: 9 / 16; overflow: visible; background: transparent; }
  .sk-video, .sk-tap { border-radius: 18px; }
  .sk-info { right: 16px; bottom: 22px; }
  .sk-rail { right: auto; left: calc(100% + 16px); bottom: 12px; }
  .sk-prog { left: 14px; right: 14px; bottom: 8px; border-radius: 2px; overflow: hidden; }
  .sk-tools { top: 16px; left: 18px; right: 18px; }
  .sk-nav { position: absolute; z-index: 2; top: 50%; right: 22px; display: flex; flex-direction: column; gap: 12px; transform: translateY(-50%); }
}

.sk-day__row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.sk-day__card { position: relative; display: block; aspect-ratio: 9 / 16; overflow: hidden; border-radius: 16px; background: #111; color: #fff; text-decoration: none; }
.sk-day__card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.sk-day__card:hover img { transform: scale(1.04); }
.sk-day__card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(0, 0, 0, .85)); }
.sk-day__card .podium__medal { z-index: 1; }
.sk-day__play { position: absolute; z-index: 1; top: 8px; right: 8px; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: rgba(0, 0, 0, .5); }
.sk-day__play svg { width: 15px; height: 15px; margin-left: 2px; }
.sk-day__txt { position: absolute; z-index: 1; left: 10px; right: 10px; bottom: 10px; display: grid; gap: 3px; text-shadow: 0 1px 3px rgba(0, 0, 0, .6); }
.sk-day__txt b { display: -webkit-box; overflow: hidden; font-size: 14px; line-height: 1.25; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.sk-day__txt small { font-size: 12px; opacity: .82; }
.sk-day__card .podium__medal--4, .sk-day__card .podium__medal--5 { background: rgba(255, 255, 255, .88); }
.sk-day__card--ghost { background: linear-gradient(110deg, rgba(128, 110, 90, .16) 30%, rgba(128, 110, 90, .3) 50%, rgba(128, 110, 90, .16) 70%) 0 0 / 300% 100%; animation: sk-ghost 1.4s linear infinite; }
.sk-day__card--ghost::after { display: none; }
@keyframes sk-ghost { to { background-position: -300% 0; } }
.sk-day__btns { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
@media (min-width: 700px) { .sk-day__row { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (min-width: 1400px) { .sk-day__row { grid-template-columns: repeat(5, minmax(0, 210px)); } }
@media (max-width: 699px) {
  .sk-day .podium__head { flex-wrap: wrap; }
  .sk-day__btns { justify-content: flex-start; }
  .sk-day__row { display: grid; grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 31%; gap: 8px; overflow-x: auto; margin: 0 -12px; padding: 0 12px 4px; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .sk-day__row::-webkit-scrollbar { display: none; }
  .sk-day__card { scroll-snap-align: start; border-radius: 12px; }
  .sk-day__play { width: 24px; height: 24px; top: 6px; right: 6px; }
  .sk-day__play svg { width: 12px; height: 12px; }
  .sk-day__txt { left: 7px; right: 7px; bottom: 7px; }
  .sk-day__txt b { font-size: 12px; -webkit-line-clamp: 2; }
  .sk-day__txt small { font-size: 11px; }
}
/* Кнопки ленты, комментарии и страница автора — как в ГранаСкопе */
.sk-act--like.is-on { color: #ff3b5c; }
.sk-act--dislike.is-on, .sk-act--save.is-on { color: #ffb15c; }
.sk-act.is-on svg { animation: sk-pop .28s ease; }
@keyframes sk-pop { 50% { transform: scale(1.22); } }
.sk-ava-wrap { position: relative; margin-bottom: 6px; }
.sk-ava-wrap > a { display: block; border-radius: 50%; }
img.sk-ava { display: block; object-fit: cover; padding: 0; background: #222; }
.sk-follow { position: absolute; left: 50%; bottom: -10px; display: grid; place-items: center; width: 22px; height: 22px; margin-left: -11px; padding: 0; border: 0; border-radius: 50%; background: #ff3b5c; color: #fff; cursor: pointer; box-shadow: 0 1px 4px rgba(0, 0, 0, .4); }
.sk-follow svg { width: 13px; height: 13px; }
.sk-follow.is-on { background: #fff; color: #ff3b5c; }
.sk-tools__right { display: flex; align-items: center; gap: 8px; }
.sk-out { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border-radius: 999px; background: rgba(0, 0, 0, .45); color: #fff; font-weight: 700; font-size: 13px; text-decoration: none; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.sk-out svg { width: 15px; height: 15px; }
.sk-out[hidden] { display: none; }
.sk-out:hover { color: #ffb15c; }
.sk-sheet { position: absolute; inset: 0; z-index: 5; }
.sk-sheet[hidden] { display: none; }
.sk-sheet__shade { position: absolute; inset: 0; background: rgba(0, 0, 0, .35); }
.sk-sheet__box { position: absolute; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; height: 68%; border-radius: 18px 18px 0 0; background: #141312; color: #f3efe9; box-shadow: 0 -10px 30px rgba(0, 0, 0, .45); animation: sk-up .22s ease; }
@keyframes sk-up { from { transform: translateY(40px); opacity: 0; } }
.sk-sheet__head { display: flex; align-items: center; justify-content: space-between; padding: 10px 10px 8px 18px; border-bottom: 1px solid rgba(255, 255, 255, .08); }
.sk-sheet__head b { font-size: 15px; }
.sk-sheet__head .sk-tool { width: 36px; height: 36px; background: rgba(255, 255, 255, .08); }
.sk-sheet__list { flex: 1; overflow-y: auto; padding: 8px 14px; overscroll-behavior: contain; }
.sk-sheet__empty { padding: 40px 10px; color: rgba(255, 255, 255, .6); text-align: center; }
.sk-sheet__form { padding: 8px 12px calc(10px + env(safe-area-inset-bottom)); border-top: 1px solid rgba(255, 255, 255, .08); }
.sk-sheet__form[hidden] { display: none; }
.sk-sheet__row { display: flex; gap: 8px; }
.sk-sheet__row input { flex: 1; min-width: 0; height: 42px; padding: 0 14px; border: 1px solid rgba(255, 255, 255, .14); border-radius: 999px; background: #1f1d1b; color: #fff; font: inherit; font-size: 15px; outline: none; }
.sk-sheet__row input:focus { border-color: #ff8a1f; }
.sk-send { display: grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 0; border-radius: 50%; background: #ff8a1f; color: #fff; cursor: pointer; }
.sk-send svg { width: 20px; height: 20px; }
.sk-sheet__reply { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; color: rgba(255, 255, 255, .7); font-size: 13px; }
.sk-sheet__reply[hidden] { display: none; }
.sk-sheet__reply button { display: grid; place-items: center; width: 22px; height: 22px; padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .1); color: #fff; cursor: pointer; }
.sk-sheet__reply svg { width: 12px; height: 12px; }
.sk-cm { display: flex; gap: 10px; padding: 9px 0; }
.sk-cm--child { padding-left: 44px; }
.sk-cm__ava-link { flex: none; }
.sk-cm__ava { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; object-fit: cover; background: linear-gradient(135deg, #ff9a3c, #e8590c); color: #fff; font-weight: 800; font-size: 12px; }
.sk-cm--child .sk-cm__ava { width: 26px; height: 26px; font-size: 10px; }
.sk-cm__body { flex: 1; min-width: 0; }
.sk-cm__who { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.sk-cm__who a { color: rgba(255, 255, 255, .7); font-weight: 700; text-decoration: none; }
.sk-cm__pin { padding: 1px 7px; border-radius: 999px; background: rgba(255, 138, 31, .18); color: #ffb15c; font-size: 11px; }
.sk-cm__text { margin: 3px 0 0; font-size: 14.5px; line-height: 1.4; white-space: pre-wrap; overflow-wrap: anywhere; }
.sk-cm__meta { display: flex; gap: 14px; margin-top: 4px; color: rgba(255, 255, 255, .5); font-size: 12.5px; }
.sk-cm__meta button { padding: 0; border: 0; background: none; color: inherit; font: inherit; font-weight: 700; cursor: pointer; }
.sk-cm__like { flex: none; display: flex; flex-direction: column; align-items: center; gap: 1px; width: 34px; padding: 4px 0 0; border: 0; background: none; color: rgba(255, 255, 255, .55); cursor: pointer; }
.sk-cm__like svg { width: 18px; height: 18px; fill: none; }
.sk-cm__like b { font-size: 11.5px; font-weight: 600; }
.sk-cm__like.is-on { color: #ff3b5c; }
.sk-cm__like.is-on svg { fill: currentColor; }
@media (min-width: 761px) {
  .sk-sheet__shade { background: rgba(0, 0, 0, .25); }
  .sk-sheet__box { left: auto; top: 0; width: min(420px, 42%); height: auto; border-radius: 0; animation-name: sk-side; }
  @keyframes sk-side { from { transform: translateX(40px); opacity: 0; } }
}

.sk-prof { max-width: 980px; margin: 0 auto; padding: 18px 18px 28px; border-radius: 22px; background: radial-gradient(90% 60% at 50% 0%, rgba(255, 138, 31, .14), transparent 70%), #0d0c0b; color: #f3efe9; }
.sk-prof__back { display: inline-block; margin-bottom: 14px; color: rgba(255, 255, 255, .75); font-weight: 700; font-size: 14px; text-decoration: none; }
.sk-prof__back:hover { color: #ffb15c; }
.sk-prof__load { padding: 48px 12px; color: rgba(255, 255, 255, .7); text-align: center; }
.sk-prof__head { display: flex; align-items: center; gap: 16px; }
.sk-prof__ava { flex: none; display: grid; place-items: center; width: 92px; height: 92px; border: 3px solid rgba(255, 255, 255, .9); border-radius: 50%; object-fit: cover; background: linear-gradient(135deg, #ff9a3c, #e8590c); color: #fff; font-weight: 800; font-size: 30px; }
.sk-prof__id { min-width: 0; }
.sk-prof__id h1 { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 24px; line-height: 1.2; overflow-wrap: anywhere; }
.sk-prof__ok { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: #1d9bf0; }
.sk-prof__ok svg { width: 12px; height: 12px; color: #fff; }
.sk-prof__login { margin-top: 4px; color: rgba(255, 255, 255, .65); font-size: 15px; }
.sk-prof__stats { display: flex; gap: 26px; margin: 18px 0 14px; }
.sk-prof__stats div { display: grid; }
.sk-prof__stats b { font-size: 18px; }
.sk-prof__stats span { color: rgba(255, 255, 255, .6); font-size: 13px; }
.sk-prof__btns { display: flex; flex-wrap: wrap; gap: 10px; }
.sk-prof__btns .btn { min-width: 150px; justify-content: center; }
.sk-prof__btns .btn--ghost { border-color: rgba(255, 255, 255, .25); background: transparent; color: #fff; }
.sk-prof__btns .btn:not(.btn--cta):not(.btn--ghost) { border-color: rgba(255, 140, 50, .55); background: rgba(255, 140, 50, .12); color: #ffb47a; }
.sk-prof__bio { margin: 14px 0 0; color: rgba(255, 255, 255, .85); font-size: 15px; line-height: 1.45; white-space: pre-line; }
.sk-prof__tabs { display: flex; margin: 20px -18px 0; padding: 0 18px; border-bottom: 1px solid rgba(255, 255, 255, .1); }
.sk-prof__tabs span { padding: 10px 4px; border-bottom: 2px solid #fff; font-weight: 700; font-size: 14px; }
.sk-prof__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3px; margin: 3px -15px 0; }
.sk-prof__tile { position: relative; display: block; aspect-ratio: 9 / 16; overflow: hidden; background: #1a1816; color: #fff; text-decoration: none; }
.sk-prof__tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.sk-prof__tile:hover img { transform: scale(1.04); }
.sk-prof__tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(0, 0, 0, .75)); }
.sk-prof__views { position: absolute; z-index: 1; left: 7px; bottom: 6px; display: flex; align-items: center; gap: 3px; font-weight: 700; font-size: 13px; text-shadow: 0 1px 2px rgba(0, 0, 0, .7); }
.sk-prof__views svg { width: 13px; height: 13px; }
.sk-prof__cap { position: absolute; z-index: 1; left: 7px; right: 7px; top: 7px; display: -webkit-box; overflow: hidden; font-size: 12px; line-height: 1.25; text-shadow: 0 1px 2px rgba(0, 0, 0, .8); opacity: 0; transition: opacity .2s; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.sk-prof__tile:hover .sk-prof__cap { opacity: 1; }
@media (min-width: 761px) {
  .sk-prof { padding: 26px 30px 34px; }
  .sk-prof__ava { width: 116px; height: 116px; font-size: 38px; }
  .sk-prof__id h1 { font-size: 30px; }
  .sk-prof__tabs { margin: 22px -30px 0; padding: 0 30px; }
  .sk-prof__grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin: 14px 0 0; }
  .sk-prof__tile { border-radius: 12px; }
}
@media (max-width: 480px) {
  .sk-rail { gap: 13px; }
  .sk-act svg { width: 30px; height: 30px; }
  .sk-out { padding: 0 10px; }
}
.sk-prof__tile video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
html.sk-cm-on .radio-disc--float { display: none; }

/* звонки */
.gc, .gc-ring, .gc-pipbody { --mg-hi: #FBEFD3; --mg-ivory: #F6E6C5; --mg-copy: #BEB096; --mg-muted: #948873; --mg-border: rgba(212, 161, 75, 0.28); }
.gc[hidden], .gc-ring[hidden], .gc-bar[hidden] { display: none !important; }
.gc-audio { position: fixed; width: 0; height: 0; overflow: hidden; opacity: 0; pointer-events: none; }
.gc-av { --h: 30; position: relative; display: inline-grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 50%; overflow: hidden; background: linear-gradient(140deg, hsl(var(--h) 55% 42%), hsl(calc(var(--h) + 30) 50% 24%)); color: #fff6e6; }
.gc-av img { width: 100%; height: 100%; object-fit: cover; }
.gc-av b { font: 700 15px/1 var(--display); letter-spacing: .02em; }
.gc-av--sm { width: 36px; height: 36px; }
.gc-av--lg { width: 72px; height: 72px; }
.gc-av--lg b { font-size: 26px; }
.gc-av--xl { width: 112px; height: 112px; box-shadow: 0 0 0 6px rgba(242,138,45,.12); }
.gc-av--xl b { font-size: 40px; }
body.gc-open { overflow: hidden; }

.gc-full { display: none; }
.gc.is-full .gc-full { position: fixed; inset: 0; z-index: 1500; display: flex; flex-direction: column; padding: calc(12px + env(safe-area-inset-top, 0px)) 16px calc(14px + env(safe-area-inset-bottom, 0px)); background: radial-gradient(circle at 20% 0%, rgba(242,138,45,.14), transparent 45%), radial-gradient(circle at 90% 100%, rgba(212,161,75,.1), transparent 50%), #0b0a08; color: var(--mg-ivory, #f6e6c5); animation: soc-fade .18s ease-out; }
.gc-full:fullscreen { padding: 16px; }
.gc-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 4px 12px; }
.gc-top__who { display: grid; gap: 3px; min-width: 0; }
.gc-top__who b { overflow: hidden; font: 700 20px/1.15 var(--display); letter-spacing: .02em; text-overflow: ellipsis; white-space: nowrap; color: var(--mg-hi); }
.gc-top__who span { font-size: 13px; color: var(--mg-copy); font-variant-numeric: tabular-nums; }
.gc-btn--ghost { flex-direction: row !important; gap: 8px !important; min-width: 0 !important; padding: 8px 14px !important; border: 1px solid var(--mg-border) !important; border-radius: 999px !important; background: rgba(255,255,255,.04) !important; }
.gc-btn--ghost svg { width: 18px !important; height: 18px !important; padding: 0 !important; border-radius: 0 !important; background: none !important; }
.gc-btn--ghost span { font-size: 13px !important; color: var(--mg-hi) !important; }

.gc-grid { position: relative; flex: 1; min-height: 0; display: grid; gap: 10px; grid-auto-rows: minmax(0, 1fr); }
.gc-grid.n1 { grid-template-columns: 1fr; }
.gc-grid.n2 { grid-template-columns: 1fr; }
.gc-grid.n3, .gc-grid.n4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gc-grid.n5, .gc-grid.n6, .gc-grid.n7, .gc-grid.n8, .gc-grid.n9 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.gc-grid.n2:not(.has-screen) .gc-tile.is-self { position: absolute; right: 14px; bottom: 14px; z-index: 2; width: clamp(120px, 22vw, 260px); height: auto; aspect-ratio: 4 / 3; box-shadow: 0 16px 40px rgba(0,0,0,.55); }
.gc-grid.n2:not(.has-screen) .gc-tile.is-self .gc-av--xl { width: 56px; height: 56px; box-shadow: none; }
.gc-grid.n2:not(.has-screen) .gc-tile.is-self .gc-av--xl b { font-size: 20px; }
.gc-grid.has-screen { grid-template-columns: minmax(0, 1fr) 260px; grid-template-rows: repeat(4, minmax(0, 1fr)); grid-auto-rows: 0; grid-auto-flow: row dense; }
.gc-grid.has-screen .gc-tile.is-screen { grid-column: 1; grid-row: 1 / -1; }
.gc-grid.has-screen .gc-tile:not(.is-screen):nth-of-type(n+6) { display: none; }
.gc-grid.has-screen .gc-tile.is-screen ~ .gc-tile.is-screen { display: none; }
.gc-grid.has-screen .gc-tile:not(.is-screen) { grid-column: 2; }
.gc-grid.has-screen .gc-tile:not(.is-screen) .gc-av--xl { width: 64px; height: 64px; box-shadow: none; }
.gc-grid.has-screen .gc-tile:not(.is-screen) .gc-av--xl b { font-size: 22px; }
/* разговор вдвоём: собеседник на весь экран без рамок, панели поверх видео */
.gc.is-full.is-duo .gc-full { padding: 0; background: #000; }
.gc.is-duo .gc-full:fullscreen { padding: 0; }
.gc.is-duo .gc-grid.n2 { position: absolute; inset: 0; gap: 0; }
.gc.is-duo .gc-grid.n2 .gc-tile:not(.is-self) { border: 0; border-radius: 0; box-shadow: none; background: radial-gradient(circle at 50% 40%, rgba(242,138,45,.1), transparent 60%), #0b0a08; }
.gc.is-duo .gc-grid.n2 .gc-tile:not(.is-self) .gc-tile__name { left: 16px; bottom: calc(118px + env(safe-area-inset-bottom, 0px)); }
.gc.is-duo .gc-grid.n2 .gc-tile.is-self { top: calc(76px + env(safe-area-inset-top, 0px)); bottom: auto; right: 14px; border-radius: 14px; }
.gc.is-duo .gc-top { position: relative; z-index: 3; padding: calc(12px + env(safe-area-inset-top, 0px)) 16px 28px; background: linear-gradient(rgba(0,0,0,.62), transparent); }
.gc.is-duo .gc-reqs { position: relative; z-index: 3; }
.gc.is-duo .gc-tile__kick { display: none !important; }
.gc.is-duo .gc-ctrl { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; padding: 34px 10px calc(14px + env(safe-area-inset-bottom, 0px)); background: linear-gradient(transparent, rgba(0,0,0,.7)); }
.gc.is-duo .gc-btn span { color: #f3e7d3; text-shadow: 0 1px 3px rgba(0,0,0,.8); }

.gc-tile { position: relative; min-height: 0; overflow: hidden; display: grid; place-items: center; border-radius: 18px; background: radial-gradient(circle at 50% 40%, rgba(242,138,45,.08), transparent 60%), #17130f; border: 1px solid rgba(212,161,75,.14); transition: box-shadow .2s, border-color .2s; }
.gc-tile video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; background: #000; }
.gc-tile.has-video video { opacity: 1; }
.gc-tile.has-video .gc-tile__ava { visibility: hidden; }
.gc-tile.is-mirror video { transform: scaleX(-1); }
.gc-tile.is-screen video { object-fit: contain; }
.gc-tile.is-talk { border-color: #f2a24a; box-shadow: 0 0 0 2px rgba(242,162,74,.75), 0 0 28px rgba(242,138,45,.25); }
.gc-tile.is-ring .gc-tile__ava { animation: gc-pulse 1.4s ease-in-out infinite; }
.gc-tile__name { position: absolute; left: 10px; bottom: 10px; z-index: 1; display: inline-flex; align-items: center; gap: 6px; max-width: calc(100% - 20px); padding: 5px 10px; border-radius: 999px; overflow: hidden; background: rgba(8,7,6,.66); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #fff3df; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.gc-tile.is-muted .gc-tile__name::before { content: ""; flex: none; width: 14px; height: 14px; background: #ff7a6b; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2'%3E%3Cpath d='M15 10V6a3 3 0 0 0-5.7-1.3M9 9v2a3 3 0 0 0 4.6 2.5M5 11a7 7 0 0 0 11.5 5.4M12 18v3M3 3l18 18'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2'%3E%3Cpath d='M15 10V6a3 3 0 0 0-5.7-1.3M9 9v2a3 3 0 0 0 4.6 2.5M5 11a7 7 0 0 0 11.5 5.4M12 18v3M3 3l18 18'/%3E%3C/svg%3E") center / contain no-repeat; }
.gc-tile.is-selfscreen::after { content: "Вы показываете экран"; position: absolute; top: 10px; left: 50%; transform: translateX(-50%); padding: 5px 12px; border-radius: 999px; background: rgba(242,138,45,.9); color: #1b0f04; font-size: 12px; font-weight: 600; }
@keyframes gc-pulse { 50% { transform: scale(1.06); opacity: .75; } }

.gc-ctrl { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 10px; padding-top: 14px; }
.gc-btn { display: inline-flex; flex-direction: column; align-items: center; gap: 6px; min-width: 64px; padding: 0; border: 0; background: none; color: var(--mg-hi); cursor: pointer; }
.gc-btn svg { width: 52px; height: 52px; padding: 14px; border-radius: 50%; background: rgba(255,255,255,.08); transition: background .15s, transform .15s; }
.gc-btn:hover svg { background: rgba(255,255,255,.14); }
.gc-btn:active svg { transform: scale(.94); }
.gc-btn span { font-size: 12px; color: var(--mg-copy); }
.gc-btn.is-off svg { background: #f1e6d4; color: #1a120b; }
.gc-btn.is-on svg { background: rgba(242,138,45,.9); color: #1b0f04; }
.gc-btn--end svg { background: #e0483a; color: #fff; }
.gc-btn--end:hover svg { background: #f05a4b; }
.gc-btn[hidden] { display: none; }
.gc.no-pip .gc-only-pip { display: none; }

.gc-mini { display: none; }
.gc.is-mini .gc-mini { position: fixed; right: 18px; bottom: 18px; z-index: 1400; display: flex; flex-direction: column; width: 320px; overflow: hidden; border: 1px solid var(--mg-border); border-radius: 18px; background: #15110d; box-shadow: 0 24px 60px rgba(0,0,0,.6); animation: soc-fade .18s ease-out; }
.gc-mini__stage { position: relative; display: grid; place-items: center; height: 170px; background: radial-gradient(circle at 50% 40%, rgba(242,138,45,.12), transparent 60%), #0d0b09; cursor: pointer; }
.gc-mini__stage video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #000; }
.gc-mini__row { display: flex; align-items: center; gap: 8px; padding: 10px 10px 10px 14px; }
.gc-mini__who { flex: 1; display: grid; gap: 2px; min-width: 0; }
.gc-mini__who b { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; color: var(--mg-hi); }
.gc-mini__who span { font-size: 12px; color: var(--mg-copy); font-variant-numeric: tabular-nums; }
.gc-mini__btns { display: flex; gap: 4px; }
.gc-mbtn { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.08); color: var(--mg-hi); cursor: pointer; }
.gc-mbtn svg { width: 18px; height: 18px; }
.gc-mbtn:hover { background: rgba(255,255,255,.15); }
.gc-mbtn.is-off { background: #f1e6d4; color: #1a120b; }
.gc-mbtn--end { background: #e0483a; color: #fff; }
.gc-mbtn--end:hover { background: #f05a4b; }
.gc-pipbody { margin: 0; overflow: hidden; background: #15110d; }
.gc-pipbody .gc-mini { position: fixed; inset: 0; display: flex; flex-direction: column; width: auto; border: 0; border-radius: 0; box-shadow: none; }
.gc-pipbody .gc-mini__stage { flex: 1; height: auto; }
.gc-pipbody .gc-only-pip { display: none; }

.topnav .gc-bar { position: absolute; left: 0; right: 0; top: 100%; z-index: 1; display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; height: 44px; padding: 0 16px; border: 0; background: linear-gradient(90deg, #1f7a46, #2a9a59); color: #f2fff6; font-size: 14px; cursor: pointer; box-shadow: 0 8px 22px rgba(0,0,0,.3); }
.gc-bar:hover { filter: brightness(1.08); }
.gc-bar svg { flex: none; width: 18px; height: 18px; }
.gc-bar b { overflow: hidden; max-width: 40vw; text-overflow: ellipsis; white-space: nowrap; }
.gc-bar span { font-variant-numeric: tabular-nums; opacity: .85; }
.gc-bar em { margin-left: 8px; padding: 4px 12px; border-radius: 999px; background: rgba(255,255,255,.18); font-style: normal; font-weight: 600; font-size: 13px; }
.gc-bar__dot { width: 8px; height: 8px; border-radius: 50%; background: #c6ffd9; animation: gc-blink 1.2s ease-in-out infinite; }
@keyframes gc-blink { 50% { opacity: .3; } }
body.gc-barred #app { padding-top: 44px; }
body.gc-barred .soc-msgs { height: calc(100dvh - var(--nav-h) - var(--works-h, 0px) - 84px); }

.gc-ring { position: fixed; inset: 0; z-index: 1600; display: grid; place-items: center; padding: 16px; background: rgba(4,4,3,.6); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); animation: soc-fade .18s ease-out; }
.gc-ring__card { display: grid; justify-items: center; gap: 10px; width: min(380px, 100%); padding: 30px 24px 24px; border: 1px solid var(--mg-border); border-radius: 24px; background: radial-gradient(circle at 50% 0%, rgba(242,138,45,.18), transparent 60%), #14100c; box-shadow: 0 30px 80px rgba(0,0,0,.6); text-align: center; }
.gc-ring__av { margin-bottom: 6px; animation: gc-pulse 1.6s ease-in-out infinite; }
.gc-ring__card > b { font: 700 22px/1.15 var(--display); letter-spacing: .02em; color: var(--mg-hi); }
.gc-ring__card > span { font-size: 14px; color: var(--mg-copy); }
.gc-ring__btns { display: flex; justify-content: center; gap: 22px; margin-top: 14px; }
.gc-rbtn { display: grid; justify-items: center; gap: 6px; padding: 0; border: 0; background: none; color: var(--mg-copy); cursor: pointer; }
.gc-rbtn svg { width: 58px; height: 58px; padding: 16px; border-radius: 50%; color: #fff; transition: transform .15s; }
.gc-rbtn:hover svg { transform: scale(1.06); }
.gc-rbtn em { font-style: normal; font-size: 12px; }
.gc-rbtn--no svg { background: #e0483a; }
.gc-rbtn--yes svg { background: #2a9a59; }
.gc-rbtn--video svg { background: #2f7fd0; }

.gc-ov { z-index: 1700; }
.gc-pick__q { width: 100%; margin-bottom: 10px; padding: 10px 12px; border: 1px solid var(--mg-border); border-radius: 10px; background: transparent; color: inherit; font-size: 15px; }
.gc-pick__list { display: grid; gap: 4px; max-height: 50vh; overflow-y: auto; }
.gc-pick__it { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 12px; cursor: pointer; }
.gc-pick__it:hover { background: rgba(212,161,75,.07); }
.gc-pick__it input { width: 18px; height: 18px; accent-color: #f28a2d; }
.gc-pick__it b { flex: 1; font-weight: 500; color: var(--mg-hi); }
.gc-pick__it span { font-size: 12px; color: var(--mg-muted); }
.gc-pick__it.is-in { opacity: .55; cursor: default; }
.gc-top [data-gc="devices"] { margin-left: auto; }
@media (max-width: 560px) { .gc-top .gc-btn--ghost span { display: none; } .gc-top .gc-btn--ghost { padding: 9px !important; } }
.gc-dev { width: min(440px, calc(100vw - 32px)); }
.gc-dev__row { display: grid; gap: 6px; margin-bottom: 14px; }
.gc-dev__row span { font-size: 13px; color: var(--mg-muted); }
.gc-dev__row select { width: 100%; padding: 10px 12px; border: 1px solid var(--mg-border); border-radius: 10px; background: var(--mg-card, #100E0B); color: var(--mg-hi); font: inherit; font-size: 15px; }
.gc-dev__row span b { float: right; color: var(--mg-hi); font-weight: 600; }
.gc-dev__vol input { width: 100%; accent-color: var(--mg-gold); }
.gc-dev__hint { margin: -8px 0 14px; font-size: 12px; line-height: 1.4; color: var(--mg-muted); }
.gc-dev__app { display: grid; gap: 3px; margin: 0 0 14px; padding: 10px 12px; border: 1px solid var(--mg-border); border-radius: 10px; color: var(--mg-hi); text-decoration: none; }
.gc-dev__app:hover { border-color: var(--mg-gold); }
.gc-dev__app b { font-size: 14px; color: var(--mg-gold); }
.gc-dev__app span { font-size: 12px; line-height: 1.4; color: var(--mg-muted); }
.gc-dev__tip { margin: 0 0 14px; font-size: 13px; line-height: 1.45; color: var(--mg-muted); }
.gc-dev__tip.is-warn { padding: 10px 12px; border-radius: 10px; background: rgba(242,138,45,.1); color: var(--mg-hi); }

/* звонки и беседы в переписке */
.soc-call-btn { color: var(--mg-gold); }
.soc-call-btn svg { width: 20px; height: 20px; }
.soc-call-btn:hover { background: rgba(242,138,45,.12); color: #f2a24a; }
.soc-chat__gname { overflow: hidden; padding: 0; border: 0; background: none; font: inherit; font-weight: 600; text-align: left; text-overflow: ellipsis; white-space: nowrap; color: var(--mg-hi); cursor: pointer; }
.soc-sysmsg { align-self: center; max-width: 90%; margin: 6px 0; text-align: center; }
.soc-sysmsg span { display: inline-block; padding: 4px 12px; border-radius: 999px; background: rgba(255,255,255,.04); color: var(--mg-muted); font-size: 12px; line-height: 1.4; }
.soc-sysmsg__who { color: var(--mg-link, #7eb8ff); text-decoration: none; font-weight: 600; }
.soc-sysmsg__who:hover { text-decoration: underline; }
.st-view__poll { display: grid; align-content: center; gap: 16px; min-height: 60vh; padding: 24px 16px; background: linear-gradient(160deg, #1a1d24, #0f1115); }
.st-view__poll-q { margin: 0; font-size: 22px; font-weight: 700; line-height: 1.35; text-align: center; }
.st-poll__opts { display: grid; gap: 10px; max-width: 420px; margin: 0 auto; width: 100%; }
.st-poll__opt { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; padding: 12px 14px; border: 1px solid rgba(255,255,255,.12); border-radius: 14px; background: rgba(255,255,255,.06); color: inherit; font: inherit; text-align: left; cursor: pointer; }
.st-poll__opt.is-on { border-color: rgba(212,161,75,.55); background: rgba(212,161,75,.14); }
.st-poll__opt em { font-style: normal; font-size: 13px; opacity: .75; }
.st-new--poll { background: #12141a; color: #f5f5f5; }
.st-new--poll textarea { width: 100%; min-height: 72px; margin: 12px 16px; max-width: calc(100% - 32px); box-sizing: border-box; }
.st-new--poll .st-poll-lines { width: calc(100% - 32px); margin: 0 16px 12px; min-height: 160px; box-sizing: border-box; font: inherit; }
.soc-msg__author { display: block; margin: 6px 0 2px 4px; font-size: 12px; font-weight: 600; color: #f2a24a; }
.soc-msg:has(.soc-msg__author) { flex-wrap: wrap; }
.soc-msg:has(.soc-msg__author) .soc-msg__author { flex-basis: 100%; }
.soc-callmsg { display: inline-flex; align-items: center; gap: 10px; }
.soc-callmsg > svg { flex: none; width: 34px; height: 34px; padding: 8px; border-radius: 50%; background: rgba(42,154,89,.22); color: #6fd48c; }
.soc-callmsg.is-missed > svg { background: rgba(224,72,58,.2); color: #ff8a7d; }
.soc-callmsg > span { display: grid; gap: 1px; }
.soc-callmsg b { font-weight: 600; }
.soc-callmsg em { font-style: normal; font-size: 12px; opacity: .75; font-variant-numeric: tabular-nums; }
.soc-callmsg__again { margin-left: 4px; padding: 5px 10px; border: 1px solid currentColor; border-radius: 999px; background: none; color: inherit; font-size: 12px; opacity: .8; cursor: pointer; }
.soc-callmsg__again:hover { opacity: 1; }
.soc-gmembers { display: grid; gap: 2px; max-height: 32vh; overflow-y: auto; margin-bottom: 8px; }
.soc-gmember { display: flex; align-items: center; gap: 10px; padding: 6px 8px; border-radius: 10px; color: var(--mg-hi); }
.soc-gmember:hover { background: rgba(212,161,75,.07); }
.soc-gmember em { font-style: normal; font-size: 12px; color: var(--mg-muted); }
.soc-gpick__name { display: grid; gap: 6px; margin-bottom: 12px; font-size: 13px; color: var(--mg-copy); }
.soc-gpick__name input { width: 100%; padding: 10px 12px; border: 1px solid var(--mg-border); border-radius: 10px; background: rgba(7,7,6,.6); color: var(--mg-ivory); font-size: 15px; }
.soc-gpick__label { margin: 4px 0 6px; font-size: 13px; color: var(--mg-copy); }
.soc-gpick { display: grid; gap: 2px; max-height: 40vh; overflow-y: auto; }
.soc-gpick__it { display: flex; align-items: center; gap: 10px; width: 100%; padding: 7px 8px; border: 0; border-radius: 10px; background: none; color: var(--mg-hi); text-align: left; cursor: pointer; }
.soc-gpick__it:hover { background: rgba(212,161,75,.07); }
.soc-gpick__it > span:not(.soc-av) { flex: 1; }
.soc-gpick__it .soc-av, .soc-gmember .soc-av { flex: none; }
.soc-gpick__it i { width: 20px; height: 20px; border: 1.5px solid var(--mg-border); border-radius: 50%; }
.soc-gpick__it.is-on i { border-color: #f28a2d; background: #f28a2d url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231b0f04' stroke-width='3'%3E%3Cpath d='m6 12 4 4 8-8'/%3E%3C/svg%3E") center / 14px no-repeat; }

@media (max-width: 720px) {
  .gc.is-full .gc-full { padding-left: 10px; padding-right: 10px; }
  .gc-grid { gap: 8px; }
  .gc-grid.n3, .gc-grid.n4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gc-grid.n5, .gc-grid.n6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gc-grid.n2:not(.has-screen) .gc-tile.is-self { width: 112px; aspect-ratio: 3 / 4; right: 10px; bottom: 10px; }
  .gc-grid.has-screen { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: minmax(0, 1fr) 110px; grid-auto-rows: 0; }
  .gc-grid.has-screen .gc-tile.is-screen { grid-column: 1 / -1; grid-row: 1; }
  .gc-grid.has-screen .gc-tile:not(.is-screen) { grid-column: auto; grid-row: 2; }
  .gc-grid.has-screen .gc-tile:not(.is-screen):nth-of-type(n+5) { display: none; }
  .gc-ctrl { gap: 4px 2px; }
  .gc-btn { min-width: 58px; }
  .gc-btn svg { width: 48px; height: 48px; padding: 13px; }
  .gc-btn span { font-size: 11px; }
  .gc-only-wide, .gc-ctrl .gc-only-pip { display: none; }
  .gc-top__who b { font-size: 18px; }
  .gc.is-mini .gc-mini { right: 10px; left: 10px; bottom: calc(76px + env(safe-area-inset-bottom, 0px)); width: auto; flex-direction: row; align-items: stretch; }
  .gc.is-mini .gc-mini__stage { width: 64px; height: auto; flex: none; }
  .gc.is-mini .gc-mini__stage .gc-av--lg { width: 40px; height: 40px; }
  .gc.is-mini .gc-mini__stage .gc-av--lg b { font-size: 15px; }
  .gc.is-mini .gc-mini__row { flex: 1; min-width: 0; padding: 8px 8px 8px 10px; }
  .gc.is-mini .gc-only-pip { display: none; }
  .topnav .gc-bar { height: 40px; font-size: 13px; gap: 8px; }
  .gc-bar em { display: none; }
  body.gc-barred #app { padding-top: 40px; }
  body.gc-barred .soc-msgs { height: calc(100dvh - var(--nav-h) - var(--works-h, 0px) - 136px - env(safe-area-inset-bottom, 0px)); }
  .soc-call-btn { width: 32px; }
}

/* эфиры: комната и подарки поверх видео */
.live-room { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 18px; align-items: start; }
.live-room__main { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; min-width: 0; }
.live-stage { position: relative; aspect-ratio: 16 / 9; max-height: calc(100dvh - var(--nav-h) - 340px); min-height: 220px; width: 100%; border-radius: 18px; overflow: hidden; background: radial-gradient(120% 90% at 50% 30%, #2a2116 0%, #120f0b 60%, #070605 100%); border: 1px solid rgba(212, 161, 75, 0.22); box-shadow: 0 18px 50px rgba(0, 0, 0, 0.45); isolation: isolate; }
.live-stage.is-portrait { aspect-ratio: 3 / 4; max-height: 76vh; margin-inline: auto; width: 100%; }
.live-stage__media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; display: block; }
.live-stage__media.is-mirror { transform: scaleX(-1); }
.live-stage__wait { position: absolute; inset: 0; display: grid; place-items: center; padding: 24px; text-align: center; color: #d9c9a6; font-size: 15px; z-index: 1; }
.live-stage__wait[hidden] { display: none; }
.live-stage.is-ended .live-stage__wait { background: rgba(8, 7, 5, 0.74); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); color: #fbefd3; font: 700 clamp(20px, 3vw, 30px)/1.2 var(--display); letter-spacing: .02em; z-index: 8; }
.live-stage.is-ended .lg-layer, .live-stage.is-ended .lg-banners { display: none; }
.live-stage__top { position: absolute; left: 12px; right: 12px; top: 12px; display: flex; justify-content: space-between; align-items: center; z-index: 6; pointer-events: none; }
.live-pill { display: inline-flex; align-items: center; gap: 7px; padding: 5px 11px; border-radius: 999px; background: #e0392b; color: #fff; font: 700 12px/1 var(--body); letter-spacing: .05em; text-transform: uppercase; box-shadow: 0 4px 14px rgba(224, 57, 43, 0.45); }
.live-pill::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #fff; animation: skopPulse 1.4s ease-in-out infinite; }
.live-pill.is-off { background: rgba(20, 17, 12, 0.8); box-shadow: none; }
.live-pill.is-off::before { display: none; }
.live-stage__viewers { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; background: rgba(8, 7, 5, 0.62); color: #f6e6c5; font: 600 13px/1 var(--body); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.live-stage__viewers svg { width: 15px; height: 15px; }
.live-sound { position: absolute; top: 52px; right: 12px; z-index: 7; padding: 8px 14px; border-radius: 999px; border: 1px solid rgba(240, 192, 78, 0.55); background: rgba(8, 7, 5, 0.72); color: #f6e6c5; font: 700 13px/1 var(--body); cursor: pointer; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); animation: skopPulse 2.4s ease-in-out 3; }
.live-sound.is-on { border-color: rgba(246, 230, 197, 0.25); animation: none; }
.live-pinned { position: absolute; left: 12px; right: 12px; bottom: 12px; z-index: 6; padding: 10px 14px; border-radius: 12px; background: rgba(8, 7, 5, 0.72); color: #fbefd3; font-size: 14px; line-height: 1.4; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border: 1px solid rgba(212, 161, 75, 0.3); }
.live-pinned[hidden] { display: none; }
.live-pinned b { color: #f0c04e; }
.live-burst { position: absolute; inset: 0; pointer-events: none; z-index: 5; overflow: hidden; }
.live-burst__item { position: absolute; bottom: 8%; font-size: 26px; color: #ff4d6d; text-shadow: 0 2px 10px rgba(255, 77, 109, 0.5); animation: liveHeart 2.2s ease-out forwards; }
@keyframes liveHeart { 0% { transform: translate(0, 0) scale(.6); opacity: 0; } 15% { opacity: 1; transform: translate(0, -20px) scale(1.15); } 100% { transform: translate(var(--dx, 0), -260px) scale(.9); opacity: 0; } }
.live-info { display: flex; gap: 14px; align-items: flex-start; justify-content: space-between; }
.live-info__text { min-width: 0; }
.live-info__title { margin: 0 0 4px; font: 700 clamp(20px, 2.4vw, 26px)/1.2 var(--display); color: var(--mg-hi); overflow-wrap: anywhere; }
.live-info__acts { display: flex; gap: 8px; flex: none; }
.live-heart span:first-child { color: #ff4d6d; }
.live-giftbar { padding: 14px; border-radius: 16px; border: 1px solid var(--mg-border); background: linear-gradient(160deg, rgba(42, 34, 22, 0.55), rgba(12, 11, 9, 0.6)); }
.live-giftbar__head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.live-giftbar__head b { font: 700 16px/1.2 var(--display); color: var(--mg-hi); letter-spacing: .02em; }
.live-bal { display: inline-flex; align-items: center; gap: 5px; font-weight: 700; color: var(--mg-hi); font-size: 14px; }
.live-bal a { font-weight: 500; font-size: 13px; color: var(--mg-gold); margin-left: 4px; }
.lv-gem { width: 15px; height: 15px; flex: none; }
.live-giftbar__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 8px; }
.live-giftbtn { position: relative; display: grid; justify-items: center; gap: 4px; padding: 10px 6px 9px; border-radius: 14px; border: 1px solid rgba(212, 161, 75, 0.2); background: rgba(10, 9, 7, 0.45); color: var(--mg-hi); cursor: pointer; font: inherit; transition: border-color .18s ease, transform .18s ease, background .18s ease; }
.live-giftbtn:hover { border-color: rgba(240, 192, 78, 0.6); transform: translateY(-2px); }
.live-giftbtn.is-on { border-color: #f0c04e; background: rgba(240, 192, 78, 0.14); box-shadow: 0 0 0 1px #f0c04e inset; }
.live-giftbtn img { width: 62px; height: 62px; object-fit: contain; filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.45)); transition: transform .25s ease; }
.live-giftbtn:hover img, .live-giftbtn.is-on img { transform: scale(1.08) rotate(-3deg); }
.live-giftbtn__name { font-size: 12px; line-height: 1.2; text-align: center; color: var(--mg-copy); }
.live-giftbtn__price { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 700; }
.live-giftbtn__price .lv-gem { width: 13px; height: 13px; }
.live-giftbtn.is-static { cursor: default; }
.live-giftbtn.is-static:hover { transform: none; border-color: rgba(212, 161, 75, 0.2); }
.live-giftbar__grid.is-preview { grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); }
.live-giftbar__grid.is-preview img { width: 46px; height: 46px; }
.live-giftsend { width: 100%; margin-top: 12px; }
.live-giftnote { margin: 10px 0 0; font-size: 13px; color: var(--mg-muted); line-height: 1.45; }
.live-room__side { position: sticky; top: calc(var(--nav-h) + 14px); display: flex; flex-direction: column; height: min(720px, calc(100dvh - var(--nav-h) - 40px)); border-radius: 16px; border: 1px solid var(--mg-border); background: linear-gradient(170deg, rgba(30, 25, 17, 0.75), rgba(10, 9, 7, 0.8)); overflow: hidden; }
.live-tabs { display: flex; gap: 4px; padding: 8px; border-bottom: 1px solid var(--mg-border); }
.live-tab { flex: 1; padding: 9px 10px; border: 0; border-radius: 10px; background: transparent; color: var(--mg-muted); font: 600 14px/1 var(--body); cursor: pointer; }
.live-tab.is-active { background: rgba(240, 192, 78, 0.14); color: var(--mg-hi); }
.live-chat, .live-qa { flex: 1; min-height: 0; overflow-y: auto; padding: 10px 12px; display: flex; flex-direction: column; gap: 6px; }
.live-chat[hidden], .live-qa[hidden], .live-compose[hidden] { display: none; }
.live-chat__row { font-size: 14px; line-height: 1.4; color: var(--mg-copy); overflow-wrap: anywhere; }
.live-chat__row b { color: var(--mg-gold); margin-right: 4px; }
.live-empty { margin: auto 0; text-align: center; color: var(--mg-muted); font-size: 13px; padding: 18px 8px; }
.live-q { display: grid; gap: 6px; padding: 10px 12px; border-radius: 12px; border: 1px solid rgba(212, 161, 75, 0.16); background: rgba(10, 9, 7, 0.35); }
.live-q.is-pinned { border-color: #f0c04e; }
.live-q__text { color: var(--mg-hi); font-size: 14px; line-height: 1.4; overflow-wrap: anywhere; }
.live-q__meta { color: var(--mg-muted); font-size: 12px; }
.live-q .btn { justify-self: start; }
.live-compose { display: flex; gap: 8px; padding: 10px 10px 8px; border-top: 1px solid var(--mg-border); }
.live-compose input { flex: 1; min-width: 0; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--mg-border); background: rgba(10, 9, 7, 0.5); color: var(--mg-hi); font: inherit; font-size: 15px; }
.live-compose .btn { flex: none; width: 44px; padding: 0; }
.live-card__thumb { width: calc(100% + 32px); margin: -16px -16px 4px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 16px 16px 0 0; background: #0b0a08; }

.lg-layer { position: absolute; inset: 0; z-index: 4; pointer-events: none; overflow: hidden; }
.lg-it { position: absolute; left: 0; top: 0; transition: left .12s linear, top .12s linear, width .12s linear, transform .12s linear; will-change: left, top, transform; }
.lg-it__in { animation: lgDrop .8s cubic-bezier(.2, .9, .25, 1.15) both; }
.lg-it__in img { display: block; width: 100%; height: auto; filter: drop-shadow(0 10px 16px rgba(0, 0, 0, 0.45)); user-select: none; }
.lg-it--hand .lg-it__in img, .lg-it--chest .lg-it__in img { animation: lgBob 2.4s ease-in-out .8s infinite; }
.lg-it--screen .lg-it__in { animation: lgSwim 12s linear both; }
.lg-it--screen .lg-it__in img { animation: lgBob 3s ease-in-out infinite; }
.lg-it.is-out .lg-it__in { animation: lgOut .5s ease-in forwards; }
.lg-it::before { content: ""; position: absolute; left: 50%; top: 50%; width: 120%; aspect-ratio: 1; border-radius: 50%; transform: translate(-50%, -50%) scale(.2); background: radial-gradient(circle, rgba(255, 236, 170, 0.75) 0%, rgba(255, 200, 90, 0.25) 40%, transparent 70%); animation: lgFlash .9s ease-out .55s both; pointer-events: none; }
.lg-spark { position: absolute; width: 14px; height: 14px; margin: -7px; background: radial-gradient(circle, #fff 0 18%, rgba(255, 230, 150, 0.9) 30%, transparent 62%); clip-path: polygon(50% 0, 60% 40%, 100% 50%, 60% 60%, 50% 100%, 40% 60%, 0 50%, 40% 40%); animation: lgSpark 1.1s ease-out forwards; }
@keyframes lgDrop { 0% { transform: translateY(-160%) scale(1.5) rotate(-10deg); opacity: 0; } 55% { transform: translateY(5%) scale(.95) rotate(2deg); opacity: 1; } 78% { transform: translateY(-3%) scale(1.03) rotate(-1deg); } 100% { transform: none; opacity: 1; } }
@keyframes lgOut { to { transform: translateY(-18%) scale(1.15); opacity: 0; } }
@keyframes lgBob { 0%, 100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-4%) rotate(2deg); } }
@keyframes lgFlash { 0% { transform: translate(-50%, -50%) scale(.2); opacity: 0; } 30% { opacity: 1; } 100% { transform: translate(-50%, -50%) scale(1.6); opacity: 0; } }
@keyframes lgSpark { 0% { transform: scale(.2) rotate(0); opacity: 0; } 30% { transform: scale(1.2) rotate(30deg); opacity: 1; } 100% { transform: scale(.4) rotate(90deg) translateY(-10px); opacity: 0; } }
@keyframes lgSwim { 0% { transform: translateX(-210%); opacity: 0; } 6% { opacity: 1; } 50% { transform: translateX(0); } 94% { opacity: 1; } 100% { transform: translateX(210%); opacity: 0; } }
.lg-fireworks { position: absolute; inset: 0; width: 100%; height: 100%; }
.lg-banners { position: absolute; left: 12px; top: 50px; z-index: 7; display: grid; gap: 8px; pointer-events: none; max-width: min(320px, 70%); }
.lg-banner { display: flex; align-items: center; gap: 10px; padding: 7px 14px 7px 7px; border-radius: 999px; background: linear-gradient(90deg, rgba(240, 192, 78, 0.95), rgba(242, 138, 45, 0.88)); color: #1b1307; font-size: 13px; line-height: 1.25; box-shadow: 0 8px 22px rgba(0, 0, 0, 0.4); animation: lgBannerIn .45s cubic-bezier(.2, .9, .3, 1.2) both; }
.lg-banner img { width: 38px; height: 38px; object-fit: contain; flex: none; border-radius: 50%; background: rgba(255, 255, 255, 0.35); padding: 3px; }
.lg-banner b { font-weight: 800; }
.lg-banner.is-out { animation: lgBannerOut .45s ease-in forwards; }
@keyframes lgBannerIn { from { transform: translateX(-120%); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes lgBannerOut { to { transform: translateX(-120%); opacity: 0; } }
html.no-anim .lg-it__in, html.no-anim .lg-it__in img, html.no-anim .lg-it::before { animation: none !important; }
@media (max-width: 900px) {
  .live-room { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .live-stage { max-height: none; min-height: 0; }
  .live-room__side { position: static; height: 440px; }
  .live-stage { border-radius: 14px; }
  .live-info { flex-direction: column; gap: 10px; }
  .live-giftbar { padding: 12px; }
  .live-giftbar__grid { grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 96px; overflow-x: auto; padding-bottom: 4px; scroll-snap-type: x proximity; }
  .live-giftbtn { scroll-snap-align: start; }
  .live-giftbar__grid.is-preview { grid-auto-columns: 80px; }
  .lg-banners { top: 46px; left: 8px; }
  .lg-banner { font-size: 12px; padding: 5px 12px 5px 5px; }
  .lg-banner img { width: 30px; height: 30px; }
}

/* диджеи: каталог, страница, кабинет */
.dj-head__acts { display: flex; gap: 8px; flex-wrap: wrap; }
.dj-intro { margin: 0 0 16px; padding: 14px 16px; border: 1px solid rgba(242,138,45,.35); border-radius: 14px; background: rgba(242,138,45,.08); color: var(--mg-copy); line-height: 1.5; }
.dj-intro b { color: var(--mg-hi); }
.dj-lead { margin: -4px 0 18px; max-width: 720px; }
.dj-cab { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 22px; align-items: start; }
.dj-side { position: sticky; top: calc(var(--nav-h) + 12px); display: grid; gap: 10px; min-width: 0; }
.dj-side__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.dj-side .widget__title { margin: 0; }
.dj-side__empty { margin: 0; }
.dj-body { display: grid; gap: 14px; min-width: 0; align-content: start; }
.dj-link { padding: 0; background: none; border: 0; color: var(--mg-amber-lite); font: 600 13px/1.2 var(--body); cursor: pointer; }
.dj-link:hover { text-decoration: underline; }
.dj-link--danger { color: #ff9c8a; margin-left: auto; }
.dj-mt { margin-top: 18px; }
.dj-pedia { display: grid; gap: 6px; justify-items: start; margin-top: 12px; padding: 12px 14px; border-radius: 12px; border: 1px solid rgba(246,230,197,.14); background: rgba(246,230,197,.05); }
.dj-pedia b { font-size: 14px; }
.dj-pedia span { font-size: 13px; color: var(--mg-muted); line-height: 1.45; }
.dj-pedia.is-on { border-color: rgba(70,200,120,.3); background: rgba(70,200,120,.07); }

.dj-vids { display: grid; gap: 10px; }
.dj-vid { display: grid; gap: 6px; padding: 0; border: 0; background: none; color: inherit; text-align: left; text-decoration: none; cursor: pointer; }
.dj-vid__img { position: relative; display: grid; place-items: center; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: linear-gradient(135deg, #2a1d12, #120e0b); color: var(--mg-gold); border: 1px solid var(--mg-border); }
.dj-vid__img img { width: 100%; height: 100%; object-fit: cover; }
.dj-vid__img > svg { width: 34px; height: 34px; opacity: .7; }
.dj-vid__play { position: absolute; left: 10px; bottom: 10px; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: rgba(7,7,6,.65); color: #fff; }
.dj-vid__play svg { width: 18px; height: 18px; }
.dj-vid__img em { position: absolute; right: 8px; bottom: 8px; padding: 2px 6px; border-radius: 6px; background: rgba(7,7,6,.75); color: #fff; font: 600 11px/1.3 var(--mono); font-style: normal; }
.dj-vid b { font-size: 13.5px; font-weight: 600; color: var(--mg-hi); line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.dj-vid:hover b { color: var(--mg-amber-lite); }
.dj-vid--empty .dj-vid__img { border-style: dashed; background: rgba(246,230,197,.03); }
.dj-vid--empty b { color: var(--mg-muted); font-weight: 500; }

.dj-pick { display: grid; gap: 10px; margin: 0; }
.dj-pick .widget__title, .dj-pick p { margin: 0; }
.dj-pick__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; max-height: 420px; overflow: auto; }
.dj-pick__item { display: grid; gap: 4px; padding: 4px; border: 2px solid transparent; border-radius: 12px; background: none; color: inherit; text-align: left; cursor: pointer; }
.dj-pick__item b { font-size: 12px; font-weight: 500; color: var(--mg-copy); line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.dj-pick__item.is-on { border-color: var(--mg-amber); background: rgba(242,138,45,.08); }
.dj-pick__n { position: absolute; top: 6px; right: 6px; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--grad-cta); color: var(--mg-ink); font: 700 12px/1 var(--body); font-style: normal; }
.dj-pick__acts { display: flex; flex-wrap: wrap; gap: 8px; }

.dj-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px 18px; align-items: center; padding: 16px; border: 1px solid var(--mg-border); border-radius: 16px; background: linear-gradient(135deg, rgba(242,138,45,.10), rgba(106,215,255,.05)); }
.dj-card__who { display: flex; gap: 12px; align-items: center; min-width: 0; }
.dj-card__who > div { display: grid; gap: 3px; min-width: 0; }
.dj-card__who > div > b { font: 700 20px/1.15 var(--display); color: var(--mg-hi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dj-card__who > div > span { font-size: 13px; color: var(--mg-muted); line-height: 1.35; }
.dj-state { justify-self: start; padding: 1px 8px; border-radius: 999px; background: rgba(246,230,197,.08); color: var(--mg-muted); font: 600 11px/18px var(--body); font-style: normal; }
.dj-state.is-on { background: rgba(70,200,120,.15); color: #8fe3ae; }
.dj-card__money { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.dj-card__money > div { display: grid; gap: 2px; }
.dj-card__money small { font-size: 11.5px; color: var(--mg-muted); }
.dj-card__money b { font: 700 18px/1.1 var(--mono); color: var(--mg-hi); }
.dj-card__edit { grid-column: 1 / -1; justify-self: start; }
.dj-ava { display: grid; place-items: center; flex-shrink: 0; width: 56px; height: 56px; border-radius: 50%; overflow: hidden; background: var(--grad-cta); color: var(--mg-ink); font: 700 18px/1 var(--display); }
.dj-ava img { width: 100%; height: 100%; object-fit: cover; }

.dj-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; margin: 0; }
.dj-form label { display: grid; gap: 5px; font-size: 13px; color: var(--mg-muted); }
.dj-form input:not([type="checkbox"]), .dj-form textarea, .dj-plnew input, .dj-search input { width: 100%; min-height: 40px; padding: 8px 12px; border: 1px solid var(--mg-border); border-radius: 10px; background: rgba(7,7,6,.35); color: var(--mg-hi); font: 15px/1.4 var(--body); }
.dj-form textarea { resize: vertical; }
.dj-form__wide, .dj-form__acts, .dj-form .widget__title { grid-column: 1 / -1; }
.dj-form .widget__title { margin: 0; }
.dj-form__check { display: flex !important; align-items: center; gap: 8px; color: var(--mg-copy) !important; grid-column: 1 / -1; }
.dj-form__check input { width: 18px; height: 18px; accent-color: var(--mg-amber); }

.dj-now { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 14px; border-radius: 14px; background: rgba(242,138,45,.12); border: 1px solid rgba(242,138,45,.35); }
.dj-now[hidden] { display: none; }
.dj-now__pp { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; border: 0; background: var(--grad-cta); color: var(--mg-ink); cursor: pointer; }
.dj-now__pp svg { width: 20px; height: 20px; }
.dj-now__main { display: grid; gap: 2px; min-width: 0; }
.dj-now__main b { color: var(--mg-hi); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dj-now__main span { font-size: 12.5px; color: var(--mg-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dj-now__bar { height: 4px; margin-top: 4px; border-radius: 4px; background: rgba(246,230,197,.12); overflow: hidden; }
.dj-now__bar i { display: block; height: 100%; width: 0; background: var(--grad-cta); }
.dj-now__time { font: 12px/1 var(--mono); color: var(--mg-muted); white-space: nowrap; }

.dj-tabs { margin: 4px 0 0; }
.dj-panel { display: grid; gap: 12px; min-width: 0; }
.dj-hint { margin: 0; }
.dj-hint__acts { display: flex; gap: 8px; }
.dj-list { display: grid; gap: 2px; }
.dj-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto auto; align-items: center; gap: 12px; padding: 6px 8px; border-radius: 12px; }
.dj-row:hover, .dj-row.is-cur { background: rgba(242,138,45,.08); }
.dj-row.is-armed { background: rgba(242,138,45,.16); box-shadow: inset 0 0 0 1px rgba(242,138,45,.5); }
.dj-row__play { position: relative; width: 48px; height: 48px; padding: 0; border: 0; border-radius: 10px; overflow: hidden; background: linear-gradient(135deg, #2a1d12, #15110d); color: var(--mg-gold); cursor: pointer; }
.dj-row__play img { width: 100%; height: 100%; object-fit: cover; }
.dj-row__ph { display: grid; place-items: center; width: 100%; height: 100%; }
.dj-row__ph svg { width: 22px; height: 22px; }
.dj-row__btn { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(7,7,6,.5); color: #fff; opacity: 0; transition: opacity .15s; }
.dj-row__btn svg { width: 22px; height: 22px; }
.dj-row:hover .dj-row__btn, .dj-row.is-cur .dj-row__btn, .dj-row.is-armed .dj-row__btn, .dj-row__play:focus-visible .dj-row__btn { opacity: 1; }
.dj-row.is-playing .dj-row__btn { background: rgba(242,138,45,.55); }
.dj-row__main { display: grid; gap: 2px; min-width: 0; }
.dj-row__main b { font-weight: 600; color: var(--mg-hi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dj-row.is-cur .dj-row__main b { color: var(--mg-amber-lite); }
.dj-row__main span { font-size: 13px; color: var(--mg-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dj-row__dur { font-size: 12.5px; color: var(--mg-muted); font-variant-numeric: tabular-nums; }
.dj-price { font: 600 13px/1.2 var(--mono); color: var(--mg-hi); white-space: nowrap; text-align: right; }
.dj-price[hidden] { display: none; }
.dj-price--own, .dj-price--paid { font-family: var(--body); font-weight: 500; font-size: 12px; color: #8fe3ae; }
.dj-price--arm { font-family: var(--body); font-size: 12.5px; color: var(--mg-amber-lite); }
.dj-icon { display: grid; place-items: center; width: 34px; height: 34px; border: 0; border-radius: 50%; background: none; color: var(--mg-muted); cursor: pointer; }
.dj-icon:hover { color: #ff9c8a; background: rgba(200,64,42,.12); }
.dj-icon svg { width: 16px; height: 16px; }
.dj-add { position: relative; }
.dj-add .btn { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.dj-add .btn svg { width: 14px; height: 14px; }
.dj-add__menu { position: absolute; right: 0; top: calc(100% + 4px); z-index: 30; display: grid; min-width: 200px; max-height: 260px; overflow: auto; padding: 6px; border: 1px solid var(--mg-border); border-radius: 12px; background: var(--mg-card); box-shadow: 0 12px 30px rgba(0,0,0,.45); }
.dj-add__menu[hidden] { display: none; }
.dj-add__menu button { padding: 9px 12px; border: 0; border-radius: 8px; background: none; color: var(--mg-copy); text-align: left; font: 14px/1.3 var(--body); cursor: pointer; }
.dj-add__menu button:hover { background: rgba(242,138,45,.12); color: var(--mg-hi); }

.dj-plnew { display: flex; gap: 8px; }
.dj-plnew input { flex: 1; min-width: 0; }
.dj-pl { display: grid; gap: 6px; padding: 12px; border: 1px solid var(--mg-border); border-radius: 14px; }
.dj-pl__head { display: flex; align-items: baseline; gap: 10px; }
.dj-pl__head h3 { margin: 0; font: 700 17px/1.2 var(--display); color: var(--mg-hi); }
.dj-pl .muted { margin: 0; }

.dj-libbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.dj-libtabs { display: flex; gap: 6px; flex-wrap: wrap; }
.dj-chip { min-height: 34px; padding: 0 12px; border: 1px solid var(--mg-border); border-radius: 999px; background: none; color: var(--mg-copy); font: 600 13px/1 var(--body); cursor: pointer; }
.dj-chip.is-on { border-color: var(--mg-amber); color: var(--mg-hi); background: rgba(242,138,45,.12); }
.dj-search { flex: 1; min-width: 200px; }

.dj-prices { display: grid; gap: 14px; }
.dj-prices .studio-panel { margin: 0; }
.dj-prices p { line-height: 1.5; }
.dj-table { width: 100%; max-width: 420px; border-collapse: collapse; font-size: 14px; }
.dj-table th, .dj-table td { padding: 7px 10px; border-bottom: 1px solid rgba(246,230,197,.08); text-align: left; }
.dj-table th { font-size: 12px; color: var(--mg-muted); font-weight: 600; }
.dj-table td:last-child { font-family: var(--mono); color: var(--mg-hi); }

.dj-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 16px; }
.dj-tile { display: grid; gap: 8px; padding: 0 0 12px; border: 1px solid var(--mg-border); border-radius: 16px; overflow: hidden; color: inherit; text-decoration: none; background: rgba(246,230,197,.02); }
.dj-tile:hover { border-color: var(--mg-amber); }
.dj-tile__img { display: grid; place-items: center; aspect-ratio: 16 / 9; background: linear-gradient(135deg, #3a2412, #120e0b); color: var(--mg-gold); }
.dj-tile__img img { width: 100%; height: 100%; object-fit: cover; }
.dj-tile__ph svg { width: 44px; height: 44px; opacity: .7; }
.dj-tile__who { display: flex; gap: 10px; align-items: center; padding: 0 12px; margin-top: -30px; }
.dj-tile__who .dj-ava { width: 48px; height: 48px; font-size: 15px; border: 3px solid var(--mg-card); }
.dj-tile__who b { margin-top: 24px; font: 700 16px/1.2 var(--display); color: var(--mg-hi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dj-tile__meta, .dj-tile__nums { padding: 0 12px; font-size: 13px; color: var(--mg-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dj-tile__nums { font-size: 12px; }

.dj-hero { display: flex; gap: 18px; align-items: center; margin: 0 0 20px; }
.dj-hero .dj-ava { width: 96px; height: 96px; font-size: 28px; }
.dj-hero__txt { flex: 1; min-width: 0; }
.dj-hero__txt .page-title { margin: 0; }
.dj-hero__meta { margin: 4px 0 0; color: var(--mg-muted); }
.dj-hero__about { margin: 8px 0 0; max-width: 720px; color: var(--mg-copy); line-height: 1.5; white-space: pre-line; }

.dj-badge { display: inline-grid; place-items: center; min-width: 18px; height: 18px; margin-left: 4px; padding: 0 5px; border-radius: 9px; background: #e5483a; color: #fff; font: 700 11px/1 var(--body); letter-spacing: 0; }
.dj-sub { margin: 4px 0 0; font: 700 15px/1.2 var(--display); color: var(--mg-hi); }
.dj-sets { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.dj-set { display: flex; gap: 12px; align-items: center; padding: 12px 14px; border: 1px solid var(--mg-border); border-radius: 14px; background: linear-gradient(135deg, rgba(242,138,45,.08), transparent); }
.dj-set i { display: grid; place-items: center; flex-shrink: 0; width: 44px; height: 44px; border-radius: 50%; background: rgba(242,138,45,.14); color: var(--mg-amber-lite); }
.dj-set i svg { width: 24px; height: 24px; }
.dj-set div { display: grid; gap: 2px; min-width: 0; }
.dj-set b { color: var(--mg-hi); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dj-set span { font-size: 12.5px; color: var(--mg-muted); }
.dj-row--static .dj-row__play { cursor: default; }
.dj-invite { display: grid; gap: 10px; margin: 0; }
.dj-invite .widget__title, .dj-invite p { margin: 0; }
.dj-invite > .btn { justify-self: start; }
.dj-invite__sub { margin: 6px 0 0; font: 700 14px/1.2 var(--display); color: var(--mg-hi); }
.dj-form input[type="date"], .dj-form input[type="time"] { color-scheme: dark; }
.dj-req { display: grid; gap: 6px; padding: 12px 14px; border: 1px solid var(--mg-border); border-radius: 14px; }
.dj-req--mini { padding: 8px 12px; gap: 3px; }
.dj-req__head { display: flex; gap: 10px; align-items: center; justify-content: space-between; }
.dj-req__head b, .dj-req--mini b { color: var(--mg-hi); font-weight: 600; }
.dj-req__meta { font: 600 13px/1.3 var(--body); color: var(--mg-copy); }
.dj-req__who { font-size: 12.5px; color: var(--mg-muted); }
.dj-req p { margin: 0; font-size: 14px; color: var(--mg-copy); line-height: 1.45; white-space: pre-line; }
.dj-req__ans { color: var(--mg-hi) !important; }
.dj-req__st { justify-self: start; padding: 1px 8px; border-radius: 999px; font: 600 11px/18px var(--body); font-style: normal; background: rgba(246,230,197,.08); color: var(--mg-muted); white-space: nowrap; }
.dj-req__st--new { background: rgba(242,138,45,.16); color: var(--mg-amber-lite); }
.dj-req__st--accepted { background: rgba(70,200,120,.15); color: #8fe3ae; }
.dj-req__st--declined, .dj-req__st--cancelled { background: rgba(200,64,42,.14); color: #ff9c8a; }
.dj-req__answer { width: 100%; padding: 8px 12px; border: 1px solid var(--mg-border); border-radius: 10px; background: rgba(7,7,6,.35); color: var(--mg-hi); font: 14px/1.4 var(--body); resize: vertical; }
.dj-req__acts { display: flex; gap: 8px; flex-wrap: wrap; }

@media (max-width: 900px) {
  .dj-cab { grid-template-columns: minmax(0, 1fr); }
  .dj-side { position: static; }
  .dj-vids { grid-auto-flow: column; grid-auto-columns: 220px; grid-template-columns: none; overflow-x: auto; padding-bottom: 4px; scroll-snap-type: x proximity; }
  .dj-vid { scroll-snap-align: start; }
  .dj-vid--empty ~ .dj-vid--empty, .dj-vid:not(.dj-vid--empty) ~ .dj-vid--empty { display: none; }
  .dj-vid--empty { grid-template-columns: 56px minmax(0, 1fr); align-items: center; gap: 12px; }
  .dj-vid--empty .dj-vid__img { aspect-ratio: auto; height: 56px; }
  .dj-vids:has(.dj-vid--empty:first-child) { grid-auto-flow: row; grid-auto-columns: auto; overflow: visible; }
  .dj-pick__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .dj-card { grid-template-columns: minmax(0, 1fr); padding: 14px; }
  .dj-card__money { justify-content: flex-start; }
  .dj-form { grid-template-columns: minmax(0, 1fr); }
  .dj-row { grid-template-columns: auto minmax(0, 1fr) auto; gap: 4px 10px; }
  .dj-row__dur { display: none; }
  .dj-row .dj-price { grid-column: 2; grid-row: 2; text-align: left; font-size: 12px; }
  .dj-row .dj-add, .dj-row .dj-icon { grid-column: 3; grid-row: 1 / span 2; }
  .dj-row .dj-add .btn span { display: none; }
  .dj-row .dj-add .btn { padding: 6px 9px; }
  .dj-row__play { grid-row: 1 / span 2; }
  .dj-vids { grid-auto-columns: 72%; }
  .dj-pick__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dj-hero { flex-wrap: wrap; gap: 12px; }
  .dj-hero .dj-ava { width: 72px; height: 72px; font-size: 22px; }
  .dj-grid { grid-template-columns: minmax(0, 1fr); }
  .dj-plnew { flex-wrap: wrap; }
}

/* игры: каталог, страница игры, кабинет разработчика */
.gm-hero { display: flex; gap: 16px; align-items: flex-end; justify-content: space-between; margin: 0 0 18px; }
.gm-hero .page-title { margin: 0; }
.gm-hero__lead { margin: 6px 0 0; max-width: 620px; color: var(--mg-copy); line-height: 1.5; }
.gm-hero__dev { flex: none; }
.gm-tools { display: grid; gap: 12px; margin: 0 0 22px; }
.gm-search { position: relative; display: block; max-width: 460px; }
.gm-search svg { position: absolute; left: 12px; top: 50%; width: 18px; height: 18px; transform: translateY(-50%); color: var(--mg-muted); pointer-events: none; }
.gm-search input { width: 100%; min-height: 44px; padding: 8px 14px 8px 40px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(7,7,6,.35); color: var(--mg-hi); font: 15px/1.4 var(--body); }
.gm-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.gm-sec { margin: 0 0 26px; }
.gm-sec > .widget__title { margin: 0 0 12px; }
.gm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 16px; }
.gm-row { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(180px, 210px); gap: 14px; overflow-x: auto; padding-bottom: 6px; scrollbar-width: thin; }
.gm-card { display: grid; gap: 10px; color: inherit; text-decoration: none; }
.gm-card[hidden] { display: none; }
.gm-card__img { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; border: 1px solid var(--mg-border); border-radius: 14px; background: linear-gradient(135deg, rgba(242,138,45,.16), rgba(106,215,255,.08)); }
.gm-card__cover { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s var(--ease); }
.gm-card:hover .gm-card__cover { transform: scale(1.04); }
.gm-cover--none { display: grid; place-items: center; color: var(--mg-amber); }
.gm-cover--none svg { width: 44%; height: 44%; opacity: .75; }
.gm-card__flag { position: absolute; left: 8px; top: 8px; padding: 3px 8px; border-radius: 999px; background: rgba(8,7,6,.78); color: #f0c48a; font: 600 11px/1.3 var(--body); }
.gm-card.is-paused .gm-card__cover { filter: grayscale(.8) brightness(.7); }
.gm-card__txt { display: grid; gap: 3px; min-width: 0; }
.gm-card__txt b { overflow: hidden; color: var(--mg-hi); font: 700 16px/1.25 var(--display); text-overflow: ellipsis; white-space: nowrap; }
.gm-card__txt span { color: var(--mg-muted); font-size: 13px; }
.gm-nofound { margin-top: 12px; }

.gm-play__head { display: flex; gap: 14px; align-items: center; margin: 0 0 14px; }
.gm-back { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid var(--mg-border); border-radius: 50%; color: var(--mg-hi); font-size: 18px; text-decoration: none; }
.gm-play__ttl { flex: 1; min-width: 0; }
.gm-play__ttl .page-title { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gm-play__ttl p { margin: 3px 0 0; }
.gm-play__acts { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.gm-btn { min-height: 38px; padding: 0 14px; gap: 6px; font-size: 14px; }
.gm-btn svg { width: 16px; height: 16px; }
.gm-btn--danger { color: #f0a08a; }
.gm-note { margin: 0 0 12px; padding: 10px 14px; border: 1px solid rgba(240,196,138,.35); border-radius: 12px; background: rgba(240,196,138,.08); color: var(--mg-copy); font-size: 14px; }
.gm-slot { position: relative; display: grid; place-items: center; width: 100%; aspect-ratio: 16 / 10; max-height: calc(100dvh - var(--nav-h, 64px) - 150px); min-height: 420px; overflow: hidden; border: 1px solid var(--mg-border); border-radius: 18px; background: #060605; }
.gm-slot__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: blur(2px) brightness(.45); transform: scale(1.04); }
.gm-slot__go { position: relative; display: inline-flex; align-items: center; gap: 10px; min-height: 58px; padding: 0 30px 0 24px; border: 0; border-radius: 999px; background: linear-gradient(135deg, #f28a2d, #e5483a); color: #fff; font: 700 19px/1 var(--display); cursor: pointer; box-shadow: 0 16px 40px rgba(229,72,58,.35); transition: transform .2s var(--ease), box-shadow .2s var(--ease); }
.gm-slot__go:hover { transform: translateY(-2px); box-shadow: 0 20px 48px rgba(229,72,58,.45); }
.gm-slot__go svg { width: 24px; height: 24px; }
.gm-slot__hint { position: absolute; bottom: 14px; left: 0; right: 0; margin: 0; text-align: center; color: rgba(255,255,255,.75); font-size: 13px; }
.gm-slot__msg { position: relative; display: grid; gap: 6px; max-width: 420px; padding: 0 20px; text-align: center; color: #fff; }
.gm-slot__msg b { font: 700 20px/1.3 var(--display); }
.gm-slot__msg span { color: rgba(255,255,255,.75); }
.gm-play__info { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 16px; margin-top: 18px; }
.gm-panel { padding: 16px 18px; border: 1px solid var(--mg-border); border-radius: 16px; background: var(--mg-card); }
.gm-panel > .widget__title { margin: 0 0 10px; }
.gm-panel p { margin: 0 0 8px; color: var(--mg-copy); line-height: 1.5; }
.gm-desc { white-space: pre-line; }
.gm-board { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.gm-board li { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 7px 8px; border-radius: 10px; }
.gm-board li.is-me { background: rgba(242,138,45,.12); }
.gm-board__n { color: var(--mg-muted); font: 700 14px/1 var(--mono); text-align: center; }
.gm-board li:nth-child(-n+3) .gm-board__n { color: var(--mg-amber); }
.gm-board__who { overflow: hidden; color: var(--mg-hi); text-overflow: ellipsis; white-space: nowrap; }
.gm-board b { color: var(--mg-hi); font-family: var(--mono); }
.gm-board__mine { margin: 10px 0 0 !important; font-size: 14px; }

.gm-stage { position: absolute; z-index: 20; overflow: hidden; border-radius: 18px; background: #000; }
.gm-stage iframe { display: block; width: 100%; height: 100%; border: 0; background: #000; }
.gm-stage__x { display: none; }
.gm-stage { box-sizing: border-box; }
.gm-stage.is-max { position: fixed; inset: 0; z-index: 1050; border-radius: 0; }
/* в полном экране «Свернуть» — в своей полосе сверху, чтобы не закрывать кнопку паузы игры */
.gm-stage.is-max, .gm-stage.is-full { padding-top: calc(44px + env(safe-area-inset-top, 0px)); background: #0b0a08; }
.gm-stage.is-max .gm-stage__x, .gm-stage.is-full .gm-stage__x { position: absolute; top: calc(4px + env(safe-area-inset-top, 0px)); right: 8px; z-index: 2; display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: 50%; background: rgba(255,255,255,.12); color: #fff; cursor: pointer; }
.gm-stage__x svg { width: 20px; height: 20px; }
.gm-stage.is-full { border-radius: 0; }
body.gm-maxed { overflow: hidden; }
.gm-stage.is-land.is-max, .gm-stage.is-land.is-full { padding: 0 env(safe-area-inset-right, 0px) 0 env(safe-area-inset-left, 0px); background: #000; }
.gm-stage.is-land.is-max .gm-stage__x, .gm-stage.is-land.is-full .gm-stage__x { top: 8px; right: auto; left: calc(8px + env(safe-area-inset-left, 0px)); background: rgba(0,0,0,.45); }
@media (orientation: portrait) {
  .gm-stage.is-land:not(.is-menu).is-max, .gm-stage.is-land:not(.is-menu).is-full { padding: 0; }
  .gm-stage.is-land:not(.is-menu).is-max iframe, .gm-stage.is-land:not(.is-menu).is-full iframe { position: absolute; top: 0; left: 0; width: 100vh; width: 100dvh; height: 100vw; transform-origin: 0 0; transform: rotate(90deg) translateY(-100%); }
  .gm-stage.is-land:not(.is-menu).is-max .gm-stage__x, .gm-stage.is-land:not(.is-menu).is-full .gm-stage__x { top: 8px; right: 8px; left: auto; transform: rotate(90deg); }
  /* меню игры (сообщает сама игра) — прямо, как у вертикальных игр; боком только игровой кадр */
  .gm-stage.is-land.is-menu.is-max, .gm-stage.is-land.is-menu.is-full { padding: calc(44px + env(safe-area-inset-top, 0px)) 0 0; background: #0b0a08; }
  .gm-stage.is-land.is-menu.is-max .gm-stage__x, .gm-stage.is-land.is-menu.is-full .gm-stage__x { top: calc(4px + env(safe-area-inset-top, 0px)); right: 8px; left: auto; background: rgba(255,255,255,.12); }
}

.gm-check { display: flex; gap: 10px; align-items: flex-start; margin: 4px 0 14px; color: var(--mg-copy); font-size: 14px; line-height: 1.4; cursor: pointer; }
.gm-check input { flex: none; width: 18px; height: 18px; margin-top: 1px; accent-color: #e5483a; }
.gm-wide { width: 100%; min-height: 46px; margin-top: 8px; }
.gm-danger { background: linear-gradient(135deg, #d9442f, #b3263a) !important; }
.gm-danger:disabled { opacity: .45; }

.gm-dev { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 18px; align-items: start; }
.gm-dev__main, .gm-dev__side { display: grid; gap: 16px; min-width: 0; }
.gm-dev__main > .gm-sec { margin: 0; }
.gm-sub.is-on { border-color: rgba(143,217,138,.35); }
.gm-sub__row { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; }
.gm-small { font-size: 12px !important; }
.gm-big { margin: 0 !important; color: var(--mg-hi) !important; font: 700 26px/1.2 var(--display); }
.gm-list { display: grid; gap: 8px; margin: 0 0 12px; padding-left: 18px; color: var(--mg-copy); font-size: 14px; line-height: 1.45; }
.gm-list code, .gm-code { font-family: var(--mono); font-size: 12px; }
.gm-code { margin: 0; padding: 12px; overflow-x: auto; border-radius: 10px; background: rgba(7,7,6,.55); color: #f0d9b0; line-height: 1.5; }
.gm-form select { width: 100%; min-height: 40px; padding: 8px 12px; border: 1px solid var(--mg-border); border-radius: 10px; background: rgba(7,7,6,.35); color: var(--mg-hi); font: 15px/1.4 var(--body); }
.gm-form input[type="file"] { padding: 7px 10px; font-size: 13px; }
.gm-form__acts { display: flex; flex-wrap: wrap; gap: 10px; }
.gm-mine { display: grid; gap: 10px; }
.gm-mine__row { display: grid; grid-template-columns: 112px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 12px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(7,7,6,.2); }
.gm-mine__cover { width: 112px; aspect-ratio: 16 / 10; border-radius: 10px; object-fit: cover; background: rgba(242,138,45,.12); }
.gm-mine__txt { display: grid; gap: 5px; justify-items: start; min-width: 0; }
.gm-mine__txt b { max-width: 100%; overflow: hidden; color: var(--mg-hi); font: 700 16px/1.25 var(--display); text-overflow: ellipsis; white-space: nowrap; }
.gm-mine__acts { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; max-width: 300px; }
.gm-pill { padding: 3px 9px; border-radius: 999px; background: rgba(246,230,197,.08); color: var(--mg-copy); font: 600 12px/1.3 var(--body); }
.gm-pill--live { background: rgba(143,217,138,.14); color: #8fd98a; }
.gm-pill--review { background: rgba(240,196,138,.14); color: #f0c48a; }
.gm-pill--rejected, .gm-pill--hidden { background: rgba(240,160,138,.14); color: #f0a08a; }
.gm-pill--paused { background: rgba(106,215,255,.12); color: #8fd3ef; }
.gm-reason { margin: 0 !important; color: #f0a08a !important; font-size: 13px; }
.gm-reason-in { width: 100%; min-height: 36px; padding: 6px 10px; border: 1px solid var(--mg-border); border-radius: 9px; background: rgba(7,7,6,.35); color: var(--mg-hi); font: 14px/1.4 var(--body); }
.gm-h3 { margin: 18px 0 8px; color: var(--mg-hi); font: 700 15px/1.2 var(--display); }
.gm-live { display: grid; gap: 6px; margin: 0; padding-left: 18px; color: var(--mg-copy); }

@media (max-width: 900px) {
  .gm-dev { grid-template-columns: minmax(0, 1fr); }
  .gm-play__info { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .gm-hero { flex-direction: column; align-items: stretch; }
  .gm-hero__dev { align-self: flex-start; }
  .gm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .gm-card__txt b { font-size: 14px; }
  .gm-card__txt span { font-size: 12px; }
  .gm-play__head { flex-wrap: wrap; }
  .gm-play__acts { width: 100%; justify-content: flex-start; }
  .gm-slot { aspect-ratio: auto; height: calc(100dvh - var(--nav-h, 64px) - 210px); min-height: 360px; max-height: none; border-radius: 14px; }
  .gm-stage { border-radius: 14px; }
  .gm-mine__row { grid-template-columns: 84px minmax(0, 1fr); }
  .gm-mine__cover { width: 84px; }
  .gm-mine__acts { grid-column: 1 / -1; justify-content: flex-start; max-width: none; }
}
/* админка: IP-адрес и действия человека */
.ipx-back { display: inline-block; margin-bottom: 8px; color: var(--mg-muted); font-size: 13px; text-decoration: none; }
.ipx-back:hover { color: var(--mg-hi); }
.ipx-btn { text-decoration: none; border-color: rgba(248, 180, 90, .45); }
.ipx-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 14px; }
.ipx-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 24px; margin: 0; }
.ipx-facts > div { min-width: 0; padding: 10px 0; border-top: 1px solid rgba(246, 230, 197, .07); }
.ipx-facts dt { margin: 0 0 3px; font-size: 12px; color: var(--mg-muted); }
.ipx-facts dd { margin: 0; font-size: 14px; line-height: 1.45; color: var(--mg-hi); overflow-wrap: anywhere; }
.ipx-facts code, .ipx-ip code, .ipx-switch code { font-size: 12.5px; padding: 1px 6px; border-radius: 6px; background: color-mix(in srgb, var(--mg-hi) 10%, transparent); }
.ipx-money, .ipx-posts, .ipx-switch { list-style: none; margin: 0; padding: 0; }
.ipx-money li, .ipx-posts li, .ipx-switch li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; padding: 8px 0; border-top: 1px solid rgba(246, 230, 197, .07); font-size: 13.5px; color: var(--mg-copy); }
.ipx-money small, .ipx-posts small { flex-basis: 100%; font-size: 12px; color: var(--mg-muted); }
.ipx-plus { color: #8fdc8a; font-variant-numeric: tabular-nums; }
.ipx-minus { color: #f19a7c; font-variant-numeric: tabular-nums; }
.ipx-posts a { color: var(--mg-hi); }
.ipx-switch span { font-size: 12.5px; color: var(--mg-muted); }
.ipx-ip { margin-top: 18px; padding: 14px 16px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(246, 230, 197, .025); }
.ipx-ip header { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 12px; }
.ipx-ip header code { font-size: 15px; font-weight: 600; color: var(--mg-hi); }
.ipx-ip header span { font-size: 12.5px; color: var(--mg-muted); }
.ipx-ip__meta { margin: 6px 0 10px; font-size: 12.5px; line-height: 1.5; color: var(--mg-copy); }
.ipx-ip__meta a { color: var(--mg-hi); }
.ipx-sess { border-top: 1px solid rgba(246, 230, 197, .08); }
.ipx-sess summary { display: flex; flex-wrap: wrap; gap: 2px 10px; padding: 10px 0; cursor: pointer; list-style: none; }
.ipx-sess summary::-webkit-details-marker { display: none; }
.ipx-sess summary::before { content: "›"; width: 12px; color: var(--mg-muted); transition: transform .2s var(--ease); }
.ipx-sess[open] summary::before { transform: rotate(90deg); }
.ipx-sess summary b { font-size: 13.5px; color: var(--mg-hi); }
.ipx-sess summary span { font-size: 12.5px; color: var(--mg-muted); }
.ipx-acts { list-style: none; margin: 0 0 10px; padding: 0 0 0 22px; }
.ipx-acts li { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 10px; padding: 6px 0; font-size: 13.5px; line-height: 1.45; color: var(--mg-copy); }
.ipx-acts time { font-size: 12px; color: var(--mg-muted); font-variant-numeric: tabular-nums; padding-top: 1px; }
.ipx-acts a { color: var(--mg-hi); }
.ipx-acts q { display: block; margin-top: 4px; padding: 6px 10px; border-left: 2px solid rgba(248, 180, 90, .5); border-radius: 0 8px 8px 0; background: rgba(246, 230, 197, .04); font-style: normal; quotes: none; color: var(--mg-hi); overflow-wrap: anywhere; }
.ipx-acts small { display: block; font-size: 12px; color: var(--mg-muted); }
.ipx-acts .ipx-weak { color: #d8b56a; }
.ipx-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin-bottom: 14px; }
.ipx-bar select { min-height: 40px; padding: 8px 10px; border: 1px solid var(--mg-border); border-radius: 10px; background: rgba(12, 11, 9, .9); color: var(--mg-hi); font-size: 13px; }
.ipx-check { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--mg-copy); }
@media (max-width: 640px) {
  .ipx-stats { grid-template-columns: 1fr; }
  .ipx-facts { grid-template-columns: 1fr; gap: 0; }
  .ipx-ip { padding: 12px; }
  .ipx-acts { padding-left: 0; }
  .ipx-acts li { grid-template-columns: 42px minmax(0, 1fr); gap: 8px; }
}@media (max-width: 640px) {
  .ipx-stats--mini { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .ipx-stats--mini .admin-stat { padding: 10px 12px; }
  .ipx-stats--mini .admin-stat b { font-size: 26px; }
  .ipx-stats--mini .admin-stat span { font-size: 12px; }
}
/* реклама в играх */
.gm-ad__box { max-width: 420px; text-align: center; }
.gm-ad__tag { display: inline-block; margin-bottom: 12px; padding: 3px 10px; border: 1px solid var(--mg-border); border-radius: 999px; font-size: 12px; color: var(--mg-muted); }
.gm-ad__pic { display: block; width: 100%; aspect-ratio: 16 / 9; border-radius: 12px; object-fit: cover; background-size: cover; background-position: center; margin-bottom: 14px; }
.gm-ad__title { margin: 0 0 6px; font-size: 20px; line-height: 1.25; color: var(--mg-hi); }
.gm-ad__by { margin: 0 0 16px; font-size: 13px; }
.gm-ad__acts { display: grid; gap: 8px; }
.gm-ad__acts .btn { width: 100%; justify-content: center; }
.gm-ad__acts .btn[disabled] { opacity: .55; cursor: default; }

/* ---------- награды в играх и раздел «Бонусы» ---------- */
.gm-lad { grid-column: 1 / -1; }
.gm-lad__me { font-size: 14px; }
.gm-lad__me b { color: var(--mg-hi); }
.gm-lad__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); gap: 8px; margin: 10px 0 12px; padding: 0; list-style: none; }
.gm-lad__it { position: relative; display: grid; gap: 3px; padding: 10px 12px 10px 14px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(246,230,197,.03); }
.gm-lad__it::before { content: ""; position: absolute; left: 0; top: 10px; bottom: 10px; width: 3px; border-radius: 3px; background: rgba(246,230,197,.15); }
.gm-lad__it--d::before { background: #6ad7ff; }
.gm-lad__it--plus::before { background: var(--mg-amber); }
.gm-lad__it--gift::before { background: #e86ad0; }
.gm-lad__step { color: var(--mg-copy); font-size: 13px; }
.gm-lad__prize { color: var(--mg-hi); font-size: 15px; line-height: 1.25; }
.gm-lad__tail { color: var(--mg-muted, #9c8f7c); font-size: 12px; }
.gm-lad__it--got { border-color: rgba(143,217,138,.35); background: rgba(143,217,138,.06); }
.gm-lad__it--got .gm-lad__tail { color: #8fd98a; }
.gm-lad__it--time { border-color: rgba(240,196,138,.45); }
.gm-lad__it--time .gm-lad__tail { color: #f0c48a; }
.gm-lad__it--next { border-color: rgba(242,138,45,.55); box-shadow: 0 0 0 1px rgba(242,138,45,.18) inset; }
.gm-lad__it--locked { opacity: .72; }
.gm-lad__all { grid-column: 1 / -1; }
.gm-lad__all summary { cursor: pointer; padding: 8px 2px; color: var(--mg-copy); font-size: 14px; font-weight: 600; }
.gm-lad__all ol { display: grid; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); gap: 8px; margin: 6px 0 0; padding: 0; list-style: none; }
@media (max-width: 640px) { .gm-lad__all ol { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.gm-reward { position: absolute; z-index: 5; top: 14px; left: 50%; display: grid; gap: 8px; width: min(380px, calc(100% - 24px)); padding: 12px 14px; border: 1px solid rgba(242,184,75,.5); border-radius: 16px; background: linear-gradient(160deg, rgba(48,30,14,.97), rgba(20,14,10,.97)); box-shadow: 0 18px 50px rgba(0,0,0,.55), 0 0 30px rgba(242,138,45,.25); color: var(--mg-hi); transform: translate(-50%, -16px); opacity: 0; transition: transform .35s var(--ease, ease), opacity .35s; pointer-events: auto; }
.gm-reward.is-on { transform: translate(-50%, 0); opacity: 1; }
.gm-reward__row { display: flex; gap: 10px; align-items: center; }
.gm-reward__row b { display: block; font-size: 16px; }
.gm-reward__row span { color: var(--mg-copy); font-size: 12.5px; }
.gm-reward__ico { flex: 0 0 auto; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: linear-gradient(135deg, #f2b84b, #f28a2d); color: #1a120c; }
.gm-reward__ico svg { width: 22px; height: 22px; }
.gm-reward__go { justify-self: end; color: var(--mg-amber-lite); font: 600 13px/1 var(--body); text-decoration: underline; text-underline-offset: 3px; }

.bn-adm-link { margin: -6px 0 16px; }
.bn-list { display: grid; gap: 10px; }
.bn-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 14px 16px; border: 1px solid var(--mg-border); border-radius: 16px; background: var(--mg-card); }
.bn-card__ico { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: rgba(246,230,197,.06); }
.bn-card__ico svg { width: 28px; height: 28px; }
.bn-card--d .bn-card__ico { color: #6ad7ff; background: rgba(106,215,255,.1); }
.bn-card--plus .bn-card__ico { color: var(--mg-amber); background: rgba(242,138,45,.12); }
.bn-card--gift .bn-card__ico { color: #e86ad0; background: rgba(232,106,208,.1); }
.bn-card__txt { display: grid; gap: 2px; min-width: 0; }
.bn-card__txt b { color: var(--mg-hi); font-size: 17px; }
.bn-card__txt span { color: var(--mg-copy); font-size: 14px; }
.bn-card__txt small { font-size: 12.5px; }
.bn-card.is-ready { border-color: rgba(242,138,45,.45); box-shadow: 0 0 0 1px rgba(242,138,45,.12) inset; }
.bn-card.is-used, .bn-card.is-void { opacity: .78; }
.bn-empty { margin: 0; }
.bn-games { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; margin-bottom: 10px; }
.bn-game { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 12px; align-items: center; padding: 10px; border: 1px solid var(--mg-border); border-radius: 14px; background: var(--mg-card); color: inherit; text-decoration: none; transition: border-color .2s, transform .2s; }
.bn-game:hover { border-color: rgba(242,138,45,.5); transform: translateY(-1px); }
.bn-game__cover { width: 96px; height: 60px; border-radius: 10px; object-fit: cover; display: block; }
.bn-game__txt { display: grid; gap: 4px; min-width: 0; }
.bn-game__txt b { color: var(--mg-hi); font-size: 15px; }
.bn-game__txt span { color: var(--mg-copy); font-size: 13px; line-height: 1.35; }
.bn-game__txt em { color: var(--mg-amber-lite); font-style: normal; font-weight: 600; }
.bn-game__bar { display: block; height: 5px; border-radius: 5px; background: rgba(246,230,197,.1); overflow: hidden; }
.bn-game__bar i { display: block; height: 100%; border-radius: 5px; background: linear-gradient(90deg, #f2b84b, #f28a2d); }
.bn-past summary { cursor: pointer; list-style: revert; }
.bn-past .bn-list { margin-top: 10px; }
.bn-adm { display: grid; gap: 16px; }
.bn-grant { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.bn-grant > .widget__title { grid-column: 1 / -1; }
.bn-log { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; font-size: 14px; color: var(--mg-copy); }
.bn-log li { display: flex; flex-wrap: wrap; gap: 4px 8px; padding: 8px 10px; border-radius: 10px; background: rgba(246,230,197,.03); }
.bn-log li > span:first-child { color: var(--mg-muted, #9c8f7c); }
.bn-log small { flex-basis: 100%; }
.soc-msg__link { margin-top: 8px; display: inline-flex; }
.bnc { display: grid; gap: 14px; }
.bnc-panel { display: grid; gap: 12px; padding: 16px 18px; border: 1px solid rgba(242,138,45,.45); border-radius: 18px; background: linear-gradient(150deg, rgba(242,138,45,.14), rgba(242,184,75,.04) 60%, transparent), var(--mg-card); }
.bnc-panel__sum { display: grid; gap: 2px; }
.bnc-panel__sum b { color: var(--mg-hi); font-size: 19px; }
.bnc-panel__sum span { color: var(--mg-copy); font-size: 14.5px; }
.bnc-panel__acts { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 10px; }
.bnc-panel__acts .btn { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 2px; min-height: 52px; padding: 8px 12px; text-align: center; line-height: 1.15; }
.bnc-panel__acts .btn small { font-size: 12.5px; font-weight: 500; opacity: .8; }
.bnc-panel__acts .btn[disabled] { opacity: .45; cursor: default; }
.bnc-panel .gm-small { margin: 0; }
.bnc-src { display: grid; gap: 8px; }
.bnc-src__ttl { margin: 4px 0 0; color: var(--mg-copy); font: 600 13px/1.2 var(--body); letter-spacing: .02em; }
.bnc-src__ttl span { margin-left: 4px; padding: 1px 7px; border-radius: 10px; background: rgba(246,230,197,.08); color: var(--mg-hi); font-size: 12px; }
html[data-theme="light"] .bnc-panel { background: linear-gradient(150deg, #fff3e2, #fffaf3 60%); border-color: rgba(180,80,28,.35); }
html[data-theme="light"] .bnc-src__ttl span { background: rgba(43,29,16,.07); color: #2b1d10; }
@media (max-width: 720px) {
  .bnc-panel { padding: 14px; }
  .bnc-panel__acts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bnc-panel__all { grid-column: 1 / -1; }
}
html[data-theme="light"] .gm-reward { background: linear-gradient(160deg, #fff7ea, #fbecd6); color: #2b1d10; border-color: rgba(180,80,28,.35); }
html[data-theme="light"] .gm-reward__row span { color: #6b5540; }
@media (max-width: 720px) {
  .bn-card { grid-template-columns: auto minmax(0, 1fr); }
  .bn-card__act { grid-column: 1 / -1; }
  .bn-card__go { width: 100%; justify-content: center; }
  .bn-grant { grid-template-columns: minmax(0, 1fr); }
  .gm-lad__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- Из SFEROOM в ГранаДзяк ---------- */
.mus-send { max-width: 440px; }
.mus-send__from { margin: 0 0 12px; font: 600 12px/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--mg-amber); }
.mus-send__card { display: flex; gap: 14px; align-items: center; padding: 12px; margin-bottom: 14px; border: 1px solid var(--mg-border); border-radius: 14px; background: linear-gradient(135deg, rgba(242,138,45,.10), rgba(255,255,255,.02)); }
.mus-send__card img, .mus-send__card .mus-row__ph { width: 72px; height: 72px; border-radius: 10px; object-fit: cover; flex-shrink: 0; }
.mus-send__card b { display: block; font: 700 18px/1.2 var(--display); color: var(--mg-hi); }
.mus-send__card span { display: block; margin-top: 4px; color: var(--mg-copy); font-size: 14px; }
.mus-send__lead { margin: 0 0 14px; line-height: 1.45; }

/* ---------- фирменная полоса прокрутки ---------- */
@supports not selector(::-webkit-scrollbar) {
  html { scrollbar-width: thin; scrollbar-color: #c7671d transparent; }
}
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track, ::-webkit-scrollbar-corner { background: transparent; }
::-webkit-scrollbar-thumb { border: 3px solid transparent; border-radius: 10px; background: linear-gradient(180deg, #F28A2D, #b9561a) padding-box; }
::-webkit-scrollbar-thumb:hover { border-width: 2px; background: linear-gradient(180deg, #ffb062, #F28A2D) padding-box; }
::-webkit-scrollbar-button { display: none; width: 0; height: 0; }

/* ---------- карточки ссылок ---------- */
.lp-list { display: grid; gap: 8px; margin: 8px 0 4px; }
.lp { position: relative; min-width: 0; }
.lp.is-wait { height: 74px; border-radius: 12px; background: linear-gradient(90deg, rgba(255,255,255,.04), rgba(242,138,45,.09), rgba(255,255,255,.04)); background-size: 200% 100%; animation: lp-wait 1.3s linear infinite; }
@keyframes lp-wait { to { background-position: -200% 0; } }
.lp__a { display: flex; gap: 12px; align-items: stretch; min-width: 0; padding: 0; overflow: hidden; border: 1px solid rgba(242,138,45,.22); border-left: 3px solid var(--mg-amber); border-radius: 12px; background: rgba(12,10,8,.55); color: var(--mg-copy); text-decoration: none !important; transition: border-color .15s, background .15s; }
.lp__a:hover { border-color: rgba(242,138,45,.5); background: rgba(242,138,45,.08); }
.lp__img { flex: 0 0 112px; min-height: 74px; background: #1b1612; }
.lp__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.lp__body { flex: 1; min-width: 0; display: grid; align-content: center; gap: 3px; padding: 10px 34px 10px 0; }
.lp__a:not(:has(.lp__img)) .lp__body { padding-left: 12px; }
.lp__site { font: 600 11px/1.2 var(--mono, monospace); letter-spacing: .04em; text-transform: uppercase; color: var(--mg-amber-lite, #ffb062); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lp__body b { font-size: 14px; line-height: 1.3; color: var(--mg-hi); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.lp__desc { font-size: 13px; line-height: 1.35; color: var(--mg-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.lp__x { position: absolute; top: 6px; right: 6px; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: rgba(0,0,0,.55); color: #fff; font-size: 16px; line-height: 1; opacity: .75; transition: opacity .15s, background .15s; }
.lp__x:hover { opacity: 1; background: var(--mg-amber); color: #1a0d03; }
.post-body > .lp-list { margin: 4px 0 18px; }
.post-body .lp__img { flex-basis: 160px; }
.post-body .lp__body b { font-size: 16px; }
.soc-msg__bubble .lp-list { min-width: min(320px, 62vw); }
.soc-msg.is-mine .lp__a { background: rgba(0,0,0,.22); border-color: rgba(255,220,180,.25); border-left-color: #ffd29a; }
html[data-theme="light"] .lp__a { background: #fffaf3; border-color: rgba(194,98,27,.25); border-left-color: #e0761f; color: #4a3a2c; }
html[data-theme="light"] .lp__a:hover { background: #fff1e0; }
html[data-theme="light"] .lp__body b { color: #2b1d12; }
html[data-theme="light"] .lp__desc { color: #7a6655; }
html[data-theme="light"] .lp__site { color: #b55a12; }
html[data-theme="light"] .lp.is-wait { background: linear-gradient(90deg, #f6ede2, #fbe0c2, #f6ede2); background-size: 200% 100%; }
html[data-theme="light"] .soc-msg.is-mine .lp__a { background: rgba(255,255,255,.55); }
@media (max-width: 560px) {
  .lp__img { flex-basis: 84px; }
  .post-body .lp__img { flex-basis: 96px; }
}

/* ---------- чаты: вложения, закрепы, выделение ---------- */
.chx-fwd { display: flex; align-items: center; gap: 5px; margin: 0 0 6px; padding-left: 8px; border-left: 2px solid var(--mg-amber); font-size: 12px; color: var(--mg-amber-lite, #ffb062); }
.chx-fwd b { font-weight: 600; }
.soc-msg.is-mine .chx-fwd { color: #ffd9a0; border-left-color: #ffd9a0; }
.chx-imgs { display: grid; gap: 3px; margin: 0 0 6px; border-radius: 12px; overflow: hidden; max-width: 380px; }
.chx-imgs--2 { grid-template-columns: 1fr 1fr; }
.chx-imgs--3, .chx-imgs--4 { grid-template-columns: 1fr 1fr; }
.chx-imgs--3 .chx-img:first-child { grid-column: 1 / -1; }
.chx-img { display: block; padding: 0; border: 0; background: #0d0b09; cursor: zoom-in; }
.chx-img img { display: block; width: 100%; height: 100%; max-height: 340px; object-fit: cover; }
.chx-imgs--2 .chx-img img, .chx-imgs--3 .chx-img img, .chx-imgs--4 .chx-img img { aspect-ratio: 1; }
.chx-imgs--3 .chx-img:first-child img { aspect-ratio: 16 / 9; }
.chx-video { display: block; width: 100%; max-width: 380px; max-height: 320px; margin: 0 0 6px; border-radius: 12px; background: #000; }
.chx-audio, .chx-track { display: flex; flex-direction: column; gap: 6px; margin: 0 0 6px; padding: 8px 10px; border-radius: 12px; background: rgba(0,0,0,.25); min-width: min(280px, 60vw); }
.chx-audio audio, .chx-track audio { width: 100%; height: 36px; }
.chx-track { flex-direction: row; align-items: center; gap: 10px; }
.chx-track img { width: 54px; height: 54px; border-radius: 8px; object-fit: cover; flex-shrink: 0; }
.chx-track__body { flex: 1; min-width: 0; display: grid; gap: 2px; }
.chx-track__body b { font-size: 14px; color: var(--mg-hi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chx-track__body > span { font-size: 12px; color: var(--mg-muted); }
.chx-file { display: flex; align-items: center; gap: 10px; margin: 0 0 6px; padding: 8px 12px 8px 8px; border-radius: 12px; background: rgba(0,0,0,.25); color: inherit; text-decoration: none !important; min-width: min(240px, 58vw); }
.chx-file > svg { flex-shrink: 0; width: 38px; height: 38px; padding: 8px; border-radius: 10px; background: var(--grad-cta, linear-gradient(135deg, #F28A2D, #c2621b)); color: #1a0d03; }
.chx-file > span { display: grid; min-width: 0; }
.chx-file__name { font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chx-file em { font-style: normal; font-size: 12px; color: var(--mg-muted); }
.soc-msg.is-mine .chx-file em, .soc-msg.is-mine .chx-track__body > span { color: rgba(255,243,224,.7); }
.chx-mark { display: inline-grid; place-items: center; font-style: normal; color: #ffd29a; }
.chx-mark svg { width: 12px; height: 12px; }
.chx-mark--imp { color: #ffc23d; }
.soc-msg.is-imp .soc-msg__bubble { box-shadow: inset 3px 0 0 #ffc23d; }
.soc-msg.is-flash .soc-msg__bubble { animation: chx-flash 1.6s ease; }
@keyframes chx-flash { 0%, 60% { box-shadow: 0 0 0 3px rgba(242,138,45,.75); } 100% { box-shadow: 0 0 0 0 rgba(242,138,45,0); } }

.chx-more { position: relative; flex-shrink: 0; opacity: 0; transition: opacity .15s; }
.soc-msg:hover .chx-more, .soc-msg:focus-within .chx-more, .soc-msg.is-open .chx-more { opacity: 1; }
.chx-more__btn { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; color: var(--mg-muted); }
.chx-more__btn:hover, .chx-more__btn[aria-expanded="true"] { color: var(--mg-hi); background: rgba(242,138,45,.14); }
.chx-more .soc-menu { min-width: 210px; }
.soc-msg.is-mine .chx-more .soc-menu { right: auto; left: 0; }
.soc-msg:not(.is-mine) .chx-more .soc-menu { right: auto; left: 0; }
.soc-msg.is-mine .chx-more .soc-menu { left: auto; right: 0; }
.soc-menu > button.is-danger, .chx-danger { color: #ff7a6b !important; }
.btn.chx-danger { border-color: rgba(255,122,107,.45); }
.btn.chx-danger:hover { background: rgba(255,122,107,.14); }

.soc-msg.is-selecting { cursor: pointer; padding-left: 30px; position: relative; }
.soc-msg.is-selecting::before { content: ""; position: absolute; left: 4px; top: 50%; width: 18px; height: 18px; margin-top: -9px; border: 2px solid rgba(242,138,45,.6); border-radius: 50%; }
.soc-msg.is-selecting.is-mine { padding-left: 0; padding-right: 0; }
.soc-msg.is-selecting.is-mine::before { left: auto; right: calc(100% + 8px); }
.soc-msg.is-sel::before { background: var(--mg-amber) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a0d03' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center / 12px no-repeat; border-color: var(--mg-amber); }
.soc-msg.is-sel .soc-msg__bubble { outline: 2px solid rgba(242,138,45,.55); outline-offset: 1px; }
.soc-msg.is-selecting .chx-more { display: none; }
.soc-msg.is-selecting, .soc-msg.is-selecting * { -webkit-user-select: none; user-select: none; }
.soc-chat.is-selecting > .soc-chat__head { display: none; }
.chx-selbar { flex: none; display: flex; align-items: center; gap: 4px; min-height: 56px; padding: 8px 10px; border-bottom: 1px solid rgba(212,161,75,.14); background: #1a140e; -webkit-user-select: none; user-select: none; animation: chr-in .14s ease-out; }
.chx-selbar b { flex: 1; min-width: 0; padding-left: 4px; color: var(--mg-hi); font-size: 17px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chx-selbar__btn { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 12px; border: 0; border-radius: 12px; background: none; color: var(--mg-ivory, #f6e6c5); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.chx-selbar__btn:hover { background: rgba(242,138,45,.14); }
.chx-selbar__btn.chx-danger { color: #ff7a6b; }
.chx-selbar__x { padding: 0 9px; }
.chx-selbar__x span { display: none; }
html.chat-full .chx-selbar { padding-top: max(8px, env(safe-area-inset-top, 0px)); }
html[data-theme="light"] .chx-selbar { background: #fff3e4; }
html[data-theme="light"] .chx-selbar__btn { color: #2b1606; }
html[data-theme="light"] .chx-selbar__btn.chx-danger { color: #c8371f; }
@media (max-width: 640px) {
  .chx-selbar__btn { width: 42px; padding: 0; justify-content: center; }
  .chx-selbar__btn span { display: none; }
}
/* на телефоне долгое нажатие по сообщению включает выделение сообщений, а не выделение текста */
@media (hover: none) and (pointer: coarse) {
  [data-schat] .soc-msg { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
  .chx-more { opacity: .6; }
}

.chx-pins { display: flex; align-items: center; gap: 6px; padding: 6px 10px 6px 14px; border-bottom: 1px solid rgba(212,161,75,.14); background: linear-gradient(90deg, rgba(242,138,45,.12), rgba(242,138,45,.02)); }
.chx-pins__main { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; padding: 4px 0; text-align: left; color: var(--mg-copy); }
.chx-pins__main > svg { flex-shrink: 0; color: var(--mg-amber); }
.chx-pins__main > span { min-width: 0; display: grid; font-size: 13px; line-height: 1.3; }
.chx-pins__main > span b { font-size: 12px; color: var(--mg-amber-lite, #ffb062); }
.chx-pins__main > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chx-pinlist { display: grid; gap: 6px; max-height: 56vh; overflow-y: auto; margin: 0 0 12px; }
.chx-pinlist__it { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--mg-border); border-radius: 12px; }
.chx-pinlist__it > button:first-child { flex: 1; min-width: 0; display: grid; gap: 2px; text-align: left; color: var(--mg-copy); font-size: 14px; overflow: hidden; }
.chx-pinlist__it > button:first-child b { font-size: 12px; color: var(--mg-amber-lite, #ffb062); }

.chx-compose { border-top: 1px solid rgba(212,161,75,.14); }
.chx-compose .soc-chat__form { border-top: 0; }
.chx-tray { display: flex; gap: 8px; overflow-x: auto; padding: 0 12px; }
.chx-tray:not(:empty) { padding-top: 10px; }
.chx-tray__it { position: relative; flex: 0 0 auto; display: flex; align-items: center; gap: 8px; max-width: 220px; padding: 6px 30px 6px 6px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(0,0,0,.25); }
.chx-tray__open { padding: 0; border: 0; background: none; cursor: pointer; flex-shrink: 0; line-height: 0; border-radius: 8px; }
.chx-tray__open:focus-visible { outline: 2px solid var(--mg-amber); outline-offset: 2px; }
.chx-tray__it img, .chx-tray__it > svg, .chx-tray__open img { width: 44px; height: 44px; border-radius: 8px; object-fit: cover; flex-shrink: 0; }
.chx-lb-tray .chx-lb-tray__del { position: absolute; left: 50%; bottom: calc(20px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); z-index: 4; }
.chx-tray__it > svg { padding: 10px; background: rgba(242,138,45,.15); color: var(--mg-amber); }
.chx-tray__name { font-size: 13px; color: var(--mg-copy); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
button.chx-tray__name.chx-tray__open { border: 0; background: transparent; padding: 0; text-align: left; cursor: pointer; font: inherit; max-width: 100%; }
button.chx-tray__name.chx-tray__open:hover { text-decoration: underline; }
.chx-tray__it > button { position: absolute; top: 4px; right: 4px; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: rgba(0,0,0,.5); color: #fff; font-size: 15px; line-height: 1; }
.chx-tray__it.is-busy img { opacity: .5; }
.chx-tray__spin { position: absolute; left: 18px; top: 50%; width: 20px; height: 20px; margin-top: -10px; border: 2px solid rgba(242,138,45,.3); border-top-color: var(--mg-amber); border-radius: 50%; animation: chx-spin .8s linear infinite; }
@keyframes chx-spin { to { transform: rotate(360deg); } }
.chx-lp:not(:empty) { padding: 8px 12px 0; }
.chx-lp .lp-list { margin: 0; max-height: 210px; overflow-y: auto; }
.chx-attach { position: relative; flex-shrink: 0; align-self: flex-end; }
.chx-attach__btn { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; color: var(--mg-muted); }
.chx-attach__btn:hover, .chx-attach__btn[aria-expanded="true"] { color: var(--mg-amber); background: rgba(242,138,45,.12); }
.chx-attach .soc-menu { top: auto; bottom: calc(100% + 8px); left: 0; right: auto; }
.soc-chat.is-drop { position: relative; }
.soc-chat.is-drop::after { content: "Отпустите, чтобы прикрепить"; position: absolute; inset: 10px; display: grid; place-items: center; border: 2px dashed var(--mg-amber); border-radius: 16px; background: rgba(12,10,8,.82); color: var(--mg-hi); font: 600 18px/1.2 var(--display); z-index: 20; pointer-events: none; }
.chx-fwd-q { width: 100%; margin: 0 0 10px; padding: 10px 14px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(7,7,6,.6); color: var(--mg-hi); }
.chx-fwdlist { display: grid; gap: 4px; max-height: 50vh; overflow-y: auto; margin: 0 0 12px; }
.chx-fwdlist__it { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 12px; text-align: left; color: var(--mg-hi); }
.chx-fwdlist__it:hover { background: rgba(242,138,45,.1); }
.chx-fwdlist__it[hidden] { display: none; }
html[data-theme="light"] .chx-audio, html[data-theme="light"] .chx-track, html[data-theme="light"] .chx-file, html[data-theme="light"] .chx-tray__it { background: rgba(194,98,27,.07); }
html[data-theme="light"] .chx-pins { background: linear-gradient(90deg, #fde7cf, #fff7ee); }
html[data-theme="light"] .chx-fwd-q { background: #fff; color: #2b1d12; }
html[data-theme="light"] .chx-fwdlist__it, html[data-theme="light"] .chx-track__body b { color: #2b1d12; }
html[data-theme="light"] .soc-chat.is-drop::after { background: rgba(255,250,243,.9); color: #2b1d12; }
@media (max-width: 760px) {
  .chx-more { opacity: 1; }
  .chx-more__btn:not([aria-expanded="true"]) { opacity: .7; }
  .soc-msg__bubble .lp-list { min-width: 0; }
  .chx-imgs, .chx-video { max-width: 100%; }
}
.tab__n { margin-left: 4px; font-size: .85em; opacity: .6; font-variant-numeric: tabular-nums; }
.tab__n:empty { display: none; }

.soc-chans { display: grid; gap: 6px; }
.soc-chans__it { display: flex; align-items: center; gap: 10px; padding: 8px; border-radius: 12px; color: inherit; text-decoration: none; transition: background .15s; }
.soc-chans__it:hover { background: rgba(242,138,45,.1); }
.soc-chans__av { flex: 0 0 42px; width: 42px; height: 42px; display: grid; place-items: center; overflow: hidden; border-radius: 50%; background: var(--grad-cta); color: #1a0d03; font: 700 18px/1 var(--display); }
.soc-chans__av img { width: 100%; height: 100%; object-fit: cover; }
.soc-chans__av i { font-style: normal; }
.soc-chans__it > span:last-child { min-width: 0; display: grid; gap: 2px; }
.soc-chans__it b { color: var(--mg-hi); font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.soc-chans__it em { font-style: normal; font-size: 12px; color: var(--mg-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
html[data-theme="light"] .soc-chans__it b { color: #2b1d12; }

/* админка: ссылки, блокировка, копирование, отчёт PDF */
.dev-user__name { color: inherit; text-decoration: none; border-bottom: 1px dashed color-mix(in srgb, var(--accent, #c8102e) 55%, transparent); }
.dev-user__name:hover { color: var(--accent, #c8102e); border-bottom-style: solid; }
.dev-user__who small a { color: var(--accent, #c8102e); text-decoration: none; }
.dev-user__who small a:hover { text-decoration: underline; }
.dev-user__boost { color: #d9a441; }
.dev-user__ban, .ipx-ban-now { color: #ff6b6b; font-weight: 600; }
.dev-user.is-banned { border-color: rgba(255, 107, 107, .45); background: linear-gradient(90deg, rgba(255, 107, 107, .07), transparent 60%); }
.dev-ban { display: inline-flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.dev-ban input { min-width: 0; width: 190px; padding: 6px 10px; border-radius: 10px; border: 1px solid var(--line, rgba(255,255,255,.14)); background: var(--bg-2, rgba(255,255,255,.04)); color: inherit; font: inherit; font-size: 13px; }
.dev-ban__go { border-color: rgba(255, 107, 107, .5) !important; color: #ff8080 !important; }
.dev-ban__go:hover { background: rgba(255, 107, 107, .12) !important; }
.dev-unban { border-color: rgba(76, 201, 140, .5) !important; color: #4cc98c !important; }
.cp-btn { display: inline-grid; place-items: center; width: 24px; height: 24px; margin-left: 6px; padding: 0; vertical-align: middle; border-radius: 7px; border: 1px solid var(--line, rgba(255,255,255,.14)); background: transparent; color: var(--muted, #9aa0a6); cursor: pointer; transition: color .15s, border-color .15s, background .15s; }
.cp-btn:hover { color: var(--accent, #c8102e); border-color: var(--accent, #c8102e); background: color-mix(in srgb, var(--accent, #c8102e) 10%, transparent); }
.cp-btn:active { transform: scale(.92); }
.ipx-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.ipx-head .page-title a { color: inherit; text-decoration: none; }
.ipx-head .page-title a:hover { color: var(--accent, #c8102e); }
.ipx-pdf { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.ipx-banned { color: #ff6b6b; }
.ipx-ban-acts { margin-top: 10px; }
.ipx-ip header .cp-btn, .ipx-switch .cp-btn { margin-right: 8px; }
@media (max-width: 640px) {
  .ipx-pdf { width: 100%; justify-content: center; }
  .dev-ban { width: 100%; }
  .dev-ban input { flex: 1 1 140px; }
}

/* пульт диджея */
.dj-cab--wide { grid-template-columns: minmax(0, 1fr); }
.dj-cab--wide > .dj-side { display: none; }
.wheel-btn { position: fixed; right: 16px; bottom: calc(92px + env(safe-area-inset-bottom, 0px)); z-index: 28; border: 0; border-radius: 999px; padding: 8px 12px; background: #e07a2f; color: #1a120c; font-weight: 700; box-shadow: 0 8px 24px rgba(0,0,0,.28); }
body:has(.soc-ov) .wheel-btn,
body:has(.plat-modal) .wheel-btn,
body:has(.wheel-dlg) .wheel-btn,
body:has(.pub-dlg) .wheel-btn,
body:has(.kfn-ov) .wheel-btn,
body:has(.gc-full) .wheel-btn,
body:has(.st-view) .wheel-btn,
body:has(.st-sheet) .wheel-btn { display: none; }
@media (max-width: 800px) {
  .wheel-btn { right: 10px; bottom: calc(76px + env(safe-area-inset-bottom, 0px)); padding: 6px 10px; font-size: 12px; }
  .channel-tabs-row { display: grid; }
  .channel-tabs-set { justify-self: end; }
}
.app-music .wheel-btn, .app-messenger .wheel-btn, .app-dj .wheel-btn, html.chat-full .wheel-btn { display: inline-flex; }
.app-games .wheel-btn { display: none; }
.wheel-dlg { position: fixed; inset: 0; z-index: 400; display: grid; place-items: center; background: rgba(8,6,4,.55); }
.wheel-dlg__card { width: min(360px, calc(100% - 32px)); padding: 22px; border-radius: 18px; background: #1c1612; color: #f6efe4; text-align: center; }
.wheel-dlg__card b { display: block; font-size: 22px; margin-bottom: 8px; }
.wheel-dlg__card p { margin: 0 0 14px; }
.dk { display: grid; gap: 16px; min-width: 0; }
.dk:fullscreen { background: #111318; padding: 12px 16px; overflow: auto; width: 100%; height: 100%; box-sizing: border-box; }
.dk-lead { margin: 0; color: var(--muted, #a3a3ad); font-size: 14px; line-height: 1.5; }
.dk-lead kbd, .dk-note kbd { display: inline-block; min-width: 18px; padding: 1px 5px; border-radius: 5px; border: 1px solid var(--mg-border, rgba(255,255,255,.16)); background: rgba(255,255,255,.05); font: 600 11px/1.4 var(--mono, monospace); text-align: center; }
.dk-note { margin: 0; color: var(--muted, #a3a3ad); font-size: 12.5px; line-height: 1.5; }
.dk-top { display: grid; grid-template-columns: minmax(0, 1fr) 300px minmax(0, 1fr); gap: 12px; align-items: stretch; }
.dk-deck, .dk-mixer, .dk-browse, .dk-queue, .dk-pads, .dk-screen { position: relative; min-width: 0; padding: 14px; border: 1px solid var(--mg-border, rgba(255,255,255,.12)); border-radius: 18px; background: radial-gradient(120% 90% at 0% 0%, rgba(200,16,46,.10), transparent 55%), linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01)); }
.dk-deck { display: grid; gap: 10px; align-content: start; }
.dk-deck--b { background: radial-gradient(120% 90% at 100% 0%, rgba(90,184,255,.10), transparent 55%), linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01)); }
.dk-deck.is-playing { border-color: rgba(255,106,61,.55); box-shadow: 0 0 0 1px rgba(255,106,61,.18), 0 10px 40px -18px rgba(255,106,61,.55); }
.dk-deck--b.is-playing { border-color: rgba(90,184,255,.55); box-shadow: 0 0 0 1px rgba(90,184,255,.18), 0 10px 40px -18px rgba(90,184,255,.55); }
.dk-deck__head { display: flex; align-items: center; gap: 10px; min-width: 0; }
.dk-deck__id { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(135deg, #c8102e, #ff6a3d); color: #fff; font: 800 16px/1 var(--display, system-ui); }
.dk-deck--b .dk-deck__id { background: linear-gradient(135deg, #2563eb, #5ab8ff); }
.dk-deck__title { display: grid; min-width: 0; flex: 1; }
.dk-deck__title b { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 14px; }
.dk-deck__title span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--muted, #a3a3ad); font-size: 12px; }
.dk-deck__bpm { display: grid; justify-items: end; flex: none; font-variant-numeric: tabular-nums; }
.dk-deck__bpm b { font: 800 20px/1 var(--display, system-ui); color: var(--mg-gold, #f2c46d); }
.dk-deck__bpm small { color: var(--muted, #a3a3ad); font-size: 10px; letter-spacing: .08em; }
.dk-wave { width: 100%; height: 84px; border-radius: 12px; background: rgba(0,0,0,.35); cursor: pointer; display: block; }
.dk-deck__time { font: 600 12px/1 var(--mono, monospace); color: var(--muted, #a3a3ad); font-variant-numeric: tabular-nums; }
.dk-deck__row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.dk-btn { min-width: 52px; height: 40px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--mg-border, rgba(255,255,255,.16)); background: rgba(255,255,255,.04); color: inherit; font: 700 12px/1 var(--body, system-ui); letter-spacing: .04em; cursor: pointer; transition: background .15s, border-color .15s, transform .1s; }
.dk-btn:hover { border-color: rgba(255,255,255,.32); }
.dk-btn:active { transform: scale(.96); }
.dk-btn.is-on { background: rgba(76,201,140,.16); border-color: rgba(76,201,140,.6); color: #7be3b0; }
.dk-btn--play { display: grid; place-items: center; width: 58px; height: 52px; border-radius: 16px; background: linear-gradient(135deg, #c8102e, #ff6a3d); border: 0; color: #fff; }
.dk-btn--play svg { width: 24px; height: 24px; }
.dk-btn--play.is-on { background: linear-gradient(135deg, #1f9d63, #4cc98c); color: #fff; }
.dk-btn--cue { color: #ffcf5a; border-color: rgba(255,207,90,.45); }
.dk-hot { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.dk-hot__b { height: 34px; border-radius: 10px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); background: rgba(255,255,255,.03); color: var(--muted, #a3a3ad); font: 700 13px/1 var(--body, system-ui); cursor: pointer; }
.dk-hot__b.is-set { color: #fff; }
.dk-hot__b--0.is-set { background: rgba(255,90,122,.25); border-color: #ff5a7a; }
.dk-hot__b--1.is-set { background: rgba(90,184,255,.25); border-color: #5ab8ff; }
.dk-hot__b--2.is-set { background: rgba(140,255,90,.2); border-color: #8cff5a; }
.dk-hot__b--3.is-set { background: rgba(214,90,255,.22); border-color: #d65aff; }
.dk-loop { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.dk-loop > span { color: var(--muted, #a3a3ad); font-size: 12px; margin-right: 2px; }
.dk-chip { display: inline-flex; align-items: center; gap: 4px; min-height: 28px; padding: 0 10px; border-radius: 9px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); background: rgba(255,255,255,.03); color: inherit; font: 600 12px/1 var(--body, system-ui); cursor: pointer; text-decoration: none; white-space: nowrap; transition: background .15s, border-color .15s; }
.dk-chip:hover { border-color: rgba(255,255,255,.32); }
.dk-chip.is-on { background: rgba(255,106,61,.16); border-color: rgba(255,106,61,.65); color: #ffb08f; }
.dk-chip--dark.is-on { background: #000; border-color: #fff; color: #fff; }
.dk-tempo { display: grid; gap: 4px; font-size: 12px; color: var(--muted, #a3a3ad); }
.dk-tempo b { color: inherit; font-variant-numeric: tabular-nums; margin-left: 4px; }
.dk input[type=range] { accent-color: #ff6a3d; width: 100%; }
.dk-deck--b input[type=range] { accent-color: #5ab8ff; }
.dk-mixer { display: grid; gap: 12px; align-content: start; }
.dk-strips { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.dk-strip { display: grid; gap: 6px; align-content: start; padding: 10px; border-radius: 14px; background: rgba(0,0,0,.22); }
.dk-strip__id { font: 800 13px/1 var(--display, system-ui); color: var(--mg-gold, #f2c46d); }
.dk-knob { display: grid; gap: 2px; font-size: 11px; color: var(--muted, #a3a3ad); }
.dk-fader { position: relative; display: grid; grid-template-columns: 8px 1fr; gap: 8px; align-items: center; margin-top: 4px; }
.dk-meter { position: relative; height: 60px; border-radius: 4px; background: rgba(255,255,255,.08); overflow: hidden; }
.dk-meter::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: var(--lvl, 0%); background: linear-gradient(0deg, #4cc98c, #ffcf5a 70%, #ff5a5a); transition: height .06s linear; }
.dk-xf { display: grid; grid-template-columns: auto 1fr auto; gap: 8px; align-items: center; font: 800 13px/1 var(--display, system-ui); }
.dk-xf input { accent-color: var(--mg-gold, #f2c46d) !important; }
.dk-master { display: grid; gap: 4px; font-size: 12px; color: var(--muted, #a3a3ad); }
.dk-bottom { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 12px; align-items: start; }
.dk-col { display: grid; gap: 12px; min-width: 0; }
.dk-sec__head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.dk-sec__head h3 { margin: 0 auto 0 0; font: 700 15px/1.2 var(--display, system-ui); }
.dk-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.dk-mini { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted, #a3a3ad); }
.dk-mini input { width: 90px; }
.dk-mini select { padding: 4px 6px; border-radius: 8px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); background: rgba(255,255,255,.04); color: inherit; font: inherit; }
.dk-browse__body { display: grid; gap: 6px; max-height: 520px; overflow: auto; padding-right: 4px; }
.dk-tr { display: flex; align-items: center; gap: 6px; padding: 8px 10px; border-radius: 12px; background: rgba(255,255,255,.03); cursor: grab; }
.dk-tr:hover { background: rgba(255,255,255,.06); }
.dk-tr__main { display: grid; min-width: 0; flex: 1; }
.dk-tr__main b { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 13.5px; }
.dk-tr__main span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--muted, #a3a3ad); font-size: 12px; }
.dk-tr__price { flex: none; font-style: normal; font-size: 11.5px; color: var(--mg-gold, #f2c46d); }
.dk-pl { border-radius: 12px; background: rgba(255,255,255,.02); }
.dk-pl summary { display: flex; align-items: center; gap: 8px; padding: 8px 10px; cursor: pointer; list-style: none; }
.dk-pl summary::-webkit-details-marker { display: none; }
.dk-pl summary b { flex: 1; }
.dk-pl summary span { color: var(--muted, #a3a3ad); font-size: 12px; }
.dk-pl .dk-tr { margin: 0 6px 6px; }
.dk-search input { width: 100%; padding: 9px 12px; border-radius: 12px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); background: rgba(255,255,255,.04); color: inherit; font: inherit; }
.dk-drop { display: grid; gap: 4px; padding: 18px; border: 1.5px dashed var(--mg-border, rgba(255,255,255,.22)); border-radius: 14px; text-align: center; cursor: pointer; }
.dk-drop:hover { border-color: #ff6a3d; }
.dk-drop span { color: var(--muted, #a3a3ad); font-size: 12px; }
.dk-q { display: grid; gap: 4px; margin: 0; padding: 0 0 0 20px; }
.dk-q li { display: flex; align-items: center; gap: 6px; font-size: 13px; }
.dk-q li span { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.dk-x { display: inline-grid; place-items: center; width: 26px; height: 26px; padding: 0; border-radius: 8px; border: 1px solid transparent; background: transparent; color: var(--muted, #a3a3ad); cursor: pointer; font-size: 13px; }
.dk-x:hover { border-color: var(--mg-border, rgba(255,255,255,.2)); color: inherit; }
.dk-pads__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.dk-pad-wrap { display: grid; gap: 4px; }
.dk-pad { position: relative; display: grid; align-content: space-between; height: 72px; padding: 8px; border-radius: 14px; border: 1px solid rgba(255,106,61,.3); background: linear-gradient(160deg, rgba(200,16,46,.28), rgba(255,106,61,.10)); color: #fff; text-align: left; cursor: pointer; touch-action: manipulation; user-select: none; transition: transform .06s, box-shadow .2s; }
.dk-pad b { font: 800 12px/1 var(--display, system-ui); opacity: .7; }
.dk-pad span { font: 700 13px/1.15 var(--body, system-ui); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dk-pad.is-own { border-color: rgba(90,184,255,.45); background: linear-gradient(160deg, rgba(37,99,235,.32), rgba(90,184,255,.12)); }
.dk-pad:active, .dk-pad.is-hit { animation: dk-hit .22s ease-out; }
@keyframes dk-hit { 0% { transform: scale(.94); box-shadow: 0 0 0 0 rgba(255,106,61,.7); } 100% { transform: scale(1); box-shadow: 0 0 0 14px rgba(255,106,61,0); } }
.dk-pad__own { justify-self: center; font-size: 11px; color: var(--muted, #a3a3ad); cursor: pointer; }
.dk-pad__own:hover { color: inherit; }
.dk-pad__own button { padding: 0; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; }
.dk-spec { width: 100%; height: 90px; display: block; border-radius: 12px; background: rgba(0,0,0,.35); margin-bottom: 10px; }
.dk-scenes { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
/* мероприятия */
.dk-ev { display: grid; gap: 14px; }
.dk-evnew { margin: 0; }
.dk-evlist { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }
.dk-evcard { display: grid; gap: 4px; padding: 14px; border-radius: 16px; border: 1px solid var(--mg-border, rgba(255,255,255,.12)); background: linear-gradient(135deg, rgba(200,16,46,.10), transparent 70%); color: inherit; text-align: left; cursor: pointer; font: inherit; }
.dk-evcard:hover { border-color: rgba(255,106,61,.5); }
.dk-evcard span { color: var(--muted, #a3a3ad); font-size: 13px; }
.dk-evcard small { color: var(--muted, #a3a3ad); font-size: 12px; }
.dk-evcard em { font-style: normal; color: #ffb08f; font-weight: 700; }
.dk-evhead { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.dk-evtitle { margin: 6px 0 2px; }
.dk-evhead p { margin: 0; }
.dk-evgrid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.dk-blocks { display: grid; gap: 8px; }
.dk-block { display: grid; grid-template-columns: 92px minmax(0, 1fr) 70px minmax(0, 150px); gap: 6px; padding: 10px; border-radius: 14px; background: rgba(255,255,255,.03); border: 1px solid transparent; }
.dk-block.is-done { opacity: .6; border-color: rgba(76,201,140,.35); }
.dk-block input, .dk-block select { min-width: 0; padding: 7px 9px; border-radius: 10px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); background: rgba(255,255,255,.04); color: inherit; font: inherit; font-size: 13px; }
.dk-block__note { grid-column: 1 / -1; }
.dk-block__acts { grid-column: 1 / -1; display: flex; gap: 6px; justify-content: flex-end; flex-wrap: wrap; }
.dk-blocks__acts { display: flex; gap: 8px; justify-content: space-between; margin-top: 10px; flex-wrap: wrap; }
.dk-guest { display: grid; gap: 10px; }
.dk-switch { display: flex; align-items: center; gap: 8px; font-size: 14px; cursor: pointer; }
.dk-qr { justify-self: center; width: 200px; height: 200px; padding: 10px; border-radius: 16px; background: #fff; }
.dk-qr svg { width: 100%; height: 100%; display: block; }
.dk-qr__link { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; justify-content: center; }
.dk-qr__link code { flex-basis: 100%; text-align: center; font-size: 12px; color: var(--muted, #a3a3ad); word-break: break-all; }
.dk-screenmsg { display: grid; grid-template-columns: 1fr auto; gap: 6px; font-size: 12px; color: var(--muted, #a3a3ad); }
.dk-screenmsg span { grid-column: 1 / -1; }
.dk-screenmsg input { min-width: 0; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); background: rgba(255,255,255,.04); color: inherit; font: inherit; font-size: 13px; }
.dk-mt { margin-top: 6px; }
.dk-msgs { display: grid; gap: 8px; max-height: 520px; overflow: auto; }
.dk-msg { padding: 10px 12px; border-radius: 14px; background: rgba(255,255,255,.035); border: 1px solid transparent; }
.dk-msg--new { border-color: rgba(255,106,61,.5); }
.dk-msg--shown { border-color: rgba(76,201,140,.5); }
.dk-msg--hidden, .dk-msg--played { opacity: .6; }
.dk-msg__head { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; font-size: 12.5px; }
.dk-msg__head span { color: var(--muted, #a3a3ad); }
.dk-msg__head em { margin-left: auto; font-style: normal; font-size: 11px; color: var(--muted, #a3a3ad); }
.dk-msg p { margin: 6px 0 8px; font-size: 14px; line-height: 1.45; white-space: pre-wrap; word-break: break-word; }
.dk-msg__acts { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.dk-msg__acts .dk-x { margin-left: auto; }
@media (max-width: 1180px) {
  .dk-top { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .dk-mixer { grid-column: 1 / -1; order: 3; }
  .dk-strips { grid-template-columns: 1fr 1fr; }
  .dk-bottom, .dk-evgrid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
  .dk-top { grid-template-columns: minmax(0, 1fr); }
  .dk-mixer { order: 0; }
  .dk-pads__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
  .dk-pad { height: 62px; }
  .dk-block { grid-template-columns: 86px minmax(0, 1fr); }
  .dk-block select, .dk-block input[type=number] { grid-column: span 1; }
}
html[data-theme="light"] .dk-wave, html[data-theme="light"] .dk-spec { background: #1d1b22; }
html[data-theme="light"] .dk-strip { background: rgba(0,0,0,.05); }
html[data-theme="light"] .dk-pad { color: #fff; }

/* баннеры SFEROOM */
.ad-slot .sfr { margin: 0; }
a.sfr, .post-body a.sfr { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; min-height: 168px; padding: 22px 24px 20px; border-radius: 22px; overflow: hidden; text-decoration: none !important; color: #fff; isolation: isolate; transition: transform .25s ease, box-shadow .25s ease; }
.sfr:hover { transform: translateY(-2px); box-shadow: 0 18px 50px -22px rgba(0,0,0,.65); }
.sfr:focus-visible { outline: 3px solid #ffd27a; outline-offset: 3px; }
.sfr__label { position: absolute; top: 10px; right: 14px; z-index: 2; font: 600 10.5px/1 system-ui, sans-serif; letter-spacing: .06em; text-transform: uppercase; opacity: .7; }
.sfr__body { position: relative; z-index: 1; display: grid; gap: 8px; justify-items: start; min-width: 0; }
.sfr__title { font: 800 clamp(19px, 2.2vw, 25px)/1.12 var(--display, system-ui); letter-spacing: -.01em; max-width: 22ch; }
.sfr .sfr__text, .post-body .sfr .sfr__text { margin: 0; font-size: 14px; line-height: 1.45; opacity: .88; max-width: 46ch; }
.sfr__cta { display: inline-flex; align-items: center; gap: 8px; margin-top: 4px; padding: 10px 16px; border-radius: 12px; font: 700 14px/1 var(--body, system-ui); transition: gap .2s; }
.sfr:hover .sfr__cta { gap: 12px; }
.sfr__kicker { font: 800 12px/1 var(--body, system-ui); letter-spacing: .14em; text-transform: uppercase; }

/* 1: карьера — тёмный, деньги и наушники */
.sfr--career { background: radial-gradient(90% 120% at 100% 0%, rgba(255,61,110,.55), transparent 60%), radial-gradient(70% 100% at 0% 100%, rgba(120,40,255,.5), transparent 60%), #160b22; }
.sfr--career .sfr__cta { background: #ffd27a; color: #2a1206; }
.sfr__art { position: relative; width: 150px; height: 130px; }
.sfr__phones { position: absolute; inset: 6px 15px auto; width: 120px; height: 120px; filter: drop-shadow(0 10px 22px rgba(255,61,110,.55)); }
.sfr__note, .sfr__coin { position: absolute; font-style: normal; font-weight: 800; animation: sfr-float 4.2s ease-in-out infinite; }
.sfr__note { color: #ffd27a; font-size: 26px; }
.sfr__note--1 { left: 0; top: 8px; }
.sfr__note--2 { right: 0; top: 42px; animation-delay: -1.6s; }
.sfr__coin { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: linear-gradient(135deg, #ffe39a, #f2a93b); color: #6b3a05; font-size: 13px; box-shadow: 0 4px 10px rgba(0,0,0,.35); }
.sfr__coin--1 { left: 10px; bottom: 4px; animation-delay: -.8s; }
.sfr__coin--2 { right: 18px; bottom: 0; animation-delay: -2.4s; }
.sfr__coin--3 { left: 62px; top: -4px; width: 20px; height: 20px; font-size: 11px; animation-delay: -3.1s; }
@keyframes sfr-float { 0%, 100% { transform: translateY(0) rotate(-6deg); } 50% { transform: translateY(-9px) rotate(8deg); } }

/* 2: релиз — светлый, цены и винил */
a.sfr--release, .post-body a.sfr--release { background: linear-gradient(120deg, #fff6e6, #ffe2c6 60%, #ffd0b8); color: #2a160b; }
.sfr--release .sfr__label { color: #7a4b2c; }
.sfr--release .sfr__cta { background: #1f1410; color: #fff; }
.sfr__price { display: flex; flex-wrap: wrap; gap: 8px; }
.sfr__price span { display: grid; padding: 7px 11px; border-radius: 12px; background: rgba(255,255,255,.7); font-size: 11.5px; color: #7a4b2c; line-height: 1.2; }
.sfr__price b { font: 800 16px/1.1 var(--display, system-ui); color: #c8102e; }
.sfr__vinyl { position: relative; width: 132px; height: 132px; margin-right: -48px; border-radius: 50%; background: repeating-radial-gradient(circle, #1a1a1a 0 2px, #262626 2px 4px); box-shadow: 0 12px 30px rgba(0,0,0,.35); animation: sfr-spin 7s linear infinite; }
.sfr__vinyl i { position: absolute; inset: 38%; border-radius: 50%; background: radial-gradient(circle, #fff6e6 0 12%, #c8102e 13% 100%); }
@keyframes sfr-spin { to { transform: rotate(360deg); } }

/* 3: AI — неон, бегущая рамка */
a.sfr.sfr--ai, .post-body a.sfr.sfr--ai { grid-template-columns: minmax(0, 1fr); }
.sfr--ai { background: #07060d; border: 1px solid transparent; }
.sfr--ai::before { content: ""; position: absolute; inset: -40%; z-index: -2; background: conic-gradient(from 0deg, #00e0ff, #7a5cff, #ff3dcb, #ffb23d, #00e0ff); animation: sfr-spin 6s linear infinite; }
.sfr--ai::after { content: ""; position: absolute; inset: 2px; z-index: -1; border-radius: 20px; background: radial-gradient(80% 120% at 100% 100%, rgba(122,92,255,.35), transparent 60%), radial-gradient(60% 100% at 0% 0%, rgba(0,224,255,.18), transparent 60%), #0b0a14; }
.sfr--ai .sfr__kicker { background: linear-gradient(90deg, #00e0ff, #ff3dcb); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sfr--ai .sfr__cta { background: linear-gradient(90deg, #00c2ff, #7a5cff 55%, #ff3dcb); color: #fff; }
.sfr__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.sfr__chips span { padding: 5px 10px; border-radius: 999px; border: 1px solid rgba(255,255,255,.22); font-size: 12px; background: rgba(255,255,255,.05); }

/* 4: продвижение — зелёный, растущий график */
a.sfr.sfr--promo, .post-body a.sfr.sfr--promo { grid-template-columns: auto minmax(0, 1fr); }
.sfr--promo { background: linear-gradient(135deg, #062a1f, #0d4a35 55%, #138a5e); }
.sfr--promo .sfr__cta { background: #b6ff6a; color: #0b2a12; }
.sfr__chart { display: flex; align-items: flex-end; gap: 7px; width: 132px; height: 118px; padding: 10px; border-radius: 16px; background: rgba(0,0,0,.22); }
.sfr__chart i { flex: 1; height: var(--h); border-radius: 6px 6px 3px 3px; background: linear-gradient(0deg, #2fd38a, #b6ff6a); transform-origin: bottom; animation: sfr-grow 2.6s ease-in-out infinite alternate; }
.sfr__chart i:nth-child(2) { animation-delay: .15s; } .sfr__chart i:nth-child(3) { animation-delay: .3s; } .sfr__chart i:nth-child(4) { animation-delay: .45s; } .sfr__chart i:nth-child(5) { animation-delay: .6s; } .sfr__chart i:nth-child(6) { animation-delay: .75s; }
@keyframes sfr-grow { from { transform: scaleY(.55); } to { transform: scaleY(1); } }

/* правая колонка */
.sfr-rail { margin-bottom: 16px; }
a.sfr.sfr--rail { grid-template-columns: minmax(0, 1fr); gap: 12px; min-height: 0; padding: 30px 16px 16px; border-radius: 18px; }
.sfr--rail .sfr__title { font-size: 18px; }
.sfr--rail .sfr__text { font-size: 13px; }
.sfr--rail .sfr__art { width: 120px; height: 96px; justify-self: center; order: -1; }
.sfr--rail .sfr__phones { width: 92px; height: 92px; inset: 2px 14px auto; }
.sfr--rail .sfr__vinyl { position: absolute; right: -40px; bottom: -40px; width: 110px; height: 110px; margin: 0; opacity: .5; z-index: 0; }
.sfr--rail .sfr__chart { width: 100%; height: 70px; order: -1; }
.sfr--rail .sfr__price b { font-size: 14px; }
@media (max-width: 640px) {
  a.sfr, .post-body a.sfr, a.sfr.sfr--promo, .post-body a.sfr.sfr--promo { grid-template-columns: minmax(0, 1fr); padding: 30px 18px 18px; gap: 12px; }
  .sfr__art { width: 120px; height: 96px; justify-self: center; order: -1; }
  .sfr__phones { width: 92px; height: 92px; inset: 2px 14px auto; }
  .sfr__vinyl { position: absolute; right: -44px; bottom: -44px; width: 120px; height: 120px; margin: 0; opacity: .45; z-index: 0; }
  .sfr--promo .sfr__chart { width: 100%; height: 64px; }
}
html.no-anim .sfr *, html.no-anim .sfr::before { animation: none !important; }

/* ---------- канал: ссылка на страницу автора ---------- */
.channel-head__owner { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; padding: 6px 12px; border: 1px solid var(--mg-border); border-radius: 999px; color: var(--mg-ivory); font-size: 13.5px; text-decoration: none; transition: border-color .15s, color .15s; }
.channel-head__owner svg { width: 16px; height: 16px; }
.channel-head__owner:hover { border-color: var(--mg-amber); color: var(--mg-amber); }

/* ---------- Грана волна ---------- */
.mus-wave { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 30px; margin: 4px 0 22px; padding: 26px 30px; border: 1px solid rgba(212,161,75,.28); border-radius: 22px; overflow: hidden; background: radial-gradient(90% 150% at 0% 50%, rgba(255,128,32,.24), transparent 60%), linear-gradient(135deg, #22180e, #0f0c09 70%); }
.mus-wave::after { content: ""; position: absolute; right: -90px; top: -90px; width: 340px; height: 340px; border-radius: 50%; background: radial-gradient(circle, rgba(255,170,70,.13), transparent 65%); pointer-events: none; }
.mus-wave__play { position: relative; width: 140px; height: 140px; display: grid; place-items: center; border-radius: 50%; flex: none; }
.mus-wave__rings { position: absolute; inset: 0; pointer-events: none; }
.mus-wave__rings i { position: absolute; inset: 0; border: 2px solid rgba(255,150,50,.55); border-radius: 50%; opacity: 0; animation: musRing 4.2s ease-out infinite; }
.mus-wave__rings i:nth-child(2) { animation-delay: 1.4s; }
.mus-wave__rings i:nth-child(3) { animation-delay: 2.8s; }
.mus-wave__play.is-playing .mus-wave__rings i { animation-duration: 2.4s; }
.mus-wave__play.is-playing .mus-wave__rings i:nth-child(2) { animation-delay: .8s; }
.mus-wave__play.is-playing .mus-wave__rings i:nth-child(3) { animation-delay: 1.6s; }
@keyframes musRing { 0% { transform: scale(.7); opacity: .95; } 100% { transform: scale(1.22); opacity: 0; } }
.mus-wave__btn { position: relative; width: 100px; height: 100px; display: grid; place-items: center; border-radius: 50%; background: var(--grad-cta); color: var(--mg-ink); box-shadow: 0 0 0 7px rgba(255,140,40,.12), 0 18px 46px rgba(255,118,28,.38); transition: transform .2s ease, box-shadow .2s ease; }
.mus-wave__play:hover .mus-wave__btn { transform: scale(1.05); box-shadow: 0 0 0 9px rgba(255,140,40,.16), 0 22px 54px rgba(255,118,28,.45); }
.mus-wave__play:focus-visible { outline: 2px solid var(--mg-amber); outline-offset: 4px; }
.mus-wave__btn svg { width: 44px; height: 44px; }
.mus-wave__play:not(.is-playing) .mus-wave__btn svg { margin-left: 6px; }
.mus-wave__play.is-busy .mus-wave__btn { animation: musPulse .9s ease-in-out infinite; }
@keyframes musPulse { 50% { transform: scale(.93); } }
.mus-wave__text { position: relative; z-index: 1; min-width: 0; }
.mus-wave__kicker { color: var(--mg-amber); font: 600 12px/1.2 var(--body); letter-spacing: .14em; text-transform: uppercase; }
.mus-wave__title { margin: 6px 0 8px; color: var(--mg-hi); font: 700 clamp(1.7rem, 3.4vw, 2.4rem)/1 var(--display); letter-spacing: -0.01em; text-transform: uppercase; }
.mus-wave__sub { margin: 0; color: var(--mg-copy, #d9c7a6); font-size: 14.5px; line-height: 1.5; }
.mus-wave__note { margin: 10px 0 0; padding: 8px 12px; border-left: 3px solid var(--mg-amber); border-radius: 0 10px 10px 0; background: rgba(242,138,45,.1); color: var(--mg-ivory); font-size: 13.5px; line-height: 1.45; }
.mus-wave__acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.mus-wave__acts .btn { display: inline-flex; align-items: center; gap: 7px; }
.mus-wave__acts .btn svg { width: 17px; height: 17px; }
@media (max-width: 640px) {
  .mus-wave { grid-template-columns: 1fr; justify-items: center; gap: 14px; padding: 22px 16px 18px; text-align: center; }
  .mus-wave__play { width: 128px; height: 128px; }
  .mus-wave__btn { width: 92px; height: 92px; }
  .mus-wave__acts { justify-content: center; }
}

/* настройки волны */
.mus-wcfg { width: min(640px, 100%); }
.mus-wcfg__lead { margin: -4px 0 14px; font-size: 14px; }
.mus-wcfg__set { margin: 0; padding: 0; border: 0; min-width: 0; }
.mus-wcfg__set legend { margin-bottom: 8px; padding: 0; color: var(--mg-hi); font-weight: 600; font-size: 14.5px; }
.mus-wcfg__set legend small { margin-left: 6px; color: var(--mg-muted); font-weight: 400; font-size: 12.5px; }
.mus-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.mus-chip { position: relative; display: inline-flex !important; cursor: pointer; }
.mus-chip input { position: absolute; opacity: 0; pointer-events: none; }
.mus-chip span { display: inline-block; padding: 7px 13px; border: 1px solid var(--mg-border); border-radius: 999px; color: var(--mg-ivory); font-size: 13.5px; line-height: 1.2; transition: background .15s, border-color .15s, color .15s; }
.mus-chip:hover span { border-color: rgba(242,138,45,.6); }
.mus-chip input:checked + span { border-color: transparent; background: var(--grad-cta); color: var(--mg-ink); font-weight: 600; }
.mus-chip input:focus-visible + span { outline: 2px solid var(--mg-amber); outline-offset: 2px; }
.mus-switch { position: relative; display: flex !important; align-items: flex-start; gap: 12px !important; padding: 12px 14px; border: 1px solid var(--mg-border); border-radius: 14px; cursor: pointer; line-height: 1.45; }
.mus-switch input { position: absolute; opacity: 0; pointer-events: none; }
.mus-switch i { position: relative; flex: none; width: 42px; height: 24px; margin-top: 1px; border-radius: 999px; background: rgba(255,255,255,.14); transition: background .2s; }
.mus-switch i::after { content: ""; position: absolute; left: 3px; top: 3px; width: 18px; height: 18px; border-radius: 50%; background: #f6e6c5; transition: transform .2s; }
.mus-switch input:checked + i { background: var(--mg-amber); }
.mus-switch input:checked + i::after { transform: translateX(18px); }
.mus-switch input:focus-visible + i { outline: 2px solid var(--mg-amber); outline-offset: 2px; }
.mus-switch span { display: grid; gap: 2px; color: var(--mg-muted); font-size: 13px; }
.mus-switch b { color: var(--mg-hi); font-size: 14.5px; }
.mus-switch--warn input:checked + i { background: #d9573a; }

/* метки трека */
.mus-up__meta { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 480px) { .mus-up__meta { grid-template-columns: 1fr; } }
.mus-badge--18 { background: rgba(217,87,58,.16); color: #ff9a7f; }
.mus-badge--off { display: inline-grid; place-items: center; width: 18px; height: 18px; padding: 0; background: rgba(120,200,120,.14); color: #8fd68f; vertical-align: -4px; }
.mus-badge--off svg { width: 13px; height: 13px; }
.mus-artist { color: inherit; text-decoration: none; }
.mus-artist:hover { color: var(--mg-amber); text-decoration: underline; text-underline-offset: 3px; }
.mus-off__lead { margin: 0 0 12px; font-size: 13.5px; }

/* панель плеера: инструменты */
.mus-bar { grid-template-columns: 48px minmax(0, 1.1fr) auto minmax(0, 1.4fr) auto auto auto auto; }
.mus-bar__cover { cursor: pointer; padding: 0; border: 0; }
.mus-bar__info { cursor: pointer; }
.mus-bar__info span a { color: inherit; text-decoration: none; }
.mus-bar__info span a:hover { color: var(--mg-amber); text-decoration: underline; }
.mus-bar__tools { display: flex; align-items: center; gap: 2px; }
.mus-bar__tool { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; color: var(--mg-muted); }
.mus-bar__tool[hidden] { display: none; }
.mus-bar__tool svg { width: 19px; height: 19px; }
.mus-bar__tool:hover { color: var(--mg-amber); background: rgba(212,161,75,.1); }
@media (max-width: 860px) {
  .mus-bar { grid-template-columns: 42px minmax(0, 1fr) auto auto; }
  .mus-bar__tools { display: none; }
}

/* большой плеер */
.has-mus-full, .has-mus-full body { overflow: hidden; }
.mus-full { position: fixed; inset: 0; z-index: 1150; display: grid; grid-template-rows: auto minmax(0, 1fr) auto auto auto auto; justify-items: center; gap: 18px; padding: max(14px, env(safe-area-inset-top)) 20px max(22px, env(safe-area-inset-bottom)); overflow: auto; background: radial-gradient(80% 60% at 50% 30%, rgba(255,128,32,.18), transparent 70%), #0b0907; animation: soc-fade .18s ease-out; }
.mus-full__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: min(720px, 100%); color: var(--mg-muted); font-size: 13px; letter-spacing: .1em; text-transform: uppercase; }
.mus-full__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: var(--mg-ivory); background: rgba(255,255,255,.06); }
.mus-full__icon svg { width: 24px; height: 24px; }
.mus-full__car { display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px; border: 1px solid var(--mg-border); border-radius: 999px; color: var(--mg-ivory); font-size: 13px; letter-spacing: 0; text-transform: none; }
.mus-full__car svg { width: 18px; height: 18px; }
.mus-full__car.is-on { border-color: transparent; background: var(--grad-cta); color: var(--mg-ink); font-weight: 600; }
.mus-full__cover { align-self: center; width: min(420px, 78vw, 46vh); aspect-ratio: 1; display: grid; place-items: center; border-radius: 22px; overflow: hidden; background: linear-gradient(135deg, #2a1d12, #15110d); color: var(--mg-gold); box-shadow: 0 30px 80px rgba(0,0,0,.6); }
.mus-full__cover img { width: 100%; height: 100%; object-fit: cover; }
.mus-full__cover svg { width: 30%; height: 30%; }
.mus-full__meta { display: grid; gap: 6px; width: min(720px, 100%); text-align: center; }
.mus-full__meta b { color: var(--mg-hi); font: 700 clamp(1.4rem, 4vw, 2rem)/1.1 var(--display); text-transform: uppercase; overflow-wrap: anywhere; }
.mus-full__meta a, .mus-full__meta span { color: var(--mg-muted); font-size: 16px; text-decoration: none; }
.mus-full__meta a:hover { color: var(--mg-amber); }
.mus-full__seek { display: flex; align-items: center; gap: 10px; width: min(720px, 100%); color: var(--mg-muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.mus-full__seek input { flex: 1; min-width: 0; accent-color: var(--mg-amber); }
.mus-full__ctl { display: flex; align-items: center; justify-content: center; gap: 22px; }
.mus-full__ctl button { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; color: var(--mg-ivory); }
.mus-full__ctl button:hover { background: rgba(212,161,75,.1); }
.mus-full__ctl button svg { width: 30px; height: 30px; }
.mus-full__ctl .mus-full__pp { width: 88px; height: 88px; background: var(--grad-cta); color: var(--mg-ink); box-shadow: 0 16px 40px rgba(255,118,28,.35); }
.mus-full__ctl .mus-full__pp svg { width: 40px; height: 40px; }
.mus-full__tools { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; width: min(720px, 100%); }
.mus-full__tools button { display: inline-flex; align-items: center; gap: 7px; padding: 9px 14px; border: 1px solid var(--mg-border); border-radius: 999px; color: var(--mg-ivory); font-size: 13.5px; }
.mus-full__tools button svg { width: 18px; height: 18px; }
.mus-full__tools button:hover { border-color: var(--mg-amber); }
.mus-full__tools button.is-on, .mus-full__tools .mus-like.is-on { border-color: rgba(242,138,45,.6); color: var(--mg-amber); }
.mus-full__tools button[disabled] { opacity: .6; }
/* режим «Для машины»: огромные кнопки, крупный текст, без мелочей */
.mus-full.is-car { gap: 22px; }
.mus-full.is-car .mus-full__cover { width: min(300px, 60vw, 30vh); }
.mus-full.is-car .mus-full__meta b { font-size: clamp(2rem, 6vw, 3.2rem); }
.mus-full.is-car .mus-full__meta a, .mus-full.is-car .mus-full__meta span { font-size: 22px; }
.mus-full.is-car .mus-full__seek { font-size: 18px; }
.mus-full.is-car .mus-full__seek input { height: 28px; }
.mus-full.is-car .mus-full__ctl { gap: clamp(18px, 6vw, 56px); }
.mus-full.is-car .mus-full__ctl button { width: clamp(88px, 22vw, 130px); height: clamp(88px, 22vw, 130px); background: rgba(255,255,255,.07); }
.mus-full.is-car .mus-full__ctl button svg { width: 48%; height: 48%; }
.mus-full.is-car .mus-full__ctl .mus-full__pp { width: clamp(120px, 30vw, 180px); height: clamp(120px, 30vw, 180px); background: var(--grad-cta); }
.mus-full.is-car .mus-full__tools button { padding: 16px 22px; font-size: 18px; }
.mus-full.is-car .mus-full__tools button svg { width: 26px; height: 26px; }
.mus-full.is-car .mus-full__tools [data-mact="share"], .mus-full.is-car .mus-full__tools [data-mact="off-save"], .mus-full.is-car .mus-full__tools [data-mact="off-del"] { display: none; }
@media (orientation: landscape) and (max-height: 560px) {
  .mus-full { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); grid-template-rows: auto repeat(4, auto); align-content: center; column-gap: 28px; row-gap: 12px; }
  .mus-full__top { grid-column: 1 / -1; }
  .mus-full__cover { grid-row: 2 / span 4; width: min(280px, 40vw, 60vh); }
  .mus-full.is-car .mus-full__cover { width: min(240px, 34vw, 54vh); }
  .mus-full.is-car .mus-full__ctl button { width: clamp(76px, 12vw, 110px); height: clamp(76px, 12vw, 110px); }
  .mus-full.is-car .mus-full__ctl .mus-full__pp { width: clamp(100px, 16vw, 140px); height: clamp(100px, 16vw, 140px); }
}

/* приложение «Грана Игры»: только игры, без сообщений; в колокольчике — только игровые уведомления */
.app-games .sidebar, .app-games .rail, .app-games .side-edge, .app-games .bottom-nav, .app-games .browse-switch,
.app-games .topnav__search, .app-games #nav-create, .app-games .nav-radio-slot, .app-games .nav-extras,
.app-games .mc, .app-games .gc-ring, .app-games .gr-tick, .app-games .grana-visitor, .app-games .gr-chat,
.app-games .app-promo, .app-games .gdz-beta-card, .app-games .gdz-beta-chip, .app-games .sf-ad, .app-games .ad-slot,
.app-games .site-legal, .app-games .notify-bar, .app-games .works-bar, .app-game-only #btn-bell, .app-game-only #notif-dd { display: none !important; }
.app-games .layout { display: block; max-width: 1180px; margin: 0 auto; }
.app-games .main { max-width: none; padding-bottom: 40px; }
.app-game-only .topnav { display: none !important; }
.app-game-only .main { padding-top: 12px; }

/* приложение «Грана Музыка»: только музыка */
.app-music .sidebar, .app-music .rail, .app-music .side-edge, .app-music .bottom-nav, .app-music .browse-switch,
.app-music .topnav__search, .app-music #nav-create, .app-music .nav-radio-slot { display: none !important; }
.app-music .layout { display: block; max-width: 1080px; margin: 0 auto; }
.app-music .main { max-width: none; padding-bottom: 120px; }
@media (max-width: 860px) {
  .app-music .mus-bar { bottom: calc(10px + env(safe-area-inset-bottom, 0px)); }
  .app-music body.has-mus-bar .main { padding-bottom: calc(150px + env(safe-area-inset-bottom, 0px)); }
}

/* студия: статьи / видео / музыка */
.studio-kinds { margin: 18px 0 12px; }
.studio-music__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }

/* волна и большой плеер всегда тёмные — свои цвета в любой теме */
.mus-wave, .mus-full { --mg-hi: #fff1d6; --mg-ivory: #f6e6c5; --mg-copy: #dccaa8; --mg-muted: #b9a585; --mg-border: rgba(212,161,75,.32); color: #f6e6c5; }
.mus-wave { grid-template-columns: auto minmax(0, 1fr) minmax(0, 260px); }
.mus-wave .btn { border: 1px solid rgba(212,161,75,.38); background: rgba(255,255,255,.06); color: #f6e6c5; }
.mus-wave .btn:hover { border-color: var(--mg-amber); color: #fff1d6; background: rgba(242,138,45,.14); }
.mus-wave__eq { position: relative; z-index: 1; display: flex; align-items: flex-end; justify-content: flex-end; gap: 5px; height: 96px; }
.mus-wave__eq i { flex: 1; max-width: 6px; height: var(--h); border-radius: 3px; background: linear-gradient(to top, rgba(242,138,45,.25), rgba(255,180,90,.75)); transform-origin: bottom; transform: scaleY(.35); transition: transform .4s ease; }
.mus-wave__eq.is-on i { animation: musEq var(--d) ease-in-out infinite alternate; }
@keyframes musEq { from { transform: scaleY(.25); } to { transform: scaleY(1); } }
@media (max-width: 900px) { .mus-wave { grid-template-columns: auto minmax(0, 1fr); } .mus-wave__eq { display: none; } }
@media (max-width: 640px) { .mus-wave { grid-template-columns: 1fr; } }
html.no-anim .mus-wave__rings i, html.no-anim .mus-wave__eq.is-on i { animation: none; }

/* карточка видео: автор кликабельный */
.yt-card__ava { display: inline-flex; flex: none; border-radius: 50%; cursor: pointer; }
.yt-card__ch { cursor: pointer; }
.yt-card__ch:hover, .yt-card__ch:focus-visible { color: var(--mg-amber); text-decoration: underline; text-underline-offset: 3px; outline: none; }

.mus-full__tools .mus-like { height: auto; min-width: 0; }
.mus-full__tools em { font-style: normal; }
@media (max-width: 520px) { .mus-page .soc-tabs { flex-wrap: wrap; overflow: visible; } }

.mus-apps { display: flex; align-items: flex-start; gap: 10px; margin: -8px 0 20px; padding: 10px 14px; border: 1px dashed rgba(212,161,75,.35); border-radius: 14px; color: var(--mg-muted); font-size: 13.5px; line-height: 1.5; }
.mus-apps svg { flex: none; width: 18px; height: 18px; margin-top: 1px; color: var(--mg-amber); }
.mus-apps a { color: var(--mg-amber); font-weight: 600; }

/* закрепы: компактная полоса, список всех по нажатию */
.chx-pins { display: grid; gap: 0; padding: 2px 10px; }
.chx-pins--few { padding: 2px 10px; }
.chx-pins__line { display: flex; align-items: center; gap: 8px; width: 100%; min-width: 0; min-height: 26px; padding: 3px 2px; text-align: left; color: var(--mg-copy); font-size: 13px; line-height: 1.25; background: none; border: 0; cursor: pointer; }
.chx-pins__line + .chx-pins__line { border-top: 1px dashed rgba(212,161,75,.18); }
.chx-pins__line > svg { flex-shrink: 0; width: 14px; height: 14px; color: var(--mg-amber); }
.chx-pins__line > span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chx-pins__line b { font-weight: 700; color: var(--mg-amber-lite, #ffb062); }
.chx-pins__line--all > svg:last-child { color: var(--mg-muted, #a8957c); width: 16px; height: 16px; }
.chx-pins__line:hover > span { color: var(--mg-amber-lite, #ffb062); }
.chx-pins__line:focus-visible { outline: 2px solid var(--mg-amber); outline-offset: 1px; border-radius: 6px; }
.chx-pinlist__it > button:first-child b em { font-style: normal; font-weight: 400; color: var(--mg-muted, #a8957c); margin-left: 6px; }
.chx-pinlist__it > button:first-child span { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; white-space: normal; }
html[data-theme="light"] .chx-pins__line { color: #3a2a18; }
html[data-theme="light"] .chx-pins__line b { color: #b4570d; }
/* поделиться: в чат и на свою страницу, все сети, QR */
.share-modal { max-height: calc(100dvh - 24px); overflow-y: auto; }
.share-main { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0 0 14px; }
.share-main .share-chat-btn { margin: 0; min-height: 44px; padding: 8px 10px; line-height: 1.2; white-space: normal; text-align: center; }
.share-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.share-opt { padding: 10px 6px; font-size: 13px; line-height: 1.2; }
.share-opt[data-act="share-native"] { grid-column: 1 / -1; }
.share-qr { display: grid; justify-items: center; gap: 6px; margin: 12px 0 0; padding: 12px; border-radius: 14px; background: #fff; color: #2a1d10; font-size: 13px; }
.share-qr svg { width: 200px; height: 200px; }
@media (max-width: 380px) { .share-main { grid-template-columns: 1fr; } }

/* Игры: экран запуска и «не загрузилась» поверх рамки */
.gm-stage__wait { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 24px; text-align: center; color: #f4ede4; background: radial-gradient(120% 90% at 50% 30%, #2a1a0c 0%, #0b0806 70%); font-size: 15px; }
.gm-stage__wait[hidden] { display: none; }
.gm-stage__wait b { font-size: 17px; font-weight: 700; }
.gm-stage__wait span:not(.gm-stage__spin) { color: rgba(244, 237, 228, .72); max-width: 280px; line-height: 1.4; }
.gm-stage__spin { width: 34px; height: 34px; border-radius: 50%; border: 3px solid rgba(242, 138, 45, .22); border-top-color: #f28a2d; animation: gm-spin .9s linear infinite; }
@keyframes gm-spin { to { transform: rotate(360deg); } }
html.no-anim .gm-stage__spin { animation-duration: 2.4s; }

/* Пульт: дорожки, караоке, тональность */
.dk-stems { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.dk-stems > span { color: var(--muted, #a3a3ad); font-size: 12px; margin-right: 2px; }
.dk-stems .dk-chip:not(.is-on):not(.dk-chip--kar) { opacity: .55; text-decoration: line-through; text-decoration-thickness: 1px; }
.dk-chip--kar.is-on { background: linear-gradient(135deg, #f8b45a, #e65f1e); color: #170c03; border-color: transparent; }
.dk-key { display: grid; justify-items: end; margin-top: 4px; }
.dk-key b { font: 800 14px/1 var(--display, system-ui); color: #7fd6c2; }
.dk-key small { white-space: nowrap; }

/* Баннеры с картинкой: искры и ракета */
a.sfr.sfr--photo, .post-body a.sfr.sfr--photo { grid-template-columns: minmax(180px, 42%) minmax(0, 1fr); gap: 20px; padding: 14px 22px 14px 14px; background: #fffaf3; color: #1d130b; border: 1px solid rgba(160, 110, 60, .18); }
html[data-theme="dark"] a.sfr.sfr--photo, html:not([data-theme="light"]) a.sfr.sfr--photo { background: #17110c; color: #f6eee4; border-color: rgba(255, 210, 150, .12); }
.sfr--photo .sfr__label { color: inherit; }
.sfr__photo { position: relative; align-self: stretch; min-height: 150px; border-radius: 16px; overflow: hidden; }
.sfr__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 6s ease; }
.sfr--photo:hover .sfr__photo img { transform: scale(1.06); }
.sfr--photo .sfr__cta { background: linear-gradient(135deg, #f8b45a, #e65f1e); color: #1a0c03; }
.sfr--rocket .sfr__cta { background: linear-gradient(135deg, #7a5cff, #ff7a3d); color: #fff; }
.sfr--ai-photo .sfr__cta { background: linear-gradient(90deg, #00c2ff, #7a5cff 55%, #ff3dcb); color: #fff; }
.sfr__spark { position: absolute; width: 10px; height: 10px; pointer-events: none; background: radial-gradient(circle, #fff 0 18%, rgba(255, 230, 160, .9) 30%, transparent 62%); clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%); animation: sfr-twinkle 2.6s ease-in-out infinite; }
.sfr__spark--1 { left: 12%; top: 18%; }
.sfr__spark--2 { left: 72%; top: 12%; width: 14px; height: 14px; animation-delay: -.7s; }
.sfr__spark--3 { left: 84%; top: 62%; animation-delay: -1.3s; }
.sfr__spark--4 { left: 30%; top: 74%; width: 8px; height: 8px; animation-delay: -1.9s; }
.sfr__spark--5 { left: 52%; top: 40%; width: 12px; height: 12px; animation-delay: -2.2s; }
.sfr__spark--6 { left: 8%; top: 56%; width: 7px; height: 7px; animation-delay: -.3s; }
@keyframes sfr-twinkle { 0%, 100% { transform: scale(.2) rotate(0); opacity: 0; } 45% { transform: scale(1.15) rotate(45deg); opacity: 1; } 70% { transform: scale(.8) rotate(80deg); opacity: .8; } }
.sfr__rkt { position: absolute; left: 8%; bottom: 8%; width: 34px; height: 34px; filter: drop-shadow(0 4px 10px rgba(255, 138, 45, .7)); animation: sfr-rocket 5.5s ease-in-out infinite; }
@keyframes sfr-rocket { 0% { transform: translate(0, 0) rotate(0); opacity: 0; } 10% { opacity: 1; } 70% { transform: translate(140%, -260%) rotate(-6deg); opacity: 1; } 85%, 100% { transform: translate(190%, -360%) rotate(-10deg); opacity: 0; } }
.sfr--rail.sfr--photo { grid-template-columns: minmax(0, 1fr); padding: 30px 12px 14px; }
.sfr--rail .sfr__photo { min-height: 120px; }
@media (max-width: 640px) {
  a.sfr.sfr--photo, .post-body a.sfr.sfr--photo { grid-template-columns: minmax(0, 1fr); padding: 30px 12px 16px; }
  .sfr__photo { min-height: 170px; }
}

/* Акция «Собери команду» */
.rp { position: relative; box-sizing: border-box; }
.rp--top { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; padding: 10px 40px 10px 14px; border-radius: 16px; background: linear-gradient(110deg, rgba(248, 180, 90, .2), rgba(230, 95, 30, .14) 60%, rgba(127, 214, 194, .14)); border: 1px solid rgba(230, 120, 40, .25); }
.rp__ico { flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: #1d130b; font-size: 20px; animation: rp-bob 3s ease-in-out infinite; }
.rp--top .rp__body { display: grid; gap: 2px; min-width: 0; flex: 1; }
.rp--top .rp__body b { font: 700 15px/1.25 var(--display, system-ui); }
.rp--top .rp__body span { font-size: 13px; color: var(--muted, #8a8076); }
.rp--top .btn { flex: none; }
.rp__x { position: absolute; top: 6px; right: 8px; width: 28px; height: 28px; border: 0; border-radius: 50%; background: transparent; color: inherit; font-size: 20px; line-height: 1; cursor: pointer; opacity: .55; }
.rp__x:hover { opacity: 1; background: rgba(0, 0, 0, .06); }
.rp--card { display: grid; grid-template-columns: minmax(180px, 40%) minmax(0, 1fr); gap: 20px; margin: 18px 0; padding: 14px 20px 16px 14px; border-radius: 22px; background: linear-gradient(135deg, #2a1708, #1a0f07 60%, #10201c); color: #fbf3e8; overflow: hidden; }
.rp__art { position: relative; min-height: 190px; border-radius: 16px; overflow: hidden; }
.rp__art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.rp__gem { position: absolute; width: 14px; height: 14px; background: linear-gradient(135deg, #e9fbff, #7fd6f5 55%, #3a8fd6); clip-path: polygon(50% 0, 100% 38%, 50% 100%, 0 38%); filter: drop-shadow(0 0 6px rgba(160, 230, 255, .9)); animation: rp-fall 4.8s linear infinite; }
.rp__gem--1 { left: 10%; animation-delay: 0s; } .rp__gem--2 { left: 26%; animation-delay: -1.1s; width: 10px; height: 10px; } .rp__gem--3 { left: 44%; animation-delay: -2.6s; }
.rp__gem--4 { left: 60%; animation-delay: -.6s; width: 18px; height: 18px; } .rp__gem--5 { left: 74%; animation-delay: -3.4s; } .rp__gem--6 { left: 88%; animation-delay: -1.9s; width: 11px; height: 11px; } .rp__gem--7 { left: 35%; animation-delay: -4.1s; width: 9px; height: 9px; }
@keyframes rp-fall { 0% { top: -12%; transform: rotate(0); opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 104%; transform: rotate(200deg); opacity: 0; } }
@keyframes rp-bob { 0%, 100% { transform: translateY(0) rotate(-4deg); } 50% { transform: translateY(-3px) rotate(6deg); } }
.rp--card .rp__body { display: grid; gap: 10px; align-content: center; min-width: 0; }
.rp__kicker { font: 800 11px/1 var(--body, system-ui); letter-spacing: .14em; text-transform: uppercase; color: #f8b45a; }
.rp__title { font: 800 clamp(19px, 2.2vw, 25px)/1.15 var(--display, system-ui); }
.rp .rp__text { margin: 0; font-size: 14.5px; line-height: 1.5; color: rgba(251, 243, 232, .86); }
.rp__prog { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 13px; color: rgba(251, 243, 232, .8); }
.rp__dots { display: inline-flex; gap: 5px; }
.rp__dots i { width: 14px; height: 14px; border-radius: 50%; border: 2px solid rgba(248, 180, 90, .55); }
.rp__dots i.is-on { background: linear-gradient(135deg, #f8b45a, #e65f1e); border-color: transparent; }
.rp__link { display: flex; flex-wrap: wrap; gap: 8px; }
.rp__link .share-url { flex: 1 1 200px; min-width: 0; }
.rp__go { justify-self: start; }
.rp__rules summary { cursor: pointer; font-size: 13px; color: #f8b45a; }
.rp__rules ul { margin: 8px 0 0; padding-left: 18px; font-size: 13px; line-height: 1.5; color: rgba(251, 243, 232, .8); }
.rp__rules li + li { margin-top: 4px; }
.feed-ad { margin: 6px 0 18px; }
@media (max-width: 640px) {
  .rp--card { grid-template-columns: minmax(0, 1fr); padding: 12px 14px 16px; }
  .rp__art { min-height: 170px; }
  .rp--top { flex-wrap: wrap; }
  .rp--top .btn { margin-left: 50px; }
}
html.no-anim .sfr__spark, html.no-anim .sfr__rkt, html.no-anim .rp__gem, html.no-anim .rp__ico { animation: none; }
html.no-anim .sfr__rkt { opacity: 1; }

/* Акция: плашка вверху на телефоне — кнопка отдельной строкой */
@media (max-width: 640px) {
  .rp--top { display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: start; gap: 10px 12px; }
  .rp--top .btn { grid-column: 1 / -1; justify-self: stretch; margin-left: 0; }
}

/* страница «Скачать» */
.apps-list { display: grid; gap: 12px; }
.apps-card { display: grid; gap: 6px; text-decoration: none; color: inherit; }
.apps-card:hover { border-color: var(--accent, #c8102e); }
.apps-card__btn { justify-self: start; margin-top: 6px; }

/* Студия: материалы карточками, поиск, сортировка, плейлисты */
.studio-kinds-bar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 18px 0 10px; }
.studio-kinds-bar .studio-kinds { margin: 0; }
.studio-search { position: relative; flex: 1 1 220px; max-width: 340px; display: flex; align-items: center; }
.studio-search__ic { position: absolute; left: 12px; display: inline-flex; color: var(--mg-muted); pointer-events: none; }
.studio-search__ic svg { width: 18px; height: 18px; }
.studio-search input { width: 100%; height: 40px; padding: 0 14px 0 38px; border-radius: 999px; border: 1px solid var(--mg-border); background: var(--mg-card, rgba(255,255,255,.04)); color: var(--mg-hi); font: inherit; font-size: 14px; }
.studio-search input:focus { outline: none; border-color: var(--mg-amber); box-shadow: 0 0 0 3px rgba(242, 138, 45, .16); }
.studio-tools { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 4px 0 10px; }
.studio-sort { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--mg-muted); }
.studio-sort select { height: 36px; padding: 0 30px 0 12px; border-radius: 10px; border: 1px solid var(--mg-border); background: var(--mg-card, transparent); color: var(--mg-hi); font: inherit; font-size: 13.5px; }
.studio-tools__n { font-size: 13px; color: var(--mg-muted); }
.studio-pl { display: flex; gap: 6px; flex-wrap: wrap; margin: 0 0 14px; }
.studio-pl__chip, .studio-pl__tool { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--mg-border); background: transparent; color: var(--mg-copy); font: inherit; font-size: 13px; cursor: pointer; }
.studio-pl__chip i { font-style: normal; font-size: 11.5px; color: var(--mg-muted); font-variant-numeric: tabular-nums; }
.studio-pl__chip.is-active { background: var(--mg-amber); border-color: var(--mg-amber); color: #fff; }
.studio-pl__chip.is-active i { color: rgba(255,255,255,.85); }
.studio-pl__tool { border-style: dashed; color: var(--mg-muted); }
.studio-pl__chip:hover, .studio-pl__tool:hover { border-color: var(--mg-amber); }
.mcards { display: grid; gap: 12px; }
.mcard { display: grid; grid-template-columns: 200px 1fr; gap: 16px; padding: 12px; border: 1px solid var(--mg-border); border-radius: 16px; background: var(--mg-card, rgba(246, 230, 197, .02)); }
.mcard:hover { border-color: var(--mg-border-amber, var(--mg-amber)); }
.mcard__thumb { position: relative; display: block; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: rgba(0,0,0,.18); }
.mcard:not(.mcard--video) .mcard__thumb { aspect-ratio: 4 / 3; }
.mcard__thumb > :first-child, .mcard__thumb img, .mcard__thumb .cover { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mcard__play { position: absolute; left: 50%; top: 50%; width: 40px; height: 40px; margin: -20px 0 0 -20px; display: grid; place-items: center; border-radius: 50%; background: rgba(0,0,0,.55); color: #fff; }
.mcard__play svg { width: 18px; height: 18px; }
.mcard__dur { position: absolute; right: 6px; bottom: 6px; padding: 2px 6px; border-radius: 6px; background: rgba(0,0,0,.72); color: #fff; font-size: 11.5px; font-variant-numeric: tabular-nums; }
.mcard__body { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.mcard__title { margin: 0; font-size: 16px; line-height: 1.3; font-weight: 700; }
.mcard__title a { color: var(--mg-hi); text-decoration: none; }
.mcard__title a:hover { color: var(--mg-amber); }
.mcard__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 12.5px; color: var(--mg-muted); }
.mcard__pl { height: 22px; padding: 0 8px; border-radius: 999px; border: 1px solid var(--mg-border); background: transparent; color: var(--mg-copy); font: inherit; font-size: 11.5px; cursor: pointer; }
.mcard__pl:hover { border-color: var(--mg-amber); color: var(--mg-amber); }
.mcard .mstats { margin-top: 2px; }
.mcard__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: auto; padding-top: 8px; }
.mcard__status { display: flex; flex-direction: column; gap: 2px; }
.mcard__acts { display: flex; gap: 6px; flex-wrap: wrap; }
@media (max-width: 720px) {
  .studio-search { max-width: none; flex-basis: 100%; }
  .mcard { grid-template-columns: 1fr; gap: 10px; padding: 10px; }
  .mcard:not(.mcard--video) { grid-template-columns: 96px 1fr; }
  .mcard:not(.mcard--video) .mcard__foot { grid-column: 1 / -1; }
  .mcard__acts .btn { flex: 1 1 auto; }
}
.ch-pl { display: flex; gap: 6px; flex-wrap: wrap; margin: 0 0 16px; }
.ch-pl a { text-decoration: none; }
.ch-pl__group { margin-bottom: 26px; }
.ch-pl__title { display: flex; align-items: baseline; gap: 8px; margin: 0 0 12px; font-size: 18px; color: var(--mg-hi); }
.ch-pl__title span { font-size: 13px; font-weight: 500; color: var(--mg-muted); }
.pl-dlg { max-width: 440px; }
.pl-dlg__for { margin: -4px 0 10px; font-size: 13px; }
.pl-dlg__list { display: grid; gap: 6px; max-height: 42vh; overflow: auto; margin-bottom: 12px; }
.pl-dlg__it { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--mg-border); border-radius: 10px; cursor: pointer; }
.pl-dlg__it input { width: 18px; height: 18px; accent-color: var(--mg-amber); }
.pl-dlg__new { display: grid; gap: 6px; font-size: 13px; color: var(--mg-muted); }
.pl-dlg__new input { height: 40px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--mg-border); background: transparent; color: var(--mg-hi); font: inherit; }
.pl-dlg__note { font-size: 12px; margin: 8px 0 0; }

/* ---------- музыка: песня, комментарии, посты, текст, караоке, альбомы ---------- */
.mus-row { grid-template-columns: auto minmax(0, 1fr) auto auto auto auto auto; }
.mus-row__title { cursor: pointer; }
.mus-row__title:hover { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(242,138,45,.6); }
.mus-row__cmt { display: inline-flex; align-items: center; gap: 4px; min-width: 34px; height: 34px; padding: 0 8px; border-radius: 10px; color: var(--mg-muted); font-size: 12.5px; }
.mus-row__cmt svg { width: 17px; height: 17px; }
.mus-row__cmt:hover { color: var(--mg-ivory); background: rgba(255,255,255,.05); }
@media (max-width: 760px) {
  .mus-row { grid-template-columns: auto minmax(0, 1fr) auto auto auto; }
  .mus-list--compact .mus-row { grid-template-columns: auto minmax(0, 1fr) auto auto; }
  .mus-row__cmt { min-width: 30px; padding: 0 4px; }
}
.mus-act { display: inline-flex; align-items: center; gap: 7px; min-height: 38px; padding: 8px 14px; border: 1px solid var(--mg-border); border-radius: 999px; color: var(--mg-ivory); font-size: 13.5px; line-height: 1; background: rgba(255,255,255,.02); transition: border-color .15s, color .15s, background .15s; }
.mus-act svg { width: 18px; height: 18px; flex-shrink: 0; }
.mus-act:hover { border-color: var(--mg-amber); }
.mus-act.is-on, .mus-act[aria-pressed="true"] { border-color: rgba(242,138,45,.6); color: var(--mg-amber); background: rgba(242,138,45,.08); }
.mus-act.mus-like.is-on { color: #ff6b6b; border-color: rgba(255,107,107,.5); }
.mus-act.mus-add { width: auto; height: auto; }
.mus-act.mus-add svg { width: 18px; height: 18px; }
.mus-act span:empty { display: none; }
.mus-act--post { border-color: rgba(242,138,45,.45); background: linear-gradient(135deg, rgba(242,138,45,.16), rgba(212,161,75,.06)); color: var(--mg-amber-lite); }
.mus-act--posts { color: var(--mg-gold); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(212,161,75,.45); }
.mus-act--kara { border-color: rgba(255,97,166,.45); color: #ffb3d6; }
.mus-full__song { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; width: min(720px, 100%); }
.mus-full.is-car .mus-full__song { display: none; }
.mus-full__lyr { align-self: stretch; width: min(720px, 100%); min-height: 220px; max-height: 100%; overflow-y: auto; padding: 18vh 8px; scroll-behavior: smooth; mask-image: linear-gradient(transparent, #000 18%, #000 82%, transparent); -webkit-mask-image: linear-gradient(transparent, #000 18%, #000 82%, transparent); }
.mus-lyr__line { margin: 0; padding: 7px 4px; color: rgba(255,255,255,.34); font: 700 clamp(1.15rem, 3.4vw, 1.75rem)/1.3 var(--display); text-align: center; cursor: default; transition: color .25s, transform .25s; }
.mus-lyr__line.is-gap { margin-top: 18px; }
.mus-lyr__line.is-past { color: rgba(255,255,255,.55); }
.mus-lyr__line.is-on { color: #fff; transform: scale(1.04); text-shadow: 0 0 24px rgba(242,138,45,.45); }
.mus-lyr__wait, .mus-lyr__note { margin: 0 0 14px; color: var(--mg-muted); text-align: center; font-size: 14px; }
.mus-lyr__note { color: var(--mg-gold); }

.mus-sheet-ov { align-items: flex-end; }
.mus-sheet { position: relative; width: min(680px, 100%); max-height: min(88dvh, 860px); overflow-y: auto; padding: 22px 22px 18px; }
@media (min-width: 761px) { .mus-sheet-ov { align-items: center; } }
.mus-sheet__x { position: absolute; top: 12px; right: 12px; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; color: var(--mg-muted); }
.mus-sheet__x:hover { color: var(--mg-hi); background: rgba(255,255,255,.06); }
.mus-sheet__x svg { width: 20px; height: 20px; }
.mus-sheet__head { display: flex; align-items: center; gap: 14px; padding-right: 40px; }
.mus-sheet__head > div { display: grid; gap: 3px; min-width: 0; }
.mus-sheet__head b { color: var(--mg-hi); font: 700 1.25rem/1.2 var(--display); overflow-wrap: anywhere; }
.mus-sheet__head .mus-artist, .mus-sheet__head > div > span { color: var(--mg-muted); font-size: 14px; }
.mus-sheet__head small { color: var(--mg-muted); font-size: 12.5px; }
.mus-sheet__cover { position: relative; flex-shrink: 0; width: 84px; height: 84px; padding: 0; border-radius: 14px; overflow: hidden; background: linear-gradient(135deg, #2a1d12, #15110d); color: var(--mg-gold); }
.mus-sheet__cover img { width: 100%; height: 100%; object-fit: cover; }
.mus-sheet__cover .mus-row__btn { opacity: 1; background: rgba(7,7,6,.38); }
.mus-sheet__acts { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 6px; }
.mus-sheet__note { margin: 4px 0 0; font-size: 12.5px; }
.mus-sheet__tabs { margin: 14px 0 12px; }
.mus-sheet__tabs .soc-tab { border: 0; background: none; font: inherit; cursor: pointer; }
.mus-sheet__write { margin-bottom: 12px; }
.mus-sheet__write svg { width: 16px; height: 16px; }
.mus-person { display: inline-flex; align-items: center; gap: 8px; min-width: 0; color: var(--mg-hi); text-decoration: none; font-size: 13.5px; }
.mus-person img, .mus-person i { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.mus-person i { display: grid; place-items: center; background: rgba(242,138,45,.18); color: var(--mg-amber-lite); font-style: normal; font-weight: 700; font-size: 13px; }
.mus-person b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.mus-person:hover b { color: var(--mg-amber-lite); }
.mus-cform { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 8px; margin-bottom: 14px; }
.mus-cform textarea { min-height: 46px; padding: 11px 13px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(255,255,255,.03); color: var(--mg-hi); font: inherit; font-size: 14px; resize: vertical; }
.mus-cform textarea:focus { border-color: var(--mg-amber); outline: none; }
.mus-cmts, .mus-posts { display: grid; gap: 10px; }
.mus-cmt { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding: 12px 14px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(255,255,255,.02); }
.mus-cmt time, .mus-post time { font-size: 12px; }
.mus-cmt p { flex-basis: 100%; margin: 4px 0 0; color: var(--mg-copy); font-size: 14.5px; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.mus-cmt__del { position: absolute; top: 8px; right: 8px; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; color: var(--mg-muted); opacity: .7; }
.mus-cmt__del:hover { opacity: 1; color: #ffb3a5; background: rgba(200,64,42,.14); }
.mus-cmt__del svg { width: 14px; height: 14px; }
.mus-post { display: grid; gap: 8px; padding: 14px; border: 1px solid var(--mg-border); border-radius: 14px; background: linear-gradient(135deg, rgba(242,138,45,.06), transparent 60%); }
.mus-post__link { display: grid; gap: 4px; color: inherit; text-decoration: none; }
.mus-post__link b { color: var(--mg-hi); font-size: 15.5px; }
.mus-post__link span { color: var(--mg-copy); font-size: 14px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.mus-post__link:hover b { color: var(--mg-amber-lite); }
.mus-postdlg { width: min(640px, 100%); max-height: calc(100dvh - 32px); overflow-y: auto; }
.mus-postdlg textarea { min-height: 200px; resize: vertical; line-height: 1.55; }
.mus-postdlg__count { margin: -2px 0 0; color: var(--mg-muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.mus-postdlg__count.is-ok { color: #8fe0a2; }
.mus-up__alb { display: grid; gap: 10px; }
.mus-dest { display: grid; gap: 8px; margin: 0; padding: 12px; border: 1px solid var(--mg-border); border-radius: 14px; }
.mus-dest legend { padding: 0 6px; font-weight: 650; }
.mus-dest__opt { display: flex !important; align-items: center; gap: 8px; }
.mus-dest__pl { display: grid; gap: 8px; }
.mus-ch-head { display: grid; gap: 8px; margin-bottom: 14px; }
.mus-ch-head .btn { justify-self: start; }
.mus-holds { display: grid; gap: 6px; margin-bottom: 12px; }
.mus-holds__row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mus-album__cell { display: flex; align-items: flex-start; gap: 6px; flex-wrap: wrap; position: relative; }
.mus-album__cell .mus-album { flex: 1; min-width: 0; }
.mus-album__cell .mus-album__mv { align-self: center; margin-top: 4px; }
.mus-album__more { flex-shrink: 0; align-self: flex-start; margin-top: 6px; z-index: 2; }
.mus-album__bar .mus-album__more { margin-top: 0; margin-left: auto; }
.channel-tabs-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 4px; }
.channel-tabs-row .tabs--channel { flex: 1; min-width: 0; }
.channel-tabs-set { flex-shrink: 0; }
@media (max-width: 720px) {
  .channel-tabs-row { flex-direction: column; align-items: stretch; gap: 8px; }
  .channel-tabs-row .tabs--channel { width: 100%; overflow-x: auto; flex-wrap: nowrap; }
  .channel-tabs-set { align-self: flex-start; max-width: 100%; }
}
.chn-cm__meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 4px; font-size: 12px; color: var(--mg-muted); }
.chn-cm__meta button { border: 0; background: none; color: var(--mg-gold); font: inherit; cursor: pointer; padding: 0; }
html.has-vp-fs .topnav,
html.has-vp-fs .works-bar,
html.has-vp-fs .bottom-nav { visibility: hidden !important; pointer-events: none !important; }
.player.vp-fs { width: 100vw !important; max-width: none !important; height: 100dvh !important; margin: 0 !important; border-radius: 0 !important; }
.mus-shelf__empty { margin: 0 0 12px; }
.mus-shelf { display: grid; gap: 8px; }
.mus-up__lyr textarea { min-height: 130px; line-height: 1.5; resize: vertical; }

/* караоке: крупные слова, заливка по ходу пения */
.mus-kara { position: fixed; inset: 0; z-index: 1300; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; overflow: hidden; background: #08060a; color: #fff; animation: soc-fade .2s ease-out; }
.has-mus-kara, .has-mus-kara body { overflow: hidden; }
.mus-kara__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(.45) saturate(1.1); }
.mus-kara__bg { position: absolute; inset: -20%; background: linear-gradient(120deg, #2b0d3a, #0b1f4a 35%, #3a1405 70%, #2b0d3a); background-size: 300% 300%; animation: kara-grad 18s ease-in-out infinite; }
.mus-kara__bg i { position: absolute; width: 52vmax; height: 52vmax; border-radius: 50%; filter: blur(80px); opacity: .55; mix-blend-mode: screen; animation: kara-blob 22s ease-in-out infinite; }
.mus-kara__bg i:nth-child(1) { left: 5%; top: 10%; background: #ff6a3d; }
.mus-kara__bg i:nth-child(2) { right: 0; top: 30%; background: #7b5cff; animation-delay: -7s; }
.mus-kara__bg i:nth-child(3) { left: 30%; bottom: 0; background: #ff3d9a; animation-delay: -14s; }
@keyframes kara-grad { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
@keyframes kara-blob { 0%, 100% { transform: translate(0, 0) scale(1); } 33% { transform: translate(8vw, -6vh) scale(1.15); } 66% { transform: translate(-6vw, 5vh) scale(.9); } }
/* караоке: фон по частям песни — картинка плавно сменяется в момент строк и медленно наезжает */
.mus-kara__scenes { position: absolute; inset: 0; overflow: hidden; background: #08060a; }
.mus-kara__scenes::after { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse 70% 60% at 50% 50%, rgba(0,0,0,.18), rgba(0,0,0,.6)), linear-gradient(180deg, rgba(0,0,0,.6), transparent 20%, transparent 68%, rgba(0,0,0,.75)); }
.mus-kara__scene { position: absolute; inset: 0; opacity: 0; transition: opacity 1.4s ease; }
.mus-kara__scene.is-in { opacity: 1; }
.mus-kara__scene i { position: absolute; inset: -60px; background-size: cover; background-position: center; filter: blur(30px) brightness(.5) saturate(1.2); }
.mus-kara__scene img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(.66) saturate(1.06); animation: kara-kb 40s ease-out both; }
.mus-kara__scene.kb-b img { animation-name: kara-kb2; }
@keyframes kara-kb { from { transform: scale(1.02) translate(0, 0); } to { transform: scale(1.16) translate(-1.6%, -1.2%); } }
@keyframes kara-kb2 { from { transform: scale(1.16) translate(1.6%, 1.2%); } to { transform: scale(1.03) translate(0, 0); } }
.has-scenes .mus-kara__line.is-next, .has-scenes .mus-kara__line.is-later { text-shadow: 0 2px 14px rgba(0,0,0,.8); }
.has-scenes .is-now .mus-kara__w { filter: drop-shadow(0 3px 14px rgba(0,0,0,.85)); }
@media (max-aspect-ratio: 4/5) {
  .mus-kara__scenes::after { background: linear-gradient(180deg, rgba(0,0,0,.4), transparent 10%, transparent 46%, rgba(0,0,0,.5)); }
  .mus-kara__scene img { top: calc(max(14px, env(safe-area-inset-top)) + 58px); bottom: auto; height: min(75vw, 42vh); filter: none; -webkit-mask-image: linear-gradient(180deg, #000 78%, transparent); mask-image: linear-gradient(180deg, #000 78%, transparent); }
  .mus-kara.has-scenes .mus-kara__stage { justify-content: flex-start; padding-top: calc(min(75vw, 42vh) + 10px); }
  .mus-kara.has-scenes .mus-kara__line { font-size: clamp(1.4rem, 6.6vw, 2.4rem); }
  .mus-kara.has-scenes .mus-kara__line.is-next { font-size: clamp(1.05rem, 4.6vw, 1.7rem); }
  .mus-kara.has-scenes .mus-kara__line.is-later { font-size: clamp(.95rem, 4vw, 1.4rem); }
}
@media (prefers-reduced-motion: reduce) { .mus-kara__scene img { animation: none; } .mus-kara__scene { transition: none; } }
.mus-kara__top, .mus-kara__stage, .mus-kara__ctl { position: relative; z-index: 1; }
.mus-kara__top { display: flex; align-items: center; gap: 14px; padding: max(14px, env(safe-area-inset-top)) 18px 0; }
.mus-kara__top > div { display: grid; flex: 1; min-width: 0; text-align: center; }
.mus-kara__top b { font: 700 16px/1.2 var(--display); text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mus-kara__top span { font-size: 13px; opacity: .7; }
.mus-kara__top button, .mus-kara__pp { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; color: #fff; background: rgba(255,255,255,.1); flex-shrink: 0; }
.mus-kara__top button:hover { background: rgba(255,255,255,.2); }
.mus-kara__top svg { width: 24px; height: 24px; }
.mus-kara__stage { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 2.2vh; padding: 0 5vw; text-align: center; }
.mus-kara__line { margin: 0; max-width: 1400px; font: 800 clamp(1.6rem, 5.4vw, 4.6rem)/1.18 var(--display); letter-spacing: .01em; text-wrap: balance; transition: opacity .3s, transform .3s; }
.mus-kara__line.is-next { font-size: clamp(1.1rem, 3.4vw, 2.6rem); opacity: .6; }
.mus-kara__line.is-later { font-size: clamp(.95rem, 2.6vw, 2rem); opacity: .32; }
.mus-kara__w { --p: 0; background: linear-gradient(90deg, #ffd166 calc(var(--p) * 100%), rgba(255,255,255,.92) calc(var(--p) * 100%)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.is-now .mus-kara__w { filter: drop-shadow(0 3px 18px rgba(0,0,0,.55)); }
.is-next .mus-kara__w, .is-later .mus-kara__w { background: none; color: #fff; }
.mus-kara__wait { margin: 0; font: 800 clamp(1.6rem, 5vw, 3.6rem)/1 var(--display); letter-spacing: .3em; color: #ffd166; }
.mus-kara__ctl { display: flex; align-items: center; gap: 14px; width: min(900px, 100%); margin: 0 auto; padding: 0 18px max(18px, env(safe-area-inset-bottom)); }
.mus-kara__pp { width: 58px; height: 58px; background: var(--grad-cta); }
.mus-kara__pp svg { width: 26px; height: 26px; }
.mus-kara__seek { display: flex; flex: 1; align-items: center; gap: 10px; font-size: 13px; font-variant-numeric: tabular-nums; }
.mus-kara__seek input { flex: 1; min-width: 0; accent-color: #ffd166; }
/* темп, тон, громкость */
.mus-kara { grid-template-rows: auto minmax(0, 1fr) auto auto; }
.mus-kara__ctl { padding-bottom: 10px; }
.mus-kara__tune { position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 18px; width: min(900px, 100%); margin: 0 auto; padding: 0 18px max(16px, env(safe-area-inset-bottom)); }
.mus-kara__knob { display: inline-flex; align-items: center; gap: 4px; padding: 3px; border-radius: 999px; background: rgba(0,0,0,.35); border: 1px solid rgba(255,255,255,.14); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.mus-kara__knob small { padding: 0 6px 0 10px; font-size: 12.5px; opacity: .75; }
.mus-kara__knob button { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,.1); color: #fff; font-size: 20px; line-height: 1; }
.mus-kara__knob button:hover { background: rgba(255,255,255,.2); }
.mus-kara__knob b { min-width: 46px; text-align: center; font: 700 15px/1 var(--display); font-variant-numeric: tabular-nums; }
.mus-kara.is-tuned .mus-kara__knob b { color: #ffd166; }
.mus-kara__vol { min-width: 150px; }
/* оформление из файла KFN */
.mus-kara__img { position: absolute; inset: 0; background: center / cover no-repeat; filter: brightness(.55); }
.mus-kara__video.is-kfn { object-fit: contain; background: #000; filter: brightness(.8); }
.mus-kara.is-kfn .mus-kara__line { font-family: var(--kara-font, var(--display)); font-weight: 700; letter-spacing: 0; }
.mus-kara.is-kfn .mus-kara__line.is-now { font-size: calc(clamp(1.6rem, 5.4vw, 4.6rem) * var(--kara-k, 1)); }
.mus-kara.is-kfn .mus-kara__w { background-image: linear-gradient(90deg, var(--kara-on, #ffd166) calc(var(--p) * 100%), var(--kara-off, rgba(255,255,255,.92)) calc(var(--p) * 100%)); }
.mus-kara.is-kfn .is-next .mus-kara__w, .mus-kara.is-kfn .is-later .mus-kara__w { background: none; color: var(--kara-off, #fff); }
.mus-kara.kara-frame .is-now .mus-kara__w { filter: drop-shadow(1.5px 0 0 var(--kara-frame, #000)) drop-shadow(-1.5px 0 0 var(--kara-frame, #000)) drop-shadow(0 1.5px 0 var(--kara-frame, #000)) drop-shadow(0 -1.5px 0 var(--kara-frame, #000)); }
.mus-kara.kara-frame .is-next .mus-kara__w, .mus-kara.kara-frame .is-later .mus-kara__w { text-shadow: 1px 0 0 var(--kara-frame, #000), -1px 0 0 var(--kara-frame, #000), 0 1px 0 var(--kara-frame, #000), 0 -1px 0 var(--kara-frame, #000); }
.mus-kara.kara-shadow .is-now .mus-kara__w { filter: drop-shadow(2px 3px 2px var(--kara-frame, #000)); }
.mus-kara.kara-shadow .is-next .mus-kara__w, .mus-kara.kara-shadow .is-later .mus-kara__w { text-shadow: 2px 3px 2px var(--kara-frame, #000); }
/* свёрнутое караоке — на паузе, окошко внизу */
.mus-kmini { position: fixed; left: 12px; right: 12px; bottom: calc(84px + env(safe-area-inset-bottom)); z-index: 1250; display: flex; align-items: center; gap: 10px; max-width: 440px; margin: 0 auto; padding: 8px 8px 8px 10px; border: 1px solid rgba(255,209,102,.35); border-radius: 18px; background: rgba(20,14,10,.94); color: #fff; box-shadow: 0 14px 40px rgba(0,0,0,.45); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); animation: soc-fade .2s ease-out; }
.mus-kmini__go { display: grid; place-items: center; flex: none; width: 46px; height: 46px; border-radius: 50%; background: var(--grad-cta); color: #1a0f08; }
.mus-kmini__go svg { width: 22px; height: 22px; }
.mus-kmini__t { display: grid; flex: 1; min-width: 0; gap: 2px; padding: 0; background: none; color: inherit; text-align: left; }
.mus-kmini__t b { overflow: hidden; font-size: 14.5px; text-overflow: ellipsis; white-space: nowrap; }
.mus-kmini__t span { overflow: hidden; font-size: 12.5px; opacity: .72; text-overflow: ellipsis; white-space: nowrap; }
.mus-kmini__x { flex: none; width: 40px; height: 40px; border-radius: 12px; background: rgba(255,255,255,.08); color: #fff; font-size: 22px; line-height: 1; }
@media (min-width: 861px) { .mus-kmini { left: auto; right: 24px; bottom: 96px; width: 400px; } }

.mus-albums { margin: 6px 0 18px; }
.mus-albums--empty { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 16px; border: 1px dashed var(--mg-border); border-radius: 14px; }
.mus-albums--empty p { margin: 0; }
.mus-albums--empty svg, .mus-albums__head svg, .mus-am__new svg { width: 16px; height: 16px; }
.mus-albums__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.mus-albums__head .soc-sub { margin: 0; }
.mus-albums__row { display: grid; grid-auto-flow: column; grid-auto-columns: 180px; gap: 16px; overflow-x: auto; padding-bottom: 8px; scrollbar-width: thin; }
.mus-album { display: grid; gap: 8px; padding: 0; text-align: left; color: inherit; }
.mus-album__cover { position: relative; display: block; aspect-ratio: 1; border-radius: 16px; overflow: hidden; background: linear-gradient(135deg, #2a1d12, #15110d); color: var(--mg-gold); box-shadow: 0 10px 26px rgba(0,0,0,.35); }
.mus-album__play { position: absolute; left: 50%; top: 46%; transform: translate(-50%, -50%); width: 52px; height: 52px; border: 0; border-radius: 50%; background: rgba(0,0,0,.55); color: #fff; display: grid; place-items: center; }
.mus-album__play svg { width: 22px; height: 22px; }
.mus-album__more { position: absolute; top: 8px; right: 8px; z-index: 2; }
.mus-album__more .soc-icon-btn { background: rgba(0,0,0,.45); color: #fff; }
.mus-album__stat { position: absolute; left: 8px; right: 8px; bottom: 8px; color: #fff; font-size: 12px; text-shadow: 0 1px 2px #000; }
.mus-album__title { border: 0; background: transparent; color: inherit; font: 700 15px/1.25 inherit; text-align: left; padding: 0 2px; }
.mus-album__mv { display: flex; justify-content: center; gap: 8px; }
.mus-am__find { margin-top: 8px; }
.mus-am__q { width: 100%; box-sizing: border-box; height: 40px; padding: 0 12px; border-radius: 10px; border: 1px solid rgba(212,161,75,.35); background: #241c16; color: #f6e6c5; }
.mus-am__hits { display: grid; gap: 4px; margin-top: 6px; }
.mus-am__hits button { text-align: left; padding: 8px 10px; border-radius: 8px; border: 0; background: #2c241c; color: #f6e6c5; }
.mus-am__add { background: #241c16; color: #f6e6c5; }
.mus-copy__ch { display: block; width: 100%; margin: 8px 0; text-align: left; }
.chn-page { position: fixed; inset: 0; z-index: 1600; overflow: auto; background: #120e0b; color: #f6e6c5; padding: 16px 16px 40px; }
.chn-page__bar { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.chn-page__bar h2 { flex: 1; margin: 0; font-size: 1.25rem; }
.chn-page__text { width: 100%; min-height: 42vh; box-sizing: border-box; padding: 14px; border-radius: 12px; border: 1px solid rgba(212,161,75,.28); background: #1b1511; color: inherit; font: inherit; font-size: 16px; }
.chn-new { margin-bottom: 12px; }
.mus-album__cover img { width: 100%; height: 100%; object-fit: cover; }
.mus-album:hover .mus-album__cover, .mus-album.is-open .mus-album__cover { transform: translateY(-3px); box-shadow: 0 0 0 2px var(--mg-amber), 0 14px 30px rgba(0,0,0,.45); }
.mus-album__pin { position: absolute; left: 8px; top: 8px; padding: 2px 8px; border-radius: 999px; background: var(--grad-cta); color: var(--mg-ink); font: 700 11px/18px var(--body); font-style: normal; }
.mus-album b { color: var(--mg-hi); font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mus-album small { color: var(--mg-muted); font-size: 12px; }
.mus-album__list { margin-top: 12px; padding: 12px; border: 1px solid var(--mg-border); border-radius: 16px; background: rgba(255,255,255,.02); }
.mus-album__bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.mus-album__bar b { color: var(--mg-hi); font: 700 1.05rem/1.2 var(--display); }
.mus-album__bar svg { width: 16px; height: 16px; }
.mus-am { width: min(640px, 100%); max-height: calc(100dvh - 32px); overflow-y: auto; }
.mus-am__lead { margin: -4px 0 14px; font-size: 13.5px; line-height: 1.45; }
.mus-am__alb { display: grid; gap: 8px; margin-bottom: 12px; padding: 12px; border: 1px solid var(--mg-border); border-radius: 14px; }
.mus-am__top { display: flex; align-items: center; gap: 6px; }
.mus-am__name { flex: 1; min-width: 0; height: 40px; padding: 0 12px; border: 1px solid var(--mg-border); border-radius: 10px; background: transparent; color: var(--mg-hi); font: inherit; font-weight: 600; }
.mus-am__name:focus { border-color: var(--mg-amber); outline: none; }
.mus-am__pin { display: inline-flex; align-items: center; gap: 5px; padding: 0 6px; color: var(--mg-muted); font-size: 12.5px; white-space: nowrap; }
.mus-am__pin input { accent-color: var(--mg-amber); }
.mus-am__btn { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid var(--mg-border); border-radius: 9px; color: var(--mg-ivory); font-size: 15px; flex-shrink: 0; }
.mus-am__btn:hover:not([disabled]) { border-color: var(--mg-amber); }
.mus-am__btn[disabled] { opacity: .3; }
.mus-am__btn svg { width: 14px; height: 14px; }
.mus-album__ord { display: flex; align-items: center; gap: 6px; }
.mus-album__ord > :first-child { flex: 1; min-width: 0; }
.mus-album__mv { display: flex; gap: 4px; flex-shrink: 0; }
.mus-album__mv .mus-am__btn { color: inherit; background: transparent; cursor: pointer; }
.mus-am__btn--del:hover:not([disabled]) { border-color: #c8402a; color: #ffb3a5; }
.mus-am__tracks { display: grid; gap: 4px; margin: 0; padding: 0 0 0 22px; }
.mus-am__tracks li { color: var(--mg-copy); font-size: 13.5px; }
.mus-am__tracks li > * { vertical-align: middle; }
.mus-am__tracks li span { display: inline-block; width: calc(100% - 118px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mus-am__tracks .mus-am__btn { display: inline-grid; width: 28px; height: 28px; margin-left: 4px; }
.mus-am__add { height: 38px; padding: 0 10px; border: 1px dashed var(--mg-border); border-radius: 10px; background: transparent; color: var(--mg-ivory); font: inherit; font-size: 13.5px; }
.mus-am__add option { background: #15110d; }
@media (max-width: 520px) {
  .mus-am__top { flex-wrap: wrap; }
  .mus-am__name { flex-basis: 100%; }
  .mus-albums__row { grid-auto-columns: 124px; }
  .mus-act { padding: 8px 11px; font-size: 13px; }
}

/* ── ГРАНА: лежит на баннерах, чат поверх страницы ─────────────────────── */
.grana-visitor {
  --gv-size: 92px;
  position: absolute;
  z-index: 40;
  left: 0;
  top: 0;
  width: var(--gv-size);
  height: var(--gv-size);
  opacity: 0;
  pointer-events: none;
  user-select: none;
  transition: opacity .3s ease, width .35s var(--ease), height .35s var(--ease);
}
.grana-visitor.is-visible { opacity: 1; }
.grana-visitor.is-corner { position: fixed; z-index: 150; }
.grana-visitor__motion {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: block;
  transform-origin: 50% 82%;
}
.grana-visitor__frame,
.grana-visitor__laugh {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform-origin: 50% 82%;
  -webkit-user-drag: none;
  transition: opacity .18s ease;
}
.grana-visitor__laugh { opacity: 0; transform: scale(1.17); }
.grana-visitor::after {
  content: "";
  position: absolute;
  z-index: 0;
  left: 18%;
  top: 79%;
  width: 66%;
  height: 9%;
  border-radius: 50%;
  background: rgba(0, 0, 0, .42);
  filter: blur(4px);
}
.grana-visitor.is-corner::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 4%;
  right: 0;
  top: 80%;
  height: 16%;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(46, 34, 20, .95), rgba(20, 15, 10, .95));
  border: 1px solid rgba(212, 161, 75, .4);
  box-shadow: 0 8px 22px rgba(0, 0, 0, .35), 0 0 16px rgba(242, 138, 45, .14);
}
.grana-visitor__hit {
  position: absolute;
  z-index: 3;
  left: 11%;
  top: 27%;
  width: 79%;
  height: 58%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 46%;
  background: transparent;
  pointer-events: auto;
  cursor: pointer;
}
.grana-visitor__hit:focus-visible { outline: 2px solid rgba(255, 190, 83, .92); outline-offset: 3px; }
.grana-visitor__tip {
  position: absolute;
  z-index: 4;
  right: 62%;
  top: 8%;
  padding: 5px 10px;
  border-radius: 12px 12px 2px 12px;
  background: var(--grad-cta);
  color: var(--mg-ink);
  font: 700 11px/1.1 var(--display);
  letter-spacing: .04em;
  white-space: nowrap;
  opacity: 0;
  transform: translateY(4px) scale(.94);
  transform-origin: 100% 100%;
  transition: opacity .2s ease, transform .2s ease;
  pointer-events: none;
}
.grana-visitor:hover .grana-visitor__tip,
.grana-visitor__hit:focus-visible ~ .grana-visitor__tip { opacity: 1; transform: none; }
.grana-visitor.is-spot .grana-visitor__tip { top: -14%; }
.grana-visitor[data-pose="side"] .grana-visitor__frame { animation: grana-side-breathe 4.8s ease-in-out infinite; }
.grana-visitor[data-pose="belly"] .grana-visitor__frame { animation: grana-belly-breathe 4.2s ease-in-out infinite; }
.grana-visitor.is-landing .grana-visitor__motion { animation: grana-land .7s cubic-bezier(.25, .9, .3, 1.2) both; }
.grana-visitor.is-tickled .grana-visitor__hit { pointer-events: none; }
.grana-visitor.is-tickled .grana-visitor__frame { opacity: 0; }
.grana-visitor.is-tickled .grana-visitor__motion { animation: grana-tickle-body 2.7s cubic-bezier(.2, .72, .25, 1) both; }
.grana-visitor.is-tickled .grana-visitor__laugh--a { animation: grana-laugh-a 2.7s linear both; }
.grana-visitor.is-tickled .grana-visitor__laugh--b { animation: grana-laugh-b 2.7s linear both; }
.grana-visitor.is-recovering .grana-visitor__frame { opacity: 1; }
/* танец при наведении мышки: лента из трёх поз, ноги на месте тени */
.grana-visitor__dance {
  position: absolute;
  left: 50%;
  bottom: 15%;
  height: 112%;
  aspect-ratio: 188 / 260;
  transform: translateX(-50%);
  transform-origin: 50% 100%;
  background: url("grana-dance.webp?v=1") 0 0 / 300% 100% no-repeat;
  opacity: 0;
  pointer-events: none;
  transition: opacity .15s ease;
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .grana-visitor:not(.is-tickled):hover .grana-visitor__frame { opacity: 0; }
  .grana-visitor:not(.is-tickled):hover .grana-visitor__dance { opacity: 1; animation: grana-dance-pose 1.2s infinite, grana-dance-hop .6s ease-in-out infinite; }
}
@keyframes grana-dance-pose {
  0%, 24.9% { background-position: 0 0; }
  25%, 49.9% { background-position: 50% 0; }
  50%, 74.9% { background-position: 100% 0; }
  75%, 100% { background-position: 50% 0; }
}
@keyframes grana-dance-hop {
  0%, 100% { transform: translateX(-50%) translateY(0) rotate(-4deg) scale(1.02, .98); }
  50% { transform: translateX(-50%) translateY(-7%) rotate(4deg) scale(.98, 1.03); }
}
@keyframes grana-land {
  0% { opacity: 0; transform: translateY(-38%) scale(.9); }
  55% { opacity: 1; transform: translateY(2%) scale(1.06, .92); }
  78% { transform: translateY(-3%) scale(.98, 1.03); }
  100% { opacity: 1; transform: none; }
}
@keyframes grana-side-breathe {
  0%, 100% { transform: translateY(0) scale(1); }
  48% { transform: translateY(-1.4px) scale(1.006, .996); }
  56% { transform: translateY(-1.1px) scale(1.004, .998); }
}
@keyframes grana-belly-breathe {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-1.2px) scale(1.004, .997); }
}
@keyframes grana-tickle-body {
  0% { transform: translate3d(0, 0, 0) rotate(0) scale(1); }
  8% { transform: translate3d(0, -2px, 0) rotate(-3deg) scale(1.025, .978); }
  19% { transform: translate3d(1px, 3px, 0) rotate(9deg) scale(.97, 1.035); }
  31% { transform: translate3d(-1px, -1px, 0) rotate(-4deg) scale(1.045, .965); }
  45% { transform: translate3d(1px, 1px, 0) rotate(3deg) scale(.985, 1.025); }
  59% { transform: translate3d(-1px, -1px, 0) rotate(-2.5deg) scale(1.035, .978); }
  73% { transform: translate3d(1px, 1px, 0) rotate(2deg) scale(.99, 1.018); }
  87% { transform: translate3d(-.5px, -.5px, 0) rotate(-1deg) scale(1.014, .99); }
  100% { transform: translate3d(0, 0, 0) rotate(0) scale(1); }
}
@keyframes grana-laugh-a {
  0%, 14% { opacity: 0; }
  22%, 36% { opacity: 1; }
  48%, 57% { opacity: .12; }
  67%, 79% { opacity: 1; }
  89% { opacity: .18; }
  100% { opacity: 1; }
}
@keyframes grana-laugh-b {
  0%, 35% { opacity: 0; }
  46%, 58% { opacity: .92; }
  67%, 78% { opacity: .08; }
  88%, 96% { opacity: .96; }
  100% { opacity: 0; }
}

/* бегущая строка анонсов */
.gr-tick {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 34px;
  margin: 0 0 14px;
  padding: 0 0 0 4px;
  border: 1px solid rgba(212, 161, 75, .2);
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(242, 138, 45, .1), rgba(20, 16, 12, .55) 30%, rgba(20, 16, 12, .55));
  overflow: hidden;
}
.gr-tick__label {
  flex: 0 0 auto;
  padding: 6px 10px;
  border-radius: 999px;
  background: var(--grad-cta);
  color: var(--mg-ink);
  font: 700 10px/1 var(--display);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.gr-tick__track {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 24px, #000 calc(100% - 24px), transparent);
  mask-image: linear-gradient(90deg, transparent, #000 24px, #000 calc(100% - 24px), transparent);
}
.gr-tick__run {
  display: flex;
  width: max-content;
  height: 100%;
  animation: gr-tick var(--dur, 60s) linear infinite;
}
.gr-tick:hover .gr-tick__run,
.gr-tick:focus-within .gr-tick__run { animation-play-state: paused; }
.gr-tick__set { display: flex; align-items: center; height: 100%; }
.gr-tick__item {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 100%;
  padding: 0 6px;
  border: 0;
  background: none;
  color: var(--mg-copy);
  font: 500 13px/1 var(--body, inherit);
  white-space: nowrap;
  cursor: pointer;
  transition: color .2s ease;
}
.gr-tick__item i { font-style: normal; font-size: 14px; }
.gr-tick__item.is-hot { color: var(--mg-amber-lite); font-weight: 600; }
.gr-tick__item:hover span { color: var(--mg-ivory); text-decoration: underline; text-underline-offset: 3px; }
.gr-tick__dot { padding: 0 12px; color: rgba(242, 138, 45, .55); font-weight: 400; }
.gr-tick__spot { flex: 0 0 72px; align-self: stretch; }
@keyframes gr-tick {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* реклама внизу разделов */
.ad-slot { margin: 28px auto 6px; max-width: 900px; }
.ad-slot--foot .sfr { min-height: 0; }

/* чат с Граной */
.gr-chat { position: fixed; inset: 0; z-index: 420; pointer-events: none; }
.gr-chat[hidden] { display: none; }
.gr-chat__scrim {
  position: absolute;
  inset: 0;
  background: rgba(8, 6, 4, .38);
  opacity: 0;
  transition: opacity .22s ease;
  pointer-events: auto;
}
.gr-chat__box {
  position: absolute;
  right: 18px;
  bottom: 18px;
  display: flex;
  flex-direction: column;
  width: min(410px, calc(100vw - 36px));
  height: min(640px, calc(100dvh - 120px));
  border: 1px solid rgba(212, 161, 75, .32);
  border-radius: 22px;
  background: linear-gradient(180deg, #1c1611, #120e0a);
  box-shadow: 0 30px 80px rgba(0, 0, 0, .55), 0 0 30px rgba(242, 138, 45, .12);
  overflow: hidden;
  opacity: 0;
  transform: translateY(18px) scale(.97);
  transform-origin: 100% 100%;
  transition: opacity .22s ease, transform .22s var(--ease);
  pointer-events: auto;
}
.gr-chat.is-open .gr-chat__scrim { opacity: 1; }
.gr-chat.is-open .gr-chat__box { opacity: 1; transform: none; }
.gr-chat__head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 12px 12px 14px;
  border-bottom: 1px solid rgba(212, 161, 75, .16);
  background: radial-gradient(120% 140% at 0% 0%, rgba(242, 138, 45, .2), transparent 60%);
}
.gr-chat__face {
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 40%, rgba(80, 150, 255, .25), rgba(242, 138, 45, .12));
  border: 1px solid rgba(212, 161, 75, .35);
  overflow: hidden;
}
.gr-chat__face img { width: 150%; height: 150%; margin: -12% 0 0 -14%; object-fit: contain; }
.gr-chat__who { flex: 1 1 auto; min-width: 0; display: grid; gap: 3px; }
.gr-chat__who b { color: var(--mg-ivory); font: 700 17px/1 var(--display); letter-spacing: .04em; }
.gr-chat__who small { color: var(--mg-muted); font-size: 12.5px; }
.gr-chat__x {
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(212, 161, 75, .22);
  border-radius: 50%;
  background: rgba(255, 255, 255, .03);
  color: var(--mg-ivory);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.gr-chat__x:hover { background: var(--grad-cta); color: var(--mg-ink); border-color: transparent; }
.gr-chat__log {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px 14px;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.gr-chat__msg { display: flex; align-items: flex-end; gap: 8px; max-width: 92%; }
.gr-chat__msg p {
  margin: 0;
  padding: 10px 13px;
  border-radius: 16px 16px 16px 4px;
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(212, 161, 75, .14);
  color: var(--mg-copy);
  font-size: 14.5px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.gr-chat__msg.is-me { align-self: flex-end; }
.gr-chat__msg.is-me p { border-radius: 16px 16px 4px 16px; background: var(--grad-cta); border-color: transparent; color: var(--mg-ink); }
.gr-chat__ava { flex: 0 0 auto; width: 30px; height: 30px; object-fit: contain; }
.gr-chat__human { margin-top: 8px; }
.gr-chat__msg.is-typing p { display: inline-flex; gap: 4px; padding: 13px 14px; }
.gr-chat__msg.is-typing i { width: 7px; height: 7px; border-radius: 50%; background: var(--mg-amber-lite); animation: gr-dots 1s ease-in-out infinite; }
.gr-chat__msg.is-typing i:nth-child(2) { animation-delay: .15s; }
.gr-chat__msg.is-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes gr-dots { 0%, 100% { opacity: .3; transform: translateY(0); } 50% { opacity: 1; transform: translateY(-3px); } }
.gr-chat__chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 14px 10px; }
.gr-chat__chips[hidden] { display: none; }
.gr-chat__chips button {
  padding: 7px 11px;
  border: 1px solid rgba(212, 161, 75, .3);
  border-radius: 999px;
  background: rgba(255, 255, 255, .03);
  color: var(--mg-copy);
  font-size: 13px;
  cursor: pointer;
}
.gr-chat__chips button:hover { border-color: rgba(242, 138, 45, .6); color: var(--mg-ivory); }
.gr-chat__form {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  padding: 10px 12px calc(12px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid rgba(212, 161, 75, .16);
}
.gr-chat__form textarea {
  flex: 1 1 auto;
  min-height: 44px;
  max-height: 120px;
  padding: 11px 14px;
  border: 1px solid rgba(212, 161, 75, .26);
  border-radius: 22px;
  background: rgba(0, 0, 0, .25);
  color: var(--mg-ivory);
  font: inherit;
  font-size: 15px;
  line-height: 1.4;
  resize: none;
}
.gr-chat__form textarea:focus { outline: none; border-color: rgba(242, 138, 45, .7); }
.gr-chat__send {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: var(--grad-cta);
  color: var(--mg-ink);
  cursor: pointer;
}
@media (max-width: 860px) {
  .gr-tick { height: 32px; margin-bottom: 12px; }
  .gr-tick__label { display: none; }
  .gr-tick__item { font-size: 12.5px; }
  .gr-tick__spot { flex-basis: 58px; }
  .gr-chat__box {
    inset: auto 0 0 0;
    width: 100%;
    height: min(86dvh, calc(100dvh - 40px));
    border-radius: 22px 22px 0 0;
    border-bottom: 0;
    transform: translateY(40px);
  }
}
html.no-anim .gr-tick__run { animation: none; }
html.no-anim .gr-tick__track { overflow-x: auto; }
html.no-anim .grana-visitor__motion, html.no-anim .grana-visitor__frame, html.no-anim .grana-visitor__laugh, html.no-anim .grana-visitor__dance { animation: none !important; }

/* сообщения: кнопка «вниз» и поиск по переписке */
.soc-chat__wrap { position: relative; flex: 1; min-height: 0; display: flex; flex-direction: column; }
.soc-chat__down { position: absolute; right: 16px; bottom: 14px; z-index: 4; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; border: 1px solid rgba(242,138,45,.45); background: rgba(28,18,12,.94); color: #ffd29a; box-shadow: 0 8px 22px rgba(0,0,0,.45); cursor: pointer; transition: transform .15s ease, background .15s ease; }
.soc-chat__down[hidden] { display: none; }
.soc-chat__down:hover { background: #3a2412; transform: translateY(-1px); }
.soc-chat__down svg { width: 22px; height: 22px; }
.soc-chat__down i { position: absolute; top: -6px; right: -4px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px; background: var(--mg-amber, #f28a2d); color: #1a0d03; font: 700 11px/20px system-ui, sans-serif; font-style: normal; text-align: center; }
.soc-chat__down i[hidden] { display: none; }
.soc-icon-btn.is-on { color: var(--mg-amber, #f28a2d); background: rgba(242,138,45,.12); }
.soc-find { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-bottom: 1px solid rgba(212,161,75,.14); background: rgba(242,138,45,.04); }
.soc-find__ico { display: grid; color: var(--mg-copy, #cdbca3); }
.soc-find__ico svg { width: 18px; height: 18px; }
.soc-find input { flex: 1; min-width: 0; height: 38px; padding: 0 12px; border-radius: 10px; border: 1px solid rgba(212,161,75,.28); background: rgba(0,0,0,.25); color: inherit; font: inherit; font-size: 15px; }
.soc-find input:focus { outline: none; border-color: rgba(242,138,45,.7); }
.soc-find__res { max-height: min(46vh, 360px); overflow-y: auto; border-bottom: 1px solid rgba(212,161,75,.14); }
.soc-find__res:empty { display: none; }
.soc-find__note { margin: 0; padding: 8px 14px; color: var(--mg-muted, #9c8f7c); font-size: 13px; }
.soc-find__it { display: grid; gap: 3px; width: 100%; padding: 9px 14px; border: 0; border-top: 1px solid rgba(212,161,75,.08); background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.soc-find__it:hover, .soc-find__it:focus-visible { background: rgba(242,138,45,.08); outline: none; }
.soc-find__meta { display: flex; justify-content: space-between; gap: 10px; font-size: 12px; color: var(--mg-muted, #9c8f7c); }
.soc-find__meta b { color: var(--mg-copy, #e9dcc6); font-weight: 600; }
.soc-find__txt { font-size: 14px; line-height: 1.35; color: var(--mg-hi, #fbeedd); overflow-wrap: anywhere; }
.soc-find__txt mark { background: rgba(242,184,75,.35); color: inherit; border-radius: 3px; padding: 0 1px; }

/* пульт: режимы пэдов, экран гостей */
.dk-padmodes { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 10px; }
.dk-padmodes__deck { display: inline-flex; align-items: center; gap: 4px; margin-left: auto; font-size: 12px; color: var(--muted, #a3a3ad); }
.dk-padmodes__deck[hidden] { display: none; }
.dk-pad--hot, .dk-pad--loop, .dk-pad--jump, .dk-pad--stem { border-color: rgba(255,255,255,.16); background: linear-gradient(160deg, rgba(255,255,255,.07), rgba(255,255,255,.02)); }
.dk-pad--hot.is-set { border-color: #ff5a7a; background: linear-gradient(160deg, rgba(255,90,122,.32), rgba(255,90,122,.10)); }
.dk-pad--loop.is-set { border-color: #4cc98c; background: linear-gradient(160deg, rgba(76,201,140,.32), rgba(76,201,140,.10)); }
.dk-pad--jump { border-color: rgba(90,184,255,.4); }
.dk-pad--stem.is-set { border-color: #f8b45a; background: linear-gradient(160deg, rgba(248,180,90,.32), rgba(248,180,90,.10)); }
.dk-btn.is-hit, .dk-chip.is-hit { animation: dk-hit .22s ease-out; }
.dk-btn--cue.is-set { background: rgba(255,207,90,.14); }
.dk-chip[data-dk="loop-n"].is-on, .dk-chip[data-dk="loop-out"].is-on { background: rgba(76,201,140,.18); border-color: rgba(76,201,140,.7); color: #7be3b0; }
.dk-preview { position: relative; aspect-ratio: 16 / 9; margin-bottom: 4px; border-radius: 12px; overflow: hidden; background: #07040a; border: 1px solid var(--mg-border, rgba(255,255,255,.12)); }
.dk-preview iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; pointer-events: none; }
.dk-preview__tag { margin: 0 0 10px; font-size: 11px; color: var(--muted, #a3a3ad); }
.dk-scrtools { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 6px; margin-bottom: 8px; }
.dk-scrtool { display: grid; gap: 3px; flex: 1 1 160px; min-width: 0; font-size: 11px; color: var(--muted, #a3a3ad); }
.dk-scrtool--sm { flex: 0 0 86px; }
.dk-scrtool input { min-width: 0; height: 30px; padding: 0 8px; border-radius: 9px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); background: rgba(255,255,255,.04); color: inherit; font: inherit; font-size: 13px; }
.dk-scrtools__left { min-width: 40px; font: 800 14px/28px var(--body, system-ui); font-variant-numeric: tabular-nums; color: #ffcf5a; }

/* == chat-react == */
.soc-msg.is-picked .soc-msg__bubble { box-shadow: 0 0 0 2px rgba(255, 176, 98, .55); }
.soc-msg__bubble { cursor: pointer; }
.chr-bar { position: fixed; z-index: 1200; display: flex; flex-direction: column; gap: 6px; padding: 6px; border: 1px solid var(--mg-border); border-radius: 18px; background: #15120f; box-shadow: 0 18px 40px rgba(0,0,0,.55); animation: chr-in .14s ease-out; max-width: calc(100vw - 16px); }
.chr-bar__emo { display: flex; gap: 2px; }
.chr-bar__emo button, .chr-pick__grid button { display: grid; place-items: center; width: 40px; height: 40px; border: 0; border-radius: 12px; background: none; font-size: 24px; line-height: 1; cursor: pointer; transition: transform .12s, background .12s; }
.chr-bar__emo button:hover, .chr-pick__grid button:hover { background: rgba(212,161,75,.14); transform: scale(1.15); }
.chr-bar__plus { color: var(--mg-ivory); font-size: 22px !important; font-weight: 700; background: rgba(212,161,75,.12) !important; }
.chr-bar__acts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; border-top: 1px solid rgba(212,161,75,.14); padding-top: 6px; }
.chr-bar__acts button.is-danger { color: #ff7a6b; }
html[data-theme="light"] .chr-bar__acts button.is-danger { color: #c8371f; }
.chr-bar__acts button { min-width: 0; padding: 8px 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border: 0; border-radius: 10px; background: rgba(212,161,75,.08); color: var(--mg-ivory); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.chr-bar__acts button:hover { background: rgba(212,161,75,.18); }
@keyframes chr-in { from { opacity: 0; transform: translateY(6px) scale(.97); } to { opacity: 1; transform: none; } }
.chr-pick { position: fixed; z-index: 1201; display: flex; flex-direction: column; width: 360px; max-width: calc(100vw - 16px); height: 380px; max-height: 70vh; border: 1px solid var(--mg-border); border-radius: 18px; background: #15120f; box-shadow: 0 18px 40px rgba(0,0,0,.6); overflow: hidden; animation: chr-in .14s ease-out; }
.chr-pick__head { display: flex; align-items: center; justify-content: space-between; padding: 8px 8px 4px 14px; }
.chr-pick__head b { font-size: 15px; }
.chr-pick__head .soc-icon-btn { font-size: 22px; }
.chr-pick__tabs { display: flex; gap: 2px; padding: 0 8px 6px; border-bottom: 1px solid rgba(212,161,75,.14); overflow-x: auto; }
.chr-pick__tabs button { flex: 0 0 auto; width: 40px; height: 36px; border: 0; border-radius: 10px; background: none; font-size: 20px; cursor: pointer; }
.chr-pick__tabs button:hover { background: rgba(212,161,75,.14); }
.chr-pick__body { flex: 1; overflow-y: auto; padding: 4px 8px 10px; position: relative; }
.chr-pick__body h3 { margin: 10px 4px 4px; font-size: 12px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: var(--mg-muted); }
.chr-pick__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(40px, 1fr)); gap: 2px; }
@media (max-width: 640px) {
  .chr-pick { left: 0 !important; right: 0; bottom: 0; top: auto !important; width: 100%; max-width: none; height: 62vh; border-radius: 18px 18px 0 0; padding-bottom: env(safe-area-inset-bottom, 0px); }
}
.chr-chips { display: flex; flex-wrap: wrap; gap: 4px; margin: 4px 0 0; }
.soc-msg.is-mine .chr-chips { justify-content: flex-end; }
.chr-chip { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border: 1px solid rgba(212,161,75,.25); border-radius: 999px; background: rgba(34,28,22,.9); color: var(--mg-ivory); font: inherit; font-size: 13px; cursor: pointer; }
.chr-chip span { font-size: 16px; line-height: 1.3; }
.chr-chip i { font-style: normal; font-weight: 700; font-size: 12px; }
.chr-chip.is-mine { border-color: var(--mg-amber, #f28a2d); background: rgba(242,138,45,.22); }
.chr-quote { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; width: 100%; margin: 0 0 6px; padding: 4px 8px; border: 0; border-left: 3px solid var(--mg-amber, #f28a2d); border-radius: 6px; background: rgba(0,0,0,.22); color: inherit; font: inherit; text-align: left; cursor: pointer; }
.chr-quote b { font-size: 12px; font-weight: 700; color: var(--mg-amber-lite, #ffb062); }
.chr-quote span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 13px; opacity: .85; }
.soc-msg.is-mine .chr-quote { border-left-color: #ffd9a0; }
.soc-msg.is-mine .chr-quote b { color: #ffd9a0; }
.chr-edited { font-style: italic; opacity: .8; }
.chr-ctx { display: flex; align-items: center; gap: 10px; padding: 8px 12px 0; }
.chr-ctx__ico { font-size: 18px; color: var(--mg-amber-lite, #ffb062); }
.chr-ctx__body { flex: 1; min-width: 0; display: flex; flex-direction: column; padding-left: 10px; border-left: 3px solid var(--mg-amber, #f28a2d); }
.chr-ctx__body b { font-size: 13px; color: var(--mg-amber-lite, #ffb062); }
.chr-ctx__body span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 13px; color: var(--mg-muted); }
.chr-ctx .soc-icon-btn { font-size: 22px; }
.soc-av--saved { display: inline-grid; place-items: center; background: linear-gradient(135deg, #f28a2d, #c4581a); color: #fff3e0; }
.soc-av--saved svg { width: 52%; height: 52%; }
.toast.is-link.is-on { pointer-events: auto; cursor: pointer; }
/* == end chat-react == */

/* == m4-footer-bell == */
.site-legal__more > summary { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid rgba(246, 230, 197, 0.14); border-radius: 999px; list-style: none; cursor: pointer; font-weight: 600; color: var(--mg-muted, rgba(246, 230, 197, 0.6)); }
.site-legal__more > summary::-webkit-details-marker { display: none; }
.site-legal__more > summary::after { content: "▾"; font-size: 11px; transition: transform .15s; }
.site-legal__more[open] > summary { margin-bottom: 10px; }
.site-legal__more[open] > summary::after { transform: rotate(180deg); }
.site-legal { margin-top: 32px; }
@media (max-width: 900px) {
  /* только html: у body overflow-y:auto без запаса хода, и с none на нём палец не листает страницу */
  html.is-msgs-page { overscroll-behavior-y: none; }
  html.is-msgs-page .main { padding-bottom: 0; }
}
@media (max-width: 640px) {
  #notif-dd, #theme-dd { position: fixed; left: 8px; right: 8px; top: calc(var(--nav-h, 56px) + 6px + env(safe-area-inset-top, 0px)); width: auto; max-height: calc(100dvh - var(--nav-h, 56px) - 84px); overflow-y: auto; }
}
/* == end m4-footer-bell == */

/* == mini-chat == */
.mc { position: fixed; right: 18px; bottom: 0; z-index: 900; font-size: 14px; }
.mc[hidden] { display: none; }
.mc-tab { display: flex; align-items: center; gap: 2px; padding: 4px 4px 4px 6px; border: 1px solid var(--mg-border); border-bottom: 0; border-radius: 14px 14px 0 0; background: #15120f; box-shadow: 0 -8px 30px rgba(0,0,0,.45); }
.mc-tab__open { display: inline-flex; align-items: center; gap: 8px; padding: 8px 10px; border: 0; border-radius: 10px; background: none; color: var(--mg-ivory); font: inherit; font-weight: 700; cursor: pointer; }
.mc-tab__open:hover { background: rgba(212,161,75,.1); }
.mc-badge { min-width: 20px; padding: 1px 6px; border-radius: 999px; background: var(--grad-cta, #f28a2d); color: var(--mg-ink, #120c06); font-style: normal; font-size: 12px; font-weight: 700; text-align: center; }
.mc-badge[hidden] { display: none; }
.mc-ico { display: inline-grid; place-items: center; width: 32px; height: 32px; flex: 0 0 auto; border: 0; border-radius: 8px; background: none; color: var(--mg-muted); cursor: pointer; }
.mc-ico:hover { background: rgba(212,161,75,.12); color: var(--mg-ivory); }
.mc.is-open { width: 340px; height: min(480px, calc(100vh - 120px)); display: flex; flex-direction: column; border: 1px solid var(--mg-border); border-bottom: 0; border-radius: 16px 16px 0 0; background: #15120f; box-shadow: 0 -10px 40px rgba(0,0,0,.55); overflow: hidden; animation: chr-in .16s ease-out; }
.mc-head { display: flex; align-items: center; gap: 2px; padding: 6px 6px 6px 12px; border-bottom: 1px solid rgba(212,161,75,.14); }
.mc-head b { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 15px; }
.mc-head .mc-ico:first-child { margin-left: -6px; }
.mc-list { flex: 1; overflow-y: auto; padding: 4px; }
.mc-row { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px; border: 0; border-radius: 10px; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.mc-row:hover { background: rgba(212,161,75,.08); }
.mc-rowwrap { position: relative; }
.mc-rowwrap .mc-row { padding-right: 34px; }
.mc-row__hide { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 50%; background: none; color: var(--mg-muted); cursor: pointer; opacity: 0; transition: opacity .15s, background .15s; }
.mc-row__hide svg { width: 14px; height: 14px; }
.mc-rowwrap:hover .mc-row__hide, .mc-row__hide:focus-visible { opacity: 1; }
.mc-row__hide:hover { background: rgba(212,161,75,.16); color: var(--mg-ivory); }
.mc-rowwrap .mc-badge { margin-right: 4px; }
.mc-rowwrap:hover .mc-badge { visibility: hidden; }
.mc-row__tag { margin-left: 4px; padding: 0 5px; border-radius: 6px; background: rgba(212,161,75,.16); color: var(--mg-amber); font-size: 11px; font-weight: 600; }
.mc-row__body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.mc-row__body b { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.mc-row__body span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--mg-muted); font-size: 13px; }
.mc-row.is-unread .mc-row__body span { color: var(--mg-ivory); }
.mc-av { display: inline-grid; place-items: center; width: 38px; height: 38px; flex: 0 0 auto; border-radius: 50%; overflow: hidden; background: #2a2219; color: var(--mg-ivory); font-size: 13px; }
.mc-av img { width: 100%; height: 100%; object-fit: cover; }
.mc-av--pub { background: rgba(212,161,75,.18); font-size: 19px; line-height: 1; }
.mc-av--saved { background: linear-gradient(135deg, #f28a2d, #c4581a); color: #fff3e0; font-size: 18px; }
.mc-empty { padding: 18px 14px; color: var(--mg-muted); text-align: center; }
.mc-box { flex: 1; overflow-y: auto; padding: 10px 10px 4px; display: flex; flex-direction: column; gap: 6px; }
.mc-msg { display: flex; flex-direction: column; align-items: flex-start; max-width: 86%; }
.mc-msg.is-mine { align-self: flex-end; align-items: flex-end; }
.mc-bubble { display: flex; flex-direction: column; gap: 4px; padding: 6px 10px 4px; border-radius: 14px 14px 14px 4px; background: #221c16; line-height: 1.4; overflow-wrap: anywhere; }
.mc-msg.is-mine .mc-bubble { border-radius: 14px 14px 4px 14px; background: linear-gradient(135deg, #8a4a17, #6b3a12); color: #fff3e0; }
.mc-bubble time { align-self: flex-end; font-size: 10px; opacity: .6; }
.mc-author { font-style: normal; font-size: 12px; font-weight: 700; color: var(--mg-amber-lite, #ffb062); }
.mc-text { white-space: pre-wrap; }
.mc-img { display: block; max-width: 100%; max-height: 180px; border-radius: 10px; object-fit: cover; }
.mc-att { font-size: 12px; opacity: .85; }
.mc-re { margin-top: 2px; font-size: 13px; }
.mc-sys { align-self: center; font-size: 12px; color: var(--mg-muted); }
.mc-form { display: flex; align-items: flex-end; gap: 6px; padding: 8px; border-top: 1px solid rgba(212,161,75,.14); }
.mc-form textarea { flex: 1; min-width: 0; max-height: 100px; padding: 8px 12px; border: 1px solid var(--mg-border); border-radius: 18px; background: rgba(7,7,6,.6); color: inherit; font: inherit; resize: none; }
.mc-send { display: grid; place-items: center; width: 36px; height: 36px; flex: 0 0 auto; border: 0; border-radius: 50%; background: var(--grad-cta); color: var(--mg-ink); cursor: pointer; }
/* == end mini-chat == */

/* == channel-tabs == */
.tabs--channel { gap: 8px; padding-top: 2px; }
.tabs--channel .tab { min-height: 40px; padding: 0 16px; border: 1px solid var(--mg-border); background: rgba(212, 161, 75, 0.05); color: var(--mg-ivory); font-family: inherit; font-size: 14px; font-weight: 700; line-height: 1; letter-spacing: 0; text-transform: none; transition: background .15s, border-color .15s; }
.tabs--channel .tab:hover { background: rgba(212, 161, 75, 0.12); border-color: rgba(212, 161, 75, 0.45); }
.tabs--channel .tab.is-active { background: var(--grad-cta); border-color: transparent; color: var(--mg-ink, #120c06); }
.tabs--channel .tab.is-active .tab__n { opacity: .75; }
.channel-gear { display: inline-grid; place-items: center; width: 42px; height: 42px; border: 1px solid var(--mg-border); border-radius: 12px; color: var(--mg-ivory); }
.channel-gear:hover { background: rgba(212, 161, 75, 0.12); }
.channel-gear svg { transition: transform .3s; }
.channel-gear:hover svg { transform: rotate(60deg); }
/* == end channel-tabs == */

/* == video-proc == */
.vproc { margin: 0 0 16px; padding: 14px; border: 1px solid rgba(242, 138, 45, 0.45); border-radius: 16px; background: linear-gradient(135deg, rgba(242, 138, 45, 0.12), rgba(16, 14, 11, 0.6)); }
.vproc__title { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-size: 16px; }
.vproc__title span { min-width: 22px; padding: 1px 8px; border-radius: 999px; background: var(--grad-cta); color: var(--mg-ink, #120c06); font-size: 12px; text-align: center; }
.vproc__row { display: flex; align-items: center; gap: 12px; padding: 8px 0; border-top: 1px solid rgba(212, 161, 75, 0.14); }
.vproc__row:first-of-type { border-top: 0; }
.vproc__thumb { flex: 0 0 auto; width: 88px; aspect-ratio: 16 / 9; border-radius: 8px; background: #221c16 center / cover no-repeat; }
.vproc__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.vproc__body b { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.vproc__body em { font-style: normal; font-size: 12px; color: var(--mg-muted); }
.vproc__state { flex: 0 0 auto; padding: 4px 10px; border-radius: 999px; background: rgba(242, 138, 45, 0.18); color: var(--mg-amber-lite, #ffb062); font-size: 13px; font-weight: 700; white-space: nowrap; }
.vproc__row.is-err .vproc__state { background: rgba(220, 70, 50, 0.18); color: #ff8a7a; }
@media (max-width: 640px) {
  .vproc__row { flex-wrap: wrap; }
  .vproc__thumb { width: 72px; }
  .vproc__body { flex-basis: calc(100% - 90px); }
}
/* == end video-proc == */

/* == search-rows == */
.srows { display: grid; gap: 22px; margin: 6px 0 24px; }
.srow { min-width: 0; }
.srow__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.srow__head h3 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 18px; }
.srow__head h3 span { padding: 1px 8px; border-radius: 999px; background: rgba(212, 161, 75, 0.14); color: var(--mg-muted); font-size: 12px; font-weight: 600; }
.srow__empty { padding: 6px 0; }
.srow__track { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
.srow__track > * { flex: 0 0 220px; scroll-snap-align: start; min-width: 0; }
.srow__track--video > * { flex-basis: 280px; }
.srow__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
.srow-tile { display: flex; flex-direction: column; gap: 6px; color: inherit; text-decoration: none; }
.srow-tile__cover { display: block; aspect-ratio: 16 / 10; border-radius: 12px; overflow: hidden; background: #221c16; }
.srow-tile__cover > * { width: 100%; height: 100%; object-fit: cover; }
.srow-tile b { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 14px; line-height: 1.3; }
.srow-tile span:last-child { font-size: 12px; color: var(--mg-muted); }
.srow-tile:hover b { color: var(--mg-amber-lite, #ffb062); }
@media (max-width: 640px) {
  .srow__track > * { flex-basis: 70%; }
  .srow__track--video > * { flex-basis: 82%; }
}
/* == end search-rows == */

/* == calls-kick-rejoin == */
.gc-tile__net { position: absolute; top: 10px; left: 10px; z-index: 2; max-width: calc(100% - 60px); padding: 4px 10px; border-radius: 999px; background: rgba(224,72,58,.88); color: #fff; font-size: 12px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; animation: gc-blink 1.6s ease-in-out infinite; }
.gc-tile.is-weak { border-color: rgba(224,72,58,.55); }
.gc-tile__kick { position: absolute; top: 8px; right: 8px; z-index: 2; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: rgba(8,7,6,.62); color: #ffd9d3; cursor: pointer; opacity: 0; transition: opacity .15s, background .15s; }
.gc-tile__kick svg { width: 16px; height: 16px; }
.gc-tile:hover .gc-tile__kick, .gc-tile__kick:focus-visible { opacity: 1; }
.gc-tile__kick:hover { background: #e0483a; color: #fff; }
@media (hover: none) { .gc-tile__kick { opacity: .9; } }
.gc-reqs { display: grid; gap: 8px; margin-bottom: 10px; }
.gc-req { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 14px; background: rgba(242,138,45,.14); border: 1px solid rgba(242,138,45,.35); color: #fff3df; font-size: 14px; }
.gc-req .gc-av { width: 32px; height: 32px; flex: none; }
.gc-req span { flex: 1; min-width: 0; }
.gc-req button { flex: none; padding: 7px 14px; border: 0; border-radius: 999px; font-weight: 600; font-size: 13px; cursor: pointer; }
.gc-req__ok { background: #f28a2d; color: #1b0f04; }
.gc-req__no { background: rgba(255,255,255,.12); color: #fff3df; }
.gc-rejoin { position: fixed; left: 50%; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); z-index: 1500; display: flex; align-items: center; gap: 10px; width: max-content; max-width: calc(100vw - 24px); padding: 8px 8px 8px 14px; transform: translateX(-50%); border-radius: 999px; background: linear-gradient(90deg, #1f7a46, #2a9a59); color: #f2fff6; box-shadow: 0 14px 40px rgba(0,0,0,.4); animation: soc-fade .2s ease-out; }
.gc-rejoin[hidden] { display: none; }
.gc-rejoin > svg { flex: none; width: 18px; height: 18px; }
.gc-rejoin span { display: grid; min-width: 0; font-size: 12px; line-height: 1.25; opacity: .95; }
.gc-rejoin span b { font-size: 14px; }
.gc-rejoin__dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: #c6ffd9; animation: gc-blink 1.2s ease-in-out infinite; }
.gc-rejoin__go { flex: none; padding: 9px 16px; border: 0; border-radius: 999px; background: #fff; color: #145a32; font-weight: 700; font-size: 14px; cursor: pointer; }
.gc-rejoin__x { flex: none; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.16); color: #fff; cursor: pointer; }
.gc-rejoin__x svg { width: 14px; height: 14px; }
@media (max-width: 640px) { .gc-rejoin { bottom: calc(76px + env(safe-area-inset-bottom, 0px)); } .gc-rejoin span { display: none; } }
html.no-anim .gc-tile__net, html.no-anim .gc-rejoin__dot { animation: none; }
/* == end calls-kick-rejoin == */

/* == notify-prefs == */
.notif__head .widget__title { margin-right: auto; }
.notif__gear { display: grid; place-items: center; flex: none; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--mg-copy, #c9b896); cursor: pointer; transition: background .15s, color .15s, transform .3s; }
.notif__gear:hover { background: rgba(212,161,75,.12); color: var(--mg-gold, #d4a14b); }
.notif__gear.is-on { color: var(--mg-gold, #d4a14b); transform: rotate(60deg); }
.np { display: grid; gap: 12px; padding: 4px 12px 12px; }
.np__note { margin: 0; font-size: 12px; color: var(--mg-copy, #c9b896); }
.np__group { display: grid; gap: 2px; }
.np__group > b { margin-bottom: 4px; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--mg-gold, #d4a14b); }
.np-line { display: flex; align-items: center; gap: 6px; }
.np-line .np-row { flex: 1; }
.np-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 36px; font-size: 14px; cursor: pointer; }
.np-sw { position: absolute; opacity: 0; pointer-events: none; }
.np-sw + i { position: relative; flex: none; width: 38px; height: 22px; border-radius: 999px; background: rgba(150,140,120,.35); transition: background .18s; }
.np-sw + i::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.3); transition: transform .18s; }
.np-sw:checked + i { background: #f28a2d; }
.np-sw:checked + i::after { transform: translateX(16px); }
.np-sw:focus-visible + i { outline: 2px solid var(--mg-gold, #d4a14b); outline-offset: 2px; }
.np-play { display: grid; place-items: center; flex: none; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 50%; background: rgba(212,161,75,.12); color: var(--mg-gold, #d4a14b); cursor: pointer; }
.np-play:hover { background: rgba(212,161,75,.24); }
.np-radio { display: flex; align-items: center; gap: 10px; min-height: 32px; font-size: 14px; cursor: pointer; }
.np-radio input { accent-color: #f28a2d; width: 16px; height: 16px; }
/* == end notify-prefs == */

/* == wallet-pop == */
#plat-balance { cursor: pointer; }
.wpop { position: fixed; z-index: 1300; perspective: 1400px; opacity: 0; transform: translateY(-6px); transition: opacity .16s ease-out, transform .16s ease-out; }
.wpop.is-open { opacity: 1; transform: none; }
.wpop[hidden] { display: none; }
.wpop__card { display: grid; transition: transform .5s cubic-bezier(.3,.7,.2,1); transform-style: preserve-3d; }
.wpop__card.is-flipped { transform: rotateY(180deg); }
.wpop__face { grid-area: 1 / 1; display: grid; align-content: start; gap: 10px; padding: 12px 14px 14px; border: 1px solid var(--mg-border); border-radius: 18px; background: var(--mg-card, #17130f); color: var(--mg-hi); box-shadow: 0 24px 60px rgba(0,0,0,.45); backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.wpop__back { transform: rotateY(180deg); }
.wpop__head { display: flex; align-items: center; gap: 6px; }
.wpop__head b { margin-right: auto; font-size: 16px; }
.wpop__icon { display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--mg-copy); font-size: 18px; cursor: pointer; text-decoration: none; }
.wpop__icon:hover { background: var(--mg-hover, rgba(255,255,255,.08)); color: var(--mg-gold); }
.wpop__icon svg { width: 17px; height: 17px; }
.wpop__bals { display: grid; gap: 6px; }
.wpop__bal { display: flex; align-items: baseline; gap: 8px; padding: 8px 10px; border-radius: 12px; background: var(--mg-hover, rgba(255,255,255,.05)); }
.wpop__bal b { font-size: 18px; font-variant-numeric: tabular-nums; }
.wpop__bal small { color: var(--mg-muted, #9b8c74); font-size: 12px; }
.wpop__ic { display: grid; place-items: center; width: 22px; height: 22px; align-self: center; }
.wpop__ic svg { width: 20px; height: 20px; }
.wpop__bal--gem { background: linear-gradient(90deg, rgba(242,138,45,.16), transparent); }
.wpop__rank { display: inline-flex; align-items: baseline; gap: 4px; margin-left: auto; padding: 3px 9px; border-radius: 999px; background: rgba(255,215,114,.14); color: #ffd772; text-decoration: none; white-space: nowrap; }
.wpop__rank b { font: 800 13px/1.2 var(--display); letter-spacing: .02em; }
.wpop__rank small { color: inherit; opacity: .75; font-size: 11px; }
.wpop__rank:hover { background: rgba(255,215,114,.24); }
html[data-theme="light"] .wpop__rank { background: rgba(196,120,20,.12); color: #9a5a10; }
.wpop__note { display: block; padding: 8px 10px; border-radius: 12px; border: 1px dashed rgba(242,138,45,.55); color: var(--mg-hi); font-size: 13px; text-decoration: none; animation: wpop-glow 2.4s ease-in-out infinite; }
.wpop__note b { color: #f28a2d; }
.wpop__note:hover { background: rgba(242,138,45,.1); }
@keyframes wpop-glow { 50% { border-color: rgba(242,138,45,.95); box-shadow: 0 0 14px rgba(242,138,45,.18); } }
.wpop__tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 3px; border-radius: 12px; background: var(--mg-hover, rgba(255,255,255,.05)); }
.wpop__tabs button { padding: 7px 0; border: 0; border-radius: 9px; background: transparent; color: var(--mg-copy); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.wpop__tabs button.is-on { background: var(--mg-card, #241d16); color: var(--mg-hi); box-shadow: 0 1px 4px rgba(0,0,0,.2); }
.wpop__pane { display: grid; gap: 8px; }
.wpop__sums { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.wpop__sums button { padding: 8px 0; border: 1px solid var(--mg-border); border-radius: 10px; background: transparent; color: var(--mg-hi); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.wpop__sums button.is-on { border-color: #f28a2d; background: rgba(242,138,45,.16); }
.wpop__amt { width: 100%; padding: 9px 12px; border: 1px solid var(--mg-border); border-radius: 10px; background: transparent; color: var(--mg-hi); font: inherit; }
.wpop__pay { width: 100%; justify-content: center; text-align: center; }
.wpop__fine { margin: 0; color: var(--mg-muted, #9b8c74); font-size: 12px; line-height: 1.4; }
.wpop__flip { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 9px; border: 1px solid var(--mg-border); border-radius: 12px; background: transparent; color: var(--mg-gold); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.wpop__flip:hover { background: rgba(212,161,75,.1); }
.wpop__flip svg { width: 18px; height: 18px; transition: transform .4s; }
.wpop__flip:hover svg { transform: rotate(180deg); }
.wpop__fx { display: grid; gap: 10px; }
.wpop__fx .muted { margin: 0; font-size: 12px; }
.wpop__fx .fx__grid { grid-template-columns: 1fr; }
.wpop__fx .fx__swap { justify-self: center; }
@media (max-width: 640px) { .wpop__face { max-height: calc(100dvh - 90px); overflow-y: auto; } }
html.no-anim .wpop__card { transition: none; }
html.no-anim .wpop__note { animation: none; }
/* == end wallet-pop == */

/* == beta-testers == */
.bt-menu { position: fixed; z-index: 1400; display: grid; gap: 4px; padding: 6px; border: 1px solid var(--mg-border); border-radius: 16px; background: var(--mg-card, #17130f); color: var(--mg-hi); box-shadow: 0 20px 50px rgba(0,0,0,.45); animation: soc-fade .16s ease-out; }
.bt-menu[hidden] { display: none; }
.bt-menu__item { display: grid; gap: 2px; width: 100%; padding: 10px 12px; border: 0; border-radius: 12px; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.bt-menu__item:hover { background: var(--mg-hover, rgba(255,255,255,.06)); }
.bt-menu__item b { font-size: 14px; }
.bt-menu__item span { color: var(--mg-muted, #9b8c74); font-size: 12px; }
.bt-menu__item--cta { background: linear-gradient(90deg, rgba(242,138,45,.18), rgba(242,138,45,.06)); }
.bt-menu__sw { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.bt-menu__sw > span { display: grid; gap: 2px; }
.bt-menu__link { padding: 6px 12px 8px; border: 0; background: none; color: var(--mg-gold); font: inherit; font-size: 13px; text-align: left; cursor: pointer; }
.bt-menu__fine { margin: 4px 12px 8px; color: var(--mg-muted, #9b8c74); font-size: 12px; }
.bt-ov { position: fixed; inset: 0; z-index: 1700; display: grid; place-items: center; padding: 16px; background: rgba(4,4,3,.62); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); animation: soc-fade .18s ease-out; }
.bt-ov__card { width: min(520px, 100%); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 22px 22px 18px; border: 1px solid var(--mg-border); border-radius: 22px; background: var(--mg-card, #17130f); color: var(--mg-hi); box-shadow: 0 30px 80px rgba(0,0,0,.55); }
.bt-ov__card h2 { margin: 0 0 12px; font-size: 21px; }
.bt-steps { display: grid; gap: 10px; margin: 0 0 14px; padding-left: 20px; line-height: 1.45; }
.bt-ov__gift { margin: 0 0 8px; padding: 10px 12px; border-radius: 12px; background: rgba(242,138,45,.12); line-height: 1.45; }
.bt-ov__fine { margin: 0 0 14px; color: var(--mg-muted, #9b8c74); font-size: 13px; }
.bt-ov__acts { display: flex; flex-wrap: wrap; gap: 8px; }
html.bt-mode body { cursor: context-menu; }
.bt-hl { position: absolute; z-index: 1350; pointer-events: none; border: 2px solid #f28a2d; border-radius: 10px; background: rgba(242,138,45,.12); box-shadow: 0 0 0 4px rgba(242,138,45,.18); animation: bt-hl 1.4s ease-in-out infinite; }
.bt-hl[hidden] { display: none; }
@keyframes bt-hl { 50% { box-shadow: 0 0 0 8px rgba(242,138,45,.06); } }
.bt-box { position: absolute; z-index: 1360; display: grid; gap: 8px; padding: 12px; border: 1px solid rgba(242,138,45,.55); border-radius: 16px; background: var(--mg-card, #17130f); color: var(--mg-hi); box-shadow: 0 20px 50px rgba(0,0,0,.45); }
.bt-box__t { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bt-box textarea { width: 100%; padding: 8px 10px; border: 1px solid var(--mg-border); border-radius: 10px; background: transparent; color: var(--mg-hi); font: inherit; font-size: 14px; resize: vertical; }
.bt-box__fine { margin: 0; color: var(--mg-muted, #9b8c74); font-size: 12px; }
.bt-box__acts { display: flex; gap: 8px; }
.bt-marks { position: absolute; top: 0; left: 0; z-index: 1340; width: 0; height: 0; }
.bt-mark { position: absolute; display: flex; gap: 2px; cursor: pointer; }
.bt-dot { display: grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; color: #fff; font-size: 12px; font-style: normal; font-weight: 700; box-shadow: 0 2px 8px rgba(0,0,0,.35), 0 0 0 2px var(--mg-card, #17130f); }
.bt-dot--new { background: #f28a2d; animation: bt-pulse 1.8s ease-in-out infinite; }
.bt-dot--accepted { background: #2a9a59; }
.bt-dot--rejected { background: #e0483a; }
@keyframes bt-pulse { 50% { transform: scale(1.12); } }
.bt-pop { position: absolute; z-index: 1360; display: grid; gap: 8px; padding: 12px; border: 1px solid var(--mg-border); border-radius: 14px; background: var(--mg-card, #17130f); color: var(--mg-hi); box-shadow: 0 18px 44px rgba(0,0,0,.45); }
.bt-pop__t { font-size: 13px; }
.bt-pop__row { display: flex; gap: 8px; align-items: flex-start; }
.bt-pop__row .bt-dot { min-width: 12px; width: 12px; height: 12px; padding: 0; margin-top: 4px; animation: none; }
.bt-pop__row p { margin: 0; font-size: 14px; }
.bt-pop__row small { color: var(--mg-muted, #9b8c74); font-size: 12px; }
.bt-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.bt-tab { padding: 7px 14px; border: 1px solid var(--mg-border); border-radius: 999px; background: transparent; color: var(--mg-copy); font: inherit; font-size: 14px; cursor: pointer; }
.bt-tab.is-on { border-color: #f28a2d; background: rgba(242,138,45,.14); color: var(--mg-hi); font-weight: 600; }
.bt-list { display: grid; gap: 12px; }
.bt-item header { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; font-size: 13px; color: var(--mg-muted, #9b8c74); }
.bt-item header b { color: var(--mg-hi); font-size: 15px; }
.bt-item header em { margin-left: auto; font-style: normal; font-weight: 600; }
.bt-item--new header em { color: #f28a2d; }
.bt-item--accepted header em { color: #2a9a59; }
.bt-item--rejected header em { color: #e0483a; }
.bt-item > p { margin: 8px 0; white-space: pre-wrap; }
.bt-item__where { font-size: 13px; }
.bt-item__shot img { display: block; max-width: 100%; max-height: 420px; margin: 6px 0; border: 1px solid var(--mg-border); border-radius: 10px; }
.bt-item__acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
html.no-anim .bt-hl, html.no-anim .bt-dot--new { animation: none; }
/* == end beta-testers == */

/* == site-anim == */
body::after { content: ""; position: fixed; inset: -20vmax; z-index: 0; pointer-events: none; background: radial-gradient(38vmax 30vmax at 22% 28%, rgba(242,138,45,.15), transparent 70%), radial-gradient(34vmax 28vmax at 78% 72%, rgba(212,161,75,.12), transparent 70%), radial-gradient(28vmax 24vmax at 70% 18%, rgba(106,215,255,.07), transparent 70%); animation: gdz-bg-drift 24s ease-in-out infinite alternate; will-change: transform; }
html[data-theme="light"] body::after { opacity: .85; }
@keyframes gdz-bg-drift { 0% { transform: translate3d(0,0,0) rotate(0deg) scale(1); } 50% { transform: translate3d(7vmax,-5vmax,0) rotate(12deg) scale(1.08); } 100% { transform: translate3d(-6vmax,5vmax,0) rotate(-10deg) scale(.96); } }
.brand { perspective: 420px; }
.brand__mark { transform-style: preserve-3d; animation: gdz-cube-turn 12s ease-in-out infinite; will-change: transform; }
.brand:hover .brand__mark { animation: gdz-cube-spin 1.1s cubic-bezier(.3,.7,.3,1) 1; }
@keyframes gdz-cube-turn { 0% { transform: rotateY(-16deg) rotateX(6deg); } 30% { transform: rotateY(16deg) rotateX(-4deg); } 60% { transform: rotateY(-16deg) rotateX(6deg); } 72% { transform: rotateY(-16deg) rotateX(6deg); } 92%, 100% { transform: rotateY(344deg) rotateX(6deg); } }
@keyframes gdz-cube-spin { from { transform: rotateY(0); } to { transform: rotateY(360deg); } }
.brand__dzyak { background: linear-gradient(100deg, #f28a2d 0%, #f28a2d 40%, #ffd8a8 50%, #f28a2d 60%, #f28a2d 100%); background-size: 300% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: gdz-shimmer 5s ease-in-out infinite; }
@keyframes gdz-shimmer { 0%, 45% { background-position: 100% 0; } 80%, 100% { background-position: 0 0; } }
.pcube { animation: gdz-float 6s ease-in-out infinite; }
.pcube::after { content: ""; position: absolute; left: 18%; right: 18%; bottom: -6%; height: 8%; border-radius: 50%; background: radial-gradient(closest-side, rgba(242,138,45,.35), transparent); filter: blur(4px); animation: gdz-float-shadow 6s ease-in-out infinite; pointer-events: none; }
@keyframes gdz-float { 50% { transform: translateY(-7px); } }
@keyframes gdz-float-shadow { 50% { transform: scaleX(.8); opacity: .55; } }
.works-bar__dot { animation-duration: 1.8s; }
html.no-anim body::after, html.no-anim .brand__mark, html.no-anim .brand:hover .brand__mark, html.no-anim .brand__dzyak, html.no-anim .pcube, html.no-anim .pcube::after { animation: none !important; }
/* == end site-anim == */

/* == grana-hide-dd == */
body:has(.dropdown.is-open) .grana-visitor, body:has(.wpop:not([hidden])) .grana-visitor { opacity: 0 !important; pointer-events: none !important; transition: opacity .15s; }
/* == end grana-hide-dd == */

/* == call-perf == */
body.gc-open > .shell, body.gc-open .grana-visitor { visibility: hidden; }
body.gc-open::after, body.gc-barred::after, body.gc-open .brand__mark, body.gc-barred .brand__mark, body.gc-open .brand__dzyak, body.gc-barred .brand__dzyak, body.gc-open .pcube, body.gc-barred .pcube, body.gc-open .pcube::after, body.gc-barred .pcube::after { animation-play-state: paused; }
/* == end call-perf == */

/* == site-anim2 == */
:where(.btn--cta) { position: relative; overflow: hidden; isolation: isolate; }
.btn--cta::after { content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 45%; z-index: -1; pointer-events: none; background: linear-gradient(105deg, transparent, rgba(255,255,255,.4), transparent); transform: translateX(0) skewX(-18deg); animation: gdz-sheen 8s ease-in-out infinite; }
@keyframes gdz-sheen { 0%, 78% { transform: translateX(0) skewX(-18deg); } 100% { transform: translateX(380%) skewX(-18deg); } }
.page-kicker:not(.page-kicker--logo)::before { transform-origin: left center; animation: gdz-kick 4.5s ease-in-out infinite; }
@keyframes gdz-kick { 0%, 100% { transform: scaleX(1); } 50% { transform: scaleX(.45); } }
.page-kicker--logo::before { animation: gdz-cube-turn 9s ease-in-out infinite; }
.podium__medal--1 { animation: gdz-medal 3.4s ease-in-out infinite; }
@keyframes gdz-medal { 0%, 100% { transform: scale(1) rotate(0); } 50% { transform: scale(1.12) rotate(-8deg); } }
.mus-wave__eq:not(.is-on) i { animation: gdz-eq-idle calc(var(--d) * 3.2) ease-in-out infinite alternate; }
@keyframes gdz-eq-idle { from { transform: scaleY(.28); } to { transform: scaleY(.55); } }
.mus-wave::after { animation: gdz-glow-drift 14s ease-in-out infinite alternate; }
@keyframes gdz-glow-drift { from { transform: translate3d(0,0,0) scale(1); } to { transform: translate3d(-60px,40px,0) scale(1.15); } }
.side-link.is-active svg { animation: gdz-ic 3.6s ease-in-out infinite; }
@keyframes gdz-ic { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.14); } }
body.gc-open .btn--cta::after, body.gc-open .page-kicker::before, body.gc-open .podium__medal--1, body.gc-open .mus-wave__eq i, body.gc-open .mus-wave::after, body.gc-open .side-link.is-active svg { animation-play-state: paused; }
html.no-anim .btn--cta::after, html.no-anim .page-kicker::before, html.no-anim .podium__medal--1, html.no-anim .mus-wave__eq:not(.is-on) i, html.no-anim .mus-wave::after, html.no-anim .side-link.is-active svg { animation: none !important; }
/* == end site-anim2 == */

/* == cube3d == */
.pcube--3d { --s: clamp(82px, 10.4vw, 104px); display: grid; place-items: center; perspective: 640px; }
.pcube3d__box { position: relative; width: var(--s); height: var(--s); transform-style: preserve-3d; transform: rotateX(-24deg) rotateY(-35deg); animation: gdz-cube3d 24s linear infinite; }
.pcube--3d:hover .pcube3d__box, .pcube--3d:focus-within .pcube3d__box { animation-play-state: paused; }
@keyframes gdz-cube3d { 0% { transform: rotateX(-24deg) rotateY(0deg); } 25% { transform: rotateX(-12deg) rotateY(-90deg); } 50% { transform: rotateX(-28deg) rotateY(-180deg); } 75% { transform: rotateX(-12deg) rotateY(-270deg); } 100% { transform: rotateX(-24deg) rotateY(-360deg); } }
.pcube3d__f { position: absolute; inset: 0; display: flex; align-items: flex-end; justify-content: center; background: #120c08 center / cover no-repeat; border: 1px solid rgba(242,138,45,.7); border-radius: 3px; box-shadow: inset 0 0 18px rgba(0,0,0,.55), 0 0 14px rgba(242,138,45,.18); backface-visibility: hidden; -webkit-backface-visibility: hidden; overflow: hidden; text-decoration: none; transition: filter .2s; }
.pcube3d__f:hover, .pcube3d__f:focus-visible { filter: brightness(1.25); outline: none; }
.pcube3d__f--front { transform: translateZ(calc(var(--s) / 2)); }
.pcube3d__f--back { transform: rotateY(180deg) translateZ(calc(var(--s) / 2)); }
.pcube3d__f--right { transform: rotateY(90deg) translateZ(calc(var(--s) / 2)); }
.pcube3d__f--left { transform: rotateY(-90deg) translateZ(calc(var(--s) / 2)); }
.pcube3d__f--top { transform: rotateX(90deg) translateZ(calc(var(--s) / 2)); }
.pcube3d__f--bottom { transform: rotateX(-90deg) translateZ(calc(var(--s) / 2)); }
.pcube3d__lbl { display: grid; justify-items: center; gap: 1px; width: 100%; padding: 14% 4px 9%; background: linear-gradient(to top, rgba(10,6,3,.88), rgba(10,6,3,.55) 60%, transparent); color: #fbefd3; font: 600 9px/1.05 var(--display); letter-spacing: .04em; text-transform: uppercase; text-align: center; text-shadow: 0 1px 2px rgba(0,0,0,.8); }
.pcube3d__lbl b { font-weight: 700; }
.pcube3d__lbl small { font-size: 7px; opacity: .85; }
.pcube3d__f.is-taken .pcube3d__lbl b { font-size: 10px; color: #ffd8a8; }
.pcube3d__brand { color: #f28a2d; font-size: 10px; }
.pcube--3d::after { bottom: -10%; }
html.no-anim .pcube3d__box { animation: none !important; transform: rotateX(-24deg) rotateY(-35deg); }
body.gc-open .pcube3d__box, body.gc-barred .pcube3d__box { animation-play-state: paused; }
@media (max-width: 640px) { .pcube--3d { --s: 82px; } }
/* == end cube3d == */

/* == igor3 == */
.yt-watch__player .player__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sk-volbox { display: inline-flex; align-items: center; gap: 6px; padding-left: 12px; border-radius: 999px; background: rgba(0, 0, 0, .45); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.sk-volbox .sk-tool { background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; }
.sk-vol { width: 84px; height: 4px; accent-color: #ffb15c; cursor: pointer; }
@media (max-width: 420px) { .sk-vol { width: 64px; } }

.editor-topic-auto, .pub-dlg__auto { margin: 0 0 8px; padding: 8px 10px; border-radius: 10px; background: rgba(232, 119, 46, .1); border: 1px solid rgba(232, 119, 46, .3); font-size: 12.5px; line-height: 1.4; }
.editor-topic-auto[hidden] { display: none; }

form.topnav__search { margin: 0; cursor: text; }
form.topnav__search:focus-within { border-color: rgba(232, 119, 46, .7); box-shadow: 0 0 0 3px rgba(232, 119, 46, .15); }
.topnav__q { flex: 1; min-width: 0; height: 40px; padding: 0; border: 0; outline: 0; background: transparent; color: var(--mg-text, inherit); font: inherit; font-size: 14px; }
.topnav__q::placeholder { color: var(--mg-muted); opacity: 1; }
.topnav__q::-webkit-search-cancel-button { cursor: pointer; }
@media (max-width: 1099px) {
  .topnav__q { display: none; }
  form.topnav__search { cursor: pointer; }
}

.radio-disc--float { display: none !important; }
.nav-extras { display: flex; align-items: center; gap: 10px; margin-right: 6px; }
.nav-grana, .nav-radio { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 12px 0 4px; border-radius: 999px; border: 1px solid rgba(212, 161, 75, 0.22); background: rgba(16, 14, 11, 0.9); color: inherit; text-decoration: none; }
.nav-grana img { width: 36px; height: 36px; object-fit: contain; transition: transform .25s ease; }
.nav-grana:hover img { transform: rotate(-8deg) scale(1.08); }
.nav-grana__txt, .nav-radio__txt { display: grid; gap: 1px; line-height: 1.1; }
.nav-grana__txt b, .nav-radio__txt b { font-size: 12.5px; font-weight: 800; white-space: nowrap; }
.nav-grana__txt small { font-size: 11px; opacity: .65; white-space: nowrap; }
.nav-radio .nav-radio-slot { width: 40px; height: 40px; }
.nav-radio .radio-disc--nav { width: 36px; height: 36px; }
.nav-radio__vol { width: 92px; height: 4px; margin: 3px 0 0; accent-color: #e8772e; cursor: pointer; }
html[data-theme="light"] .nav-grana, html[data-theme="light"] .nav-radio { background: #fffaf2; border-color: rgba(176, 112, 40, .25); color: #1f1910; }
.app-music .nav-extras { display: none !important; }
@media (max-width: 1180px) {
  .nav-grana__txt { display: none; }
  .nav-grana { padding: 0 4px; }
}
@media (max-width: 980px) {
  .nav-radio__txt b { display: none; }
  .nav-radio__vol { width: 64px; margin: 0; }
}
@media (max-width: 860px) {
  .nav-extras { gap: 6px; margin-right: 2px; }
  .nav-grana { display: none; }
  .nav-radio { height: 40px; padding: 0; border: 0; background: none; }
  .nav-radio__txt { display: none; }
}
/* == end igor3 == */

/* == igor4 == */
.ch-links { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 6px; }
.ch-link { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; border: 1px solid rgba(212, 161, 75, .28); background: rgba(255, 255, 255, .04); color: inherit; text-decoration: none; transition: transform .18s ease, border-color .18s ease, background .18s ease; }
.ch-link:hover { transform: translateY(-2px); border-color: rgba(232, 119, 46, .7); background: rgba(232, 119, 46, .12); }
.ch-link svg { width: 17px; height: 17px; }
.ch-links--sm .ch-link { width: 26px; height: 26px; }
.ch-links--sm .ch-link svg { width: 14px; height: 14px; }
.ch-links-form { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); min-width: 0; margin: 0; padding: 12px 14px 14px; border: 1px solid rgba(212, 161, 75, .2); border-radius: 14px; }
.ch-links-form legend { padding: 0 6px; font-weight: 700; }
.pub-dlg__link { padding: 0; border: 0; background: none; color: #f0a15c; font: inherit; font-size: 13px; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.pub-propose { display: grid; gap: 8px; margin: 6px 0 10px; padding: 10px 12px; border-radius: 12px; border: 1px dashed rgba(232, 119, 46, .45); background: rgba(232, 119, 46, .06); }
.pub-propose[hidden] { display: none; }
.pub-propose input { width: 100%; }

.mc-tick { margin-left: 4px; font-style: normal; font-size: 11px; letter-spacing: -2px; opacity: .65; }
.mc-tick.is-read { color: #4fc3f7; opacity: 1; }
.mc-msg .lp-list { margin-top: 6px; max-width: 100%; }

.lp__img--video { position: relative; }
.lp__play { position: absolute; left: 50%; top: 50%; width: 38px; height: 38px; margin: -19px 0 0 -19px; border-radius: 50%; background: rgba(0, 0, 0, .6); box-shadow: 0 2px 10px rgba(0, 0, 0, .4); pointer-events: none; }
.lp__play::after { content: ""; position: absolute; left: 15px; top: 11px; border-style: solid; border-width: 8px 0 8px 13px; border-color: transparent transparent transparent #fff; }
.lp__dur { position: absolute; right: 6px; bottom: 6px; padding: 1px 6px; border-radius: 6px; background: rgba(0, 0, 0, .75); color: #fff; font-style: normal; font-size: 11.5px; font-weight: 700; pointer-events: none; }

.live-rec { display: inline-flex; align-items: center; gap: 8px; margin-top: 10px; padding: 8px 12px; border-radius: 999px; border: 1px solid rgba(212, 161, 75, .25); font-size: 13.5px; cursor: pointer; user-select: none; }
.live-rec input { width: 16px; height: 16px; accent-color: #e5484d; }
.live-rec__dot { width: 9px; height: 9px; border-radius: 50%; background: #e5484d; opacity: 0; }
.live-rec input:checked ~ .live-rec__dot { opacity: 1; animation: live-rec-blink 1.2s steps(2, start) infinite; }
@keyframes live-rec-blink { to { visibility: hidden; } }

.soc-form__check { display: flex !important; align-items: center; gap: 8px; flex-direction: row !important; font-weight: 500; }
.soc-form__check input { width: 18px; height: 18px; margin: 0; accent-color: #e8772e; }
.field__hint { margin: 6px 0 0; font-size: 12.5px; line-height: 1.4; }

.mus-radio { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 28px; margin: 18px 0 8px; padding: 24px; border-radius: 22px; border: 1px solid rgba(212, 161, 75, .22); background: radial-gradient(120% 140% at 0% 0%, rgba(232, 119, 46, .16), transparent 60%), rgba(16, 14, 11, .7); }
.mus-radio__disc { width: 180px; height: 180px; display: grid; place-items: center; }
.mus-radio__disc .radio-disc { position: relative; width: 180px; height: 180px; margin: 0; }
.mus-radio__body h2 { margin: 0 0 8px; font-size: 26px; }
.mus-radio__body p { margin: 0 0 14px; max-width: 46ch; line-height: 1.5; }
.mus-radio__vol { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; }
.mus-radio__vol input { width: 180px; accent-color: #e8772e; }
@media (max-width: 640px) {
  .mus-radio { grid-template-columns: 1fr; justify-items: center; text-align: center; padding: 20px 16px; gap: 16px; }
  .mus-radio__disc, .mus-radio__disc .radio-disc { width: 150px; height: 150px; }
  .mus-radio__body p { margin-left: auto; margin-right: auto; }
}
html[data-theme="light"] .mus-radio { background: radial-gradient(120% 140% at 0% 0%, rgba(232, 119, 46, .14), transparent 60%), #fffaf2; border-color: rgba(176, 112, 40, .25); }
html[data-theme="light"] .ch-link { border-color: rgba(176, 112, 40, .3); background: #fffaf2; }
/* == end igor4 == */

/* == media == */
/* шестерёнка страницы */
.pg-gear { display: inline-grid; place-items: center; width: 38px; height: 38px; flex-shrink: 0; padding: 0; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(16, 14, 11, .6); color: var(--mg-copy); cursor: pointer; transition: color .2s, border-color .2s; }
.pg-gear svg { transition: transform .35s ease; }
.pg-gear:hover, .pg-gear[aria-expanded="true"] { color: var(--mg-amber); border-color: rgba(242, 138, 45, .5); }
.pg-gear[aria-expanded="true"] svg { transform: rotate(60deg); }
.pg-pop { position: fixed; z-index: 9500; width: min(360px, calc(100vw - 16px)); max-height: min(72vh, 560px); overflow: auto; border: 1px solid var(--mg-border); border-radius: 16px; background: #15120f; box-shadow: 0 24px 60px rgba(0, 0, 0, .6); animation: pg-in .18s ease; }
@keyframes pg-in { from { opacity: 0; transform: translateY(-4px); } }
@keyframes pg-up { from { transform: translateY(100%); } }
.pg-pop__head { display: flex; align-items: center; justify-content: space-between; padding: 12px 10px 6px 16px; font-size: 16px; color: var(--mg-hi); }
.pg-pop__x { width: 34px; height: 34px; border: 0; border-radius: 10px; background: none; color: var(--mg-copy); font-size: 24px; line-height: 1; cursor: pointer; }
.pg-pop__x:hover { background: rgba(212, 161, 75, .1); }
.pg-pop__body { display: grid; gap: 2px; padding: 0 8px 12px; }
.pg-row { display: grid; gap: 10px; padding: 10px 8px; border-radius: 12px; }
.pg-row + .pg-row { border-top: 1px solid rgba(212, 161, 75, .1); }
.pg-row--sw { grid-template-columns: minmax(0, 1fr) auto; align-items: center; cursor: pointer; }
.pg-row__t { display: grid; gap: 3px; }
.pg-row__t b { font-size: 14px; font-weight: 600; color: var(--mg-ivory); }
.pg-row__t small { font-size: 12px; line-height: 1.4; color: var(--mg-muted); }
.pg-seg { display: flex; flex-wrap: wrap; gap: 6px; }
.pg-seg button { flex: 1 1 auto; min-height: 34px; padding: 6px 10px; border: 1px solid var(--mg-border); border-radius: 10px; background: rgba(0, 0, 0, .25); color: var(--mg-copy); font-size: 13px; cursor: pointer; transition: background .15s, color .15s; }
.pg-seg button:hover { color: var(--mg-ivory); }
.pg-seg button.is-on { border-color: transparent; background: var(--grad-cta); color: var(--mg-ink); font-weight: 700; }
.pg-sw { position: relative; flex-shrink: 0; width: 46px; height: 26px; margin: 0; border-radius: 13px; background: rgba(255, 255, 255, .16); cursor: pointer; appearance: none; -webkit-appearance: none; transition: background .2s; }
.pg-sw::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff3e0; box-shadow: 0 1px 3px rgba(0, 0, 0, .4); transition: transform .2s; }
.pg-sw:checked { background: #f28a2d; }
.pg-sw:checked::after { transform: translateX(20px); }
.pg-sw:focus-visible { outline: 2px solid var(--mg-amber); outline-offset: 2px; }
.pg-pop--sheet { left: 0 !important; right: 0; top: auto !important; bottom: 0; width: auto; max-height: 82vh; border-radius: 20px 20px 0 0; padding-bottom: env(safe-area-inset-bottom, 0px); animation: pg-up .22s ease; }
.pg-pop--sheet .pg-pop__head { padding-top: 16px; }
.pg-pop--sheet .pg-pop__head::before { content: ""; position: absolute; left: 50%; top: 6px; width: 40px; height: 4px; margin-left: -20px; border-radius: 2px; background: rgba(255, 255, 255, .2); }
html.pg-sheet-open body::after { content: ""; position: fixed; inset: 0; z-index: 9499; background: rgba(0, 0, 0, .5); }
.soc-dlist__head .pg-gear { width: 34px; height: 34px; }
.mus-head-acts { display: flex; align-items: center; gap: 10px; }
.mus-menu [data-mact="off-save"] small, [data-mact="off-save"] small { display: block; margin-top: 2px; font-size: 12px; font-weight: 400; color: var(--mg-muted); }

/* голосовое */
.cm-voice { display: flex; align-items: center; gap: 10px; width: min(300px, 64vw); padding: 2px 0; color: var(--mg-amber); }
.soc-msg.is-mine .cm-voice, .mc-msg.is-mine .cm-voice { color: #fff3e0; }
.cm-voice__pp { display: grid; place-items: center; flex: 0 0 auto; width: 42px; height: 42px; padding: 0; border: 0; border-radius: 50%; background: var(--grad-cta); color: var(--mg-ink); cursor: pointer; transition: transform .15s; }
.cm-voice__pp:active { transform: scale(.92); }
.soc-msg.is-mine .cm-voice__pp, .mc-msg.is-mine .cm-voice__pp { background: #fff3e0; color: #7a3f12; }
.cm-voice__body { display: grid; flex: 1; gap: 4px; min-width: 0; }
.cm-wave { display: flex; align-items: center; gap: 2px; height: 30px; cursor: pointer; touch-action: none; }
.cm-wave i { flex: 1 1 0; min-width: 2px; max-width: 4px; border-radius: 2px; background: currentColor; opacity: .35; transition: opacity .12s; }
.cm-wave i.is-on { opacity: 1; }
.cm-voice__meta { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--mg-copy); }
.soc-msg.is-mine .cm-voice__meta, .mc-msg.is-mine .cm-voice__meta { color: rgba(255, 243, 224, .85); }
.cm-voice__meta time { margin-right: auto; font-variant-numeric: tabular-nums; }
.cm-speed, .cm-sttbtn { min-width: 34px; height: 24px; padding: 0 7px; border: 1px solid currentColor; border-radius: 12px; background: none; color: inherit; font-size: 12px; font-weight: 700; line-height: 22px; opacity: .8; cursor: pointer; }
.cm-speed:hover, .cm-sttbtn:hover, .cm-sttbtn.is-on { opacity: 1; background: rgba(255, 255, 255, .12); }
.cm-stt { margin-top: 6px; padding: 8px 10px; border-radius: 10px; background: rgba(0, 0, 0, .22); font-size: 14px; line-height: 1.45; white-space: pre-wrap; animation: pg-in .2s ease; }
.cm-stt em { font-style: normal; opacity: .7; }
.cm-stt__wait { animation: cm-blink 1.2s ease infinite; }
.cm-stt__copy { display: block; margin-top: 8px; padding: 6px 12px; border: 1px solid rgba(242, 138, 45, .45); border-radius: 999px; background: none; color: inherit; font: 600 13px/1.2 var(--body, system-ui); white-space: normal; cursor: pointer; -webkit-user-select: none; user-select: none; }

/* выделение текста в чате не убегает в шапку и поле ввода; галочки, время и «изменено» не попадают в копию */
.soc-msg__meta, .soc-msg__tick, .chr-edited, .chx-more, .chx-mark { -webkit-user-select: none; user-select: none; }
.soc-chat__head, .soc-chat__note, .soc-chat__form, .soc-chat__closed, .soc-chat__down, .chx-pins, .bottom-nav, .topnav, .works-bar { -webkit-user-select: none; user-select: none; }
.soc-chat__form textarea, .soc-chat__form input, .soc-chat__form [contenteditable] { -webkit-user-select: text; user-select: text; }
@keyframes cm-blink { 50% { opacity: .35; } }
.mc-msg .cm-voice { width: 200px; }

/* кружок */
.soc-msg__bubble:has(.cm-circle), .mc-bubble:has(.cm-circle) { padding: 0; background: none !important; box-shadow: none; }
.cm-circle { display: grid; justify-items: start; gap: 6px; }
.cm-circle__slot { position: relative; width: min(240px, 62vw); aspect-ratio: 1; overflow: hidden; border-radius: 50%; background: #1a1510; box-shadow: 0 10px 28px rgba(0, 0, 0, .4); cursor: pointer; isolation: isolate; touch-action: none; -webkit-tap-highlight-color: transparent; }
.mc-msg .cm-circle__slot { width: 150px; }
.cm-circle__poster, .cm-circle__live { position: absolute; inset: 0; width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.cm-circle__live { z-index: 1; background: #000; }
.cm-ring { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; transform: rotate(-90deg); pointer-events: none; }
.cm-ring__bg { fill: none; stroke: rgba(255, 255, 255, .2); stroke-width: 3; }
.cm-ring__fg { fill: none; stroke: #f28a2d; stroke-width: 3; stroke-linecap: round; stroke-dasharray: 1000; transition: stroke-dashoffset .25s linear; }
.cm-circle .cm-ring { opacity: 0; transition: opacity .2s; }
.cm-circle.is-cur .cm-ring { opacity: 1; }
.cm-circle.is-cur .cm-ring__fg, .cm-circle.is-cur .cm-ring__bg { stroke-width: 4; }
.cm-circle__pp { position: absolute; left: 50%; top: 50%; z-index: 3; display: grid; place-items: center; width: 56px; height: 56px; margin: -28px 0 0 -28px; border-radius: 50%; background: rgba(0, 0, 0, .45); color: #fff; -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); transition: opacity .2s, transform .2s; pointer-events: none; }
.cm-circle__pp svg { width: 26px; height: 26px; }
.cm-circle.is-playing .cm-circle__pp { opacity: 0; transform: scale(.8); }
.cm-circle__t { position: absolute; left: 50%; bottom: 12px; z-index: 3; padding: 2px 8px; border-radius: 10px; background: rgba(0, 0, 0, .5); color: #fff; font-size: 12px; font-variant-numeric: tabular-nums; transform: translateX(-50%); pointer-events: none; }
.cm-circle__tools { display: flex; gap: 6px; color: var(--mg-copy); }
.soc-msg.is-mine .cm-circle, .mc-msg.is-mine .cm-circle { justify-items: end; }

/* мини-плеер справа сверху */
.cm-dock { position: fixed; z-index: 900; display: flex; align-items: center; gap: 8px; max-width: min(380px, calc(100vw - 16px)); animation: pg-in .2s ease; }
.cm-dock[hidden] { display: none; }
.cm-dock__circle { position: relative; display: none; width: 104px; height: 104px; flex-shrink: 0; overflow: hidden; border-radius: 50%; background: #000; box-shadow: 0 12px 30px rgba(0, 0, 0, .5); cursor: pointer; }
.cm-dock.is-circle .cm-dock__circle { display: block; }
.cm-dock__circle video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.cm-dock__bar { display: flex; align-items: center; gap: 6px; padding: 6px; border: 1px solid var(--mg-border); border-radius: 999px; background: rgba(21, 18, 15, .94); box-shadow: 0 12px 30px rgba(0, 0, 0, .45); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.cm-dock__pp, .cm-dock__x { display: grid; place-items: center; width: 34px; height: 34px; flex-shrink: 0; padding: 0; border: 0; border-radius: 50%; cursor: pointer; }
.cm-dock__pp { background: var(--grad-cta); color: var(--mg-ink); }
.cm-dock__pp svg { width: 18px; height: 18px; }
.cm-dock__x { background: none; color: var(--mg-copy); }
.cm-dock__x:hover { background: rgba(212, 161, 75, .1); }
.cm-dock__info { display: grid; gap: 1px; min-width: 0; max-width: 170px; padding: 0 4px; border: 0; background: none; color: var(--mg-ivory); text-align: left; cursor: pointer; }
.cm-dock__info b { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.cm-dock__info time { font-size: 11px; color: var(--mg-muted); font-variant-numeric: tabular-nums; }

/* кнопки записи в поле ввода */
.cm-recbtn { flex-shrink: 0; width: 40px; height: 44px; }
.chx-compose { position: relative; }
.cm-recbar { position: absolute; left: 0; right: 0; bottom: 0; z-index: 5; display: flex; align-items: center; gap: 10px; min-height: 64px; padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid rgba(212, 161, 75, .14); background: #15120f; animation: pg-in .15s ease; }
.cm-recbar time { min-width: 44px; color: var(--mg-ivory); font-variant-numeric: tabular-nums; }
.cm-recbar__dot { width: 10px; height: 10px; flex-shrink: 0; border-radius: 50%; background: #ff4d3d; animation: cm-blink 1s ease infinite; }
.cm-recbar.is-wait .cm-recbar__dot { background: var(--mg-copy); opacity: .5; animation: none; }
.cm-recbar__lv { display: flex; flex: 1; align-items: center; justify-content: flex-end; gap: 2px; height: 28px; overflow: hidden; }
.cm-recbar__lv i { flex: 0 0 3px; border-radius: 2px; background: var(--mg-amber); }
.cm-recbar__x { display: grid; place-items: center; width: 40px; height: 40px; flex-shrink: 0; padding: 0; border: 0; border-radius: 12px; background: none; color: var(--mg-copy); cursor: pointer; }
.cm-recbar__x:hover { color: #ff7a6b; background: rgba(255, 77, 61, .1); }
.cm-recbar__send { display: grid; place-items: center; width: 44px; height: 44px; flex-shrink: 0; padding: 0; border: 0; border-radius: 50%; background: var(--grad-cta); color: var(--mg-ink); cursor: pointer; }

/* запись кружка */
html.cm-cam-open { overflow: hidden; }
.cm-cam { position: fixed; inset: 0; z-index: 9600; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px; padding: 24px 16px calc(24px + env(safe-area-inset-bottom, 0px)); background: rgba(8, 6, 5, .94); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); animation: pg-in .2s ease; }
.cm-cam__stage { position: relative; width: min(78vw, 52vh, 380px); aspect-ratio: 1; }
.cm-cam__lv { position: absolute; inset: -6px; border-radius: 50%; background: radial-gradient(circle, rgba(242, 138, 45, .35) 55%, transparent 71%); transition: transform .1s; }
.cm-cam__view { position: absolute; inset: 6px; overflow: hidden; border-radius: 50%; background: #000; }
.cm-cam__view canvas { display: block; width: 100%; height: 100%; }
.cm-cam__ring .cm-ring__fg, .cm-cam__ring .cm-ring__bg { stroke-width: 2.5; }
.cm-cam__info { display: flex; align-items: center; gap: 8px; font-size: 18px; color: #fff3e0; font-variant-numeric: tabular-nums; }
.cm-cam__info small { font-size: 13px; color: var(--mg-muted); }
.cm-cam__bar { display: flex; align-items: center; gap: 22px; }
.cm-cam__btn { display: grid; place-items: center; width: 56px; height: 56px; padding: 0; border: 1px solid rgba(255, 255, 255, .2); border-radius: 50%; background: rgba(255, 255, 255, .08); color: #fff; cursor: pointer; }
.cm-cam__btn[hidden] { display: none; }
.cm-cam__btn:hover { background: rgba(255, 255, 255, .16); }
.cm-cam__send { display: grid; place-items: center; width: 72px; height: 72px; padding: 0; border: 0; border-radius: 50%; background: var(--grad-cta); color: var(--mg-ink); box-shadow: 0 10px 30px rgba(242, 138, 45, .4); cursor: pointer; }
.cm-cam__send svg { width: 28px; height: 28px; }
.cm-cam__hint { max-width: 320px; margin: 0; font-size: 12px; text-align: center; color: var(--mg-muted); }

/* отправка */
.cm-up { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 8px 12px 0; font-size: 13px; color: var(--mg-copy); }
.cm-up__t { flex: 1 1 160px; }
.cm-up__t.is-err { color: #ff8a7a; }
.cm-up__line { flex: 1 1 100%; height: 3px; overflow: hidden; border-radius: 2px; background: rgba(255, 255, 255, .1); }
.cm-up__line i { display: block; height: 100%; background: var(--grad-cta); transition: width .3s; }
.cm-up__x { display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 8px; background: none; color: var(--mg-copy); cursor: pointer; }
@media (max-width: 520px) {
  .cm-recbtn { width: 36px; }
  .soc-chat__form { gap: 4px; }
}
/* == end media == */

/* == mobfit == */
.soc-callmsg__again { flex-shrink: 0; white-space: nowrap; }
@media (max-width: 860px) {
  html.chat-full, html.chat-full body { overflow: hidden; overscroll-behavior: none; }
  html.chat-full .soc-msgs.has-peer { position: fixed; left: 0; right: 0; top: var(--vvt, 0px); z-index: 1550; height: var(--vvh, 100dvh); min-height: 0; margin: 0; border: 0; border-radius: 0; background: #0e0c0a; }
  html.chat-full .soc-msgs.has-peer .soc-chat { height: 100%; }
  html.chat-full .soc-chat__head { padding-top: max(10px, env(safe-area-inset-top, 0px)); }
  html.chat-full .bottom-nav, html.chat-full .mus-bar, html.chat-full #gdz-mini { display: none !important; }
  html.chat-full .cm-dock { z-index: 1600; }
  html.kb-open .bottom-nav { display: none !important; }
  html.kb-open .soc-chat__form { padding-bottom: 10px; }
  html.chat-full .soc-chat__form textarea { max-height: 34vh; }
  html.msgs-list, html.msgs-list body { overflow: hidden; overscroll-behavior: none; }
  html.msgs-list .soc-msgs:not(.has-peer) { min-height: 0; overflow: hidden; }
  html.msgs-list .soc-msgs:not(.has-peer) .soc-dlist { height: 100%; }
  html.msgs-list .soc-msgs:not(.has-peer) .soc-dlist__items { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
}
/* == end mobfit == */

/* == topbar == */
.topnav__inner { position: relative; }
.nav-radio { position: relative; }
.nav-radio__x { position: absolute; top: -6px; right: -6px; z-index: 2; display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; padding: 0; border: 1px solid rgba(212, 161, 75, .35); border-radius: 50%; background: #1a1612; color: #d8cbb8; cursor: pointer; opacity: .85; transition: opacity .15s, background .15s, color .15s; }
.nav-radio__x:hover { opacity: 1; background: #e8772e; color: #fff; border-color: #e8772e; }
.nav-radio__x svg { width: 11px; height: 11px; }
html.radio-off .nav-radio { display: none !important; }

.hdr-mus { display: inline-flex; align-items: center; gap: 2px; height: 44px; max-width: 360px; padding: 0 6px 0 4px; border-radius: 999px; border: 1px solid rgba(232, 119, 46, .45); background: rgba(16, 14, 11, .92); color: #f3e9da; animation: hdrMusIn .22s ease-out; }
.hdr-mus[hidden] { display: none !important; }
@keyframes hdrMusIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.hdr-mus button { border: 0; background: none; color: inherit; font: inherit; cursor: pointer; padding: 0; }
.hdr-mus__cover { flex: 0 0 36px; width: 36px; height: 36px; border-radius: 50%; background: linear-gradient(135deg, #e8772e, #6b2f12) center / cover no-repeat !important; }
.hdr-mus__info { display: grid; gap: 1px; min-width: 0; max-width: 150px; padding: 0 6px !important; text-align: left; line-height: 1.15; }
.hdr-mus__info b, .hdr-mus__info span { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.hdr-mus__info b { font-size: 12.5px; font-weight: 800; }
.hdr-mus__info span { font-size: 11px; opacity: .65; }
.hdr-mus__b { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 30px; width: 30px; height: 30px; border-radius: 50%; transition: background .15s, color .15s; }
.hdr-mus__b:hover { background: rgba(232, 119, 46, .16); color: #ffb27a; }
.hdr-mus__pp { flex-basis: 34px; width: 34px; height: 34px; background: #e8772e !important; color: #fff !important; }
.hdr-mus__pp:hover { background: #f08a45 !important; }
.hdr-mus .mus-like.is-on { color: #ff5b6e; }
.hdr-mus .mus-like.is-on svg path { fill: currentColor; }
html.hdr-mus-on .nav-grana { display: none; }
@media (max-width: 1180px) {
  .hdr-mus__info { max-width: 110px; }
  .hdr-mus [data-mact="prev"] { display: none; }
}
@media (max-width: 860px) {
  .hdr-mus { display: none !important; }
  .nav-radio__x { top: -4px; right: -6px; width: 17px; height: 17px; }
  .nav-radio__x svg { width: 9px; height: 9px; }
}

@media (min-width: 861px) {
  form.topnav__search { flex: 0 0 42px; width: 42px; max-width: 42px; height: 42px; min-height: 42px; padding: 0; justify-content: center; margin-left: auto; cursor: pointer; }
  form.topnav__search .topnav__q { display: none; }
  .topnav__search ~ .topnav__actions { margin-left: 10px; }
}
.topnav__sx { display: none; }
html.search-open form.topnav__search { position: absolute; z-index: 40; left: 50%; top: 50%; transform: translate(-50%, -50%); flex: none; width: min(640px, calc(100% - 24px)); max-width: none; height: 46px; min-height: 46px; margin: 0; padding: 0 6px 0 16px; justify-content: flex-start; cursor: text; background: #120f0c; border-color: rgba(232, 119, 46, .75); box-shadow: 0 12px 40px rgba(0, 0, 0, .55), 0 0 0 3px rgba(232, 119, 46, .15); animation: tsOpen .18s ease-out; }
@keyframes tsOpen { from { opacity: 0; width: 42px; } to { opacity: 1; } }
html.search-open .topnav .nav-extras { visibility: hidden; }
html.search-open .topnav__q { display: block !important; flex: 1; font-size: 15px; }
html.search-open .topnav__sx { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 34px; width: 34px; height: 34px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .06); color: inherit; cursor: pointer; }
html.search-open .topnav__sx:hover { background: rgba(232, 119, 46, .2); }
/* == end topbar == */

/* == appupd == */
.upd-bar { position: fixed; z-index: 2100; left: 50%; top: max(10px, env(safe-area-inset-top, 0px)); transform: translateX(-50%); display: flex; align-items: center; gap: 10px; width: min(720px, calc(100% - 16px)); padding: 10px 10px 10px 14px; border: 1px solid rgba(232, 119, 46, .55); border-radius: 16px; background: #17120d; color: #f3e9da; box-shadow: 0 14px 40px rgba(0, 0, 0, .55); font-size: 14px; line-height: 1.35; animation: updIn .3s ease-out; }
@keyframes updIn { from { opacity: 0; transform: translate(-50%, -12px); } to { opacity: 1; transform: translateX(-50%); } }
.upd-bar__ic { flex: 0 0 34px; display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: rgba(232, 119, 46, .18); color: #ff9a52; }
.upd-bar__txt { flex: 1; min-width: 0; }
.upd-bar__txt b { color: #ffb27a; }
.upd-bar__go, .upd-bar__later { flex: 0 0 auto; height: 36px; padding: 0 14px; border-radius: 999px; font: inherit; font-weight: 700; cursor: pointer; white-space: nowrap; }
.upd-bar__go { border: 0; background: #e8772e; color: #fff; }
.upd-bar__go:hover { background: #f08a45; }
.upd-bar__later { border: 1px solid rgba(255, 255, 255, .16); background: transparent; color: inherit; }
@media (max-width: 560px) {
  .upd-bar { flex-wrap: wrap; font-size: 13.5px; }
  .upd-bar__txt { flex-basis: calc(100% - 50px); }
  .upd-bar__go { margin-left: 44px; }
}
/* == end appupd == */

/* == tops2 == */
.tops-layout { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 18px; align-items: start; }
.tops-main { min-width: 0; }
.tops-side { position: sticky; top: 90px; display: grid; gap: 2px; padding: 12px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(16, 14, 11, .88); }
.tops-side__title { margin: 2px 6px 8px; font-weight: 800; font-size: 14px; color: var(--mg-hi); }
.tops-side__row { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 8px 10px; border: 0; border-radius: 10px; background: none; color: var(--mg-copy); font: inherit; font-size: 13.5px; text-align: left; cursor: pointer; }
.tops-side__row b { font: 700 13px/1 var(--mono); color: var(--mg-amber-lite); white-space: nowrap; }
.tops-side__row:hover { background: rgba(246, 230, 197, .05); }
.tops-side__row.is-active { background: rgba(248, 180, 90, .12); color: var(--mg-hi); }
.tops-tab__n { margin-left: 4px; padding: 1px 6px; border-radius: 999px; background: rgba(248, 180, 90, .2); color: #F8B45A; font: 700 11px/1.4 var(--mono); font-style: normal; }
.tops-award { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0 0 12px; padding: 10px 14px; border: 1px dashed rgba(248, 180, 90, .4); border-radius: 12px; font-size: 13px; color: var(--mg-copy); }
.tops-award b { color: var(--mg-hi); margin-right: 4px; }
.tops-award__p { padding: 3px 9px; border-radius: 999px; background: rgba(246, 230, 197, .06); white-space: nowrap; }
.tops-award__p--1 { background: rgba(255, 215, 114, .16); color: #ffd772; }
.tops-award__p--2 { background: rgba(214, 218, 223, .12); color: #d6dadf; }
.tops-award__p--3 { background: rgba(224, 160, 112, .14); color: #e0a070; }
.top-row__rank { display: grid; place-items: center; position: relative; }
.top-row__medal { position: absolute; inset: 50% auto auto 50%; width: 30px; height: 30px; transform: translate(-50%, -50%); border-radius: 50%; }
.top-row__rank b { position: relative; }
.top-row--1, .top-row--2, .top-row--3 { border-top-color: rgba(248, 180, 90, .12); }
.top-row--1 { padding: 18px 16px; grid-template-columns: 44px 64px minmax(0, 1fr) auto; background: linear-gradient(100deg, rgba(255, 215, 114, .16), rgba(16, 14, 11, 0) 70%); }
.top-row--1 .top-row__av { width: 64px; height: 64px; box-shadow: 0 0 0 3px #ffd772; }
.top-row--1 .top-row__name { font-size: 19px; font-weight: 800; }
.top-row--1 .top-row__val { font-size: 18px; color: #ffd772; }
.top-row--1 .top-row__medal { width: 38px; height: 38px; background: radial-gradient(circle at 35% 30%, #fff1b8, #ffcf4a 55%, #b8860b); }
.top-row--1 .top-row__rank b { font-size: 18px; color: #3a2600; }
.top-row--2 { padding: 14px 15px; grid-template-columns: 40px 52px minmax(0, 1fr) auto; background: linear-gradient(100deg, rgba(214, 218, 223, .1), rgba(16, 14, 11, 0) 70%); }
.top-row--2 .top-row__av { width: 52px; height: 52px; box-shadow: 0 0 0 2px #d6dadf; }
.top-row--2 .top-row__name { font-size: 16.5px; font-weight: 700; }
.top-row--2 .top-row__val { font-size: 16px; color: #e6e9ec; }
.top-row--2 .top-row__medal { width: 34px; height: 34px; background: radial-gradient(circle at 35% 30%, #ffffff, #c9ced4 55%, #7c8590); }
.top-row--2 .top-row__rank b { font-size: 16px; color: #23272c; }
.top-row--3 { padding: 12px 15px; grid-template-columns: 38px 44px minmax(0, 1fr) auto; background: linear-gradient(100deg, rgba(224, 160, 112, .1), rgba(16, 14, 11, 0) 70%); }
.top-row--3 .top-row__av { width: 44px; height: 44px; box-shadow: 0 0 0 2px #e0a070; }
.top-row--3 .top-row__name { font-size: 15.5px; }
.top-row--3 .top-row__val { font-size: 15px; color: #e0a070; }
.top-row--3 .top-row__medal { width: 30px; height: 30px; background: radial-gradient(circle at 35% 30%, #ffe0c4, #d98c52 55%, #8a4b1f); }
.top-row--3 .top-row__rank b { font-size: 14px; color: #2c1606; }
.top-row:not(.top-row--1):not(.top-row--2):not(.top-row--3) { padding: 8px 14px; font-size: 14px; }
.top-row:not(.top-row--1):not(.top-row--2):not(.top-row--3) .top-row__av { width: 32px; height: 32px; }
.top-row.is-me { background: rgba(248, 180, 90, .14); box-shadow: inset 4px 0 0 #F8B45A; }

.top-badge { display: inline-flex; align-items: center; gap: 3px; margin-left: 6px; padding: 2px 7px 2px 5px; border-radius: 999px; background: rgba(248, 180, 90, .14); color: #F8B45A; font: 700 11.5px/1.3 var(--mono); text-decoration: none; vertical-align: middle; transition: background .15s; }
.top-badge[hidden] { display: none; }
.top-badge svg { width: 13px; height: 13px; }
.top-badge:hover { background: rgba(248, 180, 90, .28); }
.top-badge.is-gold { background: linear-gradient(135deg, #ffd772, #e8a03c); color: #2c1a00; }
.stat .top-badge { margin: 6px 0 0; }

@media (max-width: 980px) {
  .tops-layout { grid-template-columns: 1fr; }
  .tops-side { display: none; }
}
@media (max-width: 560px) {
  .top-row--1 { grid-template-columns: 36px 52px minmax(0, 1fr) auto; padding: 14px 12px; gap: 10px; }
  .top-row--1 .top-row__av { width: 52px; height: 52px; }
  .top-row--1 .top-row__name { font-size: 16.5px; }
  .top-row--1 .top-row__val { font-size: 15px; }
  .top-row--2 { grid-template-columns: 34px 44px minmax(0, 1fr) auto; padding: 12px; gap: 10px; }
  .top-row--2 .top-row__av { width: 44px; height: 44px; }
  .top-row--3 { grid-template-columns: 32px 38px minmax(0, 1fr) auto; padding: 10px 12px; gap: 10px; }
  .top-row--3 .top-row__av { width: 38px; height: 38px; }
  .top-row__val { font-size: 12.5px; }
}
/* == end tops2 == */

/* == admapps == */
.apps-tbl-wrap { margin-top: 14px; overflow-x: auto; border: 1px solid var(--mg-border); border-radius: 12px; }
.apps-tbl { width: 100%; min-width: 620px; border-collapse: collapse; font-size: 13.5px; }
.apps-tbl th { padding: 9px 12px; text-align: left; font-weight: 600; font-size: 12px; color: var(--mg-muted); background: rgba(246, 230, 197, .04); }
.apps-tbl td { padding: 9px 12px; border-top: 1px solid rgba(246, 230, 197, .06); color: var(--mg-copy); white-space: nowrap; }
.apps-tbl td small { color: var(--mg-muted); }
.apps-tbl tr.is-gone td { opacity: .6; }
.apps-tbl__old, .apps-tbl__gone { margin-left: 4px; padding: 1px 7px; border-radius: 999px; font-size: 11px; }
.apps-tbl__old { background: rgba(248, 180, 90, .18); color: #F8B45A; }
.apps-tbl__gone { background: rgba(230, 90, 80, .16); color: #f08a80; }
/* == end admapps == */

/* == djlayout == */
@media (min-width: 1181px) {
  .dk-bottom { align-items: start; }
  .dk-bottom > .dk-browse { position: sticky; top: calc(var(--nav-h, 64px) + 12px); display: flex; flex-direction: column; min-height: min(620px, calc(100dvh - var(--nav-h, 64px) - 24px)); max-height: calc(100dvh - var(--nav-h, 64px) - 24px); }
  .dk-bottom > .dk-browse .dk-browse__body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
}
/* == end djlayout == */

/* == promo == */
.app-promo { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto 28px; align-items: center; gap: 12px; margin: 0 0 16px; padding: 10px 10px 10px 12px; border: 1px solid rgba(248, 180, 90, .28); border-radius: 14px; background: linear-gradient(110deg, rgba(248, 180, 90, .1), rgba(16, 14, 11, .9) 55%); animation: promoIn .25s ease-out; }
@keyframes promoIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.app-promo__ic { width: 48px; height: 48px; border-radius: 12px; object-fit: cover; background: #000; box-shadow: 0 4px 14px rgba(0, 0, 0, .45); }
.app-promo__txt { display: grid; gap: 2px; min-width: 0; }
.app-promo__txt b { font-size: 14.5px; color: var(--mg-hi); }
.app-promo__txt span { font-size: 12.5px; line-height: 1.35; color: var(--mg-copy); }
.app-promo__go { white-space: nowrap; }
.app-promo__x { display: grid; place-items: center; width: 28px; height: 28px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .06); color: var(--mg-muted); cursor: pointer; }
.app-promo__x:hover { background: rgba(248, 180, 90, .18); color: var(--mg-hi); }
.soc-dlist > .app-promo { flex: 0 0 auto; margin: 8px; grid-template-columns: 40px minmax(0, 1fr) 28px; grid-template-areas: "i t x" "b b b"; gap: 8px 10px; }
.soc-dlist > .app-promo .app-promo__ic { grid-area: i; width: 40px; height: 40px; border-radius: 10px; }
.soc-dlist > .app-promo .app-promo__txt { grid-area: t; }
.soc-dlist > .app-promo .app-promo__x { grid-area: x; align-self: start; }
.soc-dlist > .app-promo .app-promo__go { grid-area: b; justify-self: stretch; }
.apps-card__ic { width: 56px; height: 56px; border-radius: 14px; object-fit: cover; background: #000; margin-bottom: 4px; }
.sk-app { display: inline-flex; align-items: center; gap: 6px; }
.sk-app img { width: 20px; height: 20px; border-radius: 5px; }
.sk-tools__right { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.sk-back { white-space: nowrap; }
@media (max-width: 560px) {
  .sk-app { width: 34px; padding: 0; justify-content: center; }
  .sk-app span { display: none; }
  .sk-back { padding: 9px 12px; }
}
@media (max-width: 560px) {
  .app-promo { grid-template-columns: 44px minmax(0, 1fr) 28px; grid-template-areas: "i t x" "b b b"; gap: 8px 10px; }
  .app-promo__ic { grid-area: i; width: 44px; height: 44px; }
  .app-promo__txt { grid-area: t; }
  .app-promo__x { grid-area: x; align-self: start; }
  .app-promo__go { grid-area: b; justify-self: stretch; }
}
/* == end promo == */

/* == pushwarn == */
.push-warn { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto 28px; align-items: center; gap: 10px 12px; margin: 0 0 16px; padding: 10px 10px 10px 14px; border: 1px solid rgba(232, 92, 70, .45); border-radius: 14px; background: linear-gradient(110deg, rgba(232, 92, 70, .14), rgba(16, 14, 11, .92) 60%); }
.push-warn__ic { color: #ff8a6a; }
.push-warn__txt { display: grid; gap: 2px; min-width: 0; }
.push-warn__txt b { font-size: 14.5px; color: var(--mg-hi); }
.push-warn__txt span { font-size: 12.5px; line-height: 1.35; color: var(--mg-copy); }
.push-warn .btn { white-space: nowrap; }
.push-warn__x { display: grid; place-items: center; width: 28px; height: 28px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .06); color: var(--mg-muted); font-size: 18px; line-height: 1; cursor: pointer; }
.soc-dlist > .push-warn { flex: 0 0 auto; margin: 8px; }
.soc-dlist > .push-warn, .push-warn--narrow { grid-template-columns: 26px minmax(0, 1fr) 28px; grid-template-areas: "i t x" "b b b"; }
.soc-dlist > .push-warn .push-warn__ic { grid-area: i; align-self: start; }
.soc-dlist > .push-warn .push-warn__txt { grid-area: t; }
.soc-dlist > .push-warn .push-warn__x { grid-area: x; align-self: start; }
.soc-dlist > .push-warn .btn { grid-area: b; justify-self: stretch; }
@media (max-width: 560px) {
  .push-warn { grid-template-columns: 26px minmax(0, 1fr) 28px; grid-template-areas: "i t x" "b b b"; }
  .push-warn__ic { grid-area: i; align-self: start; }
  .push-warn__txt { grid-area: t; }
  .push-warn__x { grid-area: x; align-self: start; }
  .push-warn .btn { grid-area: b; justify-self: stretch; }
}
/* == end pushwarn == */

/* == appsnav == */
.apps-list { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.apps-card.is-mine { border-color: var(--accent, #e8772e); box-shadow: 0 0 0 1px var(--accent, #e8772e) inset; }
.apps-card.is-mine .card__title::after { content: "для вашего устройства"; display: block; margin-top: 4px; font-size: .74rem; font-weight: 600; letter-spacing: .02em; color: var(--accent, #e8772e); }
.apps-now { display: grid; gap: 4px; margin: 0 0 14px; padding: 12px 16px; border-radius: 14px; border: 1px solid rgba(120, 200, 140, .35); background: rgba(120, 200, 140, .08); }
.apps-now.is-old { border-color: rgba(232, 119, 46, .5); background: rgba(232, 119, 46, .1); }
.apps-now span, .apps-ios { font-size: .9rem; line-height: 1.45; }
.apps-ios { margin: 12px 2px 0; }
.apps-why { margin: 28px 0 8px; }
.apps-why__title { margin: 0 0 12px; font-size: 1.15rem; }
.apps-why__grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.apps-why__item { display: grid; gap: 6px; padding: 14px 16px; border-radius: 14px; border: 1px solid rgba(255, 255, 255, .08); background: rgba(255, 255, 255, .03); }
.apps-why__item b { font-size: .98rem; }
.apps-why__item span { font-size: .9rem; line-height: 1.45; opacity: .82; }
/* == end appsnav == */

/* == camlive == */
.cm-cam__view .cm-cam__live { display: block; width: 100%; height: 100%; object-fit: cover; }
.cm-cam__view .cm-cam__live.is-mirror { transform: scaleX(-1); }
/* == end camlive == */

/* == phonefix == */
html { -webkit-tap-highlight-color: transparent; }
html.chat-full .grana-visitor { display: none !important; }
.pg-seg button.is-on { background: var(--grad-cta, linear-gradient(135deg, #f7a14f, #e8772e)); color: var(--mg-ink, #1a1206); }
/* == end phonefix == */

/* == typeoffer == */
.typing-tip.is-offer { pointer-events: auto; cursor: pointer; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 6px; padding: 8px 12px; font-size: 14px; border-color: rgba(232, 119, 46, .7); box-shadow: 0 8px 22px rgba(0, 0, 0, .35); }
.typing-tip.is-offer s { opacity: .6; }
.typing-tip.is-offer b { color: #ffb36b; }
.typing-tip.is-offer small { flex-basis: 100%; font-size: 11px; opacity: .7; }
.typing-tip:not(.is-on) { pointer-events: none; }
/* == end typeoffer == */

/* == emoji == */
.emo-btn { flex: 0 0 auto; display: inline-grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--mg-copy, #cdbfa9); cursor: pointer; align-self: center; }
.emo-btn:hover, .emo-btn.is-on { color: var(--accent, #e8772e); background: rgba(232, 119, 46, .1); }
.comment-form { position: relative; }
.comment-form .emo-btn { align-self: flex-end; }
.emo-pop { position: fixed; z-index: 1200; max-height: min(320px, 60vh); display: flex; flex-direction: column; border: 1px solid rgba(212, 161, 75, .3); border-radius: 16px; background: rgba(20, 17, 13, .98); box-shadow: 0 18px 40px rgba(0, 0, 0, .45); overflow: hidden; }
.emo-pop[hidden] { display: none; }
.emo-pop__tabs { display: flex; gap: 2px; padding: 6px; border-bottom: 1px solid rgba(255, 255, 255, .07); overflow-x: auto; scrollbar-width: none; }
.emo-pop__tab { flex: 0 0 auto; width: 38px; height: 34px; border: 0; border-radius: 10px; background: transparent; font-size: 19px; cursor: pointer; }
.emo-pop__tab.is-on { background: rgba(232, 119, 46, .18); }
.emo-pop__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(38px, 1fr)); gap: 2px; padding: 6px; overflow-y: auto; overscroll-behavior: contain; }
.emo-pop__e { height: 40px; border: 0; border-radius: 10px; background: transparent; font-size: 24px; line-height: 1; cursor: pointer; }
.emo-pop__e:hover { background: rgba(255, 255, 255, .08); }
.emo-pop__empty { grid-column: 1 / -1; margin: 12px; font-size: 13px; opacity: .7; text-align: center; }
@media (max-width: 520px) { .soc-chat__form .emo-btn { width: 34px; } }
/* == end emoji == */

/* == misc28 == */
.toast.is-top { top: calc(72px + env(safe-area-inset-top)); bottom: auto; transform: translate(-50%, -12px); }
.toast.is-top.is-on { transform: translate(-50%, 0); }
.cover-now { display: flex; align-items: center; gap: 12px; margin-top: 12px; padding: 10px; border: 1px solid rgba(212, 161, 75, .3); border-radius: 12px; background: rgba(255, 255, 255, .03); }
.cover-now[hidden] { display: none; }
.cover-now img { flex: 0 0 auto; width: 128px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 8px; background: #000; }
.cover-now div { display: grid; gap: 3px; min-width: 0; }
.cover-now b { font-size: .95rem; }
.cover-now span { font-size: .85rem; line-height: 1.4; opacity: .75; }
/* == end misc28 == */

/* == updock == */
.updock { position: fixed; left: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 80; display: flex; align-items: center; gap: 10px; max-width: min(360px, calc(100vw - 32px)); padding: 8px 12px 8px 8px; border: 1px solid rgba(212, 161, 75, .4); border-radius: 14px; background: #17140f; color: inherit; text-decoration: none; box-shadow: 0 10px 30px rgba(0, 0, 0, .45); animation: updockIn .25s ease-out; }
.updock:hover { border-color: #d4a14b; }
.updock__ring { position: relative; flex: 0 0 36px; width: 36px; height: 36px; }
.updock__ring svg { width: 36px; height: 36px; transform: rotate(-90deg); }
.updock__ring circle { fill: none; stroke-width: 3.5; }
.updock__bg { stroke: rgba(255, 255, 255, .12); }
.updock__fg { stroke: #d4a14b; stroke-linecap: round; transition: stroke-dasharray .4s; }
.updock.is-indeterminate .updock__ring svg { animation: updockSpin 1.2s linear infinite; }
.updock.is-done .updock__fg { stroke: #5fbf7a; }
.updock.is-error .updock__fg { stroke: #e0605a; }
.updock__ring i { position: absolute; inset: 0; display: grid; place-items: center; font-style: normal; font-size: 11px; color: #d4a14b; }
.updock__txt { display: grid; min-width: 0; gap: 1px; }
.updock__txt b { overflow: hidden; font-size: .88rem; white-space: nowrap; text-overflow: ellipsis; }
.updock__txt small { overflow: hidden; font-size: .78rem; opacity: .75; white-space: nowrap; text-overflow: ellipsis; }
.updock__go { flex: 0 0 auto; margin-left: 4px; font-size: .8rem; font-weight: 600; color: #d4a14b; }
html.chat-full .updock { bottom: auto; top: calc(64px + env(safe-area-inset-top)); }
@media (max-width: 760px) { .updock { left: 10px; right: 10px; max-width: none; bottom: calc(74px + env(safe-area-inset-bottom)); } }
@keyframes updockIn { from { opacity: 0; transform: translateY(10px); } }
@keyframes updockSpin { to { transform: rotate(270deg); } }
/* == end updock == */

/* == readable == */
.post-hero__title { font-family: var(--sans); font-style: normal; font-weight: 750; letter-spacing: -0.01em; }
.post-hero__lead { font: 400 17px/1.55 var(--sans); font-style: normal; }
.post-content .post-lede,
.post-rich .post-lede,
.post-content .post-accent,
.post-rich .post-accent { font-family: var(--article-body); font-style: normal; }
.studio-kinds .tab { min-height: 42px; padding: 0 16px; font: 700 14.5px/1 var(--sans); letter-spacing: 0; text-transform: none; }
.studio-kinds .tab__n { opacity: .75; }
.studio-kinds .top-badge { font-size: 12.5px; }
.mcard__meta { font-size: 13.5px; }
.mcard__sub { padding: 2px 8px; border-radius: 999px; background: rgba(242, 138, 45, .12); color: var(--mg-amber); font-size: 12px; font-weight: 600; }
.mcard .mstat { font-size: 13.5px; }
/* == end readable == */

/* == musvol == */
.mus-vol { display: inline-flex; align-items: center; gap: 4px; }
.mus-vol__ic { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; color: var(--mg-copy, #e9dcc6); background: transparent; }
.mus-vol__ic:hover { color: var(--mg-amber, #f28a2d); background: rgba(255, 255, 255, .06); }
.mus-vol__ic svg { width: 20px; height: 20px; }
.mus-vol input[type="range"] { -webkit-appearance: none; appearance: none; width: 84px; height: 4px; margin: 0; border-radius: 99px; background: linear-gradient(90deg, #f28a2d var(--v, 100%), rgba(255, 255, 255, .18) var(--v, 100%)); cursor: pointer; }
.mus-vol input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 13px; height: 13px; border-radius: 50%; background: #fff3e0; box-shadow: 0 1px 4px rgba(0, 0, 0, .5); }
.mus-vol input[type="range"]::-moz-range-thumb { width: 13px; height: 13px; border: 0; border-radius: 50%; background: #fff3e0; }
.mus-vol--hdr { margin: 0 2px; }
.mus-vol--hdr .mus-vol__ic { width: 30px; height: 30px; }
.mus-vol--hdr input[type="range"] { width: 60px; }
.hdr-mus { max-width: 460px; }
.mus-vol--full { justify-content: center; width: min(360px, 100%); margin: 4px auto 0; }
.mus-vol--full input[type="range"] { flex: 1; width: auto; }
.mus-full__topr { display: inline-flex; align-items: center; gap: 10px; }
/* == end musvol == */

/* == wallundo == */
.soc-undo { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 12px; overflow: hidden; padding: 12px 16px; color: var(--mg-muted, #a99b86); background: rgba(255, 255, 255, .03); border-style: dashed; }
.soc-undo span { font-size: 14px; }
.soc-undo__bar { position: absolute; left: 0; bottom: 0; height: 2px; width: 100%; background: var(--mg-amber, #f28a2d); transform-origin: left; animation: socUndo linear forwards; }
@keyframes socUndo { from { transform: scaleX(1); } to { transform: scaleX(0); } }
/* == end wallundo == */

/* == bigchat == */
.chat-msg__acts { align-items: center; }
.chat-msg__acts button { font-size: 12px; }
.chat-msg__like { display: inline-flex; align-items: center; gap: 3px; }
.chat-msg__like em { font-style: normal; font-variant-numeric: tabular-nums; }
.chat-msg__acts .chat-msg__like.is-on { color: #f0607a; }
.chat-msg__quote { display: grid; gap: 1px; width: fit-content; max-width: 100%; margin-top: 4px; padding: 4px 10px; border: 0; border-left: 3px solid var(--mg-amber, #f28a2d); border-radius: 0 8px 8px 0; background: rgba(242, 138, 45, .1); color: inherit; text-align: left; font-size: 12.5px; cursor: pointer; }
.chat-msg__quote b { color: var(--mg-amber, #f28a2d); font-size: 12px; }
.chat-msg__quote span { overflow: hidden; color: var(--mg-copy); white-space: nowrap; text-overflow: ellipsis; }
.chat-msg.is-flash { animation: chatFlash 1.6s ease-out; }
@keyframes chatFlash { from { background: rgba(242, 138, 45, .25); } to { background: transparent; } }
.chat-replybar { display: flex; align-items: center; gap: 10px; margin-top: 10px; padding: 6px 10px; border-left: 3px solid var(--mg-amber, #f28a2d); border-radius: 0 10px 10px 0; background: rgba(242, 138, 45, .08); font-size: 13px; }
.chat-replybar[hidden] { display: none; }
.chat-replybar span { display: flex; flex: 1; gap: 6px; min-width: 0; }
.chat-replybar b { flex: 0 0 auto; color: var(--mg-amber, #f28a2d); }
.chat-replybar i { overflow: hidden; font-style: normal; opacity: .8; white-space: nowrap; text-overflow: ellipsis; }
.chat-replybar button { flex: 0 0 auto; width: 28px; height: 28px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .08); color: inherit; font-size: 18px; line-height: 1; cursor: pointer; }
.chat-replybar + .chat-compose { margin-top: 6px; }
/* == end bigchat == */

/* == minichat == */
.mc-msg { position: relative; }
.mc-acts { position: absolute; top: -10px; right: -6px; display: flex; gap: 2px; padding: 2px; border: 1px solid rgba(212, 161, 75, .3); border-radius: 999px; background: #1b1611; opacity: 0; pointer-events: none; transition: opacity .12s; }
.mc-msg.is-mine .mc-acts { right: auto; left: -6px; }
.mc-msg:hover .mc-acts, .mc-msg:focus-within .mc-acts { opacity: 1; pointer-events: auto; }
.mc-acts button { width: 26px; height: 26px; border: 0; border-radius: 50%; background: transparent; color: var(--mg-copy); font-size: 13px; line-height: 1; cursor: pointer; }
.mc-acts button:hover { background: rgba(242, 138, 45, .18); }
@media (hover: none) { .mc-acts { position: static; opacity: 1; pointer-events: auto; margin-top: 2px; border: 0; background: none; } }
.mc-quote { display: grid; gap: 1px; padding: 3px 8px; border-left: 3px solid var(--mg-amber, #f28a2d); border-radius: 0 6px 6px 0; background: rgba(242, 138, 45, .1); font-size: 12px; }
.mc-quote b { color: var(--mg-amber, #f28a2d); font-size: 11.5px; }
.mc-replybar { display: flex; align-items: center; gap: 8px; padding: 6px 10px 0; font-size: 12.5px; }
.mc-replybar[hidden] { display: none; }
.mc-replybar span { display: flex; flex: 1; gap: 6px; min-width: 0; padding-left: 8px; border-left: 3px solid var(--mg-amber, #f28a2d); }
.mc-replybar b { flex: 0 0 auto; color: var(--mg-amber, #f28a2d); }
.mc-replybar i { overflow: hidden; font-style: normal; opacity: .8; white-space: nowrap; text-overflow: ellipsis; }
.mc-replybar button { width: 24px; height: 24px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .08); color: inherit; font-size: 16px; line-height: 1; cursor: pointer; }
.mc-attach { display: grid; place-items: center; flex: 0 0 auto; width: 34px; height: 36px; font-size: 18px; text-decoration: none; opacity: .8; }
.mc-attach:hover { opacity: 1; }
/* == end minichat == */

/* == kfn == */
.mus-kfn-btn { display: inline-flex; align-items: center; gap: 6px; }
.mus-kfn-btn svg { width: 18px; height: 18px; }
.mus-kfn-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,.04); margin-bottom: 6px; }
.mus-kfn-row__meta { font-size: 14px; color: var(--mg-hi); min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.mus-kara-lead { margin: 0 0 12px; line-height: 1.45; }
.mus-kara-acts { margin-bottom: 14px; }
.kfn { position: relative; }
.kfn__x { position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; border: 1px solid var(--mg-border); border-radius: 10px; background: transparent; color: var(--mg-ivory); font-size: 22px; line-height: 1; cursor: pointer; }
.kfn__x:hover { border-color: var(--mg-amber); }
.kfn .soc-dlg__title { padding-right: 44px; }
.kfn__lead { margin: 0 0 14px; color: var(--mg-ivory); font-size: 14.5px; line-height: 1.5; }
.kfn__note { margin: 14px 0 0; color: var(--mg-muted, #b9a593); font-size: 13px; line-height: 1.45; }
.kfn-drop { display: flex; align-items: center; justify-content: center; gap: 14px; min-height: 92px; padding: 16px; border: 1.5px dashed var(--mg-border); border-radius: 16px; background: radial-gradient(circle at 20% 0%, rgba(242,138,45,.16), transparent 60%); color: var(--mg-amber); cursor: pointer; transition: border-color .15s, background-color .15s; }
.kfn-drop:hover, .kfn-drop.is-over { border-color: var(--mg-amber); background-color: rgba(242,138,45,.08); }
.kfn-drop svg { width: 34px; height: 34px; flex: none; }
.kfn-drop span { display: grid; gap: 3px; text-align: left; }
.kfn-drop b { color: var(--mg-hi); font-size: 16px; }
.kfn-drop small { color: var(--mg-ivory); font-size: 13px; opacity: .8; }
.kfn-list { display: grid; gap: 8px; margin-top: 14px; }
.kfn-empty { margin: 0; padding: 12px; border-radius: 12px; background: rgba(255,255,255,.03); color: var(--mg-ivory); font-size: 13.5px; opacity: .8; }
.kfn-row { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(255,255,255,.03); }
.kfn-row.is-err { border-color: rgba(216,52,63,.5); }
.kfn-row__play { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: linear-gradient(135deg, #f6b14e, #f28a2d 55%, #d8343f); color: #1a0f08; cursor: pointer; box-shadow: 0 8px 20px rgba(242,138,45,.3); }
.kfn-row__t { flex: 1; min-width: 0; display: grid; gap: 2px; }
.kfn-row__t b { overflow: hidden; color: var(--mg-hi); font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.kfn-row__t small { overflow: hidden; color: var(--mg-ivory); font-size: 12.5px; text-overflow: ellipsis; white-space: nowrap; opacity: .8; }
.kfn-row__err { color: #ff8a7a !important; opacity: 1 !important; white-space: normal !important; }
.kfn-row__up { flex: none; min-height: 36px; padding: 0 12px; font-size: 13px; }
.kfn-row__sing { border-color: transparent; background: linear-gradient(135deg, #f6b14e, #f28a2d 55%, #d8343f); color: #1a0f08; font-weight: 700; }
@media (max-width: 480px) { .kfn-row { flex-wrap: wrap; } .kfn-row__t { flex-basis: calc(100% - 60px); } .kfn-row__up { flex: 1; } }
.kfn { max-height: min(88vh, 860px); overflow-y: auto; overscroll-behavior: contain; }
.kfn__login { padding: 0; border: 0; background: none; color: var(--mg-amber); font: inherit; font-weight: 700; text-decoration: underline; cursor: pointer; }
.kfn-access { margin: 0 0 12px; min-height: 40px; }
.kfn-tools { display: flex; align-items: center; gap: 12px; margin-top: 14px; }
.kfn-search { flex: 1; min-width: 0; min-height: 44px; padding: 0 14px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(255,255,255,.04); color: var(--mg-hi); font: inherit; font-size: 16px; }
.kfn-search:focus { outline: none; border-color: var(--mg-amber); }
.kfn-tools small { flex: none; color: var(--mg-ivory); font-size: 12.5px; opacity: .75; }
.kfn-row__play[disabled], .kfn-row__play.is-idle { opacity: .45; cursor: default; box-shadow: none; }
.kfn-row.is-work .kfn-row__play.is-idle { animation: kfn-pulse 1.4s ease-in-out infinite; }
@keyframes kfn-pulse { 50% { opacity: .85; } }
.kfn-row__bar { display: block; height: 4px; margin-top: 4px; border-radius: 4px; background: linear-gradient(90deg, var(--mg-amber) calc(var(--p) * 100%), rgba(255,255,255,.1) calc(var(--p) * 100%)); }
.kfn-share { display: grid; gap: 10px; margin-bottom: 4px; padding: 12px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(255,255,255,.04); }
.kfn-share b { color: var(--mg-hi); font-size: 15px; }
.kfn-share p, .kfn-share label { margin: 0; color: var(--mg-ivory); font-size: 14px; }
.kfn-share select { display: block; width: 100%; min-height: 44px; margin-top: 6px; padding: 0 12px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(0,0,0,.25); color: var(--mg-hi); font: inherit; font-size: 16px; }
.kfn-share__terms { display: flex; gap: 8px; }
.kfn-share__terms button { flex: 1; min-height: 40px; border: 1px solid var(--mg-border); border-radius: 12px; background: transparent; color: var(--mg-ivory); font: inherit; cursor: pointer; }
.kfn-share__terms button.is-on { border-color: var(--mg-amber); color: var(--mg-hi); background: rgba(242,138,45,.16); }
.kfn-share__go { display: flex; gap: 8px; }
.kfn-share__go .btn { flex: 1; min-height: 40px; }
.kfn-row__del { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid var(--mg-border); border-radius: 12px; background: transparent; color: var(--mg-ivory); font-size: 20px; cursor: pointer; }
.kfn-row__del:hover { border-color: #ff8a7a; color: #ff8a7a; }
@media (max-width: 480px) { .kfn-tools { flex-wrap: wrap; } .kfn-tools small { flex-basis: 100%; } .kfn-row__del { order: 3; } }
/* == end kfn == */

/* == tgear == */
.tg-btn { flex: 0 0 auto; position: relative; display: inline-grid; place-items: center; width: 34px; height: 38px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--mg-copy, #cdbfa9); cursor: pointer; align-self: center; opacity: .8; }
.tg-btn:hover, .tg-btn.is-open { color: var(--accent, #e8772e); background: rgba(232, 119, 46, .1); opacity: 1; }
.tg-btn.is-off::after { content: ""; position: absolute; left: 8px; right: 8px; top: 50%; height: 2px; border-radius: 2px; background: currentColor; transform: rotate(-35deg); }
.comment-form .tg-btn { align-self: flex-end; }
.comment-form .tg-pair { display: flex; align-items: center; gap: 4px; }
.comment-form .tg-pair > .emo-btn, .comment-form .tg-pair > .tg-btn { align-self: center; margin: 0; }
.tg-pop { position: fixed; z-index: 1200; display: grid; gap: 4px; padding: 10px; border: 1px solid rgba(212, 161, 75, .3); border-radius: 16px; background: rgba(20, 17, 13, .98); box-shadow: 0 18px 40px rgba(0, 0, 0, .45); color: var(--mg-ivory, #efe4d2); }
.tg-pop[hidden] { display: none; }
.tg-pop__head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding: 2px 6px 6px; }
.tg-pop__head b { font-size: 15px; color: var(--mg-hi, #fff4e2); }
.tg-pop__head span { font-size: 12px; opacity: .7; }
.tg-pop__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; padding: 10px; border: 0; border-radius: 12px; background: rgba(255, 255, 255, .04); color: inherit; text-align: left; cursor: pointer; font: inherit; }
.tg-pop__row:hover { background: rgba(232, 119, 46, .1); }
.tg-pop__row span { display: grid; gap: 2px; min-width: 0; }
.tg-pop__row b { font-size: 14px; font-weight: 600; }
.tg-pop__row small { font-size: 12px; opacity: .7; }
.tg-sw { flex: none; position: relative; width: 40px; height: 24px; border-radius: 999px; background: rgba(255, 255, 255, .16); transition: background .2s; }
.tg-sw::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .3); transition: transform .2s; }
.tg-sw.is-on { background: linear-gradient(135deg, #f6b14e, #e8772e); }
.tg-sw.is-on::after { transform: translateX(16px); }
.tg-pop__more { padding: 8px 6px 2px; font-size: 13px; color: var(--accent, #e8772e); text-decoration: none; }
@media (max-width: 520px) { .soc-chat__form .tg-btn { width: 30px; } }
/* == end tgear == */

/* == pubchat == */
.soc-msgs--pub { grid-template-columns: minmax(0, 1fr); margin-top: 12px; }
.soc-chat__closed--pub { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px 14px; }
.soc-msg__hidden { display: block; color: var(--mg-muted, #9a8d7a); font-size: 13px; }
.soc-msg__hidden-text { display: block; margin-top: 4px; opacity: .55; font-size: 13px; }
.chat-members-dlg .chat-members { margin: 0; max-height: 60vh; overflow: auto; }
.chat-members-dlg .chat-members > summary { display: none; }
@media (max-width: 860px) {
  .soc-msgs--pub { margin-top: 8px; }
}
/* == end pubchat == */

/* == vplayer == */
.player.vp-on { -webkit-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; }
.vp { position: absolute; inset: 0; z-index: 2; color: #fff; font: 500 13px/1.2 var(--font, system-ui, sans-serif); }
.player video[hidden] + .vp,
.player:not(.player--ready):not([data-video-url]) .vp { display: none; }
.vp__hit { position: absolute; inset: 0; cursor: pointer; }
.vp-idle, .vp-idle .vp__hit { cursor: none; }
.vp__bar {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 12px 6px;
  background: linear-gradient(to top, rgba(0,0,0,.72), rgba(0,0,0,.34) 55%, transparent);
  transition: opacity .22s ease, transform .22s ease;
}
.vp-idle .vp__bar, .vp-idle .vp__big { opacity: 0; pointer-events: none; }
.vp-idle .vp__bar { transform: translateY(6px); }
.vp__track { position: relative; height: 18px; display: flex; align-items: center; cursor: pointer; touch-action: none; outline: none; }
.vp__rail { position: relative; width: 100%; height: 4px; border-radius: 4px; background: rgba(255,255,255,.24); overflow: hidden; transition: height .15s ease; }
.vp__track:hover .vp__rail, .vp-drag .vp__rail, .vp__track:focus-visible .vp__rail { height: 6px; }
.vp__buf, .vp__hov, .vp__done { position: absolute; inset: 0; transform-origin: left center; transform: scaleX(0); }
.vp__buf { background: rgba(255,255,255,.4); }
.vp__hov { background: rgba(255,255,255,.28); }
.vp__done { background: #ff7a3d; }
.vp__knob {
  position: absolute; top: 50%; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%;
  background: #ff7a3d; box-shadow: 0 0 0 3px rgba(255,122,61,.25); transform: scale(0); transition: transform .15s ease; pointer-events: none;
}
.vp__track:hover .vp__knob, .vp-drag .vp__knob, .vp__track:focus-visible .vp__knob, .vp-touch .vp__knob { transform: scale(1); }
.vp__pv {
  position: absolute; bottom: 22px; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 4px; pointer-events: none;
}
.vp__pvf { border-radius: 8px; overflow: hidden; background: #111; border: 2px solid rgba(255,255,255,.9); box-shadow: 0 6px 22px rgba(0,0,0,.55); }
.vp__pvf video { width: 100%; height: 100%; object-fit: cover; display: block; }
.vp__pv--notime .vp__pvf { display: none; }
.vp__pv span { padding: 2px 7px; border-radius: 6px; background: rgba(0,0,0,.72); font-variant-numeric: tabular-nums; font-weight: 600; }
.vp__row { display: flex; align-items: center; gap: 2px; min-height: 40px; }
.vp__b {
  width: 40px; height: 40px; display: inline-grid; place-items: center; border: 0; border-radius: 10px; padding: 0;
  background: transparent; color: #fff; cursor: pointer; position: relative; flex: none;
}
.vp__b:hover, .vp__b:focus-visible { background: rgba(255,255,255,.14); outline: none; }
.vp__b svg { width: 24px; height: 24px; filter: drop-shadow(0 1px 2px rgba(0,0,0,.5)); }
.vp__b--rate b { position: absolute; right: 0; bottom: 3px; padding: 0 3px; border-radius: 4px; background: #ff7a3d; color: #1a0d05; font-size: 10px; line-height: 13px; }
.vp__vol { display: flex; align-items: center; }
.vp__vr {
  --vp-v: 100%;
  width: 0; opacity: 0; margin: 0; height: 4px; -webkit-appearance: none; appearance: none; border-radius: 4px; cursor: pointer;
  background: linear-gradient(to right, #fff var(--vp-v), rgba(255,255,255,.3) var(--vp-v)); transition: width .18s ease, opacity .18s ease, margin .18s ease;
}
.vp__vol:hover .vp__vr, .vp__vr:focus-visible { width: 72px; opacity: 1; margin: 0 8px 0 2px; }
.vp__vr::-webkit-slider-thumb { -webkit-appearance: none; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 0; }
.vp__vr::-moz-range-thumb { width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 0; }
.vp__time { margin-left: 6px; white-space: nowrap; font-variant-numeric: tabular-nums; text-shadow: 0 1px 2px rgba(0,0,0,.6); }
.vp__time i { font-style: normal; opacity: .7; }
.vp__sp { flex: 1; }
.vp__big {
  position: absolute; left: 50%; top: 50%; width: 68px; height: 68px; margin: -34px 0 0 -34px; border-radius: 50%; border: 0;
  display: none; place-items: center; background: rgba(0,0,0,.5); color: #fff; cursor: pointer; transition: opacity .2s ease;
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
}
.vp__big svg { width: 34px; height: 34px; }
.vp-paused .vp__big, .vp-touch .vp__big { display: grid; }
.vp__spin {
  position: absolute; left: 50%; top: 50%; width: 46px; height: 46px; margin: -23px 0 0 -23px; border-radius: 50%;
  border: 4px solid rgba(255,255,255,.25); border-top-color: #fff; animation: vp-spin .8s linear infinite; pointer-events: none;
}
.vp__spin:not([hidden]) ~ .vp__big { opacity: 0; }
@keyframes vp-spin { to { transform: rotate(360deg); } }
.vp__osd {
  position: absolute; left: 50%; top: 22%; transform: translateX(-50%); padding: 8px 14px; border-radius: 12px;
  background: rgba(0,0,0,.62); font-weight: 700; font-size: 15px; pointer-events: none; display: flex; align-items: center; gap: 6px;
}
.vp__osd svg { width: 28px; height: 28px; }
.vp__osd--go { animation: vp-osd .7s ease forwards; }
@keyframes vp-osd { 0% { opacity: 0; } 15% { opacity: 1; } 70% { opacity: 1; } 100% { opacity: 0; } }
.vp__tap {
  position: absolute; top: 0; bottom: 0; width: 38%; display: grid; place-items: center; font-weight: 700; font-size: 15px;
  background: radial-gradient(closest-side, rgba(255,255,255,.2), transparent); pointer-events: none;
}
.vp__tap[hidden], .vp__osd[hidden], .vp__pv[hidden], .vp__spin[hidden] { display: none; }
.vp__tap--l { left: 0; border-radius: 0 50% 50% 0; }
.vp__tap--r { right: 0; border-radius: 50% 0 0 50%; }
.vp__err {
  position: absolute; inset: auto 12px 64px; display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap;
  padding: 10px 12px; border-radius: 10px; background: rgba(150,30,30,.92); text-align: center;
}
.vp__err[hidden] { display: none; }
.vp__menu {
  position: absolute; z-index: 3; right: 10px; bottom: 62px; min-width: 220px; max-width: calc(100% - 20px); max-height: calc(100% - 76px); overflow: auto;
  padding: 6px; border-radius: 12px; background: rgba(20,18,16,.94); box-shadow: 0 10px 34px rgba(0,0,0,.5); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
.vp__menu[hidden] { display: none; }
.vp__mi {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 9px 12px; border: 0; border-radius: 8px;
  background: transparent; color: #fff; font: inherit; text-align: left; cursor: pointer;
}
.vp__mi:hover, .vp__mi:focus-visible { background: rgba(255,255,255,.1); outline: none; }
.vp__mi em { font-style: normal; opacity: .72; }
.vp__mi.is-on::after { content: "✓"; color: #ff7a3d; font-weight: 700; }
.vp__mi--head { font-weight: 700; border-bottom: 1px solid rgba(255,255,255,.1); border-radius: 8px 8px 0 0; margin-bottom: 4px; }
.vp__keys { display: grid; gap: 6px; padding: 4px 12px 8px; }
.vp__keys div { display: flex; justify-content: space-between; gap: 14px; }
.vp__keys b { white-space: nowrap; }
.vp__keys span { opacity: .75; text-align: right; }
.player.vp-on:fullscreen { width: 100vw; height: 100vh; max-width: none; aspect-ratio: auto; border-radius: 0; margin: 0; background: #000; }
.player.vp-on:-webkit-full-screen { width: 100vw; height: 100vh; max-width: none; aspect-ratio: auto; border-radius: 0; margin: 0; background: #000; }
.player.vp-on:fullscreen .player__video { position: absolute; inset: 0; width: 100%; height: 100%; }
.vp-fs .vp__bar { padding: 40px 22px 14px; }
@media (max-width: 560px) {
  .vp__bar { padding: 22px 6px 2px; }
  .vp__b { width: 38px; height: 38px; }
  .vp__b--seek { display: none; }
  .vp__time { font-size: 12px; margin-left: 2px; }
}
.vp-touch .vp__vr { display: none; }
.player.vp-menu-open .player__endless { display: none; }
.player__endless { transition: opacity .3s ease; }
.player.vp-idle .player__endless { opacity: 0; pointer-events: none; }
.player.vp-pip .player__endless { display: none; }
@media (max-width: 560px) {
  .vp__menu { bottom: 50px; max-height: calc(100% - 58px); padding: 4px; }
  .vp__mi { padding: 7px 12px; }
}
/* == end vplayer == */

/* == railad == */
a.sfr.sfr--rail.sfr--photo { grid-template-columns: minmax(0, 1fr); padding: 30px 12px 14px; }
a.sfr.sfr--rail { overflow: hidden; }
.sfr--rail .sfr__title, .sfr--rail .sfr__text { overflow-wrap: anywhere; }
/* == end railad == */

/* == liab == */
/* отметка ответственности перед публикацией и окно с условиями */
.liab { display: flex; align-items: flex-start; gap: 10px; margin: 14px 0 0; padding: 12px 14px; border: 1px solid rgba(242,138,45,.35); border-radius: 14px; background: rgba(242,138,45,.07); color: var(--mg-copy, #d9d2c5); font-size: 13.5px; line-height: 1.5; cursor: pointer; }
.liab input { flex: none; width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--mg-amber, #f28a2d); cursor: pointer; }
.liab b { color: var(--mg-hi, #fff); }
.liab.is-need { animation: pubNeed 1.2s ease; border-color: var(--mg-amber, #f28a2d); }
.liab__doc { display: inline; padding: 0; border: 0; background: none; color: var(--mg-amber, #f28a2d); font: inherit; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.liab__doc:hover { color: #ffb36b; }
.liab-ov { position: fixed; inset: 0; z-index: 12000; display: grid; place-items: center; padding: max(14px, env(safe-area-inset-top)) 14px max(14px, env(safe-area-inset-bottom)); background: rgba(0,0,0,.62); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); animation: liabIn .18s ease; }
@keyframes liabIn { from { opacity: 0; } to { opacity: 1; } }
.liab-ov__panel { display: flex; flex-direction: column; width: min(640px, 100%); max-height: min(78dvh, 720px); border: 1px solid var(--mg-border, rgba(255,255,255,.14)); border-radius: 18px; background: #14110e; box-shadow: 0 30px 90px rgba(0,0,0,.7); overflow: hidden; }
.liab-ov__head { display: flex; align-items: flex-start; gap: 12px; padding: 16px 16px 12px 20px; border-bottom: 1px solid var(--mg-border, rgba(255,255,255,.1)); }
.liab-ov__head h2 { flex: 1; margin: 0; font: 700 17px/1.3 var(--display, system-ui); color: var(--mg-hi, #fff); }
.liab-ov__x { flex: none; display: grid; place-items: center; width: 36px; height: 36px; margin: -4px -2px 0 0; padding: 0; border: 1px solid var(--mg-border, rgba(255,255,255,.16)); border-radius: 10px; background: rgba(255,255,255,.04); color: inherit; font-size: 22px; line-height: 1; cursor: pointer; }
.liab-ov__x:hover { border-color: var(--mg-amber, #f28a2d); color: var(--mg-amber, #f28a2d); }
.liab-ov__body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 14px 20px 18px; }
.liab-ov__foot { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--mg-border, rgba(255,255,255,.1)); }
.liab-doc { color: var(--mg-copy, #d9d2c5); font-size: 14px; line-height: 1.6; }
.liab-doc h3 { margin: 16px 0 6px; font: 700 14.5px/1.35 var(--display, system-ui); color: var(--mg-hi, #fff); }
.liab-doc p { margin: 0 0 8px; }
.liab-doc ul { margin: 0 0 8px; padding-left: 20px; }
.liab-doc li { margin: 0 0 4px; }
.liab-doc__ed { color: var(--mg-muted, #9a9284); font-size: 12.5px; }
.gm-form .liab { grid-column: 1 / -1; }
@media (max-width: 640px) {
  .liab-ov { place-items: end center; padding: 0; }
  .liab-ov__panel { width: 100%; max-height: 82dvh; border-radius: 18px 18px 0 0; padding-bottom: env(safe-area-inset-bottom); }
  .liab-ov__foot .btn { flex: 1; }
}
/* == end liab == */

/* == cplus == */
/* телефон: оранжевый «+» в центре нижнего меню и лист «Создать» */
.bottom-nav__inner:has(.bnav-plus) { grid-template-columns: repeat(3, minmax(0, 1fr)) 64px repeat(2, minmax(0, 1.5fr)); align-items: center; }
.bnav-plus { position: relative; display: grid; place-items: center; width: 64px; height: 54px; padding: 0; border: 0; background: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.bnav-plus i { position: relative; display: grid; place-items: center; width: 54px; height: 54px; margin-top: -10px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #ffb15c, #f2701d 55%, #d9480f); color: #fff; box-shadow: 0 8px 22px -6px rgba(242, 112, 29, .75), 0 0 0 3px rgba(7, 7, 6, .96); transition: transform .15s ease; }
.bnav-plus i::after { content: ""; position: absolute; inset: 0; border-radius: 50%; box-shadow: 0 0 0 0 rgba(255, 138, 45, .6); animation: bnavPlus 7s ease-out 2s infinite; pointer-events: none; }
.bnav-plus svg { width: 26px; height: 26px; }
.bnav-plus:active i { transform: scale(.92); }
@keyframes bnavPlus { 0%, 80% { box-shadow: 0 0 0 0 rgba(255, 138, 45, 0); } 82% { box-shadow: 0 0 0 0 rgba(255, 138, 45, .65); } 100% { box-shadow: 0 0 0 16px rgba(255, 138, 45, 0); } }
@media (prefers-reduced-motion: reduce) { .bnav-plus i::after { animation: none; } }
.cs-ov { position: fixed; inset: 0; z-index: 1200; display: flex; align-items: flex-end; justify-content: center; background: rgba(0, 0, 0, 0); transition: background .22s ease; }
.cs-ov.is-on { background: rgba(0, 0, 0, .55); }
.cs-sheet { width: min(520px, 100%); padding: 8px 16px calc(18px + env(safe-area-inset-bottom)); border: 1px solid var(--mg-border, rgba(255,255,255,.12)); border-bottom: 0; border-radius: 22px 22px 0 0; background: #15120e; box-shadow: 0 -20px 60px rgba(0, 0, 0, .55); transform: translateY(100%); transition: transform .22s cubic-bezier(.2, .8, .2, 1); touch-action: pan-x; }
.cs-ov.is-on .cs-sheet { transform: translateY(0); }
.cs-sheet__grip { display: block; width: 42px; height: 5px; margin: 0 auto 8px; border-radius: 3px; background: rgba(255, 255, 255, .22); }
.cs-sheet__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.cs-sheet__head b { font: 700 18px/1.2 var(--display, system-ui); color: var(--mg-hi, #fff); }
.cs-sheet__x { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); border-radius: 50%; background: rgba(255, 255, 255, .04); color: inherit; font-size: 22px; line-height: 1; cursor: pointer; }
.cs-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.cs-tile { display: grid; justify-items: center; align-content: start; gap: 6px; min-height: 128px; padding: 16px 8px 14px; border: 1px solid var(--mg-border, rgba(255,255,255,.12)); border-radius: 18px; background: rgba(255, 255, 255, .03); color: var(--mg-copy, #ddd); text-align: center; cursor: pointer; transition: transform .12s ease, border-color .15s; -webkit-tap-highlight-color: transparent; }
.cs-tile:active { transform: scale(.96); }
.cs-tile i { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 16px; color: #fff; }
.cs-tile svg { width: 28px; height: 28px; }
.cs-tile--article i { background: linear-gradient(135deg, #f2a12d, #e8572e); }
.cs-tile--video i { background: linear-gradient(135deg, #ff4d6d, #c8102e); }
.cs-tile--music i { background: linear-gradient(135deg, #8b5cf6, #5b3fd6); }
.cs-tile b { font: 700 15px/1.2 var(--display, system-ui); color: var(--mg-hi, #fff); }
.cs-tile span { font-size: 12px; line-height: 1.3; color: var(--mg-muted, #9a9284); }
@media (min-width: 861px) { .cs-ov { align-items: center; } .cs-sheet { border-radius: 22px; border-bottom: 1px solid var(--mg-border, rgba(255,255,255,.12)); } .cs-sheet__grip { display: none; } }
/* == end cplus == */

/* == djpro == */
@media (min-width: 861px) {
  .layout:has(.dj-cab--wide) { grid-template-columns: var(--sidebar-w) minmax(0, 1fr) !important; }
  .layout:has(.dj-cab--wide) > .rail { display: none !important; }
}
.dk-top { grid-template-columns: minmax(0, 1fr) minmax(330px, 380px) minmax(0, 1fr); }
.dj-cab--wide .dk { padding-top: 6px; border-top: 3px solid #ff6a3d; border-radius: 4px 4px 0 0; }
.dj-cab--wide .dk-deck { background: linear-gradient(180deg, rgba(16,16,22,.98), rgba(8,8,12,.98)); box-shadow: inset 0 1px 0 rgba(255,255,255,.07); }
.dj-cab--wide .dk-wave { height: 102px; border: 1px solid rgba(255,255,255,.08); box-shadow: inset 0 2px 10px rgba(0,0,0,.45); }
.dj-cab--wide .dk-mixer { background: linear-gradient(180deg, rgba(20,20,28,.96), rgba(10,10,14,.96)); }
.dj-cab--wide .dk-jog__disc { box-shadow: inset 0 0 0 2px rgba(255,255,255,.12), 0 8px 24px rgba(0,0,0,.55); }
.dk-xbar, .dk-fx, .dk-scr { position: relative; min-width: 0; padding: 14px; border: 1px solid var(--mg-border, rgba(255,255,255,.12)); border-radius: 18px; background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01)); }
.dk-deck--a .dk-deck__id { background: linear-gradient(135deg, #c8102e, #ff6a3d); }
.dk-deck--b .dk-deck__id { background: linear-gradient(135deg, #1d6fd1, #5ab8ff); }
.dk-deck.is-playing { border-color: rgba(76,201,140,.45); }
.dk-hot { grid-template-columns: repeat(8, 1fr); gap: 5px; }
.dk-hot__b { height: 32px; font-size: 12px; }
.dk-hot__b--4.is-set { background: rgba(255,207,90,.22); border-color: #ffcf5a; }
.dk-hot__b--5.is-set { background: rgba(76,201,201,.22); border-color: #4cc9c9; }
.dk-hot__b--6.is-set { background: rgba(255,140,60,.22); border-color: #ff8c3c; }
.dk-hot__b--7.is-set { background: rgba(170,170,255,.22); border-color: #aaf; }
.dk-btn--brake { color: #ff9a9a; border-color: rgba(255,120,120,.4); }
.dk .dk-stems .dk-chip[data-dk="stemset"]:not(.is-on) { opacity: 1; text-decoration: none; }
.dk-chip[data-dk="stemset"].is-on { background: rgba(248,180,90,.18); border-color: #f8b45a; color: #ffd08a; }

.dk-mixer__modes { display: grid; grid-template-columns: 1fr 1fr; padding: 3px; border-radius: 12px; background: rgba(0,0,0,.3); }
.dk-seg { min-height: 30px; padding: 0 10px; border: 0; border-radius: 9px; background: transparent; color: var(--muted, #a3a3ad); font: 700 12px/1 var(--body, system-ui); cursor: pointer; white-space: nowrap; transition: background .15s, color .15s; }
.dk-seg:hover { color: #fff; }
.dk-seg.is-on { background: linear-gradient(135deg, rgba(255,106,61,.9), rgba(200,16,46,.9)); color: #fff; }
.dk-strips { gap: 8px; }
.dk-strip { gap: 8px; justify-items: center; padding: 10px 6px; border: 1px solid transparent; }
.dk-strip--a { border-color: rgba(255,106,61,.28); background: linear-gradient(180deg, rgba(255,106,61,.08), rgba(0,0,0,.22)); }
.dk-strip--b { border-color: rgba(90,184,255,.28); background: linear-gradient(180deg, rgba(90,184,255,.08), rgba(0,0,0,.22)); }
.dk-strip__id { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; color: #fff; }
.dk-strip--a .dk-strip__id { background: linear-gradient(135deg, #c8102e, #ff6a3d); }
.dk-strip--b .dk-strip__id { background: linear-gradient(135deg, #1d6fd1, #5ab8ff); }
.dk-strip__row { display: flex; justify-content: center; gap: 2px; width: 100%; }
.dk-vf { display: grid; justify-items: center; gap: 4px; min-width: 0; flex: 1 1 0; font-size: 10px; color: var(--muted, #a3a3ad); text-align: center; cursor: pointer; }
.dk-vf span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dk .dk-vf__in { writing-mode: vertical-lr; direction: rtl; width: 22px; height: 118px; margin: 0; accent-color: #ff6a3d; }
.dk-strip--b .dk-vf__in { accent-color: #5ab8ff; }
.dk .dk-vf--filt .dk-vf__in { accent-color: #d65aff; }
.dk .dk-vf--voc .dk-vf__in { accent-color: #ff5a7a; }
.dk .dk-vf--drm .dk-vf__in { accent-color: #ffcf5a; }
.dk .dk-vf--bas .dk-vf__in { accent-color: #4cc98c; }
.dk .dk-vf--mus .dk-vf__in { accent-color: #5ab8ff; }
.dk-strip__echo { justify-self: stretch; justify-content: center; }
.dk-fader { grid-template-columns: 8px auto; justify-content: center; gap: 10px; margin-top: 0; }
.dk-fader .dk-meter { height: 150px; }
.dk .dk-vf--vol .dk-vf__in { height: 150px; width: 28px; }
.dk-vf--vol span { font-weight: 700; color: inherit; }

.dk-xbar { display: grid; grid-template-columns: 120px minmax(0, 1fr) 120px auto; gap: 14px; align-items: center; background: radial-gradient(60% 120% at 0% 50%, rgba(255,106,61,.10), transparent 60%), radial-gradient(60% 120% at 100% 50%, rgba(90,184,255,.10), transparent 60%), linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01)); }
.dk-ab { display: grid; place-items: center; gap: 2px; height: 74px; border-radius: 16px; border: 2px solid rgba(255,255,255,.14); background: rgba(0,0,0,.25); color: inherit; cursor: pointer; transition: border-color .2s, box-shadow .25s, background .2s, transform .08s; }
.dk-ab:active { transform: scale(.97); }
.dk-ab b { font: 800 30px/1 var(--display, system-ui); }
.dk-ab small { font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted, #a3a3ad); }
.dk-ab--a b { color: #ff8a5c; }
.dk-ab--b b { color: #7cc6ff; }
.dk-ab--a.is-live { border-color: #ff6a3d; background: linear-gradient(160deg, rgba(255,106,61,.35), rgba(200,16,46,.2)); box-shadow: 0 0 0 4px rgba(255,106,61,.15), 0 0 28px rgba(255,106,61,.35); }
.dk-ab--b.is-live { border-color: #5ab8ff; background: linear-gradient(160deg, rgba(90,184,255,.35), rgba(29,111,209,.2)); box-shadow: 0 0 0 4px rgba(90,184,255,.15), 0 0 28px rgba(90,184,255,.35); }
.dk-ab.is-live b { color: #fff; }
.dk-ab.is-live small { color: #fff; }
.dk-ab.is-live.is-playing small::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 50%; background: #ff3b3b; vertical-align: 1px; animation: dkRec 1.2s ease-in-out infinite; }
@keyframes dkRec { 50% { opacity: .25; } }
.dk-xf2 { display: grid; gap: 6px; min-width: 0; }
.dk-xf2__scale { display: flex; justify-content: space-between; align-items: center; font: 800 12px/1 var(--display, system-ui); color: var(--muted, #a3a3ad); }
.dk-xf2__scale em { font-style: normal; font-weight: 600; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.dk .dk-xf2 input[type=range] { height: 30px; accent-color: var(--mg-gold, #f2c46d); }
.dk-xbar__go { display: grid; gap: 6px; justify-items: stretch; }
.dk-xgo { display: grid; gap: 2px; min-width: 150px; padding: 10px 16px; border: 0; border-radius: 14px; background: linear-gradient(135deg, #f2c46d, #ff8a3c); color: #1a0f05; font: 800 14px/1.1 var(--body, system-ui); cursor: pointer; }
.dk-xgo small { font-size: 11px; font-weight: 600; opacity: .75; }
.dk-xgo.is-on { background: linear-gradient(135deg, #4cc98c, #1f9d63); color: #fff; animation: dkRec 1.2s ease-in-out infinite; }

.dk-fx__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.dk-fx__wrap { display: grid; gap: 3px; min-width: 0; }
.dk-fx__b { --c: 255,106,61; position: relative; display: grid; align-content: space-between; height: 64px; padding: 8px 9px; border-radius: 14px; border: 1px solid rgba(var(--c), .45); background: linear-gradient(160deg, rgba(var(--c), .32), rgba(var(--c), .08)); color: #fff; text-align: left; font: 700 13px/1.15 var(--body, system-ui); cursor: pointer; touch-action: manipulation; user-select: none; transition: transform .06s, box-shadow .2s; }
.dk-fx__b b { font-size: 10.5px; font-weight: 700; opacity: .6; }
.dk-fx__b span { overflow: hidden; overflow-wrap: normal; hyphens: auto; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 12.5px; line-height: 1.1; }
.dk-fx__b:hover { box-shadow: 0 0 0 1px rgba(var(--c), .8); }
.dk-fx__b.is-hit { transform: scale(.95); box-shadow: 0 0 22px rgba(var(--c), .75), inset 0 0 0 2px rgba(255,255,255,.6); }
.dk-fx__b.is-own { border-style: dashed; }
.dk-fx__b--horn, .dk-fx__b--boom { --c: 255,106,61; }
.dk-fx__b--siren, .dk-fx__b--dub { --c: 255,70,90; }
.dk-fx__b--applause, .dk-fx__b--cheer { --c: 248,180,90; }
.dk-fx__b--whistle, .dk-fx__b--roll { --c: 76,201,140; }
.dk-fx__b--laser, .dk-fx__b--riser { --c: 214,90,255; }
.dk-fx__b--scratch, .dk-fx__b--rewind { --c: 90,184,255; }
.dk-fx__own { justify-self: center; font-size: 11px; color: var(--muted, #a3a3ad); cursor: pointer; }
.dk-fx__own button { padding: 0; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; text-decoration: underline; }
.dk-fx .dk-sec__head .dk-mini input { width: 110px; }

.dk-scr { display: grid; gap: 14px; background: radial-gradient(80% 60% at 100% 0%, rgba(200,16,46,.12), transparent 60%), linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01)); }
.dk-scr__head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.dk-scr__head h3 { margin: 0; font: 700 17px/1.2 var(--display, system-ui); }
.dk-scr__st { margin-right: auto; padding: 4px 10px; border-radius: 999px; background: rgba(255,255,255,.06); font-size: 12px; color: var(--muted, #a3a3ad); }
.dk-scr__st.is-on { background: rgba(76,201,140,.16); color: #7be3b0; }
.dk-scr__mons { display: grid; grid-template-columns: minmax(0, 1fr) 150px minmax(0, 1fr); gap: 14px; align-items: center; }
.dk-mon { margin: 0; display: grid; gap: 6px; min-width: 0; }
.dk-mon figcaption { display: flex; align-items: center; gap: 8px; font: 700 13px/1 var(--body, system-ui); }
.dk-mon figcaption small { font-weight: 500; color: var(--muted, #a3a3ad); }
.dk-mon__box { position: relative; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: #07040a; border: 2px solid rgba(255,255,255,.14); }
.dk-mon--live .dk-mon__box { border-color: rgba(255,59,59,.75); box-shadow: 0 0 0 3px rgba(255,59,59,.12); }
.dk-mon__box iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; pointer-events: none; }
.dk-rec { width: 9px; height: 9px; border-radius: 50%; background: #ff3b3b; animation: dkRec 1.2s ease-in-out infinite; }
.dk-scr__go { display: grid; gap: 10px; justify-items: center; text-align: center; }
.dk-go { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: 100%; min-height: 52px; padding: 0 14px; border: 0; border-radius: 14px; background: linear-gradient(135deg, #c8102e, #ff6a3d); color: #fff; font: 800 15px/1 var(--body, system-ui); cursor: pointer; transition: opacity .2s, transform .08s; }
.dk-go svg { width: 18px; height: 18px; }
.dk-go:active { transform: scale(.97); }
.dk-go:disabled { opacity: .35; cursor: default; }
.dk-go.is-pulse { animation: dkGo 1.6s ease-in-out infinite; }
@keyframes dkGo { 50% { box-shadow: 0 0 0 6px rgba(255,106,61,.22), 0 0 26px rgba(255,106,61,.55); } }
.dk-scr__go .dk-switch { font-size: 12.5px; }
.dk-scr__go .dk-note { font-size: 11.5px; }
.dk-scr__tabs { display: flex; gap: 4px; flex-wrap: wrap; padding: 4px; border-radius: 12px; background: rgba(0,0,0,.28); }
.dk-scr__tabs .dk-seg { flex: 1 1 auto; }
.dk-scr__panel { display: grid; gap: 10px; min-height: 150px; align-content: start; }
.dk-scr__panel > .btn { justify-self: start; }
.dk-lbl { margin: 4px 0 0; font-size: 12px; font-weight: 700; color: var(--muted, #a3a3ad); }
.dk-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.dk-chip[data-bg]::before { content: ""; width: 12px; height: 12px; border-radius: 4px; background: #333; }
.dk-chip[data-bg="night"]::before { background: linear-gradient(135deg, #3b1a6e, #0f3a6b); }
.dk-chip[data-bg="sunset"]::before { background: linear-gradient(135deg, #ffb35c, #c8264f); }
.dk-chip[data-bg="neon"]::before { background: linear-gradient(135deg, #ff28be, #00dcff); }
.dk-chip[data-bg="gold"]::before { background: linear-gradient(135deg, #fff1c2, #a8731f); }
.dk-chip[data-bg="ocean"]::before { background: linear-gradient(135deg, #1dd3c4, #0a4a7a); }
.dk-chip[data-bg="wedding"]::before { background: linear-gradient(135deg, #f3cfc0, #6d3b52); }
.dk-chip[data-bg="color"]::before { background: conic-gradient(red, yellow, lime, cyan, blue, magenta, red); }
.dk-chip[data-bg="img"]::before { background: linear-gradient(135deg, #888, #444); }
.dk-lay { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 18px; }
.dk-lay__col { display: grid; gap: 8px; align-content: start; min-width: 0; }
.dk-lay__map { position: relative; display: grid; gap: 4px; aspect-ratio: 16 / 9; max-width: 340px; padding: 4px; border-radius: 12px; background: #07040a; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); }
.dk-lay__map--2 { grid-template-columns: 1fr 1fr; }
.dk-lay__map--4 { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; }
.dk-lay__map--pip { display: block; }
.dk-lay__map--pip .dk-lay__z { position: absolute; }
.dk-lay__map--pip .dk-lay__z:first-child { inset: 4px; }
.dk-lay__map--pip .dk-lay__z:last-child { right: 10px; bottom: 10px; width: 38%; height: 38%; z-index: 1; box-shadow: 0 4px 14px rgba(0,0,0,.6); }
.dk-lay__z { display: grid; align-content: center; justify-items: center; gap: 2px; min-width: 0; padding: 4px; border-radius: 8px; border: 1.5px solid rgba(255,255,255,.12); background: rgba(255,255,255,.05); color: inherit; font: 600 11px/1.2 var(--body, system-ui); cursor: pointer; text-align: center; }
.dk-lay__z b { font-size: 11px; }
.dk-lay__z span { color: var(--muted, #a3a3ad); font-size: 10.5px; }
.dk-lay__z.is-on { border-color: #ff6a3d; background: rgba(255,106,61,.18); }
.dk-lay__z.is-on span { color: #ffb08f; }
.dk-srcs { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 6px; }
.dk-srcs .dk-chip { justify-content: center; min-height: 36px; }
.dk-form2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.dk-form2--row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px; }
.dk-fld { display: grid; gap: 3px; min-width: 0; font-size: 11.5px; color: var(--muted, #a3a3ad); }
.dk-fld input { min-width: 0; height: 34px; padding: 0 10px; border-radius: 10px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); background: rgba(255,255,255,.04); color: var(--mg-copy, #fff); font: inherit; font-size: 13.5px; }
.dk-fld--grow { flex: 1 1 220px; }
.dk-fld--sm { flex: 0 0 96px; }
.dk-fld--color input { width: 64px; padding: 2px; }
.dk-fld[hidden], .dk-file[hidden] { display: none; }
.dk-file { cursor: pointer; }
.dk-media__bar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.dk-media { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 8px; }
.dk-media__it { position: relative; min-width: 0; }
.dk-media__b { position: relative; display: grid; width: 100%; padding: 0; border-radius: 10px; overflow: hidden; border: 2px solid rgba(255,255,255,.12); background: #000; color: #fff; cursor: pointer; text-align: left; }
.dk-media__b img, .dk-media__b video { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.dk-media__b span { padding: 4px 6px; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: rgba(0,0,0,.7); }
.dk-media__b.is-on { border-color: #ff6a3d; }
.dk-media__b.is-live::after { content: "в эфире"; position: absolute; left: 5px; top: 5px; padding: 2px 6px; border-radius: 6px; background: #ff3b3b; font-size: 10px; font-weight: 700; }
.dk-media__v { position: absolute; right: 5px; top: 5px; padding: 2px 6px; border-radius: 6px; background: rgba(0,0,0,.65); font-style: normal; font-size: 10px; }
.dk-media__x { position: absolute; right: 4px; bottom: 26px; background: rgba(0,0,0,.65); color: #fff; }
.dk-ovs { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }
.dk-scr__panel .dk-note { max-width: 760px; }

@media (max-width: 1280px) {
  .dk-top { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .dk-top > .dk-mixer { grid-column: 1 / -1; grid-row: 2; }
  .dk-strips { max-width: 560px; justify-self: center; width: 100%; }
}
@media (max-width: 900px) {
  .dk-scr__mons { grid-template-columns: 1fr 1fr; }
  .dk-scr__go { grid-column: 1 / -1; grid-row: 2; grid-template-columns: auto auto; justify-content: center; align-items: center; }
  .dk-scr__go .dk-note { grid-column: 1 / -1; }
  .dk-lay { grid-template-columns: 1fr; }
  .dk-xbar { grid-template-columns: 1fr 1fr; }
  .dk-xf2 { grid-column: 1 / -1; grid-row: 2; }
  .dk-xbar__go { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .dk-top { grid-template-columns: 1fr; }
  .dk-top > .dk-mixer { grid-row: auto; }
  .dk-hot { grid-template-columns: repeat(4, 1fr); }
  .dk-fx__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dk-scr__mons { grid-template-columns: 1fr; }
  .dk-scr__go { grid-row: auto; }
  .dk-form2 { grid-template-columns: 1fr; }
  .dk .dk-vf__in { height: 96px; }
  .dk .dk-vf--vol .dk-vf__in, .dk-fader .dk-meter { height: 120px; }
}
/* == end djpro == */

/* == djph == */
.dk-msg__ph{display:block;margin:6px 0 4px;max-width:220px}
.dk-msg__ph img{display:block;width:100%;max-height:180px;object-fit:cover;border-radius:10px;border:1px solid rgba(255,255,255,.12)}
.soc-compose__liab{margin:8px 0 4px}
/* == end djph == */

/* == podload == */
.podium.is-loading{display:block;min-height:328px;position:relative;overflow:hidden}
.podium.is-loading::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.05) 50%,transparent 70%);background-size:200% 100%;animation:podShim 1.4s linear infinite}
@keyframes podShim{from{background-position:120% 0}to{background-position:-80% 0}}
@media (max-width:860px){.podium.is-loading{min-height:300px}}
/* == end podload == */

/* == djflt == */
.dk-flt{display:flex;flex-wrap:wrap;gap:8px 12px;margin:8px 0 10px}
.dk-flt .dk-mini{flex:1 1 150px;min-width:0}
.dk-flt select{width:100%}
.dk-tr__meta{flex:none;display:inline-flex;align-items:baseline;gap:5px;padding:3px 7px;border-radius:8px;background:rgba(255,255,255,.05);font-size:11.5px;font-variant-numeric:tabular-nums;white-space:nowrap}
.dk-tr__meta b{font-weight:700}
.dk-tr__meta i{font-style:normal;font-weight:800;color:#7fd6c2}
.dk-tr__meta.is-match{background:rgba(127,214,194,.16);box-shadow:inset 0 0 0 1px rgba(127,214,194,.45)}
.dk-tr__meta.is-wait{opacity:.6}
/* == end djflt == */

/* == djflt2 == */
.dk-browse__body{align-content:start}
.dk-browse__body > .dk-flt{margin:2px 0 4px}
/* == end djflt2 == */

/* == djflt3 == */
@media (max-width:600px){.dk-flt{display:grid;grid-template-columns:1fr;gap:8px}.dk-flt .dk-mini{display:grid;grid-template-columns:96px 1fr;align-items:center}}
/* == end djflt3 == */

/* == stkinds == */
@media (max-width: 560px) {
  .studio-kinds-bar .studio-kinds { flex-wrap: wrap; overflow: visible; margin: 0; padding: 0; max-width: 100%; }
  .studio-kinds .tab { flex: 1 1 auto; justify-content: center; padding: 0 12px; min-height: 40px; }
  .studio-kinds .top-badge { margin-left: 4px; padding: 2px 6px 2px 4px; }
  .studio-kinds-bar .studio-search { flex: 1 1 100%; }
}
/* == end stkinds == */

/* == cmlogin == */
.comment-login { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 0 0 18px; padding: 14px 16px; border: 1px solid var(--line, rgba(255,255,255,.12)); border-radius: 14px; background: rgba(255, 255, 255, .03); }
.comment-login span { flex: 1 1 240px; color: var(--muted, #b9b2a6); font-size: 14.5px; line-height: 1.45; }
/* == end cmlogin == */

/* == chatico == */
.chat-ico { display: inline-grid; place-items: center; flex: 0 0 auto; width: 44px; height: 44px; border-radius: 14px; background: rgba(248, 180, 90, .12); border: 1px solid rgba(248, 180, 90, .22); font-size: 24px; line-height: 1; }
.chat-title { display: flex; align-items: center; gap: 12px; }
.chat-title .chat-ico { width: 48px; height: 48px; font-size: 26px; }
.chat-ico-pick { position: relative; display: inline-block; }
.chat-ico-pick > summary { list-style: none; cursor: pointer; transition: transform .15s; }
.chat-ico-pick > summary::-webkit-details-marker { display: none; }
.chat-ico-pick > summary:hover { transform: scale(1.06); }
.chat-ico-pick > summary::after { content: "✎"; position: absolute; right: -4px; bottom: -4px; width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; background: var(--mg-gold, #e8a03c); color: #2c1a00; font-size: 11px; }
.chat-ico-pick[open] > .chat-icons { position: absolute; z-index: 30; top: calc(100% + 8px); left: 0; width: min(330px, 86vw); padding: 10px; border-radius: 14px; border: 1px solid var(--mg-border); background: rgba(20, 17, 13, .98); box-shadow: 0 14px 40px rgba(0, 0, 0, .45); }
.chat-icons { display: grid; grid-template-columns: repeat(auto-fill, minmax(40px, 1fr)); gap: 6px; }
.chat-icons__i { position: relative; display: grid; place-items: center; height: 40px; border-radius: 10px; border: 1px solid transparent; background: rgba(255, 255, 255, .04); font-size: 21px; line-height: 1; cursor: pointer; padding: 0; color: inherit; }
.chat-icons__i input { position: absolute; opacity: 0; pointer-events: none; }
.chat-icons__i:hover { background: rgba(248, 180, 90, .14); }
.chat-icons__i:has(input:checked), .chat-icons__i.is-on { border-color: var(--mg-gold, #e8a03c); background: rgba(248, 180, 90, .18); }
.studio-danger { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 28px; padding: 16px 18px; border-radius: 14px; border: 1px solid rgba(230, 90, 70, .35); background: rgba(230, 90, 70, .06); }
.studio-danger p { margin: 4px 0 0; font-size: 14px; }
.studio-danger__btn { border-color: rgba(230, 90, 70, .55); color: #ff9c8a; }
.studio-danger__btn:hover { background: rgba(230, 90, 70, .14); }
.chat-ico > img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: inherit; }
.chat-icons__own { grid-column: 1 / -1; display: grid; place-items: center; height: 40px; border-radius: 10px; border: 1px dashed rgba(248, 180, 90, .4); color: var(--mg-gold, #e8a03c); font-size: 14px; font-weight: 600; cursor: pointer; }
.chat-icons__own:hover { background: rgba(248, 180, 90, .1); }
@media (max-width: 720px) {
  .chat-card { position: relative; }
  .chat-card > .chat-ico { position: absolute; top: 12px; right: 14px; width: 38px; height: 38px; font-size: 20px; }
  .chat-card .chat-card__main { padding-right: 46px; }
  .chat-title .chat-ico { width: 40px; height: 40px; font-size: 22px; }
}
/* == end chatico == */

/* == chxliab == */
.chx-liab:empty { display: none; }
.chx-liab { padding: 6px 10px 2px; }
.chx-liab .liab { margin: 0; font-size: 12.5px; }
/* == end chxliab == */

/* == cmhide == */
@media (max-width: 720px) {
  .soc-chat__form:has(textarea[data-sdm]:not(:placeholder-shown)) .cm-recbtn { display: none; }
}
/* == end cmhide == */

/* == avico == */
.soc-av__ini.soc-av__ico { background: rgba(248, 180, 90, .14); font-size: 1.25em; line-height: 1; }
/* == end avico == */

/* == giftbar == */
.bal-chip__rank[data-top-key] { cursor: pointer; text-decoration: underline dotted rgba(242,138,45,.6); text-underline-offset: 2px; }
.bal-chip__rank[data-top-key]:hover { color: #f28a2d; }
.giftbar { position: fixed; z-index: 1300; width: min(380px, calc(100vw - 16px)); max-height: min(560px, calc(100dvh - 90px)); display: flex; flex-direction: column; gap: 10px; padding: 12px 14px 14px; border: 1px solid var(--mg-border); border-radius: 18px; background: var(--mg-card, #17130f); color: var(--mg-hi); box-shadow: 0 24px 60px rgba(0,0,0,.45); animation: giftbar-in .16s ease-out; overflow: hidden; }
@keyframes giftbar-in { from { opacity: 0; transform: translateY(-6px); } }
.giftbar__load, .giftbar__empty { margin: 0; padding: 14px 4px; color: var(--mg-muted, #9b8c74); font-size: 14px; line-height: 1.45; }
.giftbar__head { display: flex; align-items: center; gap: 6px; }
.giftbar__head b { order: 1; margin-right: auto; font-size: 16px; }
.giftbar__back { order: 0; }
.giftbar__x { order: 2; }
.giftbar__back, .giftbar__x { display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--mg-copy); font-size: 22px; line-height: 1; cursor: pointer; }
.giftbar__back:hover, .giftbar__x:hover { background: var(--mg-hover, rgba(255,255,255,.08)); color: var(--mg-gold); }
.giftbar__shelf { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px 6px; padding: 10px 6px 12px; overflow-y: auto; border-radius: 14px; background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(0,0,0,.18)), repeating-linear-gradient(180deg, transparent 0 92px, rgba(139,90,43,.55) 92px 98px); }
.giftbar__item { display: grid; justify-items: center; gap: 2px; padding: 4px 2px; border: 0; border-radius: 12px; background: transparent; color: var(--mg-copy); font: inherit; cursor: pointer; }
.giftbar__item:hover { background: var(--mg-hover, rgba(255,255,255,.06)); }
.giftbar__item .gift-art { width: 64px; height: 64px; }
.giftbar__item small { max-width: 78px; overflow: hidden; font-size: 11px; line-height: 1.2; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.giftbar__pack { display: grid; place-items: center; width: 64px; height: 64px; animation: giftbar-wiggle 2.2s ease-in-out infinite; }
.giftbar__pack svg { width: 48px; height: 48px; }
.giftbar__item.is-closed small { color: #f28a2d; font-weight: 700; }
@keyframes giftbar-wiggle { 0%, 80%, 100% { transform: none; } 85% { transform: rotate(-8deg); } 90% { transform: rotate(7deg); } 95% { transform: rotate(-4deg); } }
.giftbar__foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.giftbar__foot .btn--cta { display: inline-flex; align-items: center; gap: 6px; }
.giftbar__foot .btn--cta svg { width: 16px; height: 16px; }
.giftbar__tiers { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
.giftbar__tiers .gift-tier { flex: none; }
.giftbar__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; overflow-y: auto; }
.giftbar__grid .gift-tile { padding: 8px 4px; }
.giftbar__grid .gift-art { width: 72px; height: 72px; }
.giftbar__chosen { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 12px; background: var(--mg-hover, rgba(255,255,255,.05)); }
.giftbar__chosen .gift-art { width: 44px; height: 44px; }
.giftbar__chosen span { flex: 1; font-weight: 600; }
.giftbar__chosen em { display: inline-flex; align-items: center; gap: 4px; font-style: normal; color: var(--mg-gold); font-variant-numeric: tabular-nums; }
.giftbar__chosen em svg, .giftbar__bal svg { width: 15px; height: 15px; }
.giftbar__q { width: 100%; padding: 10px 12px; border: 1px solid var(--mg-border); border-radius: 12px; background: transparent; color: var(--mg-hi); font: inherit; font-size: 16px; }
.giftbar__people { display: grid; gap: 2px; overflow-y: auto; min-height: 120px; }
.giftbar__person { display: flex; align-items: center; gap: 10px; padding: 8px; border: 0; border-radius: 12px; background: transparent; color: var(--mg-hi); font: inherit; text-align: left; cursor: pointer; }
.giftbar__person:hover { background: var(--mg-hover, rgba(255,255,255,.06)); }
.giftbar__person > span:nth-child(2) { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.giftbar__person small { color: var(--mg-muted, #9b8c74); font-size: 12px; }
.giftbar__av { display: grid; place-items: center; width: 34px; height: 34px; flex: none; overflow: hidden; border-radius: 50%; }
.giftbar__av img, .giftbar__av span { display: grid; place-items: center; width: 100%; height: 100%; object-fit: cover; color: #fff; font-size: 13px; font-weight: 700; }
.giftbar__bal { display: inline-flex; align-items: center; gap: 4px; color: var(--mg-copy); font-size: 14px; }
.giftbar__done { display: grid; justify-items: center; gap: 10px; padding: 8px 0 4px; text-align: center; }
.giftbar__done .gift-art { width: 140px; height: 140px; }
.giftbar__done p { margin: 0; }
@media (prefers-reduced-motion: reduce) { .giftbar, .giftbar__pack { animation: none; } }
/* == end giftbar == */

/* == admstaff == */
.admin-tabs { position: sticky; top: calc(var(--nav-h) + var(--gdz-safe-top, 0px)); z-index: 40; margin-left: -4px; margin-right: -4px; padding: 8px 4px; background: var(--mg-black, #0b0a08); box-shadow: 0 8px 14px -12px rgba(0,0,0,.6); }
.admin-tabs a.is-on { border-color: rgba(248, 180, 90, .75); color: var(--mg-hi); background: rgba(248, 180, 90, .12); }
#admin-staff, #admin-people, #admin-retention, #admin-rates, #admin-partners, #admin-apps { scroll-margin-top: calc(var(--nav-h) + var(--gdz-safe-top, 0px) + 64px); }
.staff-tbl td { vertical-align: top; }
.staff-tbl td small { display: block; margin-top: 2px; color: var(--mg-muted, #9b8c74); font-size: 12px; line-height: 1.35; }
.staff-tbl__num { white-space: nowrap; }
.staff-tag { display: inline-block; margin-left: 4px; padding: 1px 7px; border-radius: 999px; background: rgba(155, 231, 255, .14); color: #9be7ff; font-size: 11px; font-weight: 600; vertical-align: 1px; }
.staff-rates { margin-top: 12px; }
.staff-rates summary { cursor: pointer; color: var(--mg-gold); font-weight: 600; }
.staff-rates ul { margin: 8px 0; padding-left: 18px; line-height: 1.6; }
.staff-gives { display: grid; gap: 6px; margin: 10px 0 0; padding: 12px 14px; border: 1px dashed rgba(248, 180, 90, .45); border-radius: 14px; background: rgba(248, 180, 90, .06); }
.staff-gives b { font-size: 15px; }
.staff-gives ul { margin: 0; padding-left: 18px; color: var(--mg-copy); font-size: 13px; line-height: 1.5; }
.celebrate--role .celebrate__role { margin: 6px 0 4px; font-size: clamp(24px, 6vw, 38px); font-weight: 800; line-height: 1.15; color: #ffe7a8; text-shadow: 0 4px 30px rgba(242, 138, 45, .45); }
.celebrate--role .celebrate__gives { display: grid; gap: 8px; max-width: 520px; margin: 14px auto 0; padding: 0; list-style: none; text-align: left; }
.celebrate--role .celebrate__gives li { position: relative; padding: 8px 12px 8px 34px; border-radius: 12px; background: rgba(255, 255, 255, .06); font-size: 14px; line-height: 1.45; }
.celebrate--role .celebrate__gives li::before { content: "✓"; position: absolute; left: 12px; top: 8px; color: #7fe3a0; font-weight: 800; }
@media (max-width: 640px) {
  .staff-tbl thead { display: none; }
  .staff-tbl tr { display: grid; gap: 4px; padding: 10px 0; border-bottom: 1px solid var(--mg-border); }
  .staff-tbl td { padding: 0; border: 0; }
  .staff-tbl__num { white-space: normal; }
  .celebrate--role .celebrate__card { max-height: calc(100dvh - 140px); overflow-y: auto; }
}
/* == end admstaff == */

/* == mobinput == */
@media (max-width: 720px) {
  .soc-chat__form textarea, .chat-compose textarea, .comment-form textarea { font-size: 16px; }
  .soc-chat__form textarea { min-height: 46px; padding: 12px 14px; }
  .soc-chat__form:has(textarea[data-sdm]:not(:placeholder-shown)) .tg-btn,
  .soc-chat__form:has(textarea[data-sdm]:focus) .tg-btn { display: none; }
  .soc-chat__form textarea[data-sdm] { min-width: 150px; }}
/* == end mobinput == */

/* == dkstop == */
.dk-fx__stop { margin-left: auto; padding: 6px 14px; border: 1px solid rgba(255, 106, 61, .55); border-radius: 999px; background: rgba(255, 106, 61, .12); color: #ffb08f; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.dk-fx__stop:hover { background: rgba(255, 106, 61, .24); color: #fff; }
.dk-fx__b.is-playing { box-shadow: 0 0 0 2px rgba(var(--c), .95), 0 0 18px rgba(var(--c), .45); }
/* == end dkstop == */

/* == books == */
.ser-resume { display: block; margin: -6px 0 14px; padding: 8px 14px; border: 1px solid var(--mg-border-amber); border-radius: 12px; background: rgba(242, 138, 45, 0.12); color: var(--mg-gold, #f2b25c); font: inherit; font-size: 14px; font-weight: 600; text-align: left; cursor: pointer; }
.ser-resume:hover { background: rgba(242, 138, 45, 0.2); }
.ser-ed__book { display: flex; align-items: flex-start; gap: 8px; margin: 4px 0 12px; color: var(--mg-copy); font-size: 14px; line-height: 1.35; cursor: pointer; }
.ser-ed__book input { margin-top: 3px; accent-color: var(--mg-amber, #f28a2d); }
.ser-promo__staff { margin: 8px 0 0; font-size: 13px; }
.ser-cont { margin: 4px 0 16px; }
.ser-cont__head { margin-bottom: 8px; color: var(--mg-muted); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.ser-cont__row { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(240px, 1fr); gap: 10px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
.ser-cont__card { display: grid; gap: 6px; padding: 12px 14px; border: 1px solid var(--mg-border-amber); border-radius: 14px; background: linear-gradient(160deg, rgba(242, 138, 45, 0.1), rgba(255, 255, 255, 0.02)); color: var(--mg-copy); text-decoration: none; }
.ser-cont__card b { font-size: 15px; line-height: 1.25; }
.ser-cont__ch { overflow: hidden; color: var(--mg-muted); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.ser-cont__card:hover { border-color: var(--mg-amber, #f28a2d); }
@media (max-width: 720px) { .ser-cont__row { grid-auto-columns: 82%; } }
.mus-album__kind { justify-self: start; padding: 2px 8px; border-radius: 999px; background: rgba(242, 138, 45, 0.16); color: var(--mg-gold, #f2b25c); font-size: 11px; font-style: normal; font-weight: 700; }
.mus-am__book { display: flex; align-items: flex-start; gap: 8px; margin: 6px 0 4px; color: var(--mg-muted); font-size: 13px; line-height: 1.35; cursor: pointer; }
.mus-am__book input { margin-top: 2px; accent-color: var(--mg-amber, #f28a2d); }
.mus-book__part { margin: 10px 0 2px; color: var(--mg-muted); font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.mus-album__bar .btn + .btn { margin-left: 6px; }
/* == end books == */

/* == rolecel == */
.celebrate.celebrate--role { background: radial-gradient(ellipse at 50% 30%, rgba(40, 25, 10, .98), rgba(6, 5, 4, .99) 70%); }
.celebrate--role .celebrate__card { z-index: 1; }
.celebrate--role .celebrate__gives li { background: rgba(24, 17, 10, .94); border: 1px solid rgba(242, 138, 45, .22); color: #f4e9da; }
/* == end rolecel == */

/* == rolecel2 == */
.celebrate--role .celebrate__lead { margin-top: 10px; color: #f1e2cc; font-size: 17px; font-weight: 600; text-shadow: 0 2px 12px rgba(0, 0, 0, .8); }
/* == end rolecel2 == */

/* == gr57 == */
/* куб: пять граней партнёров, раз в круг показывает нижнюю */
@keyframes gdz-cube3d6 {
  0% { transform: rotateX(-24deg) rotateY(0deg); }
  17% { transform: rotateX(-12deg) rotateY(-90deg); }
  34% { transform: rotateX(-28deg) rotateY(-180deg); }
  50% { transform: rotateX(-12deg) rotateY(-270deg); }
  60% { transform: rotateX(52deg) rotateY(-292deg); }
  72% { transform: rotateX(52deg) rotateY(-318deg); }
  84% { transform: rotateX(-12deg) rotateY(-340deg); }
  100% { transform: rotateX(-24deg) rotateY(-360deg); }
}
.pcube3d__box { animation: gdz-cube3d6 30s linear infinite; }
.pcube3d__f--bottom .pcube3d__lbl { transform: rotate(180deg); align-self: flex-start; }

/* обложка страницы: своя точка кадра для телефона и компьютера */
.soc-cover.has-pos, html[data-theme="light"] .soc-cover.has-pos { background-position: var(--cp, 50% 50%); }
@media (max-width: 860px) {
  .soc-cover.has-pos, html[data-theme="light"] .soc-cover.has-pos { background-position: var(--cpm, var(--cp, 50% 50%)); }
}

/* подарки в Студии: кнопка «Подарить» рядом с «Открыть все» */
.gift-panel__acts { display: flex; gap: 8px; flex-wrap: wrap; }
.gift-panel__acts .btn svg { width: 18px; height: 18px; }
/* == end gr57 == */

/* == gr58 == */
/* gr58: диджей — тарифы Старт/PRO, простой плеер, эфир, аналитика, брони */
.dk-view { display: inline-flex; gap: 4px; padding: 4px; margin-bottom: 12px; border-radius: 12px; border: 1px solid var(--mg-border, rgba(255,255,255,.12)); background: rgba(255,255,255,.03); }
.dk-microw { padding: 10px 14px; border: 1px solid var(--mg-border, rgba(255,255,255,.12)); border-radius: 16px; background: rgba(255,255,255,.025); }

.dkp { position: relative; display: grid; gap: 12px; padding: 18px; border: 1px solid var(--mg-border, rgba(255,255,255,.12)); border-radius: 22px; background: radial-gradient(90% 120% at 0% 0%, rgba(200,16,46,.22), transparent 60%), radial-gradient(80% 120% at 100% 100%, rgba(255,106,61,.12), transparent 60%), linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01)); overflow: hidden; }
.dkp__now { display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(0, 220px); gap: 14px; align-items: center; }
.dkp__disc { position: relative; display: block; width: 64px; height: 64px; border-radius: 50%; background: repeating-radial-gradient(circle at 50% 50%, #111 0 2px, #1d1d22 2px 4px); box-shadow: 0 6px 22px -8px rgba(0,0,0,.8), inset 0 0 0 1px rgba(255,255,255,.08); }
.dkp__disc i { position: absolute; inset: 22px; border-radius: 50%; background: linear-gradient(135deg, #c8102e, #ff6a3d); box-shadow: 0 0 0 3px rgba(0,0,0,.5); }
.dkp__disc.is-spin { animation: dkp-spin 2.4s linear infinite; }
@keyframes dkp-spin { to { transform: rotate(360deg); } }
.dkp__meta { display: grid; gap: 2px; min-width: 0; }
.dkp__kicker { color: var(--mg-gold, #f2c46d); font: 700 11px/1.2 var(--body, system-ui); letter-spacing: .08em; text-transform: uppercase; }
.dkp__meta b { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font: 800 22px/1.2 var(--display, system-ui); }
.dkp__meta span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--muted, #a3a3ad); font-size: 13.5px; }
.dkp__spec { width: 100%; height: 56px; display: block; }
.dkp__bar { position: relative; height: 8px; border-radius: 99px; background: rgba(255,255,255,.1); cursor: pointer; overflow: hidden; }
.dkp__bar i { position: absolute; left: 0; top: 0; bottom: 0; width: 0; border-radius: inherit; background: linear-gradient(90deg, #c8102e, #ff6a3d 70%, #ffd27a); }
.dkp__times { display: flex; justify-content: space-between; color: var(--muted, #a3a3ad); font: 600 12px/1 var(--mono, monospace); font-variant-numeric: tabular-nums; }
.dkp__ctrls { display: flex; align-items: center; justify-content: center; gap: 18px; }
.dkp__play { display: grid; place-items: center; width: 72px; height: 72px; border: 0; border-radius: 50%; background: linear-gradient(135deg, #c8102e, #ff6a3d); color: #fff; cursor: pointer; box-shadow: 0 12px 30px -12px rgba(255,106,61,.8); transition: transform .12s; }
.dkp__play:active { transform: scale(.95); }
.dkp__play svg { width: 30px; height: 30px; }
.dkp__play.is-on { background: linear-gradient(135deg, #1f9d63, #4cc98c); box-shadow: 0 12px 30px -12px rgba(76,201,140,.8); }
.dkp__ic { position: relative; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--mg-border, rgba(255,255,255,.16)); background: rgba(255,255,255,.04); color: var(--muted, #c9c9d1); cursor: pointer; transition: color .15s, border-color .15s, background .15s; }
.dkp__ic svg { width: 20px; height: 20px; }
.dkp__ic--big { width: 54px; height: 54px; color: inherit; }
.dkp__ic--big svg { width: 24px; height: 24px; }
.dkp__ic:hover { border-color: rgba(255,255,255,.34); color: #fff; }
.dkp__ic.is-on { color: #ffb08f; border-color: rgba(255,106,61,.65); background: rgba(255,106,61,.14); }
.dkp__rep em { position: absolute; right: 6px; bottom: 5px; font: 800 10px/1 var(--body, system-ui); font-style: normal; }
.dkp__state { margin: -4px 0 0; text-align: center; color: var(--muted, #a3a3ad); font-size: 12px; }
.dkp__mix { display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr); gap: 14px; align-items: center; padding-top: 12px; border-top: 1px solid var(--mg-border, rgba(255,255,255,.1)); }
.dkp__fader { display: grid; gap: 6px; font-size: 12px; color: var(--muted, #a3a3ad); }
.dk-bottom--s { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); }
.dk-tr--s { padding: 8px 8px 8px 6px; }
.dk-chip--q { background: rgba(255,106,61,.12); border-color: rgba(255,106,61,.45); color: #ffc2a8; }
.dk-star, .dj-star { flex: none; display: inline-grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--muted, #8d8d97); font-size: 17px; line-height: 1; cursor: pointer; transition: color .15s, transform .1s; }
.dk-star:hover, .dj-star:hover { color: #ffd27a; }
.dk-star.is-on, .dj-star.is-on { color: #f2c46d; }
.dk-star:active, .dj-star:active { transform: scale(.88); }
.dk-q li { padding: 4px 0; cursor: grab; }
.dk-q__grip, .dj-grip { flex: none; color: var(--muted, #6f6f78); font-style: normal; font-size: 12px; letter-spacing: -2px; cursor: grab; user-select: none; }
.dk-q li small { color: var(--mg-gold, #f2c46d); font-size: 11px; }
.dk-queue--s .dk-q { padding-left: 0; list-style: none; max-height: 420px; overflow: auto; }

.air-mic { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.air-mic__btn { display: inline-flex; align-items: center; gap: 10px; min-height: 46px; padding: 0 14px 0 12px; border-radius: 14px; border: 1px solid var(--mg-border, rgba(255,255,255,.16)); background: rgba(255,255,255,.04); color: inherit; cursor: pointer; text-align: left; }
.air-mic__btn svg { width: 22px; height: 22px; flex: none; }
.air-mic__btn span { display: grid; }
.air-mic__btn b { font: 700 13px/1.2 var(--body, system-ui); }
.air-mic__btn small { color: var(--muted, #a3a3ad); font-size: 11.5px; }
.air-mic__btn.is-on { border-color: rgba(229,72,58,.7); background: rgba(229,72,58,.14); }
.air-mic__btn.is-on svg { color: #ff6b5e; }
.air-lvl { position: relative; width: 6px; height: 26px; border-radius: 3px; background: rgba(255,255,255,.1); overflow: hidden; }
.air-lvl::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: var(--lvl, 0%); background: linear-gradient(0deg, #4cc98c, #ffcf5a 70%, #ff5a5a); transition: height .08s linear; }
.air-f { display: inline-grid; grid-auto-flow: column; align-items: center; gap: 8px; min-width: 0; font-size: 12px; color: var(--muted, #a3a3ad); }
.air-f input[type=range] { width: 120px; accent-color: #ff6a3d; }
.air-f--bal em { font-style: normal; font-size: 11px; }
.air-chk { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--muted, #c3c3cb); cursor: pointer; }
.air-chk input { accent-color: #ff6a3d; }

.air-mini { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 10px 14px; border: 1px solid var(--mg-border, rgba(255,255,255,.12)); border-radius: 14px; background: rgba(255,255,255,.025); font-size: 13px; }
.air-mini b { font-weight: 700; }
.air-mini > span:not(.air-on) { color: var(--muted, #a3a3ad); }
.air-mini .dk-chip { margin-left: auto; }
.air-mini__off { color: var(--muted, #a3a3ad); }
.air-on { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px 3px 8px; border-radius: 99px; background: rgba(229,72,58,.16); color: #ff8a7e; font: 800 11px/1.4 var(--body, system-ui); letter-spacing: .06em; text-transform: uppercase; }
.air-on i, .air-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #ff3b30; box-shadow: 0 0 0 0 rgba(255,59,48,.6); animation: air-pulse 1.6s ease-out infinite; }
@keyframes air-pulse { 70% { box-shadow: 0 0 0 7px rgba(255,59,48,0); } 100% { box-shadow: 0 0 0 0 rgba(255,59,48,0); } }
.air-off { display: inline-flex; padding: 3px 10px; border-radius: 99px; background: rgba(255,255,255,.06); color: var(--muted, #a3a3ad); font: 700 11px/1.4 var(--body, system-ui); letter-spacing: .06em; text-transform: uppercase; }

.air { display: grid; gap: 14px; }
.air-start, .air-mixbox, .air-card, .air-empty { padding: 18px; border: 1px solid var(--mg-border, rgba(255,255,255,.12)); border-radius: 20px; background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01)); }
.air-start { background: radial-gradient(90% 140% at 0% 0%, rgba(200,16,46,.16), transparent 60%), linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01)); }
.air-start__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.air-start__head h3, .air-mixbox h3 { margin: 0 0 4px; font: 800 18px/1.2 var(--display, system-ui); }
.air-mixbox { display: grid; gap: 10px; }
.air-plan { flex: none; padding: 5px 12px; border-radius: 99px; background: rgba(255,255,255,.06); color: var(--muted, #c3c3cb); font: 700 12px/1.3 var(--body, system-ui); white-space: nowrap; }
.air-plan.is-pro { background: linear-gradient(135deg, rgba(242,196,109,.25), rgba(255,106,61,.2)); color: #ffd99a; }
.air-form { display: grid; gap: 12px; }
.air-modes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.air-mode { display: grid; gap: 4px; padding: 14px; border-radius: 16px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); background: rgba(255,255,255,.03); color: inherit; text-align: left; cursor: pointer; transition: border-color .15s, background .15s; }
.air-mode b { font: 800 15px/1.2 var(--display, system-ui); }
.air-mode small { color: var(--muted, #a3a3ad); font-size: 12.5px; line-height: 1.4; }
.air-mode.is-on { border-color: rgba(255,106,61,.7); background: rgba(255,106,61,.12); box-shadow: inset 0 0 0 1px rgba(255,106,61,.3); }
.air-form__row { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto; gap: 10px; align-items: end; }
.air-in { display: grid; gap: 5px; min-width: 0; font-size: 12px; color: var(--muted, #a3a3ad); }
.air-in input, .air-in select { width: 100%; min-height: 42px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); background: rgba(255,255,255,.04); color: var(--text, #f4f4f6); font: 500 14px/1.2 var(--body, system-ui); }
.air-go { min-height: 42px; padding: 0 22px; white-space: nowrap; }
.air-limit { color: #ffb08f; }
.air-empty { display: grid; gap: 6px; color: var(--muted, #a3a3ad); font-size: 13.5px; line-height: 1.5; }
.air-empty b { color: var(--text, #f4f4f6); font: 800 16px/1.2 var(--display, system-ui); }
.air-tabs { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 2px; }
.air-tab { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 14px; border-radius: 12px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); background: rgba(255,255,255,.03); color: inherit; font: 700 13px/1 var(--body, system-ui); white-space: nowrap; cursor: pointer; }
.air-tab small { color: var(--muted, #a3a3ad); font-weight: 600; }
.air-tab.is-on { border-color: rgba(255,106,61,.65); background: rgba(255,106,61,.12); }
.air-card { display: grid; gap: 14px; }
.air-card.is-live { border-color: rgba(229,72,58,.45); box-shadow: 0 16px 50px -30px rgba(229,72,58,.8); }
.air-card__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.air-card__head h3 { margin: 8px 0 2px; font: 800 20px/1.2 var(--display, system-ui); }
.air-card__head small { color: var(--muted, #a3a3ad); font-size: 12.5px; }
.air-stop { border-color: rgba(229,72,58,.6) !important; color: #ff8a7e !important; }
.air-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.air-stat { display: grid; gap: 4px; padding: 12px; border-radius: 14px; background: rgba(0,0,0,.22); }
.air-stat small { color: var(--muted, #a3a3ad); font-size: 11.5px; }
.air-stat b { font: 800 20px/1.1 var(--display, system-ui); font-variant-numeric: tabular-nums; }
.air-share { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: end; }
.air-venue { display: grid; gap: 8px; }
.air-venue__cam { position: relative; aspect-ratio: 16 / 9; max-height: 360px; border-radius: 16px; background: #0b0b0e; overflow: hidden; }
.air-venue__cam video { width: 100%; height: 100%; object-fit: cover; display: block; }
.air-venue__cam span { position: absolute; inset: 0; display: grid; place-items: center; color: var(--muted, #a3a3ad); font-size: 13px; }
.air-venue__cam span:empty { display: none; }
.air-chat h4, .air-played h4 { margin: 0 0 8px; font: 700 14px/1.2 var(--display, system-ui); }
.air-chat__list { display: grid; gap: 6px; max-height: 260px; overflow: auto; padding: 4px 2px; }
.air-msg { justify-self: start; max-width: 85%; padding: 8px 12px; border-radius: 14px 14px 14px 4px; background: rgba(255,255,255,.06); }
.air-msg.is-me { justify-self: end; border-radius: 14px 14px 4px 14px; background: rgba(255,106,61,.16); }
.air-msg.is-quick { background: rgba(242,196,109,.16); }
.air-msg small { display: block; color: var(--muted, #a3a3ad); font-size: 11px; }
.air-msg p { margin: 2px 0 0; font-size: 13.5px; line-height: 1.4; overflow-wrap: anywhere; }
.air-emoji { display: flex; gap: 6px; flex-wrap: wrap; margin: 8px 0; }
.air-emo { width: 38px; height: 38px; border-radius: 12px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); background: rgba(255,255,255,.03); font-size: 18px; cursor: pointer; }
.air-chat__form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.air-chat__form input { min-height: 42px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); background: rgba(255,255,255,.04); color: var(--text, #f4f4f6); font: 500 14px/1.2 var(--body, system-ui); }
.air-quick { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 10px; }
.air-quick .btn { min-height: 46px; justify-content: center; }
.air-pl { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; max-height: 280px; overflow: auto; }
.air-pl li { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 8px; padding: 6px 8px; border-radius: 10px; font-size: 13px; }
.air-pl li.is-now { background: rgba(255,106,61,.1); }
.air-pl time { color: var(--muted, #a3a3ad); font: 600 12px/1.5 var(--mono, monospace); }
.air-pl span { display: grid; min-width: 0; color: var(--muted, #a3a3ad); }
.air-pl b { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--text, #f4f4f6); font-weight: 600; }

.air-strip { margin: 4px 0 18px; }
.air-strip h2 { display: flex; align-items: center; gap: 8px; }
.air-strip__row { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.air-live { display: grid; gap: 4px; padding: 14px; border-radius: 16px; border: 1px solid rgba(229,72,58,.4); background: radial-gradient(100% 120% at 0% 0%, rgba(229,72,58,.18), transparent 60%), rgba(255,255,255,.02); color: inherit; text-decoration: none; }
.air-live .air-on { justify-self: start; }
.air-live b { margin-top: 4px; font: 800 15px/1.25 var(--display, system-ui); }
.air-live small { color: var(--muted, #a3a3ad); font-size: 12px; }
.air-live em { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--mg-gold, #f2c46d); font-size: 12px; font-style: normal; }

.air-pub { display: grid; place-items: start center; padding: 12px 0 30px; }
.air-pub__card { display: grid; gap: 14px; width: min(560px, 100%); padding: 24px; border: 1px solid var(--mg-border, rgba(255,255,255,.12)); border-radius: 26px; background: radial-gradient(100% 80% at 0% 0%, rgba(200,16,46,.25), transparent 60%), radial-gradient(90% 90% at 100% 100%, rgba(255,106,61,.14), transparent 60%), rgba(255,255,255,.02); }
.air-pub__live { display: flex; align-items: center; gap: 10px; color: var(--muted, #a3a3ad); font-size: 13px; }
.air-pub__title { margin: 0; font: 800 28px/1.15 var(--display, system-ui); overflow-wrap: anywhere; }
.air-pub__dj { margin: -6px 0 0; color: var(--muted, #a3a3ad); font-size: 14px; }
.air-pub__dj a { color: inherit; font-weight: 700; }
.air-pub__now { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 14px; align-items: center; padding: 12px; border-radius: 18px; background: rgba(0,0,0,.25); }
.air-pub__now div { display: grid; min-width: 0; }
.air-pub__now small { color: var(--mg-gold, #f2c46d); font: 700 11px/1.3 var(--body, system-ui); letter-spacing: .08em; text-transform: uppercase; }
.air-pub__now b { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font: 700 16px/1.3 var(--body, system-ui); }
.air-pub__go { min-height: 54px; font-size: 16px; justify-content: center; }
.air-pub__vol input { width: 100%; }
.air-pub__vol { grid-auto-flow: row; }
.air-pub__msg { margin: 0; min-height: 1.4em; color: var(--muted, #c3c3cb); font-size: 13.5px; }
.air-pub__cam { position: relative; aspect-ratio: 16 / 9; border-radius: 16px; background: #0b0b0e; overflow: hidden; }
.air-pub__cam video { width: 100%; height: 100%; object-fit: cover; display: block; }
.air-pub__cam span { position: absolute; left: 10px; bottom: 8px; color: rgba(255,255,255,.7); font-size: 11.5px; }

.dj-plan { justify-self: start; margin-left: 6px; padding: 1px 9px; border: 0; border-radius: 999px; background: rgba(255,255,255,.08); color: var(--muted, #c3c3cb); font: 700 11px/18px var(--body, system-ui); cursor: pointer; }
.dj-plan.is-pro { background: linear-gradient(135deg, rgba(242,196,109,.3), rgba(255,106,61,.25)); color: #ffd99a; }
.dj-pro-tag { display: inline-flex; align-items: center; padding: 1px 6px; border-radius: 6px; background: linear-gradient(135deg, #f2c46d, #ff6a3d); color: #1a0d05; font: 800 10px/1.4 var(--body, system-ui); letter-spacing: .04em; vertical-align: middle; }
.dj-badge--live { background: #ff3b30; }
.dj-plans { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.dj-plancard { display: grid; gap: 12px; align-content: start; padding: 20px; border: 1px solid var(--mg-border, rgba(255,255,255,.12)); border-radius: 22px; background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01)); }
.dj-plancard--pro { border-color: rgba(242,196,109,.45); background: radial-gradient(100% 90% at 100% 0%, rgba(242,196,109,.16), transparent 60%), radial-gradient(90% 90% at 0% 100%, rgba(200,16,46,.14), transparent 60%), rgba(255,255,255,.02); }
.dj-plancard.is-cur { box-shadow: inset 0 0 0 1px rgba(76,201,140,.5); }
.dj-plancard header { display: grid; gap: 2px; }
.dj-plancard header small { color: var(--mg-gold, #f2c46d); font: 700 12px/1.3 var(--body, system-ui); }
.dj-plancard h3 { margin: 0; font: 800 22px/1.2 var(--display, system-ui); }
.dj-plan__cur { justify-self: start; margin-top: 4px; padding: 2px 9px; border-radius: 99px; background: rgba(76,201,140,.16); color: #8fe3ae; font: 700 11px/1.5 var(--body, system-ui); font-style: normal; }
.dj-plancard ul { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.dj-plancard li { position: relative; padding-left: 24px; font-size: 13.5px; line-height: 1.45; }
.dj-plancard li::before { content: ""; position: absolute; left: 2px; top: 5px; width: 12px; height: 7px; border-left: 2px solid #4cc98c; border-bottom: 2px solid #4cc98c; transform: rotate(-45deg); }
.dj-plan__buy { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.dj-plan__buy .btn { display: grid; justify-items: center; gap: 2px; min-height: 58px; padding: 8px; text-align: center; }
.dj-plan__buy .btn b { font-size: 13.5px; }
.dj-plan__buy .btn span { font-size: 12px; opacity: .85; }
.dj-plan__note { margin: 0; color: var(--muted, #a3a3ad); font-size: 12.5px; }
.dj-lock { display: grid; justify-items: center; gap: 8px; padding: 34px 18px; border: 1px dashed rgba(242,196,109,.4); border-radius: 20px; text-align: center; }
.dj-lock b { font: 800 17px/1.3 var(--display, system-ui); }
.dj-lock p { margin: 0; }
.dj-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.dj-kpi { display: grid; gap: 4px; padding: 14px; border-radius: 16px; border: 1px solid var(--mg-border, rgba(255,255,255,.1)); background: rgba(255,255,255,.025); }
.dj-kpi small { color: var(--muted, #a3a3ad); font-size: 12px; }
.dj-kpi b { font: 800 24px/1.1 var(--display, system-ui); font-variant-numeric: tabular-nums; }
.dj-an { display: grid; grid-template-columns: 1.4fr 1fr; gap: 14px; margin-bottom: 14px; }
.dj-bars { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.dj-bars li { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 8px 10px; border-radius: 10px; overflow: hidden; }
.dj-bars li i { position: absolute; left: 0; top: 0; bottom: 0; width: var(--w, 0%); background: linear-gradient(90deg, rgba(200,16,46,.28), rgba(255,106,61,.16)); border-radius: inherit; z-index: 0; }
.dj-bars li span, .dj-bars li em { position: relative; z-index: 1; }
.dj-bars li span { display: grid; min-width: 0; color: var(--muted, #a3a3ad); font-size: 12px; }
.dj-bars li b { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--text, #f4f4f6); font-size: 13.5px; }
.dj-bars li em { font: 800 14px/1 var(--display, system-ui); font-style: normal; }
.dj-hours { margin-bottom: 14px; }
.dj-hours__grid { display: grid; grid-template-columns: repeat(24, minmax(0, 1fr)); gap: 3px; align-items: end; height: 140px; margin-top: 10px; }
.dj-hours__col { display: grid; grid-template-rows: 1fr auto; height: 100%; gap: 4px; }
.dj-hours__col i { align-self: end; height: max(2px, var(--h, 0%)); border-radius: 4px 4px 2px 2px; background: rgba(255,255,255,.14); }
.dj-hours__col.is-peak i { background: linear-gradient(180deg, #ffd27a, #ff6a3d); }
.dj-hours__col small { color: var(--muted, #a3a3ad); font-size: 10px; text-align: center; min-height: 12px; }
.dj-table--airs td small { display: block; color: var(--muted, #a3a3ad); font-size: 11.5px; }
.dj-plmake { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.dj-pltpl select { flex: 1; min-width: 0; min-height: 40px; padding: 0 10px; border-radius: 12px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); background: rgba(255,255,255,.04); color: var(--text, #f4f4f6); font: 500 13.5px/1.2 var(--body, system-ui); }
.dj-fmt { padding: 1px 8px; border-radius: 99px; background: rgba(242,196,109,.16); color: #ffd99a; font: 700 11px/18px var(--body, system-ui); font-style: normal; }
.dj-row[draggable=true] { cursor: grab; }
.dj-row.is-drag { opacity: .45; }
.dj-req__wish { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0; }
.dj-req__wish span { padding: 2px 9px; border-radius: 99px; background: rgba(255,106,61,.14); color: #ffc2a8; font: 600 12px/1.5 var(--body, system-ui); }
.dj-req__pl { display: grid; gap: 4px; margin: 8px 0; font-size: 12px; color: var(--muted, #a3a3ad); }
.dj-req__pl select { min-height: 38px; padding: 0 10px; border-radius: 10px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); background: rgba(255,255,255,.04); color: var(--text, #f4f4f6); font: 500 13px/1.2 var(--body, system-ui); }
.dj-req__plnote { margin: 6px 0; font-size: 12px; }
.dj-pv { margin: 8px 0; padding: 10px 12px; border-radius: 12px; background: rgba(242,196,109,.08); border: 1px solid rgba(242,196,109,.25); }
.dj-pv summary { cursor: pointer; font-size: 13px; }
.dj-pv__list { display: grid; gap: 3px; margin: 8px 0 0; padding-left: 20px; font-size: 13px; }
.dj-pv__list small { margin-left: 6px; color: var(--muted, #a3a3ad); }

@media (max-width: 900px) {
  .dkp__now { grid-template-columns: auto minmax(0, 1fr); }
  .dkp__spec { grid-column: 1 / -1; height: 44px; }
  .dkp__mix { grid-template-columns: minmax(0, 1fr); }
  .dk-bottom--s { grid-template-columns: minmax(0, 1fr); }
  .dj-plans, .dj-an { grid-template-columns: minmax(0, 1fr); }
  .dj-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .air-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .air-form__row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .air-go { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .dkp { padding: 14px; border-radius: 18px; }
  .dkp__meta b { font-size: 18px; }
  .dkp__ctrls { gap: 12px; }
  .air-modes, .air-form__row, .air-share, .dj-plmake { grid-template-columns: minmax(0, 1fr); }
  .air-start__head { flex-direction: column; }
  .air-f { grid-auto-flow: row; width: 100%; }
  .air-f input[type=range] { width: 100%; }
  .air-mic { display: grid; grid-template-columns: minmax(0, 1fr); }
  .air-card__head { flex-direction: column; }
  .dj-plan__buy { grid-template-columns: minmax(0, 1fr); }
  .dj-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .air-pub__card { padding: 18px; border-radius: 20px; }
  .air-pub__title { font-size: 23px; }
  .air-quick { grid-template-columns: minmax(0, 1fr); }
}
/* == end gr58 == */

/* == gr58b == */
.air-venue__cam { max-width: 560px; }
.air-f--bal { grid-template-columns: auto auto minmax(0, 1fr) auto; }
@media (max-width: 560px) {
  .air-f--bal { grid-auto-flow: row; grid-template-columns: auto minmax(0, 1fr) auto; }
  .air-f--bal > span { grid-column: 1 / -1; }
}
html[data-theme="light"] :is(.dk-view, .dk-microw, .air-mini, .air-mode, .air-tab, .air-emo, .air-msg, .air-off, .air-plan, .dj-plan, .dj-kpi, .air-mic__btn, .dkp__ic) { background: rgba(120, 80, 30, .05); border-color: rgba(80, 50, 20, .16); }
html[data-theme="light"] :is(.air-start, .air-mixbox, .air-card, .air-empty, .dj-plancard) { border-color: rgba(80, 50, 20, .14); background-color: rgba(255, 255, 255, .55); }
html[data-theme="light"] :is(.air-stat, .air-pub__now) { background: rgba(120, 80, 30, .07); }
html[data-theme="light"] :is(.air-in input, .air-in select, .air-chat__form input, .dj-pltpl select, .dj-req__pl select) { background: #fffdf9; border-color: rgba(80, 50, 20, .2); color: #1f1910; }
html[data-theme="light"] :is(.air-pub__dj, .air-pub__msg, .air-f, .dkp__ic, .air-plan, .dj-plan, .air-off) { color: #6b5a45; }
html[data-theme="light"] .air-pub__dj a { color: #b4521c; }
html[data-theme="light"] .dkp__ic:hover { color: #1f1910; border-color: rgba(80, 50, 20, .35); }
html[data-theme="light"] .dkp__ic.is-on { color: #c2410c; background: rgba(255, 106, 61, .12); border-color: rgba(255, 106, 61, .55); }
html[data-theme="light"] :is(.dkp__bar, .air-lvl) { background: rgba(80, 50, 20, .12); }
html[data-theme="light"] .dj-hours__col i { background: rgba(80, 50, 20, .18); }
html[data-theme="light"] :is(.air-limit, .dk-chip--q, .dj-req__wish span) { color: #b4521c; }
html[data-theme="light"] :is(.air-plan.is-pro, .dj-plan.is-pro, .dj-fmt) { color: #8a5200; }
html[data-theme="light"] :is(.air-pub__now small) { color: #a86a00; }
html[data-theme="light"] :is(.air-on, .air-stop) { color: #c8102e !important; }
html[data-theme="light"] .dk-star.is-on, html[data-theme="light"] .dj-star.is-on { color: #d18a00; }
/* == end gr58b == */

/* == gr63 == */
/* gr63: окно «Подарить» сверху — уровни не срезаются */
.giftbar > .giftbar__head, .giftbar > .giftbar__tiers, .giftbar > .giftbar__foot, .giftbar > .giftbar__chosen, .giftbar > .giftbar__q { flex: none; }
.giftbar__tiers { flex-wrap: wrap; overflow: visible; padding: 2px 0; }
.giftbar__tiers .gift-tier { flex: 1 1 auto; justify-content: center; min-height: 34px; }
.giftbar__grid, .giftbar__people, .giftbar__shelf { flex: 1 1 auto; min-height: 0; }

/* gr63: статьи — прямой читаемый шрифт без наклона */
html:root { --article-display: "Times New Roman", "PT Serif", Times, Georgia, serif; --article-body: "Times New Roman", "PT Serif", Times, Georgia, serif; }
.post-hero__title, .post-hero__lead, .post-content .post-lede, .post-rich .post-lede, .post-content .post-accent, .post-rich .post-accent { font-style: normal; }
.post-content, .post-rich { font-size: 18.5px; }

/* gr63: фото в мини-чате открываются на весь экран */
.mc-img-btn { display: block; padding: 0; border: 0; background: none; cursor: zoom-in; }
.mc-img-btn + .mc-img-btn { margin-top: 4px; }

/* gr63: кнопка раскладки в переписке — слева, не закрывает «прочитано» */
.typing-btn.typing-btn--left { right: auto; left: 12px; }

/* gr63: телефон — список диалогов не уходит под нижнее меню, поле ввода шире во время набора */
@media (max-width: 860px) {
  .soc-msgs:not(.has-peer) { height: auto; min-height: 0; overflow: visible; }
  .soc-msgs:not(.has-peer) .soc-dlist { height: auto; }
  .soc-msgs:not(.has-peer) .soc-dlist__items { overflow: visible; }
  .soc-msgs.has-peer { min-height: 0; }
  .soc-chat__form:has(textarea:not(:placeholder-shown)) .cm-recbtn,
  .soc-chat__form:has(textarea:not(:placeholder-shown)) [data-tgear] { display: none; }
}

/* gr63: студия на телефоне — вкладки переносятся, а не уезжают за край */
@media (max-width: 640px) {
  .studio-nav { flex-wrap: wrap; overflow: visible; }
  .studio-nav .side-link, .studio-nav [data-studio-tab] { flex: 1 1 auto; justify-content: center; }
}
/* == end gr63 == */

/* == chn-notes == */
/* записи канала */
.chn-list { display: grid; gap: 12px; }
.chn-form { display: grid; gap: 10px; padding: 14px; }
.chn-form textarea { width: 100%; min-height: 84px; resize: vertical; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--mg-line, rgba(255,255,255,.12)); background: transparent; color: inherit; font: inherit; line-height: 1.45; }
.chn-form__bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.chn-form__bar .muted { font-size: 12px; line-height: 1.35; }
.chn-form__bar .btn { flex: none; }
.chn-note .soc-post__head { position: relative; }
.chn-note__del { margin-left: auto; opacity: .6; }
.chn-note__del:hover { opacity: 1; }
.chn-note__go { margin-left: auto; font-size: 13px; color: var(--mg-amber, #e8a33d); text-decoration: none; }
.chn-note__go:hover { text-decoration: underline; }
.chn-feed { display: grid; gap: 12px; margin-bottom: 16px; }
.chn-feed .widget__title { margin-bottom: 0; }
.chn-dest { border: 0; padding: 0; margin: 0 0 12px; display: grid; gap: 8px; }
.chn-dest legend { font-size: 13px; color: var(--mg-muted); margin-bottom: 6px; padding: 0; }
.chn-dest label { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--mg-line, rgba(255,255,255,.12)); cursor: pointer; font-size: 14px; }
.chn-dest label:has(input:checked) { border-color: var(--mg-amber, #e8a33d); background: rgba(232,163,61,.08); }
.chn-dest input { accent-color: var(--mg-amber, #e8a33d); margin: 0; }
@media (max-width: 560px) {
  .chn-form__bar { flex-direction: column; align-items: stretch; }
  .chn-form__bar .btn { width: 100%; }
}
/* == end chn-notes == */

/* == roles-scoped == */
.dev-user__who small.dev-user__role { color: var(--mg-amber-lite, #f8b45a); font-weight: 600; }
.dev-role { display: inline-flex; flex-direction: column; gap: 2px; font-size: 11px; color: var(--mg-muted); }
.dev-role select { max-width: 240px; }
.dev-role__gives:empty { display: none; }
.dev-role__gives { flex: 1 0 100%; margin: 2px 0 4px; padding: 10px 12px; border: 1px solid rgba(248, 180, 90, .35); border-radius: 12px; background: rgba(248, 180, 90, .06); font-size: 12.5px; line-height: 1.45; color: var(--mg-copy); text-align: left; }
.dev-role__gives b { display: block; margin-bottom: 4px; color: var(--mg-hi); }
.dev-role__gives ul { margin: 0; padding-left: 18px; }
html[data-theme="light"] .dev-role__gives { background: rgba(180, 80, 28, .05); border-color: rgba(180, 80, 28, .3); color: #3a2c1c; }
html[data-theme="light"] .dev-role__gives b { color: #1c140c; }
/* == end roles-scoped == */

/* == admin-tabs-wrap == */
.admin-tabs { flex-wrap: wrap; overflow: visible; row-gap: 6px; }
.admin-tabs a { padding: 7px 13px; }
@media (max-width: 720px) {
  .admin-tabs { gap: 5px; padding: 6px 4px; }
  .admin-tabs a { padding: 5px 10px; font-size: 12px; }
}
/* == end admin-tabs-wrap == */

/* == misc69 == */
.gift-cover__n[hidden] { display: none !important; }
/* == end misc69 == */

/* == admin-sticky-mobile == */
@media (max-width: 860px) {
  html:has(.admin-tabs), html:has(.admin-tabs) body, html:has(.admin-tabs) .main { overflow-x: clip; }
}
#admin-staff, #admin-people, #admin-retention, #admin-rates, #admin-partners, #admin-apps { scroll-margin-top: calc(var(--nav-h) + var(--gdz-safe-top, 0px) + 112px); }
@media (max-width: 720px) {
  #admin-staff, #admin-people, #admin-retention, #admin-rates, #admin-partners, #admin-apps { scroll-margin-top: calc(var(--nav-h) + var(--gdz-safe-top, 0px) + 132px); }
}
/* == end admin-sticky-mobile == */

/* == traynote == */
.chx-tray__note { display: block; margin-top: 2px; font-size: 12px; color: var(--mg-amber); font-variant-numeric: tabular-nums; }
/* == end traynote == */

/* == gmdaily == */
.gm-card__daily { font-style: normal; font-size: 12px; font-weight: 600; color: var(--mg-muted); }
.gm-card__daily.is-todo { color: var(--mg-amber); }
.gm-card__gift { position: absolute; right: 8px; top: 8px; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: rgba(8,7,6,.78); font-size: 16px; box-shadow: 0 0 0 2px rgba(242,138,45,.7); animation: gmGift 1.6s ease-in-out infinite; }
@keyframes gmGift { 50% { transform: scale(1.12); } }
@media (prefers-reduced-motion: reduce) { .gm-card__gift { animation: none; } }
/* == end gmdaily == */

/* == airpill == */
.air-pill {
  position: fixed;
  left: 12px;
  bottom: calc(84px + env(safe-area-inset-bottom, 0px));
  z-index: 60;
  display: flex;
  align-items: center;
  gap: 4px;
  max-width: min(360px, calc(100vw - 90px));
  padding: 6px 6px 6px 12px;
  border-radius: 16px;
  background: rgba(22, 18, 14, 0.96);
  color: #f5efe6;
  border: 1px solid rgba(229, 72, 47, 0.35);
  box-shadow: 0 10px 28px rgba(40, 20, 10, 0.18);
  animation: airPillIn 0.35s ease-out;
}
.air-pill a {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-areas: "on who" "on sub" "go go";
  column-gap: 10px;
  row-gap: 1px;
  min-width: 0;
  color: inherit;
  text-decoration: none;
}
.air-pill .air-on { grid-area: on; align-self: center; }
.air-pill b { grid-area: who; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.air-pill small { grid-area: sub; font-size: 12px; opacity: 0.75; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.air-pill em {
  grid-area: go;
  margin-top: 6px;
  font-style: normal;
  font-weight: 700;
  font-size: 13px;
  text-align: center;
  padding: 6px 10px;
  border-radius: 10px;
  color: #fff;
  background: linear-gradient(90deg, #e5482f, #f08a24);
}
.air-pill button {
  align-self: flex-start;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: inherit;
  opacity: 0.6;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}
.air-pill button:hover { opacity: 1; }
:where(html[data-theme="light"]) .air-pill { background: #fffaf3; color: #2a1d14; }
@media (min-width: 900px) {
  .air-pill { left: 84px; bottom: 24px; }
}
@keyframes airPillIn {
  from { transform: translateY(14px); opacity: 0; }
  to { transform: none; opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .air-pill { animation: none; }
}
/* == end airpill == */

/* == chnwall == */
.chn-form__tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; }
.chn-tool { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.chn-tool svg { width: 18px; height: 18px; }
.chn-form__go { margin-left: auto; }
.chn-form__note { margin: 8px 0 0; font-size: 12px; }
.chn-draft { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.chn-chip { position: relative; display: inline-flex; align-items: center; gap: 8px; max-width: 100%; padding: 6px 34px 6px 10px; border-radius: 12px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); font-size: 13px; }
.chn-chip > svg { width: 18px; height: 18px; flex: none; opacity: .8; }
.chn-chip span { display: grid; min-width: 0; }
.chn-chip b, .chn-chip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chn-chip--ph { padding: 0; width: 72px; height: 72px; overflow: hidden; }
.chn-chip--ph img { width: 100%; height: 100%; object-fit: cover; }
.chn-chip__x { position: absolute; top: 4px; right: 4px; width: 24px; height: 24px; display: grid; place-items: center; border: 0; border-radius: 50%; background: rgba(0,0,0,.55); color: #fff; cursor: pointer; }
.chn-chip__x svg { width: 14px; height: 14px; }
.chn-att { margin: 10px 0; }
.chn-att__head { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; font-size: 13px; font-weight: 700; opacity: .85; }
.chn-att__head svg { width: 16px; height: 16px; }
.chn-videos { display: grid; gap: 8px; margin: 10px 0; }
@media (min-width: 700px) { .chn-videos--many { grid-template-columns: 1fr 1fr; } }
.chn-note__bar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.chn-rx-row { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.chn-rx { display: inline-flex; align-items: center; gap: 4px; min-height: 30px; padding: 0 10px; border-radius: 99px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); background: transparent; color: inherit; font: 600 13px/1 var(--body, system-ui); cursor: pointer; }
.chn-rx i, .chn-rx-add i { font-style: normal; font-size: 16px; }
.chn-rx.is-on { border-color: rgba(255,106,61,.7); background: rgba(255,106,61,.14); }
.chn-rx-add { position: relative; display: inline-flex; }
.chn-rx-pal { position: absolute; bottom: calc(100% + 6px); left: 0; z-index: 5; display: flex; gap: 2px; padding: 6px; border-radius: 99px; background: rgba(22,18,14,.97); box-shadow: 0 8px 24px rgba(0,0,0,.3); }
.chn-rx-pal[hidden] { display: none; }
.chn-rx-pal__it { width: 38px; height: 38px; border: 0; border-radius: 50%; background: transparent; font-size: 22px; line-height: 1; cursor: pointer; transition: transform .12s; }
.chn-rx-pal__it:hover, .chn-rx-pal__it.is-on { transform: scale(1.2); background: rgba(255,255,255,.1); }
:where(html[data-theme="light"]) .chn-rx-pal { background: #fff; }
.chn-cms { display: grid; gap: 10px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--mg-border, rgba(255,255,255,.1)); }
.chn-cm { position: relative; display: flex; gap: 10px; align-items: flex-start; padding-right: 30px; }
.chn-cm .soc-av { width: 32px; height: 32px; flex: none; }
.chn-cm__body { min-width: 0; font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }
.chn-cm__body a { color: inherit; text-decoration: none; }
.chn-cm__body time { display: block; margin-top: 2px; font-size: 12px; opacity: .6; }
.chn-cm__x { position: absolute; top: 0; right: 0; }
.chn-cm-more { justify-self: start; border: 0; background: none; color: #ff8a5c; font: 600 13px/1.3 var(--body, system-ui); cursor: pointer; padding: 0; }
.chn-cm-form { display: flex; gap: 8px; }
.chn-cm-form input { flex: 1; min-width: 0; min-height: 38px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); background: transparent; color: inherit; font: inherit; }
.chn-pick { max-height: min(56vh, 460px); overflow: auto; }
.chn-pick .soc-pick__it em { margin-left: auto; font-style: normal; font-size: 12px; font-weight: 700; color: #ff8a5c; white-space: nowrap; }
.chn-pick .soc-pick__it.is-on { background: rgba(255,106,61,.12); }
.chn-pick .soc-pick__it.is-on em { color: inherit; opacity: .7; }
.chn-pick__q { margin-bottom: 10px; }
.chn-pick__n { margin-right: auto; }
/* == end chnwall == */

/* == accdel == */
.acc-row__del { flex: 0 0 auto; color: var(--mg-muted, #a99c8a); }
.acc-row__del:hover { color: #ff8a7a; border-color: rgba(255, 110, 90, 0.5); }
.acc-dlg__btn--danger { background: #b8402e; border-color: #b8402e; color: #fff; }
.acc-dlg__btn--danger:hover { background: #cf4b36; }
.acc-dlg__btn--danger:disabled { opacity: 0.6; }
@media (max-width: 520px) {
  .acc-row { flex-wrap: wrap; }
  .acc-row__txt { flex-basis: calc(100% - 56px); }
}
/* == end accdel == */

/* == appout == */
.app-out { position: fixed; inset: 0; z-index: 4000; display: grid; place-items: end center; padding: 16px 16px calc(16px + env(safe-area-inset-bottom, 0px)); background: rgba(0, 0, 0, 0.45); }
.app-out__card { width: min(440px, 100%); padding: 18px 18px 16px; border: 1px solid var(--mg-border); border-radius: 20px; background: linear-gradient(180deg, #17130e, #0d0b08); color: var(--mg-copy); box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5); }
.app-out__card b { display: block; margin-bottom: 6px; color: var(--mg-ivory); font-size: 17px; }
.app-out__card p { margin: 0 0 14px; font-size: 14px; line-height: 1.45; }
.app-out__row { display: flex; gap: 10px; flex-wrap: wrap; }
.app-out__row .btn { flex: 1 1 140px; justify-content: center; }
:where(html[data-theme="light"]) .app-out__card { background: #fffaf3; color: #3a2a1d; border-color: rgba(120, 80, 40, 0.25); }
:where(html[data-theme="light"]) .app-out__card b { color: #2a1d14; }
@media (min-width: 700px) { .app-out { place-items: center; } }
/* == end appout == */

/* == chatrow == */
@media (max-width: 420px) {
  .soc-chat__form textarea[data-sdm] { min-width: 120px; }
  .soc-chat__form .cm-recbtn { width: 34px; }
}
@media (max-width: 380px) {
  .soc-chat__form textarea[data-sdm] { min-width: 96px; padding-left: 12px; padding-right: 12px; }
  .soc-chat__form .chx-attach__btn { width: 36px; }
  .soc-chat__form .cm-recbtn { width: 32px; }
}
/* == end chatrow == */

/* == live == эфир «Зрителям»: поток без лимита, реакции, чат слушателей, запись */
.air-cast { display: grid; gap: 4px; padding: 12px 14px; border-radius: 14px; background: rgba(0,0,0,.22); }
.air-cast__ok { display: inline-flex; align-items: center; gap: 8px; color: #7ee0a1; font: 700 14px/1.3 var(--body, system-ui); }
.air-cast__ok i { width: 9px; height: 9px; border-radius: 50%; background: #2ecc71; box-shadow: 0 0 0 0 rgba(46,204,113,.6); animation: air-pulse 1.6s ease-out infinite; }
.air-cast small { color: var(--muted, #a3a3ad); font-size: 12.5px; }
.air-cast__wait { color: var(--mg-gold, #f2c46d); font: 600 13.5px/1.4 var(--body, system-ui); }
.air-msg.is-dj { background: rgba(242,196,109,.16); }
.air-msg__x { margin-left: 6px; padding: 0; border: 0; background: none; color: var(--muted, #a3a3ad); font: 600 11px/1 var(--body, system-ui); text-decoration: underline; cursor: pointer; }
.air-played audio, .air-cp__rec audio { width: 100%; }

.air-cp__card { position: relative; overflow: hidden; isolation: isolate; }
.air-cp__fx { position: absolute; inset: 0; z-index: 3; pointer-events: none; overflow: hidden; }
.air-cp__fx span { position: absolute; bottom: 22%; font-size: 30px; line-height: 1; animation: air-fly 2.6s cubic-bezier(.2,.7,.3,1) forwards; filter: drop-shadow(0 4px 10px rgba(0,0,0,.4)); }
@keyframes air-fly { 0% { transform: translate(0, 0) scale(.6); opacity: 0; } 12% { opacity: 1; transform: translate(0, -20px) scale(1.1); } 100% { transform: translate(var(--dx, 0), -320px) scale(.9); opacity: 0; } }
.air-cp__now { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 16px; align-items: center; }
.air-cp__cover { position: relative; display: grid; place-items: center; width: 112px; aspect-ratio: 1; border-radius: 22px; background: radial-gradient(70% 70% at 30% 20%, rgba(255,106,61,.35), transparent 70%), #141217 center / cover no-repeat; box-shadow: 0 18px 40px -18px rgba(0,0,0,.9), inset 0 0 0 1px rgba(255,255,255,.08); }
.air-cp__cover .dkp__disc { width: 76px; height: 76px; }
.air-cp__cover .dkp__disc i { inset: 26px; }
.air-cp__cover.has-img .dkp__disc { display: none; }
.air-cp.is-on .air-cp__cover.has-img { animation: air-breathe 4s ease-in-out infinite; }
@keyframes air-breathe { 50% { transform: scale(1.03); box-shadow: 0 22px 50px -16px rgba(200,16,46,.55), inset 0 0 0 1px rgba(255,255,255,.1); } }
.air-cp__np { display: grid; gap: 2px; min-width: 0; }
.air-cp__np small { color: var(--mg-gold, #f2c46d); font: 700 11px/1.3 var(--body, system-ui); letter-spacing: .08em; text-transform: uppercase; }
.air-cp__np b { font: 800 20px/1.25 var(--display, system-ui); overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.air-cp__np span { color: var(--muted, #a3a3ad); font-size: 14px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.air-cp__eq { display: flex; align-items: flex-end; gap: 4px; height: 30px; padding: 0 2px; }
.air-cp__eq i { flex: 1; height: 18%; border-radius: 3px; background: linear-gradient(180deg, #ff6a3d, #c8102e); opacity: .35; transition: height .3s; }
.air-cp.is-on .air-cp__eq i { opacity: .9; animation: air-eq 1.1s ease-in-out infinite alternate; }
.air-cp.is-on .air-cp__eq i:nth-child(3n) { animation-duration: .8s; }
.air-cp.is-on .air-cp__eq i:nth-child(3n+1) { animation-duration: 1.35s; animation-delay: -.4s; }
.air-cp.is-on .air-cp__eq i:nth-child(4n) { animation-duration: .95s; animation-delay: -.7s; }
@keyframes air-eq { 0% { height: 15%; } 50% { height: 85%; } 100% { height: 35%; } }
.air-cp__ctl { display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(90px, 160px); gap: 14px; align-items: center; }
.air-cp__play { display: grid; place-items: center; width: 64px; height: 64px; border: 0; border-radius: 50%; background: linear-gradient(135deg, #ff6a3d, #c8102e); color: #fff; cursor: pointer; box-shadow: 0 12px 30px -10px rgba(200,16,46,.8); transition: transform .15s; }
.air-cp__play:hover { transform: scale(1.05); }
.air-cp__play:active { transform: scale(.96); }
.air-cp__play svg { width: 28px; height: 28px; }
.air-cp__play[hidden], .air-cp__vol[hidden] { display: none; }
.air-cp__ctlx { display: grid; gap: 2px; min-width: 0; }
.air-cp__ctlx b { font: 700 15px/1.3 var(--body, system-ui); }
.air-cp__ctlx small { color: var(--muted, #a3a3ad); font-size: 12.5px; }
.air-cp__vol input { width: 100%; accent-color: #ff6a3d; }
.air-cp__rx { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.air-cp__rx[hidden] { display: none; }
.air-cp__rxb { display: grid; justify-items: center; gap: 2px; padding: 10px 4px 8px; border: 1px solid var(--mg-border, rgba(255,255,255,.14)); border-radius: 16px; background: rgba(255,255,255,.03); color: inherit; cursor: pointer; transition: transform .12s, background .2s; }
.air-cp__rxb span { font-size: 24px; line-height: 1; }
.air-cp__rxb small { color: var(--muted, #a3a3ad); font: 700 12px/1.2 var(--body, system-ui); font-variant-numeric: tabular-nums; }
.air-cp__rxb:hover { background: rgba(255,106,61,.1); }
.air-cp__rxb:active { transform: scale(.92); }
.air-cp__rec { display: grid; gap: 8px; padding: 14px; border-radius: 18px; background: rgba(0,0,0,.25); }
.air-cp__rec h4 { margin: 0; font: 700 14px/1.2 var(--display, system-ui); }
.air-cp__rec p { margin: 0; }
.air-cp__pl .air-pl li[data-cp="seek"] { cursor: pointer; }
.air-cp__pl .air-pl li[data-cp="seek"]:hover { background: rgba(255,106,61,.1); }
.air-cp__login { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.air-cp.is-ended .air-cp__eq { display: none; }
@media (max-width: 560px) {
  .air-cp__now { grid-template-columns: 88px minmax(0, 1fr); gap: 12px; }
  .air-cp__cover { width: 88px; border-radius: 18px; }
  .air-cp__cover .dkp__disc { width: 60px; height: 60px; }
  .air-cp__cover .dkp__disc i { inset: 20px; }
  .air-cp__np b { font-size: 17px; }
  .air-cp__ctl { grid-template-columns: auto minmax(0, 1fr); }
  .air-cp__vol { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) {
  .air-cp.is-on .air-cp__eq i, .air-cp.is-on .air-cp__cover.has-img, .air-cp__fx span { animation: none; }
  .air-cp__fx span { display: none; }
}
html[data-theme="light"] :is(.air-cast, .air-cp__rec) { background: rgba(120, 80, 30, .07); }
html[data-theme="light"] .air-cast__ok { color: #1b7a43; }
html[data-theme="light"] .air-cp__rxb { background: rgba(255,255,255,.6); border-color: rgba(80, 50, 20, .16); }
html[data-theme="light"] :is(.air-cp__ctlx small, .air-cp__np span, .air-cp__rxb small) { color: #6b5a45; }
html[data-theme="light"] .air-cp__np small { color: #a86a00; }
/* == end live == */

/* == bots == */
#admin-bots { scroll-margin-top: calc(var(--nav-h) + var(--gdz-safe-top, 0px) + 112px); }
.bots-new { display: flex; gap: 8px; margin: 4px 0 16px; flex-wrap: wrap; }
.bots-new input { flex: 1 1 160px; min-width: 0; }
.bots-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.bots-head__acts { display: flex; gap: 6px; flex-wrap: wrap; }
.bots-head__acts .btn { padding: 6px 12px; font-size: 13px; }
.bots-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px; margin-bottom: 18px; }
.bots-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(246, 230, 197, .03); cursor: pointer; min-width: 0; transition: border-color .2s var(--ease), background .2s var(--ease); }
.bots-item:has(input:checked) { border-color: rgba(248, 180, 90, .6); background: rgba(248, 180, 90, .09); }
.bots-item input { flex: 0 0 auto; width: 18px; height: 18px; accent-color: var(--mg-gold, #f8b45a); }
.bots-item__av { flex: 0 0 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(135deg, #3a2a14, #6b4a1c); color: var(--mg-hi); font-weight: 700; font-size: 13px; }
.bots-item > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.bots-item b { color: var(--mg-hi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bots-item small { font-size: 12px; color: var(--mg-muted, #9b8c74); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bots-task { display: grid; gap: 10px; padding: 14px 16px; border: 1px dashed rgba(248, 180, 90, .4); border-radius: 16px; background: rgba(248, 180, 90, .04); margin-bottom: 18px; }
.bots-task .btn--cta { justify-self: start; }
.bots-task [data-bots-fields] { display: grid; gap: 10px; }
.bots-f { display: grid; gap: 4px; }
.bots-f span { font-size: 13px; color: var(--mg-muted, #9b8c74); }
.bots-f input, .bots-f select, .bots-f textarea { width: 100%; min-width: 0; box-sizing: border-box; }
:is(.bots-new input, .bots-f input, .bots-f select, .bots-f textarea) { padding: 10px 12px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(246, 230, 197, .04); color: var(--mg-hi); font: inherit; font-size: 15px; outline: none; transition: border-color .2s var(--ease), box-shadow .2s var(--ease); }
:is(.bots-new input, .bots-f input, .bots-f select, .bots-f textarea):focus { border-color: rgba(248, 180, 90, .7); box-shadow: 0 0 0 3px rgba(248, 180, 90, .15); }
.bots-f textarea { resize: vertical; line-height: 1.45; }
html[data-theme="light"] :is(.bots-new input, .bots-f input, .bots-f select, .bots-f textarea) { background: #fffdf8; color: #2b2116; }
.bots-hint { margin: -4px 0 0; font-size: 12px; }
.bots-pick { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 640px) { .bots-pick { grid-template-columns: 1fr; } }
.bots-pick__col { display: grid; align-content: start; gap: 6px; min-width: 0; }
.bots-pick__h { font-size: 13px; color: var(--mg-muted, #9b8c74); }
.bots-pick input { width: 100%; box-sizing: border-box; padding: 10px 12px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(246, 230, 197, .04); color: var(--mg-hi); font: inherit; font-size: 16px; outline: none; }
.bots-pick input:focus { border-color: rgba(248, 180, 90, .7); box-shadow: 0 0 0 3px rgba(248, 180, 90, .15); }
html[data-theme="light"] .bots-pick input { background: #fffdf8; color: #2b2116; }
.bots-pick__list { display: grid; gap: 4px; max-height: 260px; overflow-y: auto; overscroll-behavior: contain; }
.bots-pick__list:empty { display: none; }
.bots-pick__list .muted { margin: 4px 2px; font-size: 13px; }
.bots-pick__row { display: grid; grid-template-columns: auto 1fr; column-gap: 8px; align-items: baseline; width: 100%; padding: 8px 10px; border: 1px solid var(--mg-border); border-radius: 10px; background: transparent; color: var(--mg-hi); text-align: left; cursor: pointer; }
.bots-pick__row:hover, .bots-pick__row.is-on { border-color: rgba(248, 180, 90, .7); background: rgba(248, 180, 90, .1); }
.bots-pick__row b { grid-column: 1 / -1; overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.bots-pick__row small { grid-column: 1 / -1; overflow: hidden; color: var(--mg-muted, #9b8c74); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.bots-pick__row .bots-pick__kind + b { grid-column: 2; }
.bots-pick__kind { padding: 1px 7px; border-radius: 999px; background: rgba(248, 180, 90, .16); color: #f8b45a; font-size: 11px; font-style: normal; font-weight: 700; white-space: nowrap; }
.bots-pick__chosen { position: relative; display: grid; gap: 2px; margin: 0; padding: 9px 40px 9px 12px; border: 1px solid rgba(248, 180, 90, .7); border-radius: 12px; background: rgba(248, 180, 90, .1); }
.bots-pick__chosen small { color: var(--mg-muted, #9b8c74); font-size: 12px; }
.bots-pick__x { position: absolute; top: 50%; right: 6px; width: 30px; height: 30px; transform: translateY(-50%); border-radius: 8px; background: transparent; color: var(--mg-hi); font-size: 20px; line-height: 1; }
.bots-sub { margin: 0 0 8px; font-size: 15px; color: var(--mg-hi); }
.bots-log { display: grid; gap: 6px; }
.bots-log__it { border: 1px solid var(--mg-border); border-radius: 12px; padding: 8px 12px; background: rgba(246, 230, 197, .02); }
.bots-log__it summary { cursor: pointer; line-height: 1.4; overflow-wrap: anywhere; }
.bots-log__it summary small { display: block; font-size: 12px; color: var(--mg-muted, #9b8c74); }
.bots-log__it.is-run summary small { color: var(--mg-gold, #f8b45a); }
.bots-log__it.is-bad summary small { color: #ff8a7a; }
.bots-log__it ul { margin: 8px 0 2px; padding-left: 18px; line-height: 1.5; font-size: 13px; }
.bots-log__it li.bad { color: #ff8a7a; }
html[data-theme="light"] .bots-item__av { background: linear-gradient(135deg, #f3dcb4, #e5b873); color: #3a2a14; }
@media (max-width: 720px) {
  #admin-bots { scroll-margin-top: calc(var(--nav-h) + var(--gdz-safe-top, 0px) + 132px); }
  .bots-new .btn { flex: 1 1 100%; }
  .bots-task .btn--cta { justify-self: stretch; }
}
.bots-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 18px; align-items: start; }
.bots-card { margin: 0; }
.bots-card .bots-list { grid-template-columns: minmax(0, 1fr); max-height: 520px; overflow-y: auto; padding-right: 4px; margin-bottom: 0; }
.bots-new--many { align-items: center; margin-top: -8px; }
.bots-new--many span { flex: 1 1 100%; font-size: 13px; color: var(--mg-muted, #9b8c74); }
.bots-new--many input { flex: 0 0 90px; }
.bots-item__txt { display: flex; flex-direction: column; min-width: 0; }
.bots-item.is-busy { border-style: dashed; }
.bots-busy { margin-left: 6px; padding: 1px 8px; border-radius: 999px; background: rgba(248, 180, 90, .16); color: #f8b45a; font-size: 11px; font-style: normal; font-weight: 600; }
.bots-card .bots-task { margin: 0; padding: 0; border: 0; background: none; }
.bots-picked { margin: 0; font-size: 14px; color: var(--mg-copy); }
[data-bots-form-body] { display: grid; gap: 12px; }
.bots-row { display: flex; flex-wrap: wrap; gap: 6px; }
.bots-radio { position: relative; cursor: pointer; }
.bots-radio input { position: absolute; opacity: 0; pointer-events: none; }
.bots-radio span { display: inline-block; padding: 8px 14px; border: 1px solid var(--mg-border); border-radius: 999px; font-size: 13px; color: var(--mg-copy); transition: border-color .2s var(--ease), background .2s var(--ease); }
.bots-radio input:checked + span { border-color: rgba(248, 180, 90, .8); background: rgba(248, 180, 90, .14); color: var(--mg-hi); font-weight: 600; }
.bots-radio input:focus-visible + span { box-shadow: 0 0 0 3px rgba(248, 180, 90, .25); }
.bots-when { display: grid; gap: 10px; margin: 0; padding: 12px 14px; border: 1px solid var(--mg-border); border-radius: 14px; }
.bots-when legend { padding: 0 6px; font-size: 13px; color: var(--mg-muted, #9b8c74); }
.bots-int { font-size: 14px; line-height: 2.2; color: var(--mg-copy); }
.bots-int input { width: 76px; margin: 0 4px; padding: 6px 8px; border: 1px solid var(--mg-border); border-radius: 10px; background: rgba(246, 230, 197, .04); color: var(--mg-hi); font: inherit; text-align: center; }
html[data-theme="light"] .bots-int input { background: #fffdf8; color: #2b2116; }
.bots-preview { margin: 0; min-height: 1.2em; font-size: 13px; color: #f8b45a; }
.bots-job { margin-bottom: 8px; padding: 10px 14px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(246, 230, 197, .02); }
.bots-job summary { display: grid; gap: 6px; cursor: pointer; list-style: none; }
.bots-job summary::-webkit-details-marker { display: none; }
.bots-job__top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.bots-job__top b { color: var(--mg-hi); }
.bots-job__what { min-width: 0; color: var(--mg-copy); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1 1 120px; }
.bots-job summary small { font-size: 12px; color: var(--mg-muted, #9b8c74); line-height: 1.45; }
.bots-chip { margin-left: auto; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-style: normal; font-weight: 600; background: rgba(246, 230, 197, .08); color: var(--mg-copy); }
.bots-chip.is-running { background: rgba(248, 180, 90, .18); color: #f8b45a; }
.bots-chip.is-done { background: rgba(90, 200, 120, .16); color: #6fd08a; }
.bots-chip.is-errors { background: rgba(255, 110, 90, .16); color: #ff8a7a; }
.bots-bar { display: block; height: 6px; border-radius: 999px; background: rgba(246, 230, 197, .08); overflow: hidden; }
.bots-bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #ffb347, #ff7a1a); transition: width .4s var(--ease); }
.bots-job__acts { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 6px; }
.bots-steps { margin: 0; padding: 0; list-style: none; display: grid; gap: 4px; font-size: 13px; }
.bots-step { display: grid; grid-template-columns: 112px 150px minmax(0, 1fr); gap: 4px 10px; padding: 6px 8px; border-radius: 10px; background: rgba(246, 230, 197, .03); }
.bots-step time { color: var(--mg-muted, #9b8c74); }
.bots-step b { color: var(--mg-hi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bots-step q { grid-column: 3; color: var(--mg-copy); font-style: italic; }
.bots-step span { grid-column: 3; color: var(--mg-copy); }
.bots-step.is-ok span { color: #6fd08a; }
.bots-step.is-fail span { color: #ff8a7a; }
.bots-step.is-wait span, .bots-step.is-skip span { color: var(--mg-muted, #9b8c74); }
html[data-theme="light"] .bots-step.is-ok span { color: #1f8a43; }
@media (max-width: 900px) {
  .bots-grid { grid-template-columns: minmax(0, 1fr); }
  .bots-card .bots-list { max-height: 360px; }
  .bots-step { grid-template-columns: minmax(0, 1fr); }
  .bots-step q, .bots-step span { grid-column: 1; }
}
.bots-card--all { margin-bottom: 18px; }
.bots-top .admin-note { max-width: 860px; }
.bots-make { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4px 18px; align-items: end; }
.bots-make .bots-new { margin-bottom: 12px; }
.bots-make .bots-new--many { margin-top: 0; }
.bots-fix { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 12px; padding: 10px 14px; border: 1px solid rgba(255, 138, 122, .45); border-radius: 12px; background: rgba(255, 110, 90, .08); color: var(--mg-copy); font-size: 14px; }
.bots-fix span { flex: 1 1 260px; }
.bots-head { gap: 8px 12px; margin-bottom: 10px; }
.bots-q { flex: 1 1 200px; min-width: 0; max-width: 340px; padding: 8px 12px; border: 1px solid var(--mg-border); border-radius: 999px; background: rgba(246, 230, 197, .04); color: var(--mg-hi); font: inherit; font-size: 15px; outline: none; }
.bots-q:focus { border-color: rgba(248, 180, 90, .7); }
html[data-theme="light"] .bots-q, html[data-theme="light"] .bots-rand input { background: #fffdf8; color: #2b2116; }
.bots-rand { display: inline-flex; align-items: center; gap: 4px; }
.bots-rand input { width: 56px; padding: 6px 8px; border: 1px solid var(--mg-border); border-radius: 10px; background: rgba(246, 230, 197, .04); color: var(--mg-hi); font: inherit; font-size: 14px; text-align: center; }
.bots-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(148px, 1fr)); gap: 8px; max-height: min(620px, 70vh); overflow-y: auto; overscroll-behavior: contain; padding: 2px 4px 2px 2px; }
.bots-tiles > .muted { grid-column: 1 / -1; }
.bot-tile { position: relative; display: grid; justify-items: center; align-content: start; gap: 3px; min-width: 0; padding: 12px 8px 10px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(246, 230, 197, .03); text-align: center; cursor: pointer; user-select: none; transition: border-color .15s var(--ease), background .15s var(--ease), transform .15s var(--ease); }
.bot-tile:hover { border-color: rgba(248, 180, 90, .45); transform: translateY(-1px); }
.bot-tile input { position: absolute; top: 8px; left: 8px; width: 16px; height: 16px; margin: 0; accent-color: var(--mg-gold, #f8b45a); }
.bot-tile:has(input:checked) { border-color: rgba(248, 180, 90, .85); background: rgba(248, 180, 90, .13); box-shadow: inset 0 0 0 1px rgba(248, 180, 90, .4); }
.bot-tile::after { content: ""; position: absolute; top: 9px; right: 9px; width: 9px; height: 9px; border-radius: 50%; background: rgba(246, 230, 197, .25); }
.bot-tile.is-ok::after { background: #4fc77a; box-shadow: 0 0 6px rgba(79, 199, 122, .6); }
.bot-tile.is-fail::after { background: #ff6b57; box-shadow: 0 0 6px rgba(255, 107, 87, .6); }
.bot-tile.is-busy { border-style: dashed; }
.bot-tile__av { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 3px; border-radius: 50%; background: linear-gradient(135deg, hsl(var(--h) 45% 28%), hsl(calc(var(--h) + 30) 55% 42%)); color: #fff6e6; font-weight: 700; font-size: 15px; }
.bot-tile__name { display: -webkit-box; max-width: 100%; overflow: hidden; color: var(--mg-hi); font-size: 14px; line-height: 1.25; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow-wrap: anywhere; }
.bot-tile__login { max-width: 100%; overflow: hidden; color: var(--mg-muted, #9b8c74); font-size: 11.5px; text-overflow: ellipsis; white-space: nowrap; }
.bot-tile__st { margin-top: 2px; color: var(--mg-copy); font-size: 12px; }
.bot-tile.is-fail .bot-tile__st { color: #ff8a7a; }
.bot-tile.is-busy .bot-tile__st { color: #f8b45a; }
.bots-pt { display: grid; gap: 12px; }
.bots-pt .admin-note { margin: 0; }
.bots-pt__st { margin: 0; padding: 10px 12px; border-radius: 12px; background: rgba(246, 230, 197, .05); color: var(--mg-copy); font-size: 14px; line-height: 1.45; }
.bots-pt__st.is-ok { background: rgba(90, 200, 120, .1); }
.bots-pt__st.is-fail { background: rgba(255, 110, 90, .12); color: #ffb3a8; }
.bots-pt__st.is-run { background: rgba(248, 180, 90, .14); color: #f8b45a; }
.bots-pt__st a { color: #f8b45a; }
html[data-theme="light"] .bots-pt__st.is-fail { color: #a8321f; }
.bots-chk { display: flex; align-items: flex-start; gap: 10px; color: var(--mg-copy); font-size: 14px; line-height: 1.4; cursor: pointer; }
.bots-chk input { flex: 0 0 auto; width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--mg-gold, #f8b45a); }
.bots-pt__acts .btn { justify-self: start; }
@media (max-width: 720px) {
  .bots-make { grid-template-columns: minmax(0, 1fr); }
  .bots-tiles { grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); max-height: 62vh; gap: 6px; }
  .bot-tile { padding: 10px 6px 8px; }
  .bot-tile__av { width: 38px; height: 38px; font-size: 14px; }
  .bot-tile__name { font-size: 13px; }
  .bots-q { max-width: none; flex-basis: 100%; }
  .bots-pt__acts .btn { width: 100%; }
}
.bots-fol { margin: 18px 0; }
.bots-fol > [data-bots-follow] { display: grid; gap: 14px; }
.bots-fol .admin-note { margin: 0; max-width: 860px; }
.bots-fol__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.bots-fol__set, .bots-fol__give { display: grid; gap: 12px; align-content: start; min-width: 0; padding: 14px 16px; border: 1px solid var(--mg-border); border-radius: 16px; background: rgba(246, 230, 197, .03); }
.bots-fol__h { margin: 0; font-size: 16px; color: var(--mg-hi); }
.bots-fol__h small { margin-left: 6px; font-size: 13px; font-weight: 400; color: var(--mg-muted, #9b8c74); }
.bots-chk small { display: block; margin-top: 3px; font-size: 12.5px; color: var(--mg-muted, #9b8c74); }
.bots-rules { display: grid; gap: 6px; }
.bots-rule { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 8px 40px 8px 10px; position: relative; border: 1px solid var(--mg-border); border-radius: 12px; font-size: 14px; color: var(--mg-copy); }
.bots-rule__part { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.bots-rule input, .bots-fol__give .bots-int input, .bots-fol__set .bots-int input { width: 62px; padding: 6px 8px; border: 1px solid var(--mg-border); border-radius: 10px; background: rgba(246, 230, 197, .04); color: var(--mg-hi); font: inherit; font-size: 15px; text-align: center; }
.bots-rule input:focus { outline: none; border-color: rgba(248, 180, 90, .7); }
.bots-rule__x { position: absolute; top: 50%; right: 6px; width: 30px; height: 30px; transform: translateY(-50%); border-radius: 8px; background: transparent; color: var(--mg-muted, #9b8c74); font-size: 20px; line-height: 1; cursor: pointer; }
.bots-rule__x:hover { color: #ff8a7a; }
.bots-fol .bots-int select { margin-left: 2px; padding: 6px 8px; border: 1px solid var(--mg-border); border-radius: 10px; background: rgba(246, 230, 197, .04); color: var(--mg-hi); font: inherit; font-size: 15px; }
.bots-fol .bots-int select option { color: #2b2116; }
.bots-fol__row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.bots-fol__dirty { font-size: 13px; color: #f8b45a; }
.bots-fol__q { width: 100%; box-sizing: border-box; padding: 10px 12px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(246, 230, 197, .04); color: var(--mg-hi); font: inherit; font-size: 16px; outline: none; }
.bots-fol__q:focus { border-color: rgba(248, 180, 90, .7); box-shadow: 0 0 0 3px rgba(248, 180, 90, .15); }
.bots-fol__info { margin: 0; font-size: 14px; line-height: 1.5; color: var(--mg-copy); }
.bots-fol__info b { color: var(--mg-hi); }
.bots-fol__info .is-off { color: #ff8a7a; }
.bots-fol__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.bots-fjobs { display: grid; gap: 8px; }
.bots-fjob { display: grid; gap: 6px; padding: 10px 14px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(246, 230, 197, .02); }
.bots-fjob small { font-size: 12px; line-height: 1.45; color: var(--mg-muted, #9b8c74); }
.bots-fjob .bots-job__acts { margin: 2px 0 0; }
.bots-fjob.is-cancelled, .bots-fjob.is-stopped { opacity: .75; }
.bots-fol__skip { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; font-size: 14px; color: var(--mg-copy); }
.bots-fol__who { display: inline-flex; align-items: center; gap: 6px; }
html[data-theme="light"] :is(.bots-rule input, .bots-fol .bots-int input, .bots-fol .bots-int select, .bots-fol__q) { background: #fffdf8; color: #2b2116; }
@media (max-width: 900px) {
  .bots-fol__grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
  .bots-fol__set, .bots-fol__give { padding: 12px; }
  .bots-rule { padding-right: 36px; }
  .bots-rule__part { flex: 1 1 100%; }
  .bots-rule input { width: 56px; }
  .bots-fol__acts .btn--cta { flex: 1 1 100%; }
}
.bots-acts { display: grid; gap: 10px; min-width: 0; }
.bots-act { border: 1px solid var(--mg-border); border-radius: 16px; background: rgba(246, 230, 197, .03); }
.bots-act.is-on { border-color: rgba(248, 180, 90, .45); }
.bots-act.is-paused { border-style: dashed; }
.bots-act__sum { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; padding: 12px 16px; cursor: pointer; list-style: none; }
.bots-act__sum::-webkit-details-marker { display: none; }
.bots-act__sum::before { content: "›"; display: inline-block; width: 10px; color: var(--mg-muted, #9b8c74); font-size: 18px; line-height: 1; transition: transform .2s; }
.bots-act[open] > .bots-act__sum::before { transform: rotate(90deg); }
.bots-act__sum b { font-size: 15px; color: var(--mg-hi); }
.bots-act__stat { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-left: auto; }
.bots-act__stat .bots-chip { margin-left: 0; }
.bots-act__stat small { font-size: 12px; color: var(--mg-muted, #9b8c74); }
.bots-chip.is-off { background: rgba(246, 230, 197, .06); color: var(--mg-muted, #9b8c74); }
.bots-chip.is-paused { background: rgba(120, 160, 255, .16); color: #9fb8ff; }
.bots-act__body { display: grid; gap: 10px; padding: 0 16px 14px; }
.bots-act__body .bots-hint { margin: 0; }
.bots-rule select, .bots-act__auto select, .bots-give__count select { padding: 6px 8px; border: 1px solid var(--mg-border); border-radius: 10px; background: rgba(246, 230, 197, .04); color: var(--mg-hi); font: inherit; font-size: 15px; }
.bots-rule select option, .bots-act__auto select option, .bots-give__count select option { color: #2b2116; }
.bots-rule__span { gap: 6px; }
.bots-act__texts { display: grid; gap: 6px; font-size: 13px; color: var(--mg-copy); }
.bots-act__texts textarea { width: 100%; box-sizing: border-box; padding: 8px 10px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(246, 230, 197, .04); color: var(--mg-hi); font: inherit; font-size: 15px; resize: vertical; }
.bots-act__texts code { padding: 0 4px; border-radius: 6px; background: rgba(246, 230, 197, .08); }
.bots-act__auto { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.bots-act__auto select { min-width: 0; max-width: 100%; }
.bots-act__more { display: inline-flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }
.bots-give { display: grid; gap: 6px; }
.bots-give__row { display: flex; align-items: flex-start; gap: 10px; padding: 8px 10px; border: 1px solid var(--mg-border); border-radius: 12px; cursor: pointer; }
.bots-give__row input { margin-top: 3px; accent-color: #f8b45a; }
.bots-give__row span { display: grid; gap: 2px; }
.bots-give__row b { font-size: 14px; color: var(--mg-hi); }
.bots-give__row small { font-size: 12px; color: var(--mg-muted, #9b8c74); }
.bots-give__row.is-off { opacity: .55; cursor: default; }
.bots-give__count { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; line-height: 1.4; }
.bots-give__count input { margin: 0; }
.bots-fjob__act { padding: 2px 8px; border-radius: 8px; background: rgba(246, 230, 197, .07); font-size: 12px; color: var(--mg-copy); }
.bots-fjob .bots-job__what { font-size: 13px; color: var(--mg-copy); white-space: normal; overflow: visible; text-overflow: clip; }
.bots-act, .bots-act__body, .bots-act__auto { min-width: 0; }
html[data-theme="light"] :is(.bots-rule select, .bots-act__auto select, .bots-give__count select, .bots-act__texts textarea) { background: #fffdf8; color: #2b2116; }
@media (max-width: 720px) {
  .bots-act__sum { padding: 12px; }
  .bots-act__stat { margin-left: 16px; }
  .bots-act__body { padding: 0 12px 12px; }
  .bots-act__more { margin-left: 0; }
  .bots-act__auto select { flex: 1 1 100%; width: 100%; text-overflow: ellipsis; }
  .bots-act__more { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .bots-act__more .btn:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
/* == end bots == */

/* == share in == */
.shr { max-width: 720px; margin: 0 auto; padding: 8px 0 32px; }
.shr-card { padding: 22px; border: 1px solid rgba(212, 161, 75, .24); border-radius: 18px; background: linear-gradient(160deg, rgba(212, 161, 75, .09), rgba(255, 255, 255, .02) 55%); }
.shr-card--empty { text-align: center; }
.shr-card--empty p { max-width: 460px; margin: 10px auto 18px; color: var(--mg-copy, #beb096); line-height: 1.5; }
.shr-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; margin-bottom: 14px; }
.shr h1 { margin: 0; font-size: 24px; line-height: 1.2; }
.shr-head span { color: var(--mg-muted, #948873); font-size: 14px; }
.shr-list { display: grid; gap: 6px; max-height: 300px; margin: 0 0 14px; padding: 0 4px 0 0; overflow-y: auto; list-style: none; }
.shr-it { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 9px 12px; border-radius: 12px; background: rgba(255, 255, 255, .04); }
.shr-it > i { display: grid; flex: 0 0 34px; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: rgba(212, 161, 75, .14); color: #e8b866; }
.shr-it > i svg { width: 18px; height: 18px; }
.shr-it--video > i { background: rgba(224, 90, 70, .16); color: #f08a6e; }
.shr-it--image > i { background: rgba(110, 170, 230, .16); color: #8cc0f0; }
.shr-it--file > i { background: rgba(255, 255, 255, .08); color: var(--mg-copy, #beb096); }
.shr-it__name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.shr-it em { flex: 0 0 auto; color: var(--mg-muted, #948873); font-size: 12px; font-style: normal; }
.shr-it__ok { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #3fa66b; color: #fff; }
.shr-it__ok svg { width: 13px; height: 13px; }
.shr-it.is-used .shr-it__name { opacity: .6; }
.shr-text { display: grid; gap: 6px; margin-bottom: 16px; }
.shr-text span { color: var(--mg-muted, #948873); font-size: 13px; }
.shr-text textarea { width: 100%; min-height: 72px; padding: 10px 12px; border: 1px solid rgba(212, 161, 75, .22); border-radius: 12px; background: rgba(0, 0, 0, .2); color: inherit; font: inherit; resize: vertical; }
.shr-acts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.shr-act { display: flex; align-items: center; gap: 12px; min-height: 68px; padding: 12px 14px; border: 1px solid rgba(212, 161, 75, .26); border-radius: 14px; background: rgba(255, 255, 255, .03); color: inherit; font: inherit; text-align: left; cursor: pointer; transition: background .15s, border-color .15s, transform .15s; }
.shr-act:hover:not(:disabled) { border-color: rgba(232, 184, 102, .6); background: rgba(212, 161, 75, .1); }
.shr-act:active:not(:disabled) { transform: scale(.985); }
.shr-act:disabled { opacity: .45; cursor: default; }
.shr-act__ic { display: grid; flex: 0 0 40px; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: linear-gradient(140deg, #e8b866, #b9772f); color: #1a1208; }
.shr-act__ic svg { width: 20px; height: 20px; }
.shr-act span { display: grid; gap: 2px; min-width: 0; }
.shr-act b { font-size: 15px; }
.shr-act em { color: var(--mg-muted, #948873); font-size: 12.5px; font-style: normal; line-height: 1.35; }
.shr-queue { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 12px; padding: 10px 12px; border-radius: 12px; background: rgba(212, 161, 75, .1); font-size: 14px; }
.shr-login { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.shr-login p { margin: 0; color: var(--mg-copy, #beb096); }
.shr-foot { display: flex; justify-content: flex-end; margin-top: 14px; }
@media (max-width: 720px) {
  .shr { padding-top: 0; }
  .shr-card { padding: 16px 14px; border-radius: 16px; }
  .shr h1 { font-size: 20px; }
  .shr-acts { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .shr-act { min-height: 60px; }
  .shr-head { margin-bottom: 10px; }
  .shr-it { padding: 7px 10px; }
  .shr-text textarea { min-height: 56px; }
}
/* == end share in == */

/* == studio music (п.9) == */
.studio-kinds-bar .studio-kinds { gap: 10px; padding: 2px 0; }
.studio-kinds-bar .studio-kinds::after { display: none; }
.studio-kinds-bar .studio-kinds .tab {
  min-height: 54px; padding: 0 26px; border-radius: 16px;
  border: 1.5px solid rgba(242, 138, 45, .55);
  background: linear-gradient(180deg, rgba(242, 138, 45, .2), rgba(242, 138, 45, .1));
  color: #ffb168; font: 800 17px/1 var(--sans); letter-spacing: .01em; text-transform: none;
  display: inline-flex; align-items: center; gap: 8px;
  transition: transform .15s ease, box-shadow .2s ease, background .2s ease;
}
.studio-kinds-bar .studio-kinds .tab:hover { color: #ffc58a; transform: translateY(-1px); box-shadow: 0 8px 22px rgba(242, 138, 45, .22); }
.studio-kinds-bar .studio-kinds .tab.is-active {
  border-color: transparent; background: linear-gradient(135deg, #ffb347, #f28a2d 55%, #e8681c);
  color: #2a1606; box-shadow: 0 10px 26px rgba(242, 138, 45, .38), inset 0 1px 0 rgba(255, 255, 255, .35);
}
.studio-kinds-bar .studio-kinds .tab__n { font-size: 14px; opacity: .8; }
html[data-theme="light"] .studio-kinds-bar .studio-kinds .tab { color: #b8560f; background: linear-gradient(180deg, #fff1e2, #ffe4c7); }
html[data-theme="light"] .studio-kinds-bar .studio-kinds .tab.is-active { color: #2a1606; background: linear-gradient(135deg, #ffb347, #f28a2d 55%, #e8681c); }
.mus-st { border-radius: 14px; margin-bottom: 8px; background: rgba(255, 255, 255, .025); }
.mus-st .mus-row { margin-bottom: 0; }
.mus-st__bar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 2px 12px 12px 12px; }
.mus-st__dj { flex: 1 1 220px; font-size: 13.5px; color: var(--mg-muted); }
.mus-st__dj::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 7px; background: #8a7f72; vertical-align: 1px; }
.mus-st__dj.is-on { color: #ffb168; }
.mus-st__dj.is-on::before { background: #f28a2d; box-shadow: 0 0 8px rgba(242, 138, 45, .7); }
.mus-dj { display: grid; gap: 10px; }
.mus-dj__more { display: grid; gap: 10px; padding-left: 14px; border-left: 2px solid rgba(242, 138, 45, .4); }
.mus-dj__more[hidden], .mus-dj__sum[hidden] { display: none; }
.mus-dj__sum { display: grid; gap: 6px; font-weight: 600; }
.mus-dj__sum input { max-width: 180px; font-size: 17px; }
.mus-kt { max-width: 560px; }
.mus-kt__list { list-style: none; margin: 10px 0; padding: 0; max-height: 42vh; overflow: auto; display: grid; gap: 4px; }
.mus-kt__ln { display: flex; gap: 12px; align-items: baseline; padding: 9px 12px; border-radius: 10px; font-size: 15.5px; color: var(--mg-muted); }
.mus-kt__ln.is-done { color: var(--mg-ivory); }
.mus-kt__ln.is-cur { background: rgba(242, 138, 45, .16); color: #ffb168; font-weight: 700; }
html[data-theme="light"] .mus-kt__ln.is-cur, html[data-theme="light"] .mus-st__dj.is-on { color: #b8560f; }
.mus-kt__t { flex: 0 0 52px; font: 600 12.5px/1.4 var(--mono); opacity: .8; }
.mus-kt__ctl { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 6px 0 10px; }
.mus-kt__play { display: inline-flex; align-items: center; gap: 6px; }
.mus-kt__play svg { width: 18px; height: 18px; }
.mus-kt__clock { font: 700 18px/1 var(--mono); }
.mus-kt__mark { width: 100%; min-height: 56px; font-size: 17px; margin-bottom: 6px; }
@media (max-width: 720px) {
  .studio-kinds-bar .studio-kinds { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; gap: 8px; }
  .studio-kinds-bar .studio-kinds .tab { min-height: 50px; padding: 0 8px; font-size: 15.5px; justify-content: center; border-radius: 14px; }
  .studio-kinds-bar .studio-kinds .tab__n { display: none; }
  .mus-st__bar .btn { flex: 1 1 auto; }
}
/* == end studio music == */

/* == author promo (п.11) == */
.author-promo {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px;
  margin: 0 0 18px; padding: 16px 20px; border-radius: 18px;
  border: 1.5px solid rgba(242, 138, 45, .5);
  background: radial-gradient(120% 140% at 0% 0%, rgba(255, 179, 71, .22), transparent 60%), linear-gradient(135deg, rgba(242, 138, 45, .14), rgba(232, 104, 28, .06));
  box-shadow: 0 10px 28px rgba(242, 138, 45, .12);
}
.author-promo__gem { font-size: 34px; line-height: 1; filter: drop-shadow(0 4px 10px rgba(80, 170, 255, .45)); }
.author-promo__title { display: block; font: 800 18px/1.25 var(--sans); color: #ffb168; margin-bottom: 4px; }
.author-promo__text p { margin: 0; font-size: 14.5px; line-height: 1.45; color: var(--mg-ivory, inherit); opacity: .9; }
.author-promo__acts { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.author-promo__acts .btn { white-space: nowrap; }
html[data-theme="light"] .author-promo { background: linear-gradient(135deg, #fff3e4, #ffe6cc); }
html[data-theme="light"] .author-promo__title { color: #b8560f; }
html[data-theme="light"] .author-promo__text p { color: #3a2a1c; }
.pub-promo { margin: 0 0 14px; padding: 10px 14px; border-radius: 12px; font-size: 14.5px; line-height: 1.4; background: rgba(242, 138, 45, .12); border: 1px solid rgba(242, 138, 45, .4); }
.pub-promo.is-ok { background: rgba(70, 190, 120, .12); border-color: rgba(70, 190, 120, .45); }
@media (max-width: 720px) {
  .author-promo { grid-template-columns: auto 1fr; padding: 14px; gap: 10px 12px; }
  .author-promo__gem { font-size: 28px; align-self: start; }
  .author-promo__title { font-size: 16px; }
  .author-promo__text p { font-size: 13.5px; }
  .author-promo__acts { grid-column: 1 / -1; justify-content: stretch; }
  .author-promo__acts .btn { flex: 1 1 0; justify-content: center; }
}
.mus-st__hold, .mod-card__warn { margin: 0 12px 8px; padding: 9px 12px; border-radius: 10px; font-size: 13.5px; line-height: 1.4; background: rgba(230, 80, 60, .12); border: 1px solid rgba(230, 80, 60, .4); }
.mod-card__warn { margin: 6px 0; }
/* == end author promo == */

/* == задания за алмазы (п.13) == */
.tk-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.tk-head__btn { flex: 0 0 auto; margin-top: 22px; }
.tk-tabs { display: flex; gap: 8px; margin: 4px 0 18px; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.tk-tabs::-webkit-scrollbar { display: none; }
.tk-tab { flex: 0 0 auto; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--mg-border); background: transparent; color: var(--mg-copy); font: 600 14px/1.2 var(--sans); cursor: pointer; white-space: nowrap; }
.tk-tab.is-active { background: var(--mg-amber); border-color: var(--mg-amber); color: #1a1206; }
.tk-list, .tk-rows { display: grid; gap: 10px; }
.tk-card { display: grid; grid-template-columns: 64px 1fr auto; align-items: center; gap: 14px; padding: 12px 14px; border: 1px solid var(--mg-border); border-radius: 16px; background: var(--mg-card); }
.tk-card__cover { width: 64px; height: 64px; border-radius: 12px; overflow: hidden; display: grid; place-items: center; background: rgba(242, 138, 45, .14); font-size: 26px; color: var(--mg-hi); }
.tk-card__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tk-card__cover--ch { border-radius: 50%; font: 700 24px/1 var(--display); }
.tk-card__body { min-width: 0; display: grid; gap: 4px; }
.tk-card__kind { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: var(--mg-amber); }
.tk-card__title { font: 700 16px/1.3 var(--sans); color: var(--mg-hi); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.tk-card__meta { font-size: 13px; color: var(--mg-copy); opacity: .85; }
.tk-card__side { display: grid; justify-items: end; gap: 8px; }
.tk-card__price { font: 800 18px/1.1 var(--sans); color: #7cc7ff; white-space: nowrap; }
.tk-empty { padding: 28px 18px; }
.tk-row { display: grid; grid-template-columns: 40px 1fr auto; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--mg-border); border-radius: 14px; background: var(--mg-card); }
.tk-row__kind { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: rgba(242, 138, 45, .14); font-size: 18px; }
.tk-row__txt { min-width: 0; display: grid; gap: 3px; }
.tk-row__txt b { color: var(--mg-hi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-row__txt span { font-size: 13px; color: var(--mg-copy); }
.tk-row__side { display: grid; justify-items: end; gap: 6px; }
.tk-state { font-size: 12.5px; font-weight: 700; padding: 4px 10px; border-radius: 999px; background: rgba(246, 230, 197, .08); color: var(--mg-copy); white-space: nowrap; }
.tk-state.is-ok { background: rgba(70, 190, 120, .16); color: #8fd98a; }
.tk-state.is-hold { background: rgba(242, 138, 45, .16); color: #ffb168; }
.tk-state.is-bad { background: rgba(230, 80, 60, .14); color: #f0a08a; white-space: normal; text-align: right; }
.tk-bar { display: block; height: 6px; margin-top: 4px; border-radius: 3px; background: rgba(246, 230, 197, .1); overflow: hidden; }
.tk-bar > i { display: block; height: 100%; background: linear-gradient(90deg, #f28a2d, #ffb347); border-radius: 3px; }
.tk-orders__head { display: flex; justify-content: flex-end; margin: 0 0 12px; }
.tk-modal__box { max-width: 520px; }
.tk-modal__lead { margin: 0 0 12px; font-size: 14px; }
.tk-modal__what { margin: 0 0 12px; padding: 10px 12px; border-radius: 10px; background: rgba(242, 138, 45, .1); font-weight: 700; color: var(--mg-hi) !important; }
.tk-modal__sel { display: grid; gap: 6px; margin: 0 0 12px; font-size: 13px; color: var(--mg-copy); }
.tk-modal__sel select, .tk-pk__in input { width: 100%; min-height: 40px; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--mg-border); background: rgba(0, 0, 0, .18); color: var(--mg-hi); font: 600 15px/1.2 var(--sans); }
.tk-pk { margin: 0 0 8px; padding: 10px 12px; border: 1px solid var(--mg-border); border-radius: 12px; transition: border-color .15s, background .15s; }
.tk-pk.is-on { border-color: rgba(242, 138, 45, .6); background: rgba(242, 138, 45, .07); }
.tk-pk.is-dis { opacity: .45; pointer-events: none; }
.tk-pk__chk { display: flex; align-items: center; gap: 10px; cursor: pointer; color: var(--mg-hi); }
.tk-pk__chk input { width: 18px; height: 18px; accent-color: var(--mg-amber); }
.tk-pk__in { display: none; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.tk-pk.is-on .tk-pk__in { display: grid; }
.tk-pk__in label { display: grid; gap: 4px; font-size: 12.5px; color: var(--mg-copy); }
.tk-pk__hint { display: none; margin: 8px 0 0 !important; font-size: 12.5px; opacity: .8; }
.tk-pk.is-on .tk-pk__hint { display: block; }
.tk-pk__place { display: none; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 10px 0 0 !important; font-size: 13.5px; color: var(--mg-hi); }
.tk-pk.is-on .tk-pk__place:not(:empty) { display: flex; }
.tk-pk__place b { color: #d9822b; }
.tk-pk__place.is-first b { color: #23a05f; }
.tk-pk__rec { border: 1px solid rgba(124, 199, 255, .45); background: rgba(124, 199, 255, .12); color: #7cc7ff; border-radius: 999px; padding: 5px 12px; font: 600 12.5px/1.2 var(--sans); cursor: pointer; }
.tk-pk__rec:hover { background: rgba(124, 199, 255, .22); }
.tk-modal__sum { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; margin: 12px 0 8px; color: var(--mg-hi); }
.tk-modal__sum b { font: 800 20px/1 var(--sans); color: #7cc7ff; }
.tk-modal__sum small { flex-basis: 100%; font-size: 13px; color: var(--mg-copy); }
.tk-modal__sum small.is-err { color: #f0a08a; }
.tk-float { position: fixed; left: 50%; bottom: 18px; transform: translateX(-50%); z-index: 1050; width: min(560px, calc(100vw - 20px)); display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 12px; padding: 10px 10px 10px 14px; border-radius: 16px; border: 1px solid rgba(242, 138, 45, .55); background: var(--mg-card); box-shadow: 0 18px 50px rgba(0, 0, 0, .5); }
.tk-float__gem { font: 800 17px/1 var(--sans); color: #7cc7ff; }
.tk-float__txt { min-width: 0; display: grid; gap: 2px; }
.tk-float__txt b { font-size: 14px; color: var(--mg-hi); }
.tk-float__txt span { font-size: 13px; color: var(--mg-copy); }
.tk-float .btn:disabled { opacity: .45; cursor: default; }
.tk-float__x { width: 32px; height: 32px; border: 0; border-radius: 50%; background: rgba(246, 230, 197, .08); color: var(--mg-hi); font-size: 20px; line-height: 1; cursor: pointer; }
html[data-theme="light"] .tk-card__price, html[data-theme="light"] .tk-float__gem, html[data-theme="light"] .tk-modal__sum b { color: #1f6fb8; }
html[data-theme="light"] .tk-modal__sel select, html[data-theme="light"] .tk-pk__in input { background: #fff; }
@media (max-width: 720px) {
  .tk-head { flex-direction: column; gap: 4px; }
  .tk-head__btn { margin-top: 0; }
  .tk-card { grid-template-columns: 52px 1fr; gap: 10px 12px; padding: 12px; }
  .tk-card__cover { width: 52px; height: 52px; }
  .tk-card__side { grid-column: 1 / -1; grid-template-columns: 1fr auto; align-items: center; justify-items: start; }
  .tk-row { grid-template-columns: 36px 1fr; }
  .tk-row__kind { width: 36px; height: 36px; }
  .tk-row__side, .tk-row > .tk-state { grid-column: 2; justify-items: start; justify-self: start; }
  .tk-float { bottom: calc(72px + env(safe-area-inset-bottom, 0px)); grid-template-columns: auto 1fr auto; }
  .tk-float__x { grid-row: 1; grid-column: 3; }
  .tk-float .btn { grid-column: 1 / -1; width: 100%; justify-content: center; }
}
/* == end задания == */

/* == крестик «убрать из списка» у диалога == */
.soc-dlist__it { position: relative; }
/* == end крестик == */

/* == архив чатов == */
.soc-dlist__tabs { display: flex; gap: 6px; padding: 10px 12px 4px; }
.soc-dlist__tabs button { flex: 1; padding: 8px 10px; border: 1px solid var(--mg-border, rgba(212,161,75,.2)); border-radius: 999px; background: transparent; color: var(--mg-muted); font: 600 13px/1.2 var(--body); cursor: pointer; }
.soc-dlist__tabs button.is-on { background: rgba(242,138,45,.14); border-color: rgba(242,138,45,.55); color: var(--mg-hi); }
.soc-dlist__note { margin: 4px 6px 8px; padding: 0 4px; font-size: 12.5px; line-height: 1.45; }
.soc-dlist__arow { border-radius: 12px; margin-bottom: 4px; background: rgba(212,161,75,.04); }
.soc-dlist__acts { display: flex; gap: 8px; padding: 0 10px 10px 66px; }
.soc-dlist__acts .btn { flex: 1; justify-content: center; }
/* == end архив чатов == */

/* == настройка левого меню == */
button.side-link--cfg { width: 100%; border: 0; background: none; font: inherit; color: var(--mg-muted); text-align: left; cursor: pointer; }
button.side-link--cfg:hover { color: var(--mg-hi); }
.side-cfg__box { max-width: 520px; width: calc(100vw - 24px); max-height: calc(100dvh - 32px); display: flex; flex-direction: column; }
.side-cfg__list { list-style: none; margin: 10px 0 0; padding: 0; overflow-y: auto; flex: 1; min-height: 0; }
.side-cfg__row { display: flex; align-items: center; gap: 6px; padding: 6px 6px; border-radius: 10px; border: 1px solid transparent; }
.side-cfg__row + .side-cfg__row { margin-top: 2px; }
.side-cfg__row:hover { background: rgba(212,161,75,.06); }
.side-cfg__row.is-drag { opacity: .45; border-color: rgba(242,138,45,.5); }
.side-cfg__row.is-off .side-cfg__name > span { opacity: .45; }
.side-cfg__grip { cursor: grab; color: var(--mg-muted); font-size: 13px; letter-spacing: -2px; padding: 0 4px; user-select: none; }
.side-cfg__name { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 14px; color: var(--mg-hi); }
.side-cfg__name input { width: 18px; height: 18px; accent-color: #f28a2d; flex: none; }
.side-cfg__name small { margin-left: auto; color: var(--mg-muted); font-size: 11.5px; }
.side-cfg__name > span:not(.side-cfg__ic) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.side-cfg__ic { display: inline-flex; width: 18px; height: 18px; flex: none; color: var(--mg-muted); }
.side-cfg__ic svg { width: 18px; height: 18px; }
.side-cfg__more, .side-cfg__mv { flex: none; min-width: 34px; height: 30px; padding: 0 8px; border-radius: 8px; border: 1px solid var(--mg-border, rgba(212,161,75,.2)); background: transparent; color: var(--mg-muted); font: 600 12px/1 var(--body); cursor: pointer; }
.side-cfg__more.is-on { background: rgba(242,138,45,.14); border-color: rgba(242,138,45,.55); color: var(--mg-hi); }
.side-cfg__mv:disabled { opacity: .3; cursor: default; }
.side-cfg__acts { display: flex; gap: 10px; margin-top: 12px; }
.side-cfg__acts .btn { flex: 1; justify-content: center; }
@media (max-width: 520px) {
  .side-cfg__grip { display: none; }
  .side-cfg__more, .side-cfg__mv { min-width: 30px; padding: 0 6px; }
}
/* == end настройка левого меню == */

.sk-share { display: grid; gap: 10px; margin: 6px 0 4px; }
.sk-share .btn { width: 100%; justify-content: center; }

/* == картинка статьи окошком == */
[data-post-body] img, .post-hero__cover img { cursor: zoom-in; }
.img-zoom { position: fixed; inset: 0; z-index: 1300; display: grid; place-items: center; padding: 24px; background: rgba(8, 6, 4, .72); touch-action: none; animation: chr-in .14s ease-out; }
.img-zoom__box { max-width: min(92vw, 1100px); max-height: 82vh; overflow: hidden; border-radius: 16px; border: 1px solid rgba(212, 161, 75, .3); background: #15120f; box-shadow: 0 24px 60px rgba(0, 0, 0, .6); }
.img-zoom__box img { display: block; max-width: min(92vw, 1100px); max-height: 82vh; width: auto; height: auto; object-fit: contain; transform-origin: center; transition: transform .08s linear; user-select: none; -webkit-user-drag: none; cursor: zoom-out; }
.img-zoom.is-zoomed .img-zoom__box img { cursor: grab; }
.img-zoom__hint { position: absolute; left: 50%; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); padding: 6px 12px; border-radius: 999px; background: rgba(20, 17, 13, .85); color: rgba(255, 255, 255, .78); font-size: 12px; white-space: nowrap; pointer-events: none; }
@media (max-width: 640px) { .img-zoom { padding: 10px; } .img-zoom__hint { font-size: 11px; white-space: normal; text-align: center; width: max-content; max-width: 90vw; } }
/* == end картинка статьи == */
/* == gifts 3d == */
/* Подарок в окне открытия: без подложки и рамки, объём — покачивание в перспективе, блик по силуэту, тень снизу. */
.gift-reveal { perspective: 900px; }
.gift3d { position: relative; display: block; width: min(250px, 64vw); aspect-ratio: 1; margin: 0 auto 6px; isolation: isolate; }
.gift3d__glow { position: absolute; left: 50%; top: 46%; z-index: 0; width: 92%; aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--tier) 34%, transparent) 0, color-mix(in srgb, var(--tier) 10%, transparent) 42%, transparent 70%); filter: blur(6px); animation: gift3d-glow 4.8s ease-in-out infinite; pointer-events: none; }
.gift3d--anim .gift3d__glow { background: radial-gradient(circle, color-mix(in srgb, var(--tier) 42%, transparent) 0, color-mix(in srgb, var(--tier) 14%, transparent) 45%, transparent 72%); }
.gift3d__obj { position: absolute; inset: 4% 4% 10%; z-index: 2; display: block; transform-style: preserve-3d; transform-origin: 50% 70%; animation: gift3d-sway 4.8s ease-in-out infinite; will-change: transform; }
.gift3d__obj img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 14px 14px rgba(0, 0, 0, 0.55)) drop-shadow(0 3px 3px rgba(0, 0, 0, 0.35)); -webkit-user-drag: none; user-select: none; }
.gift3d__gloss { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(112deg, transparent 34%, rgba(255, 255, 255, 0.55) 46%, rgba(255, 255, 255, 0.12) 53%, transparent 62%) -170% 0 / 260% 100% no-repeat; -webkit-mask-size: 100% 100%; mask-size: 100% 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; mix-blend-mode: screen; animation: gift3d-gloss 4.8s ease-in-out infinite; }
.gift3d__shadow { position: absolute; left: 50%; bottom: 3%; z-index: 1; width: 62%; height: 9%; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(closest-side, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.35) 55%, transparent); animation: gift3d-shadow 4.8s ease-in-out infinite; pointer-events: none; }
@keyframes gift3d-sway {
  0%, 100% { transform: translateY(0) rotateY(-14deg) rotateX(4deg) rotateZ(-1.5deg); }
  50% { transform: translateY(-12px) rotateY(14deg) rotateX(-3deg) rotateZ(1.5deg); }
}
@keyframes gift3d-shadow { 0%, 100% { transform: translateX(-50%) scale(1); opacity: 1; } 50% { transform: translateX(-50%) scale(0.8); opacity: 0.62; } }
@keyframes gift3d-glow { 0%, 100% { opacity: 0.75; transform: translate(-50%, -50%) scale(0.96); } 50% { opacity: 1; transform: translate(-50%, -50%) scale(1.04); } }
@keyframes gift3d-gloss { 0%, 30% { background-position: -170% 0; } 70%, 100% { background-position: 270% 0; } }
/* картинки подарков прозрачные: в плитках платины и бриллианта вращающаяся рамка не должна просвечивать сквозь подарок */
.gift-art--anim img { background: #12100d; }
.gift-reveal__row .gift-art { background: transparent; overflow: visible; }
.gift-reveal__row .gift-art img { object-fit: contain; filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.5)); }
.gift-reveal__row .gift-art__aura, .gift-reveal__row .gift-art__spark, .gift-reveal__row .gift-art--anim::before, .gift-reveal__row .gift-art--anim::after { display: none; }
.gift-reveal__row .gift-art--anim img { position: relative; inset: auto; width: 100%; height: 100%; border-radius: 0; background: transparent; }
@media (max-width: 640px) { .gift3d { width: min(220px, 58vw); } }
@media (max-height: 700px) { .gift3d { width: min(190px, 50vw); } }
html.no-anim .gift3d__obj, html.no-anim .gift3d__shadow, html.no-anim .gift3d__glow, html.no-anim .gift3d__gloss { animation: none; }
html.no-anim .gift3d__obj { transform: rotateY(-10deg) rotateX(3deg); }
@media (prefers-reduced-motion: reduce) { .gift3d__obj, .gift3d__shadow, .gift3d__glow, .gift3d__gloss { animation: none; } .gift3d__obj { transform: rotateY(-10deg) rotateX(3deg); } }
/* == end gifts 3d == */

/* == mic access == */
.mic-sheet { position: fixed; inset: 0; z-index: 12500; display: grid; place-items: center; padding: 16px; }
.mic-sheet__bg { position: absolute; inset: 0; background: rgba(4, 4, 3, .62); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transition: opacity .18s ease; }
.mic-sheet__box { position: relative; width: min(460px, 100%); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 24px 24px 20px; border: 1px solid var(--mg-border); border-radius: 20px; background: var(--mg-card); color: var(--mg-ivory); box-shadow: 0 30px 80px rgba(0, 0, 0, .5); outline: none; opacity: 0; transform: translateY(12px) scale(.98); transition: opacity .18s ease, transform .18s ease; }
.mic-sheet.is-in .mic-sheet__bg { opacity: 1; }
.mic-sheet.is-in .mic-sheet__box { opacity: 1; transform: none; }
.mic-sheet__ic { display: grid; place-items: center; width: 56px; height: 56px; margin: 0 auto 12px; border-radius: 50%; background: rgba(242, 138, 45, .14); color: var(--mg-amber); }
.mic-sheet__ic.is-off { background: rgba(232, 92, 70, .14); color: #e8604a; }
.mic-sheet__ic.is-ok { background: rgba(52, 168, 98, .16); color: #34a862; }
.mic-sheet__title { margin: 0 0 8px; text-align: center; font-size: 20px; line-height: 1.25; font-weight: 700; color: var(--mg-hi); }
.mic-sheet__lead { margin: 0 0 12px; text-align: center; font-size: 15px; line-height: 1.45; color: var(--mg-copy); }
.mic-sheet__fine { margin: 0 0 12px; font-size: 13px; line-height: 1.4; color: var(--mg-muted); }
.mic-sheet__lead + .mic-sheet__fine { text-align: center; }
.mic-sheet__where { margin: 4px 0 6px; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--mg-gold); }
.mic-sheet__steps { margin: 0 0 12px; padding: 0; list-style: none; counter-reset: mic; display: grid; gap: 8px; }
.mic-sheet__steps li { counter-increment: mic; display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 10px; align-items: start; font-size: 15px; line-height: 1.4; color: var(--mg-ivory); }
.mic-sheet__steps li::before { content: counter(mic); display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--grad-cta); color: var(--mg-ink); font-size: 13px; font-weight: 700; }
.mic-sheet__warn { margin: 0 0 12px; padding: 10px 12px; border-radius: 12px; background: rgba(232, 92, 70, .12); color: var(--mg-ivory); font-size: 14px; line-height: 1.4; }
.mic-sheet__other { margin: 0 0 14px; border-top: 1px solid var(--mg-border); padding-top: 10px; font-size: 13px; color: var(--mg-muted); }
.mic-sheet__other summary { cursor: pointer; color: var(--mg-copy); }
.mic-sheet__other ul { margin: 8px 0 0; padding-left: 18px; display: grid; gap: 4px; line-height: 1.4; }
.mic-sheet__other b { color: var(--mg-copy); font-weight: 600; }
.mic-sheet__btns { display: grid; gap: 8px; }
.mic-sheet__btns .btn { width: 100%; min-height: 46px; font-size: 15px; }
.mic-set-list { margin-bottom: 16px; }
.mic-set__st { display: flex; flex-wrap: wrap; gap: 4px 14px; }
.mic-set__v::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 50%; background: var(--mg-muted); vertical-align: 1px; }
.mic-set__v.is-ok::before { background: #34a862; }
.mic-set__v.is-off::before { background: #e8604a; }
.mic-set__v.is-off { color: #e8604a; }
@media (max-width: 640px) {
  .mic-sheet { place-items: end stretch; padding: 0; }
  .mic-sheet__box { width: 100%; max-height: 92dvh; padding: 10px 18px calc(18px + env(safe-area-inset-bottom, 0px)); border-radius: 22px 22px 0 0; border-bottom: 0; transform: translateY(40px); }
  .mic-sheet__box::before { content: ""; display: block; width: 40px; height: 4px; margin: 0 auto 14px; border-radius: 4px; background: var(--mg-border); }
  .mic-set { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) { .mic-sheet__bg, .mic-sheet__box { transition: none; } }
/* == end mic access == */
/* == messenger app == */
.app-messenger .sidebar, .app-messenger .rail, .app-messenger .side-edge, .app-messenger .bottom-nav, .app-messenger .browse-switch,
.app-messenger .topnav__search, .app-messenger #nav-create, .app-messenger .nav-radio-slot, .app-messenger .nav-extras,
.app-messenger .mc, .app-messenger .mus-bar, .app-messenger .radio-disc--float, .app-messenger .grana-visitor, .app-messenger .gr-chat,
.app-messenger .app-promo, .app-messenger .gdz-beta-card, .app-messenger .gdz-beta-chip, .app-messenger .sf-ad, .app-messenger .ad-slot,
.app-messenger .promo-pill, .app-messenger .site-legal, .app-messenger .works-bar, .app-messenger .gr-tick { display: none !important; }
.app-messenger .layout { display: block; max-width: 1320px; margin: 0 auto; padding-left: 104px; }
.app-messenger .main { max-width: none; padding-bottom: 32px; }
.msn-nav { display: none; }
.app-messenger .msn-nav { position: fixed; z-index: 150; left: max(16px, calc((100vw - 1320px) / 2 + 16px)); top: calc(var(--nav-h, 64px) + 20px); display: flex; flex-direction: column; gap: 6px; width: 80px; padding: 8px 6px; border: 1px solid var(--mg-border); border-radius: 20px; background: rgba(16, 14, 11, 0.92); }
.msn-nav__it { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; min-height: 64px; border-radius: 14px; color: var(--mg-muted); font-size: 12px; font-weight: 600; text-decoration: none; transition: background .15s, color .15s; }
.msn-nav__it svg { width: 24px; height: 24px; }
.msn-nav__it:hover { color: var(--mg-ivory); background: rgba(212, 161, 75, 0.08); }
.msn-nav__it.is-active { color: var(--mg-amber-lite, #f6b25e); background: rgba(242, 138, 45, 0.12); }
.msn-nav__n { position: absolute; top: 6px; right: 12px; min-width: 18px; padding: 1px 5px; border-radius: 999px; background: var(--grad-cta, #f28a2d); color: var(--mg-ink, #120c06); font-style: normal; font-size: 11px; font-weight: 700; line-height: 16px; text-align: center; }
.msn-nav__n[hidden] { display: none; }
html[data-theme="light"].app-messenger .msn-nav { background: rgba(255, 250, 243, 0.96); }
.msn-page { max-width: 760px; }
.msn-head { display: flex; align-items: center; gap: 12px; margin: 4px 0 14px; }
.msn-head h1 { margin: 0; font-size: 26px; }
.msn-calls { border: 1px solid var(--mg-border); border-radius: 18px; overflow: hidden; background: rgba(16, 14, 11, 0.9); }
:where(html[data-theme="light"]) .msn-calls { background: #fffaf3; }
.msn-call { display: flex; align-items: center; gap: 6px; padding: 8px 10px 8px 0; border-bottom: 1px solid var(--mg-border); }
.msn-call:last-child { border-bottom: 0; }
.msn-call__who { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 12px; padding: 4px 4px 4px 14px; color: inherit; text-decoration: none; }
.msn-call__body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.msn-call__body b { overflow: hidden; color: var(--mg-ivory); white-space: nowrap; text-overflow: ellipsis; }
:where(html[data-theme="light"]) .msn-call__body b { color: #2a1d14; }
.msn-call__info { display: flex; align-items: center; gap: 5px; min-width: 0; color: var(--mg-muted); font-size: 13px; }
.msn-call__info > span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.msn-call__info svg { flex: none; color: #6fbf73; }
.msn-call.is-missed .msn-call__info, .msn-call.is-missed .msn-call__info svg { color: #ef6b5b; }
.msn-call__at { color: var(--mg-muted); font-size: 12px; white-space: nowrap; opacity: .8; }
.msn-call__acts { flex: none; display: flex; gap: 2px; }
.msn-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 48px 20px; border: 1px dashed var(--mg-border); border-radius: 18px; color: var(--mg-muted); text-align: center; }
.msn-empty > svg { width: 40px; height: 40px; color: var(--mg-amber-lite, #f6b25e); }
.msn-empty b { color: var(--mg-ivory); font-size: 17px; }
:where(html[data-theme="light"]) .msn-empty b { color: #2a1d14; }
.msn-empty span { max-width: 360px; font-size: 14px; line-height: 1.45; }
.msn-empty .btn { margin-top: 6px; }
@media (max-width: 860px) {
  .app-messenger .layout { padding-left: 0; }
  .app-messenger .main { padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
  .app-messenger.is-msgs-page .main { padding-bottom: 0; }
  .app-messenger .msn-nav { left: 0; right: 0; top: auto; bottom: 0; width: auto; flex-direction: row; gap: 4px; padding: 6px 10px calc(6px + env(safe-area-inset-bottom, 0px)); border: 0; border-top: 1px solid var(--mg-border); border-radius: 0; background: rgba(7, 7, 6, 0.96); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
  html[data-theme="light"].app-messenger .msn-nav { background: rgba(255, 250, 243, 0.97); }
  .msn-nav__it { flex: 1 1 0; min-height: 54px; gap: 4px; font-size: 11px; }
  .msn-nav__it svg { width: 23px; height: 23px; }
  .msn-nav__n { right: calc(50% - 22px); top: 4px; }
  .app-messenger.msn-conv .msn-nav, .app-messenger.chat-full .msn-nav, .app-messenger.kb-open .msn-nav { display: none; }
  .msn-head h1 { font-size: 22px; }
}
/* == end messenger app == */

/* == comments-reply == */
.cm-field { position: relative; }
.cm-field textarea { display: block; width: 100%; box-sizing: border-box; padding-right: 92px; }
.comment-form .cm-field .emo-btn { position: absolute; right: 6px; bottom: 6px; width: 36px; height: 36px; margin: 0; z-index: 1; }
.comment-form .cm-field .tg-btn { position: absolute; right: 44px; bottom: 6px; width: 34px; height: 36px; margin: 0; z-index: 1; }
.comment-form .cm-field .tg-pair { position: absolute; right: 6px; bottom: 6px; z-index: 1; }
.cm-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.cm-bar__btns { display: flex; gap: 8px; margin-left: auto; }
.cm-as { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 3px; border: 1px solid var(--mg-border); border-radius: 999px; background: rgba(246, 230, 197, .04); min-width: 0; max-width: 100%; }
.cm-as__opt { display: inline-flex; align-items: center; gap: 6px; min-width: 0; max-width: 100%; min-height: 32px; padding: 4px 12px; border: 0; border-radius: 999px; background: transparent; color: var(--mg-muted); font: 600 13px/1.2 var(--sans); cursor: pointer; }
.cm-as__opt:hover { color: var(--mg-ivory); }
.cm-as__opt.is-on { background: rgba(232, 119, 46, .16); color: var(--mg-ivory); box-shadow: inset 0 0 0 1px rgba(232, 119, 46, .45); }
.cm-as__opt b { font-weight: 700; }
.cm-as__txt { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cm-as__ava.avatar { width: 22px; height: 22px; min-width: 22px; font-size: 10px; margin-left: -6px; }
.comment-form--inline { margin: 2px 0 12px 48px; padding: 12px; gap: 8px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(246, 230, 197, .035); animation: cm-in .18s ease-out; scroll-margin: 90px 0 40vh; }
.comment-form--inline.comment-form--deep { margin-left: 76px; }
.comment-form--inline textarea { min-height: 64px; }
.comment-form__to { font-size: 13px; color: var(--mg-muted); }
.comment-form__to b { color: var(--mg-ivory); font-weight: 700; }
@keyframes cm-in { from { opacity: 0; transform: translateY(-4px); } }
.comment--channel .comment__author { color: var(--mg-ivory); text-decoration: none; }
.comment--channel a.comment__author:hover { color: var(--accent, #e8772e); }
.comment-more { display: block; margin: 4px 0 10px 64px; padding: 6px 10px; border: 0; border-radius: 8px; background: transparent; color: var(--accent, #e8772e); font: 600 13px/1.2 var(--sans); cursor: pointer; }
.comment-more:hover { background: rgba(232, 119, 46, .08); }
html[data-theme="light"] .cm-as { background: #fffdf9; }
html[data-theme="light"] .cm-as__opt.is-on { background: rgba(232, 119, 46, .12); }
html[data-theme="light"] .comment-form--inline { background: #fffdf9; }
@media (max-width: 600px) {
  .comment-form--inline, .comment-form--inline.comment-form--deep { margin-left: 0; padding: 10px; }
  .comment-more { margin-left: 36px; }
  .cm-bar { align-items: stretch; }
  .cm-as { width: 100%; box-sizing: border-box; }
  .cm-as__opt { flex: 1 1 0; justify-content: center; padding: 4px 8px; }
  .cm-bar__btns { width: 100%; justify-content: flex-end; }
}
@media (prefers-reduced-motion: reduce) { .comment-form--inline { animation: none; } }
/* == end comments-reply == */

/* == настройка шапки == */
.topnav .nav-extras { display: contents; }
.topnav .nav-grana, .topnav .nav-radio { margin: 0 2px; }
.topnav [data-tb-off] { display: none !important; }
.nav-radio:has(.radio-disc.is-playing) .nav-radio__x { display: none; }
.tb-pen { order: -10; flex: none; display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 34px; padding: 0; border: 0; border-radius: 8px; background: none; color: var(--mg-muted, #a99a84); opacity: .5; cursor: pointer; transition: opacity .15s, color .15s, background .15s; }
.tb-pen:hover, .tb-pen:focus-visible { opacity: 1; color: #f28a2d; background: rgba(242, 138, 45, .1); }
.tb-pen:focus-visible { outline: 2px solid rgba(242, 138, 45, .6); outline-offset: 1px; }
.tb-dm { color: var(--mg-copy); text-decoration: none; }
.tb-dm .soc-badge { position: absolute; top: 3px; right: 2px; margin: 0; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px; background: #e8472e; color: #fff; font: 700 10px/16px var(--body); text-align: center; }
.tb-dm .soc-badge[hidden] { display: none; }
html.tb-no-gifts .bal-chip__cur--gift { display: none !important; }
.tb-cfg__extra { flex: none; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--mg-hairline, rgba(212, 161, 75, .14)); }
.tb-cfg .side-cfg__ic img { width: 20px; height: 20px; object-fit: contain; }
.tb-cfg .side-cfg__name > .tb-cfg__t { display: grid; gap: 1px; white-space: normal; line-height: 1.25; }
.tb-cfg .tb-cfg__t small { margin: 0; font-size: 11.5px; color: var(--mg-muted); }
.tb-toast { position: fixed; z-index: 2200; left: 50%; bottom: max(20px, env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); display: flex; align-items: center; gap: 12px; width: max-content; max-width: calc(100vw - 24px); padding: 10px 10px 10px 16px; border: 1px solid rgba(232, 119, 46, .45); border-radius: 14px; background: #17120d; color: #f3e9da; box-shadow: 0 14px 40px rgba(0, 0, 0, .5); font-size: 14px; line-height: 1.35; animation: tbToastIn .22s ease-out; }
.tb-toast[hidden] { display: none; }
.tb-toast__act { flex: none; height: 34px; padding: 0 14px; border: 0; border-radius: 10px; background: #e8772e; color: #fff; font: 700 13px/1 var(--body); cursor: pointer; }
.tb-toast__act:hover { background: #f08a45; }
@keyframes tbToastIn { from { opacity: 0; transform: translate(-50%, 8px); } to { opacity: 1; transform: translateX(-50%); } }
html[data-theme="light"] .tb-toast { background: #fffaf2; color: #1f1910; border-color: rgba(176, 112, 40, .35); box-shadow: 0 14px 40px rgba(60, 40, 10, .18); }
@media (min-width: 721px) {
  #plat-balance.bal-chip { gap: 0; }
  #plat-balance .bal-chip__cur + .bal-chip__cur { margin-left: 9px; }
  #plat-balance .bal-chip__cur:not(:first-child):not(.bal-chip__cur--gift) { max-width: 0; margin-left: 0; padding-left: 0; border-left-width: 0; opacity: 0; overflow: hidden; white-space: nowrap; transition: max-width .28s ease, opacity .2s ease, margin .28s ease, padding .28s ease; }
  #plat-balance:is(:hover, :focus-visible) .bal-chip__cur:not(:first-child):not(.bal-chip__cur--gift) { max-width: 150px; margin-left: 9px; padding-left: 9px; border-left-width: 1px; opacity: 1; }
}
@media (max-width: 860px) {
  .topnav .nav-grana[data-tb-ph] { display: inline-flex; height: 40px; padding: 0; margin: 0; border: 0; background: none; }
  .topnav .nav-grana[data-tb-ph] img { width: 36px; height: 36px; }
}
@media (max-width: 480px) {
  .topnav [data-tb-item]:not([data-tb-ph]) { display: none !important; }
  .topnav .nav-radio { margin: 0; }
  .tb-pen { width: 20px; height: 32px; margin: 0 -1px; }
  .tb-toast { bottom: calc(78px + env(safe-area-inset-bottom, 0px)); }
}
html.no-anim #plat-balance .bal-chip__cur, html.no-anim .tb-toast { transition: none; animation: none; }
@media (prefers-reduced-motion: reduce) { #plat-balance .bal-chip__cur, .tb-toast { transition: none; animation: none; } }
/* == end настройка шапки == */

/* == ссылки-приглашения == */
.inv-bar { display: flex; align-items: center; gap: 12px; width: calc(100% - 16px); margin: 8px 8px 2px; padding: 10px 12px; border: 1px solid rgba(212,161,75,.28); border-radius: 12px; background: linear-gradient(135deg, rgba(242,138,45,.12), rgba(212,161,75,.04)); color: var(--mg-hi); text-align: left; cursor: pointer; }
.inv-bar:hover { border-color: rgba(242,138,45,.55); }
.inv-bar > i { display: grid; flex: 0 0 34px; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: rgba(242,138,45,.16); color: var(--mg-amber, #f28a2d); }
.inv-bar > i svg { width: 18px; height: 18px; }
.inv-bar span { display: grid; gap: 2px; min-width: 0; }
.inv-bar b { font-weight: 600; font-size: 14.5px; }
.inv-bar em { font-style: normal; font-size: 12.5px; line-height: 1.35; color: var(--mg-muted); }
.inv-dlg__lead { margin: 0 0 12px; color: var(--mg-copy); font-size: 14px; line-height: 1.5; }
.inv-msg { padding: 12px 14px; border: 1px dashed rgba(212,161,75,.35); border-radius: 12px; background: rgba(7,7,6,.45); color: var(--mg-ivory); font-size: 14.5px; line-height: 1.5; overflow-wrap: anywhere; }
.inv-url { width: 100%; padding: 11px 12px; border: 1px solid var(--mg-border); border-radius: 10px; background: rgba(7,7,6,.6); color: var(--mg-ivory); font-size: 15px; }
.inv-dlg__acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.inv-check { display: flex; align-items: flex-start; gap: 10px; margin-top: 16px; padding: 12px; border-radius: 12px; background: rgba(212,161,75,.06); cursor: pointer; }
.inv-check input { flex: 0 0 auto; width: 18px; height: 18px; margin-top: 2px; accent-color: var(--mg-amber, #f28a2d); }
.inv-check span { display: grid; gap: 3px; }
.inv-check b { font-weight: 600; font-size: 14px; color: var(--mg-hi); }
.inv-check em { font-style: normal; font-size: 12.5px; line-height: 1.4; color: var(--mg-muted); }
.inv-reqbtn { display: block; width: 100%; margin-top: 10px; padding: 10px 12px; border: 1px solid rgba(242,138,45,.45); border-radius: 10px; background: rgba(242,138,45,.1); color: var(--mg-hi); font-weight: 600; text-align: left; cursor: pointer; }
.inv-reqbar { display: block; width: 100%; border-left: 0; border-right: 0; border-top: 0; color: var(--mg-hi); font-weight: 600; text-align: left; cursor: pointer; }
.inv-reqs { display: grid; gap: 4px; max-height: 50vh; overflow-y: auto; }
.inv-req { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 8px; padding: 6px 4px; }
.inv-req a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--mg-hi); }
.inv-req .inv-av { width: 34px; height: 34px; font-size: 13px; }
.inv-gmrow { display: flex; align-items: center; gap: 6px; }
.inv-gmrow .soc-gmember { flex: 1; min-width: 0; }
.inv-kick { flex: 0 0 auto; padding: 5px 10px; border: 1px solid var(--mg-border); border-radius: 8px; background: none; color: var(--mg-muted); font-size: 12.5px; cursor: pointer; }
.inv-kick:hover { border-color: #c4553b; color: #e8806a; }
.inv-av { display: inline-grid; place-items: center; overflow: hidden; width: 88px; height: 88px; border-radius: 50%; background: linear-gradient(140deg, #f28a2d, #8a4d17); color: #fff6e8; font: 700 30px/1 var(--display); letter-spacing: .02em; flex: 0 0 auto; }
.inv-av img { width: 100%; height: 100%; object-fit: cover; }
.inv-page { display: grid; justify-items: center; align-content: start; padding: 8px 0 32px; }
@media (min-width: 761px) { .inv-page { align-content: center; min-height: calc(100dvh - 260px); padding: 24px 16px 40px; } }
.inv-card { width: min(440px, 100%); padding: 32px 24px 24px; border: 1px solid rgba(212,161,75,.26); border-radius: 22px; background: radial-gradient(120% 80% at 50% 0%, rgba(242,138,45,.16), transparent 60%), rgba(18,16,13,.9); box-shadow: 0 30px 70px rgba(0,0,0,.45); text-align: center; }
.inv-card h1 { margin: 4px 0 6px; font: 700 26px/1.15 var(--display); color: var(--mg-hi); overflow-wrap: anywhere; }
.inv-kicker { margin: 16px 0 0; font: 700 12px/1 var(--display); letter-spacing: .12em; text-transform: uppercase; color: var(--mg-gold, #d4a14b); }
.inv-sub { margin: 0 auto; max-width: 340px; color: var(--mg-copy); font-size: 15px; line-height: 1.5; }
.inv-acts { display: grid; gap: 8px; margin-top: 20px; }
.inv-acts .btn { width: 100%; justify-content: center; min-height: 46px; font-size: 16px; }
.inv-state { margin: 20px 0 0; padding: 12px 14px; border-radius: 12px; background: rgba(255,255,255,.05); color: var(--mg-copy); font-size: 14.5px; line-height: 1.45; }
.inv-state--ok { background: rgba(80,170,110,.12); color: var(--mg-hi); }
.inv-note { margin: 10px 0 0; color: var(--mg-muted); font-size: 13px; }
.inv-wait { margin: 20px 0; color: var(--mg-copy); }
.inv-foot { margin: 22px 0 0; padding-top: 14px; border-top: 1px solid rgba(212,161,75,.14); color: var(--mg-muted); font-size: 13px; }
@media (max-width: 520px) {
  .inv-dlg__acts .btn { flex: 1 1 auto; justify-content: center; }
  .inv-card { padding: 26px 18px 20px; }
}
html[data-theme="light"] .inv-card { background: radial-gradient(120% 80% at 50% 0%, rgba(242,138,45,.14), transparent 60%), #fffaf2; }
html[data-theme="light"] .inv-msg, html[data-theme="light"] .inv-url { background: #fff; }
/* == end ссылки-приглашения == */

/* == экскурсия по сайту == */
.tour-catch { position: fixed; inset: 0; z-index: 13000; background: transparent; cursor: default; }
.tour-dim { position: fixed; top: 0; left: 0; z-index: 13000; pointer-events: none; background: rgba(5, 4, 3, .66); transition: transform .32s ease, width .32s ease, height .32s ease; }
.tour-hole { position: fixed; z-index: 13001; pointer-events: none; border-radius: 10px; box-shadow: 0 0 0 2px #f28a2d, 0 0 0 6px rgba(242, 138, 45, .25); transition: top .32s ease, left .32s ease, width .32s ease, height .32s ease; }
.tour-hole.is-empty { box-shadow: none; }
.tour-tip { position: fixed; top: 0; left: 0; z-index: 13002; box-sizing: border-box; padding: 14px 16px 12px; border: 1px solid rgba(242, 138, 45, .5); border-radius: 16px; background: var(--mg-card, #17130f); color: var(--mg-hi, #f6e6c5); box-shadow: 0 22px 60px rgba(0, 0, 0, .55); transition: transform .32s ease; font-family: var(--body, inherit); }
.tour-tip.is-nudge { animation: tour-nudge .32s ease; }
@keyframes tour-nudge { 30% { box-shadow: 0 0 0 4px rgba(242, 138, 45, .45), 0 22px 60px rgba(0, 0, 0, .55); } }
.tour-tip__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 4px; }
.tour-tip__count { font: 600 11px/1 var(--mono, monospace); letter-spacing: .1em; text-transform: uppercase; color: var(--mg-amber, #f28a2d); }
.tour-tip__x { display: grid; place-items: center; width: 28px; height: 28px; margin: -4px -6px 0 0; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--mg-muted, #a9998a); cursor: pointer; }
.tour-tip__x:hover { background: rgba(255, 255, 255, .07); color: var(--mg-hi, #fff); }
.tour-tip__title { margin: 0 0 6px; font: 700 17px/1.2 var(--display, inherit); color: var(--mg-hi, #fff); }
.tour-tip__text { margin: 0; font-size: 14.5px; line-height: 1.45; color: var(--mg-copy, #e2d5c3); }
.tour-tip__acts { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; }
.tour-tip__nav { display: flex; gap: 8px; }
.tour-tip__end { padding: 6px 2px; border: 0; background: transparent; color: var(--mg-muted, #a9998a); font: inherit; font-size: 13px; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.tour-tip__end:hover { color: var(--mg-hi, #fff); }
.tour-tip__back:disabled { opacity: .4; cursor: default; }
.tour-btn { display: inline-flex; align-items: center; gap: 5px; margin-left: 10px; padding: 4px 10px 4px 8px; vertical-align: middle; border: 1px solid var(--mg-border, rgba(255, 255, 255, .14)); border-radius: 999px; background: transparent; color: var(--mg-muted, #a9998a); font: 600 12px/1.2 var(--body, inherit); letter-spacing: normal; text-transform: none; white-space: nowrap; cursor: pointer; transition: color .15s, border-color .15s, background .15s; }
.tour-btn:hover, .tour-btn:focus-visible { color: var(--mg-amber, #f28a2d); border-color: rgba(242, 138, 45, .55); background: rgba(242, 138, 45, .08); }
.tour-btn svg { flex: none; }
@media (max-width: 600px) {
  .tour-btn { padding: 5px; margin-left: 8px; }
  .tour-btn span { display: none; }
}
.tour-offer { position: fixed; right: 20px; bottom: 20px; z-index: 1040; display: flex; gap: 12px; width: min(360px, calc(100vw - 24px)); box-sizing: border-box; padding: 14px; border: 1px solid rgba(242, 138, 45, .5); border-radius: 16px; background: var(--mg-card, #17130f); color: var(--mg-hi, #f6e6c5); box-shadow: 0 20px 50px rgba(0, 0, 0, .5); opacity: 0; transform: translateY(10px); transition: opacity .25s ease, transform .25s ease; }
.tour-offer.is-in { opacity: 1; transform: none; }
.tour-offer__ic { flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: rgba(242, 138, 45, .14); color: var(--mg-amber, #f28a2d); }
.tour-offer__ic svg { width: 22px; height: 22px; }
.tour-offer__body { display: grid; gap: 4px; min-width: 0; }
.tour-offer__body b { font: 700 16px/1.2 var(--display, inherit); }
.tour-offer__body > span { font-size: 13.5px; line-height: 1.4; color: var(--mg-copy, #e2d5c3); }
.tour-offer__acts { display: flex; gap: 8px; margin-top: 6px; }
@media (max-width: 720px) {
  .tour-offer { left: 12px; right: 12px; width: auto; bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }
}
.gd-intro { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 18px; }
.gd-intro p { flex: 1 1 320px; margin: 0; color: var(--mg-copy, #e2d5c3); line-height: 1.5; }
.gd-intro .btn svg, .gd-card__tour svg { vertical-align: -3px; }
.gd-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.gd-card { display: flex; flex-direction: column; gap: 8px; padding: 14px; border: 1px solid var(--mg-border, rgba(255, 255, 255, .12)); border-radius: 16px; background: linear-gradient(160deg, rgba(242, 138, 45, .07), rgba(255, 255, 255, .015) 55%); }
.gd-card__head { display: flex; align-items: center; gap: 10px; }
.gd-card__ic { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 12px; background: rgba(242, 138, 45, .12); font-size: 19px; line-height: 1; }
.gd-card h2 { margin: 0; font: 700 16px/1.2 var(--display, inherit); color: var(--mg-hi, #fff); }
.gd-card__why { flex: 1; margin: 0; font-size: 14px; line-height: 1.45; color: var(--mg-copy, #e2d5c3); }
.gd-card__acts { display: flex; gap: 8px; flex-wrap: wrap; }
.gd-sub { margin: 26px 0 12px; font: 700 1.2rem/1.2 var(--display, inherit); color: var(--mg-hi, #fff); }
.gd-flow { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr); align-items: stretch; gap: 10px; }
.gd-flow__box { display: grid; align-content: start; gap: 6px; padding: 14px; border: 1px solid var(--mg-border, rgba(255, 255, 255, .12)); border-radius: 14px; background: rgba(255, 255, 255, .02); }
.gd-flow__box b { font: 700 17px/1.2 var(--display, inherit); color: var(--mg-hi, #fff); }
.gd-flow__box span { font-size: 13.5px; line-height: 1.45; color: var(--mg-copy, #e2d5c3); }
.gd-flow__box--d { border-color: rgba(126, 240, 255, .35); }
.gd-flow__box--r { border-color: rgba(242, 138, 45, .45); }
.gd-flow__box--rub { border-color: rgba(76, 201, 140, .45); }
.gd-flow__arrow { display: grid; place-items: center; align-content: center; gap: 2px; min-width: 96px; text-align: center; }
.gd-flow__arrow span { font-size: 12px; line-height: 1.3; color: var(--mg-amber, #f28a2d); }
.gd-flow__arrow i { font-style: normal; font-size: 22px; color: var(--mg-muted, #a9998a); }
.gd-money__note { margin: 10px 0 0; font-size: 13px; line-height: 1.5; }
.gd-money__note a { color: var(--mg-amber); text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.gd-faq { display: grid; gap: 8px; margin-bottom: 8px; }
.gd-faq .gd-sub { margin-bottom: 4px; }
.gd-faq__it { display: grid; gap: 3px; padding: 10px 14px; border-left: 3px solid rgba(242, 138, 45, .6); border-radius: 0 12px 12px 0; background: rgba(255, 255, 255, .025); }
.gd-faq__it b { color: var(--mg-hi, #fff); font-size: 14.5px; }
.gd-faq__it span { color: var(--mg-copy, #e2d5c3); font-size: 14px; line-height: 1.45; }
@media (max-width: 760px) {
  .gd-flow { grid-template-columns: minmax(0, 1fr); }
  .gd-flow__arrow { min-width: 0; grid-auto-flow: column; justify-content: center; gap: 8px; }
  .gd-flow__arrow i { transform: rotate(90deg); }
}
html[data-theme="light"] .tour-tip, html[data-theme="light"] .tour-offer { background: #fffaf3; color: #2b1d12; }
html[data-theme="light"] .tour-tip__title, html[data-theme="light"] .tour-offer__body b, html[data-theme="light"] .gd-card h2, html[data-theme="light"] .gd-flow__box b, html[data-theme="light"] .gd-sub, html[data-theme="light"] .gd-faq__it b { color: #2b1d12; }
html[data-theme="light"] .tour-tip__text, html[data-theme="light"] .tour-offer__body > span, html[data-theme="light"] .gd-card__why, html[data-theme="light"] .gd-flow__box span, html[data-theme="light"] .gd-faq__it span, html[data-theme="light"] .gd-intro p { color: #4a3a2c; }
html[data-theme="light"] .gd-card { background: linear-gradient(160deg, rgba(242, 138, 45, .09), #fffaf3 55%); }
@media (prefers-reduced-motion: reduce) { .tour-dim, .tour-hole, .tour-tip, .tour-offer { transition: none; } .tour-tip.is-nudge { animation: none; } }
/* == end экскурсия по сайту == */

/* == applink menu == */
.in-android-app a[href] { -webkit-user-drag: none; }
.applink-menu { position: fixed; inset: 0; z-index: 3000; display: flex; align-items: flex-end; justify-content: center; padding: 12px; background: rgba(10, 8, 6, .45); }
.applink-menu__box { width: min(420px, 100%); display: grid; gap: 8px; padding: 14px; border-radius: 18px; background: var(--mg-surface, #fffaf2); color: var(--mg-text, #1d1712); box-shadow: 0 18px 40px rgba(0, 0, 0, .3); margin-bottom: env(safe-area-inset-bottom, 0); }
.applink-menu__url { font-size: 13px; line-height: 1.35; color: var(--mg-muted, #7a6c5c); word-break: break-all; padding: 2px 4px 6px; max-height: 4.2em; overflow: hidden; }
.applink-menu__btn { min-height: 48px; border: 1px solid var(--mg-border, rgba(140, 100, 60, .25)); border-radius: 14px; background: transparent; color: inherit; font: 600 16px/1.2 var(--body, system-ui); cursor: pointer; }
.applink-menu__btn:first-of-type { background: linear-gradient(135deg, #f28a2d, #e0611e); color: #fff; border-color: transparent; }
.applink-menu__btn--x { color: var(--mg-muted, #7a6c5c); }
/* == end applink menu == */

/* == караоке смена строк == */
.mus-kara__stage.is-shift .mus-kara__line.is-now { animation: kara-in-now .28s ease-out; }
.mus-kara__stage.is-shift .mus-kara__line.is-next, .mus-kara__stage.is-shift .mus-kara__line.is-later, .mus-kara__stage.is-shift .mus-kara__wait { animation: kara-in-next .28s ease-out; }
@keyframes kara-in-now { from { opacity: .6; transform: translateY(.45em) scale(.92); } }
@keyframes kara-in-next { from { opacity: 0; transform: translateY(.6em); } }
@media (prefers-reduced-motion: reduce) { .mus-kara__stage.is-shift .mus-kara__line, .mus-kara__stage.is-shift .mus-kara__wait { animation: none; } }
/* == end караоке смена строк == */

/* == кнопки звонка: камера, динамик, экран == */
.gc-btn.is-busy svg { opacity: .5; }
.gc-btn span { white-space: nowrap; }
body.gc-open .toast { z-index: 1650; bottom: calc(118px + env(safe-area-inset-bottom, 0px)); text-align: center; }
.gc.is-duo .gc-grid.n2 .gc-tile:not(.is-self) .gc-tile__net { top: auto; left: 16px; bottom: calc(154px + env(safe-area-inset-bottom, 0px)); }
.gc.is-duo .gc-grid.n2 .gc-tile.is-self .gc-tile__net { top: 6px; left: 6px; max-width: calc(100% - 12px); padding: 3px 8px; font-size: 11px; line-height: 1.25; white-space: normal; }
@media (max-width: 720px) {
  .gc-ctrl { gap: 12px 0; }
  .gc-ctrl .gc-btn { flex: 0 0 25%; min-width: 0; }
  .gc-ctrl .gc-btn svg { width: 54px; height: 54px; padding: 15px; }
  .gc-ctrl .gc-btn span { font-size: 12px; }
  .gc-top .gc-btn--ghost span { display: inline; }
  .gc-top .gc-btn--ghost { flex: none; padding: 8px 12px !important; }
  .gc.is-duo .gc-grid.n2 .gc-tile:not(.is-self) .gc-tile__name { bottom: calc(196px + env(safe-area-inset-bottom, 0px)); }
  body.gc-open .toast { bottom: calc(206px + env(safe-area-inset-bottom, 0px)); }
  .gc.is-duo .gc-grid.n2 .gc-tile:not(.is-self) .gc-tile__net { bottom: calc(232px + env(safe-area-inset-bottom, 0px)); }
}
@media (max-width: 420px) {
  .gc-top [data-gc="devices"] span { display: none; }
  .gc-top [data-gc="devices"] { padding: 9px !important; }
}
/* == end кнопки звонка: камера, динамик, экран == */
/* == narrow topbar == */
@media (max-width: 385px) {
  .topnav__actions [data-tb-phn="2"] { display: none !important; }
}
@media (max-width: 350px) {
  .topnav__actions [data-tb-phn="1"] { display: none !important; }
}
/* == end narrow topbar == */

/* == dmspeed == переписка на телефоне: поле растёт без замеров, ранние сообщения по кнопке, отправляемое — сразу */
@supports (field-sizing: content) {
  .soc-chat__form textarea[data-sdm] { field-sizing: content; height: auto; overflow-y: auto; }
}
.soc-chat__more { display: block; margin: 4px auto 10px; padding: 7px 14px; border: 1px solid var(--mg-border); border-radius: 999px; background: rgba(16, 14, 11, .7); color: var(--mg-muted); font: inherit; font-size: 13px; cursor: pointer; }
.soc-chat__more:hover { color: var(--mg-hi); border-color: var(--mg-amber); }
.soc-msg.is-pending .soc-msg__bubble { opacity: .72; }
.soc-msg.is-pending .soc-msg__acts, .soc-msg.is-pending .chx-more { visibility: hidden; }
/* размытие под шапкой и нижним меню на телефоне перерисовывается на каждый кадр прокрутки и клавиатуры, а фон там почти непрозрачный */
@media (pointer: coarse) {
  .topnav, .bottom-nav, .app-messenger .msn-nav { -webkit-backdrop-filter: none; backdrop-filter: none; }
}
/* == end dmspeed == */

/* == studio-comments == */
/* Студия: «Комментарии» и пункт «Ещё» для настроек канала */
.studio-more { margin-top: 4px; min-width: 0; }
.studio-more > summary { list-style: none; cursor: pointer; justify-content: flex-start; }
.studio-more > summary::-webkit-details-marker { display: none; }
.studio-more > summary::after { content: ""; width: 7px; height: 7px; margin-left: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform .2s var(--ease); flex: 0 0 auto; }
.studio-more[open] > summary::after { transform: rotate(-135deg) translateY(-1px); }
.studio-more > summary.is-on { color: var(--mg-hi); box-shadow: inset 0 0 0 1px rgba(242, 160, 45, .55); }
.studio-more__hint { margin-left: auto; font: 400 11px/1.2 var(--body); letter-spacing: 0; text-transform: none; color: var(--mg-muted); overflow: hidden; text-overflow: ellipsis; }
.studio-more__list { display: grid; gap: 4px; padding: 6px 0 2px; }
.studio-more__item { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; padding: 8px 12px; border: 1px solid var(--mg-border); border-radius: 12px; background: transparent; color: var(--mg-copy); font: inherit; text-align: left; cursor: pointer; transition: border-color .2s var(--ease), background .2s var(--ease); }
.studio-more__item b { font: 600 13px/1.25 var(--body); color: var(--mg-hi); }
.studio-more__item span { font-size: 12px; line-height: 1.3; color: var(--mg-muted); }
.studio-more__item:hover { border-color: rgba(242, 160, 45, .55); }
.studio-more__item.is-active { border-color: rgba(242, 160, 45, .8); background: rgba(242, 160, 45, .14); }
.side-link__badge[hidden] { display: none; }
body.side-collapsed .studio-nav .side-link > .side-link__badge:not([hidden]) { display: inline-block; }
.scm-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.scm-tabs { margin-bottom: 12px; }
.scm-err { margin: 0 0 10px; color: #e2785f; font-size: 13px; }
.scm-list { display: grid; gap: 10px; min-width: 0; }
.scm-item { min-width: 0; padding: 12px 14px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(255, 255, 255, .03); }
.scm-item.is-new { border-color: rgba(242, 138, 45, .65); box-shadow: inset 3px 0 0 #f28a2d; }
.scm-item__to { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; min-width: 0; margin-bottom: 10px; color: var(--mg-hi); font-size: 13px; text-decoration: none; }
.scm-item__to b { overflow-wrap: anywhere; }
.scm-item__to:hover b { text-decoration: underline; }
.scm-item__kind { padding: 3px 7px; border-radius: 6px; background: rgba(242, 160, 45, .16); color: var(--mg-amber-lite, #f2b22d); font: 600 10px/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.scm-item__ch { color: var(--mg-muted); font-size: 12px; }
.scm-item__head { display: flex; align-items: center; gap: 10px; min-width: 0; }
.scm-item__who { display: flex; flex: 1 1 auto; flex-direction: column; min-width: 0; }
.scm-item__who b { overflow: hidden; color: var(--mg-hi); font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.scm-item__who span { color: var(--mg-muted); font-size: 12px; }
.scm-item__marks { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.scm-mark { padding: 2px 8px; border: 1px solid var(--mg-border); border-radius: 999px; color: var(--mg-muted); font-size: 11px; white-space: nowrap; }
.scm-mark--new { border-color: #c8402a; background: #c8402a; color: #fff; }
.scm-mark--ok { border-color: rgba(92, 170, 96, .5); color: #5caa60; }
.scm-item__text { margin: 8px 0 0; color: var(--mg-copy); line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.scm-item__reply { margin: 8px 0 0; padding: 4px 10px; border-left: 2px solid rgba(92, 170, 96, .6); color: var(--mg-muted); font-size: 13px; overflow-wrap: anywhere; }
.scm-item__reply span { color: #5caa60; }
.scm-item__acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.scm-form { margin-top: 10px; }
.mstat--new { padding: 2px 9px; border: 0; border-radius: 999px; background: #c8402a; color: #fff; font: 600 12px/1.4 var(--body); cursor: pointer; }
.mus-st__stats { margin: 0 0 6px; padding: 0 6px; }
@media (max-width: 860px) {
  .studio-nav { flex-wrap: wrap; overflow: visible; }
  .studio-more { flex: 1 1 100%; margin-top: 0; }
  .studio-more > summary { justify-content: center; }
  .studio-more > summary .studio-more__hint { margin-left: 8px; }
  .studio-more__list { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
}
@media (max-width: 640px) {
  .scm-item { padding: 12px; }
  .scm-item__head { flex-wrap: wrap; }
  .scm-item__marks { width: 100%; justify-content: flex-start; }
}
/* == end studio-comments == */
/* == i18n == */
html.i18n-wait #app, html.i18n-wait .topnav { visibility: hidden; }
.i18n-fx { display: inline-block; margin-left: .3em; font-size: .78em; font-weight: 500; opacity: .72; white-space: nowrap; letter-spacing: 0; vertical-align: baseline; }
.i18n-fx-note { margin: 18px auto 8px; max-width: 760px; padding: 0 16px; font-size: 12.5px; line-height: 1.45; opacity: .62; text-align: center; }
.i18n-set .setting { flex-wrap: wrap; gap: 10px 16px; }
.i18n-set .setting > div:first-child { flex: 1 1 260px; min-width: 0; }
.i18n-seg { display: flex; flex-wrap: wrap; gap: 6px; }
.i18n-seg__b { min-height: 36px; padding: 6px 12px; border-radius: 999px; border: 1px solid rgba(246,230,197,.22); background: transparent; color: inherit; font: inherit; font-size: 14px; cursor: pointer; }
.i18n-seg__b.is-on { background: #f2a13a; border-color: #f2a13a; color: #1a1209; font-weight: 600; }
html[data-theme="light"] .i18n-seg__b { border-color: rgba(31,25,16,.22); }
.i18n-sheet { position: fixed; inset: 0; z-index: 2147483000; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(0,0,0,.6); }
.i18n-sheet__box { width: min(380px, 100%); max-height: calc(100dvh - 32px); overflow: auto; padding: 16px; border-radius: 18px; background: #16120d; color: #f6e6c5; border: 1px solid rgba(246,230,197,.14); box-shadow: 0 18px 50px rgba(0,0,0,.5); display: grid; gap: 8px; }
html[data-theme="light"] .i18n-sheet__box { background: #fffaf2; color: #1f1910; border-color: rgba(31,25,16,.12); }
.i18n-sheet__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 4px; font-size: 17px; }
.i18n-sheet__x { width: 36px; height: 36px; border: 0; border-radius: 50%; background: rgba(127,127,127,.16); color: inherit; font-size: 22px; line-height: 1; cursor: pointer; }
.i18n-sheet__opt { min-height: 46px; padding: 10px 14px; border-radius: 12px; border: 1px solid rgba(127,127,127,.25); background: transparent; color: inherit; font: inherit; font-size: 16px; text-align: left; cursor: pointer; }
.i18n-sheet__opt.is-on { border-color: #f2a13a; box-shadow: inset 0 0 0 1px #f2a13a; font-weight: 600; }
.i18n-sheet__fx { display: grid; gap: 6px; margin-top: 6px; font-size: 13px; opacity: .9; }
.i18n-offer { position: fixed; left: 50%; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); z-index: 2147482000; width: min(560px, calc(100% - 20px)); display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding: 12px 14px; border-radius: 16px; background: #1b1610; color: #f6e6c5; border: 1px solid rgba(242,161,58,.45); box-shadow: 0 14px 40px rgba(0,0,0,.45); }
html[data-theme="light"] .i18n-offer { background: #fffaf2; color: #1f1910; }
.i18n-offer__txt { flex: 1 1 240px; min-width: 0; display: grid; gap: 2px; font-size: 14px; line-height: 1.35; }
.i18n-offer__txt b { font-size: 15px; }
.i18n-offer__txt span { opacity: .72; font-size: 13px; }
.i18n-offer__acts { display: flex; gap: 8px; flex-wrap: wrap; }
@media (max-width: 899px) { .i18n-offer { bottom: calc(78px + env(safe-area-inset-bottom, 0px)); } }
html[lang="kk"] .btn, html[lang="ky"] .btn, html[lang="be"] .btn { overflow-wrap: break-word; }
/* == end i18n == */
/* == обучение по разделам == */
.tour-offer { padding-right: 36px; }
.tour-offer__acts { flex-wrap: wrap; align-items: center; }
.tour-offer__never { padding: 4px 2px; border: 0; background: none; color: var(--mg-muted, #a8987f); font: inherit; font-size: 12.5px; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.tour-offer__never:hover { color: var(--mg-hi, #f6e6c5); }
.tour-offer__x { position: absolute; top: 8px; right: 8px; display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 50%; background: none; color: var(--mg-muted, #a8987f); cursor: pointer; }
.tour-offer__x:hover { background: rgba(242, 138, 45, .14); color: var(--mg-hi, #f6e6c5); }
.tour-tip__next--chain { white-space: nowrap; }
.learn-set { margin: 0 0 18px; padding: 18px; border: 1px solid rgba(242, 138, 45, .45); border-radius: 16px; background: radial-gradient(120% 90% at 0 0, rgba(242, 138, 45, .12), transparent 60%), rgba(16, 14, 11, .85); scroll-margin-top: 80px; }
.learn-set__head { display: flex; gap: 12px; align-items: flex-start; }
.learn-set__ic { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: rgba(242, 138, 45, .16); color: var(--mg-amber, #f28a2d); }
.learn-set__ic svg { width: 22px; height: 22px; }
.learn-set__title { margin: 0; font: 700 21px/1.2 var(--display, inherit); color: var(--mg-ivory, #f6e6c5); }
.learn-set__lead { margin: 4px 0 0; font-size: 14px; line-height: 1.45; color: var(--mg-muted, #a8987f); }
.learn-set__auto { margin-top: 14px; }
.learn-set__acts { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; margin: 14px 0 12px; }
.learn-set__count { font-size: 13px; color: var(--mg-muted, #a8987f); }
.learn-set__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px; }
.learn-it { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-width: 0; padding: 9px 10px 9px 12px; border: 1px solid var(--mg-border, rgba(212, 161, 75, .2)); border-radius: 12px; background: rgba(10, 9, 8, .55); }
.learn-it__t { display: grid; gap: 1px; min-width: 0; }
.learn-it__t b { font-size: 14px; font-weight: 600; color: var(--mg-ivory, #f6e6c5); overflow-wrap: anywhere; }
.learn-it__t small { font-size: 12px; color: var(--mg-muted, #a8987f); }
.learn-it.is-done .learn-it__t small { color: #8fc27a; }
.learn-it .btn { flex: none; }
.learn-set__note { margin: 12px 0 0; font-size: 13px; color: var(--mg-muted, #a8987f); }
html[data-theme="light"] .learn-set { background: radial-gradient(120% 90% at 0 0, rgba(242, 138, 45, .14), transparent 60%), #fffaf3; }
html[data-theme="light"] .learn-set__title, html[data-theme="light"] .learn-it__t b { color: #2b1d12; }
html[data-theme="light"] .learn-it { background: #fff; }
.gc-preview .gc-grid { display: grid; place-items: center; }
.gc-preview__tile { width: min(320px, 80%); aspect-ratio: 4 / 3; gap: 10px; align-content: center; }
.gc-preview__ava { display: grid; place-items: center; width: 84px; height: 84px; border-radius: 50%; background: rgba(242, 138, 45, .18); color: var(--mg-amber, #f28a2d); font: 700 34px/1 var(--display, inherit); }
.gc-preview__tile b { color: var(--mg-ivory, #f6e6c5); font-size: 16px; }
@media (max-width: 640px) {
  .learn-set { padding: 14px; }
  .learn-set__list { grid-template-columns: 1fr; }
}
/* == end обучение по разделам == */

/* == granasvyaz-phone == */
.phn-set { margin: 0 0 16px; }
.phn-set .setting { flex-wrap: wrap; }
.phn-set .setting > div:first-child { flex: 1 1 240px; min-width: 0; }
.phn-desc { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; line-height: 1.45; }
.phn-num { color: var(--mg-ivory, #f6e6c5); font-weight: 700; font-size: 15px; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
.phn-ok { display: inline-flex; align-items: center; gap: 4px; color: #8fc27a; font-size: 13px; }
.phn-acts { display: flex; flex-wrap: wrap; gap: 8px; }
.phn-acts .btn svg, .phn-find__t svg { flex: none; }
.phn-acts .btn { display: inline-flex; align-items: center; gap: 6px; }
.phn-soon { margin-top: 10px; padding: 8px 12px; border-radius: 10px; background: rgba(242, 138, 45, .12); border: 1px solid rgba(242, 138, 45, .35); color: var(--mg-ivory, #f6e6c5); font-size: 13px; line-height: 1.4; }
.phn-soon--info { background: rgba(120, 170, 220, .1); border-color: rgba(120, 170, 220, .32); }
.phn-pend { border-color: rgba(242, 138, 45, .45); background: radial-gradient(120% 120% at 0 0, rgba(242, 138, 45, .14), transparent 60%), rgba(16, 14, 11, .85); }
.phn-sel { flex: 0 0 auto; min-width: 190px; max-width: 100%; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--mg-border); background: rgba(0, 0, 0, .35); color: var(--mg-ivory, #f6e6c5); font: inherit; font-size: 14px; }
.phn-find { margin: 0 0 18px; padding: 16px; border: 1px solid var(--mg-border); border-radius: 14px; background: radial-gradient(110% 120% at 100% 0, rgba(242, 138, 45, .1), transparent 55%), rgba(16, 14, 11, .7); }
.phn-find--modal { margin: 0; padding: 0; border: 0; background: none; }
.phn-find__t { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-size: 16px; font-weight: 700; color: var(--mg-ivory, #f6e6c5); }
.phn-find__t svg { color: var(--mg-amber, #f28a2d); }
.phn-form { display: flex; gap: 8px; }
.phn-form input { flex: 1 1 auto; min-width: 0; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--mg-border); background: rgba(0, 0, 0, .35); color: var(--mg-ivory, #f6e6c5); font: inherit; font-size: 16px; font-variant-numeric: tabular-nums; }
.phn-form .btn { flex: none; }
.phn-note { margin: 8px 0 0; font-size: 13px; line-height: 1.45; }
.phn-note--err { color: #f0a08a; }
.phn-res:empty { display: none; }
.phn-res { margin-top: 6px; }
.phn-card { display: flex; align-items: center; gap: 12px; margin-top: 10px; padding: 10px 12px; border-radius: 12px; background: rgba(255, 255, 255, .04); border: 1px solid var(--mg-border); }
.phn-card__who { flex: 1 1 auto; min-width: 0; display: grid; gap: 2px; }
.phn-card__who a { color: var(--mg-ivory, #f6e6c5); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration: none; }
.phn-card__who span { color: var(--mg-muted); font-size: 12.5px; }
.phn-card__acts { display: flex; gap: 6px; flex: none; }
.phn-ct { margin-top: 14px; border-top: 1px solid rgba(212, 161, 75, .14); padding-top: 12px; }
.phn-ct summary { cursor: pointer; color: var(--mg-amber, #f28a2d); font-weight: 600; font-size: 14px; list-style-position: inside; }
.phn-ctform { margin-top: 10px; }
.phn-ctform textarea { width: 100%; box-sizing: border-box; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--mg-border); background: rgba(0, 0, 0, .35); color: var(--mg-ivory, #f6e6c5); font: inherit; font-size: 15px; resize: vertical; }
.phn-ctform__row { display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px; }
.inv-bar + .phn-bar { margin-top: 4px; }
.soc-dlist__tools { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; align-items: stretch; margin: 10px 12px 6px; padding: 0; }
.soc-dlist__tools .inv-bar--mini { display: flex; align-items: center; justify-content: flex-start; width: 100%; min-width: 0; min-height: 40px; margin: 0; padding: 8px 10px; gap: 8px; border-radius: 10px; box-sizing: border-box; }
.soc-dlist__tools .inv-bar--mini > i { flex: 0 0 24px; width: 24px; height: 24px; border-radius: 7px; }
.soc-dlist__tools .inv-bar--mini > i svg { width: 14px; height: 14px; }
.soc-dlist__tools .inv-bar--mini b { overflow: hidden; font-size: 13px; font-weight: 650; line-height: 1.2; white-space: nowrap; text-overflow: ellipsis; }
.soc-dlist__head { gap: 8px; }
@media (max-width: 800px) {
  .soc-dlist__head { flex-wrap: wrap; align-items: flex-start; }
  .soc-dlist__head h1 { flex: 1 1 100%; white-space: normal; }
  .soc-dlist__head .btn, .soc-dlist__head a.btn { flex: 1 1 auto; }
}
.soc-dlist__acts .inv-bar--mini { flex: 1 1 0; width: auto; min-width: 0; margin: 0; padding: 6px 10px; gap: 8px; border-radius: 10px; justify-content: center; }
.soc-dlist__acts .inv-bar + .phn-bar { margin-top: 0; }
.soc-dlist__acts .inv-bar--mini > i { flex: 0 0 24px; width: 24px; height: 24px; border-radius: 7px; }
.soc-dlist__acts .inv-bar--mini > i svg { width: 14px; height: 14px; }
.soc-dlist__acts .inv-bar--mini b { overflow: hidden; font-size: 13px; white-space: nowrap; text-overflow: ellipsis; }
.phn-dlg { width: min(520px, calc(100vw - 24px)); }
.soc-dlist__pin { display: grid; place-items: center; color: var(--mg-muted); }
@media (max-width: 640px) {
  .phn-set .setting { padding: 12px 14px; }
  .phn-sel { width: 100%; min-width: 0; }
  .phn-acts { width: 100%; }
  .phn-acts .btn { flex: 1 1 auto; justify-content: center; }
  .phn-card { flex-wrap: wrap; }
  .phn-card__who { flex: 1 1 120px; }
  .phn-card__acts { margin-left: auto; }
}
html[data-theme="light"] .phn-find, html[data-theme="light"] .phn-pend { background: #fffaf3; }
html[data-theme="light"] .phn-ok { color: #3f7d2c; }
html[data-theme="light"] .phn-num, html[data-theme="light"] .phn-find__t, html[data-theme="light"] .phn-card__who a, html[data-theme="light"] .phn-soon { color: #2b1d12; }
html[data-theme="light"] .phn-form input, html[data-theme="light"] .phn-ctform textarea, html[data-theme="light"] .phn-sel { background: #fff; color: #2b1d12; }
/* == end granasvyaz-phone == */
/* == top-places == */
.wpop__rank--none { opacity: .8; }
.wpop__rank--none small { opacity: 1; font-size: 11px; }
.wpop__goal { display: block; padding: 8px 10px; border-radius: 12px; background: rgba(255,215,114,.1); border: 1px solid rgba(255,215,114,.28); color: #ffd772; font-size: 13px; line-height: 1.35; text-decoration: none; }
.wpop__goal:hover { background: rgba(255,215,114,.18); }
html[data-theme="light"] .wpop__goal { background: rgba(196,120,20,.08); border-color: rgba(196,120,20,.3); color: #8a4f0c; }
.gift-place { display: flex; flex-direction: column; gap: 2px; margin: 8px 0 0; padding: 8px 12px; border-radius: 12px; background: rgba(255,215,114,.1); border: 1px solid rgba(255,215,114,.28); color: #ffd772; text-decoration: none; text-align: left; font-size: 13px; line-height: 1.35; }
.gift-place b { font-weight: 700; }
.gift-place small { color: inherit; opacity: .8; font-size: 12px; }
.gift-place:hover { background: rgba(255,215,114,.18); }
.giftbar > .gift-place { margin: 0; }
.gift-sent .gift-place, .gift-reveal__place .gift-place { align-items: center; text-align: center; margin: 4px auto 10px; max-width: 340px; }
.gift-reveal__place:empty { display: none; }
html[data-theme="light"] .gift-place { background: rgba(196,120,20,.08); border-color: rgba(196,120,20,.3); color: #8a4f0c; }
.gift-reveal__place .gift-place, html[data-theme="light"] .gift-reveal__place .gift-place { margin: 0 auto 8px; padding: 6px 10px; background: rgba(255,215,114,.12); border-color: rgba(255,215,114,.32); color: #ffd772; }
.gift-reveal__place .gift-place small { font-size: 11px; }
/* == end top-places == */

/* == skop-player-fix == */
.sk-video, .sk-slide.is-wide .sk-video { object-fit: contain; }
.sk-unmute { position: absolute; z-index: 3; top: 64px; left: 50%; display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border: 0; border-radius: 999px; background: #ff8a1f; color: #1a0f05; font: inherit; font-weight: 800; font-size: 15px; transform: translateX(-50%); box-shadow: 0 6px 20px rgba(0, 0, 0, .45); cursor: pointer; }
.sk-unmute[hidden] { display: none; }
.sk-unmute svg { width: 20px; height: 20px; }
@media (min-width: 761px) { .sk-unmute { top: 70px; } }
/* == end skop-player-fix == */

/* == status == */
:root { --st-ring: #f28a2d; }
.st-ring { position: relative; display: inline-grid; place-items: center; flex-shrink: 0; padding: 3px; border-radius: 50%; }
.st-ring::before { content: ""; position: absolute; inset: 0; border-radius: 50%; background: var(--st-ring); -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2.5px), #000 calc(100% - 2px)); mask: radial-gradient(farthest-side, transparent calc(100% - 2.5px), #000 calc(100% - 2px)); }
.st-ring.is-seg::before { background: var(--st-seg); }
.st-ring.is-new { --st-ring: #f28a2d; }
.st-ring.is-seen { --st-ring: rgba(246, 230, 197, .32); }
.st-ring .soc-av { box-shadow: 0 0 0 2px var(--mg-card, #12100d); }
.st-bar { display: flex; flex-shrink: 0; gap: 4px; overflow-x: auto; padding: 10px 8px 8px; border-bottom: 1px solid rgba(212,161,75,.14); scrollbar-width: none; overscroll-behavior-x: contain; }
.st-bar::-webkit-scrollbar { display: none; }
.st-bar__load { padding: 14px 8px; font-size: 13px; color: var(--mg-muted); }
.st-bar__it { display: grid; justify-items: center; align-content: start; gap: 5px; flex: 0 0 70px; width: 70px; padding: 2px 0; border: 0; background: none; color: var(--mg-copy, inherit); font: inherit; font-size: 12px; cursor: pointer; }
.st-bar__it > span:last-child { max-width: 66px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.st-bar__it:hover > span:last-child { color: var(--mg-hi); }
.st-bar__av { position: relative; display: inline-grid; place-items: center; }
.st-bar__it > .st-bar__av > .soc-av, .st-row--me .st-bar__av > .soc-av { margin: 3px; }
.st-plus { position: absolute; right: -1px; bottom: -1px; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #f28a2d; color: #1a0f05; border: 2px solid var(--mg-card, #12100d); cursor: pointer; }
.st-plus svg { width: 12px; height: 12px; }
.st-bar__more { display: grid; place-items: center; width: 58px; height: 58px; border: 1.5px dashed rgba(212,161,75,.4); border-radius: 50%; color: var(--mg-amber, #f28a2d); }
.st-bar__more svg { width: 24px; height: 24px; }
.st-tab { display: grid; gap: 2px; padding: 4px 0 12px; }
.st-me { display: flex; align-items: center; gap: 8px; padding-right: 8px; }
.st-me .st-row { flex: 1; min-width: 0; }
.st-me__acts { display: flex; gap: 8px; }
.st-row { display: flex; align-items: center; gap: 12px; width: 100%; padding: 8px 12px; border: 0; border-radius: 12px; background: none; color: inherit; font: inherit; text-align: left; text-decoration: none; cursor: pointer; }
.st-row:hover { background: rgba(212,161,75,.07); }
.st-row__body { display: grid; gap: 3px; min-width: 0; }
.st-row__body b { font-weight: 600; font-size: 15px; color: var(--mg-hi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.st-row__body span { font-size: 13px; color: var(--mg-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.st-h { margin: 14px 12px 4px; font: 700 12px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--mg-muted); }
.st-arch { display: grid; gap: 6px; margin: 8px 12px 12px; padding: 0; list-style: none; border-top: 1px solid rgba(212,161,75,.12); padding-top: 10px; }
.st-arch__it { display: grid; grid-template-columns: minmax(72px, auto) 1fr auto; gap: 8px 10px; align-items: center; padding: 8px 10px; border-radius: 10px; background: rgba(255,255,255,.04); font-size: 13px; color: var(--mg-muted); }
.st-arch__meta { font-size: 12px; color: var(--mg-muted); white-space: nowrap; }
.st-arch__txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; color: var(--mg-hi); }
.st-arch__views { font-size: 12px; white-space: nowrap; }
.st-empty { margin: 10px 12px; font-size: 14px; line-height: 1.5; color: var(--mg-muted); }
.st-round { display: grid; place-items: center; flex: 0 0 auto; width: 42px; height: 42px; border: 1px solid rgba(212,161,75,.3); border-radius: 50%; background: rgba(242,138,45,.1); color: var(--mg-hi); cursor: pointer; }
.st-round svg { width: 20px; height: 20px; }
.st-round:hover { border-color: rgba(242,138,45,.6); }
.st-round--cta { border-color: transparent; background: #f28a2d; color: #1a0f05; }
.st-round--glass { border-color: rgba(255,255,255,.25); background: rgba(0,0,0,.22); color: #fff; }
.st-priv-link { display: inline-flex; align-items: center; gap: 8px; margin: 2px 12px 4px; padding: 6px 0; border: 0; background: none; color: var(--mg-amber, #f28a2d); font: inherit; font-size: 13.5px; cursor: pointer; justify-self: start; }
.st-priv-link svg { width: 16px; height: 16px; }
.st-x { display: grid; place-items: center; flex: 0 0 auto; width: 40px; height: 40px; border: 0; border-radius: 50%; background: transparent; color: inherit; cursor: pointer; }
.st-x svg { width: 22px; height: 22px; }
.st-x:hover { background: rgba(255,255,255,.1); }
.st-x.is-ask { background: #c92a2a; color: #fff; }
.st-sheet { position: fixed; inset: 0; z-index: 1250; display: grid; place-items: center; padding: 16px; background: rgba(4,4,3,.7); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); animation: st-fade .16s ease-out; }
.st-sheet__card { display: flex; flex-direction: column; width: min(460px, 100%); max-height: min(720px, calc(100dvh - 32px)); border: 1px solid var(--mg-border); border-radius: 18px; background: var(--mg-card, #12100d); color: var(--mg-hi); box-shadow: 0 30px 80px rgba(0,0,0,.55); overflow: hidden; }
.st-sheet__head { display: flex; align-items: center; justify-content: space-between; padding: 12px 8px 8px 18px; border-bottom: 1px solid rgba(212,161,75,.14); }
.st-sheet__head h2 { font: 700 20px/1 var(--display); letter-spacing: .02em; text-transform: uppercase; color: var(--mg-hi); }
.st-sheet__body { overflow-y: auto; }
.st-menu { position: fixed; z-index: 1400; display: grid; min-width: 250px; padding: 6px; border: 1px solid var(--mg-border); border-radius: 14px; background: var(--mg-card, #17130f); box-shadow: 0 18px 50px rgba(0,0,0,.5); animation: st-fade .12s ease-out; }
.st-menu button { display: flex; align-items: center; gap: 12px; padding: 11px 12px; border: 0; border-radius: 10px; background: none; color: var(--mg-hi); font: inherit; font-size: 14.5px; text-align: left; cursor: pointer; }
.st-menu button:hover { background: rgba(242,138,45,.12); }
.st-menu svg { width: 20px; height: 20px; color: var(--mg-amber, #f28a2d); }
.st-new { position: fixed; inset: 0; z-index: 1450; display: flex; flex-direction: column; color: #fff; background: #0b0a09; transition: background .25s ease; }
.st-new__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: max(10px, env(safe-area-inset-top)) 12px 6px; }
.st-new__top .st-x { color: #fff; }
.st-new__tools { display: flex; gap: 10px; }
.st-new__ta { flex: 1; width: min(720px, 100%); margin: 0 auto; padding: max(24px, calc(50dvh - 150px)) 24px 24px; border: 0; outline: 0; background: none; color: #fff; font: 600 32px/1.3 system-ui, sans-serif; text-align: center; resize: none; caret-color: #fff; }
.st-new__ta::placeholder { color: rgba(255,255,255,.65); }
.st-f1, .st-f1 p { font-family: Georgia, "Times New Roman", serif !important; }
.st-f2, .st-f2 p { font-family: "Comic Sans MS", "Segoe Print", "Bradley Hand", cursive !important; font-style: italic; }
.st-new__bottom { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px max(14px, env(safe-area-inset-bottom)); }
.st-new__who { display: inline-flex; align-items: center; gap: 8px; min-width: 0; padding: 8px 12px; border-radius: 999px; background: rgba(0,0,0,.28); font-size: 13.5px; cursor: pointer; }
.st-new__who svg { flex: 0 0 auto; width: 16px; height: 16px; }
.st-new__who span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.st-new__who--media { position: absolute; top: max(14px, env(safe-area-inset-top)); left: 64px; }
.st-send { display: grid; place-items: center; flex: 0 0 auto; width: 52px; height: 52px; border: 0; border-radius: 50%; background: #f28a2d; color: #1a0f05; cursor: pointer; box-shadow: 0 6px 18px rgba(0,0,0,.35); }
.st-send svg { width: 22px; height: 22px; margin-left: 3px; }
.st-send:disabled { opacity: .55; cursor: default; }
.st-send.is-busy { animation: st-pulse 1s ease-in-out infinite; }
.st-new__media { flex: 1; display: grid; place-items: center; min-height: 0; padding: 0 8px; }
.st-new__media img, .st-new__media video { max-width: 100%; max-height: 100%; border-radius: 10px; object-fit: contain; }
.st-new__bottom--cap { background: linear-gradient(transparent, rgba(0,0,0,.6)); }
.st-new__cap { flex: 1; min-width: 0; padding: 13px 16px; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; background: rgba(20,18,16,.85); color: #fff; font: inherit; font-size: 15px; }
.st-dlg .st-opts { display: grid; gap: 6px; }
.st-opt { display: flex; align-items: flex-start; gap: 12px; padding: 10px 12px; border-radius: 12px; cursor: pointer; }
.st-opt:hover { background: rgba(212,161,75,.07); }
.st-opt input { width: 18px; height: 18px; margin-top: 2px; accent-color: #f28a2d; }
.st-opt span { display: grid; gap: 2px; }
.st-opt b { font-weight: 600; font-size: 15px; color: var(--mg-hi); }
.st-opt em { font-style: normal; font-size: 13px; color: var(--mg-muted); }
.st-dlg__hint { margin: 12px 2px 6px; font-size: 13px; line-height: 1.45; color: var(--mg-muted); }
.st-pick { display: grid; gap: 2px; max-height: 260px; overflow-y: auto; padding: 4px; border: 1px solid var(--mg-border); border-radius: 12px; }
.st-pick__it { display: flex; align-items: center; gap: 10px; padding: 7px 8px; border-radius: 10px; cursor: pointer; font-size: 14.5px; color: var(--mg-hi); }
.st-pick__it:hover { background: rgba(212,161,75,.07); }
.st-pick__it input { width: 18px; height: 18px; accent-color: #f28a2d; }
html.st-lock, html.st-lock body { overflow: hidden; }
.st-dlg-ov { z-index: 1460; }
body:has(.st-view, .st-new, .st-sheet, .st-dlg-ov) .toast { z-index: 1600; }
.st-view { position: fixed; inset: 0; z-index: 1500; display: grid; place-items: center; background: #050505; color: #fff; outline: none; animation: st-fade .15s ease-out; touch-action: none; }
.st-view__stage { position: relative; width: min(100vw, calc(100dvh * 9 / 16)); height: 100dvh; overflow: hidden; background: #111; transition: transform .18s ease-out; user-select: none; -webkit-user-select: none; }
@media (max-width: 760px) { .st-view__stage { width: 100vw; } }
@media (min-width: 761px) { .st-view__stage { height: calc(100dvh - 32px); width: min(100vw - 32px, calc((100dvh - 32px) * 9 / 16)); border-radius: 16px; } }
.st-view__text { position: absolute; inset: 0; display: grid; place-items: center; padding: 90px 28px 110px; }
.st-view__text p { margin: 0; font: 600 clamp(20px, 6.2vw, 30px)/1.35 system-ui, sans-serif; text-align: center; white-space: pre-wrap; overflow-wrap: anywhere; }
.st-view__media { position: absolute; inset: 0; display: grid; place-items: center; background: #000; }
.st-view__media img, .st-view__media video { width: 100%; height: 100%; object-fit: contain; }
.st-view__top { position: absolute; left: 0; right: 0; top: 0; z-index: 3; padding: max(8px, env(safe-area-inset-top)) 8px 18px; background: linear-gradient(rgba(0,0,0,.55), transparent); }
.st-view__bars { display: flex; gap: 3px; }
.st-view__bar { flex: 1; height: 3px; border-radius: 2px; background: rgba(255,255,255,.35); overflow: hidden; }
.st-view__bar i { display: block; height: 100%; background: #fff; }
.st-view__head { display: flex; align-items: center; gap: 10px; margin-top: 10px; padding-left: 4px; }
.st-view__who { display: grid; gap: 2px; flex: 1; min-width: 0; }
.st-view__who b { font-weight: 600; font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.st-view__who span { font-size: 12.5px; color: rgba(255,255,255,.75); }
.st-view__head .st-x { color: #fff; }
.st-view__nav { position: absolute; top: 90px; bottom: 90px; z-index: 2; width: 35%; padding: 0; border: 0; background: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.st-view__nav--prev { left: 0; }
.st-view__nav--next { right: 0; width: 65%; }
.st-view__cap { position: absolute; left: 0; right: 0; bottom: 84px; z-index: 2; margin: 0; padding: 10px 18px; font-size: 15px; line-height: 1.45; text-align: center; background: rgba(0,0,0,.45); overflow-wrap: anywhere; pointer-events: none; }
.st-view__foot { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; padding: 14px 12px max(14px, env(safe-area-inset-bottom)); background: linear-gradient(transparent, rgba(0,0,0,.6)); }
.st-view__reply { display: flex; gap: 10px; }
.st-view__reply input { flex: 1; min-width: 0; padding: 13px 18px; border: 1px solid rgba(255,255,255,.3); border-radius: 999px; background: rgba(0,0,0,.4); color: #fff; font: inherit; font-size: 15px; }
.st-view__reply input::placeholder { color: rgba(255,255,255,.7); }
.st-view__reply .st-send { width: 48px; height: 48px; }
.st-view__views { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 12px; border: 0; background: none; color: #fff; font: inherit; font-size: 15px; cursor: pointer; }
.st-view__views svg { width: 20px; height: 20px; }
.st-view.is-paused .st-view__top { opacity: .35; transition: opacity .2s; }
.st-viewers { position: absolute; inset: 0; z-index: 5; display: flex; align-items: flex-end; background: rgba(0,0,0,.45); }
.st-viewers__card { width: 100%; max-height: 62%; display: flex; flex-direction: column; border-radius: 18px 18px 0 0; background: #17130f; color: #f6e6c5; animation: st-up .2s ease-out; }
.st-viewers__head { display: flex; align-items: center; justify-content: space-between; padding: 10px 8px 6px 18px; font-size: 16px; }
.st-viewers__list { overflow-y: auto; padding: 0 6px max(12px, env(safe-area-inset-bottom)); }
.st-viewers .st-row__body b { color: #f6e6c5; }
.st-viewers .st-row__body span, .st-viewers .st-empty { color: rgba(246,230,197,.6); }
@keyframes st-fade { from { opacity: 0; } }
@keyframes st-up { from { transform: translateY(40px); opacity: 0; } }
@keyframes st-pulse { 50% { opacity: .55; } }
@media (prefers-reduced-motion: reduce) { .st-sheet, .st-view, .st-menu, .st-viewers__card { animation: none; } }
html[data-theme="light"] .st-ring .soc-av { box-shadow: 0 0 0 2px #fff; }
html[data-theme="light"] .st-plus { border-color: #fff; }
html[data-theme="light"] .st-ring.is-seen { --st-ring: rgba(60, 40, 20, .25); }
/* == end status == */

/* == telegrana-secure == */
html.e2e-lock { overflow: hidden; }
html.e2e-lock .toast { z-index: 9800; }
.e2e-chat, .e2e-sec { position: fixed; inset: 0; z-index: 9600; display: flex; justify-content: center; background: rgba(6, 5, 4, .72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); animation: e2e-in .18s ease-out; }
.e2e-chat__panel, .e2e-sec__panel { display: flex; flex-direction: column; width: 100%; height: 100%; min-width: 0; background: #0f0d0a; color: var(--mg-ivory); }
.e2e-chat__head, .e2e-sec__head { display: flex; align-items: center; gap: 10px; flex: none; padding: calc(8px + env(safe-area-inset-top)) 10px 8px; border-bottom: 1px solid var(--mg-border); background: #15120e; }
.e2e-sec__head h1 { margin: 0; font-size: 17px; font-weight: 700; line-height: 1.25; color: var(--mg-hi); }
.e2e-ib { display: inline-grid; place-items: center; flex: none; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 12px; background: transparent; color: var(--mg-copy); cursor: pointer; }
.e2e-ib:hover, .e2e-ib:focus-visible { background: rgba(242, 138, 45, .12); color: var(--mg-amber); }
.e2e-ib svg, .e2e-lockbtn svg { width: 21px; height: 21px; }
.e2e-chat__head .soc-av { flex: none; width: 38px; height: 38px; }
.e2e-chat__who { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.e2e-chat__who b { overflow: hidden; font-size: 15px; white-space: nowrap; text-overflow: ellipsis; color: var(--mg-hi); }
.e2e-chat__who span { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: #7fc98f; }
.e2e-chat__who span svg { width: 12px; height: 12px; }
.e2e-chat__box { display: flex; flex-direction: column; gap: 6px; flex: 1; min-height: 0; overflow-y: auto; padding: 14px 12px; overscroll-behavior: contain; background: radial-gradient(circle at 50% 0, rgba(127, 201, 143, .06), transparent 60%); }
.e2e-chat__form { display: flex; align-items: flex-end; gap: 8px; flex: none; padding: 8px 10px calc(8px + env(safe-area-inset-bottom)); border-top: 1px solid var(--mg-border); background: #15120e; }
.e2e-chat__form textarea { flex: 1; min-width: 0; max-height: 140px; padding: 10px 14px; border: 1px solid var(--mg-border); border-radius: 20px; background: #0b0a08; color: var(--mg-ivory); font: inherit; font-size: 16px; line-height: 1.35; resize: none; }
.e2e-chat__form textarea:focus { outline: none; border-color: rgba(127, 201, 143, .6); }
.e2e-send { display: grid; place-items: center; flex: none; width: 42px; height: 42px; padding: 0; border: 0; border-radius: 50%; background: #3f8a52; color: #fff; cursor: pointer; }
.e2e-send svg { width: 20px; height: 20px; }
.e2e-send:disabled { opacity: .5; cursor: default; }
.e2e-note { display: flex; gap: 10px; align-self: center; max-width: 440px; margin: 0 auto 8px; padding: 12px 14px; border: 1px solid rgba(127, 201, 143, .3); border-radius: 14px; background: rgba(127, 201, 143, .07); color: var(--mg-copy); font-size: 13px; line-height: 1.45; }
.e2e-note svg { flex: none; width: 18px; height: 18px; margin-top: 2px; color: #7fc98f; }
.e2e-note b { color: var(--mg-hi); }
.e2e-note p { margin: 2px 0 0; }
.e2e-warn { margin: 0 auto 8px; max-width: 440px; padding: 10px 14px; border: 1px solid rgba(242, 138, 45, .45); border-radius: 12px; background: rgba(242, 138, 45, .1); color: var(--mg-ivory); font-size: 13px; line-height: 1.45; }
.e2e-warn p { margin: 0 0 8px; }
.e2e-warn--flat { max-width: none; margin: 8px 0; }
.e2e-miss, .e2e-day, .e2e-empty { align-self: center; margin: 4px 0; padding: 0 10px; color: var(--mg-muted); font-size: 12px; text-align: center; }
.e2e-empty { margin-top: 18px; font-size: 14px; }
.e2e-day { padding: 3px 10px; border-radius: 10px; background: rgba(255, 255, 255, .05); }
.e2e-msg { position: relative; align-self: flex-start; max-width: min(78%, 520px); padding: 8px 12px 6px; border-radius: 16px 16px 16px 4px; background: #1f1a14; color: var(--mg-ivory); overflow-wrap: anywhere; }
.e2e-msg.is-mine { align-self: flex-end; border-radius: 16px 16px 4px 16px; background: #24452d; }
.e2e-msg p { margin: 0; font-size: 15px; line-height: 1.4; white-space: pre-wrap; }
.e2e-msg time { display: block; margin-top: 2px; color: rgba(246, 230, 197, .55); font-size: 11px; text-align: right; }
.e2e-msg.is-err p { color: #e8a58e; font-style: italic; }
.e2e-msg.is-pending { opacity: .7; }
.e2e-err { margin: 8px 0 0; color: #f0a08a; font-size: 13px; line-height: 1.4; }
.e2e-err--chat { align-self: center; text-align: center; }
.e2e-ok { display: flex; align-items: center; gap: 6px; margin: 8px 0 0; color: #7fc98f; font-size: 13px; }
.e2e-ok svg { width: 16px; height: 16px; }
.e2e-sec__body { flex: 1; min-height: 0; overflow-y: auto; padding: 14px 12px calc(24px + env(safe-area-inset-bottom)); overscroll-behavior: contain; }
.e2e-sec__lead { color: var(--mg-copy); }
.e2e-card { margin: 0 0 14px; padding: 16px; border: 1px solid var(--mg-border); border-radius: 16px; background: var(--mg-card); }
.e2e-card h2 { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: 16px; font-weight: 700; color: var(--mg-hi); }
.e2e-card h2 svg { width: 19px; height: 19px; color: var(--mg-amber); }
.e2e-card__lead { margin: 0 0 10px; color: var(--mg-copy); font-size: 14px; line-height: 1.5; }
.e2e-muted { margin: 8px 0 0; color: var(--mg-muted); font-size: 13px; line-height: 1.45; }
.e2e-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 0; border-top: 1px solid rgba(212, 161, 75, .14); }
.e2e-row > div { display: flex; flex-direction: column; gap: 2px; flex: 1 1 200px; min-width: 0; }
.e2e-row b { font-size: 14px; color: var(--mg-ivory); }
.e2e-row span { color: var(--mg-muted); font-size: 12.5px; line-height: 1.4; }
.e2e-row .btn { flex: none; }
.e2e-row select { flex: none; min-width: 120px; max-width: 100%; padding: 8px 10px; border: 1px solid var(--mg-border); border-radius: 10px; background: #0b0a08; color: var(--mg-ivory); font: inherit; font-size: 14px; }
.e2e-state { flex: none; padding: 3px 9px; border-radius: 999px; background: rgba(255, 255, 255, .06); color: var(--mg-muted); font-size: 12px; font-style: normal; }
.e2e-state.is-on { background: rgba(127, 201, 143, .14); color: #7fc98f; }
.e2e-devs { display: flex; flex-direction: column; }
.e2e-dev { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid rgba(212, 161, 75, .14); }
.e2e-dev > div { display: flex; flex-direction: column; gap: 3px; flex: 1; min-width: 0; }
.e2e-dev b { overflow: hidden; font-size: 14px; white-space: nowrap; text-overflow: ellipsis; color: var(--mg-ivory); }
.e2e-dev span { color: var(--mg-muted); font-size: 12.5px; }
.e2e-dev .soc-av { flex: none; width: 36px; height: 36px; }
.e2e-dev__ic { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: 10px; background: rgba(242, 138, 45, .1); color: var(--mg-amber); }
.e2e-dev__ic svg { width: 18px; height: 18px; }
.e2e-tag { display: inline-block; padding: 1px 8px; border-radius: 999px; background: rgba(127, 201, 143, .14); color: #7fc98f; font-size: 11.5px; font-style: normal; }
.e2e-tag--soft { background: rgba(242, 138, 45, .12); color: var(--mg-amber-lite); }
.e2e-wide { width: 100%; margin-top: 10px; }
.e2e-ov { position: fixed; inset: 0; z-index: 9700; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(0, 0, 0, .66); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); animation: e2e-in .15s ease-out; }
.e2e-dlg { width: min(440px, 100%); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 18px; border: 1px solid var(--mg-border); border-radius: 18px; background: #15120e; color: var(--mg-ivory); box-shadow: 0 24px 60px rgba(0, 0, 0, .6); }
.e2e-dlg__head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; font-size: 17px; color: var(--mg-hi); }
.e2e-dlg__head svg { width: 20px; height: 20px; color: var(--mg-amber); }
.e2e-dlg__lead { margin: 0 0 12px; color: var(--mg-copy); font-size: 14px; line-height: 1.5; }
.e2e-dlg__note { margin: 10px 0 0; color: var(--mg-muted); font-size: 12.5px; line-height: 1.45; }
.e2e-dlg__acts { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; margin-top: 16px; }
.e2e-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.e2e-tabs button { padding: 6px 12px; border: 1px solid var(--mg-border); border-radius: 999px; background: transparent; color: var(--mg-copy); font: inherit; font-size: 13px; cursor: pointer; }
.e2e-tabs button[aria-selected="true"] { border-color: var(--mg-amber); background: rgba(242, 138, 45, .14); color: var(--mg-hi); }
.e2e-field { display: flex; flex-direction: column; gap: 6px; margin: 0 0 10px; font-size: 13px; color: var(--mg-copy); }
.e2e-field input { width: 100%; padding: 11px 12px; border: 1px solid var(--mg-border); border-radius: 12px; background: #0b0a08; color: var(--mg-ivory); font: inherit; font-size: 16px; letter-spacing: .04em; }
.e2e-field input:focus { outline: none; border-color: var(--mg-amber); }
.e2e-field .pass-field { position: relative; display: block; }
.e2e-field .pass-field input { padding-right: 48px; }
.e2e-code { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px 10px; padding: 14px; border-radius: 14px; background: #0b0a08; font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 17px; letter-spacing: .06em; text-align: center; color: var(--mg-hi); }
.e2e-code p { grid-column: 1 / -1; margin: 0; }
.e2e-codes { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; padding: 12px; border-radius: 14px; background: #0b0a08; font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 16px; text-align: center; color: var(--mg-hi); }
.e2e-qr { display: grid; place-items: center; width: 200px; height: 200px; margin: 0 auto; padding: 10px; border-radius: 14px; background: #fff; }
.e2e-qr svg { width: 100%; height: 100%; }
.e2e-secret { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 13px; word-break: break-all; color: var(--mg-hi); user-select: all; }
.e2e-list { display: flex; flex-direction: column; }
.e2e-list__it { display: flex; align-items: center; gap: 10px; padding: 10px 4px; border-top: 1px solid rgba(212, 161, 75, .14); color: var(--mg-ivory); text-decoration: none; }
.e2e-list__it .soc-av { flex: none; width: 40px; height: 40px; }
.e2e-list__it > span { flex: 1; min-width: 0; }
.e2e-badge { display: inline-grid; place-items: center; min-width: 20px; height: 20px; margin-left: auto; padding: 0 6px; border-radius: 999px; background: #3f8a52; color: #fff; font-size: 11.5px; font-style: normal; font-weight: 700; }
.e2e-bar { display: flex; align-items: center; gap: 10px; width: calc(100% - 16px); margin: 6px 8px; padding: 10px 14px; border: 1px solid rgba(127, 201, 143, .3); border-radius: 14px; background: rgba(127, 201, 143, .07); color: var(--mg-ivory); font: inherit; font-size: 14px; cursor: pointer; }
.e2e-bar svg { width: 18px; height: 18px; color: #7fc98f; }
.e2e-bar span { flex: 1; text-align: left; }
.e2e-bar small { color: var(--mg-muted); font-size: 12px; }
.e2e-lockbtn { color: #7fc98f; }
.e2e-pbtn { display: inline-flex; align-items: center; gap: 6px; }
.e2e-pbtn svg { width: 16px; height: 16px; }
@media (min-width: 860px) {
  .e2e-chat, .e2e-sec { align-items: center; padding: 28px; }
  .e2e-chat__panel, .e2e-sec__panel { width: min(720px, 100%); height: min(860px, 100%); overflow: hidden; border: 1px solid var(--mg-border); border-radius: 20px; box-shadow: 0 30px 80px rgba(0, 0, 0, .6); }
  .e2e-chat__head, .e2e-sec__head { padding-top: 10px; }
  .e2e-sec__body { padding: 18px 22px 28px; }
  .e2e-chat__box { padding: 18px 22px; }
}
@media (max-width: 520px) {
  .e2e-ov { align-items: flex-end; padding: 0; }
  .e2e-dlg { width: 100%; max-height: 92dvh; border-radius: 18px 18px 0 0; padding-bottom: calc(18px + env(safe-area-inset-bottom)); }
  .e2e-code { font-size: 15px; gap: 8px 6px; padding: 12px 8px; }
}
@keyframes e2e-in { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .e2e-chat, .e2e-sec, .e2e-ov { animation: none; } }
html[data-theme="light"] .e2e-chat__panel, html[data-theme="light"] .e2e-sec__panel { background: #f7f1e6; color: #2a2118; }
html[data-theme="light"] .e2e-chat__head, html[data-theme="light"] .e2e-sec__head, html[data-theme="light"] .e2e-chat__form, html[data-theme="light"] .e2e-dlg { background: #fffaf2; color: #2a2118; }
html[data-theme="light"] .e2e-sec__head h1, html[data-theme="light"] .e2e-chat__who b, html[data-theme="light"] .e2e-card h2, html[data-theme="light"] .e2e-dlg__head, html[data-theme="light"] .e2e-note b { color: #2a2118; }
html[data-theme="light"] .e2e-card { background: #fffaf2; }
html[data-theme="light"] .e2e-row b, html[data-theme="light"] .e2e-dev b, html[data-theme="light"] .e2e-list__it, html[data-theme="light"] .e2e-bar, html[data-theme="light"] .e2e-warn { color: #2a2118; }
html[data-theme="light"] .e2e-card__lead, html[data-theme="light"] .e2e-dlg__lead, html[data-theme="light"] .e2e-note { color: #5a4b3a; }
html[data-theme="light"] .e2e-msg { background: #fff; color: #2a2118; box-shadow: 0 1px 2px rgba(60, 40, 20, .12); }
html[data-theme="light"] .e2e-msg.is-mine { background: #d9efd9; }
html[data-theme="light"] .e2e-msg time { color: rgba(42, 33, 24, .5); }
html[data-theme="light"] .e2e-chat__form textarea, html[data-theme="light"] .e2e-field input, html[data-theme="light"] .e2e-row select, html[data-theme="light"] .e2e-code, html[data-theme="light"] .e2e-codes { background: #fff; color: #2a2118; }
html[data-theme="light"] .e2e-chat__who span, html[data-theme="light"] .e2e-ok, html[data-theme="light"] .e2e-tag, html[data-theme="light"] .e2e-state.is-on, html[data-theme="light"] .e2e-lockbtn { color: #2f7a43; }
/* == end telegrana-secure == */
/* == comments-video-music == */
#comments { scroll-margin-top: 76px; }
.comment__edited { color: var(--mg-muted); font-size: 12px; margin-left: 8px; font-style: italic; }
.comment__act--own, .comment__act--spam { font-size: 13px; }
.comment__act--spam.is-done { color: var(--mg-muted); opacity: .7; pointer-events: none; }
.comment--deleted { opacity: .75; }
.comment--deleted .comment__text { font-style: italic; margin-top: 8px; }
.comment__gone-ava { --h: 30; display: grid; place-items: center; width: 36px; height: 36px; filter: grayscale(1); }
.comment-form button[type="submit"]:disabled, .cm-edit button[type="submit"]:disabled { opacity: .55; cursor: progress; }
.cm-edit { margin-top: 6px; }
.cm-edit textarea {
  width: 100%; min-height: 76px; resize: vertical; box-sizing: border-box;
  padding: 10px 12px; border-radius: 12px; font: inherit;
  background: rgba(246, 230, 197, 0.05); color: var(--mg-ivory); border: 1px solid rgba(246, 230, 197, 0.18);
}
.cm-edit__btns { display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px; }
html[data-theme="light"] .cm-edit textarea { background: #fff; color: #2a2118; border-color: rgba(60, 40, 20, .2); }

.autoplay-overlay { background: rgba(8, 6, 4, 0.78); padding: 10px; box-sizing: border-box; }
.autoplay-overlay__card { width: min(380px, 100%); max-width: none; text-align: left; padding: 16px; box-sizing: border-box; }
.autoplay-overlay__label { font-size: 14px; color: inherit; opacity: .75; margin-bottom: 10px; }
.autoplay-overlay__next { display: flex; gap: 12px; align-items: center; min-width: 0; }
.autoplay-overlay__thumb {
  flex: 0 0 auto; width: 112px; aspect-ratio: 16 / 9; border-radius: 8px;
  background-size: cover; background-position: center; background-color: #2a221a; overflow: hidden;
}
.autoplay-overlay__title {
  font-weight: 700; font-size: 15px; line-height: 1.3; color: inherit; min-width: 0;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.autoplay-overlay__bar { height: 3px; border-radius: 3px; background: rgba(128, 118, 104, .25); margin-top: 12px; overflow: hidden; }
.autoplay-overlay__bar i { display: block; height: 100%; width: 100%; background: var(--mg-gold, #d4b483); transform-origin: left; animation: gdzAutoplayBar linear forwards; }
@keyframes gdzAutoplayBar { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.autoplay-overlay__actions { justify-content: flex-end; margin-top: 12px; }
@media (max-width: 600px) {
  .autoplay-overlay { padding: 6px; }
  .autoplay-overlay__card { padding: 10px 12px; border-radius: 12px; }
  .autoplay-overlay__label { font-size: 13px; margin-bottom: 6px; }
  .autoplay-overlay__thumb { width: 72px; border-radius: 6px; }
  .autoplay-overlay__title { font-size: 13px; }
  .autoplay-overlay__bar { margin-top: 8px; }
  .autoplay-overlay__actions { margin-top: 8px; }
  .autoplay-overlay__actions .btn { padding: 6px 12px; min-height: 32px; font-size: 13px; }
}

.mus-feat { white-space: normal; }
.mus-full__by { display: block; min-width: 0; }
.mus-full__by a { display: inline; }
.mus-featf { display: grid; gap: 8px; }
.mus-featf__lbl { font-weight: 600; }
.mus-featf__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.mus-featf__chips:empty { display: none; }
.mus-featf__chip {
  display: inline-flex; align-items: center; gap: 6px; max-width: 100%;
  padding: 4px 4px 4px 10px; border-radius: 999px; font-size: 13px;
  background: rgba(246, 230, 197, 0.08); border: 1px solid rgba(246, 230, 197, 0.16);
}
.mus-featf__chip small { color: var(--mg-muted); font-size: 11px; }
.mus-featf__chip.is-ok small { color: #6cc08a; }
.mus-featf__chip button { border: 0; background: transparent; color: inherit; font-size: 16px; line-height: 1; width: 24px; height: 24px; border-radius: 50%; cursor: pointer; }
.mus-featf__chip button:hover { background: rgba(246, 230, 197, 0.12); }
.mus-featf__res { display: grid; gap: 2px; padding: 4px; border-radius: 12px; background: rgba(246, 230, 197, 0.05); border: 1px solid rgba(246, 230, 197, 0.12); }
.mus-featf__res > .muted { padding: 6px 8px; }
.mus-featf__opt { display: flex; align-items: center; gap: 10px; text-align: left; padding: 6px 8px; border: 0; border-radius: 8px; background: transparent; color: inherit; cursor: pointer; font: inherit; }
.mus-featf__opt:hover, .mus-featf__opt:focus-visible { background: rgba(246, 230, 197, 0.08); }
.mus-featf__opt img, .mus-featf__opt i { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; display: grid; place-items: center; font-style: normal; background: rgba(246, 230, 197, 0.12); }
.mus-featf__opt span { display: grid; min-width: 0; }
.mus-featf__opt small { color: var(--mg-muted); font-size: 12px; }
.mus-ask { margin: 0 0 18px; }
.mus-ask__row {
  display: grid; grid-template-columns: 52px 1fr auto; gap: 12px; align-items: center;
  padding: 10px 12px; border-radius: 14px; margin-top: 8px;
  background: rgba(212, 180, 131, 0.08); border: 1px solid rgba(212, 180, 131, 0.28);
}
.mus-ask__cover { width: 52px; height: 52px; border-radius: 10px; overflow: hidden; display: grid; place-items: center; background: rgba(246, 230, 197, 0.08); }
.mus-ask__cover img { width: 100%; height: 100%; object-fit: cover; }
.mus-ask__main { display: grid; gap: 2px; min-width: 0; }
.mus-ask__main span { color: var(--mg-muted); font-size: 13px; }
.mus-ask__acts { display: flex; gap: 8px; }
@media (max-width: 600px) {
  .mus-ask__row { grid-template-columns: 44px 1fr; }
  .mus-ask__cover { width: 44px; height: 44px; }
  .mus-ask__acts { grid-column: 1 / -1; justify-content: flex-end; }
}
html[data-theme="light"] .mus-featf__chip, html[data-theme="light"] .mus-featf__res { background: #fff; border-color: rgba(60, 40, 20, .16); }
html[data-theme="light"] .mus-ask__row { background: #fbf4e8; }
/* == end comments-video-music == */
/* == mibrowser-kb == */
/* окно доступа: шаги крупнее, подсказка про браузер без замка */
.mic-sheet__hint { margin: 0 0 10px; padding: 10px 12px; border-radius: 12px; background: rgba(242, 138, 45, .1); color: var(--mg-ivory); font-size: 15px; line-height: 1.45; }
.mic-sheet__steps + .mic-sheet__where { margin-top: 14px; }
.mic-sheet__btns a.btn { text-align: center; text-decoration: none; }
@media (max-width: 860px) {
  .mic-sheet__steps li { font-size: 16px; line-height: 1.45; }
  .mic-sheet__lead { font-size: 16px; }
  .mic-sheet__where { font-size: 13px; }
  /* переписка с открытой клавиатурой: поле ввода не растёт на пол-экрана, лента не прячется под кнопкой «En ⇄ Ру» */
  html.kb-open.chat-full .soc-chat__form textarea { max-height: min(34vh, calc(var(--vvh, 100vh) * .3)); font-size: 16px; line-height: 1.35; }
  html.kb-open.chat-full.typing-btn-dock .soc-chat__box { padding-bottom: 58px; }
  html.kb-tight.chat-full .soc-chat__head { padding-top: 6px; padding-bottom: 6px; }
  html.kb-tight.chat-full .soc-chat__who span { display: none; }
  html.kb-open.chat-full .gdz-beta-chip { display: none; }
}
/* узкий экран или крупный масштаб: пока набираете, поле ввода занимает всю строку — смайлики есть на клавиатуре, скрепка вернётся, когда поле пустое */
@media (max-width: 340px) {
  html.kb-open.chat-full .soc-chat__form:has(textarea[data-sdm]:not(:placeholder-shown)) .emo-btn,
  html.kb-open.chat-full .soc-chat__form:has(textarea[data-sdm]:not(:placeholder-shown)) .chx-attach { display: none; }
  html.kb-open.chat-full .soc-chat__form textarea[data-sdm] { min-width: 0; }
  html.kb-tight.chat-full .soc-chat__head > .soc-av--sm { display: none; }
}
/* == end mibrowser-kb == */
/* == telegrana-ui == */
/* список чатов: фильтры, поиск, галочки, без звука, архив (сайт и ТелеГрана) */
.soc-dlist__filters { display: flex; gap: 8px; padding: 8px 12px 6px; overflow-x: auto; scrollbar-width: none; }
.soc-dlist__filters::-webkit-scrollbar { display: none; }
.soc-dlist__filters button { flex: none; padding: 6px 14px; border: 1px solid var(--mg-border, rgba(212,161,75,.2)); border-radius: 999px; background: transparent; color: var(--mg-muted); font: 600 13px/1.25 var(--body); white-space: nowrap; cursor: pointer; transition: background .15s, color .15s, border-color .15s; }
.soc-dlist__filters button:hover { color: var(--mg-hi); }
.soc-dlist__filters button.is-on { border-color: rgba(242,138,45,.55); background: rgba(242,138,45,.16); color: var(--mg-amber-lite, #f6b25e); }
.soc-dlist__search { display: flex; align-items: center; gap: 10px; margin: 8px 12px 2px; padding: 0 14px; border-radius: 999px; background: rgba(246,230,197,.07); color: var(--mg-muted); }
.soc-dlist__search svg { flex: none; width: 18px; height: 18px; }
.soc-dlist__search input { flex: 1; min-width: 0; height: 40px; padding: 0; border: 0; background: transparent; color: var(--mg-ivory); font: inherit; font-size: 15px; outline: none; }
.soc-dlist__search input::-webkit-search-cancel-button { filter: grayscale(1); }
.soc-dlist__marks { display: inline-flex; align-items: center; justify-content: flex-end; gap: 6px; min-height: 20px; }
.soc-dlist__mute { display: grid; place-items: center; color: var(--mg-muted); }
.soc-dlist__it.is-unread .soc-dlist__meta time { color: var(--mg-amber-lite, #f6b25e); font-weight: 600; }
.soc-dlist__it.is-muted .soc-dlist__marks i { background: rgba(246,230,197,.28); color: #14100c; }
.soc-dlist__it.is-muted.is-unread .soc-dlist__meta time { color: var(--mg-muted); font-weight: 400; }
.soc-tick { display: inline-flex; vertical-align: -1px; margin-right: 3px; color: rgba(246,230,197,.5); font-style: normal; }
.soc-tick svg { display: block; }
.soc-dlist__body .soc-tick.is-read { color: #f6a24a; }
.soc-msg__meta .soc-tick { margin: 0 0 0 2px; vertical-align: 0; align-self: center; color: rgba(255,243,224,.6); }
.soc-msg__meta .soc-tick.is-read { color: #ffe08a; }
.soc-dlist__archrow { display: flex; align-items: center; gap: 16px; width: 100%; padding: 12px 16px 12px 24px; border: 0; border-radius: 12px; background: transparent; color: var(--mg-ivory); font: 600 15px/1.2 var(--body); text-align: left; cursor: pointer; }
.soc-dlist__archrow:hover { background: rgba(212,161,75,.06); }
.soc-dlist__archrow svg { color: var(--mg-amber-lite, #f6b25e); }
.soc-dlist__archrow b { flex: 1; font-weight: 600; }
.soc-dlist__archrow i { color: var(--mg-muted); font: 600 13px/1 var(--body); font-style: normal; }
.soc-dlist__archback { display: flex; align-items: center; gap: 10px; width: 100%; padding: 12px 14px; border: 0; border-bottom: 1px solid rgba(212,161,75,.14); background: transparent; color: var(--mg-hi); font: 700 17px/1.2 var(--body); text-align: left; cursor: pointer; }
.soc-dlist__archback svg { width: 22px; height: 22px; }
.soc-chat__who span.is-typing { color: var(--mg-amber-lite, #f6b25e); font-style: italic; }
html[data-theme="light"] .soc-dlist__search { background: rgba(60,40,20,.07); }
html[data-theme="light"] .soc-dlist__search input { color: #2a1d14; }
html[data-theme="light"] .soc-dlist__filters button.is-on { color: #a34d0c; background: rgba(242,138,45,.14); }
html[data-theme="light"] .soc-dlist__body .soc-tick.is-read { color: #d9690f; }
html[data-theme="light"] .soc-tick { color: rgba(60,40,20,.45); }
html[data-theme="light"] .soc-msg__meta .soc-tick { color: rgba(43,22,6,.5); }
html[data-theme="light"] .soc-msg__meta .soc-tick.is-read { color: #a34d0c; }
html[data-theme="light"] .soc-dlist__it.is-muted .soc-dlist__marks i { background: rgba(60,40,20,.25); color: #fff; }
html[data-theme="light"] .soc-dlist__archrow, html[data-theme="light"] .soc-dlist__archback { color: #2a1d14; }
html[data-theme="light"] .soc-chat__who span.is-typing { color: #c2600f; }

/* ТелеГрана: шапка, список и переписка как в WhatsApp */
.app-messenger #btn-theme, .app-messenger #theme-dd { display: none !important; }
.app-messenger .soc-dlist__head > [data-sact="grp-new"], .app-messenger .soc-dlist__head > a[href="#/friends"], .app-messenger .soc-dlist > .inv-bar { display: none; }
.app-messenger .soc-dlist__head { padding: 12px 12px 6px 16px; border-bottom: 0; }
.app-messenger .soc-dlist__head h1 { margin-right: auto; font: 700 24px/1.1 var(--body); letter-spacing: 0; text-transform: none; }
.app-messenger .soc-dlist__new { color: var(--mg-ivory); }
.app-messenger .soc-dlist__it { padding: 10px 12px; border-radius: 14px; }
.app-messenger .soc-dlist__body b { font-size: 16px; }
.app-messenger .soc-dlist__body span { font-size: 14px; }
.app-messenger .soc-dlist__items { padding: 2px 6px 12px; }
.app-messenger .soc-msg__bubble { position: relative; border-radius: 12px; background: #1f1a15; box-shadow: 0 1px 1px rgba(0,0,0,.25); }
.app-messenger .soc-msg.is-mine .soc-msg__bubble { border-radius: 12px; background: #6b3a14; color: #fff3e0; }
.app-messenger .soc-msg:not(.is-mine):not(.soc-msg:not(.is-mine) + .soc-msg) > .soc-msg__bubble { border-top-left-radius: 0; }
.app-messenger .soc-msg.is-mine:not(.soc-msg.is-mine + .soc-msg) > .soc-msg__bubble { border-top-right-radius: 0; }
.app-messenger .soc-msg:not(.is-mine):not(.soc-msg:not(.is-mine) + .soc-msg) > .soc-msg__bubble::before,
.app-messenger .soc-msg.is-mine:not(.soc-msg.is-mine + .soc-msg) > .soc-msg__bubble::before { content: ""; position: absolute; top: 0; width: 9px; height: 13px; background: inherit; }
.app-messenger .soc-msg:not(.is-mine):not(.soc-msg:not(.is-mine) + .soc-msg) > .soc-msg__bubble::before { left: -8px; clip-path: polygon(0 0, 100% 0, 100% 100%); }
.app-messenger .soc-msg.is-mine:not(.soc-msg.is-mine + .soc-msg) > .soc-msg__bubble::before { right: -8px; clip-path: polygon(0 0, 100% 0, 0 100%); }
.app-messenger .soc-msg.is-gift > .soc-msg__bubble::before, .app-messenger .soc-msg.is-call > .soc-msg__bubble::before, .app-messenger .soc-msg__bubble:has(.cm-circle)::before { display: none; }
.app-messenger .soc-msg:not(.soc-msg + .soc-msg), .app-messenger .soc-msg.is-mine:not(.soc-msg.is-mine + .soc-msg), .app-messenger .soc-msg:not(.is-mine):not(.soc-msg:not(.is-mine) + .soc-msg) { margin-top: 6px; }
.app-messenger .soc-msg:not(.is-mine) { margin-left: 8px; }
.app-messenger .soc-msg.is-mine { margin-right: 8px; }
.app-messenger .soc-chat__box { gap: 2px; background-color: #0b0a08; background-image: radial-gradient(circle at 20% 0, rgba(242,138,45,.06), transparent 45%), radial-gradient(rgba(246,230,197,.035) 1px, transparent 1.4px); background-size: auto, 22px 22px; }
.app-messenger .soc-day span { background: #1d1813; box-shadow: 0 1px 1px rgba(0,0,0,.3); }
.app-messenger .soc-msg.tg-swipe-ready .soc-msg__bubble { box-shadow: 0 0 0 2px rgba(242,138,45,.6); }
.app-messenger .soc-chat__head { background: #0d0b09; }
html[data-theme="light"].app-messenger .soc-msg__bubble { background: #fff; color: #2a1d14; box-shadow: 0 1px 1px rgba(60,40,20,.14); }
html[data-theme="light"].app-messenger .soc-msg.is-mine .soc-msg__bubble { background: #fbd9b1; color: #2b1606; }
html[data-theme="light"].app-messenger .soc-chat__box { background-color: #f4ece0; background-image: radial-gradient(rgba(120,80,40,.07) 1px, transparent 1.4px); background-size: 22px 22px; }
html[data-theme="light"].app-messenger .soc-chat__head { background: #fffaf3; }
html[data-theme="light"].app-messenger .soc-day span { background: #fffaf3; }
html[data-theme="light"].app-messenger .soc-dlist__new { color: #2a1d14; }

/* кнопка «Новый чат» */
.tg-fab { display: none; }
@media (max-width: 900px) {
  .app-messenger .soc-msgs:not(.soc-msgs--pub) { border: 0; border-radius: 0; background: transparent; }
  .app-messenger .soc-dlist__new { display: none; }
  html.app-messenger.tg-chats:not(.tg-layer) .tg-fab { position: fixed; right: 16px; bottom: calc(84px + env(safe-area-inset-bottom, 0px)); z-index: 151; display: grid; place-items: center; width: 56px; height: 56px; padding: 0; border: 0; border-radius: 18px; background: var(--grad-cta, #f28a2d); color: #1a0f05; box-shadow: 0 8px 22px rgba(242,138,45,.35), 0 2px 6px rgba(0,0,0,.4); cursor: pointer; }
  html.kb-open.app-messenger .tg-fab, html.chat-full.app-messenger .tg-fab { display: none !important; }
  .app-messenger .soc-chat__box { overflow-anchor: none; }
  .tg-fab svg { width: 26px; height: 26px; }
  .app-messenger .soc-msg .chx-more { opacity: 1; margin: 0 1px; }
  .app-messenger .soc-msg .chx-more__btn { width: 26px; height: 26px; }
  .app-messenger .soc-msg .chx-more__btn:not([aria-expanded="true"]) { opacity: .55; }
  .app-messenger .soc-msg .chx-more__btn svg { width: 16px; height: 16px; }
  .app-messenger .soc-msg { gap: 0; }
  .app-messenger .soc-dlist__items { padding-bottom: 90px; }
}

/* окна: новый чат, данные контакта, действия с чатом */
.tg-sheet, .tg-info, .tg-acts { --tg-bg: #0f0d0a; --tg-card: #17130f; --tg-line: rgba(212,161,75,.14); --tg-hi: var(--mg-hi, #fff4e2); --tg-tx: var(--mg-ivory, #f6e6c5); --tg-mu: var(--mg-muted, #a8987f); position: fixed; inset: 0; z-index: 1600; display: flex; justify-content: center; color: var(--tg-tx); animation: tg-in .16s ease-out; }
html[data-theme="light"] .tg-sheet, html[data-theme="light"] .tg-info, html[data-theme="light"] .tg-acts { --tg-bg: #f7f1e6; --tg-card: #fffaf2; --tg-line: rgba(60,40,20,.12); --tg-hi: #2a1d14; --tg-tx: #2a1d14; --tg-mu: #7a6650; }
.tg-sheet__card, .tg-info__card { display: flex; flex-direction: column; width: 100%; height: 100%; min-width: 0; background: var(--tg-bg); }
.tg-sheet__bar, .tg-info__bar { display: flex; align-items: center; gap: 8px; flex: none; padding: calc(8px + env(safe-area-inset-top, 0px)) 10px 8px; background: #0d0b09; color: #f6e6c5; border-bottom: 1px solid var(--tg-line); }
html[data-theme="light"] .tg-sheet__bar, html[data-theme="light"] .tg-info__bar { background: #fffaf3; color: #2a1d14; }
.tg-sheet__bar .soc-icon-btn, .tg-info__bar .soc-icon-btn { color: inherit; }
.tg-sheet__bar svg, .tg-info__bar svg { width: 22px; height: 22px; }
.tg-info__bar > b { font-size: 17px; }
.tg-sheet__title { display: grid; gap: 1px; min-width: 0; }
.tg-sheet__title b { font-size: 17px; }
.tg-sheet__title span { font-size: 12.5px; color: var(--tg-mu); }
.tg-sheet__search { display: flex; align-items: center; gap: 10px; flex: none; margin: 10px 12px 4px; padding: 0 14px; border-radius: 999px; background: rgba(246,230,197,.07); color: var(--tg-mu); }
html[data-theme="light"] .tg-sheet__search { background: rgba(60,40,20,.07); }
.tg-sheet__search svg { flex: none; width: 18px; height: 18px; }
.tg-sheet__search input { flex: 1; min-width: 0; height: 42px; border: 0; background: transparent; color: var(--tg-tx); font: inherit; font-size: 16px; outline: none; }
.tg-sheet__body { flex: 1; min-height: 0; overflow-y: auto; padding: 4px 6px calc(16px + env(safe-area-inset-bottom, 0px)); overscroll-behavior: contain; }
.tg-sheet__h { margin: 14px 12px 6px; font-size: 13px; font-weight: 600; color: var(--tg-mu); }
.tg-sheet__note { margin: 14px 12px; color: var(--tg-mu); font-size: 14px; line-height: 1.45; }
.tg-person { display: flex; align-items: center; gap: 14px; width: 100%; padding: 9px 10px; border: 0; border-radius: 12px; background: transparent; color: inherit; font: inherit; text-align: left; text-decoration: none; cursor: pointer; }
.tg-person:hover { background: rgba(212,161,75,.07); }
.tg-person__body { display: grid; gap: 2px; min-width: 0; }
.tg-person__body b { overflow: hidden; color: var(--tg-hi); font-size: 16px; font-weight: 600; white-space: nowrap; text-overflow: ellipsis; }
.tg-person__body span { overflow: hidden; color: var(--tg-mu); font-size: 13.5px; white-space: nowrap; text-overflow: ellipsis; }
.tg-person__ico { display: grid; place-items: center; flex: none; width: 48px; height: 48px; border-radius: 50%; background: var(--grad-cta, #f28a2d); color: #1a0f05; }
.tg-person__ico svg { width: 22px; height: 22px; }
.tg-info__scroll { flex: 1; min-height: 0; overflow-y: auto; padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px)); overscroll-behavior: contain; }
.tg-info__hero { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 22px 16px 16px; background: var(--tg-card); border-bottom: 1px solid var(--tg-line); text-align: center; }
.tg-info__hero .soc-av--xl { width: 120px; height: 120px; border: 0; box-shadow: none; }
.tg-info__hero .soc-av--xl .soc-av__ini { font-size: 40px; }
.tg-info__hero h2 { margin: 8px 0 0; color: var(--tg-hi); font-size: 22px; font-weight: 700; line-height: 1.2; overflow-wrap: anywhere; }
.tg-info__sub { color: var(--tg-mu); font-size: 14px; }
.tg-info__acts { display: flex; justify-content: center; gap: 10px; margin-top: 12px; }
.tg-info__acts button { display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 84px; padding: 10px 12px; border: 1px solid var(--tg-line); border-radius: 14px; background: transparent; color: var(--mg-amber-lite, #f6b25e); font: 600 13px/1 var(--body); cursor: pointer; }
html[data-theme="light"] .tg-info__acts button { color: #b4560c; }
.tg-info__acts button:hover { background: rgba(242,138,45,.1); }
.tg-info__acts svg { width: 22px; height: 22px; }
.tg-info__acts span { color: var(--tg-tx); }
.tg-info__sec { margin-top: 10px; padding: 12px 6px 8px; background: var(--tg-card); border-top: 1px solid var(--tg-line); border-bottom: 1px solid var(--tg-line); }
.tg-info__sec h3 { margin: 0 10px 10px; color: var(--tg-mu); font-size: 13.5px; font-weight: 600; }
.tg-info__about { margin: 0 10px 4px; color: var(--tg-tx); font-size: 15px; line-height: 1.45; overflow-wrap: anywhere; }
.tg-info__tabs { display: flex; gap: 6px; margin: 0 8px 10px; }
.tg-info__tabs button { flex: 1; padding: 7px 8px; border: 1px solid var(--tg-line); border-radius: 999px; background: transparent; color: var(--tg-mu); font: 600 13px/1.2 var(--body); cursor: pointer; }
.tg-info__tabs button.is-on { border-color: rgba(242,138,45,.55); background: rgba(242,138,45,.14); color: var(--mg-amber-lite, #f6b25e); }
html[data-theme="light"] .tg-info__tabs button.is-on { color: #a34d0c; }
.tg-info__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3px; margin: 0 8px; }
.tg-info__ph { aspect-ratio: 1; padding: 0; border: 0; border-radius: 6px; background: #241e18; overflow: hidden; cursor: pointer; }
.tg-info__ph img, .tg-info__ph video { display: block; width: 100%; height: 100%; object-fit: cover; }
.tg-info__link { display: flex; align-items: flex-start; gap: 12px; padding: 9px 10px; border-radius: 12px; color: inherit; text-decoration: none; }
.tg-info__link:hover { background: rgba(212,161,75,.07); }
.tg-info__link > svg { flex: none; width: 22px; height: 22px; margin-top: 2px; color: var(--mg-amber-lite, #f6b25e); }
.tg-info__link > span { display: grid; gap: 2px; min-width: 0; }
.tg-info__link b { overflow: hidden; color: var(--tg-hi); font-size: 14.5px; white-space: nowrap; text-overflow: ellipsis; }
.tg-info__link span span { overflow: hidden; color: var(--tg-mu); font-size: 12.5px; white-space: nowrap; text-overflow: ellipsis; }
.tg-info__link em { color: var(--tg-mu); font-size: 12px; font-style: normal; }
.tg-info__empty { margin: 4px 10px 8px; color: var(--tg-mu); font-size: 14px; line-height: 1.45; }
.tg-info__star { display: flex; align-items: flex-start; gap: 10px; width: 100%; padding: 9px 10px; border: 0; border-radius: 12px; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.tg-info__star:hover { background: rgba(212,161,75,.07); }
.tg-info__star > svg { flex: none; width: 16px; height: 16px; margin-top: 3px; color: #f5c04a; }
.tg-info__star > span { display: grid; gap: 2px; min-width: 0; }
.tg-info__star b { color: var(--tg-mu); font-size: 12.5px; font-weight: 600; }
.tg-info__star span span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--tg-tx); font-size: 14.5px; }
.tg-info__row { display: flex; align-items: center; gap: 16px; width: 100%; padding: 11px 10px; border: 0; border-radius: 12px; background: transparent; color: var(--tg-tx); font: inherit; text-align: left; text-decoration: none; cursor: pointer; }
.tg-info__row:hover { background: rgba(212,161,75,.07); }
.tg-info__ico { display: grid; place-items: center; flex: none; width: 24px; color: var(--tg-mu); }
.tg-info__ico svg { width: 22px; height: 22px; }
.tg-info__txt { display: grid; gap: 2px; flex: 1; min-width: 0; }
.tg-info__txt b { font-size: 15.5px; font-weight: 500; color: var(--tg-hi); }
.tg-info__txt span { color: var(--tg-mu); font-size: 13px; }
.tg-info__row.is-danger, .tg-info__row.is-danger b, .tg-info__row.is-danger .tg-info__ico { color: #ef6b5b; }
.tg-switch { position: relative; flex: none; width: 40px; height: 22px; border-radius: 999px; background: rgba(246,230,197,.22); transition: background .15s; }
.tg-switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .15s; }
.tg-switch.is-on { background: #f28a2d; }
.tg-switch.is-on::after { transform: translateX(18px); }
html[data-theme="light"] .tg-switch { background: rgba(60,40,20,.2); }
.tg-info .tg-person { padding: 8px 10px; }
.tg-acts { align-items: flex-end; background: rgba(0,0,0,.5); }
.tg-acts__card { width: 100%; padding: 8px 8px calc(10px + env(safe-area-inset-bottom, 0px)); border-radius: 18px 18px 0 0; background: var(--tg-card); box-shadow: 0 -10px 30px rgba(0,0,0,.4); animation: tg-up .18s ease-out; }
.tg-acts__who { display: flex; align-items: center; gap: 12px; padding: 8px 10px 12px; border-bottom: 1px solid var(--tg-line); margin-bottom: 4px; }
.tg-acts__who b { overflow: hidden; color: var(--tg-hi); font-size: 16px; white-space: nowrap; text-overflow: ellipsis; }
.tg-acts__card > button { display: flex; align-items: center; gap: 16px; width: 100%; padding: 13px 12px; border: 0; border-radius: 12px; background: transparent; color: var(--tg-tx); font: 500 15.5px/1.2 var(--body); text-align: left; cursor: pointer; }
.tg-acts__card > button:hover { background: rgba(212,161,75,.08); }
.tg-acts__card > button svg { flex: none; width: 22px; height: 22px; color: var(--tg-mu); }
.tg-acts__card > button.is-muted { color: var(--tg-mu); }
html.tg-layer { overflow: hidden; }
@media (min-width: 901px) {
  .tg-sheet { align-items: center; padding: 28px; background: rgba(0,0,0,.55); }
  .tg-sheet__card { width: min(460px, 100%); height: min(720px, 100%); overflow: hidden; border: 1px solid var(--tg-line); border-radius: 20px; box-shadow: 0 30px 80px rgba(0,0,0,.55); }
  .tg-sheet__bar, .tg-info__bar { padding-top: 10px; }
  .tg-info { justify-content: flex-end; background: rgba(0,0,0,.35); }
  .tg-info__card { width: min(420px, 100%); border-left: 1px solid var(--tg-line); box-shadow: -20px 0 60px rgba(0,0,0,.45); animation: tg-side .18s ease-out; }
  .tg-acts { align-items: center; }
  .tg-acts__card { width: min(360px, 100%); padding-bottom: 8px; border-radius: 18px; }
}
@keyframes tg-in { from { opacity: 0; } }
@keyframes tg-up { from { transform: translateY(30px); opacity: 0; } }
@keyframes tg-side { from { transform: translateX(30px); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .tg-sheet, .tg-info, .tg-acts, .tg-acts__card, .tg-info__card { animation: none; } }

/* настройки ТелеГраны */
.tg-set { max-width: 680px; }
.tg-set__me { display: flex; align-items: center; gap: 16px; padding: 14px 16px; border: 1px solid var(--mg-border); border-radius: 18px; background: rgba(16,14,11,.9); color: inherit; text-decoration: none; }
.tg-set__me .soc-av--lg { width: 64px; height: 64px; }
.tg-set__me .tg-set__txt b { font-size: 18px; }
.tg-set__group { margin-top: 14px; padding: 8px 6px; border: 1px solid var(--mg-border); border-radius: 18px; background: rgba(16,14,11,.9); }
.tg-set__group h2 { margin: 6px 12px 8px; color: var(--mg-muted); font-size: 13px; font-weight: 600; letter-spacing: .02em; }
.tg-set__row { display: flex; align-items: center; gap: 14px; width: 100%; padding: 11px 10px; border: 0; border-radius: 12px; background: transparent; color: inherit; font: inherit; text-align: left; text-decoration: none; cursor: pointer; }
.tg-set__row:hover, .tg-set__me:hover { background: rgba(212,161,75,.07); }
.tg-set__ico { display: grid; place-items: center; flex: none; width: 38px; height: 38px; border-radius: 12px; background: rgba(242,138,45,.12); color: var(--mg-amber-lite, #f6b25e); }
.tg-set__ico svg { width: 20px; height: 20px; }
.tg-set__txt { display: grid; gap: 2px; flex: 1; min-width: 0; }
.tg-set__txt b { color: var(--mg-hi); font-size: 15.5px; font-weight: 600; }
.tg-set__txt span { color: var(--mg-muted); font-size: 13px; line-height: 1.35; }
.tg-set__chev { display: grid; flex: none; color: var(--mg-muted); }
.tg-set__chev svg { width: 18px; height: 18px; }
.tg-set__n { min-width: 20px; padding: 0 6px; border-radius: 999px; background: var(--grad-cta, #f28a2d); color: #1a0f05; font: 700 11px/20px var(--body); font-style: normal; text-align: center; }
.tg-set__theme { display: flex; gap: 6px; margin: 0 8px; padding: 4px; border-radius: 14px; background: rgba(246,230,197,.06); }
.tg-set__theme button { flex: 1; padding: 9px 6px; border: 0; border-radius: 10px; background: transparent; color: var(--mg-muted); font: 600 13.5px/1.2 var(--body); cursor: pointer; }
.tg-set__theme button.is-on { background: var(--grad-cta, #f28a2d); color: #1a0f05; }
.tg-set__note { margin: 10px 12px 6px; color: var(--mg-muted); font-size: 13px; line-height: 1.45; }
.tg-set__foot { margin: 18px 0 8px; color: var(--mg-muted); font-size: 12.5px; text-align: center; }
.tg-status { min-height: 120px; }
html[data-theme="light"] .tg-set__me, html[data-theme="light"] .tg-set__group { background: #fffaf3; }
html[data-theme="light"] .tg-set__txt b { color: #2a1d14; }
html[data-theme="light"] .tg-set__ico { color: #b4560c; }
html[data-theme="light"] .tg-set__theme { background: rgba(60,40,20,.06); }
/* == end telegrana-ui == */
/* == chatguard == */
.cg-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin: 0 0 14px; }
.cg-tab { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border: 1px solid var(--mg-border); border-radius: 999px; color: var(--mg-copy); font-size: 14px; text-decoration: none; }
.cg-tab:hover { border-color: var(--mg-amber); color: var(--mg-hi); }
.cg-tab.is-on { border-color: var(--mg-amber); background: rgba(242, 138, 45, .14); color: var(--mg-hi); }
.cg-badge { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: #b8402e; color: #fff; font-size: 12px; font-weight: 700; line-height: 1; }
.cg-badge.is-zero { background: rgba(255, 255, 255, .1); color: var(--mg-muted); }
.cg-lead { margin: 0 0 10px; max-width: 760px; color: var(--mg-copy); font-size: 14px; line-height: 1.5; }
.cg-ai { margin: 0 0 12px; padding: 9px 12px; border-radius: 12px; background: rgba(255, 255, 255, .05); color: var(--mg-muted); font-size: 13px; line-height: 1.45; }
.cg-ai.is-on { background: rgba(127, 201, 143, .1); color: #9bd4a7; }
.cg-filter { display: flex; gap: 6px; margin: 0 0 12px; }
.cg-err { color: #f0a08a; font-size: 13px; }
.cg-card { display: grid; gap: 10px; margin: 0 0 14px; padding: 16px; border: 1px solid var(--mg-border); border-left: 4px solid #d98a2b; border-radius: 16px; background: rgba(16, 14, 11, .88); min-width: 0; }
.cg-card--high { border-left-color: #d0472f; }
.cg-card--user { border-left-color: #8f7ad6; }
.cg-card.is-done { opacity: .72; border-left-color: rgba(255, 255, 255, .2); }
.cg-card__head { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.cg-card__head time { margin-left: auto; color: var(--mg-muted); font-size: 12.5px; }
.cg-level { font-weight: 700; color: var(--mg-hi); }
.cg-card--high .cg-level { color: #f0866d; }
.cg-chip { padding: 2px 9px; border-radius: 999px; background: rgba(255, 255, 255, .07); color: var(--mg-copy); font-size: 12px; }
.cg-chip--state { background: rgba(242, 138, 45, .12); color: var(--mg-amber-lite, #f2b56d); }
.cg-people { margin: 0; font-size: 14px; color: var(--mg-copy); overflow-wrap: anywhere; }
.cg-people a { color: var(--mg-hi); }
.cg-ban { color: #f0866d; font-style: normal; font-size: 12.5px; }
.cg-reason { margin: 0; font-size: 14px; line-height: 1.5; color: var(--mg-ivory); }
.cg-note { margin: 0; color: var(--mg-muted); font-size: 12.5px; line-height: 1.45; }
.cg-win, .cg-full__box { display: flex; flex-direction: column; gap: 6px; padding: 10px; border-radius: 12px; background: #0b0a08; min-width: 0; }
.cg-full__box { max-height: 60vh; overflow-y: auto; overscroll-behavior: contain; }
.cg-full__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 0 6px; color: var(--mg-hi); font-size: 14px; }
.cg-msg { padding: 7px 10px; border-radius: 10px; background: rgba(255, 255, 255, .04); min-width: 0; }
.cg-msg.is-flag { background: rgba(208, 71, 47, .16); box-shadow: inset 3px 0 0 #d0472f; }
.cg-msg__who { display: flex; gap: 8px; align-items: baseline; font-size: 12.5px; }
.cg-msg__who b { color: var(--mg-hi); }
.cg-msg__who time { color: var(--mg-muted); }
.cg-msg p { margin: 2px 0 0; font-size: 14px; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--mg-ivory); }
.cg-sys { margin: 2px 0; color: var(--mg-muted); font-size: 12px; text-align: center; }
.cg-card__acts { display: flex; gap: 8px; flex-wrap: wrap; }
.cg-card__acts--measures { padding-top: 10px; border-top: 1px solid rgba(212, 161, 75, .14); }
.cg-hist { margin: 0; padding: 0 0 0 18px; color: var(--mg-muted); font-size: 12.5px; line-height: 1.5; }
.cg-log { display: flex; flex-direction: column; border: 1px solid var(--mg-border); border-radius: 14px; overflow: hidden; }
.cg-log__row { display: grid; grid-template-columns: minmax(120px, 1fr) minmax(110px, auto) minmax(0, 2fr); gap: 10px; padding: 10px 14px; border-top: 1px solid rgba(212, 161, 75, .14); font-size: 13.5px; color: var(--mg-copy); }
.cg-log__row:first-child { border-top: 0; }
.cg-log__row b { color: var(--mg-hi); }
.cg-mod-entry .cg-badge { margin-left: auto; }
.e2e-card--guard h2 svg { color: #f0866d; }
.e2e-rep__list { display: flex; flex-direction: column; gap: 6px; max-height: 40vh; overflow-y: auto; margin: 0 0 12px; padding: 8px; border-radius: 12px; background: #0b0a08; }
.e2e-rep__it { display: flex; gap: 10px; align-items: flex-start; padding: 8px 10px; border-radius: 10px; background: #1f1a14; cursor: pointer; }
.e2e-rep__it.is-mine { background: #1c2d20; }
.e2e-rep__it input { flex: none; width: 18px; height: 18px; margin: 2px 0 0; accent-color: #d0472f; }
.e2e-rep__it span { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: 12.5px; color: var(--mg-muted); }
.e2e-rep__it i { font-style: normal; }
.e2e-rep__it b { color: var(--mg-hi); }
.e2e-rep__it em { font-style: normal; font-size: 14px; line-height: 1.4; color: var(--mg-ivory); white-space: pre-wrap; overflow-wrap: anywhere; }
.e2e-rep__why { display: flex; flex-direction: column; gap: 6px; margin: 0 0 10px; font-size: 13px; color: var(--mg-copy); }
.e2e-rep__why select, .e2e-rep__why textarea { width: 100%; padding: 9px 11px; border: 1px solid var(--mg-border); border-radius: 10px; background: #0b0a08; color: var(--mg-ivory); font: inherit; font-size: 15px; }
@media (max-width: 640px) {
  .cg-card { padding: 13px; }
  .cg-card__head time { margin-left: 0; width: 100%; }
  .cg-card__acts .btn { flex: 1 1 auto; }
  .cg-log__row { grid-template-columns: 1fr; gap: 2px; }
}
html[data-theme="light"] .cg-card { background: #fffaf3; }
html[data-theme="light"] .cg-win, html[data-theme="light"] .cg-full__box, html[data-theme="light"] .e2e-rep__list { background: #f4ece0; }
html[data-theme="light"] .cg-msg { background: #fff; }
html[data-theme="light"] .cg-msg.is-flag { background: #fbe1da; }
html[data-theme="light"] .cg-msg p, html[data-theme="light"] .cg-reason { color: #2a1d14; }
html[data-theme="light"] .cg-msg__who b, html[data-theme="light"] .cg-level, html[data-theme="light"] .cg-people a, html[data-theme="light"] .cg-log__row b { color: #2a1d14; }
html[data-theme="light"] .cg-card--high .cg-level, html[data-theme="light"] .cg-ban { color: #b8402e; }
html[data-theme="light"] .cg-ai { background: rgba(60, 40, 20, .06); color: #6b5a48; }
html[data-theme="light"] .cg-ai.is-on { background: #e3f2e3; color: #2f6b3d; }
html[data-theme="light"] .cg-chip { background: rgba(60, 40, 20, .07); color: #5a4a3a; }
html[data-theme="light"] .cg-chip--state { background: rgba(180, 86, 12, .1); color: #a14f0e; }
html[data-theme="light"] .cg-people, html[data-theme="light"] .cg-log__row { color: #5a4a3a; }
html[data-theme="light"] .cg-note, html[data-theme="light"] .cg-hist, html[data-theme="light"] .cg-msg__who time { color: #7a6a58; }
html[data-theme="light"] .e2e-rep__it { background: #fff; box-shadow: 0 1px 2px rgba(60, 40, 20, .12); }
html[data-theme="light"] .e2e-rep__it.is-mine { background: #d9efd9; }
html[data-theme="light"] .e2e-rep__it span { color: #7a6a58; }
html[data-theme="light"] .e2e-rep__it b, html[data-theme="light"] .e2e-rep__it em { color: #2a2118; }
html[data-theme="light"] .e2e-rep__why { color: #5a4a3a; }
html[data-theme="light"] .e2e-rep__why select, html[data-theme="light"] .e2e-rep__why textarea { background: #fff; color: #2a2118; }
/* == end chatguard == */

/* == topbar-fixed == */
/* плашка техработ и шапка закреплены сверху; --tb-nav — высота шапки без плашки (с вырезом экрана, если плашки нет) */
html { --tb-ins: 0px; --tb-nav: calc(var(--nav-h) + var(--gdz-safe-top, 0px)); scroll-padding-top: calc(var(--tb-ins) + var(--works-h, 0px)); }
html.has-works-bar { --tb-nav: var(--nav-h); }
@media (max-width: 860px) {
  html.gdz-has-install-bar { --tb-ins: var(--gdz-install-bar-h, 0px); }
  /* hidden делает body отдельной прокруткой, и sticky перестаёт держаться */
  @supports (overflow: clip) { html, body { overflow-x: clip; } }
}
.works-bar { position: sticky; top: var(--tb-ins); height: calc(26px + var(--gdz-safe-top, 0px)); padding: var(--gdz-safe-top, 0px) 12px 0; gap: 8px; align-items: center; justify-content: center; overflow: hidden; font-size: 12.5px; line-height: 26px; white-space: nowrap; text-align: left; cursor: pointer; }
.works-bar__dot { margin-top: 0; width: 7px; height: 7px; }
.works-bar__vp { flex: 0 1 auto; min-width: 0; overflow: hidden; }
.works-bar__track { display: inline-flex; vertical-align: top; }
.works-bar__text { flex: none; white-space: nowrap; }
.works-bar__text + .works-bar__text { display: none; }
.works-bar__link { text-underline-offset: 2px; }
.works-bar.is-run .works-bar__vp { flex: 1 1 auto; -webkit-mask-image: linear-gradient(90deg, transparent, #000 12px, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, transparent, #000 12px, #000 calc(100% - 28px), transparent); }
.works-bar.is-run .works-bar__text { padding-right: 56px; }
.works-bar.is-run .works-bar__text + .works-bar__text { display: inline; }
.works-bar.is-run .works-bar__track { animation: works-run var(--works-dur, 30s) linear infinite; will-change: transform; }
.works-bar.is-run:hover .works-bar__track, .works-bar.is-run:focus-within .works-bar__track, .works-bar.is-hold .works-bar__track { animation-play-state: paused; }
@keyframes works-run { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .works-bar.is-run .works-bar__track { display: block; animation: none; }
  .works-bar.is-run .works-bar__text { display: block; padding-right: 0; overflow: hidden; text-overflow: ellipsis; }
  .works-bar.is-run .works-bar__text + .works-bar__text { display: none; }
  .works-bar.is-run .works-bar__vp { -webkit-mask-image: none; mask-image: none; }
}
html.no-anim .works-bar.is-run .works-bar__track { display: block; animation: none; }
html.no-anim .works-bar.is-run .works-bar__text { display: block; padding-right: 0; overflow: hidden; text-overflow: ellipsis; }
html.no-anim .works-bar.is-run .works-bar__text + .works-bar__text { display: none; }
html.no-anim .works-bar.is-run .works-bar__vp { -webkit-mask-image: none; mask-image: none; }
.works-bar.is-open { height: auto; padding: calc(6px + var(--gdz-safe-top, 0px)) 12px 6px; align-items: flex-start; line-height: 1.4; white-space: normal; }
.works-bar.is-open .works-bar__dot { margin-top: 5px; }
.works-bar.is-open .works-bar__vp { flex: 1 1 auto; -webkit-mask-image: none; mask-image: none; }
.works-bar.is-open .works-bar__track { display: block; animation: none; transform: none; }
.works-bar.is-open .works-bar__text { display: block; padding-right: 0; white-space: normal; }
.works-bar.is-open .works-bar__text + .works-bar__text { display: none; }
.topnav { top: calc(var(--tb-ins) + var(--works-h, 0px)); }
html.has-works-bar .topnav { height: var(--nav-h); padding-top: 0; }
.sidebar, .rail { top: calc(var(--tb-ins) + var(--works-h, 0px) + var(--tb-nav)); height: calc(100dvh - var(--tb-ins) - var(--works-h, 0px) - var(--tb-nav)); }
.gdz-beta-chip { top: calc(var(--tb-ins) + var(--works-h, 0px) + var(--tb-nav) + 8px); }
#comments { scroll-margin-top: calc(var(--tb-nav) + 12px); }
.toc-target { scroll-margin-top: calc(var(--tb-nav) + 26px); }
/* == end topbar-fixed == */

/* == fr-declined == */
.fr-declined__note { max-width: 640px; margin: 0 0 14px; font-size: 13.5px; line-height: 1.5; }
.fr-declined .soc-person { opacity: .82; }
.fr-declined .soc-person:hover { opacity: 1; }
/* == end fr-declined == */

/* == notif-jump == */
.comment[data-comment-id], .soc-msg, .fb-item, .fb-answer, .rv-card, .soc-person, .mus-ask__row, .ev-row, #comments { scroll-margin-top: calc(var(--tb-nav, 64px) + 16px); }
.nj-flash { border-radius: 12px; animation: nj-flash 2s ease-out 1; }
@keyframes nj-flash {
  0%, 35% { box-shadow: 0 0 0 3px var(--mg-amber, #e0a93b), 0 0 24px 6px rgba(224, 169, 59, .45), inset 0 0 0 999px rgba(224, 169, 59, .1); }
  100% { box-shadow: 0 0 0 3px rgba(224, 169, 59, 0), 0 0 0 0 rgba(224, 169, 59, 0), inset 0 0 0 999px rgba(224, 169, 59, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .nj-flash { animation: none; box-shadow: 0 0 0 3px var(--mg-amber, #e0a93b); }
}
/* == end notif-jump == */

/* == chat-stable == */
/* своё сообщение не ушло: пометка и «Повторить» прямо в пузыре, текст не теряется */
.soc-msg.is-failed .soc-msg__bubble { box-shadow: inset 0 0 0 1px rgba(255, 128, 96, .6); }
.soc-msg.is-failed .chx-more, .soc-msg.is-failed .soc-msg__acts { visibility: hidden; }
.soc-msg__fail { font-style: normal; font-weight: 600; color: #ffb9a3; align-self: center; }
.soc-msg__retry { align-self: center; min-height: 26px; padding: 2px 10px; border: 1px solid rgba(255, 185, 163, .6); border-radius: 999px; background: rgba(255, 110, 80, .18); color: #fff3e0; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.soc-msg__retry:hover { background: rgba(255, 110, 80, .3); }
html[data-theme="light"] .soc-msg__fail { color: #b3361a; }
html[data-theme="light"] .soc-msg__retry { color: #7a2410; border-color: rgba(179, 54, 26, .5); background: rgba(179, 54, 26, .08); }
/* лента не тянет за собой страницу на краях, касание по пузырю без серой вспышки */
[data-schat] { overscroll-behavior: contain; }
.soc-msg__bubble, .chr-bar button { -webkit-tap-highlight-color: transparent; }
/* переписка на весь экран телефона: бесконечные анимации под ней не видны, но пересчитываются каждый кадр — ставим на паузу */
html.chat-full body::after, html.chat-full .works-bar__dot, html.chat-full .brand__mark, html.chat-full .gr-tick__run, html.chat-full .page-kicker--logo::before { animation-play-state: paused !important; }
/* == end chat-stable == */
/* == fast-send == */
/* свой комментарий на экране до ответа сервера */
.comment--out .comment__text { opacity: .72; }
.comment__out { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 6px; font-size: 12.5px; color: var(--muted, #9aa0a6); }
.comment--out.is-failed .comment__out > span { color: #e0694f; }
html[data-theme="light"] .comment--out.is-failed .comment__out > span { color: #b3361a; }
.comment--out.is-failed .comment__text { opacity: 1; }
/* == end fast-send == */

/* == chat-head == */
/* вкладка BETA прижата снизу; top из topbar-fixed растягивал её на всю высоту */
.gdz-beta-chip { top: auto; }
/* шапка переписки: имя не сжимается, лишнее — в меню «⋯» */
.soc-chat__head { gap: 6px; }
.soc-chat__head > .soc-icon-btn, .soc-chat__head > .soc-more, .soc-chat__head > .soc-av { flex: none; }
.soc-chat__who { flex: 1 1 auto; min-width: 0; }
.soc-chat__who span, .soc-chat__gname { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.soc-chat__gname { max-width: 100%; text-align: left; }
.soc-chat__head .e2e-lockbtn { display: none; }
.soc-menu > .soc-menu__ico { display: flex; align-items: center; gap: 10px; }
.soc-menu__ico svg { flex: none; width: 18px; height: 18px; opacity: .85; }
@media (max-width: 860px) {
  .soc-chat__head .soc-chat__find { display: none; }
  .soc-chat__head .soc-menu > :not(.soc-menu__ico) { padding-left: 40px; }
}
@media (min-width: 861px) {
  .soc-menu > .soc-chat__mfind { display: none; }
  .soc-chat__head .soc-menu:has(> .e2e-mlock) > :not(.soc-menu__ico) { padding-left: 40px; }
}
/* == end chat-head == */

/* == voice-draft == */
.cm-recbar__pause, .cm-recbar__mic, .cm-recbar__pv { display: grid; place-items: center; width: 40px; height: 40px; flex-shrink: 0; padding: 0; border: 1px solid rgba(212, 161, 75, .35); border-radius: 50%; background: none; color: var(--mg-ivory); cursor: pointer; }
.cm-recbar__pause svg, .cm-recbar__pv svg { width: 18px; height: 18px; }
.cm-recbar__pause:hover, .cm-recbar__mic:hover, .cm-recbar__pv:hover { background: rgba(212, 161, 75, .12); }
.cm-recbar__mic { color: #ff7a6b; border-color: rgba(255, 77, 61, .45); }
.cm-recbar__pv, .cm-recbar__mic, .cm-recbar.is-paused .cm-recbar__pause, .cm-recbar.is-paused .cm-recbar__dot { display: none; }
.cm-recbar.is-paused .cm-recbar__pv, .cm-recbar.is-paused .cm-recbar__mic { display: grid; }
.cm-recbar.is-wait .cm-recbar__pause { opacity: .45; pointer-events: none; }
.cm-recbar.is-busy .cm-recbar__mic { opacity: .5; pointer-events: none; }
.cm-recbar.is-paused time { min-width: 0; font-size: 13px; white-space: nowrap; }
.cm-recbar.is-paused .cm-recbar__lv { order: 0; justify-content: flex-start; min-width: 0; }
.cm-recbar.is-paused .cm-recbar__lv i { flex: 1 1 0; min-width: 2px; max-width: 4px; background: var(--mg-copy); opacity: .45; }
.cm-recbar.is-paused .cm-recbar__lv i.is-on { background: var(--mg-amber); opacity: 1; }
@media (max-width: 420px) {
  .cm-recbar { gap: 8px; padding-left: 8px; padding-right: 8px; }
  .cm-recbar.is-paused time { font-size: 12px; }
}
.cm-earbtn { display: inline-flex; align-items: center; gap: 4px; height: 24px; padding: 0 8px 0 6px; border: 1px solid currentColor; border-radius: 12px; background: none; color: inherit; font-size: 12px; font-weight: 700; opacity: .8; cursor: pointer; }
.cm-earbtn:hover { opacity: 1; background: rgba(255, 255, 255, .12); }
.cm-earbtn[data-ear="ear"] { opacity: 1; background: rgba(255, 255, 255, .14); }
.cm-voice:not(.is-cur) .cm-ear { display: none; }
.cm-dock__ear { height: 30px; color: var(--mg-ivory); }
.cm-dock.is-circle .cm-dock__ear { display: none; }
.soc-dlist__draft { font-style: normal; font-weight: 600; color: #ff7a6b; }
html[data-theme="light"] .soc-dlist__draft { color: #d23a2a; }
html[data-theme="light"] .cm-recbar__pause, html[data-theme="light"] .cm-recbar__pv { color: inherit; }
/* == end voice-draft == */

/* == menu-back == */
#profile-dd.is-open { max-height: var(--dd-max, calc(100dvh - 140px)); overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
@media (max-width: 860px) {
  :is(#notif-dd, #theme-dd).is-open { max-height: var(--dd-max, calc(100dvh - 160px)); overflow-y: auto; overscroll-behavior: contain; }
  html.gdz-dd-open, html.gdz-dd-open body { overflow: hidden; }
}
/* == end menu-back == */
/* == pc-apps == */
.apps-group { margin: 22px 0 10px; font-size: 1.15rem; }
.apps-group:first-of-type { margin-top: 6px; }
.apps-games-pc { margin: 12px 0 0; font-size: 14px; line-height: 1.45; }
.gm-pc__card { width: min(520px, 100%); max-height: calc(100dvh - 32px); overflow-y: auto; }
.gm-pc__head { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 12px; }
.gm-pc__head p { margin: 0; }
.gm-pc__ic { flex: 0 0 64px; width: 64px; height: 64px; border-radius: 16px; object-fit: cover; display: grid; place-items: center; background: rgba(255, 255, 255, 0.06); }
.gm-pc__opt { margin: 0 0 12px; padding: 12px 14px; border: 1px solid var(--mg-border); border-radius: 14px; background: rgba(255, 255, 255, 0.03); }
.gm-pc__t b { margin-bottom: 2px; font-size: 15px; }
.gm-pc__t span { display: block; font-size: 13px; line-height: 1.4; opacity: 0.85; }
.gm-pc__row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.gm-pc__row .btn { flex: 1 1 160px; justify-content: center; text-decoration: none; }
.gm-pc__row .btn[disabled] { opacity: 0.5; cursor: not-allowed; }
.gm-pc__miss { margin: 10px 0 0 !important; padding: 8px 10px; border-radius: 10px; background: rgba(255, 170, 60, 0.12); font-size: 13px !important; }
:where(html[data-theme="light"]) .gm-pc__opt { background: rgba(120, 80, 40, 0.05); border-color: rgba(120, 80, 40, 0.22); }
/* == end pc-apps == */
/* == apps-sso == общий вход приложений: «Открыть со входом», окно входа, блок на странице «Приложения» */
.app-promo__open { justify-self: start; margin-top: 4px; padding: 0; border: 0; background: none; color: var(--mg-amber); font: 600 12.5px/1.3 inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.sso-modal .plat-modal__box { text-align: center; }
.sso-modal__ic { display: block; margin: 4px auto 0; border-radius: 14px; }
.sso-modal .plat-modal__pay { display: flex; align-items: center; justify-content: center; text-decoration: none; }
.sso-apps { display: grid; gap: 6px; margin: 0 0 18px; padding: 14px 16px; border: 1px solid var(--mg-border); border-radius: 16px; background: var(--mg-card); }
.sso-apps > b { color: var(--mg-hi); font-size: 15px; }
.sso-apps > span { color: var(--mg-copy); font-size: 13px; line-height: 1.4; }
.sso-apps__row { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; margin-top: 6px; }
.sso-apps__btn { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 8px 12px; border: 1px solid var(--mg-border); border-radius: 12px; background: rgba(246, 230, 197, .04); color: var(--mg-hi); font: 600 14px/1.2 inherit; text-align: left; cursor: pointer; }
.sso-apps__btn img { flex: 0 0 auto; border-radius: 8px; }
.sso-apps__btn:hover { border-color: var(--mg-amber); }
.sso-browser { width: 100%; }
:where(html[data-theme="light"]) .sso-apps__btn { background: rgba(120, 80, 40, .05); color: #1f1910; }
:where(html[data-theme="light"]) .sso-apps > b { color: #1f1910; }
:where(html[data-theme="light"]) .sso-apps > span { color: #4a3d2c; }
/* == end apps-sso == */

/* == tg-clean == */
.push-state { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px 12px; padding: 10px 12px; border-radius: 14px; }
.push-state__txt { display: grid; gap: 3px; min-width: 0; }
.push-state__txt b { font-size: 15px; color: var(--mg-hi, #f6e6c5); }
.push-state__txt.is-on b { color: #8fd18a; }
.push-state__txt.is-off b { color: #ff9a7a; }
.push-state__txt span { font-size: 13px; line-height: 1.45; color: var(--mg-muted, rgba(246, 230, 197, .6)); }
.push-state__acts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.push-state__acts .btn { white-space: nowrap; }
.np > .push-state { padding: 10px; border: 1px solid var(--mg-border); background: rgba(212, 161, 75, .05); }
@media (max-width: 560px) {
  .push-state { grid-template-columns: minmax(0, 1fr); }
  .push-state__acts { justify-content: flex-start; }
}
.phn-ctpick:empty { display: none; }
.phn-ask { margin-top: 10px; padding: 10px 12px; border: 1px solid rgba(212, 161, 75, .22); border-radius: 12px; background: rgba(212, 161, 75, .06); }
.phn-ask p { margin: 0; font-size: 13px; line-height: 1.45; color: var(--mg-copy, #c9b896); }
.phn-ask .phn-ctform__row, .phn-ctpick .phn-ctform__row { justify-content: flex-start; flex-wrap: wrap; }
html[data-theme="light"] .push-state__txt b { color: #1f1910; }
html[data-theme="light"] .push-state__txt.is-on b { color: #2f7a2a; }
html[data-theme="light"] .push-state__txt.is-off b { color: #b4442a; }
html[data-theme="light"] .push-state__txt span, html[data-theme="light"] .phn-ask p { color: #4a3d2c; }
/* == end tg-clean == */

/* == плеер музыки: строка трека целиком включает песню, мини-плеер, большой плеер, очередь == */
.mus-row[data-q] { cursor: pointer; -webkit-tap-highlight-color: transparent; transition: background .15s; }
.mus-row[data-q]:active { background: rgba(242,138,45,.14); }
.mus-row__title, .mus-row__title:hover { cursor: inherit; text-decoration: none; }
.mus-row.is-playing .mus-row__btn { background: rgba(7,7,6,.55); }
.mus-eq { display: none; align-items: flex-end; justify-content: center; gap: 3px; height: 16px; font-style: normal; }
.mus-eq i { display: block; width: 3px; height: 100%; border-radius: 2px; background: #ffb45a; transform-origin: bottom; animation: musEqRow .9s ease-in-out infinite alternate; }
.mus-eq i:nth-child(2) { animation-duration: .7s; animation-delay: -.45s; }
.mus-eq i:nth-child(3) { animation-duration: 1.1s; animation-delay: -.2s; }
@keyframes musEqRow { from { transform: scaleY(.25); } to { transform: scaleY(1); } }
.mus-row.is-playing .mus-eq, .mus-qrow.is-playing .mus-eq { display: flex; }
.mus-row.is-playing .mus-row__btn svg { display: none; }
@media (hover: hover) {
  .mus-row.is-playing:hover .mus-eq { display: none; }
  .mus-row.is-playing:hover .mus-row__btn svg { display: block; }
}
@media (prefers-reduced-motion: reduce) { .mus-eq i { animation: none; transform: scaleY(.7); } }
@media (hover: none) {
  .mus-row:not(.is-cur):hover { background: transparent; }
  .mus-row:not(.is-cur):hover .mus-row__btn { opacity: 0; }
  .mus-row .mus-artist:hover { color: inherit; text-decoration: none; }
}

/* перемешать / повтор */
.mus-mode { position: relative; color: var(--mg-muted) !important; }
.mus-mode.is-on { color: var(--mg-amber, #f28a2d) !important; }
.mus-mode.is-on::after { content: ""; position: absolute; left: 50%; bottom: 3px; width: 4px; height: 4px; margin-left: -2px; border-radius: 50%; background: currentColor; }
.mus-mode[disabled] { opacity: .35; cursor: default; }

/* мини-плеер */
.mus-bar__prog { display: none; }
.mus-bar__now { display: contents; }
.mus-bar__like { display: inline-flex; justify-content: center; }
@media (max-width: 860px) {
  .mus-bar { grid-template-columns: 46px minmax(0, 1fr) auto; gap: 12px; padding: 7px 6px 9px 7px; border-radius: 16px; overflow: hidden; cursor: pointer; -webkit-tap-highlight-color: transparent; }
  .mus-bar__cover { width: 46px; height: 46px; }
  .mus-bar__info b { font-size: 15px; }
  .mus-bar__info a { pointer-events: none; }
  .mus-bar__like, .mus-bar__add, .mus-bar__seek, .mus-bar__tools { display: none !important; }
  .mus-bar__ctl { gap: 0; }
  .mus-bar__ctl .mus-mode, .mus-bar__ctl [data-mact="prev"] { display: none; }
  .mus-bar__ctl button { width: 46px; height: 46px; }
  .mus-bar__ctl button svg { width: 26px; height: 26px; }
  .mus-bar__ctl .mus-bar__pp { width: 46px; height: 46px; background: none; color: var(--mg-hi); box-shadow: none; }
  .mus-bar__ctl .mus-bar__pp svg { width: 30px; height: 30px; }
  .mus-bar__prog { display: block; position: absolute; left: 12px; right: 12px; bottom: 3px; height: 2px; border-radius: 2px; background: rgba(255,255,255,.12); overflow: hidden; pointer-events: none; }
  .mus-bar__prog i { display: block; width: var(--p, 0%); height: 100%; background: var(--mg-amber, #f28a2d); }
  body.has-mus-bar .main { padding-bottom: calc(160px + env(safe-area-inset-bottom, 0px)); }
}
@media (min-width: 861px) {
  .mus-bar { left: 0; right: 0; bottom: 0; transform: none; width: auto; min-height: 84px; padding: 10px 24px; gap: 4px 16px; border-width: 1px 0 0; border-radius: 0; box-shadow: 0 -12px 40px rgba(0,0,0,.35);
    grid-template-columns: minmax(0, 1fr) minmax(320px, 600px) minmax(0, 1fr);
    grid-template-areas: "now ctl tools" "now seek tools"; }
  .mus-bar__now { grid-area: now; display: flex; align-items: center; gap: 14px; min-width: 0; }
  .mus-bar__cover { flex-shrink: 0; width: 56px; height: 56px; }
  .mus-bar__info { flex: 0 1 auto; }
  .mus-bar__like, .mus-bar__add { flex-shrink: 0; }
  body.has-mus-bar .mc { bottom: 85px; }
  .mus-bar__ctl { grid-area: ctl; justify-self: center; gap: 6px; }
  .mus-bar__ctl .mus-mode { width: 36px; height: 36px; }
  .mus-bar__ctl .mus-mode svg { width: 18px; height: 18px; }
  .mus-bar__seek { grid-area: seek; }
  .mus-bar__tools { grid-area: tools; justify-self: end; align-self: center; display: flex; }
  .mus-bar__tools .mus-bar__x:hover { color: var(--mg-ivory); }
  .mus-bar__tool.is-on { color: var(--mg-amber, #f28a2d); background: rgba(242,138,45,.12); }
  body.has-mus-bar .main { padding-bottom: 120px; }
}

/* большой плеер */
.mus-full { grid-template-rows: auto minmax(0, 1fr) repeat(5, auto); gap: 14px; padding: max(10px, env(safe-area-inset-top)) 20px max(16px, env(safe-area-inset-bottom)); transition: transform .2s ease; }
.mus-full__top { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; align-items: center; width: min(560px, 100%); text-transform: none; letter-spacing: 0; }
.mus-full__src { display: grid; gap: 1px; min-width: 0; text-align: center; }
.mus-full__src small { font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--mg-muted); }
.mus-full__src b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; font-weight: 600; color: var(--mg-hi); }
.mus-full__more .soc-menu { min-width: 270px; border-color: rgba(212,161,75,.32) !important; background: #1d1813 !important; box-shadow: 0 18px 40px rgba(0,0,0,.6) !important; }
.mus-full__more .soc-menu > button { color: #f6e6c5 !important; }
.mus-full__cover { position: relative; width: min(560px, 86vw, 44vh); }
.mus-full__cover > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mus-full__meta { display: flex; align-items: center; gap: 12px; width: min(560px, 100%); text-align: left; }
.mus-full__mt { display: grid; gap: 4px; flex: 1; min-width: 0; }
.mus-full__meta b { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: clamp(1.3rem, 5.6vw, 1.8rem); line-height: 1.15; text-transform: none; }
.mus-full__like { flex-shrink: 0; width: 48px; height: 48px; justify-content: center; padding: 0; border-radius: 50%; }
.mus-full__like svg { width: 26px; height: 26px; }
.mus-full__add { flex-shrink: 0; width: 48px; height: 48px; border-radius: 50%; }
.mus-full__add svg { width: 26px; height: 26px; }
.mus-full__seek { display: grid; gap: 2px; width: min(560px, 100%); }
.mus-full__seek input { width: 100%; height: 22px; margin: 0; }
.mus-full__times { display: flex; justify-content: space-between; font-size: 12px; }
.mus-full__ctl { justify-content: space-between; gap: 6px; width: min(560px, 100%); }
.mus-full__ctl button { width: 60px; height: 60px; }
.mus-full__ctl .mus-mode { width: 48px; height: 48px; }
.mus-full__ctl .mus-mode svg { width: 24px; height: 24px; }
.mus-full__ctl .mus-full__pp { width: 80px; height: 80px; }
.mus-full__ctl .mus-full__pp svg { width: 38px; height: 38px; }
.mus-full__dock { display: flex; justify-content: space-around; gap: 4px; width: min(560px, 100%); }
.mus-full__dock button { display: grid; justify-items: center; gap: 4px; min-width: 68px; padding: 6px 8px; border-radius: 12px; color: var(--mg-copy); font-size: 12px; }
.mus-full__dock button svg { width: 24px; height: 24px; }
.mus-full__dock button:hover { background: rgba(255,255,255,.06); color: var(--mg-hi); }
.mus-full__dock button.is-on, .mus-full__dock button[aria-pressed="true"] { color: var(--mg-amber, #f28a2d); }
.mus-full .mus-vol--full { width: min(560px, 100%); }
@media (max-width: 860px) { .mus-full .mus-vol--full { display: none; } }
.mus-full.is-car .mus-full__dock [data-mact="song-open"], .mus-full.is-car .mus-full__dock [data-mact="hd"] { display: none; }
.mus-hd__ic { display: grid; place-items: center; width: 30px; height: 24px; border: 1.5px solid currentColor; border-radius: 6px; font-size: 11px; font-weight: 800; letter-spacing: .04em; line-height: 1; }
.mus-full__dock .mus-hd.is-on .mus-hd__ic { background: var(--mg-amber, #f28a2d); border-color: var(--mg-amber, #f28a2d); color: #1a1208; }
.mus-hd-offer { display: grid; gap: 10px; width: min(560px, 100%); padding: 12px 14px; border: 1px solid rgba(242,138,45,.35); border-radius: 14px; background: rgba(242,138,45,.08); color: var(--mg-copy); font-size: 14px; }
@media (max-width: 480px) {
  .mus-full__dock:has(> :nth-child(5)) { gap: 0; }
  .mus-full__dock:has(> :nth-child(5)) button { flex: 1 1 0; min-width: 0; padding: 6px 0; font-size: 11px; }
  .mus-full__dock:has(> :nth-child(5)) button span { text-align: center; }
}
.mus-qtag { font-size: 11px; letter-spacing: .02em; color: var(--mg-copy); opacity: .55; }
.mus-qtag.is-hd { color: var(--mg-amber, #f28a2d); opacity: 1; font-weight: 700; }
.mus-badge--hd { border: 1px solid currentColor; background: transparent; color: var(--mg-amber, #f28a2d); font-weight: 800; }
.mus-hd-offer p { margin: 0; }
.mus-hd-offer div { display: flex; flex-wrap: wrap; gap: 8px; }
.mus-full.is-car .mus-full__dock button { min-width: 90px; padding: 12px; font-size: 16px; }
.mus-full.is-car .mus-full__dock button svg { width: 30px; height: 30px; }
.mus-full.is-car .mus-full__ctl .mus-mode { display: none; }
.mus-full.is-car .mus-full__ctl { justify-content: center; }

/* очередь: снизу на телефоне, справа на компьютере */
.mus-q { position: fixed; inset: 0; z-index: 1160; color: var(--mg-ivory); }
html[data-theme="light"] .mus-q__panel { background: #f8f7f6; box-shadow: 0 -20px 60px rgba(40,25,10,.18); }
html[data-theme="light"] .mus-qrow:active, html[data-theme="light"] .mus-qrow__del:active { background: rgba(40,25,10,.05); }
@media (hover: hover) { html[data-theme="light"] .mus-qrow:hover, html[data-theme="light"] .mus-qrow__del:hover { background: rgba(40,25,10,.05); } }
html[data-theme="light"] .mus-qrow.is-cur { background: rgba(232,120,30,.12); }
html[data-theme="light"] .mus-qrow.is-cur .mus-qrow__main b { color: #b4501c; }
html[data-theme="light"] .mus-qrow__cover { background: linear-gradient(135deg, #f2eeeb, #f7f6f4); }
html[data-theme="light"] .mus-eq i { background: #fff; }
html[data-theme="light"] .mus-bar__prog { background: rgba(40,25,10,.1); }
.mus-q__bg { position: absolute; inset: 0; background: rgba(0,0,0,.5); animation: soc-fade .18s ease-out; }
.mus-q__panel { position: absolute; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; max-height: 86dvh; padding-bottom: env(safe-area-inset-bottom, 0px); border-top: 1px solid var(--mg-border); border-radius: 20px 20px 0 0; background: #15120f; box-shadow: 0 -20px 60px rgba(0,0,0,.5); animation: musQUp .22s ease-out; }
.mus-q__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 12px 6px 18px; }
.mus-q__head b { display: block; color: var(--mg-hi); font-size: 19px; font-weight: 700; }
.mus-q__head span { display: block; margin-top: 2px; color: var(--mg-muted); font-size: 13px; }
.mus-q__body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 8px 14px; }
.mus-q__sub { margin: 12px 10px 6px; color: var(--mg-muted); font-size: 11.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.mus-qrow { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto auto; align-items: center; gap: 12px; padding: 6px 4px 6px 10px; border-radius: 12px; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.mus-qrow:active { background: rgba(255,255,255,.05); }
@media (hover: hover) { .mus-qrow:hover { background: rgba(255,255,255,.05); } }
.mus-qrow.is-cur { grid-template-columns: 44px minmax(0, 1fr) auto; padding-right: 12px; background: rgba(242,138,45,.1); }
.mus-qrow__cover { position: relative; display: grid; place-items: center; width: 44px; height: 44px; overflow: hidden; border-radius: 8px; background: linear-gradient(135deg, #2a1d12, #15110d); color: var(--mg-gold); }
.mus-qrow__cover img { width: 100%; height: 100%; object-fit: cover; }
.mus-qrow__cover .mus-row__ph svg { width: 20px; height: 20px; }
.mus-qrow__cover .mus-row__btn { opacity: 1; }
.mus-qrow.is-playing .mus-row__btn svg { display: none; }
.mus-qrow__main { display: grid; gap: 2px; min-width: 0; }
.mus-qrow__main b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--mg-hi); font-size: 14.5px; font-weight: 600; }
.mus-qrow.is-cur .mus-qrow__main b { color: var(--mg-amber-lite, #ffb45a); }
.mus-qrow__main span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--mg-muted); font-size: 12.5px; }
.mus-qrow__dur { color: var(--mg-muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.mus-qrow__del { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; color: var(--mg-muted); }
.mus-qrow__del svg { width: 18px; height: 18px; }
.mus-qrow__del:hover { color: #ff8a7a; background: rgba(255,255,255,.06); }
.mus-q__tail { margin: 14px 10px 4px; color: var(--mg-muted); font-size: 13px; }
@keyframes musQUp { from { transform: translateY(48px); opacity: 0; } }
@keyframes musQIn { from { transform: translateX(48px); opacity: 0; } }
@media (min-width: 861px) {
  body.has-mus-bar .mus-q:not(.is-over-full) { bottom: 85px; }
  .mus-q__bg { background: rgba(0,0,0,.28); }
  .mus-q__panel { top: 0; left: auto; width: 420px; max-height: none; border-top: 0; border-left: 1px solid var(--mg-border); border-radius: 0; box-shadow: -20px 0 60px rgba(0,0,0,.45); animation: musQIn .22s ease-out; }
  .mus-q__head { padding-top: 18px; }
}
/* == end плеер музыки == */
/* == крупный шрифт телефона и клавиатура: поле ввода, звонок, подсказки == */
html.kb-open .gdz-beta-chip, html.kb-open .grana-visitor { visibility: hidden; pointer-events: none; }
.gdz-beta-card { max-height: min(80vh, 640px, calc(var(--vvh, 100vh) - 32px)); overscroll-behavior: contain; }
.gdz-beta-card textarea { max-height: calc(var(--vvh, 100vh) * .3); }
html.kb-open .gdz-beta-sheet { top: var(--vvt, 0px); bottom: auto; height: var(--vvh, 100%); padding-bottom: 10px; }
.tour-tip { max-height: calc(100vh - 24px); overflow-y: auto; overscroll-behavior: contain; }
.gc-top__who b { white-space: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.gc-ctrl .gc-btn span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 720px) {
  .gc.is-duo .gc-grid.n2 .gc-tile:not(.is-self) .gc-tile__name { display: none; }
  html.chat-full .gc.is-mini .gc-mini { top: calc(var(--vvt, 0px) + 62px + env(safe-area-inset-top, 0px)); bottom: auto; }
}
@media (max-width: 300px) {
  .gc-ctrl .gc-btn { flex-basis: 33.333%; }
  .gc-top [data-gc="minimize"] span { display: none; }
  .gc-top [data-gc="minimize"] { padding: 9px !important; }
}
.apps-quick { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 10px 14px; align-items: center; margin: 4px 0 6px; border-color: var(--accent, #e8772e); box-shadow: 0 0 0 1px var(--accent, #e8772e) inset; }
.apps-quick .apps-card__ic { margin: 0; }
.apps-quick__txt { display: grid; gap: 6px; min-width: 0; }
.apps-quick__btn { grid-column: 1 / -1; width: 100%; min-height: 48px; font-size: 1rem; }
.apps-apk-note { margin: -2px 2px 10px; line-height: 1.45; }
@media (min-width: 720px) { .apps-quick { grid-template-columns: 56px minmax(0, 1fr) auto; } .apps-quick__btn { grid-column: auto; width: auto; } }
.toast { width: max-content; }
.gc-top__who span { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
.gc-mini__who span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* == end крупный шрифт телефона и клавиатура == */
/* == игры без крестика сверху == */
/* Кнопок площадки поверх игры нет: «Свернуть» и «Выйти в Игры» — в меню самой игры, «Назад» ведёт по меню игры */
.gm-stage__x { display: none !important; }
.gm-stage.is-max, .gm-stage.is-full { padding-top: env(safe-area-inset-top, 0px); }
@media (orientation: portrait) {
  .gm-stage.is-land.is-menu.is-max, .gm-stage.is-land.is-menu.is-full { padding-top: env(safe-area-inset-top, 0px); }
}
/* == end игры без крестика сверху == */
/* == всплывашки: смахнуть и закрыть == */
#toast.tst-stack { display: flex; flex-direction: column; align-items: center; gap: 8px; width: min(440px, calc(100vw - 20px)); max-width: none; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; opacity: 1; transform: translateX(-50%); transition: none; pointer-events: none; text-align: left; }
#toast.tst-stack:empty { display: none; }
#toast.tst-stack.is-top { bottom: auto; top: calc(72px + env(safe-area-inset-top, 0px)); flex-direction: column-reverse; }
#toast.tst-stack.is-typing { top: calc(8px + env(safe-area-inset-top, 0px)); }
#toast.tst-stack.is-game { z-index: 1100; top: calc(8px + env(safe-area-inset-top, 0px)); width: min(300px, calc(100vw - 128px)); gap: 6px; }
body:has(.upd-bar:not([hidden])) #toast.tst-stack.is-top { top: calc(84px + env(safe-area-inset-top, 0px)); }
.tst { position: relative; display: flex; align-items: center; gap: 4px; max-width: 100%; min-height: 48px; padding: 4px 4px 4px 16px; overflow: hidden; border: 1px solid var(--mg-gold); border-radius: 14px; background: rgba(13, 12, 11, .97); color: var(--mg-ivory); box-shadow: 0 12px 34px rgba(0, 0, 0, .45); font-size: 14px; line-height: 1.35; pointer-events: auto; touch-action: none; user-select: none; -webkit-user-select: none; opacity: 0; transform: translateY(10px) scale(.98); transition: transform .22s ease, opacity .22s ease; }
#toast.is-top .tst { transform: translateY(-10px) scale(.98); }
#toast .tst.is-in { opacity: 1; transform: none; }
#toast .tst.is-out { opacity: 0; }
#toast .tst.is-out:not([style*="transform"]) { transform: scale(.94); }
#toast .tst.is-drag { transition: none; }
.tst.is-bump { animation: tstBump .3s ease; }
.tst.is-link { cursor: pointer; }
.tst.is-link:focus-visible { outline: 2px solid var(--mg-gold); outline-offset: 2px; }
.tst.is-warn { border-color: rgba(232, 119, 46, .75); }
.tst__msg { flex: 1 1 auto; min-width: 0; padding: 8px 0; overflow-wrap: anywhere; white-space: pre-line; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; line-clamp: 4; overflow: hidden; }
.tst.is-link .tst__msg::after { content: " ›"; color: var(--mg-gold); font-weight: 700; }
.tst__act { flex: none; height: 36px; padding: 0 14px; border: 0; border-radius: 10px; background: #e8772e; color: #fff; font: 700 13px/1 var(--body); cursor: pointer; }
.tst__x { flex: none; display: grid; place-items: center; width: 40px; height: 40px; margin: -2px -2px -2px 0; border: 0; border-radius: 11px; background: transparent; color: var(--mg-muted, #b8ab95); cursor: pointer; touch-action: manipulation; }
.tst__x:hover, .tst__x:focus-visible { background: rgba(255, 255, 255, .08); color: var(--mg-ivory); }
.tst__bar { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--mg-gold); opacity: .55; transform-origin: left center; animation: tstBar var(--tst-ms, 4000ms) linear forwards; pointer-events: none; }
.tst.is-held .tst__bar { animation-play-state: paused; }
#toast.is-game .tst { min-height: 40px; padding: 2px 2px 2px 12px; border-radius: 12px; font-size: 13px; line-height: 1.3; border-color: rgba(212, 161, 75, .7); background: rgba(16, 13, 10, .95); color: #f3e9da; box-shadow: 0 8px 24px rgba(0, 0, 0, .5); }
#toast.is-game .tst__x { color: #cbbda6; }
#toast.is-game .tst__msg { padding: 6px 0; -webkit-line-clamp: 2; line-clamp: 2; }
#toast.is-game .tst__x { width: 36px; height: 36px; }
#toast.is-game .tst__act { height: 30px; padding: 0 10px; }
html[data-theme="light"] .tst { background: #fffaf1; color: #2a1f12; border-color: #d9a54a; box-shadow: 0 10px 30px rgba(60, 40, 10, .18); }
html[data-theme="light"] .tst__x { color: #7a6a52; }
html[data-theme="light"] .tst__x:hover { background: rgba(60, 40, 10, .07); color: #2a1f12; }
html[data-theme="light"] .tst__bar { background: #c88a2a; }
@keyframes tstBar { from { transform: scaleX(1); } to { transform: scaleX(0); } }
@keyframes tstBump { 40% { transform: scale(1.03); } }
html.no-anim .tst, html.no-anim .tst.is-bump { transition: opacity .15s ease; animation: none; }
@media (prefers-reduced-motion: reduce) { .tst, .tst.is-bump { transition: opacity .15s ease; animation: none; } }
/* == end всплывашки: смахнуть и закрыть == */

/* == вывод по СБП: телефон + банк == */
.sbp-fields { display: grid; gap: 12px; }
.sbp-fields .field { margin: 0; }
.sbp-fields [data-sbp-q] { margin-bottom: 6px; }
.sbp-hint { display: block; margin-top: 6px; font-size: 12px; color: var(--mg-muted); }
.sbp-hint.is-warn { color: #e8b25a; }
.sbp-hint a { color: inherit; text-decoration: underline; }
.prog-card .sbp-fields label { display: block; margin-bottom: 6px; font-size: 13px; color: var(--mg-gold); }
.wd-req { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 4px 12px; margin: 8px 0; font-size: 14px; }
.wd-req dt { color: var(--mg-muted); }
.wd-req dd { margin: 0; color: var(--mg-hi); font-weight: 600; overflow-wrap: anywhere; user-select: all; }
.wd-req__err { color: #f08a7a; }
html[data-theme="light"] .sbp-hint.is-warn { color: #9a5a00; }
html[data-theme="light"] .wd-req__err { color: #b3261e; }
/* == end вывод по СБП == */

/* == вывод: самозанятый / ИП, чек «Мой налог» == */
.is-tax-locked > :not([data-tax]) { display: none !important; }
.tax-gate:empty { display: none; }
.tax-gate > .muted { margin: 0; }
.tax-card { display: grid; gap: 12px; padding: 16px; border: 1px solid rgba(232, 178, 90, 0.35); border-radius: 14px; background: rgba(232, 178, 90, 0.06); }
.tax-card p { margin: 0; line-height: 1.5; }
.tax-card .field { margin: 0; }
.tax-card .field label { display: block; margin-bottom: 6px; font-size: 13px; color: var(--mg-gold); }
.tax-card .btn { justify-self: start; }
.tax-card__title { font-size: 16px; color: var(--mg-hi); }
.tax-kinds { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.tax-kind { position: relative; cursor: pointer; }
.tax-kind input { position: absolute; opacity: 0; pointer-events: none; }
.tax-kind span { display: block; padding: 11px 12px; border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 10px; text-align: center; font-weight: 600; transition: border-color 0.15s, background 0.15s; }
.tax-kind input:checked + span { border-color: var(--mg-gold); background: rgba(232, 178, 90, 0.16); color: var(--mg-hi); }
.tax-kind input:focus-visible + span { outline: 2px solid var(--mg-gold); outline-offset: 2px; }
.tax-warn { color: #f08a7a; }
.tax-howto { padding-top: 12px; border-top: 1px dashed rgba(255, 255, 255, 0.14); font-size: 14px; }
.tax-howto ol { margin: 8px 0; padding-left: 20px; display: grid; gap: 4px; }
.tax-howto p { color: var(--mg-muted); }
.tax-line { margin: 0; font-size: 13px; color: var(--mg-muted); }
.tax-line b { color: var(--mg-gold); }
html[data-theme="light"] .tax-kind span { border-color: rgba(0, 0, 0, 0.16); }
html[data-theme="light"] .tax-howto { border-top-color: rgba(0, 0, 0, 0.14); }
html[data-theme="light"] .tax-warn { color: #b3261e; }
/* == end самозанятый / ИП == */

/* == предупреждение об обмане в чате (chat-risk.js): одно на чат, с «Понятно» == */
.soc-risk { grid-template-columns: 1fr auto; column-gap: 10px; align-items: start; }
.soc-risk b, .soc-risk span { grid-column: 1; }
.soc-risk__x { grid-column: 2; grid-row: 1 / span 2; align-self: center; padding: 6px 10px; border: 1px solid rgba(240, 160, 60, .45); border-radius: 9px;
  background: transparent; color: var(--mg-hi, #f3e7d3); font: 600 12.5px/1 var(--body, sans-serif); cursor: pointer; white-space: nowrap; }
.soc-risk__x:hover { background: rgba(240, 160, 60, .16); }
html[data-theme="light"] .soc-risk { color: #3a2a1a; }
html[data-theme="light"] .soc-risk b, html[data-theme="light"] .soc-risk__x { color: #5a3608; }
@media (max-width: 520px) {
  .soc-risk { grid-template-columns: 1fr; }
  .soc-risk__x { grid-column: 1; grid-row: auto; justify-self: start; margin-top: 6px; }
}
/* == end предупреждение об обмане == */

/* == настройки ТелеГраны (tg-settings.js) == */
.app-messenger .bal-chip { display: none !important; }
.tg-set__group--opts { padding: 8px 12px 12px; }
.tg-set__group--opts h2 { margin-left: 0; margin-right: 0; }
.tg-set__opt { display: grid; gap: 8px; padding: 10px 0; border-top: 1px solid var(--mg-border); }
.tg-set__group--opts h2 + .tg-set__opt { border-top: 0; padding-top: 2px; }
.tg-set__seg { display: flex; flex-wrap: wrap; gap: 4px; padding: 4px; border-radius: 12px; background: rgba(246, 230, 197, .06); }
.tg-set__seg button { flex: 1 1 auto; min-width: 64px; padding: 8px 8px; border: 0; border-radius: 9px; background: transparent; color: var(--mg-muted); font: 600 13px/1.2 var(--body); cursor: pointer; }
.tg-set__seg button.is-on { background: var(--grad-cta, #f28a2d); color: #1a0f05; }
.tg-set__repl { display: grid; gap: 6px; }
.tg-set__pair { display: grid; grid-template-columns: 1fr auto 1fr auto; align-items: center; gap: 8px; padding: 6px 4px 6px 10px; border-radius: 10px; background: rgba(246, 230, 197, .05); font-size: 14px; }
.tg-set__pair span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--mg-hi); }
.tg-set__pair i, .tg-set__add i { color: var(--mg-muted); font-style: normal; }
.tg-set__del { width: 30px; height: 30px; border: 0; border-radius: 8px; background: transparent; color: var(--mg-muted); font-size: 20px; line-height: 1; cursor: pointer; }
.tg-set__del:hover { background: rgba(240, 90, 60, .14); color: #f08a6a; }
.tg-set__add { display: grid; grid-template-columns: 1fr auto 1fr auto; align-items: center; gap: 8px; }
.tg-set__add input { min-width: 0; padding: 9px 10px; border: 1px solid var(--mg-border); border-radius: 10px; background: rgba(0, 0, 0, .2); color: inherit; font: 400 14px/1.2 var(--body); }
@media (max-width: 520px) {
  .tg-set__add { grid-template-columns: 1fr auto 1fr; }
  .tg-set__add .btn { grid-column: 1 / -1; }
}
html[data-theme="light"] .tg-set__seg { background: rgba(60, 40, 20, .06); }
html[data-theme="light"] .tg-set__pair { background: rgba(60, 40, 20, .05); }
html[data-theme="light"] .tg-set__pair span { color: #2a1d14; }
html[data-theme="light"] .tg-set__add input { background: #fff; }

/* == Пульт диджея: сетка блоков, настройка раскладки, фейдеры как на микшере == */
.dk:not(.dk--simple) { container: dkboard / inline-size; }
.dkl-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; min-height: 40px; }
.dkl-bar .dk-lead, .dkl-bar__tip { flex: 1 1 320px; margin: 0; }
.dkl-bar__tip { color: var(--muted, #a3a3ad); font-size: 14px; line-height: 1.45; }
.dkl-bar__tip b { color: var(--mg-ivory, #f5efe6); }
html[data-theme="light"] .dkl-bar__tip b { color: #1f160c; }
.dkl-bar__edit { min-height: 36px; padding: 0 14px; }
.dkl { position: relative; display: grid; grid-template-columns: repeat(24, minmax(0, 1fr)); grid-auto-rows: 20px; gap: 10px; min-width: 0; }
.dkl-cell { container: dkcell / inline-size; position: relative; display: flex; min-width: 0; min-height: 0; transition: box-shadow .2s; }
.dkl-cell > section { flex: 1 1 auto; min-width: 0; min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; box-sizing: border-box; }
.dkl-cell > .dk-browse { display: flex; flex-direction: column; }
.dkl-cell > .dk-browse .dk-browse__body { flex: 1 1 auto; min-height: 0; max-height: none; }
.dkl-cell--mixer > .dk-mixer { align-content: start; }
.dkl-cell--mixer .dk-strips { max-width: none; }
.dkl-ov { display: none; }
.dkl.is-edit .dkl-ov { position: absolute; inset: 0; z-index: 5; display: grid; place-items: center; border: 2px dashed rgba(255, 138, 60, .75); border-radius: 18px; background: rgba(12, 9, 6, .55); color: #fff; cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; }
.dkl.is-edit .dkl-cell.is-drag { z-index: 6; }
.dkl.is-edit .dkl-cell.is-drag .dkl-ov { cursor: grabbing; border-style: solid; border-color: #ff8a3c; background: rgba(255, 106, 61, .28); box-shadow: 0 18px 40px -12px rgba(0, 0, 0, .6); }
.dkl.is-dragging .dkl-cell { transition: none; }
.dkl-ov__name { display: grid; justify-items: center; gap: 6px; padding: 10px 14px; border-radius: 14px; background: rgba(0, 0, 0, .55); font: 700 14px/1.2 var(--body, system-ui); text-align: center; pointer-events: none; }
.dkl-ov__name svg { width: 26px; height: 26px; color: #ffb08f; }
.dkl-ov__ord { display: none; }
.dkl-ov__rs { position: absolute; right: 0; bottom: 0; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px 0 16px 0; background: #ff8a3c; color: #1a0f05; cursor: nwse-resize; touch-action: none; }
.dkl-ov__rs svg { width: 20px; height: 20px; pointer-events: none; }
.dkl.is-edit .dkl-cell > section { pointer-events: none; }

.dk-mastbox, .dk-micbox { position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px; min-width: 0; padding: 12px 8px; border: 1px solid var(--mg-border, rgba(255,255,255,.12)); border-radius: 18px; background: linear-gradient(180deg, rgba(242,196,109,.08), rgba(255,255,255,.01)); }
.dk-micbox { background: linear-gradient(180deg, rgba(229,72,58,.09), rgba(255,255,255,.01)); }
.dk-vhead { margin: 0; font: 700 12px/1.2 var(--body, system-ui); text-align: center; color: var(--muted, #a3a3ad); }
.dk-vcol__f { display: flex; flex: 1 1 auto; justify-content: center; align-items: stretch; gap: 8px; min-height: 150px; }
.dk-vcol__f .dk-meter { width: 8px; height: auto; flex: none; }
.dk-mastbox__v { font: 800 15px/1 var(--display, system-ui); font-variant-numeric: tabular-nums; color: var(--mg-gold, #f2c46d); }
.air-mic--col { display: flex; flex: 1 1 auto; flex-direction: column; align-items: stretch; gap: 10px; width: 100%; min-height: 0; }
.air-mic--col .air-mic__btn { justify-content: center; min-height: 44px; padding: 0 8px; }
.air-mic--col .air-mic__btn span { min-width: 0; }
.air-mic--col .air-mic__btn small { white-space: nowrap; }
.air-mic__faders { display: flex; flex: 1 1 auto; justify-content: space-evenly; gap: 6px; min-height: 0; }
.dk-vcol { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; }
.dk-vcol__t { font-size: 11px; font-weight: 700; color: var(--muted, #a3a3ad); }
.dk-vcol em { font-style: normal; font-size: 10.5px; color: var(--muted, #a3a3ad); }
.air-mic--col .air-chk { justify-content: center; font-size: 12px; text-align: center; }
@container dkcell (max-width: 140px) {
  .dkl-ov__name { max-width: calc(100% - 6px); padding: 8px 4px; font-size: 11px; overflow-wrap: anywhere; }
  .dkl-ov__name svg { width: 20px; height: 20px; }
  .dk-micbox, .dk-mastbox { padding: 10px 4px; }
  .air-mic--col .air-mic__btn { padding: 0; min-height: 40px; }
  .air-mic--col .air-mic__btn span { display: none; }
  .air-mic__faders { flex-direction: column; gap: 10px; }
  .air-mic__faders .dk-vcol { flex: 1 1 0; min-height: 0; }
  .air-mic__faders .dk-vcol__f { min-height: 100px; }
  .dk .dk-micbox input.dk-vf__in--fill { width: 32px; }
  .dk .dk-micbox .dk-vf__in--fill::-webkit-slider-thumb { width: 30px; height: 22px; margin-left: -12px; }
  .dk .dk-micbox .dk-vf__in--fill::-moz-range-thumb { width: 30px; height: 22px; }
  .dk-micbox .dk-vcol__f { gap: 3px; }
  .dk-micbox .dk-vcol__f .dk-meter { width: 5px; }
  .dk-vcol__t, .dk-vcol em { font-size: 10px; }
  .air-mic--col .air-chk { font-size: 11px; line-height: 1.25; gap: 4px; }
}

/* фейдеры: прямоугольная ручка с риской, шкала, крупно под палец и мышь */
.dk :where(input[type=range]) { -webkit-appearance: none; appearance: none; width: 100%; height: 34px; margin: 0; padding: 0; border: 0; cursor: pointer; touch-action: pan-y; --cap: #ff6a3d; --tick: rgba(150, 140, 130, .55); background: repeating-linear-gradient(90deg, var(--tick) 0 1px, transparent 1px 10%) center top 1px / calc(100% - 20px) 6px no-repeat, repeating-linear-gradient(90deg, var(--tick) 0 1px, transparent 1px 10%) center bottom 1px / calc(100% - 20px) 6px no-repeat; }
.dk :where(input[type=range]) { pointer-events: none; }
.dk :where(:has(> input[type=range])) { cursor: grab; touch-action: pan-y; -webkit-user-select: none; user-select: none; }
.dk :where(:has(> input.dk-vf__in)) { touch-action: none; }
.dk :where(input[type=range]):focus { outline: none; }
.dk :where(input[type=range]):focus-visible { outline: 2px solid var(--cap); outline-offset: 2px; border-radius: 6px; }
.dk :where(input[type=range])::-webkit-slider-runnable-track { height: 6px; border-radius: 3px; background: #0d0b0a; box-shadow: inset 0 1px 2px rgba(0,0,0,.7), 0 1px 0 rgba(255,255,255,.08); }
.dk :where(input[type=range])::-moz-range-track { height: 6px; border-radius: 3px; background: #0d0b0a; box-shadow: inset 0 1px 2px rgba(0,0,0,.7); }
.dk :where(input[type=range])::-webkit-slider-thumb { -webkit-appearance: none; width: 22px; height: 32px; margin-top: -13px; border: 1px solid rgba(0,0,0,.65); border-radius: 5px; cursor: grab; background: linear-gradient(90deg, transparent 0 calc(50% - 1.5px), var(--cap) calc(50% - 1.5px) calc(50% + 1.5px), transparent calc(50% + 1.5px)), repeating-linear-gradient(90deg, rgba(255,255,255,.14) 0 1px, transparent 1px 4px), linear-gradient(180deg, #5a5650, #26231f 55%, #1a1815); box-shadow: 0 3px 7px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.25); }
.dk :where(input[type=range])::-moz-range-thumb { width: 22px; height: 32px; border: 1px solid rgba(0,0,0,.65); border-radius: 5px; cursor: grab; background: linear-gradient(90deg, transparent 0 calc(50% - 1.5px), var(--cap) calc(50% - 1.5px) calc(50% + 1.5px), transparent calc(50% + 1.5px)), repeating-linear-gradient(90deg, rgba(255,255,255,.14) 0 1px, transparent 1px 4px), linear-gradient(180deg, #5a5650, #26231f 55%, #1a1815); box-shadow: 0 3px 7px rgba(0,0,0,.5); }
.dk :where(input[type=range]):active::-webkit-slider-thumb { cursor: grabbing; box-shadow: 0 0 0 3px rgba(255,138,60,.35), 0 3px 7px rgba(0,0,0,.5); }
.dk :where(input[type=range]):active::-moz-range-thumb { cursor: grabbing; box-shadow: 0 0 0 3px rgba(255,138,60,.35), 0 3px 7px rgba(0,0,0,.5); }
.dk-deck--b input[type=range] { --cap: #5ab8ff; }
.dk .dk-xf2 input.dk-hf--xf { height: 52px; --cap: #f2c46d; background: linear-gradient(90deg, transparent calc(50% - 1px), var(--tick) calc(50% - 1px) calc(50% + 1px), transparent calc(50% + 1px)) center / 100% 100% no-repeat, repeating-linear-gradient(90deg, var(--tick) 0 1px, transparent 1px 10%) center top 2px / calc(100% - 30px) 9px no-repeat, repeating-linear-gradient(90deg, var(--tick) 0 1px, transparent 1px 10%) center bottom 2px / calc(100% - 30px) 9px no-repeat; }
.dk .dk-xf2 input.dk-hf--xf::-webkit-slider-runnable-track { height: 8px; }
.dk .dk-xf2 input.dk-hf--xf::-webkit-slider-thumb { width: 30px; height: 46px; margin-top: -19px; border-radius: 6px; }
.dk .dk-xf2 input.dk-hf--xf::-moz-range-thumb { width: 30px; height: 46px; border-radius: 6px; }
.dk .dk-xf2 input.dk-hf--xf::-moz-range-track { height: 8px; }

/* вертикальные: каналы, эквалайзер, дорожки, общая громкость, голос */
.dk input.dk-vf__in { writing-mode: vertical-lr; direction: rtl; width: 34px; height: 132px; touch-action: none; background: repeating-linear-gradient(180deg, var(--tick) 0 1px, transparent 1px 10%) left 1px center / 6px calc(100% - 19px) no-repeat, repeating-linear-gradient(180deg, var(--tick) 0 1px, transparent 1px 10%) right 1px center / 6px calc(100% - 19px) no-repeat; }
.dk .dk-vf__in::-webkit-slider-runnable-track { width: 6px; height: 100%; margin: 0 auto; }
.dk .dk-vf__in::-moz-range-track { width: 6px; height: 100%; }
.dk .dk-vf__in::-webkit-slider-thumb { width: 30px; height: 20px; margin-top: 0; margin-left: -12px; background: linear-gradient(180deg, transparent 0 calc(50% - 1.5px), var(--cap) calc(50% - 1.5px) calc(50% + 1.5px), transparent calc(50% + 1.5px)), repeating-linear-gradient(180deg, rgba(255,255,255,.14) 0 1px, transparent 1px 4px), linear-gradient(90deg, #5a5650, #26231f 55%, #1a1815); }
.dk .dk-vf__in::-moz-range-thumb { width: 30px; height: 20px; background: linear-gradient(180deg, transparent 0 calc(50% - 1.5px), var(--cap) calc(50% - 1.5px) calc(50% + 1.5px), transparent calc(50% + 1.5px)), repeating-linear-gradient(180deg, rgba(255,255,255,.14) 0 1px, transparent 1px 4px), linear-gradient(90deg, #5a5650, #26231f 55%, #1a1815); }
.dk-strip--b .dk-vf__in { --cap: #5ab8ff; }
.dk .dk-vf--filt .dk-vf__in { --cap: #d65aff; }
.dk .dk-vf--voc .dk-vf__in { --cap: #ff5a7a; }
.dk .dk-vf--drm .dk-vf__in { --cap: #ffcf5a; }
.dk .dk-vf--bas .dk-vf__in { --cap: #4cc98c; }
.dk .dk-vf--mus .dk-vf__in { --cap: #5ab8ff; }
.dk .dk-strip__row { gap: 0; }
.dk .dk-strip__row .dk-vf { flex: 1 1 0; min-width: 0; }
.dk-strip__row .dk-vf span { white-space: normal; line-height: 1.15; overflow: visible; text-overflow: clip; }
.dk .dk-strip__row .dk-vf__in { width: 100%; max-width: 34px; }
.dk .dk-strip__row .dk-vf__in::-webkit-slider-thumb { width: 24px; margin-left: -9px; }
.dk .dk-strip__row .dk-vf__in::-moz-range-thumb { width: 24px; }
.dk .dk-strip__row input.dk-vf__in { height: 112px; }
.dk .dk-vf--vol .dk-vf__in { width: 44px; height: 140px; }
.dk .dk-vf--vol .dk-vf__in::-webkit-slider-thumb { width: 40px; height: 26px; margin-left: -17px; }
.dk .dk-vf--vol .dk-vf__in::-moz-range-thumb { width: 40px; height: 26px; }
.dk-fader .dk-meter { height: 140px; }
.dk input.dk-vf__in--fill { height: auto; min-height: 140px; width: 44px; align-self: stretch; }
.dk .dk-vf__in--fill::-webkit-slider-thumb { width: 40px; height: 26px; margin-left: -17px; }
.dk .dk-vf__in--fill::-moz-range-thumb { width: 40px; height: 26px; }
.dk .dk-vf--master { --cap: #f2c46d; }
.dk .dk-vf--voice, .dk .dk-vf--bal { --cap: #ff6b5e; }

/* кроссфейдер: шкала, фейдер, кнопки A/B и плавный переход */
.dkl-cell > .dk-xbar { display: flex; flex-direction: column; align-items: stretch; justify-content: center; gap: 6px; padding: 8px 12px; }
.dk-xbar__row { display: grid; grid-template-columns: minmax(56px, 92px) minmax(0, 1fr) minmax(56px, 92px); gap: 10px; align-items: stretch; }
.dk-xbar__row .dk-ab { height: auto; min-height: 64px; }
.dk-xbar__row .dk-ab b { font-size: 24px; }
.dk-xbar__row .dk-ab small { font-size: 10px; letter-spacing: .03em; text-align: center; }
.dk-xbar__row .dk-xbar__go { display: grid; grid-column: auto; gap: 6px; align-content: center; justify-items: stretch; }
.dk-xbar .dk-xf2 { grid-column: auto; grid-row: auto; }
.dk-xbar__row .dk-xgo { min-width: 0; padding: 9px 10px; font-size: 13px; text-align: center; }
.dk-xbar__row .dk-mini { justify-content: center; }
@container dkcell (max-width: 380px) {
  .dk-xbar__row { grid-template-columns: minmax(56px, 76px) minmax(0, 1fr) minmax(56px, 76px); gap: 8px; }
  .dk-xbar__row .dk-mini > span { display: none; }
}
html[data-theme="light"] :is(.dk-mastbox, .dk-micbox) { background: #fffaf3; border-color: #ead8bf; }
html[data-theme="light"] .dk :where(input[type=range]) { --tick: rgba(90, 70, 50, .45); }
html[data-theme="light"] .dk :where(input[type=range])::-webkit-slider-runnable-track { background: #2a221b; }
html[data-theme="light"] .dkl.is-edit .dkl-ov { background: rgba(40, 26, 14, .5); }

/* две деки как пульт: волна сверху, джог снаружи, старт и точка, крест в средней колонке */
.dk-deck__head .dk-deck__time { flex: none; font-size: 12px; }
.dk-brand { margin: 0; text-align: center; font: 800 12px/1 var(--display, system-ui); letter-spacing: .14em; text-transform: uppercase; color: var(--mg-gold, #f2c46d); }
.dk-wave { height: 118px; border-radius: 10px; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08), inset 0 0 24px rgba(0, 0, 0, .35); }
.dk-face { display: flex; gap: 12px; align-items: center; min-width: 0; }
.dk-deck--b .dk-face { flex-direction: row-reverse; }
.dk-jog { position: relative; flex: none; width: 148px; height: 148px; border-radius: 50%; cursor: ew-resize; touch-action: none; background: #120e0c; box-shadow: inset 0 0 0 7px #2a211c, inset 0 0 0 10px #c8102e, 0 10px 22px rgba(0, 0, 0, .45); }
.dk-deck--b .dk-jog { box-shadow: inset 0 0 0 7px #1a2430, inset 0 0 0 10px #1d6fd1, 0 10px 22px rgba(0, 0, 0, .45); }
.dk-jog__disc { position: absolute; inset: 12px; border-radius: 50%; background: radial-gradient(circle at 50% 50%, transparent 0 26%, #1a140f 27% 100%), repeating-radial-gradient(circle at 50% 50%, rgba(255, 255, 255, .05) 0 1px, transparent 2px 6px), repeating-conic-gradient(from 0deg, rgba(255, 255, 255, .08) 0 7deg, transparent 7deg 14deg); }
.dk-jog b { position: absolute; left: 50%; top: 50%; z-index: 1; display: grid; place-items: center; width: 54px; height: 54px; margin: -27px 0 0 -27px; border-radius: 50%; background: radial-gradient(circle at 40% 35%, #3a2418, #0c0a08 70%); color: #f2c46d; font: 800 11px/1 var(--display, system-ui); letter-spacing: .02em; pointer-events: none; box-shadow: 0 0 0 2px rgba(242, 196, 109, .35); }
.dk-transport { flex: 1 1 auto; display: grid; gap: 8px; min-width: 0; }
.dk-playrow { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 8px; }
.dk-playrow .dk-btn--play, .dk-playrow .dk-btn--cue { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; width: auto; min-width: 0; height: auto; min-height: 68px; padding: 8px 6px; font: 800 15px/1 var(--body, system-ui); letter-spacing: 0; }
.dk-playrow .dk-btn--play svg { width: 22px; height: 22px; }
.dk-playrow .dk-btn--cue { background: rgba(255, 207, 90, .1); color: #ffcf5a; }
.dkl-cell > .dk-xbar { border-color: rgba(242, 196, 109, .4); background: radial-gradient(80% 120% at 50% 0%, rgba(242, 196, 109, .16), transparent 60%), linear-gradient(180deg, rgba(28, 20, 12, .2), rgba(0, 0, 0, .15)); }
@container dkcell (max-width: 460px) {
  .dk-face { flex-wrap: wrap; justify-content: center; }
  .dk-transport { flex: 1 1 150px; }
  .dk-jog { width: 96px; height: 96px; }
  .dk-vf--pitch .dk-vf__in { height: 96px; }
  .dk-jog b { width: 40px; height: 40px; margin: -20px 0 0 -20px; font-size: 10px; }
  .dk-wave { height: 92px; }
  .dk-go .dk-btn--play, .dk-go .dk-btn--cue { min-height: 58px; font-size: 14px; }
}

/* узкий пульт (телефон, узкое окно): блоки друг под другом, громкость и голос рядом */
@container dkboard (max-width: 819px) {
  .dkl-bar .dk-lead { flex-basis: 100%; }
  .dk-jog { width: 92px; height: 92px; }
  .dk-jog b { width: 40px; height: 40px; margin: -20px 0 0 -20px; font-size: 10px; }
  .dk-vf--pitch .dk-vf__in { width: 30px; height: 92px; }
  .dkl { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: auto; grid-auto-flow: row dense; gap: 12px; }
  .dkl > .dkl-cell { grid-column: auto / span 2 !important; grid-row: auto !important; order: var(--o, 0); }
  .dkl > .dkl-cell.is-half { grid-column: auto / span 1 !important; }
  .dkl-cell > section { overflow: visible; }
  .dkl-cell > .dk-browse .dk-browse__body { max-height: 460px; }
  .dkl.is-edit .dkl-ov { place-items: center; gap: 10px; grid-auto-flow: column; cursor: default; touch-action: auto; }
  .dkl.is-edit .dkl-ov__name svg { display: none; }
  .dkl.is-edit .dkl-ov__ord { display: flex; gap: 8px; }
  .dkl-ov__ord button { width: 48px; height: 48px; border: 0; border-radius: 14px; background: #ff8a3c; color: #1a0f05; font: 800 22px/1 var(--body, system-ui); cursor: pointer; }
  .dkl-ov__rs { display: none; }
  .dkl.is-edit .dkl-cell { min-height: 90px; }
  .dk input.dk-vf__in { height: 120px; }
  .dk input.dk-vf__in--fill { height: auto; }
  .dk .dk-vf--vol .dk-vf__in, .dk-fader .dk-meter { height: 150px; }
  .dk-vcol__f { min-height: 170px; }
  .dk-xbar__row { grid-template-columns: 72px minmax(0, 1fr) 72px; }
}
/* пульт как Virtual DJ: тёмный корпус, темп сбоку от джога, стили, монитор */
.dk::before {
  content: "";
  display: block;
  height: 4px;
  margin: 0 0 12px;
  border-radius: 4px;
  background: linear-gradient(90deg, #c45a12, #f28a2d 35%, #ffc56d 50%, #f28a2d 65%, #c45a12);
  box-shadow: 0 0 18px rgba(242, 138, 45, .35);
}
.dk--skin-waves .dkl-cell--deckA,
.dk--skin-waves .dkl-cell--deckB { min-height: 0; }
.dk--skin-waves .dkl-cell--deckA .dk-wave,
.dk--skin-waves .dkl-cell--deckB .dk-wave { height: 112px; }
.dk--skin-waves .dkl-cell--mixer { border-top: 2px solid rgba(242, 138, 45, .35); padding-top: 16px; }
.dk--skin-waves .dkl-cell--deckA .dk-deck { border-color: rgba(255, 106, 61, .28); }
.dk--skin-waves .dkl-cell--deckB .dk-deck { border-color: rgba(90, 184, 255, .28); }
.dk--skin-waves .dk-xbar { background: rgba(0, 0, 0, .35); border-radius: 12px; padding: 8px 10px; }
.dkl-skins { display: flex; flex-wrap: wrap; gap: 6px; }
.dkl-skins .dk-chip.is-on { background: rgba(242, 196, 109, .18); border-color: rgba(242, 196, 109, .7); color: #f2c46d; }
.dk-deck, .dk-mixer { background: linear-gradient(180deg, #16110e, #0c0a09); }
.dk-deck--b { background: linear-gradient(180deg, #10141a, #0c0a09); }
.dk-face { align-items: stretch; }
.dk-vf--pitch { flex: none; }
.dk-vf--pitch .dk-vf__in { height: 132px; }
.dk-strip__acts { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.dk-pfl.is-on { background: rgba(242, 196, 109, .2); border-color: #f2c46d; color: #f2c46d; }
.dk-mastbox .dk-note { text-align: center; font-size: 11px; }
.dk-vf--cue { width: 100%; }
.dk .dk-vf__in::-webkit-slider-thumb { height: 28px; border-radius: 4px; }
.dk .dk-vf__in::-moz-range-thumb { height: 28px; border-radius: 4px; }
.dk .dk-vf--vol .dk-vf__in::-webkit-slider-thumb,
.dk .dk-vf__in--fill::-webkit-slider-thumb { height: 32px; border-radius: 4px; }
.dk .dk-vf--vol .dk-vf__in::-moz-range-thumb,
.dk .dk-vf__in--fill::-moz-range-thumb { height: 32px; border-radius: 4px; }
@media (max-width: 860px) {
  .dk-face { flex-wrap: wrap; }
  .dk-transport { flex: 1 1 100%; min-width: 0; }
  .dk-jog { width: 92px; height: 92px; }
  .dk-jog b { width: 40px; height: 40px; margin: -20px 0 0 -20px; }
  .dk-vf--pitch .dk-vf__in { width: 30px; height: 92px; }
  .dkl, .dkl-cell, .dk-deck, .dk-mixer { max-width: 100%; }
  .dk-hot { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
/* == end пульт: сетка и фейдеры == */
/* == end настройки ТелеГраны == */

/* == Приложение «Грана Диджей» (?app=dj): только пульт и музыка, без сообщений и уведомлений == */
.app-dj .sidebar, .app-dj .rail, .app-dj .side-edge, .app-dj .bottom-nav, .app-dj .browse-switch,
.app-dj .topnav__search, .app-dj #nav-create, .app-dj .nav-radio-slot, .app-dj .nav-extras,
.app-dj .mc, .app-dj .gc-ring, .app-dj .gr-tick, .app-dj .grana-visitor, .app-dj .gr-chat,
.app-dj .app-promo, .app-dj .gdz-beta-card, .app-dj .gdz-beta-chip, .app-dj .sf-ad, .app-dj .ad-slot,
.app-dj .site-legal, .app-dj .notify-bar, .app-dj .works-bar, .app-dj #btn-bell, .app-dj #notif-dd { display: none !important; }
.app-dj .layout { display: block; max-width: 1480px; margin: 0 auto; }
.app-dj .main { max-width: none; padding-bottom: 40px; }
.app-dj .dj-cab--app { display: block; }
.app-dj .dj-cab--app .dj-body { min-width: 0; }
/* == end Грана Диджей == */
