:root{--ink:#172033;--muted:#64748b;--line:#dbe5ef;--bg:#f4f7fb;--nav:#081827;--teal:#0b7c8d;--aqua:#1fb7bf;--ok:#087f5b;--warn:#b45309;--err:#b91c1c;--card:#fff}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,Arial,Helvetica,sans-serif}button,input,select{font:inherit}button{cursor:pointer}
.hidden{display:none!important}.login-shell{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#07162c,#0b7c8d)}.login-panel{width:min(420px,92vw);background:white;padding:34px;border-radius:8px;box-shadow:0 24px 70px #001a2b55}.login-logo{width:82px;height:82px;object-fit:contain}.login-panel h1{margin:16px 0 24px;font-size:26px}.login-panel label{display:block;margin:14px 0;color:var(--muted);font-size:13px}.login-panel input{width:100%;margin-top:6px;border:1px solid var(--line);border-radius:6px;padding:12px}.login-panel button,.topbar button,.filters button,.dialog-actions button{border:0;border-radius:6px;background:var(--teal);color:white;padding:11px 16px;font-weight:700}.error-text{color:var(--err);min-height:20px}
.app-shell{display:grid;grid-template-columns:270px 1fr;min-height:100vh}.sidebar{background:var(--nav);color:white;padding:18px;position:sticky;top:0;height:100vh}.brand{display:flex;align-items:center;gap:12px;font-size:20px;font-weight:800;margin-bottom:22px}.brand img{width:44px;height:44px;background:white;border-radius:6px}.sidebar nav{display:grid;gap:8px}.sidebar nav button,#logoutForm button{width:100%;text-align:left;background:transparent;border:1px solid #ffffff22;color:#d9eef2;border-radius:6px;padding:11px}.sidebar nav button.active{background:#0b7c8d;color:white}#logoutForm{position:absolute;left:18px;right:18px;bottom:18px}
.content{min-width:0}.topbar{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:22px 28px;background:white;border-bottom:1px solid var(--line)}.topbar h1{margin:0;font-size:24px}.topbar p{margin:6px 0 0;color:var(--muted)}
.view{display:none;padding:24px 28px}.view.active{display:block}.grid{display:grid;gap:16px}.metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.card{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:18px}.metric span{display:block;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.06em}.metric b{display:block;font-size:30px;margin-top:8px}.section-title{font-size:18px;margin:8px 0 12px}
.charts{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:16px}.bar-row{display:grid;grid-template-columns:180px 1fr 54px;gap:10px;align-items:center;margin:9px 0}.bar{height:12px;background:#e8eef5;border-radius:4px;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--teal),var(--aqua))}
.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}.filters input,.filters select{border:1px solid var(--line);border-radius:6px;padding:10px;background:white}.table-wrap{overflow:auto;background:white;border:1px solid var(--line);border-radius:8px}table{border-collapse:collapse;width:100%;min-width:1180px}th,td{padding:11px 12px;border-bottom:1px solid #e7edf4;text-align:left;font-size:13px}th{background:#f8fafc;color:#334155;position:sticky;top:0}tr:hover td{background:#f7fcff}.pill{display:inline-block;padding:4px 8px;border-radius:999px;font-size:12px;font-weight:800}.ok{background:#dcfce7;color:#166534}.warn{background:#fef3c7;color:#92400e}.err{background:#fee2e2;color:#991b1b}.muted{background:#e2e8f0;color:#475569}.pagination{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}.pagination button{border:1px solid var(--line);background:white;border-radius:6px;padding:8px 12px}.status-list{grid-template-columns:repeat(3,minmax(0,1fr))}.report-actions{display:flex;gap:8px}.link-btn{border:1px solid var(--teal);background:white;color:var(--teal);border-radius:6px;padding:7px 10px}dialog{border:0;border-radius:8px;box-shadow:0 30px 90px #001a2b55;max-width:920px;width:88vw}#reportDialog{width:94vw;max-width:1280px;height:90vh}#reportFrame{width:100%;height:calc(100% - 48px);border:1px solid var(--line)}.timeline{border-left:3px solid var(--line);padding-left:16px}.timeline div{margin:12px 0}.empty{color:var(--muted);padding:20px;background:white;border:1px solid var(--line);border-radius:8px}
@media(max-width:900px){.app-shell{grid-template-columns:1fr}.sidebar{height:auto;position:relative}.sidebar nav{grid-template-columns:1fr 1fr}.metrics,.charts,.status-list{grid-template-columns:1fr}.topbar{align-items:flex-start;flex-direction:column}.view{padding:16px}.bar-row{grid-template-columns:120px 1fr 42px}#logoutForm{position:static;margin-top:12px}}
