*{

margin:0;
padding:0;
box-sizing:border-box;
font-family:Arial, sans-serif;

}



body{

background:#050505;

min-height:100vh;

display:flex;

justify-content:center;

align-items:center;

color:white;

}



.login-wrapper{

width:100%;

display:flex;

flex-direction:column;

align-items:center;

}



.login-card{


width:600px;

background:#201900;

border:3px solid #009ee8;

border-radius:25px;

padding:35px 30px 30px;


box-shadow:
0 0 15px rgba(0,158,232,.3);


}



.back{

color:white;

font-size:20px;

text-decoration:none;

display:inline-flex;

gap:10px;

margin-bottom:15px;

}



h1{

text-align:center;

font-size:50px;

margin-top:5px;

}



.subtitle{

text-align:center;

font-size:25px;

font-weight:bold;

margin-bottom:20px;

}



label{

display:block;

font-size:23px;

font-weight:bold;

margin:15px 0 10px;

}



label span{

color:red;

}



.input-box{

position:relative;

}



.input-box input{


width:100%;

height:72px;

border-radius:12px;

border:2px solid #00a5ed;

background:white;

font-size:23px;

padding:0 20px;

outline:none;

}



.password-box i{


position:absolute;

right:25px;

top:25px;

font-size:25px;

color:#999;

cursor:pointer;

}




button{


margin-top:30px;

width:100%;

height:65px;

border-radius:40px;

border:1px solid white;

background:#ffd52f;

font-size:25px;

font-weight:bold;

cursor:pointer;


}



button:hover{

background:#fff;

}



.line{

height:1px;

background:#008ccf;

margin-top:35px;

}



.warning{


max-width:600px;

text-align:center;

font-size:18px;

font-weight:bold;

line-height:1.4;

margin-top:35px;

}



@media(max-width:650px){


.login-card{

width:90%;

}



h1{

font-size:38px;

}



.subtitle{

font-size:18px;

}



label{

font-size:18px;

}


.input-box input{

height:55px;

font-size:18px;

}


}
.error{

color:#ff4444;

font-size:16px;

margin-top:8px;

font-weight:bold;

}



.success{

color:#00ff66;

font-size:18px;

margin-top:15px;

font-weight:bold;

}