update fonts.

src/styles.css

@@ -81,6 +81,55 @@
     --color-warning: #f4ee3e;
     --color-danger: #e82517;
   }
+
+@font-face {
+  font-display: swap;
+  font-family: "SF Pro Local";
+  font-style: normal;
+  font-weight: 400;
+  src: url("/fonts/SF-Pro-Rounded-Regular.otf") format("opentype");
+}
+
+@font-face {
+  font-display: swap;
+  font-family: "SF Pro Local";
+  font-style: normal;
+  font-weight: 500;
+  src: url("/fonts/SF-Pro-Rounded-Medium.otf") format("opentype");
+}
+
+@font-face {
+  font-display: swap;
+  font-family: "SF Pro Local";
+  font-style: normal;
+  font-weight: 600;
+  src: url("/fonts/SF-Pro-Rounded-Semibold.otf") format("opentype");
+}
+
+@font-face {
+  font-display: swap;
+  font-family: "SF Pro Local";
+  font-style: normal;
+  font-weight: 700;
+  src: url("/fonts/SF-Pro-Rounded-Bold.otf") format("opentype");
+}
+
+@font-face {
+  font-display: swap;
+  font-family: "SF Pro Local";
+  font-style: normal;
+  font-weight: 800;
+  src: url("/fonts/SF-Pro-Rounded-Heavy.otf") format("opentype");
+}
+
+@font-face {
+  font-display: swap;
+  font-family: "SF Pro Local";
+  font-style: normal;
+  font-weight: 900;
+  src: url("/fonts/SF-Pro-Rounded-Black.otf") format("opentype");
+}
+
 *,
 *::before,
 *::after {
@@ -92,8 +141,8 @@ body {
   min-width: 320px;
   min-height: 100vh;
   font-family:
-    Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
+    "SF Pro Local", "SF Pro Rounded", "SF Pro Text", -apple-system,
-    sans-serif;
+    BlinkMacSystemFont, "Segoe UI", Inter, ui-sans-serif, system-ui, sans-serif;
 }
 
 .pixel-mountains {