Flutter showcaseview overly is pushing to end inside aspect ratio

Question

I am using flutter showcase view widget to show overlay tutorial in my app but there is problem that I am facing which is on Web i.e. chrome, the problem is that it pushes my target overlay to end when I put showcasewidget inside aspect ratio and center widget. here are 2 picture of what my issue looks first is when I apply center and aspectratio and second without center widget 1 2

as you can see that when I am applying center widget it pushed target overlay to end, my code widget tree looks like this

centerWidget -> aspectRatio -> Stack -> ShowCaseWidget -> otherWidgets

Below is my code and inside RouteNavigator widget it conatines ShowCaseWidget.

Center(
      child: AspectRatio(
            aspectRatio: 390 / 780,
            child: Container(
                decoration: const BoxDecoration(
                  boxShadow: [
                    BoxShadow(
                      blurRadius: 25.0,
                      spreadRadius: 5.0,
                    ),
                  ],
                ),
                child: ScreenUtilInit(
                  designSize: const Size(390, 844), // figma design frame size
                  minTextAdapt: true,
                  builder: (context, child) {
                    return MaterialApp(
                      navigatorKey: NavigationService.globalNavigatorKey,
                      debugShowCheckedModeBanner: false,
                      scrollBehavior: const MaterialScrollBehavior().copyWith(
                        dragDevices: {
                          PointerDeviceKind.mouse,
                          PointerDeviceKind.touch,
                          PointerDeviceKind.stylus,
                          PointerDeviceKind.unknown
                        },
                      ),
                      title: 'My App',
                      theme: ThemeData(
                        fontFamily: 'Inter',
                        primarySwatch: Colors.blue,
                      ),
                      home: AnimatedOpacity(
                        opacity: 1,
                        duration: const Duration(seconds: 1),
                        child: ValueListenableBuilder(
                          valueListenable: pageManager.onboardingSettings,
                          builder: (context, value, child) {
                            // print("onboardingSettings:$value");
                            if (value == false) {
                              return const OnBoarding();
                            } else {
                              return Stack(
                                children: [
                                  RouteNavigator(),
                                  Positioned(
                                    left: 0,
                                    right: 0,
                                    child: IgnorePointer(child: confetti(context))
                                  ),
                                ],
                              );
                            }
                          },
                        ),
                      ),
                      builder: EasyLoading.init(),
                    );
                  },
                ),
              ),
          )

I had tried putting showcasewidget at top of center widget, also used stack and inside it put showcase widget but no success.