diff --git a/apps/web/res/css/_common.pcss b/apps/web/res/css/_common.pcss
index fe6f775f1e..99c3a3ea65 100644
--- a/apps/web/res/css/_common.pcss
+++ b/apps/web/res/css/_common.pcss
@@ -12,7 +12,6 @@ Please see LICENSE files in the repository root for full details.
 @import "./_font-sizes.pcss";
 @import "./_animations.pcss";
 @import "./_spacing.pcss";
-@import url("maplibre-gl/dist/maplibre-gl.css");
 
 :root {
     --container-border-width: 8px;
diff --git a/apps/web/res/css/_compound.pcss b/apps/web/res/css/_compound.pcss
deleted file mode 100644
index 823cf1ef7b..0000000000
--- a/apps/web/res/css/_compound.pcss
+++ /dev/null
@@ -1,6 +0,0 @@
-/* Shared cascade order: Compound tokens, Compound Web, shared components, then app overrides. */
-@layer compound-tokens, compound-web, shared-components, app-web;
-
-/* Modules bundled with compound apply compound lastly. In order to catch issue due to css class ordering, we put compound at the end */
-@import url("@vector-im/compound-design-tokens/assets/web/css/compound-design-tokens.css") layer(compound-tokens);
-@import url("@vector-im/compound-web/dist/style.css") layer(compound-web);
diff --git a/apps/web/res/css/_index.pcss b/apps/web/res/css/_index.pcss
new file mode 100644
index 0000000000..842bb0c6b8
--- /dev/null
+++ b/apps/web/res/css/_index.pcss
@@ -0,0 +1,13 @@
+/*
+Copyright 2026 Element Creations Ltd.
+
+SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial
+Please see LICENSE files in the repository root for full details.
+*/
+
+@layer compound-tokens, compound-web, shared-components, app-web;
+
+@import url("maplibre-gl/dist/maplibre-gl.css") layer(app-web);
+@import url("@vector-im/compound-design-tokens/assets/web/css/compound-design-tokens.css") layer(compound-tokens);
+@import url("@vector-im/compound-web/dist/style.css") layer(compound-web);
+@import url("@element-hq/web-shared-components/dist/element-web-shared-components.css") layer(shared-components);
diff --git a/apps/web/res/css/rethemendex.sh b/apps/web/res/css/rethemendex.sh
index 3f0ed28e3f..593a4202cf 100755
--- a/apps/web/res/css/rethemendex.sh
+++ b/apps/web/res/css/rethemendex.sh
@@ -8,7 +8,7 @@ cd `dirname $0`
     # we used to have exclude /themes from the find at this point.
     # as themes are no longer a spurious subdirectory of css/, we don't
     # need it any more.
-    find . -iname _\*.pcss | fgrep -v _components.pcss | fgrep -v _compound.pcss | LC_ALL=C sort |
+    find . -iname _\*.pcss | fgrep -v _components.pcss | fgrep -v _index.pcss | LC_ALL=C sort |
         while read i; do
             echo "@import \"$i\";"
         done
diff --git a/apps/web/res/themes/dark-custom/css/dark-custom.pcss b/apps/web/res/themes/dark-custom/css/dark-custom.pcss
index 1b1b30f33d..9b35a20830 100644
--- a/apps/web/res/themes/dark-custom/css/dark-custom.pcss
+++ b/apps/web/res/themes/dark-custom/css/dark-custom.pcss
@@ -6,6 +6,5 @@
 @import "../../legacy-dark/css/_legacy-dark.pcss" layer(app-web);
 @import "../../light-custom/css/_custom.pcss" layer(app-web);
 @import "../../../../res/css/_components.pcss" layer(app-web);
-@import "../../../../res/css/_compound.pcss";
 @import url("highlight.js/styles/atom-one-light.min.css") layer(app-web);
 @import url("github-markdown-css/github-markdown-dark.css") layer(app-web);
diff --git a/apps/web/res/themes/dark/css/dark.pcss b/apps/web/res/themes/dark/css/dark.pcss
index abb4fc04ee..5c99972843 100644
--- a/apps/web/res/themes/dark/css/dark.pcss
+++ b/apps/web/res/themes/dark/css/dark.pcss
@@ -6,6 +6,5 @@
 @import "_dark.pcss" layer(app-web);
 @import "../../light/css/_mods.pcss" layer(app-web);
 @import "../../../../res/css/_components.pcss" layer(app-web);
-@import "../../../../res/css/_compound.pcss";
 @import url("highlight.js/styles/atom-one-dark.min.css") layer(app-web);
 @import url("github-markdown-css/github-markdown-dark.css") layer(app-web);
diff --git a/apps/web/res/themes/legacy-dark/css/legacy-dark.pcss b/apps/web/res/themes/legacy-dark/css/legacy-dark.pcss
index 99dadd6eab..e9033a8d53 100644
--- a/apps/web/res/themes/legacy-dark/css/legacy-dark.pcss
+++ b/apps/web/res/themes/legacy-dark/css/legacy-dark.pcss
@@ -5,6 +5,5 @@
 @import "../../legacy-light/css/_legacy-light.pcss" layer(app-web);
 @import "_legacy-dark.pcss" layer(app-web);
 @import "../../../../res/css/_components.pcss" layer(app-web);
-@import "../../../../res/css/_compound.pcss";
 @import url("highlight.js/styles/atom-one-dark.min.css") layer(app-web);
 @import url("github-markdown-css/github-markdown-dark.css") layer(app-web);
diff --git a/apps/web/res/themes/legacy-light/css/legacy-light.pcss b/apps/web/res/themes/legacy-light/css/legacy-light.pcss
index dcc7b1a82a..4ba72f3e93 100644
--- a/apps/web/res/themes/legacy-light/css/legacy-light.pcss
+++ b/apps/web/res/themes/legacy-light/css/legacy-light.pcss
@@ -4,6 +4,5 @@
 @import "_fonts.pcss" layer(app-web);
 @import "_legacy-light.pcss" layer(app-web);
 @import "../../../../res/css/_components.pcss" layer(app-web);
-@import "../../../../res/css/_compound.pcss";
 @import url("highlight.js/styles/atom-one-light.min.css") layer(app-web);
 @import url("github-markdown-css/github-markdown-light.css") layer(app-web);
diff --git a/apps/web/res/themes/light-custom/css/light-custom.pcss b/apps/web/res/themes/light-custom/css/light-custom.pcss
index ce575e0518..28386e3609 100644
--- a/apps/web/res/themes/light-custom/css/light-custom.pcss
+++ b/apps/web/res/themes/light-custom/css/light-custom.pcss
@@ -5,6 +5,5 @@
 @import "../../legacy-light/css/_legacy-light.pcss" layer(app-web);
 @import "_custom.pcss" layer(app-web);
 @import "../../../../res/css/_components.pcss" layer(app-web);
-@import "../../../../res/css/_compound.pcss";
 @import url("highlight.js/styles/atom-one-light.min.css") layer(app-web);
 @import url("github-markdown-css/github-markdown-light.css") layer(app-web);
diff --git a/apps/web/res/themes/light-high-contrast/css/light-high-contrast.pcss b/apps/web/res/themes/light-high-contrast/css/light-high-contrast.pcss
index b1c35e414e..c71b1c4324 100644
--- a/apps/web/res/themes/light-high-contrast/css/light-high-contrast.pcss
+++ b/apps/web/res/themes/light-high-contrast/css/light-high-contrast.pcss
@@ -6,6 +6,5 @@
 @import "_light-high-contrast.pcss" layer(app-web);
 @import "../../light/css/_mods.pcss" layer(app-web);
 @import "../../../../res/css/_components.pcss" layer(app-web);
-@import "../../../../res/css/_compound.pcss";
 @import url("highlight.js/styles/atom-one-light.min.css") layer(app-web);
 @import url("github-markdown-css/github-markdown-light.css") layer(app-web);
diff --git a/apps/web/res/themes/light/css/light.pcss b/apps/web/res/themes/light/css/light.pcss
index 10e5e05d78..7151f71539 100644
--- a/apps/web/res/themes/light/css/light.pcss
+++ b/apps/web/res/themes/light/css/light.pcss
@@ -5,6 +5,5 @@
 @import "_light.pcss" layer(app-web);
 @import "_mods.pcss" layer(app-web);
 @import "../../../../res/css/_components.pcss" layer(app-web);
-@import "../../../../res/css/_compound.pcss";
 @import url("highlight.js/styles/atom-one-light.min.css") layer(app-web);
 @import url("github-markdown-css/github-markdown-light.css") layer(app-web);
diff --git a/apps/web/src/vector/index.ts b/apps/web/src/vector/index.ts
index d3e2f5f727..fb7a842f62 100644
--- a/apps/web/src/vector/index.ts
+++ b/apps/web/src/vector/index.ts
@@ -18,9 +18,7 @@ import { parseAppUrl } from "./url_utils";
 import "./modernizr.cjs";
 import { polyfillTouchEvent } from "../@types/polyfill";
 
-// Import shared components CSS
-import "@element-hq/web-shared-components/dist/element-web-shared-components.css";
-
+import "../../res/css/_index.pcss";
 // Require common CSS here; this will make webpack process it into bundle.css.
 // Our own CSS (which is themed) is imported via separate webpack entry points
 // in webpack.config.js