optimize a lot of stuff

css/loader.css

@@ -3,26 +3,57 @@ body {
 }
 #gameFrame {
     width: 100vw;
-    height: 90vh;
+    height: 100vh;
     margin: 0;
     background-color: black;
 }
 #infobox {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    background: #000000;
+    transition: transform 0.3s ease;
+    z-index: 10;
+}
+#infobox.collapsed {
+    transform: translateY(100%);
+}
+#infobox:hover {
+    transform: translateY(0);
+}
+#infobox-toggle {
+    position: fixed;
+    bottom: calc(10vh + 8px);
+    right: 12px;
+    width: 28px;
+    height: 28px;
+    cursor: pointer;
+    opacity: 0.5;
+    z-index: 11;
+    transition: opacity 0.2s, transform 0.3s, bottom 0.3s;
+}
+#infobox-toggle:hover {
+    opacity: 1;
+}
+#infobox.collapsed ~ #infobox-toggle {
+    transform: rotate(180deg);
+    bottom: 8px;
+}
+#infobox-content {
     height: 10vh;
     width: 100%;
     display: flex;
     justify-content: center;
     align-items: center;
-    background-color: #000000;
-    backdrop-filter: blur(4px);
 }
-#infobox img {
+#infobox-content img {
     height: 90%;
     margin: 0.5%;
     aspect-ratio: 1 / 1;
     border-radius: 8px;
 }
-#infobox h2 {
+#infobox-content h2 {
     margin-right: auto;
 }
 .button {
@@ -59,7 +90,7 @@ body[fast] #gamecontainer {
 	backdrop-filter: blur(0);
 }
 @media screen and (max-width: 660px) {
-	#infobox h2 {
+	#infobox-content h2 {
         max-width: 45%;
         font-size: 16px;
     }