:root {
    --accent: #3b82f6;
    --accent-soft: rgba(59,130,246,0.25);
    --text: #e5e7eb;
    --muted: #9ca3af;
    --danger: #ef4444;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{
    height:100vh;
    width:100vw;
    font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    display:flex;
    justify-content:center;
    align-items:center;
    background:radial-gradient(circle at top, #0c1220, #00040c 65%);
    color:var(--text);
}
.login-card{
    width:330px;
    background:#020617;
    padding:30px 26px;
    border-radius:18px;
    border:1px solid rgba(148,163,184,0.28);
    box-shadow:0 20px 40px rgba(0,0,0,0.5);
    text-align:center;
}
h2{
    margin-bottom:4px;
    font-size:1.4rem;
    font-weight:600;
}
.sub{
    color:var(--muted);
    font-size:.78rem;
    margin-bottom:15px;
}
label{
    text-align:left;
    display:block;
    color:var(--muted);
    font-size:.75rem;
    margin-bottom:5px;
    margin-top:12px;
}
input{
    width:100%;
    padding:10px;
    border-radius:10px;
    background:#0a0f1b;
    border:1px solid rgba(148,163,184,0.5);
    color:var(--text);
    outline:none;
    font-size:.9rem;
}
input:focus{
    border-color:var(--accent);
    box-shadow:0 0 0 1px var(--accent-soft);
}
button{
    width:100%;
    margin-top:20px;
    padding:10px;
    border-radius:10px;
    border:none;
    background:linear-gradient(135deg,#3b82f6,#6366f1);
    color:white;
    font-size:.9rem;
    cursor:pointer;
    font-weight:600;
}
.error{
    margin-top:12px;
    color:var(--danger);
    font-size:.8rem;
}