.modal{

    position:fixed;

    inset:0;

    display:flex;

    justify-content:center;

    align-items:center;

    background:rgba(0,0,0,.45);

    z-index:10000;

}

.modal-box{

    background:#fff;

    padding:2rem;

    border-radius:.75rem;

    min-width:320px;

    display:flex;
    flex-direction:column;
    gap:1rem;

    box-shadow:
        0 10px 40px rgba(0,0,0,.25);

}

.modal-box input{

    padding:.6rem .8rem;
    font-size:1rem;

}

.modal-box button{

    padding:.7rem;
    cursor:pointer;

}

.auth-switch{

    margin-top:1rem;

    margin-bottom:.3rem;

    text-align:center;

    font-size:.9rem;

    color:#666;

}

.auth-switch-link{

    display:block;

    text-align:center;

    font-weight:bold;

    text-decoration:none;

}

.auth-switch-link:hover{

    text-decoration:underline;

}

.auth-link{

    color:#ffffff;

    text-decoration:none;

    font-size:.9rem;

}

.auth-link:hover{

    text-decoration:underline;

}

.auth-user{

    color:#ffffff;

    font-size:.9rem;

    font-weight:500;

    white-space:nowrap;

}