.auth-section {
    background: linear-gradient(180deg, #f3f8ff, #fff);
}

.auth-section .auth-card {
    border: 1px solid #d8e6f5;
    border-top: 2px solid #2f80ed;
    border-radius: 6px;
    background: #fff;
    box-shadow: none;
}

.auth-section .auth-card h3 {
    color: #10233f;
    font: 650 25px/1.45 "Avenir Next", "PingFang SC", "Microsoft YaHei", sans-serif;
    letter-spacing: -.4px;
}

.auth-section .auth-card .badge {
    border-color: #d8e6f5;
    color: #173b75;
    background: #edf5ff;
}

.auth-section .auth-card .form-stack input:not([type="checkbox"]) {
    border-color: #d8e6f5;
    border-radius: 6px;
}

.auth-section .auth-card .form-stack input:not([type="checkbox"]):focus-visible,
.auth-section .auth-card :is(button, a):focus-visible {
    outline: 3px solid #2f80ed;
    outline-offset: 3px;
}

.auth-section .auth-card .actions .button {
    border-color: #173b75;
    border-radius: 6px;
    background: #173b75;
    color: #fff;
}

.auth-section .auth-card .actions .button:hover {
    border-color: #2f80ed;
    background: #2f80ed;
}

@media (max-width: 700px) {
    .auth-section {
        align-items: flex-start;
        padding: 32px 0 48px;
    }

    .auth-section .auth-card {
        padding: 22px 18px;
    }
}
