/* Документы, планы, процессы, уведомления, синтетики. */
/* Ф4 бюджет-прорахунку: /documents — дерево підпапок пайплайну + вміст. */
.doc-folder-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); gap: var(--space-sm); }
.doc-folder-card {
    display: flex; flex-direction: column; gap: var(--space-xs);
    padding: var(--space-md); border: 0.09375rem solid var(--border);
    background: var(--bg-surface); color: inherit; text-decoration: none;
}
.doc-folder-card--done { border-color: var(--success); }
.doc-folder-req { color: var(--secondary); margin-left: 0.2rem; }
.doc-folder-card-count { font-family: var(--font-mono); color: var(--text-muted); font-size: var(--fs-xl); }
.doc-folder-head { display: flex; align-items: center; gap: var(--space-md); margin-bottom: var(--space-md); }
.doc-folder-back { color: var(--primary); text-decoration: none; font-weight: 600; }
.doc-folder-head-name { font-weight: 600; font-size: var(--fs-lg); }
.doc-folder-upload { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-sm); margin-bottom: var(--space-lg); }
.doc-folder-upload .file-field { flex: 1 1 16rem; }
.doc-upload-progress-wrap { display: flex; align-items: center; gap: var(--space-sm); width: 100%; }
.doc-upload-progress-bar { flex: 1; height: 0.4rem; background: var(--bg-elevated); }
.doc-upload-progress-bar span { display: block; height: 100%; width: 0; background: var(--primary); transition: width 0.15s ease; }
.doc-upload-progress-label { font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--text-secondary); white-space: nowrap; }
.doc-file-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr)); gap: var(--space-sm); }
.doc-file-card { display: flex; flex-direction: column; gap: 0.2rem; }
.doc-file-thumb {
    display: flex; align-items: center; justify-content: center;
    aspect-ratio: 1; background: var(--bg-elevated); overflow: hidden;
}
.doc-file-thumb img { width: 100%; height: 100%; object-fit: cover; }
.doc-file-icon { width: 2rem; height: 2rem; color: var(--text-muted); }
.doc-file-name { font-size: var(--fs-xs); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.doc-file-meta { font-size: var(--fs-xs); color: var(--text-muted); }
.doc-file-del { margin-top: 0.15rem; }
/* ── Блочна форма анкети (/form/blocks) ───────────────────────────────────
   Рядок = питання | відповідь | коментар. На десктопі три колонки, на
   телефоні стовпчиком. Приглушена секція (ворота «ні») лишає видимим тільки
   сам рядок воріт: решта згорнута, а не схована — щоб було видно, ЩО пропущено. */
/* ── Реєстр документів об'єкта зі сховища (dreg) ─────────────────────────
   Рядки, не картки: папка = рядок з кількістю праворуч, файл = тип, назва,
   розмір, дата в колонках; фото контактним аркушем без рамок. Один акцент —
   поточна ланка шляху. */
.fb,
.dreg { max-width: 64rem; }
.footer-logout-btn, .footer-pwa-btn, .fm-onboarding-layer, .fm-onboarding-layer * { font-family: var(--font-sans); text-transform: none; letter-spacing: 0; }
/* Підписи полів — тим самим шрифтом, строчними. */
.form-label { font-family: var(--font-sans); font-size: var(--fs-sm); text-transform: none; letter-spacing: 0; color: var(--text-secondary); }
/* Одна кнопка на весь дім: контурна. Разові класи успадковують її вигляд. */
.cle-del, .tb-move, .fb-mode, .cpe-rule-add, .cpe-add-in-group, .fb-note-btn, .cle-mv, .sc-tool, .fm-density-btn {
    font-family: var(--font-sans); font-size: var(--fs-sm); font-weight: 600; text-transform: none; letter-spacing: 0;
    border: 0.0625rem solid var(--text-primary); background: transparent; color: var(--text-primary); border-radius: 0; cursor: pointer;
}
code,
pre,
kbd,
.code { font-family: 'JetBrains Mono', 'SF Mono', monospace; }
/* Бирки на картках об'єктів: номер і категорія — нейтральні, помаранч лише сигнал. */
.sc-id { background: var(--text-primary); color: var(--bg-base); border: 0; }
.sc-cat { border-color: var(--border); color: var(--text-secondary); background: transparent; }
.fv-count { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-3, 1.125rem); }
.fv-mode { padding: 0.35rem 0.8rem; color: var(--text-primary); text-decoration: none; font-size: var(--micro-size); min-height: 2.25rem; display: inline-flex; align-items: center; }
.fv-tile { display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.fv-img { display: block; aspect-ratio: 4 / 3; background: var(--bg-elevated); overflow: hidden; }
.fv-img img,
.dreg-shot img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fv-noimg { display: flex; align-items: center; justify-content: center; height: 100%; color: var(--text-muted); font-size: var(--micro-size); }
.fv-tile-body { display: block; padding: var(--space-sm) var(--space-md); border-top: 0.0625rem solid var(--border); }
.fv-tile-name { display: block; font-family: var(--font-display); font-weight: 600; font-size: var(--fs-lg); margin-bottom: 0.35rem; }
.fv-new { font-style: normal; font-weight: 500; font-size: var(--micro-size); color: var(--hazard-text, var(--primary)); margin-left: 0.4rem; }
.fv-mini { width: 100%; border-collapse: collapse; font-size: var(--micro-size); }
.fv-nr { color: var(--text-muted); font-weight: 400; }
.fv-list { border-top: 0.0625rem solid var(--text-primary); }
.fv-row { display: grid; grid-template-columns: minmax(10rem, 2fr) repeat(auto-fit, minmax(5rem, 1fr)); gap: 0.5rem; align-items: center;
  padding: 0.6rem 0.25rem; border-bottom: 0.0625rem solid var(--border); text-decoration: none; color: inherit; min-height: 2.75rem; }
.fv-row--head { font-size: var(--micro-size); color: var(--text-muted); padding: 0.3rem 0.25rem; }
.fv-name { font-weight: 600; }
/* 09.10: линии между ячейками рисует промежуток сетки (фон = цвет линии), а не рамки ячеек — рамки
   рвались при раскладке 2×2 на телефоне. Колонок ровно 2 или 4, пустых ячеек цвета линии не бывает. */
.fv-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.0625rem; margin: var(--space-lg) 0 0; border: 0.0625rem solid var(--text-primary); background: var(--text-primary); }
@media (min-width: 48em) {
    .fv-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 47.99em) {
    .fv-row { grid-template-columns: 1fr; gap: 0.2rem; }
    .fv-row--head { display: none; }
    .fv-cell { display: flex; justify-content: space-between; font-size: var(--micro-size); }
}
.cat-link span { display: block; font-size: var(--micro-size); color: var(--text-secondary); margin-top: 0.15rem; }
.imp-progress-sec,
.sch-cmt span { font-family: var(--font-mono); color: var(--text-primary); }
/* Помилка — текстом і вагою, не кольоровою кромкою (каталог ШІ-патернів, п.1). */
.imp-banner--err { color: var(--late, var(--secondary)); font-weight: 600; }
/* Документи зі сховища клієнта (storage.rs): джерело, стан, кнопка синхронізації. */
.doc-storage { display: flex; flex-wrap: wrap; gap: var(--space-sm) var(--space-md); align-items: center; margin: 0 0 var(--space-md); padding: var(--space-sm) var(--space-md); background: var(--bg-surface); border: 0.0625rem solid var(--border); font-size: var(--fs-sm); }
.doc-storage-sync { margin-left: auto; }
/* Етап: години, строк, «не вписуємось» (Артьом 25.09.2026). Новий етап без файлу. */
.sph-hours, .sph-deadline { font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--text-secondary); white-space: nowrap; }
.sph-late { font-size: var(--fs-xs); font-weight: 600; color: var(--white); background: var(--hazard-text, var(--secondary)); padding: 0.1rem 0.4rem; white-space: nowrap; }
.doc-folder-grid { margin-bottom: var(--space-md); }
.dreg-head { margin: var(--space-sm) 0 var(--space-lg); }
.dreg-path { margin: 0; font-size: var(--fs-xl); font-weight: 600; line-height: 1.3; letter-spacing: -0.01em; }
.dreg-path a,
.td-site a { color: var(--text-secondary); text-decoration: none; }
.dreg-path a:hover, .dreg-path a:focus-visible { color: var(--text-primary); text-decoration: underline; text-underline-offset: 0.2em; }
.dreg-path a[aria-current="page"] { color: var(--text-primary); }
.dreg-sep { color: var(--text-muted); margin: 0 0.35em; font-weight: 400; }
.dreg-src { margin: 0.35rem 0 0; font-size: var(--fs-xs); color: var(--text-muted); display: flex; flex-wrap: wrap; gap: 0 var(--space-md); align-items: baseline; }
.dreg-inline-form,
.sch-assign-form { display: inline; margin: 0; }
.dreg-textbtn { background: none; border: 0; padding: 0; min-height: var(--tap-target); display: inline-flex; align-items: center; font: inherit; font-size: var(--fs-sm); color: var(--text-primary); cursor: pointer; text-decoration: underline; text-underline-offset: 0.2em; text-decoration-color: var(--text-muted); }
.dreg-textbtn:hover, .dreg-textbtn:focus-visible { text-decoration-color: var(--primary); }
.dreg-textbtn--muted { color: var(--text-muted); font-size: var(--fs-xs); text-decoration: none; }
.dreg-textbtn--muted:hover { color: var(--hazard-text, var(--secondary)); text-decoration: underline; }
.dreg-folders { list-style: none; margin: 0 0 var(--space-lg); padding: 0; border-top: 0.0625rem solid var(--border); }
.dreg-folder { display: flex; align-items: baseline; gap: var(--space-md); padding: 0.7rem 0.25rem; border-bottom: 0.0625rem solid var(--border); color: var(--text-primary); text-decoration: none; font-size: var(--fs-md); }
.dreg-folder-n { font-variant-numeric: tabular-nums; color: var(--text-muted); min-width: 3ch; text-align: right; }
.dreg-folder::after { content: "›"; color: var(--text-muted); }
.dreg-upload { margin: 0 0 var(--space-md); }
.dreg-upload > summary { list-style: none; display: inline; }
.dreg-upload-form { display: grid; grid-template-columns: 1fr 2fr auto; gap: var(--space-sm); align-items: center; margin-top: var(--space-sm); }
.dreg-files { width: 100%; border-collapse: collapse; border-top: 0.0625rem solid var(--border); font-size: var(--fs-sm); }
.dreg-files td { padding: 0.55rem 0.25rem; border-bottom: 0.0625rem solid var(--border); vertical-align: baseline; }
.dreg-type { width: 3.5rem; font-size: var(--fs-xs); color: var(--text-muted); letter-spacing: 0.02em; }
.dreg-name { max-width: 0; }
.dreg-name a { color: var(--text-primary); text-decoration: none; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dreg-name a:hover, .dreg-name a:focus-visible { text-decoration: underline; text-underline-offset: 0.2em; }
.dreg-size, .dreg-date { width: 6rem; text-align: right; color: var(--text-secondary); font-variant-numeric: tabular-nums; white-space: nowrap; }
.dreg-act { width: 5rem; text-align: right; }
.dreg-sheet { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); gap: 0.25rem; }
.dreg-shot { position: relative; aspect-ratio: 1; background: var(--bg-surface); }
.dreg-shot a { display: block; width: 100%; height: 100%; }
.dreg-shot-ext { display: flex; align-items: center; justify-content: center; height: 100%; color: var(--text-muted); font-size: var(--fs-sm); }
.dreg-shot a:focus-visible { outline: 0.1875rem solid var(--primary); outline-offset: -0.1875rem; }
.dreg-shot-del { position: absolute; top: 0.25rem; right: 0.25rem; margin: 0; opacity: 0; transition: opacity var(--dur-fast, 0.15s); }
.dreg-shot-del button { width: 1.75rem; height: 1.75rem; border: 0; background: rgba(0,0,0,0.6); color: var(--white); cursor: pointer; font-size: var(--fs-sm); }
@media (max-width: 47.99em) {
    .dreg-upload-form { grid-template-columns: 1fr; }
    .dreg-sheet { grid-template-columns: repeat(3, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
    .dreg-shot-del { transition: none; }
}
@media (hover: none) {
    /* Пристрої без наведення (Фрейн, гл.3 `hover`): те, що відкривається лише
       наведенням, на телефоні недосяжне — кнопка видалення фото видима завжди. */
    .dreg-shot-del { opacity: 1; }
}
/* ── Індикатори горизонтальної прокрутки таблиці графіка ─────────────────
   За Френом (benfrain.com, 13.02.2026): тіні звичайним background-attachment
   не працюють, коли рядки мають фон; тут липкі псевдоелементи по краях
   скролера, а їхня прозорість керується прокруткою через animation-timeline.
   Без підтримки animation-timeline індикаторів просто нема (прогресивне
   покращення). Порядок важливий: animation-timeline ПІСЛЯ animation. */
/* ── Плани об'єкта: список, імпорт із PDF з вибором листів ─────────────── */
.pl-site { margin: -0.25rem 0 var(--space-md); font-size: var(--fs-sm); }
.pl-upload { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-sm); margin-bottom: var(--space-lg); }
.pl-upload-hint { margin: 0; font-size: var(--fs-xs); color: var(--text-muted); }
.pl-list { list-style: none; margin: 0; padding: 0; border-top: 0.0625rem solid var(--border); counter-reset: plan; }
.pl-row { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: var(--space-sm) var(--space-md); align-items: center; padding: var(--space-sm) 0; border-bottom: 0.0625rem solid var(--border); }
.pl-thumb { display: block; aspect-ratio: 4 / 3; background: var(--bg-surface); overflow: hidden; }
.pl-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pl-body { min-width: 0; display: grid; gap: 0.25rem; }
.pl-rename { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-sm); align-items: center; }
.pl-meta { font-size: var(--fs-xs); color: var(--text-muted); }
.pl-act { grid-column: 1 / -1; display: flex; gap: var(--space-md); align-items: center; }
.pl-mv { background: none; border: 0.0625rem solid var(--border); width: var(--tap-target); height: var(--tap-target); cursor: pointer; color: var(--text-primary); }
/* Нотатка видимості (visibility_rules): звичайний рядок тексту, без кромок і бейджів. */
.pl-pick-hint,
.vis-note { margin: 0 0 var(--space-sm); font-size: var(--fs-sm); color: var(--text-secondary); }
.pl-sheet { list-style: none; margin: 0 0 var(--space-md); padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); gap: var(--space-sm); }
.pl-page { display: grid; gap: 0.25rem; }
.pl-page-img { position: relative; display: block; aspect-ratio: 4 / 3; background: var(--bg-surface); border: 0.125rem solid var(--border); cursor: pointer; overflow: hidden; }
.pl-page-img img { width: 100%; height: 100%; object-fit: contain; display: block; }
.pl-page-img input { position: absolute; top: 0.4rem; left: 0.4rem; width: 1.5rem; height: 1.5rem; margin: 0; accent-color: var(--primary); }
.pl-page-n { position: absolute; right: 0.3rem; bottom: 0.2rem; font-size: var(--fs-xs); color: var(--text-muted); background: var(--bg-surface); padding: 0 0.3rem; }
.pl-page-name { font-size: var(--fs-xs); }
@media (min-width: 48em) {
    .pl-upload { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) auto; align-items: center; }
    .pl-upload-hint, .pl-upload .imp-progress { grid-column: 1 / -1; }
    .pl-row { grid-template-columns: 7rem minmax(0, 1fr) auto; }
    .pl-act { grid-column: auto; }
}
/* Відповідальний у рядку задачі і бейдж «без відповідального» на етапі. */
.sph-unassigned { font-size: var(--fs-xs); color: var(--text-secondary); border: 0.0625rem solid var(--border); padding: 0.1rem 0.4rem; white-space: nowrap; }
.td-table td { vertical-align: top; }
.sph-forecast { font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--text-secondary); white-space: nowrap; }
.sph-forecast--late { color: var(--hazard-text, var(--secondary)); }
@media (max-width: 47.99em) {
    .td-who,
    .dreg-size,
    .gph-axis .gph-id,
    .proc-table thead,
    .proc-table td.proc-main::before { display: none; }
}
/* Газета ЗАВЖДИ біла, як The New York Times (Артьом 27.09: «в белой теме как
   Нью-Йорк Таймс»), незалежно від теми застосунку: це аркуш паперу, покладений
   на темний стіл. Тому токени тут не перемикаються за prefers-color-scheme. */
.np {
    color-scheme: light;
    --np-paper: var(--white);
    --np-ink: #121212;
    --np-body: #333333;
    --np-muted: #5a5a5a;
    --np-hair: #dfdfdf;
    --np-accent: #326891;
    --np-display: 'Playfair Display', 'Times New Roman', serif;
    --np-text: 'PT Serif', Georgia, serif;
    background: var(--np-paper);
    color: var(--np-ink);
    font-family: var(--np-text);
    font-size: var(--fs-md);
    line-height: 1.55;
    max-width: 82rem;
    margin-inline: auto;
    padding: var(--space-md);
    box-shadow: 0 0.125rem 1.5rem rgb(0 0 0 / 0.25);
}
/* Шапка: вушка з номером і датою, назва, девіз, подвійна лінія. */
.np-mast { text-align: center; border-bottom: 0.1875rem double var(--np-ink); padding-bottom: var(--space-sm); margin-bottom: var(--space-md); }
.np-ear { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.25rem var(--space-md); font-size: var(--fs-xs); letter-spacing: 0.08em; text-transform: uppercase; color: var(--np-muted); border-block: 0.0625rem solid var(--np-ink); padding-block: 0.3rem; }
/* Шапка готичним, як у NYT і в зразку (The Karen Times). Готика вільних шрифтів
   лише латинська, тож назва — бренд латиницею; кирилиця впаде в Playfair. */
.np-title { font-family: 'UnifrakturMaguntia', var(--np-display); font-weight: 400; font-size: clamp(2.2rem, 1rem + 6vw, 5.75rem); line-height: 1.05; letter-spacing: 0; margin: var(--space-sm) 0 0.35rem; text-wrap: balance; }
.np-motto { font-style: italic; color: var(--np-muted); font-size: var(--fs-sm); }
.np-tools { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-sm); margin-top: var(--space-xs); font-size: var(--fs-xs); }
.np-link { background: none; border: 0; padding: 0; color: inherit; font: inherit; text-decoration: underline; text-underline-offset: 0.15em; cursor: pointer; }
.np-note { font-style: italic; color: var(--np-muted); }
/* Перша шпальта. */
.np-front { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-lg); }
.np-headline { font-family: var(--np-display); font-weight: 700; font-size: clamp(1.6rem, 1rem + 2.6vw, 3rem); line-height: 1.08; margin: 0 0 var(--space-sm); text-wrap: balance; }
.np-lede { font-size: var(--fs-lg); font-style: italic; line-height: 1.4; margin: 0 0 var(--space-md); text-wrap: pretty; }
.np-photo { margin: 0 0 var(--space-md); }
.np-photo img { display: block; width: 100%; height: auto; max-height: 34rem; object-fit: cover; }
.np-body { columns: 17rem; column-gap: var(--space-lg); column-rule: 0.0625rem solid var(--np-hair); hyphens: auto; }
.np-side { display: grid; gap: var(--space-md); align-content: start; }
.np-box { border-top: 0.1875rem solid var(--np-ink); padding-top: var(--space-xs); }
.np-kicker { font-family: var(--np-text); font-weight: 700; font-size: var(--fs-xs); letter-spacing: 0.12em; text-transform: uppercase; margin: 0 0 var(--space-xs); }
.np-nums { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-xs) var(--space-md); margin: 0; }
/* Розділи нижче шпальти. */
.np-sec { border-top: 0.0625rem solid var(--np-ink); margin-top: var(--space-lg); padding-top: var(--space-xs); }
.np-cols { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); gap: var(--space-md) var(--space-lg); }
.np-item { border-bottom: 0.0625rem solid var(--np-hair); padding-bottom: var(--space-sm); min-width: 0; }
.np-item-title { font-family: var(--np-display); font-weight: 700; font-size: var(--fs-lg); line-height: 1.2; margin: 0 0 0.3rem; }
.np-meta { display: block; font-size: var(--fs-xs); color: var(--np-muted); font-variant-numeric: lining-nums; }
.np-table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.np-table td, .np-table th { padding: 0.35rem 0.5rem 0.35rem 0; border-bottom: 0.0625rem solid var(--np-hair); vertical-align: top; text-align: left; }
.np-when { white-space: nowrap; font-variant-numeric: lining-nums tabular-nums; width: 1%; }
.np-num { text-align: right !important; white-space: nowrap; font-variant-numeric: lining-nums tabular-nums; }
.np-list { list-style: none; margin: 0; padding: 0; columns: 17rem; column-gap: var(--space-lg); column-rule: 0.0625rem solid var(--np-hair); }
.np-foot { margin-top: var(--space-xl, 2rem); border-top: 0.1875rem double var(--np-ink); padding-top: var(--space-xs); font-size: var(--fs-xs); color: var(--np-muted); text-align: center; }
@media (min-width: 48em) {
    .np { padding: var(--space-lg); }
    /* По ширині лише там, де колонка широка: на телефоні justify рве рядок дірами. */
    .np-body { text-align: justify; }
    .np-front { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
    .np-side { border-left: 0.0625rem solid var(--np-hair); padding-left: var(--space-lg); }
    .pl-fromdoc select { grid-column: span 2; }
}
@media (min-width: 80em) {
    .np-front { grid-template-columns: minmax(0, 5fr) minmax(0, 2fr); }
}
@media print {
    .np { --np-paper: var(--white); --np-ink: var(--black); --np-muted: #444; --np-hair: #bbb; max-width: none; padding: 0; font-size: 10pt; }
    .np-front { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
    .np-side { border-left: 0.0625rem solid var(--np-hair); padding-left: 1rem; }
}
/* Портрети людей номера (27.09): колонка авторів як у NYT — коло, ім'я
   гарнітурою заголовків, під ним одна строка фактів. Без фото — монограма. */
.np-people { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); gap: var(--space-md) var(--space-lg); }
.np-person { display: grid; grid-template-columns: 4rem minmax(0, 1fr); gap: var(--space-sm); align-items: center; margin: 0; padding-bottom: var(--space-sm); border-bottom: 0.0625rem solid var(--np-hair); }
.np-face { width: 4rem; height: 4rem; border-radius: 50%; object-fit: cover; display: block; background: #f0f0f0; }
.np-face--mono { display: grid; place-items: center; font-family: var(--np-display); font-weight: 700; font-size: var(--fs-lg); color: var(--np-ink); border: 0.0625rem solid var(--np-ink); background: none; }
.np-person-name { display: block; font-family: var(--np-display); font-weight: 700; font-size: var(--fs-lg); line-height: 1.15; }
/* План з документів об'єкта (28.09): підпис над рядком, селект на дві колонки. */
.pl-fromdoc-label { grid-column: 1 / -1; font-size: var(--fs-sm); color: var(--text-secondary); }
.pl-upload [data-too-big] { grid-column: 1 / -1; margin: 0; }
/* Лист ще рендериться: сіра заглушка тієї ж пропорції (28.09). */
.pl-page-img img.pl-wait { aspect-ratio: 1.414; background: var(--bg-elevated); }
.pl-rename.is-failed .form-input { border-color: var(--danger, #b3261e); }
.gph-mon {
    position: absolute; top: 0; padding: 0.3rem 0 0 0.25rem;
    border-left: 0.0625rem solid var(--text-muted);
    font-family: var(--font-mono); font-size: var(--micro-size); color: var(--text-muted);
    white-space: nowrap; line-height: 1;
}
.ent-n,
.tsk-mine-meta { font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--text-muted); }
.ent-empty { margin: 0; color: var(--text-muted); font-size: var(--fs-sm); }
.ent-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-xs, 0.4rem); }
.ent-item { padding: var(--space-xs, 0.4rem) 0; border-bottom: 0.0625rem solid var(--border); overflow-wrap: anywhere; }
.ent-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.5rem; font-size: var(--fs-xs); }
.ent-when,
.pp-dl dt { color: var(--text-muted); font-family: var(--font-mono); font-size: var(--fs-xs); }
.ent-zone { font-size: var(--fs-xs); color: var(--primary); }
.ent-body { margin: 0.25rem 0 0; white-space: pre-wrap; font-size: var(--fs-sm); }
.ent-del { margin-top: 0.2rem; }
.ent-form { display: grid; gap: var(--space-xs, 0.4rem); }
.ent-form-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-xs, 0.4rem); }
.sch-cmt { display: inline-flex; align-items: center; gap: 0.15rem; color: var(--text-muted); font-size: var(--fs-xs); text-decoration: none; }
@media (min-width: 48em) {
    .ent-place-row,
    .ent-form-row:has(select) { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
}
/* Фото в коментарі (28.09): мініатюра до 20rem, тап відкриває оригінал. */
.ent-photo { display: block; margin-top: var(--space-xs, 0.4rem); max-width: min(20rem, 100%); }
.ent-photo-field { margin: 0; }
/* Синтетичні користувачі /settings/synth (28.09): реєстр рядків, без карток-цифр. */
.syn-lead { margin: 0 0 var(--space-md); color: var(--text-secondary); font-size: var(--fs-sm); }
.syn-filter { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-xs, 0.4rem); margin-bottom: var(--space-md); }
.syn-new { margin-bottom: var(--space-md); border: 0.0625rem solid var(--border); padding: 0.5rem 0.75rem; }
.syn-new summary { cursor: pointer; font-weight: 600; }
.syn-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.35rem; margin-top: 0.5rem; }
.syn-mono { font-family: var(--font-mono); font-size: var(--fs-xs); }
.syn-runbar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; margin-bottom: var(--space-sm); }
.syn-hint { font-size: var(--fs-xs); color: var(--text-muted); }
.syn-list { list-style: none; margin: 0; padding: 0; border-top: 0.0625rem solid var(--border); }
.syn-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.35rem; padding: 0.7rem 0; border-bottom: 0.0625rem solid var(--border); }
.syn-pick { display: flex; align-items: center; gap: 0.4rem; min-width: 0; }
.syn-key, .syn-ref { font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--text-muted); overflow-wrap: anywhere; }
.syn-main { min-width: 0; }
.syn-main p { margin: 0 0 0.2rem; }
.syn-goal { font-weight: 600; overflow-wrap: anywhere; }
.syn-meta, .syn-src, .syn-last, .syn-stuck, .syn-note, .syn-fb { font-size: var(--fs-xs); color: var(--text-secondary); overflow-wrap: anywhere; }
.syn-src { display: flex; flex-wrap: wrap; gap: 0.25rem 0.75rem; align-items: baseline; }
.syn-tag { font-family: var(--font-mono); text-transform: uppercase; letter-spacing: 0.04em; border: 0.0625rem solid var(--border); padding: 0 0.3rem; }
.syn-act { display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; }
.syn-clicks { list-style: none; margin: var(--space-md) 0 0; padding: 0; border-top: 0.0625rem solid var(--border); }
.syn-click { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); gap: 0.1rem 0.6rem; padding: 0.35rem 0; border-bottom: 0.0625rem solid var(--border); font-size: var(--fs-xs); }
.syn-click .syn-page, .syn-click .syn-what { grid-column: 2; overflow-wrap: anywhere; color: var(--text-secondary); }
@media (min-width: 48em) {
    .syn-filter,
    .sch-toolbar .sch-erow--add { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .syn-row { grid-template-columns: 9rem minmax(0, 1fr) auto; align-items: start; gap: 0.75rem; }
    .syn-act { flex-direction: column; align-items: flex-end; }
    .syn-click { grid-template-columns: 4.5rem 8rem minmax(0, 14rem) minmax(0, 1fr); }
}
/* Ключові поля картки сутності (29.09): реєстр «підпис — значення», без плиток. */
.ent-fields { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; margin: 0 0 var(--space-md); border-top: 0.0625rem solid var(--border); }
.ent-field { display: grid; grid-template-columns: minmax(0, 8rem) minmax(0, 1fr); gap: var(--space-sm); padding: 0.4rem 0; border-bottom: 0.0625rem solid var(--border); }
@media (min-width: 48em) {
    .ent-fields { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--space-lg); }
}
.pl-pick-tools { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-sm); margin: 0 0 var(--space-sm); }
.fb-doc-meta { font-family: var(--font-mono); font-size: var(--micro-size); color: var(--text-muted); }
.fb-doc-x { background: none; border: 0; padding: 0; color: var(--text-muted); text-decoration: underline; font-size: var(--micro-size); cursor: pointer; }
.fb-stage { margin-top: 0.25rem; font-size: var(--fs-sm); color: var(--text-secondary); }
.fb-stage-none { color: var(--text-muted); }
.fb-stage-mismatch { display: inline; white-space: nowrap; font-weight: 700; color: var(--text-primary); }
.sug-meta, .sug-more { font-family: var(--font-mono); font-size: var(--micro-size); color: var(--text-muted); }
.sug-picked { font-size: var(--micro-size); color: var(--text-secondary); }
.dsrv-sum { cursor: pointer; font-size: var(--fs-sm); color: var(--text-primary); text-decoration: underline;
    min-height: var(--tap-target); display: flex; align-items: center; }
.dsrv-q { width: 100%; min-width: 0; height: var(--tap-target); min-height: var(--tap-target); box-sizing: border-box; margin: var(--space-xs) 0; }
.dsrv-list { list-style: none; margin: 0; padding: 0; max-height: min(26rem, 60dvh); overflow-y: auto; overscroll-behavior: contain;
    border-top: 0.0625rem solid var(--border); }
.dsrv-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name act" "meta act";
    gap: 0.125rem var(--space-sm); align-items: center; width: 100%; min-height: var(--tap-target);
    padding: 0.5rem 0.25rem; background: none; border: 0; color: inherit; text-align: left; cursor: pointer; font: inherit; }
.dsrv-name { grid-area: name; font-size: var(--fs-sm); color: var(--text-primary); overflow-wrap: anywhere; }
.dsrv-meta { grid-area: meta; font-family: var(--font-mono); font-size: var(--micro-size); color: var(--text-muted); overflow-wrap: anywhere; }
.dsrv-act { grid-area: act; font-size: var(--fs-xs); color: var(--text-primary); text-decoration: underline; }
.dsrv-row[disabled] { opacity: 0.5; cursor: default; }
.dsrv-empty { padding: 0.5rem 0.25rem; font-size: var(--fs-sm); color: var(--text-muted); }
/* 29.09 (Артём, скрин анкети CV): рядки й шапка секції впирались у краї білої
   картки — правило вище (.fb-row padding 0) прибрало рамку, а фон bg-surface
   лишився. Повертаємо внутрішній відступ, поки фон білий. «Yes/No/N/A» не
   тягнувся, тож кнопка коментаря стояла посеред рядка, а не в колонці кнопок;
   дата була вища за текст (primitives input[type=date] min-height). */
.fb-group-sum, .fb-row { padding-left: var(--space-md); padding-right: var(--space-md); }
/* 29.09 (Артём, «тут все по краю»): хаб анкети — той самий аркуш, що й секція:
   біла поверхня, внутрішній відступ; підсвітка рядка більше не різала текст. */
.fb-hub { background: var(--bg-surface); }
.fb-hub-link { padding: 0.9rem var(--space-md); }
.sch-frame-hint, .sch-form-err { grid-column: 1 / -1; margin: 0; font-size: var(--fs-xs); color: var(--text-secondary); }
.sch-frame-hint--err, .sch-form-err { color: var(--late, #b3261e); font-weight: 600; }
.sch-oof { grid-column: 1 / -1; font-size: var(--fs-xs); color: var(--text-secondary); }
@media (min-width: 48em) {
    .sch-erow--add > .sch-field--site,
    .sch-erow--add > .sch-field:nth-child(2),
    .syn-click .syn-page,
    .syn-click .syn-what { grid-column: auto; }
}
@media (min-width: 80em) {
    .sch-toolbar .sch-erow--add { grid-template-columns: minmax(10rem, 1.6fr) minmax(12rem, 2fr) minmax(8.5rem, 1fr) minmax(8.5rem, 1fr) 4.5rem max-content; }
    .sch-erow--add > .sch-field--phase, .sch-erow--add > .sch-field--task, .sch-erow--add > .sch-field--site { grid-column: auto; }
}
.sch-tools { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.5rem; }
.sch-child > .sch-child-cap, .sch-child > .sch-field--task, .sch-child > .sch-field--site,
.sch-child > .sch-child-act, .sch-child > .sch-frame-hint { grid-column: 1 / -1; }
@media (max-width: 78.99em) {
    .sch2-f > span { font-size: var(--fs-xs); color: var(--text-secondary); }
}
@media (min-width: 64em) {
    .ntf { --ntf-cols: minmax(0, 1.6fr) minmax(0, 1.2fr) repeat(3, minmax(0, 0.55fr)) 2.75rem; }
}
/* 30.09 (Артём: «в белой версии оранжевый говняный какой-то»): rgb(168 69 0) при затемненні пішов у
   коричневий. rgb(194 65 12) — той самий сигнальний помаранчевий, лише темніший: 5.2:1 на білому
   (норма тексту 4.5), білий «+» на ньому 5.2:1. Змінено в правилі світлої теми вище. */
/* «Кто о чём узнаёт» (30.09): mobile-first за Фрейном. Телефон: назва + «⋯», хто, три канали
   в один ряд. ≥64em: таблиця, підписи каналів — у шапці колонок, у рядку лише перемикач. */
/* p44-4: /settings/deadlines. Матрица сроков прокручивается в своей обёртке, страница не шире экрана. */
.ntf-title,
.dl-title { font-family: var(--font-display); font-size: var(--fs-xl); margin: 0; }
.ntf-ev { grid-area: ev; font-weight: 600; }
.ntf-tgl-box::after { content: ''; position: absolute; top: 0.1875rem; left: 0.1875rem; width: 0.8125rem; height: 0.8125rem; background: var(--text-muted); }
.ntf-tgl.is-on .ntf-tgl-box { background: var(--primary); border-color: var(--primary); }
.ntf-tgl.is-on .ntf-tgl-box::after { left: auto; right: 0.1875rem; background: var(--white); }
.ntf-more > summary { list-style: none; width: 2.75rem; height: 2.75rem; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; font-weight: 700; }
.ntf-more > summary::-webkit-details-marker { display: none; }
.ntf-pop form { display: grid; gap: 0.5rem; margin: 0; }
.ntf-example span { color: var(--text-muted); }
.dm-site-filter span { font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* ── /documents: длинное имя файла и кнопки в карточке строки ──────────
   Имя переносится (anywhere), строка действий переносится и занимает весь
   ряд карточки (на телефоне .table-cards = grid из 3 колонок). Базовые
   правила безопасны и для таблицы шире 48em. */
.table-cards td.doc-name { white-space: normal; overflow-wrap: anywhere; grid-column: 1 / -1; }
.table-cards td.doc-actions { grid-column: 1 / -1; overflow: visible; }
.proc-h { font-size: var(--fs-lg); margin: var(--space-lg) 0 var(--space-sm); }
.proc-crumb { margin: 0 0 var(--space-xs); }
.proc-link { display: inline-flex; align-items: center; min-height: var(--tap-target); overflow-wrap: anywhere; }
.proc-link.is-selected { font-weight: 700; text-decoration: underline; text-underline-offset: 0.25em; }
.proc-crumb .proc-sub { display: inline; margin-left: var(--space-sm); }
.proc-num { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.proc-table .badge { margin-left: var(--space-xs); }
.proc-limiting td { background: color-mix(in srgb, var(--primary) 10%, var(--bg-surface)); }
@media (max-width: 47.99em) {
    .proc-table tr { background: var(--bg-surface); border: 0.0625rem solid var(--border); padding: var(--space-xs) var(--space-md); margin-bottom: var(--space-xs); min-width: 0; }
    .proc-table td::before { content: attr(data-label); flex: none; color: var(--text-muted); font-family: var(--font-mono); font-size: var(--micro-size); text-align: left; }
    .proc-table td.proc-main { justify-content: flex-start; text-align: left; font-weight: 600; }
    .proc-table tr.is-late { border-color: var(--late); }
    .proc-table tr.proc-limiting { background: color-mix(in srgb, var(--primary) 10%, var(--bg-surface)); }
    .proc-sub { text-align: right; }
}
.bp-wrap:focus-visible { outline: 0.125rem solid var(--link); outline-offset: 0.125rem; }
.fb-unans-head, .fb-unans-rej { font-weight: 700; }
.fp-door-name { font-family: var(--font-display); font-size: var(--fs-xl); }

/* MEP 16.10: карточка пункта графика — чертежи и связи (partials/sch_card.html). Подпись над полем, без рамок-карточек. */
.ent-f { display: grid; gap: 0.2rem; min-width: 0; }
.ent-f > span { font-size: var(--fs-xs); color: var(--text-secondary); }
.ent-f > .sch-in, .ent-f > input[type="file"] { width: 100%; min-width: 0; max-width: 100%; }
.ent-acts { display: flex; flex-wrap: wrap; gap: var(--space-xs, 0.4rem); }
.ent-inline { display: inline; margin-inline-start: 0.5rem; }
.tt-fact { display: inline-flex; align-items: center; gap: 0.25rem; font-size: var(--fs-xs); color: var(--text-secondary); }