🐛(frontend) fix Marianne import

The font face definition wasn't working properly. Switch to vanilla css.

src/frontend/panda.config.ts

@@ -35,40 +35,7 @@ const config: Config = {
   exclude: [],
   jsxFramework: 'react',
   outdir: 'src/styled-system',
-  globalFontface: {
+  globalFontface: {},
-    Marianne: [
-      {
-        src: 'url(/fonts/Marianne-Regular-subset.woff2) format("woff2")',
-        fontWeight: 400,
-        fontStyle: 'normal',
-        fontDisplay: 'swap',
-      },
-      {
-        path: 'url(/fonts/Marianne-Regular_Italic-subset.woff2) format("woff2")',
-        fontWeight: 400,
-        fontStyle: 'italic',
-        fontDisplay: 'swap',
-      },
-      {
-        path: 'url(/fonts/Marianne-Medium-subset.woff2) format("woff2")',
-        fontWeight: 500,
-        fontStyle: 'normal',
-        fontDisplay: 'swap',
-      },
-      {
-        path: 'url(/fonts/Marianne-Bold-subset.woff2) format("woff2")',
-        fontWeight: 700,
-        fontStyle: 'normal',
-        fontDisplay: 'swap',
-      },
-      {
-        path: 'url(/fonts/Marianne-ExtraBold-subset.woff2) format("woff2")',
-        fontWeight: 800,
-        fontStyle: 'normal',
-        fontDisplay: 'swap',
-      },
-    ],
-  },
   theme: {
     ...pandaPreset.theme,
     // media queries are defined in em so that zooming with text-only mode triggers breakpoints

src/frontend/src/styles/fonts.css

@@ -30,6 +30,46 @@
   font-display: swap;
 }
 
+@font-face {
+  font-family: 'Marianne';
+  src: url('/fonts/Marianne-Regular-subset.woff2') format('woff2');
+  font-weight: 400;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'Marianne';
+  src: url('/fonts/Marianne-Regular_Italic-subset.woff2') format('woff2');
+  font-weight: 400;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'Marianne';
+  src: url('/fonts/Marianne-Medium-subset.woff2') format('woff2');
+  font-weight: 500;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'Marianne';
+  src: url('/fonts/Marianne-Bold-subset.woff2') format('woff2');
+  font-weight: 700;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'Marianne';
+  src: url('/fonts/Marianne-ExtraBold-subset.woff2') format('woff2');
+  font-weight: 800;
+  font-style: normal;
+  font-display: swap;
+}
+
 /*
 * to reduce CLS
 * values taken from https://github.com/khempenius/font-fallbacks-dataset/blob/main/font-metric-overrides.csv#L2979