Improve font rendering on Linux (#1529)

* Improve $body-font stack

This is an attempt at fixing #1209. Further reading: 

- https://infinnie.github.io/blog/2017/systemui.html
- https://blog.jim-nielsen.com/2020/system-fonts-on-the-web/

* pause stylelint complaints in documented stack

* Create silent-geckos-do.md

Co-authored-by: simurai <simurai@github.com>

.changeset/silent-geckos-do.md

@@ -0,0 +1,5 @@
+---
+"@primer/css": minor
+---
+
+Improve font rendering on Linux

src/support/variables/typography.scss

@@ -32,7 +32,29 @@ $lh-condensed: 1.25 !default;
 $lh-default: 1.5 !default;
 
 // Font stacks
-$body-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji" !default;
+// stylelint-disable no-eol-whitespace
+$body-font:
+  // Apple OSs
+  -apple-system,
+  BlinkMacSystemFont,
+
+  // Windows
+  // Note this should be prioritized over `system-ui` to avoid legacy fonts.
+  // See https://infinnie.github.io/blog/2017/systemui.html
+  "Segoe UI Variable",
+  "Segoe UI",
+
+  // Linux-friendly system-level fonts + fallbacks
+  system-ui,
+  ui-sans-serif,
+  Helvetica,
+  Arial,
+  sans-serif,
+
+  // Emojis
+  "Apple Color Emoji",
+  "Segoe UI Emoji" !default;
+// stylelint-enable no-eol-whitespace
 
 // Monospace font stack
 // Note: SFMono-Regular needs to come before SF Mono to fix an older version of the font in Chrome