/* ============================================================
   YAZME · ПОЗВАТЬ ЧЕЛОВЕКА К ПЕРСОНАЖУ   (persona/assets/chat_invite.css)

   Только кнопка в капсуле ввода и содержимое её шторки. Шторка, строки
   и кнопки — общие (ui.css, chat.css), здесь лежит то, чего в системе нет.
   ============================================================ */

/* Кнопка слева в капсуле: тот же вид и посадка, что у звёздочки в чате с
   людьми (dm.css .ch-call) — плоская иконка без плашки. Кружок здесь один,
   и он принадлежит «Отправить». Капсула держит слева запас под текст — с
   кнопкой он не нужен, иначе она стоит в углублении. Класс свой (invite), а
   не общий people из dm.css: два листа не должны спорить за одно имя. */
.ch-inputrow.invite{ padding-left:var(--sp1); gap:2px; }
.ch-inputrow.invite .ch-input{ padding-left:var(--sp1); }
.ch-invite{
  flex:none; align-self:flex-end; width:40px; height:var(--ctl);
  display:grid; place-items:center; border-radius:var(--r-full);
  background:none; border:0; padding:0; cursor:pointer; color:var(--hero);
  -webkit-tap-highlight-color:transparent;
  transition:transform var(--d-micro) var(--e-spring-soft), background var(--d-micro) var(--e-effect);
}
.ch-invite .pv-ic{ width:22px; height:22px; }
.ch-invite:active{ transform:scale(.9); }
.ch-invite[aria-expanded="true"]{ background:var(--hero-lo); }
.ch-invite:focus-visible{ outline:var(--focus-w) solid var(--focus); outline-offset:calc(var(--focus-off) * -1); }
/* Во время записи голоса место уходит расшифровке — кнопка прячется. */
.ch-inputrow.rec .ch-invite{ display:none; }

/* Содержимое шторки */
.ci-sub{
  margin:0 0 var(--sp3); padding:0 var(--sp4);
  color:var(--t3); font:400 var(--fs-small)/1.4 var(--f-ui);
}
.ci-fine{
  margin:var(--sp1) 0 var(--sp3); padding:0 var(--sp1);
  color:var(--t3); font:400 var(--fs-over)/1.5 var(--f-ui);
}
.ci-empty{
  padding:var(--sp4) var(--sp4) var(--sp5);
  color:var(--t3); font:400 var(--fs-small)/1.5 var(--f-ui); text-align:center;
}

/* Ряд друзей: лица, а не список строк — выбирают по лицу */
.ci-faces{
  display:flex; gap:var(--sp3); overflow-x:auto; scrollbar-width:none;
  padding:0 var(--sp4) var(--sp4); overscroll-behavior-x:contain;
}
.ci-faces::-webkit-scrollbar{ display:none; }
.ci-face{
  flex:none; width:64px; display:flex; flex-direction:column; align-items:center; gap:var(--sp2);
  background:none; border:0; padding:0; cursor:pointer; color:var(--t2);
  font:500 var(--fs-over)/1.2 var(--f-ui);
}
/* Размер лица задаём здесь, а не классом pv-mono.lg: тот на широком экране
   вырастает до 104px и вылезает из колонки. */
.ci-face .pv-mono{ width:56px; height:56px; font-size:24px; }
.ci-face:focus-visible{ outline:var(--focus-w) solid var(--focus); outline-offset:var(--focus-off); border-radius:var(--r-md); }
.ci-face b{ font-weight:500; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ci-face:active{ transform:scale(.96); }
.ci-ph{ position:relative; display:block; }
.ci-ph.on::after{
  content:''; position:absolute; right:1px; bottom:1px; width:12px; height:12px; border-radius:var(--r-full);
  background:var(--win); box-shadow:0 0 0 2px var(--s2);
}

/* Строка «Ссылка-приглашение» — акцентная: ради неё сюда и заходят те,
   у кого друзей на сайте ещё нет. */
.ch-sheet-row.ci-hero{ color:var(--hero); }
.ci-ico{
  width:var(--ctl-vis, 36px); height:var(--ctl-vis, 36px); flex:none; border-radius:var(--r-full);
  display:grid; place-items:center; background:var(--hero-lo); color:var(--hero);
}
.ci-ico .pv-ic{ width:17px; height:17px; }

/* Экран подтверждения */
.ci-head{
  display:flex; align-items:center; gap:var(--sp2);
  padding:0 var(--sp4) var(--sp3);
}
.ci-head .pv-mono{ width:44px; height:44px; font-size:19px; }
.ci-head .pv-mono + .pv-mono{ margin-left:calc(var(--sp3) * -1); box-shadow:0 0 0 2px var(--s2); }
.ci-head-tx{ min-width:0; margin-left:var(--sp2); }
.ci-head-tx b{ display:block; font:600 var(--fs-body)/1.25 var(--f-ui); color:var(--t1); }
.ci-head-tx small{ display:block; color:var(--t3); font:400 var(--fs-small)/1.3 var(--f-ui); }
.ci-notes{
  margin:0 0 var(--sp4); padding:0 var(--sp4); list-style:none;
  display:flex; flex-direction:column; gap:var(--sp2);
}
.ci-notes li{
  position:relative; padding-left:var(--sp4);
  color:var(--t2); font:400 var(--fs-small)/1.45 var(--f-ui);
}
.ci-notes li::before{
  content:''; position:absolute; left:0; top:7px; width:5px; height:5px;
  border-radius:var(--r-full); background:var(--hero);
}

/* Сама ссылка: её копируют глазами, когда не сработал буфер обмена */
.ci-link{
  margin:0 var(--sp1) var(--sp3); padding:var(--sp3) var(--sp4);
  border:1px dashed var(--hair2); border-radius:var(--r-md); background:var(--s1);
  color:var(--t2); font:500 var(--fs-small)/1.4 var(--f-ui);
  word-break:break-all; user-select:all; -webkit-user-select:all;
}

/* Кнопки в шторке идут столбиком и не липнут друг к другу. Правило узкое:
   шторка общая с чатом персонажа, и чужие кнопки в ней трогать нельзя. */
.ci-acts{ display:flex; flex-direction:column; gap:var(--sp2); padding:0 var(--sp1) var(--sp2); }
.ci-acts .pv-btn{ width:100%; }

/* Чип «Общий чат с …» в строке над полем: тот же вид, что у чипа режима,
   но ведёт наружу — в общую переписку. */
.ch-mchip.ci-room{ text-decoration:none; color:var(--t2); max-width:46vw; }
.ch-mchip.ci-room .tx{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ch-mchip.ci-room .pv-ic{ color:var(--hero); }
/* На телефоне строка чипов переносится со второго чипа — подпись прячем,
   остаётся иконка (так же поступает чип тарифа, см. .ch-mchip.plan). */
@media (max-width: 460px){ .ch-mchip.ci-room .tx{ display:none; } }