Nebula — Dark Console Login with 2FA

<div class="nb-stars"></div><div class="nb-glow"></div>
<div class="nb-card p-4 p-md-5">
  <div class="text-center mb-4"><i class="bi bi-moon-stars-fill fs-1" style="color:#a78bfa"></i><h4 class="fw-bold text-white mt-2 mb-0">Atlas Console</h4><span class="small" style="color:#5b6b92">convertatlas.org · admins only</span></div>
  <input type="email" class="form-control mb-3" placeholder="Admin email">
  <input type="password" class="form-control mb-3" placeholder="Password">
  <input class="form-control text-center nb-otp mb-4" maxlength="6" placeholder="2FA code">
  <button class="btn btn-nb text-white w-100 mb-3">Authenticate</button>
  <div class="d-flex justify-content-between small"><a href="#" class="text-decoration-none" style="color:#7d8db1">Use backup code</a><a href="#" class="text-decoration-none" style="color:#7d8db1">Contact admin</a></div>
</div>
<div style="text-align:center;padding:18px 12px;font:500 12px system-ui;opacity:.6">Template by <a href="https://convertatlas.org" style="color:inherit;font-weight:700;text-decoration:none">ConvertAtlas</a> · Developer Tools</div>

body{min-height:100vh;margin:0;display:grid;place-items:center;background:#070b16;font-family:'Segoe UI',system-ui,sans-serif;position:relative;overflow:hidden;padding:20px}
.nb-stars{position:absolute;inset:0;background-image:radial-gradient(2px 2px at 20% 30%,#fff,transparent),radial-gradient(1.5px 1.5px at 70% 20%,#93c5fd,transparent),radial-gradient(2px 2px at 85% 65%,#fff,transparent),radial-gradient(1.5px 1.5px at 40% 80%,#c4b5fd,transparent),radial-gradient(1px 1px at 60% 50%,#fff,transparent),radial-gradient(1.5px 1.5px at 10% 70%,#93c5fd,transparent);animation:nb-tw 4s ease-in-out infinite alternate}
@keyframes nb-tw{from{opacity:.5}to{opacity:1}}
.nb-glow{position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(124,58,237,.28),transparent 65%);top:50%;left:50%;transform:translate(-50%,-50%)}
.nb-card{background:#0d1426;border:1px solid #1e2b4d;border-radius:20px;max-width:380px;width:100%;color:#dbe2f0;position:relative;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.nb-card .form-control{background:#101a33;border:1px solid #233458;color:#fff;border-radius:12px;padding:.7rem .9rem}
.nb-card .form-control:focus{border-color:#7c3aed;box-shadow:0 0 0 .2rem rgba(124,58,237,.2);background:#101a33;color:#fff}
.nb-card .form-control::placeholder{color:#5b6b92}
.btn-nb{background:linear-gradient(90deg,#7c3aed,#4f46e5);border:0;border-radius:12px;padding:.7rem;font-weight:600;box-shadow:0 8px 24px rgba(99,70,229,.4)}
.nb-otp{letter-spacing:.4em}