/* ── карточка «что мы уже поняли» в начале ленты ──
     Собранное по ходу разговора не должно жить только в тексте реплик: перечитывать
     диалог, чтобы вспомнить, назвал ли ты чек, — работа за пользователя. Карточка
     растёт блоками: слот заполнился — блок появился, и это видно сразу. */
  .brief { text-align:center; padding:6px 0 4px; margin-bottom:4px }
  .brief svg { color:var(--ink-strong) }
  /* product_type у агента развёрнутый («полезные йогурты со вкусом клубники») —
     заголовку нужна колонка с переносом, а не строка во всю ленту */
  /* Кегль — --fs-title, тот же, что у «Создать рекламную кампанию» и «Что
     продаете?». Это один и тот же ход разговора: экран называет, о чём он.
     Раньше здесь стояли 44px (ступень --fs-section), и документ выходил на
     ступень мельче всех остальных экранов чата — на фоне прототипа это и
     читалось «шрифт меньше». */
  .brief h2 { margin:10px auto 0; max-width:16em; font-family:var(--font-display);
              font-size:var(--fs-title); line-height:var(--lh-title); font-weight:700;
              letter-spacing:0; color:var(--ink); text-wrap:balance }
  /* Отбивка от названия — 12px, как у «Что продаете?»: там та же пара
     «--fs-title заголовочным + строка рукописным». Прежние 6px были посчитаны
     под заголовок в 44px; под 65px с интерлиньяжем 86% подпись подъезжала
     вплотную и читалась строкой того же блока, а не подписью под ним. */
  .brief .pos { margin:12px 0 0; font-family:var(--font-script); font-weight:300;
                font-size:var(--fs-lead-sm); line-height:var(--lh-lead-sm); color:var(--ink-strong) }
  .brief-rule { margin:16px 0 12px; color:var(--line) }
  .brief-rule svg { display:block; width:100%; height:9px }
  /* Факты в строку, а не списком: их пять-шесть коротких, и столбик из них
     занял бы пол-экрана над первым же сообщением. */
  .brief-facts { display:flex; flex-wrap:wrap; justify-content:center; gap:9px 22px }
  .brief-fact { display:inline-flex; align-items:flex-start; gap:6px; max-width:100%;
                font-size:var(--fs-fact); line-height:1.35; letter-spacing:var(--ls-fact);
                color:var(--ink-strong); text-align:left }
  .brief-fact svg { flex:0 0 auto; margin-top:1px; color:var(--ink-strong) }
  .brief-fact.wide { flex:0 0 100%; justify-content:center }
  .brief-fact .n { color:var(--ink-muted) }
  /* Иерархия карточки. Ради двух вещей её и читают: что это за продукт
     (заголовок) и чем он отличается (УТП). Всё остальное — бренд, город, чек,
     цель, кому показываем — справка, которую сверяют, а не читают.
     Раньше все значения стояли на одном весе (480), и справка спорила с УТП.
     Теперь справка на обычном весе факта, УТП — на выделенном.

     Выделяем осью, а не кеглем и не цветом: правило системы. Подпись от
     значения при этом по-прежнему отличима — она приглушена цветом. */
  .brief-fact b { font-variation-settings:var(--axis-active); font-weight:400 }
  .brief-fact .v { font-variation-settings:var(--axis-fact); font-weight:400 }
  .brief-fact[data-k="usp"] .v { font-variation-settings:var(--axis-active) }
  .brief-fact a { color:inherit }
  /* Пустые слоты остаются в разметке: карточку правим на месте (см. renderBrief),
     а не пересобираем — пересборка перерисовывает блок целиком и читается как мигание. */
  .brief h2:empty, .brief .pos:empty, .brief-facts:empty { display:none }
  /* Новый факт подсвечивается один раз: это ответ на реплику, которую человек
     только что отправил, и связь «сказал → записали» должна быть видна.
     Это НЕ появление блока и не исключение из общего .pp-in: карточка уже на
     экране, в ней построчно прибавляется содержимое, пока человек на неё
     смотрит. Приезд справа на 96px тут был бы не тем событием — рядом
     соседний факт в это же время просто мигает (.brief-fact.is-upd), и два
     разных по силе движения на соседних строках выглядят поломкой. */
  @keyframes brief-in { from { opacity:0; transform:translateY(-3px) } to { opacity:1; transform:none } }
  .brief-fact.is-new { animation:brief-in .28s ease both }
  /* Поправленный факт (чек назвали заново) подсвечиваем мягче нового: блок на месте,
     сменилось только значение — сдвигать его незачем. */
  @keyframes brief-upd { from { opacity:.3 } to { opacity:1 } }
  .brief-fact.is-upd { animation:brief-upd .32s ease both }
  /* ── правка карточки по клику ──
     Подсказка появляется ПОД КУРСОРОМ и только под ним. Раньше подчёркивание
     стояло всегда, и карточка читалась бланком: шесть линеек в покое — это уже
     не намёк, а разлиновка, а система линеек не знает вовсе (единственная
     разрешённая линия — рисованный штрих .pp-rule).
     Хуже всего было заголовку и отрасли: это блоки во всю карточку, и линейка
     тянулась на всю ширину под словом в двадцать букв — ровно вид пустого поля
     ввода. У фактов подчёркивание хотя бы обнимало текст.
     Что карточку правят, говорит курсор: над правимым значением он текстовый. */
  .brief-fact.can-edit .v, .brief h2.can-edit, .brief .pos.can-edit { cursor:text;
     border-radius:4px }
  .brief-fact.can-edit .v:hover, .brief h2.can-edit:hover, .brief .pos.can-edit:hover {
     background:var(--ink-faint); box-shadow:inset 0 -1px 0 rgb(0 0 0 / .35) }
  /* Шаг пройден — приглашение к правке снимаем целиком: подчёркивание, курсор и
     подсветку. Карточка остаётся такой же читаемой, просто перестаёт быть формой. */
  .brief.ro .can-edit, .brief.ro .can-edit:hover, .brief.ro .brief-fact.can-edit .v,
  .brief.ro .brief-fact.can-edit .v:hover { cursor:default; box-shadow:none; background:none }
  .brief-edit { font:inherit; color:inherit; letter-spacing:inherit; text-align:inherit;
     background:var(--paper); border:0; box-shadow:var(--shadow-chip);
     border-radius:var(--radius-hit); padding:2px 8px; max-width:100% }
  .brief-edit:focus { outline:1.5px solid var(--ink); outline-offset:2px }
  .saving { opacity:.5 }
  /* ── тихий режим сбора описания ──
     Показывать всю переписку незачем: пересказ «Понял: …» дублирует карточку, а свои
     реплики человек и так помнит. На экране остаётся то, что требует действия —
     текущий вопрос. Прячем ТОЛЬКО реплики: карточки-артефакты и индикатор шага
     («Собираю параметры аудитории») остаются, без них ход выглядит зависанием. */
  .wrap.quiet .row:not(.think):not(.err) { display:none }
  .ask { text-align:center }
  .ask .q { margin:0 auto; max-width:32em; font-family:var(--font-script); font-weight:300;
            font-size:var(--fs-lead); line-height:var(--lh-lead); color:var(--ink-strong) }
  .ask .q:empty { display:none }   /* подбор прошёл — остаётся одна кнопка */
  .wrap:not(.quiet) .ask .q { display:none }   /* лента раскрыта — вопрос и так последний в ней */
  .ask-t { margin-top:13px; border:0; background:transparent; font:inherit; font-size:12.5px;
           color:var(--muted); cursor:pointer; padding:5px 9px; border-radius:8px }
  .ask-t:hover { background:var(--ink-faint); color:var(--ink) }