[SvelteKit] Classes are apply but styles won't when declare in script tag

[Somxhai]

The p tag doesn't have any styles applied to it, even though classes can be applied. On the other hand, the div tag can have both styles and classes applied to it.
do I always have to apply styles directly using the css() method to a class?

<script>
	import { css } from 'styled-system/css';
    const scriptStyle = css({
        color: 'blue.600'
    })
</script>

<h1>Welcome to SvelteKit</h1>
<p class={scriptStyle}>Visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to read the documentation</p>
<div
	class={css({
		fontSize: '2xl',
		fontWeight: 'bold'
	})}
>
	Hello 🐼!
</div>

here is result

and styles won't apply on the p tag

[Somxhai]

asthamer is working on it