diff --git a/res/css/_components.pcss b/res/css/_components.pcss
index 9179085cab..cc7c6a2e2a 100644
--- a/res/css/_components.pcss
+++ b/res/css/_components.pcss
@@ -374,6 +374,4 @@
 @import "./voice-broadcast/atoms/_PlaybackControlButton.pcss";
 @import "./voice-broadcast/atoms/_VoiceBroadcastControl.pcss";
 @import "./voice-broadcast/atoms/_VoiceBroadcastHeader.pcss";
-@import "./voice-broadcast/molecules/_VoiceBroadcastPlaybackBody.pcss";
-@import "./voice-broadcast/molecules/_VoiceBroadcastRecordingBody.pcss";
-@import "./voice-broadcast/molecules/_VoiceBroadcastRecordingPip.pcss";
+@import "./voice-broadcast/molecules/_VoiceBroadcastBody.pcss";
diff --git a/res/css/voice-broadcast/molecules/_VoiceBroadcastRecordingPip.pcss b/res/css/voice-broadcast/molecules/_VoiceBroadcastBody.pcss
similarity index 84%
rename from res/css/voice-broadcast/molecules/_VoiceBroadcastRecordingPip.pcss
rename to res/css/voice-broadcast/molecules/_VoiceBroadcastBody.pcss
index 11534a4797..37606f993c 100644
--- a/res/css/voice-broadcast/molecules/_VoiceBroadcastRecordingPip.pcss
+++ b/res/css/voice-broadcast/molecules/_VoiceBroadcastBody.pcss
@@ -14,22 +14,26 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-.mx_VoiceBroadcastRecordingPip {
-    background-color: $system;
+.mx_VoiceBroadcastBody {
+    background-color: $quinary-content;
     border-radius: 8px;
-    box-shadow: 0 2px 8px 0 #0000004a;
     display: inline-block;
     padding: $spacing-12;
 }
 
-.mx_VoiceBroadcastRecordingPip_divider {
+.mx_VoiceBroadcastBody--pip {
+    background-color: $system;
+    box-shadow: 0 2px 8px 0 #0000004a;
+}
+
+.mx_VoiceBroadcastBody_divider {
     background-color: $quinary-content;
     border: 0;
     height: 1px;
     margin: $spacing-12 0;
 }
 
-.mx_VoiceBroadcastRecordingPip_controls {
+.mx_VoiceBroadcastBody_controls {
     display: flex;
     justify-content: space-around;
 }
diff --git a/res/css/voice-broadcast/molecules/_VoiceBroadcastPlaybackBody.pcss b/res/css/voice-broadcast/molecules/_VoiceBroadcastPlaybackBody.pcss
deleted file mode 100644
index 11921e1f95..0000000000
--- a/res/css/voice-broadcast/molecules/_VoiceBroadcastPlaybackBody.pcss
+++ /dev/null
@@ -1,27 +0,0 @@
-/*
-Copyright 2022 The Matrix.org Foundation C.I.C.
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-    http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
-*/
-
-.mx_VoiceBroadcastPlaybackBody {
-    background-color: $quinary-content;
-    border-radius: 8px;
-    display: inline-block;
-    padding: 12px;
-}
-
-.mx_VoiceBroadcastPlaybackBody_controls {
-    display: flex;
-    justify-content: center;
-}
diff --git a/res/css/voice-broadcast/molecules/_VoiceBroadcastRecordingBody.pcss b/res/css/voice-broadcast/molecules/_VoiceBroadcastRecordingBody.pcss
deleted file mode 100644
index 13e3104c9a..0000000000
--- a/res/css/voice-broadcast/molecules/_VoiceBroadcastRecordingBody.pcss
+++ /dev/null
@@ -1,29 +0,0 @@
-/*
-Copyright 2022 The Matrix.org Foundation C.I.C.
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-    http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
-*/
-
-.mx_VoiceBroadcastRecordingBody {
-    align-items: flex-start;
-    background-color: $quinary-content;
-    border-radius: 8px;
-    display: inline-flex;
-    gap: $spacing-8;
-    padding: 12px;
-}
-
-.mx_VoiceBroadcastRecordingBody_title {
-    font-size: $font-12px;
-    font-weight: $font-semi-bold;
-}
diff --git a/src/voice-broadcast/components/molecules/VoiceBroadcastPlaybackBody.tsx b/src/voice-broadcast/components/molecules/VoiceBroadcastPlaybackBody.tsx
index e0634636a7..e6f2e343cb 100644
--- a/src/voice-broadcast/components/molecules/VoiceBroadcastPlaybackBody.tsx
+++ b/src/voice-broadcast/components/molecules/VoiceBroadcastPlaybackBody.tsx
@@ -74,14 +74,14 @@ export const VoiceBroadcastPlaybackBody: React.FC<VoiceBroadcastPlaybackBodyProp
     }
 
     return (
-        <div className="mx_VoiceBroadcastPlaybackBody">
+        <div className="mx_VoiceBroadcastBody">
             <VoiceBroadcastHeader
                 live={live}
                 sender={sender}
                 room={room}
                 showBroadcast={true}
             />
-            <div className="mx_VoiceBroadcastPlaybackBody_controls">
+            <div className="mx_VoiceBroadcastBody_controls">
                 { control }
             </div>
         </div>
diff --git a/src/voice-broadcast/components/molecules/VoiceBroadcastRecordingBody.tsx b/src/voice-broadcast/components/molecules/VoiceBroadcastRecordingBody.tsx
index b9721170eb..1b13377da9 100644
--- a/src/voice-broadcast/components/molecules/VoiceBroadcastRecordingBody.tsx
+++ b/src/voice-broadcast/components/molecules/VoiceBroadcastRecordingBody.tsx
@@ -27,7 +27,7 @@ export const VoiceBroadcastRecordingBody: React.FC<VoiceBroadcastRecordingBodyPr
     } = useVoiceBroadcastRecording(recording);
 
     return (
-        <div className="mx_VoiceBroadcastRecordingBody">
+        <div className="mx_VoiceBroadcastBody">
             <VoiceBroadcastHeader
                 live={live}
                 sender={sender}
diff --git a/src/voice-broadcast/components/molecules/VoiceBroadcastRecordingPip.tsx b/src/voice-broadcast/components/molecules/VoiceBroadcastRecordingPip.tsx
index 57e291cae0..d737c6aaa2 100644
--- a/src/voice-broadcast/components/molecules/VoiceBroadcastRecordingPip.tsx
+++ b/src/voice-broadcast/components/molecules/VoiceBroadcastRecordingPip.tsx
@@ -52,15 +52,15 @@ export const VoiceBroadcastRecordingPip: React.FC<VoiceBroadcastRecordingPipProp
         : <VoiceBroadcastControl onClick={toggleRecording} icon={PauseIcon} label={_t("pause voice broadcast")} />;
 
     return <div
-        className="mx_VoiceBroadcastRecordingPip"
+        className="mx_VoiceBroadcastBody mx_VoiceBroadcastBody--pip"
     >
         <VoiceBroadcastHeader
             live={live}
             sender={sender}
             room={room}
         />
-        <hr className="mx_VoiceBroadcastRecordingPip_divider" />
-        <div className="mx_VoiceBroadcastRecordingPip_controls">
+        <hr className="mx_VoiceBroadcastBody_divider" />
+        <div className="mx_VoiceBroadcastBody_controls">
             { toggleControl }
             <VoiceBroadcastControl
                 icon={StopIcon}
diff --git a/test/voice-broadcast/components/molecules/__snapshots__/VoiceBroadcastPlaybackBody-test.tsx.snap b/test/voice-broadcast/components/molecules/__snapshots__/VoiceBroadcastPlaybackBody-test.tsx.snap
index 4dba41de67..1eace91e48 100644
--- a/test/voice-broadcast/components/molecules/__snapshots__/VoiceBroadcastPlaybackBody-test.tsx.snap
+++ b/test/voice-broadcast/components/molecules/__snapshots__/VoiceBroadcastPlaybackBody-test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`VoiceBroadcastPlaybackBody when rendering a 0 broadcast should render as expected 1`] = `
 <div>
   <div
-    class="mx_VoiceBroadcastPlaybackBody"
+    class="mx_VoiceBroadcastBody"
   >
     <div
       class="mx_VoiceBroadcastHeader"
@@ -51,7 +51,7 @@ exports[`VoiceBroadcastPlaybackBody when rendering a 0 broadcast should render a
       </div>
     </div>
     <div
-      class="mx_VoiceBroadcastPlaybackBody_controls"
+      class="mx_VoiceBroadcastBody_controls"
     >
       <div
         aria-label="resume voice broadcast"
@@ -71,7 +71,7 @@ exports[`VoiceBroadcastPlaybackBody when rendering a 0 broadcast should render a
 exports[`VoiceBroadcastPlaybackBody when rendering a 1 broadcast should render as expected 1`] = `
 <div>
   <div
-    class="mx_VoiceBroadcastPlaybackBody"
+    class="mx_VoiceBroadcastBody"
   >
     <div
       class="mx_VoiceBroadcastHeader"
@@ -119,7 +119,7 @@ exports[`VoiceBroadcastPlaybackBody when rendering a 1 broadcast should render a
       </div>
     </div>
     <div
-      class="mx_VoiceBroadcastPlaybackBody_controls"
+      class="mx_VoiceBroadcastBody_controls"
     >
       <div
         aria-label="pause voice broadcast"
@@ -139,7 +139,7 @@ exports[`VoiceBroadcastPlaybackBody when rendering a 1 broadcast should render a
 exports[`VoiceBroadcastPlaybackBody when rendering a buffering voice broadcast should render as expected 1`] = `
 <div>
   <div
-    class="mx_VoiceBroadcastPlaybackBody"
+    class="mx_VoiceBroadcastBody"
   >
     <div
       class="mx_VoiceBroadcastHeader"
@@ -187,7 +187,7 @@ exports[`VoiceBroadcastPlaybackBody when rendering a buffering voice broadcast s
       </div>
     </div>
     <div
-      class="mx_VoiceBroadcastPlaybackBody_controls"
+      class="mx_VoiceBroadcastBody_controls"
     >
       <div
         class="mx_Spinner"
diff --git a/test/voice-broadcast/components/molecules/__snapshots__/VoiceBroadcastRecordingBody-test.tsx.snap b/test/voice-broadcast/components/molecules/__snapshots__/VoiceBroadcastRecordingBody-test.tsx.snap
index ace2c58a05..f152d9f829 100644
--- a/test/voice-broadcast/components/molecules/__snapshots__/VoiceBroadcastRecordingBody-test.tsx.snap
+++ b/test/voice-broadcast/components/molecules/__snapshots__/VoiceBroadcastRecordingBody-test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`VoiceBroadcastRecordingBody when rendering a live broadcast should render the expected HTML 1`] = `
 <div>
   <div
-    class="mx_VoiceBroadcastRecordingBody"
+    class="mx_VoiceBroadcastBody"
   >
     <div
       class="mx_VoiceBroadcastHeader"
diff --git a/test/voice-broadcast/components/molecules/__snapshots__/VoiceBroadcastRecordingPip-test.tsx.snap b/test/voice-broadcast/components/molecules/__snapshots__/VoiceBroadcastRecordingPip-test.tsx.snap
index 7f212d781b..ee034a082e 100644
--- a/test/voice-broadcast/components/molecules/__snapshots__/VoiceBroadcastRecordingPip-test.tsx.snap
+++ b/test/voice-broadcast/components/molecules/__snapshots__/VoiceBroadcastRecordingPip-test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`VoiceBroadcastRecordingPip when rendering a paused recording should render as expected 1`] = `
 <div>
   <div
-    class="mx_VoiceBroadcastRecordingPip"
+    class="mx_VoiceBroadcastBody mx_VoiceBroadcastBody--pip"
   >
     <div
       class="mx_VoiceBroadcastHeader"
@@ -43,10 +43,10 @@ exports[`VoiceBroadcastRecordingPip when rendering a paused recording should ren
       </div>
     </div>
     <hr
-      class="mx_VoiceBroadcastRecordingPip_divider"
+      class="mx_VoiceBroadcastBody_divider"
     />
     <div
-      class="mx_VoiceBroadcastRecordingPip_controls"
+      class="mx_VoiceBroadcastBody_controls"
     >
       <div
         aria-label="resume voice broadcast"
@@ -76,7 +76,7 @@ exports[`VoiceBroadcastRecordingPip when rendering a paused recording should ren
 exports[`VoiceBroadcastRecordingPip when rendering a started recording should render as expected 1`] = `
 <div>
   <div
-    class="mx_VoiceBroadcastRecordingPip"
+    class="mx_VoiceBroadcastBody mx_VoiceBroadcastBody--pip"
   >
     <div
       class="mx_VoiceBroadcastHeader"
@@ -116,10 +116,10 @@ exports[`VoiceBroadcastRecordingPip when rendering a started recording should re
       </div>
     </div>
     <hr
-      class="mx_VoiceBroadcastRecordingPip_divider"
+      class="mx_VoiceBroadcastBody_divider"
     />
     <div
-      class="mx_VoiceBroadcastRecordingPip_controls"
+      class="mx_VoiceBroadcastBody_controls"
     >
       <div
         aria-label="pause voice broadcast"