Local fonts + SF typography

package.json

@@ -16,6 +16,9 @@
   "license": "MIT",
   "private": true,
   "dependencies": {
+    "@fontsource/encode-sans": "^4.5.9",
+    "@fontsource/encode-sans-condensed": "^4.5.9",
+    "@fontsource/exo": "^4.5.10",
     "@league-of-foundry-developers/foundry-vtt-types": "^9.269.0",
     "@tinymce/tinymce-vue": "^5.0.0",
     "@types/lodash": "^4.14.170",

src/module/vue/components/rules-text/rules-text.vue

@@ -14,7 +14,6 @@
 </template>
 <style lang="less">
 @import (reference) '../../../../styles/mixins.less';
-
 .rules-text {
   --ironsworn-rules-text-spacer: 0.5em;
   display: flex;

src/styles/assets.less

@@ -1,4 +1,5 @@
 @import (reference) './themes/mixins/decorations.less';
+@import (reference) './mixins.less';
 
 @asset_spacer: 0.5em;
 
@@ -32,6 +33,7 @@
       line-height: 1;
       font-style: italic;
       transition: inherit;
+      .textCompactMixin();
     }
     .asset-controls {
       justify-items: flex-end;
@@ -59,6 +61,7 @@
         .asset-field-label {
           padding: 0;
           margin: 0;
+          .textCompactMixin();
         }
         .asset-field-value {
           margin: 0;
@@ -75,6 +78,7 @@
         display: flex;
         flex-direction: row;
         gap: @asset_spacer;
+        .textCompactMixin();
       }
     }
   }

src/styles/fvtt/tooltip.less

@@ -1,3 +1,5 @@
+@import (reference) '../mixins.less';
+
 #tooltip {
   // TODO: currently this isn't really changing much, but i'd like to revisit it for the dark theme.
   background: var(--ironsworn-color-dark-90);
@@ -9,4 +11,5 @@
   border-radius: 3px;
   box-shadow: 0 0 4px #000;
   pointer-events: none;
+  .textCompactMixin();
 }

src/styles/mixins.less

@@ -364,3 +364,12 @@
     }
   }
 }
+
+.textCompactMixin {
+  font-family: var(--font-compact);
+  letter-spacing: 0.015em;
+  word-spacing: 0.015em;
+}
+
+.textDisplayMixin {
+}

src/styles/themes/starforged.less

@@ -1,5 +1,7 @@
 // Dark theme for Starforged, with aggressive restyling of FVTT's stock UX elements.
 
+@import '@fontsource/encode-sans-condensed/latin';
+@import '@fontsource/encode-sans/latin';
 @import './starforged-font.css'; // HACK to avoid import error
 @import (reference) '../mixins.less';
 @import (reference) './mixins/colors.less';
@@ -13,7 +15,9 @@
   .ironswornDarkThemeMixin(ironsworn-color);
   .softBorderMixin(ironsworn-color);
   .interactiveTintMixin(ironsworn-color-clickable-block,ironsworn-color);
-  --font-primary: 'Carrois Gothic SC', sans-serif;
+  // --font-primary: 'Carrois Gothic SC', sans-serif;
+  --font-primary: 'Encode Sans', sans-serif;
+  --font-compact: 'Encode Sans Condensed', sans-serif;
 
   --ironsworn-color-text-stroke: var(--ironsworn-color-bg);