Can I Apply Custom CSS or Style to the Shopify Polaris component?

[ShazzadHossain]

I am developing a Shopify app using Remix Run and React while utilizing Shopify Polaris components.

I want to apply custom CSS styles to a Polaris component without modifying colors, buttons, or fonts.

Is it possible to use custom CSS within a Polaris-based Shopify app? If so, what is the recommended approach to do this while ensuring compatibility with Shopify’s guidelines?

Here is an example of how I am currently applying style:
<div style={{ whiteSpace: "nowrap" }}>
       <Text as="p" variant="bodySm" tone="subdued"> 1 of 3 tasks complete </Text>
</div
Is this approach acceptable, or is there a better way to achieve this?
Additionally, if custom CSS is allowed, could you provide guidance on the best practices for adding custom styles in a Shopify app? What are the recommended methods to ensure that styles do not conflict with Polaris and remain compliant with Shopify’s design system?