From 11c6804d2f718ac8a041890e4a6bd41b8f8e1c3b Mon Sep 17 00:00:00 2001
From: Frank <franklinjalves@gmail.com>
Date: Thu, 26 Mar 2026 16:16:20 +0000
Subject: [PATCH] fix: preload Inter font and use font-display: optional to
 prevent text reflow CLS

Preload the latin Inter woff2 so the font is available before first
paint. Switch font-display from swap to optional so the browser never
swaps in a late-arriving font, eliminating text reflow shifts.
---
 src/routes/__root.tsx | 7 +++++++
 src/styles/app.css    | 4 ++--
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/routes/__root.tsx b/src/routes/__root.tsx
index 54781360..dbcacf61 100644
--- a/src/routes/__root.tsx
+++ b/src/routes/__root.tsx
@@ -76,6 +76,13 @@ export const Route = createRootRouteWithContext<{
       }),
     ],
     links: [
+      {
+        rel: 'preload',
+        href: '/fonts/Inter-latin.woff2',
+        as: 'font',
+        type: 'font/woff2',
+        crossOrigin: 'anonymous',
+      },
       { rel: 'stylesheet', href: appCss },
       {
         rel: 'preload',
diff --git a/src/styles/app.css b/src/styles/app.css
index 7136d59a..2ee91a43 100644
--- a/src/styles/app.css
+++ b/src/styles/app.css
@@ -807,7 +807,7 @@ mark {
 }
 
 @font-face {
-  font-display: swap;
+  font-display: optional;
   font-family: 'Inter';
   font-style: normal;
   font-weight: 100 900;
@@ -819,7 +819,7 @@ mark {
 }
 
 @font-face {
-  font-display: swap;
+  font-display: optional;
   font-family: 'Inter';
   font-style: normal;
   font-weight: 100 900;