/* Запасные значения указаны перед каждым var() — IE11 не поддерживает
   CSS-переменные и использует предыдущее объявление свойства. */
#kanban-app-root {
    --kb-bg: #f4f5f7;
    --kb-column-bg: #ebecf0;
    --kb-card-bg: #ffffff;
    --kb-primary: #0079bf;
    --kb-primary-dark: #026aa7;
    --kb-danger: #eb5a46;
    --kb-text: #172b4d;
    --kb-text-light: #5e6c84;
    --kb-border: #dfe1e6;
    /* Шрифты для значков указаны явно: Edge Legacy (версия 44, движок
       EdgeHTML) сам запасной шрифт почти не подбирает, и символы, которых
       нет в основном шрифте, показывались пустыми прямоугольниками */
    /* Шрифты значков идут ДО sans-serif. Обобщенное семейство sans-serif
       подходит под что угодно, и перебор шрифтов на нем заканчивается —
       все, что указано после него, браузер не смотрит никогда. */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", "Noto Color Emoji", sans-serif;
    color: #172b4d;
    color: var(--kb-text);
    max-width: 100%;
}

#kanban-app-root * {
    box-sizing: border-box;
}

.kb-toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 16px;
    padding: 10px 14px;
    background: #f4f5f7;
    background: var(--kb-bg);
    border-radius: 8px;
    /* Доска прокручивается страницей, и панель уезжала бы вверх вместе
       с ней. Липкая строка держит выбор доски и кнопки под рукой, на какой
       бы карточке человек ни находился. Старые браузеры sticky не знают —
       там панель просто прокручивается, как раньше */
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 30;
    box-shadow: 0 2px 0 rgba(9, 30, 66, .06);
}
/* В старом Edge липкая строка перекрывала бы выпадающие меню */
.kb-legacy .kb-toolbar { position: static; }

.kb-toolbar select, .kb-toolbar input, .kb-toolbar button {
    font-size: 14px;
    padding: 7px 10px;
    border-radius: 6px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    background: #fff;
}

.kb-btn {
    cursor: pointer;
    border: none;
    background: #0079bf;
    background: var(--kb-primary);
    color: #fff;
    font-weight: 600;
    transition: background .15s;
}
.kb-btn:hover { background: #026aa7; background: var(--kb-primary-dark); }
.kb-btn.kb-btn-secondary { background: #6b778c; }
.kb-btn.kb-btn-secondary:hover { background: #4d5768; }
.kb-btn.kb-btn-danger { background: #eb5a46; background: var(--kb-danger); }
.kb-btn.kb-btn-danger:hover { background: #cf4030; }
.kb-btn:disabled { opacity: .5; cursor: not-allowed; }

.kb-role-badge {
    font-size: 12px;
    padding: 3px 8px;
    border-radius: 10px;
    background: #dfe1e6;
    color: #5e6c84;
    color: var(--kb-text-light);
    font-weight: 600;
}
.kb-role-badge.admin { background: #f4d03f33; color: #b8860b; }
.kb-role-badge.member { background: #d1f2eb; color: #0e8a6f; }
.kb-role-badge.viewer { background: #e8eaf6; color: #5c6bc0; }

.kb-filters {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}

.kb-board-wrapper {
    display: flex;
    gap: 12px;
    /* Горизонтально доска прокручивается сама, вертикально — вместе
       со страницей: высота обертки всегда по содержимому */
    overflow-x: auto;
    overflow-y: visible;
    height: auto !important;
    max-height: none !important;
    padding-bottom: 12px;
    align-items: flex-start; /* высота каждой колонки — по ее содержимому */
}

.kb-column {
    background: #ebecf0;
    background: var(--kb-column-bg);
    border-radius: 8px;
    /* Ширину задаем через flex-basis, а не через min/max-width.
       Раньше стояло max-width: 270px — из-за него колонка не тянулась мышью:
       встроенный стиль с новой шириной перебивался этим ограничением. */
    flex: 0 0 270px;
    width: 270px;
    display: flex;
    flex-direction: column;
    position: relative;
}

.kb-column-header {
    padding: 8px 10px 10px;
    font-weight: 700;
    font-size: 14px;
    display: block;
}

.kb-column-count {
    font-weight: 400;
    color: #5e6c84;
    color: var(--kb-text-light);
    font-size: 12px;
}

/* Колонка не прокручивается внутри себя: ее длина зависит от количества
   карточек, а вниз прокручивается вся страница. Внутренняя прокрутка
   выглядела так, будто доска кончается там, где кончается экран, —
   до нижних карточек добирались вслепую. */
.kb-column-cards {
    flex: 1 1 auto;
    overflow: visible;
    /* Запас по краям: колонка обрезает все, что выходит за ее край,
       и свечение просроченной карточки срезалось ровно по рамке */
    padding: 0 10px;
    min-height: 40px;
}

.kb-column-cards.kb-dragover {
    background: rgba(9, 30, 66, 0.08);
    border-radius: 6px;
}

.kb-card {
    background: #ffffff;
    background: var(--kb-card-bg);
    border-radius: 6px;
    padding: 10px 10px;
    margin-bottom: 8px;
    box-shadow: 0 1px 0 rgba(9,30,66,.25);
    cursor: pointer;
    border-left: 3px solid transparent;
}
.kb-card:hover { background: #f9fafc; }
/* Только что созданная карточка: доска доводится до нее и коротко
   ее подсвечивает — иначе в длинной колонке ее просто не найти */
.kb-card-landed {
    box-shadow: 0 0 0 2px #0079bf, 0 1px 0 rgba(9,30,66,.25);
    box-shadow: 0 0 0 2px var(--kb-primary), 0 1px 0 rgba(9,30,66,.25);
}
/* Карточка в руке: не выцветает до призрака, а слегка приподнимается —
   наклон, тень и легкое увеличение. Так видно, что именно вы несете,
   и текст остается читаемым, пока ищете место */
.kb-card.kb-dragging {
    opacity: .85;
    transform: scale(1.03) rotate(1.2deg);
    box-shadow: 0 10px 22px rgba(9, 30, 66, .28);
    cursor: grabbing;
}
.kb-card {
    transition: transform .12s ease, box-shadow .12s ease, opacity .12s ease;
}
/* Место, куда ляжет карточка, подсвечивается плавно, а не рывком */
.kb-column-cards {
    transition: background-color .15s ease;
}

/* Просроченная задача — светло-красная заливка.
   Намеренно НЕ используем opacity: она выносит карточку в отдельный слой
   и текст на Windows теряет резкость. Приглушенный красный дает тот же
   эффект «прозрачности», но заголовок и метки остаются четкими. */
.kb-card.kb-overdue {
    background: #fdeaea;
    border-left-color: #eb5a46;
}
.kb-card.kb-overdue:hover { background: #fbdedd; }
.kb-card.kb-overdue .kb-card-title { color: #7a231b; }

.kb-card-tags {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    margin-bottom: 6px;
}

.kb-tag-pill {
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 10px;
    color: #fff;
    font-weight: 600;
}

.kb-card-title {
    font-size: 14px;
    margin-bottom: 6px;
    word-break: break-word;
}

.kb-card-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    color: #5e6c84;
    color: var(--kb-text-light);
}

.kb-due-badge {
    padding: 2px 6px;
    border-radius: 4px;
    background: #e4e6ea;
}
.kb-due-badge.overdue {
    background: #eb5a46;
    background: var(--kb-danger);
    color: #fff;
}
/* Время рядом с датой: тот же кегль, чуть плотнее — целое число пикселей */
.kb-due-time {
    font-weight: 600;
    margin-left: 3px;
}

.kb-assignee-chip {
    background: #0079bf;
    background: var(--kb-primary);
    color: #fff;
    border-radius: 50%;
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
}

.kb-add-card-btn {
    margin: 8px;
    padding: 8px;
    width: calc(100% - 16px);
    background: transparent;
    border: none;
    text-align: left;
    color: #5e6c84;
    color: var(--kb-text-light);
    font-size: 14px;
    cursor: pointer;
    border-radius: 6px;
}
.kb-add-card-btn:hover {
    background: rgba(9,30,66,.08);
    color: #172b4d;
    color: var(--kb-text);
}

.kb-add-column {
    min-width: 240px;
    max-width: 240px;
}
.kb-add-column button {
    width: 100%;
    padding: 10px;
    background: rgba(255,255,255,.4);
    border: 1px dashed #dfe1e6;
    border: 1px dashed var(--kb-border);
    border-radius: 8px;
    cursor: pointer;
    color: #5e6c84;
    color: var(--kb-text-light);
    font-weight: 600;
}

/* Модальные окна */
.kb-modal-overlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(9,30,66,.54);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    z-index: 99999;
    padding: 40px 16px;
    overflow-y: auto;
}

.kb-modal {
    background: #fff;
    border-radius: 8px;
    width: 100%;
    max-width: 560px;
    padding: 20px 24px 24px;
    position: relative;
}

/* Окно постановки и просмотра задачи — просторнее (пункт 4) */
.kb-modal-wide {
    max-width: 880px;
}
@media (max-width: 920px) {
    .kb-modal-wide { max-width: 100%; }
}

.kb-modal-close {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    background: none;
    border: none;
    /* Тема сайта может задавать кнопкам свои отступы и рамку — сбрасываем,
       иначе крестик разрастается и налезает на поле заголовка (пункт 11) */
    box-shadow: none;
    outline: none;
    width: 32px;
    height: 32px;
    min-width: 0;
    min-height: 0;
    padding: 0;
    margin: 0;
    line-height: 1;
    border-radius: 6px;
    font-size: 22px;
    text-align: center;
    color: #5e6c84;
    color: var(--kb-text-light);
    z-index: 2;
}
.kb-modal-close:hover {
    background: #f0f1f3;
    color: #172b4d;
}

/* Шапка карточки: заголовок занимает всю ширину, но не заходит под крестик */
.kb-card-modal-head {
    padding-right: 40px;
    margin-bottom: 12px;
}
.kb-title-input,
.kb-title-static {
    width: 100%;
    font-size: 19px;
    font-weight: 600;
    line-height: 1.35;
    color: #172b4d;
    color: var(--kb-text);
}
.kb-title-input {
    display: block;
    resize: none;
    overflow: hidden;
    min-height: 32px;
    border: none;
    border-bottom: 1px solid #dfe1e6;
    border-bottom: 1px solid var(--kb-border);
    border-radius: 0;
    padding: 4px 0;
    background: transparent;
    font-family: inherit;
}
.kb-title-input:focus {
    outline: none;
    border-bottom-color: #0079bf;
    border-bottom-color: var(--kb-primary);
}
.kb-title-static {
    word-break: break-word;
}

.kb-modal h2 {
    margin-top: 0;
    font-size: 18px;
    padding-right: 34px; /* чтобы заголовок не налезал на крестик закрытия */
}

.kb-field {
    margin-bottom: 14px;
}
.kb-field label {
    display: block;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    color: #5e6c84;
    color: var(--kb-text-light);
    margin-bottom: 4px;
}
.kb-field input[type=text],
.kb-field input[type=date],
.kb-field select,
.kb-field textarea {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 6px;
    font-size: 14px;
    font-family: inherit;
}
.kb-field textarea {
    /* Просторное поле сразу: раньше было 80 пикселей — две строки,
       и текст приходилось писать в щель, растягивая поле вручную */
    min-height: 130px;
    line-height: 1.5;
    resize: vertical;
}

.kb-modal-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-top: 18px;
}

.kb-tabs {
    display: flex;
    gap: 4px;
    border-bottom: 1px solid #dfe1e6;
    border-bottom: 1px solid var(--kb-border);
    margin: 14px 0;
}
.kb-tab {
    padding: 8px 12px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: #5e6c84;
    color: var(--kb-text-light);
    border-bottom: 2px solid transparent;
}
.kb-tab.active {
    color: #0079bf;
    color: var(--kb-primary);
    border-bottom-color: #0079bf;
    border-bottom-color: var(--kb-primary);
}

.kb-comment {
    padding: 8px 0;
    border-bottom: 1px solid #dfe1e6;
    border-bottom: 1px solid var(--kb-border);
    font-size: 13px;
}

/* Ответ внутри ветки: слева вертикальная линия показывает вложенность */
.kb-comment.kb-comment-reply {
    border-left: 2px solid #dfe1e6;
    border-left: 2px solid var(--kb-border);
    padding-left: 10px;
    border-bottom: none;
}

/* Закрепленный комментарий держится вверху списка */
.kb-comment.kb-comment-pinned {
    background: #fff9e6;
    border-left: 3px solid #f2d600;
    padding-left: 8px;
}
.kb-comment-pin-mark { font-size: 12px; }
.kb-comment-author {
    font-weight: 700;
    margin-right: 6px;
}
.kb-comment-date {
    color: #5e6c84;
    color: var(--kb-text-light);
    font-size: 11px;
}

.kb-history-item {
    font-size: 12px;
    padding: 6px 0;
    border-bottom: 1px solid #dfe1e6;
    border-bottom: 1px solid var(--kb-border);
    color: #5e6c84;
    color: var(--kb-text-light);
}
.kb-history-item strong { color: #172b4d; color: var(--kb-text); }

.kb-member-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 0;
    border-bottom: 1px solid #dfe1e6;
    border-bottom: 1px solid var(--kb-border);
    font-size: 13px;
}

.kb-member-row select {
    font-size: 12px;
    padding: 4px 6px;
}

.kb-empty-state {
    padding: 40px 20px;
    text-align: center;
    color: #5e6c84;
    color: var(--kb-text-light);
}

.kb-tag-color-swatch {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 4px;
    vertical-align: middle;
    margin-right: 6px;
    border: 1px solid rgba(0,0,0,.1);
}

.kb-tag-list-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 0;
    border-bottom: 1px solid #dfe1e6;
    border-bottom: 1px solid var(--kb-border);
}

.kb-error-banner {
    background: #fdecea;
    color: #eb5a46;
    color: var(--kb-danger);
    padding: 8px 12px;
    border-radius: 6px;
    margin-bottom: 12px;
    font-size: 13px;
}

/* Полоса «плагин обновлен, страница устарела».
   Не dismissible: пока страница не перезагружена, сохранение не работает,
   и скрытая полоса вернула бы ровно ту проблему, ради которой сделана. */
.kb-stale-version {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fff4e5;
    border: 1px solid #e0a800;
    border-left: 4px solid #e0a800;
    color: #6b4b00;
    padding: 10px 14px;
    border-radius: 6px;
    margin-bottom: 12px;
    font-size: 13px;
    line-height: 1.4;
}
.kb-stale-text { flex: 1 1 auto; }
.kb-stale-btn {
    flex: 0 0 auto;
    padding: 6px 14px;
    border-radius: 4px;
    font-size: 13px;
}
/* IE11 не понимает gap во flex — отступ ставим правилом-соседом */
.kb-legacy .kb-stale-version > * + * { margin-left: 12px; }

/* Пометки локальных связей (п.1): такие связи живут только на той доске,
   где их поставили, и на доску-источник не уходят */
.kb-local-link-note {
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
    background: #eef1f5;
    border-radius: 8px;
    padding: 2px 7px;
    margin-left: 6px;
    white-space: nowrap;
}
/* Пояснение под полем или заголовком окна: почему так и что будет дальше */
.kb-hint {
    font-size: 12px;
    line-height: 1.45;
    color: #5e6c84;
    color: var(--kb-text-light);
    margin: 4px 0 10px;
}
.kb-field .kb-hint { margin: 4px 0 0; }

.kb-local-link-hint {
    font-size: 12px;
    color: #5e6c84;
    color: var(--kb-text-light);
    background: #f4f6f8;
    border-left: 3px solid #c1c7d0;
    padding: 6px 9px;
    margin-bottom: 6px;
    line-height: 1.35;
}

/* Откуда пришла спущенная задача — в списке спусков */
.kb-deleg-from {
    display: block;
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
    margin-top: 2px;
}

.kb-readonly-note {
    font-size: 12px;
    color: #5e6c84;
    color: var(--kb-text-light);
    font-style: italic;
    margin-bottom: 10px;
}

/* ФИКС: переменные для модальных окон (они вне #kanban-app-root) */
.kb-modal-overlay {
    --kb-bg: #f4f5f7;
    --kb-column-bg: #ebecf0;
    --kb-card-bg: #ffffff;
    --kb-primary: #0079bf;
    --kb-primary-dark: #026aa7;
    --kb-danger: #eb5a46;
    --kb-text: #172b4d;
    --kb-text-light: #5e6c84;
    --kb-border: #dfe1e6;
    /* Шрифты для значков указаны явно: Edge Legacy (версия 44, движок
       EdgeHTML) сам запасной шрифт почти не подбирает, и символы, которых
       нет в основном шрифте, показывались пустыми прямоугольниками */
    /* Шрифты значков идут ДО sans-serif. Обобщенное семейство sans-serif
       подходит под что угодно, и перебор шрифтов на нем заканчивается —
       все, что указано после него, браузер не смотрит никогда. */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", "Noto Color Emoji", sans-serif;
    color: #172b4d;
    color: var(--kb-text);
}
.kb-modal-overlay * { box-sizing: border-box; }
.kb-modal-overlay .kb-btn {
    cursor: pointer;
    border: none;
    background: #0079bf;
    color: #ffffff !important;
    font-weight: 600;
    font-size: 14px;
    padding: 7px 12px;
    border-radius: 6px;
}
.kb-modal-overlay .kb-btn:hover { background: #026aa7; }
.kb-modal-overlay .kb-btn.kb-btn-secondary { background: #6b778c; }
.kb-modal-overlay .kb-btn.kb-btn-secondary:hover { background: #4d5768; }
.kb-modal-overlay .kb-btn.kb-btn-danger { background: #eb5a46; }
.kb-modal-overlay .kb-btn.kb-btn-danger:hover { background: #cf4030; }

/* Вложения */
.kb-attachment-row {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 6px 0;
    border-bottom: 1px solid #dfe1e6;
    border-bottom: 1px solid var(--kb-border);
    font-size: 13px;
}
/* Название прижато влево и занимает всю свободную ширину: раньше строка
   растягивалась по краям и названия висели вразнобой */
.kb-attachment-row .kb-att-body {
    flex: 1 1 auto;
    min-width: 0;
    text-align: left;
}
.kb-attachment-row a { color: #0079bf; color: var(--kb-primary); text-decoration: none; word-break: break-all; }
.kb-attachment-row a:hover { text-decoration: underline; }
.kb-attachment-meta { font-size: 11px; color: #5e6c84; color: var(--kb-text-light); }

/* Метка рабочей папки на карточке */
.kb-folder-chip {
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
    display: block;
    margin-top: 4px;
}

/* Кнопки экспорта */
.kb-export-menu { position: relative; display: inline-block; }
.kb-export-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(9,30,66,.2);
    z-index: 999;
    min-width: 200px;
    display: none;
}
.kb-export-dropdown.open { display: block; }
.kb-export-dropdown a {
    display: block;
    padding: 8px 12px;
    font-size: 13px;
    color: #172b4d;
    color: var(--kb-text);
    text-decoration: none;
    cursor: pointer;
}
.kb-export-dropdown a:hover { background: #f4f5f7; background: var(--kb-bg); }
.kb-export-dropdown .kb-export-divider { border-top: 1px solid #dfe1e6; border-top: 1px solid var(--kb-border); margin: 4px 0; }

/* Оформление всех кнопок колонки задано ниже, в блоке .kb-col-btn.
   Прежнее правило прятало только кнопку переименования (visibility: hidden),
   из-за чего кнопки выглядели и вели себя по-разному. */

/* Чек-листы */
.kb-checklist-badge {
    display: inline-block;
    font-size: 11px;
    padding: 2px 6px;
    border-radius: 4px;
    background: #e4e6ea;
    color: #5e6c84;
    margin-top: 4px;
}
.kb-checklist-badge.complete {
    background: #61bd4f;
    color: #fff;
}
.kb-cl-progress-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}
.kb-cl-progress-label {
    font-size: 12px;
    color: #5e6c84;
    min-width: 34px;
}
.kb-cl-progress-bar {
    flex: 1;
    height: 8px;
    background: #e4e6ea;
    border-radius: 4px;
    overflow: hidden;
}
.kb-cl-progress-fill {
    height: 100%;
    background: #61bd4f;
    transition: width .2s;
}
.kb-cl-group {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    color: #5e6c84;
    margin: 10px 0 4px;
}
.kb-cl-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 4px 0;
    font-size: 14px;
    gap: 6px;
}
.kb-cl-item label {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    cursor: pointer;
    flex: 1;
}
.kb-cl-item.done span {
    text-decoration: line-through;
    color: #5e6c84;
}
.kb-cl-item .kb-cl-del {
    background: none;
    border: none;
    color: #5e6c84;
    cursor: pointer;
    font-size: 16px;
    padding: 0 4px;
    visibility: hidden;
}
.kb-cl-item:hover .kb-cl-del { visibility: visible; }
.kb-cl-item .kb-cl-del:hover { color: #eb5a46; }

/* Стрелки перестановки пунктов — как и удаление, видны при наведении */
.kb-cl-item .kb-cl-move {
    background: none;
    border: none;
    color: #5e6c84;
    cursor: pointer;
    font-size: 10px;
    padding: 0 2px;
    visibility: hidden;
}
.kb-cl-item:hover .kb-cl-move { visibility: visible; }
.kb-cl-item .kb-cl-move:hover { color: #0079bf; }
.kb-cl-item .kb-cl-move:disabled { opacity: .4; cursor: default; }

/* Правка текста пункта: карандаш виден при наведении, как стрелки и удаление */
.kb-cl-item .kb-cl-edit {
    background: none;
    border: none;
    color: #5e6c84;
    cursor: pointer;
    font-size: 13px;
    padding: 0 3px;
    visibility: hidden;
}
.kb-cl-item:hover .kb-cl-edit { visibility: visible; }
.kb-cl-item .kb-cl-edit:hover { color: #0079bf; }
/* На сенсорном экране наведения нет — карандаш виден всегда */
@media (hover: none) {
    .kb-cl-item .kb-cl-edit { visibility: visible; }
}
.kb-cl-edit-box {
    flex: 1;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 6px;
}
.kb-cl-edit-input {
    flex: 1 1 100%;
    min-height: 34px;
    font: inherit;
    font-size: 14px;
    padding: 5px 7px;
    border: 1px solid #0079bf;
    border-radius: 4px;
    resize: vertical;
    box-sizing: border-box;
}
.kb-cl-edit-box .kb-btn { padding: 3px 10px; font-size: 12px; }
.kb-legacy .kb-cl-edit-box > * + *,
.kb-legacy-ua .kb-cl-edit-box > * + * { margin-left: 6px; }
.kb-legacy .kb-cl-edit-input,
.kb-legacy-ua .kb-cl-edit-input { margin: 0 0 6px 0; width: 100%; }

/* Кнопки управления колонкой (для админа, видны при наведении) */
/* Кнопки управления колонкой оформлены ниже, в блоке .kb-col-btn.
   Прежнее правило скрывало их (visibility: hidden) и показывало только при
   наведении на колонку — из-за этого кнопки то появлялись, то исчезали. */

/* Уведомления */
.kb-notif-count {
    background: #eb5a46;
    color: #fff;
    border-radius: 10px;
    font-size: 10px;
    padding: 1px 5px;
    margin-left: 3px;
    font-weight: 700;
    vertical-align: top;
}
.kb-notif-dropdown {
    right: 0;
    left: auto;
    /* Окно шире по горизонтали и ниже по вертикали: длинные тексты
       уведомлений читаются в строку, а не столбиком (п.2) */
    min-width: 520px;
    max-width: 640px;
    /* Прокручивается не все окно, а только список уведомлений: иначе
       настройка почты внизу уезжала под нижний край и найти ее было нельзя.
       position: sticky здесь не годится — IE11 его не понимает. */
    max-height: none;
    overflow: visible;
}
.kb-notif-list {
    max-height: 300px;
    overflow-y: auto;
}
@media (max-width: 680px) {
    .kb-notif-dropdown {
        min-width: 0;
        width: 92vw;
        max-width: 92vw;
    }
}
.kb-notif-item {
    padding: 9px 14px;
    font-size: 13px;
    line-height: 1.45;
    border-bottom: 1px solid #dfe1e6;
    color: #172b4d;
}
.kb-notif-item.unread { background: #e9f2ff; }
/* Название задачи — первой строкой и выделено */
.kb-notif-card {
    font-weight: 700;
    font-size: 13px;
    color: #0b4f77;
    margin-bottom: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.kb-notif-item.unread .kb-notif-card { color: #073b5a; }
.kb-notif-text {
    color: #172b4d;
    color: var(--kb-text);
}
.kb-notif-date { font-size: 11px; color: #5e6c84; margin-top: 3px; }

/* Оформление селектора сортировки задано ниже, вместе с кнопками колонки. */

/* Доп. чип исполнителей */
.kb-assignee-more { background: #6b778c; }

/* Заголовок колонки как ручка для перетаскивания */
.kb-column-header[draggable="true"] { cursor: grab; }
.kb-column-header[draggable="true"]:active { cursor: grabbing; }

/* Анимация перетаскивания колонок */
.kb-column { transition: transform .15s, box-shadow .15s, opacity .15s; }
.kb-column.kb-col-dragging {
    opacity: .45;
    transform: rotate(1.5deg) scale(.98);
    box-shadow: 0 8px 20px rgba(9,30,66,.3);
}
.kb-column.kb-col-drop-left { box-shadow: -4px 0 0 0 #0079bf; }
.kb-column.kb-col-drop-right { box-shadow: 4px 0 0 0 #0079bf; }

/* Значки на карточке */
.kb-card-marks { font-size: 11px; white-space: nowrap; }
.kb-card-mark { margin-left: 2px; }

/* Календарь-планировщик */
.kb-cal-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
    background: #dfe1e6;
    border: 1px solid #dfe1e6;
    border-radius: 6px;
    overflow: hidden;
}
.kb-cal-dow {
    background: #f4f5f7;
    padding: 6px;
    font-size: 11px;
    font-weight: 700;
    text-align: center;
    color: #5e6c84;
    text-transform: uppercase;
}
.kb-cal-cell {
    background: #fff;
    min-height: 76px;
    padding: 4px;
    font-size: 11px;
    overflow: hidden;
}
.kb-cal-empty { background: #fafbfc; }
.kb-cal-daynum {
    font-size: 12px;
    font-weight: 700;
    color: #5e6c84;
    margin-bottom: 2px;
}
.kb-cal-daynum.today {
    display: inline-block;
    background: #0079bf;
    color: #fff;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
}
.kb-cal-card {
    background: #e9f2ff;
    border-left: 3px solid #0079bf;
    border-radius: 3px;
    padding: 2px 4px;
    margin-bottom: 2px;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.kb-cal-card:hover { background: #d6e8ff; }
.kb-cal-card.overdue { background: #fdecea; border-left-color: #eb5a46; }
.kb-cal-vac {
    background: #e3fcef;
    border-left: 3px solid #36b37e;
    border-radius: 3px;
    padding: 2px 4px;
    margin-bottom: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Предупреждение об отпуске */
.kb-vac-warn {
    margin-top: 6px;
    padding: 6px 10px;
    background: #fff7e6;
    border: 1px solid #ffab00;
    border-radius: 6px;
    font-size: 12px;
    color: #172b4d;
}

/* Ответственный исполнитель — инициалы обведены желтым кругом */
.kb-assignee-chip.kb-responsible {
    box-shadow: 0 0 0 2px #f2d600;
    border: 1px solid #d9a300;
    position: relative;
}

/* Прочтение задачи исполнителем — видно администратору прямо на доске.
   Зеленая галочка: задача прочитана. Серый кружок: открывал, но бегло. */
.kb-assignee-chip.kb-read-done,
.kb-assignee-chip.kb-read-opened {
    position: relative;
    overflow: visible;
}
.kb-assignee-chip.kb-read-done::after,
.kb-assignee-chip.kb-read-opened::after {
    position: absolute;
    right: -3px;
    bottom: -3px;
    width: 12px;
    height: 12px;
    line-height: 12px;
    text-align: center;
    font-size: 9px;
    font-weight: 700;
    color: #fff;
    border: 1px solid #fff;
    border-radius: 50%;
}
.kb-assignee-chip.kb-read-done::after {
    content: "✓";
    background: #2e7d32;
}
.kb-assignee-chip.kb-read-opened::after {
    content: "•";
    background: #9aa5b1;
}

/* Блок выполнения задачи */
.kb-completion-block { margin: 10px 0 4px; }
.kb-comp-status {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
}
.kb-comp-status.pending { background: #fff7e6; color: #b8860b; border: 1px solid #ffab00; }
.kb-comp-status.approved { background: #e3fcef; color: #0e8a6f; border: 1px solid #36b37e; }
.kb-comp-status.rework { background: #fdecea; color: #c9372c; border: 1px solid #eb5a46; }
.kb-comp-report {
    margin-top: 6px;
    padding: 8px 10px;
    background: #f4f5f7;
    border-radius: 6px;
    font-size: 13px;
    white-space: pre-wrap;
}

/* Внутри блока отчета стоит pre-wrap ради переносов в самом тексте.
   Для редактора его снимаем: иначе пробелы между элементами разметки
   превращаются в лишние пустые строки */
.kb-comp-report .kb-comment-editor { white-space: normal; }
.kb-comp-report .kb-comment-editor-text { white-space: pre-wrap; }

/* ФИКС: темы WordPress перебивают стили кнопок (белый текст на белом фоне до наведения).
   Задаем цвета с максимальным приоритетом для всех кнопок плагина. */

/* Тот же конфликт, но для кнопок, которые НЕ являются .kb-btn и потому
   под фикс ниже не подпадали: элементы окна «Управление доской», шапка
   таблицы прочтений и поля панели. Тег <button> не наследует цвет от
   родителя — если плагин не задал его явно, цвет приходит от темы сайта.
   Отсюда и расхождение между машинами: тема одна, браузеры разные. */
#kanban-app-root .kb-toolbar select,
#kanban-app-root .kb-toolbar input,
.kb-modal-overlay .kb-manage-item,
.kb-modal-overlay .kb-manage-item b,
.kb-modal-overlay .kb-read-table th {
    color: #172b4d;
    color: var(--kb-text);
}
/* Опасное действие остается красным и после фикса выше */
.kb-modal-overlay .kb-manage-item.kb-manage-danger b { color: #b04632; }

#kanban-app-root .kb-btn,
.kb-modal-overlay .kb-btn {
    background: #0079bf !important;
    color: #ffffff !important;
    border: none !important;
    text-decoration: none !important;
    text-shadow: none !important;
    box-shadow: none !important;
}
#kanban-app-root .kb-btn:hover,
.kb-modal-overlay .kb-btn:hover { background: #026aa7 !important; }
#kanban-app-root .kb-btn.kb-btn-secondary,
.kb-modal-overlay .kb-btn.kb-btn-secondary { background: #6b778c !important; }
#kanban-app-root .kb-btn.kb-btn-secondary:hover,
.kb-modal-overlay .kb-btn.kb-btn-secondary:hover { background: #4d5768 !important; }
#kanban-app-root .kb-btn.kb-btn-danger,
.kb-modal-overlay .kb-btn.kb-btn-danger { background: #eb5a46 !important; }
#kanban-app-root .kb-btn.kb-btn-danger:hover,
.kb-modal-overlay .kb-btn.kb-btn-danger:hover { background: #cf4030 !important; }

/* ---------- Визуализация связей (v1.15) ---------- */

/* Значок связей на фасаде карточки — в одном ряду с 📊 и прочими метками */
.kb-links-badge {
    cursor: pointer;
}
.kb-links-badge:hover {
    filter: brightness(0.7);
}

.kb-card.kb-link-dim { opacity: .3; }
.kb-card.kb-link-focus {
    outline: 3px solid #172b4d;
    outline-offset: 1px;
    opacity: 1;
    position: relative;
    z-index: 2;
}
.kb-card.kb-link-parent { outline: 3px solid #eb8909; outline-offset: 1px; opacity: 1; position: relative; z-index: 2; }
.kb-card.kb-link-child  { outline: 3px solid #0079bf; outline-offset: 1px; opacity: 1; position: relative; z-index: 2; }
.kb-card.kb-link-related{ outline: 3px dashed #8993a4; outline-offset: 1px; opacity: 1; position: relative; z-index: 2; }

#kb-links-panel {
    position: fixed;
    right: 16px;
    bottom: 16px;
    width: 330px;
    max-height: 70vh;
    overflow-y: auto;
    background: #fff;
    border: 1px solid #dfe1e6;
    border-radius: 8px;
    padding: 12px 14px;
    box-shadow: 0 8px 24px rgba(9,30,66,.25);
    z-index: 9999;
    font-size: 13px;
}
.kb-links-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
}
.kb-links-panel-head b {
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.kb-links-group { margin-bottom: 10px; }
.kb-links-group > b {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    color: #5e6c84;
    color: var(--kb-text-light);
    margin-bottom: 4px;
}
.kb-links-row {
    display: flex;
    align-items: baseline;
    gap: 5px;
    padding: 4px 6px;
    border-radius: 4px;
    cursor: pointer;
}
.kb-links-row:hover { background: #f0f2f7; }
.kb-links-row-title { flex: 1; }
.kb-links-row-col { color: #5e6c84; color: var(--kb-text-light); font-size: 11px; white-space: nowrap; }
.kb-links-row-hidden {
    font-size: 11px;
    color: #b04632;
    white-space: nowrap;
}
.kb-links-warn {
    background: #fffae6;
    border: 1px solid #ffe380;
    border-radius: 4px;
    padding: 6px 8px;
    font-size: 12px;
    margin-bottom: 8px;
}
.kb-links-legend-inline {
    border-top: 1px solid #f0f0f0;
    padding-top: 8px;
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
}

/* ==========================================================================
   Поддержка старых браузеров (IE11, Edge Legacy)
   IE11 не понимает gap во flex-раскладке — заменяем отступами.
   ========================================================================== */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .kb-toolbar > *,
    .kb-filters > *,
    .kb-modal-actions > *,
    .kb-card-marks > * {
        margin-right: 8px;
        margin-bottom: 4px;
    }
    .kb-toolbar,
    .kb-filters {
        display: block;
    }
    .kb-toolbar > *,
    .kb-filters > * {
        display: inline-block;
        vertical-align: middle;
    }
    .kb-board-wrapper {
        display: block;
        white-space: nowrap;
        overflow-x: auto;
    }
    .kb-column {
        display: inline-block;
        vertical-align: top;
        white-space: normal;
        margin-right: 12px;
    }
    /* IE11 не понимает gap — разводим кнопки панели отступами */
    .kb-col-actions > *,
    .kb-col-tools > * {
        margin-right: 4px;
    }
    .kb-col-tools > *:last-child,
    .kb-col-actions > *:last-child {
        margin-right: 0;
    }
    .kb-modal-actions {
        text-align: right;
    }
    .kb-modal-actions > * {
        display: inline-block;
    }
    #kb-links-panel {
        width: 320px;
    }
    .kb-links-row {
        display: block;
    }
    .kb-links-row > * {
        display: inline-block;
        margin-right: 5px;
    }
}

/* Предупреждение о неподдерживаемом браузере */
.kb-browser-warning {
    background: #fffae6;
    border: 1px solid #ffc400;
    border-left: 4px solid #ffc400;
    border-radius: 4px;
    padding: 10px 14px;
    margin-bottom: 12px;
    font-size: 13px;
    color: #172b4d;
    line-height: 1.5;
}

/* Сообщение об ошибке внутри модального окна */
.kb-modal-error {
    background: #ffebe6;
    border: 1px solid #ff8f73;
    border-left: 4px solid #de350b;
    border-radius: 4px;
    padding: 10px 12px;
    margin-bottom: 12px;
    font-size: 13px;
    color: #172b4d;
    line-height: 1.45;
}

/* ==========================================================================
   Растягивание доски на всю ширину экрана.
   Темы WordPress (в т.ч. Ample) держат содержимое в узком контейнере.
   Ниже доска выводится из него на полную ширину окна.
   ========================================================================== */
#kanban-app-root {
    width: 100vw;
    max-width: 100vw;
    /* Выход за пределы родительского контейнера темы */
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    padding: 0 16px;
    box-sizing: border-box;
}

/* Запасной вариант для IE11: vw поддерживается, но margin с ним ведет себя
   нестабильно — там просто растягиваем по родителю. */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    #kanban-app-root {
        width: auto;
        max-width: none;
        left: auto;
        right: auto;
        margin-left: 0;
        margin-right: 0;
    }
}

/* Убираем ограничения ширины у контейнеров темы на странице с доской */
.kanban-page .container,
.kanban-page .tg-container,
.kanban-page #primary,
.kanban-page #content,
.kanban-page .content-area,
.kanban-page .site-content,
.kanban-page .entry-content,
.kanban-page article:not(#kanban-kids-root article):not(#kanban-app-root article),
.kanban-page main {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    float: none !important;
}
.kanban-page #secondary,
.kanban-page .widget-area,
.kanban-page .sidebar {
    display: none !important;
}

/* Комментарии: форматирование и упоминания */
.kb-comment-text {
    white-space: normal;
    word-wrap: break-word;
}
.kb-comment-text code {
    background: #f0f2f7;
    border-radius: 3px;
    padding: 1px 4px;
    font-size: 12px;
}
.kb-comment-list {
    margin: 4px 0 4px 18px;
    padding: 0;
}
.kb-mention {
    background: #e4f0f6;
    color: #026aa7;
    border-radius: 3px;
    padding: 0 3px;
    font-weight: 600;
}
.kb-comment-hint {
    font-size: 11px;
    color: #5e6c84;
    margin-top: 4px;
    line-height: 1.6;
}

/* Кнопка превращения пункта чек-листа в карточку */
.kb-cl-tocard {
    background: none;
    border: none;
    cursor: pointer;
    color: #5e6c84;
    font-size: 14px;
    padding: 0 4px;
    line-height: 1;
}
.kb-cl-tocard:hover { color: #0079bf; }
.kb-cl-tocard:disabled { opacity: .4; cursor: default; }

/* ---------- Режимы отображения колонок (v1.24) ---------- */


/* Компактный вид: карточки в одну строку, без лишних деталей */
.kb-column.kb-col-compact {
    flex: 0 0 200px;
    width: 200px;
}
.kb-col-compact .kb-card {
    padding: 4px 8px;
    margin-bottom: 4px;
}
.kb-col-compact .kb-card-title {
    font-size: 12px;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    white-space: nowrap;
}
.kb-col-compact .kb-card-tags,
.kb-col-compact .kb-checklist-badge,
.kb-col-compact .kb-card-desc {
    display: none;
}
.kb-col-compact .kb-assignee-chip {
    width: 18px;
    height: 18px;
    font-size: 9px;
    line-height: 18px;
}
.kb-col-compact .kb-due-badge { font-size: 10px; }

/* Свернутая колонка: узкая полоса с вертикальной подписью */
.kb-column.kb-col-collapsed {
    flex: 0 0 38px;
    width: 38px;
    padding: 8px 4px;
    align-items: center;
    text-align: center;
}
.kb-col-collapsed-title {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-weight: 700;
    font-size: 12px;
    color: #172b4d;
    margin: 8px 0;
    white-space: nowrap;
    overflow: hidden;
    max-height: 260px;
}
.kb-col-collapsed .kb-column-count {
    display: block;
    margin-top: 4px;
}

/* ============================================================
   Обновление 1.25 — доработки по замечаниям
   ============================================================ */

/* Пункт 3: поля даты и времени срока — шире, минуты помещаются целиком.
   У поля time браузер сам делит место между часами и минутами, поэтому
   задаем минимальную ширину, а не полагаемся на автоподбор. */
.kb-modal-overlay .kb-time-input {
    min-width: 130px;
    width: 130px;
    padding: 7px 8px;
    font-size: 14px;
    font-variant-numeric: tabular-nums;
}
.kb-modal-overlay .kb-date-input {
    min-width: 175px;
    width: 175px;
    padding: 7px 8px;
    font-size: 14px;
}
/* На узких экранах поля занимают всю строку */
@media (max-width: 520px) {
    .kb-modal-overlay .kb-time-input,
    .kb-modal-overlay .kb-date-input {
        width: 100%;
        min-width: 0;
    }
}

/* Блок выполнения задачи: формы внутри блока (пункт 12) */
.kb-comp-form {
    margin-top: 8px;
}
.kb-comp-form-label {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: #5e6c84;
    color: var(--kb-text-light);
    margin-bottom: 4px;
}
.kb-comp-form textarea {
    width: 100%;
    /* Итоги работы пишут развернуто — поле сразу на несколько строк */
    min-height: 150px;
    line-height: 1.5;
    font-family: inherit;
    font-size: 14px;
    padding: 8px 10px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 6px;
    box-sizing: border-box;
}
.kb-comp-note {
    margin-top: 6px;
    font-size: 13px;
    color: #5e6c84;
    color: var(--kb-text-light);
}
.kb-modal-overlay .kb-btn-success {
    background: #61bd4f;
}

/* Пункт 13: кликабельные ссылки и пути */
.kb-link {
    color: #0079bf;
    color: var(--kb-primary);
    text-decoration: underline;
    word-break: break-all;
}
.kb-path-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    max-width: 100%;
}
.kb-copy-path {
    cursor: pointer;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    background: #fff;
    border-radius: 4px;
    font-size: 12px;
    line-height: 1;
    padding: 2px 5px;
    color: #5e6c84;
    color: var(--kb-text-light);
    flex: 0 0 auto;
}
.kb-copy-path:hover {
    background: #f0f1f3;
}
.kb-folder-open {
    margin-top: 6px;
    font-size: 13px;
}

/* Пункт 8: выбор участника при вводе «@» */
.kb-mention-box {
    position: absolute;
    z-index: 100000;
    background: #fff;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 6px;
    box-shadow: 0 6px 18px rgba(9, 30, 66, .25);
    max-height: 220px;
    overflow-y: auto;
    min-width: 220px;
    padding: 4px 0;
}
.kb-mention-item {
    padding: 7px 12px;
    font-size: 13px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #172b4d;
    color: var(--kb-text);
}
.kb-mention-item.active,
.kb-mention-item:hover {
    background: #e4f0f6;
}
.kb-mention-role {
    margin-left: auto;
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
}

/* Пункт 10: создание карточки из календаря */
.kb-cal-cell {
    position: relative;
}
.kb-cal-add {
    position: absolute;
    top: 2px;
    right: 2px;
    width: 18px;
    height: 18px;
    line-height: 16px;
    text-align: center;
    border-radius: 4px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    background: #fff;
    color: #5e6c84;
    color: var(--kb-text-light);
    font-size: 13px;
    cursor: pointer;
    padding: 0;
    opacity: 0;
}
.kb-cal-cell:hover .kb-cal-add {
    opacity: 1;
}
.kb-cal-add:hover {
    background: #0079bf;
    background: var(--kb-primary);
    color: #fff;
    border-color: #0079bf;
}
/* На сенсорных экранах наведения нет — показываем кнопку всегда */
@media (hover: none) {
    .kb-cal-add { opacity: .6; }
}

/* ---- Пункт 14: личные доски сотрудников ---- */
.kb-personal-note {
    margin: 0 0 12px;
    padding: 10px 14px;
    background: #eef6fc;
    border: 1px solid #b3d4e8;
    border-left: 4px solid #0079bf;
    border-radius: 6px;
    font-size: 13px;
    line-height: 1.5;
    color: #172b4d;
}

/* Карточка, пришедшая с общей доски */
.kb-card-mirror {
    border-left: 3px solid #0079bf;
}
.kb-card-source {
    font-size: 11px;
    color: #5e6c84;
    margin-bottom: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Запросы на связь */
.kb-link-req {
    border: 1px solid #dfe1e6;
    border-radius: 6px;
    padding: 10px 12px;
    margin-bottom: 10px;
    font-size: 13px;
}
.kb-link-req-pair {
    margin: 6px 0;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.kb-link-req-card {
    background: #f4f5f7;
    border-radius: 4px;
    padding: 3px 7px;
}
.kb-link-req-arrow {
    color: #eb8909;
    font-weight: 700;
}
.kb-link-req-meta {
    font-size: 11px;
    color: #5e6c84;
}

/* Счетчик запросов на связь на кнопке панели */
.kb-req-badge {
    display: inline-block;
    min-width: 17px;
    height: 17px;
    line-height: 17px;
    margin-left: 5px;
    padding: 0 4px;
    border-radius: 9px;
    background: #eb5a46;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    text-align: center;
    vertical-align: top;
}

/* ============================================================
   Обновление 1.26
   ============================================================ */

/* --- п.4: состав доски в шапке --- */
.kb-board-members {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    padding: 8px 10px;
    margin-bottom: 10px;
    background: #f4f5f7;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 6px;
}
.kb-board-members-label {
    font-size: 12px;
    font-weight: 700;
    color: #5e6c84;
    color: var(--kb-text-light);
    margin-right: 2px;
}
.kb-member-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 9px 3px 3px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 14px;
    background: #fff;
    font-size: 12px;
    color: #172b4d;
    color: var(--kb-text);
    cursor: pointer;
    line-height: 1.4;
}
.kb-member-chip:hover {
    border-color: #0079bf;
    border-color: #0079bf;
    border-color: var(--kb-primary);
}
.kb-member-chip.active {
    background: #0079bf;
    background: var(--kb-primary);
    border-color: #0079bf;
    color: #fff;
}
.kb-member-chip-ini {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #dfe1e6;
    color: #42526e;
    font-size: 10px;
    font-weight: 700;
    flex: 0 0 auto;
}
.kb-member-chip.active .kb-member-chip-ini {
    background: #fff;
    color: #0079bf;
}
/* Администратор доски выделен рамкой */
.kb-member-chip.role-admin .kb-member-chip-ini {
    box-shadow: 0 0 0 2px #f2d600;
}
.kb-member-chip.role-viewer .kb-member-chip-name {
    font-style: italic;
    color: #5e6c84;
}
.kb-member-chip.active .kb-member-chip-name {
    color: #fff;
}
.kb-member-chip-count {
    background: #eb5a46;
    color: #fff;
    border-radius: 9px;
    min-width: 16px;
    padding: 0 5px;
    font-size: 10px;
    font-weight: 700;
    text-align: center;
}
.kb-member-reset {
    padding: 4px 10px;
    border-style: dashed;
}

/* --- п.5: находки в архиве --- */
.kb-archive-hits {
    margin-bottom: 10px;
    padding: 10px 12px;
    background: #fdf6e3;
    border: 1px solid #e6d9a8;
    border-left: 4px solid #e0a800;
    border-radius: 6px;
    font-size: 13px;
}
.kb-archive-hit {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding: 5px 0;
    border-top: 1px solid #efe4c4;
    flex-wrap: wrap;
}
.kb-archive-hit-meta {
    color: #5e6c84;
    font-size: 11px;
}
.kb-arch-restore-inline {
    padding: 3px 10px;
    font-size: 12px;
}

/* --- п.2: обновление доски --- */
.kb-refresh-box {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.kb-auto-label {
    font-size: 12px;
    color: #5e6c84;
    color: var(--kb-text-light);
    display: inline-flex;
    align-items: center;
    gap: 3px;
    white-space: nowrap;
}
.kb-refresh-stamp {
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
    white-space: nowrap;
}

/* --- п.6: постановка задачи — главное поле карточки --- */
.kb-field-desc {
    background: #f7f9fb;
    border: 1px solid #d6e2ec;
    border-left: 4px solid #0079bf;
    border-left: 4px solid var(--kb-primary);
    border-radius: 6px;
    padding: 12px 14px;
    margin-bottom: 16px;
}
.kb-modal-overlay .kb-desc-label {
    display: block;
    font-size: 15px;
    font-weight: 700;
    text-transform: none;
    letter-spacing: 0;
    color: #172b4d;
    color: var(--kb-text);
    margin-bottom: 2px;
}
.kb-desc-hint {
    font-size: 12px;
    color: #5e6c84;
    color: var(--kb-text-light);
    margin-bottom: 8px;
    line-height: 1.45;
}
.kb-modal-overlay textarea.kb-desc-input {
    width: 100%;
    min-height: 170px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.5;
    color: #172b4d;
    color: var(--kb-text);
    background: #fff;
    padding: 10px 12px;
    border: 1px solid #c9d6e2;
    border-radius: 5px;
    box-sizing: border-box;
    resize: vertical;
}
.kb-modal-overlay textarea.kb-desc-input:focus {
    outline: none;
    border-color: #0079bf;
    border-color: #0079bf;
    border-color: var(--kb-primary);
    box-shadow: 0 0 0 3px rgba(0, 121, 191, .12);
}
.kb-modal-overlay textarea.kb-desc-input:disabled {
    background: #f4f5f7;
    color: #42526e;
}

/* --- п.8: пояснение о запрете правки --- */
.kb-readonly-hint {
    margin-bottom: 12px;
    padding: 9px 12px;
    background: #f4f5f7;
    border: 1px solid #dfe1e6;
    border-radius: 6px;
    font-size: 12px;
    line-height: 1.5;
    color: #5e6c84;
    color: var(--kb-text-light);
}

/* --- п.9 и 11: уведомления --- */
.kb-notif-clickable {
    cursor: pointer;
}
.kb-notif-clickable:hover {
    background: #e4f0f6;
}
.kb-notif-active {
    background: #fff4e5 !important;
    border-color: #eb8909 !important;
}
.kb-toast-box {
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 100001;
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-width: 320px;
}
.kb-toast {
    background: #172b4d;
    color: #fff;
    padding: 11px 14px;
    border-radius: 6px;
    font-size: 13px;
    line-height: 1.4;
    box-shadow: 0 6px 18px rgba(9, 30, 66, .3);
    cursor: pointer;
}
.kb-toast:hover {
    background: #253858;
}

/* ============================================================
   Обновление 1.27
   ============================================================ */

/* --- п.2: нумерация пунктов чек-листа --- */
.kb-cl-num {
    flex: 0 0 auto;
    min-width: 26px;
    font-size: 12px;
    font-weight: 700;
    color: #5e6c84;
    color: var(--kb-text-light);
    text-align: right;
    padding-top: 1px;
}
.kb-cl-item.done .kb-cl-num {
    color: #9aa4b5;
}
.kb-cl-group {
    font-weight: 700;
    font-size: 13px;
    margin: 10px 0 4px;
    color: #172b4d;
    color: var(--kb-text);
}

/* --- п.3: изменение ширины колонок --- */
.kb-column {
    position: relative;
}
.kb-col-resizer {
    position: absolute;
    top: 0;
    right: -6px;
    /* Широкая полоса захвата: попасть мышью в 3 пикселя тяжело */
    width: 12px;
    height: 100%;
    cursor: col-resize;
    z-index: 5;
    background: transparent;
}
/* Полоска видна всегда, иначе непонятно, что колонку можно тянуть */
.kb-col-resizer::after {
    content: '';
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: 4px;
    width: 4px;
    border-radius: 2px;
    background: #c9cfd8;
    transition: background .12s;
}
.kb-col-resizer:hover::after,
.kb-col-resizer:active::after {
    background: #0079bf;
    background: var(--kb-primary);
}
/* У свернутой колонки тянуть нечего */
.kb-col-collapsed .kb-col-resizer {
    display: none;
}
/* Во время перетаскивания не выделяем текст */
body.kb-resizing,
body.kb-resizing * {
    cursor: col-resize !important;
    user-select: none;
    -ms-user-select: none;
}

/* --- п.4: кнопки управления колонкой --- */
/* Панель управления колонкой: отдельная верхняя строка постоянной высоты.
   Кнопки стоят на одних и тех же местах независимо от длины названия. */
.kb-col-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 26px;
    margin-bottom: 6px;
}
.kb-col-actions {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    flex: 0 0 auto;
    /* Кнопки видны всегда, а не только при наведении на колонку */
    visibility: visible;
}
.kb-col-tools {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex: 0 0 auto;
    margin-left: auto;
}
/* Строка названия: имя занимает свободное место, счетчик прижат вправо */
.kb-col-nameline {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}
.kb-col-name {
    font-weight: 700;
    font-size: 14px;
    line-height: 1.3;
    color: #172b4d;
    color: var(--kb-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: default;
    flex: 1 1 auto;
    min-width: 0;
}
.kb-col-nameline .kb-column-count {
    flex: 0 0 auto;
    margin-left: auto;
}
/* Сортировка ужимается, если места мало, но не выталкивает соседей */
.kb-col-tools {
    min-width: 0;
}
.kb-col-tools .kb-col-sort-select {
    flex: 0 1 auto;
    min-width: 0;
}
/* Единый вид всех кнопок в заголовке колонки: раньше они наследовали
   оформление темы сайта и выглядели по-разному */
.kb-column-header .kb-col-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    min-width: 0;
    min-height: 0;
    padding: 0;
    margin: 0;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 4px;
    background: #fff;
    color: #42526e;
    font-size: 13px;
    line-height: 1;
    cursor: pointer;
    box-shadow: none;
    text-shadow: none;
    /* Приглушаем цветом, а не opacity: прозрачность выносит элемент
       в отдельный слой, и текст в нем теряет субпиксельное сглаживание —
       на Windows это выглядит как размытие */
    color: #7a8699;
    border-color: #e8eaed;
    transition: color .12s, background .12s, border-color .12s;
}
.kb-column-header .kb-col-btn:hover {
    color: #42526e;
    background: #e4f0f6;
    border-color: #0079bf;
    border-color: #0079bf;
    border-color: var(--kb-primary);
    color: #0b4f77;
}
.kb-column-header .kb-col-btn:active {
    background: #d3e7f2;
}
.kb-column-header .kb-col-del-btn:hover {
    background: #ffebe6;
    border-color: #eb5a46;
    color: #bf2600;
}
.kb-column-header .kb-col-view-btn {
    font-size: 14px;
}
.kb-col-sort-select {
    height: 24px;
    padding: 0 4px;
    font-size: 11px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 4px;
    background: #fff;
    color: #42526e;
    /* При обычной ширине колонки (270px) панель кнопок должна помещаться:
       отступы 20 + кнопки действий 105 + кнопка вида 28 + сортировка = 253px */
    max-width: 100px;
}
.kb-col-sort-select:hover {
    border-color: #0079bf;
    border-color: #0079bf;
    border-color: var(--kb-primary);
}
.kb-column-count {
    display: inline-block;
    min-width: 20px;
    padding: 2px 6px;
    border-radius: 10px;
    background: #dfe1e6;
    color: #42526e;
    font-size: 11px;
    font-weight: 700;
    text-align: center;
}

/* --- п.5: запросы на продление срока --- */
.kb-due-req {
    border: 1px solid #dfe1e6;
    border-left: 4px solid #5e6c84;
    border-radius: 6px;
    padding: 10px 12px;
    margin-bottom: 10px;
    font-size: 13px;
    line-height: 1.5;
    background: #fafbfc;
}
.kb-due-req.pending {
    border-left-color: #e0a800;
    background: #fdf6e3;
}
.kb-due-req.approved {
    border-left-color: #61bd4f;
    background: #f1f9ef;
}
.kb-due-req.rejected {
    border-left-color: #eb5a46;
    background: #fdf1ef;
}
.kb-due-req-reason {
    margin-top: 5px;
    padding: 6px 9px;
    background: #fff;
    border: 1px solid #e6e8eb;
    border-radius: 4px;
    font-size: 13px;
}
.kb-due-req textarea {
    width: 100%;
    min-height: 58px;
    font-family: inherit;
    font-size: 13px;
    padding: 7px 9px;
    border: 1px solid #dfe1e6;
    border-radius: 5px;
    box-sizing: border-box;
}

/* --- п.6: согласование выполнения с замечанием --- */
.kb-comp-status.approved-notes {
    background: #fff8e6;
    border: 1px solid #e6d09a;
    border-left: 4px solid #e0a800;
    color: #7a5b00;
}
.kb-modal-overlay .kb-btn-notes {
    background: #e0a800;
    border-color: #e0a800;
    color: #fff;
}
.kb-modal-overlay .kb-btn-notes:hover {
    background: #c99700;
}
.kb-review-hint {
    margin-top: 8px;
    padding: 8px 10px;
    background: #f4f5f7;
    border-radius: 5px;
    font-size: 12px;
    line-height: 1.55;
    color: #42526e;
}

/* --- п.9: иерархия досок --- */
.kb-parent-note {
    margin: 0 0 10px;
    padding: 8px 12px;
    background: #f4f5f7;
    border: 1px solid #dfe1e6;
    border-left: 4px solid #5e6c84;
    border-radius: 6px;
    font-size: 13px;
    color: #42526e;
}
/* Карточка, спущенная с вышестоящей доски, помечается как и пришедшая
   на личную доску: ее условия задаются не здесь */
.kb-card-mirror {
    border-left: 3px solid #0079bf;
}

/* --- п.6: выбор, куда направить задачу --- */
.kb-deliver-box {
    background: #fff8e6;
    border: 1px solid #e6d09a;
    border-left: 4px solid #e0a800;
    border-radius: 6px;
    padding: 11px 13px;
    margin-bottom: 14px;
}
.kb-deliver-opt {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    font-size: 13px;
    line-height: 1.45;
    padding: 5px 0;
    text-transform: none;
    letter-spacing: 0;
    color: #172b4d;
    cursor: pointer;
}
.kb-deliver-opt input {
    margin-top: 3px;
    flex: 0 0 auto;
}

/* --- п.1: структура досок --- */
.kb-struct-tree {
    max-height: 62vh;
    overflow-y: auto;
    padding-right: 4px;
}
.kb-struct-node {
    border: 1px solid #dfe1e6;
    border-left: 4px solid #0079bf;
    border-radius: 6px;
    padding: 9px 12px;
    margin-bottom: 8px;
    background: #fff;
}
.kb-struct-node.current {
    background: #eef6fc;
    border-color: #0079bf;
}
.kb-struct-node.foreign {
    border-left-color: #c1c7d0;
    background: #fafbfc;
}
/* Подчиненные доски со сдвигом и соединительной чертой */
.kb-struct-children {
    margin-left: 22px;
    padding-left: 14px;
    border-left: 2px dashed #c1c7d0;
}
.kb-struct-head {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 5px;
}
.kb-struct-head a,
.kb-struct-name {
    font-weight: 700;
    font-size: 14px;
    color: #0b4f77;
    text-decoration: none;
}
.kb-struct-head a:hover { text-decoration: underline; }
.kb-struct-name { color: #5e6c84; }
.kb-struct-badge {
    background: #0079bf;
    color: #fff;
    border-radius: 9px;
    padding: 1px 8px;
    font-size: 11px;
    font-weight: 700;
}
.kb-struct-count {
    margin-left: auto;
    font-size: 11px;
    color: #5e6c84;
    white-space: nowrap;
}
.kb-struct-members {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}
.kb-struct-member {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: #f4f5f7;
    border: 1px solid #dfe1e6;
    border-radius: 13px;
    padding: 2px 9px 2px 2px;
    font-size: 12px;
    color: #172b4d;
}
.kb-struct-member.admin {
    border-color: #d9a300;
    background: #fff8e6;
}
.kb-struct-ini {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 21px;
    height: 21px;
    border-radius: 50%;
    background: #dfe1e6;
    color: #42526e;
    font-size: 9px;
    font-weight: 700;
}
.kb-struct-member.admin .kb-struct-ini {
    background: #f2d600;
    color: #6b5200;
}
.kb-struct-empty {
    font-size: 12px;
    color: #5e6c84;
    font-style: italic;
}
.kb-struct-orphans {
    margin-top: 14px;
    padding-top: 10px;
    border-top: 1px solid #dfe1e6;
    font-size: 12px;
    color: #5e6c84;
}

/* --- п.4: род задачи --- */
.kb-kind-box {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
/* Выбор рода задачи стоит внутри .kb-field, а там для каждого label задан
   свой вид: блок, прописные, жирный. Тот селектор весит больше одного
   класса и побеждал: плашка теряла раскладку в столбец, и название рода
   слипалось с пояснением — «ПОРУЧЕНИЕТребует выполнения». Поэтому здесь
   селекторы из двух классов: они перевешивают правила поля. */
.kb-kind-box .kb-kind-opt {
    flex: 1 1 190px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 6px;
    padding: 9px 11px;
    margin-bottom: 0;
    cursor: pointer;
    background: #fff;
    background: var(--kb-card-bg);
    text-transform: none;
    letter-spacing: 0;
    font-size: 13px;
    font-weight: 400;
    color: #172b4d;
    color: var(--kb-text);
}
.kb-kind-box .kb-kind-opt:hover { border-color: #0079bf; }
.kb-kind-box .kb-kind-opt.active {
    border-color: #0079bf;
    background: #eef6fc;
    box-shadow: inset 0 0 0 1px #0079bf;
}
/* Кружок переключателя — отдельной строкой над названием он выглядел
   как чужой элемент; ставим его слева от названия */
.kb-kind-box .kb-kind-opt input[type=radio] {
    margin: 0 6px 0 0;
    vertical-align: baseline;
}
.kb-kind-box .kb-kind-label {
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    font-size: 13px;
    margin-bottom: 0;
    color: #172b4d;
    color: var(--kb-text);
}
/* Значок отделяется отступом, а не пробелом: пробел рядом со значком
   занимает три пиксела, и название рода к нему прилипало */
.kb-kind-icon {
    display: inline-block;
    margin-right: 5px;
}
.kb-kind-box .kb-kind-opt input[type=radio] + .kb-kind-icon { margin-left: 0; }
.kb-kind-box .kb-kind-hint {
    font-size: 12px;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    margin-bottom: 0;
    color: #5e6c84;
    color: var(--kb-text-light);
    line-height: 1.4;
}
.kb-kind-badge {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 9px;
    border-radius: 10px;
    /* Отступ снизу и справа: плашка стояла вплотную к заголовку задачи
       и к соседнему тексту — название рода сливалось с ними */
    margin: 0 8px 7px 0;
    background: #e4f0f6;
    color: #0b4f77;
}
.kb-kind-badge.kb-kind-approval { background: #fff8e6; color: #7a5b00; }
.kb-kind-badge.kb-kind-info { background: #eceef0; color: #42526e; }

/* --- п.1: документы двумя группами --- */
.kb-att-group { margin-bottom: 14px; }
.kb-att-group-title {
    font-weight: 700;
    font-size: 13px;
    color: #172b4d;
    margin-bottom: 2px;
}
.kb-att-group-hint {
    font-size: 12px;
    color: #5e6c84;
    margin-bottom: 6px;
    line-height: 1.4;
}
.kb-att-none {
    font-size: 12px;
    color: #8993a4;
    font-style: italic;
    padding: 3px 0;
}
.kb-att-ref {
    flex: 0 0 auto;
    font-size: 11px;
    font-weight: 700;
    color: #0b4f77;
    background: #e4f0f6;
    border-radius: 4px;
    padding: 1px 5px;
    margin-right: 7px;
    align-self: flex-start;
}
.kb-att-refhint {
    font-size: 12px;
    color: #5e6c84;
    border-top: 1px solid #f0f0f0;
    padding-top: 7px;
    line-height: 1.45;
}
.kb-att-kind {
    margin: 6px 0;
    padding: 7px 10px;
    background: #f4f5f7;
    border-radius: 5px;
}
/* Ссылка на документ в тексте отчета */
.kb-doc-ref {
    background: #e4f0f6;
    color: #0b4f77;
    border-radius: 3px;
    padding: 0 4px;
    font-weight: 700;
    font-size: .92em;
}

/* --- п.3: централизованные метки --- */
.kb-tag-readonly {
    background: #f7f9fb;
    border-left: 3px solid #0079bf;
}
.kb-tag-swatch {
    display: inline-block;
    width: 26px;
    height: 20px;
    border-radius: 4px;
    border: 1px solid #dfe1e6;
    flex: 0 0 auto;
}
.kb-tag-global {
    font-size: 11px;
    background: #e4f0f6;
    color: #0b4f77;
    border-radius: 9px;
    padding: 1px 8px;
    white-space: nowrap;
}

/* --- Итог загрузки из файла --- */
.kb-import-sum {
    background: #f1f9ef;
    border: 1px solid #b7ddb0;
    border-left: 4px solid #61bd4f;
    border-radius: 6px;
    padding: 10px 13px;
    margin-bottom: 12px;
    font-size: 13px;
    line-height: 1.6;
}
.kb-import-warn {
    background: #fdf6e3;
    border: 1px solid #e6d9a8;
    border-left: 4px solid #e0a800;
    border-radius: 6px;
    padding: 10px 13px;
    font-size: 13px;
    max-height: 260px;
    overflow-y: auto;
}
.kb-import-unmatched {
    padding: 3px 0;
    border-top: 1px solid #efe4c4;
}
.kb-import-count {
    color: #5e6c84;
    font-size: 12px;
}

/* --- п.1: документы основания при создании карточки --- */
.kb-nc-files-list {
    margin-top: 6px;
}
.kb-nc-file {
    font-size: 13px;
    color: #172b4d;
    padding: 3px 0;
}
.kb-nc-file-size {
    color: #5e6c84;
    font-size: 11px;
}
/* --- п.3: плашка рода задачи не липнет к заголовку --- */
.kb-kind-badge {
    margin-right: 6px;
}
/* --- п.4: локальная метка на спущенной задаче --- */
.kb-tag.kb-tag-local::after {
    content: ' •';
    color: #7a8699;
}

/* --- п.3: исходящее письмо --- */
.kb-lt-picked { display: flex; flex-direction: column; gap: 5px; }
.kb-lt-addr {
    display: flex; justify-content: space-between; align-items: center; gap: 8px;
    border: 1px solid #dfe1e6; border-left: 3px solid #0079bf;
    border-radius: 5px; padding: 6px 10px; font-size: 13px;
}
.kb-lt-addr-meta { color: #5e6c84; font-size: 12px; }
.kb-lt-note {
    margin-top: 7px; padding: 8px 11px;
    background: #fff8e6; border: 1px solid #e6d09a; border-left: 4px solid #e0a800;
    border-radius: 5px; font-size: 13px; line-height: 1.45;
}
.kb-lt-book { max-height: 300px; overflow-y: auto; }
.kb-lt-book-row {
    display: flex; justify-content: space-between; align-items: center; gap: 8px;
    padding: 7px 0; border-bottom: 1px solid #f0f0f0; font-size: 13px;
}

/* --- п.4: отчет о просмотре --- */
.kb-read-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.kb-read-table th {
    text-align: left; padding: 7px 9px; background: #f4f5f7;
    border-bottom: 1px solid #dfe1e6; font-size: 12px;
}
.kb-read-table td { padding: 7px 9px; border-bottom: 1px solid #f0f0f0; }
.kb-read-cell { text-align: center; width: 110px; }
.kb-read-yes { color: #1a7f37; font-weight: 700; cursor: help; }
.kb-read-no { color: #c1c7d0; }
.kb-read-role { color: #5e6c84; font-size: 11px; }
.kb-read-count { color: #5e6c84; font-size: 11px; margin-left: 3px; }

/* --- п.1: цитата дня и объявления --- */
#kb-notice-bar { margin-bottom: 10px; }
.kb-notice {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    padding: 9px 13px;
    border-radius: 6px;
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 6px;
}
.kb-notice-quote {
    background: #f7f9fb;
    border: 1px solid #d6e2ec;
    border-left: 4px solid #0079bf;
    font-style: italic;
    color: #42526e;
}
.kb-notice-ann {
    background: #fff8e6;
    border: 1px solid #e6d09a;
    border-left: 4px solid #e0a800;
    color: #172b4d;
}
.kb-notice-icon { flex: 0 0 auto; font-style: normal; }
.kb-notice-text { flex: 1 1 auto; min-width: 0; }
.kb-notice-author { font-style: normal; font-weight: 700; color: #172b4d; }
.kb-notice-source { font-style: normal; color: #5e6c84; font-size: 12px; }
.kb-notice-empty { color: #8993a4; }
.kb-notice-manage {
    flex: 0 0 auto;
    border: 1px solid #dfe1e6;
    background: #fff;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
    padding: 1px 7px;
    color: #5e6c84;
}
.kb-notice-manage:hover { border-color: #0079bf; color: #0b4f77; }
.kb-notice-list { max-height: 190px; overflow-y: auto; }
.kb-notice-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding: 5px 0;
    border-bottom: 1px solid #f0f0f0;
    font-size: 13px;
}
.kb-notice-off { color: #8993a4; font-size: 11px; }

/* --- п.2: журнал отсутствий --- */
.kb-journal {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
    margin-top: 4px;
}
.kb-journal th {
    background: #f4f5f7;
    text-align: left;
    padding: 6px 9px;
    border: 1px solid #dfe1e6;
    font-weight: 700;
    white-space: nowrap;
}
.kb-journal td {
    padding: 5px 9px;
    border: 1px solid #dfe1e6;
}
.kb-journal tbody tr:nth-child(even) { background: #fafbfc; }

/* --- журнал: состояния согласования --- */
.kb-jr-status {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 9px;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}
.kb-jr-status.wait { background: #fff8e6; color: #7a5b00; border: 1px solid #e6d09a; }
.kb-jr-status.mid  { background: #e4f0f6; color: #0b4f77; border: 1px solid #b3d4e8; }
.kb-jr-status.ok   { background: #f1f9ef; color: #1a7f37; border: 1px solid #b7ddb0; }
.kb-jr-status.bad  { background: #fdf1ef; color: #bf2600; border: 1px solid #f0b8ae; }
.kb-jr-reason {
    font-size: 11px;
    color: #5e6c84;
}
.kb-jr-plan-note {
    font-size: 11px;
    color: #8993a4;
}

/* Роль суперадминистратора выделена в составе доски */
.kb-member-chip.role-superadmin .kb-member-chip-ini {
    box-shadow: 0 0 0 2px #eb8909;
}
.kb-role-badge.superadmin {
    background: #fff4e5;
    color: #8a4b00;
}

/* Дни рождения в ленте над доской */
.kb-notice-bday {
    background: #f6f0fb;
    border: 1px solid #d9c6ea;
    border-left: 4px solid #8e5bb5;
    color: #4a2d63;
}

/* Номер версии системы на панели доски: он же вход в «Что нового» */
.kb-version {
    align-self: center;
    font-size: 11px;
    color: #7a8699;
    color: var(--kb-text-light);
    padding: 0 6px;
    white-space: nowrap;
    background: none;
    border: none;
    border-bottom: 1px dotted #c1c7d0;
    line-height: 18px;
    cursor: pointer;
}
.kb-version:hover { color: #0079bf; color: var(--kb-primary); border-bottom-color: #0079bf; }
/* Тема сайта красит любые кнопки в #content — номеру версии это ни к чему */
#kanban-app-root .kb-version {
    background: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    border: none !important;
    border-bottom: 1px dotted #c1c7d0 !important;
    padding: 0 6px !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    color: #7a8699 !important;
}
#kanban-app-root .kb-version:hover { color: #0079bf !important; border-bottom-color: #0079bf !important; }

/* Окно «Что нового»: справка едет вместе с плагином */
.kb-wn-body {
    max-height: 60vh;
    overflow-y: auto;
    margin-bottom: 4px;
}
.kb-wn-entry { padding: 10px 0; border-top: 1px solid #f0f1f3; }
.kb-wn-entry:first-child { border-top: none; padding-top: 2px; }
.kb-wn-ver {
    font-size: 13px;
    font-weight: 700;
    color: #172b4d;
    color: var(--kb-text);
}
.kb-wn-date {
    margin-left: 8px;
    font-size: 11px;
    font-weight: 400;
    color: #7a8699;
    color: var(--kb-text-light);
}
.kb-wn-list { margin: 6px 0 0; padding-left: 20px; }
.kb-wn-list li { margin: 4px 0; line-height: 1.45; font-size: 13px; }
.kb-wn-empty { font-size: 13px; color: #7a8699; color: var(--kb-text-light); }

/* Правка комментария прямо на месте: поле во всю ширину вместо
   крошечного системного окна ввода */
.kb-comment-editor { margin-top: 6px; }
.kb-comment-editor-text {
    width: 100%;
    min-height: 160px;
    font-family: inherit;
    font-size: 13px;
    line-height: 1.45;
    padding: 8px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 4px;
    resize: vertical;
    box-sizing: border-box;
}

/* Общий список: правит любой участник доски */
.kb-comment.kb-comment-shared {
    background: #f0f7ff;
    border-left: 3px solid #0079bf;
    border-left: 3px solid var(--kb-primary);
    padding-left: 8px;
}
.kb-comment-shared-mark { font-size: 12px; }

/* Разделитель между повседневными кнопками и управлением доской:
   служебные действия администратора не должны мешаться с обычными */
.kb-btn-divider {
    display: inline-block;
    width: 1px;
    height: 22px;
    margin: 0 6px;
    background: #c9cfd8;
    background: var(--kb-border);
    vertical-align: middle;
}

/* Окно управления доской: служебные действия администратора */
.kb-btn-manage { position: relative; }
.kb-manage-list { display: flex; flex-direction: column; gap: 6px; }
.kb-manage-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    width: 100%;
    text-align: left;
    padding: 10px 12px;
    background: #fff;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    font-family: inherit;
}
.kb-manage-item:hover { background: #f4f5f7; border-color: #b3bac5; }
.kb-manage-icon { font-size: 18px; line-height: 1.2; flex: 0 0 auto; }
.kb-manage-text { display: flex; flex-direction: column; }
.kb-manage-hint { font-size: 12px; color: #5e6c84; color: var(--kb-text-light); margin-top: 2px; }
.kb-manage-item.kb-manage-danger { border-color: #f3c2bb; }
.kb-manage-item.kb-manage-danger:hover { background: #fdf3f2; border-color: #eb5a46; }
.kb-manage-item.kb-manage-danger b { color: #b04632; }

/* ======================================================================
   Запасные отступы для Microsoft Edge Legacy (версия 44, движок EdgeHTML)

   Свойство gap во флексбоксе этот браузер не поддерживает вовсе — все
   отступы между элементами там просто исчезали, и подписи слипались.
   Ниже отступы заданы через margin: их понимают все браузеры. Правило
   @supports действует только там, где gap НЕ поддерживается, поэтому
   в современных браузерах эти отступы не применяются и ничего не двоится.
   ====================================================================== */
/* Запасные отступы для браузеров без поддержки gap во флексбоксе.

   Класс kb-legacy ставится сценарием, когда обнаружен Edge Legacy
   (версия 44, движок EdgeHTML) или Internet Explorer. На проверку
   @supports полагаться нельзя: Edge знает gap для сеток и отвечает
   «поддерживаю», хотя во флексбоксе его не применяет.

   Отступы заданы через margin — их понимают все браузеры. В современных
   браузерах правила не применяются, поэтому ничего не двоится. */
.kb-legacy .kb-kind-opt > * + * { margin-top: 3px; }
.kb-legacy .kb-kind-opt { margin-right: 8px; margin-bottom: 8px; }
.kb-legacy .kb-kind-label { display: block; }
.kb-legacy .kb-kind-hint { display: block; }

.kb-legacy .kb-board-toolbar > * + *,
.kb-legacy .kb-modal-actions > * + *,
.kb-legacy .kb-att-kind > * + * { margin-left: 8px; }

.kb-legacy .kb-manage-list > * + * { margin-top: 6px; }
.kb-legacy .kb-manage-item > * + * { margin-left: 10px; }

.kb-legacy .kb-field > div > * + * { margin-left: 6px; }
.kb-legacy .kb-card-modal-head > * + * { margin-left: 8px; }
.kb-legacy .kb-attachment-row > * + * { margin-left: 8px; }
.kb-legacy .kb-comment-editor > * + * { margin-top: 4px; }

/* ---------------------------------------------------------------------
   Поля ввода текста

   Edge Legacy (версия 44) не поддерживает свойство resize: уголка
   для растягивания в нем нет вовсе. Поэтому поля, во-первых, сразу
   сделаны просторными, во-вторых, сами растут по мере набора — высоту
   подбирает сценарий. Ниже — запасные размеры на случай, если сценарий
   почему-то не отработал.
   --------------------------------------------------------------------- */
.kb-legacy .kb-field textarea,
.kb-legacy .kb-comp-form textarea,
.kb-legacy .kb-comment-editor-text,
.kb-legacy .kb-reply-text,
.kb-legacy .kb-modal-overlay textarea.kb-desc-input {
    min-height: 180px;
}

/* Поле нового комментария и ответа в ветке */
#kb-cm-new-comment { min-height: 130px; line-height: 1.5; }
.kb-reply-text { min-height: 90px; line-height: 1.5; font-family: inherit; font-size: 13px; }

/* Строка прокрутки в полях видна всегда: в Edge она скрыта до наведения,
   и люди не понимают, что текст можно листать */
.kb-legacy textarea { overflow-y: scroll; }

/* ---------- Корзина комментариев ---------- */
/* Удаленные комментарии лежат здесь 3 дня. Блок свернут по умолчанию,
   чтобы не мешать обычному чтению обсуждения. */
.kb-comment-trash {
    margin-top: 14px;
    padding-top: 10px;
    border-top: 1px dashed #dfe1e6;
    border-top: 1px dashed var(--kb-border);
}
.kb-trash-toggle {
    font-size: 12px;
    color: #5e6c84;
    color: var(--kb-text-light);
    text-decoration: none;
}
.kb-trash-toggle:hover { text-decoration: underline; }
.kb-trash-list { margin-top: 8px; }

/* Сам удаленный комментарий: приглушен, чтобы не путать с живыми.
   Приглушение — цветом и фоном, без opacity: прозрачность размывает текст */
.kb-comment.kb-comment-trashed {
    background: #fafbfc;
    border-left: 3px solid #b04632;
    padding-left: 8px;
    color: #6b7688;
}
.kb-trash-meta {
    margin-top: 6px;
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
}

/* ---------- Автоматизация колонок ---------- */
.kb-rule {
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 6px;
    padding: 10px 12px;
    margin-bottom: 8px;
    background: #fff;
    color: #172b4d;
    color: var(--kb-text);
}
.kb-rule-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}
.kb-legacy .kb-rule-head > * + * { margin-left: 8px; }
.kb-rule-toggle { font-size: 12px; margin-right: auto; }
.kb-rule-body { font-size: 13px; line-height: 2; }
.kb-rule-body select {
    font-size: 13px;
    padding: 3px 6px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 4px;
    background: #fff;
    color: #172b4d;
    color: var(--kb-text);
    max-width: 240px;
}
.kb-rule-create { display: block; font-size: 12px; margin-top: 4px; }
.kb-rule-status {
    margin-top: 8px;
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
}

/* ---------- Путь к рабочей папке ---------- */
.kb-work-path-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
}
.kb-legacy .kb-work-path-row > * + * { margin-left: 8px; }
.kb-work-path-value {
    flex: 1 1 auto;
    display: block;
    padding: 6px 8px;
    background: #f4f5f7;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 4px;
    font-family: Consolas, "Courier New", monospace;
    font-size: 12px;
    color: #172b4d;
    color: var(--kb-text);
    word-break: break-all;
}
.kb-lp-path-input {
    width: 100%;
    margin-top: 4px;
    padding: 6px 8px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 4px;
    font-family: Consolas, "Courier New", monospace;
    font-size: 12px;
    color: #172b4d;
    color: var(--kb-text);
    box-sizing: border-box;
}

/* ---------- Праздничное оформление ---------- */
/* Сдержанно: полоса и строка поздравления, без анимации и картинок */
.kb-holiday-bar {
    border-left: 4px solid #0079c2;
    background: #f7f9fb;
    padding: 8px 12px;
    margin-bottom: 10px;
    border-radius: 4px;
}
.kb-holiday-name { font-weight: 700; font-size: 14px; }
.kb-holiday-sub {
    display: block;
    margin-top: 2px;
    font-size: 12px;
    color: #5e6c84;
    color: var(--kb-text-light);
}

/* ---------- Комментарии: новые и решения по задаче ---------- */
.kb-comment.kb-comment-unread {
    background: #f2f8fc;
    border-left: 3px solid #0079bf;
    border-left: 3px solid var(--kb-primary);
    padding-left: 8px;
}
.kb-comment-new-mark {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    color: #0055a5;
    background: #e4f0f6;
    border-radius: 3px;
    padding: 1px 5px;
    margin-right: 4px;
}
/* Решение по задаче, попавшее в обсуждение */
.kb-comment.kb-comment-decision {
    border-left: 3px solid #dfe1e6;
    padding-left: 8px;
    background: #fafbfc;
}
.kb-comment-kind {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 4px;
    color: #5e6c84;
    color: var(--kb-text-light);
}
.kb-comment-rework { border-left-color: #eb5a46; }
.kb-comment-rework .kb-comment-kind { color: #b04632; }
.kb-comment-notes { border-left-color: #f2d600; }
.kb-comment-notes .kb-comment-kind { color: #946f00; }
.kb-comment-reopen { border-left-color: #0079bf; }
.kb-comment-reopen .kb-comment-kind { color: #0055a5; }

/* ---------- Скрытые документы ---------- */
.kb-att-hidden {
    font-size: 11px;
    color: #b04632;
    font-weight: 700;
}
.kb-att-hide-toggle {
    display: block;
    margin-top: 3px;
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
}

/* ---------- Кто видел комментарий ---------- */
/* Двойная галочка — видели все исполнители, одинарная — часть,
   серая — пока никто. Показывается автору комментария и администратору. */
.kb-cread {
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
    cursor: help;
}
.kb-cread-none { color: #97a0af; }
.kb-cread-part { color: #946f00; }
.kb-cread-all  { color: #216e4e; }

/* ---------- Исполнитель пункта чек-листа ---------- */
.kb-cl-assignee {
    margin-left: auto;
    max-width: 170px;
    font-size: 11px;
    padding: 1px 4px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 3px;
    background: #fff;
    color: #172b4d;
    color: var(--kb-text);
}
.kb-cl-who {
    margin-left: auto;
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
    white-space: nowrap;
}
/* Выполненный пункт: исполнитель приглушается цветом, не прозрачностью */
.kb-cl-item.done .kb-cl-who { color: #9aa4b5; }

/* ---------- Выключатель писем в панели уведомлений ---------- */
.kb-notif-mail {
    border-top: 1px solid #dfe1e6;
    border-top: 1px solid var(--kb-border);
    padding: 8px 10px;
    background: #fafbfc;
}
.kb-notif-mail-head {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    color: #5e6c84;
    color: var(--kb-text-light);
    margin-bottom: 5px;
}
.kb-notif-mail-label {
    display: block;
    font-size: 12px;
    color: #172b4d;
    color: var(--kb-text);
    cursor: pointer;
}
.kb-notif-mail-note {
    margin-top: 4px;
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
    line-height: 1.4;
}

/* ============================================================
   Письмо из почты, перетащенное на доску
   ============================================================ */

/* Подсказка накрывает страницу целиком, но событий мыши не перехватывает:
   иначе браузер перестал бы понимать, над какой колонкой отпускают письмо.
   Цвета заданы числами: подсказка живет вне корня приложения, где
   переменные оформления не действуют. */
.kb-mail-drop {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 100002;
    display: none;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    background: rgba(9, 30, 66, .35);
}
.kb-mail-drop-box {
    background: #fff;
    border: 3px dashed #0079bf;
    border-radius: 10px;
    padding: 22px 30px;
    max-width: 460px;
    text-align: center;
    box-shadow: 0 12px 32px rgba(9, 30, 66, .35);
}
.kb-mail-drop-icon {
    font-size: 34px;
    line-height: 1;
    margin-bottom: 8px;
}
.kb-mail-drop-title {
    font-size: 17px;
    font-weight: 700;
    color: #172b4d;
}
.kb-mail-drop-note {
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.45;
    color: #5e6c84;
}

/* Отклонение в сводке журнала: знак важнее числа, поэтому он цветной */
.kb-jr-delta { white-space: nowrap; font-weight: 700; }
.kb-jr-delta.plus { color: #216e4e; }
.kb-jr-delta.minus { color: #b3261e; }

/* ============================================================
   Шрифт для значков
   ============================================================
   Edge Legacy (версия 44) выбирает шрифт по первому подходящему в списке
   и на значках нередко останавливается на обычном тексте — вместо картинки
   получается пустой прямоугольник. В элементах, где кроме значка ничего нет,
   ставим шрифт значков первым: подмена букв при этом невозможна, потому что
   букв в них не бывает. */
.kb-card-kind,
.kb-card-mark,
.kb-kind-icon,
.kb-manage-icon,
.kb-mail-drop-icon,
.kb-att-download {
    font-family: "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji",
                 "Noto Color Emoji", "Segoe UI", sans-serif;
}

/* Значок рода задачи перед заголовком карточки. Отступ задан стилем:
   пробел рядом со значком занимает три пиксела, и заголовок к нему липнет */
.kb-card-kind {
    display: inline-block;
    margin-right: 5px;
    font-size: 13px;
    line-height: 1;
    vertical-align: baseline;
}

/* ============================================================
   Повторяющиеся организационные задачи
   ============================================================ */

.kb-rec-line {
    font-size: 13px;
    line-height: 1.5;
    margin: 2px 0;
}
.kb-rec-flag {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .02em;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 10px;
    padding: 1px 8px;
    color: #5e6c84;
    color: var(--kb-text-light);
    white-space: nowrap;
}
.kb-rec-flag.on {
    color: #216e4e;
    border-color: #79f2c0;
    background: #e6fcf3;
}
.kb-rec-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}
/* Запасные отступы для Edge Legacy и IE: там gap во флексбоксе не работает */
.kb-legacy .kb-rec-actions > * { margin: 0 6px 6px 0; }
.kb-rec-actions .kb-btn {
    padding: 3px 10px;
    font-size: 12px;
}
.kb-rec-wd {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 14px;
}
.kb-legacy .kb-rec-wd > * { margin: 0 14px 4px 0; }
.kb-rec-wd-opt {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    white-space: nowrap;
}

/* ============================================================
   Оформление личной доски: фон, цвета колонок, наклейки
   ============================================================
   Наборы заданы здесь списком, а не свободным выбором цвета: со свободным
   доска быстро становится нечитаемой — цвет текста под произвольный фон
   не подберешь. Все оттенки светлые, чтобы черный текст карточек оставался
   разборчивым. */

/* --- Фон доски --- */
.kb-board-wrapper[class*="kb-bg-"] {
    padding: 12px;
    border-radius: 10px;
}
.kb-bg-paper    { background: #faf6ee; }
.kb-bg-mint     { background: #eaf6f0; }
.kb-bg-sky      { background: #eaf1fa; }
.kb-bg-sand     { background: #f7f1e6; }
.kb-bg-lavender { background: #f1eefa; }
.kb-bg-graphite { background: #e8eaed; }
/* Клетка рисуется полосами: картинки в закрытой сети взять неоткуда,
   а полосы дает сам браузер */
.kb-bg-grid {
    background-color: #fbfaf6;
    background-image:
        linear-gradient(to right, rgba(9,30,66,.07) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(9,30,66,.07) 1px, transparent 1px);
    background-size: 22px 22px;
}

/* --- Цвет колонки --- */
.kb-column.kb-col-blue   { background: #dcebfa; }
.kb-column.kb-col-green  { background: #ddf3e4; }
.kb-column.kb-col-yellow { background: #fbf3d5; }
.kb-column.kb-col-orange { background: #fbe7d5; }
.kb-column.kb-col-red    { background: #fadcda; }
.kb-column.kb-col-purple { background: #ece3fa; }
.kb-column.kb-col-gray   { background: #e3e5e8; }

/* --- Наклейка на карточке --- */
.kb-card-sticker {
    display: inline-block;
    margin-right: 5px;
    font-size: 14px;
    line-height: 1;
    font-family: "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji",
                 "Noto Color Emoji", "Segoe UI", sans-serif;
}

/* --- Окно настройки оформления --- */
.kb-decor-bgs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.kb-legacy .kb-decor-bgs > * { margin: 0 6px 6px 0; }
.kb-decor-bgs .kb-decor-bg {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 13px;
    text-transform: none;
    letter-spacing: 0;
    font-weight: 400;
    padding: 7px 11px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 6px;
    cursor: pointer;
}
.kb-decor-bgs .kb-decor-bg-plain { background: #fff; }

.kb-decor-cols {
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.kb-decor-col {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 6px 10px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 6px;
    background: #fff;
}
.kb-legacy .kb-decor-col > * + * { margin-left: 10px; }
.kb-decor-col.kb-col-blue   { background: #dcebfa; }
.kb-decor-col.kb-col-green  { background: #ddf3e4; }
.kb-decor-col.kb-col-yellow { background: #fbf3d5; }
.kb-decor-col.kb-col-orange { background: #fbe7d5; }
.kb-decor-col.kb-col-red    { background: #fadcda; }
.kb-decor-col.kb-col-purple { background: #ece3fa; }
.kb-decor-col.kb-col-gray   { background: #e3e5e8; }
.kb-decor-col-name {
    font-size: 13px;
    /* Ширина фиксированная: иначе поля выбора съезжают друг относительно
       друга, и колонка со списками выглядит рваной */
    flex: 0 0 150px;
    color: #172b4d;
    color: var(--kb-text);
}
.kb-decor-col select { flex: 1 1 auto; }

.kb-field .kb-decor-set {
    display: block;
    font-size: 13px;
    text-transform: none;
    letter-spacing: 0;
    font-weight: 400;
    padding: 5px 0;
}
.kb-decor-set-items {
    font-size: 16px;
    letter-spacing: 3px;
    font-family: "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji",
                 "Noto Color Emoji", "Segoe UI", sans-serif;
}

/* --- Выбор наклейки в окне задачи --- */
.kb-sticker-pick {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}
.kb-legacy .kb-sticker-pick > * { margin: 0 5px 5px 0; }
.kb-sticker-btn {
    font-size: 17px;
    line-height: 1;
    padding: 5px 9px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
    font-family: "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji",
                 "Noto Color Emoji", "Segoe UI", sans-serif;
}
.kb-sticker-btn:hover { border-color: #0079bf; }
.kb-sticker-btn.active {
    border-color: #0079bf;
    background: #eef6fc;
    box-shadow: inset 0 0 0 1px #0079bf;
}
.kb-sticker-clear { font-size: 12px; }

/* ============================================================
   Формулировки для отчетов о выполнении
   ============================================================ */

/* Выпадающая подсказка при наборе — на той же основе, что подсказка «@» */
.kb-phrase-box { max-height: 260px; overflow-y: auto; }
.kb-phrase-hint {
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
    padding: 5px 10px;
    border-bottom: 1px solid #dfe1e6;
    border-bottom: 1px solid var(--kb-border);
}
.kb-phrase-item {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}
.kb-legacy .kb-phrase-item > * + * { margin-left: 8px; }
.kb-phrase-item .kb-phrase-text {
    flex: 1 1 auto;
    /* Длинная формулировка переносится, а не обрезается: выбирать вслепую
       по первым словам нельзя — они у половины фраз одинаковые */
    white-space: normal;
    line-height: 1.35;
}
.kb-phrase-tag {
    flex: 0 0 auto;
    font-size: 10px;
    text-transform: uppercase;
    color: #5e6c84;
    color: var(--kb-text-light);
    white-space: nowrap;
}

/* Кнопка и раскрывающийся список под полем отчета */
.kb-phrase-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 6px;
}
.kb-legacy .kb-phrase-bar > * + * { margin-left: 10px; }
.kb-phrase-bar .kb-btn { padding: 3px 10px; font-size: 12px; }
.kb-phrase-list {
    margin-top: 6px;
    max-height: 240px;
    overflow-y: auto;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 6px;
    padding: 6px;
    background: #fff;
    background: var(--kb-surface, #fff);
}
.kb-phrase-group {
    font-size: 11px;
    text-transform: uppercase;
    color: #5e6c84;
    color: var(--kb-text-light);
    margin: 6px 0 3px;
}
.kb-phrase-pick {
    display: block;
    width: 100%;
    text-align: left;
    font-size: 13px;
    line-height: 1.4;
    padding: 5px 7px;
    margin-bottom: 3px;
    border: 1px solid transparent;
    border-radius: 4px;
    background: none;
    color: #172b4d;
    color: var(--kb-text);
    cursor: pointer;
}
.kb-phrase-pick:hover {
    border-color: #0079bf;
    background: #eef6fc;
}

/* Список собранных формулировок в настройках доски */
.kb-phrase-row {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 4px 0;
    border-bottom: 1px solid #f0f1f3;
    font-size: 13px;
}
.kb-legacy .kb-phrase-row > * + * { margin-left: 8px; }
.kb-phrase-uses {
    flex: 0 0 34px;
    text-align: center;
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 9px;
    padding: 1px 0;
}
.kb-phrase-row .kb-phrase-text { flex: 1 1 auto; line-height: 1.35; }

/* ============================================================
   Пункты чек-листа: кто отметил и «мои пункты» на личной доске
   ============================================================ */

.kb-cl-doneby {
    font-size: 11px;
    color: #216e4e;
    white-space: nowrap;
    margin-left: 6px;
}

.kb-my-items {
    margin-bottom: 12px;
}
.kb-my-items-head {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    font-size: 14px;
    margin-bottom: 6px;
}
.kb-legacy .kb-my-items-head > * + * { margin-left: 10px; }
.kb-my-items-head .kb-btn { padding: 2px 10px; font-size: 12px; }
.kb-my-items-count {
    font-size: 12px;
    color: #5e6c84;
    color: var(--kb-text-light);
    margin-right: auto;
}
.kb-my-items-list {
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 8px;
    padding: 8px 10px;
    background: #fff;
    background: var(--kb-surface, #fff);
}
.kb-my-item {
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex-wrap: wrap;
    padding: 5px 0;
    border-bottom: 1px solid #f0f1f3;
    font-size: 13px;
    cursor: pointer;
}
.kb-legacy .kb-my-item > * + * { margin-left: 8px; }
.kb-my-item.done .kb-my-item-text {
    text-decoration: line-through;
    color: #8993a4;
}
.kb-my-item.overdue .kb-my-item-meta { color: #b3261e; font-weight: 700; }
.kb-my-item-text { flex: 1 1 260px; line-height: 1.35; }
.kb-my-item-card {
    font-size: 12px;
    color: #0079bf;
    color: var(--kb-primary);
    text-decoration: none;
}
.kb-my-item-card:hover { text-decoration: underline; }
.kb-my-item-meta {
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
    white-space: nowrap;
}

/* ============================================================
   Документ, перетащенный в окно задачи
   ============================================================ */

/* Наложение занимает окно целиком, а не окно задачи.
   Карточка бывает длиннее экрана, и наложение по ее размеру уводило вопрос
   о виде документа далеко вниз — до него приходилось прокручивать. */
/* Пока это только подсказка «отпустите документ», наложение не ловит мышь:
   иначе оно перехватывает события перетаскивания, подсказка не убирается —
   и полупрозрачный слой во весь экран намертво закрывает страницу.
   Мышь включается только вместе с вопросом о виде документа. */
.kb-card-drop { pointer-events: none; }
.kb-card-drop.kb-card-drop-ask { pointer-events: auto; }
.kb-card-drop {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(23, 43, 77, .55);
    z-index: 100000;
    padding: 20px;
    text-align: center;
}
.kb-card-drop-box {
    border: 2px dashed #0079bf;
    border: 2px dashed var(--kb-primary);
    border-radius: 10px;
    padding: 22px 26px;
    background: #fff;
    background: var(--kb-surface, #fff);
    max-width: 520px;
}
.kb-card-drop-icon {
    font-size: 32px;
    line-height: 1;
    margin-bottom: 8px;
    font-family: "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji",
                 "Noto Color Emoji", "Segoe UI", sans-serif;
}
.kb-card-drop-title {
    font-size: 15px;
    font-weight: 700;
    color: #172b4d;
    color: var(--kb-text);
    margin-bottom: 4px;
}
.kb-card-drop-note,
.kb-card-drop-files {
    font-size: 12px;
    color: #5e6c84;
    color: var(--kb-text-light);
    line-height: 1.4;
    margin-bottom: 10px;
    word-break: break-word;
}
.kb-card-drop-choice {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 10px;
}
.kb-legacy .kb-card-drop-choice > * { margin: 0 10px 10px 0; }
/* Кнопки выбора не наследуют обычные: у тех темная заливка и белый текст,
   а здесь под названием идет пояснение — на темном фоне оно нечитаемо */
.kb-drop-kind {
    display: block;
    flex: 1 1 210px;
    text-align: left;
    padding: 10px 12px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 6px;
    background: #fff;
    background: var(--kb-surface, #fff);
    color: #172b4d;
    color: var(--kb-text);
    cursor: pointer;
    font-size: 14px;
    font-family: inherit;
}
.kb-drop-kind:hover {
    border-color: #0079bf;
    background: #eef6fc;
}
.kb-drop-kind b {
    display: block;
    font-weight: 700;
    margin-bottom: 2px;
}
.kb-drop-kind-icon {
    margin-right: 6px;
    font-family: "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji",
                 "Noto Color Emoji", "Segoe UI", sans-serif;
}
.kb-drop-kind > span {
    display: block;
    font-size: 11px;
    font-weight: 400;
    color: #5e6c84;
    color: var(--kb-text-light);
    white-space: normal;
    line-height: 1.3;
}
.kb-card-drop-cancel { padding: 4px 14px; font-size: 12px; }

/* ============================================================
   Блоки под кнопками
   ============================================================
   Раньше сведения шли сплошной чередой строк во всю ширину и занимали
   пол-экрана. Теперь это отдельные блоки: их можно свернуть, скрыть
   и переставить перетаскиванием. */

.kb-widgets {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 8px;
    align-items: flex-start;
}
.kb-legacy .kb-widgets > * { margin: 0 10px 10px 0; }

.kb-widget {
    flex: 1 1 330px;
    min-width: 0;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 8px;
    background: #fff;
    background: var(--kb-surface, #fff);
    overflow: hidden;
}
/* Отбор задач шире прочего: там ряд полей, и в узком блоке они наползают */
.kb-widget-wide { flex: 2 1 520px; }

/* Вложенные блоки уже имеют свои отступы — снимаем двойные */
.kb-widget-plain > .kb-my-items { margin-bottom: 0; }

/* Состав доски внутри блока: без своей рамки, заливки и отступов.
   Рамка досталась ему от прежнего вида, когда блок стоял отдельной
   полосой; теперь она рисует тяжелую коробку вокруг одной-двух фамилий
   и занимает высоту втрое больше содержимого. */
.kb-widget-plain > .kb-board-members {
    background: none;
    border: none;
    padding: 0;
    margin: 0 0 2px;
    gap: 5px;
}
.kb-widget-plain .kb-board-members-label {
    font-size: 11px;
    font-weight: 600;
}
.kb-widget-plain .kb-member-chip {
    padding: 0 8px 0 2px;
    font-size: 11px;
    line-height: 1.3;
    border-radius: 11px;
}
.kb-widget-plain .kb-member-chip-ini {
    width: 18px;
    height: 18px;
    font-size: 9px;
}
.kb-widget-plain .kb-member-chip-count {
    font-size: 10px;
}

.kb-widget-opt {
    display: block;
    font-size: 13px;
    padding: 4px 0;
}

/* ============================================================
   Рабочее пространство доски
   ============================================================
   Доска — самостоятельное рабочее место, а не страница сайта: шапка темы,
   подвал и заголовок страницы на ней не нужны. Освобождается около 200 px
   по высоте — это четыре лишние карточки в каждой колонке.
   Черная полоса WordPress остается: через нее выход из системы и консоль. */

.kanban-page #masthead,
.kanban-page .site-header,
.kanban-page header.site-header,
.kanban-page #site-navigation,
.kanban-page .main-navigation,
.kanban-page #colophon,
.kanban-page .site-footer,
.kanban-page footer.site-footer,
.kanban-page .footer-wrapper,
.kanban-page .entry-header,
.kanban-page .page-header,
.kanban-page .breadcrumb,
.kanban-page .breadcrumbs,
.kanban-page #scroll-up,
.kanban-page .scroll-up {
    display: none !important;
}
.kanban-page #page,
.kanban-page #content,
.kanban-page .site-content,
.kanban-page .entry-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
/* Доска сама тянется по высоте окна и прокручивается внутри колонок,
   поэтому боковой прокрутки у страницы быть не должно */
.kanban-page { overflow-x: hidden; }

/* Панель кнопок остается на виду при прокрутке внутри доски */
.kb-toolbar {
    position: sticky;
    top: 0;
    z-index: 6;
    background: #f4f5f7;
    background: var(--kb-bg, #f4f5f7);
    padding: 6px 0;
    gap: 8px;
}

/* Все, что стоит в строке панели, — одной высоты.
   Раньше поле выбора доски, кнопки и «Ещё» отличались на пару пикселей:
   ряд выглядел рваным, а кнопки казались приподнятыми над полем выбора.
   Селекторы с «>» намеренно: кнопки внутри меню «Ещё» — не элементы
   строки, у них своя высота по тексту. */
.kb-toolbar > select,
.kb-toolbar > input,
.kb-toolbar > button,
.kb-toolbar > .kb-more-wrap > .kb-btn,
.kb-toolbar > .kb-export-menu > .kb-btn {
    box-sizing: border-box;
    height: 32px;
    padding: 0 10px;
    line-height: 30px;
    vertical-align: middle;
}

/* ------------------------------------------------------------------
   Выбор задачи с поиском: одно поле, список подсказок под ним.
   ------------------------------------------------------------------ */
.kb-tp { position: relative; }
.kb-tp-input { width: 100%; padding-right: 30px !important; }
.kb-tp-clear {
    position: absolute;
    right: 6px;
    top: 50%;
    margin-top: -11px;
    width: 22px;
    height: 22px;
    line-height: 20px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #dfe1e6;
    color: #42526e;
    font-size: 15px;
    cursor: pointer;
}
.kb-tp-clear:hover { background: #c1c7d0; }
.kb-tp-list {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    margin-top: 2px;
    max-height: 260px;
    overflow-y: auto;
    background: #ffffff;
    border: 1px solid #c1c7d0;
    border-radius: 6px;
    box-shadow: 0 8px 16px rgba(9, 30, 66, .2);
    z-index: 30;
}
.kb-tp-item {
    padding: 7px 10px;
    font-size: 13px;
    line-height: 1.35;
    color: #172b4d;
    cursor: pointer;
    border-bottom: 1px solid #f4f5f7;
}
.kb-tp-item:last-child { border-bottom: 0; }
.kb-tp-item.active, .kb-tp-item:hover { background: #e9f2ff; }
.kb-tp-col {
    display: inline-block;
    margin-right: 6px;
    padding: 0 6px;
    border-radius: 3px;
    background: #f4f5f7;
    color: #5e6c84;
    font-size: 11px;
}
.kb-tp-more { padding: 7px 10px; font-size: 12px; color: #5e6c84; }
/* Атрибут hidden сильнее собственного display у элементов поля */
.kb-tp-list[hidden], .kb-tp-clear[hidden] { display: none !important; }

/* ------------------------------------------------------------------
   Призрак: задача, которую просят поднять на доску.

   Это еще не карточка доски, и выглядеть как карточка она не должна:
   полупрозрачная, с пунктирной рамкой. Работать с ней нельзя — по
   нажатию предлагается принять решение по запросу.
   ------------------------------------------------------------------ */
.kb-ghost-card {
    background: #ffffff;
    border: 1px dashed #8993a4;
    border-radius: 6px;
    padding: 8px 10px;
    margin-bottom: 8px;
    opacity: .55;
    cursor: pointer;
    transition: opacity .12s ease, box-shadow .12s ease;
}
.kb-ghost-card:hover { opacity: .9; box-shadow: 0 0 0 2px #0079bf; }
/* Там, где решение за смотрящим, призрак заметнее: его нельзя пропустить */
.kb-ghost-card.kb-ghost-mine { opacity: .7; border-color: #0079bf; }
.kb-ghost-card .kb-card-title { margin-bottom: 4px; }
.kb-ghost-tag {
    font-size: 11px;
    color: #0747a6;
    margin-bottom: 4px;
}
.kb-ghost-meta { font-size: 12px; color: #5e6c84; }
.kb-ghost-meta b { color: #0747a6; }
.kb-ghost-preview {
    border: 1px solid #dfe1e6;
    border-radius: 6px;
    padding: 8px 10px;
    background: #fafbfc;
    font-size: 14px;
}
.kb-ghost-preview-text { font-size: 13px; color: #42526e; margin-top: 4px; font-weight: 400; }

/* ------------------------------------------------------------------
   Доска против стилей темы сайта.

   Кнопки и поля панели защищены выше. Колонки и карточки оставались
   без защиты, а тема оформления задает свои правила для текста внутри
   страницы — обычно через #content или .entry-content, то есть весом
   селектора выше нашего. Доска в таком случае выглядит пустой: рамки
   колонок на месте, а названий колонок и задач не видно.

   Цвет задан длинным селектором, а не !important: так правило сильнее
   темы сайта, но слабее оформления скинов, где цвет выбран намеренно.
   Для размера шрифта и видимости !important нужен: тема может обнулить
   размер или спрятать текст, и спорить тут не с чем.
   ------------------------------------------------------------------ */
#kanban-app-root .kb-board-wrapper .kb-column,
#kanban-app-root .kb-board-wrapper .kb-column .kb-col-nameline .kb-col-name,
#kanban-app-root .kb-board-wrapper .kb-column .kb-col-collapsed-title,
#kanban-app-root .kb-board-wrapper .kb-column .kb-column-cards .kb-card .kb-card-title {
    color: #172b4d;
    color: var(--kb-text);
}
#kanban-app-root .kb-board-wrapper .kb-column .kb-col-name,
#kanban-app-root .kb-board-wrapper .kb-column .kb-col-collapsed-title {
    font-size: 14px !important;
    line-height: 1.3 !important;
    visibility: visible !important;
    opacity: 1 !important;
    text-indent: 0 !important;
}
#kanban-app-root .kb-board-wrapper .kb-column .kb-column-count {
    font-size: 12px !important;
    visibility: visible !important;
    opacity: 1 !important;
}
#kanban-app-root .kb-board-wrapper .kb-column .kb-card-title {
    font-size: 14px !important;
    line-height: 1.35 !important;
    visibility: visible !important;
    opacity: 1 !important;
    text-indent: 0 !important;
}
/* Шапка и список задач остаются на своих местах, даже если тема
   поменяла display у всех блоков внутри страницы */
#kanban-app-root .kb-board-wrapper .kb-column .kb-column-header { display: block !important; }
#kanban-app-root .kb-board-wrapper .kb-column .kb-column-cards { display: block !important; }
#kanban-app-root .kb-board-wrapper .kb-column .kb-col-nameline { display: flex !important; }

/* ------------------------------------------------------------------
   Панель кнопок против стилей темы сайта.

   Доска живет внутри страницы WordPress, и тема оформления задает свои
   размеры для select, input и button — обычно с высокой значимостью
   селектора (через #content или .entry-content). Из-за этого поле выбора
   доски получало высоту и отступы темы, а кнопки — нет, и ряд разъезжался.

   На странице «Проверка системы» тема не подключается, поэтому там
   панель выглядела ровной, а на самой доске — нет.

   Отсюда !important: спорить весом селектора с чужой темой бессмысленно,
   у нее в любой момент может оказаться правило значимее. Ограничиваем
   действие строкой панели, внутрь окон и карточек оно не лезет.
   ------------------------------------------------------------------ */
#kanban-app-root .kb-toolbar > select,
#kanban-app-root .kb-toolbar > input,
#kanban-app-root .kb-toolbar > button,
#kanban-app-root .kb-toolbar > .kb-more-wrap > .kb-btn,
#kanban-app-root .kb-toolbar > .kb-export-menu > .kb-btn {
    box-sizing: border-box !important;
    height: 32px !important;
    min-height: 0 !important;
    max-height: none !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    line-height: 30px !important;
    vertical-align: middle !important;
    font-size: 14px !important;
    float: none !important;
}
/* Само поле выбора: тема часто добавляет ему свою рамку и фон */
#kanban-app-root .kb-toolbar > select {
    padding-left: 10px !important;
    padding-right: 26px !important;
    width: auto !important;
    max-width: 320px !important;
}
/* Строка панели остается строкой, даже если тема меняет display у детей */
#kanban-app-root .kb-toolbar {
    align-items: center !important;
}

/* Строка отбора задач — те же размеры, что и у панели, и по той же
   причине: тема сайта навязывает полям свою высоту и отступы */
#kanban-app-root .kb-filters > select,
#kanban-app-root .kb-filters > input,
#kanban-app-root .kb-filters > button {
    box-sizing: border-box !important;
    height: 28px !important;
    min-height: 0 !important;
    max-height: none !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    line-height: 26px !important;
    vertical-align: middle !important;
    font-size: 13px !important;
    float: none !important;
}
#kanban-app-root .kb-filters {
    align-items: center !important;
}
#kanban-app-root .kb-filters > label {
    margin: 0 !important;
    line-height: 28px !important;
    vertical-align: middle !important;
}

/* Edge Legacy (версия 44) и Internet Explorer.
   Их флексбокс к полям формы применяет выравнивание по-своему: заданное
   контейнеру align-items к select и button доходит не всегда, и панель
   разъезжается по высоте. Спорить с этим бесполезно — для этих браузеров
   отказываемся от флексбокса в панели вовсе.

   Строчные блоки с vertical-align: middle выравниваются по середине строки
   у всех браузеров начиная с IE8 — это самый предсказуемый способ, какой
   есть. Отступы задаем полями: gap эти браузеры тоже не применяют. */
.kb-legacy .kb-toolbar {
    display: block;
    white-space: normal;
}
.kb-legacy .kb-toolbar > * {
    display: inline-block;
    vertical-align: middle;
    margin-right: 8px;
    float: none;
}
.kb-legacy .kb-toolbar > select,
.kb-legacy .kb-toolbar > input,
.kb-legacy .kb-toolbar > button,
.kb-legacy .kb-toolbar > .kb-more-wrap > .kb-btn,
.kb-legacy .kb-toolbar > .kb-export-menu > .kb-btn {
    box-sizing: border-box;
    height: 32px;
    line-height: 30px;
    padding: 0 10px;
    vertical-align: middle;
}
/* Уведомления держатся правого края: margin-left:auto работает только
   во флексбоксе, здесь его заменяет обычное выравнивание вправо */
.kb-legacy .kb-toolbar > .kb-export-menu:last-child {
    float: right;
    margin-right: 0;
}
/* Разделитель между повседневными и служебными кнопками */
.kb-legacy .kb-btn-divider { display: none; }

/* Обертки выпадающих списков — тоже элементы строки, а не блоки */
.kb-toolbar > .kb-more-wrap,
.kb-toolbar > .kb-export-menu,
.kb-toolbar > .kb-refresh-box {
    display: inline-flex;
    align-items: center;
}

/* Высота колонки — по ее содержимому, как и было: короткая колонка не должна
   тянуться во весь экран пустой рамкой. Ограничение сверху ставит сценарий:
   колонка не длиннее видимой части окна, дальше прокрутка внутри нее. */
.kb-board-wrapper { align-items: flex-start; }
.kb-column { max-height: none; }

/* Объявления и заметки — одной строкой: это фон, а не работа */
.kb-notice {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.4;
    margin-bottom: 4px;
}
.kb-widget-plain .kb-parent-note,
.kb-widget-plain .kb-personal-note {
    margin: 0 0 4px;
    padding: 6px 9px;
    font-size: 12px;
    line-height: 1.4;
}
.kb-widget-plain .kb-parent-note:last-child,
.kb-widget-plain .kb-personal-note:last-child { margin-bottom: 0; }

/* Полоса прокрутки в колонке видна всегда, когда есть что прокручивать:
   при скрытой полосе доска выглядит так, будто ниже ничего нет */
.kb-column-cards::-webkit-scrollbar { width: 10px; }
.kb-column-cards::-webkit-scrollbar-track { background: transparent; }
.kb-column-cards::-webkit-scrollbar-thumb {
    background: #c1c7d0;
    border-radius: 5px;
    border: 2px solid transparent;
    background-clip: content-box;
}
.kb-column-cards::-webkit-scrollbar-thumb:hover { background: #a5adba; background-clip: content-box; }
.kb-column-cards { scrollbar-width: thin; }

/* Блоки под панелью: у развернутого нет ни рамки, ни заголовка — только
   содержимое. Свернутый показывается «таблеткой» в одну строку. */
.kb-widget-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    align-items: center;
    margin: 2px 0 4px;
}
.kb-legacy .kb-widget-chips > * { margin: 0 5px 4px 0; }
.kb-widget-chip {
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    background: #fff;
    background: var(--kb-surface, #fff);
    border-radius: 12px;
    padding: 1px 9px;
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
    cursor: pointer;
    white-space: nowrap;
}
.kb-widget-chip:hover { border-color: #0079bf; color: #172b4d; }
.kb-widget-chip b { font-weight: 600; }
.kb-widget-badge { font-size: 10px; color: #8993a4; }

.kb-widgets {
    display: flex;
    /* В ряд с переносом: блоки можно ставить и друг под другом, и рядом —
       перетаскивание работает в обе стороны. Ширину блок берет по
       содержимому, но не уже 260 px, иначе поля отбора наползают */
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 4px 18px;
    margin-bottom: 6px;
}
.kb-widget-plain {
    flex: 0 1 auto;
    min-width: 260px;
    max-width: 100%;
}
.kb-widget-plain > *:last-child { margin-bottom: 0; }

/* Ухват для перестановки блока: видно только при наведении на блок,
   поэтому в обычном состоянии он ничего не занимает, кроме узкого поля слева */
.kb-widget-plain {
    position: relative;
    padding-left: 14px;
}
.kb-widget-grip {
    position: absolute;
    left: 0;
    top: 0;
    width: 12px;
    line-height: 1.1;
    font-size: 10px;
    letter-spacing: -2px;
    color: #b3bac5;
    cursor: grab;
    opacity: 0;
    transition: opacity .12s;
    user-select: none;
}
.kb-widget-plain:hover .kb-widget-grip { opacity: 1; }
.kb-widget-grip:active { cursor: grabbing; }
.kb-widget-dragging { opacity: .45; }
.kb-widget-over-before { box-shadow: -3px 0 0 0 #0079bf; }
.kb-widget-over-after { box-shadow: 3px 0 0 0 #0079bf; }

/* Отбор задач — строка полей под панелью, без рамки и заголовка:
   это инструмент, а не раздел, и рамка вокруг него только сорила */
.kb-widget-plain > .kb-filters {
    border: none;
    background: none;
    box-shadow: none;
    padding: 0;
    margin: 0 0 4px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}
.kb-legacy .kb-widget-plain > .kb-filters > * { margin: 0 6px 4px 0; }
.kb-widget-plain > .kb-filters input[type=text] { width: 240px; }
.kb-widget-plain > .kb-filters select,
.kb-widget-plain > .kb-filters input[type=text] {
    height: 26px;
    padding: 2px 6px;
    font-size: 12px;
}
.kb-widget-plain > .kb-filters label { font-size: 12px; }

/* Строки окна «Блоки» */
.kb-widget-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 0;
    border-bottom: 1px solid #f0f1f3;
    font-size: 13px;
}
.kb-legacy .kb-widget-row > * + * { margin-left: 8px; }
.kb-widget-row-name { flex: 1 1 auto; }
.kb-widget-btn {
    flex: 0 0 auto;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    background: #fff;
    color: #5e6c84;
    color: var(--kb-text-light);
    font-size: 11px;
    line-height: 1;
    width: 24px;
    height: 24px;
    padding: 0;
    border-radius: 4px;
    cursor: pointer;
}
.kb-widget-btn:hover { border-color: #0079bf; color: #172b4d; }
.kb-widget-btn:disabled { opacity: .4; cursor: default; }

/* Кнопка «Ещё» и ее меню */
.kb-more-wrap { position: relative; display: inline-block; }
.kb-more-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 20;
    min-width: 240px;
    margin-top: 4px;
    padding: 5px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 8px;
    background: #fff;
    background: var(--kb-surface, #fff);
    box-shadow: 0 8px 20px rgba(9, 30, 66, .2);
}
.kb-more-wrap.open .kb-more-menu { display: block; }
.kb-more-menu .kb-btn {
    display: block;
    width: 100%;
    text-align: left;
    margin: 0 0 3px;
    padding: 6px 10px;
    font-size: 13px;
    background: none;
    color: #172b4d;
    color: var(--kb-text);
    font-weight: 400;
}
.kb-more-menu .kb-btn:hover { background: #eef6fc; }
.kb-more-group {
    display: block;
    padding: 6px 10px 2px;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #8993a4;
}
.kb-more-menu > .kb-more-group:first-child { padding-top: 2px; }
.kb-more-check {
    display: block;
    padding: 5px 10px;
    font-size: 13px;
    color: #172b4d;
    color: var(--kb-text);
    cursor: pointer;
}
.kb-more-check:hover { background: #eef6fc; }

/* Окно «Кнопки панели» */
.kb-tb-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.kb-tb-opt {
    display: block;
    font-size: 13px;
    padding: 3px 0;
}

/* ============================================================
   Оживление карточек, требующих внимания
   ============================================================
   Движение включается только классом kb-anim-on на корне приложения:
   сотрудник может выключить его за себя, а администратор — для всех.
   Без этого класса ни одно правило ниже не действует.

   Просроченная задача «тлеет» — медленное, ровное свечение: она горит
   не первый день, и дергать глаз каждую секунду незачем.
   Задача, требующая ответа, коротко подпрыгивает при появлении — как значок
   в панели задач: три подскока и покой, иначе доска превращается в ярмарку. */

@keyframes kb-burn {
    0% {
        border-left-color: #eb5a46;
        background: #fdeaea;
        transform: scale(1);
        box-shadow: inset 0 0 0 1px rgba(235, 90, 70, .5),
                    inset 0 0 10px 0 rgba(235, 90, 70, .12),
                    0 1px 0 rgba(9, 30, 66, .25);
    }
    50% {
        border-left-color: #ff9100;
        background: #ffdccf;
        transform: scale(1.015);
        box-shadow: inset 0 0 0 3px rgba(255, 87, 34, .95),
                    inset 0 0 26px 3px rgba(255, 145, 0, .55),
                    0 0 18px 4px rgba(255, 110, 60, .55);
    }
    100% {
        border-left-color: #eb5a46;
        background: #fdeaea;
        transform: scale(1);
        box-shadow: inset 0 0 0 1px rgba(235, 90, 70, .5),
                    inset 0 0 10px 0 rgba(235, 90, 70, .12),
                    0 1px 0 rgba(9, 30, 66, .25);
    }
}
@keyframes kb-bounce {
    0%, 100%  { transform: translateY(0); }
    10%       { transform: translateY(-14px); }
    22%       { transform: translateY(0); }
    34%       { transform: translateY(-9px); }
    46%       { transform: translateY(0); }
    58%       { transform: translateY(-5px); }
    70%       { transform: translateY(0); }
    80%       { transform: translateY(-2px); }
    90%       { transform: translateY(0); }
}
@keyframes kb-flame {
    0%, 100% { opacity: .6; transform: scale(.9) translateY(0); }
    45%      { opacity: 1;  transform: scale(1.18) translateY(-1px); }
}

/* Тление по контуру: свет идет от самой рамки карточки и разливается
   наружу. Карточка при этом остается читаемой — светится край, а не текст. */
.kb-anim-on .kb-card.kb-overdue {
    position: relative;
    z-index: 1;
    animation: kb-burn 2.2s ease-in-out infinite;
}
/* Соседние карточки не должны перекрывать свечение */
.kb-anim-on .kb-card.kb-overdue:hover { z-index: 2; }

.kb-anim-on .kb-card.kb-overdue .kb-due-badge.overdue::after {
    content: ' \1F525';
    display: inline-block;
    font-size: 15px;
    line-height: 1;
    animation: kb-flame 1.1s ease-in-out infinite;
}
.kb-anim-on .kb-card.kb-attention,
.kb-anim-on .kb-card.kb-overdue.kb-attention {
    animation: kb-bounce 1.7s cubic-bezier(.28, .84, .42, 1) 1;
    z-index: 3;
}

/* Уважаем настройку системы «уменьшить движение»: там, где человек
   попросил не двигать интерфейс, не двигаем ничего */
@media (prefers-reduced-motion: reduce) {
    .kb-anim-on .kb-card.kb-overdue,
    .kb-anim-on .kb-card.kb-attention,
    .kb-anim-on .kb-card.kb-overdue .kb-due-badge.overdue::after {
        animation: none;
    }
}

/* Свой срок пункта чек-листа: пока не задан — неприметная кнопка,
   заданный показывается текстом и краснеет при просрочке */
.kb-cl-due-btn {
    flex: 0 0 auto;
    border: 1px dashed #c1c7d0;
    background: none;
    border-radius: 10px;
    padding: 0 8px;
    font-size: 11px;
    line-height: 18px;
    color: #8993a4;
    cursor: pointer;
    white-space: nowrap;
}
.kb-cl-due-btn:hover { border-color: #0079bf; color: #172b4d; }
.kb-cl-due-btn.has-date {
    border-style: solid;
    border-color: #dfe1e6;
    color: #42526e;
}
.kb-cl-due-btn.overdue {
    border-color: #eb5a46;
    background: #fdecea;
    color: #b3261e;
    font-weight: 600;
}
.kb-cl-due {
    font-size: 11px;
    white-space: nowrap;
    color: #b3261e;
}
/* Пункт в окне срока: видно, чему именно ставится дата */
.kb-cl-due-item {
    margin: -6px 0 12px;
    font-size: 13px;
    color: #42526e;
}
.kb-cl-due:not(.overdue) { color: #5e6c84; color: var(--kb-text-light); }
/* Просроченный пункт виден в списке сразу, не только по дате */
.kb-cl-item.overdue > label > span { color: #b3261e; font-weight: 600; }
/* Чек-лист с просроченным пунктом виден прямо на фасаде карточки */
.kb-checklist-badge.overdue {
    background: #fdecea;
    color: #b3261e;
    border-color: #f3c2bb;
}

/* ============================================================
   График отпусков
   ============================================================ */

.kb-vp-wrap { overflow-x: auto; }
.kb-vp-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    table-layout: fixed;
}
.kb-vp-table th,
.kb-vp-table td {
    border: 1px solid #e4e6ea;
    padding: 3px 6px;
}
.kb-vp-table th {
    background: #f4f5f7;
    font-weight: 600;
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
}
.kb-vp-table th.kb-vp-name { width: 230px; text-align: left; }
.kb-vp-table th.kb-vp-days,
.kb-vp-table td.kb-vp-days { width: 96px; text-align: center; white-space: nowrap; }
/* Занято из годовой нормы: превышение — красным, чтобы его заметили при согласовании */
.kb-vp-norm { font-variant-numeric: tabular-nums; }
.kb-vp-norm.over { color: #bf2600; font-weight: 700; }
.kb-vp-nolong {
    display: inline-block;
    margin-left: 4px;
    padding: 0 4px;
    border-radius: 6px;
    background: #fff3d6;
    color: #7a5b00;
    font-size: 10px;
    font-weight: 700;
    cursor: help;
}
/* Остаток нормы и нарушения правил под полями ввода отпуска */
.kb-vn-balance { margin-top: 6px; color: #42526e; }
.kb-vn-rule-err {
    margin-top: 4px;
    padding: 4px 8px;
    border-left: 3px solid #de350b;
    background: #ffebe6;
    color: #bf2600;
}
.kb-vn-rule-warn {
    margin-top: 4px;
    padding: 4px 8px;
    border-left: 3px solid #ffab00;
    background: #fffae6;
    color: #7a5b00;
}
.kb-vp-month { width: auto; }

.kb-vp-board td {
    background: #eef4f9;
    font-size: 12px;
    padding: 5px 8px;
}
.kb-vp-board-name { font-weight: 700; color: #172b4d; color: var(--kb-text); }
.kb-vp-admins {
    margin-left: 10px;
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
}
.kb-vp-empty {
    font-size: 12px;
    color: #8993a4;
    padding: 6px 8px;
}
.kb-vp-person.admin .kb-vp-name { font-weight: 700; }
.kb-vp-chief {
    margin-left: 6px;
    font-size: 10px;
    color: #7a5b00;
    background: #fff3d6;
    border-radius: 8px;
    padding: 0 5px;
}
/* Заместитель и прочий руководящий состав — та же пометка, но спокойнее:
   старший по должности должен оставаться заметнее */
.kb-vp-chief.deputy,
.kb-vp-chief.lead {
    color: #5e6c84;
    background: #eef1f5;
}
.kb-vp-name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* Должность под фамилией: в документе она обязательна, поэтому пустую
   отмечаем прямо в графике — видно, кого надо дозаполнить */
.kb-vp-pos {
    display: block;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.2;
    color: #7a8699;
    color: var(--kb-text-light);
    overflow: hidden;
    text-overflow: ellipsis;
}
.kb-vp-pos-none { color: #b3261e; font-style: italic; }

/* Дорожка года: сетка месяцев рисуется полосами, поверх нее — отпуска */
.kb-vp-track {
    position: relative;
    height: 20px;
    padding: 0 !important;
}
.kb-vp-grid {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
}
/* Границы месяцев: каждая своим столбиком. Повторяющийся градиент с шагом
   8.3333% накапливал ошибку, и линия между июлем и августом исчезала */
.kb-vp-grid i {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 1px;
    background: rgba(9, 30, 66, .10);
}
/* Границы кварталов заметнее: по ним читают график быстрее всего */
.kb-vp-grid i.q { background: rgba(9, 30, 66, .22); }
.kb-vp-bar {
    position: absolute;
    top: 4px;
    height: 12px;
    background: #4caf50;
    border-radius: 6px;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12);
}
.kb-vp-person.admin .kb-vp-bar { background: #ff9800; }
/* Отпуск, который ждет согласования: штриховка читается как «еще не решено»
   и не спутается ни с обычным отпуском, ни с руководящим составом */
.kb-vp-bar.pending,
.kb-vp-person.admin .kb-vp-bar.pending {
    background-color: #c8e6c9;
    background-image: repeating-linear-gradient(
        45deg, rgba(56, 142, 60, .55) 0, rgba(56, 142, 60, .55) 3px,
        transparent 3px, transparent 7px
    );
    box-shadow: inset 0 0 0 1px #388e3c;
}

/* ---------- Ввод и согласование отпусков в графике ---------- */
.kb-vn-box {
    border: 1px solid #dfe1e6;
    border-radius: 6px;
    padding: 10px 12px;
    margin: 0 0 12px;
    background: #fafbfc;
}
.kb-vn-pending { border-color: #ffd54a; background: #fffbea; }
.kb-vn-title { font-size: 13px; font-weight: 700; color: #172b4d; margin-bottom: 8px; }
.kb-vn-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.kb-vn-row label { font-size: 13px; color: #42526e; display: inline-flex; align-items: center; gap: 4px; }
.kb-vn-row input[type="text"] { flex: 1 1 180px; min-width: 140px; }
.kb-vn-self { font-size: 13px; color: #42526e; font-weight: 600; }
.kb-vn-hint { font-size: 12px; color: #5e6c84; margin-top: 6px; }
.kb-vn-item {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 12px;
    padding: 6px 0;
    border-top: 1px solid #ebecf0;
    font-size: 13px;
}
.kb-vn-item:first-of-type { border-top: 0; }
.kb-vn-who { font-weight: 600; color: #172b4d; }
.kb-vn-period { color: #172b4d; }
.kb-vn-note { color: #5e6c84; font-size: 12px; }
.kb-vn-wait { color: #7a5b00; font-size: 12px; }
.kb-vn-actions { margin-left: auto; display: inline-flex; gap: 6px; }
.kb-vn-actions .kb-btn { padding: 3px 10px; font-size: 12px; }
.kb-vn-status { font-size: 11px; padding: 1px 8px; border-radius: 8px; }
.kb-vn-status.pending { background: #fff3d6; color: #7a5b00; }
.kb-vn-status.approved { background: #e3fcef; color: #006644; }
.kb-vn-status.rejected { background: #ffebe6; color: #bf2600; }
/* Старые браузеры: gap во флексбоксе не применяется */
.kb-legacy-ua .kb-vn-row > * + *,
.kb-legacy-ua .kb-vn-item > * + *,
.kb-legacy-ua .kb-vn-actions > * + * { margin-left: 8px; }

/* Сообщения об ошибках бывают многострочными: разбор неполадки словами
   читается только с переносами */
.kb-modal-error,
.kb-error-banner { white-space: pre-line; }

/* ============================================================
   Поля и кнопки против стилей темы сайта — везде, а не только в панели
   ============================================================
   Доска живет внутри страницы WordPress. Тема оформления задает свои
   размеры и отступы для button, input и select — обычно селекторами вроде
   #content button, которые весят больше наших. Из-за этого значки
   участников, кнопки в чек-листе и поля в карточке получали чужую высоту
   и поле снизу, и строки разъезжались по вертикали.

   Здесь снимается только то, что ломает выравнивание: чужие отступы,
   навязанная высота, межбуквенный интервал и капитель. Размеры, которые
   плагину действительно нужны, задаются его собственными правилами —
   они специфичнее и остаются в силе. */
#kanban-app-root button,
.kb-modal-overlay button {
    margin: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    line-height: normal !important;
    vertical-align: middle !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    font-family: inherit !important;
    box-sizing: border-box;
}
#kanban-app-root input,
#kanban-app-root select,
#kanban-app-root textarea,
.kb-modal-overlay input,
.kb-modal-overlay select,
.kb-modal-overlay textarea {
    margin: 0 !important;
    vertical-align: middle !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    font-family: inherit !important;
    box-sizing: border-box;
}
/* Флажки и переключатели тема тоже любит увеличивать и сдвигать */
#kanban-app-root input[type=checkbox],
#kanban-app-root input[type=radio],
.kb-modal-overlay input[type=checkbox],
.kb-modal-overlay input[type=radio] {
    width: 13px !important;
    height: 13px !important;
    vertical-align: middle !important;
    position: static !important;
    opacity: 1 !important;
}

/* Строки, где рядом стоят текст и значки: выравниваем по середине,
   иначе текст «садится» на базовую линию, а значки остаются выше */
#kanban-app-root .kb-board-members,
.kb-modal-overlay .kb-cl-item,
#kanban-app-root .kb-my-item {
    align-items: center !important;
}
/* Строку документа намеренно не центрируем: номер ссылки [1] стоит
   у первой строки — рядом с названием документа, а не посередине
   двухстрочного блока с подписью «кто и когда приложил» */
.kb-modal-overlay .kb-attachment-row > .kb-att-body { align-self: flex-start; }
.kb-modal-overlay .kb-attachment-row > .kb-btn { align-self: center; }

/* «Мои пункты»: сгруппированы по задачам, выполненные не показываются */
.kb-my-card { margin-bottom: 8px; }
.kb-my-card:last-of-type { margin-bottom: 2px; }
.kb-my-card-title {
    font-size: 12px;
    font-weight: 600;
    color: #0079bf;
    color: var(--kb-primary);
    text-decoration: none;
}
.kb-my-card-title:hover { text-decoration: underline; }
.kb-my-card-board {
    font-size: 11px;
    color: #8993a4;
    margin-left: 6px;
}
.kb-my-card .kb-my-item {
    border-bottom: none;
    padding: 2px 0 2px 14px;
}
.kb-my-item-when {
    font-size: 11px;
    color: #5e6c84;
    color: var(--kb-text-light);
    white-space: nowrap;
}
.kb-my-item-when.overdue { color: #b3261e; font-weight: 700; }

/* ============================================================
   Помощник при создании задачи (v1.94)
   ============================================================ */

/* Шаги формы: заголовок группы полей. В выключенном помощнике
   они не нужны — окно должно выглядеть как раньше */
.kb-step-head {
    display: flex;
    align-items: baseline;
    margin: 14px 0 8px;
    padding-bottom: 4px;
    border-bottom: 1px solid #ebecf0;
    border-bottom: 1px solid var(--kb-border);
}
.kb-legacy .kb-step-head > * + * { margin-left: 6px; }
.kb-step-num {
    display: inline-block;
    min-width: 18px;
    height: 18px;
    line-height: 18px;
    margin-right: 6px;
    text-align: center;
    border-radius: 9px;
    background: #0079bf;
    background: var(--kb-primary);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
}
.kb-step-title { font-size: 13px; font-weight: 700; color: #172b4d; color: var(--kb-text); }
.kb-step-hint {
    margin-left: 8px;
    font-size: 11px;
    color: #7a8699;
    color: var(--kb-text-light);
}
.kb-asst-off .kb-step-head { display: none; }

/* Заполненный блок сворачивается в строку сводки, следующие ждут очереди */
.kb-step-collapsed > *:not(.kb-step-head) { display: none !important; }
.kb-step-collapsed .kb-step-hint { display: none; }
.kb-step-collapsed .kb-step-head { margin: 6px 0; padding-bottom: 2px; }
.kb-step-sum {
    margin-left: 8px;
    font-size: 12px;
    color: #42526e;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.kb-step-current .kb-step-sum,
.kb-step-future .kb-step-sum { display: none; }
.kb-step-edit {
    margin-left: auto;
    padding: 0 8px;
    font-size: 11px;
    line-height: 18px;
    border: 1px solid #dfe1e6;
    border-radius: 10px;
    background: #fff;
    color: #5e6c84;
    cursor: pointer;
}
.kb-step-edit:hover { border-color: #0079bf; color: #172b4d; }
.kb-step-current .kb-step-edit,
.kb-step-future .kb-step-edit { display: none; }
#kanban-app-root .kb-step-edit,
.kb-modal-overlay .kb-step-edit {
    background: #fff !important;
    color: #5e6c84 !important;
    border: 1px solid #dfe1e6 !important;
    box-shadow: none !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    padding: 0 8px !important;
    margin: 0 0 0 auto !important;
}
/* Будущий блок виден, но приглушен: понятно, что впереди */
.kb-step-future .kb-step-title { color: #7a8699; font-weight: 400; }
.kb-step-future .kb-step-num { background: #c1c7d0; }
.kb-step-future .kb-step-head { border-bottom-style: dashed; }
/* Текущий блок — единственный раскрытый, его номер выделен */
.kb-step-current .kb-step-num { box-shadow: 0 0 0 3px rgba(0, 121, 194, .18); }
.kb-asst-off .kb-step:first-of-type .kb-field:first-child { margin-top: 0; }

/* Полоса мастера: где человек находится и как выйти в обычную форму */
.kb-step-bar {
    display: flex;
    align-items: center;
    margin: 0 0 10px;
    padding: 6px 10px;
    background: #eef4f9;
    border-radius: 6px;
}
.kb-step-count { font-size: 12px; font-weight: 700; color: #172b4d; color: var(--kb-text); }
.kb-step-of {
    margin-left: 8px;
    font-size: 12px;
    color: #5e6c84;
    color: var(--kb-text-light);
}
.kb-step-all {
    margin-left: auto;
    background: none;
    border: none;
    padding: 0;
    font-size: 12px;
    color: #0079bf;
    color: var(--kb-primary);
    text-decoration: underline;
    cursor: pointer;
}
#kanban-app-root .kb-step-all,
.kb-modal-overlay .kb-step-all {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    color: #0079bf !important;
    padding: 0 !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    /* Общий сброс полей у кнопок съедает отступ вправо — возвращаем его */
    margin: 0 0 0 auto !important;
}

/* Сама панель помощника */
.kb-asst {
    margin: 14px 0 4px;
    padding: 10px 12px;
    background: #f7f9fb;
    border: 1px solid #e3e8ee;
    border-left: 3px solid #0079bf;
    border-left-color: #0079bf;
    border-left-color: var(--kb-primary);
    border-radius: 6px;
}
.kb-asst-top { display: flex; align-items: center; flex-wrap: wrap; }
.kb-legacy .kb-asst-top > * + * { margin-left: 8px; }
.kb-asst-name { font-size: 13px; font-weight: 700; color: #172b4d; color: var(--kb-text); }
.kb-asst-ready {
    margin-left: 10px;
    font-size: 12px;
    color: #5e6c84;
    color: var(--kb-text-light);
}
.kb-asst-ready.full { color: #216e4e; font-weight: 700; }
.kb-asst-mode { margin-left: auto; font-size: 12px; }
#kanban-app-root .kb-asst-mode,
.kb-modal-overlay .kb-asst-mode { margin: 0 0 0 auto !important; font-size: 12px !important; }
.kb-asst-list { list-style: none; margin: 8px 0 0; padding: 0; }
.kb-asst-item {
    display: flex;
    align-items: baseline;
    padding: 3px 0;
    font-size: 12px;
    line-height: 1.4;
    color: #42526e;
}
.kb-legacy .kb-asst-item > * + * { margin-left: 6px; }
.kb-asst-item.ok { color: #216e4e; }
.kb-asst-item.soft { color: #97590b; }
.kb-asst-mark { margin-right: 6px; }
.kb-asst-text { flex: 1 1 auto; }
.kb-asst-fix,
.kb-asst-goto {
    flex: 0 0 auto;
    margin-left: 8px;
    padding: 0 8px;
    font-size: 11px;
    line-height: 18px;
    border: 1px solid #c1c7d0;
    border-radius: 10px;
    background: #fff;
    color: #42526e;
    cursor: pointer;
    white-space: nowrap;
}
.kb-asst-fix:hover,
.kb-asst-goto:hover { border-color: #0079bf; color: #172b4d; }
#kanban-app-root .kb-asst-fix,
#kanban-app-root .kb-asst-goto,
.kb-modal-overlay .kb-asst-fix,
.kb-modal-overlay .kb-asst-goto {
    background: #fff !important;
    color: #42526e !important;
    border: 1px solid #c1c7d0 !important;
    box-shadow: none !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    padding: 0 8px !important;
}

/* Пункты чек-листа из похожих задач */
.kb-asst-similar { margin: -4px 0 12px; }
.kb-asst-sim-head {
    margin-bottom: 4px;
    font-size: 11px;
    color: #7a8699;
    color: var(--kb-text-light);
}
.kb-asst-sim {
    display: inline-block;
    margin: 0 6px 6px 0;
    padding: 2px 10px;
    font-size: 12px;
    line-height: 18px;
    border: 1px dashed #c1c7d0;
    border-radius: 12px;
    background: #fff;
    color: #42526e;
    cursor: pointer;
    vertical-align: middle;
}
.kb-asst-sim:hover { border-color: #0079bf; color: #172b4d; }
.kb-asst-sim.added,
.kb-asst-sim:disabled { border-style: solid; background: #e6f2ea; color: #216e4e; cursor: default; }
.kb-asst-sim-uses {
    margin-left: 6px;
    font-size: 10px;
    color: #7a8699;
}
.kb-asst-sim-note { font-size: 11px; color: #216e4e; }
#kanban-app-root .kb-asst-sim,
.kb-modal-overlay .kb-asst-sim {
    background: #fff !important;
    color: #42526e !important;
    border: 1px dashed #c1c7d0 !important;
    box-shadow: none !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    padding: 2px 10px !important;
}
#kanban-app-root .kb-asst-sim.added,
.kb-modal-overlay .kb-asst-sim.added {
    background: #e6f2ea !important;
    color: #216e4e !important;
    border-style: solid !important;
}

/* ============================================================
   Интерактивная справка (v1.95)
   ============================================================ */

.kb-help-wrap {
    display: flex;
    align-items: stretch;
    min-height: 320px;
    max-height: 64vh;
    border: 1px solid #ebecf0;
    border: 1px solid var(--kb-border);
    border-radius: 6px;
    overflow: hidden;
}
/* Старый Edge не понимает gap: разделяем колонки рамкой, а не отступом */
.kb-help-side {
    flex: 0 0 240px;
    display: flex;
    flex-direction: column;
    border-right: 1px solid #ebecf0;
    border-right: 1px solid var(--kb-border);
    background: #fafbfc;
}
.kb-help-search {
    margin: 8px;
    padding: 4px 8px;
    font-size: 12px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 4px;
    background: #fff;
}
#kanban-app-root .kb-help-search,
.kb-modal-overlay .kb-help-search { margin: 8px !important; width: auto !important; }
.kb-help-list { flex: 1 1 auto; overflow-y: auto; padding-bottom: 8px; }
.kb-help-group {
    padding: 8px 10px 2px;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #7a8699;
    color: var(--kb-text-light);
}
.kb-help-item {
    display: block;
    width: 100%;
    padding: 5px 10px;
    text-align: left;
    font-size: 13px;
    line-height: 1.35;
    background: none;
    border: none;
    color: #42526e;
    cursor: pointer;
}
.kb-help-item:hover { background: #eef4f9; }
.kb-help-item.active { background: #e4f0f6; font-weight: 700; color: #172b4d; }
#kanban-app-root .kb-help-item,
.kb-modal-overlay .kb-help-item {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    color: #42526e !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    text-align: left !important;
    padding: 5px 10px !important;
    width: 100% !important;
}
#kanban-app-root .kb-help-item.active,
.kb-modal-overlay .kb-help-item.active {
    background: #e4f0f6 !important;
    color: #172b4d !important;
    font-weight: 700 !important;
}
.kb-help-new {
    margin-left: 6px;
    padding: 0 5px;
    font-size: 10px;
    font-weight: 400;
    border-radius: 8px;
    background: #e6f2ea;
    color: #216e4e;
}

.kb-help-article {
    flex: 1 1 auto;
    padding: 12px 16px;
    overflow-y: auto;
    font-size: 13px;
    line-height: 1.5;
    color: #42526e;
}
.kb-help-title { margin: 0 0 2px; font-size: 16px; color: #172b4d; color: var(--kb-text); }
.kb-help-since {
    margin-bottom: 10px;
    font-size: 11px;
    color: #7a8699;
    color: var(--kb-text-light);
}
.kb-help-article p { margin: 0 0 8px; }
.kb-help-h2 { margin: 14px 0 6px; font-size: 14px; color: #172b4d; color: var(--kb-text); }
.kb-help-h3 { margin: 10px 0 4px; font-size: 13px; color: #172b4d; color: var(--kb-text); }
.kb-help-list { margin: 0 0 8px; padding-left: 20px; }
.kb-help-list li { margin: 3px 0; }
.kb-help-note {
    margin: 8px 0;
    padding: 8px 10px;
    background: #f7f9fb;
    border-left: 3px solid #0079bf;
    border-left-color: #0079bf;
    border-left-color: var(--kb-primary);
    border-radius: 0 4px 4px 0;
    font-size: 12px;
}
.kb-help-article code {
    padding: 0 4px;
    background: #f4f5f7;
    border-radius: 3px;
    font-size: 12px;
}
.kb-help-link { color: #0079bf; color: var(--kb-primary); text-decoration: underline; cursor: pointer; }
.kb-help-empty {
    padding: 16px;
    font-size: 13px;
    color: #7a8699;
    color: var(--kb-text-light);
}

/* Кнопка действия внутри статьи: справка не рассказывает, а открывает */
.kb-help-do {
    display: inline-block;
    margin: 4px 0;
    padding: 3px 12px;
    font-size: 12px;
    border: 1px solid #0079bf;
    border-color: #0079bf;
    border-color: var(--kb-primary);
    border-radius: 12px;
    background: #fff;
    color: #0079bf;
    color: var(--kb-primary);
    cursor: pointer;
}
.kb-help-do:hover { background: #e4f0f6; }
#kanban-app-root .kb-help-do,
.kb-modal-overlay .kb-help-do {
    background: #fff !important;
    color: #0079bf !important;
    border: 1px solid #0079bf !important;
    box-shadow: none !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    padding: 3px 12px !important;
}

/* Значок «?» рядом с заголовком окна */
.kb-help-spot {
    margin-left: 8px;
    width: 18px;
    height: 18px;
    padding: 0;
    font-size: 12px;
    line-height: 16px;
    text-align: center;
    border: 1px solid #c1c7d0;
    border-radius: 9px;
    background: #fff;
    color: #5e6c84;
    cursor: help;
    vertical-align: middle;
}
.kb-help-spot:hover { border-color: #0079bf; color: #0079bf; }
#kanban-app-root .kb-help-spot,
.kb-modal-overlay .kb-help-spot {
    background: #fff !important;
    color: #5e6c84 !important;
    border: 1px solid #c1c7d0 !important;
    box-shadow: none !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    padding: 0 !important;
    width: 18px !important;
    margin: 0 0 0 8px !important;
}

@media (max-width: 900px) {
    .kb-help-wrap { display: block; max-height: none; }
    .kb-help-side { border-right: none; border-bottom: 1px solid #ebecf0; }
    .kb-help-list { max-height: 180px; }
}

/* ============================================================
   Демонстрационная доска (v2.0)
   ============================================================ */

.kb-demo-banner {
    display: flex;
    align-items: baseline;
    margin-bottom: 12px;
    padding: 10px 14px;
    background: #fff8e6;
    border: 1px solid #f5dfa0;
    border-left: 4px solid #d9a406;
    border-radius: 6px;
    font-size: 13px;
    line-height: 1.45;
    color: #5a4200;
}
.kb-demo-mark {
    flex: 0 0 auto;
    margin-right: 10px;
    padding: 1px 8px;
    border-radius: 10px;
    background: #d9a406;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .03em;
}
.kb-demo-text { flex: 1 1 auto; }
.kb-legacy .kb-demo-banner > * + * { margin-left: 10px; }

/* Заявка на доступ из демонстрации */
.kb-demo-banner .kb-demo-ask {
    flex: 0 0 auto;
    margin-left: 12px;
    align-self: center;
    white-space: nowrap;
}
#kanban-app-root .kb-demo-banner .kb-demo-ask {
    background: #d9a406 !important;
    color: #fff !important;
    border: none !important;
    box-shadow: none !important;
    font-size: 13px !important;
    padding: 5px 12px !important;
    margin: 0 0 0 12px !important;
}
#kanban-app-root .kb-demo-banner .kb-demo-ask:hover { background: #b98a04 !important; }
.kb-demo-modal-text { font-size: 13px; line-height: 1.5; color: #42526e; margin: 0 0 10px; }
.kb-demo-modal-why {
    margin: 0 0 12px;
    padding: 8px 10px;
    background: #f7f9fb;
    border-left: 3px solid #c1c7d0;
    border-radius: 0 4px 4px 0;
    font-size: 12px;
    color: #5e6c84;
}
/* Кнопка «Обучение»: тем же весом, что и заявка, но спокойнее по цвету */
#kanban-app-root .kb-demo-banner .kb-demo-tour {
    background: #fff !important;
    color: #7a5c00 !important;
    border: 1px solid #d9a406 !important;
    box-shadow: none !important;
    font-size: 13px !important;
    padding: 5px 12px !important;
    margin: 0 0 0 12px !important;
    flex: 0 0 auto;
    align-self: center;
    white-space: nowrap;
}
#kanban-app-root .kb-demo-banner .kb-demo-tour:hover { background: #fff6da !important; }

@media (max-width: 700px) {
    .kb-demo-banner { display: block; }
    .kb-demo-banner .kb-demo-ask,
    #kanban-app-root .kb-demo-banner .kb-demo-ask,
    #kanban-app-root .kb-demo-banner .kb-demo-tour { margin: 8px 8px 0 0 !important; }
}

/* ---------------- Ожидание документа ----------------
   Отчет и письмо собираются на сервере несколько секунд. Пустой экран
   в это время читается как «система не отвечает», поэтому показываем
   полосу, время и то, что именно делается. */
.kb-doc-overlay {
    position: fixed;
    left: 0; top: 0; right: 0; bottom: 0;
    background: rgba(9, 30, 66, .45);
    z-index: 100002;
    text-align: center;
}
.kb-doc-box {
    display: inline-block;
    margin-top: 18vh;
    min-width: 300px;
    max-width: 92%;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 10px 32px rgba(9, 30, 66, .35);
    padding: 18px 22px 16px;
    text-align: left;
}
.kb-doc-title { font-size: 15px; font-weight: 600; color: #172b4d; margin-bottom: 10px; }
.kb-doc-bar {
    height: 6px;
    background: #ebecf0;
    border-radius: 3px;
    overflow: hidden;
}
.kb-doc-bar-fill {
    height: 100%;
    width: 0;
    background: #0079bf;
    border-radius: 3px;
}
/* Пока сервер не сказал, сколько всего будет, полоса просто ходит:
   она показывает, что работа идет, а не сколько осталось */
.kb-doc-indeterminate {
    width: 35%;
    animation: kb-doc-run 1.1s ease-in-out infinite;
}
@keyframes kb-doc-run {
    0%   { margin-left: -35%; }
    100% { margin-left: 100%; }
}
.kb-doc-stage { font-size: 13px; color: #42526e; margin-top: 10px; }
.kb-doc-meta {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: #7a869a;
    margin-top: 4px;
}
.kb-legacy-ua .kb-doc-meta { display: block; }
.kb-legacy-ua .kb-doc-meta > * + * { margin-left: 10px; }
.kb-doc-cancel {
    margin-top: 12px;
    border: 1px solid #c1c7d0;
    background: #fff;
    color: #42526e;
    font: inherit;
    font-size: 12px;
    padding: 4px 12px;
    border-radius: 4px;
    cursor: pointer;
}
.kb-doc-cancel:hover { background: #f4f5f7; }

/* ---------------- Обучение гостя ----------------
   Подсветка не перехватывает нажатия (pointer-events: none): человеку
   предлагают попробовать прямо сейчас, а не «сначала закройте подсказку».
   Затемнение вокруг цели сделано тенью самой рамки — так вырез всегда
   совпадает с элементом, чем бы страницу ни прокрутили. */
.kb-tour-spot {
    position: fixed;
    z-index: 100000;
    border-radius: 8px;
    border: 2px solid #ffd54a;
    box-shadow: 0 0 0 9999px rgba(9, 30, 66, .55), 0 0 0 4px rgba(255, 213, 74, .35);
    pointer-events: none;
    transition: left .18s ease, top .18s ease, width .18s ease, height .18s ease;
}
.kb-tour-tip {
    position: fixed;
    z-index: 100001;
    width: 340px;
    max-width: calc(100vw - 20px);
    /* На низком экране длинная подсказка уезжала за край вместе с кнопками */
    max-height: calc(100vh - 20px);
    overflow: auto;
    box-sizing: border-box;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 10px 32px rgba(9, 30, 66, .35);
    padding: 14px 16px 12px;
    font-size: 13px;
    line-height: 1.5;
    color: #172b4d;
}
/* Шаги без цели (приветствие) — посреди экрана, вместе с затемнением */
.kb-tour-tip.kb-tour-center {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 420px;
    box-shadow: 0 10px 32px rgba(9, 30, 66, .35), 0 0 0 9999px rgba(9, 30, 66, .55);
}
.kb-tour-head { display: flex; align-items: center; justify-content: space-between; }
.kb-tour-num {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: #7a869a;
}
.kb-tour-close {
    background: none;
    border: none;
    font-size: 18px;
    line-height: 1;
    color: #7a869a;
    cursor: pointer;
    padding: 0 2px;
}
.kb-tour-close:hover { color: #172b4d; }
.kb-tour-title { font-size: 15px; font-weight: 600; margin: 4px 0 6px; }
.kb-tour-pain { color: #42526e; margin: 0 0 8px; }
.kb-tour-act {
    background: #fff8e1;
    border-left: 3px solid #ffc400;
    border-radius: 0 4px 4px 0;
    padding: 7px 10px;
    color: #5e4b00;
    margin: 0 0 12px;
}
.kb-tour-actions { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
/* Подсказка обучения висит вне доски — прямо в теле страницы, поэтому
   оформление кнопок доски до нее не доставало: «Далее» рисовалась белым
   по белому и выглядела как пропавшая. Задаем вид кнопок здесь целиком */
.kb-tour-tip .kb-btn {
    display: inline-block;
    cursor: pointer;
    font: inherit;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    padding: 7px 14px !important;
    border: none !important;
    border-radius: 4px !important;
    background: #0079bf !important;
    color: #fff !important;
    text-shadow: none !important;
    box-shadow: none !important;
    text-decoration: none !important;
    min-height: 0 !important;
    width: auto !important;
    margin: 0 !important;
}
.kb-tour-tip .kb-btn:hover { background: #026aa7 !important; }
.kb-tour-tip .kb-btn.kb-btn-secondary { background: #6b778c !important; }
.kb-tour-tip .kb-btn.kb-btn-secondary:hover { background: #4d5768 !important; }
.kb-legacy .kb-tour-actions > * + * { margin-left: 8px; }
/* Подсказки обучения и окна рисуются вне корня доски, поэтому запасные
   отступы вешаются на класс всей страницы: свойства gap старые браузеры
   во флексбоксе не применяют, и кнопки слипались */
.kb-legacy-ua .kb-tour-actions > * + * { margin-left: 8px; }
.kb-legacy-ua .kb-modal-actions > * + * { margin-left: 8px; }
@media (max-width: 700px) {
    .kb-tour-tip, .kb-tour-tip.kb-tour-center { width: calc(100vw - 20px); }
}

/* ---------- Подготовка письма по шагам ---------- */
.kb-lt-steps {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 14px;
}
.kb-lt-step {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 180px;
    padding: 7px 10px;
    border: 1px solid #dfe1e6;
    border-radius: 8px;
    background: #fff;
    color: #42526e;
    font: inherit;
    font-size: 13px;
    text-align: left;
    cursor: pointer;
}
.kb-lt-step small { display: block; font-size: 11px; color: #7a869a; font-weight: 400; }
.kb-lt-step-n {
    flex: 0 0 22px;
    height: 22px;
    line-height: 22px;
    border-radius: 50%;
    background: #ebecf0;
    color: #42526e;
    text-align: center;
    font-weight: 700;
    font-size: 12px;
}
.kb-lt-step.active { border-color: #0079bf; box-shadow: 0 0 0 1px #0079bf inset; color: #172b4d; }
.kb-lt-step.active .kb-lt-step-n { background: #0079bf; color: #fff; }
.kb-lt-step.done .kb-lt-step-n { background: #61bd4f; color: #fff; }
.kb-lt-actions { display: flex; align-items: center; gap: 8px; }
.kb-lt-spacer { flex: 1 1 auto; }
.kb-lt-addr-to { display: block; }
.kb-lt-addr-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.kb-lt-to-label {
    display: block;
    margin-top: 6px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: #5e6c84;
}
.kb-lt-to {
    width: 100%;
    min-height: 48px;
    margin-top: 3px;
    box-sizing: border-box;
    font: inherit;
    font-size: 13px;
    resize: vertical;
}
.kb-lt-to-warn {
    margin-top: 4px;
    padding: 4px 8px;
    border-left: 3px solid #ffab00;
    background: #fffae6;
    color: #7a5b00;
    font-size: 12px;
}
/* Заголовок в форме — той же ширины, что и в письме: 7 см ≈ 265 px */
.kb-lt-subject { max-width: 300px; width: 100%; font-style: italic; box-sizing: border-box; }
.kb-legacy-ua .kb-lt-steps > * + *,
.kb-legacy-ua .kb-lt-actions > * + *,
.kb-legacy-ua .kb-lt-step > * + * { margin-left: 8px; }

/* Подсказка под обращением: у адресата нет имени и отчества в справочнике */
.kb-lt-to-warn-inline:empty { display: none; }
.kb-lt-to-warn-inline {
    margin-top: 4px;
    padding: 4px 8px;
    border-left: 3px solid #ffab00;
    background: #fffae6;
    color: #7a5b00;
    font-size: 12px;
}
.kb-legacy-ua #kb-lt-exec-box > div > * + * { margin-left: 8px; }

/* Приложение к письму: «Нет / Да, на N л.» */
.kb-lt-attach-row { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; }
.kb-lt-radio {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    text-transform: none;
    font-weight: 400;
    font-size: 13px;
    color: #172b4d;
}
.kb-legacy-ua .kb-lt-attach-row > * + *,
.kb-legacy-ua .kb-lt-radio > * + * { margin-left: 8px; }

/* Исполнители письма: один или два, у каждого ФИО и телефоны */
.kb-lt-exec {
    border: 1px solid #dfe1e6;
    border-radius: 6px;
    padding: 8px 10px;
    margin-top: 6px;
    background: #fafbfc;
}
.kb-lt-exec-head { display: flex; justify-content: space-between; align-items: center; font-size: 13px; margin-bottom: 4px; }
.kb-lt-exec-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.kb-lt-exec-row select { flex: 1 1 200px; }
.kb-lt-exec-row input[type="text"] { flex: 1 1 180px; min-width: 150px; }
.kb-legacy-ua .kb-lt-exec-row > * + * { margin-left: 8px; }

/* Письмо: пример в подсказке и настоящее значение.
   Пример серый и курсивом, вписанное или подставленное — черным:
   по форме должно быть видно, что уже заполнено, а что для образца */
.kb-lt-sample-hint { margin-bottom: 10px; }
.kb-lt-pane input::-webkit-input-placeholder,
.kb-lt-pane textarea::-webkit-input-placeholder { color: #97a0af; font-style: italic; }
.kb-lt-pane input::-moz-placeholder,
.kb-lt-pane textarea::-moz-placeholder { color: #97a0af; font-style: italic; opacity: 1; }
.kb-lt-pane input:-ms-input-placeholder,
.kb-lt-pane textarea:-ms-input-placeholder { color: #97a0af; font-style: italic; }
.kb-lt-pane input::placeholder,
.kb-lt-pane textarea::placeholder { color: #97a0af; font-style: italic; }
.kb-lt-pane input.kb-lt-typed,
.kb-lt-pane textarea.kb-lt-typed { color: #000; }

/* Поиск адресата в справочнике */
.kb-lt-addr-search { width: 100%; box-sizing: border-box; }

/* Приложения письма: наименование и число листов */
.kb-lt-attach-item { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.kb-lt-attach-item .kb-lt-attach-name { flex: 1 1 280px; min-width: 200px; }
.kb-lt-attach-num { font-size: 13px; color: #42526e; min-width: 18px; }
.kb-legacy-ua .kb-lt-attach-item > * + * { margin-left: 8px; }

/* Основной отпуск (для материальной помощи): метка в списках и обводка полосы в графике */
.kb-vn-kind { font-size: 11px; padding: 1px 8px; border-radius: 8px; background: #e6f0ff; color: #0747a6; }
.kb-vp-bar.main { box-shadow: inset 0 0 0 2px #0747a6; }
.kb-vn-main-lbl { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; white-space: nowrap; }
.kb-legacy-ua .kb-vn-main-lbl > * + * { margin-left: 4px; }

/* Проекты исходящих писем доски */
.kb-lp-list { display: block; }
.kb-lp-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 10px 12px;
    border: 1px solid #dfe1e6;
    border-radius: 6px;
    margin-bottom: 8px;
    background: #fff;
}
.kb-lp-main { flex: 1 1 auto; min-width: 0; }
.kb-lp-subject { font-size: 14px; font-weight: 600; color: #172b4d; font-style: italic; }
.kb-lp-meta { font-size: 12px; color: #5e6c84; margin-top: 2px; }
.kb-lp-more, .kb-lp-none { color: #7a869a; }
.kb-lp-actions { flex: 0 0 auto; display: inline-flex; gap: 6px; }
.kb-lp-actions .kb-btn { padding: 4px 10px; font-size: 12px; }
.kb-legacy-ua .kb-lp-item > * + *,
.kb-legacy-ua .kb-lp-actions > * + * { margin-left: 8px; }

/* Флажки чек-листа одного размера.
   Флажок стоит в гибкой строке рядом с текстом пункта, и без запрета
   на сжатие браузер ужимал его у длинных пунктов — флажки выходили
   разного размера. Размер фиксируем, от сжатия защищаем и ставим флажок
   вровень с первой строкой текста */
#kanban-app-root input[type=checkbox].kb-cl-chk,
.kb-modal-overlay input[type=checkbox].kb-cl-chk,
#kanban-app-root input[type=checkbox].kb-my-item-chk,
.kb-modal-overlay input[type=checkbox].kb-my-item-chk {
    flex: 0 0 13px !important;
    width: 13px !important;
    height: 13px !important;
    min-width: 13px !important;
    min-height: 13px !important;
    max-width: 13px !important;
    max-height: 13px !important;
    margin: 3px 0 0 0 !important;
    padding: 0 !important;
    align-self: flex-start !important;
}

/* ============================================================
   Проверка знаний: курсы, документы, вопросы (v3.16)
   ============================================================ */

.kb-quiz-intro { font-size: 13px; line-height: 1.5; color: #42526e; margin: 0 0 12px; }
.kb-quiz-loading, .kb-quiz-empty {
    padding: 14px 0;
    font-size: 13px;
    color: #7a8699;
    color: var(--kb-text-light);
}
.kb-quiz-h3 {
    margin: 18px 0 8px;
    font-size: 14px;
    color: #172b4d;
    color: var(--kb-text);
}

/* Список курсов */
.kb-quiz-list { display: block; }
.kb-quiz-course {
    display: block;
    width: 100%;
    margin-bottom: 8px;
    padding: 10px 12px;
    text-align: left;
    background: #fff;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 6px;
    cursor: pointer;
}
.kb-quiz-course:hover { border-color: #0079bf; background: #f7fbfe; }
#kanban-app-root .kb-quiz-course,
.kb-modal-overlay .kb-quiz-course {
    background: #fff !important;
    color: #172b4d !important;
    border: 1px solid #dfe1e6 !important;
    box-shadow: none !important;
    text-align: left !important;
    font-weight: 400 !important;
    padding: 10px 12px !important;
    margin: 0 0 8px !important;
    width: 100% !important;
}
.kb-quiz-course-head { display: flex; align-items: baseline; }
.kb-quiz-course-title { flex: 1 1 auto; font-size: 14px; font-weight: 600; }
.kb-quiz-course-desc,
.kb-quiz-course-meta {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: #5e6c84;
    color: var(--kb-text-light);
    line-height: 1.4;
}
.kb-quiz-chip {
    flex: 0 0 auto;
    margin-left: 10px;
    padding: 1px 8px;
    border-radius: 10px;
    font-size: 11px;
    white-space: nowrap;
}
.kb-quiz-chip.passed { background: #e6f2ea; color: #216e4e; }
.kb-quiz-chip.failed { background: #fdecea; color: #b3261e; }
.kb-quiz-chip.new { background: #f4f5f7; color: #5e6c84; }

/* Документы курса */
.kb-quiz-docs { display: block; }
.kb-quiz-doc {
    display: flex;
    align-items: baseline;
    padding: 7px 10px;
    margin-bottom: 6px;
    border: 1px solid #dfe1e6;
    border-radius: 6px;
    text-decoration: none;
    color: #172b4d;
    color: var(--kb-text);
    font-size: 13px;
}
.kb-quiz-doc:hover { border-color: #0079bf; background: #f7fbfe; }
.kb-quiz-doc-name { flex: 1 1 auto; }
.kb-quiz-doc-size { flex: 0 0 auto; margin-left: 10px; font-size: 11px; color: #7a8699; }

/* Ход теста */
.kb-quiz-progress {
    height: 6px;
    background: #e5e7eb;
    border-radius: 3px;
    margin-bottom: 14px;
    overflow: hidden;
}
.kb-quiz-progress-fill { height: 6px; background: #0079bf; background: var(--kb-primary); }
.kb-quiz-question {
    font-size: 15px;
    font-weight: 600;
    line-height: 1.45;
    color: #172b4d;
    color: var(--kb-text);
    margin: 0 0 6px;
}
.kb-quiz-multi { margin: 0 0 10px; font-size: 12px; color: #97590b; }

/* Варианты ответа.

   Ячейка выбора не должна сжиматься: раньше она стояла в гибкой строке
   без запрета на сжатие, и чем длиннее был текст варианта, тем меньше
   становился кружок — вплоть до полоски. Отсюда flex: 0 0 auto и
   заданные размеры. Выравнивание — по первой строке текста, а не по
   середине блока: у длинного ответа середина уезжает вниз. */
.kb-quiz-options { display: block; }
.kb-quiz-opt {
    display: flex;
    align-items: flex-start;
    margin: 0 0 8px;
    padding: 8px 10px;
    border: 1px solid #dfe1e6;
    border: 1px solid var(--kb-border);
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    line-height: 1.45;
}
.kb-quiz-opt:hover { border-color: #0079bf; background: #f7fbfe; }
.kb-quiz-opt input.kb-quiz-mark {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    min-width: 18px;
    margin: 1px 10px 0 0;
    cursor: pointer;
}
#kanban-app-root .kb-quiz-opt input.kb-quiz-mark,
.kb-modal-overlay .kb-quiz-opt input.kb-quiz-mark {
    width: 18px !important;
    min-width: 18px !important;
    height: 18px !important;
    max-width: 18px !important;
    flex: 0 0 18px !important;
    margin: 1px 10px 0 0 !important;
    padding: 0 !important;
    vertical-align: top !important;
}
.kb-quiz-opt-text { flex: 1 1 auto; }
/* Старый Edge не понимает flex-строку внутри label так же ровно */
.kb-legacy .kb-quiz-opt { display: block; }
.kb-legacy .kb-quiz-opt input.kb-quiz-mark { float: left; margin-top: 2px; }
.kb-legacy .kb-quiz-opt-text { display: block; margin-left: 28px; }

/* Итог */
.kb-quiz-result { font-size: 16px; margin: 0 0 6px; }
.kb-quiz-verdict { font-weight: 600; margin: 0 0 4px; }
.kb-quiz-verdict.passed { color: #216e4e; }
.kb-quiz-verdict.failed { color: #b3261e; }

/* Журнал курса */
.kb-quiz-journal { width: 100%; border-collapse: collapse; font-size: 13px; }
.kb-quiz-journal th,
.kb-quiz-journal td {
    padding: 6px 8px;
    border-bottom: 1px solid #ebecf0;
    text-align: left;
    vertical-align: top;
}
.kb-quiz-journal th { font-size: 11px; text-transform: uppercase; color: #7a8699; }
.kb-quiz-journal tr.failed td { background: #fdf6f5; }
.kb-quiz-ok { color: #216e4e; }
.kb-quiz-no { color: #b3261e; }
.kb-quiz-pos { display: block; font-size: 11px; color: #7a8699; }

/* Ведение курса автором */
.kb-quiz-replace {
    display: inline-block;
    margin: 0 10px;
    font-size: 12px;
    color: #5e6c84;
    color: var(--kb-text-light);
    vertical-align: middle;
}
.kb-quiz-doc-row {
    display: flex;
    align-items: center;
    padding: 6px 0;
    border-bottom: 1px solid #ebecf0;
    font-size: 13px;
}
.kb-quiz-doc-row > span { flex: 1 1 auto; }
#kanban-app-root .kb-quiz-doc-del,
.kb-modal-overlay .kb-quiz-doc-del {
    flex: 0 0 auto;
    font-size: 12px !important;
    padding: 2px 10px !important;
}

/* Очередность пунктов отчета */
.kb-ro-list { max-height: 60vh; overflow-y: auto; margin-bottom: 12px; }
.kb-ro-group { border: 1px solid #dfe1e6; border-radius: 6px; padding: 6px 8px; margin-bottom: 8px; }
.kb-ro-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 3px 0; }
.kb-ro-crow { padding-left: 16px; font-size: 13px; border-top: 1px solid #f0f1f3; }
.kb-ro-title { flex: 1 1 auto; min-width: 0; }
.kb-ro-where { font-size: 11px; color: #5e6c84; white-space: nowrap; }
.kb-ro-arrows { flex: 0 0 auto; display: inline-flex; gap: 4px; }
#kanban-app-root .kb-ro-arrows .kb-btn, .kb-modal-overlay .kb-ro-arrows .kb-btn { padding: 2px 8px; font-size: 12px; }
.kb-legacy-ua .kb-ro-row > * + *, .kb-legacy-ua .kb-ro-arrows > * + * { margin-left: 6px; }

/* Пустой блок кнопок колонки (у наблюдателя кнопок нет) не выводится.
   Старый Edge растягивал пустой гибкий блок до предела движка —
   33 554 432 px, и вместе с ним шапку, колонку и всю доску: названия
   и задачи уходили за пределы видимого. Правило общее, а не только
   для старого браузера: строку браузера в организациях меняют, и
   распознать его удается не всегда */
.kb-col-actions:empty,
.kb-col-actions-empty {
    display: none !important;
}

/* Очередность пунктов: флажки «включить в отчет» и подпункты */
.kb-ro-crow { padding-left: 16px; font-size: 13px; border-top: 1px solid #f0f1f3; }
.kb-ro-crow > .kb-ro-row { padding-left: 0; border-top: 0; }
.kb-ro-irow { display: flex; align-items: center; gap: 6px; padding: 1px 0 1px 26px; font-size: 12px; color: #42526e; cursor: pointer; }
.kb-ro-check { flex: 0 0 auto; margin: 0; }
.kb-ro-off > .kb-ro-row .kb-ro-title,
.kb-ro-off > .kb-ro-title,
.kb-ro-irow.kb-ro-off .kb-ro-title { color: #a5adba; text-decoration: line-through; }
.kb-legacy-ua .kb-ro-irow > * + * { margin-left: 6px; }

/* График работы и сменности: список работников */
.kb-sh-people { max-height: 260px; overflow-y: auto; border: 1px solid #dfe1e6; border-radius: 6px; padding: 6px 10px; }
.kb-sh-person { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 3px 0; border-bottom: 1px solid #f0f1f3; }
.kb-sh-person select { flex: 0 0 auto; max-width: 180px; }
.kb-legacy-ua .kb-sh-person > * + * { margin-left: 8px; }
/* Поля бланка графика сменности — в две колонки */
.kb-sh-form { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 12px; align-items: end; }
/* Подпись поля — обычным шрифтом и в одну строку, поле — во всю ширину */
.kb-modal-overlay .kb-sh-f,
.kb-sh-f { display: flex; flex-direction: column; font-size: 12px; color: #42526e;
    text-transform: none; letter-spacing: 0; font-weight: 400; margin: 0; }
.kb-sh-f > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kb-sh-f input { margin-top: 2px; width: 100%; box-sizing: border-box; height: 32px; }
.kb-sh-sub { grid-column: 1 / -1; font-size: 12px; font-weight: 700; color: #172b4d; margin-top: 6px; }
.kb-sh-sub:empty { margin-top: 0; }
.kb-legacy-ua .kb-sh-sub { margin-top: 8px; }
@media (max-width: 600px) { .kb-sh-form { grid-template-columns: 1fr; } }
.kb-legacy-ua .kb-sh-form { display: block; }
.kb-legacy-ua .kb-sh-f { margin-bottom: 6px; }
/* Табель: план (запись будущим числом) — в зачет нормы не идет */
.kb-jr-status.kb-ts-plan { background: #eae6ff; color: #403294; }

/* ==========================================================================
   Домашняя сборка: доска на всю ширину в новых темах WordPress.
   Блочные темы (Twenty Twenty-Four/Five) ставят содержимому страницы
   margin-left/right: auto !important. Отрицательные поля из правила выше
   при этом гасятся, а left: 50% остается, и доска уезжает на полэкрана
   вправо. Тот же выход из колонки темы, но одними полями и с !important.
   ========================================================================== */
#kanban-app-root {
    left: auto;
    right: auto;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}


/* ==========================================================================
   Домашняя сборка: телефон.
   Одна колонка на экран, по краям видны соседние. Свайп листает ровно
   на одну колонку (scroll-snap-stop: always), карточки прокручиваются
   внутри колонки. Под колонками — точки, внизу — плавающая панель
   (их создает mobileChrome() в kanban.js). Вверху остается только выбор
   доски, фильтры открываются кнопкой на нижней панели. Окна — на весь
   экран. Поля ввода не мельче 16px, иначе iPhone увеличивает страницу
   при каждом касании поля.
   ========================================================================== */
.kb-m-dots,
.kb-m-bar { display: none; }

@media (max-width: 680px) {
    /* Страница доски — только доска: шапка сайта, подвал и заголовок
       страницы темы занимали четверть экрана над колонками. Класс
       kb-board-page ставит сервер (class-kanban-home.php), kb-has-board —
       скрипт доски, на случай другой темы или вставки доски без шорткода */
    body.kb-board-page .wp-block-post-title,
    body.kb-has-board .wp-block-post-title,
    body.kb-board-page header.wp-block-template-part,
    body.kb-board-page footer.wp-block-template-part,
    body.kb-board-page .site-header,
    body.kb-board-page .site-footer,
    body.kb-board-page .entry-header { display: none !important; }
    body.kb-board-page .wp-site-blocks,
    body.kb-board-page main,
    body.kb-board-page main > .wp-block-group,
    body.kb-board-page .entry-content {
        padding-top: 0 !important;
        margin-top: 0 !important;
        padding-bottom: 0 !important;
    }

    #kanban-app-root { padding: 0 0 110px; }

    /* ---- Верхняя строка: только выбор доски ---- */
    .kb-toolbar {
        position: static;
        background: transparent;
        box-shadow: none;
        padding: 4px 16px 0;
        margin: 0 0 4px;
        gap: 0;
    }
    .kb-toolbar > *:not(#kb-board-select):not(.kb-more-wrap):not(.kb-export-menu),
    .kb-toolbar .kb-more-wrap > .kb-btn,
    .kb-toolbar .kb-export-menu > .kb-btn { display: none !important; }
    /* С #kanban-app-root: общее правило строки панели задает высоту
       и шрифт с !important и тем же весом селектора */
    #kanban-app-root .kb-toolbar > #kb-board-select {
        flex: 1 1 100%;
        width: 100%;
        height: 44px !important;
        line-height: 44px !important;
        padding: 0 4px;
        border: 0;
        background: transparent;
        font-size: 22px !important;
        font-weight: 700;
        color: #172b4d;
    }

    /* Меню панели открываются над нижней панелью, во всю ширину */
    .kb-more-menu,
    .kb-export-dropdown {
        position: fixed !important;
        left: 12px !important;
        right: 12px !important;
        top: auto !important;
        bottom: calc(92px + env(safe-area-inset-bottom, 0px)) !important;
        width: auto !important;
        min-width: 0;
        max-width: none;
        max-height: 60vh;
        overflow-y: auto;
        z-index: 1001;
    }

    /* ---- Фильтры и сведения — по кнопке ---- */
    #kanban-app-root:not(.kb-m-filters-open) .kb-filters,
    #kanban-app-root:not(.kb-m-filters-open) .kb-widget-chips,
    #kanban-app-root:not(.kb-m-filters-open) .kb-widget-plain { display: none !important; }
    #kanban-app-root .kb-filters {
        margin: 0 16px 10px;
        flex-wrap: wrap;
        gap: 8px;
    }
    #kanban-app-root .kb-filters > input[type="text"],
    #kanban-app-root .kb-filters > select {
        flex: 1 1 100%;
        width: 100%;
        height: 40px;
        font-size: 16px;
    }
    #kanban-app-root .kb-widget-chips { margin: 0 16px 8px; }

    /* ---- Колонки ---- */
    .kb-board-wrapper {
        /* Точка отсчета для offsetLeft колонок (листание в kanban.js) */
        position: relative;
        gap: 10px;
        padding: 4px 20px 6px;
        scroll-snap-type: x mandatory;
        scroll-padding: 0 20px;
        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .kb-board-wrapper::-webkit-scrollbar { display: none; }

    /* !important: ширину колонок доска пишет во встроенный стиль */
    .kb-column,
    .kb-column.kb-add-column {
        flex: 0 0 calc(100vw - 40px) !important;
        width: calc(100vw - 40px) !important;
        max-width: none !important;
        scroll-snap-align: center;
        scroll-snap-stop: always;
        border-radius: 14px;
        max-height: calc(100vh - 200px);
        max-height: calc(100dvh - 200px) !important;
        box-shadow: 0 1px 3px rgba(9, 30, 66, .18);
    }
    .kb-column-cards {
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-y: contain;
        padding: 2px 10px 4px;
    }
    .kb-col-bar,
    .kb-col-resizer { display: none !important; }
    .kb-column-header { padding: 14px 14px 10px; }
    .kb-col-nameline {
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 18px;
    }
    .kb-column-count { font-size: 15px; }

    /* ---- Карточки ---- */
    .kb-card {
        padding: 12px 14px;
        margin-bottom: 10px;
        border-radius: 10px;
        box-shadow: 0 1px 2px rgba(9, 30, 66, .22);
    }
    .kb-card-title { font-size: 16px; line-height: 1.35; }
    .kb-add-card-btn {
        padding: 12px 14px !important;
        font-size: 16px !important;
        text-align: left;
    }

    /* ---- Точки под колонками ---- */
    /* Точки закреплены над нижней панелью: под колонками они уезжали
       бы за экран вслед за самой длинной колонкой */
    .kb-m-dots {
        display: flex;
        justify-content: center;
        gap: 8px;
        position: fixed;
        left: 0;
        right: 0;
        bottom: calc(80px + env(safe-area-inset-bottom, 0px));
        z-index: 1000;
        pointer-events: none;
    }
    #kanban-app-root .kb-m-dot { pointer-events: auto; }
    /* Размеры с !important: общие правила кнопок доски сбрасывали
       высоту точки в ноль */
    #kanban-app-root .kb-m-dot {
        flex: 0 0 8px;
        width: 8px !important;
        height: 8px !important;
        min-width: 8px !important;
        min-height: 8px !important;
        padding: 0;
        margin: 0;
        border: 0;
        border-radius: 50%;
        background: #c1c7d0;
        box-shadow: none;
    }
    #kanban-app-root .kb-m-dot.active { background: #172b4d; }

    /* ---- Плавающая панель внизу ---- */
    .kb-m-bar {
        display: flex;
        gap: 4px;
        position: fixed;
        left: 50%;
        bottom: calc(14px + env(safe-area-inset-bottom, 0px));
        transform: translateX(-50%);
        padding: 6px 10px;
        border-radius: 30px;
        background: rgba(255, 255, 255, .88);
        -webkit-backdrop-filter: blur(12px);
        backdrop-filter: blur(12px);
        box-shadow: 0 4px 18px rgba(9, 30, 66, .22);
        z-index: 1000;
    }
    #kanban-app-root .kb-m-btn {
        position: relative;
        width: 48px !important;
        height: 48px !important;
        min-width: 48px !important;
        min-height: 48px !important;
        padding: 0;
        margin: 0;
        border: 0;
        border-radius: 50%;
        background: transparent;
        box-shadow: none;
        color: #172b4d;
        font-size: 22px;
        line-height: 48px;
        text-align: center;
    }
    #kanban-app-root .kb-m-btn.active { background: #e9f2ff; }
    .kb-m-count {
        position: absolute;
        top: 4px;
        right: 4px;
        min-width: 18px;
        height: 18px;
        padding: 0 4px;
        border-radius: 9px;
        background: #eb5a46;
        color: #fff;
        font-size: 11px;
        line-height: 18px;
        font-weight: 700;
    }

    /* ---- Окна ---- */
    .kb-modal-overlay { padding: 0; }
    .kb-modal,
    .kb-modal-wide {
        max-width: 100%;
        min-height: 100%;
        border-radius: 0;
        padding: 16px 14px 28px;
    }
    .kb-modal-close {
        width: 44px;
        height: 44px;
        top: 6px;
        right: 6px;
    }
    .kb-modal-overlay input:not([type="checkbox"]):not([type="radio"]),
    .kb-modal-overlay select,
    .kb-modal-overlay textarea { font-size: 16px; }
}

/* ==========================================================================
   Домашняя сборка: доска домашних заданий (kanban.js, «Доска домашних
   заданий»). Принятое задание — бледное, с галочкой, внизу колонки.
   ========================================================================== */
.kb-card.kb-hw-approved {
    opacity: .55;
    background: #f4f5f7;
}
.kb-card.kb-hw-approved .kb-card-title {
    text-decoration: line-through;
    text-decoration-color: rgba(23, 43, 77, .35);
}
.kb-card.kb-hw-rework { border-left-color: #f5a623; }

.kb-hw-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
}
.kb-hw-btns { display: inline-flex; gap: 6px; }
.kb-hw-given-mark { font-size: 12px; color: #5e6c84; }
.kb-hw-row-dates {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    margin-top: 6px;
    font-size: 13px;
    color: #5e6c84;
}
.kb-hw-row-dates label { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-weight: 400; text-transform: none; }
.kb-hw-cl { width: 100%; margin-top: 6px; font-size: 13px; background: #f7f8f9; }
#kanban-app-root .kb-hw-btn {
    min-height: 32px;
    padding: 4px 14px;
    margin: 0;
    border: 1px solid #dfe1e6;
    border-radius: 16px;
    background: #fff;
    color: #172b4d;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    box-shadow: none;
    cursor: pointer;
}
#kanban-app-root .kb-hw-btn.kb-hw-done,
#kanban-app-root .kb-hw-btn.kb-hw-accept {
    background: #1f845a;
    border-color: #1f845a;
    color: #fff;
}
#kanban-app-root .kb-hw-btn:disabled { opacity: .5; }
.kb-hw-wait { font-size: 13px; color: #5e6c84; }

/* Окно импорта */
.kb-hw-hint { font-size: 14px; color: #5e6c84; margin: 0 0 12px; }
.kb-hw-src { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.kb-hw-file-btn { cursor: pointer; display: inline-flex; align-items: center; }
.kb-hw-text { width: 100%; margin-bottom: 10px; font-size: 14px; }
.kb-hw-progress { min-height: 20px; font-size: 14px; color: #0b4f77; margin-bottom: 8px; }
.kb-hw-row {
    border: 1px solid #dfe1e6;
    border-radius: 10px;
    padding: 10px;
    margin-bottom: 10px;
    background: #fff;
}
.kb-hw-row.kb-hw-row-skip { opacity: .5; }
.kb-hw-row-top,
.kb-hw-row-bottom {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.kb-hw-row-top > select { flex: 1 1 160px; }
.kb-hw-row-bottom { justify-content: space-between; margin-top: 6px; }
.kb-hw-txt { width: 100%; margin-top: 6px; font-size: 14px; }
.kb-hw-st { font-size: 13px; padding: 2px 8px; border-radius: 10px; }
.kb-hw-st-new { background: #dcfff1; color: #216e4e; }
.kb-hw-st-sim { background: #fff7d6; color: #7f5f01; }
.kb-hw-st-dup { background: #ffeceb; color: #ae2e24; }
.kb-hw-foot {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
    position: sticky;
    bottom: 0;
    padding: 10px 0 0;
    background: #fff;
}
.kb-hw-sched {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 10px;
}
.kb-hw-sched-day { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 600; margin: 0; }
.kb-hw-sched-day textarea { width: 100%; font-size: 14px; font-weight: 400; line-height: 1.5; }
@media (max-width: 680px) {
    #kanban-app-root .kb-hw-btn { min-height: 40px; padding: 6px 18px; font-size: 15px; }
    .kb-hw-foot > .kb-btn { flex: 1 1 auto; min-height: 44px; }
}

/* Домашняя сборка: плашка про пуш-уведомления (kanban.js, pushBanner) */
.kb-push-banner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
    margin: 0 0 10px;
    padding: 10px 14px;
    border-radius: 10px;
    background: #e9f2ff;
    color: #0b4f77;
    font-size: 14px;
    line-height: 1.4;
}
.kb-push-banner > span { flex: 1 1 220px; }
@media (max-width: 680px) {
    .kb-push-banner { margin: 4px 12px 10px; }
}

/* Домашняя сборка: окно «На проверке» и пометка «делает» (kanban.js, openHwReview) */
.kb-hw-doing-mark { font-size: 12px; color: #0b4f77; font-weight: 600; }
.kb-hw-rv-subj { margin: 16px 0 6px; font-size: 16px; }
.kb-hw-rv { padding: 10px 12px; margin-bottom: 8px; border: 1px solid #dfe1e6; border-radius: 10px; }
.kb-hw-rv-title { font-weight: 600; }
.kb-hw-rv-meta { font-size: 13px; color: #5e6c84; margin-top: 2px; }
.kb-hw-rv-btns { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; margin-top: 8px; }
.kb-hw-rv-why { margin-top: 8px; }
.kb-hw-rv-why textarea { width: 100%; margin-bottom: 6px; font-size: 14px; }

/* ==========================================================================
   Домашняя сборка: окно «Расписание» (kanban.js, openScheduleModal) и его
   настройка (openSchoolSettings). Неделя целиком помещается при 1280px;
   на узком экране — один день с переключением.
   ========================================================================== */
.kb-modal.kb-sch-modal { max-width: 1200px; }
.kb-sch-top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-bottom: 12px; }
.kb-sch-top h2 { margin: 0; }
.kb-sch-nav { display: flex; flex-wrap: wrap; gap: 6px; }
.kb-sch-label { font-weight: 600; color: #5e6c84; }
.kb-sch-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.kb-sch-dhead { padding: 6px 8px; border-radius: 8px; background: #f4f5f7; font-weight: 700; font-size: 14px; }
.kb-sch-dhead small { display: block; font-weight: 400; color: #5e6c84; }
.kb-sch-dhead.today, .kb-sch-cell.today .kb-sch-lesson { background: #e9f2ff; }
.kb-sch-cell { min-width: 0; }
.kb-sch-offcell {
    display: flex; flex-direction: column; justify-content: center; align-items: center;
    border-radius: 8px; background: #f7f8f9; color: #5e6c84; font-weight: 600; text-align: center; padding: 10px;
}
.kb-sch-offcell small { font-weight: 400; }
.kb-sch-lesson { height: 100%; padding: 6px 8px; border: 1px solid #dfe1e6; border-radius: 8px; background: #fff; }
.kb-sch-empty { height: 100%; min-height: 34px; border: 1px dashed #ebecf0; border-radius: 8px; }
.kb-sch-lhead { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.kb-sch-no { font-weight: 700; color: #5e6c84; min-width: 14px; }
.kb-sch-subj {
    padding: 1px 8px; border-radius: 10px; background: var(--kb-sch-c, #6b778c); color: #fff;
    font-size: 12px; font-weight: 700; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.kb-sch-room, .kb-sch-note { font-size: 11px; color: #5e6c84; }
.kb-sch-cancelled .kb-sch-subj { text-decoration: line-through; opacity: .5; }
.kb-sch-override { border-color: #f5cd47; }
#kanban-app-root .kb-sch-add, .kb-modal .kb-sch-add {
    margin-left: auto; width: 24px; height: 24px; min-width: 0; min-height: 0; padding: 0;
    border: 1px solid #dfe1e6; border-radius: 50%; background: #fff; color: #0079bf; font-weight: 700; line-height: 22px; cursor: pointer;
}
.kb-modal .kb-sch-hw, #kanban-app-root .kb-sch-inline .kb-sch-hw {
    display: block; width: 100%; margin: 4px 0 0; padding: 3px 6px; border: 0; border-radius: 6px;
    background: #f4f5f7; color: #172b4d; font-size: 12px; line-height: 1.3; text-align: left; cursor: pointer;
    overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.kb-modal .kb-sch-hw.kb-sch-late, #kanban-app-root .kb-sch-inline .kb-sch-hw.kb-sch-late { background: #ffeceb; color: #ae2e24; }
.kb-modal .kb-sch-hw.kb-sch-st-checked, #kanban-app-root .kb-sch-inline .kb-sch-hw.kb-sch-st-checked { opacity: .55; }
.kb-modal .kb-sch-hw.kb-sch-st-done, #kanban-app-root .kb-sch-inline .kb-sch-hw.kb-sch-st-done { background: #fff7d6; }
.kb-modal .kb-sch-hw.kb-sch-st-rework, #kanban-app-root .kb-sch-inline .kb-sch-hw.kb-sch-st-rework { background: #fff4e5; }
.kb-sch-hw-st { font-weight: 700; }
.kb-sch-h { margin: 18px 0 8px; font-size: 16px; }
.kb-sch-unbound { display: flex; flex-direction: column; gap: 6px; }
.kb-sch-ub { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.kb-sch-ub .kb-sch-hw { width: auto; flex: 1 1 200px; margin: 0; }
.kb-sch-ub small { color: #5e6c84; }
.kb-sch-daytabs { display: flex; gap: 4px; margin-bottom: 10px; }
.kb-modal .kb-sch-daytab, #kanban-app-root .kb-sch-inline .kb-sch-daytab {
    flex: 1 1 0; padding: 6px 0; border: 1px solid #dfe1e6; border-radius: 8px; background: #fff;
    font-weight: 700; font-size: 14px; color: #172b4d; cursor: pointer;
}
.kb-sch-daytab small { display: block; font-weight: 400; color: #5e6c84; }
.kb-modal .kb-sch-daytab.active, #kanban-app-root .kb-sch-inline .kb-sch-daytab.active { background: #0079bf; border-color: #0079bf; color: #fff; }
.kb-modal .kb-sch-daytab.active small, #kanban-app-root .kb-sch-inline .kb-sch-daytab.active small { color: #e9f2ff; }
.kb-sch-daytab.today:not(.active) { border-color: #0079bf; }
.kb-sch-day { display: flex; flex-direction: column; gap: 6px; }
.kb-sch-off { padding: 14px; border-radius: 8px; background: #f7f8f9; color: #5e6c84; text-align: center; }

.kb-ss-versions, .kb-ss-dates { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin-bottom: 10px; }
.kb-ss-dates label { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-weight: 600; }
.kb-ss-grid { width: 100%; border-collapse: collapse; margin-bottom: 10px; }
.kb-ss-grid th, .kb-ss-grid td { padding: 3px; border: 1px solid #ebecf0; vertical-align: top; }
.kb-ss-grid th { background: #f4f5f7; font-size: 13px; }
.kb-ss-grid select { width: 100%; font-size: 13px; }
.kb-ss-grid input { width: 100%; margin-top: 2px; font-size: 12px; }
.kb-ss-list > div { padding: 3px 0; }
.kb-ss-form { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 4px; }
@media (max-width: 680px) {
    .kb-ss-grid select, .kb-ss-grid input { font-size: 16px; }
}

/* Домашняя сборка: на доске заданий вместо колонок — расписание недели */
#kanban-app-root.kb-hw-schedule-mode .kb-board-wrapper,
#kanban-app-root.kb-hw-schedule-mode .kb-m-dots { display: none !important; }
.kb-sch-inline { background: #fff; border: 1px solid #dfe1e6; border-radius: 10px; padding: 12px 14px; margin: 10px 0 16px; }
.kb-sch-inline .kb-sch-top { margin-top: 0; }
@media (max-width: 680px) {
    .kb-sch-inline { border: 0; border-radius: 0; padding: 8px 12px 90px; margin: 0; }
}
/* Фильтры и сортировка относятся к колонкам — в расписании они не работают */
#kanban-app-root.kb-hw-schedule-mode .kb-filters,
#kanban-app-root.kb-hw-schedule-mode .kb-widget-plain:has(.kb-filters) { display: none !important; }

/* Домашняя сборка (владелец): предмет — одинаковая спокойная плашка во всю
   ширину урока вместо цветных меток разного размера. Цвет предмета остался
   тонкой полосой слева: по нему глаз всё ещё находит предмет */
.kb-sch-lesson { padding: 0; overflow: hidden; }
.kb-sch-lhead {
    flex-wrap: nowrap; gap: 6px; padding: 5px 6px 5px 8px; margin: 0;
    background: #f4f5f7; border-bottom: 1px solid #ebecf0; box-shadow: inset 3px 0 0 var(--kb-sch-c, #6b778c);
}
.kb-sch-cell.today .kb-sch-lesson .kb-sch-lhead { background: #dcebfe; }
.kb-sch-lhead .kb-sch-subj, .kb-sch-ub .kb-sch-subj {
    flex: 1 1 auto; min-width: 0; padding: 0; border-radius: 0; background: none; color: #172b4d;
    font-size: 13px; font-weight: 600;
}
.kb-sch-ub .kb-sch-subj { flex: 0 0 auto; padding-left: 8px; box-shadow: inset 3px 0 0 var(--kb-sch-c, #6b778c); }
.kb-sch-lesson > .kb-sch-hw { width: calc(100% - 12px) !important; margin: 4px 6px 0 !important; }
.kb-sch-lesson > .kb-sch-hw:last-child { margin-bottom: 6px !important; }
.kb-sch-lesson .kb-sch-room, .kb-sch-lesson .kb-sch-note { flex: 0 0 auto; }
#kanban-app-root .kb-sch-add, .kb-modal .kb-sch-add { margin-left: 0; flex: 0 0 auto; }

/* Домашняя сборка (владелец): и на компьютере страница доски — только доска.
   Шапка сайта, заголовок страницы «Учёба» и подвал темы занимали четверть
   экрана. Раньше это было только для телефона (≤680px) */
body.kb-board-page .wp-block-post-title,
body.kb-has-board .wp-block-post-title,
body.kb-board-page header.wp-block-template-part,
body.kb-board-page footer.wp-block-template-part,
body.kb-board-page .site-header,
body.kb-board-page .site-footer,
body.kb-board-page .entry-header { display: none !important; }
body.kb-board-page .wp-site-blocks,
body.kb-board-page main,
body.kb-board-page main > .wp-block-group,
body.kb-board-page .entry-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
    padding-bottom: 0 !important;
}
body.kb-board-page .wp-site-blocks { padding-top: 8px !important; }

/* Домашняя сборка (владелец): окно задания на доске заданий без рабочего:
   отметка о выполнении (сдаёт сын, принимает родитель в «На проверке»),
   вкладки комментариев, связей и результата, основание, исполнители,
   подписка, еженедельный отчет. «Постановка» — только если в ней есть текст
   (туда уходит длинное задание со скриншота), и без канцелярской подсказки */
.kb-hw-cardmodal #kb-complete-btn,
.kb-hw-cardmodal .kb-modal-actions:has(> #kb-complete-btn:only-child),
.kb-hw-cardmodal .kb-tab[data-ctab="comments"],
.kb-hw-cardmodal .kb-tab[data-ctab="links"],
.kb-hw-cardmodal .kb-tab[data-ctab="files"],
.kb-hw-cardmodal .kb-field-desc.kb-f-empty,
.kb-hw-cardmodal .kb-field-desc .kb-desc-hint,
.kb-hw-cardmodal .kb-f-source,
.kb-hw-cardmodal .kb-f-assignees,
.kb-hw-cardmodal .kb-f-watch,
.kb-hw-cardmodal .kb-f-report,
.kb-hw-cardmodal .kb-f-folder,
.kb-hw-cardmodal #kb-due-requests,
/* Тут только домашнее задание: без рода задачи (поручение, согласование…),
   шаблонов, SMART, выбора доски и способа доставки */
.kb-hw-cardmodal .kb-kind-badge,
.kb-hw-cardmodal .kb-f-kind,
.kb-hw-cardmodal .kb-f-tpl,
.kb-hw-cardmodal #kb-nc-assign-board,
.kb-hw-cardmodal #kb-nc-deliver,
.kb-hw-newcard .kb-step-head { display: none !important; }
.kb-hw-cardmodal .kb-field-desc .kb-desc-label { font-size: 0; }
.kb-hw-cardmodal .kb-field-desc .kb-desc-label::after { content: "Подробнее"; font-size: 12px; }
/* Перетаскивание задания на другой урок */
.kb-sch-hw[draggable="true"] { cursor: grab; }
.kb-sch-hw.kb-sch-dragging { opacity: .4; }
.kb-sch-lesson.kb-sch-drop-over { outline: 2px dashed #0079bf; outline-offset: -2px; background: #e9f2ff; }

/* Вход истёк: заметная, но спокойная полоса внизу с ссылкой «Войти заново» */
.kb-session-lost {
    position: fixed; left: 12px; right: 12px; bottom: 90px; z-index: 100001;
    padding: 12px 16px; border-radius: 10px; background: #172b4d; color: #fff;
    font-size: 15px; text-align: center; box-shadow: 0 4px 16px rgba(9, 30, 66, .3);
}
.kb-session-lost a { color: #85b8ff; font-weight: 700; margin-left: 6px; }

/* Домашняя сборка, ТЗ п. 10.1: семейная справка и подпись роли */
.kb-fam-help details { border-bottom: 1px solid #ebecf0; padding: 8px 0; }
.kb-fam-help summary { cursor: pointer; font-weight: 600; font-size: 15px; min-height: 32px; display: flex; align-items: center; gap: 6px; }
.kb-fam-help p { margin: 6px 0 4px; color: #44546f; line-height: 1.5; }
.kb-role-can { display: inline-block; margin-left: 6px; font-size: 12px; color: #5e6c84; }

/* Домашняя сборка, ТЗ п. 10.6.2: в календаре название задания не обрезается
   на первом слове — до трёх строк с переносом */
.kb-cal-card {
    white-space: normal !important;
    text-overflow: clip !important;
    overflow-wrap: anywhere;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.3;
}
.kb-arch-btns { display: inline-flex; gap: 6px; flex-wrap: wrap; }

/* Домашняя сборка, ТЗ п. 10.6.4: меню «⋯ Ещё» — лёгкие строки с иконками,
   а не сплошные синие кнопки (общее правило #kanban-app-root .kb-btn сильнее) */
#kanban-app-root .kb-more-menu .kb-btn,
#kanban-app-root .kb-more-menu .kb-btn.kb-btn-secondary {
    background: transparent !important;
    color: #172b4d !important;
    border: 0 !important;
    box-shadow: none !important;
    text-align: left;
    font-weight: 500;
    border-radius: 6px;
    min-height: 36px;
}
#kanban-app-root .kb-more-menu .kb-btn:hover,
#kanban-app-root .kb-more-menu .kb-btn:focus-visible { background: #e9f2ff !important; }
@media (max-width: 767px) {
    #kanban-app-root .kb-more-menu .kb-btn { min-height: 44px; }
}