/* ============================================================================
 * Общая overlay-карточка пользователя (чат / поиск / список друзей).
 * Самодостаточные токены на .uc-overlay — карточка работает и вне .pc-app (в чате),
 * и в кабинете, в светлой и тёмной теме. Визуал — компактная адаптация публичного
 * профиля по эталону (обложка + аватар с Premium-обводкой + бейджи + действия).
 * ========================================================================== */
.uc-overlay{
  /* Этап B: поверхности карточки унифицированы с --pc и подняты к ЭТАЛОНУ (панель #141416
     и т.д.). Значения совпадают с profile-cabinet.css (--pc был идентичен --uc). */
  --uc-bg:var(--ds-panel); --uc-bg-2:var(--ds-panel-2); --uc-bg-3:var(--ds-panel-3);
  --uc-stroke:var(--ds-panel-bd); --uc-stroke-soft:rgba(255,255,255,.06);
  --uc-text:var(--ds-ink); --uc-muted:var(--ds-muted); --uc-muted-2:var(--ds-muted-2);
  --uc-blue:#3390ec; --uc-gold:#f5c518;
  --uc-brand-1:var(--ds-brand-1); --uc-brand-2:var(--ds-brand-2); --uc-brand-link:var(--ds-link-brand);
  --uc-danger:var(--ds-danger-fg); --uc-green:#39c17a;
  --uc-shadow:0 24px 64px rgba(0,0,0,.6);
  position:fixed; inset:0; z-index:10040; display:flex; align-items:center; justify-content:center;
  padding:16px;
}
:root[data-theme="light"] .uc-overlay,[data-theme="light"] .uc-overlay{
  /* переведённые токены (bg/stroke/text/muted/brand) наследуются из ядра --ds-* и флипаются темой;
     здесь остаются только НЕпереведённые (soft-stroke .06, danger, тень). */
  --uc-stroke-soft:rgba(16,22,32,.05);
  --uc-shadow:0 24px 64px rgba(20,35,60,.18);
}
.uc-overlay[hidden]{ display:none; }
.uc-overlay,.uc-overlay *{ box-sizing:border-box; }
body.uc-open{ overflow:hidden; }
/* хост модалки подарка в чате: даёт scope pc-токенов, но не создаёт лишний блок в потоке */
.cc-gift-host{ display:contents; }

.uc-scrim{ position:absolute; inset:0; background:rgba(0,0,0,.55); }
[data-theme="light"] .uc-overlay .uc-scrim{ background:rgba(20,26,38,.42); }

.uc-card{
  position:relative; width:min(360px,100%); max-height:calc(100dvh - 32px);
  display:flex; flex-direction:column; overflow:hidden;
  background:var(--uc-bg); color:var(--uc-text);
  border:1px solid var(--uc-stroke); border-radius:20px; box-shadow:var(--uc-shadow);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  animation:uc-in .16s ease;
}
@keyframes uc-in{ from{ transform:translateY(8px) scale(.99); opacity:.4; } to{ transform:none; opacity:1; } }
@media (prefers-reduced-motion:reduce){ .uc-card{ animation:none; } }

/* крестик — круглая иконка-кнопка (эталон), поверх обложки */
.uc-close{
  position:absolute; top:10px; right:10px; z-index:3; width:30px; height:30px; flex:0 0 auto;
  display:inline-flex; align-items:center; justify-content:center; border-radius:50%;
  background:rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.22); color:#fff;
  cursor:pointer; padding:0; line-height:1; transition:background .15s,border-color .15s;
}
.uc-close:hover{ background:rgba(0,0,0,.5); }
.uc-close:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(255,133,0,.35); }

/* компактная обложка (fallback — фирменный градиент) */
.uc-cover{
  height:96px; flex:0 0 auto; background-size:cover; background-position:center;
  background-color:var(--uc-bg-3);
  background-image:linear-gradient(120deg,#132844,#0d1626);
}
[data-theme="light"] .uc-overlay .uc-cover{ background-image:linear-gradient(120deg,#cfe0f5,#dbe6f6); }
.uc-cover.is-image{ background-image:none; }

/* аватар частично перекрывает обложку */
.uc-av-wrap{ position:relative; margin:-46px auto 0; width:92px; flex:0 0 auto; z-index:2; text-align:center; }
.uc-av{
  width:92px; height:92px; border-radius:50%; overflow:hidden; background:var(--uc-bg-3);
  border:3px solid var(--uc-bg); display:flex; align-items:center; justify-content:center;
  color:var(--uc-muted); font-size:30px; font-weight:700;
}
.uc-av img{ width:100%; height:100%; object-fit:cover; display:block; }
/* Premium-обводка — тонкое кольцо как на публичном профиле: 3px зазор цвета карточки
   (базовый border) + 3px оранжевый ring через box-shadow (эталон .pc-pub-av-wrap.is-premium) */
.uc-av-wrap.is-premium .uc-av{ border-color:var(--uc-bg); box-shadow:0 0 0 3px var(--uc-brand-2); }
/* Корона — ТОЛЬКО Premium Ultra (feature premium_crown). Над аватаром, вне потока, чтобы
   геометрия карточки не менялась при её появлении. */
.uc-av-wrap{ position:relative; }
/* Контракт: атрибут [hidden] обязан скрывать элемент внутри карточки. Классы вроде
   .uc-prem{display:inline-flex} имеют равную с UA-правилом [hidden]{display:none} специфичность
   и (как author-стиль) ПЕРЕБИВАЛИ его → скрытый JS-ом Premium-бейдж оставался видимым у обычных
   пользователей. !important возвращает приоритет [hidden] для ВСЕХ уц-элементов, скрываемых через
   hidden (бейдж/мета/соцсети/хинт/дата/empty). Показ (снятие hidden) не затронут. */
.uc-card [hidden]{ display:none !important; }
.uc-prem{
  position:absolute; left:50%; bottom:-10px; transform:translateX(-50%);
  display:inline-flex; align-items:center; gap:4px; white-space:nowrap;
  background:linear-gradient(135deg,var(--uc-brand-1),var(--uc-brand-2)); color:#fff;
  font-size:11px; font-weight:800; padding:3px 10px; border-radius:var(--ds-r-pill);
  border:2px solid var(--uc-bg); box-shadow:0 3px 10px rgba(232,101,28,.42);
}
.uc-prem-star{ color:var(--uc-gold); font-size:11px; line-height:1; }

/* тело — скроллится при нехватке высоты */
.uc-body{
  flex:1 1 auto; min-height:0; overflow-y:auto; overflow-x:hidden;
  padding:20px 18px calc(16px + env(safe-area-inset-bottom,0px)); text-align:center;
}
/* уровни — канон .pc-badge: 11.5px/600, pad 4×10, r999; «Новичок»=зелёный, «Читатель»=синий */
.uc-badges{ display:flex; flex-wrap:wrap; gap:6px; justify-content:center; margin:8px 0 0; }
.uc-badges:empty{ display:none; }
.uc-badge{
  display:inline-flex; align-items:center; gap:4px; padding:4px 10px; border-radius:var(--ds-r-pill);
  font-size:11.5px; font-weight:600; white-space:nowrap; line-height:1;
  background:var(--uc-bg-2); border:1px solid var(--uc-stroke); color:var(--uc-muted);
}
.uc-badge.is-primary{ background:var(--uc-green); border-color:transparent; color:#fff; }    /* «Новичок» */
.uc-badge.is-secondary{ background:var(--uc-blue); border-color:transparent; color:#fff; }    /* «Читатель» */
[data-theme="light"] .uc-overlay .uc-badge.is-primary{ background:#2ba566; }
[data-theme="light"] .uc-overlay .uc-badge.is-secondary{ background:#2b7fd4; }

/* ФИО — основной цвет текста темы (НЕ бренд), по центру, аккуратный перенос */
.uc-name{
  margin:12px 0 3px; font-size:clamp(17px,4.4vw,19px); font-weight:700; line-height:1.25;
  color:var(--uc-text); word-break:break-word; overflow-wrap:anywhere;
}
/* одна строка: «@username · онлайн/офлайн» (§5) */
.uc-meta{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:6px;
  font-size:12.5px; font-weight:400; line-height:1.3; min-width:0;
}
.uc-meta .uc-u{ color:var(--uc-blue); font-weight:600; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.uc-meta .uc-sep{ color:var(--uc-muted-2); }
.uc-meta .uc-st{ color:var(--uc-muted); display:inline-flex; align-items:center; gap:5px; }
.uc-meta .uc-st.is-online{ color:var(--uc-green); }               /* в сети — зелёный статус проекта */
.uc-meta .uc-dot{ width:7px; height:7px; border-radius:50%; background:var(--uc-green); box-shadow:0 0 0 3px rgba(57,193,122,.16); flex:0 0 auto; }
/* дата регистрации — самый низ, крошечная, вторичная, без акцента */
.uc-since{ margin-top:12px; font-size:11px; font-weight:400; color:var(--uc-muted-2); }

/* соцсети — компактные чипы (существующие иконки/ссылки, безопасное открытие) */
.uc-socials{ display:flex; flex-wrap:wrap; gap:6px; justify-content:center; margin-top:12px; }
.uc-social{
  display:inline-flex; align-items:center; gap:5px; height:28px; padding:0 10px; border-radius:var(--ds-r-pill);
  background:var(--uc-bg-2); border:1px solid var(--uc-stroke); color:var(--uc-blue);
  font-size:12px; font-weight:600; text-decoration:none; max-width:100%;
}
.uc-social:hover{ border-color:var(--uc-blue); }
.uc-social .uc-social-h{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* действия — стек одинаковой ширины; ОДИН button-компонент по канону проекта
   (admin-buttons-canon: h28, radius999, 11px/480, pad10, gap4, svg14) + модификаторы */
.uc-actions{ display:flex; flex-direction:column; gap:8px; margin-top:16px; }
.uc-btn{
  width:100%; height:28px; border-radius:var(--ds-r-pill); border:1px solid transparent; cursor:pointer;
  font-family:inherit; font-size:11px; font-weight:480; line-height:1; letter-spacing:.01em;
  display:inline-flex; align-items:center; justify-content:center; gap:4px; padding:0 10px;
  text-decoration:none; white-space:nowrap;
  transition:filter .15s,background .15s,border-color .15s,color .15s,transform .12s;
}
.uc-btn svg{ width:14px; height:14px; flex:0 0 auto; }
.uc-btn:active{ transform:translateY(.5px); }
.uc-btn:focus-visible{ outline:2px solid var(--uc-brand-2); outline-offset:2px; }
.uc-btn--primary{ background:linear-gradient(135deg,var(--uc-brand-1),var(--uc-brand-2)); color:#fff; }
.uc-btn--primary:hover{ filter:brightness(1.06); }
.uc-btn--secondary{ background:var(--uc-bg-2); color:var(--uc-text); border-color:var(--uc-stroke); }
.uc-btn--secondary:hover{ border-color:var(--uc-muted-2); }
.uc-btn--danger{ background:rgba(255,90,106,.10); color:var(--uc-danger); border-color:rgba(255,90,106,.40); }
.uc-btn--danger:hover{ background:rgba(255,90,106,.18); }
.uc-btn--disabled,.uc-btn:disabled{ background:var(--uc-bg-2); color:var(--uc-muted); border-color:var(--uc-stroke-soft); cursor:not-allowed; }
.uc-btn--disabled:hover{ filter:none; }

/* фирменная подсказка Premium-lock (не системный title) */
.uc-msg-hint{
  margin-top:8px; font-size:12px; font-weight:400; color:var(--uc-muted-2);
  display:flex; align-items:center; justify-content:center; gap:6px; line-height:1.35;
}
.uc-empty{ padding:24px 10px; color:var(--uc-muted); font-size:14px; }

/* загрузка */
.uc-card[aria-busy="true"] .uc-body{ opacity:.55; }

/* --- responsive --- */
@media (max-width:430px){
  .uc-overlay{ padding:10px; align-items:flex-end; }
  .uc-card{ width:100%; max-height:calc(100dvh - 12px); border-radius:20px 20px 0 0; }
}
@media (max-width:340px){
  .uc-av,.uc-av-wrap{ width:78px; }
  .uc-av{ height:78px; }
}