diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index c3789c3900..bb5a79d623 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -2721,6 +2721,9 @@ _permissions:
   "write:calls": "Misskey Callsへの参加と音声通話を操作する"
 
 _calls:
+  activities: "アクティビティ"
+  backToActivities: "アクティビティ一覧に戻る"
+  noActivities: "利用できるアクティビティはまだありません"
   audioSettings: "通話設定"
   settings: "Callsの設定"
   systemDefaultDevice: "システムの既定"
diff --git a/packages/frontend/.storybook/generate.tsx b/packages/frontend/.storybook/generate.tsx
index 4274839e01..00352656bb 100644
--- a/packages/frontend/.storybook/generate.tsx
+++ b/packages/frontend/.storybook/generate.tsx
@@ -464,6 +464,7 @@ function toStories(component: string): Promise<string> {
 		globSync('src/components/MkTagItem.vue'),
 		globSync('src/components/MkRoleSelectDialog.vue'),
 		globSync('src/components/grid/MkGrid.vue'),
+		globSync('src/components/calls/MkCallsActivities.vue'),
 		globSync('src/pages/admin/custom-emojis-manager2.vue'),
 		globSync('src/pages/admin/overview.ap-requests.vue'),
 		globSync('src/pages/user/home.vue'),
diff --git a/packages/frontend/src/components/MkCallsRoomWindow.vue b/packages/frontend/src/components/MkCallsRoomWindow.vue
index 2afa10be59..58023f4415 100644
--- a/packages/frontend/src/components/MkCallsRoomWindow.vue
+++ b/packages/frontend/src/components/MkCallsRoomWindow.vue
@@ -13,6 +13,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 				<h1 :class="$style.title">{{ room?.title ?? i18n.ts._calls.title }}</h1>
 				<small v-if="sessionIsCurrent && session.elapsedTime.value != null" :class="$style.elapsedTime" :title="i18n.ts._calls.elapsedTime"><i class="ti ti-clock" aria-hidden="true"></i> {{ session.elapsedTime.value }}</small>
 			</div>
+			<button v-if="room != null" type="button" class="_button" :class="$style.menuButton" :aria-label="i18n.ts._calls.activities" :title="i18n.ts._calls.activities" :aria-expanded="activitiesOpen" @click="activitiesOpen = !activitiesOpen"><i class="ti ti-device-gamepad-2" aria-hidden="true"></i></button>
 			<button v-if="room != null" type="button" class="_button" :class="$style.menuButton" :aria-label="i18n.ts.copyLink" :title="i18n.ts.copyLink" @click="copyRoomLink"><i class="ti ti-link" aria-hidden="true"></i></button>
 			<button v-if="hasRoomMenu" type="button" class="_button" :class="$style.menuButton" :aria-label="i18n.ts.details" :disabled="session.joining.value" aria-haspopup="menu" @click="openRoomMenu"><i class="ti ti-dots"></i></button>
 			<button v-if="popoutTarget == null" type="button" class="_button" :class="$style.menuButton" :aria-label="i18n.ts.popout" :title="i18n.ts.popout" @click="popout"><i class="ti ti-external-link"></i></button>
@@ -20,22 +21,20 @@ SPDX-License-Identifier: AGPL-3.0-only
 		<MkLoading v-if="room == null && !loadFailed"/>
 		<div v-else-if="room == null" :class="$style.notFound"><i class="ti ti-alert-circle"></i><strong>{{ i18n.ts.notFound }}</strong></div>
 		<template v-else>
-			<div v-if="room.state === 'ended'" :class="[$style.body, $style.endedBody]">
-				<section :class="$style.summary">
+			<div :class="[$style.body, room.state === 'ended' && $style.endedBody]">
+				<section v-if="room.state === 'ended'" :class="$style.summary">
 					<h2 :class="$style.summaryTitle"><i class="ti ti-phone-off" aria-hidden="true"></i> {{ i18n.ts._calls.ended }}</h2>
 					<MkCallsRoomSummary :room="room"/>
 				</section>
-			</div>
-			<div v-else :class="$style.body">
 				<MkInfo v-if="session.replacedRoomId.value === props.roomId">{{ i18n.ts._calls.connectedOnAnotherDevice }}</MkInfo>
-				<MkInfo v-if="!connected && !session.joining.value" warn>{{ i18n.ts._calls.websocketDisconnected }}</MkInfo>
+				<MkInfo v-if="room.state !== 'ended' && !connected && !session.joining.value" warn>{{ i18n.ts._calls.websocketDisconnected }}</MkInfo>
 				<MkInfo v-if="sessionIsCurrent && session.mediaState.value === 'reconnecting'" warn>{{ i18n.ts._calls.reconnecting }}</MkInfo>
 				<MkInfo v-if="sessionIsCurrent && session.mediaFailure.value != null" warn>{{ failureText }}</MkInfo>
 				<MkInfo v-if="sessionIsCurrent && session.speakerRequestResult.value === 'rejected'" warn>{{ i18n.ts._calls.speakerRequestRejected }}</MkInfo>
 
-				<div :class="$style.callLayout">
-					<section ref="stage" :class="$style.stage" :aria-label="i18n.ts._calls.title">
-						<div ref="videoGrid" :class="$style.videoGrid" :style="videoGridStyle">
+				<div v-if="room.state !== 'ended' || activitiesOpen" :class="[$style.callLayout, room.state === 'ended' && $style.endedLayout]">
+					<section ref="stage" :class="[$style.stage, activitiesOpen && $style.activityStage]" :aria-label="i18n.ts._calls.title">
+						<div v-if="room.state !== 'ended'" ref="videoGrid" :class="[$style.videoGrid, activitiesOpen && $style.videoStrip]" :style="activitiesOpen ? undefined : videoGridStyle">
 							<CallsVideo v-for="video in roomVideos" :key="video.id" :stream="video.stream" :audioVolume="!video.local && session.screenAudioIds.value.has(video.id) ? session.getScreenVolume(video.id) : undefined" screenWindow :screenWindowActive="session.screenWindows.has(video.stream)" :label="videoLabel(video.participantId)" :speaking="speakingParticipantIds.has(video.participantId)" :focused="focusedVideoId === video.id" :class="focusedVideoId === video.id && $style.focusedVideo" @contextmenu.capture.stop.prevent="openParticipantMenu(participants.find(participant => participant.id === video.participantId), $event)" @volume="session.setScreenVolume(video.id, $event)" @select="focusVideo(video.id)" @screenWindow="showScreenWindow(video.stream, video.participantId)"/>
 							<div v-for="participant in audioOnlySpeakers" :key="participant.id" :class="[$style.voiceTile, speakingParticipantIds.has(participant.id) && $style.speaking]" @contextmenu.capture.stop.prevent="openParticipantMenu(participant, $event)">
 								<MkAvatar v-if="participant.user != null" :user="participant.user!" :class="$style.stageAvatar"/>
@@ -43,8 +42,9 @@ SPDX-License-Identifier: AGPL-3.0-only
 								<div :class="$style.tileName"><i :class="participant.isMuted ? 'ti ti-microphone-off' : 'ti ti-microphone'"></i><MkUserName v-if="participant.user != null" :user="participant.user!"/><template v-else>{{ participant.userId }}</template></div>
 							</div>
 						</div>
+						<MkCallsActivities v-if="activitiesOpen" :activities="[]" :class="$style.activity" @close="activitiesOpen = false"/>
 					</section>
-					<aside :class="$style.participantArea" :aria-label="i18n.ts.users">
+					<aside v-if="room.state !== 'ended'" :class="$style.participantArea" :aria-label="i18n.ts.users">
 						<section v-if="speakers.length > 0" :aria-label="i18n.ts._calls.speaker">
 							<div v-if="room.mode === 'stage'" :class="$style.groupLabel">{{ i18n.ts._calls.speaker }}</div>
 							<TransitionGroup tag="div" :class="$style.people" :moveClass="$style.personMove">
@@ -116,6 +116,7 @@ import CallsVideo from '@/components/MkCallsVideo.vue';
 import MkModal from '@/components/MkModal.vue';
 import MkCallsControls from '@/components/MkCallsControls.vue';
 import MkCallsRoomSummary from '@/components/MkCallsRoomSummary.vue';
+import MkCallsActivities from '@/components/calls/MkCallsActivities.vue';
 import MkButton from '@/components/MkButton.vue';
 import MkInfo from '@/components/MkInfo.vue';
 import { createCallsRoomConnection } from '@/composables/use-calls-room.js';
@@ -135,6 +136,7 @@ const props = defineProps<{
 const emit = defineEmits<{ (ev: 'closed'): void; (ev: 'popout', popup: Window | null): void }>();
 const dialog = shallowRef<InstanceType<typeof MkModal>>();
 const focusedVideoId = shallowRef<string | null>(null);
+const activitiesOpen = shallowRef(false);
 
 const popoutTarget = shallowRef<HTMLElement | null>(null);
 let popoutWindow: Window | null = null;
@@ -546,6 +548,10 @@ function openConnectionInfo(): void {
 .summary { width: min(100%, 560px); box-sizing: border-box; margin: auto; padding: 24px; border-radius: var(--MI-radius); background: var(--MI_THEME-panel); }
 .summaryTitle { display: flex; align-items: center; gap: 8px; margin: 0 0 24px; font-size: 1.1rem; }
 .callLayout { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 16px; flex: 1; min-height: 0; }
+.endedLayout { grid-template-columns: minmax(0, 1fr); }
+.endedLayout > .stage { grid-column: 1; }
+.activityStage { display: flex; flex-direction: column; gap: 16px; overflow: hidden; }
+.activity { flex: 1; min-height: 0; overflow: auto; }
 .stage { grid-column: 2; grid-row: 1; min-width: 0; min-height: 0; overflow: auto; }
 .participantArea { grid-column: 1; grid-row: 1; min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 24px; padding: 16px; border-radius: var(--MI-radius); background: var(--MI_THEME-panel); }
 .groupLabel { margin-bottom: 12px; font-size: 0.85rem; font-weight: 600; opacity: 0.65; }
@@ -568,6 +574,10 @@ function openConnectionInfo(): void {
 .personVolume > input { width: 100%; min-width: 0; margin: 0; accent-color: var(--MI_THEME-accent); }
 .personMove { transition: transform 0.2s ease; }
 .videoGrid { display: grid; gap: 12px; height: 100%; min-height: 0; }
+.videoStrip { display: flex; flex: 0 0 100px; height: 100px; overflow-x: auto; }
+.videoStrip > * { flex: 0 0 160px; }
+.videoStrip .stageAvatar { width: 40px; height: 40px; }
+.videoStrip .tileName { left: 8px; bottom: 4px; }
 .focusedVideo { grid-column: 1 / -1; order: -1; }
 .voiceTile { position: relative; display: grid; place-items: center; min-width: 0; min-height: 0; overflow: hidden; border: 2px solid transparent; border-radius: var(--MI-radius); background: var(--MI_THEME-panel); }
 .voiceTile.speaking { border-color: var(--MI_THEME-accent); }
@@ -582,6 +592,9 @@ function openConnectionInfo(): void {
 	.body { padding: 12px; }
 	.callLayout { grid-template-columns: 120px minmax(0, 1fr); gap: 8px; }
 	.participantArea { padding: 8px; }
+	.callLayout:has(.activityStage) { grid-template-columns: minmax(0, 1fr); }
+	.activityStage { grid-column: 1; }
+	.callLayout:has(.activityStage) > .participantArea { display: none; }
 	.person { grid-template-columns: minmax(0, 1fr); justify-items: start; }
 	.person > .avatarWrap, .person > .listenerAvatar { grid-row: auto; }
 	.person > small { grid-column: 1; }
diff --git a/packages/frontend/src/components/calls/MkCallsActivities.stories.impl.ts b/packages/frontend/src/components/calls/MkCallsActivities.stories.impl.ts
new file mode 100644
index 0000000000..5c119b805f
--- /dev/null
+++ b/packages/frontend/src/components/calls/MkCallsActivities.stories.impl.ts
@@ -0,0 +1,15 @@
+/*
+ * SPDX-FileCopyrightText: syuilo and misskey-project
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import MkCallsActivities from './MkCallsActivities.vue';
+import type { StoryObj } from '@storybook/vue3';
+import { i18n } from '@/i18n.js';
+
+export const Default = {
+	render(args) { return { components: { MkCallsActivities }, setup: () => ({ args }), template: '<MkCallsActivities v-bind="args" style="width: min(600px, 100%); box-sizing: border-box;"><template #default="{ activity }"><p>{{ activity }}</p></template></MkCallsActivities>' }; },
+	args: { activities: [{ id: 'sample', title: i18n.ts._calls.activities, description: i18n.ts._calls.title, icon: 'ti ti-device-gamepad-2' }] },
+} satisfies StoryObj<typeof MkCallsActivities>;
+
+export const Empty = { ...Default, args: { activities: [] } } satisfies StoryObj<typeof MkCallsActivities>;
diff --git a/packages/frontend/src/components/calls/MkCallsActivities.vue b/packages/frontend/src/components/calls/MkCallsActivities.vue
new file mode 100644
index 0000000000..d3f38e90df
--- /dev/null
+++ b/packages/frontend/src/components/calls/MkCallsActivities.vue
@@ -0,0 +1,54 @@
+<!--
+SPDX-FileCopyrightText: syuilo and misskey-project
+SPDX-License-Identifier: AGPL-3.0-only
+-->
+
+<template>
+<section class="_panel" :class="$style.root" :aria-label="i18n.ts._calls.activities">
+	<header :class="$style.header">
+		<button v-if="activity != null" type="button" class="_button" :class="$style.iconButton" :aria-label="i18n.ts._calls.backToActivities" @click="activity = null"><i class="ti ti-arrow-left" aria-hidden="true"></i></button>
+		<h2 :class="$style.title">{{ activity?.title ?? i18n.ts._calls.activities }}</h2>
+		<button type="button" class="_button" :class="$style.iconButton" :aria-label="i18n.ts.close" @click="emit('close')"><i class="ti ti-x" aria-hidden="true"></i></button>
+	</header>
+	<slot v-if="activity != null" :activity="activity.id"></slot>
+	<div v-else class="_gaps_s">
+		<p v-if="activities.length === 0">{{ i18n.ts._calls.noActivities }}</p>
+		<button v-for="choice in activities" :key="choice.id" type="button" class="_button" :class="$style.choice" @click="activity = choice">
+			<i :class="[choice.icon, $style.choiceIcon]" aria-hidden="true"></i>
+			<span><strong>{{ choice.title }}</strong><small>{{ choice.description }}</small></span>
+			<i class="ti ti-chevron-right" aria-hidden="true"></i>
+		</button>
+	</div>
+</section>
+</template>
+
+<script lang="ts">
+export type CallsActivity = {
+	id: string;
+	title: string;
+	description: string;
+	icon: string;
+};
+</script>
+
+<script setup lang="ts">
+import { shallowRef } from 'vue';
+import { i18n } from '@/i18n.js';
+
+defineProps<{ activities: CallsActivity[] }>();
+const emit = defineEmits<{ (ev: 'close'): void }>();
+const activity = shallowRef<CallsActivity | null>(null);
+</script>
+
+<style lang="scss" module>
+.root { padding: 16px; }
+.header { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; }
+.title { flex: 1; margin: 0; font-size: 1rem; }
+.iconButton { flex: 0 0 32px; height: 32px; border-radius: var(--MI-radius); }
+.choice { display: flex; align-items: center; gap: 16px; width: 100%; padding: 16px; box-sizing: border-box; text-align: left; border-radius: var(--MI-radius); background: var(--MI_THEME-buttonBg); }
+.choice:hover { background: var(--MI_THEME-buttonHoverBg); }
+.choiceIcon { font-size: 28px; color: var(--MI_THEME-accent); }
+.choice > span { flex: 1; min-width: 0; overflow-wrap: anywhere; }
+.choice strong, .choice small { display: block; }
+.choice small { margin-top: 4px; color: var(--MI_THEME-fgTransparentWeak); }
+</style>
diff --git a/packages/frontend/test/unit/calls-activities.test.ts b/packages/frontend/test/unit/calls-activities.test.ts
new file mode 100644
index 0000000000..bce91a84a6
--- /dev/null
+++ b/packages/frontend/test/unit/calls-activities.test.ts
@@ -0,0 +1,31 @@
+/*
+ * SPDX-FileCopyrightText: syuilo and misskey-project
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import { afterEach, expect, test } from 'vitest';
+import { cleanup, fireEvent, render } from '@testing-library/vue';
+import { h } from 'vue';
+import MkCallsActivities from '@/components/calls/MkCallsActivities.vue';
+import { i18n } from '@/i18n.js';
+
+afterEach(cleanup);
+
+test('selects supplied activities, renders their content, and returns to the list', async () => {
+	const view = render(MkCallsActivities, {
+		props: { activities: [
+			{ id: 'first', title: 'First activity', description: 'First description', icon: 'ti ti-device-gamepad-2' },
+			{ id: 'second', title: 'Second activity', description: 'Second description', icon: 'ti ti-device-gamepad-2' },
+		] },
+		slots: { default: ({ activity }: { activity: string }) => h('p', `Content: ${activity}`) },
+	});
+	await fireEvent.click(view.getByRole('button', { name: 'First activity First description' }));
+	expect(view.getByRole('heading', { name: 'First activity' })).toBeTruthy();
+	expect(view.getByText('Content: first')).toBeTruthy();
+	await fireEvent.click(view.getByRole('button', { name: i18n.ts._calls.backToActivities }));
+	expect(view.queryByText('Content: first')).toBeNull();
+	await fireEvent.click(view.getByRole('button', { name: 'Second activity Second description' }));
+	expect(view.getByText('Content: second')).toBeTruthy();
+	await fireEvent.click(view.getByRole('button', { name: i18n.ts.close }));
+	expect(view.emitted().close).toHaveLength(1);
+});
diff --git a/packages/frontend/test/unit/calls-join-confirmation.test.ts b/packages/frontend/test/unit/calls-join-confirmation.test.ts
index 00cbf4a62f..d6761ee031 100644
--- a/packages/frontend/test/unit/calls-join-confirmation.test.ts
+++ b/packages/frontend/test/unit/calls-join-confirmation.test.ts
@@ -45,16 +45,44 @@ beforeEach(() => {
 	fixture.connection = { room: ref(room), participants: ref(participants), connected: ref(true), speakingParticipantIds: ref(new Set()), refresh: vi.fn().mockResolvedValue(undefined), dispose: vi.fn() };
 	fixture.session = {
 		currentRoomId: ref(null), room: ref(room), participants: ref(participants), connected: ref(true), speakingParticipantIds: ref(new Set()),
-		elapsedTime: ref(null), isActive: ref(false), joining: ref(false), videos: ref([]), screenWindows: new Map(), mediaState: ref('idle'), mediaFailure: ref(null),
+		elapsedTime: ref(null), isActive: ref(false), joining: ref(false), videos: ref([]), screenWindows: new Map(), screenAudioIds: ref(new Set()), mediaState: ref('idle'), mediaFailure: ref(null),
 		speakerRequestResult: ref(null), replacedRoomId: ref(null), needsAudioResume: ref(false), controls: ref({}),
 		leave: vi.fn().mockResolvedValue(undefined), refresh: vi.fn().mockResolvedValue(undefined), prepareMicrophones: vi.fn(), join: vi.fn().mockResolvedValue(undefined),
 		getParticipantVolume: vi.fn().mockReturnValue(100), setParticipantVolume: vi.fn(),
-		screenAudioIds: ref(new Set()), getScreenVolume: vi.fn().mockReturnValue(100), setScreenVolume: vi.fn(),
+		getScreenVolume: vi.fn().mockReturnValue(100), setScreenVolume: vi.fn(),
 	};
 });
 afterEach(cleanup);
 
 describe('Calls room window', () => {
+	test('opens and closes the activity list inside the current call without leaving the session', async () => {
+		fixture.session.currentRoomId.value = 'room';
+		fixture.session.isActive.value = true;
+		const open = vi.spyOn(window, 'open');
+		const view = render(MkCallsRoomWindow, { props: { roomId: 'room' }, global: { stubs } });
+		const activityButton = view.getByRole('button', { name: i18n.ts._calls.activities });
+		await fireEvent.click(activityButton);
+		expect(activityButton.getAttribute('aria-expanded')).toBe('true');
+		expect(view.getByText(i18n.ts._calls.noActivities)).toBeTruthy();
+		expect(view.container.querySelector('mk-calls-controls-stub')).toBeTruthy();
+		await fireEvent.click(view.getByRole('button', { name: i18n.ts.close }));
+		expect(activityButton.getAttribute('aria-expanded')).toBe('false');
+		expect(fixture.session.leave).not.toHaveBeenCalled();
+		expect(fixture.session.join).not.toHaveBeenCalled();
+		expect(open).not.toHaveBeenCalled();
+		open.mockRestore();
+	});
+
+	test('keeps an opened activity mounted while the room changes to its end summary', async () => {
+		const view = render(MkCallsRoomWindow, { props: { roomId: 'room' }, global: { stubs } });
+		await fireEvent.click(view.getByRole('button', { name: i18n.ts._calls.activities }));
+		const activities = view.getByText(i18n.ts._calls.noActivities);
+		fixture.connection.room.value = { ...fixture.connection.room.value, state: 'ended' };
+		await nextTick();
+		expect(view.getByRole('heading', { name: i18n.ts._calls.ended })).toBeTruthy();
+		expect(view.getByText(i18n.ts._calls.noActivities)).toBe(activities);
+	});
+
 	test('keeps an initially ended room open with its final timing and no join prompt', async () => {
 		fixture.connection.room.value = null;
 		fixture.connection.refresh.mockImplementation(async () => {
diff --git a/packages/i18n/src/autogen/locale.ts b/packages/i18n/src/autogen/locale.ts
index 9cb14ed578..93351f79b3 100644
--- a/packages/i18n/src/autogen/locale.ts
+++ b/packages/i18n/src/autogen/locale.ts
@@ -10376,6 +10376,18 @@ export interface Locale extends ILocale {
         "write:calls": string;
     };
     "_calls": {
+        /**
+         * アクティビティ
+         */
+        "activities": string;
+        /**
+         * アクティビティ一覧に戻る
+         */
+        "backToActivities": string;
+        /**
+         * 利用できるアクティビティはまだありません
+         */
+        "noActivities": string;
         /**
          * 通話設定
          */