.reading-task-trigger:hover .icon-single-answer {
    animation: reading-icon-soft-pop 300ms var(--motion-ease-micro) 1;
}

.reading-task-trigger:hover .icon-single-answer .inner-dot {
    animation: reading-single-dot-pulse 340ms var(--motion-ease-micro) 1;
    transform-origin: center;
}

.reading-task-trigger:hover .icon-multiple-answers {
    animation: reading-icon-soft-pop 300ms var(--motion-ease-micro) 1;
}

.reading-task-trigger:hover .icon-multiple-answers .check-path {
    animation: reading-check-mark-reveal 320ms var(--motion-ease-micro) 1;
    transform-origin: center;
}

.reading-task-trigger:hover .icon-fill-blanks {
    animation: reading-caret-bob var(--motion-duration-icon-short) var(--motion-ease-micro) 1;
}

.reading-task-trigger:hover .icon-reorder .arrow-up {
    animation: reading-arrow-shift-down 320ms var(--motion-ease-micro) 1;
    transform-origin: center;
}

.reading-task-trigger:hover .icon-reorder .arrow-down {
    animation: reading-arrow-shift-up 320ms var(--motion-ease-micro) 1;
    transform-origin: center;
}

.reading-task-trigger:hover .icon-drag-words {
    animation: reading-grip-pulse var(--motion-duration-icon-medium) var(--motion-ease-micro) 1;
}

.reading-task-trigger:hover .icon-mixed-practice {
    animation: reading-mixed-pop var(--motion-duration-icon-long) var(--motion-ease-micro) 1;
}

.reading-task-trigger:hover .icon-mixed-practice .sparkle-main,
.reading-task-trigger:hover .icon-mixed-practice .sparkle-top,
.reading-task-trigger:hover .icon-mixed-practice .sparkle-bottom {
    transform-box: fill-box;
    transform-origin: center;
}

.reading-task-trigger:hover .icon-mixed-practice .sparkle-main {
    animation: reading-sparkle-main var(--motion-duration-icon-long) var(--motion-ease-micro) 1;
}

.reading-task-trigger:hover .icon-mixed-practice .sparkle-top {
    animation: reading-sparkle-secondary var(--motion-duration-icon-long) var(--motion-ease-micro) 1 40ms;
}

.reading-task-trigger:hover .icon-mixed-practice .sparkle-bottom {
    animation: reading-sparkle-secondary var(--motion-duration-icon-long) var(--motion-ease-micro) 1 80ms;
}

@keyframes reading-icon-soft-pop {
    0% {
        transform: scale(1);
    }
    48% {
        transform: scale(1.08);
    }
    100% {
        transform: scale(1);
    }
}

@keyframes reading-single-dot-pulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.42);
    }
    100% {
        transform: scale(1);
    }
}

@keyframes reading-check-mark-reveal {
    0% {
        opacity: 0.2;
        transform: scale(0.52);
    }
    55% {
        opacity: 1;
        transform: scale(1.22);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes reading-caret-bob {
    0% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(var(--space-2));
    }
    100% {
        transform: translateY(0);
    }
}

@keyframes reading-arrow-shift-down {
    0% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(var(--space-2));
    }
    100% {
        transform: translateY(0);
    }
}

@keyframes reading-arrow-shift-up {
    0% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(calc(var(--space-2) * -1));
    }
    100% {
        transform: translateY(0);
    }
}

@keyframes reading-grip-pulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}

@keyframes reading-mixed-pop {
    0% {
        opacity: 1;
        transform: scale(1);
    }
    50% {
        opacity: 0.78;
        transform: scale(1.08);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes reading-sparkle-main {
    0% {
        opacity: 1;
        transform: scale(1);
    }
    45% {
        opacity: 0.62;
        transform: scale(1.18);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes reading-sparkle-secondary {
    0% {
        opacity: 1;
        transform: scale(1);
    }
    45% {
        opacity: 0.7;
        transform: scale(1.14);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

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