body{
 margin:0;
 height:100vh;
 display:flex;
 justify-content:center;
 align-items:center;
 background:var(--bg);
 font-family:Arial;
 transition:.3s;
}

.login-wrapper{
 width:100%;
 max-width:500px;
 padding:15px;
}

.login-card{
 background:var(--card);
 padding:50px;
 border-radius:16px;
 box-shadow:0 10px 30px rgba(0,0,0,.15);
 text-align:center;
}

h2{
 margin:0;
 color:var(--text);
}

.subtitle{
 color:var(--muted);
 margin-bottom:20px;
}

.input-group{
 position:relative;
 margin-bottom:20px;
}

.input-group input{
 width:100%;
 padding:12px;
 border-radius:10px;
 border:1px solid var(--border);
 background:transparent;
 color:var(--text);
 font-size:1em;
}

.input-group label{
 position:absolute;
 left:12px;
 top:50%;
 transform:translateY(-50%);
 color:var(--muted);
 pointer-events:none;
 transition:.2s;
}

.input-group input:focus + label,
.input-group input:valid + label{
 top:-8px;
 background:var(--card);
 padding:0 6px;
 font-size:.75em;
}

.toggle{
 position:absolute;
 right:12px;
 top:50%;
 transform:translateY(-50%);
 cursor:pointer;
}

.btn-login{
 width:100%;
 padding:12px;
 border:none;
 border-radius:12px;
 background:var(--primary);
 color:white;
 font-size:1em;
 cursor:pointer;
}

.theme-switch{
 margin-top:15px;
 font-size:.9em;
 color:var(--text);
}

select{
 padding:5px;
 border-radius:6px;
}