fix: storybook font rendering and shared fonts module

src/shared/lib/fonts.ts

@@ -0,0 +1,18 @@
+import { Fraunces, Public_Sans } from 'next/font/google'
+
+/**
+ * Heading font — variable axes for brutalist variation settings
+ */
+export const fraunces = Fraunces({
+  subsets: ['latin'],
+  variable: '--font-fraunces',
+  axes: ['opsz', 'SOFT', 'WONK'],
+})
+
+/**
+ * Body font
+ */
+export const publicSans = Public_Sans({
+  subsets: ['latin'],
+  variable: '--font-public-sans',
+})

src/shared/lib/index.ts

@@ -1,2 +1,3 @@
 export { cn } from './cn'
 export type { ClassValue } from 'clsx'
+export * from './fonts'

src/shared/styles/theme.css

@@ -80,6 +80,9 @@
 }
 
 @theme inline {
+  --font-heading: var(--font-fraunces);
+  --font-body: var(--font-public-sans);
+
   --color-ochre-clay: var(--ochre-clay);
   --color-slate-indigo: var(--slate-indigo);
   --color-burnt-oxide: var(--burnt-oxide);