Just Dance Now Weak Tweaker by ibratabian17

/* ==UserStyle==
@name           Just Dance Now Weak Tweaker
@namespace      justdancenow.com
@version        1.0.0
@description    A tweaker for fixing animation on Just Dance Now
@author         ibratabian17
==/UserStyle== */

@-moz-document domain("justdancenow.com") {
    html.browser-androidTv .toggle-fullscreen,
html.browser-androidTv .toggles::before {
    display: inline-block!important;
}
#racetrack .platform {
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15)!important;
}
#beat {
    display: block!important;
}
#pictos {
    border-bottom: solid 2px rgba(255, 255, 255, 0.35);
    box-shadow: 0px 4px 2px -2px rgba(0, 0, 0, 0.25)!important;
}
.hud.beat #players .feedback {
    -webkit-animation: opacity-hide 1s step-end!important;
    animation: opacity-hide 1s step-end!important;
}
.hud.beat > #racetrack .star:not(.no-beat) {
    -webkit-animation: racetrack-star-beat 0.3s;
    animation: racetrack-star-beat 0.3s;
}

.hud.beat #players .feedback-label {
    -webkit-animation: opacity-hide 0.7s step-end!important;
    animation: opacity-hide 0.7s step-end;
}
.hud.beat #players .feedback {
    animation: feedback 1s!important;
}

.hud.beat #players .feedback-label {
    animation: feedlabel 0.7s!important;
}
html:not(.ipad) .hud.beat > #players .player-color {
    animation: player-color-beat .3s;
}
.hud.beat #players .player-stars .star:not(.no-beat)::before {
    animation: player-star-glow 0.4s ease-out!important;
}
.weak-platform #lyrics .line .fragment {
    position: relative;
    float: left;
    white-space: pre;
    text-shadow: 1px 1px 1px #000000c9!important;
}
#lyrics {
    z-index: 99999999999999999999999999999 !important;
    ;
}
#lyrics .line.previous {
    transform: perspective(400px) translateY(-0.2em) rotateX(30deg);
    transform-origin: 50% 100%;
    opacity: 0;
    transition: color 0.35s, opacity 0.35s, transform 0.35s!important;
}

#lyrics .line {
    opacity: 1.0;
    -webkit-animation: nextLineInf 0.35s!important;
    animation: nextLineInf 0.35s!important;
}
#lyrics .line.current {
    transition: .4s all !important;
    opacity: 1;
}

#lyrics .line.previous {
    transition: .12s all !important;
    opacity: .0;
}
@keyframes nextLineInf {
    0%,
    20% {
        opacity: 0;
        transform: perspective(400px) translateY(2.5em) rotateX(-50deg);
    }
    100% {
        opacity: 1;
        transform: translateY(1em);
    }
}
#goldmove .layer.layer-1,
#goldmove .layer.layer-2,
#goldmove .layer.layer-3,
.weak-platform .layer.layer-2 {
    display: block!important;
}

@keyframes feedback {
    0% {
        opacity: 0;
        transform: scale3d(1, 1, 1);
    }
    20% {
        opacity: 1;
        transform: scale3d(1.2, 1, 1);
    }
    100% {
        opacity: 0;
        transform: scale3d(0.92, 1, 1);
    }
}

@keyframes opacity-hide {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@keyframes feedlabel {
    0% {
        opacity: 0;
        transform: scale3d(1.2, 1.2, 1);
    }
    14% {
        opacity: 1;
        transform: scale3d(0.8, 0.8, 1);
    }
    36% {
        transform: scale3d(1, 1, 1);
    }
    43% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
    100% {
        opacity: 0;
        transform: translate3d(0, -5px, 0) scale3d(0.95, 0.95, 1);
    }
}
@keyframes player-color-beat {
    0% {
        transform: scale3d(1.08, 1, 1);
    }
    100% {
        transform: scale3d(1, 1, 1);
    }
}
@keyframes racetrack-star-beat {
    0% {
        transform: scale3d(1.1, 1.1, 1.1) rotate(-15deg);
    }
    100% {
        transform: scale3d(1, 1, 1) rotate(-15deg);
    }
}
@keyframes player-star-glow {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@-webkit-keyframes goldmoveAmbient {
    0% {
        transform: rotate(0deg) scale(1.1);
    }
    12.5% {
        transform: rotate(45deg) scale(1.6);
    }
    25% {
        transform: rotate(90deg) scale(1.1);
    }
    37.5% {
        transform: rotate(135deg) scale(1.6);
    }
    50% {
        transform: rotate(180deg) scale(1.1);
    }
    62.5% {
        transform: rotate(225deg) scale(1.6);
    }
    75% {
        transform: rotate(270deg) scale(1.1);
    }
    87.5% {
        transform: rotate(315deg) scale(1.6);
    }
    100% {
        transform: rotate(360deg) scale(1.1);
    }
}
@keyframes goldmoveAmbient {
    0% {
        transform: rotate(0deg) scale(1.1);
    }
    12.5% {
        transform: rotate(45deg) scale(1.6);
    }
    25% {
        transform: rotate(90deg) scale(1.1);
    }
    37.5% {
        transform: rotate(135deg) scale(1.6);
    }
    50% {
        transform: rotate(180deg) scale(1.1);
    }
    62.5% {
        transform: rotate(225deg) scale(1.6);
    }
    75% {
        transform: rotate(270deg) scale(1.1);
    }
    87.5% {
        transform: rotate(315deg) scale(1.6);
    }
    100% {
        transform: rotate(360deg) scale(1.1);
    }
}
}