* {
    font-family: "Inter", sans-serif;
    transition: background-color 200ms;
}

h1 {
    font-family: "Edu AU VIC WA NT Dots", cursive;
}

.error-shake {
    animation: error-shake 500ms ease-in forwards !important;
}

.jump-zoom {
    animation: jump-zoom 200ms;
}

@keyframes jump-zoom {
    30% {
        transform: scale(1.1);
    }
}

@keyframes error-shake {
    15% {
        transform: translateX(-10px);
    }

    30% {
        transform: translateX(10px);
    }

    45% {
        transform: translateX(-8px);
    }

    60% {
        transform: translateX(8px);
    }

    75% {
        transform: translateX(-5px);
    }

    90% {
        transform: translateX(5px);
    }
}

.corret-letter-correct-position {
    background-color: #00ff0080;
}

.corret-letter-wrong-position {
    background-color: #ffff0080;
}

.wrong-letter-wrong-position {
    background-color: #80808080;
}