@keyframes hover-outline {
    from {
        outline-color: var(--light-blue);
    }

    to {
        outline-color: var(--dark-blue);
    }
}

@keyframes onload-background-blur {
    from {
        filter: blur(0);
        box-shadow: none;
    }

    99% {
        filter: blur(0);
        box-shadow: none;
    }

    to {
        filter: blur(8px);
        box-shadow: inset 0 0 0 50vw var(--background-shadow);
    }
}

@keyframes onload-dialog {
    from {
        opacity: 0;
        width: var(--keyframe-show-dialog-width);
        padding-bottom: var(--keyframe-show-dialog-padding-bottom);
    }

    80% {
        opacity: 0;
        width: var(--keyframe-show-dialog-width);
        padding-bottom: var(--keyframe-show-dialog-padding-bottom);
    }

    to {
        opacity: 1;
        width: var(--dialog-width);
        padding-bottom: var(--dialog-padding-bottom);
    }
}

@keyframes onload-visibility {
    from {
        visibility: hidden;
    }

    99% {
        visibility: hidden;
    }

    to {
        visibility: visible;
    }
}