How to load and apply a 3rd-party stylesheet into a NextJS component after CSS-in-JS globals?

Question

I've got a problem with the loading order in a NextJS app.

We use Stitches CSS-in-JS, which provides globalCss() for loading global styles like resetters/normalizers and it gets invoked in _app.tsx.

On the other hand, a component that requires an external stylesheet uses:

import "@third-party/styles.css"

But unfortunately it gets triggered too early, i.e. before the globalCss() invocation. As a result, global reset-styles override the component styles.

So how to load a 3rd-pary stylesheet after globalCss() styles?