:root{--bg:#f4f7fb;--card:#fff;--text:#172033;--muted:#687386;--primary:#2563eb;--dark:#0f172a;--success:#079455;--danger:#d92d20;--border:#e4e9f1;--shadow:0 12px 35px rgba(15,23,42,.08)}
*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text)}
.topbar{min-height:68px;background:var(--dark);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:12px max(18px,4vw);gap:20px}.brand{color:#fff;text-decoration:none;font-weight:800;font-size:20px}.topbar nav{display:flex;flex-wrap:wrap;gap:8px}.topbar nav a{color:#dbe7ff;text-decoration:none;padding:9px 11px;border-radius:8px}.topbar nav a:hover{background:#1e293b}
.container{max-width:1240px;margin:0 auto;padding:28px 18px 60px}.card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:22px;box-shadow:var(--shadow)}h1,h2{margin-top:0}.muted{color:var(--muted)}.narrow{max-width:680px;margin:30px auto}
.alert{padding:13px 15px;border-radius:10px;margin-bottom:16px}.alert-danger{background:#fee4e2;color:#912018}.alert-success{background:#dcfae6;color:#05603a}
.auth-wrap,.staff-duty{min-height:calc(100vh - 150px);display:grid;place-items:center}.auth-card,.duty-card{width:min(100%,480px);text-align:center}.logo-circle{width:74px;height:74px;border-radius:24px;margin:0 auto 18px;display:grid;place-items:center;background:linear-gradient(145deg,#2563eb,#0f47b8);color:#fff;font-weight:900}
.form-grid{display:grid;gap:14px;text-align:left}.form-grid label,.filter-row label{display:grid;gap:7px;font-size:14px;font-weight:650}input,select{width:100%;padding:12px 13px;border:1px solid #cfd7e6;border-radius:10px;background:#fff;font:inherit}input:focus,select:focus{outline:3px solid #dbeafe;border-color:#60a5fa}
.btn{border:0;border-radius:10px;padding:11px 15px;font:inherit;font-weight:750;cursor:pointer;text-decoration:none;display:inline-flex;justify-content:center;align-items:center}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--primary);color:#fff}.btn-success{background:var(--success);color:#fff}.btn-danger{background:var(--danger);color:#fff}.btn-small{padding:7px 10px}
.page-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:20px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:20px}.stat{display:grid;gap:7px}.stat strong{font-size:34px}.stat span{color:var(--muted)}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.align-start{align-items:start}.action-card{text-decoration:none;color:inherit}.action-card:hover{transform:translateY(-2px)}
.table-card{overflow:hidden}.table-scroll{overflow:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:12px;border-bottom:1px solid var(--border);white-space:nowrap}.pill{display:inline-flex;padding:5px 9px;border-radius:999px;background:#eef2f7;font-size:12px;font-weight:800}.pill.ok{background:#dcfae6;color:#067647}.pill.off{background:#f2f4f7;color:#475467}
.map-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:18px}.map{height:620px;border-radius:18px;box-shadow:var(--shadow);border:1px solid var(--border)}.history-map{height:500px;margin:18px 0}.staff-list{max-height:620px;overflow:auto}.staff-item{display:grid;gap:5px;padding:13px 0;border-bottom:1px solid var(--border)}.staff-item .pill{justify-self:start}.staff-item small{color:var(--muted)}
.filter-row{display:flex;align-items:end;gap:15px;flex-wrap:wrap}.filter-row label{min-width:210px}.duty-icon{font-size:54px}.status-box{padding:16px;border-radius:14px;background:#f2f4f7;display:grid;gap:5px;margin:20px 0}.status-box.active{background:#dcfae6;color:#05603a}.button-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:18px}.metrics div{background:#f8fafc;padding:12px 8px;border-radius:12px;display:grid;gap:4px}.metrics small{color:var(--muted)}.privacy-note{font-size:12px;color:var(--muted);margin-top:18px}.check{display:flex;gap:10px;align-items:flex-start;margin:18px 0}.check input{width:auto;margin-top:4px}.clean-list{line-height:1.8}
@media(max-width:800px){.topbar{align-items:flex-start;flex-direction:column}.container{padding-top:18px}.stats,.grid-2,.map-layout{grid-template-columns:1fr}.map{height:470px}.staff-list{max-height:none}.page-heading{align-items:flex-start;flex-direction:column}.metrics{grid-template-columns:1fr}.button-row{grid-template-columns:1fr}}