html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    background: linear-gradient(160deg, rgba(var(--brand-green-rgb), .10) 0%, var(--app-subtle-bg) 55%);
}

.login-container {
    display: flex;
    min-height: 100%;
    margin: 0 auto;
    justify-content: center;
    align-items: center;
    padding: 2rem 1rem;
}

.login-card {
    width: 100%;
    max-width: 380px;
    background: var(--app-surface);
    border-radius: .75rem;
    border-top: 4px solid var(--brand-gold);
    box-shadow: 0 .75rem 2rem rgba(0, 0, 0, .08);
    padding: 2rem;
}

.login-logo {
    margin-bottom: 1rem;
}

.login-card .btn-primary {
    background-color: var(--brand-green);
    border-color: var(--brand-green);
}

.login-card .btn-primary:hover,
.login-card .btn-primary:focus {
    background-color: var(--brand-green-dark);
    border-color: var(--brand-green-dark);
}

/* Links de texto; links com aparência de botão (ex.: "Gerar novo link" em user/reset) ficam com as cores do botão */
.login-card a:not(.btn) {
    color: var(--brand-green-fg);
}

.login-card a:not(.btn):hover {
    color: var(--brand-green-fg-strong);
}

.login-footer {
    color: var(--app-muted);
    font-size: .875rem;
}