diff --git a/packages/backend/src/core/DriveService.ts b/packages/backend/src/core/DriveService.ts
index 9d0cb578d0..9de68c597b 100644
--- a/packages/backend/src/core/DriveService.ts
+++ b/packages/backend/src/core/DriveService.ts
@@ -154,8 +154,8 @@ export class DriveService {
 	@bindThis
 	private async save(file: MiDriveFile, path: string, name: string, info: FileInfo): Promise<MiDriveFile> {
 		const type = info.type.mime;
-		const hash = info.md5;
-		const size = info.size;
+		let hash = info.md5;
+		let size = info.size;
 
 		// thunbnail, webpublic を必要なら生成
 		const alts = await this.generateAlts(path, type, !file.uri);
@@ -163,6 +163,9 @@ export class DriveService {
 		if (type && type.startsWith('video/')) {
 			try {
 				await this.videoProcessingService.webOptimizeVideo(path, type);
+				const newInfo = await this.fileInfoService.getFileInfo(path);
+				hash = newInfo.md5;
+				size = newInfo.size;
 			} catch (err) {
 				this.registerLogger.warn(`Video optimization failed: ${renderInlineError(err)}`);
 			}
diff --git a/packages/backend/src/server/api/endpoints/i/notifications-grouped.ts b/packages/backend/src/server/api/endpoints/i/notifications-grouped.ts
index 444734070f..3821b5a20e 100644
--- a/packages/backend/src/server/api/endpoints/i/notifications-grouped.ts
+++ b/packages/backend/src/server/api/endpoints/i/notifications-grouped.ts
@@ -116,7 +116,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
 			// user has many notifications, the pagination will break the
 			// groups
 
-			// scan `notifications` newest-to-oldest
+			// scan `notifications` newest-to-oldest (unless we have sinceId && !untilId, in which case it's oldest-to-newest)
 			for (let i = 0; i < notifications.length; i++) {
 				const notification = notifications[i];
 
@@ -135,7 +135,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
 					if (prevReaction.type !== 'reaction:grouped') {
 						prevReaction = groupedNotifications[reactionIdx] = {
 							type: 'reaction:grouped',
-							id: prevReaction.id, // this will be the newest id in this group
+							id: '',
 							createdAt: prevReaction.createdAt,
 							noteId: prevReaction.noteId!,
 							reactions: [{
@@ -149,6 +149,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
 						userId: notification.notifierId!,
 						reaction: notification.reaction!,
 					});
+					prevReaction.id = notification.id; // this will be the *oldest* id in this group (newest if sinceId && !untilId)
 					continue;
 				}
 
@@ -167,7 +168,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
 					if (prevRenote.type !== 'renote:grouped') {
 						prevRenote = groupedNotifications[renoteIdx] = {
 							type: 'renote:grouped',
-							id: prevRenote.id, // this will be the newest id in this group
+							id: '',
 							createdAt: prevRenote.createdAt,
 							noteId: prevRenote.noteId!,
 							userIds: [prevRenote.notifierId!],
@@ -175,6 +176,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
 					}
 					// add this new renote to the existing group
 					(prevRenote as FilterUnionByProperty<MiGroupedNotification, 'type', 'renote:grouped'>).userIds.push(notification.notifierId!);
+					prevRenote.id = notification.id; // this will be the *oldest* id in this group (newest if sinceId && !untilId)
 					continue;
 				}
 
@@ -182,10 +184,12 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
 				groupedNotifications.push(notification);
 			}
 
-			// sort the groups by their id, newest first
+			// sort the groups by their id
 			groupedNotifications.sort(
 				(a, b) => a.id < b.id ? 1 : a.id > b.id ? -1 : 0,
 			);
+			// this matches the logic in NotificationService and it's what MkPagination expects
+			if (ps.sinceId && !ps.untilId) groupedNotifications.reverse();
 
 			return await this.notificationEntityService.packGroupedMany(groupedNotifications, me.id);
 		});
diff --git a/packages/frontend/src/components/MkNotifications.vue b/packages/frontend/src/components/MkNotifications.vue
index d9faf2b06e..c43601fa49 100644
--- a/packages/frontend/src/components/MkNotifications.vue
+++ b/packages/frontend/src/components/MkNotifications.vue
@@ -18,7 +18,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 				:moveClass=" $style.transition_x_move"
 				tag="div"
 			>
-				<div v-for="(notification, i) in notifications" :key="notification.id">
+				<div v-for="(notification, i) in sortedByTime(notifications)" :key="notification.id">
 					<DynamicNote v-if="['reply', 'quote', 'mention'].includes(notification.type)" :class="$style.item" :note="notification.note" :withHardMute="true" :data-scroll-anchor="notification.id"/>
 					<XNotification v-else :class="$style.item" :notification="notification" :withTime="true" :full="true" :data-scroll-anchor="notification.id"/>
 				</div>
@@ -61,6 +61,20 @@ const pagination = computed(() => prefer.r.useGroupedNotifications.value ? {
 	})),
 });
 
+// for pagination reasons, each notification group needs to have the
+// id of the oldest notification inside it, but we want to show the
+// groups sorted by the time of the *newest* notification; so we re-sort
+// them here
+function sortedByTime(notifications) {
+	return notifications.toSorted(
+		(a, b) => {
+			if (a.createdAt < b.createdAt) return 1;
+			if (a.createdAt > b.createdAt) return -1;
+			return 0;
+		}
+	);
+}
+
 function onNotification(notification) {
 	const isMuted = props.excludeTypes ? props.excludeTypes.includes(notification.type) : false;
 	if (isMuted || window.document.visibilityState === 'visible') {