diff --git a/web/apps/accounts/src/pages/_app.tsx b/web/apps/accounts/src/pages/_app.tsx
index e52d4abc28..3b425cb965 100644
--- a/web/apps/accounts/src/pages/_app.tsx
+++ b/web/apps/accounts/src/pages/_app.tsx
@@ -2,12 +2,12 @@ import { staticAppTitle } from "@/base/app";
 import { CustomHead } from "@/base/components/Head";
 import { AttributedMiniDialog } from "@/base/components/MiniDialog";
 import { ActivityIndicator } from "@/base/components/mui/ActivityIndicator";
+import { Overlay } from "@/base/components/mui/Container";
 import { AppNavbar } from "@/base/components/Navbar";
 import { useAttributedMiniDialog } from "@/base/components/utils/dialog";
 import { setupI18n } from "@/base/i18n";
 import { disableDiskLogs } from "@/base/log";
 import { logUnhandledErrorsAndRejections } from "@/base/log-web";
-import { Overlay } from "@ente/shared/components/Container";
 import { getTheme } from "@ente/shared/themes";
 import { THEME_COLOR } from "@ente/shared/themes/constants";
 import { CssBaseline } from "@mui/material";
diff --git a/web/apps/auth/src/pages/_app.tsx b/web/apps/auth/src/pages/_app.tsx
index 5557ace23d..b8cb12239d 100644
--- a/web/apps/auth/src/pages/_app.tsx
+++ b/web/apps/auth/src/pages/_app.tsx
@@ -4,6 +4,7 @@ import { clientPackageName, staticAppTitle } from "@/base/app";
 import { CustomHead } from "@/base/components/Head";
 import { AttributedMiniDialog } from "@/base/components/MiniDialog";
 import { ActivityIndicator } from "@/base/components/mui/ActivityIndicator";
+import { Overlay } from "@/base/components/mui/Container";
 import { AppNavbar } from "@/base/components/Navbar";
 import {
     genericErrorDialogAttributes,
@@ -15,7 +16,6 @@ import {
     logUnhandledErrorsAndRejections,
 } from "@/base/log-web";
 import { ensure } from "@/utils/ensure";
-import { Overlay } from "@ente/shared/components/Container";
 import { MessageContainer } from "@ente/shared/components/MessageContainer";
 import { useLocalState } from "@ente/shared/hooks/useLocalState";
 import HTTPService from "@ente/shared/network/HTTPService";
diff --git a/web/apps/photos/src/components/PhotoViewer/index.tsx b/web/apps/photos/src/components/PhotoViewer/index.tsx
index e13c49f8ea..d1ee5f59de 100644
--- a/web/apps/photos/src/components/PhotoViewer/index.tsx
+++ b/web/apps/photos/src/components/PhotoViewer/index.tsx
@@ -1,5 +1,6 @@
 import { isDesktop } from "@/base/app";
 import { ActivityIndicator } from "@/base/components/mui/ActivityIndicator";
+import { Overlay } from "@/base/components/mui/Container";
 import { lowercaseExtension } from "@/base/file";
 import log from "@/base/log";
 import type { LoadedLivePhotoSourceURL } from "@/media/file";
@@ -9,7 +10,7 @@ import { isHEICExtension, needsJPEGConversion } from "@/media/formats";
 import downloadManager from "@/new/photos/services/download";
 import { extractRawExif, parseExif } from "@/new/photos/services/exif";
 import { AppContext } from "@/new/photos/types/context";
-import { FlexWrapper, Overlay } from "@ente/shared/components/Container";
+import { FlexWrapper } from "@ente/shared/components/Container";
 import AlbumOutlined from "@mui/icons-material/AlbumOutlined";
 import ChevronLeft from "@mui/icons-material/ChevronLeft";
 import ChevronRight from "@mui/icons-material/ChevronRight";
diff --git a/web/apps/photos/src/components/Sidebar/SubscriptionCard.tsx b/web/apps/photos/src/components/Sidebar/SubscriptionCard.tsx
index 8da968f22b..cd121608ce 100644
--- a/web/apps/photos/src/components/Sidebar/SubscriptionCard.tsx
+++ b/web/apps/photos/src/components/Sidebar/SubscriptionCard.tsx
@@ -1,6 +1,7 @@
+import { Overlay } from "@/base/components/mui/Container";
 import type { ButtonishProps } from "@/new/photos/components/mui";
 import { bytesInGB, formattedStorageByteSize } from "@/new/photos/utils/units";
-import { Overlay, SpaceBetweenFlex } from "@ente/shared/components/Container";
+import { SpaceBetweenFlex } from "@ente/shared/components/Container";
 import ChevronRightIcon from "@mui/icons-material/ChevronRight";
 import CircleIcon from "@mui/icons-material/Circle";
 import {
diff --git a/web/apps/photos/src/components/pages/gallery/PreviewCard.tsx b/web/apps/photos/src/components/pages/gallery/PreviewCard.tsx
index 0f66a27ed6..64a44ff335 100644
--- a/web/apps/photos/src/components/pages/gallery/PreviewCard.tsx
+++ b/web/apps/photos/src/components/pages/gallery/PreviewCard.tsx
@@ -1,3 +1,4 @@
+import { Overlay } from "@/base/components/mui/Container";
 import log from "@/base/log";
 import { EnteFile } from "@/media/file";
 import { FileType } from "@/media/file-type";
@@ -11,7 +12,6 @@ import {
 } from "@/new/photos/components/PlaceholderThumbnails";
 import { TRASH_SECTION } from "@/new/photos/services/collection";
 import DownloadManager from "@/new/photos/services/download";
-import { Overlay } from "@ente/shared/components/Container";
 import { CustomError } from "@ente/shared/error";
 import useLongPress from "@ente/shared/hooks/useLongPress";
 import AlbumOutlined from "@mui/icons-material/AlbumOutlined";
diff --git a/web/apps/photos/src/pages/_app.tsx b/web/apps/photos/src/pages/_app.tsx
index 361a0be901..7a1582b8e4 100644
--- a/web/apps/photos/src/pages/_app.tsx
+++ b/web/apps/photos/src/pages/_app.tsx
@@ -2,6 +2,7 @@ import { clientPackageName, staticAppTitle } from "@/base/app";
 import { CustomHead } from "@/base/components/Head";
 import { AttributedMiniDialog } from "@/base/components/MiniDialog";
 import { ActivityIndicator } from "@/base/components/mui/ActivityIndicator";
+import { Overlay } from "@/base/components/mui/Container";
 import { AppNavbar } from "@/base/components/Navbar";
 import {
     genericErrorDialogAttributes,
@@ -24,7 +25,6 @@ import DownloadManager from "@/new/photos/services/download";
 import { runMigrations } from "@/new/photos/services/migrations";
 import { initML, isMLSupported } from "@/new/photos/services/ml";
 import { AppContext } from "@/new/photos/types/context";
-import { Overlay } from "@ente/shared/components/Container";
 import DialogBox from "@ente/shared/components/DialogBox";
 import { DialogBoxAttributes } from "@ente/shared/components/DialogBox/types";
 import { MessageContainer } from "@ente/shared/components/MessageContainer";
diff --git a/web/packages/base/components/mui/Container.tsx b/web/packages/base/components/mui/Container.tsx
index d985fc033a..abaa0e2dce 100644
--- a/web/packages/base/components/mui/Container.tsx
+++ b/web/packages/base/components/mui/Container.tsx
@@ -24,3 +24,15 @@ export const CenteredBox = styled("div")`
     justify-content: center;
     align-items: center;
 `;
+
+/**
+ * An absolute positioned div that fills the entire nearest relatively
+ * positioned ancestor.
+ */
+export const Overlay = styled("div")`
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    top: 0;
+    left: 0;
+`;
diff --git a/web/packages/new/photos/components/PlaceholderThumbnails.tsx b/web/packages/new/photos/components/PlaceholderThumbnails.tsx
index 0fcab06569..d6fab83a28 100644
--- a/web/packages/new/photos/components/PlaceholderThumbnails.tsx
+++ b/web/packages/new/photos/components/PlaceholderThumbnails.tsx
@@ -1,5 +1,5 @@
+import { Overlay } from "@/base/components/mui/Container";
 import { FileType } from "@/media/file-type";
-import { Overlay } from "@ente/shared/components/Container";
 import PhotoOutlined from "@mui/icons-material/PhotoOutlined";
 import PlayCircleOutlineOutlined from "@mui/icons-material/PlayCircleOutlineOutlined";
 import { styled } from "@mui/material";
diff --git a/web/packages/new/photos/components/gallery/BarImpl.tsx b/web/packages/new/photos/components/gallery/BarImpl.tsx
index 6821b622b0..29c9d7987c 100644
--- a/web/packages/new/photos/components/gallery/BarImpl.tsx
+++ b/web/packages/new/photos/components/gallery/BarImpl.tsx
@@ -1,3 +1,4 @@
+import { Overlay } from "@/base/components/mui/Container";
 import { useIsSmallWidth } from "@/base/hooks";
 import { CollectionsSortOptions } from "@/new/photos/components/CollectionsSortOptions";
 import { FilledIconButton } from "@/new/photos/components/mui";
@@ -18,7 +19,6 @@ import type {
 } from "@/new/photos/services/collection/ui";
 import type { Person } from "@/new/photos/services/ml/people";
 import { ensure } from "@/utils/ensure";
-import { Overlay } from "@ente/shared/components/Container";
 import ArchiveIcon from "@mui/icons-material/Archive";
 import ExpandMore from "@mui/icons-material/ExpandMore";
 import Favorite from "@mui/icons-material/FavoriteRounded";
diff --git a/web/packages/shared/components/Container.tsx b/web/packages/shared/components/Container.tsx
index 9a1eb9666e..3472e2c5b4 100644
--- a/web/packages/shared/components/Container.tsx
+++ b/web/packages/shared/components/Container.tsx
@@ -32,13 +32,6 @@ export const FluidContainer = styled(FlexWrapper)`
     flex: 1;
 `;
 
-export const Overlay = styled(Box)`
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    top: 0;
-    left: 0;
-`;
 
 export const HorizontalFlex = styled(Box)({
     display: "flex",