*{box-sizing:border-box}body{margin:0;font:14px Arial,sans-serif;background:#f5f7fb;color:#172033}.app{display:grid;grid-template-columns:210px 1fr;min-height:100vh}aside{background:#182338;color:#fff;padding:20px}.brand{font-size:22px;font-weight:800;margin-bottom:22px}aside a{display:block;color:#d5ddea;text-decoration:none;padding:10px;border-radius:8px;margin:4px 0}aside a:hover{background:#253754}main{padding:22px}.top{display:flex;justify-content:space-between;align-items:center}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.card{background:#fff;border:1px solid #e4e8f0;border-radius:12px;padding:16px;margin-bottom:14px}.num{font-size:30px;font-weight:800}.muted{color:#667085;font-size:12px}.table{overflow:auto;background:#fff;border:1px solid #e4e8f0;border-radius:12px}table{width:100%;border-collapse:collapse}th,td{padding:10px;border-bottom:1px solid #eee;text-align:left}input,select,textarea{width:100%;padding:9px;border:1px solid #ccd3dd;border-radius:8px}textarea{min-height:130px}.form{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.full{grid-column:1/-1}.btn{background:#2f80ed;color:#fff;border:0;padding:9px 12px;border-radius:8px;cursor:pointer;text-decoration:none;display:inline-block}.badge{display:inline-block;padding:4px 8px;border-radius:999px;background:#eef4ff;color:#245fb7;font-size:11px}@media(max-width:900px){.grid{grid-template-columns:repeat(2,1fr)}.app{grid-template-columns:75px 1fr}.form{grid-template-columns:1fr}aside a{font-size:0}aside a:before{content:'•';font-size:20px}}
