*{box-sizing:border-box;margin:0;padding:0}
:root{--bg:#f4f7fb;--sidebar:#101828;--sidebar-soft:#1d2939;--card:#fff;--text:#101828;--muted:#667085;--border:#e4e7ec;--primary:#175cd3;--success:#039855;--danger:#d92d20;--warning:#f79009;--purple:#7f56d9;--cyan:#0ba5ec}
body{font-family:Inter,Arial,sans-serif;background:var(--bg);color:var(--text);min-height:100vh}.layout{display:flex;min-height:100vh}aside{width:250px;background:var(--sidebar);color:#fff;padding:24px 18px;position:fixed;top:0;bottom:0;left:0;overflow:auto}.brand{font-size:24px;font-weight:800;margin-bottom:8px}.brand span{color:#53b1fd}.brand-sub{font-size:12px;color:#98a2b3;margin-bottom:32px}nav{display:flex;flex-direction:column;gap:6px}nav a{display:block;padding:12px 14px;border-radius:8px;text-decoration:none;color:#d0d5dd;font-size:14px;transition:.2s}nav a:hover,nav a.active{background:var(--sidebar-soft);color:#fff}main{margin-left:250px;width:calc(100% - 250px);padding:28px}.header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:22px;gap:18px}.header h1{font-size:28px;margin-bottom:6px}.header p{color:var(--muted);font-size:14px;line-height:1.5}.status{background:#ecfdf3;color:#027a48;border:1px solid #abefc6;padding:9px 13px;border-radius:999px;font-size:13px;font-weight:700;white-space:nowrap}.notice{background:#fffaeb;border:1px solid #fedf89;color:#93370d;border-radius:10px;padding:12px 15px;font-size:13px;margin-bottom:16px;line-height:1.5}.filter-bar{display:grid;grid-template-columns:repeat(5,minmax(135px,1fr)) auto auto;gap:12px;align-items:end;background:#fff;border:1px solid var(--border);border-radius:14px;padding:16px;margin-bottom:16px}.filter-group{display:flex;flex-direction:column;gap:6px}.filter-group label{font-size:12px;font-weight:700;color:#475467}.filter-group input,.filter-group select{height:40px;border:1px solid #d0d5dd;border-radius:8px;padding:0 10px;background:#fff;color:#344054;font-size:13px;min-width:0}.btn{height:40px;border:0;border-radius:8px;padding:0 16px;font-weight:700;cursor:pointer}.btn-primary{background:var(--primary);color:#fff}.btn-light{background:#f2f4f7;color:#344054;border:1px solid #d0d5dd}.period{background:#fff;border:1px solid var(--border);border-radius:10px;padding:12px 15px;color:var(--muted);margin-bottom:22px;font-size:13px}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:20px;min-height:124px;box-shadow:0 1px 2px rgba(16,24,40,.04)}.card.blue{border-top:4px solid var(--primary)}.card.green{border-top:4px solid var(--success)}.card.red{border-top:4px solid var(--danger)}.card.orange{border-top:4px solid var(--warning)}.card.purple{border-top:4px solid var(--purple)}.card.cyan{border-top:4px solid var(--cyan)}.card-label{color:var(--muted);font-size:13px;margin-bottom:12px}.card-value{font-size:27px;font-weight:800;letter-spacing:-.5px}.card-foot{margin-top:9px;font-size:12px;color:var(--muted)}.section{margin-top:24px}.section-title{font-size:17px;font-weight:700;margin-bottom:14px}.grid-two{display:grid;grid-template-columns:1fr 1fr;gap:16px}.grid-wide{display:grid;grid-template-columns:1.35fr .65fr;gap:16px}.panel{background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px;min-height:190px;overflow:hidden}.panel h3{font-size:15px;margin-bottom:6px}.panel p{color:var(--muted);font-size:12px;line-height:1.5;margin-bottom:16px}.chart-box{height:310px;position:relative}.chart-box.small{height:260px}.table-wrap{overflow:auto;max-height:460px;border:1px solid var(--border);border-radius:10px}table{width:100%;border-collapse:collapse;font-size:12px;background:#fff}thead th{position:sticky;top:0;background:#f9fafb;color:#475467;text-align:left;padding:10px 12px;border-bottom:1px solid var(--border);white-space:nowrap}tbody td{padding:10px 12px;border-bottom:1px solid #f0f1f3;color:#344054;white-space:nowrap}tbody tr:hover{background:#f9fafb}.loading{color:var(--muted)}.error{color:var(--danger);font-weight:700}.empty{color:var(--muted);padding:20px;text-align:center}.pill{display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;font-size:11px;font-weight:700;background:#f2f4f7;color:#344054}.footnote{margin-top:10px;color:var(--muted);font-size:11px}.metric-positive{color:var(--success)}.metric-negative{color:var(--danger)}
@media(max-width:1250px){.filter-bar{grid-template-columns:repeat(3,1fr)}.cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.grid-two,.grid-wide{grid-template-columns:1fr}.filter-bar{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){aside{display:none}main{margin-left:0;width:100%;padding:18px}.cards,.filter-bar{grid-template-columns:1fr}.header{flex-direction:column}.btn{width:100%}}