*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,Arial,sans-serif;background:#0b1020;color:#e8edf7}header{height:64px;padding:0 28px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #242c40;background:#11172a}.container{max-width:1180px;margin:0 auto;padding:40px 24px}.hero{display:flex;justify-content:space-between;align-items:end;margin-bottom:24px}.hero h1{font-size:34px;margin:0}.hero p,.card p,small{color:#9ca8be}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}.card{background:#151d32;border:1px solid #29334b;border-radius:16px;padding:24px;box-shadow:0 10px 30px rgba(0,0,0,.18)}.card h2{margin:8px 0}.status{width:11px;height:11px;border-radius:50%}.online{background:#46d68c;box-shadow:0 0 14px #46d68c}.offline{background:#657087}.login{min-height:100vh;display:grid;place-items:center;padding:24px}.login .card{width:min(420px,100%)}label{display:block;margin:18px 0;color:#b7c1d2}input{width:100%;padding:13px;margin-top:7px;border-radius:10px;border:1px solid #36415b;background:#0f1526;color:#fff}button{width:100%;padding:13px;border:0;border-radius:10px;background:#edf2ff;color:#11182b;font-weight:700;cursor:pointer}.ghost{width:auto;padding:9px 14px;background:#202943;color:#fff}form{margin:0}