:root {
    --emundi-motion-fast: 160ms;
    --emundi-motion-base: 260ms;
    --emundi-motion-spring: cubic-bezier(.2, .9, .25, 1.25);
}

button,
a,
[role="button"],
.card,
.quick-action,
.settings-row {
    -webkit-tap-highlight-color: transparent;
}

.emundi-interactive {
    transform: translateZ(0);
    transition:
        transform var(--emundi-motion-fast) ease,
        filter var(--emundi-motion-fast) ease,
        box-shadow var(--emundi-motion-base) ease;
}

.emundi-interactive.is-tapped {
    transform: scale(.965);
    filter: brightness(.97);
}

.emundi-interactive > i,
.emundi-interactive .interactive-icon {
    transform-origin: center;
}

.emundi-interactive.is-tapped > i,
.emundi-interactive.is-tapped .interactive-icon {
    animation: emundiIconTap 320ms var(--emundi-motion-spring);
}

input,
select,
textarea {
    transition:
        border-color var(--emundi-motion-fast) ease,
        box-shadow var(--emundi-motion-base) ease,
        background-color var(--emundi-motion-base) ease;
}

input.is-filled,
select.is-filled,
textarea.is-filled {
    border-color: rgba(52, 122, 73, .55) !important;
    background-image:
        linear-gradient(90deg, rgba(52, 122, 73, .04), rgba(52, 122, 73, 0));
    animation: emundiFieldFilled 360ms ease both;
}

.emundi-page-ready .app-main > *,
.emundi-page-ready .auth-card,
.emundi-page-ready .register-card {
    animation: emundiContentEnter 420ms ease both;
}

.ri-loader-4-line {
    animation: emundiSpin .8s linear infinite;
}

@keyframes emundiIconTap {
    0% { transform: scale(1) rotate(0); }
    45% { transform: scale(.82) rotate(-7deg); }
    75% { transform: scale(1.12) rotate(4deg); }
    100% { transform: scale(1) rotate(0); }
}

@keyframes emundiFieldFilled {
    0% { box-shadow: 0 0 0 0 rgba(52, 122, 73, .18); }
    100% { box-shadow: 0 0 0 .28rem rgba(52, 122, 73, 0); }
}

@keyframes emundiContentEnter {
    from {
        opacity: 0;
        transform: translateY(.55rem);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes emundiSpin {
    to { transform: rotate(360deg); }
}

@media (hover: hover) {
    .emundi-interactive:hover > i,
    .emundi-interactive:hover .interactive-icon {
        transform: translateY(-.08rem);
    }
}

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