/* styles.css - clean white dashboard look */
:root { --accent:#0b66d1; --muted:#666; --bg:#fff; --card:#fafafa; }
* { box-sizing: border-box; font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; }
body { margin:0; background:var(--bg); color:#222; }
.topbar { display:flex; justify-content:space-between; align-items:center; padding:18px 28px; border-bottom:1px solid #eee; }
.brand h1 { margin:0; font-size:20px; letter-spacing:0.3px; }
.brand .subtitle { color:var(--muted); font-size:12px; margin-top:2px; }
.actions .btn { background:var(--accent); color:#fff; border:0; padding:8px 12px; border-radius:6px; cursor:pointer; }
.container { padding:24px; max-width:1000px; margin:0 auto; }
.card { background:var(--card); border-radius:8px; padding:18px; box-shadow:0 1px 3px rgba(0,0,0,0.03); margin-bottom:16px; }
.grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin-top:12px; }
.stat .label { font-size:13px; color:var(--muted); }
.stat .value { font-weight:600; margin:6px 0; }
.bar { background:#eee; height:10px; border-radius:6px; overflow:hidden; }
.bar span { display:block; height:100%; background:linear-gradient(90deg,var(--accent), #2fa6ff); border-radius:6px; }
.events { list-style:none; padding:0; margin:8px 0 0 0; color:var(--muted); }
.events li { padding:8px 0; border-bottom:1px dashed #eee; font-size:13px; }
@media (max-width:760px) { .grid { grid-template-columns:1fr; } .topbar { padding:12px; } .container { padding:12px; } }