.favorite-button {
    inline-size: 24px;
    block-size: 24px;
    scale: 1;
    transition: all .3s ease;

    &:active {
        scale: .7;
    }

    &:not(:active) {
        animation: scale-release .3s ease-out;
    }

    > img:first-of-type{
        display: block;
    }

    > img:last-of-type{
        display: none;
    }

    &[filled]{
        > img:first-of-type{
            display: none;
        }

        > img:last-of-type{
            display: block;
        }
    }
}

@keyframes scale-release {
    0% {
        transform: scale(.7);
    }

    50% {
        transform: scale(1.5);
    }

    100% {
        transform: scale(1);
    }
}