*{box-sizing:border-box}body{color:#172b40;background:#f4f6fa;margin:0;font-family:Arial,Helvetica,sans-serif}button,.button{color:#fff;cursor:pointer;background:#205bd4;border:0;border-radius:8px;padding:11px 17px;font-weight:600;text-decoration:none}button:hover{filter:brightness(.94)}button.secondary,.button.secondary{color:#30445f;background:#eef2f8;border:1px solid #dce3ee}input,select,textarea{font:inherit;color:#172b40;background:#fff;border:1px solid #ccd6e5;border-radius:7px;max-width:100%;padding:11px}label{gap:7px;margin:16px 0;font-size:14px;display:grid}label input[type=checkbox]{width:20px}small{color:#6c7e94}h1{letter-spacing:-1px;margin:10px 0;font-size:32px}h2{font-size:21px}.brand{color:#1b4eb8;margin-bottom:18px;font-size:24px;font-weight:800;text-decoration:none;display:block}.login{max-width:500px;margin:9vh auto;padding:36px}.login h1{font-size:46px;line-height:1.14}.login p{color:#586d86;line-height:1.6}.login form{background:#fff;border:1px solid #dee5ee;border-radius:15px;margin:25px 0;padding:24px}.login button{width:100%}.workspace{grid-template-columns:235px minmax(0,1fr);min-height:100vh;display:grid}aside{background:#fff;border-right:1px solid #dfe6ef;height:100vh;padding:25px 20px;position:sticky;top:0;overflow:auto}aside nav{gap:3px;margin:25px 0;display:grid}nav button{text-align:left;color:#61748e;background:0 0;padding:10px 12px;font-weight:500}nav .active{color:#1b4eb8;background:#e9f0ff}main{padding:30px 38px}header{justify-content:space-between;align-items:center;gap:20px;margin-bottom:25px;display:flex}header small{letter-spacing:1.3px;font-size:11px}.identity{background:#e8edf6;border-radius:6px;padding:9px;font-size:12px}.metrics{grid-template-columns:repeat(3,1fr);gap:16px;display:grid}.metrics article,.card{background:#fff;border:1px solid #dfe6ef;border-radius:12px;padding:24px}.metrics strong{margin-top:10px;font-size:32px;display:block}.card{margin:20px 0}.toolbar{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.toolbar span{color:#74869d;margin-left:auto}.table-wrap{padding:0;overflow:auto}table{border-collapse:collapse;width:100%;font-size:13px}th{text-align:left;text-transform:capitalize;color:#68809b;background:#f8faff;border-bottom:1px solid #e3e9f2;padding:15px}td{overflow-wrap:anywhere;border-bottom:1px solid #edf1f6;max-width:260px;padding:15px}td button{padding:7px 11px;font-size:12px}.empty{text-align:center;color:#73839a;padding:50px}.device-line{border-bottom:1px solid #edf1f6;align-items:center;gap:18px;padding:15px 0;display:flex}.badge{background:#eff1f5;border-radius:6px;padding:6px 9px;font-size:11px}.online{color:#16794e;background:#e2f6ed}.error{color:#a12525;background:#ffe9e9;border-radius:8px;margin:15px 0;padding:15px}.notice{overflow-wrap:anywhere;background:#e9f4ff;border-radius:8px;padding:15px}.notice button{margin-left:12px}.modal{z-index:10;background:#18294480;justify-content:center;align-items:flex-start;padding:4vh 20px;display:flex;position:fixed;inset:0;overflow:auto}.modal .card{width:580px;max-width:100%;margin:0}.actions{justify-content:space-between;align-items:center;gap:12px;display:flex}.detail audio{width:100%;margin:15px 0}footer{color:#8a9bb0;margin-top:30px;font-size:12px}@media (max-width:900px){.workspace{grid-template-columns:170px minmax(0,1fr)}main{padding:20px}.metrics{grid-template-columns:repeat(2,1fr)}header{flex-wrap:wrap}}@media (max-width:600px){.workspace{display:block}aside{height:auto;position:static}aside nav{margin:10px 0;display:flex;overflow:auto}nav button{white-space:nowrap}.metrics{grid-template-columns:1fr 1fr}.login{padding:20px}.login h1{font-size:36px}}
