Can't find a way to remove the `svelte-${hash}` css scope

[Yrobot]

Describe the bug

Hi, i want to use svelte component to build web component, but find out that there ara many svelte-${hash} in the css code.

As i know, this hash code is for the svelte component css scope, but in web component shadow dom, there is no need to handle css scope problem, so i try to remove those svelte-${hash}, but i could not find a way.

Reproduction

<nav class="navbar min-h-0 px-0 py-3 hover:shadow-md">
  <div class="section-container flex items-center justify-between">
  </div>
</nav>

=>

<nav class="navbar min-h-0 px-0 py-3 hover:shadow-md svelte-1pm0tw7">
  <div class="section-container flex items-center justify-between svelte-1pm0tw7">
  </div>
</nav>

Logs

No response

System Info

System:
    OS: macOS 13.5.1
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
    Memory: 209.48 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.18.2 - ~/.nvm/versions/node/v18.18.2/bin/node
    Yarn: 1.22.19 - ~/.nvm/versions/node/v18.18.2/bin/yarn
    npm: 9.8.1 - ~/.nvm/versions/node/v18.18.2/bin/npm
    bun: 1.0.20 - ~/.bun/bin/bun
  Browsers:
    Chrome: 122.0.6261.112
    Safari: 16.6
  npmPackages:
    svelte: ^4.2.12 => 4.2.12

Severity

annoyance

[dummdidumm]

If you're using multiple Svelte component within on web component, scoping would still be necessary. We could optimize for the case where we detect that there's only a single component, but I'm not sure if that's worth it.