/* fixes-v300.css — правки по списку замечаний от 31.08.2026.
   Слой подключается последним, поэтому здесь можно переопределять всё,
   что задано в styles.css / ui-v1.css / home-*.css без !important. */

/* ─── 1. Нижняя панель на телефоне ────────────────────────────────────────
   Панель уезжала на середину экрана. Первый заход (v300) снял backdrop-filter
   и заменил overflow-x:hidden на clip — стало заметно лучше, но случай 02.09
   показал, что осталось два повода для того же: собственный слой отрисовки
   (translateZ) и transform для скрытия под клавиатурой. iOS привязывает такой
   слой к «сжатому» вьюпорту и после клавиатуры не пересчитывает его. Поэтому
   здесь у панели нет ни одного transform, а прячется она через display.
   Остаток лечится в JS: syncBottomNavOffset()/repaintBottomNav(). */
@supports (overflow-x: clip) {
  html, body { overflow-x: clip; }
}

@media (max-width: 720px) {
  .bottom-nav {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background: #fff;
    height: calc(66px + env(safe-area-inset-bottom));
    padding-bottom: env(safe-area-inset-bottom);
    box-shadow: 0 -6px 18px rgba(20, 40, 70, .08);
  }
  [data-theme=dark] .bottom-nav { background: #101c2d; }
  body { padding-bottom: calc(66px + env(safe-area-inset-bottom)); }
  /* С открытой клавиатурой панель наезжает на поле ввода — убираем её совсем.
     Именно display, а не transform: transform оставляет панели отдельный слой,
     который iOS потом рисует по дну сжатого вьюпорта. */
  body.keyboard-open .bottom-nav { display: none; }
}

/* ─── 2. Боковое меню целиком помещается на экран ─────────────────────── */
@media (min-width: 721px) {
  .sidebar { overflow: hidden; }
  .sidebar nav {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    padding-right: 2px;
  }
  .sidebar nav::-webkit-scrollbar { width: 6px; }
  .sidebar nav::-webkit-scrollbar-thumb { background: var(--nav-edge, rgba(255,255,255,.18)); border-radius: 999px; }
  .sidebar-bottom { flex: none; }
}

/* ─── 3. Единственный вход в уведомления — иконка в шапке ─────────────── */
.top-actions .icon-btn {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 12px;
  color: var(--text-soft, #5c6b85);
}
.top-actions .icon-btn:hover { background: var(--surface-hover); color: var(--text); }
.top-actions .icon-btn .nav-ico { width: 20px; height: 20px; }
.top-actions .icon-btn.has-unread { color: var(--brand); }
.top-actions .icon-btn b {
  position: absolute;
  top: -3px;
  right: -3px;
  display: grid;
  place-items: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: #d92b45;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  box-shadow: 0 0 0 2px var(--top-bg, #fff);
}

/* ─── 4. АХЧ: цвет по смыслу статуса + возраст заявки ─────────────────── */
.maintenance-status.new { background: #eef1f6; color: #55647e; }
.maintenance-status.progress { background: #e4f0ff; color: #14639f; }
.maintenance-status.sent { background: #fff2d6; color: #8a5a00; }
.maintenance-status.done { background: #dcf7e8; color: #0a7a4f; }
.maintenance-row.new { --row-rail: #8494ab; }
.maintenance-row.progress { --row-rail: #1a7ad4; }
.maintenance-row.sent { --row-rail: #d8930f; }
.maintenance-row.done { --row-rail: #16a06a; }
.maintenance-row.is-late { --row-rail: #c22c43; }

.maintenance-wait {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: 4px;
  font-size: 11px;
  font-weight: 800;
  color: var(--muted);
  white-space: nowrap;
}
.maintenance-wait.is-stale { color: #96660d; }
.maintenance-wait.is-late { color: #b02a3d; }
.maintenance-wait.is-late::before,
.maintenance-wait.is-stale::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}
.maintenance-row.is-late { background: color-mix(in srgb, #c22c43 5%, transparent); }

[data-theme=dark] .maintenance-status.new { background: rgba(132,148,171,.18); color: #b3c1d6; }
[data-theme=dark] .maintenance-status.progress { background: rgba(45,131,255,.18); color: #7ebbff; }
[data-theme=dark] .maintenance-status.sent { background: rgba(240,174,43,.18); color: #f3c368; }
[data-theme=dark] .maintenance-status.done { background: rgba(26,180,120,.18); color: #63d6a4; }
[data-theme=dark] .maintenance-wait.is-stale { color: #f0c04a; }
[data-theme=dark] .maintenance-wait.is-late { color: #ff92a2; }

/* ─── 5. Главная: очередь дел — просрочка видна сразу ─────────────────── */
.home2-q.warn { border-color: color-mix(in srgb, var(--state-warn) 42%, var(--line)); }
.home2-q.crit {
  border-color: color-mix(in srgb, var(--state-crit) 55%, var(--line));
  background: color-mix(in srgb, var(--state-crit) 7%, var(--surface-card));
}
.home2-q.crit .body b { color: var(--state-crit); }
.home2-q.crit .body small,
.home2-q.warn .body small { color: var(--text-soft); font-weight: 700; }
.home2-q.crit .go { color: var(--state-crit); }
.home2-q.crit .rail, .home2-q.warn .rail { width: 4px; }

/* ─── 6. База знаний: тип файла и иконки правил ───────────────────────── */
.ui-ico { width: 15px; height: 15px; vertical-align: -2px; margin-right: 6px; flex: none; }
.document-rules p { display: flex; align-items: center; gap: 2px; }
.doc-zone-ico .ui-ico { width: 30px; height: 30px; margin: 0; }
.document-name-cell .doc-kind,
.document-mobile-card .doc-kind {
  display: grid;
  place-items: center;
  font-style: normal;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .02em;
  background: #eef1f6;
  color: #56657f;
}
.doc-kind.is-pdf { background: #fde8e8; color: #b3261e; }
.doc-kind.is-doc { background: #e5eeff; color: #1c4fb0; }
.doc-kind.is-xls { background: #e2f6ea; color: #10794c; }
.doc-kind.is-ppt { background: #ffeade; color: #b64a12; }
.doc-kind.is-txt { background: #eef1f6; color: #55647e; }
.doc-kind.is-img { background: #f0e9ff; color: #6740c6; }
.doc-kind.is-zip { background: #fff3d6; color: #8a5a00; }
[data-theme=dark] .doc-kind { background: rgba(140,160,190,.16); color: #b7c5da; }

/* ─── 7. Ссылки: кнопка «Сбросить» больше не режется ──────────────────── */
@media (min-width: 761px) and (max-width: 1460px) {
  .links-filter-bar,
  .links-filter-bar.embedded,
  .link-admin-page .links-filter-bar.embedded {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  }
  .links-filter-bar > label { grid-column: 1 / -1; }
  .links-filter-bar > .quiet,
  .link-admin-page .links-filter-bar .quiet {
    grid-column: 1 / -1;
    justify-self: start;
    white-space: nowrap;
  }
}

/* ─── 8. Быстрые ссылки на главной: ряд не ломается ───────────────────── */
.home3-quick > button { align-items: center; min-height: 52px; }
.home3-quick > button b {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
}

/* ─── 9. Сводная сетка смен: липкая шапка, закреплённые фамилии, легенда ─ */
@media (min-width: 981px) {
  .sch-month { max-height: calc(100vh - 210px); }
}
.sch-month-head { z-index: 4; background: var(--surface-card); }
.sch-month-person {
  position: sticky;
  left: 0;
  z-index: 2;
  background: var(--surface-card);
  padding-left: 2px;
}
.sch-month-head .sch-month-person { z-index: 5; }
.sch-month-row.is-me .sch-month-person { background: color-mix(in srgb, var(--brand) 6%, var(--surface-card)); }

.sch-legend {
  display: grid;
  gap: 8px;
  margin-top: 12px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--r-card, 14px);
  background: var(--surface-card);
}
.sch-legend > b { font-size: 12px; font-weight: 800; }
.sch-legend-items { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.sch-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 11.5px;
  font-weight: 700;
  color: var(--muted);
}
.sch-legend-item .sch-chip { width: 34px; min-height: 20px; }
.sch-legend-item .sch-mark { position: static; width: 16px; height: 16px; font-size: 9px; }
.sch-legend-item .sch-legend-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--brand);
  font-size: 0;
}

/* ─── 10. Календарь: загрузка, вкладка «История», лента ───────────────── */
.calendar-loading-bar {
  margin-bottom: 8px;
  padding: 7px 12px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 10%, var(--surface-card));
  color: var(--brand-dark, var(--brand));
  font-size: 11.5px;
  font-weight: 800;
}
.calendar-board.is-loading { opacity: .72; transition: opacity .15s; }

.calendar-view-history { padding: 0; }
.cal-hist { display: grid; gap: 18px; padding: 14px 16px 18px; }
.cal-hist-day > h3 {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
  text-transform: none;
}
.cal-hist-list { display: grid; gap: 6px; }
.cal-hist-row {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 10px 12px;
  border: 1px solid var(--line-soft);
  border-radius: var(--r-control, 10px);
  background: var(--surface-card-2);
}
.cal-hist-time {
  font-size: 12px;
  font-weight: 800;
  color: var(--text-soft);
  font-variant-numeric: tabular-nums;
  padding-top: 1px;
}
.cal-hist-body { display: grid; gap: 3px; min-width: 0; }
.cal-hist-body > b { font-size: 12.5px; font-weight: 800; }
.cal-hist-event { font-size: 12.5px; color: var(--text); }
.cal-hist-deleted {
  font-style: normal;
  font-size: 10px;
  font-weight: 800;
  color: #b02a3d;
  text-transform: uppercase;
}
.cal-hist-changes { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 2px; }
.cal-hist-change {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--surface-hover);
  font-size: 11px;
}
.cal-hist-change em { font-style: normal; font-weight: 800; color: var(--muted); }
.cal-hist-change s { color: var(--muted); text-decoration: line-through; }
.cal-hist-change i { font-style: normal; color: var(--muted); }
.cal-hist-change b { font-weight: 800; }
.cal-hist-comment { font-size: 11.5px; color: var(--text-soft); }
.cal-hist-body small { font-size: 11px; color: var(--muted); }
.cal-hist-open {
  font-size: 11px;
  font-weight: 800;
  color: var(--brand);
  white-space: nowrap;
}
.cal-hist-more { justify-self: center; padding: 9px 18px; }
.cal-hist-end { text-align: center; font-size: 11px; color: var(--muted); }
.cal-hist-create-calendar-event { border-left: 3px solid #16a06a; }
.cal-hist-delete-calendar-event,
.cal-hist-cancel-calendar-event-occurrence,
.cal-hist-truncate-calendar-event-series { border-left: 3px solid #c22c43; }
.cal-hist-update-calendar-event,
.cal-hist-update-calendar-event-occurrence,
.cal-hist-reschedule-calendar-series { border-left: 3px solid #d8930f; }

@media (max-width: 720px) {
  .cal-hist-row { grid-template-columns: 40px minmax(0, 1fr); }
  .cal-hist-open { grid-column: 2; justify-self: start; }
}

/* ─── 11. Вход: поля видно, ссылка «Забыли пароль» читается ───────────── */
.auth-card label { font-size: 11.5px; color: var(--text-soft); }
.auth-card input {
  border: 1.5px solid #c9d4e4;
  padding: 13px 12px;
  font-size: 14px;
  background: #fff;
}
.auth-card input::placeholder { color: #9aa8bd; }
.auth-card input:focus {
  outline: none;
  border-color: var(--brand);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 16%, transparent);
}
.auth-forgot {
  margin-top: 14px;
  color: var(--brand);
  font-weight: 800;
  font-size: 12.5px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
[data-theme=dark] .auth-card input { background: rgba(12,22,36,.7); border-color: rgba(173,195,222,.28); }
[data-theme=dark] .auth-card input::placeholder { color: #7d8ca4; }

/* Длинные названия в ленте не должны рвать плашку по слогам. */
.cal-hist-change { max-width: 100%; }
.cal-hist-change s, .cal-hist-change b { overflow-wrap: anywhere; }

/* ─── 12. График: полоса центров не должна вылезать за экран ──────────────
   Сетка repeat(3, max-content) при шести центрах с длинными названиями
   давала строку шире окна — страница уезжала вправо на ноутбуке. */
.schedule-desktop-centers {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  width: auto;
  max-width: 100%;
}
.schedule-desktop-centers button { flex: 0 1 auto; }
.schedule-desktop-row1 { max-width: 100%; }


/* ─── 13. Опись файлов объявления, пока грузится содержимое ───────────────
   Список объявлений больше не тянет base64: карточка показывает имена и
   размеры сразу, а сами файлы подставляются, когда придёт ответ. */
.portal-attachments-pending { display: grid; gap: 4px; margin: 0 0 6px; padding: 0; list-style: none; }
.portal-attachments-pending li {
  display: flex; align-items: baseline; gap: 8px;
  padding: 8px 10px; border: 1px dashed var(--line); border-radius: var(--r-control, 10px);
  font-size: 12px; font-weight: 700; color: var(--text-soft);
}
.portal-attachments-pending small { color: var(--muted); font-weight: 600; }
.portal-attachments.is-loading .hint { margin: 0; }

/* ─── 14. Лента истории: своя прокрутка ───────────────────────────────────
   Страница календаря занимает высоту экрана, а .calendar-board обрезает всё
   лишнее (overflow:hidden) — сетки недели и дня прокручиваются внутри себя.
   У ленты изменений своей прокрутки не было, поэтому она обрывалась на
   первом экране: 10 000 пикселей содержимого в окне 612 пикселей. */
.calendar-board.calendar-view-history {
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

/* На узком экране четвёртая вкладка уезжала в горизонтальную прокрутку без
   видимой полосы — на телефоне это читалось как «кнопки История нет».
   Переносим вкладки на вторую строку вместо прокрутки. */
.calendar-page-narrow .calendar-mode-tabs {
  flex-wrap: wrap;
  overflow-x: visible;
  row-gap: 4px;
}
.calendar-page-narrow .calendar-mode-tabs button {
  flex: 1 1 40%;
  min-width: 0;
}

/* ─── 15. Карточка мероприятия в календаре ────────────────────────────────
   Плитки вместо плотной таблицы, аватар автора и явные блоки: так карточку
   читают по диагонали, а не построчно. Обложки сверху нет намеренно —
   иначе к каждому мероприятию пришлось бы вручную подбирать картинку. */
dialog:has(.cal-card) {
  width: min(640px, calc(100vw - 28px));
  max-width: none;
}

.calendar-detail-dialog.cal-card {
  width: 100%;
  max-width: none;
  display: grid;
  gap: 0;
  padding: 0;
  border-radius: 20px;
}

.cal-card-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 22px 22px 16px;
}
.cal-card-title h2 { margin: 0 0 10px; font-size: 21px; line-height: 1.25; font-weight: 800; }
.cal-card-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.cal-card-when {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 6px 11px; border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 8%, var(--surface-card-2));
  color: var(--brand-dark, var(--brand));
  font-size: 12.5px; font-weight: 800;
}
.cal-card-when .ui-ico { width: 14px; height: 14px; margin: 0; color: var(--brand); }
.cal-card-status {
  padding: 6px 12px; border-radius: 999px;
  font-size: 12px; font-weight: 800; white-space: nowrap;
}
.cal-card-status.is-active { background: #dcf7e8; color: #0a7a4f; }
.cal-card-status.is-vacation { background: #fff2d6; color: #8a5a00; }
[data-theme=dark] .cal-card-status.is-active { background: rgba(26,180,120,.18); color: #63d6a4; }
[data-theme=dark] .cal-card-status.is-vacation { background: rgba(240,174,43,.18); color: #f3c368; }

.cal-card-close {
  width: 34px; height: 34px; flex: none;
  display: grid; place-items: center;
  border: 1px solid var(--line); border-radius: 50%;
  background: var(--surface-card); color: var(--text-soft);
  font-size: 19px; line-height: 1;
}
.cal-card-close:hover { background: var(--surface-hover); color: var(--text); }

.cal-card-body {
  display: grid; gap: 10px;
  padding: 0 22px 18px;
  max-height: min(56vh, 520px);
  overflow-y: auto;
  overscroll-behavior: contain;
}

.cal-card-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.cal-card-tile {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 11px 10px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface-card-2);
}
.cal-card-tile > i {
  display: grid; place-items: center;
  width: 26px; height: 26px; border-radius: 9px;
  background: color-mix(in srgb, var(--brand) 10%, transparent);
  color: var(--brand);
}
.cal-card-tile > i .ui-ico { width: 14px; height: 14px; margin: 0; }
.cal-card-tile small {
  display: block; margin-bottom: 3px;
  font-size: 9.5px; font-weight: 800; letter-spacing: .05em;
  text-transform: uppercase; color: var(--muted);
}
.cal-card-tile b { font-size: 12.5px; font-weight: 700; line-height: 1.25; overflow-wrap: break-word; }
.cal-card-tile.is-active b { color: #0a7a4f; }
.cal-card-tile.is-vacation b { color: #8a5a00; }
[data-theme=dark] .cal-card-tile.is-active b { color: #63d6a4; }
[data-theme=dark] .cal-card-tile.is-vacation b { color: #f3c368; }

.cal-card-row {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 13px 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface-card);
}
.cal-card-row > i {
  display: grid; place-items: center;
  width: 32px; height: 32px; border-radius: 10px;
  background: color-mix(in srgb, var(--brand) 9%, transparent);
  color: var(--brand);
}
.cal-card-row > i .ui-ico { width: 16px; height: 16px; margin: 0; }
.cal-card-row small {
  display: block; margin-bottom: 3px;
  font-size: 9.5px; font-weight: 800; letter-spacing: .05em;
  text-transform: uppercase; color: var(--muted);
}
.cal-card-row b { display: block; font-size: 13.5px; font-weight: 700; overflow-wrap: anywhere; }
.cal-card-row > div > span { display: block; margin-top: 2px; font-size: 12px; color: var(--text-soft); font-weight: 600; }

.cal-card-code { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.cal-card-code b { font-variant-numeric: tabular-nums; letter-spacing: .02em; font-size: 15px; }
.cal-card-code .outline {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 9px 13px; font-size: 12px; white-space: nowrap; text-decoration: none;
}
.cal-card-code .outline .ui-ico { width: 14px; height: 14px; margin: 0; }

.cal-card-row > div > span.cal-card-person {
  display: flex; align-items: center; gap: 9px; margin-top: 4px;
}
.cal-card-ava {
  width: 30px; height: 30px; flex: none;
  display: grid; place-items: center;
  border-radius: 50%; overflow: hidden;
  background: var(--surface-hover); color: var(--text-soft);
  font-size: 11px; font-weight: 800;
}
.cal-card-ava .ava-img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.cal-card-person b { font-size: 13.5px; }

/* У описания нет иконки — иначе текст попадает в 34-пиксельную колонку
   и печатается по одному слову в строку. */
.cal-card-desc { grid-template-columns: minmax(0, 1fr); }
.cal-card-desc p { margin: 0; font-size: 12.5px; font-weight: 500; color: var(--text-soft); white-space: pre-wrap; }
.cal-card-history button {
  padding: 0; font-size: 12.5px; font-weight: 800;
  color: var(--brand); text-align: left;
}
.cal-card-history button:hover { text-decoration: underline; }

.cal-card-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 22px 18px;
  border-top: 1px solid var(--line);
}
.cal-card-foot-right { display: flex; gap: 8px; }
.cal-card-foot .outline, .cal-card-foot .primary { padding: 10px 16px; font-size: 13px; }
.cal-card-delete {
  padding: 10px 16px; border: 1px solid #f0c2c8; border-radius: 10px;
  background: #fff5f6; color: #b02a3d; font-size: 13px; font-weight: 800;
}
.cal-card-delete:hover { background: #ffe9ec; }
[data-theme=dark] .cal-card-delete { background: rgba(200,50,70,.14); border-color: rgba(220,90,110,.4); color: #ff9ba5; }

@media (max-width: 720px) {
  .cal-card-tiles { grid-template-columns: 1fr 1fr; }
  .cal-card-title h2 { font-size: 18px; }
  .cal-card-head, .cal-card-body, .cal-card-foot { padding-left: 16px; padding-right: 16px; }
  .cal-card-code { grid-template-columns: minmax(0, 1fr); }
  .cal-card-code .outline { justify-self: start; }
  .cal-card-foot { flex-wrap: wrap; }
  .cal-card-foot-right { margin-left: auto; }
}

/* ─── 16. Записи журнала кликабельны ─────────────────────────────────────
   По записи «создано мероприятие» логично попасть в само занятие, поэтому
   строка ведёт себя как ссылка. Кнопка истории внутри неё останавливает
   всплытие, чтобы не срабатывали оба действия сразу. */
.cal-hist-row.is-openable { cursor: pointer; transition: border-color .12s, background .12s; }
.cal-hist-row.is-openable:hover {
  border-color: color-mix(in srgb, var(--brand) 34%, var(--line));
  background: var(--surface-hover);
}
.cal-hist-row.is-openable:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
}
.cal-hist-actions { display: grid; justify-items: end; gap: 4px; }
.cal-hist-go {
  font-size: 11px;
  font-weight: 800;
  color: var(--brand);
  white-space: nowrap;
  opacity: 0;
  transition: opacity .12s;
}
.cal-hist-row.is-openable:hover .cal-hist-go,
.cal-hist-row.is-openable:focus-visible .cal-hist-go { opacity: 1; }
.cal-hist-open { color: var(--text-soft); }
.cal-hist-open:hover { color: var(--brand); text-decoration: underline; }

@media (max-width: 720px) {
  .cal-hist-actions { grid-column: 2; justify-items: start; }
  /* На телефоне подсказки по наведению нет — показываем её сразу. */
  .cal-hist-go { opacity: 1; }
}

/* ─── 17. Скрытые мероприятия ────────────────────────────────────────────
   Свободный бильярд и тренажёры идут по десять часов и закрывают собой
   день. Такое занятие помечают «скрытым»: из сетки оно уходит, в афише и
   печатном расписании остаётся. */
.calendar-hidden-toggle { padding-top: 12px; border-top: 1px solid var(--line-soft); }
.calendar-hidden-toggle label {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 9px;
  align-items: start;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
}
.calendar-hidden-toggle input { width: 16px; height: 16px; margin-top: 1px; accent-color: var(--brand); }
.calendar-hidden-toggle small {
  display: block;
  margin-top: 2px;
  font-size: 10.5px;
  font-weight: 600;
  color: var(--muted);
}

/* Показанное скрытое занятие видно, но отличается штриховой рамкой. */
.calendar-block.is-hidden-event,
.calendar-month-pill.is-hidden-event {
  border-style: dashed;
  opacity: .78;
}
.calendar-block.is-hidden-event:hover,
.calendar-month-pill.is-hidden-event:hover { opacity: 1; }

.cal-card-status.is-hidden { background: #e8ecf4; color: #4f5f7a; }
[data-theme=dark] .cal-card-status.is-hidden { background: rgba(140,160,190,.2); color: #b7c5da; }

/* Подпись под чекбоксом в форме мероприятия. */
.calendar-event-form .check-row small {
  display: block;
  margin-top: 3px;
  font-size: 10.5px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--muted);
}

/* ─── 18. Заглушка CMD AI для сотрудников ────────────────────────────────
   Помощник ещё дорабатывается: сотрудник видит объяснение и путь к базе
   знаний, администратор — обычный чат. */
.cmdai-soon-page { display: grid; place-items: start center; padding-top: 40px; }
.cmdai-soon {
  width: min(560px, 100%);
  display: grid;
  justify-items: center;
  gap: 12px;
  padding: 34px 30px 30px;
  text-align: center;
}
.cmdai-soon-icon {
  display: grid;
  place-items: center;
  width: 62px;
  height: 62px;
  border-radius: 20px;
  background: color-mix(in srgb, var(--brand) 12%, var(--surface-card-2));
  color: var(--brand);
}
.cmdai-soon-icon .nav-ico { width: 30px; height: 30px; }
.cmdai-soon h2 { margin: 4px 0 0; font-size: 20px; }
.cmdai-soon p { margin: 0; max-width: 44ch; font-size: 13px; color: var(--text-soft); line-height: 1.5; }
.cmdai-soon-note { color: var(--muted) !important; font-size: 12px !important; }
.cmdai-soon-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 8px; }
.cmdai-soon-actions .primary, .cmdai-soon-actions .outline { padding: 11px 18px; font-size: 13px; }

@media (max-width: 720px) {
  .cmdai-soon-page { padding-top: 16px; }
  .cmdai-soon { padding: 26px 18px 22px; }
}

/* ─── 19. Конфиденциальные задачи в общем списке ─────────────────────────
   Сотрудник видит, что задача есть, кто её поставил и кому, но название и
   описание закрыты. Сервер таким карточкам текста и не отдаёт. */
.task-censor {
  display: inline-block;
  width: var(--censor-width, 60%);
  min-width: 90px;
  height: 12px;
  border-radius: 3px;
  vertical-align: -1px;
  background:
    repeating-linear-gradient(90deg,
      color-mix(in srgb, var(--text-soft) 34%, transparent) 0 14px,
      color-mix(in srgb, var(--text-soft) 22%, transparent) 14px 22px);
}
.task-list-row .row-main.is-restricted p .task-censor { height: 10px; }
.task-list-row.is-restricted { cursor: not-allowed; }
.task-list-row.is-restricted:hover { border-color: var(--line); background: var(--surface-card); }
.task-list-row.is-restricted .row-check input { opacity: .4; }
.task-list-row .row-main.is-restricted b {
  display: flex;
  align-items: center;
  gap: 10px;
}
.task-lock-badge {
  font-style: normal;
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--text-soft);
  background: var(--surface-hover);
  border-radius: 999px;
  padding: 3px 9px;
  white-space: nowrap;
}
.task-list-row .row-main.is-restricted small { color: var(--muted); font-style: italic; }

/* Автор задачи в строке списка: подпись рядом со счётчиками, сетку строки
   не трогаем — иначе поедут колонки ответственного, центра и срока. */
.task-list-row .row-main small .row-author {
  font-weight: 800;
  color: var(--text-soft);
}

/* На телефоне длинная должность («Главный специалист по работе с населением»)
   вылезала за карточку задачи — обрезаем многоточием. */
@media (max-width: 720px) {
  .list-row-card .row-person { min-width: 0; max-width: 100%; overflow: hidden; }
  .list-row-card .row-person b,
  .list-row-card .row-person small {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

/* ─── 20. Отчётная таблица мероприятия ───────────────────────────────────
   Блок в карточке: слева иконка и подпись, справа кнопка перехода. */
.cal-card-report { grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; }
.cal-card-report .outline {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 13px;
  font-size: 12px;
  white-space: nowrap;
  text-decoration: none;
}
.cal-card-report .outline .ui-ico { width: 14px; height: 14px; margin: 0; }
.calendar-event-form label > small.hint {
  display: block;
  margin-top: 4px;
  font-size: 10.5px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--muted);
}

@media (max-width: 720px) {
  .cal-card-report { grid-template-columns: 34px minmax(0, 1fr); }
  .cal-card-report .outline { grid-column: 2; justify-self: start; margin-top: 8px; }
}

/* ─── 21. Лента истории на телефоне ──────────────────────────────────────
   1. Своя прокрутка ленте нужна только на широком экране, где страница
      календаря занимает высоту окна. На телефоне страница обычная, и
      контейнер с overflow-y:auto + overscroll-behavior:contain перехватывал
      жест — лента переставала прокручиваться вовсе.
   2. Кнопки «Открыть в календаре» и «История мероприятия» стояли в одну
      строку с nowrap и вылезали за край карточки. */
@media (max-width: 720px) {
  .calendar-board.calendar-view-history {
    overflow: visible;
    overscroll-behavior: auto;
    -webkit-overflow-scrolling: auto;
  }

  .cal-hist-actions {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 6px 16px;
    justify-items: start;
    margin-top: 4px;
  }
  .cal-hist-go,
  .cal-hist-open {
    white-space: normal;
    max-width: 100%;
    text-align: left;
  }
  .cal-hist-changes { gap: 4px 8px; }
  .cal-hist-change { max-width: 100%; }
}


/* ─── Поставщики: «не выгружать в расписании» и окно формирования ────────
   Галочка живёт в форме группы рядом с каникулами и выглядит так же, но при
   включении подсвечивается — иначе в длинной форме её легко не заметить. */
.sup-hide-field .sup-hint { display: block; margin-top: 8px; }
.sup-hide-field.is-on { border-color: var(--state-warn); background: var(--state-warn-bg); }
.sup-hide-field.is-on .sup-vac-toggle { color: var(--state-warn); }

/* Метка в списке занятий: тем же кеглем, что «каникулы», но своим цветом —
   каникулы кончатся сами, а эту галочку снимает человек. */
.sup-vac.is-hidden { color: var(--muted); background: var(--surface-hover, rgba(120,140,170,.14)); }

/* Окно выбора центра перед формированием: те же поля, что у календаря. */
.sup-export-form { padding: 22px; display: grid; gap: 14px; }
.sup-export-form h2 { margin: 0; }
.sup-export-form .hint { margin: 0; }
.sup-export-form [data-sup-export-hint] { color: var(--text-soft, var(--muted)); }


/* ─── Календарь: вкладка «Проверка отчётов» ──────────────────────────────
   Строка занятия читается слева направо: время → что и где → статус →
   сколько отмечено → когда обновляли. Цвет держим только на статусе:
   раскрашивать всю строку в красный на списке из полусотни занятий —
   это не таблица, а тревога. */
/* Страница календаря живёт в высоту экрана, а доска прячет переполнение —
   так устроены сетки месяца и недели. Список отчётов из-за этого обрезался, и
   страница не прокручивалась вовсе. Поэтому шапка вкладки остаётся на месте,
   а прокручивается только сам список — как сетка в соседних видах. */
.calendar-view-reports { padding: 0; }
.cal-rep { display: flex; flex-direction: column; gap: 14px; flex: 1 1 auto; min-height: 0;
  padding: 14px 16px 0; }
.cal-rep-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain;
  display: grid; gap: 18px; padding-bottom: 18px; scrollbar-width: thin; }
.cal-rep-head { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; }
.cal-rep-tabs { display: flex; gap: 4px; }
.cal-rep-tabs button { background: var(--panel); border: 1px solid var(--line); padding: 8px 12px;
  border-radius: 8px; color: var(--muted); font-size: 11px; font-weight: 700; display: flex; gap: 6px; align-items: center; }
.cal-rep-tabs button.selected { background: #f1e1e6; color: #7b1436; border-color: #e7becc; }
.cal-rep-tabs em { font-style: normal; background: var(--state-warn-bg); color: var(--state-warn);
  border-radius: 999px; padding: 1px 7px; font-size: 10px; }
.cal-rep-actions { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.cal-rep-sync { color: var(--muted); font-size: 11px; }

.cal-rep-totals { display: flex; flex-wrap: wrap; gap: 16px; font-size: 12px; color: var(--muted); }
.cal-rep-totals b { font-size: 15px; margin-right: 4px; }
.cal-rep-totals .is-ok b { color: var(--state-ok); }
.cal-rep-totals .is-bad b { color: var(--state-crit); }
.cal-rep-totals .is-idle b { color: var(--text-soft, var(--muted)); }

.cal-rep-day h3 { display: flex; flex-wrap: wrap; gap: 10px; align-items: baseline; margin: 0 0 8px;
  font-size: 13px; }
.cal-rep-day h3 em { font-style: normal; font-size: 11px; font-weight: 600; color: var(--muted); }
.cal-rep-list { display: grid; gap: 4px; }
.cal-rep-row { display: grid; grid-template-columns: 54px minmax(140px, 1fr) 148px 128px 116px; gap: 12px;
  align-items: center; padding: 9px 10px; border-radius: 10px; background: var(--surface-card-2, #f8fafc); }
.cal-rep-row > * { min-width: 0; overflow-wrap: anywhere; }
.cal-rep-time { font-weight: 700; font-size: 12px; }
.cal-rep-what { min-width: 0; }
.cal-rep-what b { display: block; font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cal-rep-what small { display: block; margin-top: 3px; font-size: 10.5px; color: var(--muted); }
.cal-rep-what a { color: inherit; }
.cal-rep-status { font-size: 10.5px; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; }
.cal-rep-row.is-ok .cal-rep-status { color: var(--state-ok); }
.cal-rep-row.is-bad .cal-rep-status { color: var(--state-crit); }
.cal-rep-row.is-warn .cal-rep-status { color: var(--state-warn); }
.cal-rep-row.is-idle .cal-rep-status { color: var(--text-soft, var(--muted)); }
.cal-rep-count { font-size: 11.5px; color: var(--muted); }
.cal-rep-count b { font-size: 14px; color: var(--text); margin-right: 3px; }
.cal-rep-dash { font-style: normal; color: var(--line); }
.cal-rep-when { font-size: 10.5px; color: var(--text-soft, var(--muted)); }
.cal-rep-note { margin: 0; font-size: 11.5px; color: var(--muted); }

/* Пять колонок держатся только на широком экране: у страницы календаря слева
   меню портала, потом мини-календарь с фильтрами, и до самой таблицы доходит
   примерно на 520px меньше ширины окна. При 1220px и уже перестраиваем строку
   в два ряда — иначе название наезжает на статус. */
@media (max-width: 1220px) {
  .cal-rep-row { grid-template-columns: 46px minmax(0, 1fr) auto; row-gap: 6px; }
  .cal-rep-status { grid-column: 2; }
  .cal-rep-count { grid-column: 3; grid-row: 1; text-align: right; }
  .cal-rep-when { grid-column: 3; grid-row: 2; text-align: right; }
  .cal-rep-what b { white-space: normal; }
  .cal-rep-head { flex-direction: column; align-items: stretch; }
  .cal-rep-actions { justify-content: space-between; }
}


/* На телефоне внутренняя прокрутка перехватывает жест и список «залипает» —
   ровно то, на что жаловались в истории изменений. Возвращаем обычную
   прокрутку страницы. */
@media (max-width: 720px) {
  .cal-rep { display: block; min-height: 0; padding: 12px 12px 0; }
  .cal-rep-scroll { display: grid; overflow: visible; max-height: none; }
  .cal-rep-head, .cal-rep-totals { margin-bottom: 12px; }
}


/* Выбранный в календаре день на вкладке отчётов: список к нему подводится
   прокруткой, и чтобы взгляд его поймал — лёгкая рамка и цветной заголовок.
   Заливку не трогаем: строки внутри уже раскрашены по статусам. */
.cal-rep-day.is-picked > h3 { color: var(--brand); }
/* --nav-on-bar — переменная бокового меню, в светлой теме она белая:
   обводка получалась невидимой. Берём фирменный цвет. */
.cal-rep-day.is-picked .cal-rep-list { outline: 1px solid var(--brand);
  outline-offset: 5px; border-radius: 10px; }

/* Сколько человек было на занятии — в карточке мероприятия, видно всем. */
.cal-card-attendance b { font-size: 15px; }
.cal-card-attendance span { color: var(--muted); font-size: 11px; }


/* Когда отметок нет, в карточке стоит причина, а не цифра — набираем её
   спокойно, размером обычного текста: это пояснение, а не показатель. */
.cal-card-attendance.is-no_lesson b, .cal-card-attendance.is-no_data b,
.cal-card-attendance.is-empty b { font-size: 13px; color: var(--text-soft, var(--muted)); }
.cal-card-attendance.is-empty b { color: var(--state-crit); }


/* Окно выгрузки КИС: период и центр стоят рядом — их выбирают вместе,
   и обе подписи должны читаться одним взглядом перед копированием кода. */
.cal-kis-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 4px 0 2px; }
.cal-kis-fields label { display: grid; gap: 6px; font-weight: 700; font-size: 11px; }
.cal-kis-fields select, .cal-kis-fields input { border: 1px solid var(--line); border-radius: 8px;
  padding: 9px; background: var(--panel); color: var(--text); font-weight: 600; }
.cal-kis [data-kis-summary] { background: var(--surface-card-2, #f8fafc); border-radius: 10px; padding: 10px 12px; }
@media (max-width: 640px) { .cal-kis-fields { grid-template-columns: 1fr; } }


/* ─── Экран «Обновление КИС МД» ──────────────────────────────────────────
   Две выгрузки в одном месте: сверху выбор, что обновлять, снизу история.
   Галочки — крупные карточки: их читают перед тем, как копировать код, и
   ошибиться в выборе дороже, чем промахнуться мышью. */
.kis-page { max-width: 900px; }
.kis-page .card + .card { margin-top: 16px; }
.kis-tasks { display: grid; gap: 10px; margin: 14px 0; }
.kis-task { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px;
  border: 1px solid var(--line); border-radius: 12px; background: var(--surface-card-2, #f8fafc); cursor: pointer; }
.kis-task.is-on { border-color: var(--brand); background: var(--surface-selected, #fdf2f6); }
.kis-task input { width: 17px; height: 17px; margin-top: 2px; accent-color: var(--brand); flex: none; }
.kis-task b { display: block; font-size: 13px; }
.kis-task small { display: block; margin-top: 3px; color: var(--muted); font-size: 11.5px; }

.kis-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }
.kis-fields label { display: grid; gap: 6px; font-weight: 700; font-size: 11px; }
.kis-fields select, .kis-fields input { border: 1px solid var(--line); border-radius: 8px; padding: 9px;
  background: var(--panel); color: var(--text); font-weight: 600; }
.kis-fields select:disabled { opacity: .5; }
.kis-job { background: var(--surface-card-2, #f8fafc); border-radius: 10px; padding: 11px 13px; line-height: 1.5; }
.kis-note { display: block; margin-top: 6px; color: var(--muted); font-size: 11px; }

.kis-history { display: grid; gap: 4px; }
.kis-history-row { display: grid; grid-template-columns: 150px minmax(0, 1fr) 130px; gap: 12px;
  align-items: center; padding: 9px 10px; border-radius: 10px; background: var(--surface-card-2, #f8fafc); }
.kis-when { font-size: 11.5px; color: var(--muted); }
.kis-what b { font-size: 12.5px; }
.kis-what small { display: block; margin-top: 3px; font-size: 11px; color: var(--muted); }
.kis-who { font-size: 11.5px; color: var(--text-soft, var(--muted)); text-align: right; }
.kis-bad { font-style: normal; margin-left: 8px; font-size: 10px; font-weight: 800; text-transform: uppercase;
  color: var(--state-crit); }

@media (max-width: 720px) {
  .kis-fields { grid-template-columns: 1fr; }
  .kis-history-row { grid-template-columns: 1fr auto; }
  .kis-when { grid-column: 1; }
  .kis-who { grid-column: 2; grid-row: 1; }
  .kis-what { grid-column: 1 / -1; }
}


/* Выгрузка проверки отчётов: отдельное небольшое окно, не связанное с
   импортом КИС. Поля периода и центра собраны в один читаемый блок. */
dialog:has(.cal-report-export) { width: min(620px, calc(100% - 32px)); }
.cal-report-export { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
.cal-report-export-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 16px; }
.cal-report-export-fields label { display: grid; gap: 6px; font-size: 11px; font-weight: 700; }
.cal-report-export-fields label:last-child { grid-column: 1 / -1; }
.cal-report-export-fields input, .cal-report-export-fields select { width: 100%; min-height: 40px;
  border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px;
  background: var(--panel); color: var(--text); font: inherit; font-weight: 600; }
.cal-report-export-note { margin: 10px 0 0; color: var(--muted); font-size: 11px; }
@media (max-width: 560px) {
  .cal-report-export-fields { grid-template-columns: 1fr; }
  .cal-report-export-fields label:last-child { grid-column: auto; }
}


/* ─── «Идеи и ошибки» ────────────────────────────────────────────────────
   Список читается по одной колонке: слева голос, справа суть. Голос — самый
   крупный элемент карточки: именно им сотрудники и пользуются чаще всего. */
.ideas-page { max-width: 1000px; }
.idea-intro { display: flex; flex-wrap: wrap; gap: 16px; justify-content: space-between; align-items: center; }
.idea-intro h2 { margin: 0 0 6px; }
.idea-intro p { margin: 0; max-width: 620px; color: var(--muted); font-size: 12px; }
.idea-counters { display: flex; gap: 18px; }
.idea-counters span { display: grid; font-size: 10.5px; color: var(--muted); text-align: center; }
.idea-counters b { font-size: 20px; color: var(--text); }

.idea-filters { display: grid; gap: 10px; margin-top: 14px; }
.idea-filter-row { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.idea-filter-row button { background: var(--panel); border: 1px solid var(--line); padding: 7px 12px;
  border-radius: 999px; color: var(--muted); font-size: 11.5px; font-weight: 700; }
.idea-filter-row button.selected { background: #f1e1e6; color: #7b1436; border-color: #e7becc; }
.idea-filter-tools { gap: 12px; }
.idea-filter-tools select, .idea-filter-tools input[type="search"] { border: 1px solid var(--line);
  border-radius: 9px; padding: 8px 10px; background: var(--panel); color: var(--text); font-size: 12px; }
.idea-filter-tools input[type="search"] { flex: 1; min-width: 180px; }
.idea-filter-tools .check-row { font-size: 12px; font-weight: 600; }

.idea-list { display: grid; gap: 10px; margin-top: 16px; }
.idea-card { display: flex; gap: 14px; align-items: flex-start; padding: 14px 16px; border-radius: 14px;
  border: 1px solid var(--line); background: var(--panel); cursor: pointer; text-align: left;
  transition: border-color .12s, box-shadow .12s; }
.idea-card:hover { border-color: #e7becc; box-shadow: 0 8px 20px rgba(20, 40, 70, .07); }
.idea-card.is-done, .idea-card.is-rejected { opacity: .72; }
.idea-card-body { min-width: 0; flex: 1; }
.idea-card h3 { margin: 6px 0 4px; font-size: 14px; }
.idea-card p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.idea-card-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.idea-card-foot { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; font-size: 11px; color: var(--text-soft, var(--muted)); }
.idea-talk { color: var(--muted); }

.idea-tag, .idea-status { font-size: 9.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
  border-radius: 999px; padding: 3px 9px; }
.idea-tag.is-bug { background: var(--state-crit-bg); color: var(--state-crit); }
.idea-tag.is-idea { background: var(--state-info-bg); color: var(--state-info); }
.idea-tag.is-request { background: var(--state-warn-bg); color: var(--state-warn); }
.idea-tag.is-file { background: var(--surface-hover, #eef2f7); color: var(--muted); }
.idea-status.is-new { background: var(--surface-hover, #eef2f7); color: var(--text-soft, var(--muted)); }
.idea-status.is-progress { background: var(--state-info-bg); color: var(--state-info); }
.idea-status.is-done { background: var(--state-ok-bg); color: var(--state-ok); }
.idea-status.is-rejected { background: var(--state-crit-bg); color: var(--state-crit); }
.idea-status-note { margin: 8px 0 0; font-size: 11.5px; color: var(--muted); }

/* Голос: цифра крупная, подпись мелкая — понятно и с телефона. */
.idea-vote { flex: none; width: 82px; display: grid; gap: 2px; justify-items: center; padding: 10px 6px;
  border: 1px solid var(--line); border-radius: 12px; background: var(--surface-card-2, #f8fafc); }
.idea-vote b { font-size: 20px; line-height: 1; }
.idea-vote small { font-size: 9.5px; color: var(--muted); text-align: center; line-height: 1.2; }
.idea-vote.is-voted { border-color: var(--brand); background: var(--surface-selected, #fdf2f6); }
.idea-vote.is-voted b, .idea-vote.is-voted small { color: var(--brand); }
.idea-vote.is-big { width: 100%; padding: 16px; }
.idea-vote.is-big b { font-size: 28px; }

.idea-detail-page { max-width: 1000px; }
.idea-detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 16px; align-items: start; }
.idea-detail-main h2 { margin: 8px 0 6px; }
.idea-detail-meta { margin: 0 0 12px; font-size: 11.5px; color: var(--muted); }
.idea-detail-body { font-size: 13px; line-height: 1.55; white-space: pre-wrap; }
.idea-detail-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.idea-detail-side { display: grid; gap: 12px; }
.idea-side-hint { margin: 0; font-size: 11px; color: var(--muted); }
.idea-voters { display: grid; gap: 4px; font-size: 11.5px; color: var(--muted); }
.idea-voters b { color: var(--text); font-size: 11px; text-transform: uppercase; letter-spacing: .04em; }
.idea-files { display: grid; gap: 6px; margin-top: 14px; }
.idea-file { display: flex; align-items: center; gap: 10px; padding: 9px 11px; border: 1px solid var(--line);
  border-radius: 10px; color: inherit; text-decoration: none; font-size: 12px; }
.idea-file svg { width: 16px; height: 16px; flex: none; }
.idea-file small { margin-left: auto; color: var(--muted); }
.idea-form { padding: 22px; display: grid; gap: 14px; }
.idea-form h2 { margin: 0; }
.idea-form .hint { margin: 0; }

/* Упоминания в этом разделе не нужны: сотрудников больше тридцати,
   и список превращается в простыню. */
.idea-forum .comment-future-actions button[onclick*="openMentionPicker"] { display: none; }

@media (max-width: 860px) {
  .idea-detail-grid { grid-template-columns: 1fr; }
  .idea-card { padding: 12px; gap: 10px; }
  .idea-vote { width: 64px; padding: 8px 4px; }
  .idea-vote b { font-size: 17px; }
  .idea-counters { gap: 12px; }
}


/* Пока комментарий уходит на сервер, форма гасится: видно, что нажатие
   принято, и не хочется жать кнопку ещё раз. */
.modern-comment-form.is-sending { opacity: .7; pointer-events: none; }
.modern-comment-form.is-sending button.primary { cursor: progress; }


/* Автор темы: фото, должность и центр — как в комментариях, чтобы человек
   из другого ЦМД не выглядел безымянной подписью. */
.idea-author { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; flex-wrap: wrap; }
.idea-author-ava { width: 34px; height: 34px; border-radius: 50%; overflow: hidden; flex: none;
  display: grid; place-items: center; background: #e8eff8; color: #3f5c84; font-weight: 800; font-size: 12px; }
.idea-author-ava img { width: 100%; height: 100%; object-fit: cover; }
.idea-author b { display: block; font-size: 12.5px; }
.idea-author small { display: block; margin-top: 2px; font-size: 11px; color: var(--muted); }
.idea-author time { margin-left: auto; font-size: 11px; color: var(--text-soft, var(--muted)); }


/* Кнопку из шапки портал прячет на узких экранах (.top-actions .primary),
   поэтому на телефоне создание темы живёт прямо в карточке раздела. */
.idea-create-mobile { display: none; }
@media (max-width: 720px) {
  .idea-create-mobile { display: block; width: 100%; margin-top: 4px; }
  .idea-intro { flex-direction: column; align-items: stretch; gap: 12px; }
  .idea-counters { justify-content: space-between; }
}

/* =================== «Что нового» ===================
   Закреплённая запись раздела «Идеи и ошибки»: одна на портал, всегда сверху,
   ведёт её один человек. Оформлена не карточкой темы, а объявлением — иначе
   в списке она читается как ещё одна чужая идея. */
.idea-news { border-left: 4px solid var(--brand, #2563eb); cursor: pointer; display: grid; gap: 8px; }
.idea-news:hover { border-color: var(--brand, #2563eb); }
.idea-news.is-empty { cursor: default; }
.idea-news-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.idea-news-badge { font-size: 9.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
  border-radius: 999px; padding: 3px 10px; background: var(--state-info-bg); color: var(--state-info); }
.idea-news-head time { font-size: 11px; color: var(--muted); }
.idea-news h2 { margin: 0; font-size: 17px; }
.idea-news p { margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--text-soft, var(--muted)); }
.idea-news.is-empty p { color: var(--muted); }
.idea-news-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px;
  font-size: 11.5px; color: var(--muted); }
.idea-news-foot span:first-child { font-weight: 700; color: var(--brand, #2563eb); }
.idea-news .primary.slim { justify-self: start; }
.idea-tag.is-news { background: var(--state-info-bg); color: var(--state-info); }
/* У записи нет ни голосов, ни статуса — колонка справа не нужна. */
.idea-detail-grid.is-news { grid-template-columns: minmax(0, 1fr); }

/* Редактор записи «Что нового»: панель кнопок и поле с оформлением. */
.rich-field { display: grid; gap: 6px; }
.rich-field-label { font-size: 11px; font-weight: 700; color: var(--muted); text-transform: uppercase;
  letter-spacing: .04em; }
.rich-toolbar { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px; border: 1px solid var(--line);
  border-bottom: none; border-radius: 10px 10px 0 0; background: var(--surface-card-2, #f8fafc); }
.rich-toolbar button { padding: 5px 10px; font-size: 12px; line-height: 1.2; border: 1px solid var(--line);
  border-radius: 8px; background: var(--surface, #fff); color: var(--text); cursor: pointer; }
.rich-toolbar button:hover { border-color: var(--brand, #2563eb); color: var(--brand, #2563eb); }
.rich-toolbar button[data-rich-cmd="bold"] { font-weight: 800; }
.rich-toolbar button[data-rich-cmd="italic"] { font-style: italic; }
.rich-toolbar button[data-rich-cmd="underline"] { text-decoration: underline; }
.rich-editor { min-height: 220px; max-height: 46vh; overflow: auto; padding: 12px 14px;
  border: 1px solid var(--line); border-radius: 0 0 10px 10px; background: var(--surface, #fff);
  font-size: 13px; line-height: 1.55; outline: none; }
.rich-editor:focus { border-color: var(--brand, #2563eb); }

/* Одинаковое оформление в редакторе и в готовой записи — чтобы правка
   показывала ровно то, что увидят сотрудники. */
.rich-editor h2, .idea-detail-body.is-rich h2 { margin: 14px 0 6px; font-size: 17px; line-height: 1.3; }
.rich-editor h3, .idea-detail-body.is-rich h3 { margin: 12px 0 4px; font-size: 14.5px; line-height: 1.35; }
.rich-editor h2:first-child, .idea-detail-body.is-rich h2:first-child,
.rich-editor h3:first-child, .idea-detail-body.is-rich h3:first-child { margin-top: 0; }
.rich-editor p, .idea-detail-body.is-rich p { margin: 0 0 8px; }
.rich-editor ul, .idea-detail-body.is-rich ul,
.rich-editor ol, .idea-detail-body.is-rich ol { margin: 0 0 8px; padding-left: 22px; }
.rich-editor li, .idea-detail-body.is-rich li { margin: 2px 0; }
.rich-editor a, .idea-detail-body.is-rich a { color: var(--brand, #2563eb); }
.rich-lg { font-size: 1.25em; }
.rich-sm { font-size: .85em; }
/* Запись с оформлением сама расставляет отступы — переносы строк тут не нужны. */
.idea-detail-body.is-rich { white-space: normal; }
@media (max-width: 720px) {
  .rich-toolbar { gap: 4px; padding: 6px; }
  .rich-toolbar button { padding: 5px 8px; font-size: 11.5px; }
  .rich-editor { min-height: 180px; max-height: 40vh; }
}

/* Под «Что нового» нет обсуждения — вместо него приглашение завести тему. */
.idea-news-cta { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; justify-content: space-between; }
.idea-news-cta h2 { margin: 0 0 6px; font-size: 16px; }
.idea-news-cta p { margin: 0; max-width: 640px; font-size: 12.5px; line-height: 1.5; color: var(--muted); }
@media (max-width: 720px) {
  .idea-news-cta { flex-direction: column; align-items: stretch; }
  .idea-news-cta .primary { width: 100%; }
}

/* Картинка внутри записи «Что нового» — сейчас это QR-код бота.
   Подложка обязательна: QR чёрный на прозрачном фоне, и в тёмной теме он
   слился бы с карточкой. */
.idea-detail-body.is-rich img {
  display: block; max-width: 200px; width: 100%; height: auto; margin: 10px 0;
  background: #fff; border-radius: 12px; padding: 10px; border: 1px solid var(--line);
}

/* Напоминания в MAX: строка списка — время и чат, под ними текст и вложения. */
.max-reminder-row { align-items: flex-start; }
.max-reminder-row .user-row-main { display: grid; gap: 3px; min-width: 0; }
.max-reminder-row .user-row-main small { overflow-wrap: anywhere; }
.max-reminder-row .user-card-actions { align-items: center; flex-wrap: wrap; gap: 6px; }
.badge-ok, .badge-warn, .badge-stop {
  font-size: 11px; font-weight: 700; border-radius: 999px; padding: 3px 10px; white-space: nowrap;
}
.badge-ok { background: var(--state-ok-bg); color: var(--state-ok); }
.badge-warn { background: var(--state-warn-bg); color: var(--state-warn); }
.badge-stop { background: var(--state-crit-bg); color: var(--state-crit); }


/* Раскладка списков на средних экранах — переехало из list-v63.css.
   Тот слой убран из подключения: 123 его правила из 130 дословно повторяли
   documents-v65.css, который идёт следом и всё равно их перекрывал. Эти семь
   были единственными, которые он добавлял от себя. */
@media (min-width: 761px) and (max-width: 1360px) {
  body .list-row-card{grid-template-columns:34px 14px minmax(0,1fr) auto;gap:10px 12px;min-width:0}
  .list-row-card .row-main{grid-column:3;min-width:0}
  .list-row-card .row-assignee,.list-row-card .row-center,.list-row-card .row-date,.list-row-card .status-badge{grid-column:3;margin:0}
  .list-row-card .row-menu{grid-column:4;grid-row:1;align-self:start}
  body .list-filter-grid{grid-template-columns:minmax(240px,1.4fr) repeat(2,minmax(140px,1fr));}
  .reset-filters{grid-column:auto}
  body .summary-strip{grid-template-columns:repeat(5,minmax(110px,1fr))}
}