/* Палитра, шрифт, геометрия и тени основного BI (public/index.html). */
:root{color-scheme:light;--accent:var(--green-dim)}
*{
  box-sizing:border-box
}
[hidden]{
  display:none!important
}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font:14px/1.5 var(--sans);
  -webkit-font-smoothing:antialiased;
  letter-spacing:.1px
}
h1,h2,h3,p{
  margin:0
}
h1{
  font-size:26px;
  font-weight:800;
  line-height:1.3
}
h2{
  font-size:18px;
  font-weight:750
}
h3{
  font-size:15px;
  margin:18px 0 10px
}
p{
  color:var(--muted)
}
a{
  color:var(--green-dim);
  text-decoration:none
}
a:hover{
  text-decoration:underline
}
button,input,select,textarea{
  font:inherit;
  color:var(--ink);
  border:1px solid var(--line2);
  border-radius:var(--radius-control);
  background:var(--panel);
  padding:9px 12px;
  min-height:40px
}
button{
  cursor:pointer;
  font-weight:600;
  transition:background .14s,border-color .14s
}
button:hover:not(:disabled){
  border-color:var(--green);
  background:var(--green-soft)
}
button:disabled{
  opacity:.45;
  cursor:default
}
input,select,textarea{
  max-width:100%;
  min-width:0
}
input[type=checkbox]{
  min-height:auto;
  accent-color:var(--green);
  width:15px;
  height:15px;
  vertical-align:middle
}
textarea{
  resize:vertical
}
label{
  font-size:12px;
  color:var(--muted)
}
:focus-visible{
  outline:3px solid var(--green);
  outline-offset:3px
}
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap
}
#security-app{
  max-width:1180px;
  margin:auto;
  padding:0 16px 60px
}
.topbar{
  display:flex;
  align-items:center;
  gap:22px;
  padding:16px 4px 14px;
  min-height:80px
}
.brand{
  display:flex;
  align-items:center;
  gap:12px;
  font-size:15.5px;
  font-weight:800;
  color:var(--ink);
  line-height:1.2
}
.brand:hover{
  text-decoration:none
}
.brand small{
  display:block;
  color:var(--green);
  font-size:10px;
  letter-spacing:1.5px;
  font-weight:600;
  margin-top:4px;
  text-transform:uppercase
}
.mark{
  width:40px;
  height:40px;
  border-radius:13px;
  display:grid;
  place-items:center;
  flex:none;
  background:linear-gradient(145deg,#2bbf45,var(--green-dim));
  box-shadow:0 6px 16px -6px rgba(33,160,56,.55)
}
.mark svg{
  width:26px;
  height:26px
}
.back-link{
  font-size:12px;
  color:var(--muted);
  margin-left:auto
}
.user-chip{
  display:flex;
  align-items:center;
  gap:12px
}
.user-meta{
  text-align:right;
  font-size:13px
}
.user-meta small{
  display:block;
  color:var(--green);
  font-size:10.5px
}
.user-chip button{
  font-size:12px;
  min-height:36px
}
.page-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:24px 4px
}
.eyebrow{
  font-size:10px;
  font-weight:700;
  letter-spacing:1.6px;
  color:var(--muted);
  margin-bottom:8px
}
.page-head p{
  font-size:13.5px;
  margin-top:7px
}
.tag{
  display:inline-block;
  font-size:10px;
  font-weight:650;
  border:1px solid rgba(33,160,56,.25);
  color:var(--green-dim);
  background:var(--green-soft);
  border-radius:20px;
  padding:4px 10px;
  vertical-align:middle;
  margin-left:8px;
  letter-spacing:.2px
}
.refresh{
  text-align:right;
  font-size:12px;
  color:var(--muted)
}
.refresh>div{
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:flex-end;
  margin:7px 0
}
.refresh button{
  min-height:34px;
  padding:6px 12px;
  font-size:12px
}
.refresh small{
  font-size:10px
}
.refresh label{
  display:flex;
  align-items:center;
  gap:5px
}
.metrics{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:13px
}
.metrics article{
  padding:17px 17px 15px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius-panel);
  box-shadow:var(--shadow-sm);
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column
}
.metrics article:before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;
  width:3px;
  background:var(--green)
}
.metrics article:nth-child(2):before{
  background:var(--teal)
}
.metrics article:nth-child(3):before{
  background:var(--purple)
}
.metrics article:nth-child(4):before{
  background:var(--amber)
}
.metrics span{
  font-weight:650;
  font-size:12px;
  color:var(--muted)
}
.metrics strong{
  display:block;
  font:800 26px/1.3 var(--mono);
  margin:11px 0 9px;
  color:var(--ink);
  font-variant-numeric:tabular-nums
}
.metrics small{
  color:var(--muted);
  font-size:10.5px;
  display:block;
  margin-top:auto
}
.section-tabs{
  display:flex;
  gap:4px;
  flex-wrap:wrap;
  width:fit-content;
  background:var(--panel2);
  border:1px solid var(--line2);
  border-radius:12px;
  padding:4px;
  margin:24px 0 16px
}
.section-tabs button{
  background:transparent;
  border:0;
  color:var(--muted);
  border-radius:9px;
  padding:8px 18px;
  font-size:13px;
  min-height:36px
}
.section-tabs button[aria-selected=true]{
  background:var(--panel);
  color:var(--ink);
  box-shadow:var(--shadow-sm)
}
.panel{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius-panel);
  padding:17px 18px 13px;
  box-shadow:var(--shadow-sm)
}
.toolbar{
  display:flex;
  align-items:end;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:14px
}
.toolbar h2{
  margin-right:auto;
  align-self:center
}
.toolbar label,dialog label{
  display:grid;
  gap:5px
}
.toolbar select{
  font-size:12px
}
.hint{
  font-size:12px;
  margin:10px 0 16px;
  line-height:1.6
}
.time-hint{
  margin-bottom:0
}
#event-filters{
  display:grid;
  grid-template-columns:repeat(2,minmax(155px,1fr)) minmax(130px,.8fr) repeat(2,minmax(135px,1fr));
  margin-top:18px;
  gap:12px
}
#event-filters input,#event-filters select{
  width:100%;
  font-size:12px
}
/* Журнал: одинаковые поля в одной сетке, период и применённый срез отдельно. */
#event-filters{display:block;margin:18px 0 16px;padding:18px;border:1px solid var(--line);border-radius:12px;background:var(--panel2)}
.event-filter-main{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1.1fr) minmax(0,.9fr) minmax(0,1fr);gap:14px}
#event-filters label{min-width:0;gap:7px;color:var(--muted);font-size:12px;line-height:1.5}
#event-filters input,#event-filters select{min-width:0;min-height:42px;height:42px;box-sizing:border-box;background:var(--panel);border-radius:7px;margin:0}
.event-period-filters{margin-top:16px;border-top:1px solid var(--line);padding-top:14px}
.event-period-filters>summary{font-weight:600;font-size:12px;color:var(--ink);cursor:pointer;line-height:1.6;min-height:24px}
.event-period-filters>summary span{font-weight:400;color:var(--muted);margin-left:10px;overflow-wrap:anywhere}
.event-period-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:14px;max-width:680px}
.event-period-filters .hint{margin:10px 0 0;color:var(--muted);font-size:11px}
.event-filter-footer{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;border-top:1px solid var(--line);padding-top:14px;margin-top:14px}
.event-active-filters{display:flex;align-items:center;flex-wrap:wrap;gap:7px;min-width:0;flex:1}
.event-filter-empty{font-size:11px;color:var(--muted);line-height:1.6;padding:8px 0}
#event-filters .event-filter-chip{border:1px solid var(--line);border-radius:6px;background:var(--green-soft);color:var(--green-dim);font-size:11px;line-height:1.5;padding:7px 9px;min-height:32px;max-width:100%;text-align:left;white-space:normal;overflow-wrap:anywhere}
#event-filters .filter-actions{flex:none;margin:0;gap:8px}#event-filters .filter-actions button{height:38px;min-height:38px;padding:8px 14px;font-size:12px;white-space:nowrap}
@media(max-width:1200px){.event-filter-main{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){#event-filters{padding:14px}.event-filter-main,.event-period-fields{grid-template-columns:1fr;gap:12px}#event-filters input,#event-filters select{font-size:16px;min-height:44px;height:44px}.event-period-filters>summary{min-height:32px}.event-period-filters>summary span{display:block;margin-left:16px;font-size:11px}.event-filter-footer{flex-direction:column;align-items:stretch;gap:10px}#event-filters .filter-actions{width:100%}#event-filters .filter-actions button{flex:1;min-height:44px;height:44px}#event-filters .event-filter-chip{min-height:36px}.event-filter-empty{padding:0}}
.filter-actions{
  grid-column:1/-1;
  display:flex;
  justify-content:flex-end;
  gap:8px
}
.primary,dialog button[type=submit],.login-card button{
  background:var(--green);
  color:white;
  border-color:var(--green)
}
.primary:hover:not(:disabled),dialog button[type=submit]:hover:not(:disabled),.login-card button:hover:not(:disabled){
  background:var(--green-dim);
  color:white
}
.table-wrap{
  position:relative;
  min-width:0;
  max-width:100%;
  overflow:auto;
  border:1px solid var(--line);
  border-radius:12px;
  scrollbar-width:thin;
  scrollbar-color:var(--line2) transparent;
  overscroll-behavior-x:contain
}
table{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
  text-align:left;
  font-size:var(--table-font)
}
th{
  height:48px;
  font-size:var(--table-head-font);
  letter-spacing:.8px;
  text-transform:uppercase;
  font-weight:700;
  color:var(--muted);
  background:var(--panel2);
  border-bottom-color:var(--line2);
  line-height:1.4
}
td,th{
  padding:var(--table-pad-y) var(--table-pad-x);
  border-bottom:1px solid var(--line);
  vertical-align:middle;
  overflow-wrap:anywhere
}
td{line-height:1.55}
td strong{display:block;font-size:inherit;font-weight:650}
td button{font-size:11px;min-height:32px;padding:5px 10px;white-space:nowrap}
.cell-number,.cell-time{font-variant-numeric:tabular-nums;text-align:right;overflow-wrap:normal}
td.cell-number{font-family:var(--mono);font-size:12px}
.cell-action{text-align:right}
.sa-table col:first-child{width:28%}
.sa-table{min-width:720px}
.sa-table[data-columns="2"],.sa-table[data-columns="3"]{min-width:480px}
.sa-table :is(th,td):first-child{text-align:left}
.sa-table td.empty{text-align:center}
.incidents-table{min-width:960px}
.incidents-table :is(th,td):nth-child(1){width:17%;font-variant-numeric:tabular-nums}
.incidents-table :is(th,td):nth-child(2){width:25%}
.incidents-table :is(th,td):nth-child(3){width:20%}
.incidents-table :is(th,td):nth-child(4){width:16%}
.incidents-table :is(th,td):nth-child(5){width:10%;text-align:right;font-variant-numeric:tabular-nums}
.incidents-table :is(th,td):last-child{width:12%;text-align:right}
.events-table{min-width:900px}
.events-table :is(th,td):nth-child(1){width:18%;font-variant-numeric:tabular-nums}
.events-table :is(th,td):nth-child(2){width:26%}
.events-table :is(th,td):nth-child(3){width:22%}
.events-table :is(th,td):nth-child(4){width:19%}
.events-table :is(th,td):last-child{width:15%}
.vehicle-direction{margin-top:6px;font-size:12px;font-weight:500;white-space:normal;overflow-wrap:anywhere}
tbody tr:hover{background:var(--panel2)}
tbody tr:last-child td{border-bottom:0}
.badge{
  display:inline-flex;
  padding:3px 8px;
  font-size:10px;
  border-radius:6px;
  background:var(--green-soft);
  color:var(--green-dim);
  font-weight:600;
  margin-top:5px
}
.critical{
  color:var(--danger-ink);
  background:var(--danger-bg)
}
.warning{
  color:var(--warning-ink);
  background:var(--warning-bg)
}
.security-severity-hint{display:block;color:var(--muted);font-size:11px;line-height:1.45;max-width:42ch;margin-top:4px;font-weight:400}
.security-severity-legend{margin:10px 0;color:var(--muted);font-size:12px;line-height:1.5}
.security-severity-legend summary{cursor:pointer}
.security-severity-legend .security-severity{margin:8px 0}
.security-severity-legend p{max-width:70ch}
.muted{
  color:var(--muted);
  font-size:10.5px;
  margin-top:4px;
  line-height:1.5
}
.error{
  padding:12px 14px;
  border-radius:10px;
  border:1px solid #f5d8d0;
  background:#fff0eb;
  color:#a53627;
  font-size:12px;
  margin:12px 0;
  overflow-wrap:anywhere
}
.point-unmapped{
  color:#895912
}
.pager{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:14px;
  margin-top:16px;
  font-size:12px;
  color:var(--muted)
}
.pager button{
  font-size:12px;
  min-height:34px;
  padding:6px 13px
}
.empty{
  text-align:center;
  padding:44px 20px;
  color:var(--muted)
}
.technical{
  font-family:var(--mono);
  font-size:10.5px;
  overflow-wrap:anywhere
}
.source{
  border:1px solid var(--line);
  border-radius:13px;
  background:var(--panel2);
  padding:18px;
  margin:12px 0;
  overflow-wrap:anywhere
}
.source h3{
  margin-top:0
}
.source p{
  margin-top:8px
}
.source details{
  margin-top:16px
}
.source summary{
  cursor:pointer;
  font-weight:650;
  color:var(--green-dim)
}
.health-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:10px;
  margin:12px 0
}
.health-grid>div{
  background:white;
  border:1px solid var(--line);
  padding:12px;
  border-radius:10px
}
#operations-summary{
  padding:16px;
  background:var(--panel2);
  border-radius:12px;
  margin:12px 0
}
#operations-summary p{
  margin-bottom:8px
}
dialog{
  color:var(--ink);
  width:min(760px,calc(100vw - 32px));
  max-height:calc(100dvh - 48px);
  background:var(--panel);
  border:1px solid var(--line2);
  border-radius:20px;
  box-shadow:var(--shadow);
  padding:0
}
dialog::backdrop{
  background:rgba(22,36,29,.48);
  backdrop-filter:blur(3px)
}
.dialog-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:20px 24px;
  border-bottom:1px solid var(--line);
  position:sticky;
  top:0;
  background:white;
  z-index:2
}
.dialog-head h2{
  font-size:19px
}
.dialog-head button{
  font-size:12px;
  flex:none
}
#detail-body{
  padding:20px 24px
}
#detail-body .incident-title{
  margin:0 0 16px;
  font-size:18px;
  line-height:1.4;
  overflow-wrap:anywhere
}
#detail-body>p{
  font-size:12px;
  margin-bottom:9px
}
@media(max-width:700px){
  .security-workspace #incidents>.toolbar{display:grid;grid-template-columns:minmax(0,1fr);align-items:stretch;gap:12px}
  .security-workspace #incidents>.toolbar label{width:100%;min-width:0}
  .security-workspace #incidents>.toolbar select{width:100%}
}
.timeline{
  padding:0;
  list-style:none;
  border-left:2px solid var(--green-soft);
  margin-left:5px
}
.timeline li{
  padding:8px 0 14px 18px;
  font-size:12px;
  overflow-wrap:anywhere
}
.timeline li:before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--green);
  display:inline-block;
  margin-left:-23px;
  margin-right:15px
}
dialog form{
  display:grid;
  gap:12px;
  margin:0;
  padding:20px 24px;
  border-top:1px solid var(--line);
  background:var(--panel2)
}
dialog form h3{
  margin:0
}
dialog label{
  font-size:12px
}
.media-control{
  margin-top:8px;
  min-width:0;
  max-width:100%
}
.media-control>button{
  max-width:100%;
  white-space:normal;
  overflow-wrap:anywhere
}
.media-result{
  margin-top:10px;
  min-width:0;
  max-width:100%
}
.media-result p{
  margin:0;
  font-size:11px;
  white-space:normal;
  overflow-wrap:anywhere
}
.security-evidence{
  display:block;
  width:auto;
  max-width:100%;
  max-height:420px;
  object-fit:contain;
  border-radius:10px;
  background:var(--panel2);
  margin-bottom:8px
}
.login-screen{
  min-height:100dvh;
  display:grid;
  place-items:center;
  padding:24px
}
.login-card{
  width:min(410px,100%);
  padding:36px 30px;
  border:1px solid var(--line2);
  border-radius:22px;
  background:var(--panel);
  box-shadow:var(--shadow);
  display:grid;
  gap:12px
}
.login-brand{
  font-size:12px;
  font-weight:700;
  margin-bottom:14px;
  color:var(--green)
}
.login-card h1{
  font-size:24px
}
.login-card p{
  font-size:13px
}
.login-card label{
  margin-top:6px
}
.login-card button{
  margin-top:12px;
  font-weight:700
}
@media(max-width:1000px){
  #event-filters{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .metrics article{
    padding:16px
  }
  .tag{
    display:none
  }
  .topbar{
    gap:14px
  }
  .brand{
    font-size:13px
  }
}
@media(max-width:650px){
  #security-app{
    padding:0 12px 32px
  }
  .topbar{
    flex-wrap:wrap;
    gap:10px
  }
  .brand{
    font-size:11px
  }
  .brand small{
    font-size:8px
  }
  .back-link{
    order:3;
    width:100%;
    margin:0;
    font-size:11px
  }
  .user-chip{
    margin-left:auto
  }
  .user-meta{
    font-size:11px
  }
  .user-chip button{
    padding:6px 9px;
    min-height:32px
  }
  .page-head{
    display:block;
    padding:15px 2px 20px
  }
  h1{
    font-size:24px
  }
  .refresh{
    text-align:left;
    margin-top:16px
  }
  .refresh>div{
    justify-content:flex-start
  }
  .refresh small{
    display:block
  }
  .metrics{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px
  }
  .metrics article{
    padding:14px
  }
  .metrics strong{
    font-size:28px
  }
  .metrics small{
    font-size:10px
  }
  .section-tabs{
    width:100%;
    gap:2px;
    flex-wrap:nowrap
  }
  .section-tabs{overflow-x:auto}
  .section-tabs button{
    flex:0 0 auto;
    white-space:nowrap;
    padding:8px 6px;
    font-size:11px
  }
  .panel{
    padding:15px;
    border-radius:15px
  }
  .toolbar h2{
    width:100%;
    margin-bottom:4px
  }
  .toolbar label{
    flex:1;
    min-width:120px
  }
  .toolbar select{
    width:100%
  }
  #event-filters{
    grid-template-columns:1fr
  }
  .filter-actions button{
    flex:1
  }

  .pager{
    justify-content:space-between;
    font-size:11px;
    gap:6px
  }
  td,th{padding:10px 11px}
  td{font-size:12.5px}
  .dialog-head,#detail-body,dialog form{
    padding:16px
  }
  .dialog-head h2{
    font-size:16px
  }
  .login-card{
    padding:28px 24px
  }
}
@media(prefers-reduced-motion:reduce){
  *{
    scroll-behavior:auto!important;
    transition:none!important
  }
}

/* миниатюра кадра: компактно, по клику раскрывается в полный размер */
.security-thumb{max-height:240px;cursor:zoom-in}
.events-table .security-thumb{max-height:160px}

/* Аналитика: единая ось названий, числовые столбцы и независимые панели BI. */
#analytics{background:transparent;border:0;box-shadow:none;padding:0}
#analytics>h2,#analytics>.hint{margin-left:4px;margin-right:4px}
.sa-block{margin-top:16px;padding:17px 18px 13px;border:1px solid var(--line);border-radius:var(--radius-panel);background:var(--panel);box-shadow:var(--shadow-sm);min-width:0}
.sa-block h3{margin:0 0 16px;font-size:15px}
.sa-block h4{margin:18px 0 6px;font-size:13px;font-weight:650}
.sa-block .table-wrap{margin:12px 0}
.sa-block>.hint:last-child{margin:12px 0 0}
.sa-metrics{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:14px}
.sa-metrics span{min-height:36px}
.sa-metrics small{font-size:10.5px}
.sa-heat{min-width:1000px}
.sa-heat col:first-child{width:28%}
.sa-heat th,.sa-heat td{padding:8px 2px;text-align:center;font-variant-numeric:tabular-nums}
.sa-heat td{font-family:var(--mono);font-size:10px}
.sa-heat :is(th,td):first-child{text-align:left;padding:var(--table-pad-y) var(--table-pad-x);font-family:var(--sans);font-size:12px}
.sa-heat th:first-child{font-size:var(--table-head-font)}
.sa-heat :is(th,td):last-child{font-weight:700}
.heat-0{background:transparent}
.heat-1{background:var(--green-soft)}
.heat-2{background:#c6ebcc}
.heat-3{background:#8fd39c}
.heat-4{background:#4db564;color:#fff}
.sa-light-unknown,.attendance-outside{background:var(--panel2);color:var(--muted)}
.sa-light-green{background:var(--green-soft);color:var(--green-dim)}
.sa-light-yellow,.attendance-unknown{background:var(--warning-bg);color:var(--warning-ink)}
.sa-light-red{background:var(--danger-bg);color:var(--danger-ink)}

/* Посещения используют те же фильтры, таблицы, карточки и диалоги. */
.attendance-filters{display:grid;grid-template-columns:1.3fr 1fr 1.5fr auto;gap:12px;align-items:end;margin:18px 0}
.attendance-filters label{display:grid;gap:5px;color:var(--muted);font-size:12px}
.attendance-metrics{grid-template-columns:repeat(3,minmax(0,1fr));margin:18px 0}
.attendance-secondary{display:block;color:var(--muted);font-size:11px;font-weight:400;margin-top:4px}
.attendance-note{padding:12px 14px;background:var(--warning-bg);border:1px solid #f2dfb5;border-radius:12px;color:var(--warning-ink);font-size:12px;line-height:1.6}
.attendance-fact-link{display:flex;align-items:baseline;gap:6px;white-space:normal;text-align:left;border-color:transparent;background:transparent;padding:4px 0;color:var(--accent)}
.attendance-fact-link strong{font-size:20px;white-space:nowrap;flex-shrink:0}
.attendance-fact-link span{font-size:11px;color:var(--muted);font-weight:400}
.attendance-fact-link:hover,.attendance-fact-link:focus-visible{background:var(--green-soft);border-color:var(--accent)}
.attendance-history-sections{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.attendance-history-sections button[aria-pressed="true"]{background:var(--green-soft);color:var(--accent);border-color:var(--accent)}
#attendance-detail{width:min(880px,calc(100vw - 32px))}
#attendance-detail-body{padding:20px 24px}
.attendance-history-table .attendance-frame-cell{min-width:130px;max-width:260px;vertical-align:top}
.attendance-history-table .media-control{margin-top:0}
.attendance-history-table .security-thumb{max-height:180px}
#attendance .section-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}
#attendance .table-wrap{margin:16px 0}
#attendance .sa-table{min-width:860px}
#attendance .sa-table[data-columns="7"]{min-width:1080px}
#attendance .sa-table col:first-child{width:24%}
#attendance .attendance-day-table{min-width:1080px}
#attendance .attendance-day-table col:first-child{width:22%}
#attendance .attendance-day-table col:last-child{width:10%}
#attendance .attendance-day-table :is(th,td){overflow-wrap:normal;word-break:normal}
#attendance .attendance-day-table td:first-child{overflow-wrap:anywhere}
#attendance .attendance-day-table .badge{max-width:100%;box-sizing:border-box}
#attendance .sa-table.attendance-facts-table{min-width:840px}
#attendance .attendance-facts-table col:first-child{width:24%}
#attendance .attendance-facts-table :is(th,td){overflow-wrap:normal;word-break:normal;vertical-align:top;text-align:left}
#attendance .attendance-facts-table td:first-child{overflow-wrap:anywhere}
@media(max-width:1100px){.sa-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:700px){
  .attendance-filters{grid-template-columns:1fr 1fr}
  .attendance-filters label:nth-child(-n+3){grid-column:1/-1}
  .attendance-metrics{grid-template-columns:1fr}
  #attendance .section-heading{display:block}
  .attendance-metrics article{display:grid;grid-template-columns:1fr auto;gap:8px;padding:16px}
  .attendance-metrics strong{grid-column:2;grid-row:1/3;margin:0;align-self:center}
  .attendance-metrics span,.attendance-metrics small{margin:0}
  .sa-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sa-block{padding:15px 14px 11px}
  #attendance-detail-body{padding:16px}
  #attendance .table-wrap:has(.attendance-facts-table){overflow:visible}
  #attendance .sa-table.attendance-facts-table{display:block;min-width:0;width:100%;border:0}
  #attendance .attendance-facts-table :is(thead,colgroup){display:none}
  #attendance .attendance-facts-table tbody{display:grid;gap:12px}
  #attendance .attendance-facts-table tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border:1px solid var(--line);border-radius:12px;padding:8px}
  #attendance .attendance-facts-table td{display:block;min-width:0;border:0;padding:8px}
  #attendance .attendance-facts-table td::before{content:attr(data-label);display:block;margin-bottom:5px;font-size:11px;color:var(--muted)}
  #attendance .attendance-facts-table td:first-child{grid-column:1/-1;border-bottom:1px solid var(--line)}
  #attendance .attendance-facts-table td:first-child::before{display:none}
  #attendance .attendance-facts-table td:is([data-label="Проезд"],[data-label="Проезды"]){grid-column:1/-1}
}

.sa-attention{margin:16px 0;padding:16px 18px;border:1px solid #f2dfb5;border-radius:var(--radius-panel);background:var(--warning-bg)}
.sa-attention h3{margin:0 0 8px;color:var(--warning-ink)}
.sa-attention ul{margin:0;padding-left:20px;color:var(--ink2);font-size:12px}
.sa-attention li+li{margin-top:6px}
.sa-table[data-columns="7"]{min-width:1080px}

.attendance-filters .attendance-basis{grid-column:1/-1}

/* Контрагенты используют общую тему и геометрию таблиц BI. */
#counterparties .sa-table{min-width:860px}
#counterparties .toolbar label:first-child{flex:1;min-width:210px}
#counterparties .toolbar input{width:100%}
.cp-source-state{margin-top:18px}
.cp-source-state summary{cursor:pointer;font-weight:600;padding:8px 0}
.cp-dialog{width:min(760px,calc(100vw - 24px))}
.cp-dossier{width:min(1040px,calc(100vw - 24px))}
.cp-dialog-body{padding:20px 24px}
.cp-dialog-body>label{display:grid;gap:8px;margin-bottom:16px}
.cp-fields{border:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:16px;min-width:0}
.cp-fields label{min-width:0}
.cp-fields input,.cp-fields select,.cp-fields textarea,.cp-dialog-body textarea{width:100%;box-sizing:border-box}
.cp-wide{grid-column:1/-1}
.cp-results{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cp-results .sa-block{margin:0;overflow-wrap:anywhere}
.cp-results h3{margin-top:0}
.cp-values{display:grid;grid-template-columns:minmax(100px,1fr) minmax(120px,1fr);gap:6px 16px;font-size:13px;margin:12px 0;padding-bottom:12px;border-bottom:1px solid var(--line)}
.cp-values dt{color:var(--muted)}
.cp-values dd{margin:0;white-space:pre-wrap}
.cp-status{display:inline-block;padding:5px 9px;border-radius:7px;font-size:12px;background:var(--panel2);color:var(--muted)}
.cp-status.match{color:var(--danger-ink);background:var(--danger-bg)}
.cp-status.review{color:var(--warning-ink);background:var(--warning-bg)}
.cp-status.found{color:var(--green-dim);background:var(--green-soft)}
.cp-dialog .toolbar{flex-wrap:wrap}
.cp-dialog .hint{overflow-wrap:anywhere}
@media(max-width:640px){.cp-fields,.cp-results{grid-template-columns:1fr}.cp-wide{grid-column:auto}.cp-dialog-body{padding:14px}.cp-values{grid-template-columns:1fr 1fr}}

/* Навигация отдельных модулей и календарь используют общую палитру BI. */
.module-links { display:flex; gap:20px; align-items:center; flex-wrap:wrap; margin-left:auto; }
.module-links .back-link { width:auto; margin:0; }
.attendance-days { display:flex; gap:10px; flex-wrap:wrap; margin:0 0 20px; }
.attendance-days button { font-size:14px; }
@media (max-width:700px) { .module-links {gap:14px; order:3; width:100%;} .attendance-days {gap:8px;} }
