Refactor z-index values and optimize CSS properties for various seasonal styles; enhance performance with will-change property [skip ci]

Jellyfin.Plugin.Seasonals/Web/spooky.css

@@ -8,6 +8,7 @@
     height: 100%;
     pointer-events: none;
     z-index: 10;
+    contain: layout paint;
 }
 
 .spooky {
@@ -16,19 +17,8 @@
     will-change: transform;
     translate: 0 120vh;
     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: spooky-float;
-    -webkit-animation-duration: 10s;
-    -webkit-animation-timing-function: linear;
-    -webkit-animation-iteration-count: infinite;
-    -webkit-animation-play-state: running;
-    
     animation-name: spooky-float;
     animation-duration: 10s;
     animation-timing-function: linear;
@@ -40,13 +30,6 @@
     width: 30px;
     height: auto;
     will-change: transform;
-    
-    -webkit-animation-name: spooky-shake;
-    -webkit-animation-duration: 3s;
-    -webkit-animation-timing-function: ease-in-out;
-    -webkit-animation-iteration-count: infinite;
-    -webkit-animation-play-state: running;
-    
     animation-name: spooky-shake;
     animation-duration: 3s;
     animation-timing-function: ease-in-out;
@@ -59,22 +42,6 @@
     width: 100%;
 }
 
-@-webkit-keyframes spooky-float {
-    0% {
-        translate: 0 120vh;
-        opacity: 0;
-    }
-    10% {
-        opacity: 0.8;
-    }
-    90% {
-        opacity: 0.8;
-    }
-    100% {
-        translate: 0 -150px;
-        opacity: 0;
-    }
-}
 
 @keyframes spooky-float {
     0% {
@@ -93,14 +60,6 @@
     }
 }
 
-@-webkit-keyframes spooky-shake {
-    0%, 100% {
-        transform: translateX(0) scale(1) rotate(15deg);
-    }
-    50% {
-        transform: translateX(80px) scale(1.2) rotate(-15deg);
-    }
-}
 
 @keyframes spooky-shake {
     0%, 100% {
@@ -111,7 +70,6 @@
     }
 }
 
-/* Base predefined starting offsets (if not overridden by js) */
 .spooky:nth-of-type(0) { left: 1%; }
 .spooky:nth-of-type(1) { left: 10%; }
 .spooky:nth-of-type(2) { left: 20%; }