.f-mise-a-jour {
    width: min(42rem, 94vw);
    max-height: 85vh;
    padding: 0;
    border: 1px solid var(--trait);
    border-top: 3px solid var(--or);
    border-radius: var(--rayon);
    background: var(--surface-2);
    color: var(--texte);
    box-shadow: 0 8px 30px rgba(0, 0, 0, .5);
}

.f-mise-a-jour[open] {
    display: flex;
    flex-direction: column;
    animation: f-mise-a-jour-entree .25s ease-out;
}

.f-mise-a-jour::backdrop {
    background: rgba(0, 0, 0, .75);
}

.f-mise-a-jour-entete,
.f-mise-a-jour-pied {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .9rem 1.25rem;
}

.f-mise-a-jour-entete {
    border-bottom: 1px solid var(--trait);
}

.f-mise-a-jour-entete h2 {
    font-family: var(--titre);
    color: var(--or);
}

.f-mise-a-jour-corps {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 1rem 1.25rem;
}

.f-mise-a-jour-pied {
    border-top: 1px solid var(--trait);
}

.f-mise-a-jour-page {
    margin-bottom: 1.5rem;
    padding: 1rem 1.25rem;
    border: 1px solid var(--trait);
    border-left: 3px solid var(--or);
    border-radius: var(--rayon);
    background: var(--surface);
}

@keyframes f-mise-a-jour-entree {
    from {
        opacity: 0;
        transform: translateY(-.5rem);
    }
}

@media (prefers-reduced-motion: reduce) {
    .f-mise-a-jour[open] {
        animation: none;
    }
}