*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins}

body{
    height:100vh;
    background:linear-gradient(135deg,#0f2027,#203a43,#2c5364);
    overflow:hidden;
}

.bg{
    position:absolute;
    width:100%;height:100%;
    background:url('https://www.transparenttextures.com/patterns/cubes.png');
    opacity:.15;
}

.login-wrapper{
    height:100vh;
    display:flex;
    justify-content:center;
    align-items:center;
}

.login-box{
    width:380px;
    background:rgba(255,255,255,.1);
    backdrop-filter:blur(18px);
    padding:35px;
    border-radius:18px;
    box-shadow:0 30px 60px rgba(0,0,0,.4);
    color:#fff;
    text-align:center;
}

.login-box h2{
    font-weight:600;
    letter-spacing:2px;
}

.sub{
    font-size:13px;
    color:#ccc;
    margin-bottom:20px;
}

.field{
    position:relative;
    margin:22px 0;
}

.field input{
    width:100%;
    padding:12px;
    background:transparent;
    border:none;
    border-bottom:1px solid #aaa;
    color:#fff;
    outline:none;
}

.field label{
    position:absolute;
    left:0;top:12px;
    color:#aaa;
    font-size:13px;
    pointer-events:none;
    transition:.3s;
}

.field input:focus + label,
.field input:valid + label{
    top:-8px;
    font-size:11px;
    color:#00e6ff;
}

.toggle{
    position:absolute;
    right:0;top:12px;
    cursor:pointer;
}

button{
    width:100%;
    padding:12px;
    border:none;
    background:linear-gradient(135deg,#00e6ff,#0072ff);
    color:#000;
    font-weight:600;
    border-radius:30px;
    cursor:pointer;
    position:relative;
}

.loader{
    display:none;
    width:18px;height:18px;
    border:2px solid #000;
    border-top:2px solid transparent;
    border-radius:50%;
    animation:spin 1s linear infinite;
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
}

@keyframes spin{
    to{transform:rotate(360deg) translate(-50%,-50%)}
}

.error{
    background:#ff4d4d;
    padding:8px;
    border-radius:6px;
    font-size:13px;
    margin-bottom:10px;
}

.footer{
    margin-top:15px;
    font-size:11px;
    color:#ccc;
}
