:root{
    font-family:
        Inter,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    color:#162733;
    background:#edf2f4;
}

*{
    box-sizing:border-box;
}

body.auth-page{
    margin:0;
    min-height:100vh;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:24px;
}

.auth-card{
    width:min(420px,100%);

    background:#fff;

    border:1px solid #d7e0e4;
    border-radius:9px;

    padding:30px;

    box-shadow:
        0 10px 35px
        rgba(20,40,55,.09);
}

.auth-brand{
    display:flex;
    align-items:center;

    gap:13px;

    margin-bottom:28px;
}

.auth-logo{
    width:46px;
    height:46px;

    display:grid;
    place-items:center;

    border-radius:7px;

    background:#173149;
    color:#fff;

    font-weight:800;
    letter-spacing:.04em;
}

.auth-brand h1{
    margin:0;

    font-size:21px;
}

.auth-brand p{
    margin:3px 0 0;

    color:#677680;
    font-size:11px;
}

.auth-card h2{
    margin:
        0
        0
        18px;

    font-size:17px;
}

.auth-card label{
    display:block;

    margin-top:14px;

    font-size:12px;
    font-weight:650;
}

.auth-card input{
    width:100%;

    margin-top:6px;

    padding:
        10px
        11px;

    border:
        1px solid
        #b8c4cb;

    border-radius:5px;

    font:inherit;

    background:#fff;
}

.auth-card input:focus{
    outline:
        2px solid
        #6f93ad;

    outline-offset:1px;
}

.auth-card button{
    width:100%;

    margin-top:21px;

    padding:
        11px
        14px;

    border:0;
    border-radius:5px;

    background:#173149;
    color:#fff;

    font:inherit;
    font-weight:750;

    cursor:pointer;
}

.auth-card button:hover{
    background:#23455f;
}

.auth-error{
    margin-bottom:13px;

    padding:
        9px
        11px;

    border-left:
        4px solid
        #c43b3b;

    background:#fff0ef;

    font-size:12px;
}

.auth-foot{
    margin-top:22px;

    color:#76838b;

    font-size:10px;
    text-align:center;
}
