/* Узел B: разделы «Персонал» — явка, табель, сотрудники, заселение, настройки.
   Все цвета — через переменные, отдельно для светлой и тёмной темы. */

html[data-theme="light"], html[data-theme="bunny"], html:not([data-theme]) {
  --st-work-bg: #dcf5e3;   --st-work-ink: #14532d;   --st-work-line: #22a35a;
  --st-off-bg: #ececf0;    --st-off-ink: #3f3f46;    --st-off-line: #8e8e98;
  --st-vac-bg: #dbeafe;    --st-vac-ink: #1e3a8a;    --st-vac-line: #3b82f6;
  --st-sick-bg: #fef3c7;   --st-sick-ink: #78350f;   --st-sick-line: #d97706;
  --st-absent-bg: #fde2e2; --st-absent-ink: #991b1b; --st-absent-line: #dc2626;
  --st-empty-bg: rgba(255, 255, 255, 0.55); --st-empty-ink: #6b7280;
  --st-red: #d92d20;   --st-red-ink: #ffffff;
  --st-orange: #e67700; --st-orange-ink: #ffffff;
  --st-free-bg: #e7f8ee; --st-free-ink: #146c3a; --st-free-line: #34c26f;
  --st-busy-bg: #eef1f6; --st-busy-ink: #334155; --st-busy-line: #b8c2d3;
  --st-part-bg: #fff4d6; --st-part-ink: #7a4b00;
  --st-full-bg: #fde4e4; --st-full-ink: #9b1c1c;
  --st-solid: #ffffff;
  --st-sticky-bg: #f4f7fb;
  --st-today: rgba(0, 113, 227, 0.12);
  --st-weekend: rgba(220, 38, 38, 0.06);
  --bunny-fur: #ffffff; --bunny-line: #5b5b66; --bunny-ear: #ffc0d3; --bunny-cheek: #ffb3c7; --bunny-eye: #26262b;
  --bunny-happy: #22c55e; --bunny-sad: #ef4444;
}

html[data-theme="dark"] {
  --st-work-bg: #12391f;   --st-work-ink: #a7f3c0;   --st-work-line: #34d27a;
  --st-off-bg: #2c2c33;    --st-off-ink: #d4d4dc;    --st-off-line: #71717a;
  --st-vac-bg: #172b52;    --st-vac-ink: #b9d4ff;    --st-vac-line: #60a5fa;
  --st-sick-bg: #3d2c08;   --st-sick-ink: #fcd98a;   --st-sick-line: #f59e0b;
  --st-absent-bg: #471a1a; --st-absent-ink: #ffb4b4; --st-absent-line: #f87171;
  --st-empty-bg: rgba(255, 255, 255, 0.05); --st-empty-ink: #9ca3af;
  --st-red: #ef4444;   --st-red-ink: #ffffff;
  --st-orange: #f59e0b; --st-orange-ink: #1a1200;
  --st-free-bg: #10351f; --st-free-ink: #9ff0bf; --st-free-line: #34d27a;
  --st-busy-bg: #262a33; --st-busy-ink: #d6dbe5; --st-busy-line: #4b5363;
  --st-part-bg: #3a2c0b; --st-part-ink: #fcd98a;
  --st-full-bg: #431b1b; --st-full-ink: #ffb4b4;
  --st-solid: #1c1c21;
  --st-sticky-bg: #1f1f25;
  --st-today: rgba(10, 132, 255, 0.22);
  --st-weekend: rgba(248, 113, 113, 0.08);
  --bunny-fur: #f3f3f6; --bunny-line: #2a2a31; --bunny-ear: #ff9ab8; --bunny-cheek: #ff9ab8; --bunny-eye: #17171b;
  --bunny-happy: #4ade80; --bunny-sad: #f87171;
}

/* ---------- общие ---------- */
.muted { color: var(--muted); }
.small { font-size: 0.85em; }
.pad { padding: 0.5rem 0.75rem; }
.grow { flex: 1 1 auto; }
.narrow { flex: 0 0 auto; }
.narrow input { min-width: 0; width: 6.5rem; }
.danger-text { color: var(--danger-ink); font-weight: 600; }
.field-required > span::after { content: " *"; color: var(--danger-ink); }
.section-title { margin: 1.4rem 0 0.7rem; }

.page-head {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: 0.75rem 1rem; margin-bottom: 1rem;
}
.page-head h1 { margin-bottom: 0.15rem; }
.page-head p { margin: 0; }

.back-link { display: inline-flex; align-items: center; min-height: 44px; color: var(--muted); text-decoration: none; }
.back-link:hover { color: var(--ink); }

button.big, .button-link.big, a.big { min-height: 48px; padding: 0.6rem 1.15rem; border-radius: 12px; }
.button-link {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.35rem;
  min-height: 2.4rem; padding: 0.45rem 0.95rem; border-radius: 8px;
  border: 1px solid var(--input-border); background: var(--input-bg); color: var(--ink);
  text-decoration: none; font-weight: var(--weight); cursor: pointer; font: inherit;
}
.button-link:hover { background: var(--hover); }
.button-link.primary { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.button-link.primary:hover { background: var(--accent-dark); }
button.danger-outline { border-color: var(--danger-line); color: var(--danger-ink); background: var(--danger-bg); }
button:disabled { opacity: 0.55; cursor: not-allowed; }
button:focus-visible, a:focus-visible { outline: 3px solid var(--focus-ring); outline-offset: 2px; }

.count-pill {
  display: inline-flex; align-items: center; justify-content: center; min-width: 1.6rem; height: 1.45rem;
  padding: 0 0.45rem; border-radius: 999px; background: var(--soft); border: 1px solid var(--line);
  color: var(--ink); font-size: 0.8rem; font-weight: 600; vertical-align: middle;
}
.count-pill.free { background: var(--st-free-bg); color: var(--st-free-ink); border-color: transparent; }
.count-pill.full { background: var(--st-full-bg); color: var(--st-full-ink); border-color: transparent; }

.warn-mark {
  display: inline-flex; align-items: center; justify-content: center; width: 1.15rem; height: 1.15rem;
  margin-left: 0.3rem; border-radius: 50%; background: var(--st-red); color: var(--st-red-ink);
  font-size: 0.75rem; font-weight: 800; line-height: 1; vertical-align: middle;
}
.lock-note { color: var(--muted); font-size: 0.85rem; }
.sticky-msg { position: sticky; top: 0.5rem; z-index: 20; box-shadow: var(--shadow); }

.filter-bar, .staff-form {
  display: flex; flex-wrap: wrap; align-items: flex-end; gap: 0.65rem 0.75rem; margin-bottom: 1rem;
}
.staff-form label, .filter-bar label { min-width: 0; }
.staff-form input, .staff-form select, .filter-bar input, .filter-bar select { min-height: 44px; }
.filter-bar .grow input, .staff-form .grow input { width: 100%; }

.chip-select { display: flex; flex-wrap: wrap; gap: 0.45rem; }
button.chip-option, label.chip-option {
  display: inline-flex; flex-direction: row; align-items: center; gap: 0.4rem;
  min-height: 44px; padding: 0.4rem 0.85rem; border-radius: 999px; background: var(--soft); color: var(--ink);
  border: 1px solid var(--input-border); cursor: pointer;
}
label.chip-option input { min-width: 0; width: 1.1rem; height: 1.1rem; margin: 0; }
button.chip-option.on, label.chip-option.on { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }

.scroll-tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
.scroll-tabs > * { flex: 0 0 auto; }

.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-bottom: 1rem; border-radius: 18px; }
.table-scroll > table { overflow: visible; margin-bottom: 0; }
.staff-table td, .staff-table th { white-space: nowrap; }
.staff-table tr.dismissed td { color: var(--muted); }
.sticky-first th:first-child, .sticky-first td:first-child {
  position: sticky; left: 0; z-index: 2; background: var(--st-sticky-bg);
}
.staff-table tfoot td { font-weight: 700; background: var(--soft); }

.stat-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr)); gap: 0.6rem; margin: 0 0 1rem; }
.stat-card {
  display: flex; flex-direction: column; gap: 0.2rem; padding: 0.75rem 0.9rem; border-radius: 14px;
  background: var(--panel); border: var(--card-border);
}
.stat-card span { color: var(--muted); font-size: 0.85rem; }
.stat-card strong { font-size: 1.35rem; font-weight: 650; }

.sticky-actions {
  position: sticky; bottom: 0; z-index: 15; padding: 0.75rem; margin: 1rem -0.25rem 0;
  background: var(--panel); border: var(--card-border); border-radius: 16px; box-shadow: var(--shadow);
  backdrop-filter: var(--glass); -webkit-backdrop-filter: var(--glass);
}

.history-list, .alert-list { list-style: none; margin: 0.5rem 0 0; padding: 0; display: grid; gap: 0.35rem; }
.history-list li { padding: 0.45rem 0.6rem; border-radius: 10px; background: var(--soft); }
.alert-list li { display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.4rem 0.5rem; border-radius: 10px; }
.alert-list li:hover { background: var(--hover); }
.alert-list a { color: inherit; }
.sev-dot { flex: 0 0 auto; width: 0.7rem; height: 0.7rem; margin-top: 0.35rem; border-radius: 50%; background: var(--st-orange); }
.sev-red .sev-dot { background: var(--st-red); }
.sev-orange .sev-dot { background: var(--st-orange); }
.alert-msg { color: var(--muted); }

/* ---------- тема: солнце/луна ---------- */
.theme-toggle {
  display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0;
  margin-left: auto; border-radius: 50%; background: var(--soft); color: var(--ink); flex: 0 0 auto;
}
.theme-toggle svg { width: 22px; height: 22px; }
.brand-with-toggle { display: flex; align-items: center; gap: 0.5rem; }
.mobile-bar .theme-toggle { margin-left: auto; }

/* ---------- настройки: справочники, жильё, пользователи ---------- */
.dir-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr)); gap: 1rem; }
.staff-dir-head h2 { display: flex; align-items: center; gap: 0.5rem; }
.staff-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.35rem; }
.staff-list li {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem;
  padding: 0.5rem 0.65rem; border-radius: 12px; background: var(--soft); min-height: 48px;
}
.staff-list li.is-editing { outline: 2px solid var(--accent); }
.staff-list-main { display: flex; flex-direction: column; min-width: 0; }
.staff-list-name { font-weight: 600; overflow-wrap: anywhere; }
.staff-list-actions { display: flex; flex-wrap: wrap; gap: 0.35rem; align-items: center; }
.staff-list-actions button { min-height: 40px; }
.staff-multi { display: grid; gap: 0.75rem; margin: 0.75rem 0; }
.staff-multi-title { font-weight: 600; margin-bottom: 0.35rem; }

.housing-district { margin-bottom: 1.4rem; }
.housing-district-title { display: flex; align-items: center; gap: 0.5rem; }
.housing-house { margin-bottom: 1rem; }
.housing-house-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem; margin-bottom: 0.75rem; }

.apt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(15.5rem, 1fr)); gap: 0.75rem; }
.apt-card {
  display: flex; flex-direction: column; gap: 0.45rem; padding: 0.8rem 0.9rem; border-radius: 14px;
  background: var(--soft); border: 1px solid var(--line);
}
.apt-card-head, .apt-card > header { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; flex-wrap: wrap; }
.apt-card > header a, .apt-title { color: var(--ink); font-weight: 650; text-decoration: none; }
.apt-new { border-style: dashed; }
.apt-row { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; flex-wrap: wrap; }
.rent-input { width: 8rem; min-width: 0; min-height: 40px; }
.row-buttons { display: flex; flex-wrap: wrap; gap: 0.5rem; }

.occ-badge {
  display: inline-flex; align-items: center; padding: 0.15rem 0.55rem; border-radius: 999px;
  font-size: 0.8rem; font-weight: 650; background: var(--soft); color: var(--ink); white-space: nowrap;
}
.occ-badge.occ-empty { background: var(--st-free-bg); color: var(--st-free-ink); }
.occ-badge.occ-part { background: var(--st-part-bg); color: var(--st-part-ink); }
.occ-badge.occ-full { background: var(--st-full-bg); color: var(--st-full-ink); }

.bed-dots { display: flex; flex-wrap: wrap; gap: 0.3rem; }
.bed-dot {
  display: inline-flex; align-items: center; justify-content: center; width: 1.8rem; height: 1.8rem;
  border-radius: 8px; font-size: 0.78rem; font-weight: 700; border: 1.5px solid;
}
.bed-dot.free { background: var(--st-free-bg); color: var(--st-free-ink); border-color: var(--st-free-line); }
.bed-dot.busy { background: var(--st-busy-bg); color: var(--st-busy-ink); border-color: var(--st-busy-line); }

.stepper { display: inline-flex; align-items: center; gap: 0.35rem; }
.stepper button { width: 44px; height: 44px; padding: 0; font-size: 1.25rem; border-radius: 12px; }
.stepper span { min-width: 2rem; text-align: center; font-weight: 700; }

.bed-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.4rem; }
.bed-list li { display: flex; align-items: center; gap: 0.6rem; padding: 0.5rem 0.65rem; border-radius: 12px; min-height: 48px; background: var(--soft); }
.bed-list li.free { background: var(--st-free-bg); color: var(--st-free-ink); }
.bed-no {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 1.9rem; height: 1.9rem;
  border-radius: 8px; background: var(--panel); border: 1px solid var(--line); font-weight: 700; font-size: 0.85rem;
}
.bed-who { flex: 1 1 auto; min-width: 0; }
.salary-panel { border-left: 4px solid var(--accent); }

/* ---------- табель ---------- */
.month-switch { display: inline-flex; align-items: center; gap: 0.4rem; }
.month-switch button { width: 44px; height: 44px; padding: 0; border-radius: 12px; font-size: 1.1rem; }
.month-title { min-width: 9rem; text-align: center; font-weight: 650; text-transform: capitalize; }

.ts-tabs {
  display: flex; gap: 0.45rem; overflow-x: auto; overflow-y: visible; padding: 0.6rem 0.2rem 0.5rem;
  margin-bottom: 0.75rem; scrollbar-width: thin; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity;
}
.ts-tab-wrap { position: relative; flex: 0 0 auto; scroll-snap-align: start; }
button.ts-tab {
  display: inline-flex; align-items: center; gap: 0.45rem; min-height: 48px; padding: 0.45rem 0.95rem;
  border-radius: 12px; background: var(--soft); color: var(--muted); white-space: nowrap;
}
button.ts-tab.active { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.ts-tab-count { font-size: 0.8rem; opacity: 0.85; }
.notif-badge {
  position: absolute; top: -0.45rem; right: -0.35rem; z-index: 3; min-width: 1.45rem; height: 1.45rem;
  padding: 0 0.35rem; border-radius: 999px; border: 2px solid var(--st-solid);
  font-size: 0.72rem; font-weight: 800; line-height: 1; display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}
.notif-badge.inline { position: static; border: 0; cursor: default; box-shadow: none; }
.notif-badge.sev-red, button.notif-badge.sev-red { background: var(--st-red); color: var(--st-red-ink); }
.notif-badge.sev-orange, button.notif-badge.sev-orange { background: var(--st-orange); color: var(--st-orange-ink); }
.alert-pop {
  display: none; position: fixed; z-index: 60; left: 50%; top: 18vh; transform: translateX(-50%);
  width: min(26rem, calc(100vw - 1.5rem)); max-height: 60vh; overflow: auto; padding: 0.85rem 1rem;
  border-radius: 16px; background: var(--st-solid); color: var(--ink); border: 1px solid var(--line); box-shadow: var(--dialog-shadow);
}
.alert-pop.open { display: block; }
.alert-pop-head { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; font-weight: 650; margin-bottom: 0.4rem; }

.ts-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem 0.9rem; margin-bottom: 0.75rem; }
.legend { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0.3rem 0.5rem; color: var(--muted); font-size: 0.85rem; }
.legend .ts-cell { width: 1.7rem; height: 1.5rem; min-width: 0; font-size: 0.75rem; }

.ts-scroll { max-height: calc(100dvh - 15rem); overflow: auto; border: var(--card-border); background: var(--panel); }
table.ts-grid { width: max-content; min-width: 100%; border-radius: 0; box-shadow: none; border: 0; backdrop-filter: none; -webkit-backdrop-filter: none; }
.ts-grid th, .ts-grid td { padding: 0.18rem; text-align: center; border-bottom: 1px solid var(--line); border-right: 1px solid var(--line); }
.ts-grid thead th { position: sticky; top: 0; z-index: 3; background: var(--st-sticky-bg); font-size: 0.8rem; }
.ts-grid thead th small { display: block; color: var(--muted); font-size: 0.68rem; text-transform: lowercase; }
.ts-grid .ts-name {
  position: sticky; left: 0; z-index: 2; min-width: 11.5rem; max-width: 14rem; padding: 0.35rem 0.6rem;
  text-align: left; background: var(--st-sticky-bg); white-space: normal; line-height: 1.2;
}
.ts-grid thead .ts-name { z-index: 4; }
.ts-grid .ts-name a { color: var(--ink); font-weight: 600; text-decoration: none; }
.ts-grid .ts-name small { display: block; color: var(--muted); font-size: 0.75rem; }
.ts-grid .ts-weekend { background: var(--st-weekend); }
.ts-grid thead .ts-weekend { color: var(--st-absent-ink); }
.ts-grid .ts-today { box-shadow: inset 0 -3px 0 var(--accent); }
.ts-grid .ts-total, .ts-grid .ts-daytotal { font-weight: 650; font-size: 0.82rem; padding: 0.25rem 0.45rem; white-space: nowrap; }
.ts-grid tfoot th, .ts-grid tfoot td { background: var(--st-sticky-bg); position: sticky; bottom: 0; z-index: 2; }
.ts-grid tfoot .ts-name { z-index: 4; }
.ts-cellwrap { padding: 2px !important; }

.ts-cell {
  display: inline-flex; align-items: center; justify-content: center; width: 2.15rem; height: 2.15rem; min-width: 2.15rem;
  padding: 0; border-radius: 7px; border: 1px solid transparent; font-size: 0.8rem; font-weight: 700; line-height: 1;
  background: var(--st-empty-bg); color: var(--st-empty-ink);
}
button.ts-cell:hover { filter: brightness(0.95); outline: 2px solid var(--accent); }
.ts-work { background: var(--st-work-bg); color: var(--st-work-ink); border-color: var(--st-work-line); }
.ts-off { background: var(--st-off-bg); color: var(--st-off-ink); border-color: var(--st-off-line); }
.ts-vac { background: var(--st-vac-bg); color: var(--st-vac-ink); border-color: var(--st-vac-line); }
.ts-sick { background: var(--st-sick-bg); color: var(--st-sick-ink); border-color: var(--st-sick-line); }
.ts-absent { background: var(--st-absent-bg); color: var(--st-absent-ink); border-color: var(--st-absent-line); }
.ts-vac-suggest { background: transparent; color: var(--st-vac-ink); border: 1.5px dashed var(--st-vac-line); }
.ts-empty { background: var(--st-empty-bg); color: var(--st-empty-ink); }

.cell-detail { margin-top: 0.5rem; }
.cell-detail-head { display: flex; justify-content: space-between; gap: 0.5rem; align-items: center; }

/* личный табель */
.suggest-panel { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; margin-bottom: 1rem; border-left: 4px solid var(--st-vac-line); }
.pt-days { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; }
.pt-day {
  display: grid; grid-template-columns: 7.5rem 1fr; gap: 0.75rem; padding: 0.7rem 0.85rem; border-radius: 14px;
  background: var(--panel); border: var(--card-border); scroll-margin-top: 5rem;
}
.pt-day.is-weekend { background: linear-gradient(var(--st-weekend), var(--st-weekend)), var(--panel); }
.pt-day.is-today { outline: 2px solid var(--accent); }
.pt-day.is-focus { box-shadow: 0 0 0 3px var(--focus-ring); }
.pt-date { display: flex; flex-direction: column; align-items: flex-start; gap: 0.2rem; }
.pt-edit { display: grid; gap: 0.45rem; min-width: 0; }
.pt-fields { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 0.5rem; }
.pt-fields input { min-height: 44px; }
.pt-fields .grow { min-width: 10rem; }
.pt-fields .grow input { width: 100%; }
.seg { display: flex; flex-wrap: wrap; gap: 0.35rem; }
button.seg-btn { min-height: 44px; padding: 0.35rem 0.75rem; border-radius: 10px; background: var(--soft); }
button.seg-btn.on.dt-Р, button.seg-btn.on.dt-work { background: var(--st-work-bg); color: var(--st-work-ink); border-color: var(--st-work-line); }
button.seg-btn.on.dt-В { background: var(--st-off-bg); color: var(--st-off-ink); border-color: var(--st-off-line); }
button.seg-btn.on.dt-О { background: var(--st-vac-bg); color: var(--st-vac-ink); border-color: var(--st-vac-line); }
button.seg-btn.on.dt-Б { background: var(--st-sick-bg); color: var(--st-sick-ink); border-color: var(--st-sick-line); }
button.seg-btn.on.dt-Н { background: var(--st-absent-bg); color: var(--st-absent-ink); border-color: var(--st-absent-line); }
button.seg-btn.on { font-weight: 750; box-shadow: inset 0 0 0 1px currentColor; }

/* ---------- явка ---------- */
.att-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem 1rem; margin-bottom: 0.6rem; }
.att-head h1 { margin: 0; }
.att-counter { display: flex; flex-direction: column; gap: 0.3rem; min-width: 11rem; font-size: 1rem; }
.att-progress { display: block; height: 8px; border-radius: 999px; background: var(--soft); border: 1px solid var(--line); overflow: hidden; }
.att-progress > span { display: block; height: 100%; background: var(--st-work-line); transition: width 0.25s ease; }
.att-dates { display: flex; gap: 0.45rem; overflow-x: auto; padding-bottom: 0.25rem; margin-bottom: 0.6rem; }
button.att-date {
  flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-start; gap: 0.05rem;
  min-height: 52px; min-width: 7rem; padding: 0.4rem 0.85rem; border-radius: 12px; background: var(--soft);
}
button.att-date small { color: var(--muted); font-size: 0.78rem; }
button.att-date.on { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
button.att-date.on small { color: var(--accent-ink); opacity: 0.85; }
.att-date-input { min-height: 52px; min-width: 0; border-radius: 12px; }
.att-subs { margin-bottom: 0.6rem; overflow-x: auto; flex-wrap: nowrap; }
.att-subs .chip-option { flex: 0 0 auto; }
.att-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem; margin-bottom: 0.6rem; }
.att-sub-name { color: var(--muted); }
button.att-all {
  min-height: 52px; padding: 0.55rem 1.25rem; border-radius: 14px; font-weight: 700;
  background: var(--st-work-line); border-color: var(--st-work-line); color: #fff;
}
.att-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.55rem; }
.att-row {
  display: grid; grid-template-columns: 1fr; gap: 0.6rem; padding: 0.75rem 0.8rem; border-radius: 16px;
  background: var(--panel); border: var(--card-border); border-left: 5px solid var(--line);
  transition: background-color 0.3s ease;
}
.att-row.unmarked { border-left-color: var(--st-orange); }
.att-row.marked { border-left-color: var(--st-work-line); }
.att-row.flash { animation: att-flash 0.9s ease; }
@keyframes att-flash { 0% { background-color: var(--st-work-bg); } 100% { background-color: var(--panel); } }
.att-person { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.att-name { font-size: 1.05rem; overflow-wrap: anywhere; }
.att-pos, .att-by { color: var(--muted); font-size: 0.85rem; }
.att-buttons { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.4rem; }
button.att-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.35rem; min-height: 52px; padding: 0.35rem 0.4rem;
  border-radius: 12px; border: 1.5px solid var(--input-border); background: var(--input-bg); color: var(--ink);
  font-weight: 650; font-size: 0.95rem; touch-action: manipulation; -webkit-tap-highlight-color: transparent;
}
button.att-btn:active:not(:disabled) { transform: scale(0.97); }
.att-ico { font-size: 1.1rem; line-height: 1; }
button.att-work { border-color: var(--st-work-line); color: var(--st-work-ink); }
button.att-absent { border-color: var(--st-absent-line); color: var(--st-absent-ink); }
button.att-sick { border-color: var(--st-sick-line); color: var(--st-sick-ink); }
button.att-vac { border-color: var(--st-vac-line); color: var(--st-vac-ink); }
button.att-off { border-color: var(--st-off-line); color: var(--st-off-ink); }
button.att-work.on { background: var(--st-work-line); color: #fff; }
button.att-absent.on { background: var(--st-absent-line); color: #fff; }
button.att-sick.on { background: var(--st-sick-line); color: #fff; }
button.att-vac.on { background: var(--st-vac-line); color: #fff; }
button.att-off.on { background: var(--st-off-line); color: #fff; }
html[data-theme="dark"] button.att-btn.on { color: #0b0b10; }
button.att-more.on { background: var(--accent-soft); }
.att-more-panel { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 0.5rem; padding-top: 0.25rem; border-top: 1px dashed var(--line); }
.att-more-panel select, .att-more-panel input { min-height: 48px; }
.att-more-panel .grow { min-width: 12rem; }
.att-more-panel .grow input { width: 100%; }

@media (min-width: 861px) {
  .att-row { grid-template-columns: minmax(13rem, 1fr) auto; align-items: center; }
  .att-buttons { grid-template-columns: repeat(6, minmax(5.6rem, auto)); }
  .att-more-panel { grid-column: 1 / -1; }
}

/* ---------- заселение ---------- */
.settle-layout { display: grid; grid-template-columns: minmax(0, 1fr) 21rem; gap: 1rem; align-items: start; }
.settle-layout.panel-collapsed { grid-template-columns: minmax(0, 1fr) 3.4rem; }
.settle-main { min-width: 0; }
.district-jump {
  position: sticky; top: 0; z-index: 12; display: flex; gap: 0.4rem; overflow-x: auto; padding: 0.45rem;
  margin: 0 0 0.75rem; border-radius: 14px; background: var(--panel); border: var(--card-border);
  backdrop-filter: var(--glass); -webkit-backdrop-filter: var(--glass);
}
button.jump-chip { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 0.4rem; min-height: 44px; border-radius: 999px; white-space: nowrap; }
.staff-dragging button.jump-chip { outline: 2px dashed var(--accent); outline-offset: -3px; }
.pick-bar {
  position: sticky; top: 3.9rem; z-index: 11; display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem;
  padding: 0.6rem 0.8rem; margin-bottom: 0.75rem; border-radius: 14px; background: var(--accent-soft);
  border: 1px solid var(--accent); color: var(--ink);
}
.pick-bar span { flex: 1 1 14rem; }
.pick-bar button { min-height: 44px; }
.settle-district { margin-bottom: 1rem; scroll-margin-top: 4rem; }
button.settle-head {
  display: flex; align-items: center; gap: 0.55rem; width: 100%; min-height: 48px; text-align: left;
  border-radius: 12px; background: var(--panel); border: var(--card-border);
}
button.settle-head.lvl-1 { font-size: 1.1rem; font-weight: 700; padding: 0.6rem 0.9rem; }
button.settle-head.lvl-2 { margin: 0.55rem 0 0.5rem; background: var(--soft); font-weight: 650; }
.settle-house { padding-left: 0.75rem; }
.caret { width: 1rem; display: inline-block; color: var(--muted); }
.settle-apt { gap: 0.5rem; }
.bed-slots { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.4rem; }
.bed-slot {
  position: relative; display: flex; align-items: center; gap: 0.5rem; min-height: 56px; padding: 0.35rem 0.45rem;
  border-radius: 12px; border: 2px dashed var(--st-free-line); background: var(--st-free-bg); color: var(--st-free-ink);
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}
.bed-slot.occupied { border-style: solid; border-color: var(--st-busy-line); background: var(--st-busy-bg); color: var(--st-busy-ink); }
.bed-slot.drop-ok { box-shadow: 0 0 0 3px var(--bunny-happy); transform: scale(1.02); }
.bed-slot.drop-bad { box-shadow: 0 0 0 3px var(--bunny-sad); cursor: not-allowed; }
.bed-slot.just-moved { animation: slot-pop 0.6s ease; }
@keyframes slot-pop { 0% { transform: scale(0.96); } 50% { transform: scale(1.03); } 100% { transform: scale(1); } }
button.slot-target { min-height: 44px; flex: 1 1 auto; border-color: var(--st-free-line); color: var(--st-free-ink); background: transparent; font-weight: 700; }
button.slot-x { width: 40px; height: 40px; padding: 0; border-radius: 10px; flex: 0 0 auto; font-size: 1.2rem; color: var(--danger-ink); }

button.emp-chip {
  position: relative; display: grid; gap: 0.05rem; width: 100%; min-height: 48px; padding: 0.4rem 0.6rem; text-align: left;
  border-radius: 10px; background: var(--st-solid); border: 1px solid var(--line); color: var(--ink);
  cursor: grab; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; touch-action: pan-y;
}
button.emp-chip.in-slot { flex: 1 1 auto; min-width: 0; }
button.emp-chip.foreign { cursor: default; opacity: 0.85; }
button.emp-chip:disabled { opacity: 0.85; cursor: default; }
button.emp-chip.selected { outline: 3px solid var(--accent); padding-left: 2.4rem; }
button.emp-chip.unassigned { border-left: 4px solid var(--st-orange); }
button.emp-chip.drag-source { opacity: 0.4; }
.emp-name { font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.emp-meta, .emp-place { font-size: 0.78rem; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.settle-panel {
  position: sticky; top: 0.75rem; display: flex; flex-direction: column; max-height: calc(100dvh - 1.5rem);
  border-radius: 16px; background: var(--panel); border: var(--card-border); box-shadow: var(--shadow);
  backdrop-filter: var(--glass); -webkit-backdrop-filter: var(--glass); overflow: hidden;
}
.panel-head { flex: 0 0 auto; border-bottom: 1px solid var(--line); }
button.panel-toggle {
  display: flex; align-items: center; gap: 0.45rem; width: 100%; min-height: 52px; border: 0; border-radius: 0;
  background: transparent; font-weight: 700; text-align: left; flex-wrap: wrap;
}
.panel-body { display: flex; flex-direction: column; gap: 0.5rem; padding: 0.6rem; overflow: auto; min-height: 0; }
.panel-search { width: 100%; min-height: 44px; }
.panel-filters { display: grid; gap: 0.4rem; }
.panel-filters select { width: 100%; min-height: 44px; }
.emp-cards { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.35rem; }
.drop-hint { margin: 0; }
.settle-panel.drop-ok, .staff-dragging .settle-panel { box-shadow: 0 0 0 3px var(--accent-soft), var(--shadow); }
.settle-panel.drop-ok { box-shadow: 0 0 0 3px var(--bunny-happy), var(--shadow); }
.panel-collapsed .settle-panel .panel-body { display: none; }
.panel-collapsed .settle-panel button.panel-toggle { writing-mode: vertical-rl; min-height: 14rem; justify-content: flex-start; padding: 0.8rem 0.4rem; }
.panel-collapsed .settle-panel .count-pill.free { display: none; }

.toast {
  position: fixed; z-index: 70; left: 50%; bottom: max(1rem, env(safe-area-inset-bottom)); transform: translateX(-50%);
  display: flex; align-items: center; gap: 0.6rem; width: max-content; max-width: calc(100vw - 1.5rem);
  padding: 0.6rem 0.7rem 0.6rem 1rem; border-radius: 14px; background: var(--st-solid); color: var(--ink);
  border: 1px solid var(--line); box-shadow: var(--dialog-shadow); animation: toast-in 0.2s ease;
}
.toast.ok { border-left: 5px solid var(--st-work-line); }
.toast.bad { border-left: 5px solid var(--st-red); }
.toast .button-link { min-height: 44px; font-weight: 700; color: var(--accent); }
button.toast-x { width: 40px; height: 40px; padding: 0; border: 0; background: transparent; font-size: 1.2rem; }
@keyframes toast-in { from { transform: translate(-50%, 1rem); opacity: 0; } to { transform: translate(-50%, 0); opacity: 1; } }

/* ---------- зайчик ---------- */
.bunny { display: inline-block; line-height: 0; }
.bunny-svg { overflow: visible; }
.bunny-svg .b-ears ellipse, .bunny-svg .b-body, .bunny-svg .b-head { fill: var(--bunny-fur); stroke: var(--bunny-line); stroke-width: 1.6; }
.bunny-svg .b-inner ellipse { fill: var(--bunny-ear); }
.bunny-svg .b-eye { fill: var(--bunny-eye); }
.bunny-svg .b-cheek { fill: var(--bunny-cheek); opacity: 0.7; }
.bunny-svg .b-nose { fill: #ff7aa2; }
.bunny-svg .b-mouth { fill: none; stroke: var(--bunny-line); stroke-width: 1.5; stroke-linecap: round; }
.bunny-svg .b-tear { fill: #60a5fa; }
.bunny-svg .m-sad { display: none; }
.mood-sad .bunny-svg .m-sad { display: inline; }
.mood-sad .bunny-svg .m-happy { display: none; }
.bunny-sit { position: absolute; left: 0.35rem; top: 50%; margin-top: -16px; animation: bunny-hop 0.9s ease-in-out infinite; transform-origin: 50% 100%; }

.bunny-ghost {
  position: fixed; left: 0; top: 0; z-index: 1000; pointer-events: none; will-change: transform;
  display: flex; flex-direction: column; align-items: center; width: 48px;
}
.bunny-ghost .bunny-hop { width: 48px; height: 48px; transform-origin: 50% 100%; animation: bunny-hop 0.5s ease-in-out infinite; filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.25)); }
.bunny-ghost .bunny-svg { width: 48px; height: 48px; }
.bunny-ghost .bunny-label {
  margin-top: 2px; padding: 0.1rem 0.45rem; border-radius: 999px; white-space: nowrap; font-size: 0.75rem; font-weight: 700;
  background: var(--st-solid); color: var(--ink); border: 1px solid var(--line); box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
}
.bunny-ghost.mood-happy .bunny-svg .b-head, .bunny-ghost.mood-happy .bunny-svg .b-body { stroke: var(--bunny-happy); stroke-width: 2.2; }
.bunny-ghost.mood-happy .bunny-label { background: var(--bunny-happy); color: #062b14; border-color: transparent; }
.bunny-ghost.mood-sad .bunny-svg .b-head, .bunny-ghost.mood-sad .bunny-svg .b-body { stroke: var(--bunny-sad); stroke-width: 2.2; }
.bunny-ghost.mood-sad .bunny-label { background: var(--bunny-sad); color: #fff; border-color: transparent; }
.bunny-ghost.mood-sad .bunny-hop { animation: bunny-sad 0.8s ease-in-out infinite; }
.bunny-ghost.mood-happy .bunny-hop { animation-duration: 0.38s; }
.bunny-ghost.landing .bunny-hop { animation: bunny-land 0.3s ease-out 1 forwards; }

@keyframes bunny-hop {
  0%, 100% { transform: translateY(0) scale(1.08, 0.9); }
  18% { transform: translateY(0) scale(0.94, 1.07); }
  50% { transform: translateY(-11px) scale(0.97, 1.04); }
  82% { transform: translateY(0) scale(1.06, 0.93); }
}
@keyframes bunny-sad {
  0%, 100% { transform: translateY(0) rotate(-4deg) scale(1, 0.96); }
  50% { transform: translateY(2px) rotate(4deg) scale(1.02, 0.94); }
}
@keyframes bunny-land {
  0% { transform: translateY(-14px) scale(0.95, 1.08); }
  70% { transform: translateY(0) scale(1.15, 0.82); }
  100% { transform: translateY(0) scale(1, 1); }
}

.staff-dragging, .staff-dragging * { user-select: none !important; -webkit-user-select: none !important; }

@media (prefers-reduced-motion: reduce) {
  .bunny-ghost .bunny-hop, .bunny-sit, .bunny-ghost.mood-sad .bunny-hop, .bunny-ghost.landing .bunny-hop,
  .att-row.flash, .bed-slot.just-moved, .toast { animation: none !important; }
  .bunny-ghost { transition: none !important; }
  .bed-slot, .att-progress > span { transition: none; }
}

/* ---------- телефон ---------- */
@media (max-width: 860px) {
  main { padding: 0.85rem 0.75rem 6rem; }
  .staff-form, .filter-bar { flex-direction: column; align-items: stretch; }
  .staff-form > *, .filter-bar > * { width: 100%; }
  .staff-form input, .staff-form select, .filter-bar input, .filter-bar select, .narrow input { width: 100%; }
  .dir-grid { grid-template-columns: 1fr; }
  .apt-grid { grid-template-columns: 1fr; }
  .form-grid .span-2-sm { grid-column: 1 / -1; }
  .page-head { align-items: stretch; }
  .month-switch { width: 100%; justify-content: space-between; }
  button.big, .button-link.big { width: 100%; }
  .row-buttons > * { flex: 1 1 auto; }
  .ts-scroll { max-height: calc(100dvh - 12rem); }
  .ts-grid .ts-name { min-width: 8.5rem; max-width: 9.5rem; font-size: 0.85rem; }
  .ts-cell { width: 2.4rem; height: 2.4rem; min-width: 2.4rem; }
  .pt-day { grid-template-columns: 1fr; gap: 0.45rem; }
  .pt-date { flex-direction: row; align-items: center; gap: 0.5rem; }
  .pt-fields > * { flex: 1 1 100%; }
  .pt-fields .narrow input { width: 100%; }
  .att-counter { width: 100%; }
  button.att-all { width: 100%; }
  .att-toolbar { flex-direction: column; align-items: stretch; }
  .att-more-panel > * { flex: 1 1 100%; }
  .att-more-panel input, .att-more-panel select { width: 100%; }

  /* заселение: панель сотрудников — нижняя шторка */
  .settle-layout, .settle-layout.panel-collapsed { grid-template-columns: 1fr; }
  .settle-main { padding-bottom: 4.5rem; }
  .district-jump { top: 3.6rem; }
  .pick-bar { top: 7.4rem; }
  .settle-house { padding-left: 0; }
  .settle-panel {
    position: fixed; left: 0; right: 0; bottom: 0; top: auto; z-index: 35; max-height: 62dvh; height: 62dvh;
    border-radius: 18px 18px 0 0; padding-bottom: env(safe-area-inset-bottom);
    transition: transform 0.25s ease;
  }
  .panel-collapsed .settle-panel { height: auto; }
  .panel-collapsed .settle-panel button.panel-toggle { writing-mode: horizontal-tb; min-height: 56px; padding: 0.5rem 1rem; }
  .panel-collapsed .settle-panel .count-pill.free { display: inline-flex; }
  .settle-panel .panel-head::before {
    content: ""; display: block; width: 2.6rem; height: 4px; margin: 0.4rem auto 0; border-radius: 999px; background: var(--line);
  }
  .staff-dragging .settle-panel { transform: translateY(calc(100% - 4.2rem)); }
  .is-picking .settle-panel { transform: translateY(calc(100% - 4.2rem)); }
  .toast { bottom: calc(4.6rem + env(safe-area-inset-bottom)); }
}

/* ---------- бренд узла B ---------- */
.brand-with-toggle .brand-text { flex: 1 1 auto; min-width: 0; line-height: 1.2; }
.mobile-bar .brand { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.login-card h1 { line-height: 1.2; }
main h1:focus, main h1:focus-visible { outline: none; }
@media (max-width: 420px) { button.att-btn { font-size: 0.86rem; gap: 0.25rem; } }

/* ---------- история проживания, выезд ---------- */
.emp-dates { font-size: 0.74rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.leave-badge {
  justify-self: start; margin-top: 0.15rem; padding: 0.05rem 0.45rem; border-radius: 999px; font-size: 0.72rem; font-weight: 700;
  background: var(--st-part-bg); color: var(--st-part-ink);
}
.bed-slot.leaving { border-color: var(--st-orange); border-style: dashed; }
.res-dates { display: flex; flex-wrap: wrap; gap: 0.2rem 0.9rem; align-items: center; font-size: 0.88rem; }
.big-dates { margin: 0.25rem 0 0.75rem; font-size: 0.95rem; }
.bed-who .res-dates { margin-top: 0.15rem; }
.small-title { margin: 0.9rem 0 0.4rem; font-size: 0.95rem; font-weight: 650; }
.residence-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.4rem; }
.residence-list li { display: grid; gap: 0.25rem; padding: 0.55rem 0.7rem; border-radius: 12px; background: var(--soft); border-left: 4px solid var(--line); }
.residence-list li.current { border-left-color: var(--st-work-line); }
.res-main { display: flex; flex-wrap: wrap; gap: 0.2rem 0.6rem; align-items: baseline; }
.res-main a { color: var(--ink); }
.dialog-scrim { position: fixed; inset: 0; z-index: 80; background: var(--overlay); }
.checkout-dialog {
  position: fixed; z-index: 81; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: min(26rem, calc(100vw - 1.5rem)); padding: 1.1rem 1.2rem; border-radius: 18px;
  background: var(--st-solid); color: var(--ink); border: 1px solid var(--line); box-shadow: var(--dialog-shadow);
  display: grid; gap: 0.6rem;
}
.checkout-dialog h2 { margin: 0; }
.checkout-dialog input[type=date] { min-height: 48px; width: 100%; }
@media (max-width: 860px) {
  .checkout-dialog { top: auto; bottom: 0; transform: translateX(-50%); width: 100vw; border-radius: 18px 18px 0 0; padding-bottom: max(1.1rem, env(safe-area-inset-bottom)); }
  .checkout-dialog .form-actions > * { flex: 1 1 100%; }
}

/* ---------- переключатель трёх тем ---------- */
.theme-toggle3 {
  display: inline-flex; align-items: center; gap: 2px; padding: 3px; margin-left: auto; flex: 0 0 auto;
  border-radius: 999px; background: var(--soft); border: 1px solid var(--line);
}
button.theme-opt {
  width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--ink);
  font-size: 1.05rem; line-height: 1; display: inline-flex; align-items: center; justify-content: center;
}
button.theme-opt:hover { background: var(--hover); }
button.theme-opt.on { background: var(--accent); color: var(--accent-ink); box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18); }
.mobile-bar .theme-toggle3 { margin-left: auto; }
.brand-with-toggle .theme-toggle3 { margin-left: 0.25rem; }
.brand-with-toggle { flex-wrap: wrap; }
.login-theme { display: flex; justify-content: flex-end; }

/* ---------- 390px: без горизонтальной прокрутки страницы ----------
   Колонка .page была шириной по min-content шапки (бренд + переключатель тем) — 392–406px,
   а scrollIntoView вкладок сдвигал обрезанный контейнер влево. */
@media (max-width: 860px) {
  html, body { overflow-x: hidden; overflow-x: clip; }
  .page { grid-template-columns: minmax(0, 1fr); overflow-x: clip; }
  main { min-width: 0; max-width: 100vw; overflow-x: clip; }
  .mobile-bar { min-width: 0; gap: 0.5rem; padding-left: 0.6rem; padding-right: 0.6rem; }
  .mobile-bar .brand { flex: 1 1 auto; min-width: 0; }
  .mobile-bar .theme-toggle3 { flex: 0 0 auto; margin-left: 0; }
  .mobile-bar button.theme-opt { width: 32px; height: 32px; font-size: 0.95rem; }
  main > *, .page-head, .month-switch, .ts-toolbar, .att-head, .filter-bar { min-width: 0; max-width: 100%; }
  .ts-tabs {
    margin-left: -12px; margin-right: -12px; padding-left: 12px; padding-right: 12px;
    scroll-padding-inline: 12px; max-width: none;
  }
  .ts-toolbar .legend { flex: 1 1 100%; min-width: 0; }
  .ts-toolbar .legend > * { flex: 0 0 auto; }
}

.staff-table tr.row-alert td { background: var(--danger-bg); color: var(--danger-ink); }
.user-audit td { font-size: 0.88rem; }

/* ---------- графики работы: план в табеле ---------- */
.ts-cell.ts-empty.ts-plan-work { box-shadow: inset 0 0 0 1.5px var(--st-work-line); background: color-mix(in srgb, var(--st-work-bg) 45%, var(--st-empty-bg)); }
.ts-cell.ts-empty.ts-plan-off { background: repeating-linear-gradient(135deg, var(--st-empty-bg) 0 4px, color-mix(in srgb, var(--st-off-bg, #e5e7eb) 70%, transparent) 4px 6px); }
.ts-total.ts-plan { color: var(--muted); font-weight: 600; }
.ts-total.ts-under { color: var(--danger-ink); }
.att-plan { display: inline-block; margin-top: 0.15rem; font-size: 0.8rem; color: var(--st-work-ink); }
.att-plan.off { color: var(--st-off-ink); font-weight: 700; }
.att-row.planned-off.unmarked { border-left-color: var(--st-off-line); }
.att-btn.suggest { box-shadow: 0 0 0 2px var(--st-off-line) inset; background: var(--st-off-bg); }
.schedule-panel h3 { margin: 1rem 0 0.4rem; font-size: 1rem; }
.schedule-current { display: flex; flex-wrap: wrap; gap: 0.35rem 0.6rem; align-items: center; }
.plan-strip { display: flex; gap: 0.35rem; overflow-x: auto; padding: 0.2rem 0 0.4rem; -webkit-overflow-scrolling: touch; }
.plan-day { flex: 0 0 auto; display: grid; justify-items: center; gap: 0.05rem; min-width: 3.3rem; padding: 0.3rem 0.35rem;
  border-radius: 10px; border: 1px solid var(--line); font-size: 0.8rem; }
.plan-day small { color: var(--muted); }
.plan-day.work { background: var(--st-work-bg); color: var(--st-work-ink); border-color: var(--st-work-line); }
.plan-day.off { background: var(--st-off-bg); color: var(--st-off-ink); border-color: var(--st-off-line); }
.plan-day.override { outline: 2px dashed var(--accent); outline-offset: -3px; }
.plan-day.today { box-shadow: 0 0 0 2px var(--accent); }
.schedule-history .cur-badge, .cur-badge { display: inline-block; margin-left: 0.35rem; padding: 0 0.45rem; border-radius: 999px; font-size: 0.75rem;
  background: var(--st-work-bg); color: var(--st-work-ink); }
.schedule-panel .residence-list li > button.link-button { justify-self: start; }
/* Неверный ID сотрудника (проверка при показе, см. EmployeeIdCheck) */
html[data-theme="light"], html:not([data-theme]) { --st-bad-text: #b42318; }
html[data-theme="bunny"] { --st-bad-text: #a8171f; }
html[data-theme="dark"] { --st-bad-text: #ff8b80; }
code.id-invalid { color: var(--st-bad-text); font-weight: 700; text-decoration: underline wavy; text-decoration-thickness: 1px; text-underline-offset: 3px; cursor: help; }
input.id-invalid { color: var(--st-bad-text); border-color: var(--st-bad-text) !important; font-weight: 600; }
.id-invalid-hint { display: block; margin-top: 0.25rem; color: var(--st-bad-text); font-size: 0.82rem; font-weight: 600; line-height: 1.3; }
/* Телефон: закреплённая колонка ФИО не шире ~половины экрана (длинные имена переносятся), чтобы рядом был виден ID */
@media (max-width: 640px) {
  .sticky-first th:first-child, .sticky-first td:first-child { white-space: normal; min-width: 8rem; max-width: 46vw; overflow-wrap: anywhere; }
}
/* пока открыт вопрос «Выселить / Отмена», перетащенный жилец ждёт под затемнением */
body:has(.checkout-dialog) .bunny-ghost { z-index: 79; }

/* «Проживает семья» — флаг квартиры (Apartments.IsFamily) */
html[data-theme="light"], html:not([data-theme]) { --st-family-bg: #f3e8ff; --st-family-ink: #6b21a8; --st-family-line: #d8b4fe; }
html[data-theme="bunny"] { --st-family-bg: #ffe4f1; --st-family-ink: #9d174d; --st-family-line: #f9a8d4; }
html[data-theme="dark"] { --st-family-bg: #3b1d5a; --st-family-ink: #e9d5ff; --st-family-line: #7e22ce; }
.apt-title-wrap { display: inline-flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; min-width: 0; }
.family-badge {
  display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.1rem 0.5rem; border-radius: 999px;
  font-size: 0.78rem; font-weight: 700; line-height: 1.35; white-space: nowrap; vertical-align: middle;
  background: var(--st-family-bg); color: var(--st-family-ink); border: 1px solid var(--st-family-line);
}
.family-badge svg { width: 0.85em; height: 0.85em; fill: currentColor; flex: none; }
h1 .family-badge { font-size: 0.9rem; margin-left: 0.35rem; }
label.family-check { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 0.6rem; min-height: 44px; cursor: pointer; user-select: none; text-align: left; }
label.family-check input[type="checkbox"] {
  width: 1.3rem; height: 1.3rem; min-width: 0; min-height: 0; max-width: none; padding: 0; margin: 0; flex: none;
  border-radius: 4px; accent-color: var(--st-family-ink); cursor: pointer;
}
label.family-check span { font-weight: 600; }

/* «Мой профиль»: имя в сайдбаре — ссылка; форма смены пароля */
a.sidebar-user-name { color: inherit; text-decoration: none; border-radius: 10px; }
a.sidebar-user-name:hover, a.sidebar-user-name:focus-visible { background: var(--hover, rgba(127,127,127,.12)); text-decoration: none; }
.profile-panel { margin-bottom: 1rem; }
.profile-form { flex-direction: column; align-items: stretch; max-width: 26rem; }
.profile-form label input { width: 100%; }

/* ---------- «Заселение»: дольше суток без места — хмурый зайчик ---------- */
html[data-theme="light"], html:not([data-theme]) { --st-wait-bg: #fde8e8; --st-wait-ink: #9f1d1d; --st-wait-line: #ef4444; }
html[data-theme="dark"] { --st-wait-bg: #3d1717; --st-wait-ink: #fecaca; --st-wait-line: #f87171; }
html[data-theme="bunny"] { --st-wait-bg: #ffe1ea; --st-wait-ink: #9d1747; --st-wait-line: #e8364f; }
.bunny-svg .b-brow { fill: none; stroke: var(--bunny-line); stroke-width: 1.4; stroke-linecap: round; }
/* хмурый: ушки чуть опущены */
.mood-sad .bunny-svg .b-ears, .mood-sad .bunny-svg .b-inner { transform-box: fill-box; transform-origin: 50% 100%; transform: translateY(1.5px) scaleY(0.86); }
button.emp-chip.long-wait { border-left: 4px solid var(--st-wait-line); padding-right: 2.9rem; background: linear-gradient(90deg, var(--st-wait-bg), var(--st-solid) 70%); }
button.emp-chip.long-wait.selected { padding-right: 0.6rem; }
.bunny-wait { position: absolute; right: 0.4rem; top: 50%; margin-top: -19px; animation: bunny-sad 1.6s ease-in-out infinite; transform-origin: 50% 100%; }
.bunny-sit.mood-sad { animation: bunny-sad 0.9s ease-in-out infinite; }
.wait-badge {
  display: inline-flex; align-items: center; margin-left: 0.4rem; padding: 0 0.45rem; border-radius: 999px; font-size: 0.75rem; font-weight: 700;
  line-height: 1.45; white-space: nowrap; background: var(--st-wait-bg); color: var(--st-wait-ink); border: 1px solid var(--st-wait-line); vertical-align: 1px;
}
.count-pill.wait { gap: 0.25rem; background: var(--st-wait-bg); color: var(--st-wait-ink); border-color: var(--st-wait-line); }
.panel-collapsed .settle-panel .count-pill.wait { display: none; }
@media (prefers-reduced-motion: reduce) { .bunny-wait, .bunny-sit.mood-sad { animation: none !important; } }
@media (max-width: 860px) { .panel-collapsed .settle-panel .count-pill.wait { display: inline-flex; } }

/* «Заселение», ПК, свёрнутая полоска «Сотрудники»: от верха полосы районов (чипы) до последнего района, подпись по центру;
   растёт вместе со списком, на длинном списке — не выше экрана и «липкая». Заголовок страницы — отдельная строка сетки,
   открытая шторка по-прежнему начинается от верха страницы. */
.settle-layout { row-gap: 0; }
@media (min-width: 861px) {
  .settle-layout { grid-template-rows: auto 1fr; }
  .settle-layout > .settle-title { grid-column: 1; grid-row: 1; }
  .settle-layout > .settle-main { grid-column: 1; grid-row: 2; }
  .settle-layout > .settle-panel { grid-column: 2; grid-row: 1 / span 2; }
  .settle-layout.panel-collapsed > .settle-panel { grid-row: 2; align-self: stretch; min-height: 14rem; max-height: calc(100dvh - 7rem); }
  .settle-layout.panel-collapsed > .settle-main > .settle-district:last-child { margin-bottom: 0; }
  .settle-layout.panel-collapsed .settle-panel .panel-head { flex: 1 1 auto; display: flex; border-bottom: 0; }
  .settle-layout.panel-collapsed .settle-panel button.panel-toggle { flex: 1 1 auto; min-height: 0; justify-content: center; }
}

/* ---------- увольнение (карточка, список) ---------- */
.fired-badge {
  display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.2rem 0.65rem; border-radius: 999px; vertical-align: middle;
  font-size: 0.85rem; font-weight: 700; line-height: 1.35; white-space: nowrap;
  background: var(--danger-bg); color: var(--danger-ink); border: 1px solid var(--danger-line);
}
.fired-badge.small { font-size: 0.72rem; padding: 0.05rem 0.45rem; margin-left: 0.3rem; }
h1.card-title { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 0.8rem; }
.schedule-ended { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 0.8rem; margin: 0.4rem 0; }
.dismiss-row { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.8rem; margin: 0.6rem 0 0.4rem; }
.dismiss-warn { margin: 0; padding: 0.5rem 0.7rem; border-radius: 12px; background: var(--danger-bg); color: var(--danger-ink); border: 1px solid var(--danger-line); }
.dismiss-dialog .field-required { display: grid; gap: 0.25rem; }
.filter-bar .hide-fired { display: inline-flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 0.5rem; white-space: nowrap; min-height: 44px; cursor: pointer; }
.filter-bar .hide-fired input[type=checkbox], .filter-bar .hide-fired input[type=checkbox]:is(*) { width: 1.25rem; height: 1.25rem; min-height: 0; min-width: 0; flex: 0 0 auto; margin: 0; }
.filter-bar .hide-fired:has(input:disabled) { opacity: 0.55; }
@media (max-width: 860px) { .dismiss-row > button { flex: 1 1 100%; } .fired-badge { white-space: normal; } }

/* ---------- ручная правка дней графика (полоса плана в карточке) ---------- */
.plan-strip.editable button.plan-day { font: inherit; cursor: pointer; min-height: 44px; transition: transform .08s ease, filter .12s ease; }
.plan-strip.editable button.plan-day:hover:not(:disabled) { filter: brightness(0.97); transform: translateY(-1px); }
.plan-strip.editable button.plan-day:active:not(:disabled) { transform: scale(0.96); }
.plan-strip.editable button.plan-day:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.plan-strip.editable button.plan-day.work { background: var(--st-work-bg); color: var(--st-work-ink); border: 1px solid var(--st-work-line); }
.plan-strip.editable button.plan-day.off { background: var(--st-off-bg); color: var(--st-off-ink); border: 1px solid var(--st-off-line); }
.plan-hint { margin: 0.1rem 0 0.6rem; }
.manual-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.8rem; margin: 0.2rem 0 0.7rem; padding: 0.5rem 0.7rem;
  border-radius: 12px; background: var(--soft); border: 1px dashed var(--accent); }
.manual-bar > span { flex: 1 1 16rem; }
@media (max-width: 860px) { .manual-bar > button { flex: 1 1 40%; min-height: 44px; } }

/* ---------- план графика: одна неделя в строке (пн … вс), 7 колонок и на телефоне ---------- */
.plan-strip { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 0.35rem; max-width: 36rem; overflow: visible; }
.plan-strip .plan-day { min-width: 0; width: 100%; box-sizing: border-box; }
.plan-strip .plan-day.past, .plan-strip .plan-day.before { opacity: 0.55; }
.plan-strip .plan-day.before { background: transparent; border-style: dashed; color: var(--muted); }
@media (max-width: 480px) {
  .plan-strip { gap: 0.2rem; }
  .plan-strip .plan-day { padding: 0.25rem 0.05rem; font-size: 0.7rem; border-radius: 8px; }
  .plan-strip.editable button.plan-day { min-height: 44px; }
}

/* ---------- блок «Виза»: несколько строк (въезд / дедлайн / выезд) ---------- */
.visa-list { display: grid; gap: 0.5rem; margin-bottom: 0.8rem; }
.visa-row { display: grid; grid-template-columns: 1.6rem repeat(4, minmax(0, 1fr)) 8.5rem; gap: 0.5rem 0.8rem; align-items: end;
  padding: 0.5rem 0.6rem; border-radius: 12px; border: 1px solid var(--line); background: var(--soft); }
.visa-row.current { border-color: var(--accent); box-shadow: inset 3px 0 0 var(--accent); }
.visa-row.left .cur-badge { background: var(--st-off-bg); color: var(--st-off-ink); }
.visa-row label { display: grid; gap: 0.25rem; min-width: 0; }
.visa-row input { width: 100%; min-height: 44px; box-sizing: border-box; }
.visa-no { align-self: center; justify-self: center; font-weight: 700; color: var(--muted); }
.visa-tail { display: flex; align-items: center; gap: 0.5rem; min-height: 44px; flex-wrap: wrap; justify-content: flex-end; }
.visa-confirm { display: inline-flex; align-items: center; gap: 0.35rem; color: var(--danger-ink); font-weight: 600; white-space: nowrap; }
.visa-confirm button { min-height: 36px; padding: 0.2rem 0.75rem; }
.visa-add-line { display: flex; align-items: center; gap: 0.8rem; }
.visa-add-line .field-help { margin: 0; }
button.visa-add { flex: 0 0 auto; width: 44px; height: 44px; padding: 0; border-radius: 12px; font-size: 1.5rem; font-weight: 700; line-height: 1; }
@media (max-width: 860px) {
  .visa-row { grid-template-columns: 1.4rem minmax(0, 1fr) auto; }
  .visa-row > label { grid-column: 2; }
  .visa-row > .visa-tail { grid-column: 3; grid-row: 1 / span 4; align-self: center; flex-direction: column; }
  .visa-row > .visa-gap { display: none; }
}

/* ID hint must not push the ID input above its neighbours */
.form-grid:has(.id-invalid-hint) { align-items: start; }

/* ---------- 06.10 (пакет 14:25): типы виз, EG без визы, несколько отпусков, календарь месяца, миграционный учёт ---------- */
.visa-row select { width: 100%; min-height: 44px; box-sizing: border-box; }
.visa-row.kind-residence { background: color-mix(in srgb, var(--st-vac-bg) 45%, var(--soft)); }
.visa-none { margin: 0 0 0.8rem; padding: 0.6rem 0.8rem; border-radius: 12px; border: 1px dashed var(--line); color: var(--muted); }
.vac-row { grid-template-columns: 1.6rem repeat(2, minmax(0, 1fr)) 8.5rem; max-width: 44rem; }
@media (max-width: 860px) { .vac-row { grid-template-columns: 1.4rem minmax(0, 1fr) auto; max-width: none; } }
.name-en { font-weight: 400; margin-top: 0.1rem; }

.month-switch { display: flex; align-items: center; gap: 0.6rem; margin: 0.3rem 0 0.5rem; }
.month-switch strong { min-width: 9rem; text-align: center; }
button.month-nav { width: 44px; height: 44px; padding: 0; border-radius: 12px; font-size: 1.3rem; line-height: 1; }
.plan-strip.month-grid .month-head { text-align: center; font-size: 0.78rem; color: var(--muted); font-weight: 600; }
.plan-strip.month-grid .plan-day { min-height: 44px; }
.plan-strip.month-grid .plan-day b { font-size: 1rem; }
.plan-strip.month-grid .plan-day > span { font-size: 0.72rem; }
.plan-strip.month-grid .plan-day.out { opacity: 0.3; background: transparent; border-style: dashed; }
.plan-strip.month-grid .plan-day.today { box-shadow: 0 0 0 2px var(--accent); font-weight: 700; }
@media (max-width: 560px) {
  .plan-strip.month-grid .plan-day b { font-size: 0.9rem; }
  .plan-strip.month-grid .plan-day > span { font-size: 0.6rem; }
}
.monthday-picker { display: grid; grid-template-columns: repeat(7, minmax(0, 3.2rem)); gap: 0.3rem; }
.monthday-picker .chip-option { justify-content: center; }

.mig-year { display: inline-flex; align-items: center; gap: 0.5rem; }
.mig-year select { min-height: 44px; }
.mig-grid th, .mig-grid td { vertical-align: top; }
.mig-grid td { min-width: 6.8rem; }
.mig-grid .mig-name { position: sticky; left: 0; z-index: 2; background: var(--st-sticky-bg); text-align: left; min-width: 13rem; max-width: 16rem; white-space: normal; }
.mig-grid thead .mig-name { z-index: 3; }
.mig-grid .mig-now { background: color-mix(in srgb, var(--accent) 8%, transparent); }
.mig-grid tr.mig-attn .mig-name { box-shadow: inset 3px 0 0 var(--st-orange); }
.mig-item { display: inline-block; margin: 0.1rem 0; padding: 0.1rem 0.4rem; border-radius: 8px; font-size: 0.82rem; white-space: nowrap; }
.mig-grid td .mig-item { display: block; width: fit-content; }
.mig-item.due-soon { background: color-mix(in srgb, var(--st-orange) 22%, transparent); color: inherit; font-weight: 700; box-shadow: inset 0 0 0 1px var(--st-orange); }
.mig-item.overdue { background: color-mix(in srgb, var(--st-red) 22%, transparent); color: var(--st-bad-text); font-weight: 700; box-shadow: inset 0 0 0 1px var(--st-red); }
.mig-item.done { color: var(--muted); }
@media (max-width: 700px) {
  .mig-grid .mig-name { min-width: 9rem; max-width: 42vw; }
  .mig-grid td { min-width: 6rem; }
}
/* на телефоне таблицы становятся display:block — для липкой колонки ФИО таблица должна оставаться таблицей во всю ширину */
.mig-scroll > table.mig-grid { display: table; width: max-content; min-width: 100%; }

/* ===== 07.10 ===== */
/* Табель: вкладки подразделений помещаются в экран — переносятся на новую строку и стали компактнее */
.ts-tabs { flex-wrap: wrap; overflow-x: visible; gap: 0.35rem; padding-top: 0.55rem; scroll-snap-type: none; }
button.ts-tab { min-height: 34px; padding: 0.25rem 0.6rem; gap: 0.3rem; font-size: 0.86rem; border-radius: 9px; }
.ts-tab-count { font-size: 0.74rem; }
.ts-tabs .notif-badge { min-width: 1.2rem; height: 1.2rem; font-size: 0.66rem; top: -0.4rem; right: -0.3rem; }
@media (max-width: 860px) { .ts-tabs { margin-left: 0; margin-right: 0; padding-left: 0.2rem; padding-right: 0.2rem; } }

/* «… и ещё N» — кнопка раскрытия */
.alert-list .more-link { padding: 0.15rem 0; font-size: 0.85rem; }

/* Сотрудники: выбор колонок */
.list-meta { display: flex; align-items: center; justify-content: space-between; gap: 0.6rem; margin: 0.2rem 0 0.4rem; }
.list-meta p { margin: 0; }
.col-chooser { position: relative; }
.col-chooser .small-btn { min-height: 34px; padding: 0.25rem 0.7rem; font-size: 0.86rem; }
.col-menu {
  position: absolute; right: 0; top: calc(100% + 4px); z-index: 30; min-width: 13rem; display: grid; gap: 0.2rem;
  padding: 0.6rem 0.75rem; background: var(--panel); border: 1px solid var(--line, rgba(128,128,128,.35)); border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,.18);
}
.col-menu .check-line { white-space: nowrap; }
.ins-mark { font-size: 0.85rem; white-space: nowrap; }
.ins-mark.ins-insured { color: var(--st-work-ink); font-weight: 600; }
.ins-mark.ins-not_insured { color: var(--st-red); }
.ins-mark.ins-none { color: var(--muted); }

/* Заселение: место всё ещё за уволенным — подсветка */
.bed-slot.fired-occ { outline: 2px dashed var(--st-red); outline-offset: -2px; background: var(--st-full-bg); }
.fired-occ-badge {
  display: block; width: fit-content; max-width: 100%; margin: 0.15rem 0 0; padding: 0.05rem 0.45rem; border-radius: 999px; font-size: 0.72rem; font-weight: 700;
  background: var(--st-red); color: #fff; white-space: normal;
}

/* «Миграционный учёт»: видимая сетка (светлая и тёмная темы) */
table.mig-grid { border-collapse: collapse; }
table.mig-grid th, table.mig-grid td { border: 1px solid rgba(60, 70, 90, 0.28); }
html[data-theme="dark"] table.mig-grid th, html[data-theme="dark"] table.mig-grid td { border-color: rgba(220, 225, 235, 0.22); }
table.mig-grid tbody tr:nth-child(even) td { background-image: linear-gradient(rgba(128, 128, 140, 0.06), rgba(128, 128, 140, 0.06)); }
.att-date-pick { display: inline-flex; align-items: center; gap: 0.3rem; }
.att-date-pick > span { font-size: 1.1rem; }

/* ===== 07.10 UX-аудит ===== */
/* 14: заголовки блоков карточки заметнее; подсказка об ошибке ID — одна строка */
.panel > h2 { font-size: 1.05rem; font-weight: 700; }
.id-invalid-hint { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; cursor: help; }
/* 15: панель табеля — легенда слева, чекбокс и кнопка в той же строке; квадраты «план» видны */
.ts-toolbar { flex-wrap: nowrap; }
.ts-toolbar .legend { flex: 1 1 auto; min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.4rem; }
.ts-toolbar .legend .ts-plan-work, .ts-toolbar .legend .ts-plan-off { border: 1.5px dashed var(--st-busy-line); }
.ts-toolbar .legend .ts-plan-work { border-color: var(--st-work-line); }
.ts-toolbar > .grow { display: none; }
.ts-toolbar > .check-line, .ts-toolbar > a { flex: 0 0 auto; white-space: nowrap; }
/* 5: полные ФИО на местах и в панели — с многоточием, полностью в подсказке */
.emp-chip .emp-name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.settle-panel .emp-chip .emp-name { -webkit-line-clamp: 1; text-overflow: ellipsis; }
/* 20: заголовки таблиц не переносятся по слогам */
.staff-table th, .ts-grid th { hyphens: none; -webkit-hyphens: none; overflow-wrap: normal; word-break: normal; }
/* 3, 4, 6: ряды чипов/вкладок — перенос строк вместо скрытого скролла */
.att-subs.chip-select, .district-jump, .tabs.scroll-tabs { flex-wrap: wrap; overflow-x: visible; }
/* A: собственное жильё */
.own-housing { margin: 0.25rem 0 0.5rem; }
/* B: нижняя панель карточки — одна строка */
.card-bar { display: flex; flex-wrap: nowrap; align-items: center; gap: 0.5rem; }
.card-bar .bar-save { flex: 1 1 auto; max-width: 22rem; }
.card-bar .bar-icon { display: inline-flex; align-items: center; justify-content: center; gap: 0.35rem; min-width: 40px; min-height: 40px; padding: 0 0.7rem; }
.card-bar .bar-more { position: relative; margin-left: auto; }
.card-bar .bar-menu { position: absolute; right: 0; bottom: calc(100% + 6px); z-index: 30; display: grid; gap: 0.4rem; min-width: 13rem;
  padding: 0.6rem; background: var(--panel); border: var(--card-border); border-radius: 12px; box-shadow: var(--shadow); }
/* 8: фильтры: на ПК как раньше, на телефоне — под кнопкой «Фильтры» */
.filter-toggle { display: none; }
.filter-more { display: contents; }
/* 17: профиль — длинные значения переносятся */
.profile-panel .stat-card strong { overflow-wrap: anywhere; }

@media (max-width: 860px) {
  /* шкала: основная 40, обычная 38, компактная 36; шрифт полей 16px (iOS не масштабирует) */
  main button, main .button-link, main input:not([type=checkbox]):not([type=radio]), main select { min-height: 38px; }
  main button.big, main .button-link.big, main button.primary, main .button-link.primary { min-height: 40px; padding-top: 0.4rem; padding-bottom: 0.4rem; font-size: 0.95rem; }
  main input:not([type=checkbox]):not([type=radio]), main select { font-size: 16px; padding-top: 0.35rem; padding-bottom: 0.35rem; }
  main input[type=checkbox] { width: 20px; height: 20px; }
  main label.check-line { min-height: 36px; display: inline-flex; align-items: center; gap: 0.45rem; }
  main .gap-tight, main .form-grid { gap: 0.55rem 0.75rem; }
  main .panel { padding: 0.75rem; }

  /* 1/B: панель карточки ~52px */
  .sticky-actions.card-bar { padding: 0.45rem 0.55rem; margin-top: 0.75rem; border-radius: 14px; }
  .card-bar .bar-save { max-width: none; }
  .card-bar .bar-lbl { display: none; }
  .card-bar .bar-icon { padding: 0; width: 40px; font-size: 1.15rem; }
  .card-bar button, .card-bar .button-link { width: auto; flex-basis: auto; }
  .card-bar .bar-menu { min-width: 12rem; }

  /* 2: Явка — даты в одну строку 40px, кнопки 40px; Отпуск/Выходной/Больничный — в «Ещё» */
  button.att-date { min-height: 40px; min-width: 0; flex-direction: row; align-items: baseline; gap: 0.35rem; padding: 0.3rem 0.7rem; }
  button.att-date small { font-size: 0.75rem; }
  .att-date-input { min-height: 40px; }
  button.att-btn { min-height: 40px; flex-direction: row; gap: 0.3rem; font-size: 0.9rem; padding: 0.25rem 0.45rem; }
  button.att-btn.att-vac, button.att-btn.att-off, button.att-btn.att-sick { display: none; }
  button.att-btn.att-vac.on, button.att-btn.att-off.on, button.att-btn.att-sick.on { display: inline-flex; }
  button.att-all { min-height: 40px; }
  .att-row { padding: 0.6rem 0.7rem; }

  /* 3, 4, 6, 7: чипы, вкладки 36px; значки проблем с увеличенной областью нажатия */
  .chip-option, button.jump-chip, .tabs.scroll-tabs > button, button.ts-tab { min-height: 36px; padding-top: 0.25rem; padding-bottom: 0.25rem; font-size: 0.9rem; }
  .ts-tabs .notif-badge::after { content: ""; position: absolute; inset: -8px; }
  .count-pill { white-space: nowrap; }

  /* 8: фильтры сотрудников */
  .filter-toggle { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; }
  .filter-more { display: none; }
  .filter-more.open { display: grid; gap: 0.5rem; grid-template-columns: 1fr 1fr; grid-column: 1 / -1; width: 100%; }
  .filter-more.open > label { grid-column: 1 / -1; }
  .filter-bar { display: grid; grid-template-columns: 1fr auto; gap: 0.5rem; }

  /* 9: список сотрудников карточками */
  table.emp-list, table.emp-list tbody { display: block; width: 100%; }
  table.emp-list thead { display: none; }
  table.emp-list tr { display: grid; grid-template-columns: 1fr 1fr; gap: 0.1rem 0.75rem; padding: 0.6rem 0.75rem; border-bottom: 1px solid var(--line); }
  table.emp-list td { display: block; padding: 0; border: 0; position: static !important; background: none !important; font-size: 0.85rem; min-width: 0; overflow-wrap: anywhere; }
  table.emp-list td.emp-name-cell { grid-column: 1 / -1; font-size: 1rem; }
  table.emp-list td.emp-name-cell a { display: inline-block; min-height: 32px; padding: 0.2rem 0; }
  table.emp-list td[data-label]::before { content: attr(data-label) ": "; color: var(--muted); font-size: 0.75rem; }
  .table-scroll:has(> table.emp-list) { overflow-x: visible; }

  /* 10, 12: шторка «Сотрудники» на Заселении в одну строку; контраст пилюль */
  .settle-panel .panel-toggle { min-height: 44px; flex-wrap: nowrap; gap: 0.35rem; padding-top: 0.3rem; padding-bottom: 0.3rem; overflow: hidden; }
  .settle-panel .panel-toggle .count-pill { font-size: 0.8rem; padding: 0.05rem 0.4rem; }
  .settle-apt header a { display: inline-flex; align-items: center; min-height: 36px; }
  .bed-slot .emp-chip.in-slot { padding-top: 0.3rem; padding-bottom: 0.3rem; }

  /* 11: табель сотрудника — итоги компактно, кнопки типа дня ровными сегментами */
  .stat-cards { grid-template-columns: repeat(auto-fit, minmax(5.2rem, 1fr)) !important; gap: 0.35rem; }
  .stat-card { padding: 0.35rem 0.5rem; }
  .stat-card strong { font-size: 1.05rem; }
  .stat-card span { font-size: 0.72rem; }
  .pt-edit .seg { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.3rem; }
  .pt-edit .seg-btn { min-height: 36px; padding: 0.2rem 0.3rem; font-size: 0.88rem; }
  .pt-day .button-link, .pt-day summary { min-height: 36px; display: inline-flex; align-items: center; }

  /* 13: строки виз — «×» и «текущая» в шапке строки, поля на всю ширину */
  .visa-row { grid-template-columns: 1.4rem minmax(0, 1fr) minmax(0, 1fr) !important; }
  .visa-row > label { grid-column: auto !important; }
  .visa-row > label:first-of-type { grid-column: 2 / -1 !important; }
  .visa-row > .visa-tail { grid-column: 2 / -1 !important; grid-row: auto !important; flex-direction: row !important; justify-content: flex-end; align-self: auto; }
  .visa-row > .visa-no { grid-row: 1; }

  /* 16: миграционный учёт — узкая колонка ФИО */
  table.mig-grid th.mig-name, table.mig-grid td.mig-name, table.mig-grid .mig-name { min-width: 7.5rem; max-width: 7.5rem; font-size: 0.85rem; }
  table.mig-grid td { min-width: 6.9rem; }

  /* 19: календарь графика — клетки компактнее */
  .plan-strip.month-grid .plan-day, .plan-strip.editable button.plan-day { min-height: 38px; }
  .plan-strip.month-grid { gap: 0.25rem; }

  /* 17: профиль в одну колонку */
  .profile-panel .stat-cards { grid-template-columns: 1fr !important; }
}
details.plan-hint > summary { cursor: pointer; min-height: 32px; display: inline-flex; align-items: center; color: var(--muted); }

/* ===== 07.10 замечания Андрея (u1–u6) ===== */
/* 3: проблемы — одна строка на человека, проблемы под именем */
.alert-list.grouped .alert-body { display: grid; gap: 0.1rem; min-width: 0; }
.alert-list.grouped .alert-msgs { display: flex; flex-wrap: wrap; gap: 0.15rem 0.5rem; }
.alert-list.grouped .alert-msgs .alert-msg:not(:last-child)::after { content: " ·"; }
.alert-list.grouped .alert-msg.sev-red { color: var(--st-red); font-weight: 600; }
/* 1, 4: закреплённые колонки — непрозрачные во всех темах */
html table.mig-grid .mig-name,
html .sticky-first tbody td:first-child, html .sticky-first thead th:first-child,
html .ts-grid .ts-name { background-color: var(--st-sticky-bg) !important; background-image: none !important; }
.sticky-first tbody td:first-child, .sticky-first thead th:first-child { position: sticky; left: 0; z-index: 2; box-shadow: 1px 0 0 var(--line, rgba(128,128,128,.3)); }
.sticky-first thead th:first-child { z-index: 4; }
table.mig-grid .mig-name { box-shadow: 1px 0 0 rgba(128,128,128,.35); }
@media (max-width: 860px) {
  table.mig-grid .mig-name { min-width: 7rem !important; max-width: 7rem !important; font-size: 0.82rem; }
  .sticky-first tbody td:first-child, .sticky-first thead th:first-child { max-width: 8.5rem; min-width: 7rem; }
}
/* 4: значки проблем не наезжают на текст вкладки */
.ts-tab-wrap:has(.notif-badge) > button.ts-tab { padding-right: 1.35rem; }
.ts-tabs .notif-badge { right: -0.45rem; }
.ts-tabs { gap: 0.45rem 0.75rem; }
/* 5: «зайчики» — у таблиц сплошной фон поверх узора */
html[data-theme="bunny"] .staff-table tbody td, html[data-theme="bunny"] .ts-grid tbody td,
html[data-theme="bunny"] .mig-grid tbody td, html[data-theme="bunny"] .staff-table thead th { background-color: #FFFFFF; }
html[data-theme="bunny"] .staff-table tbody tr:nth-child(even) td, html[data-theme="bunny"] .ts-grid tbody tr:nth-child(even) td,
html[data-theme="bunny"] .mig-grid tbody tr:nth-child(even) td { background-color: #FFF7FA; }
html[data-theme="bunny"] table.emp-list tr { background: #FFFFFF; }
/* карточки сотрудников (телефон): длинное «Проживание» — на всю ширину; уточнение размеров дат в «Явке» */
@media (max-width: 860px) {
  table.emp-list td[data-label="Проживание"] { grid-column: 1 / -1; }
  html table.emp-list td, html table.emp-list td:first-child { background: transparent !important; position: static !important; max-width: none !important; box-shadow: none !important; }
  table.emp-list tr { background: var(--panel); }
  html[data-theme="bunny"] table.emp-list td { background: transparent !important; }
  button.att-date strong { font-size: 0.95rem; }
}
/* ПК: ровные высоты кнопок и полей в одной строке */
@media (min-width: 861px) {
  .filter-bar { align-items: center; }
  .filter-bar > input, .filter-bar > select, .filter-bar .filter-more > select { min-height: 42px; }
  .form-actions > button, .form-actions > a.button-link { min-height: 42px; display: inline-flex; align-items: center; }
  .card-bar .bar-icon { min-height: 42px; }
  .page-head .button-link, .page-head button { min-height: 42px; }
  .att-dates > * { min-height: 52px; }
  .att-date-pick input { min-height: 52px; }
  .ts-toolbar > a.button-link { min-height: 40px; display: inline-flex; align-items: center; }
}

/* ===== 07.10 лёгкий визуальный рефреш (все темы) ===== */
:root { --ui-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; --r: 8px; --r-lg: 12px; }
html body, html[data-theme="bunny"] body, html[data-theme="bunny"] h1, html[data-theme="bunny"] h2,
html[data-theme="bunny"] .month-title, button, input, select, textarea { font-family: var(--ui-font); letter-spacing: 0; }
body { font-size: 14px; line-height: 1.45; }
h1 { font-size: 20px; font-weight: 650; margin: 0 0 16px; }
h2, .panel h2 { font-size: 16px; font-weight: 650; margin: 0 0 8px; }
.muted, .field-help, small { font-size: 12px; }
.panel { border-radius: var(--r-lg); box-shadow: none; border: 1px solid rgba(128,128,128,.18); padding: 16px; }
.panel + .panel { margin-top: 16px; }
button, .button-link, input, select, textarea { border-radius: var(--r); }
.chip, .seg-btn, .ts-tab { border-radius: var(--r); }
/* таблицы: плотные строки, мелкий шрифт, сплошной фон во всех темах */
.staff-table, .ts-grid, .mig-grid { border-collapse: separate !important; border-spacing: 0; font-size: 13px; }
.staff-table td, .staff-table th, .mig-grid td, .mig-grid th { padding: 4px 8px; line-height: 1.3; }
.ts-grid td, .ts-grid th { padding: 2px 4px; line-height: 1.25; }
.staff-table th, .ts-grid thead th, .mig-grid th { font-size: 12px; font-weight: 600; }
.staff-table tbody td, .ts-grid tbody td, .mig-grid tbody td { background-color: var(--st-surface, var(--st-sticky-bg)); border-bottom: 1px solid rgba(128,128,128,.14); }
html[data-theme="dark"] { --st-surface: #18181d; }
html[data-theme="light"], html:not([data-theme]) { --st-surface: #ffffff; }
html[data-theme="bunny"] { --st-surface: #ffffff; }
/* закреплённая колонка: фиксированная ширина, непрозрачная, не сдвигается */
html .sticky-first tbody td:first-child, html .sticky-first thead th:first-child,
html table.mig-grid .mig-name, html .ts-grid .ts-name {
  position: sticky !important; left: 0; z-index: 3; width: 11rem; min-width: 11rem !important; max-width: 11rem !important;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box;
  background-color: var(--st-sticky-bg) !important; background-image: none !important; box-shadow: 1px 0 0 rgba(128,128,128,.35);
  transform: none; will-change: auto; }
html .sticky-first thead th:first-child, html .ts-grid thead .ts-name, html table.mig-grid thead .mig-name { z-index: 5; }
@media (max-width: 860px) {
  html .sticky-first tbody td:first-child, html .sticky-first thead th:first-child,
  html table.mig-grid .mig-name, html .ts-grid .ts-name { width: 8rem; min-width: 8rem !important; max-width: 8rem !important; font-size: 12px; }
  .panel { padding: 12px; border-radius: var(--r); }
  h1 { font-size: 20px; margin-bottom: 8px; }
  table.emp-list tr { border-radius: var(--r); box-shadow: none; padding: 8px; gap: 4px 8px; }
  table.emp-list td { font-size: 13px; padding: 0 !important; }
  table.emp-list td[data-label]::before { font-size: 12px; }
}
@media (max-width: 860px) {
  html table.emp-list.sticky-first tbody td:first-child, html table.emp-list tbody td {
    position: static !important; width: auto; min-width: 0 !important; max-width: none !important; white-space: normal; overflow: visible;
    background-color: transparent !important; box-shadow: none !important; font-size: 13px; }
  html table.emp-list tbody tr { background-color: var(--st-surface) !important; }
}

/* ===== 07.10 доделки ===== */
/* Явка на телефоне: даты в одну строку, высота ≤ 40px */
@media (max-width: 860px) {
  .att-dates { display: flex !important; flex-wrap: nowrap !important; gap: 4px; overflow-x: auto; scrollbar-width: none; }
  .att-dates > * { flex: 1 1 0; min-width: 0; }
  html button.att-date, html .att-date-pick { height: 40px !important; min-height: 0 !important; max-height: 40px; padding: 2px 4px !important;
    display: flex !important; flex-direction: column; justify-content: center; align-items: center; line-height: 1.1; }
  html button.att-date strong { font-size: 13px; white-space: nowrap; }
  html button.att-date small { font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
  .att-date-pick { flex: 0 0 40px !important; }
}
/* раскрытие строки по нажатию */
.mig-row, .alert-row { cursor: pointer; }
.mig-row:not(.mig-open) .mig-item { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 9rem; }
.mig-row:not(.mig-open) .mig-name .muted.small:first-of-type:not(:last-child) { display: none; }
html .mig-row.mig-open .mig-name { white-space: normal; overflow: visible; }
html .mig-row.mig-open .mig-name strong { white-space: normal; }
.alert-row:not(.open) .alert-msgs { flex-wrap: nowrap; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block; }
.alert-row:not(.open) .alert-msgs .alert-msg { display: inline; }
@media (max-width: 860px) {
  html .att-date-pick { position: relative; overflow: hidden; font-size: 18px; }
  html .att-date-pick > span { line-height: 1; }
  html .att-date-pick .att-date-input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; min-height: 0 !important; padding: 0; border: 0; }
}
/* 07.10: счётчики проблем — маленькая горизонтальная «таблетка» внутри чипа, без украшений, во всех темах */
html .notif-badge, html button.notif-badge {
  height: 18px !important; min-height: 0 !important; max-height: 18px; min-width: 18px; padding: 0 6px; border-radius: 9px; border: 0 !important; box-shadow: none !important;
  font: 700 11px/18px var(--ui-font, system-ui, sans-serif); display: inline-flex; align-items: center; justify-content: center;
  white-space: nowrap; box-sizing: border-box; }
html .notif-badge::before, html .notif-badge::after, html .ts-tabs .notif-badge::after { content: none !important; }
html .ts-tabs .ts-tab-wrap { position: relative; display: inline-flex; }
html .ts-tabs .notif-badge:not(.inline) { position: absolute; top: 50%; right: 8px; left: auto; bottom: auto; transform: translateY(-50%); z-index: 1; }
html .ts-tabs .ts-tab-wrap:has(.notif-badge) > button.ts-tab { padding-right: 46px !important; }
/* 07.10 срочно: легенда Табеля — компактные чипы в строку; действия — отдельной строкой ниже */
html .ts-toolbar { display: flex; flex-direction: column; align-items: stretch; flex-wrap: nowrap; gap: 8px; }
html .ts-toolbar .legend { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; font-size: 12px; flex: none; width: 100%; min-width: 0; }
html .ts-toolbar .legend .lg { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; flex: 0 0 auto; }
html .ts-toolbar .legend .ts-cell { width: 18px; height: 16px; min-width: 0; min-height: 0; font-size: 10px; line-height: 16px; padding: 0; }
html .ts-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; justify-content: flex-end; min-width: 0; }
html .ts-actions .check-line { margin: 0; }
@media (max-width: 860px) {
  html .ts-actions { justify-content: stretch; }
  html .ts-actions > * { flex: 1 1 100%; max-width: 100%; box-sizing: border-box; }
  html .ts-actions .button-link { justify-content: center; text-align: center; }
}
html .ts-grid .ts-name.open, html .ts-grid .ts-name.open a { white-space: normal !important; overflow: visible; text-overflow: clip; }
html .ts-grid .ts-name a { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 07.10: Виза/отпуск на телефоне — каждое поле даты на всю ширину отдельной строкой */
@media (max-width: 860px) {
  html .visa-row { grid-template-columns: 1.4rem minmax(0, 1fr) !important; gap: 8px !important; }
  html .visa-row > label, html .visa-row > label:first-of-type, html .visa-row > .visa-tail { grid-column: 2 / -1 !important; grid-row: auto !important; min-width: 0; }
  html .visa-row > .visa-no { grid-column: 1; grid-row: 1; }
  html .visa-row > label > span { white-space: normal; font-size: 12px; }
  html .visa-row input, html .visa-row select { width: 100%; min-width: 0; max-width: 100%; }
}
/* 07.10: карточка на телефоне — поля не шире экрана; шапка панели «Сотрудники» в Заселении переносится */
@media (max-width: 860px) {
  html .form-grid { grid-template-columns: minmax(0, 1fr) !important; }
  html .form-grid > * { min-width: 0; max-width: 100%; grid-column: 1 / -1 !important; }
  html .form-grid input, html .form-grid select, html .form-grid textarea { min-width: 0; max-width: 100%; width: 100%; box-sizing: border-box; }
  html :has(> .count-pill.wait) { flex-wrap: wrap; row-gap: 4px; min-width: 0; }
  html .count-pill { white-space: nowrap; font-size: 12px; }
}
/* 07.10: Сотрудники на ПК — ширины по содержимому, длинные тексты обрезаются с «…» (полный текст во всплывающей подсказке) */
@media (min-width: 861px) {
  html table.emp-list { table-layout: auto; width: max-content; min-width: 100%; }
  html table.emp-list td, html table.emp-list th { padding: 4px 8px; font-size: 13px; white-space: nowrap; }
  html table.emp-list td.c-pos, html table.emp-list td.c-res, html table.emp-list td.c-sub, html table.emp-list td.c-comp {
    overflow: hidden; text-overflow: ellipsis; }
  html table.emp-list td.c-pos { max-width: 12rem; }
  html table.emp-list td.c-res { max-width: 15rem; }
  html table.emp-list td.c-sub { max-width: 9rem; }
  html table.emp-list td.c-comp { max-width: 8rem; }
  html table.emp-list td code { font-size: 12px; }
  html table.emp-list.sticky-first tbody td:first-child, html table.emp-list.sticky-first thead th:first-child {
    width: 13rem; min-width: 13rem !important; max-width: 13rem !important; }
  html table.emp-list .emp-name-cell a { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
/* 07.10: фильтры Миграционного учёта */
.mig-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 8px 0; }
.mig-filters input[type=search] { flex: 1 1 14rem; min-width: 0; }
.mig-filters select { flex: 0 1 auto; min-width: 0; }
.mig-filters .check-line { white-space: nowrap; margin: 0; }
.mig-filters .mig-year { display: inline-flex; align-items: center; gap: 6px; margin: 0; }
@media (max-width: 860px) {
  html .mig-filters { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
  html .mig-filters input[type=search], html .mig-filters .check-line { grid-column: 1 / -1; }
  html .mig-filters > * { min-width: 0; max-width: 100%; width: 100%; box-sizing: border-box; }
  html .mig-filters .mig-year select { flex: 1; min-width: 0; }
}
/* 07.10: Сотрудники ПК — плотнее, чтобы на 1440 помещались все колонки */
@media (min-width: 861px) {
  html table.emp-list td, html table.emp-list th { padding: 4px 6px; }
  html table.emp-list thead th { font-size: 12px; }
  html table.emp-list.sticky-first tbody td:first-child, html table.emp-list.sticky-first thead th:first-child { width: 11rem; min-width: 11rem !important; max-width: 11rem !important; }
  html table.emp-list td.c-pos { max-width: 9rem; }
  html table.emp-list td.c-res { max-width: 12rem; }
  html table.emp-list td.c-sub { max-width: 8rem; }
  html table.emp-list td.c-comp { max-width: 6rem; }
  html table.emp-list td code { font-size: 11.5px; letter-spacing: -0.02em; }
}
@media (min-width: 861px) {
  html table.emp-list td, html table.emp-list th { padding: 4px 5px; }
  html table.emp-list.sticky-first tbody td:first-child, html table.emp-list.sticky-first thead th:first-child { width: 10rem; min-width: 10rem !important; max-width: 10rem !important; }
  html table.emp-list td.c-pos { max-width: 8rem; }
  html table.emp-list td.c-res { max-width: 10rem; }
}
@media (min-width: 1700px) {
  html table.emp-list.sticky-first tbody td:first-child, html table.emp-list.sticky-first thead th:first-child { width: 13rem; min-width: 13rem !important; max-width: 13rem !important; }
  html table.emp-list td.c-pos { max-width: 14rem; }
  html table.emp-list td.c-res { max-width: 17rem; }
}
html .mig-filters .mig-year { display: inline-flex !important; flex-direction: row !important; align-items: center; gap: 6px; text-align: left; }
html .mig-filters .mig-year > span { white-space: nowrap; }
@media (max-width: 860px) {
  html .mig-filters .check-line { grid-column: 1 / 2; }
  html .mig-filters .mig-year { grid-column: 2 / 3; }
  html .mig-filters .check-line { white-space: normal; font-size: 13px; line-height: 1.2; }
}
/* 07.10: сортировка по заголовкам */
th.sortable { cursor: pointer; user-select: none; }
th.sortable:hover { color: var(--accent); }
th.sortable .sort-arrow { font-size: 10px; }
th.sorted { color: var(--accent); }
.emp-sort-mobile { display: none; }
@media (max-width: 860px) {
  html .emp-sort-mobile { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: 13px; }
  html .emp-sort-mobile select { flex: 1; min-width: 0; }
}
@media (min-width: 861px) {
  html table.emp-list .emp-name-cell a { display: inline-block; max-width: calc(100% - 1.5rem); vertical-align: middle; }
  html table.emp-list .emp-name-cell .warn-mark { vertical-align: middle; }
}
@media (max-width: 860px) {
  html .emp-sort-mobile { display: flex !important; flex-direction: row !important; flex: 1 1 100%; width: 100%; order: 5; align-items: center; gap: 8px; }
  html .emp-sort-mobile > span { white-space: nowrap; color: var(--muted); }
  html .emp-sort-mobile select { flex: 1 1 auto; height: 40px; }
}
@media (max-width: 860px) { html :has(> .emp-sort-mobile) { flex-wrap: wrap !important; row-gap: 8px; } html :has(> .emp-sort-mobile) > p { margin: 0; } }
/* ===== 08.10 «Финансы» ===== */
.fin-month { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
.fin-month input { min-height: 40px; }
.fin-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 8px; }
.fin-card { display: grid; gap: 4px; padding: 12px 16px; border-radius: var(--r-lg, 12px); background: var(--st-surface, var(--panel)); border: 1px solid rgba(128,128,128,.18); min-width: 0; }
.fin-card > span { font-size: 12px; color: var(--muted); }
.fin-card > strong { font-size: 20px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fin-card > small { font-size: 12px; color: var(--muted); }
.fin-card.total { border-color: var(--accent); box-shadow: inset 3px 0 0 var(--accent); }
.fin-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; margin: 16px 0; }
.fin-grid .panel + .panel { margin-top: 0; }
.fin-bars { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.fin-bar-head { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; min-width: 0; }
.fin-bar-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.fin-bar-val { white-space: nowrap; font-weight: 600; }
.fin-bar-track { height: 10px; border-radius: 5px; background: rgba(128,128,128,.18); overflow: hidden; margin-top: 4px; }
.fin-bar-fill { height: 100%; border-radius: 5px; background: var(--accent); }
html[data-theme="bunny"] .fin-bar-fill { background: #FF8FB1; }
html[data-theme="bunny"] .fin-card { background: #FFFFFF; }
.fin-apts td.num, .fin-apts th.num { text-align: right; font-variant-numeric: tabular-nums; }
.fin-apts td.fin-addr { max-width: 16rem; overflow: hidden; text-overflow: ellipsis; }
.fin-apts tfoot th { background: var(--st-sticky-bg); }
@media (max-width: 860px) {
  html .fin-cards { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
  html .fin-card { padding: 10px 12px; }
  html .fin-card > strong { font-size: 16px; }
  html .fin-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  html .fin-month input { font-size: 16px; }
  html .fin-apts td.fin-addr { max-width: 9rem; }
  html .fin-bar-head { flex-wrap: wrap; }
}
/* 08.10 «Финансы» v2 */
.fin-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fin-card.pos > strong { color: var(--st-green, #1f9d55); }
.fin-card.neg > strong { color: var(--st-red, #d64545); }
.fin-card.pos { box-shadow: inset 3px 0 0 var(--st-green, #1f9d55); }
.fin-card.neg { box-shadow: inset 3px 0 0 var(--st-red, #d64545); }
.fin-card.warn { box-shadow: inset 3px 0 0 var(--st-orange, #e08a00); }
.fin-filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0 0 8px; }
.fin-filters select { min-width: 0; flex: 0 1 14rem; }
.fin-formula { margin: 8px 0 16px; font-size: 12px; line-height: 1.5; }
.fin-months { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 4px; align-items: end; height: 170px; }
.fin-month-col { display: grid; grid-template-rows: auto 1fr auto; height: 100%; min-width: 0; text-align: center; gap: 2px; }
.fin-month-bar { display: flex; align-items: flex-end; height: 100%; background: rgba(128,128,128,.10); border-radius: 4px; overflow: hidden; }
.fin-month-bar > div { width: 100%; background: var(--accent); border-radius: 4px 4px 0 0; min-height: 1px; }
html[data-theme="bunny"] .fin-month-bar > div { background: #FF8FB1; }
.fin-month-col.cur .fin-month-lbl { font-weight: 700; color: var(--accent); }
.fin-month-val, .fin-month-lbl { font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: clip; }
.fin-top { margin: 0; padding-left: 1.5rem; display: grid; gap: 4px; font-size: 13px; }
.fin-top li { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 8px; }
.fin-top li a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fin-top li span { font-weight: 600; white-space: nowrap; }
.fin-top li small { grid-column: 1 / -1; font-size: 11px; }
.fin-extreme { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 8px; margin: 0 0 8px; font-size: 13px; }
.fin-extreme > span { grid-column: 1 / -1; font-size: 12px; color: var(--muted); }
.fin-extreme > a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fin-norm { display: flex; align-items: center; gap: 8px; margin: 12px 0 8px; flex-wrap: wrap; }
.fin-norm input { width: 9rem; min-height: 40px; }
.fin-over summary { cursor: pointer; }
.fin-over ul { margin: 8px 0 0; padding-left: 1.2rem; font-size: 13px; max-height: 16rem; overflow: auto; }
.fin-obj .fin-obj-district td { font-weight: 700; }
.fin-obj td.fin-obj-house { padding-left: 16px; max-width: 14rem; overflow: hidden; text-overflow: ellipsis; }
.fin-obj td.num, .fin-obj th.num, .fin-emps td.num, .fin-emps th.num { text-align: right; font-variant-numeric: tabular-nums; }
.fin-apts tr.fin-empty td { color: var(--st-orange, #e08a00); }
.fin-emps td.fin-name { max-width: 16rem; overflow: hidden; text-overflow: ellipsis; }
.fin-emps tfoot th, .fin-obj tfoot th { background: var(--st-sticky-bg); }
@media (max-width: 860px) {
  html .fin-cards { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  html .fin-filters { display: grid; grid-template-columns: minmax(0, 1fr); }
  html .fin-filters select { width: 100%; }
  html .fin-months { height: 140px; gap: 2px; }
  html .fin-month-val { font-size: 8px; }
  html .fin-emps td.fin-name { max-width: 9rem; }
  html .fin-obj td.fin-obj-house { max-width: 9rem; }
}
.fin-month-col .fin-month-val { visibility: hidden; }
.fin-month-col.cur .fin-month-val { visibility: visible; font-weight: 700; overflow: visible; position: relative; z-index: 1; }
.fin-month-col.cur { direction: rtl; }
.fin-month-col.cur > * { direction: ltr; }
html .fin-norm { display: flex !important; flex-direction: row !important; justify-content: flex-start !important; text-align: left; }
html .fin-norm > span { font-size: 13px; }
/* 08.10: зарплата + валюта в одной строке */
.salary-input-row { display: flex; gap: 8px; min-width: 0; }
.salary-input-row input { flex: 1 1 8rem; min-width: 0; }
.salary-input-row select { flex: 0 0 auto; min-width: 0; max-width: 11rem; }
@media (max-width: 860px) { html .salary-input-row select { max-width: 48%; } }
.fin-rate { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin: 0 0 8px; }
html .fin-rate > label { display: flex !important; flex-direction: row !important; align-items: center; gap: 8px; margin: 0; }
.fin-rate input { width: 8rem; min-height: 40px; }
.fin-page-warn, .warn-box { padding: 8px 12px; border-radius: 8px; border: 1px solid var(--st-orange, #e08a00); background: color-mix(in srgb, var(--st-orange, #e08a00) 12%, transparent); margin: 0 0 8px; font-size: 13px; }
/* 08.10: «Финансы» по валютам */
.fin-h3 { font-size: 13px; font-weight: 650; margin: 8px 0 4px; color: var(--muted); }
.fin-grid-tight { margin: 0; gap: 16px; }
.fin-card.usd { box-shadow: inset 3px 0 0 #2e9e6b; }
.fin-bars li.cur-usd .fin-bar-fill, .fin-month-bar.cur-usd > div { background: #2e9e6b; }
html[data-theme="bunny"] .fin-bars li.cur-usd .fin-bar-fill, html[data-theme="bunny"] .fin-month-bar.cur-usd > div { background: #7cc9a3; }
.fin-month-val { font-size: 10px; }
.fin-emps tfoot th { line-height: 1.3; }
/* 08.10: «Механизация» — таблица как в Excel (шапка из 3 строк, закреплены строки 1–4 и колонки A–C) */
html[data-theme="light"], html[data-theme="bunny"], html:not([data-theme]) {
  --mz-param: #d0e0e3; --mz-total: #d9d2e9; --mz-helper: #efefef; --mz-none: #d9d9d9; --mz-pos: #d9ead3; --mz-neg: #f4cccc;
}
html[data-theme="dark"] {
  --mz-param: #24393d; --mz-total: #362e4b; --mz-helper: #2a2a31; --mz-none: #3a3a41; --mz-pos: #1e3a25; --mz-neg: #4a2424;
}
.mz-tabs { margin: 0 0 0.75rem; }
.mz-filters label { display: flex; flex-direction: column; gap: 0.2rem; }
.mz-filters select { max-width: 14rem; }
.mz-scroll { max-height: calc(100dvh - 17rem); min-height: 22rem; overflow: auto; }
.mz-scroll-short { max-width: 32rem; min-height: 0; }
.mz-table { width: max-content; min-width: 100%; font-size: 13px; }
.mz-table th, .mz-table td { padding: 0.3rem 0.5rem; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); white-space: nowrap; }
.mz-table thead { position: sticky; top: 0; z-index: 4; }
.mz-table thead th { text-align: center; vertical-align: middle; white-space: normal; background: var(--st-sticky-bg); font-weight: 600; line-height: 1.2; }
.mz-table td { text-align: left; font-variant-numeric: tabular-nums; }
.mz-table td.mz-c { text-align: center; }
.mz-table .mz-a, .mz-table .mz-b, .mz-table .mz-cc { position: sticky; z-index: 2; background: var(--st-solid); }
.mz-table thead .mz-a, .mz-table thead .mz-b, .mz-table thead .mz-cc { background: var(--st-sticky-bg); z-index: 5; }
.mz-table .mz-a { left: 0; width: 15rem; min-width: 15rem; max-width: 15rem; overflow: hidden; text-overflow: ellipsis; }
.mz-table th.mz-ab { width: 26rem; min-width: 26rem; max-width: 26rem; }
.mz-table .mz-b { left: 15rem; width: 11rem; min-width: 11rem; max-width: 11rem; overflow: hidden; text-overflow: ellipsis; }
.mz-table .mz-cc { left: 26rem; width: 5.5rem; min-width: 5.5rem; max-width: 5.5rem; box-shadow: inset -2px 0 0 var(--line); }
.mz-table td.mz-file { max-width: 18rem; overflow: hidden; text-overflow: ellipsis; }
.mz-table thead .mz-param { background: var(--mz-param); font-weight: 400; }
.mz-table thead .mz-total { background: var(--mz-total); font-weight: 400; }
.mz-table tr.mz-helper td, .mz-table thead tr.mz-helper .mz-a, .mz-table thead tr.mz-helper .mz-b, .mz-table thead tr.mz-helper .mz-cc { background: var(--mz-helper); }
.mz-table tr.mz-helper td.mz-list { white-space: normal; font-size: 11px; line-height: 1.25; }
.mz-table td.mz-none { background: var(--mz-none); }
.mz-table td.mz-pos { background: var(--mz-pos); }
.mz-table td.mz-neg { background: var(--mz-neg); }
.mz-weights { width: 100%; }
.mz-weights td:last-child, .mz-weights th:last-child { width: 6rem; }
@media (max-width: 860px) {
  .mz-table .mz-a, .mz-table .mz-b, .mz-table .mz-cc { position: static; }
  .mz-scroll { max-height: none; }
  .mz-filters select { max-width: none; }
}

/* ===== Узел B, 08.10: «Механизация» → «Загрузить счёт» и розовые пометки ===== */
:root { --mz-mark: #ffc0e0; --mz-mark-ink: inherit; --mzi-warn: #fff4e0; --mzi-norow: #f6f6f6; }
html[data-theme="dark"] { --mz-mark: #6a2a4c; --mzi-warn: #3d3220; --mzi-norow: #2a2a31; }
.mz-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; margin: 0 0 0.75rem; }
.mz-toolbar .chk, .mzi-panel .chk { display: inline-flex; align-items: center; gap: 0.35rem; }
.mz-markmode-on { background: var(--mz-mark) !important; border-color: #d0508f !important; font-weight: 700; }
.mz-mark-count { padding: 0.2rem 0.6rem; border-radius: 999px; border: 1px solid var(--line); font-size: 13px; }
.mz-mark-count.on { background: var(--mz-mark); border-color: #d0508f; font-weight: 700; }
.mz-table td.mz-mark, .mz-table tbody td.mz-mark.mz-a, .mz-table tbody td.mz-mark.mz-b, .mz-table tbody td.mz-mark.mz-cc { background: var(--mz-mark) !important; color: var(--mz-mark-ink); }
.mz-table.mz-marking tbody td { cursor: cell; }
.mz-table.mz-marking tbody td:hover { outline: 2px solid #d0508f; outline-offset: -2px; }
.ok-box { padding: 8px 12px; border-radius: 8px; border: 1px solid var(--st-work-line, #3a8f4a); background: color-mix(in srgb, var(--st-work-line, #3a8f4a) 12%, transparent); margin: 0 0 8px; font-size: 13px; }
.mzi-panel { margin: 0 0 1rem; padding: 0.75rem; }
.mzi-head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; }
.mzi-head .muted { flex: 1 1 24rem; }
.mzi-pick { position: relative; overflow: hidden; }
.mzi-pick input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.mzi-draft { margin-top: 0.9rem; border: 1px solid var(--line); border-radius: 10px; padding: 0.6rem 0.7rem; }
.mzi-draft.saved { border-color: var(--st-work-line, #3a8f4a); }
.mzi-draft-head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
.mzi-draft-head .grow { flex: 1; }
.mzi-file { word-break: break-all; }
.mzi-badge { padding: 0.1rem 0.55rem; border-radius: 999px; font-size: 12px; background: var(--mz-param); }
.mzi-badge.fmt-PriceList { background: var(--mz-none); }
.mzi-badge.fmt-Unknown { background: var(--mz-neg); }
.mzi-badge.ok { background: var(--mz-pos); }
.mzi-meta { display: flex; flex-wrap: wrap; gap: 0.35rem 1.2rem; margin: 0.5rem 0; font-size: 13px; align-items: center; }
.mzi-meta input { width: 12rem; margin-left: 0.3rem; }
.mzi-msgs { margin: 0.3rem 0 0.5rem; padding-left: 1.2rem; font-size: 13px; }
.mzi-msgs li.w, .mzi-w .w, .mzi-plan .w { color: var(--danger-ink, #b3261e); }
.mzi-msgs li.i, .mzi-w .i { color: var(--muted); }
.mzi-w .m { color: #9a5b00; }
.mzi-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; margin: 0.4rem 0; }
.mzi-scroll { max-height: 34rem; overflow: auto; }
.mzi-lines td, .mzi-plan td, .mzi-list td { vertical-align: top; }
.mzi-lines td.num, .mzi-plan td.num, .mzi-list td.num, .mzi-lines td.num { text-align: right; }
.mzi-lines td.mzi-desc, .mzi-plan td.mzi-desc { white-space: normal; min-width: 22rem; max-width: 34rem; }
.mzi-lines .mzi-w { white-space: normal; font-size: 12px; line-height: 1.3; margin-top: 0.25rem; }
.mzi-lines tr.mzi-warn > td, .mzi-plan tr.mzi-warn > td { background: var(--mzi-warn); }
.mzi-lines tr.mzi-norow:not(.mzi-warn) > td { background: var(--mzi-norow); }
.mzi-parts { list-style: none; margin: 0.25rem 0 0; padding: 0; font-size: 12px; }
.mzi-parts li.w { color: var(--danger-ink, #b3261e); }
.mzi-pw { font-size: 12px; color: var(--danger-ink, #b3261e); }
.mzi-row { max-width: 22rem; font-size: 12px; }
.mzi-amount { width: 8rem; text-align: right; }
.mzi-delta { font-weight: 700; }
.mzi-h { margin: 0.8rem 0 0.4rem; font-size: 14px; }
.mzi-save { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; margin-top: 0.6rem; }
.mzi-raw { max-height: 20rem; overflow: auto; font-size: 11px; white-space: pre-wrap; }
.mzi-list tr.mzi-rolled td { color: var(--muted); text-decoration: line-through; }
.mzi-list tr.mzi-rolled td.mzi-actions, .mzi-list tr.mzi-rolled td:nth-last-child(2) { text-decoration: none; }
.mzi-list td.mzi-actions { display: flex; gap: 0.35rem; }
.mzi-list tr.mzi-sub > td { background: var(--soft, transparent); padding: 0.4rem; }
.mz-table tr.mz-total-row td { font-weight: 700; background: var(--mz-total); }
.mz-toolbar label.chk, .mzi-panel label.chk, .mzi-parts label { display: inline-flex; flex-direction: row; align-items: center; gap: 0.35rem; font-size: 13px; }
.mz-toolbar input[type=checkbox], .mzi-panel input[type=checkbox], .mzi-panel input[type=radio], .mzi-sub input[type=checkbox] {
  width: 1.1rem; height: 1.1rem; min-width: 0; min-height: 0; padding: 0; margin: 0; flex: none;
}
.mzi-meta label { display: inline-flex; flex-direction: row; align-items: center; gap: 0.35rem; font-size: 13px; }
.mzi-meta input { min-width: 0; padding: 0.3rem 0.5rem; }
.mzi-row, .mzi-amount { min-width: 0; padding: 0.25rem 0.4rem; }
.mzi-parts b { font-weight: 650; }

/* ===== 08.10: «Заселение» — вид «Карта» (тепловая карта коек) ===== */
:root, html[data-theme="light"] { --bed-free: #1f9d55; --bed-occ: #2f62d6; --bed-fired: #e8b400; --bed-ink: #fff; --bed-fired-ink: #1d1d1f; --heat-a: 245, 158, 11; --heat-b: 229, 72, 77; }
html[data-theme="dark"] { --bed-free: #23a85e; --bed-occ: #3d74ea; --bed-fired: #f0c419; --heat-a: 251, 176, 59; --heat-b: 248, 96, 96; }
html[data-theme="bunny"] { --bed-free: #2fa864; --bed-occ: #4b6fe0; --bed-fired: #f2c230; }
.settle-title { align-items: center; }
.view-toggle { display: inline-flex; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: var(--st-solid); }
html .view-toggle button { border: 0; border-radius: 0; min-height: 34px; padding: 4px 14px; background: transparent; color: var(--ink); box-shadow: none; }
html .view-toggle button.on { background: var(--accent); color: var(--accent-ink); }
.map-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 8px; }
.map-chips { display: flex; flex-wrap: wrap; gap: 6px; }
html button.map-chip { min-height: 32px; padding: 3px 12px; border-radius: 999px; border: 1px solid var(--line); background: var(--st-solid); color: var(--ink); font-size: 13px; box-shadow: none; }
html button.map-chip.on { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.map-house-select { min-height: 34px; max-width: 16rem; }
.map-search { display: flex; gap: 6px; flex: 1 1 16rem; min-width: 0; }
.map-search input { flex: 1 1 auto; min-width: 0; min-height: 34px; }
html .map-search button { min-height: 34px; padding: 4px 14px; }
.map-msg { margin: 0 0 8px; }
.map-stats { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.map-stat { display: inline-flex; align-items: baseline; gap: 5px; padding: 4px 10px; border-radius: 10px; background: var(--st-solid); border: 1px solid var(--line); font-size: 13px; color: var(--muted); }
.map-stat b { font-size: 16px; color: var(--ink); }
.map-stat.occ b { color: var(--bed-occ); }
.map-stat.free b { color: var(--bed-free); }
.map-stat.wait b { color: var(--st-red, #e5484d); }
.map-legend { display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: center; font-size: 12px; color: var(--muted); margin-bottom: 12px; }
.map-legend > span { display: inline-flex; align-items: center; gap: 5px; }
.map-legend i { display: inline-block; width: 14px; height: 14px; border-radius: 4px; }
.lg-bed.free { background: var(--bed-free); } .lg-bed.occ { background: var(--bed-occ); } .lg-bed.fired { background: var(--bed-fired); }
.lg-heat i { border: 1px solid var(--line); margin-right: -3px; }
.lg-nobeds { border: 1.5px dashed var(--muted); }
.map-house { background: var(--st-solid); border: 1px solid var(--line); border-radius: 14px; padding: 12px; margin-bottom: 12px; scroll-margin-top: 80px; }
.map-house-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; margin-bottom: 10px; }
.map-house-head h2 { margin: 0; font-size: 16px; }
.map-house-occ { font-size: 12px; color: var(--muted); }
.map-apts { display: grid; grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr)); gap: 8px; }
.map-apt { border: 1px solid var(--line); border-radius: 10px; padding: 6px 7px 7px; min-width: 0; background-color: var(--st-solid); }
.map-apt.heat-0, .lg-heat i.heat-0 { background-image: none; }
.map-apt.heat-1, .lg-heat i.heat-1 { background-image: linear-gradient(rgba(var(--heat-a), .10), rgba(var(--heat-a), .10)); }
.map-apt.heat-2, .lg-heat i.heat-2 { background-image: linear-gradient(rgba(var(--heat-a), .20), rgba(var(--heat-a), .20)); }
.map-apt.heat-3, .lg-heat i.heat-3 { background-image: linear-gradient(rgba(var(--heat-b), .18), rgba(var(--heat-b), .18)); }
.map-apt.heat-4, .lg-heat i.heat-4 { background-image: linear-gradient(rgba(var(--heat-b), .30), rgba(var(--heat-b), .30)); }
.map-apt.heat-3, .map-apt.heat-4 { border-color: rgba(var(--heat-b), .45); }
.map-apt.no-beds { border: 1.5px dashed var(--muted); background: transparent; opacity: .8; }
.map-apt-head { display: flex; justify-content: space-between; align-items: baseline; gap: 6px; margin-bottom: 5px; font-size: 12px; }
.map-apt-no { font-weight: 650; color: var(--ink); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.map-apt-occ { color: var(--muted); font-variant-numeric: tabular-nums; }
.map-apt-none { font-size: 12px; color: var(--muted); }
.map-beds { display: flex; flex-wrap: wrap; gap: 4px; }
html button.map-bed {
  width: 28px; min-width: 28px; height: 28px; min-height: 28px !important; padding: 0 !important; margin: 0;
  border: 0; border-radius: 6px; font-size: 12px; font-weight: 650; line-height: 28px; text-align: center;
  color: var(--bed-ink); box-shadow: none; cursor: pointer; position: relative; touch-action: manipulation;
}
html button.map-bed.free { background: var(--bed-free); }
html button.map-bed.occ { background: var(--bed-occ); }
html button.map-bed.fired { background: var(--bed-fired); color: var(--bed-fired-ink); }
html button.map-bed.leaving { background-image: repeating-linear-gradient(135deg, transparent 0 5px, rgba(255,255,255,.28) 5px 8px); }
.lg-bed.occ.leaving { background-image: repeating-linear-gradient(135deg, transparent 0 4px, rgba(255,255,255,.4) 4px 6px); }
html button.map-bed:hover { filter: brightness(1.12); }
html button.map-bed:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
html button.map-bed.found { outline: 3px solid #ff8a00; outline-offset: 2px; animation: bed-pulse 1.2s ease-in-out 3; z-index: 1; }
@keyframes bed-pulse { 50% { outline-offset: 5px; } }
html button.map-bed.selected { outline: 3px solid var(--accent); outline-offset: 2px; }
.is-picking .map-bed.occ, .is-picking .map-bed.fired { opacity: .45; }
.is-picking .map-bed.target { box-shadow: 0 0 0 2px var(--st-solid), 0 0 0 4px var(--bed-free); animation: bed-target 1.4s ease-in-out infinite; }
@keyframes bed-target { 50% { box-shadow: 0 0 0 2px var(--st-solid), 0 0 0 6px rgba(35, 168, 94, .35); } }
html button.map-bed.drop-ok { box-shadow: 0 0 0 3px var(--bunny-happy, #22c55e); transform: scale(1.15); }
html button.map-bed.drop-bad { box-shadow: 0 0 0 3px var(--bunny-sad, #ef4444); cursor: not-allowed; }
html button.map-bed.just-moved { box-shadow: 0 0 0 3px #ff8a00; }
.map-panel .wait-card .emp-meta { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bed-info-meta { margin: 0; }
.bed-info .form-actions { flex-wrap: wrap; }
@media (prefers-reduced-motion: reduce) { html button.map-bed.found, .is-picking .map-bed.target { animation: none; } }
@media (max-width: 860px) {
  .settle-title .view-toggle { width: 100%; }
  .settle-title .view-toggle button { flex: 1 1 50%; }
  .map-toolbar { gap: 6px; }
  .map-house-select { flex: 1 1 100%; max-width: none; }
  .map-search { flex: 1 1 100%; }
  .map-house { padding: 8px; border-radius: 12px; }
  .map-apts { grid-template-columns: repeat(auto-fill, minmax(7.6rem, 1fr)); gap: 6px; }
  .map-apt { padding: 5px; }
  .map-stat { padding: 3px 8px; font-size: 12px; }
  .map-stat b { font-size: 14px; }
}
.map-empty-houses { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 4px 0 12px; }
.map-empty-house { font-size: 12px; padding: 3px 9px; border: 1.5px dashed var(--muted); border-radius: 8px; color: var(--muted); background: var(--st-solid); }
/* 08.10 (17:48): компактная карта — дома карточками по ширине содержимого, вплотную с переносом */
.view-map { --bed-size: 28px; }
.map-dist-title { display: flex; align-items: center; gap: 6px; margin: 4px 0 6px; font-size: 14px; font-weight: 650; }
.map-houses { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px; margin-bottom: 12px; }
html .map-house { flex: 0 1 auto; width: max-content; max-width: 100%; min-width: 0; margin: 0; padding: 8px; border-radius: 12px; box-sizing: border-box; scroll-margin-top: 80px; }
html .map-house-head { flex-wrap: nowrap; justify-content: flex-start; align-items: center; gap: 6px; margin: 0 0 6px; }
html .map-house-head h2 { font-size: 14px; line-height: 1.2; white-space: nowrap; }
.map-badge { display: inline-block; padding: 0 6px; border-radius: 999px; font-size: 11px; line-height: 18px; font-weight: 600; color: var(--muted); background: var(--soft, rgba(127,127,127,.12)); font-variant-numeric: tabular-nums; white-space: nowrap; }
html .map-apts { display: flex; flex-wrap: wrap; gap: 6px; }
html .map-apt { padding: 6px; border-radius: 8px; }
html .map-apt.flat { border: 0; padding: 0; background: transparent; background-image: none; }
.map-house.single.heat-1 { background-image: linear-gradient(rgba(var(--heat-a), .10), rgba(var(--heat-a), .10)); }
.map-house.single.heat-2 { background-image: linear-gradient(rgba(var(--heat-a), .20), rgba(var(--heat-a), .20)); }
.map-house.single.heat-3 { background-image: linear-gradient(rgba(var(--heat-b), .18), rgba(var(--heat-b), .18)); border-color: rgba(var(--heat-b), .45); }
.map-house.single.heat-4 { background-image: linear-gradient(rgba(var(--heat-b), .30), rgba(var(--heat-b), .30)); border-color: rgba(var(--heat-b), .45); }
.map-house.single.no-beds { border: 1.5px dashed var(--muted); }
html .map-apt-head { margin-bottom: 4px; gap: 6px; }
html .map-beds { display: grid; gap: 4px; flex-wrap: nowrap; }
html button.map-bed { width: var(--bed-size); min-width: var(--bed-size); height: var(--bed-size); min-height: var(--bed-size) !important; line-height: var(--bed-size); }
html[data-theme="bunny"] .map-house { background-color: #fff; }
@media (max-width: 860px) {
  .map-houses { gap: 8px; }
  html .map-house { padding: 7px; }
}
html[data-theme="bunny"] button.map-bed, html[data-theme="bunny"] .map-legend i.lg-bed { border-radius: 7px !important; }
/* 08.10 (18:13): одинаковые карточки домов — одна сетка, один фон, без подкраски по заполненности */
.view-map { --house-w: 112px; --house-h: 124px; }
html .map-houses { display: grid; grid-template-columns: repeat(auto-fill, var(--house-w)); grid-auto-rows: var(--house-h); gap: 10px; justify-content: start; }
html .map-house, html .map-house.single, html .map-house.no-beds,
html .map-house[class*="heat-"] { width: auto; max-width: none; height: var(--house-h); padding: 8px; display: flex; flex-direction: column; overflow: hidden;
  background: var(--st-solid); background-image: none; border: 1px solid var(--line); border-radius: 12px; }
html[data-theme="bunny"] .map-house { background: #fff; background-image: none; }
html .map-house-head { flex: 0 0 auto; margin-bottom: 4px; }
html .map-apts { display: block; flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden; scrollbar-width: thin; }
html .map-apt, html .map-apt.flat, html .map-apt.no-beds, html .map-apt[class*="heat-"] { border: 0; padding: 0; margin: 0 0 4px; border-radius: 0; background: transparent; background-image: none; opacity: 1; }
html .map-apt-head { justify-content: flex-start; gap: 0; margin-bottom: 3px; font-size: 12px; line-height: 15px; }
.map-apt-none { font-size: 12px; color: var(--muted); white-space: nowrap; }
.map-house.no-beds .map-house-head h2, .map-house.no-beds .map-apt-no { color: var(--muted); }
.map-badge.full { background: rgba(var(--heat-b), .18); color: var(--st-red-ink, #b42318); }
html[data-theme="dark"] .map-badge.full { color: #fca5a5; }
html[data-theme="bunny"] .map-legend i.lg-bed { border-radius: 3px !important; }
@media (max-width: 860px) { html .map-houses { gap: 8px; } }
html .map-house.single.no-beds, html .map-house.multi.no-beds { border: 1px solid var(--line); }
html .map-apt-head { display: flex; flex-wrap: nowrap; min-width: 0; }
html .map-apt-head .map-apt-no { flex: 0 0 auto; overflow: visible; }
html .map-apt-head .map-apt-none { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
html .map-badge.full { background: var(--st-red, #e5484d); color: #fff; }
html .map-apt.no-beds .map-apt-head, html .map-apt.no-beds .map-apt-none { font-size: 11px; letter-spacing: -0.15px; }
/* 08.10: безопасность входа */
.login-sec h3 { font-size: 14px; margin: 12px 0 6px; }
.login-sec-table td, .login-sec-table th { white-space: nowrap; }
.pw-hint { display: block; margin: 2px 0 0; font-size: 12px; }
.login-sec-filter { display: inline-flex; gap: 8px; align-items: center; margin: 0 0 8px; }
.login-sec-filter select { min-width: 160px; }
/* 08.10: «Журнал входов» — одна лента событий; на телефоне строка в две линии, без скрытых колонок */
:root { --lj-warn-ink: #b45309; --lj-warn-bg: rgba(245, 158, 11, 0.16); --lj-info-ink: #1d4ed8; --lj-info-bg: rgba(59, 130, 246, 0.13); }
html[data-theme="dark"] { --lj-warn-ink: #fbbf24; --lj-warn-bg: rgba(251, 191, 36, 0.15); --lj-info-ink: #93c5fd; --lj-info-bg: rgba(147, 197, 253, 0.15); }
html[data-theme="bunny"] { --lj-warn-ink: #a14a00; --lj-info-ink: #1e40af; }
.lj-filters { display: flex; flex-wrap: wrap; gap: 8px 14px; margin: 0 0 10px; }
.lj-filters label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--muted); }
.lj-filters select { min-width: 190px; max-width: 100%; }
.lj-list { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; margin: 0 0 10px; }
.lj-row { display: grid; grid-template-columns: 136px minmax(110px, 1fr) minmax(220px, 1.6fr) 150px; gap: 4px 12px; align-items: center; padding: 7px 12px; border-top: 1px solid var(--line); font-size: 13px; }
.lj-row:first-child { border-top: 0; }
.lj-head { font-size: 12px; font-weight: 600; color: var(--muted); }
.lj-time { font-variant-numeric: tabular-nums; white-space: nowrap; }
.lj-login { font-weight: 600; overflow-wrap: anywhere; }
.lj-ip { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.lj-badge { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 12px; font-weight: 600; line-height: 1.4; }
.lj-ok { color: var(--ok-ink); background: var(--ok-bg); }
.lj-fail { color: var(--lj-warn-ink); background: var(--lj-warn-bg); }
.lj-lock { color: var(--danger-ink); background: var(--danger-bg); box-shadow: inset 0 0 0 1px var(--danger-ink); }
.lj-unlock { color: var(--lj-info-ink); background: var(--lj-info-bg); }
.lj-locks { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 6px; }
.lj-locks li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 8px 10px; border: 1px solid var(--danger-ink); border-radius: 10px; }
.lj-locks li button { margin-left: auto; }
.lj-more { margin-right: 8px; }
@media (max-width: 700px) {
  .lj-head { display: none; }
  .lj-row { grid-template-columns: auto 1fr; grid-template-areas: "time event" "login ip"; padding: 8px 10px; }
  .lj-time { grid-area: time; font-size: 12px; color: var(--muted); }
  .lj-event { grid-area: event; justify-self: end; text-align: right; }
  .lj-login { grid-area: login; }
  .lj-ip { grid-area: ip; justify-self: end; text-align: right; }
  .lj-filters label, .lj-filters select { flex: 1 1 100%; min-width: 0; width: 100%; }
}