.monitoring-link{display:inline-flex;align-items:center;gap:7px;text-decoration:none}
.monitoring-link[hidden]{display:none}
.monitoring-link-icon{display:grid;place-items:center;width:22px;height:22px;border-radius:4px;background:#312d2a;color:#fff;font-size:13px}
.monitoring-body{min-height:100vh;background:#f7f5f3}
.monitoring-shell{width:min(1480px,calc(100% - 48px));margin:0 auto;padding-bottom:48px}
.monitoring-topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:76px}
.monitoring-brand{display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none}
.monitoring-brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:5px;background:#312d2a;color:#fff;font-size:17px}
.monitoring-brand strong,.monitoring-brand small{display:block}
.monitoring-brand strong{font-size:16px}
.monitoring-brand small,.monitoring-top-actions>span{color:var(--muted);font-size:11px}
.monitoring-top-actions{display:flex;align-items:center;gap:12px}
.monitoring-page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:34px 38px;background:linear-gradient(110deg,#312d2a,#534b45);color:#fff;border-radius:4px}
.monitoring-page-head h1{margin:0;font-size:34px;letter-spacing:-.04em}
.monitoring-page-head p:not(.eyebrow){margin:9px 0 0;color:#e6dfdb}
.monitoring-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:16px 0}
.monitoring-summary article{padding:17px 20px;border:1px solid var(--line);border-top:4px solid var(--red);background:#fff}
.monitoring-summary span,.monitoring-summary small{display:block;color:var(--muted);font-size:11px}
.monitoring-summary strong{display:block;margin:3px 0;font-size:28px}
.user-access-summary{margin:0 0 16px;border:1px solid var(--line);background:#fff}
.user-access-summary-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;padding:17px 18px;border-bottom:1px solid var(--line)}
.user-access-summary-head .eyebrow{margin-bottom:5px}
.user-access-summary-head h2{margin:0;font-size:19px}
.user-access-summary-head p:not(.eyebrow){margin:4px 0 0;color:var(--muted);font-size:11px}
.user-summary-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:14px}
.user-summary-card{display:flex;min-width:0;border:1px solid var(--line);border-top:3px solid var(--red);background:#fff;flex-direction:column}
.user-summary-card.inactive{border-top-color:#9b9692;background:#fbfaf9}
.user-summary-identity{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:10px;padding:14px;border-bottom:1px solid #e8e4e1}
.user-avatar{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#312d2a;color:#fff;font-size:15px;font-weight:700}
.user-summary-card.inactive .user-avatar{background:#8b8580}
.user-summary-identity strong,.user-summary-identity span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.user-summary-identity strong{font-size:13px}
.user-summary-identity span{margin-top:2px;color:var(--muted);font-size:10px}
.user-state{padding:3px 7px;border-radius:999px;font-size:9px}
.user-state.active{background:#e5f4ea;color:#1f6c45}
.user-state.inactive{background:#ece9e7;color:#6d655f}
.user-summary-card dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:0;padding:5px 14px 10px}
.user-summary-card dl div{min-width:0;padding:9px 5px;border-bottom:1px solid #eeeae7}
.user-summary-card dl div:nth-child(3){grid-column:1/-1}
.user-summary-card dt{color:var(--muted);font-size:9px;font-weight:700}
.user-summary-card dd{overflow:hidden;margin:3px 0 0;font-size:11px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}
.user-record-filter{margin:auto 14px 13px;border:0;background:transparent;color:#8a3025;font:700 10px inherit;text-align:left;cursor:pointer}
.user-record-filter:hover{text-decoration:underline}
.user-record-filter:disabled{color:#9b9692;cursor:default;text-decoration:none}
.user-summary-empty{grid-column:1/-1;margin:18px;color:var(--muted);text-align:center}
.access-history{border:1px solid var(--line);background:#fff}
.monitoring-controls{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding:17px 18px;border-bottom:1px solid var(--line)}
.monitoring-controls h2{margin:0;font-size:19px}
.monitoring-controls p{margin:4px 0 0;color:var(--muted);font-size:11px}
.monitoring-search span{display:block;margin-bottom:5px;color:var(--muted);font-size:10px;font-weight:700}
.monitoring-search input{width:min(360px,70vw);border:1px solid #8e8883;border-radius:3px;padding:9px 11px;background:#fff;font:13px inherit}
.access-history-table-wrap{overflow-x:auto}
.access-history-table{width:100%;min-width:820px;border-collapse:collapse}
.access-history-table th,.access-history-table td{padding:11px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
.access-history-table th{background:#f7f5f3;color:var(--muted);font-size:11px;font-weight:700}
.access-history-table td{font-size:12px}
.access-history-table td:first-child{white-space:nowrap}
.access-history-email{font-weight:700}
.access-history-scope{display:inline-flex;padding:3px 8px;border-radius:999px;background:#f2e9e4;color:#6f2c20;font-size:10px;font-weight:700}
.access-history-agent{display:block;max-width:300px;overflow:hidden;color:var(--muted);text-overflow:ellipsis;white-space:nowrap}
.access-history-empty{padding:32px!important;color:var(--muted);text-align:center!important}
@media(max-width:780px){
  .monitoring-shell{width:min(100% - 28px,1480px)}
  .monitoring-topbar{align-items:flex-start;padding:14px 0;flex-direction:column}
  .monitoring-top-actions{width:100%;justify-content:space-between}
  .monitoring-page-head{align-items:flex-start;padding:26px;flex-direction:column}
  .monitoring-page-head h1{font-size:28px}
  .monitoring-summary{grid-template-columns:1fr 1fr}
  .user-summary-cards{grid-template-columns:1fr}
  .user-access-summary-head{align-items:flex-start;flex-direction:column}
  .monitoring-controls{align-items:stretch;flex-direction:column}
  .monitoring-search input{width:100%}
}
@media(max-width:480px){
  .monitoring-summary{grid-template-columns:1fr}
  .user-summary-card dl{grid-template-columns:1fr}
  .user-summary-card dl div:nth-child(3){grid-column:auto}
  .monitoring-top-actions>span{display:none}
  .monitoring-top-actions .button{width:100%;text-align:center}
}
