special 37c3 update

script.js

@@ -10,8 +10,8 @@ let fields = [
     "Kabel vergessen",
     "Halle gesucht",
     "$dinge gelötet",
-    "an SoS teilgenommen",
-    "Neue Leute kennengelernt",
+    "an SoS teil-genommen",
+    "Neue Leute kennen-gelernt",
     "Wasser getrunken",
     "Waffel gegessen",
     "Corona Test gemacht",
@@ -19,9 +19,9 @@ let fields = [
     "Fairydust bewundert",
     "Talk angeschaut",
     "CCC Merch getragen",
-    "Engelschicht gemacht",
+    "Engel-schicht gemacht",
     "In der Lounge getanzt",
-    "Etwas Neues ausprobiert",
+    "Etwas Neues aus-probiert",
     "Maske getragen",
     "geduscht"
 ];

style.css

@@ -1,6 +1,66 @@
+      @font-face {
+        font-family: "VCROCDFaux";
+        src: url("./VCROCDFaux.woff2") format("woff2");
+      }
+
+      @font-face {
+        font-family: "MonaSans";
+        src: url("./Mona-Sans.woff2") format("woff2");
+      }
+
+      /*body {
+        background: #000;
+        color: #fff;
+        margin: 20px auto;
+        max-width: 640px;
+        padding: 0 20px;
+      }
+
+      .cover {
+        aspect-ratio: 1/1;
+        display: block;
+        margin: 20px 0;
+        width: 100%;
+      }*/
+
+      h2 {
+        font-family: MonaSans, sans-serif;
+        margin-top: 60px;
+        font-weight: bold;
+      }
+
+      p {
+        font-family: VCROCDFaux, monospace;
+        color: #aaa;
+      }
+
+      /*.btn {
+        display: block;
+        background: #cc4d47;
+        color: #fff;
+        font-family: VCROCDFaux, monospace;
+        text-decoration: none;
+        text-align: center;
+        line-height: 50px;
+        display: flex;
+        gap: 15px;
+        justify-content: center;
+        align-items: center;
+        margin: 40px 0;
+      }
+
+      .btn:hover {
+        background: #4e1614;
+      }
+
+      .btn svg {
+        width: 20px;
+        height: 20px;
+      }*/
+
 /* HTML Selectors */
 body {
-    font-family: monospace;
+    font-family: VCROCDFaux, monospace;
     height: 95vh;
     width: 95vw;
     overflow: hidden;
@@ -27,7 +87,7 @@ td {
     height: calc(100vh / 6);
     transition: background-color ease-out .350s;
     border-radius: 40px;
-    font-size: xx-large;
+    font-size: x-large;
 }
 
 h1, p {
@@ -141,7 +201,7 @@ div#winner-message.won {
 
 @media screen and (max-width: 576px) and (orientation: portrait) {
     td {
-        font-size: unset;
+        font-size: small;
     }
     div#winner-message.won {
         animation: unset;