From 154f4dfdb058b9ca6b3ebb8bb363f3df6b14af39 Mon Sep 17 00:00:00 2001
From: Max Litruv Boonzaayer <litruv@gmail.com>
Date: Wed, 15 Jul 2026 03:19:54 +1000
Subject: [PATCH] fix: stop emoji fonts claiming spaces and Latin text

Use Fontsource's real family name ('Inter Variable') so text no longer
falls through to Noto Color Emoji / Twemoji. Scope emoji @font-face to
emoji unicode-range so space metrics stay normal on Linux and elsewhere.
---
 src/index.css | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/index.css b/src/index.css
index 33d9f9a..a69627f 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1,9 +1,10 @@
-/* Twemoji font (Twitter emoji) */
+/* Twemoji font (Twitter emoji) — unicode-range keeps spaces/Latin out of emoji metrics */
 @font-face {
   font-family: Twemoji;
   src: url('../public/font/Twemoji.Mozilla.v15.1.0.woff2'),
     url('../public/font/Twemoji.Mozilla.v15.1.0.ttf');
   font-display: swap;
+  unicode-range: U+1F300-1F9FF, U+2600-26FF, U+2700-27BF, U+FE0F, U+200D, U+1F1E6-1F1FF;
 }
 
 /* Apple Color Emoji - uses local Apple Color Emoji if available (macOS/iOS),
@@ -14,6 +15,7 @@
     local('Segoe UI Emoji'),
     local('Noto Color Emoji');
   font-display: swap;
+  unicode-range: U+1F300-1F9FF, U+2600-26FF, U+2700-27BF, U+FE0F, U+200D, U+1F1E6-1F1FF;
 }
 
 /* System emoji - uses native OS emoji */
@@ -26,6 +28,7 @@
     local('Android Emoji'),
     local('EmojiOne Color');
   font-display: swap;
+  unicode-range: U+1F300-1F9FF, U+2600-26FF, U+2700-27BF, U+FE0F, U+200D, U+1F1E6-1F1FF;
 }
 
 :root {
@@ -42,7 +45,10 @@
   --mx-uc-8: hsl(94, 100%, 35%);
 
   --font-emoji: 'AppleColorEmoji';
-  --font-secondary: 'InterVariable', var(--font-emoji), sans-serif;
+  /* Must match @fontsource-variable/inter's family name ('Inter Variable').
+     A wrong name falls through to emoji fonts — huge spaces on Linux (Noto Color Emoji)
+     and Twemoji COLR keycaps for digits. Emoji stays last for glyphs only (unicode-range). */
+  --font-secondary: 'Inter Variable', var(--font-emoji), sans-serif;
 }
 
 .dark-theme,
@@ -62,7 +68,7 @@
   --mx-uc-7: hsl(243, 100%, 80%);
   --mx-uc-8: hsl(94, 100%, 80%);
 
-  --font-secondary: 'InterVariable', var(--font-emoji), sans-serif;
+  --font-secondary: 'Inter Variable', var(--font-emoji), sans-serif;
 }
 
 html {