/* Карточка сделки и партнёрства — страница записи (упаковка Attio, решение Кирилла 19.10; компоновка — по макету записи): слева
   панель фактов, разделитель (ширина тянется и запоминается — record-layout.ts), справа блок действия, предложения AI полосой и
   вкладки с иконками и числами. */
.deal-card { display: flex; flex-direction: column; gap: 14px; }
/* Левая панель — не шире 40% записи: при узком окне правая часть не зажимается. */
.record { display: grid; grid-template-columns: min(var(--record-left, 360px), 40%) 1px minmax(0, 1fr); align-items: stretch;
  min-height: calc(100vh - 80px); }
.record-left { min-width: 0; display: flex; flex-direction: column; gap: 10px; padding: 16px 14px 32px 20px; }
.record-main { min-width: 0; display: flex; flex-direction: column; gap: 12px; padding: 16px 20px 40px; container-type: inline-size;
  container-name: record-main; }
/* Карточка сделки по макету: левая панель — от шапки записи, справа поля задают сами блоки (вкладки — во всю ширину). */
.record-left.deal-head { gap: 0; padding-top: 20px; }
.record-main.deal-main { gap: 0; padding: 16px 0 40px; }
/* Правая часть узкая (широкая левая панель, узкое окно) — блок действия, плитки и обзор партнёра в одну колонку. */
@container record-main (max-width: 720px) {
  .record-main .card-grid, .record-main .record-action { grid-template-columns: minmax(0, 1fr); }
  .record-main .act-side { border-left: 0; border-top: 1px solid var(--color-line); }
  .record-main .tiles { grid-template-columns: minmax(0, 1fr); }
  .record-main .tile.span2, .record-main .tile.span3 { grid-column: auto; }
  .record-main .critlist { grid-template-columns: minmax(0, 1fr); }
}
.record-resize { position: relative; background: var(--color-border-soft); cursor: col-resize; touch-action: none; outline: none; }
.record-resize::before { content: ""; position: absolute; top: 0; bottom: 0; left: -5px; right: -5px; z-index: 5; }
.record-resize::after { content: ""; position: absolute; top: 0; bottom: 0; left: -1px; width: 3px; background: transparent; transition: background-color .12s; }
.record-resize:hover::after, .record-resize.active::after, .record-resize:focus-visible::after { background: var(--color-signal-primary); }

/* Шапка левой панели: компания ссылкой с плиткой и отраслью, название крупно, закрытие, кнопки. */
.rec-head { display: grid; gap: 8px; padding: 0 4px 16px; }
.rec-back { justify-self: start; font-size: 12px; }
.rec-company { display: flex; align-items: center; gap: 8px; min-width: 0; font-size: 15px; }
.rec-company > .muted { flex: none; font-size: 13px; white-space: nowrap; }
.rec-title { margin: 0; font-size: 21px; font-weight: 600; line-height: 1.25; letter-spacing: -.01em; overflow-wrap: anywhere; }
.rec-closed { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; color: var(--color-text-muted); font-size: 12.5px; }
.rec-closed-by { margin: 0; font-size: 12.5px; overflow-wrap: anywhere; }
.rec-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 6px; }
.rec-actions .secondary { min-height: 28px; padding: 0 10px; gap: 6px; }
/* Звёздочка — квадратная кнопка с рамкой; в избранном — закрашена тёмным (макет). */
.rec-actions .fav-star { width: 28px; min-height: 28px; border: 1px solid var(--color-border-strong); border-radius: var(--radius-control);
  background: var(--color-bg-panel); box-shadow: var(--shadow-xs); color: var(--color-text-muted); }
.rec-actions .fav-star[aria-pressed="true"] { border-color: var(--color-text-muted); color: var(--color-text-primary); }
.rec-actions .pop-anchor > .icon-button { width: 28px; height: 28px; border-color: var(--color-border-strong); border-radius: var(--radius-control);
  background: var(--color-bg-panel); box-shadow: var(--shadow-xs); }
/* Ссылка на запись (компания, контакт, партнёр): плитка и подчёркнутое название. */
.rlink { display: inline-flex; align-items: center; gap: 7px; max-width: 100%; min-width: 0; padding: 0; border: 0; background: none;
  color: var(--color-text-primary); font-weight: 500; text-align: left; }
.rlink .nm { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration: underline;
  text-decoration-color: var(--color-border-strong); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.rlink:hover .nm { text-decoration-color: var(--color-text-primary); }
.rec-company .rlink .nm { font-weight: 600; }
.record-company { display: flex; align-items: center; gap: 8px; min-width: 0; }
.record-logo { display: inline-grid; place-items: center; width: 22px; height: 22px; flex: none; border-radius: 6px; background: var(--color-bg-rail);
  color: var(--color-text-rail-primary); font: 600 9.5px/1 var(--font-mono); font-feature-settings: var(--font-mono-features); }
/* Инициалы плитки — из data-initials (record-layout.ts): плитка не попадает в текст строки. Человек — круглая светлая, в ячейке — малая. */
.record-logo::before { content: attr(data-initials); }
.record-logo.round { border-radius: 50%; background: var(--color-bg-panel-strong); color: var(--color-text-secondary); }
/* Аватар человека в карточке сделки — светло-синий, как в макете. */
.record-logo.round.av { background: var(--color-blue-bg); color: var(--color-blue-ink); }
.record-logo.small { width: 18px; height: 18px; border-radius: 5px; font-size: 8px; }
.record-logo.round.small { border-radius: 50%; }
.record-logo.md { width: 28px; height: 28px; font-size: 10.5px; }
.record-sub { color: var(--color-text-muted); font-size: 12.5px; line-height: 1.4; overflow-wrap: anywhere; }
.record-buttons { display: flex; flex-wrap: wrap; gap: 6px; }
.record-company > .muted { flex: none; }
.record-actions > .link-button { margin-right: 4px; white-space: nowrap; }
/* Число у вкладки записи. */
.tab-count { padding: 3px 5px; border-radius: 5px; background: var(--color-bg-panel-strong); color: var(--color-text-secondary);
  font: 500 11px/1 var(--font-mono); font-feature-settings: var(--font-mono-features); }
/* Число-предупреждение у вкладки (нужно переподключить): цвет ошибки, а не нейтральный. */
.tab-count.alert { border: 1px solid var(--color-status-danger-border); background: var(--color-status-danger-bg); color: var(--color-status-danger); }
/* Числа компании: три плитки в одной рамке. */
.mini-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--color-border-soft); border-radius: var(--radius-card);
  background: var(--color-bg-panel); }
.mini-stats > div { display: grid; gap: 2px; min-width: 0; padding: 12px 16px; border-right: 1px solid var(--color-line); }
.mini-stats > div:last-child { border-right: 0; }
.mini-stats span, .mini-stats small { color: var(--color-text-muted); font-size: 12px; overflow-wrap: anywhere; }
.mini-stats b { font-size: 20px; font-weight: 600; line-height: 1.15; }
.record-tab, .record-blocks { display: flex; flex-direction: column; gap: 22px; }
/* Числа компании на странице записи — с полями правой части (вкладки ниже — во всю ширину, как у сделки). */
.deal-main > .mini-stats { margin: 0 24px; }

/* Разделы левой панели («Сведения», «Источники и даты»): раскрываются, строки «иконка и подпись — значение». */
.record-facts { padding-top: 6px; border-top: 1px solid var(--color-line); }
.deal-head > .record-facts { padding: 10px 0; }
.record-facts-head { display: flex; align-items: center; gap: 6px; height: 28px; padding: 0 4px; border-radius: 6px; cursor: pointer; list-style: none;
  color: var(--color-text-secondary); font-size: 12.5px; font-weight: 600; }
.record-facts-head:hover { color: var(--color-text-primary); }
.record-facts-head::-webkit-details-marker { display: none; }
.record-facts-chevron { color: var(--color-text-muted); transform: rotate(-90deg); transition: transform .15s; }
.record-facts[open] > .record-facts-head .record-facts-chevron { transform: none; }
.record-facts-body { display: grid; gap: 1px; padding-top: 4px; }
.attr { display: grid; grid-template-columns: 148px minmax(0, 1fr); align-items: start; gap: 8px; min-height: 32px; padding: 3px 6px; border-radius: 6px; }
.attr:hover { background: var(--color-table-hover-bg); }
.attr-k { display: flex; align-items: center; gap: 8px; min-width: 0; min-height: 26px; color: var(--color-text-muted); font-size: 13px; }
.attr-k .icon { flex: none; }
.attr-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.attr-v { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; min-width: 0; min-height: 26px; color: var(--color-text-primary); font-size: 13px; }
/* Значение в две строки (ник и подпись Telegram у контакта справочника). */
.attr-stack { display: grid; gap: 1px; min-width: 0; }
/* Значение карточки сделки строкой с переносом: дни и дата с основанием, ник, кто передал; подпись мелко. */
.attr-flow { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; min-width: 0; }
/* Анализ сделки старше последнего сообщения клиента: серая строка под датой ответа (замечание Антона 20.10). */
.attr-flow .analysis-lag { flex-basis: 100%; }
.attr-v .sub, .attr-sub { color: var(--color-text-muted); font-size: 12.5px; }
.attr-list { display: flex; flex-wrap: wrap; gap: 4px 10px; min-width: 0; }
.nil { color: var(--color-text-muted); }
.hid { display: inline-flex; align-items: center; gap: 5px; color: var(--color-text-muted); font-style: italic; }
.cell { display: flex; align-items: center; gap: 6px; min-width: 0; }
.cell > .muted { white-space: nowrap; }
/* Значения-кнопки «Сведений» — чипы: стадия с точкой, режим, человек (аватар и имя), тег; ▾ — открыть список. */
.attr-v .pop-anchor > .pill, .chip-white { min-height: 24px; max-width: 100%; padding: 0 7px; gap: 5px; border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-chip); background: var(--color-bg-panel); box-shadow: none; font-size: 12.5px; font-weight: 500; }
.chip-white { display: inline-flex; align-items: center; }
.attr-v .pop-anchor > .pill .chevron { width: 12px; height: 12px; opacity: .6; margin-right: -2px; }
.attr[data-attr="owner"] .pop-anchor > .pill, .pp { display: inline-flex; align-items: center; gap: 6px; min-height: 24px; max-width: 100%;
  padding: 0 8px 0 2px; border: 1px solid var(--color-border-soft); border-radius: 999px; background: var(--color-bg-panel); color: var(--color-text-primary);
  font-size: 12.5px; font-weight: 500; }
.pp .nm { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
a.pp:hover, .attr[data-attr="owner"] .pop-anchor > .pill:hover { border-color: var(--color-border-strong); }
.attr-v .badge { max-width: 100%; white-space: normal; overflow-wrap: anywhere; text-align: left; }
/*
 * «Откуда пришёл» (ревью Антона 19.10, А3): чип вида («рекомендация», «свои контакты») не сжимается рядом с длинной подписью
 * («от Григорий Лактионов») — раньше он уходил в столбик по букве; строка переносится, подпись — по словам.
 */
.attr-v .cell { flex-wrap: wrap; row-gap: 2px; }
.attr-v .cell > .badge { flex: none; }
.attr-v .cell > .muted { min-width: 0; white-space: normal; overflow-wrap: break-word; }
.deal-contact .besales { font-size: 12px; }
.deal-amount { font-weight: 500; }
/* Тег строкой «Сведений» (Кирилл 19.10): значение — чип цвета значения, пустое — пунктир «—», карандаш открывает список. */
.tag-cell { display: inline-flex; align-items: center; gap: 4px; min-width: 0; max-width: 100%; }
/* «Возможно устарел» у ручного статуса (Кирилл 23.10): значок рядом с чипом, тон предупреждения. */
.stale-mark { display: inline-flex; align-items: center; flex: none; color: var(--color-warn, var(--color-text-muted)); cursor: help; }
.stale-mark .icon { width: 13px; height: 13px; }
.stale-mark { gap: 3px; font-size: 11.5px; font-weight: 500; white-space: nowrap; }
.chip-dashed { display: inline-flex; align-items: center; min-height: 22px; padding: 0 7px; border: 1px dashed var(--color-border-strong);
  border-radius: var(--radius-chip); color: var(--color-text-muted); font-size: 12px; }
.tag-edit > .icon-button, .attr-v .quiet.small { width: 24px; height: 24px; color: var(--color-text-muted); }
.attr-v .quiet.small { width: auto; min-height: 24px; padding: 0 6px; gap: 4px; font-size: 12px; }
.tag-edit > .icon-button .icon { width: 13px; height: 13px; }
.tag-row { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; min-width: 0; }
.tag-row > .badge, .tag-pills > .badge { max-width: 100%; white-space: normal; overflow-wrap: anywhere; text-align: left; }
.tag-pills { gap: 4px; flex-wrap: wrap; min-width: 0; max-width: 100%; }
.tag-settings { display: grid; gap: 12px; padding: 12px; border: 1px solid var(--color-border-soft); border-radius: 14px; }
.tag-settings-list { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.tag-settings-list li { display: grid; gap: 6px; padding-bottom: 10px; border-bottom: 1px solid var(--color-border-soft); }
.tag-settings, .tag-settings-list li, .tag-settings-list li > * { min-width: 0; }
.tag-settings b { overflow-wrap: anywhere; }
.tag-value-button { cursor: pointer; }
/* Пункты списков записи: значок слева (точка стадии, цвет значения, иконка), пояснение под подписью, черта над действием. */
.popover-option > .stage-dot, .popover-option > .icon, .popover-option > .record-logo { flex: none; }
.popover-option > .icon:first-child { color: var(--color-text-muted); }
/* Список с пояснениями чуть шире общего минимума; подпись пункта не рвётся посреди слова. */
.popover:has(.popover-hint.note) { min-width: 280px; }
.popover-option > .grow { overflow-wrap: break-word; }
.popover-option.separated { position: relative; margin-top: 9px; }
.popover-option.separated::before { content: ""; position: absolute; top: -5px; left: 6px; right: 6px; height: 1px; background: var(--color-line); }
.swatch { width: 12px; height: 12px; flex: none; border: 1px solid var(--color-border-strong); border-radius: 3px; background: var(--color-bg-panel-strong); }
.swatch.ok { border-color: var(--color-status-success-border); background: var(--color-status-success-bg); }
.swatch.warn { border-color: var(--color-status-warning-border); background: var(--color-status-warning-bg); }
.swatch.error { border-color: var(--color-status-danger-border); background: var(--color-status-danger-bg); }
.swatch.signal { border-color: var(--color-signal-border); background: var(--color-signal-soft); }
/* Узкий экран: список значения в «Сведениях» открывается к левому краю от кнопки — не выходит за правый край экрана. */
@media (max-width: 768px) {
  .attr-v .pop-anchor .popover { left: auto; right: 0; max-width: calc(100vw - 32px); }
  .attr { grid-template-columns: 124px minmax(0, 1fr); }
  .mini-stats > div { padding: 10px 12px; }
  .mini-stats b { font-size: 17px; }
}

/* Блок действия (макет): слева следующий шаг, справа строки «Следующая встреча», «Обещано клиенту», «Другие задачи». */
.record-action { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); flex: none; border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-card); background: var(--color-bg-panel); box-shadow: var(--shadow-xs); }
.record-action.solo { grid-template-columns: minmax(0, 1fr); }
.act-step { display: grid; gap: 8px; align-content: start; min-width: 0; padding: 14px 16px; }
.tile-h { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; color: var(--color-text-muted); font-size: 12px; font-weight: 500; }
.tile-h > .tile-icon { margin-left: auto; color: var(--color-text-muted); }
.tile-h > .grow + .tile-icon, .tile-h > .grow + * + .tile-icon { margin-left: 0; }
.tile-t { color: var(--color-text-primary); font-size: 14.5px; font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
.tile-t.muted-title { color: var(--color-text-secondary); font-weight: 500; }
.tile-p { margin: 0; color: var(--color-text-secondary); font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; white-space: pre-line; }
.tile-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; color: var(--color-text-muted); font-size: 12.5px; }
.tile-meta > .sep { color: var(--color-text-muted); }
.tile-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding-top: 2px; }
.tile-actions .primary, .tile-actions .secondary, .rec-actions + * .secondary.small, .secondary.small, .primary.small { min-height: 24px; padding: 0 8px;
  gap: 5px; font-size: 12px; }
.tile-actions .pop-anchor > .icon-button { width: 24px; height: 24px; }
.act-step .primary .icon { color: var(--color-text-rail-muted); }
/* Срок: обычным текстом; цвет — только «сегодня» (жёлтый) и просрочен (красный, с иконкой). */
.due { display: inline-flex; align-items: center; gap: 4px; flex: none; color: var(--color-text-muted); font-size: 12.5px; white-space: nowrap; }
.due.due-over, .due.due-today { min-height: 20px; padding: 0 6px; border-radius: 5px; font-weight: 500; }
.due.due-over { background: var(--color-status-danger-bg); color: var(--color-status-danger); }
.due.due-today { background: var(--color-status-warning-bg); color: var(--color-status-warning); }
.act-side { display: grid; align-content: start; min-width: 0; padding: 6px 16px; border-left: 1px solid var(--color-line); }
.act-row { display: grid; grid-template-columns: 14px minmax(0, 1fr); gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--color-line); font-size: 13px; }
.act-row:last-child { border-bottom: 0; }
.act-row > .icon { margin-top: 2px; color: var(--color-text-muted); }
.act-body { min-width: 0; }
.act-k { margin-bottom: 3px; color: var(--color-text-muted); font-size: 12px; }
.act-v { display: flex; align-items: flex-start; gap: 10px; min-width: 0; }
.act-stack { display: grid; justify-items: start; gap: 3px; min-width: 0; overflow-wrap: anywhere; }
.act-stack > b { font-weight: 600; }
/* Плитка даты встречи: день недели капсом и число. */
.datebadge { display: grid; place-items: center; align-content: center; gap: 3px; width: 34px; height: 38px; flex: none; border: 1px solid var(--color-border-soft);
  border-radius: 8px; background: var(--color-bg-panel); }
.datebadge small { color: var(--color-blue-ink); font: 600 9.5px/1 var(--font-mono); letter-spacing: .06em; text-transform: uppercase; font-feature-settings: var(--font-mono-features); }
.datebadge b { font-size: 15px; font-weight: 600; line-height: 1; }
/* Предложения AI полосой: пунктирная рамка, искра, «AI предлагает задачу: …», кнопки справа. */
/* Одна колонка по ширине карточки: иначе неявная колонка растягивается по содержимому и на телефоне выходит за экран. */
.deal-proposals { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }
.deal-main > .record-action { margin: 0 24px; }
.deal-main > .deal-proposals { margin: 10px 24px 0; }
.suggest { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; padding: 10px 12px; border: 1px dashed var(--color-signal-border);
  border-radius: var(--radius-card); font-size: 13px; }
.suggest > .icon { color: var(--color-signal-primary); }
/* Текст предложения переносится целиком (общее .tx списков режет строку многоточием — здесь нельзя: это содержание действия). */
.suggest .tx { display: block; flex: 1; min-width: 220px; overflow: visible; color: var(--color-text-secondary); line-height: 1.45;
  text-overflow: clip; white-space: normal; overflow-wrap: anywhere; }
.suggest .tx b { color: var(--color-text-primary); font-weight: 600; }
.suggest .primary, .suggest .secondary { min-height: 24px; padding: 0 8px; font-size: 12px; }
.deal-proposals > .link-button { justify-self: start; }
/* Метка происхождения мелким моноширинным капсом; AI — сиреневая. */
.origin { display: inline-flex; align-items: center; flex: none; height: 18px; padding: 0 5px; border-radius: 4px; background: var(--color-bg-panel-strong);
  color: var(--color-text-secondary); font: 500 10.5px/1 var(--font-mono); letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; font-feature-settings: var(--font-mono-features); }
.origin.ai { background: var(--color-signal-soft); color: var(--color-signal-ink); }
.by { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; color: var(--color-text-muted); font-size: 12px; }
/* Вкладки записи: подчёркнутая строка, иконка и число. */
/*
 * Нижняя линия — внутренней тенью, а не рамкой: подчёркивание активной вкладки ложится на неё без выхода за край, и полоса не
 * получает вертикальной прокрутки (overflow-x: auto включает и её — раньше справа появлялся ползунок). Горизонтальная прокрутка
 * на узком экране остаётся, полоса прокрутки скрыта.
 */
.deal-tabs { position: sticky; top: 0; z-index: 4; display: flex; gap: 4px; overflow-x: auto; overflow-y: hidden; scrollbar-width: none;
  margin-top: 4px; box-shadow: inset 0 -1px 0 var(--color-border-soft); background: var(--color-bg-panel); }
.deal-tabs::-webkit-scrollbar { display: none; }
.deal-tabs > .pill { gap: 7px; min-height: 40px; padding: 0 8px; border: 0; border-bottom: 2px solid transparent; border-radius: 0;
  background: transparent; box-shadow: none; color: var(--color-text-muted); font-size: 13px; }
.deal-main > .deal-tabs { margin-top: 14px; padding: 0 20px; }
/* Вкладки первыми (карточка контакта — без чисел над ними) — от верха правой части. */
.deal-main > .deal-tabs:first-child { margin-top: 0; }
.deal-main > .deal-tabs > .pill { min-height: 44px; }
.deal-tabs > .pill .icon { color: var(--color-text-muted); }
.deal-tabs > .pill:hover { color: var(--color-text-primary); background: transparent; }
.deal-tabs > .pill.on { color: var(--color-text-primary); border-bottom-color: var(--color-text-primary); background: transparent; }
.deal-tab { padding-top: 6px; }
.deal-main > .deal-tab { padding: 20px 24px 48px; }
.tab-stack { display: grid; grid-template-columns: minmax(0, 1fr); gap: 26px; align-content: start; min-width: 0; }

/* Обзор: плитки «Ситуация» (две трети), «Позиция клиента», «Квалификация» (во всю ширину). */
.tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.tile { display: flex; flex-direction: column; gap: 8px; min-width: 0; padding: 12px 14px; border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-card); background: var(--color-bg-panel); }
.tile.span2 { grid-column: span 2; }
.tile.span3 { grid-column: 1 / -1; }
.tile .link-button { font-size: 12px; }
.ev-quote { margin: 2px 0; padding: 4px 0 4px 10px; border-left: 2px solid var(--color-border-strong); color: var(--color-text-secondary); font-size: 13px;
  line-height: 1.45; overflow-wrap: anywhere; }
.clamp { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.clamp.two { -webkit-line-clamp: 2; }
.clamp.tall { -webkit-line-clamp: 6; }
.clamp.open { display: block; -webkit-line-clamp: unset; }
.bignum { font-size: 22px; font-weight: 600; line-height: 1; }
.bignum small { margin-left: 6px; color: var(--color-text-muted); font-size: 12.5px; font-weight: 500; }
.critlist { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 28px; font-size: 12.5px; }
.crit { display: flex; align-items: flex-start; gap: 8px; min-width: 0; border-radius: 6px; }
.crit.editable { cursor: pointer; }
.crit.editable:hover .crit-name { text-decoration: underline; }
.crit-b { display: grid; gap: 2px; flex: 1; min-width: 0; }
.crit-name { display: flex; align-items: center; gap: 8px; color: var(--color-text-primary); font-weight: 500; }
.crit-name .st { margin-left: auto; color: var(--color-text-muted); font-weight: 400; white-space: nowrap; }
.crit-why { color: var(--color-text-secondary); font-size: 12px; line-height: 1.4; overflow-wrap: anywhere; }
.crit .by { font-size: 11.5px; }
.muted-crit .crit-name { color: var(--color-text-secondary); }
/* Значок критерия: подтверждено — зелёная галочка, явно нет — красный крест, неизвестно — пунктир, скрыто — штриховка. */
.q { display: grid; place-items: center; width: 15px; height: 15px; flex: none; margin-top: 1px; border: 1px solid var(--color-border-strong); border-radius: 4px;
  background: var(--color-bg-panel); color: var(--color-text-muted); }
.q .icon { width: 9px; height: 9px; stroke-width: 3; }
.q.y { border-color: var(--color-status-success-border); background: var(--color-status-success-bg); color: var(--color-status-success); }
.q.n { border-color: var(--color-status-danger-border); background: var(--color-status-danger-bg); color: var(--color-status-danger); }
.q.u { border-style: dashed; }
.q.h { background: repeating-linear-gradient(135deg, var(--color-bg-panel-strong) 0 2px, var(--color-bg-panel) 2px 4px); }

/* Блоки записи (основа .blk, .lbox, .lrow — общая, sections.css): заголовок строкой — иконка, название, число, пояснение мелко и
   действия справа. */
.blk > .blk-h { margin: 0; color: var(--color-text-primary); }
.blk-h .n { color: var(--color-text-muted); font: 500 11px/1 var(--font-mono); font-feature-settings: var(--font-mono-features); }
.blk-h small { color: var(--color-text-muted); font-size: 12px; font-weight: 400; }
.blk-h .right { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-width: 0; max-width: 100%; margin-left: auto; }
.blk-p { margin: 0; color: var(--color-text-primary); font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.blk > .by { margin-top: -2px; }
.chips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.kv { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 10px 16px; margin: 0; font-size: 13px; }
.kv dt { color: var(--color-text-muted); font-weight: 400; }
.kv dd { margin: 0; min-width: 0; color: var(--color-text-primary); font-weight: 400; overflow-wrap: anywhere; }
.kv-stack { display: grid; justify-items: start; gap: 4px; min-width: 0; }
.opts { display: grid; gap: 6px; }
.opt { display: grid; grid-template-columns: minmax(0, 200px) minmax(0, 1fr); gap: 2px 12px; }
.opt > .muted { grid-column: 2; }
/* Связанные записи во вкладках (макет): название — без постоянного подчёркивания (при наведении — подчёркнуто), строка
   открывается целиком; пустое состояние — обычным начертанием. */
.deal-tab .lrow .who > .deal-link { text-decoration: none; }
.deal-tab .lrow .who > .deal-link:hover { text-decoration: underline; }
.lrow.click { cursor: pointer; }
.deal-tab .empty { font-weight: 400; }
/* Строки записи: задачи, обещания, люди, проверки, встречи. */
.lrow .who > b { font-size: 13px; font-weight: 600; }
.lrow .who > .small { font-size: 12px; }
.lrow .ttl { color: var(--color-text-primary); font-size: 13px; }
/* Закрытая сделка в «Других сделках компании» — приглушена (название и подпись), стадия-исход справа остаётся заметной. */
.lrow.closed .who > .deal-link, .lrow.closed .who > span { color: var(--color-text-muted); }
.lrow.done .ttl { color: var(--color-text-muted); text-decoration: line-through; }
.lrow.person { align-items: flex-start; }
/* «Следующий шаг» у шага в задачах — светлый чип с контуром (макет), как значения «Сведений». */
.lmeta > .step-chip { flex: none; min-height: 20px; padding: 0 6px; color: var(--color-text-primary); font-size: 11.5px; white-space: nowrap; }
.warn-text { color: var(--color-status-warning) !important; }
/* Отметка «задача выполнена»: круг, при наведении — зелёная галочка; у выполненной — закрашен. */
.tcheck { display: grid; place-items: center; width: 18px; height: 18px; flex: none; padding: 0; border: 1.5px solid var(--color-border-strong); border-radius: 50%;
  background: var(--color-bg-panel); color: transparent; }
.tcheck .icon { width: 11px; height: 11px; stroke-width: 3; }
button.tcheck:hover { border-color: var(--color-status-success); color: var(--color-status-success); }
.tcheck.on { border-color: var(--color-status-success); background: var(--color-status-success); color: var(--color-bg-panel); }
.tcheck.static:not(.on) { border-style: dashed; }
.besales-link { width: 24px; height: 24px; color: var(--color-text-muted); }
details.more > summary { display: flex; align-items: center; gap: 6px; width: fit-content; cursor: pointer; list-style: none; color: var(--color-text-secondary);
  font-size: 13px; font-weight: 600; }
details.more > summary::-webkit-details-marker { display: none; }
details.more > summary .icon { color: var(--color-text-muted); transition: transform .15s; }
details.more[open] > summary .icon { transform: rotate(90deg); }
details.more > .lbox { margin-top: 10px; }
.hid-note { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px dashed var(--color-border-strong); border-radius: 8px;
  color: var(--color-text-muted); font-size: 12.5px; }
.hid-note > .icon { flex: none; }
.tab-stack .empty { padding: 20px 16px; }
/* Встречи строками: номер, тип, название, дата; раскрывается — кратко, итог, шаг, участники, summary Zoom. */
.meetings { display: grid; gap: 10px; }
.mrow { border-bottom: 1px solid var(--color-line); }
.mrow:last-child { border-bottom: 0; }
.mrow > summary { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; min-height: 40px; padding: 6px 12px; cursor: pointer; list-style: none; font-size: 13px; }
.mrow > summary::-webkit-details-marker { display: none; }
.mrow > summary > .icon { color: var(--color-text-muted); transition: transform .12s; }
.mrow[open] > summary > .icon { transform: rotate(90deg); }
.mrow > summary .tx { flex: 1 1 160px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mrow-body { display: grid; gap: 8px; margin: 0 12px 12px 34px; }
.mrow-body .kv { grid-template-columns: 120px minmax(0, 1fr); gap: 6px 12px; }

/* «История»: линейка этапов воронки над списком этапов. */
.ruler { display: grid; grid-template-columns: repeat(var(--n, 1), minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
.ruler li { position: relative; display: grid; min-width: 0; padding: 16px 8px 0 0; }
.ruler li::before { content: ""; position: absolute; top: 4px; left: 0; right: 0; height: 2px; background: var(--color-bg-panel-strong); }
.ruler li.done::before { background: var(--color-stage-2); }
.ruler li:last-child::before { right: auto; width: 10px; }
.ruler .pdot { position: absolute; top: 0; left: 0; width: 10px; height: 10px; border: 2px solid var(--color-bg-panel); box-shadow: 0 0 0 1px var(--color-border-strong); }
.ruler li.next .pdot { background: var(--color-bg-panel); }
.ruler li.now .pdot { box-shadow: 0 0 0 2px var(--color-text-primary); }
.ruler .nm { overflow: hidden; color: var(--color-text-secondary); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.ruler li.now .nm { color: var(--color-text-primary); font-weight: 600; }
.ruler li.next .nm { color: var(--color-text-muted); }
.plist { display: grid; margin: 0; padding: 0; overflow: hidden; list-style: none; border: 1px solid var(--color-border-soft); border-radius: var(--radius-card); }
.ps-row { display: grid; grid-template-columns: 12px minmax(0, 1.1fr) minmax(0, 1.2fr) minmax(0, .9fr); align-items: center; gap: 10px; min-height: 40px;
  padding: 6px 12px; border-bottom: 1px solid var(--color-line); font-size: 13px; }
.ps-row.now { background: var(--color-table-hover-bg); }
.ps-name { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; min-width: 0; font-weight: 500; }
.ps-by { color: var(--color-text-muted); font-size: 11.5px; font-weight: 400; white-space: nowrap; }
.ps-date { color: var(--color-text-secondary); }
.ps-days { justify-self: end; color: var(--color-text-secondary); }
.ps-note { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-bottom: 1px solid var(--color-line); color: var(--color-text-primary); font-size: 12.5px; }
.ps-note:last-child, .ps-row:last-child { border-bottom: 0; }
/* Лента: фильтры с числами справа в заголовке, дни, события — значок, кто и что, цитата; справа происхождение и время. */
.feed-blk > .blk-h .right { flex-wrap: wrap; justify-content: flex-end; }
.feed { display: grid; gap: 2px; }
.feed-day { padding: 12px 10px 4px; color: var(--color-text-muted); font-size: 12px; font-weight: 600; }
.feed .tl { margin: 0; padding: 0; list-style: none; }
.ev { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; align-items: start; gap: 10px; padding: 6px 10px; border-radius: 8px; }
.ev:hover { background: var(--color-table-hover-bg); }
.ev-body { display: grid; gap: 4px; min-width: 0; }
.ev-line { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; min-height: 28px; color: var(--color-text-secondary); font-size: 13px; }
.ev-line b { color: var(--color-text-primary); font-weight: 600; }
.ev-title { color: var(--color-text-primary); overflow-wrap: anywhere; }
.ev-text { margin: 0; color: var(--color-text-secondary); font-size: 13px; line-height: 1.45; }
/* Запись открывается (другая сделка или партнёр, листалка «N из M»): прежняя не остаётся на экране. */
.card-loading { padding: 20px; color: var(--color-text-muted); font-size: 13px; }
@media (max-width: 768px) {
  .card-loading { padding: 16px max(16px, env(safe-area-inset-right, 0px)) 16px max(16px, env(safe-area-inset-left, 0px)); }
}
/* Чья цитата основания и её дата — под цитатой (закрытие по вопросу системы). */
.ev-quote-at { margin: 0 0 0 12px; color: var(--color-text-muted); font-size: 12px; }
.ev-body > .link-button { justify-self: start; font-size: 12px; }
/* Решение по обсуждению команды: «Из обсуждения команды · «топик»» и ссылка на сообщение в Telegram. */
.ev-team { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 10px; margin: 0; min-width: 0; font-size: 12px;
  overflow-wrap: anywhere; }
.ev-meta { display: flex; align-items: center; gap: 8px; min-height: 28px; color: var(--color-text-muted); font-size: 12px; }
/* Связанная запись события и копии заметки («Перевести в партнёрство»): «Партнёрство · «название»» ссылкой; переносится. */
.ev-link { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 6px; margin: 0; min-width: 0; font-size: 12.5px; }
.ev-link .record-link, .ev-link .record-name { min-width: 0; overflow-wrap: anywhere; text-align: left; }
/* «Заметки» на «Обзоре» (ревью Антона 19.10, А2): автор и время строкой, ниже текст с сохранёнными переносами. */
.lrow.note-row { align-items: flex-start; }
.note-row .who { gap: 3px; }
.note-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; max-width: 100%; min-width: 0; }
.note-head > b { font-size: 13px; font-weight: 600; }
.note-head > time { font-size: 12px; }
.note-text { max-width: 100%; color: var(--color-text-primary); font-size: 13px; overflow-wrap: anywhere; }
.notes-blk > .notes-all { align-self: flex-start; font-size: 12.5px; }
/* Правка названий и текстов (crm-edit-names.md): карандаш у названия, «Изменить / Удалить» под заметкой, действия с компанией в окне. */
.rec-title-edit { margin-left: 6px; vertical-align: middle; }
.note-foot { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; font-size: 12.5px; }
.note-foot:empty { display: none; }
.company-actions .label-like { display: block; margin-bottom: 4px; color: var(--color-text-secondary); font-size: 12.5px; font-weight: 500; }
.company-action-row { display: flex; flex-wrap: wrap; gap: 8px; }

/* Узкий экран: одна колонка; у сделки — «шапка → блок действия → предложения → сведения (свёрнуты) → вкладки». */
@media (max-width: 1024px) {
  .record { display: flex; flex-direction: column; min-height: 0; }
  .record-resize { display: none; }
  /* Специфичнее .deal-head ниже: иначе левая панель остаётся блоком и порядок частей не работает. */
  .record > .record-left, .record > .record-main { display: contents; }
  .record-left > * { order: 1; margin: 0 16px; }
  .record-left > .record-facts { order: 3; }
  .record-main > * { order: 4; margin: 0 16px; }
  .record-main > .mini-stats { order: 2; }
  .record-left > .record-actions { margin-top: 12px; }
  .record > * + * { margin-top: 10px; }
  .deal-head > .rec-head { padding: 16px 0 12px; }
  .deal-head > .record-facts { order: 4; margin-top: 12px; padding-bottom: 4px; border-bottom: 1px solid var(--color-line); }
  .deal-head > .record-facts + .record-facts { margin-top: 0; border-top: 0; }
  .deal-main > .record-action { order: 2; margin: 0 16px; }
  .deal-main > .mini-stats { margin: 12px 16px 0; }
  .deal-main > .deal-proposals { order: 3; margin: 10px 16px 0; }
  .deal-main > .deal-tabs { order: 5; position: static; margin: 8px 0 0; padding: 0 16px; }
  .deal-main > .deal-tab { order: 6; margin: 0; padding: 16px 16px 40px; }
  .record-action { grid-template-columns: minmax(0, 1fr); }
  .act-side { border-left: 0; border-top: 1px solid var(--color-line); }
  .tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
  .tiles { grid-template-columns: minmax(0, 1fr); }
  .tile.span2, .tile.span3 { grid-column: auto; }
  .critlist { grid-template-columns: minmax(0, 1fr); }
  .opt { grid-template-columns: minmax(0, 1fr); }
  .opt > .muted { grid-column: 1; }
  .kv { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .kv dd { margin-bottom: 8px; }
  .ruler { padding-bottom: 18px; }
  .ruler .nm { display: none; }
  .ruler li.now .nm { position: absolute; top: 14px; left: 0; display: block; overflow: visible; white-space: nowrap; }
  .ruler li.now.end .nm { left: auto; right: 0; }
  .ps-row { grid-template-columns: 12px minmax(0, 1fr) auto; grid-template-areas: "dot name days" ". date date"; row-gap: 2px; }
  .ps-row > .stage-dot { grid-area: dot; }
  .ps-name { grid-area: name; }
  .ps-date { grid-area: date; font-size: 12.5px; }
  .ps-days { grid-area: days; }
  .ev { grid-template-columns: 28px minmax(0, 1fr); }
  .ev-meta { grid-column: 2; min-height: 0; }
  .mrow-body { margin-left: 12px; }
}

/* Общие части записи: шапка, чипы, компания, контакт; список «Добавить человека» в команду партнёра. */
.deal-head { display: flex; flex-direction: column; gap: 10px; }
.deal-chip { display: inline-flex; align-items: center; min-height: 24px; padding: 0 8px; border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-chip); background: var(--color-bg-panel); font-size: 12.5px; font-weight: 500; }
.deal-company { min-width: 0; overflow: hidden; font-size: 15px; font-weight: 600; line-height: 1.3; color: var(--color-text-primary); text-overflow: ellipsis; white-space: nowrap; }
.board-company { font-size: 13px; font-weight: 600; line-height: 1.3; color: var(--color-text-primary); }
.deal-contact { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 13px; color: var(--color-text-secondary); }
.deal-contact b { color: var(--color-text-primary); }
.attr-v .deal-contact { gap: 2px 6px; }
.task-list { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.task-list li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 12px; padding: 8px 10px;
  border-left: 3px solid var(--color-border-strong); border-radius: 0 var(--radius-control) var(--radius-control) 0;
  background: var(--color-bg-panel); font-size: 13px; font-weight: 600; }
.task-list li .badge { margin-right: 8px; }
.task-list li.late { border-left-color: var(--color-status-danger); }
.card-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 14px; align-items: start; }
.card-column { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.tab-stack.card-column { display: grid; gap: 26px; }
.card-block { min-width: 0; }
.block-title { margin: 0 0 12px; font-size: 16px; font-weight: 600; }
.card-details > summary { cursor: pointer; list-style: none; margin: 0; }
.card-details > summary::-webkit-details-marker { display: none; }
.card-details > summary::after { content: " ▸"; color: var(--color-text-muted); }
.card-details[open] > summary { margin-bottom: 12px; }
.card-details[open] > summary::after { content: " ▾"; }
.quote { margin: 4px 0; padding: 8px 12px; border-left: 3px solid var(--color-border-strong); border-radius: 0 var(--radius-control) var(--radius-control) 0;
  background: var(--color-bg-panel-strong); font-size: 13px; line-height: 1.45; }
.pre { white-space: pre-line; margin: 0; line-height: 1.5; }
.hint { color: var(--color-text-muted); font-size: 12px; margin: 10px 0 0; }
.people { display: flex; flex-direction: column; }
.lbox.people { display: grid; }
.card-block > .notice { margin-bottom: 14px; }

/* Окна карточки: группы полей, пункты проверки, выбор основной сделки. */
/* Радио-карточки выбора (макет): кружок, подпись и пояснение; выбранная — тёмная рамка и закрашенный кружок. */
.rc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.rc-grid.cols-1 { grid-template-columns: minmax(0, 1fr); }
.rc-grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rc { display: flex; align-items: center; gap: 10px; min-width: 0; min-height: 44px; padding: 8px 12px; border: 1px solid var(--color-border-soft);
  border-radius: 8px; background: var(--color-bg-panel); color: var(--color-text-primary); text-align: left; cursor: pointer; }
.rc:hover { background: var(--color-table-hover-bg); }
.rc.on { border-color: var(--color-text-primary); box-shadow: inset 0 0 0 1px var(--color-text-primary); }
.rc-dot { width: 16px; height: 16px; flex: none; border: 1.5px solid var(--color-border-strong); border-radius: 50%; background: var(--color-bg-panel); }
.rc.on .rc-dot { border: 5px solid var(--color-text-primary); }
.rc-b { display: grid; gap: 1px; min-width: 0; font-size: 13.5px; overflow-wrap: anywhere; }
.rc-b b { font-weight: 600; }
.rc-b small { color: var(--color-text-muted); font-size: 12px; }
/* Дата с быстрыми сроками, счётчик знаков, повтор шага, плашка «к чему относится». */
.date-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
.date-inp { position: relative; display: flex; align-items: center; width: 180px; }
.date-inp > input { padding-left: 34px; }
/* Календарь поля даты (А9, date-picker.ts): кнопка-значок в поле, месяц сеткой под полем — без всплывающего слоя (окно на телефоне
   прокручивается само, сетка не выходит за край). */
.cal-toggle { position: absolute; left: 4px; display: grid; place-items: center; width: 26px; height: 24px; padding: 0; border: 0;
  border-radius: 6px; background: transparent; color: var(--color-text-muted); cursor: pointer; }
.cal-toggle:hover, .cal-toggle[aria-expanded="true"] { background: var(--color-table-hover-bg); color: var(--color-text-primary); }
.cal-toggle:focus-visible { outline: 2px solid var(--color-focus-ring); outline-offset: 1px; }
.cal { display: grid; gap: 6px; width: 100%; max-width: 296px; margin-top: 8px; padding: 8px; border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-card); background: var(--color-bg-panel); box-shadow: var(--shadow-xs); }
.cal[hidden] { display: none; }
.cal-head { display: flex; align-items: center; gap: 6px; }
.cal-title { flex: 1; min-width: 0; text-align: center; font-size: 13px; font-weight: 600; }
.cal-nav { display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-control); background: var(--color-bg-panel); color: var(--color-text-secondary); cursor: pointer; }
.cal-nav:disabled { opacity: .45; cursor: default; }
.cal-grid { width: 100%; border-collapse: separate; border-spacing: 2px; table-layout: fixed; }
.cal-grid th { padding: 2px 0 4px; color: var(--color-text-muted); font: 500 10.5px/1 var(--font-mono); text-transform: uppercase; font-feature-settings: var(--font-mono-features); }
.cal-grid td { padding: 0; text-align: center; }
.cal-day { width: 100%; height: 32px; padding: 0; border: 1px solid transparent; border-radius: 7px; background: transparent;
  color: var(--color-text-primary); font-size: 13px; font-variant-numeric: tabular-nums; cursor: pointer; }
.cal-day:hover:not(:disabled) { background: var(--color-table-hover-bg); }
.cal-day.cal-out { color: var(--color-text-muted); }
.cal-day.cal-today { border-color: var(--color-border-strong); font-weight: 600; }
.cal-day.cal-on { border-color: var(--color-text-primary); background: var(--color-text-primary); color: var(--color-bg-panel); }
.cal-day:disabled { color: var(--color-disabled-text); opacity: .45; cursor: default; }
.cal-day:focus-visible { outline: 2px solid var(--color-focus-ring); outline-offset: 1px; }
.cal-foot { display: flex; justify-content: flex-end; }
/* «Обещано клиенту» в блоке действия: «Выполнено…» и «Перенести срок» строкой. */
.act-promise-actions { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.quick { display: flex; flex-wrap: wrap; gap: 4px; }
.field-foot .counter { flex: none; color: var(--color-text-muted); font-size: 12px; }
.field-label { display: block; margin-bottom: 4px; color: var(--color-text-secondary); font-size: 12.5px; font-weight: 500; }
.repeat-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.repeat-row > label { margin: 0; }
/* Флажок с подписью в строку («Повторять каждые»). */
.check-label { display: inline-flex; align-items: center; gap: 8px; color: var(--color-text-secondary); font-size: 13px; font-weight: 600; cursor: pointer; }
.repeat-row > input.num:disabled { opacity: .55; }
/* Ошибка поля под ним (дата не в виде ДД.ММ.ГГГГ или раньше сегодняшнего дня); поле — красной рамкой. */
.field-error { margin: 4px 0 0; color: var(--color-status-danger); font-size: 12px; font-weight: 500; }
.field-error:empty { display: none; }
input[aria-invalid="true"] { border-color: var(--color-status-danger); box-shadow: 0 0 0 3px var(--color-status-danger-bg); }
.repeat-row > input.num { width: 64px; text-align: center; }
/* Окно правки поля: варианты условий предложения, «Очистить поле» и «Прежние значения» с возвратом версии. */
.field-options { display: grid; gap: 12px; margin-bottom: 8px; }
.field-option-block { display: grid; gap: 8px; min-width: 0; padding: 10px 12px; border: 1px solid var(--color-border-soft); border-radius: 10px; }
.field-option-title { margin: 0; font-size: 13px; font-weight: 600; color: var(--color-text-secondary); }
.field-option { display: grid; gap: 8px; min-width: 0; }
.field-extras { display: grid; gap: 8px; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--color-border-soft); }
.field-extras-title { margin: 0; font-size: 13px; font-weight: 600; color: var(--color-text-secondary); }
.field-history { display: grid; gap: 6px; min-width: 0; }
.field-rev { display: grid; gap: 4px; min-width: 0; padding: 8px 10px; border: 1px solid var(--color-border-soft); border-radius: 8px; }
.field-rev.current { background: var(--color-table-hover-bg); }
.field-rev-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 12px; }
.field-rev-value { margin: 0; font-size: 13px; white-space: pre-line; overflow-wrap: anywhere; }
.field-clear { display: grid; gap: 6px; justify-items: start; }
.field-clear-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.danger { color: var(--color-status-danger); }
.ctx-box { display: grid; gap: 2px; padding: 9px 12px; border-radius: 8px; background: var(--color-table-hover-bg); color: var(--color-text-secondary); font-size: 13px;
  overflow-wrap: anywhere; }
.ctx-box b { color: var(--color-text-primary); font-weight: 600; }
@media (max-width: 768px) {
  .rc-grid, .rc-grid.cols-3 { grid-template-columns: minmax(0, 1fr); }
  .date-inp { width: 100%; }
  .cal { max-width: none; }
}
.dialog-group { display: flex; flex-direction: column; gap: 14px; }
.segmented.wrap { flex-wrap: wrap; border-radius: var(--radius-soft); }
.check-aspect { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-soft); background: var(--color-bg-panel); }
.check-aspect-head { display: flex; flex-direction: column; gap: 2px; min-width: 0; overflow-wrap: anywhere; }
.check-aspect .segmented { align-self: flex-start; }
.check-shown { display: flex; flex-direction: column; gap: 2px; font-weight: 500; }
.check-text { position: relative; max-height: 180px; overflow-y: auto; }
.check-agreements { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 2px; }
/* Выполненные договорённости в окне проверки — свёрнутой группой «выполнено: N». */
.check-done summary { cursor: pointer; color: var(--color-text-muted); font-weight: 500; }
.check-done[open] summary { margin-bottom: 4px; }
.check-rated { display: flex; flex-direction: column; gap: 12px; }
/* Пункт проверки партнёрства из нескольких строк «подпись: значение» (ситуация и позиция; откуда пришёл и что привёл). */
.check-lines { display: flex; flex-direction: column; gap: 4px; }
.check-lines p { margin: 0; }
.check-lines b { font-weight: 600; }
/* «Объединить с…»: список основной сделки в самом окне (прокрутка внутри, не всплывающий) — радио-карточками. */
.merge-options { position: relative; display: grid; gap: 6px; max-height: 280px; overflow-y: auto; padding: 2px; }
.merge-option.rc { width: 100%; font-size: 12px; }
.merge-option .rc-b > span { min-width: 0; overflow-wrap: anywhere; }
.merge-option-title { color: var(--color-text-primary); font-size: 13.5px; font-weight: 600; }
/* Теги при объединении: что перейдёт (подсказкой) и чьи значения останутся (предупреждением); без тегов блока нет. */
.merge-tags[hidden] { display: none; }
.merge-tags .hint { margin: 0 0 6px; }
.merge-tags .notice { font-size: 12.5px; line-height: 1.45; overflow-wrap: anywhere; }
.check-report-aspects { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 4px 0 10px; }
.drawer-overlay { position: fixed; inset: 0; z-index: 80; background: var(--color-overlay-soft); }
.drawer { position: absolute; top: 0; right: 0; bottom: 0; width: min(420px, 100%); display: flex; flex-direction: column;
  background: var(--color-bg-panel); border-left: 1px solid var(--color-border-soft); box-shadow: var(--shadow-popover); }
.drawer-head { display: flex; align-items: flex-start; gap: 12px; padding: 16px 20px; border-bottom: 1px solid var(--color-border-soft); }
.drawer-body { position: relative; display: flex; flex-direction: column; gap: 14px; padding: 20px; overflow: auto; }
.drawer-body > .team-open { align-self: flex-start; }
/* Закрытая сделка: «Закрыта · исход» вместо стадии, прежняя стадия мелко (замечание Антона 20.10). */
.stage-closed { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 2px; min-width: 0; max-width: 100%; }
.stage-closed > small { min-width: 0; overflow-wrap: anywhere; font-size: 11.5px; }
.fav-closed { display: inline-grid; place-items: center; flex: none; margin-left: 4px; color: var(--color-text-muted); }

/* «Создать встречу»: гости, подтверждение и ход создания (apps/docs/crm-google-calendar.md, этап 2). */
.meeting-own-link { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.meeting-own-link input { min-width: 0; }
.meeting-guests { display: flex; flex-direction: column; gap: 8px; margin-bottom: 8px; }
.meeting-guests .check-label { overflow-wrap: anywhere; }
.meeting-chip { display: inline-flex; align-items: center; justify-content: space-between; gap: 8px; padding: 4px 4px 4px 10px;
  border: 1px solid var(--color-border-soft); border-radius: var(--radius-control); font-size: 13px; overflow-wrap: anywhere; }
.meeting-guest-add { display: flex; gap: 8px; }
.meeting-guest-add input { flex: 1 1 auto; min-width: 0; }
/* Быстрый выбор гостя (guest-suggest.ts): имя сверху, адрес под ним; список — общий `.sel-list`. */
.guest-opt { flex-direction: column; align-items: flex-start; gap: 0; }
.guest-opt-main { max-width: 100%; overflow-wrap: anywhere; }
.guest-opt-sub { max-width: 100%; color: var(--color-text-muted); font-size: 11.5px; overflow-wrap: anywhere; }
.guest-opt-sub:empty { display: none; }
.meeting-preview { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 12px; border-radius: 8px;
  background: var(--color-table-hover-bg); font-size: 13px; }
.meeting-row { display: grid; grid-template-columns: minmax(110px, 38%) 1fr; gap: 10px; }
.meeting-row dt { color: var(--color-text-secondary); }
.meeting-row dd { margin: 0; color: var(--color-text-primary); font-weight: 600; overflow-wrap: anywhere; }
.meeting-progress-extra { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
@media (max-width: 768px) {
  .meeting-row { grid-template-columns: 1fr; gap: 2px; }
}

/* Списки в значениях «Сведений» (Кирилл 22.10): контакты — группой на человека со своими кнопками, связанные сделки — по строке; больше трёх — «ещё N». */
.fact-list { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.fact-list > [hidden] { display: none; }
.fact-list-toggle { align-self: flex-start; }
.attr[data-attr="related"] + .attr[data-attr="contact"] { margin-top: 6px; padding-top: 9px; border-top: 1px solid var(--color-border-soft); border-radius: 0; }
.contact-list .contact-group + .contact-group { padding-top: 8px; border-top: 1px solid var(--color-border-soft); }
.related-fact { gap: 2px 8px; }
.related-fact.closed, .related-fact.closed .deal-link { color: var(--color-text-secondary); }
.person-deals { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 6px; }
.person-deal.closed, .person-deal.closed .deal-link { color: var(--color-text-secondary); }