It seems you are using primeng on top. I had a similar problem - maybe the same.
I installed the tailwind clinpm install @tailwindcss/cli
My pendant to your styles.scss starts with:

@import 'tailwindcss';@plugin 'tailwindcss-primeui';html {...

The cli is used to generate a compiled version of the styles.scss before cypress is launched by extending the start script inpackage.json like:

{    scripts: {        "cypress-open": "npx @tailwindcss/cli -i ./src/app/styles.scss -o ./cypress/styles/component-test-styles.scss && npx cypress open"

Then, in mycypress.config.ts I added the generated scss file like:

    component: {        devServer: {            options: {                    buildOptions: {                        styles: [                            ...                            'node_modules/primeicons/primeicons.css',                            'cypress/styles/component-test-styles.scss'                        ]

I hope I mentioned everything that was existential to get the component tests running.
There is a watch-option for the styles compiler. But I had problem with restarting tests as the styles file got updated without any actual changes. Being aware of restarting cypress on major style changes was the better workaround than randomly restarting tests.

Btw: Do not use // comments on your styles.scss as the tailwind compiler generates a one liner for the whole file. That means, putting a // anywhere causes the rest of the file being part of the comment!

Edit: As I wrote the example, I actually updated my code form prime-icons 6 to 7 and encountered some issues later with the way to import the icon styles. Different from the documentation it works for me bynot importing it in the scss but putting it in the styles of the build options.