/* Pages de compte : connexion, code, inscription, mot de passe, invitation. */

.account {
    display: grid;
    justify-items: center;
    gap: var(--space-5);
    padding: var(--space-12) var(--space-4) var(--space-16);
    background: var(--surface-subtle);
}

.account__card {
    display: grid;
    gap: var(--space-5);
    width: 100%;
    max-width: 440px;
    padding: var(--space-8) var(--space-6);
    border: var(--border-width) solid var(--border-default);
    border-radius: var(--radius-lg);
    background: var(--surface-card);
}

@media (min-width: 600px) {
    .account__card {
        padding: var(--space-10) var(--space-8);
    }
}

.account__title {
    font: var(--type-h2);
}

.account__intro {
    color: var(--text-secondary);
}

.account__links,
.account__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-5);
    align-items: center;
    font: var(--type-body-sm);
}

.account__aside {
    font: var(--type-body-sm);
    color: var(--text-secondary);
}