:root {
    --accent: #2d6cdf;
    --bg: #f5f7fa;
    --fg: #1a2230;
    --muted: #586273;   /* контрастнее прежнего #6b7685 (читаемость серых подписей) */
}

* { box-sizing: border-box; }

/* Верхняя навигация (рабочие пространства) */
.topnav { position: sticky; top: 0; z-index: 200; /* непрозрачная и поверх sticky-шапок таблиц */
    display: flex; align-items: center; gap: 16px; background: #1a2230;
    padding: 0 24px; height: 46px; color: #cdd5e0; font-size: 13px; }
.topnav .brand { color: #fff; font-weight: 700; text-decoration: none; font-size: 16px; }
.topnav .nav-links { display: flex; gap: 14px; flex-wrap: wrap; }
.topnav .nav-links a { color: #cdd5e0; text-decoration: none; }
.topnav .nav-links a:hover, .topnav .nav-links a.active { color: #fff; }
.topnav .nav-user { margin-left: auto; display: flex; gap: 12px; align-items: center; }
.topnav .nav-user .who { color: #fff; }
.topnav .nav-user em { color: #b0bccd; font-style: normal; }
.topnav .nav-user a { color: #b0bccd; }
.topnav .nav-user .logout-form { display: inline; margin: 0; }
/* Кнопка «выйти» в виде ссылки (форма нужна для POST + CSRF) */
.linklike {
    background: none; border: 0; padding: 0; margin: 0;
    font: inherit; cursor: pointer; color: #b0bccd; text-decoration: underline;
}
.topnav .linklike:hover { color: #fff; }

body {
    margin: 0;
    font-family: -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    background: var(--bg);
    color: var(--fg);
}

header {
    background: #fff;
    padding: 28px 40px;
    border-bottom: 1px solid #e3e8ef;
}

header h1 {
    margin: 0;
    color: var(--accent);
    font-size: 28px;
}

.subtitle {
    margin: 4px 0 0;
    color: var(--muted);
}

main {
    padding: 32px 40px;
    max-width: 760px;
    line-height: 1.6;
}

.health {
    margin-top: 24px;
    color: var(--muted);
}

a { color: var(--accent); }

/* Доступность: видимый фокус для клавиатурной навигации */
a:focus-visible, button:focus-visible, select:focus-visible,
input:focus-visible, textarea:focus-visible, summary:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 1px;
    border-radius: 3px;
}

/* Широкие таблицы: горизонтальный скролл вместо разлёта страницы */
.table-scroll { overflow-x: auto; max-width: 100%; }

/* Реестр страниц */
main.wide { max-width: 100%; padding: 24px 32px; }

.filters { display: flex; gap: 16px; align-items: center; margin-bottom: 16px; flex-wrap: wrap; row-gap: 8px; }
.filters select, .filters input { padding: 4px 8px; }
/* Единый стиль подписи фильтра на всех экранах */
.filters .f { display: inline-flex; gap: 6px; align-items: center; color: var(--muted); font-size: 13px; }
/* Группировка (#5): фильтры данных слева плотно, «Срез»/«На странице» — справа */
.filters { justify-content: space-between; align-items: flex-end; }
.filters-data, .filters-view { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; }
.filters-data .f, .filters-view .f { flex-direction: column; align-items: flex-start; gap: 2px; }
/* Активный фильтр (#3): подсветка + кнопка сброса */
.filters .f.active select { border-color: var(--accent); background: #eef4ff; font-weight: 600; }
.filters-reset { color: #c0392b; border-color: #e3b3b3; align-self: center; }
.filters-reset:hover { background: #c0392b; color: #fff; border-color: #c0392b; }

.summary { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; color: var(--muted); }
.summary .total { margin-left: auto; }
.inline { display: inline; margin: 0; }
.btn {
    background: var(--accent); color: #fff; border: 0; padding: 7px 14px;
    border-radius: 6px; cursor: pointer; font-size: 14px;
}
.btn:hover { opacity: .9; }

.dot { display: inline-block; width: 11px; height: 11px; border-radius: 50%; vertical-align: middle; }
.dot.green { background: #2b9d4f; }
.dot.yellow { background: #e3a008; }
.dot.red { background: #d63b3b; }
.dot.gray { background: #c3cad6; }
/* Замечания на карточке страницы — те же бейджи, что в реестре */
.card-issues { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; margin: 4px 0 16px; }
/* Полные списки дублей/проблемных ссылок на карточке */
.dup-h { margin: 12px 0 4px; font-size: 13px; }
.dup-h .muted { font-weight: 400; }
.dup-list { margin: 0 0 6px; padding-left: 20px; font-size: 13px; }
.dup-list li { margin: 2px 0; word-break: break-all; }
.dup-details summary { cursor: pointer; color: var(--accent); font-size: 13px; margin-bottom: 4px; }
/* Здоровье выборки на /pages (доля не-красных страниц) */
/* Бейдж здоровья — та же геометрия, что у «пилюль»-светофоров рядом
   (inline-flex + одинаковые паддинги/радиус), иначе выбивается из ряда */
.lights .health { display: inline-flex; align-items: center; font-weight: 700;
    font-size: 13px; padding: 4px 12px; border-radius: 16px; border: 1px solid transparent; }
.lights .health.good { background: #e6f4ec; color: #1a8a4a; border-color: #cfe9da; }
.lights .health.mid { background: #fdf3d6; color: #876600; border-color: #efe0b0; }
.lights .health.bad { background: #fbe2e2; color: #9a1f1f; border-color: #f0c2c2; }
.lights .health-spark { width: 120px; height: 26px; vertical-align: middle; }
.lights .health-spark polyline { stroke: #2b9d4f; stroke-width: 1.5; }
.lights .health-spark circle { fill: #2b9d4f; opacity: .8; }

table.grid { border-collapse: collapse; width: 100%; font-size: 13px; background: #fff; }
/* Редактор прав ролей */
.roles-grid { max-width: 820px; }
.roles-grid th.role-col { text-align: center; vertical-align: bottom; font-size: 12px; }
.roles-grid th.role-admin, .roles-grid td.role-admin { background: #f4f6fa; color: var(--muted); }
.roles-grid td.sec-label { font-weight: 500; }
.roles-grid td.chkcell { text-align: center; }
.roles-grid td.chkcell input { width: 16px; height: 16px; cursor: pointer; }
.roles-actions { display: flex; gap: 12px; align-items: center; margin: 14px 0; }
table.grid th, table.grid td { border: 1px solid #e3e8ef; padding: 5px 8px; text-align: left; }
/* Шапки таблиц липнут к верху СВОЕГО скролл-контейнера (.table-scroll —
   overflow-контейнер, sticky работает относительно него): top обязан быть 0,
   иначе над шапкой открывается «окно» с просвечивающей первой строкой. */
table.grid thead th { background: #f0f3f8; position: sticky; top: 0; }
table.grid tr:hover td { background: #f8fafc; }
td.url { max-width: 360px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
td.ell { max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
td.issues { color: #8a6d00; font-size: 12px; }

.status-list { list-style: none; padding: 0; }
.status-list li { margin: 8px 0; }
.status-list .dot { margin-right: 8px; }

/* Таблица скоринга */
.filters .count { color: var(--muted); margin-left: auto; }
.flash { background: #e6f5ec; border: 1px solid #b6e0c5; color: #1c6b3a;
    padding: 8px 12px; border-radius: 6px; }

table.scoring { border-collapse: collapse; width: 100%; font-size: 13px; background: #fff; }
table.scoring th, table.scoring td { border: 1px solid #e8ecf2; padding: 4px 7px; text-align: left; }
table.scoring thead th { background: #f0f3f8; position: sticky; top: 0; white-space: nowrap; }
table.scoring thead th a { color: var(--fg); text-decoration: none; }
table.scoring tr:hover td { background: #f8fafc; }
table.scoring td.num { text-align: right; font-variant-numeric: tabular-nums; }
/* Заголовки числовых колонок — тоже по правому краю, чтобы стояли над цифрами */
table.scoring thead th.num-h, table.scoring thead th.num-h a { text-align: right; }
table.scoring thead th.num-h a { display: block; }
table.scoring td.phrase { max-width: 320px; }
/* «Нет данных» (выдача по фразе ещё не снята): бледный прочерк вместо нуля. */
table.scoring td.nodata { color: #c3cad6; }
/* Видимость (/visibility): рейтинг доменов выдачи, свои сайты подсвечены. */
table.vis-grid tr.own td { background: #eef6ff; }
table.vis-grid tr.own:hover td { background: #e3efff; }
table.vis-grid td.domain a { color: inherit; }
table.vis-grid tr.own td.domain a { color: var(--accent); font-weight: 600; }
.own-badge { display: inline-block; margin-left: 6px; background: var(--accent); color: #fff;
    border-radius: 99px; padding: 0 7px; font-size: 11px; font-weight: 600; vertical-align: 1px; }
/* полоса видимости фоном ячейки: ширина --w нормирована к лидеру рейтинга */
table.vis-grid td.vis-cell { font-weight: 600;
    background: linear-gradient(90deg, #cfe3fb var(--w, 0), transparent var(--w, 0)); }
table.vis-grid tr.own td.vis-cell {
    background: linear-gradient(90deg, #b7d6fa var(--w, 0), #eef6ff var(--w, 0)); }
/* история видимости домена: строка кликабельна, график в раскрытии */
table.vis-grid tr.vis-row { cursor: pointer; }
table.vis-grid .hist-caret { display: inline-block; width: 12px; color: #9aa6b5;
    font-size: 11px; transition: transform .15s ease; }
table.vis-grid tr.vis-row.open .hist-caret { transform: rotate(90deg); }
table.vis-grid tr.vis-hist td { background: #fbfcfe; padding: 10px 14px; }
.hist-chart { display: block; width: 100%; max-width: 720px; height: auto; }
.hist-chart .line { fill: none; stroke: var(--accent); stroke-width: 2; }
.hist-chart .area { fill: #2d6cdf18; stroke: none; }
.hist-chart .ax { stroke: #dbe2ea; stroke-width: 1; }
.hist-chart .lbl { fill: #6b7685; font-size: 10px; }
.hist-chart circle { fill: var(--accent); }
/* раскрытие строки: график и страницы рядом (на узких экранах — колонкой) */
.hist-flex { display: flex; gap: 20px; align-items: flex-start; flex-wrap: wrap; }
.hist-flex .hist-side { flex: 1 1 420px; min-width: 320px; }
.hist-sub { margin: 0 0 6px; font-size: 13px; }
table.hist-pages { max-width: 860px; font-size: 12px; }
table.hist-pages td.num { text-align: right; font-variant-numeric: tabular-nums; }
/* Липкие первые колонки при горизонтальном скролле: чекбокс + город + фраза.
   Город — фиксированной ширины и в одну строку (иначе съедает ширину «Фразы»,
   и та разлезается на две строки); смещения sticky зависят от ширин слева. */
table.scoring td.chk, table.scoring thead th.chk { width: 30px; min-width: 30px; text-align: center; }
table.scoring td.chk, table.scoring thead th.chk { position: sticky; left: 0; background: #fff; }
table.scoring td.city, table.scoring thead th.city-h {
    position: sticky; left: 30px; background: #fff;
    width: 100px; min-width: 100px; max-width: 100px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
table.scoring td.phrase, table.scoring thead th.phrase-h { position: sticky; left: 130px; background: #fff; }
table.scoring thead th.chk, table.scoring thead th.city-h, table.scoring thead th.phrase-h { background: #f0f3f8; z-index: 3; }
table.scoring tr:hover td.chk, table.scoring tr:hover td.city, table.scoring tr:hover td.phrase { background: #f8fafc; }

/* Дашборд: график видимости по срезам (как «Проверка позиций» Топвизора) */
.dash-chart { background: #fff; border: 1px solid #e3e8ef; border-radius: 10px;
    padding: 14px 16px; margin: 0 0 16px; }
.dash-chart-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.dash-chart-head h2 { font-size: 15px; margin: 0; color: var(--fg); }
.dash-gauge { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.1; }
.dash-gauge-val { font-size: 24px; font-weight: 700; color: #2b9d4f; }
.dash-gauge-cap { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.dash-chart svg { margin-top: 8px; }
/* Точки графика проявляются только при наведении (линия чище), курсор-подсказка */
.dash-chart circle.pt { cursor: pointer; transition: fill .1s, stroke .1s; }
.dash-chart circle.pt:hover { fill: #fff; stroke: #2b9d4f; stroke-width: 1.5; }

/* Дашборд: KPI-карточки */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px; margin: 0 0 16px; }
.kpi { background: #fff; border: 1px solid #e3e8ef; border-radius: 10px; padding: 10px 12px; }
.kpi-cap { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; }
.kpi-val { font-size: 22px; font-weight: 700; margin: 2px 0; }
.kpi-val.kpi-dyn { font-size: 16px; }
.kpi-sub { font-size: 11px; color: var(--muted); }
.kpi-bar { height: 6px; background: #eef1f6; border-radius: 3px; overflow: hidden; margin-top: 6px; }
.kpi-bar span { display: block; height: 100%; background: #2b9d4f; }
/* Массовые действия: неактивны до выбора строк (паттерн Gmail) — на любой странице */
[data-needs-select][disabled] { opacity: .45; cursor: not-allowed; pointer-events: none; }
/* Колонка «Сайт» на /pages: без переноса, чтобы не раздувать высоту строк */
td.site-cell { white-space: nowrap; font-size: 12px; }
/* Инсайт над таблицей: диагноз по отфильтрованным строкам одной строкой */
.insight { background: #eef4ff; border: 1px solid #c7d8f5; border-radius: 7px;
    padding: 7px 12px; font-size: 13px; margin: 0 0 10px; display: inline-block; }
/* Динамика позиций: стек-бар выросло/на месте/упало (доли по числу фраз) */
.kpi-stackbar { display: flex; height: 8px; border-radius: 4px; overflow: hidden;
    margin-top: 6px; background: #eef1f6; }
.kpi-stackbar .seg.up { background: #2b9d4f; }
.kpi-stackbar .seg.same { background: #c3ccd8; }
.kpi-stackbar .seg.down { background: #d63b3b; }
.kpi .d-up, .kpi .d-down { font-size: 13px; font-weight: 600; }

/* Подмена таблицы при динамической навигации */
#scoring-results.is-loading { opacity: .5; transition: opacity .12s; }

/* Панель массовых действий (чекбоксы) */
.bulk-bar { display: flex; align-items: center; gap: 12px; margin: 0 0 12px; flex-wrap: wrap; }
.bulk-actions { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.bulk-hint { font-size: 12px; }

/* Ошибочный флеш (валидация добавления запроса) */
.flash-err { background: #fdeaea; border-color: #f3b7b7; color: #a02525; }

/* Кнопки удаления */
.btn-ghost { background: #fff; color: var(--accent); border: 1px solid #cfd6e0; }
.btn-ghost:hover { background: var(--accent); color: #fff; border-color: var(--accent); opacity: 1; }
.btn-danger { background: #fff; color: #c0392b; border: 1px solid #e3b3b3; }
.btn-danger:hover { background: #c0392b; color: #fff; border-color: #c0392b; opacity: 1; }
.btn-mini.btn-danger { background: #fff; }
td.row-actions { white-space: nowrap; }
td.row-actions .inline { margin-right: 2px; }

/* Панель добавления запроса */
.add-query { margin: 0 0 14px; }
.add-query > summary { cursor: pointer; color: var(--accent); font-size: 14px; padding: 4px 0; }
.add-query-form { margin-top: 8px; }
/* «＋ Новая задача» на доске планера — открывает пустую боковую панель (единый вид с деталями). */
.add-task-btn { display: inline-block; margin: 0 0 14px; background: none; border: 0;
    cursor: pointer; color: var(--accent); font-size: 14px; padding: 4px 0; }
.add-task-btn:hover { text-decoration: underline; }
.board-tools .add-task-btn { margin: 0; }
.add-query-form textarea {
    width: 100%; max-width: 900px; box-sizing: border-box; resize: vertical;
    font: 13px/1.4 ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    padding: 8px; border: 1px solid #cfd6e0; border-radius: 6px; margin-bottom: 8px;
}
/* Панель сбора данных: слева частые точечные обновления, справа — «Полный сбор» */
.collect-bar { display: flex; align-items: center; gap: 16px; margin: 0 0 12px;
    flex-wrap: wrap; justify-content: space-between; }
.collect-quick, .collect-full { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
/* Кнопки сбора — это ДЕЙСТВИЯ (запускают платные/долгие операции), а не
   фильтры-вкладки: тонированный фон + рамка в акцент, иконка ⟳ в подписи */
.collect-quick .btn-mini { background: #eef4ff; border-color: #b9cdf2; color: #234a94;
    font-weight: 600; }
.collect-quick .btn-mini:hover:not([disabled]) { background: #dce9ff; border-color: #8fb0e8; }
.collect-bar .btn-mini[disabled] { opacity: .5; cursor: not-allowed; }
.collect-bar .collect-sep { color: #cfd6e0; }
/* `stale` = данные давно не обновлялись (срок — в title). Янтарь привлекает
   внимание к тому, что стоит обновить, а не к «весу» кнопки. */
.collect-bar .btn-mini.stale { background: #fdf6e3; border-color: #e0bd62; color: #8a6d1a; }
.collect-bar .btn-mini.stale:hover { background: #f6e3b0; color: #5e4a10; border-color: #d9ad48; }
/* Главное действие — «Полный сбор» (.btn — синяя primary) */
.collect-bar .collect-main { padding: 6px 12px; }
/* Идёт сбор — все кнопки заблокированы (один прогресс-индикатор ниже) */
.collect-bar.collecting button { opacity: .45; pointer-events: none; cursor: not-allowed; }
/* Остаток на счетах платных API (кэш последней проверки); low = ниже порога */
.collect-bar .balances { font-size: 13px; }
.collect-bar .balances b { font-weight: 600; color: inherit; }
.collect-bar .balances b.low { color: #b42318; }
/* ── Панель «Операции» (плавающая, правый нижний угол) + тосты ─────────────
   Живёт в base.html: прогресс фоновых сборов виден на любом экране и не
   двигает контент страницы. Сворачивается в «пилюлю» (localStorage). */
.ops-root { position: fixed; right: 16px; bottom: 16px; z-index: 60;
    display: flex; flex-direction: column; align-items: flex-end; gap: 10px;
    max-width: calc(100vw - 32px); pointer-events: none; }
.ops-root > * { pointer-events: auto; }
.ops-panel { width: 400px; max-width: 100%; background: #fff;
    border: 1px solid #dbe2ea; border-radius: 10px; font-size: 13px;
    box-shadow: 0 6px 24px rgba(26, 34, 48, .18); }
.ops-head { display: flex; align-items: center; gap: 8px; padding: 8px 12px;
    border-bottom: 1px solid #e8edf3; font-size: 14px; }
.ops-badge { background: #e9f0fc; color: var(--accent); border-radius: 99px;
    padding: 1px 8px; font-size: 12px; font-weight: 600; }
.ops-ghost { background: none; border: 0; color: var(--muted); cursor: pointer;
    font-size: 12px; padding: 2px 5px; border-radius: 5px; margin-left: auto; }
.ops-ghost:hover, .ops-ghost:focus-visible { color: var(--fg); background: var(--bg); outline: none; }
.ops-job { padding: 8px 12px; border-bottom: 1px solid #e8edf3; }
.ops-job:last-child { border-bottom: 0; }
.ops-row { display: flex; align-items: baseline; gap: 7px; flex-wrap: wrap; }
.ops-st { color: var(--muted); font-variant-numeric: tabular-nums; }
.ops-errn { color: #b42318; font-weight: 600; }
.ops-wait { color: #b8860b; font-weight: 600; }
.ops-spacer { flex: 1; }
.ops-stop { border: 1px solid #dbe2ea; background: none; color: var(--muted);
    border-radius: 6px; font-size: 12px; padding: 1px 8px; cursor: pointer; }
.ops-stop:hover { color: #c0392b; border-color: #c0392b; }
.ops-bar { height: 5px; margin-top: 6px; background: #eef1f6; border-radius: 3px; overflow: hidden; }
.ops-bar span { display: block; height: 100%; background: var(--accent);
    border-radius: 3px; transition: width .4s ease; }
.ops-chip { display: inline-block; border-radius: 99px; padding: 1px 8px;
    font-size: 12px; font-weight: 600; }
.ops-chip.ok { background: #e6f4ec; color: #1a8a4a; }
.ops-chip.warn { background: #fdf3dd; color: #a06a00; }
.ops-chip.crit { background: #fdeceb; color: #b42318; }
.ops-chip.run { background: #e9f0fc; color: var(--accent); }
/* Схлопнутая причина ошибок: «21 × закончились деньги» + ссылка на починку */
.ops-agg { background: #fdeceb; border-radius: 7px; padding: 5px 8px; margin-top: 6px;
    font-size: 12px; word-break: break-word; }
.ops-agg b { color: #b42318; }
.ops-errors { margin-top: 5px; }
.ops-errors summary { cursor: pointer; color: #b42318; font-size: 12px; }
.ops-errors ul { margin: 4px 0 0; padding-left: 18px; font-size: 12px;
    color: var(--muted); max-height: 200px; overflow: auto; }
.ops-errors li { margin: 2px 0; word-break: break-word; }
.ops-foot { padding: 7px 12px; border-top: 1px solid #e8edf3; font-size: 12px; }
.ops-empty { padding: 14px 12px; color: var(--muted); font-size: 13px; text-align: center; }
/* Свёрнутый вид — «пилюля» со сводкой */
.ops-pill { display: inline-flex; align-items: center; gap: 7px; background: #fff;
    border: 1px solid #dbe2ea; border-radius: 99px; padding: 8px 14px;
    font-size: 13px; color: var(--fg); cursor: pointer;
    box-shadow: 0 6px 24px rgba(26, 34, 48, .18); }
/* `display:inline-flex` перебивает атрибут [hidden] (UA-правило той же
   специфичности) — без этого пустая «пилюля» висела в углу мёртвой кнопкой,
   когда операций нет. Явно прячем скрытую пилюлю (селектор с [hidden] специфичнее). */
.ops-pill[hidden] { display: none; }
.ops-pill .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent);
    animation: ops-pulse 1.6s infinite; }
@keyframes ops-pulse { 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .ops-pill .dot { animation: none; } }
.ops-pill .err { color: #b42318; font-weight: 600; }
/* Тосты о завершении: успех гаснет сам, с ошибками — до закрытия */
.ops-toast { display: flex; gap: 8px; align-items: flex-start; width: 360px;
    max-width: 100%; background: #fff; border: 1px solid #dbe2ea;
    border-left: 4px solid #1a8a4a; border-radius: 9px; padding: 8px 12px;
    font-size: 13px; box-shadow: 0 6px 24px rgba(26, 34, 48, .18); }
.ops-toast.warn { border-left-color: #d9a521; }
.ops-toast.crit { border-left-color: #c0392b; }
.ops-toast b { display: block; }
.ops-toast .d { color: var(--muted); }
.ops-toast .ops-ghost { margin-left: auto; }
/* Журнал операций */
table.journal td.nowrap { white-space: nowrap; }
table.journal td.num { text-align: right; font-variant-numeric: tabular-nums; }
table.scoring td.url { max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Приоритет — мини-полоса фоном; ширину строка задаёт переменной --w (короче, чем
   полный inline-gradient в каждой ячейке). Подсказка — на заголовке колонки. */
td.prio { font-weight: 600; background: linear-gradient(90deg, #cdeccc var(--w,0), transparent var(--w,0)); }
.rel-bad { color: #d63b3b; }

/* подсветка позиции — фон ячейки (как в первой версии) */
.pos-top3  { background: #cdeccc; }
.pos-top10 { background: #e7f6e0; }
.pos-out   { background: #f0f0f0; color: var(--muted); }
/* подсветка сложности */
/* Сложность: шкала «чем выше — тем горячее», БЕЗ зелёного — иначе рядом с
   зелёным баром приоритета (где больше = важнее) две противоположные семантики
   одним цветом. Лёгкие фразы просто не подсвечиваются. */
.diff-easy     { background: transparent; }
.diff-mid      { background: #fdf2cf; }
.diff-hard     { background: #fadfc8; }
.diff-veryhard { background: #f7cfcf; }

.btn-mini { border: 1px solid #cfd6e0; background: #fff; cursor: pointer;
    border-radius: 5px; padding: 1px 7px; font-size: 14px; line-height: 1.2; }
.btn-mini:hover { background: var(--accent); color: #fff; }
/* Действия строки: «✎ целевая» и «＋ задача» — нейтральные (правка/создание),
   корзина — деструктивная. Наведение — мягкая подсветка (светлый фон + акцентный
   текст), а не сплошная заливка: в каждой строке сплошной синий блок был слишком
   тяжёлым. Корзина в покое серая (не пугает), краснеет только при наведении. */
.btn-mini.btn-task, .btn-mini.btn-target { white-space: nowrap; color: var(--accent); }
.btn-mini.btn-task:hover, .btn-mini.btn-target:hover {
    background: #eef4ff; color: var(--accent); border-color: #b9cdf2; }
.btn-mini.btn-trash { color: #9aa6b4; border-color: #e1e6ee; }
.btn-mini.btn-trash:hover { background: #c0392b; color: #fff; border-color: #c0392b; }
td.row-actions { white-space: nowrap; }
.pager { display: flex; gap: 16px; align-items: center; margin: 14px 0; color: var(--muted); }

/* Сводка по срезу (нижняя панель, как «Показатели» в рангтрекере) */
table.metrics { border-collapse: collapse; margin: 18px 0; font-size: 13px; min-width: 340px; }
table.metrics th { text-align: left; font-weight: 600; color: var(--muted); padding: 5px 14px 5px 0; white-space: nowrap; }
table.metrics td { padding: 5px 0; }
table.metrics tr { border-bottom: 1px solid #eef1f6; }
.d-up { color: #1a8a4a; }
.d-down { color: #c0392b; }
.d-same { color: var(--muted); }

/* Иконка «домой» в навигации (вместо бренда) */
.topnav .nav-home { font-size: 16px; line-height: 1; text-decoration: none; color: #8fa0b6; }
.topnav .nav-home:hover { color: #fff; }

/* Качество ключа — компактный бейдж (не переносится на две строки) */
/* Бейджи категориальных колонок (Качество/Коммерц./Сезонность) — единый pill.
   Подсветка согласована с тепловой палитрой чисел: green=хорошо, янтарь=средне,
   red=плохо; info=нейтрально-синий, neutral=серый. */
.badge { display: inline-block; white-space: nowrap; font-size: 12px;
    border-radius: 4px; padding: 1px 7px; }
.badge-good    { background: #d8f0d8; color: #1c6b3a; }
.badge-mid     { background: #fdf2cf; color: #8a6d1a; }
.badge-bad     { background: #f7cfcf; color: #9a2a2a; }
.badge-info    { background: #e5edfb; color: #2b4a8a; }
.badge-neutral { background: #eef1f6; color: #475467; }

/* Δ — отдельная колонка динамики позиции (как в первом варианте, но цветная и
   сортируемая): up=зелёный ▲, down/out=красный ▼/✕, new=синий ●; пусто без
   изменения. Выровнена вправо (класс .num), как числовые колонки. */
td.delta-cell { font-weight: 700; }
.delta .tri { font-size: 0.85em; }
.delta.up   { color: #1a8a4a; }
.delta.down, .delta.out { color: #c0392b; }
.delta.new  { color: var(--accent); }

/* Приоритет — мини-полоса фоном ячейки (визуальный вес ключевой колонки).
   Фон, а не позиционируемый элемент: иначе ячейка перекрывала бы «липкую» шапку.
   Жирность задаёт общее правило td.prio выше — здесь не дублируем. */

/* Закреплённая панель массовых действий (не теряется при прокрутке таблицы).
   Высота фиксирована и не переносится (nowrap) — поэтому смещение шапки ниже
   (top:48px) остаётся верным на любой ширине; подсказка при нехватке места
   ужимается, а не растит панель в высоту. */
.bulk-bar { position: sticky; top: 46px; z-index: 6; background: var(--bg);
    padding: 8px 0; border-bottom: 1px solid #e3e8ef; }
/* Шапка таблицы остаётся флешем у верха своего скролл-контейнера (.table-scroll
   создаёт overflow-контекст). НЕЛЬЗЯ задавать top>0 — иначе «липкая» шапка
   смещается вниз внутрь таблицы и первая строка повисает над заголовками. */
table.scoring thead th { top: 0; z-index: 2; }
table.scoring thead th.chk, table.scoring thead th.phrase-h { z-index: 4; }

/* Реестр: кликабельные счётчики-фильтры (светофор сверху) */
.summary.lights { flex-wrap: wrap; }
/* Плашки-счётчики — это ФИЛЬТРЫ: синий текст (читается как ссылка) + hover.
   Активный фильтр — заливка с акцентной рамкой; рядом появляется «× сбросить». */
.summary .light { display: inline-flex; align-items: center; gap: 6px; text-decoration: none;
    color: var(--accent); padding: 4px 10px; border: 1px solid #cfd9ea; border-radius: 16px;
    background: #fff; font-size: 13px; cursor: pointer; }
.summary .light:hover { border-color: var(--accent); background: #eef4ff; box-shadow: 0 1px 3px rgba(45, 108, 223, .15); }
.summary .light.on { border-color: var(--accent); background: #eef4ff;
    box-shadow: inset 0 0 0 1px var(--accent); font-weight: 600; }
.summary .light.reset { color: var(--muted); border-style: dashed; }

/* Реестр: числовые колонки и пороговая подсветка ячеек */
table.grid td.num { text-align: right; font-variant-numeric: tabular-nums; }
table.grid td.cell-warn { background: #fdf2cf; }
table.grid td.cell-bad { background: #f7cfcf; }
/* Title: символы сверх лимита — красным */
td.ell .over { color: #c0392b; }
.noalt { color: #c0392b; }  /* счётчик картинок без alt в реестре */

/* Замечания с уровнем критичности — главная ценность реестра, стоят 3-й колонкой
   (сразу после URL). Единый размер/отступы; чёткая шкала: красный = критично,
   жёлтый = замечание (одна система кодирования, как на скоринге). */
td.issues { white-space: normal; max-width: 320px; }
.issue { display: inline-block; font-size: 11.5px; line-height: 1.5; border-radius: 3px;
    padding: 1px 7px; margin: 1px 4px 1px 0; border: 1px solid transparent; white-space: nowrap; }
.issue.crit { background: #fbe2e2; color: #9a1f1f; border-color: #f0c2c2; font-weight: 600; }
.issue.warn { background: #fdf3d6; color: #876600; border-color: #ecd9a3; }

/* Статус строки — тонкой акцент-полосой слева (вместо колонки-точки: экономит
   место, не дублирует «Замечания»). */
table.grid td.acc { border-left: 3px solid transparent; }
table.grid tr.row-red    td.acc { border-left-color: #d63b3b; }
table.grid tr.row-yellow td.acc { border-left-color: #e3a008; }
table.grid tr.row-green  td.acc { border-left-color: #2b9d4f; }
table.grid th.chk, table.grid td.acc { width: 1%; white-space: nowrap; }

/* Недоступная/необойдённая страница — технические колонки свёрнуты в одно
   состояние (не 10 прочерков подряд). */
table.grid td.dead { color: var(--muted); font-style: italic; background: #fbfcfe; }

/* Колонка «Мета»: Title и Description друг под другом, с длиной и подсветкой нормы
   (раздел 2.1 ТЗ доработок). Закрывает отсутствие Description и обрезание Title. */
td.meta-cell { max-width: 380px; padding: 6px 12px; vertical-align: top; }
.meta-row { display: flex; align-items: baseline; gap: 6px; line-height: 1.4; }
.meta-row + .meta-row { margin-top: 2px; }
.meta-tag { flex: 0 0 auto; font-size: 10px; font-weight: 700; color: #9ca3af; width: 12px; }
.meta-text { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis;
    white-space: nowrap; font-size: 13px; color: #1f2937; }
.meta-len { flex: 0 0 auto; font-size: 11px; font-weight: 600; font-variant-numeric: tabular-nums;
    padding: 1px 5px; border-radius: 4px; }
.meta-len.len-ok   { color: #14532d; background: #bbf7d0; }   /* длина в норме */
.meta-len.len-warn { color: #713f12; background: #fde68a; }   /* длина вне нормы */
.meta-len.len-bad  { color: #7f1d1d; background: #fecaca; }   /* сильно вне нормы */
.meta-empty { flex: 1 1 auto; font-size: 13px; color: #dc2626; }

/* Настройки вида: «настраиваемые» числовые колонки реестра по умолчанию СКРЫТЫ
   (чистым CSS — освобождают ширину под «Мету» и не зависят от JS), а показываются,
   когда JS навешивает на table.grid класс show-<col> из localStorage. */
.view-settings { margin: 0 0 12px; font-size: 13px; }
.view-settings > summary { cursor: pointer; color: var(--muted); user-select: none; }
.view-settings-body { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px;
    margin-top: 8px; padding: 8px 12px; background: #fafbfd; border: 1px solid #eef1f6; border-radius: 6px; }
.view-settings-body .vs-label { color: var(--muted); }
.view-settings-body label { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; }
table.grid .col-h1, table.grid .col-words, table.grid .col-internal,
table.grid .col-external, table.grid .col-images, table.grid .col-response { display: none; }
table.grid.show-h1       .col-h1       { display: table-cell; }
table.grid.show-words    .col-words    { display: table-cell; }
table.grid.show-internal .col-internal { display: table-cell; }
table.grid.show-external .col-external { display: table-cell; }
table.grid.show-images   .col-images   { display: table-cell; }
table.grid.show-response .col-response { display: table-cell; }

/* Панель добавления страниц: один выбор сайта, два источника (кнопки formaction) */
.add-pages-form .block-label { display: block; margin: 8px 0 0; }
.add-pages-actions { display: flex; gap: 8px; margin-top: 8px; }
.add-pages-form .hint { color: var(--muted); font-size: 12px; margin: 6px 0 0; }

/* Форма добавления сайта: компактная сетка полей */
.sites-add-grid { display: flex; flex-wrap: wrap; gap: 12px 18px; align-items: end; }
.sites-add-grid .f { margin: 0; display: flex; flex-direction: column; gap: 2px;
    font-size: 13px; color: var(--muted); }
.sites-add-grid .f input[type=text], .sites-add-grid .f select { width: 150px; }
.sites-add-grid .chk-inline { flex-direction: row; align-items: center; gap: 6px; }
.sites-add .hint { color: var(--muted); font-size: 12px; margin: 8px 0 0; max-width: 640px; }

/* Настройки: вкладки раздела (Общие / Интеграции) */
.subtabs { display: flex; gap: 4px; margin: 0 0 18px; border-bottom: 1px solid #e3e8ef; }
.subtabs a { padding: 8px 16px; text-decoration: none; color: var(--muted);
    border: 1px solid transparent; border-bottom: 0; border-radius: 6px 6px 0 0;
    margin-bottom: -1px; }
.subtabs a:hover { color: var(--fg); }
.subtabs a.on { color: var(--fg); font-weight: 600; background: #fff;
    border-color: #e3e8ef; }

/* Настройки: подзаголовок группы полей */
.settings-group { margin: 22px 0 6px; padding-top: 14px; border-top: 1px solid #e3e8ef;
    font-size: 15px; color: var(--fg); }

/* Реестр: запуск краулера — дорогая фоновая операция, кнопка второстепенная
   (primary-яркость провоцировала случайные полные обходы). */
.summary .crawl-main { padding: 6px 14px; font-weight: 600; }
.summary .freshness { color: var(--muted); font-size: 13px; }
/* Идёт обход — действия заблокированы (стоп/прогресс — в индикаторе ниже). */
#pages-summary.collecting form button { pointer-events: none; opacity: .45; cursor: not-allowed; }

/* «Не проверено» — нейтральный серый: страницы только добавлены, обхода не было
   (это не «проблема», а «не нажата кнопка»). Определён выше в .dot.gray */
table.grid tr.row-gray td.acc { border-left-color: #c2cad6; }
.issue.info { background: #eef1f6; color: #5b6573; border-color: #dde2ea; }
/* Плашки замечаний: видны первые 2, остальные — по клику на «+N» */
td.issues .issues-extra { display: none; }
td.issues.open .issues-extra { display: inline; }
td.issues.open .issues-more { display: none; }
.issues-more { border: 1px dashed #c3ccd8; background: #fff; color: var(--accent);
    border-radius: 3px; font-size: 11.5px; padding: 0 6px; cursor: pointer; line-height: 1.5; }
.issues-more:hover { border-color: var(--accent); background: #eef4ff; }
/* Управление таблицей (настройки вида, добавление страниц) — справа, отдельно от
   фильтров. Тумблеры оформлены кнопками-пилюлями (голый текст с дефолтным ▶
   details читался как случайная ссылка и «плавал» по базовой линии). */
.pages-tools { display: flex; gap: 10px; justify-content: flex-end; align-items: flex-start;
    margin: 0 0 10px; }
.pages-tools > details { margin: 0; }
.pages-tools > details > summary { list-style: none; display: inline-flex; align-items: center;
    gap: 6px; padding: 6px 12px; border: 1px solid #cfd6df; border-radius: 8px;
    background: #fff; color: var(--accent); font-size: 13px; cursor: pointer;
    user-select: none; white-space: nowrap; }
.pages-tools > details > summary::-webkit-details-marker { display: none; }
.pages-tools > details > summary::marker { content: ''; }
.pages-tools > details > summary:hover,
.pages-tools > details[open] > summary { border-color: var(--accent); background: #eef4ff; }
/* Раскрытые панели — карточкой, а не голым текстом в потоке */
.pages-tools .view-settings-body,
.pages-tools .add-query-form { background: #fff; border: 1px solid #e3e8ef;
    border-radius: 10px; padding: 12px 14px; margin-top: 8px;
    box-shadow: 0 4px 14px rgba(15, 23, 42, .06); }

/* Нумерованная пагинация (вместо текстовой «стр. 1 из 5 · вперёд →»). */
.pager-num { display: flex; gap: 4px; align-items: center; margin: 14px 0; flex-wrap: wrap; }
.pager-num .pg-num, .pager-num .pg-btn { display: inline-flex; align-items: center;
    justify-content: center; min-width: 30px; height: 30px; padding: 0 8px; font-size: 13px;
    border: 1px solid #d8dee7; border-radius: 6px; background: #fff; color: var(--fg);
    text-decoration: none; }
.pager-num a.pg-num:hover, .pager-num a.pg-btn:hover { border-color: var(--accent); color: var(--accent); }
.pager-num .pg-num.cur { background: var(--accent); color: #fff; border-color: var(--accent); font-weight: 600; }
.pager-num .pg-btn.disabled { opacity: .4; pointer-events: none; }
.pager-num .pg-gap { color: var(--muted); padding: 0 2px; }

/* Карточка страницы */
.crumbs { margin: 0 0 12px; }
.page-url { font-size: 18px; margin: 0 0 4px; word-break: break-all; }
.meta { color: var(--muted); margin: 0 0 18px; }
.muted { color: var(--muted); }
.card-cols { display: flex; gap: 28px; flex-wrap: wrap; }
.card-block { flex: 1; min-width: 320px; margin-bottom: 22px; }
.card-block h3 { font-size: 15px; margin: 0 0 10px; }
table.kv { border-collapse: collapse; width: 100%; font-size: 13px; }
table.kv td { border-bottom: 1px solid #eef1f6; padding: 5px 8px; vertical-align: top; }
table.kv td:first-child { color: var(--muted); width: 42%; }
svg.chart { background: #fff; border: 1px solid #e8ecf2; border-radius: 6px; }
.chart-max { fill: #667085; font-size: 11px; }
.ok { color: #2b9d4f; }

/* Доска задач */
/* ── Планер: доска ── */
.board-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-bottom: 12px; }
.board-tools .arrange { display: inline-flex; align-items: center; gap: 6px; }
.board-hint { font-size: 12px; }
.board { display: flex; gap: 18px; align-items: flex-start; }
.board-col { flex: 1; min-width: 280px; background: #eef1f6; border-radius: 8px; padding: 10px;
    transition: background .12s, box-shadow .12s; }
.board-col.drag-over { background: #e2ecff; box-shadow: inset 0 0 0 2px #9cc0ff; }
.board-col h3 { font-size: 14px; margin: 2px 4px 12px; display: flex; justify-content: space-between; }
.col-count { color: var(--muted); font-weight: 400; }
.col-empty { color: #8894a6; font-size: 12px; text-align: center; padding: 18px 8px;
    border: 1px dashed #cfd8e6; border-radius: 7px; }

/* Карточка (компактная; детали — в боковой панели) */
.task-card { position: relative; background: #fff; border: 1px solid #e3e8ef; border-radius: 7px;
    padding: 9px 30px 9px 11px; margin-bottom: 10px; font-size: 13px; cursor: grab; }
.task-card.dragging { opacity: .45; }
.task-check { position: absolute; top: 9px; right: 9px; }
.task-goal { font-weight: 600; margin: 0 0 5px; cursor: pointer; }
.task-goal:hover { color: var(--accent); }
/* Превью описания на карточке — приглушённое, максимум 2 строки. */
.task-desc { color: var(--muted); font-size: 12px; margin: 4px 0 2px; cursor: pointer;
    white-space: pre-line; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden; }
.task-page-chip { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis;
    white-space: nowrap; vertical-align: bottom; font-size: 11px; color: #5b6674; background: #f1f4f9;
    border-radius: 10px; padding: 1px 8px; text-decoration: none; }
.task-page-chip:hover { color: var(--accent); background: #e8eefb; }
.task-label { color: var(--muted); font-size: 11px; margin-top: 5px; }

/* Действия: переходы группой слева, корзина отодвинута вправо и приглушена (необратимое — не рядом) */
.task-actions { display: flex; align-items: center; gap: 6px; margin-top: 8px; }
.status-moves { display: flex; flex-wrap: wrap; gap: 6px; }
.btn-open { color: var(--muted); }
.task-del { margin-left: auto; opacity: .45; }
.task-del:hover { opacity: 1; }
/* Инструменты карточки (копировать/удалить) прижаты вправо единой группой. */
.card-tools { margin-left: auto; display: inline-flex; gap: 6px; align-items: center; }
.card-tools .task-del { margin-left: 0; }
.btn-copy { opacity: .5; }
.btn-copy:hover { opacity: 1; }

/* Мета-чипы карточки (приоритет / ответственный / срок / чек-лист / обсуждение) */
.task-meta { display: flex; flex-wrap: wrap; gap: 5px; margin: 6px 0; }
.task-meta .meta-chip, .task-meta .prio-chip {
    font-size: 11px; padding: 1px 7px; border-radius: 10px; background: #eef1f6; color: #344054; white-space: nowrap; }
.task-meta .meta-chip.overdue { background: #fdecea; color: #c0392b; }
.prio-chip.prio-high { background: #fdecea; color: #c0392b; font-weight: 600; }
.prio-chip.prio-mid { background: #eef4ff; color: #234a94; }
.prio-chip.prio-low { background: #eef1f6; color: #586273; }
select.prio-high { color: #c0392b; font-weight: 600; }

/* ── Боковая панель деталей (доска остаётся целой) ── */
.drawer-overlay { position: fixed; inset: 0; background: rgba(20,28,45,.45); z-index: 300;
    opacity: 0; transition: opacity .2s; }
.drawer-overlay.open { opacity: 1; }
/* Панель — flex-колонка: шапка и футер «Сохранить» фиксированы, середина скроллится */
.task-drawer { position: fixed; top: 0; right: 0; height: 100vh; width: min(600px, 94vw);
    background: #fff; z-index: 301; box-shadow: -12px 0 34px rgba(20,28,45,.28);
    padding: 18px 22px; transform: translateX(100%); transition: transform .2s ease;
    display: flex; flex-direction: column; }
.task-drawer.open { transform: translateX(0); }
.drawer-head { flex: none; display: flex; align-items: flex-start; gap: 10px; margin-bottom: 12px;
    border-bottom: 1px solid #eef1f6; padding-bottom: 12px; }
.task-form { flex: 1; min-height: 0; display: flex; flex-direction: column; margin: 0; }
.task-form-body { flex: 1; min-height: 0; overflow-y: auto; padding-right: 2px; }
.task-form-footer { flex: none; border-top: 1px solid #eef1f6; padding-top: 12px; margin-top: 4px;
    display: flex; align-items: center; gap: 10px; }
.btn-ghost { background: none; border: 0; color: var(--accent); cursor: pointer;
    font-size: 13px; padding: 8px 4px; }
.btn-ghost:hover { text-decoration: underline; }
.drawer-head-main { min-width: 0; flex: 1; }
.drawer-title { font-weight: 700; font-size: 16px; line-height: 1.3; margin-bottom: 5px; }
.drawer-close { flex: none; background: none; border: 0; font-size: 20px; line-height: 1;
    color: var(--muted); cursor: pointer; padding: 2px 6px; }
.drawer-close:hover { color: var(--fg); }

/* Единый вид полей формы в панели */
.task-form .fld { display: block; margin: 12px 0; font-size: 12px; color: #4a5568; font-weight: 500; }
.task-form input:not([type=checkbox]), .task-form select, .task-form textarea {
    display: block; width: 100%; box-sizing: border-box; margin-top: 4px; padding: 7px 9px;
    border: 1px solid #cfd6e0; border-radius: 6px; font-size: 13px; color: var(--fg); background: #fff;
    font-weight: 400; }
.task-form select, .task-form input[type=date], .task-form .fld input[type=text] { height: 36px; }
.task-form .task-row { display: flex; gap: 10px; }
.task-form .task-row .fld { flex: 1; min-width: 0; }
.btn-save { background: var(--accent); color: #fff; border: 0; border-radius: 6px;
    padding: 9px 20px; font-size: 13px; font-weight: 500; cursor: pointer; }
.btn-save:hover { background: #2158c4; }

/* Чек-лист */
.chk-block, .discuss-block { margin: 14px 0; }
.chk-title { font-weight: 600; font-size: 12px; color: #344054; display: block; margin-bottom: 6px; }
.chk-item { display: flex; align-items: center; gap: 6px; margin: 3px 0; }
.task-form .chk-item input[type=checkbox] { width: auto; flex: none; margin: 0; }
.task-form .chk-item input[type=text] { border-color: transparent; background: transparent;
    height: auto; padding: 3px 5px; margin-top: 0; }
.chk-item input[type=text]:hover, .chk-item input[type=text]:focus { border-color: #cfd6e0 !important; background: #fff; }
.chk-item.done input[type=text] { text-decoration: line-through; color: var(--muted); }
.chk-add { display: flex; gap: 6px; margin-top: 6px; }
.chk-add .chk-add-input { margin-top: 0; }
.chk-add .btn-mini { flex: none; }

/* Обсуждение — ограничено по высоте, чтобы поля и «Сохранить» не уезжали */
.discuss-list { max-height: 200px; overflow-y: auto; margin-bottom: 8px; }
.discuss-msg { position: relative; background: #f4f6fa; border-radius: 6px; padding: 7px 9px; margin: 6px 0; }
.discuss-author { font-weight: 600; font-size: 12px; }
.discuss-time { color: var(--muted); font-size: 11px; margin-left: 6px; }
.discuss-body { font-size: 13px; margin-top: 2px; white-space: pre-wrap; }
/* Действия над репликой — в правом верхнем углу, проявляются при наведении. */
.discuss-actions { position: absolute; top: 5px; right: 6px; display: inline-flex; gap: 2px;
    opacity: 0; transition: opacity .12s; }
.discuss-msg:hover .discuss-actions, .discuss-actions:focus-within { opacity: 1; }
.discuss-act { border: none; background: none; cursor: pointer; font-size: 12px; line-height: 1;
    padding: 2px 3px; border-radius: 4px; color: var(--muted); }
.discuss-act:hover { background: #e2e8f2; color: #1f2a3a; }
.discuss-edit { display: flex; gap: 4px; margin-top: 4px; }
.discuss-edit-input { flex: 1; font-size: 13px; padding: 3px 6px; }
.small { font-size: 12px; }

/* Прогноз трафика */
.legend { color: var(--muted); margin: 6px 0 14px; }
.legend .sw { display: inline-block; width: 12px; height: 12px; border-radius: 3px; vertical-align: middle; margin: 0 3px 0 12px; }
.legend .sw.plan { background: #2d6cdf; }
.legend .sw.fact { background: #2b9d4f; }
.chart-x { fill: #667085; font-size: 11px; text-anchor: middle; }

/* Формы рекламы */
form.stack { display: flex; flex-direction: column; gap: 8px; max-width: 280px; }
form.stack input, form.stack select { padding: 5px 8px; }
table.grid tfoot td { border-top: 2px solid #cbd5e1; background: #f8fafc; }

/* Страница входа */
.login-wrap { display: flex; min-height: 100vh; align-items: center; justify-content: center; background: #eef1f6; }
.login-card { background: #fff; padding: 32px 36px; border-radius: 10px; box-shadow: 0 6px 24px rgba(26,34,48,.12); width: 320px; }
.login-card h1 { color: var(--accent); margin: 0; }
.login-card .subtitle { margin: 4px 0 20px; }
.login-card form.stack { max-width: 100%; }
.login-card input { padding: 9px 11px; }
.login-error { background: #fdecec; border: 1px solid #f5c2c2; color: #b42318; padding: 8px 11px; border-radius: 6px; font-size: 13px; }

/* Настройки интеграций */
.setting-block { margin: 14px 0; }
.setting-row { display: flex; align-items: center; gap: 10px; }
.setting-row label { flex: 0 0 240px; color: #344054; font-size: 13px; }
.setting-row input { flex: 1; padding: 7px 9px; }
.setting-hint { margin: 4px 0 0 250px; color: #5b6472; font-size: 11.5px; line-height: 1.4; }
.oauth-app { margin-top: 18px; border-top: 1px solid #e8ecf2; padding-top: 12px; }
.oauth-app summary { cursor: pointer; color: var(--muted); font-size: 13px; }
.accounts { list-style: none; padding: 0; margin: 4px 0 14px; }
.accounts li { display: flex; align-items: center; gap: 10px; padding: 6px 0; }
.accounts .ava { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; }
.accounts .ava-stub { display: inline-flex; align-items: center; justify-content: center;
    background: #2d6cdf; color: #fff; font-weight: 600; font-size: 14px; }
.accounts .acc-name { font-weight: 600; }
.accounts form { margin-left: auto; }

/* Реестр: массовые действия всплывают плавающей панелью при выборе строк —
   кнопки в поднятой сводке не видны, когда выделяешь внизу длинной таблицы. */
#pages-bulk-form.floating { position: fixed; bottom: 18px; left: 50%;
    transform: translateX(-50%); z-index: 300; display: flex; gap: 8px;
    background: #fff; border: 1px solid #d5dbe3; border-radius: 10px;
    padding: 10px 14px; box-shadow: 0 8px 28px rgba(15, 23, 42, .18); }

/* Фильтр по подстроке URL в строке фильтров /pages */
.filters .url-filter { width: 180px; padding: 5px 8px; border: 1px solid #cfd6df;
    border-radius: 6px; font-size: 13px; }

/* Реестр: сводка в стиле KPI-карточек /scoring. Карточки-счётчики кликабельны
   (фильтр по статусу), активный фильтр подсвечен рамкой. */
.kpis a.kpi { display: block; text-decoration: none; color: inherit; }
.kpis a.kpi:hover { border-color: var(--accent); }
.kpis .kpi.on { border-color: var(--accent); box-shadow: 0 0 0 2px rgba(45, 108, 223, .15); }
.kpi-val.v-good { color: #1c7c31; }
.kpi-val.v-mid { color: #8a6d00; }
.kpi-val.v-bad { color: #c02626; }
.kpi-val.v-gray { color: var(--muted); }
.pages-actions { margin: 10px 0 14px; }