diff --git a/.changeset/persistent-audio-player.md b/.changeset/persistent-audio-player.md
new file mode 100644
index 0000000000000..15d68178c43ac
--- /dev/null
+++ b/.changeset/persistent-audio-player.md
@@ -0,0 +1,6 @@
+---
+'@rocket.chat/meteor': minor
+'@rocket.chat/i18n': minor
+---
+
+Added a persistent audio player. Playing an audio attachment now continues across room navigation: the audio keeps playing when you switch or close the conversation, and a "Now playing" card appears at the top of the sidebar with play/pause, seek, playback speed (1x/1.5x/2x), and a shortcut back to the originating conversation.
diff --git a/apps/meteor/client/components/message/content/Attachments.tsx b/apps/meteor/client/components/message/content/Attachments.tsx
index d97270b01cf0b..7ea0fa7609f5a 100644
--- a/apps/meteor/client/components/message/content/Attachments.tsx
+++ b/apps/meteor/client/components/message/content/Attachments.tsx
@@ -1,14 +1,18 @@
 import type { MessageAttachmentBase } from '@rocket.chat/core-typings';
 
 import AttachmentsItem from './attachments/AttachmentsItem';
+import type { AudioAttachmentSource } from './attachments/file/AudioAttachment';
 
 type AttachmentsProps = {
 	attachments: MessageAttachmentBase[];
 	id?: string | undefined;
+	source?: AudioAttachmentSource;
 };
 
-const Attachments = ({ attachments, id }: AttachmentsProps) => {
-	return <>{attachments?.map((attachment, index) => <AttachmentsItem key={index} id={id} attachment={{ ...attachment }} />)}</>;
+const Attachments = ({ attachments, id, source }: AttachmentsProps) => {
+	return (
+		<>{attachments?.map((attachment, index) => <AttachmentsItem key={index} id={id} attachment={{ ...attachment }} source={source} />)}</>
+	);
 };
 
 export default Attachments;
diff --git a/apps/meteor/client/components/message/content/attachments/AttachmentsItem.tsx b/apps/meteor/client/components/message/content/attachments/AttachmentsItem.tsx
index f71afab03b05a..a1f45d868ad82 100644
--- a/apps/meteor/client/components/message/content/attachments/AttachmentsItem.tsx
+++ b/apps/meteor/client/components/message/content/attachments/AttachmentsItem.tsx
@@ -5,15 +5,17 @@ import { memo } from 'react';
 import DefaultAttachment from './DefaultAttachment';
 import FileAttachment from './FileAttachment';
 import { QuoteAttachment } from './QuoteAttachment';
+import type { AudioAttachmentSource } from './file/AudioAttachment';
 
 type AttachmentsItemProps = {
 	attachment: MessageAttachmentBase;
 	id: string | undefined;
+	source?: AudioAttachmentSource;
 };
 
-const AttachmentsItem = ({ attachment, id }: AttachmentsItemProps) => {
+const AttachmentsItem = ({ attachment, id, source }: AttachmentsItemProps) => {
 	if (isFileAttachment(attachment)) {
-		return <FileAttachment id={id} {...attachment} />;
+		return <FileAttachment id={id} source={source} {...attachment} />;
 	}
 
 	if (isQuoteAttachment(attachment)) {
diff --git a/apps/meteor/client/components/message/content/attachments/FileAttachment.tsx b/apps/meteor/client/components/message/content/attachments/FileAttachment.tsx
index 6553dc7aa315d..7146cc4e18919 100644
--- a/apps/meteor/client/components/message/content/attachments/FileAttachment.tsx
+++ b/apps/meteor/client/components/message/content/attachments/FileAttachment.tsx
@@ -1,17 +1,22 @@
 import { type FileAttachmentProps, isFileAudioAttachment, isFileImageAttachment, isFileVideoAttachment } from '@rocket.chat/core-typings';
 
 import AudioAttachment from './file/AudioAttachment';
+import type { AudioAttachmentSource } from './file/AudioAttachment';
 import GenericFileAttachment from './file/GenericFileAttachment';
 import ImageAttachment from './file/ImageAttachment';
 import VideoAttachment from './file/VideoAttachment';
 
-const FileAttachment = (attachment: FileAttachmentProps) => {
+type FileAttachmentComponentProps = FileAttachmentProps & {
+	source?: AudioAttachmentSource;
+};
+
+const FileAttachment = ({ source, ...attachment }: FileAttachmentComponentProps) => {
 	if (isFileImageAttachment(attachment)) {
 		return <ImageAttachment {...attachment} />;
 	}
 
 	if (isFileAudioAttachment(attachment)) {
-		return <AudioAttachment {...attachment} />;
+		return <AudioAttachment {...attachment} source={source} />;
 	}
 
 	if (isFileVideoAttachment(attachment)) {
diff --git a/apps/meteor/client/components/message/content/attachments/file/AudioAttachment.tsx b/apps/meteor/client/components/message/content/attachments/file/AudioAttachment.tsx
index 227874cfb8eaf..54bf0a4968ebb 100644
--- a/apps/meteor/client/components/message/content/attachments/file/AudioAttachment.tsx
+++ b/apps/meteor/client/components/message/content/attachments/file/AudioAttachment.tsx
@@ -1,13 +1,26 @@
 import type { AudioAttachmentProps } from '@rocket.chat/core-typings';
-import { AudioPlayer } from '@rocket.chat/fuselage';
+import { AudioPlayerControls, Box } from '@rocket.chat/fuselage';
 import { useMediaUrl } from '@rocket.chat/ui-contexts';
 import { useMemo } from 'react';
 
-import { useReloadOnError } from './hooks/useReloadOnError';
+import { useMediaPlayer } from '../../../../../providers/MediaPlayerProvider';
+import type { PersistentAudioTrack } from '../../../../../providers/MediaPlayerProvider';
 import MarkdownText from '../../../../MarkdownText';
 import MessageCollapsible from '../../../MessageCollapsible';
 import MessageContentBody from '../../../MessageContentBody';
 
+/** Extra context about the message that owns this audio, used by the shared player. */
+export type AudioAttachmentSource = {
+	rid?: string;
+	mid?: string;
+	username?: string;
+	name?: string;
+};
+
+type AudioAttachmentComponentProps = AudioAttachmentProps & {
+	source?: AudioAttachmentSource;
+};
+
 const AudioAttachment = ({
 	title,
 	audio_url: url,
@@ -18,16 +31,56 @@ const AudioAttachment = ({
 	title_link: link,
 	title_link_download: hasDownload,
 	collapsed,
-}: AudioAttachmentProps) => {
+	source,
+}: AudioAttachmentComponentProps) => {
 	const getURL = useMediaUrl();
 	const src = useMemo(() => getURL(url), [getURL, url]);
-	const { mediaRef } = useReloadOnError(src, 'audio');
+
+	const { play, toggle, seek, cyclePlaybackRate, isActive, playing, currentTime, duration, playbackRate } = useMediaPlayer();
+
+	const track = useMemo<PersistentAudioTrack>(
+		() => ({
+			id: `${source?.mid ?? ''}:${url}`,
+			url: src,
+			mediaType: type,
+			title: title || url,
+			size,
+			rid: source?.rid,
+			mid: source?.mid,
+			username: source?.username,
+			name: source?.name,
+		}),
+		[source?.mid, source?.rid, source?.username, source?.name, url, src, type, title, size],
+	);
+
+	const active = isActive(track.id);
 
 	return (
 		<>
 			{descriptionMd ? <MessageContentBody md={descriptionMd} /> : <MarkdownText parseEmoji content={description} />}
 			<MessageCollapsible title={title} hasDownload={hasDownload} link={getURL(link || url)} size={size} isCollapsed={collapsed}>
-				<AudioPlayer src={src} type={type} ref={mediaRef} />
+				<Box
+					borderWidth='default'
+					borderStyle='solid'
+					borderColor='extra-light'
+					bg='tint'
+					pb={12}
+					pie={8}
+					pis={16}
+					borderRadius='x4'
+					w='100%'
+					maxWidth='x300'
+				>
+					<AudioPlayerControls
+						isPlaying={active && playing}
+						currentTime={active ? currentTime : 0}
+						durationTime={active ? duration : 0}
+						playbackSpeed={playbackRate}
+						onTogglePlay={() => (active ? toggle() : play(track))}
+						onSeek={(time) => (active ? seek(time) : play(track))}
+						onChangePlaybackSpeed={cyclePlaybackRate}
+					/>
+				</Box>
 			</MessageCollapsible>
 		</>
 	);
diff --git a/apps/meteor/client/components/message/variants/room/RoomMessageContent.tsx b/apps/meteor/client/components/message/variants/room/RoomMessageContent.tsx
index afc482c40955e..e73f2e45c649f 100644
--- a/apps/meteor/client/components/message/variants/room/RoomMessageContent.tsx
+++ b/apps/meteor/client/components/message/variants/room/RoomMessageContent.tsx
@@ -74,7 +74,13 @@ const RoomMessageContent = ({ message, unread, all, mention, searchText }: RoomM
 				</>
 			)}
 
-			{!!attachments && <Attachments id={message.files?.[0]?._id} attachments={attachments} />}
+			{!!attachments && (
+				<Attachments
+					id={message.files?.[0]?._id}
+					attachments={attachments}
+					source={{ rid: message.rid, mid: message._id, username: message.u.username, name: message.u.name }}
+				/>
+			)}
 
 			{normalizedMessage.blocks && (
 				<UiKitMessageBlock rid={normalizedMessage.rid} mid={normalizedMessage._id} blocks={normalizedMessage.blocks} />
diff --git a/apps/meteor/client/components/message/variants/thread/ThreadMessageContent.tsx b/apps/meteor/client/components/message/variants/thread/ThreadMessageContent.tsx
index 79081bb5a4cc9..0149b164376f0 100644
--- a/apps/meteor/client/components/message/variants/thread/ThreadMessageContent.tsx
+++ b/apps/meteor/client/components/message/variants/thread/ThreadMessageContent.tsx
@@ -70,7 +70,13 @@ const ThreadMessageContent = ({ message }: ThreadMessageContentProps) => {
 				<UiKitMessageBlock rid={normalizedMessage.rid} mid={normalizedMessage._id} blocks={normalizedMessage.blocks} />
 			)}
 
-			{!!attachments && <Attachments id={message.files?.[0]?._id} attachments={attachments} />}
+			{!!attachments && (
+				<Attachments
+					id={message.files?.[0]?._id}
+					attachments={attachments}
+					source={{ rid: message.rid, mid: message._id, username: message.u.username, name: message.u.name }}
+				/>
+			)}
 
 			{oembedEnabled && !!normalizedMessage.urls?.length && <UrlPreviews urls={normalizedMessage.urls} />}
 
diff --git a/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerContext.ts b/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerContext.ts
new file mode 100644
index 0000000000000..50607808b6177
--- /dev/null
+++ b/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerContext.ts
@@ -0,0 +1,66 @@
+import { createContext, useContext } from 'react';
+
+/**
+ * Describes a single audio track owned by the shared player.
+ * The descriptor is self-contained so the player keeps working after the message
+ * (and the room) that originated it has been unmounted — the underlying `<audio>`
+ * element lives in the provider and is never recreated on navigation.
+ */
+export type PersistentAudioTrack = {
+	/** Stable identity of the track, e.g. `${mid}:${url}`. */
+	id: string;
+	/** Resolved, ready-to-play media URL. */
+	url: string;
+	/** MIME type of the media, when known. */
+	mediaType?: string;
+	/** File name shown in the player. */
+	title: string;
+	/** File size in bytes, when known. */
+	size?: number;
+	/** Room the audio was sent in (enables "jump back to conversation"). */
+	rid?: string;
+	/** Message the audio belongs to (enables jump-to-message). */
+	mid?: string;
+	/** Username of the sender (drives the avatar). */
+	username?: string;
+	/** Display name of the sender. */
+	name?: string;
+};
+
+export type MediaPlayerContextValue = {
+	track: PersistentAudioTrack | null;
+	playing: boolean;
+	currentTime: number;
+	duration: number;
+	playbackRate: number;
+	/** Loads (only if a different track) and plays the given track in the shared element. */
+	play: (track: PersistentAudioTrack) => void;
+	/** Toggles play/pause for the active track. No-op when no track is active. */
+	toggle: () => void;
+	/** Seeks the active track to `time` seconds. */
+	seek: (time: number) => void;
+	/** Cycles the playback rate 1x → 1.5x → 2x → 1x. */
+	cyclePlaybackRate: () => void;
+	/** Stops playback and clears the active track. */
+	close: () => void;
+	/** Whether the given track id is the one currently owned by the shared element. */
+	isActive: (id: string) => boolean;
+};
+
+const noop = () => undefined;
+
+export const MediaPlayerContext = createContext<MediaPlayerContextValue>({
+	track: null,
+	playing: false,
+	currentTime: 0,
+	duration: 0,
+	playbackRate: 1,
+	play: noop,
+	toggle: noop,
+	seek: noop,
+	cyclePlaybackRate: noop,
+	close: noop,
+	isActive: () => false,
+});
+
+export const useMediaPlayer = (): MediaPlayerContextValue => useContext(MediaPlayerContext);
diff --git a/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerProvider.tsx b/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerProvider.tsx
new file mode 100644
index 0000000000000..fe0fc9aff96d4
--- /dev/null
+++ b/apps/meteor/client/providers/MediaPlayerProvider/MediaPlayerProvider.tsx
@@ -0,0 +1,131 @@
+import { useMergedRefs, useStableCallback } from '@rocket.chat/fuselage-hooks';
+import type { ReactNode } from 'react';
+import { useCallback, useMemo, useRef, useState } from 'react';
+
+import type { MediaPlayerContextValue, PersistentAudioTrack } from './MediaPlayerContext';
+import { MediaPlayerContext } from './MediaPlayerContext';
+import { useReloadOnError } from '../../components/message/content/attachments/file/hooks/useReloadOnError';
+
+const PLAYBACK_RATES = [1, 1.5, 2] as const;
+
+type MediaPlayerProviderProps = {
+	children?: ReactNode;
+};
+
+/**
+ * Owns the single, app-wide `<audio>` element used to play message audio
+ * attachments. Because the element lives above the room layout and is never
+ * recreated, both the in-message controls and the sidebar card drive the very
+ * same element: switching or closing the room only swaps which UI is shown — the
+ * element keeps playing with no reload, seek, or gap.
+ */
+const MediaPlayerProvider = ({ children }: MediaPlayerProviderProps) => {
+	const audioRef = useRef<HTMLAudioElement | null>(null);
+
+	const [track, setTrack] = useState<PersistentAudioTrack | null>(null);
+	const [playing, setPlaying] = useState(false);
+	const [currentTime, setCurrentTime] = useState(0);
+	const [duration, setDuration] = useState(0);
+	const [playbackRate, setPlaybackRate] = useState<number>(1);
+
+	const trackRef = useRef<PersistentAudioTrack | null>(null);
+	trackRef.current = track;
+
+	// Reuse the message player's signed-URL recovery on the shared element.
+	const { mediaRef } = useReloadOnError(track?.url ?? '', 'audio');
+	const audioCallback = useCallback((node: HTMLAudioElement | null) => {
+		audioRef.current = node;
+	}, []);
+	const setAudioRef = useMergedRefs(audioCallback, mediaRef);
+
+	const play = useStableCallback((next: PersistentAudioTrack) => {
+		const audio = audioRef.current;
+		if (!audio) {
+			return;
+		}
+
+		if (trackRef.current?.id !== next.id) {
+			setTrack(next);
+			setCurrentTime(0);
+			setDuration(0);
+			audio.src = next.url;
+			audio.load();
+		}
+
+		audio.playbackRate = playbackRate;
+		audio.play().catch((err) => console.warn('Failed to start audio playback:', err));
+	});
+
+	const toggle = useStableCallback(() => {
+		const audio = audioRef.current;
+		if (!audio || !trackRef.current) {
+			return;
+		}
+		if (audio.paused) {
+			audio.play().catch((err) => console.warn('Failed to resume audio playback:', err));
+		} else {
+			audio.pause();
+		}
+	});
+
+	const seek = useStableCallback((time: number) => {
+		const audio = audioRef.current;
+		if (!audio) {
+			return;
+		}
+		audio.currentTime = Math.max(0, Math.min(time, audio.duration || time));
+	});
+
+	const cyclePlaybackRate = useStableCallback(() => {
+		setPlaybackRate((rate) => {
+			const idx = PLAYBACK_RATES.indexOf(rate as (typeof PLAYBACK_RATES)[number]);
+			const nextRate = PLAYBACK_RATES[(idx + 1) % PLAYBACK_RATES.length];
+			if (audioRef.current) {
+				audioRef.current.playbackRate = nextRate;
+			}
+			return nextRate;
+		});
+	});
+
+	const close = useStableCallback(() => {
+		const audio = audioRef.current;
+		if (audio) {
+			audio.pause();
+			audio.removeAttribute('src');
+			audio.load();
+		}
+		setTrack(null);
+		setPlaying(false);
+		setCurrentTime(0);
+		setDuration(0);
+	});
+
+	const isActive = useCallback((id: string) => trackRef.current?.id === id, []);
+
+	const value = useMemo<MediaPlayerContextValue>(
+		() => ({ track, playing, currentTime, duration, playbackRate, play, toggle, seek, cyclePlaybackRate, close, isActive }),
+		[track, playing, currentTime, duration, playbackRate, play, toggle, seek, cyclePlaybackRate, close, isActive],
+	);
+
+	return (
+		<MediaPlayerContext.Provider value={value}>
+			{children}
+			<audio
+				ref={setAudioRef}
+				hidden
+				preload='metadata'
+				onPlay={() => setPlaying(true)}
+				onPause={() => setPlaying(false)}
+				onEnded={() => close()}
+				onTimeUpdate={(e) => setCurrentTime(e.currentTarget.currentTime)}
+				onLoadedMetadata={(e) => setDuration(e.currentTarget.duration || 0)}
+				onDurationChange={(e) => setDuration(e.currentTarget.duration || 0)}
+				onRateChange={(e) => setPlaybackRate(e.currentTarget.playbackRate)}
+			>
+				<track kind='captions' />
+			</audio>
+		</MediaPlayerContext.Provider>
+	);
+};
+
+export default MediaPlayerProvider;
diff --git a/apps/meteor/client/providers/MediaPlayerProvider/index.ts b/apps/meteor/client/providers/MediaPlayerProvider/index.ts
new file mode 100644
index 0000000000000..fb2fd8252dac5
--- /dev/null
+++ b/apps/meteor/client/providers/MediaPlayerProvider/index.ts
@@ -0,0 +1,3 @@
+export { default } from './MediaPlayerProvider';
+export { MediaPlayerContext, useMediaPlayer } from './MediaPlayerContext';
+export type { MediaPlayerContextValue, PersistentAudioTrack } from './MediaPlayerContext';
diff --git a/apps/meteor/client/providers/MeteorProvider.tsx b/apps/meteor/client/providers/MeteorProvider.tsx
index 06462485a2479..e8efcce56a4dd 100644
--- a/apps/meteor/client/providers/MeteorProvider.tsx
+++ b/apps/meteor/client/providers/MeteorProvider.tsx
@@ -10,6 +10,7 @@ import { DeviceProvider } from './DeviceProvider/DeviceProvider';
 import EmojiPickerProvider from './EmojiPickerProvider';
 import LayoutProvider from './LayoutProvider';
 import MediaCallProvider from './MediaCallProvider';
+import MediaPlayerProvider from './MediaPlayerProvider';
 import OmnichannelProvider from './OmnichannelProvider';
 import RouterProvider from './RouterProvider';
 import ServerProvider from './ServerProvider';
@@ -48,7 +49,9 @@ const MeteorProvider = ({ children }: MeteorProviderProps) => (
 																			<ActionManagerProvider>
 																				<VideoConfProvider>
 																					<MediaCallProvider>
-																						<OmnichannelProvider>{children}</OmnichannelProvider>
+																						<OmnichannelProvider>
+																							<MediaPlayerProvider>{children}</MediaPlayerProvider>
+																						</OmnichannelProvider>
 																					</MediaCallProvider>
 																				</VideoConfProvider>
 																			</ActionManagerProvider>
diff --git a/apps/meteor/client/sidebar/Sidebar.tsx b/apps/meteor/client/sidebar/Sidebar.tsx
index f6dd40024684f..309006454c7b8 100644
--- a/apps/meteor/client/sidebar/Sidebar.tsx
+++ b/apps/meteor/client/sidebar/Sidebar.tsx
@@ -6,6 +6,7 @@ import { useTranslation } from 'react-i18next';
 import SidebarRoomList from './RoomList';
 import SidebarFooter from './footer';
 import BannerSection from './sections/BannerSection';
+import NowPlayingSection from './sections/NowPlayingSection';
 
 const Sidebar = () => {
 	const { t } = useTranslation();
@@ -21,6 +22,7 @@ const Sidebar = () => {
 		>
 			<BannerSection />
 			<SidebarRoomList />
+			<NowPlayingSection />
 			<SidebarFooter />
 		</SidebarV2>
 	);
diff --git a/apps/meteor/client/sidebar/sections/NowPlayingSection.tsx b/apps/meteor/client/sidebar/sections/NowPlayingSection.tsx
new file mode 100644
index 0000000000000..00064fc923f42
--- /dev/null
+++ b/apps/meteor/client/sidebar/sections/NowPlayingSection.tsx
@@ -0,0 +1,85 @@
+import { AudioPlayerControls, Box, IconButton } from '@rocket.chat/fuselage';
+import { UserAvatar } from '@rocket.chat/ui-avatar';
+import { useUserDisplayName } from '@rocket.chat/ui-client';
+import { useTranslation } from 'react-i18next';
+
+import SidebarCard from './SidebarCard';
+import { useFormatMemorySize } from '../../hooks/useFormatMemorySize';
+import { setMessageJumpQueryStringParameter } from '../../lib/utils/setMessageJumpQueryStringParameter';
+import { useMediaPlayer } from '../../providers/MediaPlayerProvider';
+import { useGoToRoom } from '../../views/room/hooks/useGoToRoom';
+
+/**
+ * Persistent audio card pinned to the bottom of the sidebar (design 1c).
+ * It drives the shared audio element, so it stays available while a track is
+ * loaded — including after switching or closing the room, or closing the thread
+ * the audio was played from.
+ */
+const NowPlayingSection = () => {
+	const { t } = useTranslation();
+	const { track, playing, currentTime, duration, playbackRate, toggle, seek, cyclePlaybackRate, close } = useMediaPlayer();
+	const goToRoom = useGoToRoom();
+	const formatMemorySize = useFormatMemorySize();
+	const displayName = useUserDisplayName({ name: track?.name, username: track?.username });
+
+	if (!track) {
+		return null;
+	}
+
+	const openConversation = async () => {
+		if (!track.rid) {
+			return;
+		}
+		await goToRoom(track.rid);
+		if (track.mid) {
+			void setMessageJumpQueryStringParameter(track.mid);
+		}
+	};
+
+	return (
+		<SidebarCard>
+			<Box display='flex' alignItems='center' justifyContent='space-between' mbe={10} style={{ gap: 8 }}>
+				<Box
+					display='flex'
+					alignItems='center'
+					minWidth={0}
+					flexGrow={1}
+					role='button'
+					tabIndex={0}
+					onClick={() => void openConversation()}
+					onKeyDown={(e) => {
+						if (e.key === 'Enter' || e.key === ' ') {
+							e.preventDefault();
+							void openConversation();
+						}
+					}}
+					title={t('Jump_to_message')}
+					style={{ gap: 8, cursor: track.rid ? 'pointer' : 'default' }}
+				>
+					{track.username && <UserAvatar username={track.username} size='x24' />}
+					<Box minWidth={0}>
+						<Box fontScale='p2b' color='default' withTruncatedText>
+							{displayName || t('Audio')}
+						</Box>
+						<Box fontScale='micro' color='hint' withTruncatedText>
+							{track.size ? `${track.title} (${formatMemorySize(track.size)})` : track.title}
+						</Box>
+					</Box>
+				</Box>
+				<IconButton mini icon='cross' onClick={close} title={t('Close')} aria-label={t('Close')} />
+			</Box>
+
+			<AudioPlayerControls
+				isPlaying={playing}
+				currentTime={currentTime}
+				durationTime={duration}
+				playbackSpeed={playbackRate}
+				onTogglePlay={toggle}
+				onSeek={seek}
+				onChangePlaybackSpeed={cyclePlaybackRate}
+			/>
+		</SidebarCard>
+	);
+};
+
+export default NowPlayingSection;
diff --git a/apps/meteor/client/sidebar/sections/SidebarCard.tsx b/apps/meteor/client/sidebar/sections/SidebarCard.tsx
new file mode 100644
index 0000000000000..f9fc492a0ea7f
--- /dev/null
+++ b/apps/meteor/client/sidebar/sections/SidebarCard.tsx
@@ -0,0 +1,16 @@
+import { Box } from '@rocket.chat/fuselage';
+import type { ReactNode } from 'react';
+
+type SidebarCardProps = { children: ReactNode };
+
+/**
+ * Reusable elevated surface for sidebar sections: a padded, rounded, subtly
+ * bordered container in the sidebar tint.
+ */
+const SidebarCard = ({ children }: SidebarCardProps) => (
+	<Box m={8} p={10} borderRadius='x8' borderWidth='default' borderStyle='solid' borderColor='stroke-light' backgroundColor='surface-tint'>
+		{children}
+	</Box>
+);
+
+export default SidebarCard;
diff --git a/apps/meteor/client/views/navigation/sidebar/Sidebar.tsx b/apps/meteor/client/views/navigation/sidebar/Sidebar.tsx
index 172a865b9ee34..0a054ef11ee56 100644
--- a/apps/meteor/client/views/navigation/sidebar/Sidebar.tsx
+++ b/apps/meteor/client/views/navigation/sidebar/Sidebar.tsx
@@ -5,6 +5,7 @@ import { useTranslation } from 'react-i18next';
 import SidebarRoomList from './RoomList';
 import SidebarFooter from '../../../sidebar/footer';
 import BannerSection from '../../../sidebar/sections/BannerSection';
+import NowPlayingSection from '../../../sidebar/sections/NowPlayingSection';
 
 const Sidebar = () => {
 	const { t } = useTranslation();
@@ -13,6 +14,7 @@ const Sidebar = () => {
 		<SidebarV2 aria-label={t('Sidebar')} className='rcx-sidebar--main rcx-sidebar'>
 			<BannerSection />
 			<SidebarRoomList />
+			<NowPlayingSection />
 			<SidebarFooter />
 		</SidebarV2>
 	);
diff --git a/packages/i18n/src/locales/en.i18n.json b/packages/i18n/src/locales/en.i18n.json
index b29ec32dc1295..bbd642be56f53 100644
--- a/packages/i18n/src/locales/en.i18n.json
+++ b/packages/i18n/src/locales/en.i18n.json
@@ -3948,6 +3948,7 @@
   "Notify_all_in_this_room": "Notify all in this room",
   "Now_Its_Visible_For_Everyone": "Now it's visible for everyone",
   "Now_Its_Visible_Only_For_Admins": "Now it's visible only for admins",
+  "Now_playing": "Now playing",
   "Num_Agents": "# Agents",
   "Number_in_seconds": "Number in seconds",
   "Number_of_events": "Number of events",
@@ -4216,6 +4217,7 @@
   "Platform_Mac": "Mac",
   "Platform_Windows": "Windows",
   "Play": "Play",
+  "Playback_speed": "Playback speed",
   "Please_add_a_comment": "Please add a comment",
   "Please_add_a_comment_to_close_the_room": "Please, add a comment to close the room",
   "Please_answer_survey": "Please take a moment to answer a quick survey about this chat",
@@ -4857,6 +4859,7 @@
   "See_full_profile": "See full profile",
   "See_history": "See history",
   "See_on_Engagement_Dashboard": "See on Engagement Dashboard",
+  "Seek": "Seek",
   "Select": "Select",
   "Select__count__messages": "Select {{count}} messages",
   "Select_a_department": "Select a department",