/* Единый вид · правки по комментариям 17.10 (общие для всех списков). Грузится последним. */

/* 1. Компактный фильтр везде, и на компьютере: строка «Поиск · Фильтр · Найти», остальное — по кнопке «Фильтр» */
html[data-theme] body .has-mfilter>:is(.search-field,.field:first-of-type,.pf-q,.mkk-q)>label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media(min-width:768px){
  html[data-theme] body .filter-panel:has(.has-mfilter){padding:0;border:0;background:transparent;box-shadow:none}
  html[data-theme] body .filter-panel:has(.has-mfilter:not(.is-open))>:is(.period-bar,.date-range){display:none!important}
  html[data-theme] body .filter-panel:has(.has-mfilter.is-open)>.period-bar{margin-top:10px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
  html[data-theme] body .filter-panel:has(.has-mfilter.is-open)>.date-range{margin-top:10px}
  html[data-theme] body .has-mfilter{display:flex!important;flex-wrap:wrap;gap:8px!important;align-items:center;grid-template-columns:none!important}
  html[data-theme] body .has-mfilter>*{order:5}
  html[data-theme] body .has-mfilter>:is(.search-field,.field:first-of-type,.pf-q,.mkk-q){order:1;flex:1 1 280px!important;margin:0;min-width:0}
  html[data-theme] body .has-mfilter>.mf-toggle{display:inline-flex!important;order:2;flex:0 0 auto!important;min-width:120px;justify-content:center;height:44px;min-height:44px;margin:0}
  html[data-theme] body .has-mfilter>.mf-submit{order:3;flex:0 0 120px!important;height:44px;min-height:44px;margin:0}
  html[data-theme] body .has-mfilter>.mf-submit .button,html[data-theme] body .has-mfilter>.mf-submit.button{width:100%}
  html[data-theme] body .has-mfilter>.mkk-filter-btns{display:flex;gap:8px;order:3}
  html[data-theme] body .has-mfilter>.mf-more{display:none!important;order:4;flex:1 1 100%}
  html[data-theme] body .has-mfilter.is-open>.mf-more{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
  html[data-theme] body .has-mfilter.is-open>.mf-toggle{border-color:var(--primary);color:var(--primary)}
  html[data-theme] body .has-mfilter .mf-more>*{width:100%;min-width:0;margin:0}
  html[data-theme] body .has-mfilter .mf-more select{width:100%}
}

/* 2. Строка над списком: «Найдено: N» слева, бледная сортировка справа */
html[data-theme] body .list-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0 8px;min-height:44px}
html[data-theme] body .list-bar .list-count{color:var(--muted);font-size:13.5px}
html[data-theme] body .list-bar .list-bar-end{display:flex;align-items:center;gap:6px;margin-left:auto}

/* 3. Карточка записи в списке: метка/статус — правый верхний угол; внизу человек слева, дата справа крупно */
html[data-theme] body .rec-card{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"title badge" "body body" "who date";gap:6px 12px;align-items:start}
html[data-theme] body .rec-card>.rec-title{grid-area:title;margin:0;font-size:15.5px;font-weight:700;line-height:1.35;min-width:0}
html[data-theme] body .rec-card>.rec-badge{grid-area:badge;justify-self:end}
html[data-theme] body .rec-card>.rec-body{grid-area:body;color:var(--muted);font-size:13.5px;min-width:0}
html[data-theme] body .rec-card>.rec-who{grid-area:who;align-self:end;color:var(--muted);font-size:13px;min-width:0}
html[data-theme] body .rec-card>.rec-date{grid-area:date;justify-self:end;align-self:end;font-size:16px;font-weight:750;font-variant-numeric:tabular-nums;white-space:nowrap}
html[data-theme] body .rec-card>.rec-date.is-late{color:var(--danger,#e5484d)}

/* 4. Заголовки групп в списках — обычные, без капса и цвета: «Название · N» */
html[data-theme] body .group-title{margin:18px 0 8px;font-size:17px;font-weight:700;color:var(--ink);text-transform:none;letter-spacing:0}
html[data-theme] body .group-title .group-n{color:var(--muted);font-weight:600}
/* Телефон: тоже одной строкой «Поиск · Фильтр · Найти» во всех разделах */
@media(max-width:767px){
  html[data-theme] body .has-mfilter>:is(.search-field,.field:first-of-type,.pf-q,.mkk-q){flex:1 1 0!important;min-width:0}
  html[data-theme] body .has-mfilter>:is(.mf-toggle,.mf-submit){flex:0 0 auto!important;width:auto;min-width:0;padding:0 14px}
  html[data-theme] body .has-mfilter>.mf-submit .button{width:auto;padding:0 14px}
}

/* 5. Телефон (правки 17.10, вечер): поиск и фильтры свёрнуты в бледную лупу рядом с сортировкой; открываются по нажатию */
@media(max-width:767px){
  html[data-theme] body .mf-phone.mf-collapsed{display:none!important}
  html[data-theme] body .mf-phone{margin-bottom:10px}
}
html[data-theme] body .mf-open{position:relative;display:grid;place-items:center;width:40px;height:40px;padding:0;border:0;border-radius:12px;background:none;color:var(--muted);opacity:.72;cursor:pointer;-webkit-tap-highlight-color:transparent}
html[data-theme] body .mf-open .ui-icon{width:22px;height:22px;stroke-width:1.6}
html[data-theme] body .mf-open.is-head{width:44px;height:44px}
html[data-theme] body .mf-open.is-head .ui-icon{width:26px;height:26px}
html[data-theme] body .mf-open:is(.is-on,.is-open,:hover){opacity:1;color:var(--primary)}
html[data-theme] body .mf-open .mf-dot{position:absolute;top:8px;right:7px;width:7px;height:7px;border-radius:50%;background:var(--primary)}
html[data-theme] body .list-bar-end>.mf-open+.sort-menu>summary{margin-left:-4px}

/* 6. Переключатель «Список / Доска» — две маленькие иконки вместо крупных кнопок с текстом */
html[data-theme] body .list-bar-end>.scope-switch.view-switch,html[data-theme] body .scope-switch.view-switch{display:inline-flex;flex:none;height:36px;padding:2px;gap:2px;border-radius:10px;box-sizing:border-box}
html[data-theme] body .scope-switch.view-switch a{display:grid;place-items:center;width:34px;height:30px;min-height:0;padding:0;border-radius:8px;color:var(--muted)}
html[data-theme] body .scope-switch.view-switch a .ui-icon{width:18px;height:18px;stroke-width:1.7}
html[data-theme] body .scope-switch.view-switch a.is-active,html[data-theme] body .scope-switch.view-switch a.is-active:hover{background:var(--soft,#eef0ff);color:var(--primary);box-shadow:none}
html[data-theme="dark"] body .scope-switch.view-switch a.is-active{background:#ffffff14}

/* РПЦ: логотип в шапке и на входе — иконка приложения вместо значка-календаря */
html[data-theme] body .brand-mark.has-logo{background:none!important;padding:0;overflow:hidden}
html[data-theme] body .brand-mark.has-logo img{width:100%;height:100%;display:block}
/* РПЦ: профиль — ровная сетка 3×2 (Фамилия · Имя · Отчество / Станция · Почта · Сохранить), подписи на одной линии */
html[data-theme] body .profile-compact-grid{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}
html[data-theme] body .profile-compact-grid .profile-compact-save{align-self:start;padding-top:27px}
html[data-theme] body .profile-compact-grid .profile-email{min-height:44px;display:flex;align-items:center;margin:0}
@media(max-width:900px){html[data-theme] body .profile-compact-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){html[data-theme] body .profile-compact-grid{grid-template-columns:1fr}html[data-theme] body .profile-compact-grid .profile-compact-save{padding-top:0}}
/* 18.10: «Церковный календарь» — в одну строку: чуть плотнее буквы */
html[data-theme] body .side-nav .nav-tight{letter-spacing:-.022em}
/* 18.10: меню на телефоне — шире, без прокрутки вбок, подписи в одну строку */
@media(max-width:767px){html[data-theme] body .sidebar{width:min(272px,86vw);overflow-x:hidden}}
/* ПРАВИЛО (18.10): по ширине (justify) — только широкие абзацы (от ~480px). На телефоне, в окнах и узких колонках —
   по левому краю, иначе между словами растягиваются дыры. Селекторы повторяют правило в unify.css (та же специфичность, файл позже). */
@media(max-width:767px){
 html[data-theme] body :is(main,dialog) p:is(.meta,.subtitle,.help),html[data-theme] body main :is(.card,.dashboard-panel-head,.tg-head,.idea-card) p,
 html[data-theme] body .push-card>.meta,html[data-theme] body .push-card .small-disclosure p,html[data-theme] body .push-card>.push-help,html[data-theme] body .rec-keep-note{text-align:left;hyphens:manual;-webkit-hyphens:manual}
}
html[data-theme] body dialog :is(p,p.meta,p.help,p.subtitle),html[data-theme] body main .card p.essence-text,html[data-theme] body main :is(.dash-tile,.essence-main) p{text-align:left}
/* Ссылка с иконкой («Открыть в Яндекс Картах» и т. п.): иконка по центру строки текста */
html[data-theme] body a.text-link:has(>.ui-icon){display:inline-flex;align-items:center;gap:6px;vertical-align:middle}
html[data-theme] body a.text-link>.ui-icon{flex:none;width:16px;height:16px;margin:0}
/* Плитки показателей: подпись — до двух строк целиком, без многоточия */
html[data-theme] body .kpi-row .kpi-label{display:block;overflow:visible;-webkit-line-clamp:unset;white-space:normal;overflow-wrap:break-word;text-wrap:balance}
@media(max-width:767px){html[data-theme] body .kpi-row .kpi-tile{height:auto;min-height:118px;justify-content:flex-start}html[data-theme] body .kpi-row .kpi-hint{flex:none;line-height:1.3}}
/* Главная руководителя, «Задачи»: в ленте видна одна карточка целиком и край следующей (затухает) — без обрезанного текста «Про…» */
html[data-theme] body .tw-scroll{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 30px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 30px),transparent)}
html[data-theme] body .tw-scroll>.tw-task{flex:0 0 calc(100% - 40px)}
html[data-theme] body .tw-scroll>.tw-task:only-child{flex-basis:100%}
html[data-theme] body .tw-scroll:has(>.tw-task:only-child){-webkit-mask-image:none;mask-image:none}
/* Протоколы: плашка статуса — по высоте текста, а не во всю высоту заголовка */
html[data-theme] body .proto-item .proto-item-status{align-items:flex-start}
html[data-theme] body .proto-item .proto-item-status>.status{align-self:flex-start;height:auto}
/* Шапка телефона: «Пространство РПЦ МБ» целиком, на совсем узких (<375px) — без «МБ» */
@media(max-width:374px){html[data-theme] body .topbar .brand-mb{display:none}}

/* 19.10 Скорость «как у приложения» (переходы без вспышки — @view-transition в unify.css):
   мгновенный отклик на нажатие — тонкая полоска загрузки сверху, пока открывается следующая страница. */
html.is-navigating::after{content:"";position:fixed;left:0;top:0;height:3px;width:100%;z-index:10000;pointer-events:none;
  background:linear-gradient(90deg,transparent 0,var(--primary) 40%,var(--primary) 60%,transparent 100%);background-size:50% 100%;background-repeat:no-repeat;
  animation:nav-progress 1s ease-in-out infinite}
@keyframes nav-progress{0%{background-position:-50% 0}100%{background-position:150% 0}}
@media(prefers-reduced-motion:reduce){html.is-navigating::after{animation:none;background:var(--primary);opacity:.6}}
/* нажатая ссылка меню и плитка — сразу видно, что нажатие принято */
html[data-theme] body .side-nav a:active,html[data-theme] body .rec-card:active,html[data-theme] body a.card:active{opacity:.7}
/* меню телефона закрывается мгновенно при выборе раздела (без анимации и без «переезда» в смене страниц) */
html.nav-instant body .sidebar,html.nav-instant body .nav-overlay{transition:none!important;animation:none!important}
@media(max-width:767px){html[data-theme] body #sidebar{view-transition-name:none}}
/* Выбор сотрудников (несколько) — поле как селект, меню в стиле «⋯» (20.10, задачи: исполнители и контролирующие) */
html[data-theme] body .people-pick{position:relative}
html[data-theme] body .people-pick-sum{list-style:none;display:flex;align-items:center;gap:8px;min-height:44px;padding:0 12px 0 14px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--muted);font-size:15px;cursor:pointer;-webkit-tap-highlight-color:transparent}
html[data-theme] body .people-pick-sum::-webkit-details-marker{display:none}
html[data-theme] body .people-pick.has-value .people-pick-sum{color:var(--ink)}
html[data-theme] body .people-pick-text{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-theme] body .people-pick-sum .ui-icon{width:18px;height:18px;flex:none;color:var(--muted);transition:transform .15s}
html[data-theme] body .people-pick[open] .people-pick-sum{border-color:var(--primary)}
html[data-theme] body .people-pick[open] .people-pick-sum .ui-icon{transform:rotate(180deg)}
html[data-theme] body .people-pick-menu{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:40;padding:6px;display:grid;gap:4px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 12px 32px rgba(15,23,42,.16)}
html[data-theme] body .people-pick-search{height:40px!important;min-height:40px!important;margin:2px 2px 4px;font-size:14px}
html[data-theme] body .people-pick-list{display:grid;gap:2px;max-height:min(320px,48vh);overflow:auto;overscroll-behavior:contain}
html[data-theme] body .people-pick-row{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 10px;border-radius:8px;color:var(--ink);font-size:15px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent}
html[data-theme] body .people-pick-row:hover{background:var(--soft)}
html[data-theme] body .people-pick-row[hidden]{display:none}
html[data-theme] body .people-pick-row>input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
html[data-theme] body .people-pick-check{flex:none;width:20px;height:20px;border:1.5px solid var(--line);border-radius:6px;display:grid;place-items:center;background:var(--surface)}
html[data-theme] body .people-pick-row>input:checked+.people-pick-check{background:var(--primary);border-color:var(--primary)}
html[data-theme] body .people-pick-row>input:checked+.people-pick-check::after{content:"";width:10px;height:6px;border:2px solid #fff;border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg)}
html[data-theme] body .people-pick-row>input:focus-visible+.people-pick-check{outline:2px solid var(--primary);outline-offset:2px}
html[data-theme] body .people-pick-name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-theme] body .people-pick-empty{margin:8px 10px;color:var(--muted);font-size:14px}
html[data-theme] body .people-pick-done{min-height:44px;margin-top:2px;border:0;border-radius:8px;background:var(--soft);color:var(--primary);font:inherit;font-size:15px;font-weight:650;cursor:pointer}
html[data-theme] body .people-pick-all{border-bottom:1px solid var(--line);border-radius:8px 8px 0 0;margin-bottom:2px}
html[data-theme] body .people-pick-note{flex:none;color:var(--muted);font-size:13px;font-weight:500}
/* Новая задача: «Срочно» — красный значок в шапке (на строке «← Задачи»), плашка «Срочно» справа на строке заголовка */
html[data-theme] body .head-urgent-btn{display:block;box-sizing:border-box;width:44px;height:44px;padding:10px;border:0;border-radius:12px;background:none;color:#e5484d;cursor:pointer;-webkit-tap-highlight-color:transparent}
html[data-theme] body .head-urgent-btn svg{display:block;width:24px;height:24px;margin:0 auto}
html[data-theme] body .head-urgent-btn:hover{background:color-mix(in srgb,#e5484d 10%,transparent)}
html[data-theme] body .head-urgent-btn.is-on{background:#e5484d;color:#fff}
html[data-theme] body .head-urgent-btn.is-on svg{fill:none;stroke-width:2}
html[data-theme] body .task-form-heading>.head-status[hidden]{display:none}
html[data-theme] body .task-form-heading>.head-status{top:6px}
/* Новая задача: «Напомнить в Telegram» и «Повторять» — компактные плашки (20.10) */
html[data-theme] body .tf-extra{padding:10px 14px;border-radius:12px}
html[data-theme] body .tf-switch{align-items:center;gap:10px;min-height:40px}
html[data-theme] body .tf-switch input{width:20px;height:20px;margin:0}
html[data-theme] body .tf-switch span{gap:1px}
html[data-theme] body .tf-switch b{font-size:15px;line-height:1.25}
html[data-theme] body .tf-switch small{font-size:12.5px;font-weight:500;line-height:1.3}
html[data-theme] body .tf-extra-body{margin-top:10px}
html[data-theme] body .tf-extras{gap:8px}
