*{box-sizing:border-box}body{margin:0;background:#0b1221;color:#edf2ff;font:15px system-ui,Segoe UI,Arial}#app{display:flex;min-height:100vh}aside{width:245px;background:#101b30;border-right:1px solid #25364f;padding:25px 17px;display:flex;flex-direction:column}.brand{font-size:17px;letter-spacing:1.3px;font-weight:800;color:#c8d9ff}.brand small{display:block;font-size:10px;letter-spacing:2px;color:#6e9df4;margin-top:7px}nav{display:grid;gap:8px;margin-top:40px}button{font:inherit;cursor:pointer;border:1px solid #365174;background:#1b2c48;color:#e8f0ff;padding:10px 13px;border-radius:9px}button:hover{background:#2a4168}nav button{text-align:left;border:0;background:transparent}nav button.active{background:#243c63;color:#8fbbff}.foot{margin-top:auto;color:#7486a2;font-size:12px}main{flex:1;min-width:0;padding:30px 36px}header{display:flex;justify-content:space-between;gap:20px;align-items:center;border-bottom:1px solid #263852;padding-bottom:22px}h1{font-size:25px;margin:0}header p{color:#879cb9;margin:7px 0 0}.account{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.pill{border-radius:20px;padding:6px 10px;font-size:12px}.offline{background:#48312e;color:#ffc2a7}.online{background:#163f35;color:#91f5c2}section{padding-top:28px}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.card,.panel{background:#142139;border:1px solid #2a3c58;border-radius:13px;padding:20px}.metric{font-size:32px;font-weight:700;margin-top:9px}.muted{color:#90a2bc}.panel{margin-top:18px}.empty{padding:45px;text-align:center;color:#92a8c6;background:#142139;border:1px dashed #375073;border-radius:12px}table{width:100%;border-collapse:collapse}th,td{padding:13px;text-align:left;border-bottom:1px solid #293b54}th{color:#8aa4c7;font-size:12px;text-transform:uppercase}.actions{display:flex;gap:8px;flex-wrap:wrap}select{background:#101d32;color:white;border:1px solid #365174;padding:9px;border-radius:7px}footer{margin-top:30px;color:#7086a5;font-size:12px}.map{height:420px;display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(0deg,#15273c,#15273c 49px,#24384e 50px),repeating-linear-gradient(90deg,transparent,transparent 49px,#24384e 50px);border-radius:10px;color:#9db1cc;text-align:center;padding:30px}@media(max-width:900px){aside{width:175px}main{padding:20px}.cards{grid-template-columns:repeat(2,1fr)}header{flex-direction:column;align-items:flex-start}}@media(max-width:600px){#app{display:block}aside{width:100%;padding:14px}nav{display:flex;overflow:auto;margin-top:12px}.foot{display:none}.cards{grid-template-columns:1fr 1fr}main{padding:14px}}