*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:Inter,Arial,sans-serif;
}

body{

    min-height:100vh;

    display:flex;

    justify-content:center;

    align-items:center;

    background:#f5f5f5;

}

.background{

    width:100%;

    min-height:100vh;

    display:flex;

    justify-content:center;

    align-items:center;

    padding:20px;

    background:
        radial-gradient(circle at top,#ffe169,#f5f5f5 60%);
}

.login-card{

    width:100%;

    max-width:430px;

    background:#fff;

    border-radius:24px;

    padding:45px;

    box-shadow:0 20px 45px rgba(0,0,0,.08);

    animation:show .35s ease;
}

@keyframes show{

    from{

        opacity:0;
        transform:translateY(20px);

    }

    to{

        opacity:1;
        transform:translateY(0);

    }

}

.logo{

    margin:auto;

    margin-bottom:20px;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:36px;

}

h1{

    text-align:center;

    color:#222;

    margin-bottom:8px;

}

.subtitle{

    text-align:center;

    color:#666;

    margin-bottom:35px;

}

.input-group{

    margin-bottom:20px;

}

.input-group label{

    display:block;

    margin-bottom:8px;

    font-weight:600;

}

input{

    width:100%;

    padding:14px;

    border:1px solid #ddd;

    border-radius:12px;

    font-size:15px;

    transition:.2s;

}

input:focus{

    outline:none;

    border-color:#ffd21f;

    box-shadow:0 0 0 4px rgba(255,210,31,.25);

}

button{

    width:100%;

    padding:15px;

    border:none;

    border-radius:12px;

    background:#ffd21f;

    font-size:16px;

    font-weight:bold;

    cursor:pointer;

    transition:.2s;

}

button:hover{

    background:#ffc800;

    transform:translateY(-2px);

}

button:active{

    transform:translateY(0);

}

#error{

    text-align:center;

    color:#ef4444;

    margin-top:18px;

    font-weight:bold;

    min-height:20px;

}

/* Планшеты */

@media (max-width:768px){

.login-card{

    padding:35px;

}

.logo{

    width:70px;
    height:70px;
    font-size:30px;

}

}

/* Телефоны */

@media (max-width:480px){

.login-card{

    padding:25px;

    border-radius:18px;

}

.logo{

    width:60px;
    height:60px;
    font-size:28px;

}

h1{

    font-size:26px;

}

.subtitle{

    font-size:15px;

}

input{

    font-size:15px;

}

button{

    font-size:15px;

}

}