Not-found broken with multiple root layouts

Link to the code that reproduces this issue

https://codesandbox.io/p/devbox/blissful-fog-nflrh6

To Reproduce

1. Open sandbox and click not found page
2. It will redirect to the generic nextjs 404 page

Current vs. Expected behavior

Generic 404 Nextjs error page is shown when I navigate to any unknow urls.

I expect to be redirected to my custom 404 UI handler

Verify canary release

• I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
  Platform: darwin
  Arch: x64
  Version: Darwin Kernel Version 22.6.0: Wed Jul  5 22:21:56 PDT 2023; root:xnu-8796.141.3~6/RELEASE_X86_64
Binaries:
  Node: 20.9.0
  npm: 10.1.0
  Yarn: N/A
  pnpm: 8.9.0
Relevant Packages:
  next: 14.0.3
  eslint-config-next: 13.5.6
  react: 18.2.0
  react-dom: 18.2.0
  typescript: 5.2.2
Next.js Config:
  output: N/A

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

App Router, Routing (next/router, next/navigation, next/link)

Additional context

Good to know: In addition to catching expected notFound() errors, the root app/not-found.js file also handles any unmatched URLs for your whole application. This means users that visit a URL that is not handled by your app will be shown the UI exported by the app/not-found.js file.

https://nextjs.org/docs/app/api-reference/file-conventions/not-found

According to the docs in order to be able to handle any unmatched URLs in the application we are bound to the fixed path for the not-found UI that must be placed at the root of the app -> app/not-found.js

This breaks not-found custom UI handling as per provided example.

I've 2 root layout groups https://nextjs.org/docs/app/building-your-application/routing/route-groups#creating-multiple-root-layouts

1. Auth group (which is publicly accessible)
2. Main group (which is accessible if user is authenticated and basically contains the whole app routing)

With this setup and not having app root not-found file it's not possible to be able to handle 404 with custom UI as any 404 url handling is bound to the root app/not-found.tsx.
I believe this should not be bound to the fixed path but rather the top most existing not-found file and if no file exist then generic 404 should intercept. This also applies for the error.tsx I believe.

Start with the linked CodeSandbox reproduction and the Next.js not-found documentation, then inspect how App Router routing behaves with multiple root layout groups. Verify unmatched URLs and expected not-found handling for both groups. Done means the reproduction displays the custom not-found UI instead of the generic Next.js 404 page.