:root {
    --motion-fast: 140ms;
    --motion-normal: 220ms;
    --motion-soft: 320ms;
    --motion-ease: cubic-bezier(.2, .8, .2, 1);
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 1ms !important;
        scroll-behavior: auto !important;
    }
}

.milaro-animate-in {
    animation-duration: var(--motion-soft) !important;
    animation-fill-mode: both !important;
}

.milaro-delay-1 { animation-delay: 35ms !important; }
.milaro-delay-2 { animation-delay: 70ms !important; }
.milaro-delay-3 { animation-delay: 105ms !important; }
.milaro-delay-4 { animation-delay: 140ms !important; }
.milaro-delay-5 { animation-delay: 175ms !important; }
.milaro-delay-6 { animation-delay: 210ms !important; }

.sidebar .nav-group a,
.app-sidebar .nav-group a,
.sidebar details a,
.app-sidebar details a,
.sidebar .menu-link,
.app-sidebar .menu-link,
.sidebar .nav-link,
.app-sidebar .nav-link,
.nav-group > summary,
.sidebar details > summary,
.app-sidebar details > summary {
    transition:
        background var(--motion-fast) var(--motion-ease),
        color var(--motion-fast) var(--motion-ease),
        border-color var(--motion-fast) var(--motion-ease),
        box-shadow var(--motion-normal) var(--motion-ease),
        transform var(--motion-fast) var(--motion-ease) !important;
}

.sidebar .nav-group a:hover,
.app-sidebar .nav-group a:hover,
.sidebar details a:hover,
.app-sidebar details a:hover,
.sidebar .menu-link:hover,
.app-sidebar .menu-link:hover,
.sidebar .nav-link:hover,
.app-sidebar .nav-link:hover {
    transform: translateX(-1px);
}

.fa-summary-toggle,
.nav-group > summary .fa-angle-down,
.sidebar details > summary .fa-angle-down,
.app-sidebar details > summary .fa-angle-down {
    transition: transform var(--motion-fast) var(--motion-ease), opacity var(--motion-fast) var(--motion-ease) !important;
}

details[open] > summary .fa-summary-toggle,
details[open] > summary .fa-angle-down {
    transform: rotate(180deg);
}