Enhance CSS animations and performance across seasonal styles; add will-change property for smoother transitions and optimize keyframes. [skip ci]

Jellyfin.Plugin.Seasonals/Web/hearts.css

@@ -12,48 +12,21 @@
 }
 
 .heart {
+    will-change: transform;
     position: fixed;
     bottom: -10%;
     z-index: 15;
-    -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
-    -webkit-user-select: none;
     cursor: default;
-    -webkit-animation-name: heart-fall, heart-shake;
-    -webkit-animation-duration: 14s, 5s;
-    -webkit-animation-timing-function: linear, ease-in-out;
-    -webkit-animation-iteration-count: infinite, infinite;
     animation-name: heart-fall, heart-shake;
     animation-duration: 14s, 5s;
     animation-timing-function: linear, ease-in-out;
     animation-iteration-count: infinite, infinite;
 }
 
-@-webkit-keyframes heart-fall {
-    0% {
-        bottom: -10%;
-    }
 
-    100% {
-        bottom: 110%;
-    }
-}
-
-@-webkit-keyframes heart-shake {
-
-    0%,
-    100% {
-        -webkit-transform: translateX(0);
-        transform: translateX(0)
-    }
-
-    50% {
-        -webkit-transform: translateX(80px);
-        transform: translateX(80px)
-    }
-}
 
 @keyframes heart-fall {
     0% {
@@ -79,72 +52,60 @@
 
 .heart:nth-of-type(0) {
     left: 1%;
-    -webkit-animation-delay: 0s, 0s;
     animation-delay: 0s, 0s
 }
 
 .heart:nth-of-type(1) {
     left: 10%;
-    -webkit-animation-delay: 1s, 1s;
     animation-delay: 1s, 1s
 }
 
 .heart:nth-of-type(2) {
     left: 20%;
-    -webkit-animation-delay: 6s, .5s;
     animation-delay: 6s, .5s
 }
 
 .heart:nth-of-type(3) {
     left: 30%;
-    -webkit-animation-delay: 4s, 2s;
     animation-delay: 4s, 2s
 }
 
 .heart:nth-of-type(4) {
     left: 40%;
-    -webkit-animation-delay: 2s, 2s;
     animation-delay: 2s, 2s
 }
 
 .heart:nth-of-type(5) {
     left: 50%;
-    -webkit-animation-delay: 8s, 3s;
     animation-delay: 8s, 3s
 }
 
 .heart:nth-of-type(6) {
     left: 60%;
-    -webkit-animation-delay: 6s, 2s;
     animation-delay: 6s, 2s
 }
 
 .heart:nth-of-type(7) {
     left: 70%;
-    -webkit-animation-delay: 2.5s, 1s;
     animation-delay: 2.5s, 1s
 }
 
 .heart:nth-of-type(8) {
     left: 80%;
-    -webkit-animation-delay: 1s, 0s;
     animation-delay: 1s, 0s
 }
 
 .heart:nth-of-type(9) {
     left: 90%;
-    -webkit-animation-delay: 3s, 1.5s;
     animation-delay: 3s, 1.5s
 }
 
 .heart:nth-of-type(10) {
     left: 25%;
-    -webkit-animation-delay: 2s, 0s;
     animation-delay: 2s, 0s
 }
 
 .heart:nth-of-type(11) {
     left: 65%;
-    -webkit-animation-delay: 4s, 2.5s;
     animation-delay: 4s, 2.5s
 }