Black border around scaffold body during page transition

I get this strange black border when I navigate in my (web) app. The "zoom" animation itself is desirable but I would like to get rid of the black border. Any ideas?

Note that there are no black layers below the content area - this looks like an animation glitch.

The following is an abbreviated version of my widgets and setup:

class MyScaffold extends StatelessWidget {
  const MyScaffold({
    super.key,
    required this.state,
    required this.child,
  });

  final GoRouterState state;
  final Widget child;
  
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: //...,
      body: AdaptiveLayout( // https://pub.dev/packages/flutter_adaptive_scaffold
        internalAnimations: false,
        primaryNavigation: // `NavigationRail` for large screens
        bottomNavigation: // `NavigationBar` for small screens
        body: SlotLayout(
          config: {
            Breakpoints.smallAndUp: SlotLayout.from(
              key: PortalScaffold.bodyKey,
              builder: (_) => Container(
                clipBehavior: Clip.hardEdge,
                decoration: const BoxDecoration(),
                constraints: const BoxConstraints.expand(),
                child: child,
              ),
            ),
          },
        ),
      ),
    );
  }
}

class MyPage extends StatelessWidget {
  const MyPage({super.key});
  @override
  Widget build(BuildContext context) {
    final theme = Theme.of(context);
    final t = AppLocalizations.of(context)!;
    return Scaffold(
      body: Container(
        color: theme.colorScheme.background,
        constraints: const BoxConstraints.expand(),
        child: Text(t.myPageLabel),
      ),
    );
  }
}

final _routerConfig = GoRouter(
  // ...
  routes: [
    // ...
    ShellRoute( // ShellRoute allows navigation widget to be retained on page changes
      builder: (context, state, child) {
        return MyScaffold(state: state, child: child);
      },
      routes: [
        // ...
        GoRoute(
          path: // ...
          builder: (context, state) => const MyPage(),
        );
      ]
    )
  ]
);

MaterialApp.router(
  // ...
  routerConfig: _routerConfig
);

The resulting layout tree:

.
└── MaterialApp
    └── MyScaffold
        └── Scaffold
            └── AdaptiveLayout
                └── SlotLayout
                    └── MyPage
                        └── Scaffold
                            └── // ...

Some rambling to "provide enough detail" for SO to accept my question:

Initially, I had the issue described here which I was able to get around by restructuring my code. From this I got the impression that the Scaffold needs to be an immediate descendant of the Navigator for page transitions to work as expected. However, given my current code I believe this to be the case. I therefore am unsure what is causing the current transition glitch.

The only way to change this that I have found is to disable transition animation for a bottom navigation screen explicitly. When specifying ShellRoute routes using GoRoute use pageBuilder instead of builder and wrap the screen with NoTransitionPage, like that:

GoRoute(
  path: "/bottomNavigation/screenA"
  pageBuilder: (context, state) => NoTransitionPage(child: ScreenA())
)

All routes wrapped by NoTransitionPage will not use any animation at all when navigating to them which is expected behavior for bottom navigation destinations.