I think @patak-dev's post sheds some light on what might be going on here: https://patak.dev/vite/build.html#_14-vite-css-post. Specifically, this part:

This plugin will transform dynamic imports using this helper. The following

import('./async.js')

will be transpiled into

preload(
 () => import('/assets/async.js),
 ['/assets/async.css','/assets/async-dep.js']
)

It seems like what is needed is a more robust tree-walking which does not simply create a .css file for each dynamically imported asset, but rather builds up a list of files that need to be created, and then actually inject them in the correct order.

So, if we have moduleA and common which both have css modules, and might look like this:

// moduleA.js
import 'common'
import styles from 'moduleA.module.css'

// common.js
import styles from 'common.module.css'

Currently the import order is:

moduleA.js
moduleA.css
common.js
common.css

But in reality what we need is:

moduleA.js
common.js
common.css
moduleA.css

The latest work on this is being done in #9278.