/* ═══════════════════════════════════════════════════════════════════════
   Editor v2 — добавки от EDITOR_UX_AUDIT.md (P0/P1).

   Этот файл подключается ПОСЛЕ editor/extras/chat и аккуратно дополняет
   их, не переписывая существующее. Содержит:

   1. Стили для редактируемых AI-bubbles (P0-2 lite).
   2. Side-panel «Ключи» (P1-4 lite) — постоянная полоса чипсов рядом с
      редактором, заменяет мёртвый `cw-kw-check`.
   3. Меню Экспорт (P1-7 lite).
   4. Мелкие a11y-тюнинги (контраст, фокус-кольца).
   ═══════════════════════════════════════════════════════════════════════ */

/* ───────────────────────────────────────────────────────────────────────
   1. Редактируемые AI-bubbles (P0-2 lite)
   ─────────────────────────────────────────────────────────────────────── */

.cw-msg.ai .cw-msg-body[contenteditable="true"] {
  outline: none;
  border-radius: 4px;
  transition: background 120ms ease, box-shadow 120ms ease;
  cursor: text;
}

.cw-msg.ai .cw-msg-body[contenteditable="true"]:hover {
  background: rgba(245, 158, 11, 0.04);
}

.cw-msg.ai .cw-msg-body[contenteditable="true"]:focus {
  background: rgba(245, 158, 11, 0.06);
  box-shadow: 0 0 0 1px rgba(245, 158, 11, 0.35),
              inset 0 0 0 1px rgba(245, 158, 11, 0.15);
}

/* Маленький значок «✎» в роли-лейбле сообщает: «здесь можно править».
   Появляется только у редактируемых сообщений (см. cwChatRender). */
.cw-msg-edit-hint {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 6px;
  padding: 0 2px;
  background: transparent;
  border: none;
  color: rgba(245, 158, 11, 0.55);
  font-size: 11px;
  font-weight: 400;
  cursor: default;
  opacity: 0.6;
  transition: opacity 120ms ease;
}
.cw-msg.ai:hover .cw-msg-edit-hint { opacity: 1; }

/* Стримящееся сообщение визуально отличается — мягкая пульсация курсора. */
.cw-msg.is-streaming .cw-msg-body::after {
  content: '▍';
  display: inline-block;
  margin-left: 2px;
  color: rgba(245, 158, 11, 0.7);
  animation: cw-blink 1.05s steps(2) infinite;
}
@keyframes cw-blink {
  50% { opacity: 0; }
}

/* ───────────────────────────────────────────────────────────────────────
   2. Панель «Ключи» под композером (P1-4 lite v2)

   Перенесена из шапки чата вниз — раньше 50+ ключей съедали половину
   высоты редактора, юзер не мог нормально читать сам текст
   (фидбэк из скриншота 5111 симв/704 слов). Теперь:
     - живёт ПОД composer'ом, в обёртке <details>;
     - свёрнута по умолчанию (показывает только шапку);
     - раскрывается кликом по `summary`;
     - max-height 220px + scroll, чтобы при 100 ключах не разрослась;
     - состояние «открыта/свёрнута» можно запоминать в LS (см. JS).
   ─────────────────────────────────────────────────────────────────────── */

.cw-keywords-panel-wrap {
  margin-top: 8px;
  border: 1px solid rgba(245, 158, 11, 0.18);
  border-radius: 8px;
  background: rgba(20, 18, 14, 0.55);
  overflow: hidden;
}

.cw-keywords-panel-summary {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  cursor: pointer;
  user-select: none;
  list-style: none;
  font-size: 11.5px;
  transition: background 120ms ease;
}
.cw-keywords-panel-summary::-webkit-details-marker { display: none; }
.cw-keywords-panel-summary:hover {
  background: rgba(245, 158, 11, 0.06);
}

.cw-keywords-panel-summary-title {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 10.5px;
  letter-spacing: 0.08em;
  color: rgba(245, 158, 11, 0.75);
}
.cw-keywords-panel-summary-meta {
  flex: 1;
  color: rgba(255, 255, 255, 0.55);
  font-size: 11.5px;
}
.cw-keywords-panel-summary-arrow {
  font-size: 13px;
  color: rgba(245, 158, 11, 0.65);
  transition: transform 160ms ease;
}
.cw-keywords-panel-wrap[open] .cw-keywords-panel-summary-arrow {
  transform: rotate(180deg);
}

.cw-keywords-panel {
  padding: 8px 12px 12px;
  font-size: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  max-height: 220px;
  overflow-y: auto;
  border-top: 1px solid rgba(245, 158, 11, 0.10);
}
.cw-keywords-panel::-webkit-scrollbar { width: 6px; }
.cw-keywords-panel::-webkit-scrollbar-thumb {
  background: rgba(245, 158, 11, 0.25);
  border-radius: 3px;
}

.cw-keywords-panel[hidden] { display: none !important; }

.cw-keywords-panel-head {
  flex-basis: 100%;
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 4px;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(245, 158, 11, 0.65);
}
.cw-keywords-panel-head .cw-keywords-panel-meta {
  color: rgba(255, 255, 255, 0.40);
  text-transform: none;
  letter-spacing: 0;
  font-size: 10.5px;
}

.cw-kw-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 9px 4px 8px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.10);
  color: rgba(255, 255, 255, 0.78);
  font-size: 11.5px;
  line-height: 1.2;
  transition: background 100ms ease, border-color 100ms ease;
  cursor: default;
  max-width: 280px;
}
.cw-kw-pill:hover {
  background: rgba(255, 255, 255, 0.07);
  border-color: rgba(255, 255, 255, 0.18);
}

.cw-kw-pill-count {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 10.5px;
  font-weight: 600;
  padding: 1px 5px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.55);
}

/* Цветовая шкала плотности:
   - missing (нет вхождений) — мягкий красный
   - low      (1)            — янтарный
   - good     (2-4)          — зелёный
   - over     (5+)           — синий «переспам» предупреждение */
.cw-kw-pill.is-missing {
  background: rgba(239, 68, 68, 0.10);
  border-color: rgba(239, 68, 68, 0.30);
  color: rgba(252, 165, 165, 0.92);
}
.cw-kw-pill.is-missing .cw-kw-pill-count { background: rgba(239, 68, 68, 0.20); color: #fecaca; }
.cw-kw-pill.is-low {
  background: rgba(245, 158, 11, 0.10);
  border-color: rgba(245, 158, 11, 0.30);
  color: rgba(252, 211, 77, 0.95);
}
.cw-kw-pill.is-low .cw-kw-pill-count { background: rgba(245, 158, 11, 0.20); color: #fde68a; }
.cw-kw-pill.is-good {
  background: rgba(34, 197, 94, 0.10);
  border-color: rgba(34, 197, 94, 0.30);
  color: rgba(134, 239, 172, 0.95);
}
.cw-kw-pill.is-good .cw-kw-pill-count { background: rgba(34, 197, 94, 0.20); color: #bbf7d0; }
.cw-kw-pill.is-over {
  background: rgba(59, 130, 246, 0.10);
  border-color: rgba(59, 130, 246, 0.32);
  color: rgba(147, 197, 253, 0.95);
}
.cw-kw-pill.is-over .cw-kw-pill-count { background: rgba(59, 130, 246, 0.20); color: #bfdbfe; }

.cw-kw-pill-ws {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9.5px;
  color: rgba(255, 255, 255, 0.42);
  margin-left: 2px;
}

.cw-keywords-panel-empty {
  color: rgba(255, 255, 255, 0.32);
  font-style: italic;
}

/* Сводка плотности — справа в шапке панели */
.cw-keywords-panel-density {
  margin-left: auto;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 10.5px;
  padding: 2px 8px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.55);
}
.cw-keywords-panel-density.ok { color: #86efac; background: rgba(34, 197, 94, 0.12); }
.cw-keywords-panel-density.warn { color: #fde68a; background: rgba(245, 158, 11, 0.12); }
.cw-keywords-panel-density.bad { color: #fca5a5; background: rgba(239, 68, 68, 0.12); }

/* ───────────────────────────────────────────────────────────────────────
   3. Меню Экспорт (P1-7 lite)
   ─────────────────────────────────────────────────────────────────────── */

.cw-export-menu-mount {
  position: relative;
  display: inline-block;
}

.cw-export-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: transparent;
  border: 1px solid rgba(245, 158, 11, 0.28);
  border-radius: 4px;
  padding: 3px 9px;
  color: rgba(252, 211, 77, 0.90);
  font-size: 11.5px;
  cursor: pointer;
  transition: background 120ms ease, border-color 120ms ease;
}
.cw-export-toggle:hover {
  background: rgba(245, 158, 11, 0.08);
  border-color: rgba(245, 158, 11, 0.45);
}
.cw-export-toggle:focus-visible {
  outline: 2px solid rgba(245, 158, 11, 0.7);
  outline-offset: 2px;
}

.cw-export-popover {
  position: absolute;
  bottom: calc(100% + 6px);
  left: 0;
  z-index: 100;
  min-width: 220px;
  background: rgba(28, 24, 18, 0.96);
  border: 1px solid rgba(245, 158, 11, 0.30);
  border-radius: 6px;
  padding: 5px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.55), 0 2px 12px rgba(0, 0, 0, 0.35);
  display: none;
}
.cw-export-popover.is-open { display: block; }

.cw-export-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  width: 100%;
  text-align: left;
  background: transparent;
  border: none;
  border-radius: 4px;
  color: rgba(255, 255, 255, 0.85);
  font-size: 12px;
  cursor: pointer;
  transition: background 100ms ease;
}
.cw-export-item:hover { background: rgba(245, 158, 11, 0.12); }
.cw-export-item:focus-visible {
  outline: 2px solid rgba(245, 158, 11, 0.7);
  outline-offset: -2px;
  background: rgba(245, 158, 11, 0.10);
}
.cw-export-item .cw-export-item-ext {
  margin-left: auto;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 10px;
  color: rgba(255, 255, 255, 0.40);
}

/* ───────────────────────────────────────────────────────────────────────
   4. Drafts UI (E-06 frontend) — «Сохранить версию» + «Версии»
   ─────────────────────────────────────────────────────────────────────── */

.cw-drafts-menu-mount,
.cw-drafts-menu-wrap {
  position: relative;
  display: inline-block;
}

.cw-drafts-popover {
  position: absolute;
  bottom: calc(100% + 6px);
  right: 0;
  z-index: 100;
  width: 360px;
  max-width: 92vw;
  background: rgba(28, 24, 18, 0.97);
  border: 1px solid rgba(245, 158, 11, 0.30);
  border-radius: 8px;
  padding: 8px;
  box-shadow: 0 14px 50px rgba(0, 0, 0, 0.65), 0 4px 14px rgba(0, 0, 0, 0.40);
  display: none;
}
.cw-drafts-popover.is-open { display: block; }

.cw-drafts-popover-head {
  padding: 6px 8px 8px;
  border-bottom: 1px solid rgba(245, 158, 11, 0.15);
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(245, 158, 11, 0.75);
}

.cw-drafts-list {
  max-height: 360px;
  overflow-y: auto;
  padding: 4px 0 0;
}
.cw-drafts-list::-webkit-scrollbar { width: 6px; }
.cw-drafts-list::-webkit-scrollbar-thumb {
  background: rgba(245, 158, 11, 0.25);
  border-radius: 3px;
}

.cw-drafts-empty {
  padding: 18px 12px;
  text-align: center;
  color: rgba(255, 255, 255, 0.40);
  font-size: 12px;
  line-height: 1.5;
}

.cw-draft-item {
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid transparent;
  transition: background 100ms ease, border-color 100ms ease;
  margin-bottom: 4px;
}
.cw-draft-item:hover {
  background: rgba(245, 158, 11, 0.06);
  border-color: rgba(245, 158, 11, 0.20);
}

.cw-draft-item-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 4px;
}
.cw-draft-item-title {
  flex: 1;
  font-size: 12.5px;
  color: rgba(255, 255, 255, 0.92);
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cw-draft-item-ts {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 10.5px;
  color: rgba(255, 255, 255, 0.40);
  white-space: nowrap;
}

.cw-draft-item-preview {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.55);
  line-height: 1.45;
  margin-bottom: 6px;
}

.cw-draft-item-actions {
  display: flex;
  gap: 6px;
}
.cw-draft-btn {
  background: transparent;
  border: 1px solid rgba(245, 158, 11, 0.28);
  border-radius: 4px;
  padding: 3px 9px;
  color: rgba(252, 211, 77, 0.90);
  font-size: 11px;
  cursor: pointer;
  transition: background 120ms ease;
}
.cw-draft-btn:hover {
  background: rgba(245, 158, 11, 0.10);
}
.cw-draft-btn--del {
  border-color: rgba(239, 68, 68, 0.35);
  color: rgba(252, 165, 165, 0.85);
  padding: 3px 8px;
}
.cw-draft-btn--del:hover {
  background: rgba(239, 68, 68, 0.12);
}
.cw-draft-btn:focus-visible {
  outline: 2px solid rgba(245, 158, 11, 0.7);
  outline-offset: 2px;
}

/* ───────────────────────────────────────────────────────────────────────
   5. History v2 — группы по доменам с версиями драфтов

   Заменяет плоский список chat-сессий по URL (cw-history-item).
   Структура: <details domain> → <details page> → версии (rows).
   ─────────────────────────────────────────────────────────────────────── */

.cw-history-group {
  border-radius: 6px;
  margin-bottom: 4px;
  background: rgba(20, 18, 14, 0.45);
}
.cw-history-group.is-current {
  background: rgba(245, 158, 11, 0.08);
}

.cw-history-group-head {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px 9px;
  cursor: pointer;
  user-select: none;
  list-style: none;
  font-size: 11.5px;
  border-radius: 6px;
  transition: background 100ms ease;
}
.cw-history-group-head::-webkit-details-marker { display: none; }
.cw-history-group-head:hover { background: rgba(245, 158, 11, 0.07); }

.cw-history-group-domain {
  font-family: 'Playfair Display', Georgia, serif;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.92);
  flex-shrink: 0;
}
.cw-history-group-meta {
  flex: 1;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 10px;
  color: rgba(255, 255, 255, 0.45);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cw-history-group-arrow {
  color: rgba(245, 158, 11, 0.55);
  font-size: 12px;
  transition: transform 160ms ease;
}
.cw-history-group[open] .cw-history-group-arrow { transform: rotate(180deg); }

.cw-history-group-pages {
  padding: 4px 6px 6px 14px;
  border-left: 2px solid rgba(245, 158, 11, 0.15);
  margin-left: 6px;
}

.cw-history-page {
  margin-bottom: 4px;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.10);
}
.cw-history-page.is-current {
  background: rgba(245, 158, 11, 0.10);
  border-left: 2px solid rgba(245, 158, 11, 0.50);
}

.cw-history-page-head {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 7px;
  cursor: pointer;
  user-select: none;
  list-style: none;
}
.cw-history-page-head::-webkit-details-marker { display: none; }
.cw-history-page-head:hover { background: rgba(245, 158, 11, 0.06); }

.cw-history-page-title-wrap {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.cw-history-page-title {
  font-size: 11.5px;
  color: rgba(255, 255, 255, 0.88);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cw-history-page-path {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9.5px;
  color: rgba(255, 255, 255, 0.35);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cw-history-page-preview {
  font-size: 10px;
  color: rgba(255, 255, 255, 0.30);
  font-style: italic;
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cw-history-page-versions {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 10px;
  font-weight: 600;
  background: rgba(245, 158, 11, 0.18);
  color: #fde68a;
  border-radius: 8px;
  padding: 1px 6px;
  flex-shrink: 0;
}
.cw-history-page-actions {
  display: flex;
  gap: 3px;
  flex-shrink: 0;
}

.cw-history-page-versions-list {
  padding: 0 7px 6px 14px;
  font-size: 10.5px;
}
.cw-history-version-row {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 3px 0;
  border-bottom: 1px dashed rgba(255, 255, 255, 0.06);
}
.cw-history-version-row:last-child { border-bottom: none; }
.cw-history-version-ts {
  flex: 1;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  color: rgba(255, 255, 255, 0.50);
}
.cw-history-version-btn {
  background: transparent;
  border: 1px solid rgba(245, 158, 11, 0.30);
  border-radius: 4px;
  padding: 1px 7px;
  font-size: 11px;
  color: rgba(252, 211, 77, 0.92);
  cursor: pointer;
  transition: background 100ms ease;
  line-height: 1.2;
}
.cw-history-version-btn:hover { background: rgba(245, 158, 11, 0.10); }
.cw-history-version-btn--del {
  border-color: rgba(239, 68, 68, 0.30);
  color: rgba(252, 165, 165, 0.85);
}
.cw-history-version-btn--del:hover { background: rgba(239, 68, 68, 0.10); }
.cw-history-version-more {
  padding: 3px 0;
  color: rgba(255, 255, 255, 0.30);
  font-style: italic;
}

/* ───────────────────────────────────────────────────────────────────────
   6. Source picker «Анализ» — три варианта вместо двух

   Раньше юзер видел только два чекбокса без названия. Добавили
   «🌐 Текст со страницы» (чистый текст из вкладки <html>) — чтобы
   копирайтер мог переключать «как было на сайте» vs «как стало
   в драфте» и сразу видеть разницу по вхождениям ключей.
   Делаем явный лейбл «Источник:» и подсвечиваем активные опции.
   ─────────────────────────────────────────────────────────────────────── */

.cw-analyze-sources-label {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: rgba(245, 158, 11, 0.65);
  padding-right: 4px;
}

/* Активная опция (включённая) — подсветка, чтобы сразу видно было,
   какие источники прямо сейчас участвуют в подсчёте. */
.cw-analyze-source:has(input:checked) {
  color: rgba(252, 211, 77, 0.95);
}
.cw-analyze-source:has(input:not(:checked)) {
  color: rgba(255, 255, 255, 0.35);
  text-decoration: line-through;
  text-decoration-color: rgba(255, 255, 255, 0.20);
}

/* ───────────────────────────────────────────────────────────────────────
   7. TZ v4 — список чатов и кнопка «🆕 Новый чат»
   ─────────────────────────────────────────────────────────────────────── */

.cw-new-chat-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 8px 10px 6px;
  padding: 8px 12px;
  background: linear-gradient(145deg, rgba(245, 158, 11, 0.18), rgba(217, 119, 6, 0.18));
  border: 1px solid rgba(245, 158, 11, 0.40);
  border-radius: 6px;
  color: rgba(252, 211, 77, 0.96);
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 120ms ease, border-color 120ms ease, transform 80ms ease;
}
.cw-new-chat-btn:hover {
  background: linear-gradient(145deg, rgba(245, 158, 11, 0.28), rgba(217, 119, 6, 0.28));
  border-color: rgba(245, 158, 11, 0.55);
}
.cw-new-chat-btn:active { transform: scale(0.98); }
.cw-new-chat-btn:focus-visible {
  outline: 2px solid rgba(245, 158, 11, 0.75);
  outline-offset: 2px;
}
.cw-new-chat-icon {
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
}

/* Список чатов в блоке URL'а */
.cw-history-chats-list {
  padding: 4px 0 4px 14px;
  border-left: 2px solid rgba(245, 158, 11, 0.10);
  margin-left: 8px;
}

.cw-chat-row {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 4px 6px;
  margin-bottom: 2px;
  border-radius: 4px;
  transition: background 100ms ease;
}
.cw-chat-row:hover { background: rgba(245, 158, 11, 0.06); }
.cw-chat-row.is-current {
  background: rgba(245, 158, 11, 0.12);
  border-left: 2px solid rgba(245, 158, 11, 0.55);
  padding-left: 4px;
}

.cw-chat-row-main {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}
.cw-chat-row-icon { font-size: 12px; flex-shrink: 0; }
.cw-chat-row-title {
  flex: 1;
  min-width: 0;
  font-size: 11.5px;
  color: rgba(255, 255, 255, 0.88);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cw-chat-row-meta {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9.5px;
  color: rgba(255, 255, 255, 0.35);
  flex-shrink: 0;
}
.cw-chat-row-actions {
  display: flex;
  gap: 2px;
  opacity: 0;
  transition: opacity 100ms ease;
}
.cw-chat-row:hover .cw-chat-row-actions,
.cw-chat-row.is-current .cw-chat-row-actions {
  opacity: 1;
}
.cw-chat-row-btn {
  background: transparent;
  border: 1px solid rgba(245, 158, 11, 0.25);
  border-radius: 3px;
  padding: 1px 6px;
  font-size: 11px;
  line-height: 1.1;
  color: rgba(252, 211, 77, 0.85);
  cursor: pointer;
  transition: background 100ms ease;
}
.cw-chat-row-btn:hover { background: rgba(245, 158, 11, 0.10); }
.cw-chat-row-btn--del {
  border-color: rgba(239, 68, 68, 0.30);
  color: rgba(252, 165, 165, 0.85);
}
.cw-chat-row-btn--del:hover { background: rgba(239, 68, 68, 0.10); }
.cw-chat-row-rename-input {
  flex: 1;
  background: rgba(0, 0, 0, 0.40);
  border: 1px solid rgba(245, 158, 11, 0.50);
  border-radius: 3px;
  color: rgba(255, 255, 255, 0.95);
  font-size: 11.5px;
  padding: 2px 6px;
  outline: none;
}

/* TZ v4 T-12 — кнопка отправки превращается в стоп во время AI-стрима */
.cw-composer-send.is-stop {
  background: rgba(239, 68, 68, 0.18);
  border-color: rgba(239, 68, 68, 0.45);
  color: #fca5a5;
}
.cw-composer-send.is-stop:hover {
  background: rgba(239, 68, 68, 0.30);
}

/* ───────────────────────────────────────────────────────────────────────
   8. TZ v4 T-18/T-19 — подсветка ключей в тексте (toggle)

   Default OFF (потому что mark-background на каждый ключ через 50+
   слов превращает страницу в попугая). Пользователь включает кнопкой
   🔆 в шапке табов; цвет — та же шкала что в keywords-panel.
   ─────────────────────────────────────────────────────────────────────── */

mark.cw-kw-hit {
  background: rgba(34, 197, 94, 0.18);
  border-radius: 2px;
  padding: 0 2px;
  color: inherit;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
mark.cw-kw-hit.is-low  { background: rgba(245, 158, 11, 0.22); }
mark.cw-kw-hit.is-good { background: rgba(34, 197, 94, 0.20); }
mark.cw-kw-hit.is-over { background: rgba(59, 130, 246, 0.24); }
mark.cw-kw-hit.is-missing { background: transparent; }  /* не подсвечиваем */

.cw-kw-highlight-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 4px;
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 4px;
  padding: 4px 8px;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.55);
  cursor: pointer;
  transition: background 100ms ease, color 100ms ease, border-color 100ms ease;
}
.cw-kw-highlight-toggle:hover {
  background: rgba(245, 158, 11, 0.08);
  color: rgba(252, 211, 77, 0.95);
  border-color: rgba(245, 158, 11, 0.30);
}
.cw-kw-highlight-toggle.is-active {
  background: rgba(34, 197, 94, 0.12);
  color: #86efac;
  border-color: rgba(34, 197, 94, 0.45);
}
.cw-kw-highlight-toggle:focus-visible {
  outline: 2px solid rgba(245, 158, 11, 0.75);
  outline-offset: 2px;
}

/* ───────────────────────────────────────────────────────────────────────
   9. a11y-добавки
   ─────────────────────────────────────────────────────────────────────── */

/* Видимое фокус-кольцо на табах и action-кнопках копирайтера. До этого
   браузерный outline переопределялся `outline:none` где-то по дереву. */
.cw-tab:focus-visible,
.cw-action-btn:focus-visible {
  outline: 2px solid rgba(245, 158, 11, 0.75);
  outline-offset: 2px;
}

/* Плейсхолдеры теперь видны на тёмном фоне (контраст ≥ 4.5:1). */
.cw-composer-input::placeholder,
.cw-input::placeholder {
  color: rgba(255, 255, 255, 0.55);
}
