On watch mode generated CSS sometimes is prepended when using multiple CSS files

I've realized that something wrong was happening when changing imports on my .js files. For some reason, sometimes a content that should not be put on the final bundle is prepended to it instead.

## How to reproduce:

1. clone the following sample repository: `git clone https://github.com/juniorgarcia/rollup-postcss-rebuild-error`
2. install deps: `npm install`
3. open the project on VSCode or any other
4. start the dev mode: `npm run dev`
5. open the files `src/index.js` and `dist/bundle.css` and put them side by side
6. on `src/index.js`, uncomment `// import './foo.css'` (here everything works as expected)
7. now comment `// import './foo.css'` again
8. the content of `bundle.css` is now generated wrongly:

```
body {
z-index: 2; /* this line is from `foo.css` which is prepended to the bundle.css instead of being removed */
}

@import url('https://fonts.googleapis.com/css2?family=Work+Sans&display=swap');

body {
z-index: 1;
}

```

I started to realize this when using Linaria in my stack. After thinking that Linaria plugins was causing this, I tried the simplest stack possible without anything other than PostCSS plugin and the erro persists.

My rollup.config.js:
```js
const postcss = require('rollup-plugin-postcss')
const path = require('path')

/** @type {import('rollup').RollupOptions} */
module.exports = {
input: './src/index.js',
output: [
{
file: './dist/bundle.js',
format: 'cjs',
},
],
plugins: [
postcss({
extract: path.resolve(__dirname, 'dist/bundle.css'),
})
]
}
```

My package.json:

```
{
"name": "postcss-rollup",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"dev": "rollup -c rollup.config.js -w"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"postcss": "^8.4.24",
"rollup": "^3.24.0",
"rollup-plugin-postcss": "^4.0.2"
}
}
```

System information:
Node: v18.15.0
NPM: v9.6.2
OS: macOS Ventura 13.3.1 (a)