/* ============================================================================
   ЕДИНЫЙ ТАЙМЛАЙН ХОДА В ЧАТЕ
   ТЗ «Единый таймлайн хода в чате» (2026-09-23), T1.1 / T1.2 / T1.4.
   Оформление — по Docs/PERPLEXITY_STYLE_GUIDE.md и
   .github/instructions/ui_style.instructions.md.

   ЧТО ЗДЕСЬ. Карточка показа хода (`.typing-indicator`), список шагов
   (`.agent-timeline` / `.at-*`) и свёрнутый след под ответом
   (`.agent-steps-*`). До этого ТЗ всё это лежало в `style.css`, в секции
   «ИНДИКАТОР ПЕЧАТИ», на легаси-палитре (#3182ce, #e2e8f0, #2d3748, #a0aec0,
   #48bb78) — самый частый экран продукта выглядел из другой эпохи, чем тулбар,
   сайдбар и модалки. Секция оттуда УДАЛЕНА: два оформления одного блока
   разъехались бы на первой же правке.

   Образцы (регламент §4 «новые элементы по образцу соседних»):
     карточка      — `.mc-modal`   (радиус 12px, тень 0 8px 32px rgba(0,0,0,.10))
     строка списка — `.canvas-item` (радиус 8px, переход 150ms ease)

   ГЛАВНОЕ РЕШЕНИЕ ВЛАДЕЛЬЦА (Р3): высота области шагов СТАТИЧНА — `height`, а
   не `max-height`. Список не меняет размер от числа шагов: иначе карточка
   дёргается на каждом шаге, а это ровно то, что раздражает при каждом запросе.
   Шесть шагов видно сразу, остальные — прокруткой.
   ============================================================================ */

/* ── Карточка ──────────────────────────────────────────────────────────────── */

.typing-indicator {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 10px 12px;
    font-family: "FK Grotesk Neue", "FKGroteskNeue", "Helvetica Neue", Arial, sans-serif;
    font-size: 13px;
    color: #13343B;
    background: #FFFFFF;
    border: 1px solid rgba(19, 52, 59, 0.10);
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.10), 0 1px 3px rgba(0, 0, 0, 0.05);

    /* Место — по центру узла диалога, как было до ТЗ (T1.1: место наследуется). */
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0.98);
    z-index: 9999;

    /* Ширина СТАТИЧНА — по той же причине, по которой статична высота (Р3).
       Пока здесь стояло `min-width: 320px; max-width: 420px`, окно дышало от
       длины текущего шага: «Готовлю ответ…» сужало карточку, длинная причина
       отказа расширяла — и карточка дёргалась по горизонтали на каждом шаге
       (замечание владельца 23.09). Теперь от содержимого не зависит ничего.
       `max-width` оставлен только как защита от узкого узла: в маленьком узле
       карточка шириной 380 px вылезла бы за его края. */
    width: 380px;
    max-width: calc(100% - 24px);
    box-sizing: border-box;

    /* Изначально скрыта; показывает класс `.show`. */
    opacity: 0;
    visibility: hidden;
    transition: opacity 150ms ease, transform 150ms ease, visibility 150ms ease;

    /* P16. Карточка прозрачна для мыши НАМЕРЕННО: она висит поверх переписки, и
       без этого правила щелчок по сообщению под ней попадал бы в карточку.
       Область шагов ниже возвращает себе события указателя — иначе требование
       «таймлайн должен скроллиться» невыполнимо: колесо уходило бы в переписку. */
    pointer-events: none;
}

.typing-indicator.show {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, -50%) scale(1);
}

/* Спиннер остался для карточки без шагов (ранние миллисекунды хода). Как только
   появился хоть один шаг, пульс активной точки говорит то же самое понятнее. */
.typing-indicator .typing-spinner {
    width: 18px;
    height: 18px;
    display: none;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.typing-indicator .typing-spinner svg {
    width: 18px;
    height: 18px;
    stroke: #20808D;
    animation: rotate-spinner 1.5s ease-in-out infinite;
    transform-origin: center center;
}

@keyframes rotate-spinner {
    0%   { transform: rotate(0deg); }
    50%  { transform: rotate(180deg); }
    100% { transform: rotate(360deg); }
}

/* Заголовок карточки: подпись режима + текущий шаг. Единственная строка, которую
   человек читает, не вглядываясь, — поэтому она основного цвета, а список тише. */
.typing-indicator .typing-text {
    display: block;
    color: #13343B;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.35;
    margin: 0 0 6px;
    overflow-wrap: anywhere;
}

/* Класс ставится, как только у карточки есть шаги. Оставлен с прежним именем:
   его читают стенды хода (manual_turn_test, разделы V). */
.typing-indicator.agent-mode .typing-spinner { display: none; }

/* ── Область шагов: статичная высота и прокрутка ───────────────────────────── */

.agent-timeline {
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
    box-sizing: border-box;
    border-top: 1px solid rgba(19, 52, 59, 0.08);
    padding-top: 6px;

    /* Р3: высота статична. `max-height` здесь был бы ошибкой — карточка снова
       начала бы расти на каждом шаге. */
    height: 180px;
    overflow-y: auto;
    overflow-x: hidden;

    /* P16: колесо мыши и скроллбар работают над списком шагов. */
    pointer-events: auto;
    overscroll-behavior: contain;
}

.agent-timeline::-webkit-scrollbar { width: 8px; height: 8px; }
.agent-timeline::-webkit-scrollbar-track { background: transparent; }
.agent-timeline::-webkit-scrollbar-thumb {
    background: rgba(19, 52, 59, 0.18);
    border-radius: 4px;
}
.agent-timeline::-webkit-scrollbar-thumb:hover { background: rgba(19, 52, 59, 0.30); }

/* ── Строка шага ───────────────────────────────────────────────────────────── */

.at-step {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 3px 6px 5px;
    border-radius: 8px;
    font-size: 12px;
    line-height: 1.35;
    flex-shrink: 0;
    transition: background 150ms ease, color 150ms ease;
}

/* Шаги не интерактивны — наведения у них нет, как у неактивных строк
   `.canvas-item`. Курсор над списком остаётся обычным. */

.at-marker {
    position: relative;
    display: flex;
    justify-content: center;
    width: 12px;
    flex-shrink: 0;
    padding-top: 3px;
}

/* Соединительная линия между маркерами. Маркеры выполненного, активного и
   немого шага занимают по высоте одинаковые 12px (3px отступа + 12px), поэтому
   линия для всех стартует с 15px; своя геометрия остаётся у «предстоит» с его
   8-пиксельным кружком. */
.at-step:not(:last-child) .at-marker::after {
    content: '';
    position: absolute;
    top: 15px;
    left: 50%;
    transform: translateX(-50%);
    width: 1px;
    height: calc(100% + 1px);
    background: rgba(19, 52, 59, 0.10);
}

.at-step.at-planned:not(:last-child) .at-marker::after {
    top: 11px;
    height: calc(100% + 5px);
}

.at-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
    box-sizing: border-box;
}

.at-body {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
    flex: 1;
}

.at-text {
    color: #13343B;
    overflow-wrap: anywhere;
}

/* Подстрочник: причина отказа, причина пропуска, объяснение молчания. Тише
   ярлыка; длинная причина переносится, а не рвёт колонку. */
.at-detail {
    color: rgba(19, 52, 59, 0.55);
    font-size: 11px;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

/* Время шага: у идущего — счётчик, у законченного — итог. Показывается только
   тем, кто шёл дольше двух секунд (T1.4), иначе список рябил бы. */
.at-time {
    flex-shrink: 0;
    color: rgba(19, 52, 59, 0.45);
    font-size: 11px;
    line-height: 1.5;
    padding-top: 1px;
    font-variant-numeric: tabular-nums;
}

/* ── Шесть статусов (T1.2) ─────────────────────────────────────────────────── */
/*
   До этого ТЗ их было три, и провалившийся шаг помечался ЗЕЛЁНОЙ ГАЛОЧКОЙ
   наравне с выполненным (P3): человек читал «Материалы сейчас недоступны ✓»
   как «всё прошло штатно». Отличить успешный ход от наполовину провалившегося
   по карточке было нельзя.
*/

/* Предстоит — пустой кружок. Виден план хода, а не только его лог. */
.at-step.at-planned .at-dot {
    background: transparent;
    border: 1.5px solid rgba(19, 52, 59, 0.20);
}
.at-step.at-planned .at-text { color: rgba(19, 52, 59, 0.45); }

/*
   Идёт сейчас — самая заметная точка карточки. Пульсирует РАСХОДЯЩИЙСЯ ОРЕОЛ
   (box-shadow), а не прозрачность: до 2026-07-28 анимация уводила opacity в
   0.5, и половину цикла активная точка была бледнее выполненных, которые горят
   постоянно, — она «гасла», а не «жила». Ореол на раскладку не влияет.
*/
.at-step.at-active .at-dot {
    width: 10px;
    height: 10px;
    margin: 1px 0;
    background: #1FB8CD;
    border: none;
    box-shadow: 0 0 0 3px rgba(31, 184, 205, 0.22);
    animation: at-pulse 1.4s ease-in-out infinite;
}
.at-step.at-active .at-text { color: #13343B; font-weight: 500; }

@keyframes at-pulse {
    0%, 100% { box-shadow: 0 0 0 3px rgba(31, 184, 205, 0.22); }
    50%      { box-shadow: 0 0 0 6px rgba(31, 184, 205, 0.06); }
}

/* Сделано — галочка вместо точки: результат читается сразу, без сверки цвета
   кружка. Глиф из CSS, поэтому разметку шага менять не пришлось. */
.at-step.at-done .at-dot,
.at-step.at-failed .at-dot,
.at-step.at-skipped .at-dot {
    width: 12px;
    height: 12px;
    background: none;
    border: none;
    border-radius: 0;
    box-shadow: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 500;
    line-height: 1;
}

.at-step.at-done .at-dot { color: #20808D; }
.at-step.at-done .at-dot::before { content: '\2713'; }
.at-step.at-done .at-text { color: rgba(19, 52, 59, 0.62); }

/* Не вышло — крестик и причина во второй строке. */
.at-step.at-failed .at-dot { color: #c53030; }
.at-step.at-failed .at-dot::before { content: '\2715'; }
.at-step.at-failed .at-text { color: #13343B; }
.at-step.at-failed .at-detail { color: rgba(197, 48, 48, 0.85); }
.at-step.at-failed { background: rgba(229, 62, 62, 0.06); }

/* Не понадобилось — прочерк и приглушённый текст. Шаг ПРИГЛУШАЕТСЯ, а не
   исчезает: иначе список прыгает, и обещанный шаг пропадает молча (T3.1). */
.at-step.at-skipped .at-dot { color: rgba(19, 52, 59, 0.35); }
.at-step.at-skipped .at-dot::before { content: '\2013'; }
.at-step.at-skipped .at-text { color: rgba(19, 52, 59, 0.45); }

/* Идёт, но подробностей нет (T3.2) — часы вместо пульса плюс честное
   объяснение, откуда молчание. Главное требование владельца: «должно
   отражаться и то, что должно делаться, но не может быть считано». */
.at-step.at-muted .at-dot {
    width: 12px;
    height: 12px;
    margin: 0;
    background: none;
    border: none;
    border-radius: 0;
    box-shadow: none;
    animation: none;
    background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23c05621' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7.5V12l3.2 2'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 12px 12px;
}
.at-step.at-muted .at-text { color: #13343B; font-weight: 500; }
.at-step.at-muted .at-detail { color: rgba(192, 86, 33, 0.90); }
.at-step.at-muted .at-time { color: #c05621; }

/* ── Свёрнутый хвост (T3.3) ────────────────────────────────────────────────── */

.at-more {
    flex-shrink: 0;
    margin: 0 6px 4px;
    padding: 3px 6px;
    border-radius: 8px;
    font-size: 11px;
    color: rgba(19, 52, 59, 0.55);
    background: rgba(19, 52, 59, 0.04);
    cursor: pointer;
    pointer-events: auto;
    user-select: none;
    transition: background 150ms ease, color 150ms ease;
}
.at-more:hover { background: rgba(19, 52, 59, 0.08); color: #13343B; }

/* ── Подсказка-подвал (T2.4) ───────────────────────────────────────────────── */
/*
   Подсказка про медленную модель раньше дописывалась прямо в заголовок
   карточки, и следующий шаг затирал её вместе с текстом: она мелькала и
   исчезала, а в агентном режиме её не было видно вовсе (P11). Теперь это
   строка подвала — вне прокрутки шагов, живёт до конца хода.
*/
.tt-tip {
    flex-shrink: 0;
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid rgba(19, 52, 59, 0.08);
    font-size: 11px;
    line-height: 1.35;
    color: rgba(19, 52, 59, 0.55);
    overflow-wrap: anywhere;
}

/* ── Полноэкранный узел ────────────────────────────────────────────────────── */
/*
   Здесь было `height: 50px !important` (в `style.css`, секция полноэкранного
   режима): при статичной области шагов такой зажим срезал бы карточку до одной
   строки. Оставляем только то, ради чего правило заводилось, — крупнее текст и
   отступы на большом экране.
*/
/*
   Живой ход теперь находится в ленте сообщений: JS оборачивает его в такую же
   реплику ассистента, в которой появляется ответ. Таймлайн не перекрывает
   переписку и после ответа мягко уступает место свёрнутой строке следа.
*/
.turn-progress-message {
    align-self: stretch;
    margin: 0;
    /* Потолка нет: реплика растёт вместе с шагами. Для анимации сворачивания
       dismiss() ставит текущую высоту в style, и переход идёт от неё к 0. */
    max-height: none;
    max-width: 100%;
    overflow: hidden;
    opacity: 1;
    transform: translateY(0);
    transition: max-height 180ms ease, margin 180ms ease, opacity 150ms ease, transform 180ms ease;
}

.turn-progress-message .turn-progress-content {
    max-width: 100%;
    padding: 12px 14px;
    border: 1px solid rgba(32, 128, 141, 0.16);
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(32, 128, 141, 0.09), rgba(246, 248, 248, 0.92));
    box-shadow: 0 1px 2px rgba(19, 52, 59, 0.04);
    cursor: default;
    user-select: none;
}

/* У обычного ответа справа зарезервировано место под меню; у хода его нет. */
.message.assistant.turn-progress-message .turn-progress-content {
    padding: 12px 14px;
}

.turn-progress-message .turn-progress-content:hover {
    background: linear-gradient(135deg, rgba(32, 128, 141, 0.11), rgba(246, 248, 248, 0.96));
}

.turn-progress-message .typing-indicator {
    position: static;
    left: auto;
    top: auto;
    z-index: auto;
    width: 100%;
    max-width: none;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    pointer-events: none;
    transition: opacity 150ms ease, transform 180ms ease, visibility 150ms ease;
}

.turn-progress-message .typing-indicator.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.turn-progress-message .typing-indicator .typing-text {
    margin-bottom: 8px;
    color: #13343B;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.005em;
}

/* В ленте чата своей прокрутки у шагов НЕТ (замечание владельца 04.10): каждый
   шаг печатается новой строкой, реплика растёт вниз, а ленту за ней докручивает
   JS. Статичная высота с прокруткой выше осталась только плавающей карточке —
   там рост закрыл бы переписку. Длинный ход по-прежнему сворачивает старые
   шаги в «ещё N шагов» (MAX_STEPS), разворот — щелчком. */
.turn-progress-message .agent-timeline {
    height: auto;
    overflow: visible;
    overscroll-behavior: auto;
    border-top-color: rgba(32, 128, 141, 0.14);
    padding-top: 7px;
}

.turn-progress-message .tt-tip { margin-top: 8px; }

/* Финал: развёрнутый ход исчезает, его однострочный след остаётся в ответе. */
.turn-progress-message.is-closing {
    max-height: 0;
    margin: 0;
    opacity: 0;
    transform: translateY(-6px);
    pointer-events: none;
}

.turn-progress-message.is-closing .turn-progress-content {
    padding-top: 0;
    padding-bottom: 0;
    border-color: transparent;
}

body.mc-layout-active .dialog-node.as-full .f-msgs > .turn-progress-message .message-content.b {
    padding: 12px 14px;
    border: 1px solid rgba(32, 128, 141, 0.16);
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(32, 128, 141, 0.09), rgba(246, 248, 248, 0.92));
    color: #13343B;
    overflow: hidden;
}

.node-fullscreen > .typing-indicator {
    padding: 12px 14px !important;
    font-size: 14px !important;
    border-radius: 12px !important;
    width: 460px !important;          /* шире, но так же статично */
}
.node-fullscreen > .typing-indicator .typing-text { font-size: 14px !important; }
.node-fullscreen > .typing-indicator .agent-timeline { height: 220px !important; }

/* ── След хода под ответом ─────────────────────────────────────────────────── */
/*
   «Что делал ассистент · N» — та же последовательность шагов, но посмертно и с
   содержанием. Ярлыки берутся из ТОГО ЖЕ каталога, что у карточки, только в
   прошедшем времени (T4.1), поэтому и оформление живёт здесь, рядом.
*/
.agent-steps-summary {
    margin-top: 8px;
    font-family: "FK Grotesk Neue", "FKGroteskNeue", "Helvetica Neue", Arial, sans-serif;
    font-size: 11px;
    color: rgba(19, 52, 59, 0.55);
}
.agent-steps-summary > summary {
    cursor: pointer;
    list-style: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    max-width: 100%;
    padding: 4px 8px;
    border: 1px solid rgba(19, 52, 59, 0.08);
    border-radius: 999px;
    background: rgba(19, 52, 59, 0.035);
    color: rgba(19, 52, 59, 0.55);
    user-select: none;
    transition: color 150ms ease, background 150ms ease, border-color 150ms ease;
}
.agent-steps-summary > summary::-webkit-details-marker { display: none; }
.agent-steps-summary > summary::before {
    content: '\25B8';
    font-size: 0.7em;
    transition: transform 150ms ease;
}
.agent-steps-summary[open] > summary::before { transform: rotate(90deg); }
.agent-steps-summary > summary:hover {
    color: #20808D;
    border-color: rgba(32, 128, 141, 0.18);
    background: rgba(32, 128, 141, 0.07);
}

/* Ход не дошёл до ответа — след урезан и помечен, чтобы его не читали как
   отчёт об успехе. */
.agent-steps-summary.is-incomplete > summary { color: #c05621; }
.agent-steps-summary.is-incomplete > summary:hover { color: #9c4419; }
.agent-steps-summary.is-incomplete .agent-steps-list {
    border-left-color: rgba(192, 86, 33, 0.35);
}

.agent-steps-list {
    margin: 4px 0 2px;
    padding-left: 12px;
    border-left: 2px solid rgba(19, 52, 59, 0.10);
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.agent-steps-item {
    color: rgba(19, 52, 59, 0.62);
    line-height: 1.35;
}
.agent-steps-item::before {
    content: '\2713 ';
    color: #20808D;
}
/* Запись следа о том, что НЕ ВЫШЛО, не должна носить галочку успеха: это тот же
   дефект P3, только посмертный. */
.agent-steps-item.is-failed::before {
    content: '\2715 ';
    color: #c53030;
}
.agent-steps-item.is-skipped::before {
    content: '\2013 ';
    color: rgba(19, 52, 59, 0.35);
}

/* Подстрочник записи следа: что именно делали и чем кончилось — «искал в
   интернете» / «курс биткоина → нашёл 5 источников». Тише ярлыка, с отступом
   под галочку, длинный запрос переносится. */
.agent-steps-detail {
    margin-left: 12px;
    color: rgba(19, 52, 59, 0.45);
    font-size: 0.95em;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

/* Источники шага следа (24.09): что именно нашлось. Раньше след говорил «нашёл 3
   источника», а какие — человек не видел нигде. Столбиком, чтобы длинные заголовки
   не склеивались в одну строку. */
.agent-steps-sources {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-left: 12px;
    font-size: 0.9em;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.agent-steps-sources a {
    color: rgba(19, 52, 59, 0.6);
    text-decoration: none;
}

.agent-steps-sources a:hover {
    color: #13343b;
    text-decoration: underline;
}

/* ==================== ИСТОЧНИКИ ОТВЕТА (Perplexity style, Docs/PERPLEXITY_STYLE_GUIDE.md) ====================
   ТЗ «Свой поисковый слой», T5.3: блок «Источники» под ответом по пакету источников и строки
   источников в «Что делал ассистент» — ОДИН образец строки (.src-item, script.js _sourceItemHtml):
   номер, метка вида текстом («документ» / «сайт» — без эмодзи, Р11), заголовок ссылкой, дата.
   Внутри пузыря ответа — без своей заливки и рамки (заливка внутри заливки — перебор). */
.src-item {
    line-height: 1.35;
    overflow-wrap: anywhere;
}
.src-n {
    color: rgba(19, 52, 59, 0.45);
    font-variant-numeric: tabular-nums;
}
.src-kind {
    color: rgba(19, 52, 59, 0.55);
    font-size: 0.92em;
}
.src-date {
    color: rgba(19, 52, 59, 0.45);
    white-space: nowrap;
}
.pack-sources {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-top: 8px;
    font-family: "FK Grotesk Neue", "Helvetica Neue", Arial, sans-serif;
    font-size: 12px;
    color: rgba(19, 52, 59, 0.62);
}
.pack-sources-head {
    font-weight: 500;
    color: rgba(19, 52, 59, 0.62);
    margin-bottom: 2px;
}
.pack-sources a {
    color: #20808D;
    text-decoration: none;
    transition: color 150ms ease;
}
.pack-sources a:hover {
    color: #13343B;
    text-decoration: underline;
}
/* Номер [n] в тексте ответа — ссылка на источник (владелец 16.10). Цвет и наведение — как у «Открыть»
   под ответом; номера, которого нет в списке источников, — приглушённый текст с подсказкой. */
.cite-ref {
    color: #20808D;
    text-decoration: none;
    cursor: pointer;
    transition: color 150ms ease;
}
.cite-ref:hover {
    color: #13343B;
    text-decoration: underline;
}
.cite-ref.cite-missing {
    color: inherit;
    opacity: 0.55;
    cursor: help;
}
.cite-ref.cite-missing:hover {
    text-decoration: none;
}
/* T6.3 / T6.4: итог проверки ссылок и записи источников в базу — тонкая линия слева, как у
   проверки ответа модели на компьютере; заметная (оранжевая) — только когда ссылка не подтверждает. */
.pack-verify {
    margin-top: 6px;
    padding: 4px 8px;
    border-left: 2px solid rgba(19, 52, 59, 0.12);
    font-family: "FK Grotesk Neue", "Helvetica Neue", Arial, sans-serif;
    font-size: 12px;
    line-height: 1.45;
    color: rgba(19, 52, 59, 0.72);
}
.pack-verify.has-problems { border-left-color: #ed8936; }
.pack-verify.is-checking { border-left-color: #20B8CD; }
.pack-verify-row { margin-top: 2px; }

/* 30.09 владелец: таймлайн хода живёт прямо в рабочем поле узла — без
   своей плашки (заливки, рамки, тени) и без пульсирующей точки-спиннера в
   левом верхнем углу. Шаги и строка «что делаю» остаются. */
.turn-progress-message .turn-progress-content,
.turn-progress-message .turn-progress-content:hover,
body.mc-layout-active .dialog-node.as-full .f-msgs > .turn-progress-message .message-content.b {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.turn-progress-message .typing-indicator .typing-spinner,
.turn-progress-message .typing-indicator .typing-dot,
.turn-progress-message .typing-indicator .typing-dots {
    display: none !important;
}

/* 30.09: лента узла — flex-колонка. Когда история длиннее окна, браузер
   сжимал элементы, и реплика хода (единственная с overflow:hidden) ужималась
   до нуля — таймлайн «пропадал» только в узлах с длинной историей. */
.turn-progress-message { flex-shrink: 0; }

/* 30.09 (владелец): «Что делал ассистент» — просто строка текста, без плашки,
   рамки и обводки фокуса. Щелчок по-прежнему раскрывает шаги. */
.agent-steps-summary > summary,
.agent-steps-summary > summary:hover,
.agent-steps-summary > summary:focus,
.agent-steps-summary > summary:focus-visible {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    outline: 0;
}
.agent-steps-summary > summary { color: var(--mc-muted, #6f6f6f); font-family: var(--mc-font, system-ui, sans-serif); }
.agent-steps-summary > summary:hover,
.agent-steps-summary > summary:focus-visible {
    color: var(--mc-ink, #1f1f1f);
    text-decoration: underline;
    text-underline-offset: 3px;
}