Update style.css

style.css

@@ -1,26 +1,57 @@
 body {
   margin: 0;
   padding: 0;
-  background: linear-gradient(135deg, #1a2a6c, #b21f1f, #fdbb2d);
-  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+  background: black;
+  font-family: 'IBM Plex Mono', monospace;
   color: #fff;
   text-align: center;
   height: 100vh;
+  overflow: hidden;
+}
+
+.container {
+  position: relative;
+  z-index: 1;
   display: flex;
+  flex-direction: column;
   justify-content: center;
   align-items: center;
+  height: 100vh;
 }
 
-.container {
-  max-width: 600px;
+h1 {
+  font-size: 2rem;
+  margin-bottom: 2vh;
+  color: #aaa;
+  letter-spacing: 2px;
 }
 
-h1 {
-  font-size: 3rem;
-  margin-bottom: 20px;
-  animation: pulse 2s infinite;
+#countdown {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: 4vw;
+  height: 70vh; /* take 70% of the screen height */
 }
 
+#countdown div {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  font-size: 10vw; /* adjusts based on screen width */
+  line-height: 1;
+}
+
+#countdown span:last-child {
+  font-size: 1.5vw;
+  margin-top: 1vh;
+  letter-spacing: 1px;
+  text-transform: uppercase;
+  color: #ccc;
+}
+
+
 #starfield {
   position: fixed;
   top: 0;
@@ -36,19 +67,7 @@ h1 {
 }
 
 
-#countdown {
-  display: flex;
-  justify-content: center;
-  gap: 20px;
-  font-size: 2.5rem;
-}
 
-#countdown div {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  animation: pop 1s infinite alternate;
-}
 
 @keyframes pulse {
   0% { transform: scale(1); }