Add CSS cascade layers for Compound, shared components, and app/web styles (#33302)

* Layer Compound and shared component CSS

* Layer app theme CSS

* Remove !important flags from ActionBarView

* Remove unnecessary !important statements from shared components

* Avoid dead code errors for *.pcss just because layer is specified after @import url

* Remove unnecessary !important styling

* Override Banner defaults in RoomStatusBarView

* Updated snaps

* Updated snaps

* Fix styling of media body in app/web

* Fix styling for Compound anchors

* Fix styling issues in app/web

* More styling fixes

* Fix a problem extracting css for HTMLExport

* Revert changes

* Fix for theme styling

* Add test to improve coverage

* Prettier

* Fix styling issues

* Add data-kind attribute to avoid global styling override

* Update screenshot that now is correct

* Revert data-kind attribute

* Handle LinkPreview styling in .pcss

* Fix flaky test: Avoid racing the lazy-loaded ManageEventIndexDialog

* Take care of review comments

* Updated snaps

* Updated snaps again after merge

* Remove !important from RoomStatusBar

apps/web/test/unit-tests/components/views/messages/__snapshots__/MBodyFactory-test.tsx.snap

@@ -3,7 +3,7 @@
 exports[`MBodyFactory renderMBody fallback shows m.audio generic placeholder when showFileInfo is true 1`] = `
 <div>
   <span
-    class="_content_f1s5h_8 mx_MFileBody"
+    class="_content_1t2mx_8 mx_MFileBody"
   >
     <div
       class="mx_MediaBody _mediaBody_rgndh_8"
@@ -44,7 +44,7 @@ exports[`MBodyFactory renderMBody fallback shows m.audio generic placeholder whe
 exports[`MBodyFactory renderMBody fallback shows m.file generic placeholder when showFileInfo is true 1`] = `
 <div>
   <span
-    class="_content_f1s5h_8 mx_MFileBody"
+    class="_content_1t2mx_8 mx_MFileBody"
   >
     <div
       class="mx_MediaBody _mediaBody_rgndh_8"
@@ -82,7 +82,7 @@ exports[`MBodyFactory renderMBody fallback shows m.file generic placeholder when
 exports[`MBodyFactory renderMBody renders download button for m.file in file rendering type 1`] = `
 <div>
   <span
-    class="_content_f1s5h_8 mx_MFileBody"
+    class="_content_1t2mx_8 mx_MFileBody"
   >
     <div
       data-type="download"

apps/web/test/unit-tests/components/views/messages/__snapshots__/MImageBody-test.tsx.snap

@@ -93,7 +93,7 @@ exports[`<MImageBody/> should open ImageView using thumbnail for encrypted svg 1
         </div>
         <a
           aria-live="off"
-          class="mx_MessageTimestamp _content_kc5mt_8"
+          class="mx_MessageTimestamp _content_1r034_8"
           href="https://matrix.to/#/!room:server/undefined"
         >
           Thu, Jan 15, 1970, 06:56
@@ -300,7 +300,7 @@ exports[`<MImageBody/> should open ImageView using thumbnail for encrypted svg 1
 exports[`<MImageBody/> should render MFileBody for svg with no thumbnail 1`] = `
 <DocumentFragment>
   <span
-    class="_content_f1s5h_8 mx_MFileBody"
+    class="_content_1t2mx_8 mx_MFileBody"
   >
     <div
       class="mx_MediaBody _mediaBody_rgndh_8"