:root{--ok:#2e7d32;--bad:#c62828;--muted:#777;--bg:#0f172a;--card:#111827;--text:#e5e7eb;--accent:#2563eb}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,Segoe UI,Roboto,Ubuntu,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text)}
header{display:flex;align-items:center;justify-content:space-between;padding:16px;background:#0b1220;border-bottom:1px solid #1f2937}
h1{margin:0;font-size:20px}
.controls button{margin-right:8px}
main{padding:16px;display:grid;gap:16px;grid-template-columns:1fr}
section{background:var(--card);padding:16px;border-radius:8px;border:1px solid #1f2937}
table{width:100%;border-collapse:collapse;margin-top:12px}
th,td{border-bottom:1px solid #1f2937;padding:8px;text-align:left}
.badge{padding:4px 8px;border-radius:999px;font-size:12px}
.badge.ok{background:color-mix(in oklab, var(--ok) 30%, transparent);color:var(--text)}
.badge.bad{background:color-mix(in oklab, var(--bad) 30%, transparent);color:var(--text)}
.chart-container{position:relative;height:320px}
.chart-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.last-update{color:var(--muted);font-size:12px}
.pagination{display:flex;align-items:center;gap:8px;margin-top:8px}
.pagination button{padding:6px 10px}
.pagination #pageInfo{color:var(--muted)}
footer{padding:16px;color:var(--muted);text-align:center}
input,select,button{background:#0b1220;color:var(--text);border:1px solid #1f2937;border-radius:6px;padding:8px}
button{cursor:pointer}

/* Chips for assigned users */
.chip{display:inline-block;padding:8px 10px;border:1px solid #334155;border-radius:999px;background:#0b1220;}

/* Modal */
.modal{position:fixed;inset:0;background:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center;z-index:1000}
.modal-card{width:100%;max-width:480px;background:#111827;border:1px solid #1f2937;border-radius:8px;padding:16px}
.modal-card h3{margin-top:0}
.modal-card .row{display:flex;flex-direction:column;margin-bottom:12px}
.modal-card .actions{display:flex;justify-content:flex-end;gap:8px}
.modal-card .actions .danger{background:#c62828;color:#fff;border-color:#c62828}