:root{--bg:#f5f7fb;--sidebar:#111827;--primary:#2563eb;--text:#111827;--muted:#6b7280;--card:#fff;--border:#e5e7eb}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.app-shell{display:flex;min-height:100vh}
.sidebar{width:270px;background:var(--sidebar);color:#fff;padding:22px;position:fixed;left:0;top:0;bottom:0;z-index:10}
.brand{display:flex;gap:12px;align-items:center;margin-bottom:28px}
.brand-icon{width:42px;height:42px;border-radius:14px;background:#2563eb;display:grid;place-items:center;font-size:22px}
.brand-title{font-weight:800;line-height:1}
.brand-subtitle{font-size:12px;color:#9ca3af}
.sidebar .nav-link{color:#cbd5e1;border-radius:12px;padding:11px 12px;margin-bottom:6px;display:flex;gap:10px;align-items:center}
.sidebar .nav-link:hover,.sidebar .nav-link.active{background:#1f2937;color:#fff}
.main{margin-left:270px;width:calc(100% - 270px)}
.topbar{background:#fff;border-bottom:1px solid var(--border);padding:18px 26px;display:flex;align-items:center;justify-content:space-between;gap:18px;position:sticky;top:0;z-index:5}
.topbar h1{font-size:22px;margin:0;font-weight:800}
.topbar p{margin:2px 0 0;color:var(--muted);font-size:13px}
.userbox{display:flex;align-items:center;gap:12px}
.content{padding:26px}
.card-soft,.metric-card{background:var(--card);border:1px solid var(--border);border-radius:18px;box-shadow:0 10px 25px rgba(15,23,42,.04)}
.card-soft{padding:20px}
.metric-card{padding:20px;display:flex;align-items:center;justify-content:space-between}
.metric-card span{color:var(--muted);font-size:13px}
.metric-card strong{display:block;font-size:30px;line-height:1.1;margin-top:6px}
.metric-card i{font-size:28px}
.card-header-soft{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.card-header-soft h5,.card-soft h5{margin:0;font-weight:800}
.table{margin-bottom:0}
.table th{font-size:12px;color:#64748b;text-transform:uppercase;letter-spacing:.04em}
.timeline{display:flex;flex-direction:column;gap:12px}
.timeline-item{border-left:3px solid #2563eb;padding-left:12px}
.timeline-item small{color:var(--muted)}
.empty-state{text-align:center;padding:50px 20px;color:var(--muted)}
.empty-state i{font-size:46px;color:#94a3b8}
.auth-body{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#111827,#1d4ed8)}
.auth-card{width:min(440px,92vw);background:#fff;border-radius:22px;padding:28px;box-shadow:0 30px 80px rgba(0,0,0,.25)}
.auth-logo{width:58px;height:58px;border-radius:18px;background:#2563eb;color:#fff;display:grid;place-items:center;margin:0 auto 14px;font-weight:900}
.form-control,.form-select,.btn{border-radius:12px}
.btn-primary{background:#2563eb;border-color:#2563eb}
@media(max-width:991px){
 .sidebar{transform:translateX(-100%);transition:.2s}
 .sidebar.show{transform:translateX(0)}
 .main{margin-left:0;width:100%}
 .topbar{padding:14px;gap:12px}
 .content{padding:16px}
 .userbox .badge{display:none}
}