*{box-sizing:border-box}body{color:#17202a;background:#f4f6f8;margin:0;font-family:Inter,system-ui,Arial}main{min-height:100vh;display:flex}aside{color:#fff;background:#111827;width:250px;height:100vh;padding:24px;position:sticky;top:0}h1{margin:0 0 24px;font-size:22px}aside button{color:#fff;text-align:left;cursor:pointer;background:#1f2937;border:0;border-radius:10px;width:100%;margin:8px 0;padding:12px 14px;display:block}aside button.active,aside button:hover{background:#f97316}.content{flex:1;padding:28px}.card{background:#fff;border-radius:18px;padding:22px;box-shadow:0 10px 30px #0001}.grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;display:grid}.metric{background:#fff;border-radius:18px;padding:22px;box-shadow:0 10px 30px #0001}.metric span{color:#6b7280;display:block}.metric strong{font-size:26px}.form{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:16px 0 24px;display:grid}.form input,.form select{border:1px solid #d1d5db;border-radius:10px;padding:12px}.form button,.table button{color:#fff;cursor:pointer;background:#111827;border:0;border-radius:10px;padding:10px 12px}.table{overflow:auto}table{border-collapse:collapse;width:100%}th,td{text-align:left;white-space:nowrap;border-bottom:1px solid #e5e7eb;padding:12px}th{text-transform:uppercase;color:#6b7280;font-size:12px}.danger{margin-left:8px;background:#dc2626!important}@media (width<=760px){main{display:block}aside{width:100%;height:auto;position:relative}.content{padding:16px}}