Hello i have an API route that generate OG image. I load the font from my public folder, the font load correctly, and pass it as param of ReponseImage, but the font keep to be the base font.

Loading the font

 
...
const fontData = await fetch(
      new URL('../../../../../public/inter-bold.ttf', import.meta.url),
    ).then((res) => {  return res.arrayBuffer(); });
...

Apply the font to the ResponseImage params

...
  {
          width: 1280,
          height: 628,
          fonts: [{
            name: 'inter',
            data: fontData,
            style:'normal'
          }]
        }
...

Apply the font familly to the HTML

...
<div
            style={{
              backgroundSize: "100% 100%",
              height: "100%",
              width: "100%",
              display: "flex",
              flexDirection: "column",
              alignItems: "flex-start",
              justifyContent: "center",
              fontFamily: '"inter"',
              padding: "40px 80px",
            }}
          >
...

but the displayed text "Politic" continue to show as default font.
Any idea of what happens ?