How to load separate css files for separate pages

[hiren]

Describe the feature

As of now, I am importing this way: <style src="~/assets/css/helper.scss" scoped></style> and it's working fine for that page and not loading globally, but there is one issue in this that tailwind classes are not working when I am trying to use like this :
.btn-primary { @apply py-2 px-4 bg-purple text-white font-semibold rounded-lg shadow-md focus:outline-none focus:ring-2 focus:ring-opacity-75; }

Does anyone know the solution to how to load CSS files separately page-wise and still how we can use tailwind properties?

Thanks

Additional information

• Would you be willing to help implement this feature?
• Could this feature be implemented as a module?

Final checks

• Read the contribution guide.
• Check existing discussions and issues.