So i have been trying to get fonts from google fonts to work in my project, but for some reason fonts like 'Raleway Dots' or 'Dancing Script' just dont work whereas single word fonts like 'Raleway', 'Montserrat' work just fine. Here are my app.css, tailwind config and the svelte file
@tailwind components;@tailwind utilities;@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400..700&family=Jersey+10&family=Jersey+10+Charted&family=Jersey+20&family=Jersey+20+Charted&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Noto+Sans+Math&family=Noto+Sans:ital,wght@0,100..900;1,100..900&family=Noto+Serif:ital,wght@0,100..900;1,100..900&family=Raleway+Dots&family=Raleway:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');.flexc { @apply flex justify-center items-center;}.dbw { border: solid white 2px;}.dbb { border: solid black 2px;}/** @type {import('tailwindcss').Config} */export default { content: ["./src/**/*.{html,js,svelte,ts}"], theme: { fontFamily: { primary: ["Raleway"], secondary: ["Montserrat"], tertiary: ["Roboto"], dots: ["Raleway Dots"], cursive: ['Dancing\\ Script'], jersey: ["Jersey\\ 10"], jerseycharted: ["Jersey\\ 10\\ Charted"], jersey2: ["Jersey\\ 20"], jersey2charted: ["Jersey\\ 20\\ Charted"], sans: ["Noto\\ Sans"], serif: ["Noto\\ Serif"], }, }, plugins: [],};<script lang="ts"></script><div class="w-screen h-screen bg-black flexc font-cursive text-white text-6xl"><h1>Hi There</h1></div>I tried to use all the escape sequences as mentioned in the tailwindcss docs but nothing worked.