fbff font

assets/stylesheets/common/fbff.scss

@@ -9,6 +9,7 @@
       grid-template-areas: "gif gif gif" "friend nothing you";
     }
   }
+
   --border-size: 6px;
   @media screen and (width <= 768px) {
     --border-size: 4px;
@@ -16,6 +17,7 @@
   @media screen and (width <= 475px) {
     --border-size: 3px;
   }
+
   .fbff-gif-container {
     position: relative;
     width: 90%;
@@ -27,21 +29,25 @@
       grid-area: gif;
     }
   }
+
   .fbff-gif {
     width: 100%;
     border-radius: var(--rewind-border-radius);
   }
+
   .fbff-avatar-container {
     z-index: 10;
     @media screen and (width <= 625px) {
       &:first-of-type {
         grid-area: friend;
       }
+
       &:last-of-type {
         grid-area: you;
       }
     }
   }
+
   .fbff-avatar-container img.avatar {
     align-self: center;
     justify-self: center;
@@ -56,11 +62,13 @@
       height: 25px;
     }
   }
+
   .fbff-avatar-container {
     display: grid;
     grid-template-rows: 1fr min-content;
     flex-direction: column;
   }
+
   .fbff-avatar-name {
     margin: 0;
     align-self: center;
@@ -68,7 +76,7 @@
     margin-top: auto;
     height: min-content;
     font-size: var(--font-down-1);
-    font-family: Pixelify Sans;
+    font-family: "Pixelify Sans";
     @media screen and (width <= 475px) {
       font-size: var(--font-down-3);
     }

assets/stylesheets/common/fonts.scss

@@ -1,5 +1,5 @@
 @font-face {
-  font-family: "receipt-narrow";
+  font-family: receipt-narrow;
   src: absolute-image-url(
       "/plugins/discourse-rewind/fonts/receipt-narrow.woff2"
     )
@@ -21,9 +21,21 @@
     format("woff2");
 }
 
+@font-face {
+  font-display: swap;
+  font-family: "Pixelify Sans";
+  font-style: normal;
+  font-weight: 400;
+  src: absolute-image-url(
+      "/plugins/discourse-rewind/fonts/pixelify-sans-v1-latin-regular.woff2"
+    )
+    format("woff2");
+}
+
 .rewind {
-  --jersey-heading: "Jersey 20", Helvetica, Arial, sans-serif;
+  --jersey-heading: "Jersey 20", helvetica, arial, sans-serif;
   --pixel-text: "receipt-narrow", sans-serif;
+
   h1,
   h2,
   h3,