Added some style logic

styles/styles.css

@@ -81,8 +81,12 @@
   box-shadow: none;
 }
 
+.player-selection.hidden {
+  position: absolute;
+  top: -100%;
+}
+
 .emoji-picker-container {
-  background-color: rgba(0, 0, 0, 0.404);
   transition: 0.4s ease-in-out;
   opacity: 100%;
   height: 100%;
@@ -92,6 +96,13 @@
   justify-content: center;
   align-items: center;
 }
+.emoji-picker-container .emoji-picker-background {
+  position: absolute;
+  background-color: rgba(0, 0, 0, 0.404);
+  z-index: 10;
+  height: 100%;
+  width: 100%;
+}
 
 .emoji-picker-container.hidden {
   opacity: 0%;
@@ -100,6 +111,10 @@
   transition: 0.4s ease-in-out;
 }
 
+emoji-picker {
+  z-index: 100;
+}
+
 .game {
   display: grid;
   grid-template-columns: 1fr 1fr 1fr;
@@ -142,6 +157,12 @@
   border-right: 0px;
 }
 
+.game.hidden {
+  opacity: 0%;
+  position: absolute;
+  top: -100%;
+}
+
 @media (max-width: 900px) {
   .game {
     width: 80vw;
@@ -171,4 +192,8 @@ button {
   cursor: pointer;
 }
 
+.animate__animated.animate__fadeOutDown {
+  --animate-duration: 1s;
+}
+
 /*# sourceMappingURL=styles.css.map */