/* Zidos · «Пульт ходов» и «План-документ»: раскладка из компонентов макета (строки и сегмент Входящих, карточки run.css). Только токены. */

/* Контейнер экрана: прежний .section-content сделан контейнером размера, прокрутка уходит внутрь панелей. */
.section-screen .section-runs, .section-screen .section-doc { inset-block-end: 0; display: grid; grid-template-rows: auto minmax(0, 1fr); max-width: none; padding-bottom: 0; overflow: hidden; container: comp / inline-size; }
.section-screen .section-doc { grid-template-rows: minmax(0, 1fr); }
/* деталь хода до 1000 px: шапка списка скрыта, одна строка на всю высоту (в слое components это правило проигрывало строке выше) */
@media (max-width: 1000px) { .section-screen .section-runs:has(.comp-split[data-open="detail"]) { grid-template-rows: minmax(0, 1fr); flex-grow: 1; } }

/* наведение на строку хода: меняется тон фона, заголовок остаётся ink (общее правило макета красит его в action, контраст 1,5) */
.section-screen .section-row.comp-run:hover { background: var(--panel); }
.section-screen .section-row.comp-run:hover .comp-run-open strong { color: var(--ink); }
.section-screen .comp-run:hover .comp-run-action { background: var(--surface); }
.section-screen .comp-run:hover .comp-run-action:hover { background: var(--frame); }

/* Телефон: композер прижат к низу окна, плашка «Принято · Отменить» стоит над ним, а не под ним */
.section-screen .decision-toast { position: fixed; z-index: 30; left: var(--sp-12); right: var(--sp-12); bottom: calc(var(--composer-glass-height, 64px) + 24px); margin: 0 auto; max-width: 560px; }

/* висячие слова: подписи строк и статусов переносятся без одинокого последнего слова (balance), а не «€?» одним словом */
.section-screen .comp-run-open .nw { white-space: nowrap; }
.section-screen .comp-run-open .row-detail, .section-screen p.comp-quiet, .section-screen [data-doc-status] { text-wrap: balance; }
/* очередь: «Повторить» под текстом, текст получает всю ширину колонки */
/* в широкой детали хода (от 1181 px) «Повторить» помещается рядом с текстом, как в беседе */
@media (max-width: 1180px) { .section-screen .comp-pane .queue-row.is-failed { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; } }
.section-screen .comp-chat .queue-row.is-failed, .section-screen .comp-document .queue-row.is-failed { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; }
.section-screen .queue-row.is-failed .queue-handle { grid-column: 1; grid-row: 1; }
.section-screen .queue-row.is-failed .queue-body { grid-column: 2; grid-row: 1; }
.section-screen .queue-row.is-failed .queue-del { grid-column: 3; grid-row: 1; }
.section-screen .queue-row.is-failed .queue-retry { grid-column: 2; grid-row: 2; justify-self: start; }
/* «Открыть как документ» и другие капсулы на карточке: при наведении тон темнее покоя, а не белый на белом */
.section-screen .comp-card .comp-cap:hover, .section-screen .plan-card .comp-cap:hover { background: color-mix(in srgb, var(--panel) 85%, var(--muted)); }

/* R6/R7: прокрутка детали идёт под композер (композер непрозрачный, углы закрыты тоном окна), поэтому над ним нет щели со срезом; низ прокрутки с отступом на высоту композера */
.section-screen .comp-detail { position: relative; }
.section-screen .comp-detail > .composer-stack { background: var(--canvas); }
@media (min-width: 761px) {
  .section-screen .comp-detail > .composer-stack { position: absolute; left: 0; right: 0; bottom: 0; margin: 0; z-index: 2; }
  .section-screen .comp-detail-scroll { padding-bottom: calc(var(--composer-glass-height, 52px) + var(--sp-16)); }
}
/* R8: плитки тестов в документе в один ряд (общий виджет в app.css ставит столбик) */
.section-screen .comp-document .zc-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-8); }

/* после запуска не начатые шаги: пустой кружок с контуром, без серой заливки режима правки */
html:not([data-state="1"]) .section-screen .plan-step.is-pending .zc-step-dot { background: transparent; box-shadow: inset 0 0 0 1.5px var(--muted); }

/* Поле шага плана: текст переносится на строки (field-sizing), высота не меньше строки 44 px; поле остаётся строкой текста. */
.section-screen .plan-card textarea.plan-input { height: auto; min-height: var(--h-pill); max-height: none; padding: 11px var(--sp-8); border-radius: var(--radius-sm); background-color: transparent; line-height: 1.3; cursor: text; resize: none; overflow: hidden; field-sizing: content; font-family: Inter, system-ui, sans-serif; font-size: var(--fs-body); }
.section-screen .plan-card textarea.plan-input[readonly] { cursor: default; }
.section-screen .plan-card[data-editing] textarea.plan-input:not([readonly]), .section-screen .plan-card textarea.plan-input:not([readonly]):focus-visible { background-color: var(--plan-tone); }

/* Поле ввода экранов разделов получало моноширинный шрифт (.section-screen textarea): здесь шрифт интерфейса, как в беседах. */
.section-screen .composer-input textarea { font-family: Inter, system-ui, sans-serif; }

@layer components {
.comp-split { position: relative; display: grid; gap: var(--sp-24); min-height: 0; padding-bottom: var(--sp-16); }
.comp-split-runs { grid-template-columns: minmax(300px, 400px) minmax(0, 1fr); }
.comp-split-doc { grid-template-columns: minmax(0, 1fr) minmax(300px, 380px); }
.comp-list, .comp-detail-scroll, .comp-document, .comp-chat-feed { overflow-anchor: none; min-height: 0; min-width: 0; overflow-y: auto; overscroll-behavior: contain; }
.comp-list { display: grid; align-content: start; gap: var(--sp-16); padding-bottom: var(--sp-32); }
.comp-list .comp-group { margin: 0; }
.comp-rows { display: grid; gap: var(--sp-8); }

/* фильтр: пять подписей в одну строку, последняя целиком; на 390 поля кнопок уже, чем в общем сегменте */
.filters-segment .comp-filters.section-filters > button { min-width: 0; padding: 0 var(--sp-8); }
/* R30: сегменты фильтра того же кегля, что остальные кнопки (13 px) */
.section-screen .comp-filters.section-filters > button { font-size: var(--fs-small); }

/* строка хода: та же поверхность, значок и сетка, что у строк Входящих */
.comp-run { display: flex; align-items: center; gap: var(--sp-8); padding: var(--sp-8) var(--sp-8) var(--sp-8) var(--sp-12); border-radius: var(--radius-card); background: var(--surface); }
.comp-run.is-selected { background: var(--panel); }
.comp-run-open { display: flex; flex: 1 1 auto; align-items: center; gap: var(--sp-12); min-width: 0; min-height: var(--h-row); padding: 0; color: var(--ink); text-align: left; }
.comp-run-open .row-text { display: grid; gap: 2px; min-width: 0; }
.comp-run-open strong { font-size: var(--fs-body); font-weight: 600; line-height: var(--lh-title); overflow-wrap: anywhere; }
.comp-run-open .row-detail { color: var(--muted); font-size: var(--fs-small); line-height: 1.4; overflow-wrap: anywhere; }
.comp-run-action, .comp-cap { display: inline-flex; flex: none; align-items: center; justify-content: center; height: var(--h-pill); padding: 0 var(--pad-pill); border-radius: var(--radius-pill); background: var(--panel); color: var(--ink); font-size: var(--fs-small); font-weight: 550; line-height: 1.2; white-space: nowrap; }
.comp-run.is-selected .comp-run-action { background: var(--surface); }
.comp-run-action:hover, .comp-cap:hover { background: var(--frame); }
.comp-empty { padding: var(--sp-16) var(--sp-4); }

/* деталь хода */
.comp-detail { display: flex; flex-direction: column; min-height: 0; min-width: 0; }
.comp-detail-scroll { flex: 1 1 auto; display: grid; align-content: start; gap: var(--sp-12); padding-bottom: var(--sp-12); }
.comp-detail > .composer-stack { margin: var(--sp-8) 0 0; }
.comp-pane { display: grid; align-content: start; gap: var(--sp-12); min-width: 0; }
.comp-pane-head, .doc-controls { container: chathdr / inline-size; }
.comp-pane-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-8) var(--sp-16); padding: 0 var(--sp-4); }
.comp-pane-head > div:first-child { display: grid; gap: 2px; min-width: 0; }
.comp-pane-head h2 { font-size: var(--fs-h2); font-weight: var(--fw-h2); line-height: var(--lh-title); margin: 0; overflow-wrap: anywhere; }
p.comp-quiet { color: var(--muted); font-size: var(--fs-small); line-height: 1.4; overflow-wrap: anywhere; }
.comp-back { display: none; flex: none; align-items: center; gap: var(--sp-4); align-self: flex-start; height: var(--h-pill); padding: 0 var(--pad-pill) 0 var(--sp-8); border-radius: var(--radius-pill); background: var(--panel); color: var(--ink); font-size: var(--fs-small); font-weight: 550; }
.comp-back svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* карточки решений: поверхность, один главный и тихие действия */
.comp-document > .run-spacer { margin-top: calc(-1 * var(--sp-20)); }
.comp-detail-scroll > .run-spacer { margin-top: calc(-1 * var(--sp-12)); }
.comp-card { display: grid; gap: var(--sp-12); padding: var(--pad-card); border-radius: var(--radius-card); background: var(--surface); color: var(--ink); min-width: 0; }
.comp-card h3 { margin: 0; overflow-wrap: anywhere; }
.comp-lines { display: grid; gap: var(--sp-4); margin: 0; padding: 0; list-style: none; color: var(--muted); font-size: var(--fs-small); line-height: 1.4; }
.comp-lines li { overflow-wrap: anywhere; }
.comp-actions-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-8); }
.comp-primary { display: inline-flex; align-items: center; justify-content: center; height: var(--h-pill); padding: 0 var(--pad-pill); border-radius: var(--radius-pill); background: var(--action); color: var(--action-ink); font-size: var(--fs-small); font-weight: 550; line-height: 1.2; white-space: nowrap; }
.comp-note { color: var(--muted); font-size: var(--fs-small); line-height: 1.4; }
.comp-card .decision-actions { margin-top: 0; }
.comp-batch[data-resolved] .comp-lines, .comp-batch[data-resolved] .comp-actions-row, .comp-batch[data-resolved] .comp-always { display: none; }
.comp-batch { container: batch / inline-size; }
.comp-always .al-short { display: none; }
@container batch (max-width: 440px) { .comp-always .al-full { display: none; } .comp-always .al-short { display: inline; } }
.comp-always { display: inline-flex; align-items: center; height: var(--h-pill); padding: 0 var(--sp-8); white-space: nowrap; border-radius: var(--radius-pill); background: transparent; color: var(--muted); font-size: var(--fs-small); font-weight: 550; }
.comp-always:hover:not(:disabled) { background: var(--panel); color: var(--ink); }
.comp-always:disabled { opacity: .6; }
.comp-batch-actions { flex-wrap: nowrap; }
.comp-pane .plan-card, .comp-pane .comp-plan-static { background: var(--surface); --plan-tone: var(--panel); }
.comp-pane .run-queue { background: var(--surface); }
.comp-pane .queue-row { background: var(--panel); }
.comp-pane .queue-retry { background: var(--surface); }
.comp-pane .run-block { margin: 0; padding: 0 var(--sp-4); }
.comp-pane .run-block .run-body { background: var(--surface); }
.comp-plan-static .plan-text { flex: 1 1 auto; min-width: 0; padding: 0 var(--sp-8); overflow-wrap: anywhere; }
.comp-plan-static .plan-step { display: flex; align-items: center; gap: var(--sp-8); min-height: var(--h-pill); }
.comp-pane .plan-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-4) var(--sp-12); }
.comp-pane .plan-note { flex: 1 0 100%; min-height: 1lh; }
.comp-fold > span { margin-left: var(--sp-4); }
.comp-fold { display: inline-flex; align-items: center; min-height: var(--h-pill); padding: 0; background: transparent; color: inherit; font: inherit; text-align: left; }

/* документ */
.comp-document { display: grid; align-content: start; gap: var(--sp-20); padding: var(--sp-4) var(--sp-4) 0; }
.doc-head { display: grid; gap: var(--sp-4); }
.doc-title { font: var(--fw-h1) var(--fs-h1)/var(--lh-tight) Inter, system-ui, sans-serif; letter-spacing: -.045em; overflow-wrap: anywhere; }
.doc-controls { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-8); margin-top: var(--sp-8); }
.doc-top { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-12); }
.comp-chat-open { display: none; }
.doc-block { display: grid; gap: var(--sp-8); }
.doc-block > h3 { color: var(--muted); font-size: var(--fs-h4); font-weight: var(--fw-h4); line-height: var(--lh-body); }
.doc-goal { font-size: var(--fs-body); line-height: var(--lh-body); }
.doc-plan.plan-card { padding: 0; background: transparent; --plan-tone: var(--panel); }
.doc-plan-tools { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-8); }
.doc-version { display: inline-flex; align-items: center; gap: var(--sp-4); color: var(--muted); font-size: var(--fs-small); }
.doc-ver-btn { display: inline-grid; place-items: center; width: var(--h-icon); height: var(--h-icon); border-radius: 50%; color: var(--muted); font-size: var(--fs-h3); }
.doc-ver-btn:hover:not(:disabled) { color: var(--ink); background: var(--panel); }
.doc-done { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.doc-done .zc-step { display: flex; align-items: center; gap: var(--sp-8); min-height: var(--h-pill); }
.doc-done .zc-step-dot, .doc-done .zc-step.is-completed .zc-step-dot { margin-top: 0; background: var(--panel); }
.doc-done .plan-text { min-width: 0; padding: 0 var(--sp-8); overflow-wrap: anywhere; }
.doc-done .zc-step-dot svg { width: 10px; height: 10px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.doc-launch { display: flex; flex-direction: column; align-items: flex-start; gap: var(--sp-8); padding: var(--sp-12) 0; }
.doc-decide { display: grid; gap: var(--sp-12); padding: var(--sp-12) 0 var(--sp-24); }
.doc-status-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-8) var(--sp-12); }
.doc-report { display: grid; gap: var(--sp-12); }
.doc-report .run-block { margin: 0; }
.doc-report .run-block .run-body { background: var(--surface); }
.doc-proof { display: grid; gap: var(--sp-12); }
.doc-proof .zc-actions { display: none; }
.doc-proof .zc-ln { grid-template-columns: 22px 22px 10px minmax(0, 1fr); width: 100%; }
.doc-proof .zc-ln-code { white-space: pre-wrap; overflow-wrap: anywhere; padding-right: var(--sp-8); }
.comp-modes { max-width: 100%; }

@container chathdr (max-width: 440px) {
  .comp-modes > button { padding: 0 var(--sp-8); }
}

/* беседа dev справа */
.comp-chat { display: flex; flex-direction: column; min-height: 0; min-width: 0; }
.comp-chat-head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-8); padding: 0 var(--sp-4) var(--sp-8); }
.comp-chat-head h2 { font-size: var(--fs-h2); font-weight: var(--fw-h2); margin: 0; }
.comp-chat-close { display: none; align-items: center; gap: var(--sp-4); height: var(--h-pill); padding: 0 var(--pad-pill) 0 var(--sp-8); border-radius: var(--radius-pill); background: var(--panel); color: var(--ink); font-size: var(--fs-small); font-weight: 550; }
.comp-chat-close svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.comp-chat-feed { flex: 1 1 auto; display: flex; flex-direction: column; gap: var(--sp-12); padding-bottom: var(--sp-12); }
.comp-chat > .composer-stack { margin: var(--sp-8) 0 0; }

@media (max-width: 760px) {
  .comp-detail-scroll, .comp-chat-feed { padding-bottom: 96px; }
}

/* Полосы ширины. Область не уже 860 px: Пульт список (400) и деталь, Документ документ и беседа. */
.comp-list { container: list / inline-size; }
.comp-chat-open { align-items: center; justify-content: center; height: var(--h-pill); padding: 0 var(--pad-pill); border-radius: var(--radius-pill); background: var(--panel); color: var(--ink); font-size: var(--fs-small); font-weight: 550; }

/* 861-1180 с боковой панелью (окно 1024): Пульт двумя колонками, список уже; Документ одной колонкой, беседа листом */
@container comp (max-width: 1000px) {
  .comp-split-runs { grid-template-columns: 340px minmax(0, 1fr); gap: var(--sp-16); }
}
@container comp (max-width: 859px) {
  .comp-split-doc { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); }
  .comp-split-doc .comp-chat { display: none; }
  .comp-split-doc[data-chat="open"] .comp-chat { display: flex; position: absolute; inset: 0; z-index: 12; padding: var(--sp-4) 0 0; background: var(--canvas); }
  .comp-split-doc[data-chat="open"] .comp-chat-close { display: inline-flex; }
  .comp-chat-open { display: inline-flex; }
}
@container list (max-width: 345px) {
  .filters-segment .comp-filters.section-filters > button { padding: 0 var(--sp-4); }
}
@container list (max-width: 330px) {
  .comp-run .clio-row-icon { display: none; }
  .comp-run { padding-left: var(--sp-16); }
}

/* до 1000 px (планшет и телефон): Пульт списком, деталь отдельным экраном с «Ходы»; в шапке навигация разделов */
@media (max-width: 1000px) {
  .comp-split-runs { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); gap: var(--sp-24); }
  .comp-split-runs[data-open="list"] .comp-detail, .comp-split-runs[data-open="detail"] .comp-list { display: none; }
  .comp-back { display: inline-flex; margin-bottom: var(--sp-8); }
  .section-runs:has(.comp-split[data-open="detail"]) > .screen-heading { display: none; }
}
@media (min-width: 761px) and (max-width: 1000px) {
  .section-screen-runs .section-header, .section-screen-doc .section-header { display: flex; justify-content: space-between; align-items: center; gap: var(--sp-12); min-height: 64px; padding: var(--sp-8) var(--sp-16); background: var(--canvas); }
  .section-screen-runs .section-header .section-profile, .section-screen-doc .section-header .section-profile { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; background: transparent; }
  .section-screen-runs .section-header h1, .section-screen-doc .section-header h1 { display: none; }
  .section-screen-runs .section-profile .avatar, .section-screen-doc .section-profile .avatar { width: 44px; height: 44px; border-radius: 50%; background: var(--panel); }
  .section-screen-runs .section-nav-capsule, .section-screen-doc .section-nav-capsule { display: flex; gap: 3px; padding: var(--sp-4); border-radius: var(--radius-pill); background: var(--panel); }
  .section-screen-runs .section-nav-capsule a, .section-screen-doc .section-nav-capsule a { display: grid; place-items: center; width: 48px; height: 44px; border-radius: var(--radius-pill); color: var(--muted); }
  .section-screen-runs .section-nav-capsule svg, .section-screen-doc .section-nav-capsule svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
}
}

@layer state {
  .run-queue[data-folded] .queue-list { display: none; }
  .plan-card[data-folded] :is(.plan-steps, .plan-add, .plan-actions, .plan-note) { display: none; }
  html[data-state="1"] .doc-decide { display: none; }
  .comp-pane[hidden], .comp-card[hidden], .comp-group[hidden], .comp-empty[hidden] { display: none; }
}


/* деталь хода открывается у конца (comp.js), шапка хода закреплена сверху прокрутки, как шапка беседы */
.section-screen .comp-detail-scroll .comp-pane-head { position: sticky; top: 0; z-index: 2; background: var(--canvas); }

/* ≤1180: шапка детали runs в две строки (название + пилюли / статус + ссылка), очередь свёрнута тихой строкой как «Zidos работает… ▸» */
@media (max-width: 1180px) {
  .section-screen-runs .comp-pane-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--sp-4) var(--sp-12); }
  .section-screen-runs .comp-pane-head > div:first-child { display: contents; }
  .section-screen-runs .comp-pane-head h2 { grid-area: 1 / 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; overflow-wrap: normal; }
  .section-screen-runs .comp-pane-head .run-ctl { grid-area: 1 / 2; flex: none; }
  .section-screen-runs .comp-pane-head p.comp-quiet { grid-area: 2 / 1; min-width: 0; }
  .section-screen-runs .comp-pane-head .comp-cap { grid-area: 2 / 2; justify-self: end; height: auto; min-height: 24px; padding: 0; background: transparent; color: var(--muted); font-size: var(--fs-small); }
  .section-screen-runs .comp-pane-head .comp-cap::after { content: " ›"; margin-left: var(--sp-4); }
  .section-screen-runs .comp-pane-head .comp-cap:hover { background: transparent; color: var(--ink); }
  .section-screen .comp-detail .run-queue[data-folded] { padding: 0; background: transparent; }
  .section-screen .comp-detail .run-queue[data-folded] .queue-title { padding: 0; }
  .section-screen .comp-detail .run-queue[data-folded] .comp-fold { color: var(--muted); font-size: var(--fs-small); font-weight: 400; }
}
/* телефон (деталь отдельным экраном): название целиком, статус + пилюля, ссылка на беседу строкой 44 px */
@media (max-width: 860px) {
  .section-screen-runs .comp-pane-head h2 { grid-area: 1 / 1 / 2 / 3; overflow: visible; text-overflow: clip; white-space: normal; overflow-wrap: anywhere; }
  .section-screen-runs .comp-pane-head .run-ctl { grid-area: 2 / 2; }
  .section-screen-runs .comp-pane-head p.comp-quiet { grid-area: 2 / 1; }
  .section-screen-runs .comp-pane-head .comp-cap { grid-area: 3 / 1 / 4 / 3; justify-self: start; display: inline-flex; align-items: center; min-height: 44px; }
}

/* список ходов ≤1180: права из меты строки уходят (они в пилюле детали), чтобы « ·» не висел на конце строки */
@media (max-width: 1180px) { .section-screen-runs .row-perm { display: none; } }

/* doc: одобрение, пока ход ждёт, — одна строка под колонкой документа, вне прокрутки: содержимое не перекрывается, лента просто становится ниже; пропадает, когда карточка решения в окне */
.comp-doc-col { display: flex; flex-direction: column; gap: var(--sp-12); min-height: 0; min-width: 0; }
.comp-doc-col > .comp-document { flex: 1 1 auto; }
.comp-doc-col.is-reserving { padding-bottom: calc(var(--approval-outer, 56px) + var(--sp-12)); }
.doc-approval { flex: none; display: flex; align-items: center; gap: var(--sp-8); box-sizing: border-box; width: calc(100% - var(--sp-8)); min-width: 0; max-width: 100%; height: 56px; margin: 0 var(--sp-4) var(--approval-bottom, 0px); padding: 0 6px 0 var(--sp-16); border-radius: var(--radius-pill); background: var(--surface); }
.doc-approval[hidden] { display: none; }
.doc-approval-text { flex: 1 1 auto; min-width: 0; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); font-size: var(--fs-small); font-weight: 500; }
.doc-approval > button { flex: none; }
/* узкая колонка: вопрос целиком сверху, под ним кнопки в ряд */
@media (max-width: 560px) { .doc-approval { flex-wrap: wrap; align-content: center; height: auto; min-height: 56px; padding: var(--sp-8) 6px; row-gap: var(--sp-4); } .doc-approval-text { flex: 1 0 100%; white-space: normal; overflow: visible; padding: 0 var(--sp-8); } }

/* Автовход: тихая строка вверху колонки документа, без плашки и линий */
.section-screen .doc-long:not([hidden]) { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--sp-8); min-height: var(--h-pill); color: var(--muted); font-size: var(--fs-small); }
.section-screen .doc-long a { display: inline-flex; align-items: center; min-height: var(--h-pill); color: var(--ink); font-weight: 550; }
.section-screen .doc-long-x { display: inline-flex; align-items: center; justify-content: center; width: var(--h-pill); height: var(--h-pill); margin-left: auto; border-radius: var(--radius-pill); color: var(--muted); font-size: var(--fs-body); }
.section-screen .doc-long-x:hover { background: var(--panel); color: var(--ink); }
@media (max-width: 560px) {
  .section-screen .doc-long:not([hidden]) { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 0 var(--sp-8); min-height: calc(var(--h-pill) * 2); }
  .section-screen .doc-long:not([hidden]) > span:first-child { grid-area: 1 / 1; }
  .section-screen .doc-long-sep { display: none; }
  .section-screen .doc-long-x { grid-area: 1 / 2; margin-left: 0; }
  .section-screen .doc-long a { grid-area: 2 / 1 / 3 / 3; justify-self: start; }
}

/* появление строки одобрения и листа беседы на узком окне: затухание и короткий подъём, без перелёта */
@layer motion {
  .doc-approval:not([hidden]) { animation: doc-fade var(--dur-sheet, 300ms) var(--ease, cubic-bezier(.32, .72, 0, 1)) both; }
  .comp-split-doc[data-chat="open"] .comp-chat { animation: doc-rise var(--dur-sheet, 300ms) var(--ease, cubic-bezier(.32, .72, 0, 1)) both; }
  @keyframes doc-rise { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
  @media (prefers-reduced-motion: reduce) { .doc-approval:not([hidden]), .comp-split-doc[data-chat="open"] .comp-chat { animation-name: doc-fade; animation-duration: 120ms; } }
  @keyframes doc-fade { from { opacity: 0; } to { opacity: 1; } }
}