.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:9px 13px; border-radius:12px; font-size:14px; font-weight:600; cursor:pointer;
  border:1px solid var(--pri); background:var(--pri); color:var(--pri-ink);
}
.btn:hover{ filter:brightness(.95); }
.btn:active{ opacity:.9; }
.btn.ghost{ background:#fff; color:#1a1a1a; border-color:var(--pri); }
.btn.ghost:hover{ background:#f0f7ea; }
.btn.warn{ background:#fff; color:#9a6700; border-color:#f3d18e; }
.btn.logout{ background:#b42318; border-color:#b42318; color:#fff; }
.btn.logout:hover{ filter:brightness(.95); }
.btn.logout:active{ opacity:.9; }
.btn[disabled]{ opacity:.6; cursor:not-allowed; filter:grayscale(1); }


.input,select,textarea{
  width:100%; border:1px solid var(--br); border-radius:12px;
  padding:10px 12px; background:#fff; font-size:15px;
}


.card{ background:#fff; border:1px solid var(--br); border-radius:16px; padding:12px; }
table{ width:100%; border-collapse:collapse; }
th{
  font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--mut);
  text-align:left; border-bottom:1px solid var(--br); padding:8px;
}
td{ padding:8px; border-bottom:1px solid var(--br); vertical-align:top; }
.mono{ font-family:ui-monospace,Menlo,Consolas,monospace; }
.mut{ color:#666; font-size:12px; }
.pill{ display:inline-flex; align-items:center; border:1px solid var(--pri); padding:4px 8px; border-radius:999px; font-size:12px; background:#fff; }
#table .pill{ margin-left:6px; }
.danger{ color:#b42318; }
.ok{ color:#067647; }


video{ width:100%; max-height:300px; border-radius:12px; border:1px solid var(--br); background:#000; }
.overlay{ position:fixed; inset:0; background:#0006; display:flex; align-items:center; justify-content:center; padding:12px; z-index:9999; }
.overlay[hidden]{ display:none !important; }
.dialog{
  max-width:860px; width:100%;
  background:#fff; border:1px solid var(--br); border-radius:16px;
  padding:12px; max-height:90vh; overflow:auto;
  -ms-overflow-style:none; scrollbar-width:none;
}
.dialog::-webkit-scrollbar{ display:none; }
.grid.grid-2 > div .mut{ display:block; margin-bottom:4px; }
.dialog .input{ font-size:16px; }


.kpi-value{ font-weight:700; font-size:22px; }
.kpi-value.danger { color: #c43e00; }