/* Единый чат-формат для всех зеркал: лента ответов сверху, поле ввода липнет внизу.
   Ничего не «прыгает» — новое сообщение прокручивает ленту к низу, а композер
   всегда под рукой. Эталон — страница /rassvet. */

.chatw { display: flex; flex-direction: column; }

.chatw-head { /* компактная шапка диалога */ }

.chatw-body { position: relative; }

.chatw-toolrow {
  display: flex; align-items: center; justify-content: flex-end;
  gap: .6rem; min-height: 1.2rem; margin-bottom: .5rem;
}

/* Лента сообщений — растёт вверх, скроллится внутри себя */
.chatw-thread {
  max-height: min(58vh, 34rem);
  overflow-y: auto;
  display: flex; flex-direction: column; gap: .75rem;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}

/* Липкое поле ввода — всегда внизу экрана, пока виден диалог */
.chatw-composer {
  position: sticky; bottom: 0; z-index: 5;
  margin-top: .75rem; padding-top: .75rem;
  padding-bottom: max(.4rem, env(safe-area-inset-bottom));
  background: linear-gradient(180deg, transparent, rgba(10, 9, 18, .9) 26%);
}

.chatw-inputrow { display: flex; gap: .5rem; align-items: flex-end; }

.chatw-input {
  flex: 1 1 auto; min-height: 48px; max-height: 160px; resize: none;
  font-size: 16px; /* iOS не зумит при фокусе на 16px+ */
  line-height: 1.5;
}

.chatw-send, .chatw-voice { flex: 0 0 auto; }

.chatw-loader { margin-top: .5rem; }
.chatw-error { margin-top: .5rem; }

@media (max-width: 640px) {
  .chatw-thread { max-height: 60vh; }
  .chatw .mirror-bubble { max-width: 90%; }
}

/* Кликабельное название грани/раздела в речи наставника */
.grani-chip {
  display: inline-flex; align-items: center; gap: .25em;
  padding: .1em .62em; margin: 0 .12em;
  border: 1px solid rgba(234, 208, 138, .5); border-radius: 999px;
  background: rgba(234, 208, 138, .12); color: #EAD08A; text-decoration: none;
  font-size: .92em; line-height: 1.5; white-space: nowrap; transition: background .2s, border-color .2s;
}
.grani-chip:hover, .grani-chip:focus-visible { background: rgba(234, 208, 138, .24); border-color: rgba(234, 208, 138, .8); outline: none; }