body{margin:0;font-family:system-ui;background:#f3f5fa}
.wrap{display:grid;grid-template-columns:240px 1fr;min-height:100vh}
.sidebar{background:#fff;padding:16px}
.brand{display:flex;gap:10px;align-items:center;font-size:18px}
.logo{width:32px;height:32px;background:#2f6fed;border-radius:8px}
.sidebar nav a{display:block;padding:10px;margin-top:6px;color:#333;text-decoration:none}
.sidebar nav a.active{background:#e5ecff;border-radius:10px}
.main{padding:20px}
.topbar{display:flex;gap:10px;align-items:center}
.grid{display:grid;gap:14px;margin-top:14px}
.grid-4{grid-template-columns:repeat(4,1fr)}
.grid-2{grid-template-columns:1.5fr 1fr}
.card,.panel{background:#fff;border-radius:14px;padding:16px}
.kpi{font-size:26px;font-weight:900}
@media(max-width:900px){.wrap{grid-template-columns:1fr}.grid-4{grid-template-columns:repeat(2,1fr)}.grid-2{grid-template-columns:1fr}}