.work-pane-tabs{gap:6px;white-space:nowrap}
.work-pane-tablist{display:flex;gap:6px;align-items:center;min-width:0}
.chat-ai-desktop{display:flex;flex:none}
.work-pane-tabs .chat-ai-control{white-space:nowrap}
.chat-ai-control{display:inline-flex;align-items:center;justify-content:center;gap:5px}
.chat-ai-mode-icon{width:14px;height:14px;flex:none}
.chat-ai-symbol{position:relative;display:inline-flex;width:19px;height:19px;flex:none}
.chat-ai-symbol>.chat-ai-mode-badge{position:absolute;right:-1px;bottom:-1px;width:11px;height:11px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--bg)}
.chat-ai-control[aria-pressed=true] .chat-ai-mode-badge{background:var(--text)}
.chat-header-actions .chat-ai-mode-badge svg{width:11px;height:11px}
.work-pane-tabs .chat-ai-control[aria-pressed=true]{background:var(--text);color:var(--bg);border-color:var(--text)}
.chat-header-actions{display:flex;align-items:center;gap:8px;flex:none}
.chat-header-actions .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px}
.chat-header-actions svg{width:20px;height:20px;flex:none}
.chat-header-actions .chat-header-mobile{display:none}
.chat-header-actions .dialogs-info-button{display:none}
.chat-header-actions .dialogs-info-button svg{display:none}
.chat-header-back{width:32px;padding:0}
/* ⚠️ Зона касания крестика — 44×44 (п. 256, жалоба с iPhone Pro Max:
   «иногда тормозит и не закрывает»). Сама кнопка остаётся 32 px, чтобы
   шапка чата не выросла, а палец ловится увеличенной областью: на
   большом экране верхний правый угол — самое неудобное место для правой
   руки, и промах по цели 31×31 читается как «не сработало».
   Замер 30.10.2026: касание срабатывало 20 раз из 20 (задержка 109–146 мс),
   то есть обработчик исправен — дело в размере цели.
   Область растёт наружу через ::after и не влияет на раскладку. */
@media (pointer: coarse) {
  .chat-header-back{position:relative}
  .chat-header-back::after{content:"";position:absolute;
    top:50%;left:50%;transform:translate(-50%,-50%);
    width:44px;height:44px;border-radius:50%}
}
.work-channel[aria-label=Telegram]{color:var(--text2)}
.dialogs,.work-drawer{--chat-header-height:41px}
.work-drawer>.work-tenant-head,.dialogs-head{box-sizing:border-box;min-height:var(--chat-header-height);padding:2px 12px}
.work-title-input{box-sizing:border-box;height:22px;min-height:22px;line-height:20px;padding:0 4px}
.work-deal-number{justify-self:start;max-width:100%;font-family:var(--mono,ui-monospace,monospace);font-size:11px;line-height:14px;min-height:14px;padding:0 4px;border:0;border-radius:4px;background:transparent;color:var(--text2);text-align:left;cursor:copy}
.work-deal-number:hover{background:var(--hover);color:var(--text)}
/* Кнопка «ID» — только на телефоне: на компьютере номер виден строкой. */
/* ⚠️ Кнопка «ID» — ТОЛЬКО на телефоне (п. 199). Одного
   `.work-id-button{display:none}` не хватало: у кнопки есть класс
   `btn`, и его правило перебивало скрытие — кнопка висела и на 1920,
   и на 1440 (замерено 28.10.2026). Селектор усилен обоими классами. */
.chat-header-actions .btn.work-id-button,
button.work-id-button.work-id-button{display:none}
.work-deal-number:focus-visible,.chat-header-actions button:focus-visible{outline:2px solid var(--text);outline-offset:2px}
.work-window-body{grid-template-columns:minmax(0,1fr) 400px}
/* ⚠️ Со списком диалогов слева колонок ТРИ (п. 152, Д89): список,
   переписка, карточка. Ширина списка — как на экране «Диалоги», чтобы
   окно было одно и то же в обоих путях. */
/* ⚠️ Две строки: шапка стоит ТОЛЬКО над перепиской (п. 185), а список
   и правая панель тянутся на всю высоту. Прежде шапка шла над всем
   окном, и вкладки «Информация / Задачи / ИИ ответы» оказывались ниже
   неё — в «Диалогах» они на одном уровне. */
.work-window-body--with-list{grid-template-columns:300px minmax(0,1fr) 400px;
  grid-template-rows:auto minmax(0,1fr)}
.work-window-body--with-list>.dialogs-list{grid-column:1;grid-row:1 / span 2}
.work-window-body--with-list>.work-head{grid-column:2;grid-row:1}
.work-window-body--with-list>.work-conversation{grid-column:2;grid-row:2;min-height:0}
.work-window-body--with-list>.work-person-pane{grid-column:3;grid-row:1 / span 2}
/* ⚠️ Высота ОГРАНИЧЕНА, иначе `.dialogs-rows{overflow-y:auto}` не
   прокручивается: список тянулся по содержимому и уезжал за окно
   (п. 180). */
.work-window-body--with-list .dialogs-list{min-width:0;min-height:0;
  border-right:1px solid var(--line);overflow:hidden}
.work-window-body--with-list .dialogs-rows{min-height:0;overflow-y:auto}
@media(min-width:1101px){.dialogs{grid-template-columns:var(--dialog-list-width) minmax(0,1fr) 360px}}
@media(min-width:981px) and (max-width:1100px){
  .chat-header-actions .dialogs-info-button{display:inline-flex}
  .dialogs[data-info=true] .dialogs-summary{width:360px}
}
@media(max-width:980px){
  .dialogs,.work-drawer{--chat-header-height:39px}
  .work-tenant-head{grid-template-columns:minmax(0,1fr) auto}
  .work-tenant-head .work-heading{grid-column:auto}
  .work-drawer>.work-tenant-head,.dialogs-head{box-sizing:border-box;min-height:var(--chat-header-height);padding:2px 8px;gap:8px;flex-wrap:nowrap}
  .work-heading,.dialogs-title{min-width:0;flex:1 1 auto}
  .work-title-input{box-sizing:border-box;height:20px;min-height:20px;line-height:18px;padding:0 4px}
  /* ⚠️ На телефоне номер строкой НЕ показываем (п. 196): он уходит
     под кнопку «ID» в ряду справа, левее конверта. */
  .work-deal-number{display:none}
  .chat-header-actions .btn.work-id-button,
  button.work-id-button.work-id-button{display:inline-flex;align-items:center}
  .chat-header-actions{display:flex;flex-wrap:nowrap;gap:6px}
  .chat-header-actions .chat-header-mobile{display:flex}
  .chat-header-actions .dialogs-info-button{display:inline-flex;margin:0}
  .chat-header-actions .dialogs-info-button svg{display:block}
  .chat-header-actions .btn{box-sizing:border-box;width:31px;height:31px;min-width:31px;min-height:31px;padding:6px;border-radius:7px}
  .chat-header-actions svg{width:16px;height:16px}
  .chat-header-label,.chat-ai-desktop{display:none}
  .work-window-body{display:flex}
  /* На узком экране список слева не показываем: он занял бы его
     целиком. Возврат к списку — кнопкой «Назад», как было. */
  .work-window-body--with-list{grid-template-columns:none}
  .work-window-body--with-list .dialogs-list{display:none}
  .work-window-body>section,.work-window-body>aside{flex:1;min-width:0}
  .work-window-body[data-mobile-pane=chat] .work-person-pane{display:none}
  .work-window-body[data-mobile-pane=info] .work-conversation{display:none}
  .work-person-pane{border-left:0}
  .dialogs[data-info=true] .dialogs-summary{position:absolute;inset:var(--chat-header-height) 0 0;z-index:3;width:auto!important;box-sizing:border-box;box-shadow:none}
  .dialogs[data-info=true] :is(.dialogs-history,.work-chat-compose,.chat-jump-row){visibility:hidden}
  .dialogs-summary .dialogs-info-close{display:none}
  .dialogs-head{display:grid;grid-template-columns:minmax(0,1fr) auto}
  .dialogs-head .dialogs-read-button{grid-column:1/-1;min-height:32px;font-size:12px}
  .dialogs:has(.dialogs-read-button){--chat-intake-space:40px}
  .dialogs:has(.dialogs-read-button)[data-info=true] .dialogs-summary{top:calc(var(--chat-header-height) + var(--chat-intake-space))}
}
