broken css url when used "asset" rule type

Why this is a good first issue

CSS URL resolution issue when using 'asset' rule type.

AI Summary

The issue involves incorrect CSS URL resolution when using the 'asset' rule type in Next.js, specifically affecting SVG files. The problem is reproducible and has a clear expected behavior, but the fix may require understanding Next.js's CSS and asset handling mechanisms. No maintainer feedback is available yet.

Issue Description

Link to the code that reproduces this issue

https://codesandbox.io/p/devbox/dark-snow-hcjkjk?workspaceId=ws_NqRDDqBfUUDAADRYf9SdN9&embed=1&file=%2Fnext.config.ts

To Reproduce

npm install
npm run dev
Go to http://localhost:3000
enable/disable rule for svg inside next.config.ts to see bug

// app/style.css
.bg{
  // should correct load image
  background: url("./img.svg");
}

Current vs. Expected behavior

Expected behavior

.bg {
  background: url("../media/img.8569dc29.svg");
}

Current behavior

.bg {
  background: url("./img.svg");
}

without rule for svg it works correct

Provide environment information

Operating System:
  Platform: linux
  Arch: x64
  Version: #1 SMP PREEMPT_DYNAMIC Sun Aug  6 20:05:33 UTC 2023
  Available memory (MB): 4102
  Available CPU cores: 2
Binaries:
  Node: 20.12.1
  npm: 10.5.0
  Yarn: 1.22.19
  pnpm: 8.15.6
Relevant Packages:
  next: 16.2.0-canary.35 // Latest available version is detected (16.2.0-canary.35).
  eslint-config-next: N/A
  react: 19.2.4
  react-dom: 19.2.4
  typescript: 5.9.3
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

CSS

Which stage(s) are affected? (Select all that apply)

next dev (local)

Additional context

GitHub Labels

CSS