:root,[data-theme="dark"]{
  --bg:#0b1220;
  --panel:#0f1b33;
  --panel2:#0c1730;
  --text:#eaf1ff;
  --muted:#9fb0d0;
  --line:#203256;
  --accent:#4f8cff;
  --ok:#26d07c;
  --warn:#ffcc66;
  --bad:#ff6b6b;
  --shadow:0 10px 25px rgba(0,0,0,.35);
  --radius:14px;
  --radius2:10px;
  --font:system-ui,-apple-system,Segoe UI,Roboto,Arial,"Noto Sans",sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
}
[data-theme="light"]{
  --bg:#edf3fb;
  --panel:#ffffff;
  --panel2:#f5f8fe;
  --text:#16233c;
  --muted:#627491;
  --line:#cdd9ea;
  --accent:#4f8cff;
  --ok:#1f9e62;
  --warn:#c88a12;
  --bad:#d65858;
  --shadow:0 10px 24px rgba(25,49,93,.10);
}
html{color-scheme:dark;height:100%}
[data-theme="light"]{color-scheme:light}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{
  font-family:var(--font);
  color:var(--text);
  background:linear-gradient(180deg, #070c16 0%, #0b1220 40%, #080d18 100%);
  overflow:hidden;
  contain:strict;
}
[data-theme="light"] body{
  background:linear-gradient(180deg, #f7fbff 0%, #edf3fb 45%, #e8eef8 100%);
}
.app{
  height:100%;
  display:grid;
  grid-template-columns:290px 1fr;
  grid-template-rows:64px 1fr;
  grid-template-areas:"sidebar topbar" "sidebar main";
  position:relative;z-index:1;
}
.topbar{
  grid-area:topbar;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:10px 16px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg, rgba(15,27,51,.96) 0%, rgba(15,27,51,.85) 100%);
}
[data-theme="light"] .topbar{
  background:linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(245,249,255,.94) 100%);
  box-shadow:0 6px 18px rgba(34,61,109,.05),inset 0 1px 0 rgba(255,255,255,.75);
}
.brand{display:flex;align-items:center;gap:12px;min-width:320px}
.logo{
  width:38px;height:38px;border-radius:10px;
  background:linear-gradient(135deg, rgba(79,140,255,.95), rgba(79,140,255,.2));
  box-shadow:0 8px 20px rgba(79,140,255,.25);
  display:grid;place-items:center;font-weight:700;letter-spacing:.5px;font-size:13px;
}
.brand h1{font-size:14px;margin:0;line-height:1.2;font-weight:650}
.brand .sub{font-size:12px;color:var(--muted);margin-top:2px}
.actions{display:flex;align-items:center;gap:10px;justify-content:flex-end;flex:1}
.env{
  font-family:var(--mono);font-size:12px;color:var(--muted);
  border:1px solid var(--line);background:rgba(12,23,48,.6);
  padding:6px 10px;border-radius:999px;display:flex;align-items:center;gap:8px;white-space:nowrap;
}
[data-theme="light"] .env{background:rgba(255,255,255,.90)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px rgba(38,208,124,.12)}
.searchTop{width:min(560px,48vw);position:relative}
.searchTopInner{
  display:flex;background:rgba(12,23,48,.55);
  border:1px solid var(--line);border-radius:999px;overflow:hidden;
}
[data-theme="light"] .searchTopInner{background:rgba(255,255,255,.90)}
.searchTop input{
  flex:1;border:0;outline:none;background:transparent;color:var(--text);padding:10px 12px 10px 14px;font-size:13px;
}
[data-theme="light"] .searchTop input{color:var(--text)}
.searchTop button{
  border:0;background:rgba(79,140,255,.18);color:var(--text);padding:0 14px;cursor:pointer;font-weight:600;
}
[data-theme="light"] .searchTop button{
  background:linear-gradient(180deg, rgba(79,140,255,.18) 0%, rgba(79,140,255,.12) 100%);
  border-color:rgba(79,140,255,.26);
}
.searchDropdown{
  position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);
  z-index:999;min-width:440px;width:auto;max-width:calc(100vw - 32px);
  border:1px solid var(--line);border-radius:var(--radius);
  background:var(--panel);box-shadow:0 20px 52px rgba(0,0,0,.55);
  max-height:440px;overflow-y:auto;
}
[data-theme="light"] .searchDropdown{
  background:var(--panel);border-color:rgba(111,138,178,.24);
  box-shadow:0 20px 52px rgba(25,49,93,0.18);
}
.searchDropdownItem{
  display:block;padding:12px 18px;text-decoration:none;color:var(--text);
  border-bottom:1px solid rgba(32,50,86,.25);cursor:pointer;transition:background .12s ease;
}
.searchDropdownItem:hover{background:rgba(79,140,255,.08)}
[data-theme="light"] .searchDropdownItem:hover{background:rgba(79,140,255,.055)}
.searchDropdownItem:last-of-type{border-bottom:none}
.sdiTop{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.sdiType{
  font-size:10px;font-weight:600;letter-spacing:.04em;
  color:#7086aa;border:1px solid rgba(32,50,86,.6);border-radius:999px;
  padding:2px 10px;background:rgba(11,18,32,.5);white-space:nowrap;
  text-transform:uppercase;
}
[data-theme="light"] .sdiType{
  background:rgba(245,249,255,.85);border-color:rgba(111,138,178,.22);color:#5b6d89;
}
.sdiTitle{font-size:14px;font-weight:650;line-height:1.35}
.sdiSub{font-size:12px;color:var(--muted);margin-top:3px;line-height:1.35}
.sdiCtx{font-size:11px;color:var(--muted);margin-top:4px;font-style:italic;line-height:1.3}
.searchDropdownAll{
  display:block;padding:12px 18px;text-align:center;font-size:13px;font-weight:600;
  color:var(--accent);text-decoration:none;cursor:pointer;border-top:1px solid var(--line);
  transition:background .12s ease;
}
.searchDropdownAll:hover{background:rgba(79,140,255,.08)}
[data-theme="light"] .searchDropdownAll:hover{background:rgba(79,140,255,.055)}
.iconBtn,.modeBtn{
  border:1px solid var(--line);background:rgba(12,23,48,.55);color:var(--text);
  height:38px;padding:0 12px;border-radius:10px;cursor:pointer;
  transition:.18s transform ease,.18s background ease,.18s border-color ease;
}
.iconBtn:hover,.modeBtn:hover,.btn:hover,.linkBtn:hover,.nav a:hover{transform:translateY(-1px)}
.user{
  display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:rgba(12,23,48,.55);
  padding:6px 10px;border-radius:12px;min-width:220px;
}
[data-theme="light"] .user{background:rgba(255,255,255,.90)}
[data-theme="light"] .iconBtn,[data-theme="light"] .modeBtn{background:rgba(255,255,255,.85);border-color:rgba(111,138,178,.20)}
[data-theme="light"] .iconBtn:hover,[data-theme="light"] .modeBtn:hover{background:rgba(48,86,150,.06);border-color:rgba(48,86,150,.14)}
.avatar{width:28px;height:28px;border-radius:10px;background:rgba(79,140,255,.25);border:1px solid rgba(79,140,255,.35);display:grid;place-items:center;font-weight:700;font-size:12px}
img.avatar.userAvatar, .profileAvatar{object-fit:cover}
.profileAvatar{width:84px;height:84px;border-radius:999px;font-size:28px}
.userAvatar{object-fit:cover}
.userSettingsLink{
  width:30px;height:30px;display:grid;place-items:center;flex:none;margin-left:8px;
  border:1px solid var(--line);border-radius:var(--radius2,10px);color:var(--muted);
  background:transparent;text-decoration:none;transition:.15s ease;
}
.userSettingsLink:hover{color:var(--accent);border-color:var(--accent);transform:translateY(-1px)}
.userSettingsLink:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(79,140,255,.12)}
.profileGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.profileGridSingle{grid-template-columns:1fr}
.profileCol{border:1px solid var(--line);border-radius:var(--radius2,12px);padding:14px;background:rgba(9,17,34,.25)}
[data-theme="light"] .profileCol{background:rgba(255,255,255,.55)}
.profileCol h3{margin:0 0 10px;font-size:14px}
.profileNote{margin-bottom:10px}
.profileGrid .note.profileNote{margin-bottom:0}
.avatarRow{display:flex;align-items:center;gap:14px;margin-bottom:12px;flex-wrap:wrap}
.definitionRows{margin-top:12px;display:flex;flex-direction:column;gap:6px}
.definitionRow{display:flex;justify-content:space-between;gap:12px;padding:7px 10px;border:1px solid var(--line);border-radius:10px;background:rgba(11,18,32,.35);font-size:13px}
[data-theme="light"] .definitionRow{background:rgba(255,255,255,.75)}
.definitionLabel{color:var(--muted);font-size:12px;min-width:180px}
.definitionValue{font-weight:600;text-align:right}
.avatarInputBtn{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:8px;cursor:pointer}
.avatarInputBtn input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;font-size:0}
.securityForm{display:flex;flex-direction:column;gap:8px}
@media (max-width:1120px){
  .profileGrid{grid-template-columns:1fr}
}
@media (max-width:560px){
  .profileCol{padding:10px}
}
.icHeaderPanel{padding:12px 14px}.icHeaderPanel .panelHeader{margin-bottom:0}
.icCompactHeader{padding:0 0 0;border-bottom:none}
.icCompactHeader h2{margin:0}
.icHeaderActions{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  flex-wrap:wrap;margin-top:10px;
}
.icExportActions,.icLifecycleActions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.icPanelBodyNoPad{padding:0}
.icRequisitesPanel .definitionRows+.definitionRows{margin-top:6px}
.icSectionPanel .field-full{grid-column:1/-1}
.icSectionPanel .field-full .field-input{width:100%}
.icCompositionRequisites{display:flex;flex-direction:column;gap:10px}
.icCompositionUtility{display:flex;flex-direction:column;gap:10px}
.compositionGroupPanel{padding:12px 14px}
.compositionGroupPanel .compositionPartHeader{margin-bottom:8px}
.icDateGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.compositionContentPanel{display:flex;flex-direction:column;gap:14px}
.compositionUtilityRow{display:flex;flex-wrap:wrap;align-items:end;gap:10px}
.compositionGroup{display:flex;flex-direction:column;gap:10px}
.compositionAddAfterTable{margin-top:10px;align-self:flex-start}
@media (max-width:560px){
  .compositionUtilityRow{flex-direction:column;align-items:stretch}
}
.icAddRow{align-items:flex-end}
.icReadinessCard{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius);background:rgba(9,17,34,.25)}
[data-theme="light"] .icReadinessCard{background:rgba(255,255,255,.55)}
.icReadinessTitle{font-weight:700;font-size:13px}
.icReadinessMain{min-width:220px}
.icReadinessCode{font-weight:700}
.icReadinessName{color:var(--muted);font-size:12.5px}
.icReadinessMessage{font-size:12.5px;margin-top:2px}
.icReadinessActions{display:flex;gap:8px;flex-wrap:wrap}
@media (max-width:560px){
  .icDateGrid{grid-template-columns:1fr}
}
.icSectionPanel{margin-top:12px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius);background:rgba(9,17,34,.25)}
[data-theme="light"] .icSectionPanel{background:rgba(255,255,255,.55)}
.icSectionPanel .hkc-subtitle{margin:0 0 8px}
.icPanelGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:12px}
.icOverviewGrid{display:grid;grid-template-columns:minmax(320px,.9fr) minmax(420px,1.1fr);align-items:stretch;gap:14px}
.icOverviewColumn{display:flex;flex-direction:column;align-items:stretch;gap:14px;height:100%}
.icOverviewColumn > :last-child{flex:1}
.icSummaryPanel .hkc-subtitle,.icReadinessSummary .hkc-subtitle,.icRequisitesPanel .hkc-subtitle{margin-bottom:8px}
.icSummaryLine{font-size:13px;margin-top:2px}
.icSummaryDisclosure{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;flex-wrap:wrap}
.icReadyRow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.icReadinessAlert .icAlerts{margin-top:8px}
.icDisclosurePanel{border-color:rgba(79,140,255,.32)}
@media (max-width:1120px){
  .icOverviewGrid{grid-template-columns:1fr}
}
.icReady{padding:8px 12px;border:1px solid var(--line);border-left:3px solid var(--ok);border-radius:var(--radius2,10px);color:var(--muted);background:rgba(38,208,124,.06);font-size:12.5px}
.icAlerts .note{margin-bottom:6px}
.icAlerts .note:last-child{margin-bottom:0}
.icTotal{margin-top:8px;font-weight:650;font-size:13px}
.recalcStatus{margin-left:auto;color:var(--muted);font-weight:600;animation:none}
.num,
td.num,
th.num{text-align:center;vertical-align:middle;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--text)}
.icCalculationTable td.num,.icCalculationTable th.num{font-family:inherit;font-size:13px}
.icCalculationTable td,.icCalculationTable th,
.hk-items-table td,.hk-items-table th{vertical-align:middle}
/* Вертикальные разделители между колонками (горизонтальные — общие tbody td/thead th). */
.hk-items-table thead th,
.hk-items-table tbody td{border-right:1px solid var(--line)}
.hk-items-table thead th:last-child,
.hk-items-table tbody td:last-child{border-right:0}
/* Реестр индивидуальных карт — без вертикальных разделителей. */
.hk-items-table.hk-items-table--no-col-borders thead th,
.hk-items-table.hk-items-table--no-col-borders tbody td{border-right:0}
.icCalcRow{cursor:pointer}
.icCalcRow:hover{background:rgba(79,140,255,.06)}
.icCalcChevron{display:inline-block;width:14px;color:var(--muted);transition:transform .15s ease}
.icCalcChevron.open{transform:rotate(90deg)}
.icCoefficientGroups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:10px}
.icCoefficientReset{margin-left:auto}
.icCalculationTable{width:100%;table-layout:fixed}
.icCalculationTable th,
.icCalculationTable td{overflow:hidden;text-overflow:ellipsis}
.icCalculationTable th{white-space:normal}
.icCalculationTable td.hkc-wrap{white-space:normal;text-overflow:clip;overflow:visible}
@media (max-width:1120px){
  .icCoefficientGroups{grid-template-columns:1fr}
}
@media (max-width:1120px){
  .icPanelGrid{grid-template-columns:1fr}
}
@media (max-width:560px){
  .icSectionPanel{padding:10px}
}
.user .meta{line-height:1.2}.user .name{font-size:13px;font-weight:650}.user .role{font-size:12px;color:var(--muted)}
.sidebar{
  grid-area:sidebar;padding:14px 12px;border-right:1px solid var(--line);
  background:linear-gradient(180deg, rgba(15,27,51,.92) 0%, rgba(12,23,48,.85) 100%);
  display:flex;flex-direction:column;gap:12px;
}
[data-theme="light"] .sidebar{
  background:linear-gradient(180deg, rgba(248,250,255,.98) 0%, rgba(238,244,252,.94) 100%);
  box-shadow:inset -1px 0 0 rgba(117,143,183,.14);
}
.sideHeader{display:flex;align-items:center;justify-content:space-between;padding:4px 6px 10px;border-bottom:1px dashed rgba(32,50,86,.75)}
[data-theme="light"] .sideHeader{border-bottom:1px dashed rgba(104,129,170,.22)}
.sideHeader .title{font-size:12px;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}
.navSearchLink{
  display:inline-flex;align-items:center;min-height:30px;padding:0 8px;flex:none;
  border:1px solid var(--line);border-radius:var(--radius2,10px);color:var(--muted);
  background:transparent;font-size:11px;font-weight:650;line-height:1;
  text-decoration:none;transition:.15s ease;white-space:nowrap;
}
.navSearchLink:hover{color:var(--accent);border-color:var(--accent);transform:translateY(-1px)}
.navSearchLink:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(79,140,255,.12)}
.searchTopSubmit{width:57px;height:38px;flex:none;display:grid;place-items:center;color:var(--muted);transition:.15s ease}
.searchTopSubmit:hover{color:var(--accent);border-color:var(--accent);transform:translateY(-1px)}
.searchTopSubmit:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(79,140,255,.12)}
.searchRow{display:flex;gap:10px;align-items:flex-start}
.searchRow .searchTextInput{flex:1;min-width:0}
.searchFilterToggle{position:relative;width:40px;height:40px;flex:none;display:grid;place-items:center;color:var(--muted);transition:.15s ease}
.searchFilterToggle:hover{color:var(--accent);border-color:var(--accent);transform:translateY(-1px)}
.searchFilterToggle:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(79,140,255,.12)}
.searchFilterBadge{position:absolute;top:-7px;right:-7px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:var(--accent);color:#fff;font-size:11px;font-weight:600;display:grid;place-items:center;line-height:1}
.searchFilterDrawer{margin-top:14px;padding:14px;border:1px solid var(--line);border-radius:var(--radius2);background:var(--panel2)}
.searchFilterGrid{display:grid;grid-template-columns:minmax(210px,1fr) minmax(230px,1.15fr) minmax(170px,.7fr);gap:14px}
.searchDateGrid{display:grid;grid-template-columns:minmax(180px,1fr) minmax(180px,1fr) minmax(210px,1fr);gap:14px;margin-top:14px}
.searchResetActions{display:flex;justify-content:flex-end;margin-top:14px}
.searchRelatedScope{max-width:420px}
.searchHint{margin-top:10px}
.searchRange{text-align:right;margin-top:8px}
@media (max-width:1120px){
  .searchFilterGrid,
  .searchDateGrid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:560px){
  .searchFilterGrid,
  .searchDateGrid{grid-template-columns:1fr;}
}
.nav{display:flex;flex-direction:column;gap:4px;padding:6px 4px}
.nav a,.nav a:visited{
  position:relative;min-height:34px;
  text-decoration:none;color:var(--text);display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:7px 10px 7px 12px;border-radius:var(--radius2,10px);border:1px solid transparent;
  background:transparent;font-size:13px;font-weight:600;line-height:1.25;
  transition:.15s ease;cursor:pointer;
}
.nav a:hover{
  color:var(--text);border-color:rgba(79,140,255,.24);background:rgba(79,140,255,.08);
  transform:translateY(-1px);
}
.nav a.active{
  border-color:rgba(79,140,255,.32);background:rgba(79,140,255,.18);font-weight:700;
}
.nav a.active::before{
  position:absolute;left:-1px;top:7px;bottom:7px;width:3px;border-radius:0 3px 3px 0;
  background:var(--accent);content:"";
}
.nav a:focus-visible{
  outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(79,140,255,.12);
}
.navDivider{height:1px;margin:7px 2px;background:var(--line)}
.navBadge{flex:none;min-width:20px;justify-content:center;color:var(--muted)}
.nav a.active .navBadge{
  border-color:rgba(79,140,255,.42);color:var(--text);background:rgba(79,140,255,.14);
}
[data-theme="light"] .nav a:hover{border-color:rgba(79,140,255,.22);background:rgba(79,140,255,.06)}
[data-theme="light"] .nav a.active{
  background:linear-gradient(180deg, rgba(79,140,255,.17) 0%, rgba(79,140,255,.10) 100%);
  border-color:rgba(79,140,255,.26);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4);
}
.badge{font-size:11px;padding:2px 8px;border-radius:999px;border:1px solid var(--line);background:rgba(11,18,32,.55);color:var(--muted);display:inline-flex;align-items:center;white-space:nowrap}
[data-theme="light"] .badge{background:rgba(255,255,255,.70);border-color:rgba(111,138,178,.20);color:#5b6d89}
.sideCard{margin-top:auto;padding:12px;border:1px solid var(--line);background:rgba(12,23,48,.55);border-radius:var(--radius);box-shadow:var(--shadow)}
[data-theme="light"] .sideCard{
  background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(248,251,255,.90) 100%);
  border-color:rgba(111,138,178,.24);box-shadow:0 10px 26px rgba(34,61,109,.06),inset 0 1px 0 rgba(255,255,255,.78);
}
.sideCard h3{margin:0 0 8px;font-size:13px}
.sideCard p{margin:0 0 10px;color:var(--muted);font-size:12px;line-height:1.45}
.sideCard .mini{display:flex;gap:8px;flex-wrap:wrap}
.pill{font-family:var(--mono);font-size:11px;color:var(--muted);border:1px solid var(--line);padding:4px 8px;border-radius:999px;background:rgba(11,18,32,.55)}
[data-theme="light"] .pill{background:rgba(255,255,255,.72);border-color:rgba(111,138,178,.20)}
.pillOn{font-family:var(--mono);font-size:11px;padding:4px 8px;border-radius:999px;cursor:pointer;color:#fff;border:1px solid rgba(79,140,255,.65);background:rgba(79,140,255,.25)}
[data-theme="light"] .pillOn{color:#0b2a56;border-color:rgba(47,116,238,.6);background:rgba(47,116,238,.14)}
.chips .pill{cursor:pointer;transition:.18s ease}
.chips .pill:hover{border-color:rgba(79,140,255,.5)}
/* min-width:0 — колонка сетки сжимается до свободного места: иначе широкая
   таблица распирает сетку, колонка «№» уходит за пределы окна и добраться
   до неё нельзя. Прокрутка остаётся внутри основной области. */
.main{grid-area:main;padding:16px;overflow:auto;min-width:0}
.stack{display:flex;flex-direction:column;gap:14px}
.panel{border:1px solid var(--line);background:rgba(15,27,51,.55);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
[data-theme="light"] .panel{
  background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(248,251,255,.90) 100%);
  border-color:rgba(111,138,178,.24);box-shadow:0 10px 26px rgba(34,61,109,.06),inset 0 1px 0 rgba(255,255,255,.78);
}
.panelHeader{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid rgba(32,50,86,.75);background:rgba(12,23,48,.35)}
[data-theme="light"] .panelHeader{
  background:linear-gradient(180deg, rgba(79,140,255,.10) 0%, rgba(79,140,255,.05) 100%);
  border-bottom-color:rgba(111,138,178,.18);
}
.panelHeader h2{margin:0;font-size:14px;font-weight:700}
.panelHeader .hint{font-size:12px;color:var(--muted);font-family:var(--mono)}
.panelBody{padding:14px}
.hero{display:grid;grid-template-columns:1.2fr .8fr;gap:14px;align-items:stretch}
@media (max-width:1120px){.hero{grid-template-columns:1fr}}
.heroBox,.heroStat{padding:12px;border-radius:var(--radius2);border:1px solid rgba(32,50,86,.75);background:rgba(12,23,48,.55)}
[data-theme="light"] .heroBox,[data-theme="light"] .heroStat{
  background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(248,251,255,.90) 100%);
  border-color:rgba(111,138,178,.24);box-shadow:0 10px 26px rgba(34,61,109,.06),inset 0 1px 0 rgba(255,255,255,.78);
}
.heroBox .eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-family:var(--mono);color:var(--muted);border:1px solid var(--line);padding:4px 8px;border-radius:999px;background:rgba(11,18,32,.55)}
[data-theme="light"] .heroBox .eyebrow{background:rgba(255,255,255,.80)}
.heroBox h3{margin:10px 0 8px;font-size:24px;line-height:1.1;letter-spacing:.1px}
.heroBox p{margin:0;color:var(--muted);font-size:13px;line-height:1.5;max-width:62ch}
.heroGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.heroStat .label{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:8px}
.heroStat .value{font-size:20px;font-weight:800;margin-top:6px;letter-spacing:.2px}
.heroStat .trend{margin-top:8px;font-size:12px;color:var(--muted)}
.grid{display:grid;grid-template-columns:1.35fr .65fr;gap:14px;align-items:start}
@media (max-width:1120px){.grid{grid-template-columns:1fr}}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));gap:10px}
@media (max-width:1120px){.kpis{grid-template-columns:1fr}}
.kpi{padding:12px;border-radius:var(--radius2);border:1px solid rgba(32,50,86,.75);background:rgba(12,23,48,.55)}
[data-theme="light"] .kpi{
  background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(248,251,255,.90) 100%);
  border-color:rgba(111,138,178,.24);box-shadow:0 10px 26px rgba(34,61,109,.06),inset 0 1px 0 rgba(255,255,255,.78);
}
.kpi .label{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:8px}
.kpi .value{font-size:20px;font-weight:800;margin-top:6px;letter-spacing:.2px}.kpi .trend{margin-top:8px;font-size:12px;color:var(--muted)}
.tag,.status{font-size:11px;padding:2px 8px;border-radius:999px;border:1px solid rgba(32,50,86,.85);background:rgba(11,18,32,.55);color:var(--muted);display:inline-flex;align-items:center;white-space:nowrap}
[data-theme="light"] .tag,[data-theme="light"] .status{background:rgba(255,255,255,.70);border-color:rgba(111,138,178,.20);color:#5b6d89}
.tag.ok,.status.ok{border-color:rgba(38,208,124,.35);color:rgba(38,208,124,.95)}
[data-theme="light"] .tag.ok,[data-theme="light"] .status.ok{background:rgba(31,158,98,.08);border-color:rgba(31,158,98,.20);color:#1f8f59}
.tag.warn,.status.warn{border-color:rgba(255,204,102,.35);color:rgba(255,204,102,.95)}
[data-theme="light"] .tag.warn,[data-theme="light"] .status.warn{background:rgba(200,138,18,.10);border-color:rgba(200,138,18,.22);color:#a26b0d}
.tag.bad,.status.bad{border-color:rgba(255,107,107,.35);color:rgba(255,107,107,.95)}
[data-theme="light"] .tag.bad,[data-theme="light"] .status.bad{background:rgba(214,88,88,.08);border-color:rgba(214,88,88,.20);color:#bb4f4f}
.form{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:1120px){.form{grid-template-columns:1fr}}
.field label{display:block;font-size:12px;color:var(--muted);margin:0 0 6px}
.field input,.field select,.field textarea{
  width:100%;border:1px solid rgba(32,50,86,.85);background:rgba(11,18,32,.65);color:var(--text);
  border-radius:10px;padding:10px 10px;outline:none;font-size:13px;font-family:var(--font);
}
[data-theme="light"] .field input,[data-theme="light"] .field select,[data-theme="light"] .field textarea{
  background:rgba(255,255,255,.94);border-color:rgba(111,138,178,.22);
}
.field textarea{min-height:92px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:rgba(79,140,255,.4);box-shadow:0 0 0 3px rgba(79,140,255,.12)}
[data-theme="light"] .field input:focus,[data-theme="light"] .field select:focus,[data-theme="light"] .field textarea:focus{
  background:#fff;border-color:rgba(79,140,255,.38);box-shadow:0 0 0 3px rgba(79,140,255,.10),0 8px 16px rgba(48,86,150,.05);
}
.formActions{grid-column:1/-1;display:flex;gap:10px;justify-content:flex-end;margin-top:4px}
.btn{
  border:1px solid rgba(32,50,86,.9);background:rgba(11,18,32,.55);color:var(--text);
  padding:10px 12px;border-radius:12px;cursor:pointer;font-weight:650;font-size:13px;transition:.18s ease;
  display:inline-flex;align-items:center;gap:8px;
}
[data-theme="light"] .btn{
  background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(248,251,255,.90) 100%);
  border-color:rgba(111,138,178,.22);box-shadow:0 8px 18px rgba(36,64,111,.05),inset 0 1px 0 rgba(255,255,255,.8);
}
.btn.primary{background:rgba(79,140,255,.22);border-color:rgba(79,140,255,.4)}
[data-theme="light"] .btn.primary{
  background:linear-gradient(180deg, rgba(79,140,255,.18) 0%, rgba(79,140,255,.12) 100%);
  border-color:rgba(79,140,255,.26);
}
.btn.ghost{background:transparent}[data-theme="light"] .btn.ghost{background:transparent;box-shadow:none}
.btn.bad{color:var(--bad);background:color-mix(in srgb, var(--bad) 10%, transparent);border-color:color-mix(in srgb, var(--bad) 30%, var(--line))}
[data-theme="light"] .btn.bad{background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(255,245,245,.92) 100%);border-color:color-mix(in srgb, var(--bad) 25%, rgba(111,138,178,.22))}
.btn.bad:hover{background:color-mix(in srgb, var(--bad) 18%, transparent)}
[data-theme="light"] .btn.bad:hover{background:linear-gradient(180deg, rgba(255,235,235,.98) 0%, rgba(255,225,225,.94) 100%)}
.btn.bad:disabled{opacity:.55;cursor:not-allowed}
.note.bad{border-color:color-mix(in srgb, var(--bad) 30%, var(--line));background:color-mix(in srgb, var(--bad) 10%, transparent);color:var(--bad)}
[data-theme="light"] .note.bad{background:linear-gradient(180deg, rgba(255,245,245,.96) 0%, rgba(255,235,235,.90) 100%);color:#bb4f4f}
[data-theme="light"] .btnRow{}
.btnRow{display:flex;gap:10px;flex-wrap:wrap}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border-radius:12px;border:1px solid rgba(32,50,86,.75);background:rgba(11,18,32,.35)}
[data-theme="light"] table{background:rgba(255,255,255,.92)}
/* Выравнивание в таблице общего назначения.
   Заголовок и данные одной колонки стоят по центру, содержимое ячейки — по
   середине высоты строки. Раньше здесь было text-align:left у заголовка и
   vertical-align:top у данных, из-за чего в одной строке текст, тег статуса и
   кнопка оказывались на разной высоте, а данные не совпадали со своим
   заголовком. Тот же контракт уже описан в .gsmTable и .relTable — здесь он
   применяется к остальным таблицам без собственных правил. */
thead th{
  text-align:center;
  vertical-align:middle;
  font-size:12px;
  color:var(--muted);
  padding:10px 12px;
  border-bottom:1px solid rgba(32,50,86,.75);
  background:rgba(12,23,48,.35);
  white-space:nowrap;
  font-weight:650;
}
[data-theme="light"] thead th{
  background:linear-gradient(180deg, rgba(79,140,255,.10) 0%, rgba(79,140,255,.05) 100%);
  border-bottom-color:rgba(111,138,178,.18);
}
/* Фиксированной высоты нет: длинный текст переносится, и строка растёт целиком.
   overflow-wrap нужен, чтобы длинное слово переносилось по границам ячейки, а не
   выпирало за неё и не обрезалось. */
tbody tr{height:44px}
tbody td{
  padding:10px 12px;
  border-bottom:1px solid rgba(32,50,86,.45);
  font-size:13px;
  vertical-align:middle;
  text-align:center;
  overflow-wrap:anywhere;
}
[data-theme="light"] tbody td{border-bottom-color:rgba(111,138,178,.16)}
tbody tr:hover td{background:rgba(79,140,255,.06)}
[data-theme="light"] tbody tr:hover td{background:rgba(79,140,255,.055)}
.clickableRow{cursor:pointer}
.clickableRow:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--accent)}
[data-theme="light"] .clickableRow:focus-visible{box-shadow:inset 0 0 0 2px rgba(79,140,255,.75)}
.mono{font-family:var(--mono);color:var(--muted);font-size:12px}
[data-theme="light"] .mono{color:#70829e}
/* Печатная форма ХК — документ, а не реестр. Её таблицы раскладывают
   «подпись: значение» и списки номенклатуры, поэтому центрирование им не
   подходит: подпись в колонке 180px уехала бы в середину и бланк стал бы
   нечитаемым. Правило возвращает документную типографику и отключает также
   минимальную высоту строки — в бланке высота задаётся содержимым. */
table.printFormTable th,
table.printFormTable td {
  text-align: left;
  vertical-align: top;
}
table.printFormTable tbody tr {
  height: auto;
}

   /* Кнопки в ячейке действий. justify-content центрует группу под центрированным
   заголовком своей колонки: блок растягивается на всю ширину ячейки, поэтому
   без этого кнопки прижимались к левому краю и уезжали от своего заголовка.
   align-items центрует их по вертикали при разной высоте соседних ячеек. */
.rowActions{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;align-items:center}
/* Кнопки действий в строке таблицы. Раньше промежуток между ними задавался
   пробелом в разметке, потому что у .linkBtn не было отступа вовсе: кнопки
   вставали вровень, но неравномерно, и при переносе строки разъезжались.
   Теперь промежуток один на всю таблицу — gap выше, — и задаётся он сеткой,
   а не пробелами.

   Стиль и цвет тоже единые. Отдельный цвет на каждую кнопку задавался
   inline-стилем, причём для «Удалить» использовалась переменная --error,
   которой в палитре нет: кнопка молча оставалась обычного цвета. */
.rowActions .linkBtn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:6px 10px;border:1px solid var(--line);border-radius:10px;
  background:var(--panel2);color:var(--text);
  font-size:12px;font-weight:500;line-height:1.2;white-space:nowrap;
  cursor:pointer;transition:background .18s ease,border-color .18s ease,color .18s ease;
}
.rowActions .linkBtn:hover{
  background:color-mix(in srgb,var(--accent) 12%,var(--panel2));
  border-color:color-mix(in srgb,var(--accent) 45%,var(--line));
  color:var(--text);
}
.rowActions .linkBtn:focus-visible{
  outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(79,140,255,.14);
}
.rowActions .linkBtn:active{background:color-mix(in srgb,var(--accent) 18%,var(--panel2))}
.tableWrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
@media (max-width:900px){.tableWrap table{min-width:760px}}
.linkBtn{
  border:1px solid rgba(32,50,86,.85);background:rgba(11,18,32,.55);color:var(--text);
  padding:6px 10px;border-radius:10px;cursor:pointer;font-size:12px;transition:.18s ease;
  text-decoration:none;
}
a.linkBtn{text-decoration:none}
.btn{text-decoration:none}
a.btn{text-decoration:none}
[data-theme="light"] .linkBtn{background:rgba(255,255,255,.82)}
.note{padding:10px 12px;border-radius:12px;border:1px solid rgba(32,50,86,.75);background:rgba(12,23,48,.45);color:var(--muted);font-size:12px;line-height:1.45}
[data-theme="light"] .note{
  background:linear-gradient(180deg, rgba(79,140,255,.07) 0%, rgba(79,140,255,.03) 100%);
  color:#536887;
}
.note.warn{border-color:rgba(230,157,46,.55);background:rgba(126,78,14,.18);color:#ffd9a0}
[data-theme="light"] .note.warn{border-color:rgba(214,138,20,.5);background:rgba(255,244,220,.9);color:#7a4a06}
.alerts{display:flex;flex-direction:column;gap:8px}
.alert{padding:10px 12px;border-radius:12px;border:1px solid rgba(32,50,86,.75);background:rgba(11,18,32,.45)}
[data-theme="light"] .alert{background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(245,249,255,.88) 100%)}
.alert .top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.alert .title{font-size:13px;font-weight:700;margin:0}
.alert .desc{margin:0;color:var(--muted);font-size:12px;line-height:1.45}
.footer{margin-top:14px;color:var(--muted);font-size:12px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.listRows{display:flex;flex-direction:column;gap:8px}
.rowCard{padding:10px 12px;border-radius:12px;border:1px solid rgba(32,50,86,.75);background:rgba(11,18,32,.40)}
[data-theme="light"] .rowCard{
  background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(248,251,255,.90) 100%);
  border-color:rgba(111,138,178,.24);box-shadow:0 10px 26px rgba(34,61,109,.06),inset 0 1px 0 rgba(255,255,255,.78);
}
.rowCard .top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.readinessCard{cursor:pointer}
.readinessCard:hover{background:color-mix(in srgb, var(--accent) 6%, var(--panel))}
.readinessRowsScroll{max-height:420px;overflow-y:auto}
.rowCard .name{font-size:13px;font-weight:700}
.rowCard .sub{color:var(--muted);font-size:12px;margin-top:2px}
.qty{min-width:30px;height:30px;padding:0 10px;border-radius:999px;border:1px solid rgba(32,50,86,.85);display:grid;place-items:center;background:rgba(79,140,255,.12);font-weight:700;font-size:12px}
[data-theme="light"] .qty{
  background:linear-gradient(180deg, rgba(79,140,255,.14) 0%, rgba(79,140,255,.08) 100%);
  border-color:rgba(79,140,255,.22);color:#2957a8;
}
.metrics2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:1120px){.metrics2{grid-template-columns:1fr}}
.metric{padding:10px 12px;border-radius:12px;border:1px solid rgba(32,50,86,.75);background:rgba(11,18,32,.45)}
[data-theme="light"] .metric{
  background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(248,251,255,.90) 100%);
  border-color:rgba(111,138,178,.24);box-shadow:0 10px 26px rgba(34,61,109,.06),inset 0 1px 0 rgba(255,255,255,.78);
}
.metric .label{font-size:12px;color:var(--muted)}
.metric .value{font-size:18px;font-weight:800;margin-top:6px}
.coefGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:1120px){.coefGrid{grid-template-columns:1fr}}
.coef{padding:10px 12px;border-radius:12px;border:1px solid rgba(32,50,86,.75);background:rgba(11,18,32,.45)}
[data-theme="light"] .coef{
  background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(248,251,255,.90) 100%);
  border-color:rgba(111,138,178,.24);box-shadow:0 10px 26px rgba(34,61,109,.06),inset 0 1px 0 rgba(255,255,255,.78);
}
.coefTop{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:8px}
.coef h4{margin:0;font-size:13px}.coef p{margin:2px 0 0;color:var(--muted);font-size:12px}
.toggle{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.toggle input{accent-color:var(--accent)}
.formula{padding:12px;border-radius:12px;border:1px solid rgba(32,50,86,.75);background:rgba(12,23,48,.45)}
[data-theme="light"] .formula{
  background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(248,251,255,.90) 100%);
  border-color:rgba(111,138,178,.24);box-shadow:0 10px 26px rgba(34,61,109,.06),inset 0 1px 0 rgba(255,255,255,.78);
}
.formula .big{font-size:24px;font-weight:800;letter-spacing:.2px;margin-top:8px}
.panelPage{display:none;animation:fade .22s ease}
.panelPage.active{display:block}
@keyframes fade{from{opacity:.45;transform:translateY(4px)}to{opacity:1;transform:none}}
.page-header{margin-bottom:6px;font-size:14px;font-weight:650;color:var(--muted)}
.full-width{grid-column:1/-1}
.empty-state{padding:20px;text-align:center;color:var(--muted);font-size:13px}
.loading-state{padding:20px;text-align:center;color:var(--muted)}
.error{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px;padding:10px 12px;border-radius:12px;border:1px solid rgba(230,157,46,.55);background:rgba(126,78,14,.18);color:#ffd9a0;font-size:12px;line-height:1.45}
[data-theme="light"] .error{border-color:rgba(214,138,20,.5);background:rgba(255,244,220,.9);color:#7a4a06}
.field-select,.field-input{width:100%;border:1px solid rgba(32,50,86,.85);background:rgba(11,18,32,.65);color:var(--text);border-radius:10px;padding:10px 10px;outline:none;font-size:13px;font-family:var(--font)}
[data-theme="light"] .field-select,[data-theme="light"] .field-input{background:rgba(255,255,255,.94);border-color:rgba(111,138,178,.22)}
.field-select:focus,.field-input:focus{border-color:rgba(79,140,255,.4);box-shadow:0 0 0 3px rgba(79,140,255,.12)}
[data-theme="light"] .field-select:focus,[data-theme="light"] .field-input:focus{background:#fff;border-color:rgba(79,140,255,.38);box-shadow:0 0 0 3px rgba(79,140,255,.10),0 8px 16px rgba(48,86,150,.05)}
.fieldInput{width:100%;border:1px solid rgba(32,50,86,.85);background:rgba(11,18,32,.65);color:var(--text);border-radius:10px;padding:10px 10px;outline:none;font-size:13px;font-family:var(--font)}
[data-theme="light"] .fieldInput{background:rgba(255,255,255,.94);border-color:rgba(111,138,178,.22)}
.fieldInput:focus{border-color:rgba(79,140,255,.4);box-shadow:0 0 0 3px rgba(79,140,255,.12)}
[data-theme="light"] .fieldInput:focus{background:#fff;border-color:rgba(79,140,255,.38);box-shadow:0 0 0 3px rgba(79,140,255,.10),0 8px 16px rgba(48,86,150,.05)}
@media (max-width:1120px){
  .app{grid-template-columns:1fr;grid-template-areas:"topbar" "main"}
  .sidebar{display:none}
  .brand{min-width:auto}.user{min-width:auto}.searchTop{width:min(520px,52vw)}
  body{overflow:auto}.main{overflow:visible}
}
@media (max-width:560px){
  .kpis,.heroGrid,.metrics2,.coefGrid,.form{grid-template-columns:1fr}
  .searchTop,.env{display:none}
  .topbar{padding:10px 12px}.main{padding:12px}
  .actions{gap:8px}.user{padding:6px 8px}
}
.searchResultList{display:flex;flex-direction:column;gap:8px}
.searchResultCard{
  display:block;padding:12px 14px;border-radius:12px;border:1px solid rgba(32,50,86,.75);
  background:rgba(11,18,32,.40);text-decoration:none;color:var(--text);cursor:pointer;transition:.12s ease;
}
.searchResultCard:hover{border-color:rgba(79,140,255,.25);background:rgba(79,140,255,.06)}
[data-theme="light"] .searchResultCard{
  background:linear-gradient(180deg,rgba(255,255,255,.96) 0%,rgba(248,251,255,.90) 100%);
  border-color:rgba(111,138,178,.24);
}
[data-theme="light"] .searchResultCard:hover{background:rgba(79,140,255,.055);border-color:rgba(79,140,255,.22)}
.searchResultTop{display:flex;align-items:center;gap:8px;margin-bottom:4px;flex-wrap:wrap}
.searchResultCtx{font-size:11px;color:var(--muted);font-style:italic}
.searchResultTitle{font-size:14px;font-weight:650}
.searchResultSub{font-size:12px;color:var(--muted);margin-top:2px}
.searchResultMeta{margin-top:6px;font-size:12px}
.modalOverlay{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:1000;backdrop-filter:blur(4px)}
[data-theme="light"] .modalOverlay{background:rgba(0,0,0,.35)}
.modal{background:var(--panel);border:1px solid var(--line);border-radius:16px;width:100%;max-width:480px;max-height:85vh;overflow-y:auto;box-shadow:0 24px 64px rgba(0,0,0,.3);position:relative;z-index:0}
.modalHeader{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--line)}
.modalHeader h3{margin:0;font-size:16px}
.modalBody{padding:20px}
.modalFooter{display:flex;justify-content:flex-end;gap:8px;padding:12px 20px;border-top:1px solid var(--line)}
.loginContainer{display:flex;align-items:center;justify-content:center;min-height:100vh;background:var(--bg)}
.loginCard{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:40px;width:100%;max-width:400px}
.loginHeader{text-align:center;margin-bottom:32px}
.loginHeader h1{font-size:24px;margin:0 0 8px;color:var(--text)}
.loginHeader p{margin:0;color:var(--muted);font-size:14px}
.loginField{margin-bottom:16px}
.loginField label{display:block;margin-bottom:6px;font-size:13px;color:var(--muted)}
.loginInput{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--panel2);color:var(--text);font-size:14px;outline:none;box-sizing:border-box}
.loginInput:focus{border-color:var(--accent)}
.loginBtn{width:100%;padding:12px;background:var(--accent);color:white;border:none;border-radius:8px;font-size:15px;cursor:pointer;margin-top:8px}
.loginBtn:hover{filter:brightness(0.9)}
.loginBtn:disabled{opacity:.6;cursor:not-allowed}
.loginError{background:rgba(255,71,87,.1);border:1px solid rgba(255,71,87,.3);color:#ff4757;padding:10px 12px;border-radius:8px;margin-bottom:16px;font-size:13px}
[data-theme="light"] .loginError{background:rgba(214,88,88,.08);border-color:rgba(214,88,88,.20);color:#bb4f4f}
.text-danger{color:var(--bad)}
.loginHint{margin-top:24px;padding-top:16px;border-top:1px dashed var(--line);font-size:12px;color:var(--muted)}
.loginHint p{margin:4px 0}

/* ═══════════════════════════════════════
   HK Items Table — input styles (GLOBAL)
   ═══════════════════════════════════════ */

.hki-td-input {
  width: 100%;
  min-width: 60px;
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel2) !important;
  color: var(--text) !important;
  font-size: 12px;
  font-family: var(--font);
  box-sizing: border-box;
  -webkit-appearance: none;
  appearance: none;
  transition: border-color 0.15s ease;
}

.hki-td-input:focus {
  border-color: var(--accent);
  background: var(--panel) !important;
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent);
}

.hki-td-input::placeholder {
  color: var(--muted);
  opacity: 1;
}

.hki-td-input:disabled {
  background: var(--panel2) !important;
  color: var(--muted) !important;
  cursor: not-allowed;
}

/* Поле поиска сборочной единицы */
.hki-search-select input {
  width: 100%;
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel2) !important;
  color: var(--text) !important;
  font-size: 12px;
  font-family: var(--font);
  box-sizing: border-box;
  -webkit-appearance: none;
  appearance: none;
}

.hki-search-select input:focus {
  border-color: var(--accent);
  background: var(--panel) !important;
  outline: none;
}

.hki-search-select input::placeholder {
  color: var(--muted);
  opacity: 1;
}

/* Autofill — перекрыть браузерный жёлтый/белый */
.hki-td-input:-webkit-autofill,
.hki-td-input:-webkit-autofill:focus,
.hki-search-select input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px var(--panel2) inset !important;
  -webkit-text-fill-color: var(--text) !important;
  caret-color: var(--text);
}

/* Сброс автозаполнения браузера для тёмной темы */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px var(--panel2) inset !important;
    -webkit-text-fill-color: var(--text) !important;
    caret-color: var(--text);
    border-color: var(--line) !important;
    transition: background-color 5000s ease-in-out 0s;
}

/* ═══════════════════════════════════════
   Dark theme overrides — HK table inputs
   ═══════════════════════════════════════ */
[data-theme="dark"] .hki-td-input,
[data-theme="dark"] .hki-search-select input {
  background: var(--panel2) !important;
  color: var(--text) !important;
  border-color: var(--line) !important;
}

[data-theme="dark"] .hki-td-input:focus,
[data-theme="dark"] .hki-search-select input:focus {
  background: var(--panel) !important;
  border-color: var(--accent) !important;
}

[data-theme="dark"] .hki-td-input::placeholder,
[data-theme="dark"] .hki-search-select input::placeholder {
  color: var(--muted) !important;
  opacity: 1;
}

[data-theme="dark"] .hki-td-input:-webkit-autofill,
[data-theme="dark"] .hki-search-select input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px var(--panel2) inset !important;
  -webkit-text-fill-color: var(--text) !important;
}

/* ═══════════════════════════════════════
   Permissions Modal
   ═══════════════════════════════════════ */

.permissionsModal {
    width: min(1440px, calc(100vw - 32px));
    max-width: none;
    height: min(920px, calc(100dvh - 24px));
    max-height: none;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.permissionsHeader {
    flex: 0 0 auto;
    min-height: 60px;
    padding: 14px 18px 14px 20px;
}

.permissionsBody {
    min-height: 0;
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
    overflow: hidden;
    padding: 16px 20px 20px;
}

/* Фильтры — одна строка. Поиск получает заметно большую долю, чем каждый из
   двух одинаковых селекторов, иначе по названию полномочия искать негде.
   На узком экране строка переносится в две, а потом в одну: см. медиазапросы
   ниже. Перенос сделан сеткой, поэтому поля не могут наложиться друг на друга. */
.permissionsToolbar {
    display: grid;
    grid-template-columns: minmax(240px, 1.4fr) minmax(170px, 1fr) minmax(160px, 1fr);
    gap: 12px;
    align-items: end;
}

.permissionsToolbar .field {
    min-width: 0;
}

.permCounters,
.permissionsSystemNote,
.permissionsError {
    flex: 0 0 auto;
}

.permissionsTableWrap {
    min-width: 0;
    min-height: 0;
    flex: 1 1 0;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable both-edges;
    -webkit-overflow-scrolling: touch;
    border: 1px solid var(--line);
    border-radius: var(--radius2);
    background: var(--panel);
}

.permissionsTable {
    width: 100%;
    min-width: 1120px;
    margin: 0;
    border: 0;
    border-radius: 0;
}

.permissionsTable thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--panel2);
    box-shadow: 0 1px 0 var(--line);
}

.modalCloseButton {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    display: inline-grid;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--bad) 45%, var(--line));
    border-radius: 50%;
    color: var(--bad);
    background: color-mix(in srgb, var(--bad) 8%, var(--panel));
    font-size: 24px;
    font-weight: 500;
    line-height: 1;
    cursor: pointer;
    transition: transform .15s ease, background .15s ease, border-color .15s ease;
}

.modalCloseButton:hover {
    transform: translateY(-1px);
    background: color-mix(in srgb, var(--bad) 17%, var(--panel));
    border-color: var(--bad);
}

.modalCloseButton:focus-visible {
    outline: none;
    border-color: var(--bad);
    box-shadow: 0 0 0 3px rgba(220, 70, 80, .18);
}

.modalCloseButton:active {
    transform: translateY(0);
}

.permissionCell {
    min-width: 340px;
}

.permissionName {
    font-size: 13px;
    font-weight: 700;
    color: var(--text);
    line-height: 1.35;
}

.permissionDescription {
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.4;
    color: var(--muted);
}

.permissionCode {
    display: inline-block;
    margin-top: 7px;
    padding: 2px 6px;
    border: 1px solid var(--line);
    border-radius: 5px;
    color: var(--muted);
    background: var(--panel2);
    font-family: var(--mono);
    font-size: 11px;
}

/* Раньше здесь стояло `vertical-align: top` на tbody tr. На строке таблицы это
   свойство не действует: vertical-align применяется к ячейкам и строчным
   элементам, а не к боксу <tr>. Правило было пустым и при этом читалось как
   «выравнивать по верху», то есть противоречило контракту таблиц. Удалено:
   общее правило ячеек уже даёт vertical-align: middle. */

/* Строки полномочий плотнее прочих таблиц: в форме их больше шестидесяти, и
   каждый сэкономленный по вертикали пиксель — это строка, поместившаяся на
   экране без прокрутки. */
.permissionsTable tbody td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
}

.permissionsTable tbody tr:hover {
    background: color-mix(in srgb, var(--accent) 6%, transparent);
}

.permissionStatus {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 26px;
    padding: 4px 9px;
    border: 1px solid var(--line);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 650;
    white-space: nowrap;
}

.permissionStatus--granted {
    color: var(--ok);
    background: color-mix(in srgb, var(--ok) 12%, transparent);
    border-color: color-mix(in srgb, var(--ok) 35%, var(--line));
}

.permissionStatus--denied {
    color: var(--bad);
    background: color-mix(in srgb, var(--bad) 10%, transparent);
    border-color: color-mix(in srgb, var(--bad) 30%, var(--line));
}

.permissionStatus--neutral {
    color: var(--muted);
    background: var(--panel2);
}

.permissionStatus--warning {
    color: var(--warn);
    background: color-mix(in srgb, var(--warn) 11%, transparent);
    border-color: color-mix(in srgb, var(--warn) 35%, var(--line));
}

.permSecondaryHint {
    margin-top: 4px;
    font-size: 11px;
    color: var(--muted);
    font-style: italic;
}

/* Причина не обрезается: она показывает, что именно записал администратор, и
   обрезка до двух строк скрывала половину записи. Строка растёт целиком. */
.permReason {
    margin-top: 6px;
    font-size: 11px;
    color: var(--muted);
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.permActions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
}

/* Текст кнопок-действий не переносится: при сжатой ячейке слово
   «Разрешить» разрывалось на «Разреши» и «ть». Ширина кнопки задаётся
   содержимым, а ячейка не сжимает столбец ниже этого предела. */
.permActions .linkBtn {
    white-space: nowrap;
}

.permActionsCell {
    white-space: nowrap;
    width: 1%;
}

.permActionDeny {
    color: var(--warn) !important;
}

.permissionsState {
    display: grid;
    min-height: 180px;
    place-items: center;
    color: var(--muted);
}

.permissionsTableWrap:focus-visible {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(79, 140, 255, .12);
}

.permissionsTableWrap::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

.permissionsTableWrap::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--muted) 60%, transparent);
    border: 3px solid var(--panel);
    border-radius: 999px;
}

.permissionsTableWrap::-webkit-scrollbar-thumb:hover {
    background: var(--muted);
}

@media (max-width: 1120px) {

/* Фильтры в две строки: поиск во всю ширину, два селектора под ним.
   Сетка гарантирует, что поля не наложатся друг на друга при любой ширине. */
@media (max-width: 980px) {
    .permissionsToolbar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .permissionsToolbar > .field:first-child {
        grid-column: 1 / -1;
    }
}
    .permissionsModal {
        width: calc(100vw - 24px);
        height: calc(100dvh - 24px);
    }
}

@media (max-width: 560px) {
    .permissionsModal {
        width: 100vw;
        height: 100dvh;
        border-radius: 0;
    }

    .permissionsBody {
        padding: 12px 14px 14px;
        gap: 10px;
    }

    /* Одна колонка: поля не накладываются, выстраиваются сверху вниз. */
    .permissionsToolbar {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .permissionsTable {
        min-width: 980px;
    }
}

/* ═══════════════════════════════════════
   Audit Log
   ═══════════════════════════════════════ */

.auditObjectName {
    font-weight: 650;
    color: var(--text);
}

.auditLegacyHint,
.auditActorLogin {
    margin-top: 3px;
    color: var(--muted);
    font-size: 12px;
}

.auditActorName {
    font-weight: 600;
    color: var(--text);
}

.auditAction {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 4px 9px;
    border: 1px solid var(--line);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 650;
    white-space: nowrap;
}

.auditAction--success {
    color: var(--ok);
    background: color-mix(in srgb, var(--ok) 12%, transparent);
    border-color: color-mix(in srgb, var(--ok) 35%, var(--line));
}

.auditAction--warning {
    color: var(--warn);
    background: color-mix(in srgb, var(--warn) 12%, transparent);
    border-color: color-mix(in srgb, var(--warn) 35%, var(--line));
}

.auditAction--danger {
    color: var(--bad);
    background: color-mix(in srgb, var(--bad) 10%, transparent);
    border-color: color-mix(in srgb, var(--bad) 30%, var(--line));
}

.auditAction--neutral {
    color: var(--muted);
    background: var(--panel2);
}

/* --- Popover / searchable select (UI kit v2, раздел «Popover и dropdown») --- */
.popoverAnchor{position:relative;display:inline-block;width:100%}

.popover{
  position:absolute;
  z-index:60;
  left:0;
  width:100%;
  min-width:240px;
  max-height:min(320px, 60vh);
  overflow-y:auto;
  border:1px solid var(--line);
  border-radius:var(--radius2);
  background:var(--panel);
  box-shadow:var(--shadow);
  padding:6px;
}

.popover[data-placement="bottom"]{top:calc(100% + 6px)}
.popover[data-placement="top"]{bottom:calc(100% + 6px)}

.popoverItem{
  padding:8px 10px;
  border-radius:8px;
  cursor:pointer;
  font-size:13px;
  color:var(--text);
}
.popoverItem:hover,
.popoverItem[aria-selected="true"]{background:rgba(79,140,255,.12)}
.popoverItem:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}

.popoverFooter{
  border-top:1px solid var(--line);
  padding:8px;
  display:flex;
  justify-content:flex-end;
  gap:8px;
}

.popoverQuickCreateForm{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:8px 4px 2px;
  border-top:1px solid var(--line);
  margin-top:4px;
  width:100%;
}
.popoverQuickCreateForm .field input{font-size:13px}
.popoverQuickCreateFormActions{display:flex;justify-content:flex-end;gap:8px}

@media (max-width: 560px){
  .popover{
    position:fixed;
    left:12px;
    right:12px;
    top:auto;
    bottom:12px;
    width:auto;
    max-height:70vh;
  }
}

/* --- Bell notifications (специфика поверх .popover, UI kit v2) --- */
.bellWrap{position:relative}
.bellBadge{
  position:absolute;top:-6px;right:-6px;min-width:18px;height:18px;padding:0 5px;
  border-radius:999px;background:var(--bad, rgba(255,107,107,.9));color:#fff;
  font-size:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;
  border:2px solid var(--panel);line-height:1;
}
.bellPopover{
  display:flex;flex-direction:column;overflow:hidden;
  left:auto;right:0;width:360px;max-width:calc(100vw - 28px);
  max-height:min(430px, 60vh);padding:0;
}
.popoverHeader{
  display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
  flex:0 0 auto;padding:12px 14px;border-bottom:1px solid var(--line);
  font-weight:650;font-size:13px;
}
.bellHeaderActions{display:inline-flex;align-items:center;gap:8px;flex-shrink:0}
.popoverList{flex:1 1 auto;min-height:0;overflow-y:auto;padding:4px 0}
.bellEmpty{padding:24px 14px;text-align:center;color:var(--muted);font-size:13px}
.bellItem{
  display:block;width:100%;text-align:left;padding:10px 14px;cursor:pointer;
  background:transparent;border:0;border-bottom:1px solid rgba(32,50,86,.25);color:var(--text);
  font-family:inherit;
}
.bellItem:hover{background:rgba(79,140,255,.08)}
[data-theme="light"] .bellItem:hover{background:rgba(79,140,255,.055)}
.bellItem.unread{
  background:rgba(79,140,255,.06);
  box-shadow:inset 2px 0 0 var(--accent);
}
[data-theme="light"] .bellItem.unread{background:rgba(79,140,255,.08)}
.bellItem.unread:hover{background:rgba(79,140,255,.12)}
[data-theme="light"] .bellItem.unread:hover{background:rgba(79,140,255,.12)}
.bellItem.read .bellItemTitle{opacity:.62}
.bellItem.read .bellItemMsg,.bellItem.read .bellItemMeta{opacity:.55}
.bellItemTitle{font-size:13px;font-weight:650;line-height:1.35}
.bellItemMsg{
  font-size:12px;color:var(--muted);margin-top:3px;line-height:1.35;
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;
}
.bellItemMeta{font-size:11px;color:var(--muted);margin-top:4px}
.bellPopover .popoverFooter{justify-content:center}
.bellItem:focus-visible,.bellPopover .linkBtn:focus-visible,.bellPopover a:focus-visible{
  outline:2px solid var(--accent);outline-offset:-2px;
}

.mbError{color:var(--bad);font-size:13px;margin-top:6px}
.mbFilters{
  display:grid;grid-template-columns:minmax(200px,1fr) 220px 160px 200px auto auto;gap:10px;
  margin-bottom:14px;align-items:end;
}
@media (max-width:1120px){
  .mbFilters{grid-template-columns:1fr 1fr;align-items:end}
}
@media (max-width:560px){
  .mbFilters{grid-template-columns:1fr}
}
.mbSearch{width:100%}
.referenceTableWrap{
  width:100%;overflow-x:auto;overflow-y:visible;
  overscroll-behavior-x:contain;overscroll-behavior-y:auto;
  -webkit-overflow-scrolling:touch;
}
.referenceTableWrap table{min-width:760px}
@media (max-width:560px){
  .referenceTableWrap table{min-width:620px}
}

/* Справочники: навигатор и breadcrumb */
.refSearch{
  width:100%;max-width:420px;margin-bottom:16px;
  background:rgba(12,23,48,.55);border:1px solid var(--line);border-radius:999px;
  color:var(--text);padding:9px 14px;font-size:13px;outline:none;
}
[data-theme="light"] .refSearch{background:rgba(255,255,255,.90)}
.refSearch:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(79,140,255,.12)}
.refGroup{margin-bottom:22px}
.refGroupHeader{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.refGroupHeader h3{margin:0;font-size:13px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--muted)}
.refCards{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px;align-items:stretch}
.refCard{
  display:flex;flex-direction:column;gap:10px;
  border:1px solid var(--line);border-radius:var(--radius2);
  background:rgba(12,23,48,.55);box-shadow:var(--shadow);
  padding:14px;transition:border-color .12s ease, transform .12s ease;
}
.refCard:hover{border-color:rgba(79,140,255,.45);transform:translateY(-1px)}
.refCardClickable{cursor:pointer}
.refCardClickable:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(79,140,255,.12)}
[data-theme="light"] .refCard{
  background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(248,251,255,.90) 100%);
  border-color:rgba(111,138,178,.24);box-shadow:0 10px 26px rgba(34,61,109,.06),inset 0 1px 0 rgba(255,255,255,.78);
}
.refCardTitle{font-size:14px;font-weight:700;line-height:1.3}
.refCardDesc{font-size:12px;color:var(--muted);line-height:1.45;flex:1}
.refCardFooter{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.refCardActions{display:flex;gap:8px}
.refCrumb{
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  margin-bottom:12px;font-size:12px;
}
.crumbBack{color:var(--muted);text-decoration:none;font-weight:600;white-space:nowrap}
.crumbBack:hover{color:var(--accent)}
.crumbPath{color:var(--muted);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.crumbPath a{color:var(--muted);text-decoration:none}
.crumbPath a:hover{color:var(--accent)}
.crumbSep{color:var(--line)}
.crumbCurrent{color:var(--text);font-weight:600}
@media (max-width:560px){
  .refCards{grid-template-columns:1fr}
}

/* ═══════════════════════════════════════
   B1 corrections: registry layout, action menu, task preview
   ═══════════════════════════════════════ */

.registryPageGrid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(440px,480px);
  grid-template-areas:
    "kpi tasks"
    "filters tasks"
    "list detail";
  gap:14px;
  align-items:start;
}

.registryKpiPanel{grid-area:kpi}
.registryTasksPanel{
  grid-area:tasks;
  align-self:stretch;
}
.registryFiltersPanel{grid-area:filters;box-shadow:none}
[data-theme="light"] .registryFiltersPanel{box-shadow:none}
.registryListPanel{grid-area:list}
.registryDetailPanel{
  grid-area:detail;
  min-width:0;
}

@media (max-width:1120px){
  .registryPageGrid{
    grid-template-columns:1fr;
    grid-template-areas:
      "kpi"
      "tasks"
      "filters"
      "list"
      "detail";
  }
}

.registryKpiPanel .heroGrid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.registryKpiPanel .heroStat{
  min-height:84px;
  cursor:pointer;
}

.registryTasksPanel .panelBody{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.registryTasksPanel .tasksAllLink{
  margin-top:2px;
  align-self:flex-start;
}

.taskPreviewList{
  display:grid;
  gap:8px;
}

.taskPreviewRow{
  min-width:0;
  box-sizing:border-box;
  overflow:hidden;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:var(--radius2);
  background:var(--panel2);
  transition:border-color .12s ease, transform .12s ease;
}
.taskPreviewRow:hover{
  transform:translateY(-1px);
  border-color:var(--accent);
}

.taskPreviewTop{
  display:flex;
  min-width:0;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.taskPreviewTitle{
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--text);
  text-decoration:none;
  font-size:13px;
  font-weight:700;
}

.taskPreviewTop .tag{
  flex:0 0 auto;
  max-width:110px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.taskPreviewMeta{
  margin-top:3px;
  color:var(--muted);
  font-size:12px;
}

.taskPreviewEntity{
  display:block;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  margin-top:4px;
  color:var(--muted);
  text-decoration:none;
  font-size:12px;
  font-family:var(--mono);
}

.taskPreviewTitle:hover,
.taskPreviewEntity:hover{
  color:var(--accent);
}

.registryFiltersForm{
  display:grid;
  gap:10px;
}

.registryFilterPrimaryRow{
  display:grid;
  grid-template-columns:minmax(230px,2fr) repeat(3,minmax(130px,1fr));
  gap:10px;
  align-items:end;
}
.registryFilterPrimaryRow.noBranch{
  grid-template-columns:minmax(230px,2fr) repeat(2,minmax(130px,1fr));
}

.registryFilterOptionsRow{
  display:grid;
  grid-template-columns:minmax(150px,.65fr) minmax(150px,.65fr) minmax(0,1.7fr);
  gap:10px;
  align-items:end;
}

.registryQuickFilters{
  display:flex;
  min-height:40px;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}

.filterToggle{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 10px;
  gap:6px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--panel2);
  color:var(--muted);
  cursor:pointer;
  font:inherit;
  font-size:12px;
  white-space:nowrap;
}
.filterToggle:hover{
  transform:translateY(-1px);
  border-color:var(--accent);
  color:var(--text);
}
.filterToggle.active{
  border-color:var(--accent);
  background:rgba(79,140,255,.12);
  color:var(--text);
}
.filterToggleMark{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:none;
  width:16px;
  height:16px;
  border:1px solid var(--line);
  border-radius:50%;
  background:var(--panel);
  color:var(--accent);
  font-size:11px;
  font-weight:800;
  line-height:1;
}
/* Активный переключатель: та же рамка, но с заливкой. Размеры круга одинаковы
   в обоих состояниях, поэтому текст не прыгает при переключении, а в состоянии
   off круг виден и на светлой, и на тёмной теме. */
.filterToggle.active .filterToggleMark{
  border-color:var(--accent);
  background:rgba(79,140,255,.22);
}
[data-theme="light"] .filterToggle.active .filterToggleMark{background:rgba(79,140,255,.16)}
.filterToggle:hover .filterToggleMark{border-color:var(--accent)}
.filterToggle:focus-visible{
  outline:none;
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(79,140,255,.12);
}
.filterToggle:disabled{opacity:.55;cursor:not-allowed;transform:none}
.filterToggle:disabled .filterToggleMark{background:var(--panel2)}

.registryFilterActions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}
.registryFilterActions .btn{
  white-space:nowrap;
}

.registryFilterAdvanced{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  padding-top:10px;
  border-top:1px dashed var(--line);
}

.registryFilterAuthor{
  grid-column:span 2;
}

.registryPageGrid .muted{
  color:var(--muted);
}

.btn-sm{
  padding:6px 10px;
  font-size:12px;
}

.registryTableWrap{
  width:100%;
  overflow-x:auto;
  overflow-y:visible;
  overscroll-behavior-x:contain;
  overscroll-behavior-y:auto;
  -webkit-overflow-scrolling:touch;
}
.registryTableWrap table{min-width:760px}
@media (max-width:560px){
  .registryTableWrap table{min-width:620px}
}

/* Раньше здесь стояло второе определение .rowActions — display:inline-flex без
   переноса и с другим промежутком. Оно шло позже и перебивало первое, поэтому
   объявленные выше перенос строк и выравнивание по центру не действовали, а
   расстояние между кнопками зависело от того, какое правило выиграло. Единое
   определение — выше, рядом с .linkBtn. */

.iconBtn{
  width:32px;
  min-width:32px;
  padding:0;
  justify-content:center;
  font-size:18px;
  line-height:1;
}

.actionMenuBackdrop{
  position:fixed;
  inset:0;
  z-index:90;
  background:transparent;
}

.registryActionOverlay{
  position:fixed;
  z-index:100;
  min-width:220px;
  max-width:min(320px,calc(100vw - 16px));
  padding:6px;
  border:1px solid var(--line);
  border-radius:var(--radius2);
  background:var(--panel);
  box-shadow:var(--shadow);
}
.registryActionOverlay.opensUpward{
  transform:translateY(-100%);
}

.actionMenuTitle{
  padding:7px 9px 4px;
  color:var(--muted);
  font-size:11px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.actionMenuItem{
  display:block;
  width:100%;
  padding:8px 9px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:var(--text);
  text-align:left;
  cursor:pointer;
  font-family:inherit;
  font-size:13px;
}

.actionMenuItem:hover,
.actionMenuItem:focus-visible{
  background:var(--panel2);
  outline:none;
}

.row-active td{
  background:rgba(79,140,255,.10) !important;
}

.taskTitle{
  color:var(--text);
  text-decoration:none;
  font-weight:700;
  font-size:13px;
}
.taskTitle:hover{
  color:var(--accent);
}

.taskEntity{
  color:var(--muted);
  text-decoration:none;
  font-size:12px;
  font-family:var(--mono);
}
.taskEntity:hover{
  color:var(--accent);
}

.registryEmptyState{
  padding:20px;
  text-align:center;
  color:var(--muted);
  font-size:13px;
}

@media (max-width:1120px){
  .registryFilterPrimaryRow,
  .registryFilterPrimaryRow.noBranch,
  .registryFilterOptionsRow,
  .registryFilterAdvanced{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .registryFilterAuthor{
    grid-column:auto;
  }
  .registryQuickFilters{
    justify-content:flex-start;
  }
}
@media (max-width:560px){
  .registryFilterPrimaryRow,
  .registryFilterPrimaryRow.noBranch,
  .registryFilterOptionsRow,
  .registryFilterAdvanced{
    grid-template-columns:1fr;
  }
  .registryQuickFilters,
  .registryFilterActions{
    justify-content:flex-start;
  }
}

/* ═══════════════════════════════════════
   A3: Composition pages common UX
   ═══════════════════════════════════════ */

.compositionPage{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.compositionBreadcrumbs{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  color:var(--muted);
  font-size:13px;
}
.compositionBreadcrumbs a{
  color:var(--muted);
  text-decoration:none;
}
.compositionBreadcrumbs a:hover{
  color:var(--accent);
}
.compositionBreadcrumbs span:last-child{
  color:var(--text);
  font-weight:600;
}

.compositionHeaderPanel .panelHeader{
  align-items:flex-start;
}
.compositionHeader{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:14px;
  min-width:0;
}
.compositionHeader > div:first-child{
  min-width:0;
}
.compositionType{
  color:var(--muted);
  font-size:13px;
  margin-bottom:2px;
}
.compositionHeader h2{
  margin:0 0 8px;
  font-size:22px;
  line-height:1.25;
}
.compositionVersionLine{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
  font-size:14px;
}
.compositionReadinessLine{
  margin-top:4px;
}
.compositionReadinessStatus{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.compositionReadinessLabel{
  color:var(--muted);
  font-size:13px;
}

.compositionHeaderActions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
}

.compositionReadOnlyBanner{
  padding:10px 12px;
  border-radius:var(--radius2);
  border:1px solid var(--line);
  background:var(--panel2);
  color:var(--muted);
  font-size:13px;
}
.compositionReadOnlyBanner--warn{
  color:var(--warn);
  border-color:color-mix(in srgb, var(--warn) 35%, var(--line));
  background:color-mix(in srgb, var(--warn) 10%, var(--panel2));
}
.compositionReadOnlyBanner--info{
  color:var(--text);
  border-color:var(--line);
}

.compositionMain{
  min-width:0;
}
.compositionSidebar{
  min-width:0;
}

.compositionSummary{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  color:var(--muted);
  font-size:13px;
}

.compositionPartPanel + .compositionPartPanel{
  margin-top:12px;
}
.compositionPartHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:6px;
  font-weight:700;
  font-size:14px;
}
.compositionPartHeader .hint{
  font-weight:400;
}

.compositionVersionNavigator .rowCard{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:10px;
  border:1px solid var(--line);
  border-radius:var(--radius2);
  background:var(--panel2);
}
.compositionVersionNavigator .rowCard.current{
  border-color:var(--accent);
  background:rgba(79,140,255,.08);
}
.compositionVersionNavigator .top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
}
.compositionVersionNavigator .sub{
  color:var(--muted);
  font-size:12px;
}

.compositionEmpty{
  padding:16px;
  text-align:center;
  color:var(--muted);
  font-size:13px;
}

.compositionRow--clickable{cursor:pointer;}
.compositionReviewComment{margin-top:10px;max-width:400px;}
.compositionFormRow{margin-bottom:12px;}
.compositionFormAction{display:flex;align-items:flex-end;}
.compositionFilterForm{margin-bottom:8px;}
.compositionFilterInput{max-width:300px;}
.compositionEmptyCompact{padding:4px 0;}
.compositionErrorNote{margin-top:10px;}
.compositionQtyInput{width:70px;}
.compositionSidebarActions{margin-top:10px;}
.compositionPartMeta{display:flex;align-items:center;gap:10px;}
.compositionPartDelete{color:var(--bad);}
.compositionPartDelete:hover{color:var(--bad);}

.btn.danger{
  background:var(--bad);
  color:#fff;
  border:1px solid var(--bad);
}
.btn.danger:hover{
  background:color-mix(in srgb, var(--bad) 85%, #000);
  border-color:color-mix(in srgb, var(--bad) 85%, #000);
}

@media (max-width:1120px){
  .compositionHeader{
    flex-direction:column;
  }
  .compositionHeaderActions{
    justify-content:flex-start;
  }
}
@media (max-width:560px){
  .compositionHeader h2{
    font-size:18px;
  }
  .compositionHeaderActions .btn{
    width:100%;
  }
}

.compositionRegistryFilters{
  display:flex;
  flex-wrap:wrap;
  align-items:end;
  gap:10px;
}
.compositionRegistrySearch{
  flex:0 1 380px;
  min-width:260px;
}
.compositionRegistryStatus{
  flex:0 0 170px;
}
.compositionRegistryPresence{
  flex:0 0 210px;
}
.compositionRegistryQuickFilters{
  display:inline-flex;
  align-items:center;
  min-height:40px;
  gap:8px;
  flex-wrap:wrap;
}
.compositionRegistryFilterAction{
  flex:0 0 auto;
}
.compositionRegistryLimit{
  margin:0 12px 12px;
}

@media (max-width:1120px){
  .compositionRegistrySearch{
    flex-basis:min(100%,420px);
  }
}

@media (max-width:560px){
  .compositionRegistryFilters{
    display:grid;
    grid-template-columns:1fr;
  }
  .compositionRegistrySearch,
  .compositionRegistryStatus,
  .compositionRegistryPresence,
  .compositionRegistryFilterAction{
    min-width:0;
    width:100%;
  }
  .compositionRegistryQuickFilters{
    justify-content:flex-start;
  }
}

.hkStatusWithReadiness{
  display:inline-flex;
  align-items:center;
  flex-wrap:nowrap;
  gap:6px;
}
.hkReadinessDot{
  position:relative;
  display:inline-block;
  width:12px;
  height:12px;
  flex:0 0 12px;
  border:1px solid color-mix(in srgb, var(--warn) 55%, var(--line));
  border-radius:50%;
  background:color-mix(in srgb, var(--warn) 70%, transparent);
  cursor:help;
  outline:none;
  vertical-align:middle;
}
.hkReadinessDot:hover,
.hkReadinessDot:focus-visible{
  box-shadow:0 0 0 3px rgba(79,140,255,.12);
}
.hkReadinessDot::after{
  position:absolute;
  z-index:50;
  bottom:calc(100% + 8px);
  left:50%;
  display:none;
  width:max-content;
  max-width:260px;
  padding:8px 10px;
  border:1px solid var(--line);
  border-radius:var(--radius2);
  background:var(--panel);
  box-shadow:var(--shadow);
  color:var(--text);
  content:attr(data-tooltip);
  font-size:12px;
  line-height:1.35;
  transform:translateX(-50%);
  white-space:normal;
  pointer-events:none;
}
.hkReadinessDot:hover::after,
.hkReadinessDot:focus-visible::after{
  display:block;
}
.hkReadinessBlock{
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid var(--line);
}
.hkReadinessHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
}
.hkReadinessHeader .label{
  font-weight:600;
  font-size:13px;
}
.hkReadinessStateLine{
  display:flex;
  align-items:center;
  gap:6px;
}
.hkReadinessIssues{
  display:grid;
  gap:8px;
  margin-top:10px;
}
.hkReadinessIssue{
  padding:9px 10px;
  border:1px solid var(--line);
  border-radius:var(--radius2);
  background:var(--panel2);
}
.hkReadinessIssue .hint{
  margin-top:2px;
}
.hkReadinessOpen{
  margin-top:10px;
}

/* ── Редактор собственной структуры ХК ─────────────────────────────────────
   Оформление редактора задано классами: разметка не содержит произвольных
   inline-стилей, а отступ вложенности передаётся CSS-переменной. */

.hk-editor-toolbar {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

.hk-editor-toolbar--wide {
    gap: 8px;
}

.hk-editor-chip {
    padding: 2px 10px;
    font-size: 12px;
}

.hk-editor-note {
    margin-bottom: 10px;
    font-size: 12px;
}

.hk-editor-gap {
    margin-top: 8px;
}

.hk-editor-gap--sm {
    margin-top: 4px;
}

.hk-editor-strong {
    font-weight: 700;
    font-size: 13px;
}

.hk-editor-name {
    flex: 1;
    min-width: 110px;
    font-weight: 600;
}

.hk-editor-num {
    width: 56px;
}

.hk-editor-select {
    width: 120px;
    font-size: 12px;
}

.hk-editor-select--narrow {
    width: 100px;
}

.hk-editor-select--tiny {
    width: 72px;
    font-size: 11px;
}

.hk-editor-row {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    overflow: hidden;
}

.hk-editor-cell {
    padding-left: var(--indent, 0px);
}

.hk-editor-collapse {
    width: 20px;
    text-align: center;
}

.hk-editor-actions {
    margin-top: 4px;
    display: flex;
    gap: 6px;
}

.hki-muted-xs {
    font-size: 11px;
    color: var(--muted);
}

.hki-muted-sm {
    font-size: 12px;
    color: var(--muted);
}

.hki-link-xs {
    font-size: 12px;
}

.hki-danger {
    color: var(--bad);
}

.hki-section-row {
    background: var(--panel2);
}

.hki-position-row {
    background: transparent;
}

.hki-focus {
    background: rgba(79, 140, 255, 0.06);
}

.hki-note-row {
    background: transparent;
}

.hki-mat-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 1px 6px;
    border: 1px solid var(--line);
    border-radius: var(--radius2, 8px);
    font-size: 11px;
}

.hki-tag-remove {
    border: 0;
    background: transparent;
    color: var(--muted);
    cursor: pointer;
    padding: 0 2px;
    line-height: 1;
}

.hki-tag-remove:hover,
.hki-tag-remove:focus-visible {
    color: var(--bad);
}

.hki-add-mat {
    font-size: 11px;
    padding: 1px 6px;
}

.hk-totals {
    margin-top: 8px;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    font-size: 12px;
}

.hk-delete-confirm {
    margin-top: 8px;
    padding: 8px 10px;
    border: 1px solid var(--bad);
    border-radius: 8px;
    font-size: 12px;
    background: var(--panel2);
}

.hk-delete-confirm-actions {
    display: flex;
    gap: 6px;
    margin-top: 6px;
}

.hk-attachment-message {
    margin-top: 6px;
    padding: 6px 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    font-size: 12px;
    background: var(--panel2);
}

.hk-attachment-message--error {
    border-color: var(--bad);
    color: var(--bad);
}

.hk-section-panel {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

.hk-section-panel .btn[aria-pressed="true"] {
    border-color: var(--accent, #4f8cff);
    font-weight: 650;
    color: var(--text);
}

.hki-mat-tag--clickable {
    cursor: pointer;
}

.hki-mat-tag--clickable:hover,
.hki-mat-tag--clickable:focus-visible {
    border-color: var(--accent, #4f8cff);
}

.hki-td-input {
    resize: vertical;
}

.hki-th-num {
    width: 32px;
}

.hki-th-qty {
    width: 55px;
}

.hki-th-mass {
    width: 70px;
}

.hki-th-unit {
    width: 40px;
}

.hk-totals-title {
    font-weight: 700;
    margin-bottom: 4px;
}

.hk-totals-note {
    font-weight: 400;
    color: var(--muted);
}

.hk-totals-total {
    margin-top: 4px;
    font-weight: 700;
}

.hki-danger-text {
    color: var(--bad);
}

.hki-muted {
    color: var(--muted);
}