/* Рабочий инструмент проектировщика в стиле Vercel (Geist): монохромная палитра, тонкие рамки, плотные таблицы.
   Светлая и тёмная темы на одних токенах: авто (по системе) или выбор пользователя (data-theme на <html>).
   Geist — текст (есть кириллица); Geist Mono — все числа, формулы и код: цифры одной ширины и легко читаются. */
@import url("https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&family=Geist+Mono:wght@400;500;600&family=Onest:wght@600;700&display=swap");

:root {
  color-scheme: light;
  --bg: #f7f7f8;
  --surface: #ffffff;
  --surface-2: #fafafb;
  --surface-3: #f1f2f4;
  --input: #ffffff;
  --ink: #23262d;
  --muted: #626875;
  --line: #e6e7ea;
  --line-strong: #c9c9c9;
  --accent: #171717;
  --accent-hover: #383838;
  --accent-soft: #f2f2f2;
  --accent-line: #d9d9d9;
  --on-accent: #ffffff;
  --ok: #297a3a;
  --ok-soft: #ebf7ed;
  --critical: #cb2a2f;
  --critical-soft: #ffebeb;
  --critical-line: #fcc9ca;
  --remark: #a35200;
  --remark-soft: #fff4e0;
  --remark-line: #f6d79e;
  --rec: #0068d6;
  --rec-soft: #ebf5ff;
  --rec-line: #c6e1ff;
  --highlight: #fffbea;
  --highlight-line: #f0e2a8;
  --proto: #9a6400;
  --proto-line: #e6c27a;
  --plan-bg: #fbfcfe;
  --room: #eef3fa;
  --room-hover: #dde8f6;
  --room-stroke: #7c8da5;
  --room-corridor: #f4f5f7;
  --room-wc: #f1f7f4;
  --room-server: #fdf3e3;
  --dev-fill: #ffffff;
  --dev-ink: #333333;
  --light-fill: #fff6c8;
  --light-stroke: #a07800;
  --emergency-fill: #ffd9d9;
  --exit: #1e8e3e;
  --font: "Geist", "Segoe UI", system-ui, sans-serif;
  --mono: "Geist Mono", Consolas, "Courier New", monospace;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #08090b;
  --surface: #0f1013;
  --surface-2: #131418;
  --surface-3: #1b1d22;
  --input: #0f1013;
  --ink: #e3e5e9;
  --muted: #9aa0a9;
  --line: #22252b;
  --line-strong: #373b43;
  --accent: #ededed;
  --accent-hover: #ffffff;
  --accent-soft: #1a1a1a;
  --accent-line: #404040;
  --on-accent: #0a0a0a;
  --ok: #62c073;
  --ok-soft: #0e2415;
  --critical: #ff6166;
  --critical-soft: #2a0e10;
  --critical-line: #5a1c20;
  --remark: #f5a524;
  --remark-soft: #2a1a03;
  --remark-line: #4f3507;
  --rec: #52a8ff;
  --rec-soft: #0a1d33;
  --rec-line: #12355e;
  --highlight: #2a2610;
  --highlight-line: #4a4220;
  --proto: #e3b45c;
  --proto-line: #6b5426;
  --plan-bg: #12151a;
  --room: #1b2330;
  --room-hover: #243046;
  --room-stroke: #5f718c;
  --room-corridor: #1a1d22;
  --room-wc: #18241f;
  --room-server: #2b2414;
  --dev-fill: #16191e;
  --dev-ink: #c9ced6;
  --light-fill: #4a3f10;
  --light-stroke: #e0b84a;
  --emergency-fill: #4a1c1a;
  --exit: #3fbf66;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #08090b; --surface: #0f1013; --surface-2: #131418; --surface-3: #1b1d22; --input: #0f1013;
    --ink: #e3e5e9; --muted: #9aa0a9; --line: #22252b; --line-strong: #373b43;
    --accent: #ededed; --accent-hover: #ffffff; --accent-soft: #1a1a1a; --accent-line: #404040; --on-accent: #0a0a0a;
    --ok: #62c073; --ok-soft: #0e2415; --critical: #ff6166; --critical-soft: #2a0e10; --critical-line: #5a1c20;
    --remark: #f5a524; --remark-soft: #2a1a03; --remark-line: #4f3507; --rec: #52a8ff; --rec-soft: #0a1d33;
    --rec-line: #12355e; --highlight: #2a2610; --highlight-line: #4a4220; --proto: #e3b45c; --proto-line: #6b5426;
    --plan-bg: #12151a; --room: #1b2330; --room-hover: #243046; --room-stroke: #5f718c; --room-corridor: #1a1d22;
    --room-wc: #18241f; --room-server: #2b2414; --dev-fill: #16191e; --dev-ink: #c9ced6; --light-fill: #4a3f10;
    --light-stroke: #e0b84a; --emergency-fill: #4a1c1a; --exit: #3fbf66;
  }
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { font-size: 16px; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--font); line-height: 1.45; font-size: 0.95rem;
  -webkit-font-smoothing: antialiased; }
/* Табличные (моноширинные) цифры там, где числа стоят колонками или меняются при вводе */
table, input, select, .num, .kpi, .kpis, .calc-values, .calc-lines, .value, .chip { font-variant-numeric: tabular-nums; }
a { color: var(--accent-ink); }
h1 { font-size: 1.6rem; margin: 0.2rem 0 0.4rem; text-wrap: balance; }
h2 { font-size: 1.25rem; margin: 0 0 0.75rem; text-wrap: balance; }
h3 { font-size: 1.05rem; margin: 1.25rem 0 0.5rem; }
p { margin: 0 0 0.6rem; }

.topbar { display: flex; align-items: center; gap: 1rem; padding: 0.6rem 24px; background: var(--surface); color: var(--ink); flex-wrap: wrap; border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 20; }
.brand { color: var(--ink); font-weight: 700; font-size: 1.05rem; text-decoration: none; letter-spacing: -0.01em; }
.tagline { color: var(--muted); font-size: 0.95rem; }
.badge-proto { margin-left: auto; font-size: 0.8rem; color: var(--proto); border: 1px solid var(--proto-line); border-radius: 999px; padding: 0 0.6rem; }

main { max-width: 1500px; margin: 0 auto; padding: 1.25rem 24px 3rem; display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: 8px; padding: 1.25rem 1.5rem; }
.card.narrow { max-width: 420px; justify-self: center; width: 100%; }
.hint { color: var(--muted); max-width: 75ch; }
.small { font-size: 0.88rem; }
.muted { color: var(--muted); }
.stack { display: grid; gap: 0.5rem; }
.error-text { color: var(--critical); }

label { font-weight: 700; }
input[type="text"], input[type="password"], input:not([type]), textarea, select {
  font: inherit; padding: 0.5rem 0.7rem; border: 1px solid var(--line); border-radius: 6px; background: var(--input); width: 100%; color: var(--ink);
}
input[type="file"] { font: inherit; max-width: 100%; }
button, .button {
  font: inherit; padding: 0.5rem 1rem; border-radius: 6px; border: 1px solid var(--line);
  background: var(--surface); color: var(--ink); cursor: pointer; text-decoration: none; display: inline-block; line-height: 1.3;
}
button:hover, .button:hover { border-color: var(--accent); }
button.primary, .button.primary { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
button.primary:hover, .button.primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); }
button.secondary, .button.secondary { background: var(--accent-soft); border-color: var(--accent-line); color: var(--accent-ink); }
button.danger { background: var(--critical); color: var(--on-accent); border-color: var(--critical); }
button:disabled { opacity: 0.6; cursor: wait; }
button.link { border: 0; padding: 0; background: none; color: var(--accent-ink); text-decoration: underline; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }

table.list { border-collapse: collapse; width: 100%; font-size: 0.95rem; }
table.list th, table.list td { text-align: left; padding: 0.4rem 0.55rem; border-bottom: 1px solid var(--line); vertical-align: middle; }
table.list th { color: var(--muted); font-weight: 700; background: var(--surface-2); white-space: nowrap; }
.num { text-align: right !important; font-variant-numeric: tabular-nums; white-space: nowrap; }
.scroll { overflow-x: auto; }

.chip { display: inline-block; padding: 0.05rem 0.5rem; border-radius: 999px; font-size: 0.8rem; font-weight: 700; white-space: nowrap; border: 0; }
.chip.new { background: var(--accent-soft); color: var(--accent-ink); margin-left: 0.3rem; }
.chip.ai { background: var(--surface-2); color: var(--muted); border: 1px dashed var(--line-strong); margin-left: 0.3rem; letter-spacing: 0.02em; }
.chip.busy { background: var(--surface-2); color: var(--muted); font-weight: 600; }   /* «в очереди», «обрабатывается · 43 %» */
.chip.error { background: var(--critical-soft); color: var(--critical); font-weight: 600; }
.finding .f-meta .chip { margin-left: 0; }  /* в строке меток отступы задаёт gap */
.sev-critical { background: var(--critical-soft); color: var(--critical); }
.sev-remark { background: var(--remark-soft); color: var(--remark); }
.sev-rec { background: var(--rec-soft); color: var(--rec); }
.dot { display: inline-block; width: 0.6rem; height: 0.6rem; border-radius: 50%; margin-right: 0.35rem; }
.dot.sev-critical { background: var(--critical); }
.dot.sev-remark { background: var(--remark); }
.dot.sev-rec { background: var(--rec); }

/* --- главная --- */
.intro { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(300px, 1fr); gap: 1.25rem; align-items: start; }
.intro h1 { font-size: 1.9rem; }
.steps { padding-left: 1.3rem; display: grid; gap: 0.4rem; margin: 0.8rem 0 1.2rem; }
.inline-form { display: flex; gap: 0.75rem; align-items: center; flex-wrap: wrap; }
.upload { display: grid; gap: 0.45rem; }
.upload button.primary { justify-self: start; padding: 0.6rem 1.6rem; margin-top: 0.4rem; }

/* --- шапка объекта --- */
.obj-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap;
  position: relative; z-index: 5; }  /* меню «Скачать», «Ещё», вид объекта — поверх сводки (у обоих блоков transform анимации) */
.obj-actions { display: grid; gap: 0.5rem; justify-items: end; }
/* Только чтение: кнопки «Загрузить версию» нет — версии и выгрузки в один ряд, без висящей метки «v1». */
.readonly .obj-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; }
.versions, .exports { display: flex; gap: 0.4rem; flex-wrap: wrap; align-items: center; }
.ver { padding: 0.35rem 0.7rem; border: 1px solid var(--line); border-radius: 6px; text-decoration: none; background: var(--surface); }
.ver.current { background: var(--ink); color: var(--surface); border-color: var(--ink); }
.back { font-size: 0.95rem; }

.overview { background: var(--surface); border: 1px solid var(--line); border-radius: 8px; padding: 1rem 1.25rem; display: grid; gap: 0.75rem; }
.counters { display: flex; gap: 0.6rem; flex-wrap: wrap; }
.counter { display: flex; gap: 0.45rem; align-items: baseline; border-radius: 8px; padding: 0.55rem 0.9rem; border: 1px solid transparent; }
.counter b { font-size: 1.5rem; font-variant-numeric: tabular-nums; }
.counter.sev-critical { border-color: var(--critical-line); }
.counter.sev-remark { border-color: var(--remark-line); }
.counter.sev-rec { border-color: var(--rec-line); }
.counter.neutral { background: var(--surface-2); }
.assumptions { margin: 0; color: var(--muted); display: flex; gap: 0.4rem; flex-wrap: wrap; align-items: baseline; }
.assumptions .label { font-weight: 700; color: var(--ink); }
.edited-note { color: var(--remark); font-weight: 700; margin-left: 0.5rem; }
.diff { background: var(--accent-soft); border-radius: 6px; padding: 0.55rem 0.8rem; }
.diff .ok { color: var(--ok); }
.closed { margin: 0.4rem 0 0; padding-left: 1.2rem; }

.onboarding { display: flex; gap: 1rem; align-items: flex-start; justify-content: space-between; background: var(--highlight);
  border: 1px solid var(--highlight-line); border-radius: 8px; padding: 0.8rem 1.1rem; }

.tabs { display: flex; gap: 0.25rem; border-bottom: 2px solid var(--line); flex-wrap: wrap; }
.tab { border: 0; border-bottom: 3px solid transparent; border-radius: 0; background: none; padding: 0.6rem 0.9rem; margin-bottom: -2px; color: var(--muted); font-weight: 700; }
.tab.active { color: var(--ink); border-bottom-color: var(--accent); }
.tab .count { font-weight: 400; color: var(--muted); font-size: 0.88rem; }
.tabpanel { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }

/* --- замечания --- */
.filters { display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: center; }
.filter.active { background: var(--accent-soft); border-color: var(--accent); }
.filter b { margin-left: 0.25rem; }
.toggle { font-weight: 400; display: inline-flex; gap: 0.4rem; align-items: center; margin-left: 0.5rem; }

.workspace { display: grid; grid-template-columns: minmax(300px, 420px) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.findings { background: var(--surface); border: 1px solid var(--line); border-radius: 8px; max-height: calc(100vh - 140px); overflow-y: auto; position: sticky; top: 12px; }
.findings ol { list-style: none; margin: 0; padding: 0; }
.finding { display: grid; gap: 0.25rem; padding: 0.7rem 1rem; border-bottom: 1px solid var(--line); cursor: pointer; }
.chip.owner { background: var(--surface-2); color: var(--muted); margin-left: 0.3rem; font-weight: 600; }
.finding > .chip { justify-self: start; }
.finding:hover { background: var(--surface-2); }
.finding.selected { background: var(--accent-soft); box-shadow: inset 4px 0 0 var(--accent); }
.finding[data-status="accepted"] .f-title, .finding[data-status="fixed"] .f-title { color: var(--muted); }
.finding[data-status="rejected"] .f-title { color: var(--muted); text-decoration: line-through; }
.f-title { font-weight: 700; }
.f-meta { font-size: 0.85rem; color: var(--muted); }

.viewer { background: var(--surface); border: 1px solid var(--line); border-radius: 8px; padding: 1.25rem 1.5rem; min-width: 0; }
#v-detail { font-family: var(--mono); font-size: 0.92rem; white-space: pre-wrap; background: var(--surface-2); border: 1px solid var(--line); border-radius: 6px; padding: 0.75rem 1rem; margin: 0 0 0.75rem; overflow-x: auto; }
.refs { margin: 0 0 1rem; padding-left: 1.2rem; }
.unverified { font-size: 0.8rem; padding: 0 0.4rem; border-radius: 4px; background: var(--remark-soft); color: var(--remark); }
.status-form { display: grid; gap: 0.4rem; }
.status-buttons { display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: center; }
.status-buttons button.on { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.saved { color: var(--ok); font-weight: 700; }
.saved.error { color: var(--critical); }
.sheet { margin: 0 0 0.8rem; }
.sheet figcaption { color: var(--muted); font-size: 0.9rem; margin-bottom: 0.4rem; display: flex; gap: 1rem; align-items: baseline; }
.sheet img { max-width: 100%; border: 1px solid var(--line); background: #ffffff; display: block; }
.viewer-holder { list-style: none; padding: 0.5rem; border-bottom: 1px solid var(--line); background: var(--accent-soft); }
.viewer.inline { padding: 1rem; }
.empty-state p { max-width: 75ch; }

/* --- распознанные данные --- */
details.panel > summary { cursor: pointer; display: flex; gap: 0.75rem; flex-wrap: wrap; align-items: baseline; list-style-position: inside; }
.panel-name { font-weight: 700; font-size: 1.1rem; }
.panel-params { color: var(--ink); font-size: 0.92rem; }
details.panel[open] > summary { margin-bottom: 0.75rem; }
.data-table td { white-space: nowrap; }
.data-table td:nth-child(2) { white-space: normal; min-width: 12rem; }
.data-table tr.reserve td { color: var(--muted); }
input.cell { width: 5.2rem; padding: 0.2rem 0.4rem; text-align: right; font-variant-numeric: tabular-nums; border-color: transparent; background: transparent; }
input.cell:hover { border-color: var(--line); background: var(--input); }
input.cell:focus { border-color: var(--accent); background: var(--input); }
input.cell.edited { background: var(--remark-soft); border-color: var(--remark-line); font-weight: 700; }
input.cell.error { border-color: var(--critical); background: var(--critical-soft); }
.data-table tr.cell-error-row td { white-space: normal; color: var(--critical); background: var(--critical-soft); font-size: 0.85rem; padding: 0.35rem 0.6rem; }
.data-table tr.cell-error-row td > div { position: sticky; left: 0.6rem; max-width: 46rem; }
.row-actions { display: flex; gap: 0.5rem; align-items: center; }

/* --- что проверено --- */
.checks { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.2rem; }
.checks li { display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: 0.6rem; padding: 0.6rem 0; border-bottom: 1px solid var(--line); }
.checks .mark { width: 1.7rem; height: 1.7rem; border-radius: 50%; display: grid; place-items: center; font-weight: 700; }
.checks .pass .mark { background: var(--ok-soft); color: var(--ok); }
.checks .fail .mark { background: var(--remark-soft); color: var(--remark); }
.checks .skipped .mark { background: var(--surface-2); color: var(--muted); }
.checks p { margin: 0.2rem 0 0; color: var(--muted); }
.plain { padding-left: 1.2rem; display: grid; gap: 0.35rem; margin: 0; }

/* --- параметры --- */
.settings { display: grid; gap: 0.9rem; max-width: 720px; }
.field { display: grid; gap: 0.3rem; }
.field input, .field select { max-width: 18rem; }
fieldset.group { border: 1px solid var(--line); border-radius: 10px; padding: 0.9rem 1rem 1rem; margin: 0; display: grid; gap: 0.7rem; min-width: 0; }
fieldset.group legend { font-weight: 600; padding: 0 0.3rem; }
.grid-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: 0.7rem 1rem; }
.small-heading { font-size: 0.95rem; margin: 0.3rem 0 0; }
.small-details summary { cursor: pointer; font-size: 0.9rem; }
.small-details[open] { display: grid; gap: 0.5rem; }
.settings button.primary { justify-self: start; }
.danger-zone { max-width: 720px; }
.danger-zone summary { cursor: pointer; color: var(--critical); font-weight: 700; }
.danger-zone form { margin-top: 0.75rem; }
.danger-zone button { justify-self: start; }

/* --- диалоги --- */
.dialog { border: 1px solid var(--line); border-radius: 10px; padding: 1.25rem 1.5rem; max-width: min(560px, 92vw); }
.dialog.wide { max-width: min(1200px, 96vw); }
.dialog::backdrop { background: rgb(24 33 45 / 0.45); }
.dialog-actions { display: flex; gap: 0.5rem; justify-content: flex-end; margin-top: 0.5rem; }
.dialog-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 0.75rem; }
#sheet-image { max-width: 100%; display: block; border: 1px solid var(--line); }

@media (max-width: 1100px) {
  .workspace { grid-template-columns: 1fr; }
  .findings { max-height: none; position: static; }
  .workspace > .viewer { display: none; }
  .intro { grid-template-columns: 1fr; }
  .obj-actions { justify-items: start; }
  .readonly .obj-actions { justify-content: flex-start; }
}
@media (max-width: 640px) {
  main { padding-inline: 16px; }
  .card, .overview { padding: 1rem; }
  .topbar { padding-inline: 16px; }
  .badge-proto { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; } }
.toggle.check { margin-left: 0; font-weight: 400; }

/* ---- Калькуляторы ---- */
.topnav { display: flex; gap: 0.25rem; }
.topnav a { color: var(--muted); text-decoration: none; padding: 0.15rem 0.6rem; border-radius: 6px; }
.topnav a:hover, .topnav a.active { background: var(--surface-3); color: var(--ink); }
.calc-layout { display: grid; grid-template-columns: 17rem minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.calc-nav { display: grid; gap: 0.15rem; position: sticky; top: 1rem; }
.calc-nav h1 { font-size: 1.3rem; }
.calc-nav a { padding: 0.45rem 0.6rem; border-radius: 6px; text-decoration: none; color: var(--ink); }
.calc-nav a:hover { background: var(--surface-2); }
.calc-nav a.active { background: var(--accent-soft); color: var(--accent-ink); font-weight: 700; }
.calc-main { display: grid; gap: 1.25rem; min-width: 0; }
/* minmax(0, 1fr): широкая таблица в .scroll прокручивается внутри карточки, а не растягивает форму */
form.calc { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.9rem; }
form.calc .field input, form.calc .field select { max-width: none; }
details.source { border: 1px solid var(--line); border-radius: 8px; padding: 0.6rem 0.9rem; display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.6rem; background: var(--surface-2); }
details.source summary { cursor: pointer; font-weight: 700; }
details.source[open] summary { margin-bottom: 0.4rem; }
table.rows input, table.rows select { min-width: 4.5rem; padding: 0.3rem 0.45rem; }
table.rows td:first-child input { min-width: 10rem; }
.calc-result { border-top: 1px solid var(--line); padding-top: 0.9rem; display: grid; gap: 0.7rem; transition: opacity 0.15s; }
.calc-result.busy { opacity: 0.55; }
.calc-values { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.calc-values .value { border: 1px solid var(--line); border-radius: 8px; padding: 0.45rem 0.8rem; display: grid; min-width: 8.5rem; background: var(--surface); }
.calc-values .value.main { border-color: var(--accent-line); background: var(--accent-soft); }
.calc-values .v { font-size: 1.15rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.calc-values .main .v { font-size: 1.6rem; color: var(--accent-ink); }
.calc-values small { font-size: 0.85rem; font-weight: 400; color: var(--muted); }
.calc-values .k { color: var(--muted); font-size: 0.85rem; }
.chip.ok { background: var(--ok-soft); color: var(--ok); justify-self: start; }
.chip.unverified { background: var(--remark-soft); color: var(--remark); font-weight: 400; }
.calc-warning { background: var(--remark-soft); color: var(--remark); border-radius: 6px; padding: 0.45rem 0.7rem; margin: 0; }
.calc-error { background: var(--critical-soft); color: var(--critical); border-radius: 6px; padding: 0.45rem 0.7rem; margin: 0; }
.calc-lines { margin: 0; padding-left: 1.3rem; font-family: var(--mono); font-size: 0.86rem; display: grid; gap: 0.25rem; }
.refs { margin: 0; padding-left: 1.2rem; font-size: 0.9rem; color: var(--muted); }
table.variants tr.chosen td { background: var(--ok-soft); font-weight: 700; }
table.variants tr.fail td { color: var(--muted); }
.yes { color: var(--ok); font-weight: 700; }
.no { color: var(--critical); font-weight: 700; }
.calc-nav-list { display: grid; gap: 0.15rem; }
.calc-nav-toggle { display: none; }
@media (max-width: 860px) {
  .calc-layout { grid-template-columns: minmax(0, 1fr); }
  /* Список не уходит в горизонтальную ленту: свёрнут в кнопку с текущим калькулятором, раскрывается вниз. */
  .calc-nav, .calc-nav.card { position: static; padding: 0.5rem; }
  .calc-nav h1, .calc-nav p { display: none; }
  .calc-nav-toggle { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto; align-items: center;
    justify-content: stretch; justify-items: start; column-gap: 0.6rem; width: 100%; text-align: left; padding: 0.45rem 0.6rem;
    background: transparent; border: 0; min-height: 2.75rem; color: var(--ink); }
  .calc-nav-toggle .muted { grid-column: 1; }
  .calc-nav-toggle b { grid-column: 1; font-weight: 600; overflow-wrap: anywhere; }
  .calc-nav-toggle .chev { grid-column: 2; grid-row: 1 / span 2; transition: transform 0.15s; }
  .calc-nav.open .calc-nav-toggle .chev { transform: rotate(180deg); }
  .calc-nav-list { display: none; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr));
    border-top: 1px solid var(--line); margin-top: 0.4rem; padding-top: 0.2rem; }
  .calc-nav.open .calc-nav-list { display: grid; }
  .calc-nav-list .nav-group { grid-column: 1 / -1; }
  .calc-nav-list a { min-height: 2.5rem; white-space: normal; }
}

/* ---- Каталог ---- */
.import-form { display: flex; flex-wrap: wrap; gap: 0.8rem; align-items: end; }
.import-form .field { min-width: 14rem; flex: 1; }
.notice { background: var(--ok-soft); color: var(--ok); border-radius: 6px; padding: 0.5rem 0.75rem; }
.search-form .field.wide { grid-column: 1 / -1; }
.offers { display: grid; gap: 0.5rem; }
.offers h3 { margin: 0.4rem 0 0; }

/* ---- Конструктор щита ---- */
.panel-layout { display: grid; grid-template-columns: 15rem minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.panel-side { display: grid; gap: 0.6rem; position: sticky; top: 1rem; }
.panel-side .new-panel { text-align: center; }
.side-title { font-size: 0.95rem; color: var(--muted); margin: 0.4rem 0 0; }
.saved-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.15rem; }
.saved-list a { display: grid; padding: 0.45rem 0.55rem; border-radius: 6px; text-decoration: none; color: var(--ink); }
.saved-list a:hover { background: var(--surface-2); }
.saved-list a.active { background: var(--accent-soft); color: var(--accent-ink); }
.saved-list small { color: var(--muted); }
.panel-main { display: grid; gap: 1.25rem; min-width: 0; }
.panel-head { display: grid; gap: 0.9rem; }
.title-row { display: flex; align-items: center; gap: 1rem; }
.panel-title { font-size: 1.5rem !important; font-weight: 700; border: 1px solid transparent !important; padding: 0.2rem 0.4rem !important; background: transparent !important; }
.panel-title:hover, .panel-title:focus { border-color: var(--line) !important; background: var(--input) !important; }
.save-state { color: var(--muted); font-size: 0.85rem; white-space: nowrap; }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr)); gap: 0.7rem; }
.kpi { border: 1px solid var(--line); border-radius: 10px; padding: 0.6rem 0.85rem; display: grid; background: var(--surface-2); }
.kpi .v { font-size: 1.7rem; font-weight: 700; color: var(--accent-ink); font-variant-numeric: tabular-nums; line-height: 1.2; }
.kpi .v small { font-size: 0.9rem; color: var(--muted); font-weight: 400; }
.kpi .k { color: var(--muted); font-size: 0.85rem; }
.section-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.6rem; margin-bottom: 0.4rem; }
.section-head h2 { margin: 0; }
.starters { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; }
.chip-button { border-radius: 999px; padding: 0.25rem 0.8rem; font-size: 0.9rem; background: var(--accent-soft); border-color: var(--accent-line); color: var(--accent-ink); }
.groups-table input, .groups-table select { padding: 0.35rem 0.45rem; }
.groups-table td:first-child input { min-width: 13rem; }
.groups-table input.short { width: 5rem; text-align: right; }
.groups-table .result { cursor: pointer; white-space: nowrap; color: var(--ink); }
.groups-table .result:hover { background: var(--accent-soft); }
.groups-table tr.bad .result { color: var(--critical); }
.groups-table tr.detail td { background: var(--surface-2); }
.icon-button { border: 0; background: none; font-size: 1.3rem; line-height: 1; padding: 0.1rem 0.4rem; color: var(--muted); }
.icon-button:hover { color: var(--critical); }
.add-group { margin-top: 0.7rem; }
.settings-card summary { cursor: pointer; display: flex; flex-wrap: wrap; gap: 0.3rem 1rem; align-items: baseline; list-style: none; }
.settings-card summary::-webkit-details-marker { display: none; }
.settings-card summary h2 { margin: 0; }
.settings-card summary h2::after { content: " ›"; color: var(--muted); }
.settings-card[open] summary h2::after { content: " ⌄"; }
.settings-card[open] summary { margin-bottom: 0.8rem; }
.spec-table td { vertical-align: top; }
.refs { color: var(--muted); margin-top: 0.6rem; }
@media (max-width: 860px) {
  .panel-layout { grid-template-columns: minmax(0, 1fr); }
  .panel-side { position: static; }
}
.title-row > .panel-title { flex: 1; min-width: 0; width: auto; }
.topnav { overflow-x: auto; max-width: 100%; scrollbar-width: none; }
.topnav a { white-space: nowrap; }
@media (max-width: 860px) {
  .topbar { gap: 0.5rem 1rem; padding: 0.7rem 16px; }
  .topnav { order: 3; flex-basis: 100%; }
  main { padding: 1rem 16px 2.5rem; }
  .card { padding: 1rem; }
  .title-row { flex-wrap: wrap; }
}
.panel-main, .calc-main, .panel-head { grid-template-columns: minmax(0, 1fr); }

/* ---- Главная ---- */
.hub h1 { font-size: 1.9rem; margin: 0.4rem 0 1rem; }
.hub-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 1.25rem; align-items: stretch; }
.hub-card { display: grid; gap: 0.7rem; align-content: start; }
.hub-card h2 { font-size: 1.4rem; margin: 0; }
.hub-kicker { color: var(--accent-ink); font-size: 0.8rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; }
.link-card { text-decoration: none; color: var(--ink); transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s; }
.link-card:hover { border-color: var(--accent); box-shadow: 0 6px 20px rgba(29, 79, 145, 0.12); transform: translateY(-1px); }
.link-card .go { color: var(--accent-ink); font-weight: 700; margin-top: auto; }
.dropzone { display: grid; place-items: center; text-align: center; gap: 0.2rem; padding: 1.6rem 1rem; border: 2px dashed var(--accent-line);
  border-radius: 12px; background: var(--accent-soft); cursor: pointer; font-weight: 400; transition: background 0.15s, border-color 0.15s; }
.dropzone:hover, .dropzone.over { border-color: var(--accent); background: var(--accent-soft); }
.dropzone.has-files { border-style: solid; }
.dropzone input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.dz-main { font-size: 1.1rem; font-weight: 700; color: var(--accent-ink); word-break: break-word; }
.dz-sub { color: var(--muted); font-size: 0.9rem; }
.check-extra { display: grid; gap: 0.4rem; }
button.wide { width: 100%; padding: 0.65rem 1rem; font-size: 1.05rem; }
.demo-link { justify-self: center; font-size: 0.95rem; }
.recent-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
.recent { list-style: none; margin: 0; padding: 0; display: grid; }
.recent a { display: flex; justify-content: space-between; gap: 1rem; padding: 0.5rem 0.4rem; border-bottom: 1px solid var(--line);
  text-decoration: none; color: var(--ink); }
.recent a:hover { background: var(--surface-2); }
.recent small { color: var(--muted); white-space: nowrap; }
@media (max-width: 980px) {
  .hub-grid, .recent-grid { grid-template-columns: minmax(0, 1fr); }
}

.spec-table td.actions { white-space: nowrap; }
.spec-table tr.detail > td { background: var(--surface-2); }
table.analogs td { vertical-align: middle; }

.groups-table small.proj { display: block; color: var(--muted); font-size: 0.78rem; }
.groups-table small.proj.diff { color: var(--remark); font-weight: 700; }
form.to-builder { display: inline; margin-left: auto; }
.small-button { padding: 0.2rem 0.6rem; font-size: 0.85rem; }

.doc-buttons { display: flex; flex-wrap: wrap; gap: 0.5rem; }

/* ---- Направления ---- */
.segmented { display: inline-flex; background: var(--surface-2); border: 1px solid var(--line); border-radius: 10px; padding: 3px; gap: 2px; flex-wrap: wrap; }
.segmented button { border: 0; background: transparent; border-radius: 8px; padding: 0.35rem 0.9rem; color: var(--muted); }
.segmented button[aria-selected="true"] { background: var(--surface); color: var(--ink); font-weight: 700; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
.direction { display: grid; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); gap: 1rem 1.5rem; margin-top: 0.6rem; }
.dir-section h3 { margin: 0.2rem 0 0.4rem; font-size: 1rem; }
.tools { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.35rem; }
.tools li { display: grid; }
.tools a { font-weight: 700; text-decoration: none; }
.tools a:hover { text-decoration: underline; }
.tools small { color: var(--muted); font-size: 0.85rem; }
.tools li.soon span:first-child { color: var(--muted); font-weight: 700; }
.soon-chip { background: var(--surface-2); color: var(--muted); font-weight: 400; margin-left: 0.3rem; }
.calc-nav .nav-group { margin: 0.6rem 0 0.1rem; font-size: 0.78rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; }
.tools li { display: block; }
.tools small { display: block; }
.soon-chip { display: inline-block; vertical-align: middle; }

/* ---- Условные обозначения ---- */
.symbols-page { display: grid; gap: 0.8rem; }
.steps-row { display: flex; flex-wrap: wrap; gap: 0.7rem; align-items: center; }
.file-button { position: relative; overflow: hidden; }
.file-button input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }

/* ---- Набросок на плане ---- */
.draft-start { display: grid; gap: 0.8rem; }
.draft-layout { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.draft-plan { display: grid; gap: 0.8rem; position: sticky; top: 1rem; }
.draft-side { display: grid; gap: 1rem; min-width: 0; }
.draft-side details > summary { cursor: pointer; display: flex; flex-wrap: wrap; gap: 0.2rem 0.8rem; align-items: baseline; list-style: none; }
.draft-side details > summary::-webkit-details-marker { display: none; }
.draft-side details > summary h2 { margin: 0; font-size: 1.1rem; }
.draft-side details[open] > summary { margin-bottom: 0.6rem; }
.plan-view { border: 1px solid var(--line); border-radius: 10px; background: var(--plan-bg); overflow: auto; max-height: 70vh; }
.plan-svg { width: 100%; height: auto; display: block; }
.plan-svg .room { fill: var(--room); stroke: var(--room-stroke); stroke-width: 1; cursor: pointer; }
.plan-svg .room:hover { fill: var(--room-hover); }
.plan-svg .kind-corridor { fill: var(--room-corridor); }
.plan-svg .kind-wc { fill: var(--room-wc); }
.plan-svg .kind-server { fill: var(--room-server); }
.plan-svg .room-label { font: 700 11px var(--font); fill: var(--ink); text-anchor: middle; pointer-events: none; }
.plan-svg .room-area { font: 10px var(--font); fill: var(--muted); text-anchor: middle; pointer-events: none; }
/* Значки наброска — геометрия Symbol в мм листа (plan/symbols.svg_shape); цвет — по системе, толщина — в пикселях */
.plan-svg .dev { fill: var(--dev-fill); stroke: currentColor; stroke-width: 1.3; color: var(--dev-ink); }
.plan-svg .dev * { vector-effect: non-scaling-stroke; }
.plan-svg .dev polyline, .plan-svg .dev path:not(.fill) { fill: none; }
.plan-svg .dev .fill { fill: currentColor; }
.plan-svg .dev .sym-text { fill: currentColor; stroke: none; font-family: var(--font); }
.plan-svg .dev-mark { fill: var(--muted); font-family: var(--font); pointer-events: none; }
.plan-svg .dev-detector { color: var(--critical); }
.plan-svg .dev-outlet { color: var(--accent); }
.plan-svg .dev-outlet.far { color: var(--remark); }
.legend { color: var(--muted); display: flex; gap: 0.4rem 1rem; flex-wrap: wrap; align-items: center; margin: 0; }
.legend .lg-item { display: inline-flex; align-items: center; gap: 0.35rem; }
.legend .plan-svg.lg-sym { width: 22px; height: 16px; flex: none; }
table.rooms select { padding: 0.25rem 0.35rem; }
table.rooms input.short, table.rooms input { width: 4.2rem; padding: 0.25rem 0.35rem; text-align: right; }
tr.flash td { background: var(--accent-soft); transition: background 0.3s; }
@media (max-width: 1100px) {
  .draft-layout { grid-template-columns: minmax(0, 1fr); }
  .draft-plan { position: static; }
}

/* Обратная связь */
.feedback-link { color: var(--ink); border: 1px solid var(--line-strong); border-radius: 999px; padding: 0.15rem 0.8rem; font-size: 0.85rem; text-decoration: none; white-space: nowrap; }
.feedback-link:hover, .feedback-link.active { background: var(--surface-3); }
.notice.warn { background: var(--remark-soft); color: var(--remark); }
.fb-grid { display: grid; gap: 0.9rem; max-width: 46rem; }
.fb-grid textarea { width: 100%; }
.fb-grid button, .fb-grid .file-button { justify-self: start; }
.fb-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 0.9rem; }
.fb-row .field input { max-width: none; width: 100%; }
.fb-kinds label { display: inline-flex; cursor: pointer; position: relative; }
.fb-kinds input { position: absolute; opacity: 0; pointer-events: none; }
.fb-kinds span { border-radius: 8px; padding: 0.35rem 0.9rem; color: var(--muted); }
.fb-kinds input:checked + span { background: var(--surface); color: var(--ink); font-weight: 700; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
.fb-kinds input:focus-visible + span { outline: 2px solid var(--accent); }
.file-button[data-name]:not([data-name=""])::after { content: " · " attr(data-name); font-weight: 400; }
.fb-list { display: grid; gap: 0.8rem; }
.fb-item { border-top: 1px solid var(--line); padding-top: 0.8rem; display: grid; gap: 0.4rem; min-width: 0; }
.fb-meta { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; }
.fb-text { white-space: pre-wrap; overflow-wrap: anywhere; margin: 0; }
.fb-shot { max-width: min(100%, 22rem); border: 1px solid var(--line); border-radius: 6px; }
.fb-reply { background: var(--surface-2); border-radius: 6px; padding: 0.5rem 0.7rem; margin: 0; }
.fb-admin summary { cursor: pointer; color: var(--accent-ink); font-size: 0.9rem; }
.chip.fb-bug { background: var(--critical-soft); color: var(--critical); }
.chip.fb-norm { background: var(--remark-soft); color: var(--remark); }
.chip.fb-idea, .chip.fb-question { background: var(--accent-soft); color: var(--accent-ink); }
.chip.status-new, .chip.status-rejected { background: var(--surface-2); color: var(--muted); }
.chip.status-work { background: var(--accent-soft); color: var(--accent-ink); }
.chip.status-done { background: var(--ok-soft); color: var(--ok); }

/* Набросок: освещение */
.plan-svg .dev-light { fill: var(--light-fill); color: var(--light-stroke); }
.plan-svg .dev-emergency { fill: var(--emergency-fill); color: var(--critical); }
.steps-list { padding-left: 1.2rem; margin: 0.3rem 0 0.6rem; }
#step-light .inline-form { margin: 0.4rem 0; }
.draft-layout > *, .draft-side > * { min-width: 0; }  /* широкие таблицы прокручиваются внутри карточки */

/* Что нового */
a.badge-proto { text-decoration: none; }
a.badge-proto:hover { background: var(--remark-soft); }
.changes .change { border-top: 1px solid var(--line); padding-top: 0.6rem; margin-top: 0.8rem; }
.changes .change h2 { font-size: 1.05rem; margin: 0 0 0.4rem; }
.changes .change ul { margin: 0; padding-left: 1.2rem; display: grid; gap: 0.3rem; max-width: 80ch; }
.plan-svg .dev-exit { color: var(--exit); }

/* Как пользоваться */
.guide h2 { margin-top: 0; }
.guide-steps { display: grid; gap: 0.55rem; padding-left: 1.3rem; max-width: 80ch; margin: 0; }
.guide-list { display: grid; gap: 0.35rem 1.2rem; grid-template-columns: minmax(9rem, max-content) minmax(0, 1fr); margin: 0; }
.guide-list dt { font-weight: 700; }
.guide-list dd { margin: 0 0 0.5rem; color: var(--ink); max-width: 80ch; }
@media (max-width: 700px) { .guide-list { grid-template-columns: minmax(0, 1fr); } .guide-list dd { margin-bottom: 0.8rem; } }

/* Переключатель темы */
.theme-toggle { border: 1px solid var(--line-strong); background: transparent; color: var(--muted); border-radius: 999px;
  padding: 0.15rem 0.7rem; font-size: 0.85rem; line-height: 1.4; }
.theme-toggle:hover { color: var(--ink); background: var(--surface-3); }

/* Поиск и командная палитра */
.search-button { display: inline-flex; align-items: center; gap: 0.6rem; color: var(--muted); background: var(--surface-2);
  border: 1px solid var(--line); border-radius: 8px; padding: 0.3rem 0.4rem 0.3rem 0.8rem; font-size: 0.88rem; min-width: 12rem; }
.search-button:hover { color: var(--ink); border-color: var(--line-strong); }
.search-button kbd, .palette kbd { margin-left: auto; font: 0.75rem var(--font); color: var(--muted); border: 1px solid var(--line);
  border-radius: 4px; padding: 0 0.35rem; background: var(--surface); }
.palette { border: 1px solid var(--line-strong); border-radius: 12px; padding: 0; width: min(640px, calc(100vw - 32px));
  background: var(--surface); color: var(--ink); box-shadow: 0 24px 60px rgba(0, 0, 0, 0.25); margin-top: 12vh; }
.palette::backdrop { background: rgba(15, 17, 21, 0.45); }
.palette input { border: 0; border-bottom: 1px solid var(--line); border-radius: 12px 12px 0 0; padding: 0.9rem 1rem;
  font-size: 1.05rem; background: var(--surface); }
.palette input:focus-visible { outline: none; }
.palette ul { list-style: none; margin: 0; padding: 0.35rem; max-height: 50vh; overflow-y: auto; }
.palette li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 0.8rem; padding: 0.5rem 0.7rem; border-radius: 8px; cursor: pointer; }
.palette li[aria-selected="true"] { background: var(--accent-soft); }
.palette .pal-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.palette .pal-kind { color: var(--muted); font-size: 0.8rem; align-self: center; }
.palette .pal-hint { grid-column: 1 / -1; color: var(--muted); font-size: 0.82rem; }
.palette .pal-empty { color: var(--muted); cursor: default; }
.pal-help { color: var(--muted); margin: 0; padding: 0.45rem 1rem 0.6rem; border-top: 1px solid var(--line); }
@media (max-width: 700px) { .search-button { min-width: 0; } .search-button kbd { display: none; } }

/* Бренд ВØЛЬТ: знак в шапке, иконки, витрина */
.brand { display: inline-flex; align-items: center; color: var(--ink); }
.brand svg { display: block; }
.ico { flex: none; vertical-align: middle; }
.topnav a { display: inline-flex; align-items: center; gap: 0.4rem; }
.topnav a .ico { opacity: 0.75; }
.topnav a.active .ico { opacity: 1; }
.brand-logos { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 12px; margin: 0.6rem 0 1rem; }
.brand-tile { border-radius: 14px; border: 1px solid var(--line); display: grid; place-items: center; padding: 36px 24px; min-height: 180px; }
.brand-tile img { max-width: 100%; height: auto; max-height: 190px; }
.brand-tile.light { background: #ffffff; }
.brand-tile.dark { background: #0e1116; border-color: #0e1116; }
.brand-row { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; margin-bottom: 1.2rem; }
.brand-outline { border-radius: 27px; box-shadow: 0 0 0 1px var(--line); }
.brand-mark-inline { color: var(--ink); }
.brand-colors { display: flex; flex-wrap: wrap; gap: 18px; }
.brand-colors > div { display: grid; gap: 4px; min-width: 120px; }
.brand-swatch { width: 100%; height: 56px; border-radius: 12px; border: 1px solid var(--line); }
.icon-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 8px; }
.icon-cell { display: grid; justify-items: center; gap: 8px; padding: 14px 8px 12px; border-radius: 10px; border: 1px solid var(--line);
  background: var(--surface-2); color: var(--ink); text-align: center; font-size: 0.8rem; line-height: 1.25; }
.icon-cell span { color: var(--muted); }

/* ── Стиль Vercel / Geist: поверх базовых правил ─────────────────────────────────────────────── */
:root { --link: #0068d6; --focus: rgba(0, 104, 214, 0.28); --shadow: 0 1px 2px rgba(0, 0, 0, 0.04); --radius: 8px; }
:root[data-theme="dark"] { --link: #52a8ff; --focus: rgba(82, 168, 255, 0.35); --shadow: none; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --link: #52a8ff; --focus: rgba(82, 168, 255, 0.35); --shadow: none; } }

body { font-size: 0.875rem; line-height: 1.5; letter-spacing: -0.003em; }
::selection { background: #ffd60a; color: #0e1116; }
a { color: var(--link); text-underline-offset: 3px; }
h1 { font-size: 2rem; font-weight: 600; letter-spacing: -0.04em; line-height: 1.15; }
h2 { font-size: 1.25rem; font-weight: 600; letter-spacing: -0.025em; }
h3 { font-size: 1rem; font-weight: 600; letter-spacing: -0.015em; }
b, strong, th { font-weight: 600; }

/* Числа — Geist Mono: одна ширина цифр, «1» и «7», «0» и «8» не путаются */
.num, .kpi .v, .calc-values .v, .counter b, input.cell, .calc-lines, #v-detail, code, kbd,
input[type="number"], .mono { font-family: var(--mono); font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.kpi .v { color: var(--ink); font-weight: 600; letter-spacing: -0.04em; }
.calc-values .v, .counter b { font-weight: 600; }

.topbar { background: color-mix(in srgb, var(--bg) 82%, transparent); backdrop-filter: saturate(180%) blur(8px);
  -webkit-backdrop-filter: saturate(180%) blur(8px); min-height: 56px; }
.topnav a { color: var(--muted); font-weight: 500; transition: color 0.15s, background 0.15s; }
.topnav a:hover { color: var(--ink); background: var(--surface-3); }
.topnav a.active { color: var(--ink); background: var(--surface-3); }

.card, .overview, .viewer, .findings { border-radius: var(--radius); box-shadow: var(--shadow); }
.card { padding: 1.5rem; }
.kpi, .calc-values .value, fieldset.group, details.source, .plan-view, .dialog { border-radius: var(--radius); }
.kpi { background: var(--surface); }

button, .button { font-weight: 500; border-radius: 6px; min-height: 2.25rem; padding: 0.4rem 0.9rem; background: var(--surface);
  color: var(--ink); border-color: var(--line); box-shadow: var(--shadow); transition: background 0.15s, border-color 0.15s, color 0.15s; }
button:hover, .button:hover { background: var(--surface-3); border-color: var(--line-strong); }
button.primary, .button.primary { box-shadow: none; }
button.secondary, .button.secondary { background: var(--surface); border-color: var(--line-strong); color: var(--ink); }
button.secondary:hover, .button.secondary:hover { background: var(--surface-3); }
button.link, .tab, .segmented button, input.cell { box-shadow: none; min-height: 0; }
button.link { color: var(--link); }
.chip-button { background: var(--surface); border-color: var(--line); color: var(--ink); }
.chip-button:hover { background: var(--surface-3); }

input[type="text"], input[type="password"], input[type="number"], input:not([type]), textarea, select {
  border-radius: 6px; transition: border-color 0.15s, box-shadow 0.15s; }
input:focus, textarea:focus, select:focus, button:focus-visible, a:focus-visible {
  outline: none; border-color: var(--line-strong); box-shadow: 0 0 0 3px var(--focus); }

table.list th { font-size: 0.75rem; font-weight: 500; color: var(--muted); }
table.list tbody tr:hover td { background: var(--surface-2); }
.chip { font-weight: 500; }
.tab { font-weight: 500; border-bottom-width: 2px; }
.tab[aria-selected="true"], .tab.active { color: var(--ink); border-bottom-color: var(--ink); }
.segmented { border-radius: var(--radius); }
.segmented button[aria-selected="true"] { font-weight: 500; box-shadow: 0 0 0 1px var(--line), var(--shadow); }
.link-card:hover { border-color: var(--line-strong); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06); }
.finding.selected { box-shadow: inset 2px 0 0 var(--ink); }
.badge-proto { font-weight: 500; }

/* Шапка в одну строку: разделы слева, справа — поиск, «что нового», помощь, отзыв, тема */
.topbar { flex-wrap: nowrap; gap: 1.25rem; padding-top: 0; padding-bottom: 0; }
.topnav { flex: 1 1 auto; min-width: 0; }
.topnav a { padding: 0.35rem 0.6rem; }
.topbar-end { display: flex; align-items: center; gap: 0.75rem; flex: none; }
.search-button { min-height: 2rem; padding: 0.25rem 0.5rem 0.25rem 0.65rem; min-width: 12rem; box-shadow: none; }
.search-button kbd { font-family: var(--mono); font-size: 0.7rem; }
.toplink { color: var(--muted); text-decoration: none; font-weight: 500; white-space: nowrap; display: inline-flex; align-items: center; gap: 0.4rem; }
.toplink:hover, .toplink.active { color: var(--ink); }
.logout-form { display: inline-flex; align-items: center; gap: 0.5rem; margin: 0; }
.logout-form .who { color: var(--muted); font-size: 0.9rem; white-space: nowrap; max-width: 12rem; overflow: hidden; text-overflow: ellipsis; }
.logout-form .logout { background: none; border: 1px solid var(--line-strong); border-radius: 999px; padding: 0.2rem 0.7rem; cursor: pointer; font: inherit; }
.logout-form .logout:hover { color: var(--ink); border-color: var(--ink); }
.proto-dot { width: 6px; height: 6px; border-radius: 50%; background: #ffd60a; box-shadow: 0 0 0 3px rgba(255, 214, 10, 0.2); }
.feedback-link { border-radius: 6px; border-color: var(--line); padding: 0.3rem 0.7rem; font-weight: 500; font-size: 0.8125rem; }
.theme-toggle { width: 2rem; height: 2rem; min-height: 2rem; padding: 0; display: grid; place-items: center; border-radius: 50%;
  border-color: var(--line); box-shadow: none; }
@media (max-width: 1180px) { .search-button { min-width: 0; } .search-button span, .search-button kbd { display: none; } }
@media (max-width: 980px) {
  .topbar { flex-wrap: wrap; padding: 0.5rem 16px; row-gap: 0.25rem; }
  .topbar-end { margin-left: auto; }
  .topnav { order: 3; flex-basis: 100%; }
  .toplink:not(.active) { display: none; }
}

/* Поля одной высоты (как у Vercel — 40 px); списки не растягиваются по высоте соседей */
input[type="text"], input[type="password"], input[type="number"], input:not([type]), select { height: 2.5rem; align-self: start; }
input.cell, table.rows input, table.rows select, table.rooms input, table.rooms select { height: auto; }
th.num { font-family: var(--font); letter-spacing: 0; }

/* Подписи полей — 500, поле сразу под подписью: ряды формы выравниваются по верху */
label { font-weight: 500; }
.field { align-content: start; grid-template-rows: auto auto; }
.field > label, .field > span:first-child { color: var(--ink); font-size: 0.8125rem; }

/* ── Интерактивность: переключатели, подсказки, уведомления, движение ───────────────────────────── */
:root { --ease: cubic-bezier(0.22, 1, 0.36, 1); }

/* Короткий список → сегментированный переключатель (ui.js); исходный select скрыт, но в форме */
.seg-source { position: absolute !important; opacity: 0; pointer-events: none; width: 1px !important; height: 1px !important; }
.seg { display: flex; height: 2.5rem; padding: 3px; gap: 2px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-2); }
.seg button { flex: 1 1 0; min-width: 0; min-height: 0; height: 100%; padding: 0 0.6rem; border: 0; border-radius: 4px; background: transparent;
  color: var(--muted); box-shadow: none; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  transition: background 0.2s var(--ease), color 0.2s var(--ease), box-shadow 0.2s var(--ease); }
.seg button:hover { color: var(--ink); background: transparent; }
.seg button[aria-checked="true"] { background: var(--surface); color: var(--ink); box-shadow: 0 0 0 1px var(--line), 0 1px 2px rgba(0, 0, 0, 0.06); }

/* Подсказка «i» у подписи поля: текст при наведении/фокусе вместо абзаца под полем */
.tip { position: relative; display: inline-grid; place-items: center; width: 15px; height: 15px; margin-left: 4px; border-radius: 50%;
  border: 1px solid var(--line-strong); color: var(--muted); font: 600 10px/1 var(--mono); cursor: help; vertical-align: 1px; }
.tip:hover, .tip:focus { color: var(--ink); border-color: var(--ink); outline: none; }
.tip::after { content: attr(data-tip); position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translate(-50%, 4px);
  width: max-content; max-width: 260px; padding: 0.45rem 0.6rem; border-radius: 6px; background: var(--ink); color: var(--bg);
  font: 400 0.75rem/1.4 var(--font); letter-spacing: 0; white-space: normal; text-align: left; z-index: 30;
  opacity: 0; pointer-events: none; transition: opacity 0.15s var(--ease), transform 0.15s var(--ease); }
.tip:hover::after, .tip:focus::after { opacity: 1; transform: translate(-50%, 0); }

/* Заголовок калькулятора и «Как считается» */
.calc-head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 1rem; }
.calc-head h2 { margin: 0; }
details.about { order: 3; flex-basis: 100%; }
details.about summary { display: inline-flex; align-items: center; gap: 0.35rem; cursor: pointer; color: var(--muted); font-size: 0.8125rem;
  list-style: none; user-select: none; }
details.about summary::-webkit-details-marker { display: none; }
details.about summary:hover { color: var(--ink); }
details.about[open] summary { color: var(--ink); }
details.about p { margin: 0.5rem 0 0; padding: 0.7rem 0.9rem; border-left: 2px solid var(--line-strong); background: var(--surface-2);
  border-radius: 0 6px 6px 0; color: var(--muted); max-width: 80ch; animation: drop 0.2s var(--ease); }

/* Меню калькуляторов с иконками */
.calc-nav a { display: flex; align-items: center; gap: 0.6rem; color: var(--muted); font-weight: 500; transition: background 0.15s, color 0.15s; }
.calc-nav a .ico { flex: none; opacity: 0.8; }
.calc-nav a:hover, .calc-nav a[aria-current], .calc-nav a.active { color: var(--ink); }
.calc-nav .nav-group { font-size: 0.6875rem; letter-spacing: 0.06em; }

/* Уведомления в углу */
.toasts { position: fixed; right: 16px; bottom: 16px; display: grid; gap: 8px; z-index: 100; }
.toast { padding: 0.6rem 0.9rem; border-radius: 8px; background: var(--ink); color: var(--bg); font-weight: 500; font-size: 0.8125rem;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.18); animation: toast-in 0.3s var(--ease); }
.toast.error { background: var(--critical); color: #fff; }
.toast.out { opacity: 0; transform: translateY(6px); transition: opacity 0.25s, transform 0.25s; }

/* Микровзаимодействия */
button:active:not(:disabled), .button:active { transform: scale(0.98); }
.calc-values .value { animation: pop 0.25s var(--ease); }
main > * { animation: settle 0.4s var(--ease) both; }
main > *:nth-child(2) { animation-delay: 0.04s; }
main > *:nth-child(3) { animation-delay: 0.08s; }
.skeleton { background: linear-gradient(90deg, var(--surface-2), var(--surface-3), var(--surface-2)); background-size: 200% 100%;
  animation: shimmer 1.2s linear infinite; border-radius: 6px; color: transparent !important; }
@keyframes rise { from { opacity: 0; transform: translateY(6px); } }
@keyframes drop { from { opacity: 0; transform: translateY(-4px); } }
@keyframes pop { from { opacity: 0.4; transform: translateY(2px); } }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px) scale(0.98); } }
@keyframes shimmer { to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }
.calc-nav a.active { background: var(--surface-3); color: var(--ink); font-weight: 500; } .calc-nav a.active .ico { opacity: 1; }

/* ── Главная: действие слева, быстрые переходы справа, инструменты плитками ──────────────────────── */
.hub-head { display: grid; gap: 0.25rem; margin: 0.5rem 0 1.25rem; }
.hub-head h1 { margin: 0; font-size: 2.25rem; }
.hub-head p { margin: 0; font-size: 0.9375rem; }
.hub-grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 1rem; }
.hub-title { display: flex; align-items: center; gap: 0.7rem; }
.hub-title h2 { margin: 0; font-size: 1.25rem; }
.hub-ico { width: 36px; height: 36px; flex: none; display: grid; place-items: center; border-radius: 8px; border: 1px solid var(--line);
  background: var(--surface-2); color: var(--ink); }
.check-card { gap: 1rem; }
.dropzone { gap: 0.35rem; padding: 2.2rem 1rem; border: 1px dashed var(--line-strong); border-radius: 8px; background: var(--surface-2);
  transition: border-color 0.2s var(--ease), background 0.2s var(--ease), transform 0.2s var(--ease); cursor: pointer; position: relative; }
.dropzone:hover { border-color: var(--ink); background: var(--surface-3); }
.dropzone.over { border-color: var(--link); background: color-mix(in srgb, var(--link) 8%, var(--surface-2)); transform: scale(1.01); }
.dropzone.has-files { border-style: solid; border-color: var(--ink); }
.dz-icon { color: var(--muted); transition: transform 0.25s var(--ease), color 0.2s; }
.dropzone:hover .dz-icon, .dropzone.over .dz-icon { color: var(--ink); transform: translateY(-3px); }
.dz-main { color: var(--ink); font-weight: 600; font-size: 1rem; }
.dz-sub { font-size: 0.8125rem; }
.hub-facts { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.4rem 1.1rem; color: var(--muted); font-size: 0.8125rem; }
.hub-facts li { display: inline-flex; align-items: center; gap: 0.4rem; }
.demo-link { justify-self: start; }
.hub-side { display: grid; gap: 0.75rem; align-content: start; }
.hub-tile { display: flex; align-items: center; gap: 0.9rem; padding: 1rem 1.1rem; }
.hub-tile-text { display: grid; gap: 0.1rem; min-width: 0; flex: 1; }
.hub-tile-text b { font-weight: 600; font-size: 0.9375rem; }
.hub-tile-text small { color: var(--muted); font-size: 0.8125rem; }
.hub-arrow { color: var(--muted); transition: transform 0.2s var(--ease), color 0.2s; }
.hub-tile:hover .hub-arrow { transform: translateX(3px); color: var(--ink); }
.hub-tile:hover .hub-ico { border-color: var(--line-strong); }
.link-card:hover { transform: none; }

.tools { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 0.5rem; }
.tool { display: flex; align-items: center; gap: 0.7rem; padding: 0.65rem 0.75rem; border: 1px solid var(--line); border-radius: 8px;
  text-decoration: none; color: var(--ink); background: var(--surface); transition: border-color 0.15s, background 0.15s; min-width: 0; }
a.tool:hover { border-color: var(--line-strong); background: var(--surface-2); }
.tool-ico { width: 32px; height: 32px; flex: none; display: grid; place-items: center; border-radius: 6px; background: var(--surface-3); }
.tool-text { display: grid; min-width: 0; flex: 1; }
.tool-text b { font-weight: 500; font-size: 0.8125rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tool-text small { color: var(--muted); font-size: 0.75rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tool.soon { opacity: 0.6; }
.dir-section h3 { font-size: 0.75rem; font-weight: 500; color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; margin: 1rem 0 0.5rem; }
.dir-section:first-child h3 { margin-top: 0.25rem; }
.direction { display: block; }

.empty { display: grid; justify-items: center; gap: 0.25rem; padding: 1.75rem 1rem; text-align: center; color: var(--muted);
  border: 1px dashed var(--line); border-radius: 8px; }
.empty p { margin: 0.35rem 0 0; color: var(--ink); font-weight: 500; }
.empty small { font-size: 0.8125rem; }
@media (max-width: 900px) { .hub-grid { grid-template-columns: minmax(0, 1fr); } }
.tools a.tool { font-weight: 400; } .tools a.tool:hover { text-decoration: none; }

/* ── Проверка раздела: список замечаний ─────────────────────────────────────────────────────────── */
.counter { display: inline-flex; align-items: center; gap: 0.45rem; }
.counter b { font-family: var(--mono); }
.onboarding { display: flex; align-items: center; gap: 0.75rem; background: var(--surface); border: 1px solid var(--line);
  color: var(--ink); border-radius: var(--radius); padding: 0.6rem 0.9rem; font-size: 0.8125rem; }
.onboarding > .ico { color: var(--link); flex: none; }
.onboarding > div { flex: 1; color: var(--muted); }
.onboarding .keys { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0.3rem; margin-left: 0.4rem; color: var(--ink); }
kbd { display: inline-grid; place-items: center; min-width: 1.4rem; height: 1.4rem; padding: 0 0.3rem; border: 1px solid var(--line-strong);
  border-bottom-width: 2px; border-radius: 4px; background: var(--surface-2); font: 500 0.7rem/1 var(--mono); color: var(--ink); }
.icon-button { min-height: 0; width: 1.75rem; height: 1.75rem; padding: 0; border: 0; box-shadow: none; background: transparent; color: var(--muted); }
.icon-button:hover { background: var(--surface-3); color: var(--ink); }

.filters { align-items: center; }
.finding-search { margin-left: auto; width: min(100%, 16rem); height: 2.25rem !important; }
.progress { display: flex; align-items: center; gap: 0.75rem; margin: 0.25rem 0 0.75rem; }
.progress-bar { flex: 1; height: 4px; border-radius: 2px; background: var(--surface-3); overflow: hidden; }
.progress-bar span { display: block; height: 100%; width: 0; background: var(--ink); border-radius: 2px; transition: width 0.4s var(--ease); }
.progress.complete .progress-bar span { background: var(--ok); }
.progress-text { font: 500 0.75rem var(--mono); color: var(--muted); white-space: nowrap; }
.progress.complete .progress-text { color: var(--ok); }

.finding { display: flex; align-items: flex-start; gap: 0.7rem; padding: 0.7rem 0.8rem; position: relative;
  transition: background 0.15s, opacity 0.2s; }
.finding .f-sev { flex: none; margin-top: 1px; display: grid; }
.f-sev.sev-critical { color: var(--critical); }
.f-sev.sev-remark { color: var(--remark); }
.f-sev.sev-rec { color: var(--rec); }
.f-body { display: grid; gap: 0.2rem; min-width: 0; flex: 1; }
.finding .f-title { font-weight: 500; font-size: 0.8125rem; line-height: 1.35; }
.finding .f-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; color: var(--muted); font-size: 0.75rem; }
.finding .status-label { display: none; }
.finding[data-status="accepted"] .status-label, .finding[data-status="fixed"] .status-label { display: inline; color: var(--ok); }
.finding[data-status="rejected"] .status-label { display: inline; color: var(--muted); text-decoration: line-through; }
.finding[data-status="accepted"], .finding[data-status="rejected"], .finding[data-status="fixed"] { opacity: 0.55; }
.finding[data-status="accepted"] .f-title, .finding[data-status="rejected"] .f-title { text-decoration: none; }
.finding.selected { opacity: 1; }
.f-quick { display: flex; gap: 2px; flex: none; opacity: 0; transition: opacity 0.15s; }
.finding:hover .f-quick, .finding.selected .f-quick, .finding:focus-within .f-quick { opacity: 1; }
.f-quick button { width: 28px; height: 28px; min-height: 0; padding: 0; display: grid; place-items: center; border-radius: 6px;
  border: 1px solid var(--line); background: var(--surface); box-shadow: none; color: var(--muted); }
.f-quick .q-accept:hover, .finding[data-status="accepted"] .q-accept, .finding[data-status="fixed"] .q-accept { color: var(--ok); border-color: var(--ok); }
.f-quick .q-reject:hover, .finding[data-status="rejected"] .q-reject { color: var(--critical); border-color: var(--critical); }
.finding.just-done { animation: done-flash 0.6s var(--ease); }
@keyframes done-flash { 0% { background: color-mix(in srgb, var(--ok) 18%, transparent); } }
@media (hover: none) { .f-quick { opacity: 1; } }

/* Ввод исходных данных текстом */
.ai-bar { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0.4rem 0.75rem; padding: 0.75rem 1rem; }
.ai-ico { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 8px; color: #0e1116;
  background: linear-gradient(135deg, #ffd60a, #ffb300); }
.ai-bar input { border-color: transparent; background: var(--surface-2); }
.ai-note { grid-column: 2 / -1; margin: 0; color: var(--muted); font-size: 0.75rem; }
.ai-bar.busy .ai-ico { animation: ai-pulse 1s ease-in-out infinite; }
@keyframes ai-pulse { 50% { transform: scale(0.88); opacity: 0.7; } }
.ai-filled input, .ai-filled select, .ai-filled .seg, td.ai-filled input { animation: ai-fill 1.2s var(--ease); }
@keyframes ai-fill { 0% { box-shadow: 0 0 0 3px rgba(255, 214, 10, 0.55); border-color: #ffd60a; } }
@media (max-width: 640px) { .ai-bar { grid-template-columns: auto minmax(0, 1fr); } .ai-bar button { grid-column: 1 / -1; } }
input[type="search"] { font: inherit; padding: 0.4rem 0.7rem; border: 1px solid var(--line); border-radius: 6px; background: var(--input);
  color: var(--ink); -webkit-appearance: none; appearance: none; }
@media (max-width: 1340px) { .search-button { min-width: 0; } .search-button span, .search-button kbd { display: none; } }

/* Пояснение, если схем щитов в файле нет: что за раздел и что проверено */
.section-note { display: flex; gap: 0.75rem; align-items: flex-start; margin-top: 1rem; padding: 0.9rem 1rem; border: 1px solid var(--rec-line);
  background: var(--rec-soft); border-radius: var(--radius); font-size: 0.8125rem; color: var(--ink); }
.section-note > .ico { color: var(--rec); flex: none; margin-top: 1px; }
.section-note b { display: block; margin-bottom: 0.2rem; }

/* Набросок: выбор плана, если на листе несколько этажей */
.plan-pick { display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem 0.75rem; margin: 0.5rem 0; }
.plan-pick-label { color: var(--muted); font-size: 0.8125rem; }
.plan-pick .seg { height: auto; flex-wrap: wrap; }
.plan-pick .seg button { height: 2rem; flex: none; font-family: var(--mono); font-size: 0.75rem; }

details.notes { border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); margin: 0.5rem 0; font-size: 0.8125rem; }
details.notes summary { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; cursor: pointer; list-style: none; font-weight: 500; min-width: 0; }
details.notes summary::-webkit-details-marker { display: none; }
.notes-count { flex: none; display: grid; place-items: center; min-width: 1.4rem; height: 1.4rem; border-radius: 999px;
  background: var(--remark-soft); color: var(--remark); font: 600 0.75rem var(--mono); }
.notes-first { color: var(--muted); font-weight: 400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
details.notes[open] .notes-first { display: none; }
details.notes ul { margin: 0; padding: 0 0.8rem 0.7rem 2.6rem; display: grid; gap: 0.45rem; color: var(--ink); }
details.notes li::marker { color: var(--remark); }
table.rooms select { min-width: 9rem; height: 2rem; }
table.rooms td:first-child { min-width: 9rem; }
.draft-plan > * { min-width: 0; max-width: 100%; } details.notes { overflow: hidden; } details.notes summary > :nth-child(2) { flex: none; }
.draft-plan { grid-template-columns: minmax(0, 1fr); }

/* Кабельные журналы: загрузка слева, что проверяется — справа */
.cables-hero { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 1.5rem; }
.cables-main { display: grid; gap: 1rem; align-content: start; }
.cables-main h1 { margin: 0; font-size: 1.5rem; }
.cables-main .muted { margin: 0; }
.cables-form, .draft-upload { display: grid; gap: 0.75rem; }
.cables-checks { list-style: none; margin: 0; padding: 0 0 0 1.5rem; border-left: 1px solid var(--line); display: grid; gap: 0.9rem; align-content: start; }
.cables-checks li { display: flex; gap: 0.7rem; align-items: flex-start; }
.cables-checks li > .ico { flex: none; margin-top: 2px; color: var(--muted); }
.cables-checks b { display: block; font-weight: 500; }
.cables-checks small { color: var(--muted); font-size: 0.8125rem; }
.file-chips { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.35rem; }
.file-chip { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0.6rem; padding: 0.45rem 0.6rem;
  border: 1px solid var(--line); border-radius: 6px; background: var(--surface); animation: rise 0.25s var(--ease) both; }
.file-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 0.8125rem; }
.file-chip small { color: var(--muted); font: 0.75rem var(--mono); }
.file-ext { font: 600 0.625rem var(--mono); padding: 0.15rem 0.35rem; border-radius: 4px; background: var(--surface-3); color: var(--ink); }
.ext-dwg, .ext-dxf { background: var(--rec-soft); color: var(--rec); }
.ext-xlsx, .ext-xlsm { background: var(--ok-soft); color: var(--ok); }
.ext-pdf { background: var(--critical-soft); color: var(--critical); }
.steps-row { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.steps-row .button .ico, .steps-row button .ico { margin-right: 0.3rem; }
@media (max-width: 900px) { .cables-hero { grid-template-columns: minmax(0, 1fr); } .cables-checks { border-left: 0; padding-left: 0; } }
/* Плитки инструментов: название и пояснение — до двух строк, а не обрезка на полуслове */
.tool { align-items: flex-start; }
.tool-ico { margin-top: 1px; }
.tool-text b, .tool-text small { white-space: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.tool-text { gap: 0.15rem; }

/* Набросок: СОУЭ и связь МГН — оповещатели (трапеция), световые ОП, устройства МГН; непройденный уровень в таблице */
.plan-svg .dev-speaker { color: var(--proto); }
.plan-svg .dev-flasher { color: var(--remark); }
.plan-svg .dev-mgn { color: var(--rec); }
table.rooms td.bad { color: var(--critical); font-weight: 600; }

/* ── Доработка: легче для долгой работы, подложка, отклик ─────────────────────────────────────── */
:root { --glow-a: rgba(255, 214, 10, 0.10); --glow-b: rgba(79, 141, 255, 0.07); --grid: rgba(20, 24, 40, 0.045); --spot: rgba(255, 200, 0, 0.55); --spot-fill: rgba(255, 214, 10, 0.05); }
:root[data-theme="dark"] { --glow-a: rgba(255, 214, 10, 0.08); --glow-b: rgba(79, 141, 255, 0.08); --grid: rgba(255, 255, 255, 0.04); --spot: rgba(255, 214, 10, 0.6); --spot-fill: rgba(255, 214, 10, 0.04); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --glow-a: rgba(255, 214, 10, 0.08); --glow-b: rgba(79, 141, 255, 0.08); --grid: rgba(255, 255, 255, 0.04); --spot: rgba(255, 214, 10, 0.6); --spot-fill: rgba(255, 214, 10, 0.04); } }

/* Шрифт легче: 15 px, обычный интервал, жирность 400/500 */
body { font-size: 0.9375rem; line-height: 1.6; letter-spacing: 0; }
h1 { font-weight: 600; letter-spacing: -0.025em; }
h2 { font-weight: 500; letter-spacing: -0.01em; }
h3 { font-weight: 500; letter-spacing: 0; }
b, strong, th, label { font-weight: 500; }
.hint, .muted { line-height: 1.6; }
table.list { font-size: 0.875rem; }
.num, .kpi .v, .calc-values .v, .counter b { font-weight: 500; }

/* Меню: плавная подложка под пунктом */
.topnav { position: relative; isolation: isolate; }
.topnav .nav-pill { position: absolute; z-index: -1; top: 0; height: 100%; border-radius: 6px; background: var(--surface-3); pointer-events: none;
  transition: left .35s var(--ease), width .35s var(--ease), opacity .2s; }
.topnav.has-pill a.active, .topnav.has-pill a:hover { background: transparent; }

/* Отклик стрелок и иконок */
.hub-tile .hub-ico, .tool .tool-ico { transition: transform .25s var(--ease), background .2s; }
.hub-tile:hover .hub-ico, a.tool:hover .tool-ico { transform: translateY(-2px); }
a.tool:hover { border-color: var(--line-strong); }
.kpi, .counter { transition: transform .2s var(--ease); }
@keyframes settle { from { transform: translateY(6px); } }  /* только сдвиг: содержимое видно, даже если анимация не доиграла */

/* ── Минимализм: без бликов; иллюстрации-чертежи серой линией ──────────────────────────────────── */
:root { --fig: #d3d6dc; --fig-hid: #e2e4e8; }
:root[data-theme="dark"] { --fig: #2b2e35; --fig-hid: #23262c; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --fig: #2b2e35; --fig-hid: #23262c; } }
.fig { color: var(--fig); stroke-width: 1; height: auto; max-width: 100%; }
.fig .hid { stroke: var(--fig-hid); stroke-dasharray: 3 3; }
.hub-head { position: relative; }
.hero-figs { position: absolute; right: 0; top: -12px; display: flex; align-items: flex-end; gap: 28px; pointer-events: none; z-index: -1; }
.hero-figs figure { margin: 0; display: grid; gap: 8px; justify-items: start; }
.hero-figs figcaption, .fig-cap { font: 400 10.5px var(--mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); opacity: .7; }
@media (max-width: 1100px) { .hero-figs { display: none; } }
.empty .fig { width: 120px; margin-bottom: 6px; }
.ai-bar { border-color: var(--line); }
.ai-ico { background: var(--ink); color: var(--bg); }
.card:hover, a.tool:hover, .hub-tile:hover { border-color: var(--line-strong); }
/* Шапка главной: текст слева, «рисунки» справа в своей колонке — без наложения на карточки */
.hub-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 0.25rem 2rem; }
.hub-head h1, .hub-head > p { grid-column: 1; }
.hero-figs { position: static; grid-column: 2; grid-row: 1 / span 2; z-index: auto; gap: 32px; padding-bottom: 2px; }
.hero-figs .fig { width: auto; height: 118px; }
.hub-text { grid-column: 1; grid-row: 1; display: grid; gap: 0.35rem; align-self: end; }
.hero-figs { grid-row: 1; }
.proto-dot { box-shadow: none; }

/* Рисунки «оживают»: прорисовка линией при появлении, покачивание деталей, импульс «тока» по кабелям.
   Покой — обычные видимые линии: если анимация не запустилась, рисунок всё равно виден. */
.fig path { animation: fig-draw 1.6s cubic-bezier(.65, 0, .35, 1) backwards; }
.hero-figs figure:nth-child(2) .fig path { animation-delay: .25s; }
.hero-figs figure:nth-child(3) .fig path { animation-delay: .5s; }
@keyframes fig-draw { from { stroke-dasharray: 1; stroke-dashoffset: 1; } to { stroke-dasharray: 1; stroke-dashoffset: 0; } }
.fig .lift { animation: fig-draw 1.6s cubic-bezier(.65, 0, .35, 1) backwards, fig-lift 3.6s 1.8s ease-in-out infinite alternate; }
@keyframes fig-lift { to { transform: translateY(-2.5px); } }
.fig .flow { stroke: var(--muted); stroke-width: 1.4; stroke-dasharray: 0.12 0.88; stroke-dashoffset: 1; opacity: .9;
  animation: fig-flow 2.8s linear infinite; }
@keyframes fig-flow { to { stroke-dashoffset: 0; } }
.hero-figs figure:nth-child(1) .flow:nth-of-type(odd) { animation-delay: -1.1s; }
.hero-figs figure { transition: transform .4s var(--ease); }
.hero-figs figure:hover { transform: translateY(-4px); }
.hero-figs { pointer-events: auto; }
@media (prefers-reduced-motion: reduce) { .fig path, .fig .lift, .fig .flow { animation: none !important; } .fig .flow { display: none; } }

/* Уведомление с действием («Отменить») */
.toast { display: flex; align-items: center; gap: 0.9rem; }
.toast-action { min-height: 0; height: auto; padding: 0.2rem 0.55rem; border: 1px solid color-mix(in srgb, var(--bg) 35%, transparent);
  border-radius: 6px; background: transparent; color: var(--bg); font-weight: 500; font-size: 0.8125rem; box-shadow: none; cursor: pointer; }
.toast-action:hover { background: color-mix(in srgb, var(--bg) 15%, transparent); border-color: var(--bg); }

/* Каталог: поиск сверху, источники свёрнуты */
.catalog-head { display: grid; gap: 1rem; }
.catalog-head h1 { margin: 0; font-size: 1.5rem; }
.catalog-head .muted { margin: 0; }
.catalog-search { display: grid; gap: 0.75rem; }
.cat-q { display: flex; align-items: center; gap: 0.6rem; padding: 0 0.9rem; border: 1px solid var(--line-strong); border-radius: 10px; background: var(--input); }
.cat-q .ico { color: var(--muted); flex: none; }
.cat-q input { border: 0 !important; box-shadow: none !important; background: transparent; height: 3rem !important; font-size: 1rem; padding: 0; }
.cat-filters { grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); }
details.sources > summary { display: flex; flex-wrap: wrap; gap: 0.3rem 0.8rem; align-items: baseline; cursor: pointer; list-style: none; }
details.sources > summary::-webkit-details-marker { display: none; }
details.sources > summary h2 { margin: 0; }
details.sources[open] > summary { margin-bottom: 0.8rem; }
.cat-import { display: grid; gap: 0.75rem; margin-top: 1rem; max-width: 46rem; }
.dropzone.small-zone { padding: 1.1rem 1rem; }
.mono { font-family: var(--mono); }
table.list td a { color: var(--ink); text-decoration: none; } table.list td a:hover { text-decoration: underline; text-decoration-color: var(--line-strong); }

/* ── Выравнивание: поля в строке и плашки результатов ─────────────────────────────────────────────── */
/* Поля строки выравниваются по низу: длинная подпись в две строки не сдвигает поле относительно соседей */
.grid-fields { align-items: end; }
.grid-fields > .field { align-content: end; }
.field > label { line-height: 1.35; }
.field > label .tip { white-space: nowrap; }
/* Подсказка «i» не переносится на отдельную строку: прилипает к последнему слову подписи */
.field > label { text-wrap: pretty; }
/* Выпадающие списки не обрезают текст — переносим поле на две колонки, если вариант длинный (см. .field.wide) */
.grid-fields select { text-overflow: ellipsis; }

/* Плашки результатов: одна сетка, одинаковые размеры; главные отличаются рамкой и цветом числа, а не размером */
.calc-values { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 0.6rem; }
.calc-values .value { min-width: 0; padding: 0.7rem 0.9rem; gap: 0.2rem; align-content: start; background: var(--surface); border-color: var(--line); }
.calc-values .value.main { background: var(--surface); border-color: var(--line-strong); }
.calc-values .v, .calc-values .main .v { font-size: 1.35rem; line-height: 1.2; color: var(--ink); }
.calc-values .main .k { color: var(--ink); }
.calc-values .k { font-size: 0.8125rem; }
.grid-fields > .field.span-2 { grid-column: span 2; } @media (max-width: 640px) { .grid-fields > .field.span-2 { grid-column: auto; } }
.grid-fields > .field.wide { grid-column: span 2; } @media (max-width: 640px) { .grid-fields > .field.wide { grid-column: auto; } }

/* Ровные ряды плашек: число колонок задаёт скрипт (--cols) */
.calc-values[style*="--cols"], #kpis[style*="--cols"] { display: grid; grid-template-columns: repeat(var(--cols), minmax(0, 1fr)); }
@media (max-width: 700px) { .calc-values[style*="--cols"], #kpis[style*="--cols"] { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Конструктор щита: списки в таблице групп не обрезаются */
table.rows select { min-width: 7.5rem; }
table.rows td:first-child input { min-width: 13rem; }
/* Каталог: характеристики и источник без переносов посреди значения */
.catalog-head ~ section table.list td.small, table.list td.small { white-space: nowrap; }
/* Бренд: 2 × 2 */
.brand-logos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 700px) { .brand-logos { grid-template-columns: minmax(0, 1fr); } }
/* «Как пользоваться» */
.guide-hero { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2rem; align-items: center; }
.guide-hero h1 { margin: 0.2rem 0 0.4rem; }
.guide-hero .muted { max-width: 68ch; margin: 0 0 1rem; }
.guide-fig { margin: 0; } .guide-fig .fig { height: 150px; width: auto; }
.guide-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)); gap: 0.75rem; }
.guide-cards li { display: grid; gap: 0.35rem; align-content: start; padding: 1rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.gc-n { width: 1.6rem; height: 1.6rem; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--line-strong); font: 500 0.75rem var(--mono); color: var(--muted); }
.guide-cards b { font-weight: 500; }
.guide-cards p { margin: 0; color: var(--muted); font-size: 0.875rem; }
.guide-sections { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 0.5rem; }
.guide-sections .tool-text small { white-space: normal; -webkit-line-clamp: 3; line-clamp: 3; }
.guide-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.guide-list-plain { margin: 0; padding-left: 1.1rem; display: grid; gap: 0.5rem; color: var(--ink); }
.guide-list-plain li::marker { color: var(--muted); }
@media (max-width: 900px) { .guide-two, .guide-hero { grid-template-columns: minmax(0, 1fr); } .guide-fig { display: none; } }
.groups-table select[name="kind"] { min-width: 8.5rem; }
.groups-table select[name="phases"] { min-width: 4.2rem; }
.groups-table select[name="phase"] { min-width: 5.2rem; }
.groups-table td:first-child input { min-width: 15rem; }
.groups-table td:first-child input { min-width: 11rem; }
.groups-table select[name="kind"] { min-width: 7.6rem; }
.groups-table select[name="phases"] { min-width: 3.6rem; padding-right: 1.4rem; }
.groups-table select[name="phase"] { min-width: 6.6rem; }
.groups-table input.short { width: 4.2rem; }
.groups-table td, .groups-table th { padding-left: 0.35rem; padding-right: 0.35rem; }
/* Страница обработки раздела: этап, полоса, листы и найденное */
.processing { max-width: 42rem; margin: 2rem auto; display: grid; gap: 0.5rem; }
.processing h1 { margin: 0.25rem 0 0.5rem; font-size: 1.35rem; }
.processing .progress { margin: 0.5rem 0 0.25rem; }
.processing .progress-bar { height: 6px; border-radius: 3px; }
.proc-detail { min-height: 1.4em; margin: 0; font: 500 0.8rem var(--mono); color: var(--muted); }
.processing .actions { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.75rem; }

/* ── Конструктор щита: доска слотов, табличный вид, живая схема (форма ГОСТ 21.613), параметры-карточки ─────── */
:root { --l1: #b07800; --l2: #2f7d5b; --l3: #b0403a; }
:root[data-theme="dark"] { --l1: #e6b23a; --l2: #5fc08f; --l3: #ef7a72; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --l1: #e6b23a; --l2: #5fc08f; --l3: #ef7a72; } }

.pb .panel-main { gap: 1rem; }
.pb .card { padding: 1rem 1.1rem; }
.pb-head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; }
.pb-head .title-row { flex: 1 1 22rem; min-width: 0; }
.pb-warnings { display: grid; gap: 0.4rem; }
.pb-warnings:empty { display: none; }

/* «Опишите щит» */
.pb-ask { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 0.4rem 0.75rem; align-items: center;
  padding: 0.5rem 0.5rem 0.5rem 0.9rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.pb-ask > label { font-weight: 500; white-space: nowrap; }
.pb-ask > input { border: 0 !important; box-shadow: none !important; background: transparent; min-width: 0; padding: 0.4rem 0; }
.pb-ask-note { grid-column: 2 / -1; margin: -0.2rem 0 0.1rem; font-size: 0.8125rem; color: var(--muted); }

.pb-work { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
.pb-work.pb-wide-left { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.pb-col { display: grid; gap: 1rem; min-width: 0; }
.pb-view { display: grid; gap: 1rem; min-width: 0; }
.pb-side { position: sticky; top: 72px; display: grid; gap: 1rem; min-width: 0; }
.pb-side > .card, .pb-pane { min-width: 0; }

/* Переключатель видов */
.pb-viewbar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.9rem; }
.pb-seg, .pb-tabs { display: inline-flex; padding: 3px; gap: 2px; border-radius: 8px; background: var(--surface-3); }
.pb-seg button, .pb-tabs button { border: 0; background: transparent; min-height: 0; padding: 0.35rem 0.85rem; border-radius: 6px;
  color: var(--muted); box-shadow: none; white-space: nowrap; }
.pb-seg button:hover, .pb-tabs button:hover { background: transparent; color: var(--ink); }
.pb-seg button[aria-checked="true"], .pb-tabs button[aria-selected="true"] { background: var(--surface); color: var(--ink); box-shadow: 0 0 0 1px var(--line); }
.pb-viewbar .hint { margin: 0; }

/* Доска 3 × 3: щит в центре */
.pb-board { display: grid; gap: 0.7rem; }
.pb-board-head, .pb-editor-head, .pb-sg-tools { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 0.4rem 0.8rem; }
.pb-board-head h2 { margin: 0; font-size: 1rem; }
.pb-editor-head h3 { margin: 0; font-size: 0.95rem; }
.pb-slots { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.6rem; }
.pb-slot { min-height: 118px; padding: 0.7rem 0.85rem; border-radius: var(--radius); border: 1px dashed var(--line-strong); background: transparent;
  box-shadow: none; text-align: left; display: grid; align-content: start; gap: 0.2rem; font-weight: 400; min-width: 0;
  transition: border-color 0.15s, background 0.15s; }
.pb-slot:hover { border-color: var(--ink); background: var(--surface-2); }
.pb-slot.filled { border-style: solid; border-color: var(--line); background: var(--surface-2); }
.pb-slot.open { border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink); }
.pb-slot-t { font-weight: 500; display: flex; gap: 0.35rem; align-items: baseline; }
.pb-plus { color: var(--muted); }
.pb-slot-d { font-size: 0.78rem; color: var(--muted); line-height: 1.35; }
.pb-slot-num { margin-top: auto; display: flex; gap: 0.75rem; font: 500 0.78rem var(--mono); color: var(--ink); padding-top: 0.2rem; }
.pb-chips { display: flex; flex-wrap: wrap; gap: 0.25rem; margin-top: 0.15rem; min-width: 0; }
.pb-chip { display: inline-flex; align-items: center; gap: 0.3rem; font: 400 0.7rem var(--mono); padding: 0.05rem 0.4rem; border-radius: 4px;
  background: var(--surface-3); color: var(--muted); max-width: 100%; min-width: 0; }
.pb-chip > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.pb-ph { width: 7px; height: 7px; border-radius: 50%; display: inline-block; flex: none; vertical-align: 1px; }
.pb-ph3 { background: conic-gradient(var(--l1) 0 33%, var(--l2) 0 66%, var(--l3) 0); }

.pb-core { grid-column: 2; grid-row: 2; border-radius: var(--radius); padding: 0.8rem 0.9rem; background: var(--ink); color: var(--bg);
  display: grid; gap: 0.35rem; align-content: start; min-width: 0; }
.pb-core-sub { font: 400 0.72rem var(--mono); letter-spacing: 0.03em; opacity: 0.72; overflow-wrap: anywhere; }
.pb-core-big { font: 500 1.75rem/1 var(--mono); letter-spacing: -0.02em; }
.pb-core-big small { font-size: 0.8rem; opacity: 0.7; margin-left: 0.25rem; }
.pb-core-row { display: flex; flex-wrap: wrap; gap: 0.15rem 0.7rem; font: 400 0.78rem var(--mono); opacity: 0.85; }
.pb-phase { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 0.4rem; align-items: center; font: 400 0.72rem var(--mono); }
.pb-bar { height: 5px; border-radius: 3px; background: color-mix(in srgb, var(--bg) 22%, transparent); overflow: hidden; }
.pb-bar span { display: block; height: 100%; border-radius: 3px; transition: width 0.4s var(--ease); }

/* Строки групп: редактор слота и табличный вид */
.pb-editor { display: grid; gap: 0.6rem; }
.pb-editor .hint { margin: 0; }
.pb-table td, .pb-table th { padding: 0.25rem 0.3rem; }
.pb-table input, .pb-table select { padding: 0.2rem 0.4rem; min-height: 0; height: 2rem; }
.pb-table td.pb-nm input { min-width: 9rem; }
.pb-table input.pb-short { width: 4.4rem; text-align: right; font-family: var(--mono); }
.pb-table select[name="kind"] { min-width: 6.8rem; }
.pb-table select[name="slot"] { min-width: 7.8rem; }
.pb-table select[name="phase"] { min-width: 6rem; }
.pb-table .result { cursor: pointer; white-space: nowrap; font-family: var(--mono); font-size: 0.78rem; }
.pb-table .result:hover { background: var(--surface-3); }
.pb-table tr.bad .result { color: var(--critical); }
.pb-table tr.detail td { background: var(--surface-2); white-space: normal; }
.pb-table small.proj { display: block; color: var(--muted); font-size: 0.72rem; font-family: var(--font); }
.pb-table small.proj.diff { color: var(--remark); font-weight: 600; }
.pb-table input.pb-need { border-color: var(--remark) !important; background: var(--remark-soft); }
.pb-table input.pb-need::placeholder { color: var(--remark); }
.pb-table tr.flash td { animation: pb-flash 1.6s ease-out; }
@keyframes pb-flash { from { background: color-mix(in srgb, var(--rec) 20%, transparent); } }

/* Табличный вид: поля выглядят как текст до наведения */
.pb-tv { display: grid; gap: 0.8rem; }
.pb-tv-top { display: grid; grid-template-columns: 17rem minmax(0, 1fr); gap: 0.8rem; align-items: stretch; }
.pb-tv-top .pb-core { grid-column: auto; grid-row: auto; height: 100%; }
.pb-filter { display: flex; flex-wrap: wrap; gap: 0.35rem; align-content: flex-start; }
.pb-filter button { min-height: 0; border: 1px solid var(--line); background: var(--surface); box-shadow: none; border-radius: 999px; padding: 0.2rem 0.65rem;
  font-size: 0.8rem; font-weight: 400; color: var(--ink); }
.pb-filter button b { font-family: var(--mono); font-weight: 500; margin-left: 0.3rem; color: var(--muted); }
.pb-filter button[aria-pressed="true"] { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.pb-filter button[aria-pressed="true"] b { color: var(--bg); }
.pb-tv-table td input, .pb-tv-table td select { border-color: transparent; background: transparent; box-shadow: none; }
.pb-tv-table td input:hover, .pb-tv-table td select:hover { border-color: var(--line); }
.pb-tv-table td input:focus, .pb-tv-table td select:focus { border-color: var(--line-strong); background: var(--input); }
.pb-tv-table td.pb-n { color: var(--muted); }
.pb-tv-foot { display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: center; }
.pb-tv-foot .hint { margin: 0; }

/* Параметры расчёта: варианты с подсказкой */
.pb-params { display: grid; gap: 0.9rem; }
.pb-params h2 { margin: 0; font-size: 1rem; }
.pb-opt-group { display: grid; gap: 0.35rem; }
.pb-opt-group > .hint { margin: 0; }
.pb-opt-label { font-size: 0.8125rem; font-weight: 500; }
.pb-opts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9.5rem), 1fr)); gap: 0.5rem; }
.pb-opt { text-align: left; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); padding: 0.5rem 0.65rem; min-height: 0;
  box-shadow: none; display: grid; gap: 0.1rem; align-content: start; font-weight: 400; cursor: pointer; }
.pb-opt:hover { background: var(--surface-2); }
.pb-opt b { font: 500 0.95rem var(--mono); }
.pb-opt span { font-size: 0.75rem; color: var(--muted); line-height: 1.35; }
.pb-opt[aria-checked="true"] { border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink); }
.pb-opt .pb-rec { font: 500 0.625rem var(--mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--ok); }
.pb-opt .pb-ref { font-family: var(--mono); font-size: 0.7rem; }
.pb-opt-pair { display: flex; align-items: center; justify-content: space-between; gap: 0.4rem; }
.pb-opt-pair label { font-weight: 400; }
.pb-opt-pair input { width: 4rem; height: 1.8rem; padding: 0.15rem 0.35rem; text-align: right; font-family: var(--mono); }
.pb-more summary { cursor: pointer; font-weight: 500; }
.pb-more[open] summary { margin-bottom: 0.6rem; }
.pb-more h3 { font-size: 0.875rem; margin: 0.9rem 0 0.4rem; }

/* Справа: вкладки, схема, сводка */
.pb-scheme { padding: 0.75rem !important; display: grid; gap: 0.6rem; }
.pb-tabs { width: fit-content; max-width: 100%; overflow-x: auto; }
.pb-pane .hint { margin: 0 0 0.4rem; }
.pb-kv-card { padding: 0.3rem 1rem 0.5rem !important; }
.pb-kv { margin: 0; display: grid; }
.pb-kv div { display: flex; justify-content: space-between; gap: 0.6rem; padding: 0.4rem 0; border-bottom: 1px solid var(--line); font-size: 0.8125rem; }
.pb-kv div:last-child { border-bottom: 0; }
.pb-kv dt { font: 500 0.68rem var(--mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); align-self: center; }
.pb-kv dd { margin: 0; font-family: var(--mono); text-align: right; }
.pb-docs h2 { font-size: 1rem; margin: 0 0 0.6rem; }
.pb-docs .hint { margin: 0.6rem 0 0; }
.pb-mini td, .pb-mini th { padding: 0.3rem 0.4rem; font-size: 0.8rem; }
.pb-mini tr[data-col] { cursor: pointer; }
.pb .spec-table { font-size: 0.8rem; }

/* Схема по ГОСТ 21.613: сверху линии, под каждой — колонка таблицы */
.pb-sg-tools .small-button { min-height: 0; }
.pb-sg-scroll { overflow-x: auto; padding-bottom: 4px; max-width: 100%; }
.pb-sg { display: grid; font-size: 0.75rem; line-height: 1.3; }
.pb-sg-cell { padding: 0.3rem 0.35rem; border-bottom: 1px solid var(--line); border-left: 1px solid var(--line); min-width: 0;
  overflow-wrap: anywhere; font-family: var(--mono); }
.pb-sg-cell.pb-sg-top { position: relative; padding: 0; border-bottom: 0; border-left: 0; }
.pb-sg-cell.pb-sg-top svg { display: block; width: 100%; height: 96px; }
.pb-sg-head { font: 500 0.7rem var(--font); color: var(--muted); border-left: 0; }
.pb-sg-name { font-family: var(--font); overflow-wrap: break-word; hyphens: auto; }
.pb-sg-cell.bad { color: var(--critical); }
.pb-sg-rcd { position: absolute; left: calc(50% + 8px); top: 30px; font: 500 9px/1 var(--mono); border: 1px solid var(--ink); border-radius: 2px;
  padding: 2px 3px; background: var(--surface); color: var(--ink); }
.pb-sg-in { position: absolute; right: calc(50% + 6px); top: 6px; font: 500 0.66rem/1.3 var(--mono); color: var(--ink); white-space: nowrap; text-align: right; }
.pb-sg-in span { color: var(--muted); font-weight: 400; }
.pb-sg [data-col] { cursor: pointer; transition: background 0.12s; }
.pb-sg [data-col].hot { background: var(--surface-3); }

/* Выдвижная панель: схема во всю ширину */
.pb-drawer { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; max-height: 72vh; overflow: auto; background: var(--surface);
  border-top: 1px solid var(--line-strong); box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.18);
  padding: 0.9rem 24px calc(1.1rem + env(safe-area-inset-bottom, 0px)); transform: translateY(100%); visibility: hidden;
  transition: transform 0.3s var(--ease), visibility 0s linear 0.3s; }
.pb-drawer.open { transform: none; visibility: visible; transition: transform 0.3s var(--ease); }
.pb-drawer-head { display: flex; justify-content: space-between; align-items: center; gap: 0.6rem; margin-bottom: 0.6rem; }
.pb-drawer-head h2 { margin: 0; font-size: 1rem; }

@media (max-width: 1600px) {
  .pb.panel-layout { grid-template-columns: minmax(0, 1fr); }
  .pb .panel-side { position: static; grid-template-columns: auto minmax(0, 1fr); align-items: center; padding: 0.6rem 0.8rem; }
  .pb .panel-side .side-title { display: none; }
  .pb .saved-list { display: flex; gap: 0.3rem; overflow-x: auto; scrollbar-width: thin; }
  .pb .saved-list a { white-space: nowrap; padding: 0.3rem 0.6rem; }
  .pb .panel-side > .hint { margin: 0; }
}
@media (max-width: 1100px) { .pb-work, .pb-work.pb-wide-left { grid-template-columns: minmax(0, 1fr); } .pb-side { position: static; } }
@media (max-width: 760px) { .pb-tv-top { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) {
  .pb .panel-side { grid-template-columns: minmax(0, 1fr); }
  .pb-slots { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pb-core { grid-column: 1 / -1; grid-row: 1; }
  .pb-ask { grid-template-columns: minmax(0, 1fr) auto; }
  .pb-ask > label { grid-column: 1 / -1; }
  .pb-ask-note { grid-column: 1 / -1; }
  .pb-drawer { padding-inline: 16px; }
}

/* ── Мониторинг (/admin) ─────────────────────────────────────────────────────────────────────── */
.admin { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }  /* minmax: широкие таблицы прокручиваются в .scroll, а не раздвигают страницу */
.admin .section-head { margin-bottom: 0.8rem; }
.admin h2 { margin: 0; }
.admin h3 { margin: 1.2rem 0 0.5rem; }
.segmented a { text-decoration: none; border-radius: 8px; padding: 0.3rem 0.8rem; color: var(--muted); font-weight: 500; }
.segmented a.on { background: var(--surface); color: var(--ink); box-shadow: 0 0 0 1px var(--line), var(--shadow); }
.admin .kpis { grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); }
.admin .kpi .v { font-size: 1.5rem; }
.admin .kpi .k { font-size: 0.8rem; }
.admin .kpi .sub { color: var(--muted); font-size: 0.78rem; margin-top: 0.15rem; }
.charts { display: grid; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); gap: 0.7rem; margin-top: 0.8rem; }
.chart { border: 1px solid var(--line); border-radius: var(--radius); padding: 0.6rem 0.85rem 0.4rem; background: var(--surface); display: grid; gap: 0.3rem; }
.chart .head { display: flex; justify-content: space-between; align-items: baseline; gap: 0.5rem; }
.chart .head b { font-family: var(--mono); font-weight: 600; }
.chart svg.bars { width: 100%; height: auto; display: block; }
svg.bars .bar { fill: var(--ink); opacity: 0.85; }
svg.bars .bar.empty { fill: var(--line); opacity: 1; }
svg.bars .axis { fill: var(--muted); font-size: 10px; font-family: var(--mono); }
.rates { display: grid; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); gap: 0.7rem; }
.rate { border: 1px solid var(--line); border-radius: var(--radius); padding: 0.7rem 0.85rem; background: var(--surface); display: grid; gap: 0.4rem; }
.rate .head { display: flex; justify-content: space-between; align-items: baseline; }
.rate .meter { display: flex; height: 8px; border-radius: 4px; overflow: hidden; background: var(--line); }
.rate .meter i { display: block; height: 100%; }
.rate .meter .acc { background: var(--ok); }
.rate .meter .rej { background: var(--critical); }
.rate .legend { display: flex; flex-wrap: wrap; gap: 0.3rem 1rem; font-size: 0.82rem; color: var(--muted); }
.rate .legend b { color: var(--ink); font-family: var(--mono); font-weight: 600; }
.rate .legend .dot { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 0.35rem; vertical-align: middle; }
.goal.ok { color: var(--ok); }
.goal.bad { color: var(--critical); }
.vision-grid { margin-top: 0.8rem; }
.vision-table td, .vision-table th { white-space: nowrap; }
.admin-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
@media (max-width: 980px) { .admin-grid { grid-template-columns: minmax(0, 1fr); } }
table.list td.num { text-align: right; }
.status-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 0.4rem; vertical-align: middle; background: var(--line-strong); }
.status-dot.ok { background: var(--ok); }
.status-dot.bad { background: var(--critical); }
.health { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 0.6rem 1.2rem; }
.health > div { display: grid; gap: 0.1rem; border-top: 1px solid var(--line); padding-top: 0.5rem; align-content: start; }
.health .k { color: var(--muted); font-size: 0.8rem; }
.health .v { font-family: var(--mono); font-weight: 500; }
.health .v small { color: var(--muted); font-family: var(--font); font-weight: 400; }
.meter-line { height: 4px; border-radius: 2px; background: var(--line); overflow: hidden; margin-top: 0.3rem; }
.meter-line i { display: block; height: 100%; background: var(--ink); opacity: 0.7; }
.meter-line i.bad { background: var(--critical); opacity: 1; }

/* ---------- обратная связь с теста: причина отклонения, «сервис пропустил ошибку» ---------- */
.list-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 1rem; margin: 0.25rem 0 0.75rem; }
.list-tools .progress { flex: 1 1 14rem; margin: 0; }
.list-tools .quiet-button { margin-left: auto; }
.quiet-button { border: 0; background: none; box-shadow: none; min-height: 0; padding: 0.25rem 0.5rem; border-radius: 6px;
  color: var(--muted); font-size: 0.8125rem; white-space: nowrap; cursor: pointer; }
.quiet-button:hover { background: var(--surface-3); color: var(--ink); }
.quiet-button.confirm { color: var(--critical); }

.finding .reason-label:empty { display: none; }
.finding .reason-label { color: var(--muted); }
.finding .reason-label::before { content: "· "; }

.reason-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; padding: 0.5rem 0.8rem 0.6rem 2.6rem;
  border-bottom: 1px solid var(--line); background: var(--surface-2); font-size: 0.8125rem; }
.reason-bar[hidden], .reason-row[hidden] { display: none; }
.reason-q { color: var(--muted); font-size: 0.75rem; }
.reason-bar .segmented button, .reason-row .segmented button { padding: 0.25rem 0.6rem; font-size: 0.75rem; }
.reason-row .segmented button[aria-pressed="true"] { background: var(--surface); color: var(--ink); font-weight: 500;
  box-shadow: 0 0 0 1px var(--line); }
.reason-row { display: grid; gap: 0.3rem; margin-top: 0.25rem; }

.missed-block { border: 1px dashed var(--line-strong); border-radius: 8px; padding: 0.7rem 0.9rem; margin: 0 0 0.75rem; background: var(--surface); }
.missed-block[hidden] { display: none; }
.missed-block-head { display: flex; align-items: baseline; gap: 0.6rem; flex-wrap: wrap; margin-bottom: 0.3rem; }
.missed-block-head h3 { margin: 0; font-size: 0.875rem; font-weight: 600; }
#missed-list { list-style: none; margin: 0; padding: 0; }
.missed-item { display: flex; align-items: flex-start; gap: 0.6rem; padding: 0.5rem 0; border-top: 1px solid var(--line); }
.missed-item:first-child { border-top: 0; }
.missed-item .dot { flex: none; margin: 0.4rem 0 0; }
.missed-item .m-body { flex: 1; min-width: 0; display: grid; gap: 0.15rem; }
.missed-item p { margin: 0; }
.m-text { font-size: 0.8125rem; font-weight: 500; overflow-wrap: anywhere; }
.m-expected { font-size: 0.78rem; color: var(--muted); overflow-wrap: anywhere; }
.m-expected[hidden] { display: none; }
.m-meta { font-size: 0.75rem; color: var(--muted); }

.missed-fields { display: grid; grid-template-columns: 6rem 1fr; gap: 0.75rem; align-items: end; }
.missed-fields input { width: 100%; }
.sev-pick label { display: inline-flex; align-items: center; border-radius: 8px; padding: 0.3rem 0.7rem; color: var(--muted); cursor: pointer; font-size: 0.8125rem; }
.sev-pick input { position: absolute; opacity: 0; pointer-events: none; }
.sev-pick label:has(input:checked) { background: var(--surface); color: var(--ink); font-weight: 500; box-shadow: 0 0 0 1px var(--line); }
.sev-pick label:has(input:focus-visible) { outline: 2px solid var(--ink); outline-offset: 1px; }
#missed-dialog textarea { width: 100%; }

.missed-head { margin-top: 1.2rem; }
.missed-table td { vertical-align: top; }
.reasons-table td .muted { font-size: 0.75rem; }
@media (max-width: 640px) {
  .missed-fields { grid-template-columns: 1fr; }
  .reason-bar { padding-left: 0.8rem; }
}

.cov-bad { color: var(--remark); }
/* Метка «бета» у пункта меню и заголовка ассистента */
.beta-tag { margin-left: 0.35rem; padding: 0 0.4rem; border: 1px solid var(--proto-line); border-radius: 999px; color: var(--proto);
  font-size: 0.6875rem; font-weight: 500; line-height: 1.35; letter-spacing: 0; vertical-align: middle; }

/* ---------- шапка на средних экранах: все разделы должны помещаться без прокрутки ---------- */
@media (max-width: 1560px) and (min-width: 981px) {
  .topnav a .ico { display: none; }
  .topnav a { padding-inline: 0.5rem; }
  .topnav .beta-tag { display: none; }  /* иначе метка обрезается краем прокручиваемого меню */
  .search-button { min-width: 0; }
  .search-button kbd, .logout-form .who { display: none; }
  .topbar-end { gap: 0.6rem; }
}
/* 981–1240 px: разделы с «Мониторингом» и именем не помещаются в одну строку — меню переносится на вторую,
   иначе «Калькуляторы», «Каталог» и «Ассистент» уезжают за край без намёка на прокрутку */
@media (max-width: 1240px) and (min-width: 981px) {
  .search-button span { display: none; }
  .topbar { flex-wrap: wrap; gap: 0.75rem; row-gap: 0; padding: 0.4rem 16px; }
  .topbar-end { margin-left: auto; }
  .topnav { order: 3; flex-basis: 100%; }
  .topnav a { padding-inline: 0.4rem; }
}


/* ── Меню учётки: «Мои проверки», «Мои данные», выход ───────────────────────────────────────────── */
.account-menu { position: relative; }
.account-button { list-style: none; display: inline-flex; align-items: center; gap: 0.4rem; cursor: pointer; color: var(--muted);
  font-weight: 500; font-size: 0.875rem; padding: 0.25rem 0.55rem; border: 1px solid var(--line); border-radius: 999px; white-space: nowrap; }
.account-button::-webkit-details-marker { display: none; }
.account-button:hover, .account-button.active, .account-menu[open] .account-button { color: var(--ink); border-color: var(--line-strong); }
.account-button .who { max-width: 10rem; overflow: hidden; text-overflow: ellipsis; }
.account-pop { position: absolute; right: 0; top: calc(100% + 6px); z-index: 30; min-width: 11rem; display: grid; padding: 0.3rem;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12); }
.account-pop a, .account-pop .logout { display: block; width: 100%; text-align: left; padding: 0.45rem 0.6rem; border-radius: 6px;
  color: var(--ink); text-decoration: none; font: inherit; font-size: 0.875rem; background: none; border: 0; min-height: 0; box-shadow: none; }
.account-pop a:hover, .account-pop .logout:hover { background: var(--surface-3); }
.account-pop .logout-form { display: block; border-top: 1px solid var(--line); margin-top: 0.3rem; padding-top: 0.3rem; }
.account-pop .logout { color: var(--muted); }
@media (max-width: 640px) { .account-button .who { display: none; } }
/* Меню в шапке отчёта («Скачать», «Ещё», вид объекта) — тот же выпадающий список, что у меню учётки */
.pop-menu { position: relative; display: inline-block; }
.pop-menu > summary { list-style: none; cursor: pointer; }
.pop-menu > summary::-webkit-details-marker { display: none; }
.pop-menu > summary.button::after { content: "▾"; margin-left: 0.35rem; font-size: 0.75em; color: var(--muted); }
.pop-menu .account-pop button { display: block; width: 100%; text-align: left; padding: 0.45rem 0.6rem; border-radius: 6px;
  color: var(--ink); font: inherit; font-size: 0.875rem; background: none; border: 0; min-height: 0; box-shadow: none; cursor: pointer; }
.pop-menu .account-pop button:hover, .pop-menu .account-pop button[aria-current] { background: var(--surface-3); }
.kind-menu { margin-left: 0.3rem; }
.kind-menu .account-pop { left: 0; right: auto; }
.object-kind { margin: 0.2rem 0 0; font-size: 0.875rem; }
.run-params { display: grid; gap: 0.35rem; margin-bottom: 0.8rem; }

/* ── Главная: первый экран и «Продолжить» ────────────────────────────────────────────────────────── */
.first-run h1 { font-size: 2rem; line-height: 1.15; letter-spacing: -0.02em; max-width: 22ch; }
.first-run > p { max-width: 60ch; }
.first-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.9rem; margin-top: 0.6rem; }
.first-actions form { margin: 0; }
.first-actions .primary { padding: 0.55rem 1.3rem; font-weight: 600; }
.first-steps { list-style: none; margin: 0.9rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.4rem 1.4rem; color: var(--muted);
  font-size: 0.8125rem; }
.first-steps li { display: inline-flex; align-items: flex-start; gap: 0.45rem; }
.first-steps b { flex: none; display: inline-grid; place-items: center; width: 1.25rem; height: 1.25rem; border-radius: 50%; border: 1px solid var(--line-strong);
  font: 500 0.7rem/1 var(--mono); color: var(--ink); }
.resume { display: flex; align-items: center; gap: 0.45rem; margin: 0 0 1rem; padding: 0.7rem 1rem; border: 1px solid var(--line);
  border-radius: var(--radius); background: var(--surface); color: var(--ink); text-decoration: none; font-size: 0.9375rem; min-width: 0; }
.resume:hover { border-color: var(--line-strong); text-decoration: none; }
.resume:hover .hub-arrow { transform: translateX(3px); color: var(--ink); }
.resume-label { color: var(--muted); flex: none; }
.resume-title { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.resume-note { color: var(--remark); white-space: nowrap; flex: none; }
.resume-note.done { color: var(--ok); }
.resume .hub-arrow { margin-left: auto; flex: none; }
@media (max-width: 640px) {
  .first-run h1 { font-size: 1.6rem; }
  .resume { flex-wrap: wrap; row-gap: 0.1rem; }
  .resume-title { flex: 1 1 60%; }
  .resume-note { white-space: normal; flex-basis: 100%; order: 3; }
}


/* ── «Мои проверки» и «Мои данные» ──────────────────────────────────────────────────────────────── */
.mine h1, .my-data h1 { margin: 0; font-size: 1.5rem; }
.stats-table { max-width: 560px; }
.stats-table td.sub { padding-left: 1.4rem; color: var(--muted); }
.stats-table th.num, .stats-table td.num { white-space: nowrap; }
.mine-list .chip.left { background: var(--remark-soft); color: var(--remark); }
/* узкий экран: длинное название и чипы переносятся, а не растягивают строку (375 px — без прокрутки вбок) */
.mine-list > li { min-width: 0; }
.mine-list a { flex-wrap: wrap; }
.mine-list a > span { min-width: 0; overflow-wrap: anywhere; }
.mine-list small { white-space: normal; }
.my-data h2 { font-size: 1rem; margin: 1.4rem 0 0.4rem; }
.my-data .button { display: inline-flex; align-items: center; gap: 0.45rem; }
.data-facts { margin: 0; padding-left: 1.1rem; display: grid; gap: 0.35rem; color: var(--muted); font-size: 0.875rem; max-width: 75ch; }
.data-objects { list-style: none; margin: 0; padding: 0; display: grid; }
.data-objects > li { display: grid; gap: 0.4rem; padding: 0.75rem 0; border-bottom: 1px solid var(--line); }
.data-objects > li:last-child { border-bottom: 0; }
.do-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.2rem 0.75rem; }
.do-row { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 0.5rem 1rem; font-size: 0.875rem; }
.do-consent { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 0.7rem; margin: 0; }
.do-consent b.ok { color: var(--ok); }
.do-delete summary { cursor: pointer; color: var(--critical); font-weight: 500; }
.do-delete form { margin-top: 0.5rem; max-width: 420px; }
.do-delete button { justify-self: start; }
.recent .do-delete, .saved-list .do-delete { padding: 0 0.4rem 0.3rem; }
.recent .do-delete summary, .saved-list .do-delete summary { font-size: 0.8rem; font-weight: 400; color: var(--muted); }
.change h2 .from-feedback { margin-left: 0.4rem; vertical-align: middle; background: var(--ok-soft); color: var(--ok); font-size: 0.72rem; }


/* Числа сводки: в разметке сразу итоговое значение, появление — только украшение */
@keyframes num-in { from { opacity: 0.4; transform: translateY(0.12em); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: no-preference) {
  .counter b, .kpi .v, .brief-kpi b { animation: num-in 0.45s var(--ease) both; }
}


/* --- организация: только чтение, поручения, лента действий, «Проверки отдела» --- */
.readonly-note { display: flex; align-items: center; gap: 0.4rem; margin: 0.4rem 0 0; color: var(--muted); font-size: 0.88rem; }
.readonly .f-quick, .readonly .status-buttons, .readonly .reason-row, .readonly [data-bulk], .readonly .g-reason,
.readonly [data-open="upload-dialog"], .readonly [data-open="attach-dialog"], .readonly [data-open="missed-dialog"] { display: none !important; }
.tasks { margin-bottom: 1rem; }
.tasks .section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.task-list { list-style: none; margin: 0.5rem 0 0; padding: 0; display: grid; gap: 0.5rem; }
.task { display: flex; align-items: flex-start; gap: 0.6rem; padding: 0.6rem 0.75rem; border: 1px solid var(--line); border-radius: 6px; }
.task.overdue { border-color: var(--critical); }
.task.done .task-text { color: var(--muted); text-decoration: line-through; }
.task-mark { color: var(--muted); padding-top: 0.15rem; }
.task.done .task-mark { color: var(--ok, var(--muted)); }
.task-body { flex: 1; min-width: 0; }
.task-text { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.task-meta { color: var(--muted); font-size: 0.85rem; }
.task-meta .chip { margin-left: 0.3rem; font-weight: 600; }
.task-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(8rem, 14rem) 10rem auto; gap: 0.5rem; margin-top: 0.75rem; }
@media (max-width: 720px) { .task-form { grid-template-columns: 1fr; } }
.activity { margin-bottom: 1rem; }
.activity > summary { display: flex; align-items: baseline; gap: 0.75rem; cursor: pointer; list-style: none; flex-wrap: wrap; }
.activity > summary::-webkit-details-marker { display: none; }
.activity > summary::before { content: "›"; color: var(--muted); transition: transform 0.15s; display: inline-block; }
.activity[open] > summary::before { transform: rotate(90deg); }
.activity > summary h2 { margin: 0; font-size: 1rem; }
.feed { list-style: none; margin: 0.75rem 0 0; padding: 0; max-height: 26rem; overflow: auto; }
.feed-item { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); gap: 0.75rem; padding: 0.45rem 0; border-top: 1px solid var(--line); font-size: 0.9rem; }
.feed-item time { color: var(--muted); font-variant-numeric: tabular-nums; }
.feed-body .chip { background: var(--surface-2); color: var(--muted); font-weight: 600; margin-left: 0.2rem; }
.feed-comment { margin: 0.2rem 0 0; color: var(--muted); white-space: pre-wrap; overflow-wrap: anywhere; }
@media (max-width: 560px) { .feed-item { grid-template-columns: 1fr; gap: 0.1rem; } }
.team-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; flex-wrap: wrap; }
.team-head h1 { margin: 0; }
.team-filters { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0.9rem 0 0.2rem; }
.team-filters a { display: inline-flex; gap: 0.35rem; align-items: center; padding: 0.25rem 0.7rem; border: 1px solid var(--line); border-radius: 999px; color: var(--ink); text-decoration: none; font-size: 0.88rem; }
.team-filters a:hover { border-color: var(--line-strong); }
.team-filters a[aria-current="true"] { background: var(--accent); color: var(--on-accent, #fff); border-color: var(--accent); }
.team-filters b { font-weight: 600; font-variant-numeric: tabular-nums; }
.team-group { margin-top: 1rem; }
.team-group h2 { font-size: 1rem; margin: 0 0 0.4rem; display: flex; gap: 0.5rem; align-items: baseline; }
.team-table td.task-cell { max-width: 22rem; }
.team-table .task-line { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.my-tasks .task { align-items: center; }
.org-admin .org { border-top: 1px solid var(--line); padding-top: 1rem; margin-top: 1rem; }
.org-admin .org-forms { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; align-items: flex-end; margin-top: 0.6rem; }
.org-admin form.inline { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; }
.org-admin input[type=text], .org-admin input:not([type]) { width: 9rem; }
.team-table .chip.left { background: var(--remark-soft); color: var(--remark); }
.team-table .chip.ok, .team-table .chip.error { margin-right: 0.3rem; }
.org-admin form.inline select, .org-admin form.inline input, .org-admin form.inline button { width: auto; margin: 0; }
.org-admin form.inline input[name=login], .org-admin form.inline input[name=org_id], .org-admin form.inline input[name=name] { width: 11rem; }

/* --- «Тестеры» (/admin/testers) --- */
.testers .tester { border-top: 1px solid var(--line); padding: 0.7rem 0 0.2rem; margin-top: 0.8rem; }
.testers .tester summary { cursor: pointer; list-style: none; display: flex; gap: 0.5rem; align-items: baseline; flex-wrap: wrap; }
.testers .tester summary::-webkit-details-marker { display: none; }
.testers .tester summary::before { content: "›"; color: var(--muted); display: inline-block; width: 0.8rem; }
.testers .tester[open] summary::before { transform: rotate(90deg); }
.testers .tester > .scroll, .testers .tester > p { margin-top: 0.6rem; }
.testers .tester-notes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(18rem, 100%), 1fr)); gap: 0.4rem 1.5rem; margin-top: 0.6rem; }
.testers h4 { margin: 0.4rem 0 0.3rem; font-size: 0.85rem; font-weight: 600; }
.testers .quote { color: var(--ink); font-style: italic; }
.testers .chip.t-rejected { background: var(--critical-soft); color: var(--critical); }
.testers .chip.t-missed { background: var(--remark-soft); color: var(--remark); }
.testers .chip.t-feedback { background: var(--surface-2); color: var(--muted); border: 1px solid var(--line); }
.testers .feed-table td { vertical-align: top; }

/* --- Палитра оболочки и главной (--h-*): три уровня поверхностей, холодный голубой акцент ------------------------
   Сейчас ими окрашены оболочка (шапка, боковое меню — shell.css), главная (home.css) и вход; страницы отчёта, щита и
   калькуляторов пока на прежних токенах — следующим шагом их общие токены (--bg, --surface, --line…) переводятся
   на эти значения. Тёмная тема — холодный сине-графитовый тон.
   Контраст (расчёт WCAG): тёмная — основной текст 16,1:1 на фоне / 14,7:1 на карточке, вторичный 7,6 / 6,9,
   третичный 4,8 / 4,4, акцентный текст 7,7 / 7,0, белый на кнопке 4,7; светлая — 17,9 / 5,8 / 3,9 / 5,7 / 5,7. */
:root {
  --h-bg: #f5f6f8; --h-panel: #fbfcfd; --h-card: #ffffff; --h-card-hover: #ffffff; --h-sunken: #f7f8fa;
  --h-line: #e3e6eb; --h-line-strong: #cbd1d9; --h-ink: #12151a; --h-ink-2: #5e6672; --h-ink-3: #737b87;
  --h-accent: #1f6fd1; --h-accent-text: #1a65c2; --h-btn: #1a65c2; --h-btn-hover: #1659ad; --h-on-accent: #ffffff;
  --h-accent-soft: rgba(31, 111, 209, 0.07); --h-accent-line: rgba(31, 111, 209, 0.5);
  --h-tile-bg: rgba(31, 111, 209, 0.06); --h-tile-line: rgba(31, 111, 209, 0.18); --h-tile-ink: #1f6fd1;
  --h-art: #c4ccd7; --h-art-2: #d9dfe6; --h-art-accent: #7fa9de; --h-art-text: #8b94a1;
  --h-err: #c9312f; --h-err-soft: #fdf1f0; --h-ok: #1f7a3e; --h-ok-soft: #ecf7ef; --h-warn: #9a5b00; --h-warn-soft: #fdf4e3;
  --h-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
  --h-shadow-lg: 0 1px 2px rgba(16, 24, 40, 0.04), 0 12px 32px -14px rgba(16, 24, 40, 0.14);
}
:root[data-theme="dark"] {
  --h-bg: #0a0e14; --h-panel: #0e131b; --h-card: #121925; --h-card-hover: #16202d; --h-sunken: #0c1119;
  --h-line: #1d2633; --h-line-strong: #2a3545; --h-ink: #e6ebf2; --h-ink-2: #98a3b3; --h-ink-3: #74808f;
  --h-accent: #2f8cff; --h-accent-text: #5aa6ff; --h-btn: #1f72d6; --h-btn-hover: #1a6ad0; --h-on-accent: #ffffff;
  --h-accent-soft: rgba(47, 140, 255, 0.08); --h-accent-line: rgba(47, 140, 255, 0.55);
  --h-tile-bg: rgba(47, 140, 255, 0.07); --h-tile-line: rgba(47, 140, 255, 0.2); --h-tile-ink: #6cb0ff;
  --h-art: #263447; --h-art-2: #1a2433; --h-art-accent: #2b5f99; --h-art-text: #56657a;
  --h-err: #ff6b6b; --h-err-soft: rgba(255, 107, 107, 0.08); --h-ok: #4cc38a; --h-ok-soft: rgba(76, 195, 138, 0.1);
  --h-warn: #f2a63a; --h-warn-soft: rgba(242, 166, 58, 0.1);
  --h-shadow: none; --h-shadow-lg: 0 16px 40px -20px rgba(0, 0, 0, 0.7);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --h-bg: #0a0e14; --h-panel: #0e131b; --h-card: #121925; --h-card-hover: #16202d; --h-sunken: #0c1119;
    --h-line: #1d2633; --h-line-strong: #2a3545; --h-ink: #e6ebf2; --h-ink-2: #98a3b3; --h-ink-3: #74808f;
    --h-accent: #2f8cff; --h-accent-text: #5aa6ff; --h-btn: #1f72d6; --h-btn-hover: #1a6ad0; --h-on-accent: #ffffff;
    --h-accent-soft: rgba(47, 140, 255, 0.08); --h-accent-line: rgba(47, 140, 255, 0.55);
    --h-tile-bg: rgba(47, 140, 255, 0.07); --h-tile-line: rgba(47, 140, 255, 0.2); --h-tile-ink: #6cb0ff;
    --h-art: #263447; --h-art-2: #1a2433; --h-art-accent: #2b5f99; --h-art-text: #56657a;
    --h-err: #ff6b6b; --h-err-soft: rgba(255, 107, 107, 0.08); --h-ok: #4cc38a; --h-ok-soft: rgba(76, 195, 138, 0.1);
    --h-warn: #f2a63a; --h-warn-soft: rgba(242, 166, 58, 0.1);
    --h-shadow: none; --h-shadow-lg: 0 16px 40px -20px rgba(0, 0, 0, 0.7);
  }
}
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0; }

/* --- Единая палитра сервиса: базовые токены страниц → --h-* (обе темы) -------------------------------------------
   Уровни: фон --h-bg → панели и секции --h-panel (--surface-2) → карточки --h-card (--surface) → «утопленные» поля
   и таблицы --h-sunken (--input). Состояния: критично — --h-err, важно — --h-warn, рекомендация — голубой акцент,
   успех — --h-ok. Селекторы повторяют те, что задают тему выше, — блок стоит последним и перекрывает их. */
:root, :root[data-theme="dark"], :root:not([data-theme="light"]) {
  --bg: var(--h-bg); --surface: var(--h-card); --surface-2: var(--h-panel);
  --surface-3: color-mix(in srgb, var(--h-ink) 6%, var(--h-card)); --input: var(--h-sunken);
  --ink: var(--h-ink); --muted: var(--h-ink-2); --line: var(--h-line); --line-strong: var(--h-line-strong);
  --accent: var(--h-btn); --accent-hover: var(--h-btn-hover); --accent-ink: var(--h-accent-text);
  --accent-soft: var(--h-accent-soft); --accent-line: var(--h-accent-line); --on-accent: var(--h-on-accent);
  --link: var(--h-accent-text); --focus: color-mix(in srgb, var(--h-accent) 30%, transparent); --shadow: var(--h-shadow);
  --ok: var(--h-ok); --ok-soft: var(--h-ok-soft);
  --critical: var(--h-err); --critical-soft: var(--h-err-soft); --critical-line: color-mix(in srgb, var(--h-err) 40%, var(--h-card));
  --remark: var(--h-warn); --remark-soft: var(--h-warn-soft); --remark-line: color-mix(in srgb, var(--h-warn) 40%, var(--h-card));
  --rec: var(--h-accent-text); --rec-soft: var(--h-accent-soft); --rec-line: color-mix(in srgb, var(--h-accent) 40%, var(--h-card));
  --plan-bg: var(--h-sunken); --dev-fill: var(--h-card); --fig: var(--h-art); --fig-hid: var(--h-art-2);
}
/* Даты, время и прочие поля с системной отрисовкой — в цветах темы (в тёмной теме — тёмный календарь) */
input[type="date"], input[type="time"], input[type="datetime-local"], input[type="month"], input[type="search"],
input[type="email"], input[type="tel"], input[type="url"] {
  font: inherit; padding: 0.45rem 0.6rem; border: 1px solid var(--line); border-radius: 6px; background: var(--input);
  color: var(--ink); color-scheme: inherit; }
input[type="number"] { background: var(--input); color: var(--ink); }
dialog { background: var(--surface); color: var(--ink); border-color: var(--line-strong); }
.toast.error { background: var(--surface); color: var(--critical); border: 1px solid var(--critical-line); }
/* Выбранное и активное — голубой акцент (рамка и мягкий фон), а не инверсия «белое на тёмном» */
.ver.current, .pb-filter button[aria-pressed="true"], .team-filters a[aria-current="true"] {
  background: var(--accent-soft); color: var(--accent-ink); border-color: var(--accent-line); }
.pb-slot.open, .pb-opt[aria-checked="true"], .as-action:has(input:checked) {
  border-color: var(--h-accent); box-shadow: 0 0 0 1px var(--h-accent); }
.pb-slot:hover, .dropzone:hover { border-color: var(--accent-line); }
.dropzone.has-files { border-color: var(--line-strong); }
.pb-core { background: var(--accent-soft); color: var(--ink); border: 1px solid var(--accent-line); }
.progress-bar span, .meter-line i { background: var(--h-accent); }
.ai-ico { background: var(--h-tile-bg); color: var(--h-tile-ink); border: 1px solid var(--h-tile-line); }
svg.bars .bar { fill: var(--h-accent); opacity: 0.9; }

/* --- Шрифт заголовков: одна строка переключает вариант ----------------------------------------------------------
   Сравнивались (тёмная тема, главная и шапка отчёта): Geist 700, Onest 700, Manrope 800, Inter Tight 700. Выбран Onest:
   кириллица — основная для гарнитуры, плотный и «инженерный» без холодной узости, хорошо стоит рядом с Geist (текст)
   и Geist Mono (числа); грузятся только 600/700, по подмножествам кириллица + латиница. Вернуть Geist:
   --font-display: var(--font);  Manrope / Inter Tight — добавить семейство в @import и указать здесь. */
:root { --font-display: "Onest", var(--font); --display-track: -0.03em; }
h1, h2, h3, .home-title, .auth-title { font-family: var(--font-display); }
h1 { font-weight: 700; letter-spacing: var(--display-track); line-height: 1.12; }
h2 { font-weight: 600; letter-spacing: -0.015em; line-height: 1.25; }
h3 { font-weight: 600; letter-spacing: -0.005em; }
.home-title, .auth-title { font-weight: 700; letter-spacing: var(--display-track); line-height: 1.03; }

/* Понятный отчёт (report-clarity33): покрытие с советом по виду листа, клавиши за «?», поручения ниже результата */
.cov-groups { margin: 0.35rem 0 0; padding: 0; list-style: none; display: grid; gap: 0.25rem; font-size: 0.9rem; color: var(--h-ink); }
.cov-groups .cov-group { padding-left: 0.8rem; border-left: 2px solid var(--h-warn); }
.cov-groups .cov-group.cov-file { border-left-color: var(--h-err); }
.cov-groups .muted { color: var(--h-ink-2); }
.checks-line { margin-top: 0.35rem; }
.tab .tab-sep { color: var(--h-ink-3); }
.keys-help { position: relative; }
.keys-help > summary { list-style: none; display: inline-grid; place-items: center; cursor: pointer; font-weight: 600;
  font-size: 0.85rem; border: 1px solid var(--h-line-strong); border-radius: 50%; color: var(--h-ink-2); }
.keys-help > summary::-webkit-details-marker { display: none; }
.keys-help[open] > summary { color: var(--h-accent-text); border-color: var(--h-accent-line); }
.keys-pop { position: absolute; z-index: 20; top: calc(100% + 6px); right: 0; display: grid; gap: 0.35rem; min-width: 15rem;
  padding: 0.7rem 0.85rem; background: var(--h-card); border: 1px solid var(--h-line-strong); border-radius: 10px;
  box-shadow: var(--h-shadow-lg); color: var(--h-ink-2); font-size: 0.85rem; }
.keys-pop b { color: var(--h-ink); }
details.tasks > summary { cursor: pointer; list-style: none; }
details.tasks > summary::-webkit-details-marker { display: none; }
details.tasks > summary h2::before { content: "▸"; display: inline-block; width: 1rem; color: var(--h-ink-3); }
details.tasks[open] > summary h2::before { content: "▾"; }
details.tasks .count { font-size: 0.8rem; font-weight: 500; color: var(--h-ink-2); margin-left: 0.3rem; }

/* Печать и PDF из браузера — всегда светлые цвета, независимо от темы экрана */
@media print {
  :root, :root[data-theme="dark"], :root:not([data-theme="light"]) {
    color-scheme: light;
    --h-bg: #ffffff; --h-panel: #ffffff; --h-card: #ffffff; --h-card-hover: #ffffff; --h-sunken: #f7f8fa;
    --h-line: #d9dde3; --h-line-strong: #b9c0ca; --h-ink: #111111; --h-ink-2: #444b55; --h-ink-3: #5e6672;
    --h-accent: #1f6fd1; --h-accent-text: #1a65c2; --h-btn: #1a65c2; --h-btn-hover: #1659ad; --h-on-accent: #ffffff;
    --h-accent-soft: #eef4fc; --h-accent-line: #9fc0ea; --h-err: #c9312f; --h-err-soft: #fdf1f0; --h-ok: #1f7a3e;
    --h-ok-soft: #ecf7ef; --h-warn: #9a5b00; --h-warn-soft: #fdf4e3; --h-shadow: none;
  }
}

/* «Как читать отчёт» — одна строка, подробности по раскрытию */
details.read-hint { display: block; padding: 0.55rem 0.9rem; }
details.read-hint > summary { display: flex; align-items: center; gap: 0.6rem; cursor: pointer; list-style: none; color: var(--muted); }
details.read-hint > summary::-webkit-details-marker { display: none; }
details.read-hint > summary > .ico { color: var(--link); flex: none; }
details.read-hint > summary b { color: var(--ink); }
details.read-hint .rh-more { margin-left: auto; white-space: nowrap; }
details.read-hint[open] .rh-more { display: none; }
details.read-hint .rh-body { margin: 0.5rem 0 0 1.6rem; color: var(--muted); display: grid; gap: 0.2rem; justify-items: start; }

/* Ссылки «только просмотр» у отчёта (диалог «Поделиться») */
.share-dialog { max-width: 640px; }
.share-copy { display: flex; gap: 0.5rem; }
.share-copy input { flex: 1 1 auto; min-width: 0; font-family: var(--font-mono, monospace); font-size: 0.85rem; }
.share-new label { display: block; margin-bottom: 0.35rem; color: var(--ok); font-weight: 600; }
.share-list-title { margin: 0.5rem 0 0; font-size: 0.95rem; }
.share-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.35rem; }
.share-item { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.45rem 0.6rem;
  border: 1px solid var(--line); border-radius: 8px; font-size: 0.88rem; color: var(--muted); }
.share-item.st-active { color: var(--ink); }
.share-item form { margin: 0; }
.share-created { max-width: 760px; }
.share-created .share-copy { margin: 0.75rem 0 1rem; }