diff --git a/css/_shared_music.scss b/css/_shared_music.scss
index 16faac1..98ffdfb 100644
--- a/css/_shared_music.scss
+++ b/css/_shared_music.scss
@@ -48,14 +48,24 @@
     height: 100%;
     background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
     display: flex;
+    flex-direction: column;
     align-items: center;
     justify-content: center;
+    gap: 12px;
 
     &::before {
         content: '🎵';
         font-size: 48px;
         opacity: 0.5;
     }
+
+    audio {
+        width: 90%;
+        max-width: 320px;
+        height: 36px;
+        border-radius: 18px;
+        z-index: 1;
+    }
 }
 
 .shared-music-controls-overlay {
diff --git a/react/features/shared-music/components/web/DirectAudioManager.tsx b/react/features/shared-music/components/web/DirectAudioManager.tsx
index 7c2d57e..170dbbe 100644
--- a/react/features/shared-music/components/web/DirectAudioManager.tsx
+++ b/react/features/shared-music/components/web/DirectAudioManager.tsx
@@ -179,7 +179,7 @@ class DirectAudioManager extends AbstractMusicManager {
         let options: any = {
             autoPlay: true,
             src: musicId,
-            controls: _isOwner,
+            controls: true,
             onError: () => this.onError(),
             onPlay: () => this.onPlay(),
             onVolumeChange: () => this.onVolumeChange()
@@ -204,9 +204,9 @@ class DirectAudioManager extends AbstractMusicManager {
     override render() {
         return (
             <audio
-                className = 'hide'
                 id = 'sharedMusicPlayer'
                 ref = { this.audioRef }
+                style = {{ width: '100%' }}
                 { ...this.getPlayerOptions() } />
         );
     }
diff --git a/react/features/shared-music/components/web/YouTubeMusicManager.tsx b/react/features/shared-music/components/web/YouTubeMusicManager.tsx
index c87d83c..c46eb0f 100644
--- a/react/features/shared-music/components/web/YouTubeMusicManager.tsx
+++ b/react/features/shared-music/components/web/YouTubeMusicManager.tsx
@@ -188,8 +188,8 @@ class YouTubeMusicManager extends AbstractMusicManager {
      * @returns {Object}
      */
     getPlayerOptions = () => {
-        const { _isOwner, musicId } = this.props;
-        const showControls = _isOwner ? 1 : 0;
+        const { musicId } = this.props;
+        const showControls = 1;
 
         const options = {
             id: 'sharedMusicPlayer',
diff --git a/react/features/shared-video/components/web/VideoManager.tsx b/react/features/shared-video/components/web/VideoManager.tsx
index 45b4196..283eebb 100644
--- a/react/features/shared-video/components/web/VideoManager.tsx
+++ b/react/features/shared-video/components/web/VideoManager.tsx
@@ -148,7 +148,7 @@ class VideoManager extends AbstractVideoManager {
         let options: any = {
             autoPlay: true,
             src: videoId,
-            controls: _isOwner,
+            controls: true,
             onError: () => this.onError(),
             onPlay: () => this.onPlay(),
             onVolumeChange: () => this.onVolumeChange()
diff --git a/react/features/shared-video/components/web/YoutubeVideoManager.tsx b/react/features/shared-video/components/web/YoutubeVideoManager.tsx
index 8eecf90..d85f751 100644
--- a/react/features/shared-video/components/web/YoutubeVideoManager.tsx
+++ b/react/features/shared-video/components/web/YoutubeVideoManager.tsx
@@ -189,8 +189,8 @@ class YoutubeVideoManager extends AbstractVideoManager {
     };
 
     getPlayerOptions = () => {
-        const { _isOwner, videoId } = this.props;
-        const showControls = _isOwner ? 1 : 0;
+        const { videoId } = this.props;
+        const showControls = 1;
 
         const options = {
             id: 'sharedVideoPlayer',