From cdfdd9b752cc3f7c93435641ecbb0eeecd9da04e Mon Sep 17 00:00:00 2001
From: coolbot100s <76798835+coolbot100s@users.noreply.github.com>
Date: Fri, 16 Oct 2026 19:29:21 -0700
Subject: [PATCH 01/28] feat: excessive externals issue

---
 packages/moderation/src/data/issues/permissions.ts | 14 ++++++++++++++
 .../messages/permissions/excessive-externals.md    |  7 +++++++
 2 files changed, 21 insertions(+)
 create mode 100644 packages/moderation/src/data/messages/checklist/messages/permissions/excessive-externals.md

diff --git a/packages/moderation/src/data/issues/permissions.ts b/packages/moderation/src/data/issues/permissions.ts
index efadb5750c7..4f5ec0cd176 100644
--- a/packages/moderation/src/data/issues/permissions.ts
+++ b/packages/moderation/src/data/issues/permissions.ts
@@ -4,6 +4,7 @@ import invalidPermissionsMessage from '../messages/checklist/messages/permission
 import missingPermissionsMessage from '../messages/checklist/messages/permissions/missing-permissions.md'
 import nonCommercialExternalContentMessage from '../messages/checklist/messages/permissions/non-commercial-external-content.md'
 import prohibitedExternalContentMessage from '../messages/checklist/messages/permissions/prohibited-external-content.md'
+import excessiveOverridesMessage from '../messages/checklist/messages/permissions/excessive-externals.md'
 import { issue, panel, toggle } from './component-builders/builders'
 import { issueLocation } from './component-builders/locations'
 
@@ -43,6 +44,15 @@ export const permissionsNonCommercialExternalContentIssue = issue({
 	suggestedStatus: 'rejected',
 })
 
+export const permissionsExcessiveOverridesIssue = issue({
+	id: 'permissions-excessive-overrides',
+	locations: [issueLocation('permissions')],
+	title: 'Excessive overrides',
+	category: 'Permissions',
+	message: excessiveOverridesMessage,
+	suggestedStatus: 'rejected',
+})
+
 export const permissionsReviewPanel = panel({
 	title: 'Modpack Permissions',
 	hint: "Does this project's external content have any issues?",
@@ -71,4 +81,8 @@ export const permissionsReviewPanel = panel({
 		label: 'Non-commercial externals',
 		shown: ({ projectV3 }) => projectV3.monetization_status === 'monetized',
 	}),
+	toggle({
+		issue: permissionsExcessiveOverridesIssue,
+		label: 'Excessive overrides',
+	}),
 )
diff --git a/packages/moderation/src/data/messages/checklist/messages/permissions/excessive-externals.md b/packages/moderation/src/data/messages/checklist/messages/permissions/excessive-externals.md
new file mode 100644
index 00000000000..cb509d84817
--- /dev/null
+++ b/packages/moderation/src/data/messages/checklist/messages/permissions/excessive-externals.md
@@ -0,0 +1,7 @@
+## Excessive External Files
+
+It looks like your project is distributing a lot of content as external files. \
+Most of the time, this is unnecessary and excessive overrides can create a worse experience for your users, make it hard to update your modpack, and prevent mod creators from earning rewards. \
+We ask that you ensure any applicable content is included as an embedded part of your modpack instead of being distributed as external content, for instance, by using the version of a mod available on Modrinth directly. If you've already followed this step, you may need to re-export your modpack. Keep in mind, modifying the files in any way will mean the file must be distributed as an external. \
+Remember to delete prior versions of your modpack before resubmitting. \
+If your modpack still contains a high number of external files when you resubmit, please ensure all permission steps are completed accurately.

From 45a9424687c9ee5661bb87092e04f41970b95de5 Mon Sep 17 00:00:00 2001
From: coolbot100s <76798835+coolbot100s@users.noreply.github.com>
Date: Sat, 17 Oct 2026 14:20:04 -0700
Subject: [PATCH 02/28] fix: lint

---
 packages/moderation/src/data/issues/permissions.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/moderation/src/data/issues/permissions.ts b/packages/moderation/src/data/issues/permissions.ts
index 4f5ec0cd176..816d461e1b8 100644
--- a/packages/moderation/src/data/issues/permissions.ts
+++ b/packages/moderation/src/data/issues/permissions.ts
@@ -1,10 +1,10 @@
 import { SignatureIcon } from '@modrinth/assets'
 
+import excessiveOverridesMessage from '../messages/checklist/messages/permissions/excessive-externals.md'
 import invalidPermissionsMessage from '../messages/checklist/messages/permissions/invalid-permissions.md'
 import missingPermissionsMessage from '../messages/checklist/messages/permissions/missing-permissions.md'
 import nonCommercialExternalContentMessage from '../messages/checklist/messages/permissions/non-commercial-external-content.md'
 import prohibitedExternalContentMessage from '../messages/checklist/messages/permissions/prohibited-external-content.md'
-import excessiveOverridesMessage from '../messages/checklist/messages/permissions/excessive-externals.md'
 import { issue, panel, toggle } from './component-builders/builders'
 import { issueLocation } from './component-builders/locations'
 

From fbc2e63393fd72b32711c4b1391009174ef80201 Mon Sep 17 00:00:00 2001
From: coolbot100s <76798835+coolbot100s@users.noreply.github.com>
Date: Sat, 17 Oct 2026 14:53:21 -0700
Subject: [PATCH 03/28] fix: send raw_icon instead of icon to modview icon

---
 .../src/components/project-review/project-info/project/icon.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/frontend/src/components/project-review/project-info/project/icon.vue b/apps/frontend/src/components/project-review/project-info/project/icon.vue
index 24e8cb1841f..d8b820b0558 100644
--- a/apps/frontend/src/components/project-review/project-info/project/icon.vue
+++ b/apps/frontend/src/components/project-review/project-info/project/icon.vue
@@ -12,7 +12,7 @@
 				:aria-label="formatMessage(messages.openIcon)"
 				@click="viewer?.show(0)"
 			>
-				<Avatar :src="project.icon_url || iconUrl" :alt="project.name" size="5rem" no-shadow />
+				<Avatar :src="project.raw_icon_url || iconUrl" :alt="project.name" size="5rem" no-shadow />
 			</button>
 			<Avatar v-else :alt="project.name" size="5rem" no-shadow />
 			<ImageViewerEditor

From 53ef79b5ead9029e87cfd1043930715e7bbb1415 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Mon, 19 Oct 2026 10:32:49 -0600
Subject: [PATCH 04/28] feat: default false for send thead message

---
 packages/moderation/src/data/settings.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/moderation/src/data/settings.ts b/packages/moderation/src/data/settings.ts
index 538aa065190..774286dd401 100644
--- a/packages/moderation/src/data/settings.ts
+++ b/packages/moderation/src/data/settings.ts
@@ -7,7 +7,7 @@ const settings = {
 			id: 'send-issues-as-thread-message',
 			title: 'Send issues as thread message',
 			description: 'Send selected issues as a thread message instead of creating tracked issues.',
-			default: true,
+			default: false,
 		}),
 		AutoGoNextOnReviewOutcome: setting.asToggle({
 			type: 'toggle',

From 9b18f7feab5c0353f1c6512c3dc5f0948389a0de Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Mon, 19 Oct 2026 11:06:13 -0600
Subject: [PATCH 05/28] fix: ensure queue bar tooltips only go on top

---
 .../src/components/project-review/queue-bar.vue        |  9 ++++++++-
 .../project-review/review-outcome-buttons/index.vue    |  1 +
 packages/ui/src/components/floating/FloatingMenu.vue   | 10 ++++++----
 3 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/apps/frontend/src/components/project-review/queue-bar.vue b/apps/frontend/src/components/project-review/queue-bar.vue
index afe550221b7..a7c89beb0ab 100644
--- a/apps/frontend/src/components/project-review/queue-bar.vue
+++ b/apps/frontend/src/components/project-review/queue-bar.vue
@@ -21,6 +21,7 @@
 					</button>
 					<FloatingMenu
 						placement="top-start"
+						:flip="false"
 						@open="panelMenuOpen = true"
 						@close="panelMenuOpen = false"
 					>
@@ -61,7 +62,13 @@
 				<div class="flex items-center gap-2">
 					<template v-for="(column, index) in queueColumns" :key="column.label.id">
 						<span v-if="index" class="h-5 w-px bg-divider" aria-hidden="true" />
-						<FloatingMenu trigger="hover" placement="top-start" theme="tooltip" :distance="4">
+						<FloatingMenu
+							trigger="hover"
+							placement="top-start"
+							:flip="false"
+							theme="tooltip"
+							:distance="4"
+						>
 							<span tabindex="0" class="cursor-default pb-1 pt-1.5 text-xs">
 								{{ formatMessage(column.label) }}
 								<span class="ml-1 tabular-nums text-primary">{{ column.count }}</span>
diff --git a/apps/frontend/src/components/project-review/review-outcome-buttons/index.vue b/apps/frontend/src/components/project-review/review-outcome-buttons/index.vue
index 63849203ae0..f10b4cf629f 100644
--- a/apps/frontend/src/components/project-review/review-outcome-buttons/index.vue
+++ b/apps/frontend/src/components/project-review/review-outcome-buttons/index.vue
@@ -142,6 +142,7 @@ const overflowActions = computed(() => [
 		tone: 'orange' as const,
 		icon: PlusIcon,
 		action: () => submitIssues(),
+		hoverFilled: true,
 		disabled:
 			!!heldBy.value ||
 			!canAddIssues.value ||
diff --git a/packages/ui/src/components/floating/FloatingMenu.vue b/packages/ui/src/components/floating/FloatingMenu.vue
index a4c33a895cd..3ac75274e3b 100644
--- a/packages/ui/src/components/floating/FloatingMenu.vue
+++ b/packages/ui/src/components/floating/FloatingMenu.vue
@@ -24,6 +24,7 @@ const props = withDefaults(
 	defineProps<{
 		trigger?: 'click' | 'hover'
 		placement?: Placement
+		flip?: boolean
 		distance?: number
 		theme?: string
 		disabled?: boolean
@@ -34,6 +35,7 @@ const props = withDefaults(
 	{
 		trigger: 'click',
 		placement: 'bottom',
+		flip: true,
 		distance: 8,
 		theme: 'dropdown',
 		disabled: false,
@@ -59,7 +61,7 @@ const teleportTarget = computed(
 )
 const floating = useTemplateRef<HTMLElement>('floating')
 const arrowEl = useTemplateRef<HTMLElement>('arrowEl')
-const expandOrigin = ref(SIDES.bottom.origin)
+const expandOrigin = ref<string>(SIDES.bottom.origin)
 const { floatingStyles, middlewareData, placement, x, y, isPositioned } = useFloating(
 	triggerEl,
 	floating,
@@ -74,12 +76,12 @@ const { floatingStyles, middlewareData, placement, x, y, isPositioned } = useFlo
 			})
 		},
 		open: isOpen,
-		middleware: [
+		middleware: computed(() => [
 			offset(() => props.distance),
-			flip(),
+			...(props.flip ? [flip()] : []),
 			shift({ padding: 8 }),
 			floatingArrow({ element: arrowEl, padding: 12 }),
-		],
+		]),
 	},
 )
 

From 16f0f08cd1d6d44f7157cbdc26d6d05f764877b2 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Mon, 19 Oct 2026 11:12:49 -0600
Subject: [PATCH 06/28] feat: add shift m to cycle misc review tabs

---
 .../components/project-review/project-wide-checks.vue | 11 +++++++++++
 .../ui/moderation/settings/ModerationKeybinds.vue     |  1 +
 packages/moderation/src/data/keybinds.ts              |  7 +++++++
 packages/moderation/src/types/keybinds.ts             |  1 +
 4 files changed, 20 insertions(+)

diff --git a/apps/frontend/src/components/project-review/project-wide-checks.vue b/apps/frontend/src/components/project-review/project-wide-checks.vue
index 7b87b1cd571..d2d5bfcd89f 100644
--- a/apps/frontend/src/components/project-review/project-wide-checks.vue
+++ b/apps/frontend/src/components/project-review/project-wide-checks.vue
@@ -129,6 +129,17 @@ const visiblePanels = computed(() =>
 const visibleTargets = computed(() => visiblePanels.value.map(({ key }) => key))
 const tabs = computed(() => visiblePanels.value.map(({ key, label }) => ({ value: key, label })))
 
+useReviewShortcut(
+	'cycle-misc',
+	() => {
+		const targets = visibleTargets.value
+		const currentIndex = selectedTarget.value === undefined ? -1 : targets.indexOf(selectedTarget.value)
+		selectedTarget.value = targets[(currentIndex + 1) % targets.length]
+		shortcuts.run('reveal-right')
+	},
+	() => visibleTargets.value.length > 0,
+)
+
 watch(
 	visibleTargets,
 	(visible) => {
diff --git a/apps/frontend/src/components/ui/moderation/settings/ModerationKeybinds.vue b/apps/frontend/src/components/ui/moderation/settings/ModerationKeybinds.vue
index cabc08f327f..fe92c5860e7 100644
--- a/apps/frontend/src/components/ui/moderation/settings/ModerationKeybinds.vue
+++ b/apps/frontend/src/components/ui/moderation/settings/ModerationKeybinds.vue
@@ -66,6 +66,7 @@ const messages = defineMessages({
 const navigationIds = [
 	'review-toggle-icon',
 	'review-cycle-conversation',
+	'review-cycle-misc',
 	'review-toggle-left',
 	'review-toggle-right',
 ]
diff --git a/packages/moderation/src/data/keybinds.ts b/packages/moderation/src/data/keybinds.ts
index a416ea4f783..905454a1401 100644
--- a/packages/moderation/src/data/keybinds.ts
+++ b/packages/moderation/src/data/keybinds.ts
@@ -49,6 +49,13 @@ const keybinds: { [id: string]: KeybindListener } = {
 		enabled: (ctx) => ctx.available('cycle-conversation'),
 		action: (ctx) => ctx.run('cycle-conversation'),
 	},
+	'review-cycle-misc': {
+		keybind: 'Shift+M',
+		description: 'Cycle misc review panels',
+		scope: 'review-actions',
+		enabled: (ctx) => ctx.available('cycle-misc'),
+		action: (ctx) => ctx.run('cycle-misc'),
+	},
 	'review-new-issue': {
 		keybind: 'N',
 		description: 'Add an issue',
diff --git a/packages/moderation/src/types/keybinds.ts b/packages/moderation/src/types/keybinds.ts
index 2802cd3201d..839c7253990 100644
--- a/packages/moderation/src/types/keybinds.ts
+++ b/packages/moderation/src/types/keybinds.ts
@@ -55,6 +55,7 @@ export type ModerationConversationContext = {
 
 export type ReviewShortcutAction =
 	| 'cycle-conversation'
+	| 'cycle-misc'
 	| 'toggle-icon'
 	| 'new-issue'
 	| 'toggle-left'

From ff09525215d1ebfbf289637311cf6492839e4ac7 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Mon, 19 Oct 2026 11:22:55 -0600
Subject: [PATCH 07/28] feat: custom panel issue toggle keybinds

---
 .../review-panel/controls/action-button.vue   | 39 +++++++++++---
 .../review-panel/controls/index.vue           | 22 +++++---
 .../review-panel/use-action-keybinds.ts       | 53 ++++++++++---------
 .../settings/ModerationKeybinds.vue           |  9 ++++
 packages/moderation/src/data/keybinds.ts      | 42 +++++++++++++++
 packages/moderation/src/handles/keybinds.ts   |  7 ++-
 packages/moderation/src/types/keybinds.ts     | 21 ++++++--
 7 files changed, 147 insertions(+), 46 deletions(-)

diff --git a/apps/frontend/src/components/project-review/review-panel/controls/action-button.vue b/apps/frontend/src/components/project-review/review-panel/controls/action-button.vue
index b5077fd44ce..53f1deef9cc 100644
--- a/apps/frontend/src/components/project-review/review-panel/controls/action-button.vue
+++ b/apps/frontend/src/components/project-review/review-panel/controls/action-button.vue
@@ -3,8 +3,8 @@
 		type="outlined"
 		:disabled="disabled"
 		:aria-pressed="mixed ? 'mixed' : modelValue"
-		:aria-keyshortcuts="keybind"
-		:data-review-keybind="keybind"
+		:aria-keyshortcuts="ariaKeybind"
+		:data-review-toggle-index="toggleIndex"
 		class="action-toggle !h-auto min-h-8 max-w-full !gap-1.5 !whitespace-normal !rounded-lg !px-2.5 !font-medium [&>svg]:!text-inherit"
 		:class="{
 			'!brightness-100': modelValue,
@@ -24,26 +24,51 @@
 			class="action-toggle-keybind ml-1 flex h-5 min-w-5 shrink-0 items-center justify-center gap-0.5 rounded px-1 font-sans text-[11px] font-medium leading-none"
 			aria-hidden="true"
 		>
-			<ArrowBigUpIcon v-if="keybind.startsWith('Shift+')" class="!size-3" />
-			{{ keybind.replace('Shift+', '').replaceAll('+', ' ') }}
+			{{ keybindLabel }}
 		</kbd>
 	</Button>
 </template>
 
 <script lang="ts" setup>
-import { ArrowBigUpIcon, MinusIcon, TagCategoryRefreshCcwIcon } from '@modrinth/assets'
+import { MinusIcon, TagCategoryRefreshCcwIcon } from '@modrinth/assets'
+import { formatKeybind, type KeybindDefinition } from '@modrinth/moderation'
 import { Button } from '@modrinth/ui'
+import { computed, onMounted, ref } from 'vue'
 
-defineProps<{
+const props = defineProps<{
 	modelValue: boolean
 	mixed?: boolean
 	reReview?: boolean
 	label: string
 	disabled?: boolean
-	keybind?: string
+	keybind?: KeybindDefinition
+	toggleIndex?: number
 	showKeybindHint?: boolean
 }>()
 
+const isMac = ref(false)
+onMounted(() => {
+	isMac.value = navigator.platform.toUpperCase().includes('MAC')
+})
+const keybindLabel = computed(() =>
+	props.keybind ? formatKeybind(props.keybind, isMac.value) : undefined,
+)
+const ariaKeybind = computed(() => {
+	const definition = props.keybind
+	if (!definition) return undefined
+	const portableMod =
+		definition.mod || (definition.ctrl && (definition.meta || definition.meta === undefined))
+	return [
+		(portableMod ? !isMac.value : definition.ctrl) ? 'Control' : undefined,
+		(portableMod ? isMac.value : definition.meta) ? 'Meta' : undefined,
+		definition.shift ? 'Shift' : undefined,
+		definition.alt ? 'Alt' : undefined,
+		definition.key === ' ' ? 'Space' : definition.key,
+	]
+		.filter(Boolean)
+		.join('+')
+})
+
 const emit = defineEmits<{
 	'update:modelValue': [boolean]
 }>()
diff --git a/apps/frontend/src/components/project-review/review-panel/controls/index.vue b/apps/frontend/src/components/project-review/review-panel/controls/index.vue
index 54f26c59e64..c44ac3420bc 100644
--- a/apps/frontend/src/components/project-review/review-panel/controls/index.vue
+++ b/apps/frontend/src/components/project-review/review-panel/controls/index.vue
@@ -128,6 +128,7 @@
 						<ActionButton
 							:label="control.label"
 							:keybind="keybinds.get(control)"
+							:toggle-index="toggleIndexes.get(control)"
 							:show-keybind-hint="
 								settings.get(moderationSettings.General.ShowToggleIssueButtonShortcutHint)
 							"
@@ -205,7 +206,7 @@ import {
 } from 'vue'
 
 import TemplateMarkdownEditor from '~/components/project-review/message-thread/template-markdown-editor.vue'
-import { useModerationSettings } from '~/composables/moderation'
+import { useModerationKeybinds, useModerationSettings } from '~/composables/moderation'
 import type { ReviewTarget } from '~/providers/project-review/review'
 import {
 	injectReviewPanels,
@@ -355,20 +356,25 @@ function toggleControls(binding?: ReviewPanelBinding) {
 		) ?? []
 	)
 }
-const keybinds = computed(
+const toggleIndexes = computed(
 	() =>
 		new Map(
 			toggleControls(panelBinding.value).map((control, index) => [
 				control,
-				actionKeybind(index + (props.keybindOffset ?? 0)),
+				index + (props.keybindOffset ?? 0),
 			]),
 		),
 )
-function actionKeybind(index: number) {
-	if (index >= 27) return undefined
-	const modifier = index >= 18 ? 'Alt+' : index >= 9 ? 'Shift+' : ''
-	return `${modifier}${(index % 9) + 1}`
-}
+const configuredKeybinds = useModerationKeybinds()
+const keybinds = computed(() => {
+	const bindings = new Map([...configuredKeybinds.value])
+	return new Map(
+		[...toggleIndexes.value].map(([control, index]) => {
+			const definition = bindings.get(`review-panel-toggle-${index + 1}`)?.keybind[0]
+			return [control, definition]
+		}),
+	)
+})
 
 const hasControls = computed(() =>
 	panelBinding.value?.panel.sections.some((section) => section.controls.length > 0),
diff --git a/apps/frontend/src/components/project-review/review-panel/use-action-keybinds.ts b/apps/frontend/src/components/project-review/review-panel/use-action-keybinds.ts
index 11b299aba84..7d82c472973 100644
--- a/apps/frontend/src/components/project-review/review-panel/use-action-keybinds.ts
+++ b/apps/frontend/src/components/project-review/review-panel/use-action-keybinds.ts
@@ -1,30 +1,18 @@
 import type { Ref } from 'vue'
 
+import { useModerationKeybinds } from '~/composables/moderation'
+
 import type { createReviewShortcuts } from '../shortcuts'
 
 export function useActionKeybinds(
 	element: Readonly<Ref<HTMLElement | null>>,
 	shortcuts: ReturnType<typeof createReviewShortcuts>,
 ) {
+	const keybinds = useModerationKeybinds()
 	shortcuts.listen('keydown', (event) => {
-		if (
-			event.defaultPrevented ||
-			event.repeat ||
-			event.isComposing ||
-			event.ctrlKey ||
-			event.metaKey ||
-			(event.shiftKey && event.altKey)
-		) {
+		if (event.defaultPrevented || event.repeat || event.isComposing) {
 			return
 		}
-		const digit = /^[1-9]$/.test(event.key)
-			? event.key
-			: (event.shiftKey || event.altKey) && /^Digit[1-9]$/.test(event.code)
-				? event.code.slice(-1)
-				: undefined
-		if (!digit) return
-		const modifier = event.altKey ? 'Alt+' : event.shiftKey ? 'Shift+' : ''
-		const keybind = `${modifier}${digit}`
 
 		const target = event.target
 		if (
@@ -46,15 +34,28 @@ export function useActionKeybinds(
 		) {
 			return
 		}
-		const button = panel.querySelector<HTMLButtonElement>(
-			`button[data-review-keybind="${keybind}"]`,
-		)
-		if (!button || button.disabled || button.closest('[data-review-panel]') !== panel) return
-
-		event.preventDefault()
-		const focused = panel.ownerDocument.activeElement
-		if (focused instanceof HTMLElement) focused.blur()
-		button.click()
-		button.blur()
+		const toggleButton = (index: number) => {
+			const button = panel.querySelector<HTMLButtonElement>(
+				`button[data-review-toggle-index="${index}"]`,
+			)
+			return button &&
+				!button.disabled &&
+				button.closest('[data-review-panel]') === panel &&
+				button.getClientRects().length > 0
+				? button
+				: undefined
+		}
+		keybinds.value.handle(event, {
+			scope: 'review-panel-toggle',
+			available: (index) => !!toggleButton(index),
+			toggle: (index) => {
+				const button = toggleButton(index)
+				if (!button) return
+				const focused = panel.ownerDocument.activeElement
+				if (focused instanceof HTMLElement) focused.blur()
+				button.click()
+				button.blur()
+			},
+		})
 	})
 }
diff --git a/apps/frontend/src/components/ui/moderation/settings/ModerationKeybinds.vue b/apps/frontend/src/components/ui/moderation/settings/ModerationKeybinds.vue
index fe92c5860e7..e2cd7ed5d15 100644
--- a/apps/frontend/src/components/ui/moderation/settings/ModerationKeybinds.vue
+++ b/apps/frontend/src/components/ui/moderation/settings/ModerationKeybinds.vue
@@ -29,6 +29,10 @@ const messages = defineMessages({
 		id: 'moderation.keybinds.items',
 		defaultMessage: 'Review items and checks',
 	},
+	panelToggles: {
+		id: 'moderation.keybinds.panel-toggles',
+		defaultMessage: 'Panel toggles',
+	},
 	decisions: {
 		id: 'moderation.keybinds.decisions',
 		defaultMessage: 'Review outcomes and queue',
@@ -126,6 +130,11 @@ const groups = computed(() => {
 			title: messages.technical,
 			bindings: bindings.value.filter(([, binding]) => binding.scope === 'tech-review'),
 		},
+		{
+			id: 'panel-toggles',
+			title: messages.panelToggles,
+			bindings: bindings.value.filter(([, binding]) => binding.scope === 'review-panel-toggle'),
+		},
 	]
 	return categories.filter((group) => group.bindings.length)
 })
diff --git a/packages/moderation/src/data/keybinds.ts b/packages/moderation/src/data/keybinds.ts
index 905454a1401..f89aa4b2acd 100644
--- a/packages/moderation/src/data/keybinds.ts
+++ b/packages/moderation/src/data/keybinds.ts
@@ -34,7 +34,49 @@ function isOfficialModrinthHost(): boolean {
 	return host === 'modrinth.com' || host === 'www.modrinth.com' || host === 'staging.modrinth.com'
 }
 
+const panelToggleKeybinds = [
+	'1',
+	'2',
+	'3',
+	'4',
+	'5',
+	'6',
+	'7',
+	'8',
+	'9',
+	'Shift+1',
+	'Shift+2',
+	'Shift+3',
+	'Shift+4',
+	'Shift+5',
+	'Shift+6',
+	'Shift+7',
+	'Shift+8',
+	'Shift+9',
+	'Alt+1',
+	'Alt+2',
+	'Alt+3',
+	'Alt+4',
+	'Alt+5',
+	'Alt+6',
+	'Alt+7',
+	'Alt+8',
+	'Alt+9',
+]
+
 const keybinds: { [id: string]: KeybindListener } = {
+	...Object.fromEntries(
+		panelToggleKeybinds.map((keybind, index) => [
+			`review-panel-toggle-${index + 1}`,
+			{
+				keybind,
+				description: `Toggle panel item ${index + 1}`,
+				scope: 'review-panel-toggle',
+				enabled: (ctx) => ctx.available(index),
+				action: (ctx) => ctx.toggle(index),
+			} satisfies KeybindListener,
+		]),
+	),
 	'review-toggle-icon': {
 		keybind: 'I',
 		description: 'Toggle project icon viewer',
diff --git a/packages/moderation/src/handles/keybinds.ts b/packages/moderation/src/handles/keybinds.ts
index 93b1db39e43..095a23579fd 100644
--- a/packages/moderation/src/handles/keybinds.ts
+++ b/packages/moderation/src/handles/keybinds.ts
@@ -24,6 +24,8 @@ function bindKeybind<T>(keybind: BaseKeybindListener<T>, ctx: T) {
 
 function scopedKeybind(keybind: KeybindListener, ctx: ModerationContext) {
 	switch (ctx.scope) {
+		case 'review-panel-toggle':
+			return keybind.scope === 'review-panel-toggle' ? bindKeybind(keybind, ctx) : undefined
 		case 'project':
 			return keybind.scope === 'project' ? bindKeybind(keybind, ctx) : undefined
 		case 'tech-review':
@@ -76,8 +78,8 @@ export class Keybinds {
 		for (const [index, [id, binding]] of bindings.entries()) {
 			for (const [otherId, other] of bindings.slice(index)) {
 				const sameReviewPage =
-					['project-review', 'review-actions'].includes(binding.scope) &&
-					['project-review', 'review-actions'].includes(other.scope)
+					['project-review', 'review-actions', 'review-panel-toggle'].includes(binding.scope) &&
+					['project-review', 'review-actions', 'review-panel-toggle'].includes(other.scope)
 				if (
 					binding.scope !== other.scope &&
 					binding.scope !== 'global' &&
@@ -126,6 +128,7 @@ export class Keybinds {
 				if (
 					ctx.scope !== 'review-composer' &&
 					ctx.scope !== 'review-actions' &&
+					ctx.scope !== 'review-panel-toggle' &&
 					document.activeElement instanceof HTMLElement
 				) {
 					document.activeElement.blur()
diff --git a/packages/moderation/src/types/keybinds.ts b/packages/moderation/src/types/keybinds.ts
index 839c7253990..132a7d9eb67 100644
--- a/packages/moderation/src/types/keybinds.ts
+++ b/packages/moderation/src/types/keybinds.ts
@@ -40,6 +40,7 @@ export type ModerationProjectReviewContext = {
 }
 
 export type ModerationContext =
+	| ModerationPanelToggleContext
 	| ModerationProjectContext
 	| ModerationTechReviewContext
 	| ModerationGlobalContext
@@ -48,6 +49,12 @@ export type ModerationContext =
 	| ModerationReviewActionsContext
 	| ModerationReviewComposerContext
 
+export type ModerationPanelToggleContext = {
+	scope: 'review-panel-toggle'
+	available: (index: number) => boolean
+	toggle: (index: number) => void
+}
+
 export type ModerationConversationContext = {
 	scope: 'review-conversation'
 	openEditor: (mode: 'reply' | 'note') => void
@@ -116,6 +123,9 @@ export type KeybindProjectReviewListener = BaseKeybindListener<ModerationProject
 	scope: 'project-review'
 }
 export type KeybindListener =
+	| (BaseKeybindListener<ModerationPanelToggleContext> & {
+			scope: 'review-panel-toggle'
+	  })
 	| KeybindProjectListener
 	| KeybindTechReviewListener
 	| KeybindGlobalListener
@@ -161,6 +171,9 @@ export function matchesKeybind(event: KeybindEvent, keybind: KeybindDefinition |
 		: event.ctrlKey === !!def.ctrl && event.metaKey === !!def.meta
 	return (
 		(event.key.toLowerCase() === def.key.toLowerCase() ||
+			((event.shiftKey || event.altKey) &&
+				/^[1-9]$/.test(def.key) &&
+				event.code === `Digit${def.key}`) ||
 			(event.altKey && /^[a-z]$/i.test(def.key) && event.code === `Key${def.key.toUpperCase()}`)) &&
 		!!modifiersMatch &&
 		event.shiftKey === (def.shift ?? false) &&
@@ -188,9 +201,11 @@ export function keybindsOverlap(left: KeybindDefinition, right: KeybindDefinitio
 export function toKeybindDefinition(event: KeyboardEvent): KeybindDefinition {
 	return {
 		key:
-			event.altKey && /^Key[A-Z]$/.test(event.code)
-				? event.code.slice(3).toLowerCase()
-				: event.key.toLowerCase(),
+			(event.shiftKey || event.altKey) && /^Digit[1-9]$/.test(event.code)
+				? event.code.slice(-1)
+				: event.altKey && /^Key[A-Z]$/.test(event.code)
+					? event.code.slice(3).toLowerCase()
+					: event.key.toLowerCase(),
 		ctrl: event.ctrlKey,
 		shift: event.shiftKey,
 		alt: event.altKey,

From c7910c39b07cbca0e1f158b39e7290cac0bc471d Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Mon, 19 Oct 2026 11:49:07 -0600
Subject: [PATCH 08/28] feat: hover on issue toggle to show preview

---
 .../review-panel/controls/index.vue           |   9 +-
 .../review-panel/controls/message-preview.vue | 107 ++++++++++++++++++
 .../review-panel/controls/preview-hover.ts    |  57 ++++++++++
 .../settings/ModerationSettings.vue           |   1 +
 .../ui/project-issue-card/index.vue           |   9 +-
 .../project-review/review-messages.ts         |  15 ++-
 .../providers/project-review/review-panels.ts |  24 +++-
 packages/moderation/src/data/settings.ts      |   7 ++
 .../ui/src/components/floating/Tooltip.vue    |   7 +-
 9 files changed, 221 insertions(+), 15 deletions(-)
 create mode 100644 apps/frontend/src/components/project-review/review-panel/controls/message-preview.vue
 create mode 100644 apps/frontend/src/components/project-review/review-panel/controls/preview-hover.ts

diff --git a/apps/frontend/src/components/project-review/review-panel/controls/index.vue b/apps/frontend/src/components/project-review/review-panel/controls/index.vue
index c44ac3420bc..ac092bcd81b 100644
--- a/apps/frontend/src/components/project-review/review-panel/controls/index.vue
+++ b/apps/frontend/src/components/project-review/review-panel/controls/index.vue
@@ -119,10 +119,10 @@
 							{{ formatMessage(controlMessages.required) }}
 						</p>
 					</div>
-					<Tooltip
+					<MessagePreview
 						v-else
-						:disabled="!control.tooltip"
-						:text="control.tooltip"
+						:entry="{ binding: panelBinding, control }"
+						:disabled="control.disabled"
 						class="min-w-0 max-w-full"
 					>
 						<ActionButton
@@ -138,7 +138,7 @@
 							:mixed="panels.mixed(panelBinding, control)"
 							@update:model-value="toggleAction(control, $event)"
 						/>
-					</Tooltip>
+					</MessagePreview>
 				</template>
 				<Tooltip
 					v-if="
@@ -216,6 +216,7 @@ import { injectReviewPreviousIssues } from '~/providers/project-review/review-pr
 
 import { projectReviewMessages as messages } from '../../messages'
 import ActionButton from './action-button.vue'
+import MessagePreview from './message-preview.vue'
 import SlugInput from './slug-input.vue'
 
 const props = defineProps<{
diff --git a/apps/frontend/src/components/project-review/review-panel/controls/message-preview.vue b/apps/frontend/src/components/project-review/review-panel/controls/message-preview.vue
new file mode 100644
index 00000000000..30c3b467961
--- /dev/null
+++ b/apps/frontend/src/components/project-review/review-panel/controls/message-preview.vue
@@ -0,0 +1,107 @@
+<script setup lang="ts">
+import type { Labrinth } from '@modrinth/api-client'
+import { moderationSettings } from '@modrinth/moderation'
+import { Tooltip } from '@modrinth/ui'
+import { useEventListener } from '@vueuse/core'
+import { computed, h, onBeforeUnmount, ref, useTemplateRef, watch } from 'vue'
+
+import ProjectIssueCard from '~/components/ui/project-issue-card/index.vue'
+import { useModerationSettings } from '~/composables/moderation'
+import { injectReviewMessages } from '~/providers/project-review/review-messages'
+import {
+	injectReviewPanels,
+	type ReviewIssueControl,
+} from '~/providers/project-review/review-panels'
+
+import { useReviewEventListener } from '../../shortcuts'
+import { getPreviewHover } from './preview-hover'
+
+const props = defineProps<{ entry?: ReviewIssueControl; disabled?: boolean }>()
+const settings = useModerationSettings()
+const disabled = computed(
+	() =>
+		props.disabled ||
+		!settings.value.get(moderationSettings.General.EnableDelayedHoverMessagePreviews),
+)
+const reviewMessages = injectReviewMessages()
+const panels = injectReviewPanels()
+const trigger = useTemplateRef<HTMLElement>('trigger')
+const open = ref(false)
+let hover: ReturnType<typeof getPreviewHover> | undefined
+const preview = {
+	show: () => {
+		if (trigger.value?.isConnected) open.value = true
+	},
+	hide: () => {
+		open.value = false
+	},
+}
+const issue = computed<Labrinth.Threads.v3.ThreadIssue | undefined>(() => {
+	const entry = props.entry
+	if (!open.value || !entry) return undefined
+	const resolved = panels.previewIssue(entry)
+	if (!resolved) return undefined
+	const definition = panels.availableIssues.value.find(({ id }) => id === entry.control.issueId)
+	return {
+		id: `preview-${entry.control.issueId}`,
+		created_by: null,
+		created_at: '',
+		verdict: 'open',
+		why: {
+			issue_id: entry.control.issueId,
+			title: definition?.title ?? entry.control.label,
+			message: reviewMessages.previewIssueMessage(entry),
+			locations: resolved.locations,
+		},
+		facets: resolved.facets.map((facet, index) => ({
+			...facet,
+			id: `preview-${entry.control.issueId}-${index}`,
+			user_addressed: false,
+			moderator_verified: false,
+			verdict: 'open',
+		})),
+	}
+})
+
+function leave() {
+	hover?.leave(preview)
+}
+
+function dismiss() {
+	hover?.dismiss(preview)
+}
+
+function enter() {
+	if (disabled.value || !props.entry || !trigger.value) return
+	const next = getPreviewHover(trigger.value.ownerDocument)
+	if (hover !== next) leave()
+	hover = next
+	hover.enter(preview)
+}
+
+useEventListener(trigger, 'mouseenter', enter)
+useEventListener(trigger, 'mouseleave', leave)
+useEventListener(trigger, 'focusin', enter)
+useEventListener(trigger, 'focusout', leave)
+useEventListener(trigger, 'click', dismiss)
+watch(() => [props.entry?.control, disabled.value], dismiss, { flush: 'sync' })
+onBeforeUnmount(leave)
+useReviewEventListener('keydown', (event) => {
+	if (event.key === 'Escape') dismiss()
+})
+useReviewEventListener('blur', dismiss)
+</script>
+
+<template>
+	<div ref="trigger">
+		<slot />
+		<Tooltip
+			:animated="false"
+			:show-arrow="false"
+			:reference="open && issue ? trigger : null"
+			:content="() => (issue ? h(ProjectIssueCard, { issues: [issue], preview: true }) : null)"
+			placement="right"
+			panel-class="w-[min(28rem,calc(100vw-1rem))] max-h-[calc(100vh-1rem)] overflow-hidden !rounded-2xl !border-0 !bg-surface-2 !p-0 font-normal"
+		/>
+	</div>
+</template>
diff --git a/apps/frontend/src/components/project-review/review-panel/controls/preview-hover.ts b/apps/frontend/src/components/project-review/review-panel/controls/preview-hover.ts
new file mode 100644
index 00000000000..b2b621bb0a8
--- /dev/null
+++ b/apps/frontend/src/components/project-review/review-panel/controls/preview-hover.ts
@@ -0,0 +1,57 @@
+const INITIAL_HOVER_DELAY_MS = 750
+const HOVER_GRACE_PERIOD_MS = 250
+
+interface Preview {
+	show: () => void
+	hide: () => void
+}
+
+const documents = new WeakMap<Document, ReturnType<typeof createPreviewHover>>()
+
+export function getPreviewHover(document: Document) {
+	let state = documents.get(document)
+	if (!state) {
+		state = createPreviewHover()
+		documents.set(document, state)
+	}
+	return state
+}
+
+function createPreviewHover() {
+	let current: Preview | undefined
+	let timer: ReturnType<typeof setTimeout> | undefined
+	let visible = false
+	let warmUntil = 0
+
+	function leave(preview: Preview) {
+		if (current !== preview) return
+		clearTimeout(timer)
+		timer = undefined
+		if (visible) warmUntil = Date.now() + HOVER_GRACE_PERIOD_MS
+		visible = false
+		current = undefined
+		preview.hide()
+	}
+
+	return {
+		enter(preview: Preview) {
+			if (current === preview) return
+			if (current) leave(current)
+			current = preview
+			const show = () => {
+				timer = undefined
+				visible = true
+				warmUntil = Infinity
+				preview.show()
+			}
+			if (Date.now() < warmUntil) show()
+			else timer = setTimeout(show, INITIAL_HOVER_DELAY_MS)
+		},
+		leave,
+		dismiss(preview: Preview) {
+			if (current !== preview) return
+			leave(preview)
+			warmUntil = 0
+		},
+	}
+}
diff --git a/apps/frontend/src/components/ui/moderation/settings/ModerationSettings.vue b/apps/frontend/src/components/ui/moderation/settings/ModerationSettings.vue
index 2666e38d8dd..bd053341eea 100644
--- a/apps/frontend/src/components/ui/moderation/settings/ModerationSettings.vue
+++ b/apps/frontend/src/components/ui/moderation/settings/ModerationSettings.vue
@@ -75,6 +75,7 @@ const groups = [
 			general.LinkInfoPlacement,
 			general.ShowFloatingPanelFieldHoverHighlight,
 			general.ShowInlinePanelHoverHighlight,
+			general.EnableDelayedHoverMessagePreviews,
 			general.PrivateMessageHighlight,
 		],
 	},
diff --git a/apps/frontend/src/components/ui/project-issue-card/index.vue b/apps/frontend/src/components/ui/project-issue-card/index.vue
index c927a92f39a..f9f83fe53a3 100644
--- a/apps/frontend/src/components/ui/project-issue-card/index.vue
+++ b/apps/frontend/src/components/ui/project-issue-card/index.vue
@@ -2,6 +2,7 @@
 	<div
 		v-if="matchingIssues.length && (!threadHistory || isStaff(auth.user))"
 		:id="fieldAnchor"
+		:inert="preview"
 		class="flex flex-col gap-2"
 	>
 		<div
@@ -57,7 +58,7 @@
 					:class="{ 'rotate-180': isExpanded(issue) }"
 					aria-hidden="true"
 				/>
-				<div v-if="isStaff(auth.user)" class="shrink-0 cursor-default" @click.stop>
+				<div v-if="!preview && isStaff(auth.user)" class="shrink-0 cursor-default" @click.stop>
 					<TeleportOverflowMenu
 						:label="formatMessage(messages.issueOptions)"
 						:options="moderatorOptions(issue)"
@@ -86,6 +87,7 @@
 						/>
 						<div
 							v-if="
+								!preview &&
 								!threadHistory &&
 								!isComplete(issue) &&
 								((showProjectAreaLink && issueActions(issue).length) || showAddressActions(issue))
@@ -271,6 +273,7 @@ const props = defineProps<{
 	userId?: string
 	teamId?: string
 	disclosureType?: string
+	preview?: boolean
 	threadHistory?: boolean
 	defaultCollapsed?: boolean
 	fieldAction?: ProjectIssueFieldAction
@@ -280,7 +283,7 @@ const emit = defineEmits<{
 	'update-thread': []
 }>()
 
-const projectContext = props.threadHistory ? null : injectProjectPageContext()
+const projectContext = props.threadHistory || props.preview ? null : injectProjectPageContext()
 const thread = computed(() => projectContext?.thread.value)
 const currentMember = computed(() => projectContext?.currentMember.value)
 const project = computed(() => requireProjectContext().projectV2.value)
@@ -863,7 +866,7 @@ function isComplete(issue: ThreadIssue): boolean {
 }
 
 function issueContentId(issue: ThreadIssue): string {
-	return `${props.threadHistory ? 'thread' : 'project'}-issue-${issue.id}`
+	return `${props.preview ? 'preview' : props.threadHistory ? 'thread' : 'project'}-issue-${issue.id}`
 }
 
 function isExpanded(issue: ThreadIssue): boolean {
diff --git a/apps/frontend/src/providers/project-review/review-messages.ts b/apps/frontend/src/providers/project-review/review-messages.ts
index 36b25d40951..0b49175695e 100644
--- a/apps/frontend/src/providers/project-review/review-messages.ts
+++ b/apps/frontend/src/providers/project-review/review-messages.ts
@@ -3,7 +3,7 @@ import { expandVariables } from '@modrinth/moderation/src/utils'
 import { createContext } from '@modrinth/ui'
 import { computed, reactive, type Ref, watch } from 'vue'
 
-import type { createReviewPanels } from './review-panels'
+import type { createReviewPanels, ReviewIssueControl } from './review-panels'
 
 export const [injectReviewMessages, provideReviewMessages] =
 	createContext<ReturnType<typeof createReviewMessages>>('ProjectReviewMessages')
@@ -32,6 +32,13 @@ export function createReviewMessages(
 		if (custom) return custom.message
 		return overrides.get(id) ?? issueMessages.value.get(id) ?? defaults.get(id) ?? ''
 	}
+	function previewIssueMessage(entry: ReviewIssueControl) {
+		if (panels.selected(entry.binding, entry.control)) return issueMessage(entry.control.issueId)
+		const current = project.value
+		const legacy = projectV2.value
+		if (!current || !legacy || current.id !== legacy.id) return ''
+		return expandVariables(panels.previewIssueMessage(entry).trim(), legacy, current)
+	}
 	function editIssueMessage(id: string, message: string) {
 		if (panels.customIssues.value.some((issue) => issue.id === id)) {
 			panels.updateCustomIssue(id, { message })
@@ -45,7 +52,10 @@ export function createReviewMessages(
 	function resetIssueMessage(id: string) {
 		overrides.delete(id)
 		const custom = panels.customIssues.value.find((issue) => issue.id === id)?.custom
-		if (custom) panels.updateCustomIssue(id, { message: custom.previous?.why.message ?? '' })
+		if (custom)
+			panels.updateCustomIssue(id, {
+				message: custom.previous?.why.message ?? '',
+			})
 	}
 	function hasIssueOverride(id: string) {
 		const custom = panels.customIssues.value.find((issue) => issue.id === id)?.custom
@@ -67,6 +77,7 @@ export function createReviewMessages(
 	return {
 		generating,
 		issueMessage,
+		previewIssueMessage,
 		setIssueDefault: (id: string, message: string) => {
 			defaults.set(id, message)
 		},
diff --git a/apps/frontend/src/providers/project-review/review-panels.ts b/apps/frontend/src/providers/project-review/review-panels.ts
index 9a4c36541c3..9f5591088cc 100644
--- a/apps/frontend/src/providers/project-review/review-panels.ts
+++ b/apps/frontend/src/providers/project-review/review-panels.ts
@@ -744,7 +744,7 @@ export function createReviewPanels(
 		}
 	}
 
-	const activeIssues = computed(() => {
+	function resolveActiveIssues(preview?: ReviewIssueControl) {
 		const projectV3 = project.value
 		if (!projectV3) return []
 		const issues = new Map<string, IssueSelection>()
@@ -791,7 +791,14 @@ export function createReviewPanels(
 					if (
 						control.childToggleIds ||
 						control.disabled ||
-						(control.type === 'toggle' && !selected(binding, control))
+						(control.type === 'toggle' &&
+							control !== preview?.control &&
+							!(
+								control.issueId === preview?.control.issueId &&
+								control.id !== undefined &&
+								preview.control.childToggleIds?.includes(control.id)
+							) &&
+							!selected(binding, control))
 					)
 						continue
 					const selection: IssueSelection = issues.get(control.issueId) ?? {
@@ -832,7 +839,9 @@ export function createReviewPanels(
 					...reviewData.value,
 					selected: {
 						items: {},
-						issueIds: selectedIssueIds.value,
+						issueIds: preview
+							? [...new Set([...selectedIssueIds.value, preview.control.issueId])]
+							: selectedIssueIds.value,
 						toggleIds: [...keys],
 					},
 					getMarkdownValue: (key, scope = id) =>
@@ -876,7 +885,9 @@ export function createReviewPanels(
 					},
 				}
 			})
-	})
+	}
+
+	const activeIssues = computed(() => resolveActiveIssues())
 
 	const validationErrors = computed(() => [
 		...activeIssues.value
@@ -929,6 +940,11 @@ export function createReviewPanels(
 		selectValues,
 		missing,
 		write,
+		previewIssue: (entry: ReviewIssueControl) =>
+			resolveActiveIssues(entry).find(({ id }) => id === entry.control.issueId),
+		previewIssueMessage: (entry: ReviewIssueControl) =>
+			resolveActiveIssues(entry).find(({ id }) => id === entry.control.issueId)?.issue.message ??
+			'',
 		activeIssues,
 		validationErrors,
 	}
diff --git a/packages/moderation/src/data/settings.ts b/packages/moderation/src/data/settings.ts
index 774286dd401..fc1a18d2417 100644
--- a/packages/moderation/src/data/settings.ts
+++ b/packages/moderation/src/data/settings.ts
@@ -24,6 +24,13 @@ const settings = {
 			description: 'Hide the formatting buttons above all Markdown editors in project review.',
 			default: true,
 		}),
+		EnableDelayedHoverMessagePreviews: setting.asToggle({
+			type: 'toggle',
+			id: 'enable-delayed-hover-message-previews',
+			title: 'Enable delayed hover message previews',
+			description: 'Show issue card previews when hovering over issue toggle buttons.',
+			default: true,
+		}),
 		ShowShortcutKeybindHints: setting.asToggle({
 			type: 'toggle',
 			id: 'show-shortcut-keybind-hints',
diff --git a/packages/ui/src/components/floating/Tooltip.vue b/packages/ui/src/components/floating/Tooltip.vue
index 6b616a63e73..33d2782da49 100644
--- a/packages/ui/src/components/floating/Tooltip.vue
+++ b/packages/ui/src/components/floating/Tooltip.vue
@@ -43,6 +43,8 @@ const SIDES = {
 const props = withDefaults(
 	defineProps<{
 		disabled?: boolean
+		animated?: boolean
+		showArrow?: boolean
 		open?: boolean
 		theme?: string
 		placement?: TooltipPlacement
@@ -51,7 +53,7 @@ const props = withDefaults(
 		content?: TooltipContent | null
 		panelClass?: string
 	}>(),
-	{ disabled: false, theme: 'tooltip', placement: 'top' },
+	{ disabled: false, animated: true, showArrow: true, theme: 'tooltip', placement: 'top' },
 )
 
 const slots = useSlots()
@@ -247,7 +249,7 @@ function onFocusOut(event: FocusEvent) {
 		<slot />
 	</div>
 	<Teleport v-if="hosted" :to="teleportTarget">
-		<Transition name="tooltip">
+		<Transition name="tooltip" :css="animated">
 			<div
 				v-if="isOpen"
 				:key="jumpKey"
@@ -259,6 +261,7 @@ function onFocusOut(event: FocusEvent) {
 				<TooltipSlot v-if="content" :render="content" />
 				<template v-else>{{ text }}</template>
 				<div
+					v-if="showArrow"
 					ref="arrowEl"
 					class="tooltip-arrow absolute size-2 border-b border-r border-0 border-solid border-surface-5 bg-surface-3"
 					:style="arrowStyles"

From 8bb40a54693e3ccdf87f560aa417476318afad74 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Mon, 19 Oct 2026 12:03:36 -0600
Subject: [PATCH 09/28] feat: add arrow for requested status

---
 .../project-info/project/title.vue            | 49 ++++++++++++++-----
 1 file changed, 38 insertions(+), 11 deletions(-)

diff --git a/apps/frontend/src/components/project-review/project-info/project/title.vue b/apps/frontend/src/components/project-review/project-info/project/title.vue
index eb3e34563b3..5a1d02772ed 100644
--- a/apps/frontend/src/components/project-review/project-info/project/title.vue
+++ b/apps/frontend/src/components/project-review/project-info/project/title.vue
@@ -37,20 +37,41 @@
 			</div>
 		</div>
 		<h1 v-else-if="project" class="m-0 flex min-w-0 items-center gap-2 text-xl">
-			<Tooltip class="flex shrink-0">
-				<template #popper>
-					<ProjectStatusBadge
-						:status="project.status"
+			<div class="flex shrink-0 items-center gap-0.5">
+				<Tooltip class="flex shrink-0">
+					<template #popper>
+						<ProjectStatusBadge
+							:status="project.status"
+							:style="{ color: `var(--color-${getProjectStatusColor(project.status)})` }"
+						/>
+					</template>
+					<component
+						:is="getProjectStatusIcon(project.status)"
+						class="size-4 shrink-0"
 						:style="{ color: `var(--color-${getProjectStatusColor(project.status)})` }"
+						aria-hidden="true"
 					/>
+				</Tooltip>
+				<template v-if="project.status === 'processing' && project.requested_status">
+					<RightArrowIcon class="size-4 shrink-0 text-secondary" aria-hidden="true" />
+					<Tooltip class="flex shrink-0">
+						<template #popper>
+							<ProjectStatusBadge
+								:status="project.requested_status"
+								:style="{
+									color: `var(--color-${getProjectStatusColor(project.requested_status)})`,
+								}"
+							/>
+						</template>
+						<component
+							:is="getProjectStatusIcon(project.requested_status)"
+							class="size-4 shrink-0"
+							:style="{ color: `var(--color-${getProjectStatusColor(project.requested_status)})` }"
+							aria-hidden="true"
+						/>
+					</Tooltip>
 				</template>
-				<component
-					:is="getProjectStatusIcon(project.status)"
-					class="size-4 shrink-0"
-					:style="{ color: `var(--color-${getProjectStatusColor(project.status)})` }"
-					aria-hidden="true"
-				/>
-			</Tooltip>
+			</div>
 			<NuxtLink
 				:to="projectUrl"
 				target="_blank"
@@ -64,6 +85,7 @@
 </template>
 
 <script setup lang="ts">
+import { RightArrowIcon } from '@modrinth/assets'
 import {
 	Button,
 	commonMessages,
@@ -102,4 +124,9 @@ const projectUrl = computed(
 	() =>
 		`/${projectV2.value?.project_type ?? project.value?.project_types[0]}/${project.value?.slug ?? project.value?.id}`,
 )
+const primaryStatus = computed(() =>
+	project.value?.status === 'processing' && project.value.requested_status
+		? project.value.requested_status
+		: (project.value?.status ?? 'unknown'),
+)
 </script>

From 125fc8b6605ef4592b93d54c41486eadaa20f712 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Mon, 19 Oct 2026 12:09:20 -0600
Subject: [PATCH 10/28] feat: add option to default collapse versions changelog
 and dependency

---
 .../project-review/versions/index.vue         | 11 +++++++++-
 .../project-review/versions/version-card.vue  | 19 +++++++++++------
 .../settings/ModerationSettings.vue           | 19 ++++++++++++++---
 packages/moderation/src/data/settings.ts      | 21 +++++++++++++++++++
 4 files changed, 60 insertions(+), 10 deletions(-)

diff --git a/apps/frontend/src/components/project-review/versions/index.vue b/apps/frontend/src/components/project-review/versions/index.vue
index 686ea73492a..8cc6cf85f3c 100644
--- a/apps/frontend/src/components/project-review/versions/index.vue
+++ b/apps/frontend/src/components/project-review/versions/index.vue
@@ -94,12 +94,14 @@
 
 <script setup lang="ts">
 import { ListChevronsDownUpIcon, ListChevronsUpDownIcon } from '@modrinth/assets'
+import { moderationSettings } from '@modrinth/moderation'
 import { Button, useVIntl } from '@modrinth/ui'
 import { useQueryClient } from '@tanstack/vue-query'
 import { computed, ref, useTemplateRef } from 'vue'
 
 import CreateProjectVersionModal from '~/components/ui/create-project-version/CreateProjectVersionModal.vue'
 import ProjectC2paScanModal from '~/components/ui/moderation/ProjectC2paScanModal.vue'
+import { useModerationSettings } from '~/composables/moderation'
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 import { injectReviewPanels } from '~/providers/project-review/review-panels'
 import type { ManageVersionHost } from '~/providers/version/manage-version-modal'
@@ -146,8 +148,15 @@ const editorHost = computed<ManageVersionHost | undefined>(() => {
 	}
 })
 const expanded = ref<Set<string> | null>(null)
+const settings = useModerationSettings()
 const expandedIds = computed(
-	() => expanded.value ?? new Set(versions.value[0] ? [versions.value[0].id] : []),
+	() =>
+		expanded.value ??
+		new Set(
+			settings.value.get(moderationSettings.General.ExpandVersionDetailsByDefault) && versions.value[0]
+				? [versions.value[0].id]
+				: [],
+		),
 )
 const fileCount = computed(() =>
 	versions.value.reduce((count, version) => count + version.files.length, 0),
diff --git a/apps/frontend/src/components/project-review/versions/version-card.vue b/apps/frontend/src/components/project-review/versions/version-card.vue
index 32dbd560991..519228230cb 100644
--- a/apps/frontend/src/components/project-review/versions/version-card.vue
+++ b/apps/frontend/src/components/project-review/versions/version-card.vue
@@ -181,7 +181,7 @@
 						<div ref="dependenciesSection" class="min-w-0">
 							<h3 class="sticky top-0 z-10 m-0 bg-surface-2 py-2 text-sm font-medium text-primary">
 								<button
-									v-if="version.dependencies.length > 6"
+									v-if="version.dependencies.length > 0"
 									type="button"
 									class="flex w-full cursor-pointer items-center gap-1 border-0 bg-transparent p-0 text-left text-sm font-medium text-primary hover:brightness-125"
 									:aria-expanded="dependenciesOpen"
@@ -207,11 +207,11 @@
 								:id="`review-version-dependencies-${version.id}`"
 								class="grid transition-[grid-template-rows] duration-150 ease-out motion-reduce:transition-none"
 								:class="
-									version.dependencies.length <= 6 || dependenciesOpen
+									!version.dependencies.length || dependenciesOpen
 										? 'grid-rows-[1fr]'
 										: 'grid-rows-[0fr]'
 								"
-								:inert="version.dependencies.length > 6 && !dependenciesOpen"
+								:inert="version.dependencies.length > 0 && !dependenciesOpen"
 							>
 								<div class="-mx-1 min-h-0 overflow-hidden px-1">
 									<Input
@@ -284,7 +284,9 @@
 						<Accordion
 							v-if="detailQuery.data.value?.changelog"
 							ref="changelogAccordion"
-							open-by-default
+							:open-by-default="
+								settings.get(moderationSettings.General.ExpandVersionChangelogByDefault)
+							"
 							button-class="sticky top-0 z-10 w-full cursor-pointer border-0 bg-surface-2 py-2 text-left text-sm font-medium hover:[&>div]:brightness-125 [&>div>svg]:ml-0 [&>div>svg]:size-4"
 						>
 							<template #title>
@@ -329,6 +331,7 @@ import {
 	SearchIcon,
 	SpinnerIcon,
 } from '@modrinth/assets'
+import { moderationSettings } from '@modrinth/moderation'
 import {
 	Accordion,
 	AutoLink,
@@ -362,6 +365,7 @@ import { useQuery } from '@tanstack/vue-query'
 import { computed, ref } from 'vue'
 
 import EditVersionMenu from '~/components/ui/create-project-version/EditVersionMenu.vue'
+import { useModerationSettings } from '~/composables/moderation'
 import { projectQueryOptions } from '~/composables/queries/project'
 import { versionQueryOptions } from '~/composables/queries/version'
 import { injectProjectReviewPageContext } from '~/providers/project-review'
@@ -402,7 +406,10 @@ const loadingSlicerButton = computed(() => {
 		? request.button
 		: undefined
 })
-const dependenciesOpen = ref(true)
+const settings = useModerationSettings()
+const dependenciesOpen = ref(
+	settings.value.get(moderationSettings.General.ExpandVersionDependenciesByDefault),
+)
 const dependencySearch = ref('')
 const card = ref<HTMLElement>()
 const dependenciesSection = ref<HTMLElement>()
@@ -421,7 +428,7 @@ useReviewInteraction({
 })
 useReviewInteraction({
 	element: () =>
-		props.expanded && props.version.dependencies.length > 6 ? dependenciesSection.value : null,
+		props.expanded && props.version.dependencies.length > 0 ? dependenciesSection.value : null,
 	collapse: () => {
 		dependenciesOpen.value = !dependenciesOpen.value
 	},
diff --git a/apps/frontend/src/components/ui/moderation/settings/ModerationSettings.vue b/apps/frontend/src/components/ui/moderation/settings/ModerationSettings.vue
index bd053341eea..7480314a5c0 100644
--- a/apps/frontend/src/components/ui/moderation/settings/ModerationSettings.vue
+++ b/apps/frontend/src/components/ui/moderation/settings/ModerationSettings.vue
@@ -33,9 +33,13 @@ const messages = defineMessages({
 		id: 'moderation.settings.workflow',
 		defaultMessage: 'Review workflow and queue',
 	},
+	panels: {
+		id: 'moderation.settings.panels',
+		defaultMessage: 'Panels',
+	},
 	appearance: {
 		id: 'moderation.settings.appearance',
-		defaultMessage: 'Panels and appearance',
+		defaultMessage: 'Appearance',
 	},
 	shortcuts: {
 		id: 'moderation.settings.shortcuts',
@@ -69,12 +73,21 @@ const groups = [
 		],
 	},
 	{
-		id: 'appearance',
-		title: messages.appearance,
+		id: 'panels',
+		title: messages.panels,
 		settings: [
 			general.LinkInfoPlacement,
 			general.ShowFloatingPanelFieldHoverHighlight,
 			general.ShowInlinePanelHoverHighlight,
+		],
+	},
+	{
+		id: 'appearance',
+		title: messages.appearance,
+		settings: [
+			general.ExpandVersionDetailsByDefault,
+			general.ExpandVersionDependenciesByDefault,
+			general.ExpandVersionChangelogByDefault,
 			general.EnableDelayedHoverMessagePreviews,
 			general.PrivateMessageHighlight,
 		],
diff --git a/packages/moderation/src/data/settings.ts b/packages/moderation/src/data/settings.ts
index fc1a18d2417..d35800f4066 100644
--- a/packages/moderation/src/data/settings.ts
+++ b/packages/moderation/src/data/settings.ts
@@ -79,6 +79,27 @@ const settings = {
 			description: 'Add a background highlight to private messages and issue history in threads.',
 			default: true,
 		}),
+		ExpandVersionDetailsByDefault: setting.asToggle({
+			type: 'toggle',
+			id: 'expand-version-details-by-default',
+			title: 'Expand version details by default',
+			description: 'Expand the latest version’s Details section automatically in project review.',
+			default: true,
+		}),
+		ExpandVersionDependenciesByDefault: setting.asToggle({
+			type: 'toggle',
+			id: 'expand-version-dependencies-by-default',
+			title: 'Expand version dependencies by default',
+			description: 'Expand dependencies automatically when viewing version details in project review.',
+			default: true,
+		}),
+		ExpandVersionChangelogByDefault: setting.asToggle({
+			type: 'toggle',
+			id: 'expand-version-changelog-by-default',
+			title: 'Expand version changelog by default',
+			description: 'Expand the changelog automatically when viewing version details in project review.',
+			default: true,
+		}),
 		SlicerButtonInVersions: setting.asToggle({
 			type: 'toggle',
 			id: 'slicer-button-in-versions',

From 16a92b16407a2ea7f003d4511e5d8b99de551900 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Mon, 19 Oct 2026 12:35:17 -0600
Subject: [PATCH 11/28] feat: add setting to always show all issue controls,
 adjust num columns in gallery

---
 .../project-review/gallery/index.vue          | 11 ++++++--
 .../src/components/project-review/index.vue   |  1 +
 .../project-info/project/title.vue            |  5 ----
 .../project-review/project-wide-checks.vue    |  3 +-
 .../project-review/versions/index.vue         |  3 +-
 .../settings/ModerationSettings.vue           | 12 +++++++-
 apps/frontend/src/locales/en-US/index.json    | 13 +++++++--
 .../providers/project-review/review-panels.ts | 21 ++++++++++----
 .../issues/component-builders/item-panels.ts  |  3 +-
 packages/moderation/src/data/keybinds.ts      |  2 +-
 packages/moderation/src/data/settings.ts      | 28 +++++++++++++++++--
 .../src/components/floating/FloatingMenu.vue  |  5 ++--
 12 files changed, 84 insertions(+), 23 deletions(-)

diff --git a/apps/frontend/src/components/project-review/gallery/index.vue b/apps/frontend/src/components/project-review/gallery/index.vue
index df30e8fe248..78f8d98e1e3 100644
--- a/apps/frontend/src/components/project-review/gallery/index.vue
+++ b/apps/frontend/src/components/project-review/gallery/index.vue
@@ -22,7 +22,11 @@
 			<p v-else-if="!gallery.length" class="m-0 text-secondary">
 				{{ formatMessage(messages.emptyGallery) }}
 			</p>
-			<div v-else class="gallery-grid">
+			<div
+				v-else
+				class="gallery-grid"
+				:style="{ gridTemplateColumns: `repeat(${galleryColumns}, minmax(0, 1fr))` }"
+			>
 				<ReviewPanel
 					v-for="(item, index) in gallery"
 					:key="item.id ?? item.url"
@@ -83,10 +87,12 @@
 
 <script setup lang="ts">
 import type { Labrinth } from '@modrinth/api-client'
+import { moderationSettings } from '@modrinth/moderation'
 import { galleryImageReviewKey } from '@modrinth/moderation/src/data/issues/component-builders/gallery-images'
 import { Button, ImageViewerEditor, useFormatDateTime, useVIntl } from '@modrinth/ui'
 import { computed, ref, useTemplateRef } from 'vue'
 
+import { useModerationSettings } from '~/composables/moderation'
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 import { injectReviewSubmission } from '~/providers/project-review/review-submission'
 
@@ -95,6 +101,8 @@ import { projectReviewMessages as messages } from '../messages'
 import ReviewPanel from '../review-panel/index.vue'
 
 const { formatMessage } = useVIntl()
+const settings = useModerationSettings()
+const galleryColumns = computed(() => settings.value.get(moderationSettings.General.GalleryColumns))
 const interactionScope = useTemplateRef<HTMLElement>('interactionScope')
 const formatDateTime = useFormatDateTime({
 	dateStyle: 'long',
@@ -120,7 +128,6 @@ const viewerItems = computed(() =>
 <style scoped>
 .gallery-grid {
 	display: grid;
-	grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
 	gap: 1rem;
 }
 </style>
diff --git a/apps/frontend/src/components/project-review/index.vue b/apps/frontend/src/components/project-review/index.vue
index a680bdd3e3d..ccc5fe80d9a 100644
--- a/apps/frontend/src/components/project-review/index.vue
+++ b/apps/frontend/src/components/project-review/index.vue
@@ -209,6 +209,7 @@ const panels = provideReviewPanels(
 			sendIssuesAsThreadMessage: settings.value.get(
 				moderationSettings.General.SendIssuesAsThreadMessage,
 			),
+			showAllIssueControls: settings.value.get(moderationSettings.General.ShowAllIssueControls),
 			permissions: permissions.value,
 			previousIssueIds: (project.value?.thread_id === threadQuery.data.value?.id
 				? (threadQuery.data.value?.issues ?? [])
diff --git a/apps/frontend/src/components/project-review/project-info/project/title.vue b/apps/frontend/src/components/project-review/project-info/project/title.vue
index 5a1d02772ed..91be02b0e0e 100644
--- a/apps/frontend/src/components/project-review/project-info/project/title.vue
+++ b/apps/frontend/src/components/project-review/project-info/project/title.vue
@@ -124,9 +124,4 @@ const projectUrl = computed(
 	() =>
 		`/${projectV2.value?.project_type ?? project.value?.project_types[0]}/${project.value?.slug ?? project.value?.id}`,
 )
-const primaryStatus = computed(() =>
-	project.value?.status === 'processing' && project.value.requested_status
-		? project.value.requested_status
-		: (project.value?.status ?? 'unknown'),
-)
 </script>
diff --git a/apps/frontend/src/components/project-review/project-wide-checks.vue b/apps/frontend/src/components/project-review/project-wide-checks.vue
index d2d5bfcd89f..f782ffb58d3 100644
--- a/apps/frontend/src/components/project-review/project-wide-checks.vue
+++ b/apps/frontend/src/components/project-review/project-wide-checks.vue
@@ -133,7 +133,8 @@ useReviewShortcut(
 	'cycle-misc',
 	() => {
 		const targets = visibleTargets.value
-		const currentIndex = selectedTarget.value === undefined ? -1 : targets.indexOf(selectedTarget.value)
+		const currentIndex =
+			selectedTarget.value === undefined ? -1 : targets.indexOf(selectedTarget.value)
 		selectedTarget.value = targets[(currentIndex + 1) % targets.length]
 		shortcuts.run('reveal-right')
 	},
diff --git a/apps/frontend/src/components/project-review/versions/index.vue b/apps/frontend/src/components/project-review/versions/index.vue
index 8cc6cf85f3c..5c7fb48af60 100644
--- a/apps/frontend/src/components/project-review/versions/index.vue
+++ b/apps/frontend/src/components/project-review/versions/index.vue
@@ -153,7 +153,8 @@ const expandedIds = computed(
 	() =>
 		expanded.value ??
 		new Set(
-			settings.value.get(moderationSettings.General.ExpandVersionDetailsByDefault) && versions.value[0]
+			settings.value.get(moderationSettings.General.ExpandVersionDetailsByDefault) &&
+				versions.value[0]
 				? [versions.value[0].id]
 				: [],
 		),
diff --git a/apps/frontend/src/components/ui/moderation/settings/ModerationSettings.vue b/apps/frontend/src/components/ui/moderation/settings/ModerationSettings.vue
index 7480314a5c0..bce70605b14 100644
--- a/apps/frontend/src/components/ui/moderation/settings/ModerationSettings.vue
+++ b/apps/frontend/src/components/ui/moderation/settings/ModerationSettings.vue
@@ -47,7 +47,11 @@ const messages = defineMessages({
 	},
 	projectPages: {
 		id: 'moderation.settings.project-pages',
-		defaultMessage: 'Public project pages and hosts',
+		defaultMessage: 'Public pages and hosts',
+	},
+	debug: {
+		id: 'moderation.settings.debug',
+		defaultMessage: 'Debug settings',
 	},
 	defaultValue: {
 		id: 'moderation.settings.default-value-styled',
@@ -85,6 +89,7 @@ const groups = [
 		id: 'appearance',
 		title: messages.appearance,
 		settings: [
+			general.GalleryColumns,
 			general.ExpandVersionDetailsByDefault,
 			general.ExpandVersionDependenciesByDefault,
 			general.ExpandVersionChangelogByDefault,
@@ -110,6 +115,11 @@ const groups = [
 			general.AlternativeHostname,
 		],
 	},
+	{
+		id: 'debug',
+		title: messages.debug,
+		settings: [general.ShowAllIssueControls],
+	},
 ]
 
 const filteredGroups = computed(() => {
diff --git a/apps/frontend/src/locales/en-US/index.json b/apps/frontend/src/locales/en-US/index.json
index 3c0bd47bfbd..8845ee73d63 100644
--- a/apps/frontend/src/locales/en-US/index.json
+++ b/apps/frontend/src/locales/en-US/index.json
@@ -3107,6 +3107,9 @@
   "moderation.keybinds.not-bound": {
     "message": "Not bound"
   },
+  "moderation.keybinds.panel-toggles": {
+    "message": "Panel toggles"
+  },
   "moderation.keybinds.project": {
     "message": "Copy from public project pages"
   },
@@ -4035,11 +4038,14 @@
     "message": "{count} withheld"
   },
   "moderation.settings.appearance": {
-    "message": "Panels and appearance"
+    "message": "Appearance"
   },
   "moderation.settings.based-on": {
     "message": "Based on"
   },
+  "moderation.settings.debug": {
+    "message": "Debug settings"
+  },
   "moderation.settings.default-value-styled": {
     "message": "Default: <value></value>"
   },
@@ -4058,8 +4064,11 @@
   "moderation.settings.on": {
     "message": "On"
   },
+  "moderation.settings.panels": {
+    "message": "Panels"
+  },
   "moderation.settings.project-pages": {
-    "message": "Public project pages and hosts"
+    "message": "Public pages and hosts"
   },
   "moderation.settings.search": {
     "message": "Search settings…"
diff --git a/apps/frontend/src/providers/project-review/review-panels.ts b/apps/frontend/src/providers/project-review/review-panels.ts
index 9f5591088cc..dfff90806b1 100644
--- a/apps/frontend/src/providers/project-review/review-panels.ts
+++ b/apps/frontend/src/providers/project-review/review-panels.ts
@@ -182,6 +182,7 @@ export function createReviewPanels(
 		> & {
 			previousLinks: ReadonlyMap<string, string>
 			previousIssueIds?: readonly string[]
+			showAllIssueControls?: boolean
 		}
 	>,
 	definitions: Record<string, PanelRegistration> = reviewPanels,
@@ -323,6 +324,7 @@ export function createReviewPanels(
 		const bindings = new Map<string, ReviewPanelBinding>()
 		const projectV3 = project.value
 		if (!projectV3) return bindings
+		const showAllIssueControls = reviewData.value.showAllIssueControls === true
 		const context: ReviewContext = {
 			projectV3,
 			...reviewData.value,
@@ -348,11 +350,16 @@ export function createReviewPanels(
 			panels: itemDefinitions,
 			parents: itemParents,
 			issues: itemIssues,
-		} = expandItemReviewPanels(definitions, context)
+		} = expandItemReviewPanels(definitions, context, showAllIssueControls)
 		for (const [key, panel] of Object.entries(itemDefinitions)) {
 			const previousLink =
 				key.endsWith('-link') && reviewData.value.previousLinks.has(key.slice(0, -'-link'.length))
-			if (resolveWithContext(panel.shown, context) === false && !previousLink) continue
+			if (
+				!showAllIssueControls &&
+				resolveWithContext(panel.shown, context) === false &&
+				!previousLink
+			)
+				continue
 			const resolveNodes = (
 				nodes: readonly PanelNode[],
 				label?: string,
@@ -368,7 +375,7 @@ export function createReviewPanels(
 
 				for (const node of nodes) {
 					if (node.type === 'section') {
-						if (resolveWithContext(node.shown, context) === false) continue
+						if (!showAllIssueControls && resolveWithContext(node.shown, context) === false) continue
 						flush()
 						sections.push(...resolveNodes(node.children, resolveWithContext(node.label, context)))
 						continue
@@ -392,7 +399,8 @@ export function createReviewPanels(
 								: context.selected.toggleIds,
 						},
 					}
-					if (resolveWithContext(node.shown, issueContext) === false) continue
+					if (!showAllIssueControls && resolveWithContext(node.shown, issueContext) === false)
+						continue
 					const options: ResolvedIssueControlOptions = {
 						disabled: resolveWithContext(node.disabled, issueContext) === true,
 						issue,
@@ -421,7 +429,10 @@ export function createReviewPanels(
 							initial: typeof initial === 'string' ? [initial] : [...(initial ?? [])],
 							placeholder: resolveWithContext(node.placeholder, issueContext),
 							options: resolveWithContext(node.options, issueContext)
-								.filter((option) => resolveWithContext(option.shown, issueContext) !== false)
+								.filter(
+									(option) =>
+										showAllIssueControls || resolveWithContext(option.shown, issueContext) !== false,
+								)
 								.map((option) => ({
 									value: option.value,
 									label: resolveWithContext(option.label, issueContext),
diff --git a/packages/moderation/src/data/issues/component-builders/item-panels.ts b/packages/moderation/src/data/issues/component-builders/item-panels.ts
index aa815d1c15d..fce4b7811ae 100644
--- a/packages/moderation/src/data/issues/component-builders/item-panels.ts
+++ b/packages/moderation/src/data/issues/component-builders/item-panels.ts
@@ -48,6 +48,7 @@ function itemContext(
 export function expandItemReviewPanels(
 	definitions: Record<string, PanelRegistration>,
 	context: ReviewContext,
+	showAllIssueControls = false,
 ) {
 	const panels: Record<string, Panel> = {}
 	const parents = new Map<string, string>()
@@ -72,7 +73,7 @@ export function expandItemReviewPanels(
 			continue
 		}
 		for (const item of definition.items(context)) {
-			if (resolve(item.panel.shown, context) === false) continue
+			if (!showAllIssueControls && resolve(item.panel.shown, context) === false) continue
 			const itemKey = `${key}:${item.key}`
 			if (items.has(itemKey)) throw new Error(`Duplicate review panel "${itemKey}"`)
 			items.set(itemKey, item)
diff --git a/packages/moderation/src/data/keybinds.ts b/packages/moderation/src/data/keybinds.ts
index f89aa4b2acd..a27ed658ded 100644
--- a/packages/moderation/src/data/keybinds.ts
+++ b/packages/moderation/src/data/keybinds.ts
@@ -240,7 +240,7 @@ const keybinds: { [id: string]: KeybindListener } = {
 	},
 	'skip-project': {
 		keybind: 'Ctrl+Shift+S',
-		description: 'Skip to next project',
+		description: 'Skip/next project',
 		scope: 'review-actions',
 		enabled: (ctx) => ctx.available('next'),
 		action: (ctx) => ctx.run('next'),
diff --git a/packages/moderation/src/data/settings.ts b/packages/moderation/src/data/settings.ts
index d35800f4066..9060501c8a0 100644
--- a/packages/moderation/src/data/settings.ts
+++ b/packages/moderation/src/data/settings.ts
@@ -2,6 +2,28 @@ import { setting } from '../types/settings.ts'
 
 const settings = {
 	General: {
+		GalleryColumns: setting.asEnum({
+			type: 'enum',
+			id: 'gallery-columns',
+			title: 'Gallery columns',
+			description: 'Number of gallery columns to display in project review, regardless of panel width.',
+			default: '3',
+			entries: [
+				{ label: '1', value: '1' },
+				{ label: '2', value: '2' },
+				{ label: '3', value: '3' },
+				{ label: '4', value: '4' },
+				{ label: '5', value: '5' },
+				{ label: '6', value: '6' },
+			],
+		}),
+		ShowAllIssueControls: setting.asToggle({
+			type: 'toggle',
+			id: 'show-all-issue-controls',
+			title: 'Always show issue controls',
+			description: 'Show all issue controls in the issues menu regardless of visibility conditions.',
+			default: false,
+		}),
 		SendIssuesAsThreadMessage: setting.asToggle({
 			type: 'toggle',
 			id: 'send-issues-as-thread-message',
@@ -90,14 +112,16 @@ const settings = {
 			type: 'toggle',
 			id: 'expand-version-dependencies-by-default',
 			title: 'Expand version dependencies by default',
-			description: 'Expand dependencies automatically when viewing version details in project review.',
+			description:
+				'Expand dependencies automatically when viewing version details in project review.',
 			default: true,
 		}),
 		ExpandVersionChangelogByDefault: setting.asToggle({
 			type: 'toggle',
 			id: 'expand-version-changelog-by-default',
 			title: 'Expand version changelog by default',
-			description: 'Expand the changelog automatically when viewing version details in project review.',
+			description:
+				'Expand the changelog automatically when viewing version details in project review.',
 			default: true,
 		}),
 		SlicerButtonInVersions: setting.asToggle({
diff --git a/packages/ui/src/components/floating/FloatingMenu.vue b/packages/ui/src/components/floating/FloatingMenu.vue
index 3ac75274e3b..ba573618da0 100644
--- a/packages/ui/src/components/floating/FloatingMenu.vue
+++ b/packages/ui/src/components/floating/FloatingMenu.vue
@@ -2,7 +2,7 @@
 import {
 	arrow as floatingArrow,
 	autoUpdate,
-	flip,
+	flip as floatingFlip,
 	offset,
 	type Placement,
 	shift,
@@ -41,6 +41,7 @@ const props = withDefaults(
 		disabled: false,
 		bare: false,
 		arrow: true,
+		panelClass: undefined,
 	},
 )
 
@@ -78,7 +79,7 @@ const { floatingStyles, middlewareData, placement, x, y, isPositioned } = useFlo
 		open: isOpen,
 		middleware: computed(() => [
 			offset(() => props.distance),
-			...(props.flip ? [flip()] : []),
+			...(props.flip ? [floatingFlip()] : []),
 			shift({ padding: 8 }),
 			floatingArrow({ element: arrowEl, padding: 12 }),
 		]),

From c872fb866cf0e3ebf8f8a0733eca50968dcb0c50 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Mon, 19 Oct 2026 12:50:48 -0600
Subject: [PATCH 12/28] polish: gallery card

---
 .../project-review/gallery/index.vue          | 42 +++++++++++--------
 1 file changed, 24 insertions(+), 18 deletions(-)

diff --git a/apps/frontend/src/components/project-review/gallery/index.vue b/apps/frontend/src/components/project-review/gallery/index.vue
index 78f8d98e1e3..90332a4ad43 100644
--- a/apps/frontend/src/components/project-review/gallery/index.vue
+++ b/apps/frontend/src/components/project-review/gallery/index.vue
@@ -49,24 +49,28 @@
 							loading="lazy"
 						/>
 					</button>
-					<div class="flex flex-1 flex-col gap-2 p-3">
-						<div class="flex flex-wrap justify-between gap-2 text-sm text-secondary">
-							<span>{{ formatMessage(messages.imageNumber, { number: index + 1 }) }}</span>
-							<span v-if="item.featured" class="text-brand">{{
-								formatMessage(messages.featured)
-							}}</span>
+					<div class="flex flex-1 flex-col gap-1.5 p-3">
+						<div class="flex flex-wrap items-center gap-2">
+							<h3 class="m-0 min-w-0 flex-1 break-words text-lg font-semibold text-contrast">
+								{{ item.name || formatMessage(messages.imageNumber, { number: index + 1 }) }}
+							</h3>
+							<TagItem
+								v-if="item.featured"
+								class="-my-0.5 !border-brand !bg-transparent !text-brand opacity-90"
+							>
+								{{ formatMessage(messages.featured) }}
+							</TagItem>
 						</div>
-						<h3 v-if="item.name" class="m-0 break-words text-lg font-semibold text-contrast">
-							{{ item.name }}
-						</h3>
 						<p v-if="item.description" class="m-0 whitespace-pre-wrap break-words">
 							{{ item.description }}
 						</p>
-						<time :datetime="item.created" class="mt-auto pt-2 text-sm text-secondary">{{
-							formatMessage(messages.uploaded, {
-								date: formatDateTime(item.created),
-							})
-						}}</time>
+						<time
+							:datetime="item.created"
+							class="mt-auto flex items-center gap-1 pt-1 text-sm text-secondary"
+						>
+							<CalendarIcon aria-hidden="true" class="h-4 w-4 shrink-0" />
+							{{ formatDate(item.created) }}
+						</time>
 					</div>
 				</ReviewPanel>
 			</div>
@@ -87,9 +91,10 @@
 
 <script setup lang="ts">
 import type { Labrinth } from '@modrinth/api-client'
+import { CalendarIcon } from '@modrinth/assets'
 import { moderationSettings } from '@modrinth/moderation'
 import { galleryImageReviewKey } from '@modrinth/moderation/src/data/issues/component-builders/gallery-images'
-import { Button, ImageViewerEditor, useFormatDateTime, useVIntl } from '@modrinth/ui'
+import { Button, ImageViewerEditor, TagItem, useFormatDateTime, useVIntl } from '@modrinth/ui'
 import { computed, ref, useTemplateRef } from 'vue'
 
 import { useModerationSettings } from '~/composables/moderation'
@@ -104,9 +109,10 @@ const { formatMessage } = useVIntl()
 const settings = useModerationSettings()
 const galleryColumns = computed(() => settings.value.get(moderationSettings.General.GalleryColumns))
 const interactionScope = useTemplateRef<HTMLElement>('interactionScope')
-const formatDateTime = useFormatDateTime({
-	dateStyle: 'long',
-	timeStyle: 'short',
+const formatDate = useFormatDateTime({
+	year: 'numeric',
+	month: 'long',
+	day: 'numeric',
 })
 const { selection, projectId, gallery, isLoading, error, refresh, pixelated } =
 	injectProjectReviewPageContext()

From a99746985c378cdffa8dc6619a66a342bc2789bd Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Mon, 19 Oct 2026 13:02:18 -0600
Subject: [PATCH 13/28] fix: when tooltip/panel is showing via focus, hover in
 and out again can dismiss it

---
 .../project-review/link-info/tooltip.vue      | 23 ++++++++--
 .../project-review/review-panel/context.ts    | 46 +++++++++++++++----
 .../project-review/review-panel/index.vue     |  4 ++
 .../project-review/review-panel/popover.vue   | 15 +++++-
 4 files changed, 71 insertions(+), 17 deletions(-)

diff --git a/apps/frontend/src/components/project-review/link-info/tooltip.vue b/apps/frontend/src/components/project-review/link-info/tooltip.vue
index 7d4da0a941e..529cfd864d4 100644
--- a/apps/frontend/src/components/project-review/link-info/tooltip.vue
+++ b/apps/frontend/src/components/project-review/link-info/tooltip.vue
@@ -6,7 +6,7 @@
 		@pointerleave="leaveLink"
 		@pointerover.stop
 		@pointermove.stop
-		@focusin="show"
+		@focusin="enterFocus"
 		@focusout="leaveFocus"
 	>
 		<slot :tooltip-id="open ? tooltipId : undefined" />
@@ -18,11 +18,11 @@
 			role="tooltip"
 			:style="floatingStyles"
 			class="z-[101] box-border w-96 max-w-[calc(100vw-1rem)] overflow-y-auto rounded-xl border border-solid border-surface-5 bg-surface-2 shadow-lg"
-			@pointerenter="cancelClose"
+			@pointerenter="enterPanel"
 			@pointerleave="scheduleClose"
 			@pointerover.stop
 			@pointermove.stop
-			@focusin="cancelClose"
+			@focusin="enterFocus"
 			@focusout="leaveFocus"
 		>
 			<LinkInfo :url="url" :enabled="hovered" :validation-messages="validationMessages" />
@@ -50,6 +50,7 @@ const hovered = ref(false)
 const tooltipId = useId()
 let openTimer: ReturnType<typeof setTimeout> | undefined
 let closeTimer: ReturnType<typeof setTimeout> | undefined
+let hoveredSinceFocus = false
 
 const { floatingStyles } = useFloating(anchor, panel, {
 	placement: computed(() =>
@@ -85,11 +86,17 @@ function enterLink(event: PointerEvent) {
 	if (event.pointerType === 'touch') return
 	hovered.value = true
 	emit('hover', true)
-	cancelClose()
+	enterPanel(event)
 	clearTimeout(openTimer)
 	openTimer = setTimeout(show, 200)
 }
 
+function enterPanel(event: PointerEvent) {
+	if (event.pointerType === 'touch') return
+	hoveredSinceFocus = true
+	cancelClose()
+}
+
 function leaveLink() {
 	hovered.value = false
 	emit('hover', false)
@@ -106,10 +113,15 @@ function leaveFocus(event: FocusEvent) {
 	if (!contains(event.relatedTarget)) scheduleClose()
 }
 
+function enterFocus() {
+	hoveredSinceFocus = false
+	show()
+}
+
 function scheduleClose() {
 	cancelClose()
 	closeTimer = setTimeout(() => {
-		if (contains(anchor.value?.ownerDocument.activeElement ?? null)) return
+		if (!hoveredSinceFocus && contains(anchor.value?.ownerDocument.activeElement ?? null)) return
 		close()
 	}, 200)
 }
@@ -119,6 +131,7 @@ function close() {
 	cancelClose()
 	open.value = false
 	hovered.value = false
+	hoveredSinceFocus = false
 	emit('hover', false)
 }
 
diff --git a/apps/frontend/src/components/project-review/review-panel/context.ts b/apps/frontend/src/components/project-review/review-panel/context.ts
index 881d0994fff..28ddf35383f 100644
--- a/apps/frontend/src/components/project-review/review-panel/context.ts
+++ b/apps/frontend/src/components/project-review/review-panel/context.ts
@@ -113,6 +113,8 @@ export function createReviewContext(
 	const panel = shallowRef<HTMLElement | null>(null)
 	const pinned = ref(false)
 	const revealedPanelId = ref<string>()
+	const externalLinkPanelId = ref<string>()
+	let externalLinkPanelEntered = false
 	const popoverHovered = ref(false)
 	const heldTab = shallowRef<ProjectReviewTab>()
 	const shortcutTab = shallowRef<ProjectReviewTab>()
@@ -154,6 +156,12 @@ export function createReviewContext(
 		const availablePanels = availableInlinePanels.value
 		const tab = heldTab.value ?? shortcutTab.value
 		if (tab) return availablePanels.find((panel) => panel.target().kind === tab)?.id
+		if (
+			externalLinkPanelId.value &&
+			(activeAnchor.value?.id === externalLinkPanelId.value ||
+				availablePanels.some((panel) => panel.id === externalLinkPanelId.value))
+		)
+			return externalLinkPanelId.value
 		if (activeAnchor.value && popoverHovered.value) return activeAnchor.value.id
 		const hovered = availablePanels.find((panel) => panel.id === hoverZones.value.hovered)
 		if (revealedPanelId.value && !pinned.value) {
@@ -266,6 +274,20 @@ export function createReviewContext(
 
 	function enter(id: string) {
 		if (revealedPanelId.value === id) revealedPanelEntered.value = true
+		if (externalLinkPanelId.value === id) externalLinkPanelEntered = true
+		cancelClose()
+	}
+
+	function retainExternalLink(id: string, event: MouseEvent) {
+		const target = event.target
+		if (
+			event.defaultPrevented ||
+			!(target instanceof Element) ||
+			!target.closest('a[href][target="_blank"]')
+		)
+			return
+		externalLinkPanelId.value = id
+		externalLinkPanelEntered = false
 		cancelClose()
 	}
 
@@ -309,12 +331,15 @@ export function createReviewContext(
 		popoverHovered.value = false
 		revealedPanelId.value = undefined
 		revealedPanelEntered.value = false
+		externalLinkPanelId.value = undefined
+		externalLinkPanelEntered = false
 		openDropdowns.value = 0
 		pinned.value = false
 	}
 
 	function open(anchor: ReviewAnchor) {
 		if (heldTab.value || shortcutTab.value) return
+		if (externalLinkPanelId.value && anchor.id !== externalLinkPanelId.value) return
 		if (revealedPanelId.value && !revealedPanelEntered.value && anchor.id !== revealedPanelId.value)
 			return
 		if (pendingAnchor.value?.id === anchor.id) return
@@ -349,11 +374,12 @@ export function createReviewContext(
 			pendingAnchor.value = undefined
 		}
 		if (revealedPanelId.value === id && !revealedPanelEntered.value) return
+		if (externalLinkPanelId.value === id && !externalLinkPanelEntered) return
 		const inline = inlinePanels.get(id)?.panel
-		if (inline && revealedPanelId.value === id) {
+		if (inline && (revealedPanelId.value === id || externalLinkPanelId.value === id)) {
 			cancelClose()
 			closeTimer = setTimeout(() => {
-				if (revealedPanelId.value !== id) return
+				if (revealedPanelId.value !== id && externalLinkPanelId.value !== id) return
 				if (inline.hovered() || inline.scopeHovered() || inline.dropdownOpen()) return
 				close()
 			}, CLOSE_DELAY)
@@ -364,7 +390,7 @@ export function createReviewContext(
 		closeTimer = setTimeout(() => {
 			if (active.value?.id !== id) return
 			if (pinned.value || openDropdowns.value > 0) return
-			const preserveFocus = revealedPanelId.value !== id
+			const preserveFocus = revealedPanelId.value !== id && externalLinkPanelId.value !== id
 			if (
 				active.value.element.matches(':hover') ||
 				(preserveFocus && hasVisibleFocus(active.value.element)) ||
@@ -436,7 +462,7 @@ export function createReviewContext(
 	)
 	watch(
 		() => {
-			const id = revealedPanelId.value
+			const id = externalLinkPanelId.value ?? revealedPanelId.value
 			const inline = id ? inlinePanels.get(id)?.panel : undefined
 			return {
 				id,
@@ -457,9 +483,9 @@ export function createReviewContext(
 		{ flush: 'sync' },
 	)
 	watch(
-		[revealedPanelId, activePanelId],
-		([revealed, active]) => {
-			if (revealed && revealed !== active) close()
+		[revealedPanelId, externalLinkPanelId, activePanelId],
+		([revealed, external, active]) => {
+			if ((revealed && revealed !== active) || (external && external !== active)) close()
 		},
 		{ flush: 'post' },
 	)
@@ -474,9 +500,8 @@ export function createReviewContext(
 		'pointerdown',
 		(event) => {
 			shortcutTab.value = undefined
-			const inline = revealedPanelId.value
-				? inlinePanels.get(revealedPanelId.value)?.panel
-				: undefined
+			const retainedId = externalLinkPanelId.value ?? revealedPanelId.value
+			const inline = retainedId ? inlinePanels.get(retainedId)?.panel : undefined
 			if (
 				inline &&
 				event.target instanceof Node &&
@@ -524,6 +549,7 @@ export function createReviewContext(
 		release,
 		leave,
 		enter,
+		retainExternalLink,
 		setPopoverHovered,
 		cancelClose,
 		setDropdownOpen,
diff --git a/apps/frontend/src/components/project-review/review-panel/index.vue b/apps/frontend/src/components/project-review/review-panel/index.vue
index 3203c186be5..d28dafd5a3c 100644
--- a/apps/frontend/src/components/project-review/review-panel/index.vue
+++ b/apps/frontend/src/components/project-review/review-panel/index.vue
@@ -8,6 +8,7 @@
 		:as="as"
 		:disabled="disabled"
 		:show-finding-badge="showFindingBadge"
+		@click="reviewContext.retainExternalLink(id, $event)"
 	>
 		<slot />
 		<Popover
@@ -64,6 +65,9 @@
 		class="box-border flex w-full flex-col gap-2.5 text-sm text-primary transition-opacity duration-150"
 		:class="inlineActive ? 'opacity-100' : 'opacity-50'"
 		:style="{ maxWidth }"
+		@pointerenter="reviewContext.enter(id)"
+		@pointerleave="reviewContext.leave(id)"
+		@click="reviewContext.retainExternalLink(id, $event)"
 	>
 		<Highlight
 			:active="inlineActive"
diff --git a/apps/frontend/src/components/project-review/review-panel/popover.vue b/apps/frontend/src/components/project-review/review-panel/popover.vue
index c1bf44dd220..00278498ce2 100644
--- a/apps/frontend/src/components/project-review/review-panel/popover.vue
+++ b/apps/frontend/src/components/project-review/review-panel/popover.vue
@@ -15,6 +15,7 @@
 			@focusin="cancelClose"
 			@focusout="leave(anchor.id)"
 			@keydown="onKeydown"
+			@click="retainExternalLink(anchor.id, $event)"
 		>
 			<div class="flex items-center justify-between gap-3">
 				<slot name="title" />
@@ -64,8 +65,18 @@ const props = defineProps<{
 	label?: string
 	maxWidth?: string
 }>()
-const { active, panel, panelId, pinned, close, leave, setPopoverHovered, cancelClose, contains } =
-	injectReviewContext()
+const {
+	active,
+	panel,
+	panelId,
+	pinned,
+	close,
+	leave,
+	setPopoverHovered,
+	cancelClose,
+	contains,
+	retainExternalLink,
+} = injectReviewContext()
 const element = shallowRef<HTMLElement | null>(null)
 const reference = computed(() => props.anchor.element)
 const { floatingStyles, isPositioned } = useFloating(reference, element, {

From d3a8f04270d2a871f62761c735d6a724cd62d9a2 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Mon, 19 Oct 2026 13:27:05 -0600
Subject: [PATCH 14/28] polish: thread message sent time styles

---
 .../project-review/message-thread/index.vue   |  2 +-
 .../components/ui/thread/ThreadMessage.vue    | 33 ++++++++++++-------
 2 files changed, 23 insertions(+), 12 deletions(-)

diff --git a/apps/frontend/src/components/project-review/message-thread/index.vue b/apps/frontend/src/components/project-review/message-thread/index.vue
index 8773da46734..bae23ae1d64 100644
--- a/apps/frontend/src/components/project-review/message-thread/index.vue
+++ b/apps/frontend/src/components/project-review/message-thread/index.vue
@@ -15,7 +15,7 @@
 						:auth="auth"
 						raised
 						image-previews
-						message-class="shrink-0 !px-2 !py-2 text-xs"
+						message-class="shrink-0 !px-2 !py-2 !text-xs [&_.message\_\_date]:!text-xs"
 						@update-thread="() => refetch()"
 						@open-image="openImage"
 					/>
diff --git a/apps/frontend/src/components/ui/thread/ThreadMessage.vue b/apps/frontend/src/components/ui/thread/ThreadMessage.vue
index 612927b0bd7..281c6afdd78 100644
--- a/apps/frontend/src/components/ui/thread/ThreadMessage.vue
+++ b/apps/frontend/src/components/ui/thread/ThreadMessage.vue
@@ -29,7 +29,7 @@
 			<Avatar v-else-if="isAutoApproval" size="2rem" circle :raised="raised" />
 			<ThreadRoleBadge v-else role="moderator" avatar />
 		</div>
-		<div class="message__content min-w-0">
+		<div class="message__content mt-1.5 min-w-0">
 			<template v-if="author">
 				<span
 					class="message__author min-w-0 max-w-full font-bold"
@@ -84,6 +84,13 @@
 					<ThreadRoleBadge v-if="!isAutoApproval" role="moderator" />
 				</span>
 			</template>
+			<span
+				v-if="hasBody"
+				v-tooltip="formatDateTime(message.created)"
+				class="message__date relative bottom-px ms-1.5 text-sm text-secondary opacity-80"
+			>
+				{{ timeSincePosted }}
+			</span>
 			<div
 				v-if="message.body.type === 'text'"
 				v-image-previews="imagePreviews ? formatMessage(imageMessages.openImage) : null"
@@ -179,16 +186,19 @@
 					{{ formatMessage(imageMessages.techReviewExitFileDeleted) }}
 				</span>
 			</div>
-			<div class="mt-1 flex items-center gap-2">
-				<span class="message__date block text-xs text-secondary">
-					<span v-tooltip="formatDateTime(message.created)">
-						{{ timeSincePosted }}
-					</span>
-				</span>
+			<span
+				v-if="!hasBody"
+				v-tooltip="formatDateTime(message.created)"
+				class="message__date relative bottom-px ms-1.5 text-sm text-secondary opacity-80"
+			>
+				{{ timeSincePosted }}
+			</span>
+			<div
+				v-if="isStaff(auth.user) && message.author_id === auth.user.id && !noLinks"
+				class="mt-1 flex items-center gap-2"
+			>
 				<div
-					v-if="isStaff(auth.user) && message.author_id === auth.user.id"
 					class="message__actions ml-auto group-focus-within/thread:opacity-100 group-hover/thread:opacity-100 [@media(hover:hover)]:opacity-0"
-					:class="{ hidden: noLinks }"
 				>
 					<TeleportOverflowMenu
 						type="quiet"
@@ -285,8 +295,9 @@ const props = defineProps({
 })
 
 const hasBody = computed(() => props.message.body.type === 'text' && !props.forceCompact)
-const authorClasses = 'inline [&>svg]:ms-1 [&>svg]:me-1 [&>svg]:inline-block [&>svg]:align-middle'
-const bodyClasses = computed(() => (hasBody.value ? 'mt-1' : 'ms-1 inline'))
+const authorClasses =
+	'inline [&>svg]:ms-1 [&>svg]:me-1 [&>svg]:inline-block [&>svg]:align-middle mr-1'
+const bodyClasses = computed(() => (hasBody.value ? 'mt-1' : 'inline'))
 
 const emit = defineEmits(['update-thread', 'open-image'])
 const settings = useModerationSettings()

From d58ae9f853c6ea7bf698d8fcd0be4530e9e0a197 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Mon, 19 Oct 2026 13:27:45 -0600
Subject: [PATCH 15/28] polish

---
 apps/frontend/src/components/ui/thread/ThreadMessage.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/frontend/src/components/ui/thread/ThreadMessage.vue b/apps/frontend/src/components/ui/thread/ThreadMessage.vue
index 281c6afdd78..7662c48d11d 100644
--- a/apps/frontend/src/components/ui/thread/ThreadMessage.vue
+++ b/apps/frontend/src/components/ui/thread/ThreadMessage.vue
@@ -87,7 +87,7 @@
 			<span
 				v-if="hasBody"
 				v-tooltip="formatDateTime(message.created)"
-				class="message__date relative bottom-px ms-1.5 text-sm text-secondary opacity-80"
+				class="message__date ms-1.5 text-sm text-secondary opacity-80"
 			>
 				{{ timeSincePosted }}
 			</span>
@@ -189,7 +189,7 @@
 			<span
 				v-if="!hasBody"
 				v-tooltip="formatDateTime(message.created)"
-				class="message__date relative bottom-px ms-1.5 text-sm text-secondary opacity-80"
+				class="message__date ms-1.5 text-sm text-secondary opacity-80"
 			>
 				{{ timeSincePosted }}
 			</span>

From e0fa10eb9f902ca9851c0f878e2f24a1a4f9f68b Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Mon, 19 Oct 2026 13:30:50 -0600
Subject: [PATCH 16/28] fix: markdown editor max height broken on firefox

---
 packages/ui/src/components/base/MarkdownEditorImpl.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/ui/src/components/base/MarkdownEditorImpl.vue b/packages/ui/src/components/base/MarkdownEditorImpl.vue
index ba81a619d7b..a119a7c9f86 100644
--- a/packages/ui/src/components/base/MarkdownEditorImpl.vue
+++ b/packages/ui/src/components/base/MarkdownEditorImpl.vue
@@ -635,7 +635,7 @@ function createEditorTheme(disabled = props.disabled) {
 			outline: 'none',
 		},
 		'.cm-content': {
-			minHeight: props.minHeight ? `max(100%, ${props.minHeight}px)` : 'max(100%, 200px)',
+			minHeight: `${props.minHeight ?? 200}px`,
 			padding: '0',
 			caretColor: 'var(--color-contrast)',
 			width: '100%',

From 4a0cf1a3ed1080ff8f68f73a5e19d3464bbfafeb Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Mon, 19 Oct 2026 13:43:11 -0600
Subject: [PATCH 17/28] polish: thread message options button and timestamp
 display

---
 .../components/ui/thread/ThreadMessage.vue    | 28 +++++++++++++++----
 1 file changed, 23 insertions(+), 5 deletions(-)

diff --git a/apps/frontend/src/components/ui/thread/ThreadMessage.vue b/apps/frontend/src/components/ui/thread/ThreadMessage.vue
index 7662c48d11d..cafe8f1afc4 100644
--- a/apps/frontend/src/components/ui/thread/ThreadMessage.vue
+++ b/apps/frontend/src/components/ui/thread/ThreadMessage.vue
@@ -29,7 +29,10 @@
 			<Avatar v-else-if="isAutoApproval" size="2rem" circle :raised="raised" />
 			<ThreadRoleBadge v-else role="moderator" avatar />
 		</div>
-		<div class="message__content mt-1.5 min-w-0">
+		<div
+			class="message__content relative mt-1.5 min-w-0"
+			:class="{ 'pr-8': isStaff(auth.user) && message.author_id === auth.user.id && !noLinks }"
+		>
 			<template v-if="author">
 				<span
 					class="message__author min-w-0 max-w-full font-bold"
@@ -195,7 +198,7 @@
 			</span>
 			<div
 				v-if="isStaff(auth.user) && message.author_id === auth.user.id && !noLinks"
-				class="mt-1 flex items-center gap-2"
+				class="absolute right-0 top-0 flex items-center"
 			>
 				<div
 					class="message__actions ml-auto group-focus-within/thread:opacity-100 group-hover/thread:opacity-100 [@media(hover:hover)]:opacity-0"
@@ -203,7 +206,7 @@
 					<TeleportOverflowMenu
 						type="quiet"
 						:label="formatMessage(imageMessages.moreOptions)"
-						class="btn-dropdown-animation !size-6 !min-h-0 !p-1"
+						class="btn-dropdown-animation !size-8 !min-h-0"
 						:options="[
 							{
 								id: 'delete',
@@ -295,8 +298,7 @@ const props = defineProps({
 })
 
 const hasBody = computed(() => props.message.body.type === 'text' && !props.forceCompact)
-const authorClasses =
-	'inline [&>svg]:ms-1 [&>svg]:me-1 [&>svg]:inline-block [&>svg]:align-middle mr-1'
+const authorClasses = 'inline [&>svg]:ms-1 [&>svg]:inline-block [&>svg]:align-middle mr-1'
 const bodyClasses = computed(() => (hasBody.value ? 'mt-1' : 'inline'))
 
 const emit = defineEmits(['update-thread', 'open-image'])
@@ -454,6 +456,22 @@ const formatDateTime = useFormatDateTime({
 
 const timeSincePosted = ref(formatRelativeTime(props.message.created))
 
+let timestampTimeout
+
+/** Refresh at 5 seconds, then every 15 seconds, then every minute until one hour old. */
+function refreshTimestamp() {
+	timeSincePosted.value = formatRelativeTime(props.message.created)
+	const age = Date.now() - new Date(props.message.created).getTime()
+	if (!Number.isFinite(age) || age >= 3600000) return
+
+	const interval = age < 5000 ? 5000 - age : 15000
+	const delay = age < 60000 ? Math.min(interval, 60000 - age) : Math.min(60000, 3600000 - age)
+	timestampTimeout = setTimeout(refreshTimestamp, delay)
+}
+
+onMounted(refreshTimestamp)
+onBeforeUnmount(() => clearTimeout(timestampTimeout))
+
 const isPrivateMessage = computed(() => {
 	return (
 		props.message.body.private ||

From 7a687c826dd1e643740040419b2ee66dcffb933e Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Mon, 19 Oct 2026 18:29:23 -0600
Subject: [PATCH 18/28] feat: add issue card display options for toggles

---
 .../issue-list/issue-toggles.vue              | 152 ++++++++++--------
 .../issue-list/stories/IssueCatalogueRow.vue  |  44 ++++-
 .../providers/project-review/review-panels.ts |  60 +++++--
 .../review-submission-context.ts              |   6 +
 .../project-review/review-submission.ts       |   4 +-
 .../moderation/src/data/issues/categories.ts  |   7 +-
 .../issues/component-builders/item-panels.ts  |  23 ++-
 .../data/issues/component-builders/types.ts   |  19 ++-
 .../moderation/src/data/issues/description.ts |   8 +
 .../moderation/src/data/issues/disclosures.ts | 144 ++++++++++++-----
 .../moderation/src/data/issues/gallery.ts     |  22 ++-
 packages/moderation/src/data/issues/icon.ts   |   5 +
 .../moderation/src/data/issues/license.ts     |   6 +
 packages/moderation/src/data/issues/links.ts  |  52 +++++-
 .../src/data/issues/post-approval.ts          |  10 ++
 .../moderation/src/data/issues/re-review.ts   |   3 +
 .../moderation/src/data/issues/reupload.ts    |   3 +
 packages/moderation/src/data/issues/rules.ts  |  44 ++++-
 packages/moderation/src/data/issues/server.ts |   3 +
 packages/moderation/src/data/issues/title.ts  |   6 +
 20 files changed, 471 insertions(+), 150 deletions(-)
 create mode 100644 apps/frontend/src/providers/project-review/review-submission-context.ts

diff --git a/apps/frontend/src/components/project-review/issue-list/issue-toggles.vue b/apps/frontend/src/components/project-review/issue-list/issue-toggles.vue
index b80446379ca..5e9365eb2c2 100644
--- a/apps/frontend/src/components/project-review/issue-list/issue-toggles.vue
+++ b/apps/frontend/src/components/project-review/issue-list/issue-toggles.vue
@@ -1,30 +1,30 @@
 <template>
-	<div v-if="optionControls.length > 1" :class="multiplePanels ? 'flex flex-col gap-2' : ''">
+	<div v-if="optionControls.length" :class="groupedOptions ? 'flex flex-col gap-2' : ''">
 		<div
 			v-for="row in rows"
 			:key="row.key"
 			class="flex min-w-0 flex-col items-start gap-1"
-			:class="{ 'flex-wrap': !multiplePanels }"
+			:class="{ 'flex-wrap': !groupedOptions }"
 		>
-			<span v-if="multiplePanels" class="shrink-0 items-center text-xs font-medium text-secondary">
+			<span v-if="groupedOptions" class="shrink-0 items-center text-xs font-medium text-secondary">
 				{{ row.label }}
 			</span>
 			<div class="flex min-w-0 flex-1 flex-wrap items-center gap-1.5">
 				<Button
 					v-for="entry in selectedOptionsForRow(row)"
-					:key="
-						entry.control.type === 'toggle' ? (entry.control.id ?? 'active') : entry.control.key
-					"
+					:key="entry.control.id ?? 'active'"
 					size="sm"
 					:disabled="pending || disabled || entry.control.disabled"
-					:aria-label="formatMessage(messages.removeOption, { option: optionLabel(entry) })"
+					:aria-label="
+						formatMessage(messages.removeOption, { option: entry.control.issueCardDisplay.label })
+					"
 					@click="removeOption(entry)"
 				>
-					{{ multiplePanels ? rowOptionLabel(entry) : optionLabel(entry) }}
+					{{ entry.control.issueCardDisplay.label }}
 					<XIcon class="size-3" aria-hidden="true" />
 				</Button>
 				<MultiSelect
-					:model-value="multiplePanels ? selectedRowValues(row) : optionDraft"
+					:model-value="groupedOptions ? selectedRowValues(row) : optionDraft"
 					:options="optionsForRow(row)"
 					:disabled="pending || disabled"
 					:dropdown-width="280"
@@ -41,7 +41,7 @@
 					checkbox-position="right"
 					@open="openOptions"
 					@close="closeOptions"
-					@update:model-value="multiplePanels ? updateRow(row, $event) : changeOptions($event)"
+					@update:model-value="groupedOptions ? updateRow(row, $event) : changeOptions($event)"
 				>
 					<template #input-content>
 						<span class="flex items-center gap-1">
@@ -58,14 +58,14 @@
 <script setup lang="ts">
 import { PlusIcon, XIcon } from '@modrinth/assets'
 import { Button, defineMessages, MultiSelect, type MultiSelectItem, useVIntl } from '@modrinth/ui'
-import { computed, ref, watch } from 'vue'
+import { computed, h, ref, watch } from 'vue'
 
 import {
 	injectReviewPanels,
 	type ReviewIssue,
 	type ReviewIssueControl,
 } from '~/providers/project-review/review-panels'
-import { injectReviewSubmission } from '~/providers/project-review/review-submission'
+import { injectReviewSubmission } from '~/providers/project-review/review-submission-context'
 
 const props = withDefaults(defineProps<{ issue: ReviewIssue; disabled?: boolean }>(), {
 	disabled: false,
@@ -83,13 +83,20 @@ const messages = defineMessages({
 		id: 'project-review.issues.remove-option',
 		defaultMessage: 'Remove {option}',
 	},
-	fieldOption: {
-		id: 'project-review.issues.field-option',
-		defaultMessage: '{field}: {option}',
-	},
 })
+type ToggleControl = Extract<ReviewIssueControl['control'], { type: 'toggle' }>
+interface IssueCardOption extends ReviewIssueControl {
+	control: ToggleControl & {
+		issueCardDisplay: NonNullable<ToggleControl['issueCardDisplay']>
+	}
+}
 const optionControls = computed(() =>
-	props.issue.controls.filter(({ control }) => control.type === 'toggle'),
+	props.issue.controls.filter(
+		(entry): entry is IssueCardOption =>
+			entry.control.type === 'toggle' &&
+			entry.control.issueCardDisplay !== undefined &&
+			!entry.control.issueCardDisplay.hidden,
+	),
 )
 const selectedOptionValues = computed(() =>
 	optionControls.value
@@ -106,23 +113,25 @@ const selectedOptions = computed(() => {
 			: panels.selected(entry.binding, entry.control),
 	)
 })
-const multiplePanels = computed(
-	() => new Set(optionControls.value.map(({ binding }) => binding.key)).size > 1,
+const groupedOptions = computed(
+	() =>
+		new Set(optionControls.value.map(({ binding }) => binding.key)).size > 1 ||
+		optionControls.value.some(
+			(entry) => entry.control.issueCardDisplay.group !== panelLabel(entry),
+		),
 )
 interface ToggleRow {
 	key: string
 	label: string
-	entries: ReviewIssueControl[]
+	entries: IssueCardOption[]
 }
 
 const rows = computed<ToggleRow[]>(() => {
-	if (!multiplePanels.value) return [{ key: 'all', label: '', entries: optionControls.value }]
+	if (!optionControls.value.length) return []
+	if (!groupedOptions.value) return [{ key: 'all', label: '', entries: optionControls.value }]
 	const groups = new Map<string, ToggleRow>()
 	for (const entry of optionControls.value) {
-		const key =
-			entry.control.type === 'toggle'
-				? (entry.control.issueListGroup ?? entry.control.label)
-				: entry.control.label
+		const key = entry.control.issueCardDisplay.group
 		const row = groups.get(key) ?? { key, label: key, entries: [] }
 		row.entries.push(entry)
 		groups.set(key, row)
@@ -140,55 +149,51 @@ function selectedRowValues(row: ToggleRow) {
 		.map(optionValue)
 }
 
-function optionLabel(entry: ReviewIssueControl) {
-	if (entry.control.type === 'toggle' && entry.control.issueListLabel)
-		return entry.control.issueListLabel
-	if (!multiplePanels.value) return entry.control.label
-	return formatMessage(messages.fieldOption, {
-		field: panelLabel(entry),
-		option: entry.control.label,
-	})
-}
-
-function rowOptionLabel(entry: ReviewIssueControl) {
-	return entry.control.type === 'toggle'
-		? (entry.control.issueListLabel ?? panelLabel(entry))
-		: panelLabel(entry)
-}
-
-function panelLabel(entry: ReviewIssueControl) {
+function panelLabel(entry: IssueCardOption) {
 	return entry.binding.panel.title ?? props.issue.category
 }
 
-function optionValue({ control }: ReviewIssueControl) {
-	return control.type === 'toggle'
-		? control.id === undefined
-			? `active:${props.issue.id}`
-			: `id:${control.id}`
-		: ''
+function optionValue({ control }: IssueCardOption) {
+	return control.id === undefined ? `active:${props.issue.id}` : `id:${control.id}`
 }
 
-const optionItems = computed<MultiSelectItem<string>[]>(() => {
-	return optionControls.value.map((entry) => ({
-		value: optionValue(entry),
-		label: optionLabel(entry),
-		searchTerms: multiplePanels.value ? [entry.control.label] : [],
-		disabled: pending.value || props.disabled || entry.control.disabled,
-	}))
-})
-
 function optionsForRow(row: ToggleRow): MultiSelectItem<string>[] {
-	if (!multiplePanels.value) return optionItems.value
-	return row.entries.map((entry) => ({
-		value: optionValue(entry),
-		label: rowOptionLabel(entry),
-		disabled: pending.value || props.disabled || entry.control.disabled,
-	}))
+	const items: MultiSelectItem<string>[] = []
+	const sections = new Map<string, MultiSelectItem<string>[]>()
+	for (const entry of row.entries) {
+		const { dropdownSection: section, icon, label } = entry.control.issueCardDisplay
+		const option = {
+			value: optionValue(entry),
+			label,
+			icon: icon
+				? () =>
+						h('img', {
+							src: icon,
+							alt: '',
+							class: 'rounded object-contain',
+							loading: 'lazy',
+						})
+				: undefined,
+			searchTerms: [entry.control.label, ...(section ? [section] : [])],
+			disabled: pending.value || props.disabled || entry.control.disabled,
+		}
+		if (section) {
+			const options = sections.get(section) ?? []
+			options.push(option)
+			sections.set(section, options)
+		} else {
+			items.push(option)
+		}
+	}
+	for (const [label, options] of sections) {
+		items.push({ type: 'section-header', label, showSelectionActions: false }, ...options)
+	}
+	return items
 }
 
-function removeOption(entry: ReviewIssueControl) {
+function removeOption(entry: IssueCardOption) {
 	if (pending.value || props.disabled || entry.control.disabled) return
-	if (multiplePanels.value && selectedOptionValues.value.length === 1)
+	if (groupedOptions.value && selectedOptionValues.value.length === 1)
 		panels.addIssue(props.issue.id)
 	panels.write(entry.binding, entry.control, false)
 }
@@ -232,17 +237,28 @@ function changeOptions(values: string[]) {
 }
 
 function openOptions() {
-	if (multiplePanels.value) return
+	if (groupedOptions.value) return
 	optionDraft.value = [...selectedOptionValues.value]
 	optionsOpen.value = true
 }
 
 function closeOptions() {
-	if (multiplePanels.value) return
+	if (groupedOptions.value) return
 	optionsOpen.value = false
 	if (pending.value || props.disabled) return
 	if (!optionDraft.value.length) {
-		emit('remove')
+		if (
+			props.issue.controls.some(
+				({ binding, control }) =>
+					control.type === 'toggle' &&
+					(!control.issueCardDisplay || control.issueCardDisplay.hidden) &&
+					panels.selected(binding, control),
+			)
+		) {
+			updateOptions([])
+		} else {
+			emit('remove')
+		}
 		return
 	}
 	const selected = new Set(selectedOptionValues.value)
diff --git a/apps/frontend/src/components/project-review/issue-list/stories/IssueCatalogueRow.vue b/apps/frontend/src/components/project-review/issue-list/stories/IssueCatalogueRow.vue
index 7ff7d9d8aa4..8b33c896526 100644
--- a/apps/frontend/src/components/project-review/issue-list/stories/IssueCatalogueRow.vue
+++ b/apps/frontend/src/components/project-review/issue-list/stories/IssueCatalogueRow.vue
@@ -10,14 +10,32 @@ import {
 	Textarea,
 	Tooltip,
 } from '@modrinth/ui'
-import { computed } from 'vue'
+import { computed, ref } from 'vue'
+
+import { provideReviewPanels } from '../../../../providers/project-review/review-panels'
+import { provideReviewSubmission } from '../../../../providers/project-review/review-submission-context'
 
 import ProjectIssueCard from '../../../ui/project-issue-card/index.vue'
 import ActionButton from '../../review-panel/controls/action-button.vue'
+import IssueToggles from '../issue-toggles.vue'
 import { createIssueCatalogue } from './issue-catalogue'
 
 const props = defineProps<{ issueId: string }>()
 const panels = createIssueCatalogue()
+provideReviewPanels(panels)
+provideReviewSubmission({
+	draft: ref(''),
+	pending: computed(() => false),
+	canSubmit: computed(() => false),
+	canApprove: computed(() => false),
+	canAddIssues: computed(() => true),
+	sendIssuesAsThreadMessage: computed(() => false),
+	loadingAction: computed(() => undefined),
+	submit: async () => {},
+	submitDecision: async () => false,
+	submitIssues: async () => false,
+	uploadImage: async () => '',
+})
 const issue = computed(() => panels.availableIssues.value.find(({ id }) => id === props.issueId)!)
 const preview = computed(() => panels.activeIssues.value.find(({ id }) => id === props.issueId))
 const threadIssues = computed<Labrinth.Threads.v3.ThreadIssue[]>(() => {
@@ -107,6 +125,21 @@ reset()
 				<h3 class="m-0 text-base font-bold text-contrast">Issue controls</h3>
 				<Button size="sm" @click="reset">Reset</Button>
 			</div>
+			<section
+				v-if="
+					issue.controls.some(
+						({ control }) =>
+							control.type === 'toggle' &&
+							control.issueCardDisplay &&
+							!control.issueCardDisplay.hidden,
+					)
+				"
+				class="flex min-w-0 flex-col gap-2.5 text-sm"
+				aria-label="Issue card options"
+			>
+				<h3 class="m-0 text-sm font-semibold text-contrast">Issue card options</h3>
+				<IssueToggles :issue="issue" @remove="panels.removeIssue(issueId)" />
+			</section>
 			<section
 				v-for="{ binding, sections } in controlPanels"
 				:key="binding.key"
@@ -117,7 +150,9 @@ reset()
 					{{ binding.panel.title ?? binding.key }}
 				</h3>
 				<div v-for="(section, index) in sections" :key="index" class="flex flex-col gap-2">
-					<p v-if="section.label" class="m-0 font-semibold text-contrast">{{ section.label }}</p>
+					<p v-if="section.label" class="m-0 font-semibold text-contrast">
+						{{ section.label }}
+					</p>
 					<div class="flex flex-wrap gap-2">
 						<template
 							v-for="control in section.controls"
@@ -160,7 +195,10 @@ reset()
 									v-else-if="control.type === 'select'"
 									:model-value="panels.selectValues(binding, control)[0] ?? ''"
 									:options="[
-										{ value: '', label: control.placeholder ?? 'Select an option' },
+										{
+											value: '',
+											label: control.placeholder ?? 'Select an option',
+										},
 										...control.options,
 									]"
 									:placeholder="control.placeholder ?? 'Select an option'"
diff --git a/apps/frontend/src/providers/project-review/review-panels.ts b/apps/frontend/src/providers/project-review/review-panels.ts
index dfff90806b1..e56f2e6bd72 100644
--- a/apps/frontend/src/providers/project-review/review-panels.ts
+++ b/apps/frontend/src/providers/project-review/review-panels.ts
@@ -35,8 +35,13 @@ export type ResolvedIssueControl = ResolvedIssueControlOptions &
 		| {
 				type: 'toggle'
 				id?: string
-				issueListLabel?: string
-				issueListGroup?: string
+				issueCardDisplay?: {
+					icon?: string
+					label: string
+					group: string
+					dropdownSection?: string
+					hidden: boolean
+				}
 		  }
 		| {
 				type: 'markdown' | 'text' | 'textarea'
@@ -416,8 +421,22 @@ export function createReviewPanels(
 							...options,
 							type: 'toggle',
 							id: node.id,
-							issueListLabel: resolveWithContext(node.issueListLabel, issueContext),
-							issueListGroup: resolveWithContext(node.issueListGroup, issueContext),
+							issueCardDisplay: node.issueCardDisplay
+								? {
+										icon: resolveWithContext(node.issueCardDisplay.icon, issueContext),
+										dropdownSection: resolveWithContext(
+											node.issueCardDisplay.dropdownSection,
+											issueContext,
+										),
+										label: resolveWithContext(node.issueCardDisplay.label, issueContext),
+										group:
+											resolveWithContext(node.issueCardDisplay.group, issueContext) ??
+											resolveWithContext(panel.title, context) ??
+											issue?.category ??
+											'',
+										hidden: resolveWithContext(node.issueCardDisplay.hidden, issueContext) === true,
+									}
+								: undefined,
 						}
 					} else if (node.type === 'select') {
 						const initial = resolveWithContext(node.initial, issueContext)
@@ -431,7 +450,8 @@ export function createReviewPanels(
 							options: resolveWithContext(node.options, issueContext)
 								.filter(
 									(option) =>
-										showAllIssueControls || resolveWithContext(option.shown, issueContext) !== false,
+										showAllIssueControls ||
+										resolveWithContext(option.shown, issueContext) !== false,
 								)
 								.map((option) => ({
 									value: option.value,
@@ -659,18 +679,26 @@ export function createReviewPanels(
 						priority: control.issue.priority,
 						controls: [],
 					}
-					if (
-						!issue.controls.some(
-							({ control: existing }) =>
-								existing.type === control.type &&
-								(existing.type === 'toggle' && control.type === 'toggle'
-									? existing.id === control.id
-									: existing.type !== 'toggle' &&
-										control.type !== 'toggle' &&
-										existing.key === control.key),
-						)
+					const existing = issue.controls.find(
+						({ control: existing }) =>
+							existing.type === control.type &&
+							(existing.type === 'toggle' && control.type === 'toggle'
+								? existing.id === control.id
+								: existing.type !== 'toggle' &&
+									control.type !== 'toggle' &&
+									existing.key === control.key),
 					)
-						issue.controls.push({ binding, control })
+					if (!existing) issue.controls.push({ binding, control })
+					else if (
+						existing.control.type === 'toggle' &&
+						(!existing.control.issueCardDisplay || existing.control.issueCardDisplay.hidden) &&
+						control.type === 'toggle' &&
+						control.issueCardDisplay &&
+						!control.issueCardDisplay.hidden
+					) {
+						existing.binding = binding
+						existing.control = control
+					}
 					issues.set(issue.id, issue)
 				}
 			}
diff --git a/apps/frontend/src/providers/project-review/review-submission-context.ts b/apps/frontend/src/providers/project-review/review-submission-context.ts
new file mode 100644
index 00000000000..60bce0f94a0
--- /dev/null
+++ b/apps/frontend/src/providers/project-review/review-submission-context.ts
@@ -0,0 +1,6 @@
+import { createContext } from '@modrinth/ui'
+
+import type { createReviewSubmission } from './review-submission'
+
+export const [injectReviewSubmission, provideReviewSubmission] =
+	createContext<ReturnType<typeof createReviewSubmission>>('ReviewSubmission')
diff --git a/apps/frontend/src/providers/project-review/review-submission.ts b/apps/frontend/src/providers/project-review/review-submission.ts
index c0d2776a005..05efbee1518 100644
--- a/apps/frontend/src/providers/project-review/review-submission.ts
+++ b/apps/frontend/src/providers/project-review/review-submission.ts
@@ -3,7 +3,6 @@ import { moderationSettings } from '@modrinth/moderation'
 import { IssuePriority } from '@modrinth/moderation/src/data/issues'
 import {
 	commonMessages,
-	createContext,
 	defineMessages,
 	injectModrinthClient,
 	injectNotificationManager,
@@ -29,8 +28,7 @@ type ProjectStatus = Labrinth.Projects.v2.ProjectStatus
 type ReviewEditorMode = 'reply' | 'note'
 type NewThreadIssues = Labrinth.Threads.v3.NewThreadIssues
 
-export const [injectReviewSubmission, provideReviewSubmission] =
-	createContext<ReturnType<typeof createReviewSubmission>>('ReviewSubmission')
+export { injectReviewSubmission, provideReviewSubmission } from './review-submission-context'
 
 export function createReviewSubmission(
 	messages: ReturnType<typeof createReviewMessages>,
diff --git a/packages/moderation/src/data/issues/categories.ts b/packages/moderation/src/data/issues/categories.ts
index 72c1f108a1e..1578951a8ae 100644
--- a/packages/moderation/src/data/issues/categories.ts
+++ b/packages/moderation/src/data/issues/categories.ts
@@ -63,11 +63,15 @@ export const categoriesReviewPanel = panel({
 	shown: ({ projectV3 }) =>
 		projectV3.categories.length > 0 || projectV3.additional_categories.length > 0,
 }).content(
-	toggle({ issue: categoriesInaccurateIssue, label: 'Inaccurate' }),
+	toggle({
+		issue: categoriesInaccurateIssue,
+		label: 'Inaccurate',
+	}),
 	toggle({
 		issue: categoriesInaccurateIssue,
 		label: 'Optimization',
 		id: 'categories-optimization-misused',
+		issueCardDisplay: { label: 'Optimization' },
 		shown: ({ projectV3 }) =>
 			[...projectV3.categories, ...projectV3.additional_categories].includes('optimization'),
 	}),
@@ -75,6 +79,7 @@ export const categoriesReviewPanel = panel({
 		issue: categoriesInaccurateIssue,
 		label: 'Resolutions',
 		id: 'categories-resolutions-misused',
+		issueCardDisplay: { label: 'Resolutions' },
 		shown: ({ projectV3 }) =>
 			projectV3.project_types.includes('resourcepack') &&
 			(projectV3.categories.some((tag) => resolutionTags.has(tag)) ||
diff --git a/packages/moderation/src/data/issues/component-builders/item-panels.ts b/packages/moderation/src/data/issues/component-builders/item-panels.ts
index fce4b7811ae..84d51ae5630 100644
--- a/packages/moderation/src/data/issues/component-builders/item-panels.ts
+++ b/packages/moderation/src/data/issues/component-builders/item-panels.ts
@@ -209,14 +209,21 @@ export function expandItemReviewPanels(
 						: (ctx) => resolve(node.placeholder, scopedContext(ctx, item)) ?? ''
 			}
 			if (node.type !== 'toggle') return [scoped]
-			if (scoped.type === 'toggle') {
-				scoped.issueListLabel = (ctx) =>
-					resolve(node.issueListLabel, scopedContext(ctx, item)) ??
-					resolve(item.panel.title, scopedContext(ctx, item)) ??
-					item.key
-				scoped.issueListGroup = (ctx) =>
-					resolve(node.issueListGroup, scopedContext(ctx, item)) ??
-					resolve(node.label, scopedContext(ctx, item))
+			if (scoped.type === 'toggle' && node.issueCardDisplay !== undefined) {
+				const display = node.issueCardDisplay
+				scoped.issueCardDisplay = {
+					icon: (ctx) => resolve(display.icon, scopedContext(ctx, item)),
+					dropdownSection:
+						display.dropdownSection === undefined
+							? undefined
+							: (ctx) => resolve(display.dropdownSection, scopedContext(ctx, item)) ?? '',
+					label: (ctx) => resolve(display.label, scopedContext(ctx, item)),
+					group: (ctx) =>
+						resolve(display.group, scopedContext(ctx, item)) ??
+						resolve(item.panel.title, scopedContext(ctx, item)) ??
+						item.key,
+					hidden: (ctx) => resolve(display.hidden, scopedContext(ctx, item)),
+				}
 			}
 			return [scoped]
 		})
diff --git a/packages/moderation/src/data/issues/component-builders/types.ts b/packages/moderation/src/data/issues/component-builders/types.ts
index 91469f81d6b..de09f624cf1 100644
--- a/packages/moderation/src/data/issues/component-builders/types.ts
+++ b/packages/moderation/src/data/issues/component-builders/types.ts
@@ -72,13 +72,24 @@ interface IssueControlOptions {
 	disabled?: WithContext<boolean>
 }
 
+export interface IssueCardDisplayConfig {
+	/** Optional image URL displayed in the dropdown option's icon slot. */
+	icon?: WithContext<string | undefined>
+	/** Text displayed for this option in the issue card. */
+	label: WithContext<string>
+	/** Defaults to the toggle's panel label. */
+	group?: WithContext<string>
+	/** Optional dropdown heading; selected chips keep their own labels. */
+	dropdownSection?: WithContext<string>
+	/** Hides a configured card option without affecting the review panel or selection state. Defaults to false. */
+	hidden?: WithContext<boolean>
+}
+
 export interface IssueToggle extends IssueControlOptions {
 	type: 'toggle'
 	issue: Issue
-	/** Optional label for this toggle in the issue list. */
-	issueListLabel?: WithContext<string>
-	/** Optional issue-list row for this toggle. Defaults to the toggle label. */
-	issueListGroup?: WithContext<string>
+	/** Opts this toggle into the issue card's options with an explicit label. Omit for panel-only issue activation. */
+	issueCardDisplay?: IssueCardDisplayConfig
 	/**
 	 * Identifies a selection within its issue. Reuse the ID across panels to share selection state.
 	 * Without an ID, the toggle activates the issue directly and contributes no selected toggle ID.
diff --git a/packages/moderation/src/data/issues/description.ts b/packages/moderation/src/data/issues/description.ts
index dc9c58de60c..f36c405be6b 100644
--- a/packages/moderation/src/data/issues/description.ts
+++ b/packages/moderation/src/data/issues/description.ts
@@ -134,6 +134,10 @@ export const descriptionReviewPanel = panel({
 		label: 'AI Images',
 		issue: rulesAiImagesIssue,
 		id: 'description-ai-images',
+		issueCardDisplay: {
+			group: 'AI images',
+			label: 'Description',
+		},
 	}),
 	section({
 		label: 'Why is this Description Insufficient?',
@@ -142,21 +146,25 @@ export const descriptionReviewPanel = panel({
 		toggle({
 			label: 'Custom',
 			id: 'description-custom',
+			issueCardDisplay: { label: 'Custom' },
 			issue: insufficientDescriptionIssue,
 		}),
 		toggle({
 			label: 'Fork',
 			id: 'description-fork',
+			issueCardDisplay: { label: 'Fork' },
 			issue: insufficientDescriptionIssue,
 		}),
 		toggle({
 			label: 'Unfinished',
 			id: 'description-unfinished',
+			issueCardDisplay: { label: 'Unfinished' },
 			issue: insufficientDescriptionIssue,
 		}),
 		toggle({
 			label: 'Spoilers',
 			id: 'description-spoilers',
+			issueCardDisplay: { label: 'Spoilers' },
 			issue: insufficientDescriptionIssue,
 		}),
 	),
diff --git a/packages/moderation/src/data/issues/disclosures.ts b/packages/moderation/src/data/issues/disclosures.ts
index f6634d75a83..bacdfc97740 100644
--- a/packages/moderation/src/data/issues/disclosures.ts
+++ b/packages/moderation/src/data/issues/disclosures.ts
@@ -231,7 +231,10 @@ export const aiDisclosureReviewPanel = panel({
 		issue: disclosuresIssue,
 		id: 'ai-disclosure-missing',
 		label: 'Missing',
-		issueListLabel: 'AI Usage',
+		issueCardDisplay: {
+			label: 'AI Usage',
+			group: 'Missing',
+		},
 	}),
 	toggle({
 		issue: disclosuresIssue,
@@ -239,7 +242,10 @@ export const aiDisclosureReviewPanel = panel({
 		shown: ({ disclosures }) =>
 			disclosures.some((disclosure) => disclosure.type === 'ai_content' && !disclosure.deleted_at),
 		label: 'Misused',
-		issueListLabel: 'AI Usage',
+		issueCardDisplay: {
+			label: 'AI Usage',
+			group: 'Misused',
+		},
 	}),
 	section({
 		label: 'Type of missing disclosure?',
@@ -249,22 +255,28 @@ export const aiDisclosureReviewPanel = panel({
 			issue: disclosuresIssue,
 			id: 'ai-disclosure-missing-code',
 			label: 'Code',
-			issueListLabel: 'AI Usage: Code',
-			issueListGroup: 'Missing',
+			issueCardDisplay: {
+				label: 'AI Usage: Code',
+				group: 'Missing',
+			},
 		}),
 		toggle({
 			issue: disclosuresIssue,
 			id: 'ai-disclosure-missing-assets',
 			label: 'Assets',
-			issueListLabel: 'AI Usage: Assets',
-			issueListGroup: 'Missing',
+			issueCardDisplay: {
+				label: 'AI Usage: Assets',
+				group: 'Missing',
+			},
 		}),
 		toggle({
 			issue: disclosuresIssue,
 			id: 'ai-disclosure-missing-text',
 			label: 'Text',
-			issueListLabel: 'AI Usage: Text',
-			issueListGroup: 'Missing',
+			issueCardDisplay: {
+				label: 'AI Usage: Text',
+				group: 'Missing',
+			},
 		}),
 	),
 	section({
@@ -284,8 +296,10 @@ export const aiDisclosureReviewPanel = panel({
 						disclosure.uses.includes('code'),
 				),
 			label: 'Code',
-			issueListLabel: 'AI Usage: Code',
-			issueListGroup: 'Misused',
+			issueCardDisplay: {
+				label: 'AI Usage: Code',
+				group: 'Misused',
+			},
 		}),
 		toggle({
 			issue: disclosuresIssue,
@@ -298,8 +312,10 @@ export const aiDisclosureReviewPanel = panel({
 						disclosure.uses.includes('assets'),
 				),
 			label: 'Assets',
-			issueListLabel: 'AI Usage: Assets',
-			issueListGroup: 'Misused',
+			issueCardDisplay: {
+				label: 'AI Usage: Assets',
+				group: 'Misused',
+			},
 		}),
 		toggle({
 			issue: disclosuresIssue,
@@ -312,8 +328,10 @@ export const aiDisclosureReviewPanel = panel({
 						disclosure.uses.includes('text'),
 				),
 			label: 'Text',
-			issueListLabel: 'AI Usage: Text',
-			issueListGroup: 'Misused',
+			issueCardDisplay: {
+				label: 'AI Usage: Text',
+				group: 'Misused',
+			},
 		}),
 	),
 )
@@ -329,7 +347,10 @@ export const aiFunctionalityDisclosureReviewPanel = panel({
 		issue: disclosuresIssue,
 		id: 'ai-functionality-disclosure-missing',
 		label: 'Missing',
-		issueListLabel: 'AI Functionality',
+		issueCardDisplay: {
+			label: 'AI Functionality',
+			group: 'Missing',
+		},
 	}),
 	toggle({
 		issue: disclosuresIssue,
@@ -339,7 +360,10 @@ export const aiFunctionalityDisclosureReviewPanel = panel({
 				(disclosure) => disclosure.type === 'ai_functionality' && !disclosure.deleted_at,
 			),
 		label: 'Misused',
-		issueListLabel: 'AI Functionality',
+		issueCardDisplay: {
+			label: 'AI Functionality',
+			group: 'Misused',
+		},
 	}),
 )
 
@@ -354,7 +378,10 @@ export const adsDisclosureReviewPanel = panel({
 		issue: disclosuresIssue,
 		id: 'ads-disclosure-missing',
 		label: 'Missing',
-		issueListLabel: 'Advertisements',
+		issueCardDisplay: {
+			label: 'Advertisements',
+			group: 'Missing',
+		},
 	}),
 	toggle({
 		issue: disclosuresIssue,
@@ -364,7 +391,10 @@ export const adsDisclosureReviewPanel = panel({
 				(disclosure) => disclosure.type === 'advertisements' && !disclosure.deleted_at,
 			),
 		label: 'Misused',
-		issueListLabel: 'Advertisements',
+		issueCardDisplay: {
+			label: 'Advertisements',
+			group: 'Misused',
+		},
 	}),
 )
 
@@ -379,7 +409,10 @@ export const paidFeaturesDisclosureReviewPanel = panel({
 		issue: disclosuresIssue,
 		id: 'paid-features-disclosure-missing',
 		label: 'Missing',
-		issueListLabel: 'Paid Features',
+		issueCardDisplay: {
+			label: 'Paid Features',
+			group: 'Missing',
+		},
 	}),
 	toggle({
 		issue: disclosuresIssue,
@@ -389,7 +422,10 @@ export const paidFeaturesDisclosureReviewPanel = panel({
 				(disclosure) => disclosure.type === 'paid_features' && !disclosure.deleted_at,
 			),
 		label: 'Misused',
-		issueListLabel: 'Paid Features',
+		issueCardDisplay: {
+			label: 'Paid Features',
+			group: 'Misused',
+		},
 	}),
 )
 
@@ -404,7 +440,10 @@ export const telemetryDisclosureReviewPanel = panel({
 		issue: disclosuresIssue,
 		id: 'telemetry-disclosure-missing',
 		label: 'Missing',
-		issueListLabel: 'Telemetry',
+		issueCardDisplay: {
+			label: 'Telemetry',
+			group: 'Missing',
+		},
 	}),
 	toggle({
 		issue: disclosuresIssue,
@@ -412,7 +451,10 @@ export const telemetryDisclosureReviewPanel = panel({
 		shown: ({ disclosures }) =>
 			disclosures.some((disclosure) => disclosure.type === 'telemetry' && !disclosure.deleted_at),
 		label: 'Misused',
-		issueListLabel: 'Telemetry',
+		issueCardDisplay: {
+			label: 'Telemetry',
+			group: 'Misused',
+		},
 	}),
 	section({
 		label: 'What is the telemetry’s consent model?',
@@ -422,8 +464,10 @@ export const telemetryDisclosureReviewPanel = panel({
 			issue: disclosuresIssue,
 			id: 'telemetry-disclosure-missing-opt-in',
 			label: 'Opt In',
-			issueListLabel: 'Telemetry: Opt In',
-			issueListGroup: 'Missing',
+			issueCardDisplay: {
+				label: 'Telemetry: Opt In',
+				group: 'Missing',
+			},
 			disabled: ({ selected }) =>
 				selected.toggleIds.includes('telemetry-disclosure-missing-opt-out') ||
 				selected.toggleIds.includes('telemetry-disclosure-missing-always'),
@@ -432,8 +476,10 @@ export const telemetryDisclosureReviewPanel = panel({
 			issue: disclosuresIssue,
 			id: 'telemetry-disclosure-missing-opt-out',
 			label: 'Opt Out',
-			issueListLabel: 'Telemetry: Opt Out',
-			issueListGroup: 'Missing',
+			issueCardDisplay: {
+				label: 'Telemetry: Opt Out',
+				group: 'Missing',
+			},
 			disabled: ({ selected }) =>
 				selected.toggleIds.includes('telemetry-disclosure-missing-opt-in') ||
 				selected.toggleIds.includes('telemetry-disclosure-missing-always'),
@@ -442,8 +488,10 @@ export const telemetryDisclosureReviewPanel = panel({
 			issue: disclosuresIssue,
 			id: 'telemetry-disclosure-missing-always',
 			label: 'Always Online',
-			issueListLabel: 'Telemetry: Always Online',
-			issueListGroup: 'Missing',
+			issueCardDisplay: {
+				label: 'Telemetry: Always Online',
+				group: 'Missing',
+			},
 			disabled: ({ selected }) =>
 				selected.toggleIds.includes('telemetry-disclosure-missing-opt-in') ||
 				selected.toggleIds.includes('telemetry-disclosure-missing-opt-out'),
@@ -462,7 +510,10 @@ export const derivativeContentDisclosureReviewPanel = panel({
 		issue: disclosuresIssue,
 		id: 'derivative-content-disclosure-missing',
 		label: 'Missing',
-		issueListLabel: 'Derivative Content',
+		issueCardDisplay: {
+			label: 'Derivative Content',
+			group: 'Missing',
+		},
 	}),
 	toggle({
 		issue: disclosuresIssue,
@@ -472,7 +523,10 @@ export const derivativeContentDisclosureReviewPanel = panel({
 				(disclosure) => disclosure.type === 'derivative_work' && !disclosure.deleted_at,
 			),
 		label: 'Misused',
-		issueListLabel: 'Derivative Content',
+		issueCardDisplay: {
+			label: 'Derivative Content',
+			group: 'Misused',
+		},
 	}),
 )
 
@@ -487,7 +541,10 @@ export const photosensitivityDisclosureReviewPanel = panel({
 		issue: disclosuresIssue,
 		id: 'photosensitivity-disclosure-missing',
 		label: 'Missing',
-		issueListLabel: 'Photosensitivity',
+		issueCardDisplay: {
+			label: 'Photosensitivity',
+			group: 'Missing',
+		},
 	}),
 	toggle({
 		issue: disclosuresIssue,
@@ -497,7 +554,10 @@ export const photosensitivityDisclosureReviewPanel = panel({
 				(disclosure) => disclosure.type === 'epilepsy_triggers' && !disclosure.deleted_at,
 			),
 		label: 'Misused',
-		issueListLabel: 'Photosensitivity',
+		issueCardDisplay: {
+			label: 'Photosensitivity',
+			group: 'Misused',
+		},
 	}),
 )
 
@@ -512,7 +572,10 @@ export const systemInteractionsDisclosureReviewPanel = panel({
 		issue: disclosuresIssue,
 		id: 'system-interactions-disclosure-missing',
 		label: 'Missing',
-		issueListLabel: 'System Interactions',
+		issueCardDisplay: {
+			label: 'System Interactions',
+			group: 'Missing',
+		},
 	}),
 	toggle({
 		issue: disclosuresIssue,
@@ -522,7 +585,10 @@ export const systemInteractionsDisclosureReviewPanel = panel({
 				(disclosure) => disclosure.type === 'system_interactions' && !disclosure.deleted_at,
 			),
 		label: 'Misused',
-		issueListLabel: 'System Interactions',
+		issueCardDisplay: {
+			label: 'System Interactions',
+			group: 'Misused',
+		},
 	}),
 )
 
@@ -537,7 +603,10 @@ export const archiveDisclosureReviewPanel = panel({
 		issue: disclosuresIssue,
 		id: 'archive-disclosure-missing',
 		label: 'Missing',
-		issueListLabel: 'Archive',
+		issueCardDisplay: {
+			label: 'Archive',
+			group: 'Missing',
+		},
 	}),
 	toggle({
 		issue: disclosuresIssue,
@@ -545,7 +614,10 @@ export const archiveDisclosureReviewPanel = panel({
 		shown: ({ disclosures }) =>
 			disclosures.some((disclosure) => disclosure.type === 'archived' && !disclosure.deleted_at),
 		label: 'Misused',
-		issueListLabel: 'Archive',
+		issueCardDisplay: {
+			label: 'Archive',
+			group: 'Misused',
+		},
 	}),
 )
 
diff --git a/packages/moderation/src/data/issues/gallery.ts b/packages/moderation/src/data/issues/gallery.ts
index c5137d06794..00a276873e8 100644
--- a/packages/moderation/src/data/issues/gallery.ts
+++ b/packages/moderation/src/data/issues/gallery.ts
@@ -35,7 +35,12 @@ export const galleryNotRelevantIssue = issue({
 			image.id !== undefined && keys.has(String(image.id)) ? [image.id] : [],
 		)
 		return imageIds.length
-			? [() => ({ type: 'remove_gallery_images', value: { image_ids: imageIds } })]
+			? [
+					() => ({
+						type: 'remove_gallery_images',
+						value: { image_ids: imageIds },
+					}),
+				]
 			: []
 	},
 	message: (context) => {
@@ -63,9 +68,10 @@ export function galleryImageReviewPanel(
 	image: Labrinth.Projects.v3.GalleryItem,
 	imageNumber: number,
 ) {
+	const imageLabel = image.name ?? `Gallery image ${imageNumber}`
 	return panel({
 		parent: 'gallery',
-		title: image.name ?? `Gallery image ${imageNumber}`,
+		title: imageLabel,
 		hint: "Are this project's gallery images sufficient?",
 		icon: ImageIcon,
 		guidanceUrl:
@@ -74,11 +80,23 @@ export function galleryImageReviewPanel(
 		toggle({
 			issue: galleryNotRelevantIssue,
 			label: 'Not relevant',
+			issueCardDisplay: {
+				label: imageLabel,
+				icon: () => image.url,
+				group: 'Irrelevant images',
+				dropdownSection: 'Gallery images',
+			},
 		}),
 
 		toggle({
 			issue: rulesAiImagesIssue,
 			label: 'AI Images',
+			issueCardDisplay: {
+				label: imageLabel,
+				icon: () => image.url,
+				group: 'AI images',
+				dropdownSection: 'Gallery images',
+			},
 		}),
 	)
 }
diff --git a/packages/moderation/src/data/issues/icon.ts b/packages/moderation/src/data/issues/icon.ts
index 47cf4c4256c..975ffcf7a5c 100644
--- a/packages/moderation/src/data/issues/icon.ts
+++ b/packages/moderation/src/data/issues/icon.ts
@@ -45,6 +45,11 @@ export const iconReviewPanel = panel({
 		issue: rulesAiImagesIssue,
 		id: 'icon-ai-images',
 		label: 'AI',
+		issueCardDisplay: {
+			icon: ({ projectV3 }) => projectV3.icon_url ?? undefined,
+			group: 'AI images',
+			label: 'Icon',
+		},
 		shown: ({ projectV3 }) => !!projectV3.icon_url,
 	}),
 	toggle({
diff --git a/packages/moderation/src/data/issues/license.ts b/packages/moderation/src/data/issues/license.ts
index f7199fd10c0..62515aa91df 100644
--- a/packages/moderation/src/data/issues/license.ts
+++ b/packages/moderation/src/data/issues/license.ts
@@ -52,6 +52,9 @@ export const sourceRequiredSection = section({
 			issue: licenseNoSourceIssue,
 			label: 'No Source: Fork',
 			id: 'license-fork',
+			issueCardDisplay: {
+				label: 'No Source: Fork',
+			},
 		}),
 	),
 )
@@ -76,6 +79,9 @@ export const licenseReviewPanel = panel({
 		issue: licenseInvalidLinkIssue,
 		label: 'Invalid Link: Custom License',
 		id: 'license-custom-license',
+		issueCardDisplay: {
+			label: 'Invalid Link: Custom License',
+		},
 	}),
 	sourceRequiredSection,
 )
diff --git a/packages/moderation/src/data/issues/links.ts b/packages/moderation/src/data/issues/links.ts
index 9e7d3dd47a4..ac707b58874 100644
--- a/packages/moderation/src/data/issues/links.ts
+++ b/packages/moderation/src/data/issues/links.ts
@@ -173,19 +173,27 @@ export const issuesReviewPanel = panel({
 	toggle({
 		issue: linksIssue,
 		id: 'issues-link:misused',
+		issueCardDisplay: {
+			label: 'Issue tracker: Misused',
+		},
 		label: 'Misused',
 	}),
 	toggle({
 		issue: linksIssue,
 		id: 'issues-link:inaccessible',
+		issueCardDisplay: {
+			label: 'Issue tracker: Inaccessible',
+		},
 		label: 'Inaccessible',
 	}),
 	toggle({
 		issue: linksIssue,
 		id: 'issues-link:disabled',
 		label: 'Disabled',
-		issueListGroup: 'Inaccessible',
-		issueListLabel: 'Issues: Disabled',
+		issueCardDisplay: {
+			group: 'Inaccessible',
+			label: 'Issues: Disabled',
+		},
 	}),
 	linkSuggestionSection('issues'),
 )
@@ -201,19 +209,23 @@ export const sourceReviewPanel = panel({
 	toggle({
 		issue: linksIssue,
 		id: 'source-link:misused',
+		issueCardDisplay: { label: 'Source code: Misused' },
 		label: 'Misused',
 	}),
 	toggle({
 		issue: linksIssue,
 		id: 'source-link:inaccessible',
+		issueCardDisplay: { label: 'Source code: Inaccessible' },
 		label: 'Inaccessible',
 	}),
 	toggle({
 		issue: linksIssue,
 		id: 'source-link:empty',
 		label: 'Empty Repo',
-		issueListGroup: 'Inaccessible',
-		issueListLabel: 'Source: Empty Repo',
+		issueCardDisplay: {
+			group: 'Inaccessible',
+			label: 'Source: Empty Repo',
+		},
 	}),
 	linkSuggestionSection('source'),
 )
@@ -229,19 +241,23 @@ export const wikiReviewPanel = panel({
 	toggle({
 		issue: linksIssue,
 		id: 'wiki-link:misused',
+		issueCardDisplay: { label: 'Wiki page: Misused' },
 		label: 'Misused',
 	}),
 	toggle({
 		issue: linksIssue,
 		id: 'wiki-link:inaccessible',
+		issueCardDisplay: { label: 'Wiki page: Inaccessible' },
 		label: 'Inaccessible',
 	}),
 	toggle({
 		issue: linksIssue,
 		id: 'wiki-link:disabled',
 		label: 'Disabled',
-		issueListGroup: 'Inaccessible',
-		issueListLabel: 'Wiki: Disabled',
+		issueCardDisplay: {
+			group: 'Inaccessible',
+			label: 'Wiki: Disabled',
+		},
 	}),
 	linkSuggestionSection('wiki'),
 )
@@ -257,19 +273,23 @@ export const discordReviewPanel = panel({
 	toggle({
 		issue: linksIssue,
 		id: 'discord-link:misused',
+		issueCardDisplay: { label: 'Discord invite: Misused' },
 		label: 'Misused',
 	}),
 	toggle({
 		issue: linksIssue,
 		id: 'discord-link:inaccessible',
+		issueCardDisplay: { label: 'Discord invite: Inaccessible' },
 		label: 'Inaccessible',
 	}),
 	toggle({
 		issue: linksIssue,
 		id: 'discord-link:expiring',
 		label: 'Expiring',
-		issueListGroup: 'Inaccessible',
-		issueListLabel: 'Discord: Expiring',
+		issueCardDisplay: {
+			group: 'Inaccessible',
+			label: 'Discord: Expiring',
+		},
 	}),
 	linkSuggestionSection('discord'),
 )
@@ -285,11 +305,13 @@ export const siteReviewPanel = panel({
 	toggle({
 		issue: linksIssue,
 		id: 'site-link:misused',
+		issueCardDisplay: { label: 'Website: Misused' },
 		label: 'Misused',
 	}),
 	toggle({
 		issue: linksIssue,
 		id: 'site-link:inaccessible',
+		issueCardDisplay: { label: 'Website: Inaccessible' },
 		label: 'Inaccessible',
 	}),
 	linkSuggestionSection('site'),
@@ -306,11 +328,13 @@ export const storeReviewPanel = panel({
 	toggle({
 		issue: linksIssue,
 		id: 'store-link:misused',
+		issueCardDisplay: { label: 'Store: Misused' },
 		label: 'Misused',
 	}),
 	toggle({
 		issue: linksIssue,
 		id: 'store-link:inaccessible',
+		issueCardDisplay: { label: 'Store: Inaccessible' },
 		label: 'Inaccessible',
 	}),
 	linkSuggestionSection('store'),
@@ -327,11 +351,13 @@ export const patreonReviewPanel = panel({
 	toggle({
 		issue: linksIssue,
 		id: 'patreon-link:misused',
+		issueCardDisplay: { label: 'Patreon: Misused' },
 		label: 'Misused',
 	}),
 	toggle({
 		issue: linksIssue,
 		id: 'patreon-link:inaccessible',
+		issueCardDisplay: { label: 'Patreon: Inaccessible' },
 		label: 'Inaccessible',
 	}),
 	linkSuggestionSection('patreon'),
@@ -348,11 +374,13 @@ export const bmacReviewPanel = panel({
 	toggle({
 		issue: linksIssue,
 		id: 'bmac-link:misused',
+		issueCardDisplay: { label: 'Buy Me A Coffee: Misused' },
 		label: 'Misused',
 	}),
 	toggle({
 		issue: linksIssue,
 		id: 'bmac-link:inaccessible',
+		issueCardDisplay: { label: 'Buy Me A Coffee: Inaccessible' },
 		label: 'Inaccessible',
 	}),
 	linkSuggestionSection('bmac'),
@@ -369,11 +397,13 @@ export const paypalReviewPanel = panel({
 	toggle({
 		issue: linksIssue,
 		id: 'paypal-link:misused',
+		issueCardDisplay: { label: 'PayPal: Misused' },
 		label: 'Misused',
 	}),
 	toggle({
 		issue: linksIssue,
 		id: 'paypal-link:inaccessible',
+		issueCardDisplay: { label: 'PayPal: Inaccessible' },
 		label: 'Inaccessible',
 	}),
 	linkSuggestionSection('paypal'),
@@ -390,11 +420,13 @@ export const githubReviewPanel = panel({
 	toggle({
 		issue: linksIssue,
 		id: 'github-link:misused',
+		issueCardDisplay: { label: 'GitHub Sponsors: Misused' },
 		label: 'Misused',
 	}),
 	toggle({
 		issue: linksIssue,
 		id: 'github-link:inaccessible',
+		issueCardDisplay: { label: 'GitHub Sponsors: Inaccessible' },
 		label: 'Inaccessible',
 	}),
 	linkSuggestionSection('github'),
@@ -411,11 +443,13 @@ export const koFiReviewPanel = panel({
 	toggle({
 		issue: linksIssue,
 		id: 'ko-fi-link:misused',
+		issueCardDisplay: { label: 'Ko-fi: Misused' },
 		label: 'Misused',
 	}),
 	toggle({
 		issue: linksIssue,
 		id: 'ko-fi-link:inaccessible',
+		issueCardDisplay: { label: 'Ko-fi: Inaccessible' },
 		label: 'Inaccessible',
 	}),
 	linkSuggestionSection('ko-fi'),
@@ -432,11 +466,13 @@ export const otherReviewPanel = panel({
 	toggle({
 		issue: linksIssue,
 		id: 'other-link:misused',
+		issueCardDisplay: { label: 'Other: Misused' },
 		label: 'Misused',
 	}),
 	toggle({
 		issue: linksIssue,
 		id: 'other-link:inaccessible',
+		issueCardDisplay: { label: 'Other: Inaccessible' },
 		label: 'Inaccessible',
 	}),
 	linkSuggestionSection('other'),
diff --git a/packages/moderation/src/data/issues/post-approval.ts b/packages/moderation/src/data/issues/post-approval.ts
index 6c174449e6b..4c816715048 100644
--- a/packages/moderation/src/data/issues/post-approval.ts
+++ b/packages/moderation/src/data/issues/post-approval.ts
@@ -53,16 +53,25 @@ export const postApprovalReviewPanel = panel({
 			issue: postApprovalMetadataIssueIssue,
 			label: 'Missing Dependencies',
 			id: 'post-approval-dependencies',
+			issueCardDisplay: {
+				label: 'Missing Dependencies',
+			},
 		}),
 		toggle({
 			issue: postApprovalMetadataIssueIssue,
 			label: 'Game versions',
 			id: 'post-approval-mc-versions',
+			issueCardDisplay: {
+				label: 'Game versions',
+			},
 		}),
 		toggle({
 			issue: postApprovalMetadataIssueIssue,
 			label: 'Loaders',
 			id: 'post-approval-loaders',
+			issueCardDisplay: {
+				label: 'Loaders',
+			},
 		}),
 		section({
 			shown: ({ selected }) => selected.toggleIds.includes('post-approval-dependencies'),
@@ -104,6 +113,7 @@ export const postApprovalReviewPanel = panel({
 			issue: postApprovalMetadataIssueIssue,
 			label: 'Inconsistent Licensing',
 			id: 'post-approval-license',
+			issueCardDisplay: { label: 'Inconsistent Licensing' },
 		}),
 	),
 )
diff --git a/packages/moderation/src/data/issues/re-review.ts b/packages/moderation/src/data/issues/re-review.ts
index 357a707a2c0..7661d2a8a61 100644
--- a/packages/moderation/src/data/issues/re-review.ts
+++ b/packages/moderation/src/data/issues/re-review.ts
@@ -34,6 +34,9 @@ export const reReviewReviewPanel = panel({
 		issue: reReviewIgnoredIssue,
 		label: 'Multiple times in a row',
 		id: 're-review-warning',
+		issueCardDisplay: {
+			label: 'Multiple times in a row',
+		},
 		shown: (ctx) => ctx.selected.issueIds.includes(reReviewIgnoredIssue.id),
 	}),
 )
diff --git a/packages/moderation/src/data/issues/reupload.ts b/packages/moderation/src/data/issues/reupload.ts
index bd3bd5dc05a..13ed1e33fca 100644
--- a/packages/moderation/src/data/issues/reupload.ts
+++ b/packages/moderation/src/data/issues/reupload.ts
@@ -263,6 +263,9 @@ export const reuploadReviewPanel = panel({
 			issue: reuploadCustomPackVerificationIssue,
 			label: 'List overrides?',
 			id: 'reupload-list',
+			issueCardDisplay: {
+				label: 'Reupload: List overrides?',
+			},
 		}),
 		section({
 			shown: ({ selected }) => selected.toggleIds.includes('reupload-list'),
diff --git a/packages/moderation/src/data/issues/rules.ts b/packages/moderation/src/data/issues/rules.ts
index 0e876d22978..106ce83a240 100644
--- a/packages/moderation/src/data/issues/rules.ts
+++ b/packages/moderation/src/data/issues/rules.ts
@@ -94,7 +94,10 @@ export const rulesAiImagesIssue = issue({
 			}))
 		}
 		if (imageIds.length) {
-			actions.push(() => ({ type: 'remove_gallery_images', value: { image_ids: imageIds } }))
+			actions.push(() => ({
+				type: 'remove_gallery_images',
+				value: { image_ids: imageIds },
+			}))
 		}
 		return actions
 	},
@@ -233,61 +236,97 @@ export const rulesReviewPanel = panel({
 			issue: rulesProhibitedContentIssue,
 			label: 'Objectionable',
 			id: 'rules-prohibited-content-objectionable',
+			issueCardDisplay: {
+				label: 'Objectionable',
+			},
 		}),
 		toggle({
 			issue: rulesProhibitedContentIssue,
 			label: 'Discriminatory or Explicit',
 			id: 'rules-prohibited-content-discriminatory',
+			issueCardDisplay: {
+				label: 'Discriminatory or Explicit',
+			},
 		}),
 		toggle({
 			issue: rulesProhibitedContentIssue,
 			label: 'IP Infringement',
 			id: 'rules-prohibited-content-ip-infringement',
+			issueCardDisplay: {
+				label: 'IP Infringement',
+			},
 		}),
 		toggle({
 			issue: rulesProhibitedContentIssue,
 			label: 'Rights Violation',
 			id: 'rules-prohibited-content-legal-rights',
+			issueCardDisplay: {
+				label: 'Rights Violation',
+			},
 		}),
 		toggle({
 			issue: rulesProhibitedContentIssue,
 			label: 'Illegal Activity',
 			id: 'rules-prohibited-content-illegal-activity',
+			issueCardDisplay: {
+				label: 'Illegal Activity',
+			},
 		}),
 		toggle({
 			issue: rulesProhibitedContentIssue,
 			label: 'Harmful or Deceptive',
 			id: 'rules-prohibited-content-harmful',
+			issueCardDisplay: {
+				label: 'Harmful or Deceptive',
+			},
 		}),
 		toggle({
 			issue: rulesProhibitedContentIssue,
 			label: 'Misleading claims',
 			id: 'rules-prohibited-content-misleading',
+			issueCardDisplay: {
+				label: 'Misleading claims',
+			},
 		}),
 		toggle({
 			issue: rulesProhibitedContentIssue,
 			label: 'Impersonation',
 			id: 'rules-prohibited-content-impersonation',
+			issueCardDisplay: {
+				label: 'Impersonation',
+			},
 		}),
 		toggle({
 			issue: rulesProhibitedContentIssue,
 			label: 'False Endorsement',
 			id: 'rules-prohibited-content-false-endorsement',
+			issueCardDisplay: {
+				label: 'False Endorsement',
+			},
 		}),
 		toggle({
 			issue: rulesProhibitedContentIssue,
 			label: 'Profanity',
 			id: 'rules-prohibited-content-profanity',
+			issueCardDisplay: {
+				label: 'Profanity',
+			},
 		}),
 		toggle({
 			issue: rulesProhibitedContentIssue,
 			label: 'Undisclosed Data Upload',
 			id: 'rules-prohibited-content-undisclosed-upload',
+			issueCardDisplay: {
+				label: 'Undisclosed Data Upload',
+			},
 		}),
 		toggle({
 			issue: rulesProhibitedContentIssue,
 			label: 'Mojang Bypass',
 			id: 'rules-prohibited-content-mojang-bypass',
+			issueCardDisplay: {
+				label: 'Mojang Bypass',
+			},
 		}),
 	),
 	section({
@@ -315,6 +354,9 @@ export const rulesReviewPanel = panel({
 			issue: rulesProhibitedContentIssue,
 			label: 'Piracy',
 			id: 'rules-prohibited-content-illegal-activity-piracy',
+			issueCardDisplay: {
+				label: 'Piracy',
+			},
 		}),
 	),
 )
diff --git a/packages/moderation/src/data/issues/server.ts b/packages/moderation/src/data/issues/server.ts
index a8e27874ada..4a056f76f64 100644
--- a/packages/moderation/src/data/issues/server.ts
+++ b/packages/moderation/src/data/issues/server.ts
@@ -110,6 +110,9 @@ export const serverReviewPanel = panel({
 				issue: reuploadCustomPackVerificationIssue,
 				label: 'List overrides?',
 				id: 'server-list',
+				issueCardDisplay: {
+					label: 'Server details: List overrides?',
+				},
 			}),
 			section({
 				shown: ({ selected }) => selected.toggleIds.includes('server-list'),
diff --git a/packages/moderation/src/data/issues/title.ts b/packages/moderation/src/data/issues/title.ts
index b05e6c8ce9f..783a87cee7e 100644
--- a/packages/moderation/src/data/issues/title.ts
+++ b/packages/moderation/src/data/issues/title.ts
@@ -90,12 +90,18 @@ export const titleReviewPanel = panel({
 		toggle({
 			label: 'Forked Project',
 			id: 'title-similarities-fork',
+			issueCardDisplay: {
+				label: 'Forked Project',
+			},
 			issue: titleSimilaritiesIssue,
 			shown: (ctx) => !ctx.projectV3.minecraft_server,
 		}),
 		toggle({
 			label: 'Modpack Named After Mod',
 			id: 'title-similarities-modpack',
+			issueCardDisplay: {
+				label: 'Modpack Named After Mod',
+			},
 			issue: titleSimilaritiesIssue,
 			shown: (ctx) => ctx.projectV3.project_types.includes('modpack'),
 		}),

From 48db1120f76fc4081dc3343c8149a9d5489fccc9 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Mon, 19 Oct 2026 18:39:29 -0600
Subject: [PATCH 19/28] small fixes

---
 .../project-review/review-messages.ts         |  2 +
 .../providers/project-review/review-panels.ts | 41 ++++++++++++++-----
 2 files changed, 32 insertions(+), 11 deletions(-)

diff --git a/apps/frontend/src/providers/project-review/review-messages.ts b/apps/frontend/src/providers/project-review/review-messages.ts
index 0b49175695e..88919c6a68b 100644
--- a/apps/frontend/src/providers/project-review/review-messages.ts
+++ b/apps/frontend/src/providers/project-review/review-messages.ts
@@ -34,6 +34,8 @@ export function createReviewMessages(
 	}
 	function previewIssueMessage(entry: ReviewIssueControl) {
 		if (panels.selected(entry.binding, entry.control)) return issueMessage(entry.control.issueId)
+		const override = overrides.get(entry.control.issueId)
+		if (override !== undefined) return override
 		const current = project.value
 		const legacy = projectV2.value
 		if (!current || !legacy || current.id !== legacy.id) return ''
diff --git a/apps/frontend/src/providers/project-review/review-panels.ts b/apps/frontend/src/providers/project-review/review-panels.ts
index e56f2e6bd72..d2e90067fdd 100644
--- a/apps/frontend/src/providers/project-review/review-panels.ts
+++ b/apps/frontend/src/providers/project-review/review-panels.ts
@@ -325,10 +325,23 @@ export function createReviewPanels(
 		]
 	})
 
-	const panels = computed(() => {
+	function resolvePanels(preview?: ReviewIssueControl) {
 		const bindings = new Map<string, ReviewPanelBinding>()
 		const projectV3 = project.value
 		if (!projectV3) return bindings
+		const issueIds = preview
+			? [...new Set([...selectedIssueIds.value, preview.control.issueId])]
+			: selectedIssueIds.value
+		const toggleIds = (issueId: string) => {
+			const ids = new Set(selectedToggleIds(projectV3.id, issueId))
+			if (preview?.control.type === 'toggle' && preview.control.issueId === issueId) {
+				for (const id of preview.control.childToggleIds ??
+					(preview.control.id === undefined ? [] : [preview.control.id])) {
+					ids.add(id)
+				}
+			}
+			return [...ids]
+		}
 		const showAllIssueControls = reviewData.value.showAllIssueControls === true
 		const context: ReviewContext = {
 			projectV3,
@@ -341,11 +354,11 @@ export function createReviewPanels(
 				textValues(projectV3.id, issueId)[id] ?? textValues(projectV3.id, '')[id] ?? '',
 			selected: {
 				items: {},
-				issueIds: selectedIssueIds.value,
+				issueIds,
 				toggleIds: [
 					...new Set(
-						Object.values(session.read(projectV3.id, 'issues')).flatMap((keys) =>
-							keys instanceof Set ? [...keys] : [],
+						[...Object.keys(session.read(projectV3.id, 'issues')), ...issueIds].flatMap(
+							toggleIds,
 						),
 					),
 				],
@@ -398,10 +411,8 @@ export function createReviewPanels(
 						getSelectValues: (id, scope = issueId) => contextSelectValues(projectV3.id, scope, id),
 						selected: {
 							items: {},
-							issueIds: selectedIssueIds.value,
-							toggleIds: issue
-								? [...selectedToggleIds(projectV3.id, issueId)]
-								: context.selected.toggleIds,
+							issueIds,
+							toggleIds: issue ? toggleIds(issueId) : context.selected.toggleIds,
 						},
 					}
 					if (!showAllIssueControls && resolveWithContext(node.shown, issueContext) === false)
@@ -517,7 +528,9 @@ export function createReviewPanels(
 			}
 		}
 		return bindings
-	})
+	}
+
+	const panels = computed(() => resolvePanels())
 
 	function resolve(target: ReviewTarget) {
 		if (target.kind === 'panel') return panels.value.get(target.key)
@@ -786,6 +799,7 @@ export function createReviewPanels(
 	function resolveActiveIssues(preview?: ReviewIssueControl) {
 		const projectV3 = project.value
 		if (!projectV3) return []
+		const bindings = preview ? resolvePanels(preview) : panels.value
 		const issues = new Map<string, IssueSelection>()
 		const sharedInputs = {
 			textValues: {} as Record<string, string>,
@@ -816,7 +830,7 @@ export function createReviewPanels(
 				missing: [],
 			})
 		}
-		for (const binding of panels.value.values()) {
+		for (const binding of bindings.values()) {
 			for (const section of binding.panel.sections) {
 				for (const control of section.controls) {
 					if (!control.issue) {
@@ -831,7 +845,12 @@ export function createReviewPanels(
 						control.childToggleIds ||
 						control.disabled ||
 						(control.type === 'toggle' &&
-							control !== preview?.control &&
+							!(
+								binding.key === preview?.binding.key &&
+								control.issueId === preview.control.issueId &&
+								preview.control.type === 'toggle' &&
+								control.id === preview.control.id
+							) &&
 							!(
 								control.issueId === preview?.control.issueId &&
 								control.id !== undefined &&

From f3d07c9f1899b2ed255feabba2ca91f8200e4456 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Mon, 19 Oct 2026 18:48:03 -0600
Subject: [PATCH 20/28] polish

---
 .../project-review/review-panel/findings-count-badge.vue        | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/frontend/src/components/project-review/review-panel/findings-count-badge.vue b/apps/frontend/src/components/project-review/review-panel/findings-count-badge.vue
index f00a5d95215..6cbe6980b78 100644
--- a/apps/frontend/src/components/project-review/review-panel/findings-count-badge.vue
+++ b/apps/frontend/src/components/project-review/review-panel/findings-count-badge.vue
@@ -3,7 +3,7 @@
 		v-if="count > 0"
 		class="pointer-events-none flex h-[18px] min-w-[18px] shrink-0 items-center justify-center rounded-full border border-solid border-highlight-orange bg-highlight-orange px-1 text-xs font-medium leading-none text-orange"
 	>
-		<span aria-hidden="true">{{ count }}</span>
+		<span aria-hidden="true" class="[text-box:trim-both_cap_alphabetic]">{{ count }}</span>
 		<span class="sr-only">{{ formatMessage(messages.selectedFindings, { count }) }}</span>
 	</span>
 </template>

From 9de5519689c78925a48eb7bc9dc0f45788cf6d9c Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Tue, 20 Oct 2026 12:08:19 -0600
Subject: [PATCH 21/28] feat: new disclosure cards layout in project review

---
 .../disclosures/AdvertisingDisclosureCard.vue |  22 +-
 .../disclosures/AiDisclosureCard.vue          |  42 ++--
 .../AiFunctionalityDisclosureCard.vue         |  22 +-
 .../disclosures/ArchivedDisclosureCard.vue    |  23 +-
 .../disclosures/DerivativeDisclosureCard.vue  |  69 ++++--
 .../disclosures/DisclosureCards.vue           | 232 +++++++-----------
 .../disclosures/DisclosureExplanation.vue     | 164 +++++++++++++
 .../disclosures/DisclosureLockControls.vue    |  87 ++++++-
 .../disclosures/DisclosureToggleCard.vue      |   1 +
 .../PhotosensitivityDisclosureCard.vue        |  22 +-
 .../ProjectReviewDisclosureCard.vue           |   9 +-
 .../SystemInteractionsDisclosureCard.vue      |  22 +-
 .../disclosures/draft-context.ts              |   7 +
 .../disclosures/use-disclosure-editor.ts      |   4 +-
 packages/ui/src/components/base/Combobox.vue  |  20 +-
 15 files changed, 483 insertions(+), 263 deletions(-)
 create mode 100644 apps/frontend/src/components/ui/project-settings/disclosures/DisclosureExplanation.vue
 create mode 100644 apps/frontend/src/components/ui/project-settings/disclosures/draft-context.ts

diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/AdvertisingDisclosureCard.vue b/apps/frontend/src/components/ui/project-settings/disclosures/AdvertisingDisclosureCard.vue
index 0972d657ba8..1d885314116 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/AdvertisingDisclosureCard.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/AdvertisingDisclosureCard.vue
@@ -5,11 +5,10 @@ import {
 	defineMessages,
 	IntlFormatted,
 	normalizeChildren,
-	SettingsFormGroup,
-	Textarea,
 	useVIntl,
 } from '@modrinth/ui'
 
+import DisclosureExplanation from './DisclosureExplanation.vue'
 import DisclosureToggleCard from './DisclosureToggleCard.vue'
 import type { DisclosureCardMetaProps, DisclosureLockStatus, NoteDisclosure } from './types'
 
@@ -68,20 +67,15 @@ const messages = defineMessages({
 			</IntlFormatted>
 		</p>
 		<template #expanded>
-			<SettingsFormGroup
+			<DisclosureExplanation
+				v-model="model.note"
 				:title="formatMessage(commonMessages.explanationLabel)"
 				title-for="advertising-disclosure-note"
-			>
-				<Textarea
-					id="advertising-disclosure-note"
-					v-model="model.note"
-					:rows="3"
-					:resize="showLockControls ? 'vertical' : 'none'"
-					class="max-w-[40rem]"
-					:disabled="disabled"
-					:placeholder="formatMessage(messages.notePlaceholder)"
-				/>
-			</SettingsFormGroup>
+				:variant="variant"
+				:resize="showLockControls ? 'vertical' : 'none'"
+				:disabled="disabled"
+				:placeholder="formatMessage(messages.notePlaceholder)"
+			/>
 		</template>
 	</DisclosureToggleCard>
 </template>
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/AiDisclosureCard.vue b/apps/frontend/src/components/ui/project-settings/disclosures/AiDisclosureCard.vue
index b423461bc73..e1750936d2b 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/AiDisclosureCard.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/AiDisclosureCard.vue
@@ -6,12 +6,13 @@ import {
 	defineMessages,
 	disclosureAiUsageMessages,
 	IntlFormatted,
+	MultiSelect,
 	normalizeChildren,
 	SettingsFormGroup,
-	Textarea,
 	useVIntl,
 } from '@modrinth/ui'
 
+import DisclosureExplanation from './DisclosureExplanation.vue'
 import DisclosureToggleCard from './DisclosureToggleCard.vue'
 import type { AiDisclosure, AiUsage, DisclosureCardMetaProps, DisclosureLockStatus } from './types'
 
@@ -45,6 +46,10 @@ const messages = defineMessages({
 		defaultMessage:
 			"Still unsure? Refer to our guide to <faq-link>Disclosure and Usage of AI</faq-link> and section 6 of <rules>Modrinth's Content Rules</rules> for more information.",
 	},
+	selectUses: {
+		id: 'project-review.disclosures.select-ai-uses',
+		defaultMessage: 'Select AI usages',
+	},
 	typesDescription: {
 		id: 'project.settings.disclosures.ai.types-description',
 		defaultMessage: 'What types of content have been generated with AI?',
@@ -107,7 +112,21 @@ function setUse(use: AiUsage, enabled: boolean) {
 		</p>
 		<template #expanded>
 			<SettingsFormGroup :title="formatMessage(messages.typesDescription)">
-				<div class="flex flex-col gap-2">
+				<MultiSelect
+					v-if="variant === 'review'"
+					v-model="model.uses"
+					:options="
+						AI_USES.map((use) => ({
+							value: use,
+							label: formatMessage(disclosureAiUsageMessages[use]),
+						}))
+					"
+					:aria-label="formatMessage(messages.typesDescription)"
+					:placeholder="formatMessage(messages.selectUses)"
+					:disabled="disabled"
+					class="w-full max-w-[24rem]"
+				/>
+				<div v-else class="flex flex-col gap-2">
 					<Checkbox
 						v-for="use in AI_USES"
 						:key="use"
@@ -119,21 +138,16 @@ function setUse(use: AiUsage, enabled: boolean) {
 					</Checkbox>
 				</div>
 			</SettingsFormGroup>
-			<SettingsFormGroup
+			<DisclosureExplanation
+				v-model="model.note"
 				:title="formatMessage(commonMessages.explanationLabel)"
 				title-for="ai-disclosure-note"
 				optional
-			>
-				<Textarea
-					id="ai-disclosure-note"
-					v-model="model.note"
-					:rows="3"
-					:resize="showLockControls ? 'vertical' : 'none'"
-					class="max-w-[40rem]"
-					:disabled="disabled"
-					:placeholder="formatMessage(messages.notePlaceholder)"
-				/>
-			</SettingsFormGroup>
+				:variant="variant"
+				:resize="showLockControls ? 'vertical' : 'none'"
+				:disabled="disabled"
+				:placeholder="formatMessage(messages.notePlaceholder)"
+			/>
 		</template>
 	</DisclosureToggleCard>
 </template>
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/AiFunctionalityDisclosureCard.vue b/apps/frontend/src/components/ui/project-settings/disclosures/AiFunctionalityDisclosureCard.vue
index 3283701ba4c..2810ef19556 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/AiFunctionalityDisclosureCard.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/AiFunctionalityDisclosureCard.vue
@@ -1,7 +1,8 @@
 <script setup lang="ts">
 import { BrainCogIcon } from '@modrinth/assets'
-import { commonMessages, defineMessages, SettingsFormGroup, Textarea, useVIntl } from '@modrinth/ui'
+import { commonMessages, defineMessages, useVIntl } from '@modrinth/ui'
 
+import DisclosureExplanation from './DisclosureExplanation.vue'
 import DisclosureToggleCard from './DisclosureToggleCard.vue'
 import type { DisclosureCardMetaProps, DisclosureLockStatus, NoteDisclosure } from './types'
 
@@ -43,21 +44,16 @@ const messages = defineMessages({
 		@set-lock-status="emit('setLockStatus', $event)"
 	>
 		<template #expanded>
-			<SettingsFormGroup
+			<DisclosureExplanation
+				v-model="model.note"
 				:title="formatMessage(commonMessages.explanationLabel)"
 				title-for="ai-functionality-disclosure-note"
 				optional
-			>
-				<Textarea
-					id="ai-functionality-disclosure-note"
-					v-model="model.note"
-					:rows="3"
-					:resize="showLockControls ? 'vertical' : 'none'"
-					class="max-w-[40rem]"
-					:disabled="disabled"
-					:placeholder="formatMessage(messages.notePlaceholder)"
-				/>
-			</SettingsFormGroup>
+				:variant="variant"
+				:resize="showLockControls ? 'vertical' : 'none'"
+				:disabled="disabled"
+				:placeholder="formatMessage(messages.notePlaceholder)"
+			/>
 		</template>
 	</DisclosureToggleCard>
 </template>
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/ArchivedDisclosureCard.vue b/apps/frontend/src/components/ui/project-settings/disclosures/ArchivedDisclosureCard.vue
index dee0de00d4e..545b03ff643 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/ArchivedDisclosureCard.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/ArchivedDisclosureCard.vue
@@ -5,10 +5,10 @@ import {
 	commonMessages,
 	defineMessages,
 	SettingsFormGroup,
-	Textarea,
 	useVIntl,
 } from '@modrinth/ui'
 
+import DisclosureExplanation from './DisclosureExplanation.vue'
 import DisclosureToggleCard from './DisclosureToggleCard.vue'
 import type { DisclosureCardMetaProps, DisclosureLockStatus, NoteDisclosure } from './types'
 
@@ -64,22 +64,17 @@ const messages = defineMessages({
 		<p>{{ formatMessage(messages.description1) }}</p>
 		<p>{{ formatMessage(messages.description2) }}</p>
 		<template #expanded>
-			<SettingsFormGroup
+			<DisclosureExplanation
+				v-model="model.note"
 				:title="formatMessage(commonMessages.explanationLabel)"
 				title-for="archived-disclosure-note"
 				optional
-			>
-				<Textarea
-					id="archived-disclosure-note"
-					v-model="model.note"
-					:rows="3"
-					:resize="showLockControls ? 'vertical' : 'none'"
-					class="max-w-[40rem]"
-					:disabled="disabled"
-					:placeholder="formatMessage(messages.notePlaceholder)"
-				/>
-			</SettingsFormGroup>
-			<SettingsFormGroup :title="formatMessage(messages.bannerPreview)">
+				:variant="variant"
+				:resize="showLockControls ? 'vertical' : 'none'"
+				:disabled="disabled"
+				:placeholder="formatMessage(messages.notePlaceholder)"
+			/>
+			<SettingsFormGroup v-if="variant !== 'review'" :title="formatMessage(messages.bannerPreview)">
 				<ArchivedProjectBanner :title="projectTitle" :reason="model.note" />
 			</SettingsFormGroup>
 		</template>
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/DerivativeDisclosureCard.vue b/apps/frontend/src/components/ui/project-settings/disclosures/DerivativeDisclosureCard.vue
index e8e7a91aedd..2b9ef73cfa0 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/DerivativeDisclosureCard.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/DerivativeDisclosureCard.vue
@@ -7,11 +7,11 @@ import {
 	defineMessages,
 	Input,
 	SettingsFormGroup,
-	Textarea,
 	useVIntl,
 } from '@modrinth/ui'
-import { watch } from 'vue'
+import { computed, toRaw, useId, watch } from 'vue'
 
+import DisclosureExplanation from './DisclosureExplanation.vue'
 import DisclosureToggleCard from './DisclosureToggleCard.vue'
 import type {
 	DerivativeDisclosure,
@@ -29,6 +29,22 @@ const emit = defineEmits<{
 }>()
 
 const { formatMessage } = useVIntl()
+const sourceIdPrefix = useId()
+const sourceIds = new WeakMap<DerivativeSource, string>()
+let nextSourceId = 0
+const sources = computed(() =>
+	model.value.sources.map((source) => ({ source, id: getSourceId(source) })),
+)
+
+function getSourceId(source: DerivativeSource): string {
+	const rawSource = toRaw(source)
+	let id = sourceIds.get(rawSource)
+	if (!id) {
+		id = `${sourceIdPrefix}-${nextSourceId++}`
+		sourceIds.set(rawSource, id)
+	}
+	return id
+}
 
 const messages = defineMessages({
 	title: {
@@ -76,9 +92,12 @@ function emptyDerivativeSource(): DerivativeSource {
 }
 
 function updateSource(index: number, patch: Partial<DerivativeSource>) {
-	model.value.sources = model.value.sources.map((source, i) =>
-		i === index ? { ...source, ...patch } : source,
-	)
+	model.value.sources = model.value.sources.map((source, i) => {
+		if (i !== index) return source
+		const updated = { ...source, ...patch }
+		sourceIds.set(updated, getSourceId(source))
+		return updated
+	})
 }
 
 watch(
@@ -122,8 +141,8 @@ function setOptionalField(
 	>
 		<template #expanded>
 			<div
-				v-for="(source, index) in model.sources"
-				:key="index"
+				v-for="({ source, id }, index) in sources"
+				:key="id"
 				class="relative flex flex-col gap-4 rounded-2xl border border-solid border-surface-4 bg-surface-3 p-4"
 			>
 				<div class="absolute right-3 top-3">
@@ -140,22 +159,25 @@ function setOptionalField(
 				</div>
 				<SettingsFormGroup
 					:title="formatMessage(messages.nameLabel)"
-					:title-for="`derivative-name-${index}`"
+					:title-for="`derivative-name-${id}`"
 					class="max-w-[40rem]"
 				>
 					<Input
-						:id="`derivative-name-${index}`"
+						:id="`derivative-name-${id}`"
 						:model-value="source.label"
 						:disabled="disabled"
 						:placeholder="formatMessage(messages.namePlaceholder)"
 						@update:model-value="
-							(value) => updateSource(index, { label: typeof value === 'string' ? value : '' })
+							(value) =>
+								updateSource(index, {
+									label: typeof value === 'string' ? value : '',
+								})
 						"
 					/>
 				</SettingsFormGroup>
 				<SettingsFormGroup
 					:title="formatMessage(messages.linkLabel)"
-					:title-for="`derivative-link-${index}`"
+					:title-for="`derivative-link-${id}`"
 					class="max-w-[40rem]"
 				>
 					<template #title-right>
@@ -172,7 +194,7 @@ function setOptionalField(
 						</ButtonLink>
 					</template>
 					<Input
-						:id="`derivative-link-${index}`"
+						:id="`derivative-link-${id}`"
 						:model-value="source.link ?? undefined"
 						type="url"
 						:disabled="disabled"
@@ -180,21 +202,16 @@ function setOptionalField(
 						@update:model-value="(value) => setOptionalField(index, 'link', value)"
 					/>
 				</SettingsFormGroup>
-				<SettingsFormGroup
+				<DisclosureExplanation
 					:title="formatMessage(messages.noteLabel)"
-					:title-for="`derivative-note-${index}`"
-					class="max-w-[40rem]"
-				>
-					<Textarea
-						:id="`derivative-note-${index}`"
-						:model-value="source.note ?? undefined"
-						:rows="3"
-						:resize="showLockControls ? 'vertical' : 'none'"
-						:disabled="disabled"
-						:placeholder="formatMessage(messages.notePlaceholder)"
-						@update:model-value="(value) => setOptionalField(index, 'note', value)"
-					/>
-				</SettingsFormGroup>
+					:title-for="`derivative-note-${id}`"
+					:variant="variant"
+					:model-value="source.note ?? undefined"
+					:resize="showLockControls ? 'vertical' : 'none'"
+					:disabled="disabled"
+					:placeholder="formatMessage(messages.notePlaceholder)"
+					@update:model-value="(value) => setOptionalField(index, 'note', value)"
+				/>
 			</div>
 			<Button class="w-fit" :disabled="disabled" @click="addSource">
 				<PlusIcon />
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureCards.vue b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureCards.vue
index ef6d6b16198..1112fe18db5 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureCards.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureCards.vue
@@ -1,4 +1,6 @@
 <script setup lang="ts">
+import { computed } from 'vue'
+
 import ReviewPanel from '~/components/project-review/review-panel/index.vue'
 import { injectReviewPanels } from '~/providers/project-review/review-panels'
 
@@ -7,11 +9,12 @@ import AiDisclosureCard from './AiDisclosureCard.vue'
 import AiFunctionalityDisclosureCard from './AiFunctionalityDisclosureCard.vue'
 import ArchivedDisclosureCard from './ArchivedDisclosureCard.vue'
 import DerivativeDisclosureCard from './DerivativeDisclosureCard.vue'
+import { provideDisclosureDraft } from './draft-context'
 import PaidFeaturesDisclosureCard from './PaidFeaturesDisclosureCard.vue'
 import PhotosensitivityDisclosureCard from './PhotosensitivityDisclosureCard.vue'
 import SystemInteractionsDisclosureCard from './SystemInteractionsDisclosureCard.vue'
 import TelemetryDisclosureCard from './TelemetryDisclosureCard.vue'
-import type { DisclosureLockStatus } from './types'
+import type { DisclosureLockStatus, DisclosureType } from './types'
 import type { useDisclosureEditor } from './use-disclosure-editor'
 
 const props = withDefaults(
@@ -25,6 +28,7 @@ const props = withDefaults(
 )
 const { current, disclosureUpdateProps, setDisclosureLockStatus, isDisclosureVisible } =
 	props.editor
+provideDisclosureDraft(current)
 const panels = injectReviewPanels(null)
 
 function reviewTitle(key: string): string | undefined {
@@ -32,215 +36,169 @@ function reviewTitle(key: string): string | undefined {
 		? panels?.resolve({ kind: 'disclosure', key })?.panel.title
 		: undefined
 }
+
+const cards = computed(() => {
+	const activeTypes = new Set(props.editor.savedSnapshot.value.disclosures.map(({ type }) => type))
+	const visible = [
+		{ type: 'ai_content', key: 'ai', enabled: activeTypes.has('ai_content') },
+		{
+			type: 'ai_functionality',
+			key: 'ai-functionality',
+			enabled: activeTypes.has('ai_functionality'),
+		},
+		{
+			type: 'advertisements',
+			key: 'ads',
+			enabled: activeTypes.has('advertisements'),
+		},
+		{
+			type: 'paid_features',
+			key: 'paid-features',
+			enabled: activeTypes.has('paid_features'),
+		},
+		{
+			type: 'telemetry',
+			key: 'telemetry',
+			enabled: activeTypes.has('telemetry'),
+		},
+		{
+			type: 'derivative_work',
+			key: 'derivative-content',
+			enabled: activeTypes.has('derivative_work'),
+		},
+		{
+			type: 'epilepsy_triggers',
+			key: 'photosensitivity',
+			enabled: activeTypes.has('epilepsy_triggers'),
+		},
+		{
+			type: 'system_interactions',
+			key: 'system-interactions',
+			enabled: activeTypes.has('system_interactions'),
+		},
+		{
+			type: 'archived',
+			key: 'archive',
+			enabled: activeTypes.has('archived'),
+		},
+	] satisfies { type: DisclosureType; key: string; enabled: boolean }[]
+	const filtered = visible.filter(({ type }) => isDisclosureVisible(type))
+	return props.variant === 'review'
+		? filtered.sort((a, b) => Number(b.enabled) - Number(a.enabled))
+		: filtered
+})
 </script>
 
 <template>
 	<div class="flex flex-col gap-4">
 		<component
 			:is="variant === 'review' ? ReviewPanel : 'div'"
-			v-if="isDisclosureVisible('ai_content')"
+			v-for="card in cards"
+			:key="card.type"
 			v-bind="
 				variant === 'review'
-					? {
-							mode: 'anchored',
-							target: { kind: 'disclosure', key: 'ai' },
-						}
+					? { mode: 'anchored', target: { kind: 'disclosure', key: card.key } }
 					: {}
 			"
 		>
 			<AiDisclosureCard
+				v-if="card.type === 'ai_content'"
 				v-model="current.ai"
 				:hide-description="hideDescription"
-				:title="reviewTitle('ai')"
+				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps('ai_content')"
+				v-bind="disclosureUpdateProps(card.type)"
 				@set-lock-status="
-					(status: DisclosureLockStatus) => setDisclosureLockStatus('ai_content', status)
+					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
 			/>
-		</component>
-		<component
-			:is="variant === 'review' ? ReviewPanel : 'div'"
-			v-if="isDisclosureVisible('ai_functionality')"
-			v-bind="
-				variant === 'review'
-					? {
-							mode: 'anchored',
-							target: { kind: 'disclosure', key: 'ai-functionality' },
-						}
-					: {}
-			"
-		>
 			<AiFunctionalityDisclosureCard
+				v-else-if="card.type === 'ai_functionality'"
 				v-model="current.aiFunctionality"
 				:hide-description="hideDescription"
-				:title="reviewTitle('ai-functionality')"
+				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps('ai_functionality')"
+				v-bind="disclosureUpdateProps(card.type)"
 				@set-lock-status="
-					(status: DisclosureLockStatus) => setDisclosureLockStatus('ai_functionality', status)
+					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
 			/>
-		</component>
-		<component
-			:is="variant === 'review' ? ReviewPanel : 'div'"
-			v-if="isDisclosureVisible('advertisements')"
-			v-bind="
-				variant === 'review'
-					? {
-							mode: 'anchored',
-							target: { kind: 'disclosure', key: 'ads' },
-						}
-					: {}
-			"
-		>
 			<AdvertisingDisclosureCard
+				v-else-if="card.type === 'advertisements'"
 				v-model="current.advertising"
 				:hide-description="hideDescription"
-				:title="reviewTitle('ads')"
+				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps('advertisements')"
+				v-bind="disclosureUpdateProps(card.type)"
 				@set-lock-status="
-					(status: DisclosureLockStatus) => setDisclosureLockStatus('advertisements', status)
+					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
 			/>
-		</component>
-		<component
-			:is="variant === 'review' ? ReviewPanel : 'div'"
-			v-if="isDisclosureVisible('paid_features')"
-			v-bind="
-				variant === 'review'
-					? {
-							mode: 'anchored',
-							target: { kind: 'disclosure', key: 'paid-features' },
-						}
-					: {}
-			"
-		>
 			<PaidFeaturesDisclosureCard
+				v-else-if="card.type === 'paid_features'"
 				v-model="current.paidFeatures"
 				:hide-description="hideDescription"
-				:title="reviewTitle('paid-features')"
+				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps('paid_features')"
+				v-bind="disclosureUpdateProps(card.type)"
 				@set-lock-status="
-					(status: DisclosureLockStatus) => setDisclosureLockStatus('paid_features', status)
+					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
 			/>
-		</component>
-		<component
-			:is="variant === 'review' ? ReviewPanel : 'div'"
-			v-if="isDisclosureVisible('telemetry')"
-			v-bind="
-				variant === 'review'
-					? {
-							mode: 'anchored',
-							target: { kind: 'disclosure', key: 'telemetry' },
-						}
-					: {}
-			"
-		>
 			<TelemetryDisclosureCard
+				v-else-if="card.type === 'telemetry'"
 				v-model="current.telemetry"
 				:hide-description="hideDescription"
-				:title="reviewTitle('telemetry')"
+				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps('telemetry')"
+				v-bind="disclosureUpdateProps(card.type)"
 				@set-lock-status="
-					(status: DisclosureLockStatus) => setDisclosureLockStatus('telemetry', status)
+					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
 			/>
-		</component>
-		<component
-			:is="variant === 'review' ? ReviewPanel : 'div'"
-			v-if="isDisclosureVisible('derivative_work')"
-			v-bind="
-				variant === 'review'
-					? {
-							mode: 'anchored',
-							target: { kind: 'disclosure', key: 'derivative-content' },
-						}
-					: {}
-			"
-		>
 			<DerivativeDisclosureCard
+				v-else-if="card.type === 'derivative_work'"
 				v-model="current.derivative"
 				:hide-description="hideDescription"
-				:title="reviewTitle('derivative-content')"
+				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps('derivative_work')"
+				v-bind="disclosureUpdateProps(card.type)"
 				@set-lock-status="
-					(status: DisclosureLockStatus) => setDisclosureLockStatus('derivative_work', status)
+					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
 			/>
-		</component>
-		<component
-			:is="variant === 'review' ? ReviewPanel : 'div'"
-			v-if="isDisclosureVisible('epilepsy_triggers')"
-			v-bind="
-				variant === 'review'
-					? {
-							mode: 'anchored',
-							target: { kind: 'disclosure', key: 'photosensitivity' },
-						}
-					: {}
-			"
-		>
 			<PhotosensitivityDisclosureCard
+				v-else-if="card.type === 'epilepsy_triggers'"
 				v-model="current.photosensitivity"
 				:hide-description="hideDescription"
-				:title="reviewTitle('photosensitivity')"
+				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps('epilepsy_triggers')"
+				v-bind="disclosureUpdateProps(card.type)"
 				@set-lock-status="
-					(status: DisclosureLockStatus) => setDisclosureLockStatus('epilepsy_triggers', status)
+					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
 			/>
-		</component>
-		<component
-			:is="variant === 'review' ? ReviewPanel : 'div'"
-			v-if="isDisclosureVisible('system_interactions')"
-			v-bind="
-				variant === 'review'
-					? {
-							mode: 'anchored',
-							target: { kind: 'disclosure', key: 'system-interactions' },
-						}
-					: {}
-			"
-		>
 			<SystemInteractionsDisclosureCard
+				v-else-if="card.type === 'system_interactions'"
 				v-model="current.systemInteractions"
 				:hide-description="hideDescription"
-				:title="reviewTitle('system-interactions')"
+				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps('system_interactions')"
+				v-bind="disclosureUpdateProps(card.type)"
 				@set-lock-status="
-					(status: DisclosureLockStatus) => setDisclosureLockStatus('system_interactions', status)
+					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
 			/>
-		</component>
-		<component
-			:is="variant === 'review' ? ReviewPanel : 'div'"
-			v-if="isDisclosureVisible('archived')"
-			v-bind="
-				variant === 'review'
-					? {
-							mode: 'anchored',
-							target: { kind: 'disclosure', key: 'archive' },
-						}
-					: {}
-			"
-		>
 			<ArchivedDisclosureCard
+				v-else-if="card.type === 'archived'"
 				v-model="current.archived"
 				:project-title="projectTitle"
 				:hide-description="hideDescription"
-				:title="reviewTitle('archive')"
+				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps('archived')"
+				v-bind="disclosureUpdateProps(card.type)"
 				@set-lock-status="
-					(status: DisclosureLockStatus) => setDisclosureLockStatus('archived', status)
+					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
 			/>
 		</component>
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureExplanation.vue b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureExplanation.vue
new file mode 100644
index 00000000000..fbcd44a2d6f
--- /dev/null
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureExplanation.vue
@@ -0,0 +1,164 @@
+<script setup lang="ts">
+import { ChevronDownIcon } from '@modrinth/assets'
+import {
+	Button,
+	commonMessages,
+	defineMessages,
+	SettingsFormGroup,
+	Textarea,
+	useVIntl,
+} from '@modrinth/ui'
+import { nextTick, onScopeDispose, ref, useId, watch } from 'vue'
+
+import EditButton from '~/components/project-review/project-info/edit/button.vue'
+import { injectReviewShortcuts } from '~/components/project-review/shortcuts'
+
+import { injectDisclosureDraft } from './draft-context'
+
+const props = defineProps<{
+	variant?: 'settings' | 'review'
+	title: string
+	titleFor?: string
+	optional?: boolean
+	disabled?: boolean
+	placeholder?: string
+	resize?: 'none' | 'vertical' | 'both'
+}>()
+const model = defineModel<string | undefined>()
+const { formatMessage } = useVIntl()
+const messages = defineMessages({
+	empty: {
+		id: 'project-review.disclosures.empty-explanation',
+		defaultMessage: 'No explanation provided.',
+	},
+	done: {
+		id: 'project-review.disclosures.done-editing',
+		defaultMessage: 'Done',
+	},
+})
+const expanded = ref(true)
+const editing = ref(false)
+const original = ref<string>()
+const section = ref<HTMLElement>()
+const textarea = ref<InstanceType<typeof Textarea>>()
+const contentId = useId()
+const draft = injectDisclosureDraft(null)
+if (draft) {
+	watch(draft, () => {
+		editing.value = false
+		original.value = undefined
+	})
+}
+const shortcuts = injectReviewShortcuts(null)
+if (shortcuts) {
+	onScopeDispose(
+		shortcuts.registerInteraction({
+			element: () => (props.variant === 'review' ? section.value : undefined),
+			collapse: () => {
+				expanded.value = !expanded.value
+			},
+		}),
+	)
+}
+
+watch(
+	() => props.disabled,
+	(disabled) => {
+		if (disabled) editing.value = false
+	},
+)
+
+async function startEditing() {
+	if (props.disabled) return
+	original.value = model.value
+	expanded.value = true
+	editing.value = true
+	await nextTick()
+	textarea.value?.focus()
+}
+
+function cancelEditing() {
+	model.value = original.value
+	editing.value = false
+}
+</script>
+
+<template>
+	<section
+		v-if="variant === 'review'"
+		ref="section"
+		class="editable-review-section flex min-w-0 flex-col gap-2"
+	>
+		<div class="flex items-center justify-between gap-2">
+			<button
+				type="button"
+				class="flex items-center gap-1 border-0 bg-transparent p-0 font-semibold text-contrast"
+				:aria-expanded="expanded"
+				:aria-controls="contentId"
+				@click="expanded = !expanded"
+			>
+				{{ title }}
+				<ChevronDownIcon
+					class="size-4 transition-transform"
+					:class="{ 'rotate-180': expanded }"
+					aria-hidden="true"
+				/>
+			</button>
+			<div v-if="editing" class="flex shrink-0 gap-1">
+				<Button type="quiet" size="xs" :disabled="disabled" @click="cancelEditing">
+					{{ formatMessage(commonMessages.cancelButton) }}
+				</Button>
+				<Button
+					type="colored"
+					color="brand"
+					size="xs"
+					:disabled="disabled"
+					@click="editing = false"
+				>
+					{{ formatMessage(messages.done) }}
+				</Button>
+			</div>
+			<EditButton v-else :section="title" :disabled="disabled" @click="startEditing" />
+		</div>
+		<div
+			:id="contentId"
+			class="-m-1 grid transition-[grid-template-rows] duration-300 ease-in-out motion-reduce:transition-none"
+			:class="expanded ? 'grid-rows-[1fr]' : 'grid-rows-[0fr]'"
+			:inert="!expanded"
+		>
+			<div class="min-h-0 overflow-hidden">
+				<div class="p-1">
+					<Textarea
+						v-if="editing"
+						ref="textarea"
+						v-model="model"
+						:aria-label="title"
+						:disabled="disabled"
+						:placeholder="placeholder"
+						:rows="3"
+						resize="vertical"
+						class="w-full"
+					/>
+					<p
+						v-else
+						class="m-0 whitespace-pre-wrap break-words"
+						:class="{ 'text-secondary': !model }"
+					>
+						{{ model || formatMessage(messages.empty) }}
+					</p>
+				</div>
+			</div>
+		</div>
+	</section>
+	<SettingsFormGroup v-else :title="title" :title-for="titleFor" :optional="optional">
+		<Textarea
+			:id="titleFor"
+			v-model="model"
+			:rows="3"
+			:resize="resize"
+			class="max-w-[40rem]"
+			:disabled="disabled"
+			:placeholder="placeholder"
+		/>
+	</SettingsFormGroup>
+</template>
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureLockControls.vue b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureLockControls.vue
index d6d7cf59e49..0b268096234 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureLockControls.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureLockControls.vue
@@ -1,15 +1,26 @@
 <script setup lang="ts">
-import { CircleSlashIcon, LockIcon, LockOpenIcon } from '@modrinth/assets'
-import { Button, ButtonGroup, defineMessages, useVIntl } from '@modrinth/ui'
+import { CheckIcon, CircleSlashIcon, LockIcon, LockOpenIcon } from '@modrinth/assets'
+import { Button, ButtonGroup, Combobox, defineMessages, useVIntl } from '@modrinth/ui'
+import { computed } from 'vue'
 
 import type { DisclosureLockStatus } from './types'
 
-defineProps<{ lockStatus: DisclosureLockStatus; disabled?: boolean }>()
+defineProps<{
+	lockStatus: DisclosureLockStatus
+	disabled?: boolean
+	compact?: boolean
+}>()
 const emit = defineEmits<{ setLockStatus: [status: DisclosureLockStatus] }>()
 const { formatMessage } = useVIntl()
 const messages = defineMessages({
-	label: { id: 'project.disclosures.lock-status.label', defaultMessage: 'Lock status' },
-	unlocked: { id: 'project.disclosures.lock-status.unlocked', defaultMessage: 'Unlocked' },
+	label: {
+		id: 'project.disclosures.lock-status.label',
+		defaultMessage: 'Lock status',
+	},
+	unlocked: {
+		id: 'project.disclosures.lock-status.unlocked',
+		defaultMessage: 'Unlocked',
+	},
 	cannotDisable: {
 		id: 'project.disclosures.lock-status.cannot-disable',
 		defaultMessage: 'Cannot disable',
@@ -24,10 +35,74 @@ const statuses = [
 	{ status: 'cannot_disable', label: messages.cannotDisable },
 	{ status: 'fully_locked', label: messages.fullyLocked },
 ] as const
+const options = computed(() =>
+	statuses.map(({ status, label }) => ({
+		value: status,
+		label: formatMessage(label),
+		class:
+			status === 'cannot_disable'
+				? '!text-orange [&[aria-selected=true]]:!bg-orange-highlight'
+				: status === 'fully_locked'
+					? '!text-red [&[aria-selected=true]]:!bg-red-highlight'
+					: '!text-primary [&[aria-selected=true]]:!bg-surface-5',
+		icon:
+			status === 'unlocked'
+				? LockOpenIcon
+				: status === 'cannot_disable'
+					? CircleSlashIcon
+					: LockIcon,
+	})),
+)
 </script>
 
 <template>
-	<ButtonGroup :label="formatMessage(messages.label)">
+	<Combobox
+		v-if="compact"
+		:model-value="lockStatus"
+		:options="options"
+		v-tooltip="options.find((option) => option.value === lockStatus)?.label"
+		:aria-label="formatMessage(messages.label)"
+		:disabled="disabled"
+		class="!w-8 shrink-0"
+		:trigger-class="
+			[
+				'!grid !grid-cols-1 !size-8 !min-w-0 !place-items-center !gap-0 !rounded-full !p-0 [&>div:last-child]:hidden',
+				lockStatus === 'cannot_disable'
+					? '!bg-orange !text-[var(--color-accent-contrast)]'
+					: lockStatus === 'fully_locked'
+						? '!bg-red !text-[var(--color-accent-contrast)]'
+						: '',
+			].join(' ')
+		"
+		trigger-type="base"
+		trigger-interaction="surface"
+		:show-chevron="false"
+		:dropdown-min-width="'210px'"
+		dropdown-align="right"
+		trigger-size="sm"
+		@update:model-value="emit('setLockStatus', $event)"
+	>
+		<template #option="{ item, isSelected }">
+			<div class="flex w-full items-center gap-2 font-semibold">
+				<component :is="item.icon" class="size-5 shrink-0" aria-hidden="true" />
+				<span class="flex-1">{{ item.label }}</span>
+				<CheckIcon v-if="isSelected" class="size-4 shrink-0" aria-hidden="true" />
+			</div>
+		</template>
+		<template #selected="{ label }">
+			<span class="sr-only">{{ label }}</span>
+			<span class="flex size-4 items-center justify-center">
+				<LockOpenIcon v-if="lockStatus === 'unlocked'" class="size-4" aria-hidden="true" />
+				<CircleSlashIcon
+					v-else-if="lockStatus === 'cannot_disable'"
+					class="size-4"
+					aria-hidden="true"
+				/>
+				<LockIcon v-else class="size-4" aria-hidden="true" />
+			</span>
+		</template>
+	</Combobox>
+	<ButtonGroup v-else :label="formatMessage(messages.label)">
 		<Button
 			v-for="{ status, label } in statuses"
 			:key="status"
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureToggleCard.vue b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureToggleCard.vue
index 68ca51d56ae..5f64a41d779 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureToggleCard.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureToggleCard.vue
@@ -120,6 +120,7 @@ function setLockStatus(status: DisclosureLockStatus) {
 		</template>
 		<template v-if="variant === 'review' && showModeratorLockControls" #lock-controls>
 			<DisclosureLockControls
+				compact
 				:lock-status="resolvedLockStatus"
 				:disabled="disabled"
 				@set-lock-status="setLockStatus"
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/PhotosensitivityDisclosureCard.vue b/apps/frontend/src/components/ui/project-settings/disclosures/PhotosensitivityDisclosureCard.vue
index 466f2a6355e..c6d3e05ba09 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/PhotosensitivityDisclosureCard.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/PhotosensitivityDisclosureCard.vue
@@ -1,7 +1,8 @@
 <script setup lang="ts">
 import { EyeIcon } from '@modrinth/assets'
-import { commonMessages, defineMessages, SettingsFormGroup, Textarea, useVIntl } from '@modrinth/ui'
+import { commonMessages, defineMessages, useVIntl } from '@modrinth/ui'
 
+import DisclosureExplanation from './DisclosureExplanation.vue'
 import DisclosureToggleCard from './DisclosureToggleCard.vue'
 import type { DisclosureCardMetaProps, DisclosureLockStatus, NoteDisclosure } from './types'
 
@@ -44,20 +45,15 @@ const messages = defineMessages({
 		@set-lock-status="emit('setLockStatus', $event)"
 	>
 		<template #expanded>
-			<SettingsFormGroup
+			<DisclosureExplanation
+				v-model="model.note"
 				:title="formatMessage(commonMessages.explanationLabel)"
 				title-for="photosensitivity-disclosure-note"
-			>
-				<Textarea
-					id="photosensitivity-disclosure-note"
-					v-model="model.note"
-					:rows="3"
-					:resize="showLockControls ? 'vertical' : 'none'"
-					class="max-w-[40rem]"
-					:disabled="disabled"
-					:placeholder="formatMessage(messages.notePlaceholder)"
-				/>
-			</SettingsFormGroup>
+				:variant="variant"
+				:resize="showLockControls ? 'vertical' : 'none'"
+				:disabled="disabled"
+				:placeholder="formatMessage(messages.notePlaceholder)"
+			/>
 		</template>
 	</DisclosureToggleCard>
 </template>
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/ProjectReviewDisclosureCard.vue b/apps/frontend/src/components/ui/project-settings/disclosures/ProjectReviewDisclosureCard.vue
index e4109f5c260..cb571d40773 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/ProjectReviewDisclosureCard.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/ProjectReviewDisclosureCard.vue
@@ -20,7 +20,7 @@ const isToggleLocked = computed(() => !!props.disabled || (!!props.toggleDisable
 		:aria-labelledby="titleId"
 	>
 		<div class="flex flex-col gap-3 p-4">
-			<div class="flex items-start justify-between gap-4">
+			<div class="flex items-center justify-between gap-2.5">
 				<div class="min-w-0 flex-1">
 					<h3 :id="titleId" class="m-0 flex items-center gap-2 text-lg font-semibold text-contrast">
 						<component
@@ -38,6 +38,7 @@ const isToggleLocked = computed(() => !!props.disabled || (!!props.toggleDisable
 					:disabled="isToggleLocked"
 					:aria-labelledby="titleId"
 				/>
+				<slot name="lock-controls" />
 			</div>
 			<div v-if="$slots['updated-by'] || description || $slots.default" class="flex flex-col gap-2">
 				<div v-if="$slots['updated-by']" class="text-sm">
@@ -51,12 +52,10 @@ const isToggleLocked = computed(() => !!props.disabled || (!!props.toggleDisable
 					<slot />
 				</div>
 			</div>
-			<div v-if="$slots['lock-controls']" class="ml-auto max-w-full overflow-x-auto">
-				<slot name="lock-controls" />
-			</div>
 		</div>
 		<div
-			v-if="enabled && $slots.expanded"
+			v-if="$slots.expanded"
+			v-show="enabled"
 			class="flex flex-col gap-4 border-0 border-t border-solid border-surface-4 bg-surface-2 p-4"
 		>
 			<slot name="expanded" />
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/SystemInteractionsDisclosureCard.vue b/apps/frontend/src/components/ui/project-settings/disclosures/SystemInteractionsDisclosureCard.vue
index 494660c1e5c..2744fc918a8 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/SystemInteractionsDisclosureCard.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/SystemInteractionsDisclosureCard.vue
@@ -1,7 +1,8 @@
 <script setup lang="ts">
 import { MonitorCogIcon } from '@modrinth/assets'
-import { defineMessages, SettingsFormGroup, Textarea, useVIntl } from '@modrinth/ui'
+import { defineMessages, useVIntl } from '@modrinth/ui'
 
+import DisclosureExplanation from './DisclosureExplanation.vue'
 import DisclosureToggleCard from './DisclosureToggleCard.vue'
 import type {
 	DisclosureCardMetaProps,
@@ -51,20 +52,15 @@ const messages = defineMessages({
 		@set-lock-status="emit('setLockStatus', $event)"
 	>
 		<template #expanded>
-			<SettingsFormGroup
+			<DisclosureExplanation
+				v-model="model.note"
 				:title="formatMessage(messages.noteLabel)"
 				title-for="system-interactions-disclosure-note"
-			>
-				<Textarea
-					id="system-interactions-disclosure-note"
-					v-model="model.note"
-					:rows="3"
-					:resize="showLockControls ? 'vertical' : 'none'"
-					class="max-w-[40rem]"
-					:disabled="disabled"
-					:placeholder="formatMessage(messages.notePlaceholder)"
-				/>
-			</SettingsFormGroup>
+				:variant="variant"
+				:resize="showLockControls ? 'vertical' : 'none'"
+				:disabled="disabled"
+				:placeholder="formatMessage(messages.notePlaceholder)"
+			/>
 		</template>
 	</DisclosureToggleCard>
 </template>
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/draft-context.ts b/apps/frontend/src/components/ui/project-settings/disclosures/draft-context.ts
new file mode 100644
index 00000000000..31b72279ea9
--- /dev/null
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/draft-context.ts
@@ -0,0 +1,7 @@
+import { createContext } from '@modrinth/ui'
+import type { Ref } from 'vue'
+
+import type { DisclosureFormState } from './types'
+
+export const [injectDisclosureDraft, provideDisclosureDraft] =
+	createContext<Ref<DisclosureFormState>>('DisclosureDraft')
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/use-disclosure-editor.ts b/apps/frontend/src/components/ui/project-settings/disclosures/use-disclosure-editor.ts
index 53b7632765a..acf4e52bf25 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/use-disclosure-editor.ts
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/use-disclosure-editor.ts
@@ -259,8 +259,8 @@ export function useDisclosureEditor({
 				!saving.value &&
 				(changedProject ||
 					!previous ||
-					JSON.stringify(getDisclosureFormSnapshot(current.value)) ===
-						JSON.stringify(getDisclosureFormSnapshot(disclosuresToForm(previous.disclosures))))
+					JSON.stringify(current.value) ===
+						JSON.stringify(disclosuresToForm(previous.disclosures)))
 			) {
 				current.value = disclosuresToForm(disclosuresResponse.value?.disclosures ?? [])
 			}
diff --git a/packages/ui/src/components/base/Combobox.vue b/packages/ui/src/components/base/Combobox.vue
index bbb046cf71e..9cb4bd78d4e 100644
--- a/packages/ui/src/components/base/Combobox.vue
+++ b/packages/ui/src/components/base/Combobox.vue
@@ -301,6 +301,8 @@ const props = withDefaults(
 		dropdownWidth?: string | number
 		/** Minimum width for the teleported dropdown */
 		dropdownMinWidth?: string | number
+		/** Edge of the trigger to align the dropdown with before viewport clamping. */
+		dropdownAlign?: 'left' | 'right'
 		forceDirection?: 'up' | 'down'
 		noOptionsMessage?: string
 		disableSearchFilter?: boolean
@@ -342,6 +344,7 @@ const props = withDefaults(
 		triggerSize: 'md',
 		triggerInteraction: 'surface',
 		animateDropdown: true,
+		dropdownAlign: 'left',
 		outsideClickIgnore: () => [],
 	},
 )
@@ -630,13 +633,11 @@ function calculateHorizontalPosition(
 ): number {
 	const minLeft = viewport.offsetLeft + DROPDOWN_VIEWPORT_MARGIN
 	const maxRight = viewport.offsetLeft + viewport.width - DROPDOWN_VIEWPORT_MARGIN
-	let left = triggerRect.left + viewport.offsetLeft
+	const left =
+		(props.dropdownAlign === 'right' ? triggerRect.right - dropdownRect.width : triggerRect.left) +
+		viewport.offsetLeft
 
-	if (left + dropdownRect.width > maxRight) {
-		left = Math.max(minLeft, maxRight - dropdownRect.width)
-	}
-
-	return left
+	return Math.max(minLeft, Math.min(left, maxRight - dropdownRect.width))
 }
 
 function getViewportRect(): ViewportRect {
@@ -1123,6 +1124,13 @@ watch(
 	{ immediate: true },
 )
 
+watch(
+	() => props.dropdownAlign,
+	() => {
+		if (isOpen.value) void updateDropdownPosition()
+	},
+)
+
 watch(
 	() => props.maxHeight,
 	() => {

From dd7e1ae5e7e02c819706b5dadc2772c0067a1d48 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Tue, 20 Oct 2026 13:19:36 -0600
Subject: [PATCH 22/28] feat: add review interaction UI custom themes

---
 .../project-review/issue-list/issue-card.vue  |  53 ++-
 .../src/components/project-review/messages.ts |   4 +
 .../components/project-review/queue-bar.vue   |   7 +
 .../project-review/review-panel/context.ts    |  11 +-
 .../review-panel/controls/action-button.vue   |   9 +
 .../review-panel/controls/index.vue           |   1 +
 .../project-review/review-panel/highlight.vue |   8 +-
 .../project-review/review-panel/index.vue     |   5 +-
 .../project-review/review-panel/popover.vue   |  19 +-
 .../settings/ModerationAppearance.vue         | 362 ++++++++++++++++++
 .../settings/ModerationAppearanceThemes.vue   | 186 +++++++++
 .../settings/ModerationColorSetting.vue       |  66 ++++
 .../settings/ModerationSettings.vue           |  40 +-
 .../disclosures/DisclosureLockControls.vue    |   8 +-
 .../floating-review-panel-appearance.ts       |  23 ++
 apps/frontend/src/composables/moderation.ts   | 100 +++--
 .../src/composables/review-highlight.ts       |  22 ++
 .../src/helpers/moderation-appearance.ts      |  71 ++++
 .../src/pages/settings/moderation/index.vue   |   2 +
 packages/moderation/src/data/settings.ts      |  73 +++-
 packages/moderation/src/types/settings.ts     |  22 +-
 .../components/base/inputs/ColorPicker.vue    |  31 +-
 22 files changed, 1022 insertions(+), 101 deletions(-)
 create mode 100644 apps/frontend/src/components/ui/moderation/settings/ModerationAppearance.vue
 create mode 100644 apps/frontend/src/components/ui/moderation/settings/ModerationAppearanceThemes.vue
 create mode 100644 apps/frontend/src/components/ui/moderation/settings/ModerationColorSetting.vue
 create mode 100644 apps/frontend/src/composables/floating-review-panel-appearance.ts
 create mode 100644 apps/frontend/src/composables/review-highlight.ts
 create mode 100644 apps/frontend/src/helpers/moderation-appearance.ts

diff --git a/apps/frontend/src/components/project-review/issue-list/issue-card.vue b/apps/frontend/src/components/project-review/issue-list/issue-card.vue
index 357661cc7df..14601dfcc4c 100644
--- a/apps/frontend/src/components/project-review/issue-list/issue-card.vue
+++ b/apps/frontend/src/components/project-review/issue-list/issue-card.vue
@@ -38,6 +38,13 @@
 					>
 						<span class="text-xs">{{ formatMessage(messages.edited) }}</span>
 					</Tooltip>
+					<p
+						v-if="!resolved && missingRequiredFieldCount"
+						class="m-0 text-sm text-red"
+						role="status"
+					>
+						{{ formatMessage(messages.requiredFields, { count: missingRequiredFieldCount }) }}
+					</p>
 					<slot name="action">
 						<Button
 							v-if="resolved && previousIssue?.verdict !== 'resolved'"
@@ -51,18 +58,22 @@
 							<PlusIcon aria-hidden="true" />
 							{{ formatMessage(messages.notResolved) }}
 						</Button>
-						<Button
+						<Tooltip
 							v-else-if="!resolved"
-							size="sm"
-							type="quiet"
-							circular
-							class="-my-1 -mb-2 -mr-1.5 size-8"
-							:disabled="pending || disabled"
-							:aria-label="formatMessage(messages.remove, { issue: issueTitle })"
-							@click="removeIssue()"
+							:text="formatMessage(messages.remove)"
 						>
-							<XIcon aria-hidden="true" />
-						</Button>
+							<Button
+								size="sm"
+								type="quiet"
+								circular
+								class="-my-1 -mb-2 -mr-1.5 size-8"
+								:disabled="pending || disabled"
+								:aria-label="formatMessage(messages.remove)"
+								@click="removeIssue()"
+							>
+								<XIcon aria-hidden="true" />
+							</Button>
+						</Tooltip>
 					</slot>
 				</div>
 			</div>
@@ -237,13 +248,6 @@
 					{{ facet.label }}
 				</span>
 			</div>
-			<p
-				v-if="issue.custom && !issue.custom.message.trim() && !resolved"
-				class="m-0 text-xs text-orange"
-				role="status"
-			>
-				{{ formatMessage(messages.customMessageRequired) }}
-			</p>
 		</div>
 		<IssueToggles v-if="!resolved" :issue="issue" :disabled="disabled" @remove="removeIssue" />
 		<p v-if="!resolved && needsToggle" class="m-0 text-xs text-orange" role="status">
@@ -388,9 +392,10 @@ const messages = defineMessages({
 		id: 'project-review.issues.custom-placeholder',
 		defaultMessage: 'Enter custom issue message...',
 	},
-	customMessageRequired: {
-		id: 'project-review.issues.custom-message-required',
-		defaultMessage: 'Enter a message for this custom issue.',
+	requiredFields: {
+		id: 'project-review.issues.required-fields',
+		defaultMessage:
+			'{count, plural, one {Missing required field} other {Missing required fields}}',
 	},
 	acknowledgeCheckbox: {
 		id: 'project-review.issues.custom-acknowledge-checkbox',
@@ -428,7 +433,7 @@ const messages = defineMessages({
 	},
 	remove: {
 		id: 'project-review.issues.remove',
-		defaultMessage: 'Remove {issue}',
+		defaultMessage: 'Remove issue',
 	},
 	add: {
 		id: 'project-review.issues.add',
@@ -494,6 +499,12 @@ const fields = computed(() => {
 	}
 	return [...bindings.values()]
 })
+const missingRequiredFieldCount = computed(
+	() =>
+		panels.validationErrors.value.filter(
+			({ issueId, key }) => issueId === issue.value.id && key !== 'toggle',
+		).length,
+)
 const needsToggle = computed(() =>
 	panels.validationErrors.value.some(
 		({ issueId, key }) => issueId === issue.value.id && key === 'toggle',
diff --git a/apps/frontend/src/components/project-review/messages.ts b/apps/frontend/src/components/project-review/messages.ts
index 79d79e9183a..f0c2844a3ae 100644
--- a/apps/frontend/src/components/project-review/messages.ts
+++ b/apps/frontend/src/components/project-review/messages.ts
@@ -49,6 +49,10 @@ export const projectReviewMessages = defineMessages({
 		id: 'moderation.project-review.generalSettings',
 		defaultMessage: 'General',
 	},
+	appearanceSettings: {
+		id: 'moderation.project-review.appearanceSettings',
+		defaultMessage: 'Appearance',
+	},
 	keybindsSettings: {
 		id: 'moderation.project-review.keybindsSettings',
 		defaultMessage: 'Keybinds',
diff --git a/apps/frontend/src/components/project-review/queue-bar.vue b/apps/frontend/src/components/project-review/queue-bar.vue
index a7c89beb0ab..f7977088982 100644
--- a/apps/frontend/src/components/project-review/queue-bar.vue
+++ b/apps/frontend/src/components/project-review/queue-bar.vue
@@ -152,6 +152,7 @@ import {
 	LayoutPanelLeftIcon,
 	LeftArrowIcon,
 	MonitorXIcon,
+	PaletteIcon,
 	RightArrowIcon,
 	RotateCounterClockwiseIcon,
 	SettingsIcon,
@@ -168,6 +169,7 @@ import {
 } from '@modrinth/ui'
 import { computed, ref } from 'vue'
 
+import ModerationAppearance from '~/components/ui/moderation/settings/ModerationAppearance.vue'
 import ModerationKeybinds from '~/components/ui/moderation/settings/ModerationKeybinds.vue'
 import ModerationSettings from '~/components/ui/moderation/settings/ModerationSettings.vue'
 import { injectProjectReviewPageContext } from '~/providers/project-review'
@@ -198,6 +200,11 @@ const settingsTabs: TabbedModalTab[] = [
 		icon: SettingsIcon,
 		content: ModerationSettings,
 	},
+	{
+		name: messages.appearanceSettings,
+		icon: PaletteIcon,
+		content: ModerationAppearance,
+	},
 	{
 		name: messages.keybindsSettings,
 		icon: KeyboardIcon,
diff --git a/apps/frontend/src/components/project-review/review-panel/context.ts b/apps/frontend/src/components/project-review/review-panel/context.ts
index 28ddf35383f..42b451aac01 100644
--- a/apps/frontend/src/components/project-review/review-panel/context.ts
+++ b/apps/frontend/src/components/project-review/review-panel/context.ts
@@ -42,18 +42,21 @@ interface ReviewDestination {
 	reveal: () => Promise<void>
 }
 
-export function flashReviewElement(element: HTMLElement) {
+export function flashReviewElement(element: HTMLElement, highlightColor: string) {
 	for (const animation of element.getAnimations()) {
 		if (animation.id === 'review-reveal') animation.cancel()
 	}
-	const reducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches
-	const highlightColor = 'color-mix(in srgb, var(--color-orange) 6%, transparent)'
+	const view = element.ownerDocument.defaultView
+	if (!view) return
+	const reducedMotion = view.matchMedia('(prefers-reduced-motion: reduce)').matches
 	const animation = element.animate(
 		[
 			{ backgroundColor: highlightColor },
 			{ backgroundColor: highlightColor },
 			{
-				backgroundColor: reducedMotion ? highlightColor : getComputedStyle(element).backgroundColor,
+				backgroundColor: reducedMotion
+					? highlightColor
+					: view.getComputedStyle(element).backgroundColor,
 			},
 		],
 		{ duration: 800, easing: 'ease-out' },
diff --git a/apps/frontend/src/components/project-review/review-panel/controls/action-button.vue b/apps/frontend/src/components/project-review/review-panel/controls/action-button.vue
index 53f1deef9cc..9aba0349a84 100644
--- a/apps/frontend/src/components/project-review/review-panel/controls/action-button.vue
+++ b/apps/frontend/src/components/project-review/review-panel/controls/action-button.vue
@@ -5,6 +5,14 @@
 		:aria-pressed="mixed ? 'mixed' : modelValue"
 		:aria-keyshortcuts="ariaKeybind"
 		:data-review-toggle-index="toggleIndex"
+		:style="
+			color
+				? {
+						'--action-color': color,
+						'--action-highlight': `color-mix(in srgb, ${color} 25%, transparent)`,
+					}
+				: undefined
+		"
 		class="action-toggle !h-auto min-h-8 max-w-full !gap-1.5 !whitespace-normal !rounded-lg !px-2.5 !font-medium [&>svg]:!text-inherit"
 		:class="{
 			'!brightness-100': modelValue,
@@ -40,6 +48,7 @@ const props = defineProps<{
 	mixed?: boolean
 	reReview?: boolean
 	label: string
+	color?: string
 	disabled?: boolean
 	keybind?: KeybindDefinition
 	toggleIndex?: number
diff --git a/apps/frontend/src/components/project-review/review-panel/controls/index.vue b/apps/frontend/src/components/project-review/review-panel/controls/index.vue
index ac092bcd81b..b8468bd72ad 100644
--- a/apps/frontend/src/components/project-review/review-panel/controls/index.vue
+++ b/apps/frontend/src/components/project-review/review-panel/controls/index.vue
@@ -127,6 +127,7 @@
 					>
 						<ActionButton
 							:label="control.label"
+							:color="settings.get(moderationSettings.General.IssueToggleColor)"
 							:keybind="keybinds.get(control)"
 							:toggle-index="toggleIndexes.get(control)"
 							:show-keybind-hint="
diff --git a/apps/frontend/src/components/project-review/review-panel/highlight.vue b/apps/frontend/src/components/project-review/review-panel/highlight.vue
index 673051ebe3f..da306032874 100644
--- a/apps/frontend/src/components/project-review/review-panel/highlight.vue
+++ b/apps/frontend/src/components/project-review/review-panel/highlight.vue
@@ -2,6 +2,7 @@
 	<div
 		:data-review-highlight="enabled ? '' : undefined"
 		class="relative flex min-w-0 flex-col gap-[inherit] rounded"
+		:style="{ '--review-highlight-background': background }"
 		:class="
 			layer === 'behind'
 				? [behindClasses, enabled && active ? 'before:opacity-100' : 'before:opacity-0']
@@ -13,10 +14,13 @@
 </template>
 
 <script setup lang="ts">
+import { useReviewHighlight } from '~/composables/review-highlight'
+
+const { background } = useReviewHighlight()
 const behindClasses =
-	"isolate before:pointer-events-none before:absolute before:-inset-[6px] before:z-[-1] before:rounded-lg before:bg-[color:color-mix(in_srgb,var(--color-orange)_3%,transparent)] before:content-['']"
+	"isolate before:pointer-events-none before:absolute before:-inset-[6px] before:z-[-1] before:rounded-lg before:bg-[color:var(--review-highlight-background)] before:content-['']"
 const overlayClasses =
-	"after:pointer-events-none after:absolute after:-inset-[6px] after:rounded-lg after:bg-[color:color-mix(in_srgb,var(--color-orange)_3%,transparent)] after:content-['']"
+	"after:pointer-events-none after:absolute after:-inset-[6px] after:rounded-lg after:bg-[color:var(--review-highlight-background)] after:content-['']"
 
 withDefaults(defineProps<{ active?: boolean; enabled?: boolean; layer?: 'behind' | 'overlay' }>(), {
 	enabled: true,
diff --git a/apps/frontend/src/components/project-review/review-panel/index.vue b/apps/frontend/src/components/project-review/review-panel/index.vue
index d28dafd5a3c..ea7e44856d2 100644
--- a/apps/frontend/src/components/project-review/review-panel/index.vue
+++ b/apps/frontend/src/components/project-review/review-panel/index.vue
@@ -72,6 +72,7 @@
 		<Highlight
 			:active="inlineActive"
 			:enabled="settings.get(moderationSettings.General.ShowInlinePanelHoverHighlight)"
+			layer="behind"
 		>
 			<div v-if="title && !hideTitle" class="flex items-center gap-2">
 				<h2 :id="titleId" class="m-0 text-sm font-semibold text-contrast">
@@ -119,6 +120,7 @@ import { useElementHover } from '@vueuse/core'
 import { computed, nextTick, onScopeDispose, shallowRef, useId, watch } from 'vue'
 
 import { useModerationSettings } from '~/composables/moderation'
+import { useReviewHighlight } from '~/composables/review-highlight'
 import type { ReviewTarget } from '~/providers/project-review/review'
 import { injectReviewPanels } from '~/providers/project-review/review-panels'
 
@@ -165,6 +167,7 @@ const {
 const inlineActive = computed(() => activePanelId.value === id)
 const { formatMessage } = useVIntl()
 const settings = useModerationSettings()
+const { flashBackground } = useReviewHighlight()
 const panels = injectReviewPanels()
 const titleId = `${id}-title`
 const binding = computed(() => panels.resolve(props.target))
@@ -212,7 +215,7 @@ onScopeDispose(
 				reviewContext.revealInlinePanel(id)
 				element.focus({ preventScroll: true })
 			}
-			flashReviewElement(element)
+			flashReviewElement(element, flashBackground.value)
 		},
 	}),
 )
diff --git a/apps/frontend/src/components/project-review/review-panel/popover.vue b/apps/frontend/src/components/project-review/review-panel/popover.vue
index 00278498ce2..9d0ccbe8747 100644
--- a/apps/frontend/src/components/project-review/review-panel/popover.vue
+++ b/apps/frontend/src/components/project-review/review-panel/popover.vue
@@ -8,8 +8,8 @@
 			:aria-label="titleId ? undefined : label"
 			:data-review-panel="anchor.id"
 			tabindex="-1"
-			class="review-popover z-[100] box-border flex w-[28rem] max-w-[calc(100vw-1rem)] flex-col gap-2 overflow-y-auto rounded-xl border border-solid border-highlight-orange bg-surface-1 p-2.5 pb-3 text-sm text-primary"
-			:style="[floatingStyles, { width: maxWidth }]"
+			class="review-popover z-[100] box-border flex w-[28rem] max-w-[calc(100vw-1rem)] flex-col gap-2 overflow-y-auto rounded-xl border-solid p-2.5 pb-3 text-sm text-primary"
+			:style="[floatingStyles, appearanceStyle, { width: maxWidth }]"
 			@pointerenter="setPopoverHovered(anchor.id, true)"
 			@pointerleave="setPopoverHovered(anchor.id, false)"
 			@focusin="cancelClose"
@@ -54,11 +54,14 @@ import { PinIcon, XIcon } from '@modrinth/assets'
 import { IconButton, useVIntl } from '@modrinth/ui'
 import { computed, nextTick, onBeforeUnmount, shallowRef, watch } from 'vue'
 
+import { useFloatingReviewPanelAppearance } from '~/composables/floating-review-panel-appearance'
+
 import { projectReviewMessages as messages } from '../messages'
 import { useReviewEventListener } from '../shortcuts'
 import { injectReviewContext, type ReviewAnchor } from './context'
 
 const { formatMessage } = useVIntl()
+const { style: appearanceStyle } = useFloatingReviewPanelAppearance()
 const props = defineProps<{
 	anchor: ReviewAnchor
 	titleId?: string
@@ -141,15 +144,3 @@ useReviewEventListener('pointerdown', (event) => {
 	dismiss()
 })
 </script>
-
-<style scoped>
-.review-popover::before {
-	content: '';
-	position: absolute;
-	inset: 0;
-	z-index: 1;
-	border-radius: inherit;
-	background: color-mix(in srgb, var(--color-orange) 3%, transparent);
-	pointer-events: none;
-}
-</style>
diff --git a/apps/frontend/src/components/ui/moderation/settings/ModerationAppearance.vue b/apps/frontend/src/components/ui/moderation/settings/ModerationAppearance.vue
new file mode 100644
index 00000000000..b54874ddcc3
--- /dev/null
+++ b/apps/frontend/src/components/ui/moderation/settings/ModerationAppearance.vue
@@ -0,0 +1,362 @@
+<script setup lang="ts">
+import { PinIcon, RotateCounterClockwiseIcon, SearchIcon, XIcon } from '@modrinth/assets'
+import { moderationSettings } from '@modrinth/moderation'
+import {
+	defineMessages,
+	IconButton,
+	Input,
+	IntlFormatted,
+	type MessageDescriptor,
+	Toggle,
+	useVIntl,
+} from '@modrinth/ui'
+import { computed, ref, useId } from 'vue'
+
+import ActionButton from '~/components/project-review/review-panel/controls/action-button.vue'
+import Highlight from '~/components/project-review/review-panel/highlight.vue'
+import { useFloatingReviewPanelAppearance } from '~/composables/floating-review-panel-appearance'
+import { useModerationAppearanceTheme, useModerationSettings } from '~/composables/moderation'
+import { appearanceFields } from '~/helpers/moderation-appearance'
+
+import ModerationAppearanceThemes from './ModerationAppearanceThemes.vue'
+import ModerationColorSetting from './ModerationColorSetting.vue'
+
+defineProps<{
+	embedded?: boolean
+}>()
+
+const { formatMessage } = useVIntl()
+const search = ref('')
+const settingsId = useId()
+const messages = defineMessages({
+	search: {
+		id: 'moderation.settings.search',
+		defaultMessage: 'Search settings…',
+	},
+	noResults: {
+		id: 'moderation.settings.no-results',
+		defaultMessage: 'No settings match your search.',
+	},
+	panelAppearance: {
+		id: 'moderation.settings.review-panel-appearance',
+		defaultMessage: 'Review panel appearance',
+	},
+	highlights: {
+		id: 'moderation.settings.highlights-section',
+		defaultMessage: 'Highlights',
+	},
+	floatingPanel: {
+		id: 'moderation.settings.floating-panel-section',
+		defaultMessage: 'Floating review panel',
+	},
+	issueToggles: {
+		id: 'moderation.settings.issue-toggles-section',
+		defaultMessage: 'Issue toggles',
+	},
+	controlLabel: {
+		id: 'moderation.settings.control-label',
+		defaultMessage: '{section}: {setting}',
+	},
+	defaultValue: {
+		id: 'moderation.settings.default-value-styled',
+		defaultMessage: 'Default: <value></value>',
+	},
+	on: { id: 'moderation.settings.on', defaultMessage: 'On' },
+	off: { id: 'moderation.settings.off', defaultMessage: 'Off' },
+	themeDefault: {
+		id: 'moderation.settings.theme-default',
+		defaultMessage: 'Theme orange',
+	},
+	themeBorder: {
+		id: 'moderation.settings.theme-border',
+		defaultMessage: 'Theme orange (25% opacity)',
+	},
+	reset: {
+		id: 'moderation.settings.reset',
+		defaultMessage: 'Reset to default',
+	},
+	highlightPreview: {
+		id: 'moderation.settings.highlight-preview',
+		defaultMessage: 'Review highlight preview',
+	},
+	issueTogglePreview: {
+		id: 'moderation.settings.issue-toggle-preview',
+		defaultMessage: 'Issue toggle preview',
+	},
+	floatingPanelPreview: {
+		id: 'moderation.settings.floating-panel-preview',
+		defaultMessage: 'Floating panel preview',
+	},
+	previewMissingInformation: {
+		id: 'moderation.settings.highlight-preview.missing-information',
+		defaultMessage: 'Missing information',
+	},
+	previewIncorrectFormatting: {
+		id: 'moderation.settings.highlight-preview.incorrect-formatting',
+		defaultMessage: 'Incorrect formatting',
+	},
+	previewNonEnglish: {
+		id: 'moderation.settings.highlight-preview.non-english',
+		defaultMessage: 'Non-English',
+	},
+})
+const general = moderationSettings.General
+
+function createPreviewIssues() {
+	return [
+		{ label: messages.previewMissingInformation, selected: false },
+		{ label: messages.previewIncorrectFormatting, selected: true },
+		{ label: messages.previewNonEnglish, selected: false },
+	]
+}
+
+const previewIssues = ref({
+	[general.ReviewHighlightOpacity.id]: createPreviewIssues(),
+	[general.FloatingReviewPanelBorderWidth.id]: createPreviewIssues(),
+	[general.IssueToggleColor.id]: createPreviewIssues(),
+})
+const groups = [
+	{
+		id: 'highlight-options',
+		title: messages.highlights,
+		settings: [general.ShowFloatingPanelFieldHoverHighlight, general.ShowInlinePanelHoverHighlight],
+	},
+	{
+		id: 'highlights',
+		title: messages.highlights,
+		settings: [general.ReviewHighlightColor, general.ReviewHighlightOpacity],
+	},
+	{
+		id: 'floating-review-panel',
+		title: messages.floatingPanel,
+		settings: [
+			general.FloatingReviewPanelBorderColor,
+			general.FloatingReviewPanelBackground,
+			general.FloatingReviewPanelBackgroundOpacity,
+			general.FloatingReviewPanelBorderWidth,
+		],
+	},
+	{
+		id: 'issue-toggles',
+		title: messages.issueToggles,
+		settings: [general.IssueToggleColor],
+	},
+]
+
+const filteredGroups = computed(() => {
+	const query = search.value.trim().toLocaleLowerCase()
+	return groups
+		.map((group) => ({
+			...group,
+			settings: group.settings.filter((setting) =>
+				[formatMessage(group.title), setting.title, setting.description].some((text) =>
+					text.toLocaleLowerCase().includes(query),
+				),
+			),
+		}))
+		.filter((group) => group.settings.length)
+})
+
+function controlLabel(section: MessageDescriptor, setting: string) {
+	return formatMessage(messages.controlLabel, {
+		section: formatMessage(section),
+		setting,
+	})
+}
+
+function defaultLabel(setting: (typeof groups)[number]['settings'][number]) {
+	if (setting.type === 'color') {
+		return formatMessage(
+			setting.id === general.FloatingReviewPanelBorderColor.id
+				? messages.themeBorder
+				: messages.themeDefault,
+		)
+	}
+	if (setting.type === 'toggle') return formatMessage(setting.default ? messages.on : messages.off)
+	return `${setting.default}${setting.unit ?? ''}`
+}
+
+const configuredSettings = useModerationSettings()
+const selectedTheme = useModerationAppearanceTheme()
+function resetValue(setting: (typeof groups)[number]['settings'][number]) {
+	const key = (Object.keys(appearanceFields) as (keyof typeof appearanceFields)[]).find(
+		(key) => appearanceFields[key].id === setting.id,
+	)
+	return key ? selectedTheme.value.values[key] : setting.default
+}
+const { style: floatingPanelStyle } = useFloatingReviewPanelAppearance()
+</script>
+
+<template>
+	<div :class="{ 'universal-card': !embedded }">
+		<div class="mb-2.5 flex flex-wrap items-center justify-between gap-2">
+			<h2 class="m-0 text-2xl">
+				{{ formatMessage(messages.panelAppearance) }}
+			</h2>
+			<ModerationAppearanceThemes />
+		</div>
+		<Input
+			v-model="search"
+			type="search"
+			:icon="SearchIcon"
+			:placeholder="formatMessage(messages.search)"
+			:aria-label="formatMessage(messages.search)"
+			class="w-full"
+		/>
+		<p v-if="!filteredGroups.length" class="text-secondary" role="status">
+			{{ formatMessage(messages.noResults) }}
+		</p>
+		<section
+			v-for="group in filteredGroups"
+			:key="group.id"
+			:aria-labelledby="group.id === 'highlight-options' ? undefined : `${settingsId}-${group.id}`"
+			class="mt-8"
+		>
+			<h3
+				v-if="group.id !== 'highlight-options'"
+				:id="`${settingsId}-${group.id}`"
+				class="mb-6 text-xl font-semibold"
+			>
+				{{ formatMessage(group.title) }}
+			</h3>
+			<div class="flex flex-col gap-6">
+				<div
+					v-for="setting in group.settings"
+					:key="setting.id"
+					class="flex flex-row flex-wrap items-center justify-between gap-2"
+				>
+					<div class="min-w-0 flex-1">
+						<span class="mb-2.5 block font-semibold text-contrast">{{ setting.title }}</span>
+						<span class="block text-secondary">{{ setting.description }}</span>
+						<span
+							v-if="
+								setting.id === general.ShowFloatingPanelFieldHoverHighlight.id ||
+								setting.id === general.ShowInlinePanelHoverHighlight.id
+							"
+							class="mt-2.5 block text-xs text-secondary"
+						>
+							<IntlFormatted :message-id="messages.defaultValue">
+								<template #value>
+									<span
+										class="font-medium"
+										:class="{
+											'text-green': setting.type === 'toggle' && setting.default,
+											'text-red': setting.type === 'toggle' && !setting.default,
+											'italic opacity-50': setting.default === '',
+										}"
+										>{{ defaultLabel(setting) }}</span
+									>
+								</template>
+							</IntlFormatted>
+						</span>
+					</div>
+
+					<ModerationColorSetting
+						v-if="setting.type === 'color'"
+						:label="controlLabel(group.title, setting.title)"
+						:default-label="defaultLabel(setting)"
+						:reset-value="String(resetValue(setting))"
+						default-color="var(--color-orange)"
+						:model-value="configuredSettings.get(setting)"
+						@update:model-value="(value) => configuredSettings.set(setting, value)"
+					/>
+					<div v-if="setting.type === 'number'" class="flex shrink-0 items-center gap-2">
+						<Input
+							type="number"
+							clamp
+							class="w-24"
+							:aria-label="controlLabel(group.title, setting.title)"
+							:model-value="configuredSettings.get(setting)"
+							:min="setting.min"
+							:max="setting.max"
+							:step="setting.step"
+							@update:model-value="
+								(value) =>
+									configuredSettings.set(setting, value === undefined ? undefined : Number(value))
+							"
+						>
+							<template #trailing>
+								<span class="text-secondary">{{ setting.unit }}</span>
+							</template>
+						</Input>
+						<IconButton
+							v-tooltip="formatMessage(messages.reset)"
+							type="quiet"
+							size="sm"
+							:circular="false"
+							:label="formatMessage(messages.reset)"
+							:disabled="configuredSettings.get(setting) === resetValue(setting)"
+							@click="configuredSettings.set(setting, Number(resetValue(setting)))"
+						>
+							<RotateCounterClockwiseIcon aria-hidden="true" />
+						</IconButton>
+					</div>
+					<div
+						v-if="
+							setting.id === general.ReviewHighlightOpacity.id ||
+							setting.id === general.IssueToggleColor.id
+						"
+						class="mt-4 box-border flex w-full flex-col gap-2.5 rounded-xl bg-surface-2"
+					>
+						<Highlight
+							active
+							:enabled="setting.id === general.ReviewHighlightOpacity.id"
+							layer="behind"
+						>
+							<p class="m-0 font-semibold text-contrast">
+								{{
+									formatMessage(
+										setting.id === general.IssueToggleColor.id
+											? messages.issueTogglePreview
+											: messages.highlightPreview,
+									)
+								}}
+							</p>
+							<div class="flex flex-wrap gap-1.5">
+								<ActionButton
+									v-for="issue in previewIssues[setting.id]"
+									:key="issue.label.id"
+									v-model="issue.selected"
+									:color="configuredSettings.get(general.IssueToggleColor)"
+									:label="formatMessage(issue.label)"
+								/>
+							</div>
+						</Highlight>
+					</div>
+					<div
+						v-if="setting.id === general.FloatingReviewPanelBorderWidth.id"
+						class="mt-4 box-border flex w-full flex-col gap-2 rounded-xl border-solid p-2.5 pb-3 text-sm text-primary"
+						:style="floatingPanelStyle"
+					>
+						<div class="flex items-center justify-between gap-3">
+							<p class="m-0 font-semibold text-contrast">
+								{{ formatMessage(messages.floatingPanelPreview) }}
+							</p>
+							<div class="flex items-center gap-3 text-secondary" aria-hidden="true">
+								<PinIcon class="size-4" />
+								<XIcon class="size-4" />
+							</div>
+						</div>
+						<div class="flex flex-wrap gap-1.5">
+							<ActionButton
+								v-for="issue in previewIssues[setting.id]"
+								:key="issue.label.id"
+								v-model="issue.selected"
+								:color="configuredSettings.get(general.IssueToggleColor)"
+								:label="formatMessage(issue.label)"
+							/>
+						</div>
+					</div>
+
+					<Toggle
+						v-if="setting.type === 'toggle'"
+						:aria-label="controlLabel(group.title, setting.title)"
+						:model-value="configuredSettings.get(setting)"
+						class="shrink-0"
+						@update:model-value="(value) => configuredSettings.set(setting, value)"
+					/>
+				</div>
+			</div>
+		</section>
+	</div>
+</template>
diff --git a/apps/frontend/src/components/ui/moderation/settings/ModerationAppearanceThemes.vue b/apps/frontend/src/components/ui/moderation/settings/ModerationAppearanceThemes.vue
new file mode 100644
index 00000000000..8edf3a46a02
--- /dev/null
+++ b/apps/frontend/src/components/ui/moderation/settings/ModerationAppearanceThemes.vue
@@ -0,0 +1,186 @@
+<script setup lang="ts">
+import { DownloadIcon, FileIcon } from '@modrinth/assets'
+import { Button, defineMessages, NewModal, Textarea, useVIntl } from '@modrinth/ui'
+import { ref, useId } from 'vue'
+
+import { useModerationAppearanceTheme, useModerationSettings } from '~/composables/moderation'
+
+import { applyAppearance, exportAppearance, parseAppearance } from '~/helpers/moderation-appearance'
+
+const settings = useModerationSettings()
+const theme = useModerationAppearanceTheme()
+const { formatMessage } = useVIntl()
+const messages = defineMessages({
+	import: {
+		id: 'moderation.appearance.import',
+		defaultMessage: 'Import theme',
+	},
+	export: {
+		id: 'moderation.appearance.export',
+		defaultMessage: 'Export theme',
+	},
+	json: { id: 'moderation.appearance.json', defaultMessage: 'Theme JSON' },
+	importHelp: {
+		id: 'moderation.appearance.import-help',
+		defaultMessage:
+			'Paste theme JSON or choose a JSON file, then apply it to preview your appearance.',
+	},
+	exportHelp: {
+		id: 'moderation.appearance.export-help',
+		defaultMessage: 'Copy your appearance as JSON or download it to share or import later.',
+	},
+	file: {
+		id: 'moderation.appearance.file',
+		defaultMessage: 'Choose JSON file',
+	},
+	download: {
+		id: 'moderation.appearance.download',
+		defaultMessage: 'Download JSON',
+	},
+	copy: { id: 'moderation.appearance.copy', defaultMessage: 'Copy JSON' },
+	copied: { id: 'moderation.appearance.copied', defaultMessage: 'Copied!' },
+	apply: { id: 'moderation.appearance.apply', defaultMessage: 'Apply theme' },
+	invalid: {
+		id: 'moderation.appearance.invalid',
+		defaultMessage:
+			'Invalid theme. Use a version 1 review appearance export with all seven values, valid hex colors, opacity from 0–100, and border width from 0–8.',
+	},
+	fileError: {
+		id: 'moderation.appearance.file-error',
+		defaultMessage: 'Could not read this file. Choose a JSON file smaller than 64 KB.',
+	},
+	copyError: {
+		id: 'moderation.appearance.copy-error',
+		defaultMessage: 'Could not copy automatically. Select and copy the JSON below.',
+	},
+})
+const root = ref<HTMLElement>()
+const fileInput = ref<HTMLInputElement>()
+const modal = ref<InstanceType<typeof NewModal>>()
+const mode = ref<'import' | 'export'>('import')
+const json = ref('')
+const error = ref('')
+const copied = ref(false)
+const jsonId = useId()
+function show(nextMode: 'import' | 'export') {
+	mode.value = nextMode
+	json.value = nextMode === 'export' ? exportAppearance(settings.value) : ''
+	error.value = ''
+	copied.value = false
+	modal.value?.show()
+}
+
+function apply() {
+	try {
+		const values = parseAppearance(json.value)
+		theme.value = { id: 'custom', values }
+		applyAppearance(settings.value, values)
+		modal.value?.hide()
+	} catch {
+		error.value = formatMessage(messages.invalid)
+	}
+}
+
+async function readFile(event: Event) {
+	const input = event.target as HTMLInputElement
+	const file = input.files?.[0]
+	input.value = ''
+	if (!file) return
+	error.value = ''
+	try {
+		if (file.size > 65536) throw new Error('size')
+		json.value = await file.text()
+	} catch {
+		error.value = formatMessage(messages.fileError)
+	}
+}
+
+async function copy() {
+	try {
+		const view = root.value?.ownerDocument.defaultView
+		if (!view) return
+		await view.navigator.clipboard.writeText(json.value)
+		copied.value = true
+	} catch {
+		error.value = formatMessage(messages.copyError)
+	}
+}
+
+function download() {
+	const document = root.value?.ownerDocument
+	const view = document?.defaultView
+	if (!document || !view) return
+	const url = view.URL.createObjectURL(new Blob([json.value], { type: 'application/json' }))
+	const link = document.createElement('a')
+	link.href = url
+	link.download = 'modrinth-review-theme.json'
+	link.click()
+	view.setTimeout(() => view.URL.revokeObjectURL(url), 1000)
+}
+</script>
+
+<template>
+	<div ref="root" class="ml-auto shrink-0">
+		<div class="flex flex-wrap gap-2">
+			<Button size="sm" @click="show('import')">{{ formatMessage(messages.import) }}</Button>
+			<Button size="sm" @click="show('export')">{{ formatMessage(messages.export) }}</Button>
+		</div>
+		<NewModal
+			ref="modal"
+			:header="formatMessage(messages[mode])"
+			width="40rem"
+			max-width="calc(100vw - 2rem)"
+		>
+			<div class="flex flex-col gap-4">
+				<p class="m-0 text-secondary">
+					{{ formatMessage(mode === 'import' ? messages.importHelp : messages.exportHelp) }}
+				</p>
+				<label :for="jsonId" class="font-semibold text-contrast">{{
+					formatMessage(messages.json)
+				}}</label>
+				<Textarea
+					:id="jsonId"
+					v-model="json"
+					:readonly="mode === 'export'"
+					:rows="14"
+					:spellcheck="false"
+					resize="vertical"
+					input-class="font-mono text-sm"
+					:error="!!error"
+					@input="error = ''"
+				/>
+				<p v-if="error" role="alert" class="m-0 text-sm text-red">
+					{{ error }}
+				</p>
+				<div class="flex flex-wrap justify-end gap-2">
+					<template v-if="mode === 'import'">
+						<input
+							ref="fileInput"
+							type="file"
+							accept=".json,application/json"
+							class="hidden"
+							:aria-label="formatMessage(messages.file)"
+							@change="readFile"
+						/>
+						<Button @click="fileInput?.click()">
+							<FileIcon aria-hidden="true" />
+							{{ formatMessage(messages.file) }}
+						</Button>
+						<Button type="colored" color="brand" :disabled="!json.trim()" @click="apply">{{
+							formatMessage(messages.apply)
+						}}</Button>
+					</template>
+					<template v-else>
+						<Button @click="download">
+							<DownloadIcon aria-hidden="true" />
+							{{ formatMessage(messages.download) }}
+						</Button>
+						<Button type="colored" color="brand" @click="copy">{{
+							formatMessage(copied ? messages.copied : messages.copy)
+						}}</Button>
+					</template>
+				</div>
+			</div>
+		</NewModal>
+	</div>
+</template>
diff --git a/apps/frontend/src/components/ui/moderation/settings/ModerationColorSetting.vue b/apps/frontend/src/components/ui/moderation/settings/ModerationColorSetting.vue
new file mode 100644
index 00000000000..e9623b23f7f
--- /dev/null
+++ b/apps/frontend/src/components/ui/moderation/settings/ModerationColorSetting.vue
@@ -0,0 +1,66 @@
+<script setup lang="ts">
+import { RotateCounterClockwiseIcon } from '@modrinth/assets'
+import { ColorPicker, defineMessages, IconButton, useVIntl } from '@modrinth/ui'
+import { computed, onMounted, ref, watch } from 'vue'
+
+import { useTheme } from '~/composables/nuxt-accessors'
+
+const props = defineProps<{
+	label: string
+	defaultColor: string
+	defaultLabel: string
+	resetValue: string
+}>()
+const model = defineModel<string>({ required: true })
+const { formatMessage } = useVIntl()
+const messages = defineMessages({
+	reset: {
+		id: 'moderation.settings.reset',
+		defaultMessage: 'Reset to default',
+	},
+})
+const theme = useTheme()
+const swatch = ref<HTMLElement | null>(null)
+const defaultHex = ref('#ffa347')
+const pickerColor = computed({
+	get: () => model.value || defaultHex.value,
+	set: (value: string) => {
+		model.value = value
+	},
+})
+
+function updateDefaultColor() {
+	const element = swatch.value
+	const view = element?.ownerDocument.defaultView
+	if (!element || !view) return
+	const channels = view.getComputedStyle(element).color.match(/\d+/g)
+	if (channels && channels.length >= 3) {
+		defaultHex.value = `#${channels
+			.slice(0, 3)
+			.map((channel) => Number(channel).toString(16).padStart(2, '0'))
+			.join('')}`
+	}
+}
+
+onMounted(updateDefaultColor)
+watch([() => theme.active, () => props.defaultColor], updateDefaultColor, { flush: 'post' })
+</script>
+
+<template>
+	<div class="flex flex-wrap items-center gap-2">
+		<span ref="swatch" class="hidden" :style="{ color: defaultColor }" aria-hidden="true" />
+		<span class="text-sm text-secondary">{{ model || defaultLabel }}</span>
+		<ColorPicker v-model="pickerColor" :label="label" />
+		<IconButton
+			v-tooltip="formatMessage(messages.reset)"
+			type="quiet"
+			size="sm"
+			:circular="false"
+			:label="formatMessage(messages.reset)"
+			:disabled="model === resetValue"
+			@click="model = resetValue"
+		>
+			<RotateCounterClockwiseIcon aria-hidden="true" />
+		</IconButton>
+	</div>
+</template>
diff --git a/apps/frontend/src/components/ui/moderation/settings/ModerationSettings.vue b/apps/frontend/src/components/ui/moderation/settings/ModerationSettings.vue
index bce70605b14..1e2d6f31fe1 100644
--- a/apps/frontend/src/components/ui/moderation/settings/ModerationSettings.vue
+++ b/apps/frontend/src/components/ui/moderation/settings/ModerationSettings.vue
@@ -10,7 +10,7 @@ import {
 	Toggle,
 	useVIntl,
 } from '@modrinth/ui'
-import { computed, ref } from 'vue'
+import { computed, ref, useId } from 'vue'
 
 import { useModerationSettings } from '~/composables/moderation'
 
@@ -22,9 +22,16 @@ const localhostHostname = 'localhost:3000'
 
 const { formatMessage } = useVIntl()
 const search = ref('')
+const settingsId = useId()
 const messages = defineMessages({
-	title: { id: 'moderation.settings.title', defaultMessage: 'General settings' },
-	search: { id: 'moderation.settings.search', defaultMessage: 'Search settings…' },
+	title: {
+		id: 'moderation.settings.title',
+		defaultMessage: 'General settings',
+	},
+	search: {
+		id: 'moderation.settings.search',
+		defaultMessage: 'Search settings…',
+	},
 	noResults: {
 		id: 'moderation.settings.no-results',
 		defaultMessage: 'No settings match your search.',
@@ -79,11 +86,7 @@ const groups = [
 	{
 		id: 'panels',
 		title: messages.panels,
-		settings: [
-			general.LinkInfoPlacement,
-			general.ShowFloatingPanelFieldHoverHighlight,
-			general.ShowInlinePanelHoverHighlight,
-		],
+		settings: [general.LinkInfoPlacement],
 	},
 	{
 		id: 'appearance',
@@ -136,7 +139,7 @@ const filteredGroups = computed(() => {
 		.filter((group) => group.settings.length)
 })
 
-function defaultLabel(setting: (typeof general)[keyof typeof general]) {
+function defaultLabel(setting: (typeof groups)[number]['settings'][number]) {
 	if (setting.type === 'toggle') return formatMessage(setting.default ? messages.on : messages.off)
 	if (setting.type === 'enum')
 		return (
@@ -150,7 +153,9 @@ const configuredSettings = useModerationSettings()
 
 <template>
 	<div :class="{ 'universal-card': !embedded }">
-		<h2 class="m-0 mb-2.5 text-2xl">{{ formatMessage(messages.title) }}</h2>
+		<h2 class="m-0 mb-2.5 text-2xl">
+			{{ formatMessage(messages.title) }}
+		</h2>
 		<Input
 			v-model="search"
 			type="search"
@@ -162,15 +167,22 @@ const configuredSettings = useModerationSettings()
 		<p v-if="!filteredGroups.length" class="text-secondary" role="status">
 			{{ formatMessage(messages.noResults) }}
 		</p>
-		<section v-for="group in filteredGroups" :key="group.id" class="mt-8">
-			<h3 class="mb-6 text-xl font-semibold">{{ formatMessage(group.title) }}</h3>
+		<section
+			v-for="group in filteredGroups"
+			:key="group.id"
+			:aria-labelledby="`${settingsId}-${group.id}`"
+			class="mt-8"
+		>
+			<h3 :id="`${settingsId}-${group.id}`" class="mb-6 text-xl font-semibold">
+				{{ formatMessage(group.title) }}
+			</h3>
 			<div class="flex flex-col gap-6">
 				<div
 					v-for="setting in group.settings"
 					:key="setting.id"
 					class="flex flex-row flex-wrap items-center justify-between gap-2"
 				>
-					<label class="flex-1">
+					<div class="min-w-0 flex-1">
 						<span class="mb-2.5 block font-semibold text-contrast">{{ setting.title }}</span>
 						<span class="block text-secondary">{{ setting.description }}</span>
 						<span class="mt-2.5 block text-xs text-secondary">
@@ -188,7 +200,7 @@ const configuredSettings = useModerationSettings()
 								</template>
 							</IntlFormatted>
 						</span>
-					</label>
+					</div>
 
 					<Toggle
 						v-if="setting.type === 'toggle'"
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureLockControls.vue b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureLockControls.vue
index 0b268096234..49a0d7a239e 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureLockControls.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureLockControls.vue
@@ -17,6 +17,10 @@ const messages = defineMessages({
 		id: 'project.disclosures.lock-status.label',
 		defaultMessage: 'Lock status',
 	},
+	changeLockStatus: {
+		id: 'project.disclosures.lock-status.change',
+		defaultMessage: 'Change lock status',
+	},
 	unlocked: {
 		id: 'project.disclosures.lock-status.unlocked',
 		defaultMessage: 'Unlocked',
@@ -60,8 +64,8 @@ const options = computed(() =>
 		v-if="compact"
 		:model-value="lockStatus"
 		:options="options"
-		v-tooltip="options.find((option) => option.value === lockStatus)?.label"
-		:aria-label="formatMessage(messages.label)"
+		v-tooltip="formatMessage(messages.changeLockStatus)"
+		:aria-label="formatMessage(messages.changeLockStatus)"
 		:disabled="disabled"
 		class="!w-8 shrink-0"
 		:trigger-class="
diff --git a/apps/frontend/src/composables/floating-review-panel-appearance.ts b/apps/frontend/src/composables/floating-review-panel-appearance.ts
new file mode 100644
index 00000000000..918da68d8e3
--- /dev/null
+++ b/apps/frontend/src/composables/floating-review-panel-appearance.ts
@@ -0,0 +1,23 @@
+import { moderationSettings } from '@modrinth/moderation'
+import { computed } from 'vue'
+
+import { useModerationSettings } from './moderation'
+
+export function useFloatingReviewPanelAppearance() {
+	const settings = useModerationSettings()
+	const general = moderationSettings.General
+	const style = computed(() => {
+		const background =
+			settings.value.get(general.FloatingReviewPanelBackground) || 'var(--color-orange)'
+		const opacity = settings.value.get(general.FloatingReviewPanelBackgroundOpacity)
+		const tint = `color-mix(in srgb, ${background} ${opacity}%, transparent)`
+		return {
+			borderColor:
+				settings.value.get(general.FloatingReviewPanelBorderColor) || 'var(--color-orange-highlight)',
+			borderWidth: `${settings.value.get(general.FloatingReviewPanelBorderWidth)}px`,
+			backgroundColor: 'var(--surface-1)',
+			backgroundImage: `linear-gradient(${tint}, ${tint})`,
+		}
+	})
+	return { style }
+}
diff --git a/apps/frontend/src/composables/moderation.ts b/apps/frontend/src/composables/moderation.ts
index 3c16cbf5e7b..b107e4fec69 100644
--- a/apps/frontend/src/composables/moderation.ts
+++ b/apps/frontend/src/composables/moderation.ts
@@ -2,6 +2,11 @@ import { type KeybindDefinition, Keybinds, Settings } from '@modrinth/moderation
 import { computed } from 'vue'
 
 import type { CookieOptions } from '#app'
+import {
+	defaultAppearance,
+	parseAppearance,
+	type AppearanceValues,
+} from '~/helpers/moderation-appearance'
 import { FrontendNotificationManager } from '~/providers/frontend-notifications'
 
 const moderationKeybindsId = 'moderation-keybinds'
@@ -12,6 +17,7 @@ type StoredSettings = { [id: string]: any }
 type StoredOptions = {
 	keybinds: Partial<StoredKeybinds>
 	settings: Partial<StoredSettings>
+	appearanceTheme?: { id: string; values: AppearanceValues }
 }
 
 const getCookieOptions = <T>() =>
@@ -47,37 +53,58 @@ const useModerationCookies = () => {
 }
 
 const useModerationOptions = () =>
-	useState<{ keybinds: StoredKeybinds; settings: StoredSettings }>(moderationKeybindsId, () => {
-		const cookie = useModerationCookies()
-		const stored = cookie.value ?? {}
-
-		const keybindOutput: StoredKeybinds = {}
-
-		for (const [id, definition] of Object.entries(stored.keybinds || {})) {
-			if (!definition) continue
-			keybindOutput[id] = definition
-		}
-
-		if (!('review-cycle-conversation' in keybindOutput)) {
-			const reply = keybindOutput['review-tab-reply']
-			const note = keybindOutput['review-tab-note']
-			if (reply?.length) keybindOutput['review-cycle-conversation'] = reply
-			else if (note?.length) keybindOutput['review-cycle-conversation'] = note
-			else if (reply || note) keybindOutput['review-cycle-conversation'] = []
-		}
-		delete keybindOutput['review-tab-reply']
-		delete keybindOutput['review-tab-note']
-
-		const settingsOutput: StoredSettings = {}
-		for (const [id, setting] of Object.entries(stored.settings || {})) {
-			settingsOutput[id] = setting
-		}
-
-		return {
-			keybinds: keybindOutput,
-			settings: settingsOutput,
-		}
-	})
+	useState<StoredOptions & { keybinds: StoredKeybinds; settings: StoredSettings }>(
+		moderationKeybindsId,
+		() => {
+			const cookie = useModerationCookies()
+			const stored = cookie.value ?? {}
+
+			const keybindOutput: StoredKeybinds = {}
+
+			for (const [id, definition] of Object.entries(stored.keybinds || {})) {
+				if (!definition) continue
+				keybindOutput[id] = definition
+			}
+
+			if (!('review-cycle-conversation' in keybindOutput)) {
+				const reply = keybindOutput['review-tab-reply']
+				const note = keybindOutput['review-tab-note']
+				if (reply?.length) keybindOutput['review-cycle-conversation'] = reply
+				else if (note?.length) keybindOutput['review-cycle-conversation'] = note
+				else if (reply || note) keybindOutput['review-cycle-conversation'] = []
+			}
+			delete keybindOutput['review-tab-reply']
+			delete keybindOutput['review-tab-note']
+
+			const settingsOutput: StoredSettings = {}
+			for (const [id, setting] of Object.entries(stored.settings || {})) {
+				settingsOutput[id] = setting
+			}
+
+			let appearanceTheme: StoredOptions['appearanceTheme']
+			try {
+				if (stored.appearanceTheme) {
+					appearanceTheme = {
+						id: 'custom',
+						values: parseAppearance(
+							JSON.stringify({
+								format: 'modrinth-review-appearance',
+								version: 1,
+								values: stored.appearanceTheme.values,
+							}),
+						),
+					}
+				}
+			} catch {
+				appearanceTheme = undefined
+			}
+			return {
+				keybinds: keybindOutput,
+				settings: settingsOutput,
+				appearanceTheme,
+			}
+		},
+	)
 
 export const useModerationKeybinds = () =>
 	computed(() => new Keybinds(useModerationOptions().value.keybinds))
@@ -85,6 +112,16 @@ export const useModerationKeybinds = () =>
 export const useModerationSettings = () =>
 	computed(() => new Settings(useModerationOptions().value.settings, saveModerationOptions))
 
+export const useModerationAppearanceTheme = () =>
+	computed({
+		get: () =>
+			useModerationOptions().value.appearanceTheme ?? { id: 'default', values: defaultAppearance },
+		set: (theme: NonNullable<StoredOptions['appearanceTheme']>) => {
+			useModerationOptions().value.appearanceTheme = theme
+			saveModerationOptions()
+		},
+	})
+
 export const saveModerationOptions = () => {
 	const options = useModerationOptions()
 	const cookie = useModerationCookies()
@@ -92,6 +129,7 @@ export const saveModerationOptions = () => {
 	cookie.value = {
 		keybinds: options.value.keybinds,
 		settings: options.value.settings,
+		appearanceTheme: options.value.appearanceTheme,
 	}
 }
 
diff --git a/apps/frontend/src/composables/review-highlight.ts b/apps/frontend/src/composables/review-highlight.ts
new file mode 100644
index 00000000000..eae81375580
--- /dev/null
+++ b/apps/frontend/src/composables/review-highlight.ts
@@ -0,0 +1,22 @@
+import { moderationSettings } from '@modrinth/moderation'
+import { computed } from 'vue'
+
+import { useModerationSettings } from './moderation'
+
+export function useReviewHighlight() {
+	const settings = useModerationSettings()
+	const color = computed(
+		() =>
+			settings.value.get(moderationSettings.General.ReviewHighlightColor) || 'var(--color-orange)',
+	)
+	const opacity = computed(() =>
+		settings.value.get(moderationSettings.General.ReviewHighlightOpacity),
+	)
+	const background = computed(
+		() => `color-mix(in srgb, ${color.value} ${opacity.value}%, transparent)`,
+	)
+	const flashBackground = computed(
+		() => `color-mix(in srgb, ${color.value} ${Math.min(100, opacity.value * 2)}%, transparent)`,
+	)
+	return { color, opacity, background, flashBackground }
+}
diff --git a/apps/frontend/src/helpers/moderation-appearance.ts b/apps/frontend/src/helpers/moderation-appearance.ts
new file mode 100644
index 00000000000..cc4ff674843
--- /dev/null
+++ b/apps/frontend/src/helpers/moderation-appearance.ts
@@ -0,0 +1,71 @@
+import { isValidFor, moderationSettings, type Settings } from '@modrinth/moderation'
+
+const general = moderationSettings.General
+export const appearanceFields = {
+	highlightColor: general.ReviewHighlightColor,
+	highlightOpacity: general.ReviewHighlightOpacity,
+	panelBorderColor: general.FloatingReviewPanelBorderColor,
+	panelBackground: general.FloatingReviewPanelBackground,
+	panelOpacity: general.FloatingReviewPanelBackgroundOpacity,
+	panelBorderWidth: general.FloatingReviewPanelBorderWidth,
+	issueColor: general.IssueToggleColor,
+}
+export type AppearanceValues = {
+	[K in keyof typeof appearanceFields]: (typeof appearanceFields)[K]['default']
+}
+
+export function readAppearance(settings: Settings): AppearanceValues {
+	return Object.fromEntries(
+		Object.entries(appearanceFields).map(([key, definition]) => [
+			key,
+			settings.get<string | number>(definition),
+		]),
+	) as AppearanceValues
+}
+
+export function applyAppearance(settings: Settings, values: AppearanceValues) {
+	for (const [key, definition] of Object.entries(appearanceFields)) {
+		settings.set<string | number>(definition, values[key as keyof AppearanceValues])
+	}
+}
+
+export const defaultAppearance = Object.fromEntries(
+	Object.entries(appearanceFields).map(([key, definition]) => [key, definition.default]),
+) as AppearanceValues
+
+export function exportAppearance(settings: Settings) {
+	const values = readAppearance(settings)
+	return JSON.stringify(
+		{
+			format: 'modrinth-review-appearance',
+			version: 1,
+			values: Object.fromEntries(
+				Object.entries(values).map(([key, value]) => [key, value === '' ? null : value]),
+			),
+		},
+		null,
+		2,
+	)
+}
+
+export function parseAppearance(source: string): AppearanceValues {
+	const data = JSON.parse(source)
+	if (
+		!data ||
+		data.format !== 'modrinth-review-appearance' ||
+		data.version !== 1 ||
+		!data.values ||
+		typeof data.values !== 'object' ||
+		Array.isArray(data.values)
+	)
+		throw new Error('format')
+	if (Object.keys(data.values).length !== Object.keys(appearanceFields).length)
+		throw new Error('fields')
+	const values: Record<string, string | number> = {}
+	for (const [key, definition] of Object.entries(appearanceFields)) {
+		const value = data.values[key] === null && definition.type === 'color' ? '' : data.values[key]
+		if (!isValidFor(definition, value)) throw new Error('value')
+		values[key] = typeof value === 'string' ? value.toLowerCase() : value
+	}
+	return values as AppearanceValues
+}
diff --git a/apps/frontend/src/pages/settings/moderation/index.vue b/apps/frontend/src/pages/settings/moderation/index.vue
index 1c833909c97..9570a7c1513 100644
--- a/apps/frontend/src/pages/settings/moderation/index.vue
+++ b/apps/frontend/src/pages/settings/moderation/index.vue
@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import ModerationAppearance from '~/components/ui/moderation/settings/ModerationAppearance.vue'
 import ModerationKeybinds from '~/components/ui/moderation/settings/ModerationKeybinds.vue'
 import ModerationSettings from '~/components/ui/moderation/settings/ModerationSettings.vue'
 
@@ -14,4 +15,5 @@ useSeoMeta({
 <template>
 	<ModerationKeybinds />
 	<ModerationSettings />
+	<ModerationAppearance />
 </template>
diff --git a/packages/moderation/src/data/settings.ts b/packages/moderation/src/data/settings.ts
index 9060501c8a0..4dc3b250063 100644
--- a/packages/moderation/src/data/settings.ts
+++ b/packages/moderation/src/data/settings.ts
@@ -6,7 +6,8 @@ const settings = {
 			type: 'enum',
 			id: 'gallery-columns',
 			title: 'Gallery columns',
-			description: 'Number of gallery columns to display in project review, regardless of panel width.',
+			description:
+				'Number of gallery columns to display in project review, regardless of panel width.',
 			default: '3',
 			entries: [
 				{ label: '1', value: '1' },
@@ -21,7 +22,8 @@ const settings = {
 			type: 'toggle',
 			id: 'show-all-issue-controls',
 			title: 'Always show issue controls',
-			description: 'Show all issue controls in the issues menu regardless of visibility conditions.',
+			description:
+				'Show all issue controls in the issues menu regardless of visibility conditions.',
 			default: false,
 		}),
 		SendIssuesAsThreadMessage: setting.asToggle({
@@ -70,9 +72,9 @@ const settings = {
 		ShowFloatingPanelFieldHoverHighlight: setting.asToggle({
 			type: 'toggle',
 			id: 'show-floating-panel-field-hover-highlight',
-			title: 'Highlight fields for floating review panels',
+			title: 'Highlight review sections',
 			description:
-				'Highlight the reviewed field when hovering over it or its floating review panel.',
+				'Highlight the review section when hovering over it or its floating review panel.',
 			default: true,
 		}),
 		ShowInlinePanelHoverHighlight: setting.asToggle({
@@ -83,6 +85,69 @@ const settings = {
 				'Add a background highlight to inline review panels when hovering over or interacting with them.',
 			default: true,
 		}),
+		ReviewHighlightColor: setting.asColor({
+			type: 'color',
+			id: 'review-highlight-color',
+			title: 'Color',
+			description: 'Color for reviewed fields, inline review panels, and navigation flashes.',
+			default: '',
+		}),
+		ReviewHighlightOpacity: setting.asNumber({
+			type: 'number',
+			id: 'review-highlight-opacity',
+			title: 'Opacity',
+			description:
+				'Background opacity for review highlights. Navigation flashes use twice this opacity, up to 100%.',
+			default: 3,
+			min: 0,
+			max: 100,
+			step: 1,
+			unit: '%',
+		}),
+		IssueToggleColor: setting.asColor({
+			type: 'color',
+			id: 'issue-toggle-color',
+			title: 'Selected color',
+			description:
+				'Color for selected and partially selected issue buttons, with a 25% background tint.',
+			default: '',
+		}),
+		FloatingReviewPanelBorderColor: setting.asColor({
+			type: 'color',
+			id: 'floating-review-panel-border-color',
+			title: 'Border color',
+			description: 'Border color for floating review panels.',
+			default: '',
+		}),
+		FloatingReviewPanelBackground: setting.asColor({
+			type: 'color',
+			id: 'floating-review-panel-background',
+			title: 'Background',
+			description: 'Background tint color for floating review panels.',
+			default: '',
+		}),
+		FloatingReviewPanelBackgroundOpacity: setting.asNumber({
+			type: 'number',
+			id: 'floating-review-panel-background-opacity',
+			title: 'Opacity',
+			description: 'Background tint opacity for floating review panels.',
+			default: 3,
+			min: 0,
+			max: 100,
+			step: 1,
+			unit: '%',
+		}),
+		FloatingReviewPanelBorderWidth: setting.asNumber({
+			type: 'number',
+			id: 'floating-review-panel-border-width',
+			title: 'Border width',
+			description: 'Border width for floating review panels. Set to 0 to hide the border.',
+			default: 1,
+			min: 0,
+			max: 8,
+			step: 1,
+			unit: 'px',
+		}),
 		LinkInfoPlacement: setting.asEnum({
 			type: 'enum',
 			id: 'link-info-placement',
diff --git a/packages/moderation/src/types/settings.ts b/packages/moderation/src/types/settings.ts
index 6f5fdbeb33e..4f662e98f67 100644
--- a/packages/moderation/src/types/settings.ts
+++ b/packages/moderation/src/types/settings.ts
@@ -4,7 +4,7 @@ export interface SettingDefinitionBase<T> {
 	title: string
 	description: string
 	default: T
-	onChange?: (previous: T | undefined, current: T) => void
+	onChange?(previous: T | undefined, current: T): void
 }
 
 export interface ToggleSettingDefinition extends SettingDefinitionBase<boolean> {
@@ -24,6 +24,18 @@ export interface StringSettingDefinition extends SettingDefinitionBase<string> {
 	regex?: RegExp
 }
 
+export interface ColorSettingDefinition extends SettingDefinitionBase<string> {
+	type: 'color'
+}
+
+export interface NumberSettingDefinition extends SettingDefinitionBase<number> {
+	type: 'number'
+	min: number
+	max: number
+	step: number
+	unit?: string
+}
+
 export type SettingDefinitions = ReturnType<(typeof setting)[keyof typeof setting]>
 export type SettingDefinitionTypes = SettingDefinitions['type']
 
@@ -35,6 +47,8 @@ export const setting = {
 	},
 	asToggle: (data: ToggleSettingDefinition) => data,
 	asString: (data: StringSettingDefinition) => data,
+	asColor: (data: ColorSettingDefinition) => data,
+	asNumber: (data: NumberSettingDefinition) => data,
 }
 
 export function isValidFor(
@@ -48,6 +62,10 @@ export function isValidFor(
 			return true
 		} else if (definition.type == 'toggle' && typeof value === 'boolean') {
 			return true
+		} else if (definition.type === 'color' && typeof value === 'string') {
+			return value === '' || /^#[0-9a-f]{6}$/i.test(value)
+		} else if (definition.type === 'number' && typeof value === 'number') {
+			return Number.isFinite(value) && value >= definition.min && value <= definition.max
 		} else if (
 			definition.type == 'string' &&
 			typeof value === 'string' &&
@@ -64,3 +82,5 @@ export type SettingDefinition =
 	| ToggleSettingDefinition
 	| EnumSettingDefinition
 	| StringSettingDefinition
+	| ColorSettingDefinition
+	| NumberSettingDefinition
diff --git a/packages/ui/src/components/base/inputs/ColorPicker.vue b/packages/ui/src/components/base/inputs/ColorPicker.vue
index b9902fb37ec..5c85be126ff 100644
--- a/packages/ui/src/components/base/inputs/ColorPicker.vue
+++ b/packages/ui/src/components/base/inputs/ColorPicker.vue
@@ -6,6 +6,7 @@
 		class="relative flex shrink-0 cursor-pointer items-center justify-center rounded-xl transition-[filter,box-shadow] hover:brightness-125 focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-brand-shadow disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:brightness-100"
 		:class="triggerSizeClass"
 		:disabled="disabled"
+		:aria-label="label"
 		:aria-expanded="isOpen"
 		:aria-controls="panelId"
 		aria-haspopup="dialog"
@@ -17,13 +18,14 @@
 		/>
 	</button>
 
-	<Teleport v-if="isClient" to="body">
+	<Teleport v-if="isClient" :to="teleportTarget">
 		<Transition name="floating-expand">
 			<div
 				v-if="isOpen"
 				:id="panelId"
 				ref="panelRef"
-				class="fixed isolate z-[9999] w-56 rounded-[14px] bg-surface-3 p-3 shadow-lg ring-1 ring-surface-5"
+				popover="manual"
+				class="fixed isolate z-[9999] m-0 w-56 rounded-[14px] border-0 bg-surface-3 p-3 text-primary shadow-lg ring-1 ring-surface-5"
 				:style="panelStyle"
 				role="dialog"
 				:aria-label="label"
@@ -34,7 +36,7 @@
 					ref="svRef"
 					class="relative h-36 w-full touch-none select-none rounded-lg outline-none focus-visible:ring-4 focus-visible:ring-brand-shadow"
 					role="group"
-					:aria-label="`${label} saturation and brightness`"
+					:aria-label="formatMessage(messages.saturationAndBrightness, { label })"
 					tabindex="0"
 					:style="svBackgroundStyle"
 					@pointerdown="onSvPointerDown"
@@ -53,7 +55,7 @@
 					max="360"
 					step="1"
 					class="color-picker-hue-slider relative z-10 h-5 w-full"
-					:aria-label="`${label} hue`"
+					:aria-label="formatMessage(messages.hue, { label })"
 					:value="hue"
 					@input="onHueInput"
 				/>
@@ -65,7 +67,7 @@
 					<input
 						v-model="hexInput"
 						class="w-full min-w-0 appearance-none border-0 bg-transparent p-0 text-base font-medium uppercase shadow-none outline-none focus:ring-0"
-						:aria-label="`${label} hex value`"
+						:aria-label="formatMessage(messages.hexValue, { label })"
 						maxlength="6"
 						spellcheck="false"
 						@keydown.enter="commitHexInput"
@@ -79,8 +81,9 @@
 
 <script setup lang="ts">
 import { colord } from 'colord'
-import { computed, nextTick, onMounted, ref, useId, watch } from 'vue'
+import { computed, nextTick, onMounted, ref, shallowRef, useId, watch } from 'vue'
 
+import { defineMessages, useVIntl } from '../../../composables/i18n'
 import {
 	type AnchoredTeleportPlacement,
 	useAnchoredTeleport,
@@ -88,6 +91,15 @@ import {
 import InputFrame from './InputFrame.vue'
 
 const model = defineModel<string>({ required: true })
+const { formatMessage } = useVIntl()
+const messages = defineMessages({
+	saturationAndBrightness: {
+		id: 'color-picker.saturation-and-brightness',
+		defaultMessage: '{label} saturation and brightness',
+	},
+	hue: { id: 'color-picker.hue', defaultMessage: '{label} hue' },
+	hexValue: { id: 'color-picker.hex-value', defaultMessage: '{label} hex value' },
+})
 
 const props = withDefaults(
 	defineProps<{
@@ -116,8 +128,9 @@ const triggerRef = ref<HTMLButtonElement | null>(null)
 const panelRef = ref<HTMLElement | null>(null)
 const svRef = ref<HTMLElement | null>(null)
 const resolvedPlacement = computed(() => props.placement)
+const teleportTarget = shallowRef<Element | string>('body')
 
-const { isOpen, panelStyle, open, close } = useAnchoredTeleport(
+const { isOpen, panelStyle, open, close, updatePosition } = useAnchoredTeleport(
 	triggerRef,
 	panelRef,
 	resolvedPlacement,
@@ -250,7 +263,11 @@ function handlePanelKeydown(event: KeyboardEvent) {
 
 async function openPicker() {
 	if (props.disabled || isOpen.value) return
+	teleportTarget.value =
+		triggerRef.value?.closest('[role="dialog"]') ?? triggerRef.value?.ownerDocument.body ?? 'body'
 	await open()
+	panelRef.value?.showPopover()
+	updatePosition()
 	emit('focus')
 }
 

From 9ab4bdaa941b29a95f033e61418b8f82c42eb45f Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Tue, 20 Oct 2026 13:23:36 -0600
Subject: [PATCH 23/28] feat: add import export keybinds

---
 .../moderation/settings/ModerationKeybind.vue |  11 +-
 .../settings/ModerationKeybindTransfer.vue    | 207 ++++++++++++++++++
 .../settings/ModerationKeybinds.vue           |   6 +-
 apps/frontend/src/composables/moderation.ts   |  81 +++++++
 4 files changed, 303 insertions(+), 2 deletions(-)
 create mode 100644 apps/frontend/src/components/ui/moderation/settings/ModerationKeybindTransfer.vue

diff --git a/apps/frontend/src/components/ui/moderation/settings/ModerationKeybind.vue b/apps/frontend/src/components/ui/moderation/settings/ModerationKeybind.vue
index 8660fb2dbf3..9b5723bc6d7 100644
--- a/apps/frontend/src/components/ui/moderation/settings/ModerationKeybind.vue
+++ b/apps/frontend/src/components/ui/moderation/settings/ModerationKeybind.vue
@@ -77,7 +77,7 @@ import {
 } from '@modrinth/assets'
 import { formatKeybind, type KeybindDefinition, toKeybindDefinition } from '@modrinth/moderation'
 import { Button, defineMessages, IconButton, useVIntl } from '@modrinth/ui'
-import { computed, onMounted, onUnmounted, ref, useId, useTemplateRef } from 'vue'
+import { computed, onMounted, onUnmounted, ref, useId, useTemplateRef, watch } from 'vue'
 
 const props = defineProps<{
 	title: string
@@ -151,6 +151,15 @@ function stopEditing() {
 	recordingWindow = null
 }
 
+watch(
+	() => props.definitions,
+	(value) => {
+		stopEditing()
+		definitions.value = JSON.parse(JSON.stringify(value))
+	},
+	{ deep: true },
+)
+
 function resetToDefault() {
 	stopEditing()
 	definitions.value = JSON.parse(JSON.stringify(props.default))
diff --git a/apps/frontend/src/components/ui/moderation/settings/ModerationKeybindTransfer.vue b/apps/frontend/src/components/ui/moderation/settings/ModerationKeybindTransfer.vue
new file mode 100644
index 00000000000..f5ee95822d2
--- /dev/null
+++ b/apps/frontend/src/components/ui/moderation/settings/ModerationKeybindTransfer.vue
@@ -0,0 +1,207 @@
+<script setup lang="ts">
+import { DownloadIcon, FileIcon } from '@modrinth/assets'
+import { Button, defineMessages, NewModal, Textarea, useVIntl } from '@modrinth/ui'
+import { ref, useId } from 'vue'
+
+import {
+	exportKeybinds,
+	parseKeybinds,
+	replaceModerationKeybinds,
+	useModerationKeybinds,
+} from '~/composables/moderation'
+
+const keybinds = useModerationKeybinds()
+const { formatMessage } = useVIntl()
+const messages = defineMessages({
+	import: {
+		id: 'moderation.keybinds.transfer.import',
+		defaultMessage: 'Import keybinds',
+	},
+	export: {
+		id: 'moderation.keybinds.transfer.export',
+		defaultMessage: 'Export keybinds',
+	},
+	json: {
+		id: 'moderation.keybinds.transfer.json',
+		defaultMessage: 'Keybind JSON',
+	},
+	importHelp: {
+		id: 'moderation.keybinds.transfer.import-help',
+		defaultMessage:
+			'Paste keybind JSON or choose a JSON file. Applying replaces your keybinds; omitted actions return to defaults.',
+	},
+	exportHelp: {
+		id: 'moderation.keybinds.transfer.export-help',
+		defaultMessage: 'Copy your custom keybinds as JSON or download them to share or import later.',
+	},
+	file: {
+		id: 'moderation.keybinds.transfer.file',
+		defaultMessage: 'Choose JSON file',
+	},
+	download: {
+		id: 'moderation.keybinds.transfer.download',
+		defaultMessage: 'Download JSON',
+	},
+	copy: {
+		id: 'moderation.keybinds.transfer.copy',
+		defaultMessage: 'Copy JSON',
+	},
+	copied: {
+		id: 'moderation.keybinds.transfer.copied',
+		defaultMessage: 'Copied!',
+	},
+	apply: {
+		id: 'moderation.keybinds.transfer.apply',
+		defaultMessage: 'Apply keybinds',
+	},
+	invalid: {
+		id: 'moderation.keybinds.transfer.invalid',
+		defaultMessage:
+			'Invalid keybinds. Use a version 1 review keybind export with known action IDs, arrays of key definitions, and boolean modifiers.',
+	},
+	tooLarge: {
+		id: 'moderation.keybinds.transfer.too-large',
+		defaultMessage:
+			'These keybinds exceed the space available in your saved moderation settings. Reduce the number of custom bindings and try again.',
+	},
+	fileError: {
+		id: 'moderation.keybinds.transfer.file-error',
+		defaultMessage: 'Could not read this file. Choose a JSON file smaller than 64 KB.',
+	},
+	copyError: {
+		id: 'moderation.keybinds.transfer.copy-error',
+		defaultMessage: 'Could not copy automatically. Select and copy the JSON below.',
+	},
+})
+const root = ref<HTMLElement>()
+const fileInput = ref<HTMLInputElement>()
+const modal = ref<InstanceType<typeof NewModal>>()
+const mode = ref<'import' | 'export'>('import')
+const json = ref('')
+const error = ref('')
+const copied = ref(false)
+const jsonId = useId()
+function show(nextMode: 'import' | 'export') {
+	mode.value = nextMode
+	json.value = nextMode === 'export' ? exportKeybinds(keybinds.value) : ''
+	error.value = ''
+	copied.value = false
+	modal.value?.show()
+}
+
+function apply() {
+	try {
+		replaceModerationKeybinds(parseKeybinds(json.value))
+		modal.value?.hide()
+	} catch (cause) {
+		error.value = formatMessage(
+			cause instanceof Error && cause.message === 'storage-size'
+				? messages.tooLarge
+				: messages.invalid,
+		)
+	}
+}
+
+async function readFile(event: Event) {
+	const input = event.target as HTMLInputElement
+	const file = input.files?.[0]
+	input.value = ''
+	if (!file) return
+	error.value = ''
+	try {
+		if (file.size > 65536) throw new Error('size')
+		json.value = await file.text()
+	} catch {
+		error.value = formatMessage(messages.fileError)
+	}
+}
+
+async function copy() {
+	try {
+		const view = root.value?.ownerDocument.defaultView
+		if (!view) return
+		await view.navigator.clipboard.writeText(json.value)
+		copied.value = true
+	} catch {
+		error.value = formatMessage(messages.copyError)
+	}
+}
+
+function download() {
+	const document = root.value?.ownerDocument
+	const view = document?.defaultView
+	if (!document || !view) return
+	const url = view.URL.createObjectURL(new Blob([json.value], { type: 'application/json' }))
+	const link = document.createElement('a')
+	link.href = url
+	link.download = 'modrinth-review-keybinds.json'
+	link.click()
+	view.setTimeout(() => view.URL.revokeObjectURL(url), 1000)
+}
+</script>
+
+<template>
+	<div ref="root" class="ml-auto shrink-0">
+		<div class="flex flex-wrap gap-2">
+			<Button size="sm" @click="show('import')">{{ formatMessage(messages.import) }}</Button>
+			<Button size="sm" @click="show('export')">{{ formatMessage(messages.export) }}</Button>
+		</div>
+		<NewModal
+			ref="modal"
+			:header="formatMessage(messages[mode])"
+			width="40rem"
+			max-width="calc(100vw - 2rem)"
+		>
+			<div class="flex flex-col gap-4">
+				<p class="m-0 text-secondary">
+					{{ formatMessage(mode === 'import' ? messages.importHelp : messages.exportHelp) }}
+				</p>
+				<label :for="jsonId" class="font-semibold text-contrast">{{
+					formatMessage(messages.json)
+				}}</label>
+				<Textarea
+					:id="jsonId"
+					v-model="json"
+					:readonly="mode === 'export'"
+					:rows="14"
+					:spellcheck="false"
+					resize="vertical"
+					input-class="font-mono text-sm"
+					:error="!!error"
+					@input="error = ''"
+				/>
+				<p v-if="error" role="alert" class="m-0 text-sm text-red">
+					{{ error }}
+				</p>
+				<div class="flex flex-wrap justify-end gap-2">
+					<template v-if="mode === 'import'">
+						<input
+							ref="fileInput"
+							type="file"
+							accept=".json,application/json"
+							class="hidden"
+							:aria-label="formatMessage(messages.file)"
+							@change="readFile"
+						/>
+						<Button @click="fileInput?.click()">
+							<FileIcon aria-hidden="true" />
+							{{ formatMessage(messages.file) }}
+						</Button>
+						<Button type="colored" color="brand" :disabled="!json.trim()" @click="apply">{{
+							formatMessage(messages.apply)
+						}}</Button>
+					</template>
+					<template v-else>
+						<Button @click="download">
+							<DownloadIcon aria-hidden="true" />
+							{{ formatMessage(messages.download) }}
+						</Button>
+						<Button type="colored" color="brand" @click="copy">{{
+							formatMessage(copied ? messages.copied : messages.copy)
+						}}</Button>
+					</template>
+				</div>
+			</div>
+		</NewModal>
+	</div>
+</template>
diff --git a/apps/frontend/src/components/ui/moderation/settings/ModerationKeybinds.vue b/apps/frontend/src/components/ui/moderation/settings/ModerationKeybinds.vue
index e2cd7ed5d15..90f8b14aa56 100644
--- a/apps/frontend/src/components/ui/moderation/settings/ModerationKeybinds.vue
+++ b/apps/frontend/src/components/ui/moderation/settings/ModerationKeybinds.vue
@@ -5,6 +5,7 @@ import { defineMessages, Input, useVIntl } from '@modrinth/ui'
 import { computed, ref } from 'vue'
 
 import ModerationKeybind from '~/components/ui/moderation/settings/ModerationKeybind.vue'
+import ModerationKeybindTransfer from '~/components/ui/moderation/settings/ModerationKeybindTransfer.vue'
 import { saveModerationOptions, useModerationKeybinds } from '~/composables/moderation'
 
 defineProps<{
@@ -174,7 +175,10 @@ const conflictLabels = computed(() => {
 
 <template>
 	<div :class="{ 'universal-card': !embedded }">
-		<h2 class="m-0 mb-2.5 text-2xl">{{ formatMessage(messages.keybinds) }}</h2>
+		<div class="mb-2.5 flex flex-wrap items-center gap-2">
+			<h2 class="m-0 text-2xl">{{ formatMessage(messages.keybinds) }}</h2>
+			<ModerationKeybindTransfer />
+		</div>
 		<Input
 			v-model="search"
 			type="search"
diff --git a/apps/frontend/src/composables/moderation.ts b/apps/frontend/src/composables/moderation.ts
index b107e4fec69..7103abc12e6 100644
--- a/apps/frontend/src/composables/moderation.ts
+++ b/apps/frontend/src/composables/moderation.ts
@@ -109,6 +109,87 @@ const useModerationOptions = () =>
 export const useModerationKeybinds = () =>
 	computed(() => new Keybinds(useModerationOptions().value.keybinds))
 
+const booleanFields = ['mod', 'ctrl', 'shift', 'alt', 'meta', 'preventDefault'] as const
+
+function compactDefinition(definition: KeybindDefinition): KeybindDefinition {
+	const portableMod = definition.mod || (definition.ctrl && definition.meta !== false)
+	return {
+		key: definition.key.toLowerCase(),
+		...(portableMod ? { mod: true } : {}),
+		...(!portableMod && definition.ctrl ? { ctrl: true, meta: false } : {}),
+		...(!portableMod && definition.meta ? { meta: true } : {}),
+		...(definition.shift ? { shift: true } : {}),
+		...(definition.alt ? { alt: true } : {}),
+		...(definition.preventDefault === false ? { preventDefault: false } : {}),
+	}
+}
+
+function readOverrides(keybinds: Keybinds): StoredKeybinds {
+	return Object.fromEntries(
+		[...keybinds].flatMap(([id, binding]) => {
+			const definitions = binding.keybind.map(compactDefinition)
+			const defaults = binding.defaultKeybind.map(compactDefinition)
+			return JSON.stringify(definitions) === JSON.stringify(defaults) ? [] : [[id, definitions]]
+		}),
+	)
+}
+
+export function exportKeybinds(keybinds: Keybinds): string {
+	return JSON.stringify(
+		{
+			format: 'modrinth-review-keybinds',
+			version: 1,
+			values: readOverrides(keybinds),
+		},
+		null,
+		2,
+	)
+}
+
+export function parseKeybinds(source: string): StoredKeybinds {
+	if (new TextEncoder().encode(source).length > 65536) throw new Error('size')
+	const data = JSON.parse(source)
+	if (
+		!data ||
+		data.format !== 'modrinth-review-keybinds' ||
+		data.version !== 1 ||
+		!data.values ||
+		typeof data.values !== 'object' ||
+		Array.isArray(data.values)
+	)
+		throw new Error('format')
+	const knownIds = new Set([...new Keybinds({})].map(([id]) => id))
+	const values: StoredKeybinds = {}
+	for (const [id, definitions] of Object.entries(data.values)) {
+		if (!knownIds.has(id) || !Array.isArray(definitions)) throw new Error('action')
+		values[id] = definitions.map((definition) => {
+			if (
+				!definition ||
+				typeof definition !== 'object' ||
+				Array.isArray(definition) ||
+				typeof definition.key !== 'string' ||
+				!definition.key.length ||
+				definition.key.length > 64 ||
+				Object.keys(definition).some(
+					(key) => key !== 'key' && !booleanFields.some((field) => field === key),
+				) ||
+				booleanFields.some((field) => field in definition && typeof definition[field] !== 'boolean')
+			)
+				throw new Error('definition')
+			return compactDefinition(definition)
+		})
+	}
+	return readOverrides(new Keybinds(values))
+}
+
+export function replaceModerationKeybinds(keybinds: StoredKeybinds) {
+	const options = useModerationOptions()
+	const nextOptions = { ...options.value, keybinds }
+	if (encodeURIComponent(JSON.stringify(nextOptions)).length > 3800) throw new Error('storage-size')
+	options.value.keybinds = keybinds
+	saveModerationOptions()
+}
+
 export const useModerationSettings = () =>
 	computed(() => new Settings(useModerationOptions().value.settings, saveModerationOptions))
 

From 0d59fbb8fea613e199a5648b06a091f5d2322a86 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Tue, 20 Oct 2026 13:26:22 -0600
Subject: [PATCH 24/28] fix: capitalize tags for issue message

---
 packages/moderation/src/data/issues/categories.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/moderation/src/data/issues/categories.ts b/packages/moderation/src/data/issues/categories.ts
index 1578951a8ae..28b6d53ee15 100644
--- a/packages/moderation/src/data/issues/categories.ts
+++ b/packages/moderation/src/data/issues/categories.ts
@@ -1,4 +1,5 @@
 import { TagsIcon } from '@modrinth/assets'
+import { capitalizeString } from '@modrinth/utils'
 
 import inaccurateMessage from '../messages/checklist/messages/tags/inaccurate.md'
 import optimizationMisusedMessage from '../messages/checklist/messages/tags/optimization-misused.md'
@@ -45,7 +46,7 @@ export const categoriesInaccurateIssue = issue({
 				? resolutionsMisusedMessage
 				: '',
 			tags.length
-				? `Please remove these tags from your project:  \n\n${tags.map((tag) => `- ${tag}`).join('\n')}`
+				? `Please remove these tags from your project:  \n\n${tags.map((tag) => `- ${capitalizeString(tag)}`).join('\n')}`
 				: '',
 		]
 			.filter((message) => message.trim())

From 462b658a509fc55bc555828756e8b1ce975aec9a Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Tue, 20 Oct 2026 14:28:28 -0600
Subject: [PATCH 25/28] fix: have any multiselects in project review allow 3
 rows of tags

---
 .../src/components/project-review/issue-list/issue-card.vue     | 2 +-
 .../src/components/project-review/issue-list/issue-picker.vue   | 1 +
 .../src/components/project-review/issue-list/issue-toggles.vue  | 1 +
 .../project-review/issue-list/stories/IssueCatalogueRow.vue     | 1 +
 .../project-review/project-info/edit/server-details.vue         | 2 +-
 .../components/project-review/review-panel/controls/index.vue   | 1 +
 6 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/apps/frontend/src/components/project-review/issue-list/issue-card.vue b/apps/frontend/src/components/project-review/issue-list/issue-card.vue
index 14601dfcc4c..93b4f4f9bfe 100644
--- a/apps/frontend/src/components/project-review/issue-list/issue-card.vue
+++ b/apps/frontend/src/components/project-review/issue-list/issue-card.vue
@@ -128,7 +128,7 @@
 										:model-value="issue.custom.facets"
 										:options="facetOptions"
 										searchable
-										:max-tag-rows="4"
+										:max-tag-rows="3"
 										:search-placeholder="formatMessage(messages.searchFacets)"
 										:disabled="pending || disabled"
 										:placeholder="formatMessage(messages.addFacets)"
diff --git a/apps/frontend/src/components/project-review/issue-list/issue-picker.vue b/apps/frontend/src/components/project-review/issue-list/issue-picker.vue
index ac93989ab87..b69d2d67c34 100644
--- a/apps/frontend/src/components/project-review/issue-list/issue-picker.vue
+++ b/apps/frontend/src/components/project-review/issue-list/issue-picker.vue
@@ -3,6 +3,7 @@
 		ref="picker"
 		:model-value="draft"
 		:options="options"
+		:max-tag-rows="3"
 		:disabled="pending"
 		:searchable="true"
 		:search-placeholder="formatMessage(messages.search)"
diff --git a/apps/frontend/src/components/project-review/issue-list/issue-toggles.vue b/apps/frontend/src/components/project-review/issue-list/issue-toggles.vue
index 5e9365eb2c2..37d85b09de1 100644
--- a/apps/frontend/src/components/project-review/issue-list/issue-toggles.vue
+++ b/apps/frontend/src/components/project-review/issue-list/issue-toggles.vue
@@ -26,6 +26,7 @@
 				<MultiSelect
 					:model-value="groupedOptions ? selectedRowValues(row) : optionDraft"
 					:options="optionsForRow(row)"
+					:max-tag-rows="3"
 					:disabled="pending || disabled"
 					:dropdown-width="280"
 					lock-dropdown-horizontal-position
diff --git a/apps/frontend/src/components/project-review/issue-list/stories/IssueCatalogueRow.vue b/apps/frontend/src/components/project-review/issue-list/stories/IssueCatalogueRow.vue
index 8b33c896526..bcf91fc016f 100644
--- a/apps/frontend/src/components/project-review/issue-list/stories/IssueCatalogueRow.vue
+++ b/apps/frontend/src/components/project-review/issue-list/stories/IssueCatalogueRow.vue
@@ -184,6 +184,7 @@ reset()
 									v-if="control.type === 'select' && control.multiple"
 									:model-value="panels.selectValues(binding, control)"
 									:options="control.options"
+									:max-tag-rows="3"
 									:placeholder="control.placeholder ?? 'Select an option'"
 									:aria-label="control.label"
 									:aria-required="control.required"
diff --git a/apps/frontend/src/components/project-review/project-info/edit/server-details.vue b/apps/frontend/src/components/project-review/project-info/edit/server-details.vue
index ac7372a77a6..e2ba2c8ae68 100644
--- a/apps/frontend/src/components/project-review/project-info/edit/server-details.vue
+++ b/apps/frontend/src/components/project-review/project-info/edit/server-details.vue
@@ -30,7 +30,7 @@
 					v-model="languages"
 					:options="languageOptions"
 					:disabled="saving"
-					:max-tag-rows="2"
+					:max-tag-rows="3"
 					searchable
 					include-select-all-option
 				/>
diff --git a/apps/frontend/src/components/project-review/review-panel/controls/index.vue b/apps/frontend/src/components/project-review/review-panel/controls/index.vue
index b8468bd72ad..240e7a74bd7 100644
--- a/apps/frontend/src/components/project-review/review-panel/controls/index.vue
+++ b/apps/frontend/src/components/project-review/review-panel/controls/index.vue
@@ -82,6 +82,7 @@
 							v-else-if="control.type === 'select' && control.multiple"
 							:model-value="panels.selectValues(panelBinding, control)"
 							:options="control.options"
+							:max-tag-rows="3"
 							:placeholder="control.placeholder ?? formatMessage(controlMessages.select)"
 							:disabled="control.disabled"
 							:aria-label="control.label"

From e47d4dfc5ea9af3b59e90f7b37f9e81a1ba60df9 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Tue, 20 Oct 2026 15:29:44 -0600
Subject: [PATCH 26/28] feat: view mode layout for disclosures

---
 .../project-review/disclosures/view.vue       | 356 ++++++++++++++++++
 .../disclosures/AiDisclosureCard.vue          |  17 +-
 .../disclosures/DerivativeDisclosureCard.vue  |   2 +
 .../disclosures/DisclosureCards.vue           |  66 +++-
 .../disclosures/DisclosureExplanation.vue     | 148 +-------
 .../disclosures/DisclosureToggleCard.vue      |   8 +
 .../PaidFeaturesDisclosureCard.vue            |   1 +
 .../ProjectReviewDisclosureCard.vue           |  55 ++-
 .../disclosures/TelemetryDisclosureCard.vue   |   1 +
 .../ui/project-settings/disclosures/form.ts   |  25 ++
 .../ui/project-settings/disclosures/types.ts  |   8 +
 .../disclosures/use-disclosure-editor.ts      |  75 +++-
 12 files changed, 588 insertions(+), 174 deletions(-)
 create mode 100644 apps/frontend/src/components/project-review/disclosures/view.vue

diff --git a/apps/frontend/src/components/project-review/disclosures/view.vue b/apps/frontend/src/components/project-review/disclosures/view.vue
new file mode 100644
index 00000000000..916a93a2378
--- /dev/null
+++ b/apps/frontend/src/components/project-review/disclosures/view.vue
@@ -0,0 +1,356 @@
+<script setup lang="ts">
+import {
+	ArchiveIcon,
+	BrainCogIcon,
+	CircleDollarSignIcon,
+	EyeIcon,
+	ExternalIcon,
+	GitForkIcon,
+	MegaphoneIcon,
+	MonitorCogIcon,
+	RadioTowerIcon,
+	SparklesIcon,
+} from '@modrinth/assets'
+import {
+	AutoLink,
+	commonMessages,
+	defineMessages,
+	disclosureAiUsageMessages,
+	disclosureTelemetryConsentMessages,
+	formatDisclosureTypeLabel,
+	TagItem,
+	useVIntl,
+} from '@modrinth/ui'
+import { type Component, computed } from 'vue'
+
+import { formToDisclosures } from '~/components/ui/project-settings/disclosures/form'
+import DisclosureLockControls from '~/components/ui/project-settings/disclosures/DisclosureLockControls.vue'
+import ProjectReviewDisclosureCard from '~/components/ui/project-settings/disclosures/ProjectReviewDisclosureCard.vue'
+import DisclosureUpdatedBy from '~/components/ui/project-settings/disclosures/DisclosureUpdatedBy.vue'
+import type {
+	DisclosureFormState,
+	DisclosureType,
+} from '~/components/ui/project-settings/disclosures/types'
+import { injectProjectReviewPageContext } from '~/providers/project-review'
+import { injectReviewPanels } from '~/providers/project-review/review-panels'
+
+const props = defineProps<{ type: DisclosureType }>()
+const emit = defineEmits<{ edit: [] }>()
+
+const { disclosures } = injectProjectReviewPageContext()
+const panels = injectReviewPanels()
+const { formatMessage } = useVIntl()
+const messages = defineMessages({
+	generatedContent: {
+		id: 'moderation.disclosures.fields.generated-content',
+		defaultMessage: 'Content types',
+	},
+	paidFeatures: {
+		id: 'moderation.disclosures.fields.paid-features',
+		defaultMessage: 'Paid features',
+	},
+	consentModel: {
+		id: 'moderation.disclosures.fields.consent-model',
+		defaultMessage: 'Consent model',
+	},
+	dataCollected: {
+		id: 'moderation.disclosures.fields.data-collected',
+		defaultMessage: 'Data collected',
+	},
+	originalWorks: {
+		id: 'moderation.disclosures.fields.original-works',
+		defaultMessage: 'Original works',
+	},
+	originalName: {
+		id: 'moderation.disclosures.fields.original-name',
+		defaultMessage: 'Name',
+	},
+	originalLink: {
+		id: 'moderation.disclosures.fields.original-link',
+		defaultMessage: 'Link',
+	},
+	derivativeExplanation: {
+		id: 'moderation.disclosures.fields.derivative-explanation',
+		defaultMessage: "How it's used",
+	},
+	interactions: {
+		id: 'moderation.disclosures.fields.interactions',
+		defaultMessage: 'System interactions',
+	},
+	photosensitivityDescription: {
+		id: 'moderation.disclosures.fields.photosensitivity-description',
+		defaultMessage: 'Photosensitivity triggers',
+	},
+	archiveReason: {
+		id: 'moderation.disclosures.fields.archive-reason',
+		defaultMessage: 'Reason for archiving',
+	},
+	noneProvided: {
+		id: 'moderation.disclosures.empty.none-provided',
+		defaultMessage: 'None provided.',
+	},
+	noneListed: {
+		id: 'moderation.disclosures.empty.none-listed',
+		defaultMessage: 'None listed.',
+	},
+})
+const types = [
+	{ type: 'ai_content', formKey: 'ai', icon: SparklesIcon, key: 'ai' },
+	{
+		type: 'ai_functionality',
+		formKey: 'aiFunctionality',
+		icon: BrainCogIcon,
+		key: 'ai-functionality',
+	},
+	{ type: 'advertisements', formKey: 'advertising', icon: MegaphoneIcon, key: 'ads' },
+	{
+		type: 'paid_features',
+		formKey: 'paidFeatures',
+		icon: CircleDollarSignIcon,
+		key: 'paid-features',
+	},
+	{ type: 'telemetry', formKey: 'telemetry', icon: RadioTowerIcon, key: 'telemetry' },
+	{ type: 'derivative_work', formKey: 'derivative', icon: GitForkIcon, key: 'derivative-content' },
+	{
+		type: 'epilepsy_triggers',
+		formKey: 'photosensitivity',
+		icon: EyeIcon,
+		key: 'photosensitivity',
+	},
+	{
+		type: 'system_interactions',
+		formKey: 'systemInteractions',
+		icon: MonitorCogIcon,
+		key: 'system-interactions',
+	},
+	{ type: 'archived', formKey: 'archived', icon: ArchiveIcon, key: 'archive' },
+] satisfies {
+	type: DisclosureType
+	key: string
+	icon: Component
+	formKey: keyof Omit<DisclosureFormState, 'lockStatuses'>
+}[]
+const sections = computed(() =>
+	types
+		.filter(({ type }) => type === props.type)
+		.map(({ type, key, icon, formKey }) => ({
+			icon,
+			type,
+			key,
+			title:
+				panels.resolve({ kind: 'disclosure', key })?.panel.title ??
+				formatDisclosureTypeLabel(formatMessage, type),
+			data: formToDisclosures(disclosures.current.value).find((entry) => entry.type === type),
+			meta: disclosures.disclosureUpdateProps(type),
+			lock: disclosures.current.value.lockStatuses[type],
+			model: disclosures.current.value[formKey],
+		})),
+)
+</script>
+
+<template>
+	<div class="disclosure-details flex min-w-0 flex-col gap-4 text-sm text-secondary">
+		<ProjectReviewDisclosureCard
+			v-for="section in sections"
+			:key="section.type"
+			v-model="section.model.enabled"
+			:title="section.title"
+			:icon="section.icon"
+			:disabled="section.meta.disabled"
+			:toggle-disabled="section.meta.toggleDisabled"
+			:on-toggle-editing="() => emit('edit')"
+		>
+			<template v-if="section.meta.showLockControls" #lock-controls>
+				<DisclosureLockControls
+					compact
+					:lock-status="section.lock"
+					:disabled="section.meta.disabled"
+					@set-lock-status="disclosures.setDisclosureLockStatus(section.type, $event)"
+				/>
+			</template>
+			<template v-if="section.meta.updatedAt" #updated-by>
+				<DisclosureUpdatedBy
+					:updated-at="section.meta.updatedAt"
+					:updated-by="section.meta.updatedBy"
+					:set-by-moderator="section.meta.setByModerator"
+				/>
+			</template>
+			<template v-if="section.data" #expanded>
+				<dl class="disclosure-fields">
+					<div v-if="section.data.type === 'ai_content'">
+						<dt>{{ formatMessage(messages.generatedContent) }}</dt>
+						<dd>
+							<div v-if="section.data.uses.length" class="flex flex-wrap gap-1.5">
+								<TagItem
+									v-for="use in section.data.uses"
+									:key="use"
+									class="!border-surface-5 !bg-surface-4 !text-primary"
+								>
+									{{ formatMessage(disclosureAiUsageMessages[use]) }}
+								</TagItem>
+							</div>
+							<p v-else class="empty-field">{{ formatMessage(messages.noneListed) }}</p>
+						</dd>
+					</div>
+					<template v-if="section.data.type === 'telemetry'">
+						<div>
+							<dt>{{ formatMessage(messages.consentModel) }}</dt>
+							<dd>
+								<TagItem class="!border-surface-5 !bg-surface-4 !text-primary">{{
+									formatMessage(disclosureTelemetryConsentMessages[section.data.consent])
+								}}</TagItem>
+							</dd>
+						</div>
+						<div>
+							<dt>{{ formatMessage(messages.dataCollected) }}</dt>
+							<dd>
+								<ul v-if="section.data.data_collected.length">
+									<li v-for="(entry, index) in section.data.data_collected" :key="index">
+										{{ entry }}
+									</li>
+								</ul>
+								<p v-else class="empty-field">{{ formatMessage(messages.noneListed) }}</p>
+							</dd>
+						</div>
+					</template>
+					<div v-if="section.data.type === 'paid_features'">
+						<dt>{{ formatMessage(messages.paidFeatures) }}</dt>
+						<dd>
+							<ul v-if="section.data.features.length">
+								<li v-for="(feature, index) in section.data.features" :key="index">
+									{{ feature }}
+								</li>
+							</ul>
+							<p v-else class="empty-field">{{ formatMessage(messages.noneListed) }}</p>
+						</dd>
+					</div>
+					<div v-if="section.data.type === 'system_interactions'">
+						<dt>{{ formatMessage(messages.interactions) }}</dt>
+						<dd>
+							<ul v-if="section.data.interactions.some((entry) => entry.trim())">
+								<li
+									v-for="(interaction, index) in section.data.interactions.filter((entry) =>
+										entry.trim(),
+									)"
+									:key="index"
+								>
+									{{ interaction }}
+								</li>
+							</ul>
+							<p v-else class="empty-field">{{ formatMessage(messages.noneListed) }}</p>
+						</dd>
+					</div>
+					<div v-if="section.data.type === 'derivative_work'" class="original-works">
+						<dt>{{ formatMessage(messages.originalWorks) }}</dt>
+						<dd>
+							<div v-if="section.data.sources.length" class="flex flex-col gap-4">
+								<dl
+									v-for="(source, index) in section.data.sources"
+									:key="index"
+									class="disclosure-fields border-0 border-l-2 border-solid border-surface-4 pl-3"
+								>
+									<div>
+										<dt>{{ formatMessage(messages.originalName) }}</dt>
+										<dd>
+											<span v-if="source.label">{{ source.label }}</span>
+											<span v-else class="empty-field">{{
+												formatMessage(messages.noneProvided)
+											}}</span>
+										</dd>
+									</div>
+									<div>
+										<dt>{{ formatMessage(messages.originalLink) }}</dt>
+										<dd>
+											<AutoLink
+												v-if="source.link"
+												:to="source.link"
+												target="_blank"
+												rel="noopener noreferrer"
+												class="inline-flex max-w-full items-start gap-1 hover:text-contrast"
+											>
+												<span class="min-w-0 break-all underline">{{ source.link }}</span>
+												<ExternalIcon class="mt-0.5 size-4 shrink-0" aria-hidden="true" />
+											</AutoLink>
+											<p v-else class="empty-field">{{ formatMessage(messages.noneProvided) }}</p>
+										</dd>
+									</div>
+									<div>
+										<dt>{{ formatMessage(messages.derivativeExplanation) }}</dt>
+										<dd>
+											<p v-if="source.note" class="field-text">{{ source.note }}</p>
+											<p v-else class="empty-field">{{ formatMessage(messages.noneProvided) }}</p>
+										</dd>
+									</div>
+								</dl>
+							</div>
+							<p v-else class="empty-field">{{ formatMessage(messages.noneListed) }}</p>
+						</dd>
+					</div>
+					<div v-if="'note' in section.data">
+						<dt>
+							{{
+								formatMessage(
+									section.type === 'epilepsy_triggers'
+										? messages.photosensitivityDescription
+										: section.type === 'archived'
+											? messages.archiveReason
+											: commonMessages.explanationLabel,
+								)
+							}}
+						</dt>
+						<dd>
+							<p v-if="section.data.note?.trim()" class="field-text">{{ section.data.note }}</p>
+							<p v-else class="empty-field">{{ formatMessage(messages.noneProvided) }}</p>
+						</dd>
+					</div>
+				</dl>
+			</template>
+		</ProjectReviewDisclosureCard>
+	</div>
+</template>
+
+<style scoped>
+.disclosure-details {
+	container: disclosure-view / inline-size;
+}
+.disclosure-fields {
+	@apply m-0 flex min-w-0 flex-col gap-4;
+}
+.disclosure-fields > div {
+	@apply grid min-w-0 grid-cols-1 gap-1.5;
+}
+.disclosure-fields dt {
+	@apply text-sm font-semibold text-secondary;
+}
+.disclosure-fields dd {
+	@apply m-0 min-w-0 break-words leading-normal text-primary;
+}
+.disclosure-fields ul {
+	@apply m-0 space-y-1 pl-4;
+}
+.disclosure-fields li,
+.field-text {
+	@apply whitespace-pre-wrap;
+}
+.field-text,
+.empty-field {
+	@apply m-0;
+}
+.empty-field {
+	@apply text-secondary opacity-80;
+}
+@container disclosure-view (min-width: 32rem) {
+	.disclosure-fields {
+		@apply gap-2;
+	}
+	.disclosure-fields > div {
+		@apply grid-cols-[142px_minmax(0,1fr)] gap-x-3;
+	}
+	.disclosure-fields > .original-works {
+		@apply grid-cols-1;
+	}
+	.original-works .disclosure-fields > div {
+		grid-template-columns: calc(142px - 0.75rem - 2px) minmax(0, 1fr);
+	}
+}
+</style>
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/AiDisclosureCard.vue b/apps/frontend/src/components/ui/project-settings/disclosures/AiDisclosureCard.vue
index e1750936d2b..a7d021c6d4d 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/AiDisclosureCard.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/AiDisclosureCard.vue
@@ -112,26 +112,13 @@ function setUse(use: AiUsage, enabled: boolean) {
 		</p>
 		<template #expanded>
 			<SettingsFormGroup :title="formatMessage(messages.typesDescription)">
-				<MultiSelect
-					v-if="variant === 'review'"
-					v-model="model.uses"
-					:options="
-						AI_USES.map((use) => ({
-							value: use,
-							label: formatMessage(disclosureAiUsageMessages[use]),
-						}))
-					"
-					:aria-label="formatMessage(messages.typesDescription)"
-					:placeholder="formatMessage(messages.selectUses)"
-					:disabled="disabled"
-					class="w-full max-w-[24rem]"
-				/>
-				<div v-else class="flex flex-col gap-2">
+				<div class="flex flex-col gap-2">
 					<Checkbox
 						v-for="use in AI_USES"
 						:key="use"
 						:model-value="hasUse(use)"
 						:disabled="disabled"
+						class="!gap-1.5"
 						@update:model-value="(enabled) => setUse(use, enabled)"
 					>
 						{{ formatMessage(disclosureAiUsageMessages[use]) }}
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/DerivativeDisclosureCard.vue b/apps/frontend/src/components/ui/project-settings/disclosures/DerivativeDisclosureCard.vue
index 2b9ef73cfa0..61e504df3c0 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/DerivativeDisclosureCard.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/DerivativeDisclosureCard.vue
@@ -107,6 +107,7 @@ watch(
 			model.value.sources = [emptyDerivativeSource()]
 		}
 	},
+	{ immediate: true },
 )
 
 function addSource() {
@@ -144,6 +145,7 @@ function setOptionalField(
 				v-for="({ source, id }, index) in sources"
 				:key="id"
 				class="relative flex flex-col gap-4 rounded-2xl border border-solid border-surface-4 bg-surface-3 p-4"
+				:class="{ 'mt-8': variant === 'review' && editing && index === 0 }"
 			>
 				<div class="absolute right-3 top-3">
 					<Button
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureCards.vue b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureCards.vue
index 1112fe18db5..8eb1b904db4 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureCards.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureCards.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
-import { computed } from 'vue'
+import { computed, ref } from 'vue'
 
+import DisclosureView from '~/components/project-review/disclosures/view.vue'
 import ReviewPanel from '~/components/project-review/review-panel/index.vue'
 import { injectReviewPanels } from '~/providers/project-review/review-panels'
 
@@ -26,10 +27,48 @@ const props = withDefaults(
 	}>(),
 	{ hideDescription: false, variant: 'settings' },
 )
+const emit = defineEmits<{ editingChange: [editing: boolean] }>()
+
 const { current, disclosureUpdateProps, setDisclosureLockStatus, isDisclosureVisible } =
 	props.editor
 provideDisclosureDraft(current)
 const panels = injectReviewPanels(null)
+const editingTypes = ref(new Set<DisclosureType>())
+
+function toggleEditing(type: DisclosureType) {
+	const next = new Set(editingTypes.value)
+	if (next.has(type)) next.delete(type)
+	else next.add(type)
+	editingTypes.value = next
+	emit('editingChange', next.size > 0)
+}
+
+function cancelEditing(type: DisclosureType) {
+	props.editor.resetDisclosure(type, true)
+	toggleEditing(type)
+}
+
+async function saveEditing(type: DisclosureType) {
+	if (await props.editor.saveDisclosure(type)) toggleEditing(type)
+}
+
+function cardProps(type: DisclosureType) {
+	return {
+		...disclosureUpdateProps(type),
+		...(props.variant === 'review'
+			? {
+					editing: editingTypes.value.has(type),
+					onToggleEditing: () => toggleEditing(type),
+					onCancelEditing: () => cancelEditing(type),
+					onSaveEditing: () => saveEditing(type),
+					sectionCanSave: props.editor.canSaveDisclosure(type),
+					sectionSaveDisabledReason: props.editor.disclosureSaveDisabledReason(type),
+					sectionSaveError: props.editor.disclosureSaveError(type),
+					sectionSaving: props.editor.saving.value,
+				}
+			: {}),
+	}
+}
 
 function reviewTitle(key: string): string | undefined {
 	return props.variant === 'review'
@@ -101,13 +140,18 @@ const cards = computed(() => {
 					: {}
 			"
 		>
+			<DisclosureView
+				v-if="variant === 'review' && !editingTypes.has(card.type)"
+				:type="card.type"
+				@edit="toggleEditing(card.type)"
+			/>
 			<AiDisclosureCard
-				v-if="card.type === 'ai_content'"
+				v-else-if="card.type === 'ai_content'"
 				v-model="current.ai"
 				:hide-description="hideDescription"
 				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps(card.type)"
+				v-bind="cardProps(card.type)"
 				@set-lock-status="
 					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
@@ -118,7 +162,7 @@ const cards = computed(() => {
 				:hide-description="hideDescription"
 				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps(card.type)"
+				v-bind="cardProps(card.type)"
 				@set-lock-status="
 					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
@@ -129,7 +173,7 @@ const cards = computed(() => {
 				:hide-description="hideDescription"
 				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps(card.type)"
+				v-bind="cardProps(card.type)"
 				@set-lock-status="
 					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
@@ -140,7 +184,7 @@ const cards = computed(() => {
 				:hide-description="hideDescription"
 				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps(card.type)"
+				v-bind="cardProps(card.type)"
 				@set-lock-status="
 					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
@@ -151,7 +195,7 @@ const cards = computed(() => {
 				:hide-description="hideDescription"
 				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps(card.type)"
+				v-bind="cardProps(card.type)"
 				@set-lock-status="
 					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
@@ -162,7 +206,7 @@ const cards = computed(() => {
 				:hide-description="hideDescription"
 				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps(card.type)"
+				v-bind="cardProps(card.type)"
 				@set-lock-status="
 					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
@@ -173,7 +217,7 @@ const cards = computed(() => {
 				:hide-description="hideDescription"
 				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps(card.type)"
+				v-bind="cardProps(card.type)"
 				@set-lock-status="
 					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
@@ -184,7 +228,7 @@ const cards = computed(() => {
 				:hide-description="hideDescription"
 				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps(card.type)"
+				v-bind="cardProps(card.type)"
 				@set-lock-status="
 					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
@@ -196,7 +240,7 @@ const cards = computed(() => {
 				:hide-description="hideDescription"
 				:title="reviewTitle(card.key)"
 				:variant="variant"
-				v-bind="disclosureUpdateProps(card.type)"
+				v-bind="cardProps(card.type)"
 				@set-lock-status="
 					(status: DisclosureLockStatus) => setDisclosureLockStatus(card.type, status)
 				"
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureExplanation.vue b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureExplanation.vue
index fbcd44a2d6f..ad1a9d00cb9 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureExplanation.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureExplanation.vue
@@ -1,21 +1,8 @@
 <script setup lang="ts">
-import { ChevronDownIcon } from '@modrinth/assets'
-import {
-	Button,
-	commonMessages,
-	defineMessages,
-	SettingsFormGroup,
-	Textarea,
-	useVIntl,
-} from '@modrinth/ui'
-import { nextTick, onScopeDispose, ref, useId, watch } from 'vue'
+import { SettingsFormGroup, Textarea } from '@modrinth/ui'
+import { useId } from 'vue'
 
-import EditButton from '~/components/project-review/project-info/edit/button.vue'
-import { injectReviewShortcuts } from '~/components/project-review/shortcuts'
-
-import { injectDisclosureDraft } from './draft-context'
-
-const props = defineProps<{
+defineProps<{
 	variant?: 'settings' | 'review'
 	title: string
 	titleFor?: string
@@ -25,138 +12,17 @@ const props = defineProps<{
 	resize?: 'none' | 'vertical' | 'both'
 }>()
 const model = defineModel<string | undefined>()
-const { formatMessage } = useVIntl()
-const messages = defineMessages({
-	empty: {
-		id: 'project-review.disclosures.empty-explanation',
-		defaultMessage: 'No explanation provided.',
-	},
-	done: {
-		id: 'project-review.disclosures.done-editing',
-		defaultMessage: 'Done',
-	},
-})
-const expanded = ref(true)
-const editing = ref(false)
-const original = ref<string>()
-const section = ref<HTMLElement>()
-const textarea = ref<InstanceType<typeof Textarea>>()
-const contentId = useId()
-const draft = injectDisclosureDraft(null)
-if (draft) {
-	watch(draft, () => {
-		editing.value = false
-		original.value = undefined
-	})
-}
-const shortcuts = injectReviewShortcuts(null)
-if (shortcuts) {
-	onScopeDispose(
-		shortcuts.registerInteraction({
-			element: () => (props.variant === 'review' ? section.value : undefined),
-			collapse: () => {
-				expanded.value = !expanded.value
-			},
-		}),
-	)
-}
-
-watch(
-	() => props.disabled,
-	(disabled) => {
-		if (disabled) editing.value = false
-	},
-)
-
-async function startEditing() {
-	if (props.disabled) return
-	original.value = model.value
-	expanded.value = true
-	editing.value = true
-	await nextTick()
-	textarea.value?.focus()
-}
-
-function cancelEditing() {
-	model.value = original.value
-	editing.value = false
-}
+const inputId = useId()
 </script>
 
 <template>
-	<section
-		v-if="variant === 'review'"
-		ref="section"
-		class="editable-review-section flex min-w-0 flex-col gap-2"
-	>
-		<div class="flex items-center justify-between gap-2">
-			<button
-				type="button"
-				class="flex items-center gap-1 border-0 bg-transparent p-0 font-semibold text-contrast"
-				:aria-expanded="expanded"
-				:aria-controls="contentId"
-				@click="expanded = !expanded"
-			>
-				{{ title }}
-				<ChevronDownIcon
-					class="size-4 transition-transform"
-					:class="{ 'rotate-180': expanded }"
-					aria-hidden="true"
-				/>
-			</button>
-			<div v-if="editing" class="flex shrink-0 gap-1">
-				<Button type="quiet" size="xs" :disabled="disabled" @click="cancelEditing">
-					{{ formatMessage(commonMessages.cancelButton) }}
-				</Button>
-				<Button
-					type="colored"
-					color="brand"
-					size="xs"
-					:disabled="disabled"
-					@click="editing = false"
-				>
-					{{ formatMessage(messages.done) }}
-				</Button>
-			</div>
-			<EditButton v-else :section="title" :disabled="disabled" @click="startEditing" />
-		</div>
-		<div
-			:id="contentId"
-			class="-m-1 grid transition-[grid-template-rows] duration-300 ease-in-out motion-reduce:transition-none"
-			:class="expanded ? 'grid-rows-[1fr]' : 'grid-rows-[0fr]'"
-			:inert="!expanded"
-		>
-			<div class="min-h-0 overflow-hidden">
-				<div class="p-1">
-					<Textarea
-						v-if="editing"
-						ref="textarea"
-						v-model="model"
-						:aria-label="title"
-						:disabled="disabled"
-						:placeholder="placeholder"
-						:rows="3"
-						resize="vertical"
-						class="w-full"
-					/>
-					<p
-						v-else
-						class="m-0 whitespace-pre-wrap break-words"
-						:class="{ 'text-secondary': !model }"
-					>
-						{{ model || formatMessage(messages.empty) }}
-					</p>
-				</div>
-			</div>
-		</div>
-	</section>
-	<SettingsFormGroup v-else :title="title" :title-for="titleFor" :optional="optional">
+	<SettingsFormGroup :title="title" :title-for="titleFor ?? inputId" :optional="optional">
 		<Textarea
-			:id="titleFor"
+			:id="titleFor ?? inputId"
 			v-model="model"
 			:rows="3"
 			:resize="resize"
-			class="max-w-[40rem]"
+			:class="variant === 'review' ? 'w-full' : 'max-w-[40rem]'"
 			:disabled="disabled"
 			:placeholder="placeholder"
 		/>
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureToggleCard.vue b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureToggleCard.vue
index 5f64a41d779..e6120bc6c17 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureToggleCard.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureToggleCard.vue
@@ -89,6 +89,14 @@ function setLockStatus(status: DisclosureLockStatus) {
 		v-model="enabled"
 		:disabled="disabled"
 		:toggle-disabled="toggleDisabled"
+		:editing="editing"
+		:on-toggle-editing="onToggleEditing"
+		:on-cancel-editing="onCancelEditing"
+		:on-save-editing="onSaveEditing"
+		:section-can-save="sectionCanSave"
+		:section-saving="sectionSaving"
+		:section-save-error="sectionSaveError"
+		:section-save-disabled-reason="sectionSaveDisabledReason"
 		:icon="icon"
 		:title="title"
 		:description="hideDescription ? undefined : description"
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/PaidFeaturesDisclosureCard.vue b/apps/frontend/src/components/ui/project-settings/disclosures/PaidFeaturesDisclosureCard.vue
index fdb50f4e7fa..64d811957fa 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/PaidFeaturesDisclosureCard.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/PaidFeaturesDisclosureCard.vue
@@ -51,6 +51,7 @@ watch(
 			model.value.features = ['']
 		}
 	},
+	{ immediate: true },
 )
 
 function addFeature() {
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/ProjectReviewDisclosureCard.vue b/apps/frontend/src/components/ui/project-settings/disclosures/ProjectReviewDisclosureCard.vue
index cb571d40773..8af1aedb1a8 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/ProjectReviewDisclosureCard.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/ProjectReviewDisclosureCard.vue
@@ -1,16 +1,29 @@
 <script setup lang="ts">
-import { Toggle } from '@modrinth/ui'
+import { Button, commonMessages, Toggle, useVIntl } from '@modrinth/ui'
 import { type Component, computed, useId } from 'vue'
 
+import { disclosureStatusMessages } from './messages'
+
+import EditButton from '~/components/project-review/project-info/edit/button.vue'
+
 const props = defineProps<{
 	title: string
 	icon?: Component
 	description?: string
 	disabled?: boolean
 	toggleDisabled?: boolean
+	editing?: boolean
+	onToggleEditing?: () => void
+	onCancelEditing?: () => void
+	onSaveEditing?: () => Promise<void>
+	sectionCanSave?: boolean
+	sectionSaving?: boolean
+	sectionSaveError?: boolean
+	sectionSaveDisabledReason?: string[]
 }>()
 const enabled = defineModel<boolean>({ required: true })
 const titleId = useId()
+const { formatMessage } = useVIntl()
 const isToggleLocked = computed(() => !!props.disabled || (!!props.toggleDisabled && enabled.value))
 </script>
 
@@ -56,9 +69,45 @@ const isToggleLocked = computed(() => !!props.disabled || (!!props.toggleDisable
 		<div
 			v-if="$slots.expanded"
 			v-show="enabled"
-			class="flex flex-col gap-4 border-0 border-t border-solid border-surface-4 bg-surface-2 p-4"
+			class="disclosure-details editable-review-section relative flex flex-col gap-4 border-0 border-t border-solid border-surface-4 bg-surface-2 p-4 text-sm text-secondary"
+			:class="{ 'box-border min-h-14': onToggleEditing }"
 		>
-			<slot name="expanded" />
+			<div v-if="editing" class="absolute right-4 top-2 flex justify-end gap-1.5">
+				<Button type="quiet" size="xs" :disabled="disabled" @click.stop="onCancelEditing?.()">
+					{{ formatMessage(commonMessages.cancelButton) }}
+				</Button>
+				<Button
+					type="colored"
+					color="brand"
+					size="xs"
+					:loading="sectionSaving"
+					:disabled="disabled || !sectionCanSave"
+					@click.stop="onSaveEditing?.()"
+				>
+					{{ formatMessage(commonMessages.saveButton) }}
+				</Button>
+			</div>
+			<div v-if="onToggleEditing && !editing" class="absolute right-4 top-4 flex">
+				<EditButton :section="title" :disabled="disabled" @click="onToggleEditing" />
+			</div>
+			<div class="flex min-w-0 flex-col gap-4" :class="{ 'pr-8': onToggleEditing && !editing }">
+				<slot name="expanded" />
+			</div>
+			<template v-if="editing">
+				<p v-if="sectionSaveError" role="alert" class="m-0 text-red">
+					{{ formatMessage(disclosureStatusMessages.saveError) }}
+				</p>
+				<p v-if="sectionSaveDisabledReason?.length" role="alert" class="m-0 text-orange">
+					{{ sectionSaveDisabledReason.join(' ') }}
+				</p>
+			</template>
 		</div>
 	</section>
 </template>
+
+<style scoped>
+.disclosure-details :deep(label.font-semibold.text-contrast),
+.disclosure-details :deep(p.font-semibold.text-contrast) {
+	@apply text-sm text-secondary;
+}
+</style>
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/TelemetryDisclosureCard.vue b/apps/frontend/src/components/ui/project-settings/disclosures/TelemetryDisclosureCard.vue
index e0eb1b21fe4..dcc361a3d02 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/TelemetryDisclosureCard.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/TelemetryDisclosureCard.vue
@@ -70,6 +70,7 @@ watch(
 			model.value.entries = ['']
 		}
 	},
+	{ immediate: true },
 )
 
 function addEntry() {
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/form.ts b/apps/frontend/src/components/ui/project-settings/disclosures/form.ts
index 5e1ba8e419b..6a22946d291 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/form.ts
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/form.ts
@@ -15,6 +15,31 @@ import type {
 	ProjectDisclosureData,
 } from './types'
 
+export const DISCLOSURE_FORM_KEYS = {
+	ai_content: 'ai',
+	ai_functionality: 'aiFunctionality',
+	advertisements: 'advertising',
+	paid_features: 'paidFeatures',
+	telemetry: 'telemetry',
+	derivative_work: 'derivative',
+	epilepsy_triggers: 'photosensitivity',
+	system_interactions: 'systemInteractions',
+	archived: 'archived',
+} as const satisfies Record<DisclosureType, keyof Omit<DisclosureFormState, 'lockStatuses'>>
+
+export function copyDisclosureFormSection(
+	target: DisclosureFormState,
+	source: DisclosureFormState,
+	type: DisclosureType,
+): DisclosureFormState {
+	const key = DISCLOSURE_FORM_KEYS[type]
+	return {
+		...target,
+		[key]: JSON.parse(JSON.stringify(source[key])),
+		lockStatuses: { ...target.lockStatuses, [type]: source.lockStatuses[type] },
+	}
+}
+
 function findDisclosure<T extends DisclosureType>(
 	disclosures: ProjectDisclosureData[],
 	type: T,
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/types.ts b/apps/frontend/src/components/ui/project-settings/disclosures/types.ts
index 5fd910802d5..4fd3f2d5821 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/types.ts
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/types.ts
@@ -62,6 +62,14 @@ export type DisclosureUpdatedByUser = {
 }
 
 export type DisclosureCardMetaProps = {
+	editing?: boolean
+	onToggleEditing?: () => void
+	onCancelEditing?: () => void
+	onSaveEditing?: () => Promise<void>
+	sectionCanSave?: boolean
+	sectionSaving?: boolean
+	sectionSaveError?: boolean
+	sectionSaveDisabledReason?: string[]
 	variant?: 'settings' | 'review'
 	title?: string
 	hideDescription?: boolean
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/use-disclosure-editor.ts b/apps/frontend/src/components/ui/project-settings/disclosures/use-disclosure-editor.ts
index acf4e52bf25..4a35cd9b8bb 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/use-disclosure-editor.ts
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/use-disclosure-editor.ts
@@ -14,6 +14,8 @@ import { projectQueryOptions } from '~/composables/queries/project'
 
 import type { DisclosureFormIssue } from './form'
 import {
+	copyDisclosureFormSection,
+	DISCLOSURE_FORM_KEYS,
 	disclosuresToForm,
 	findDisclosureData,
 	formToDisclosures,
@@ -167,9 +169,19 @@ export function useDisclosureEditor({
 	const current = ref(disclosuresToForm([]))
 	const saved = computed(() => disclosuresToForm(disclosuresResponse.value?.disclosures ?? []))
 	const mutation = useMutation({
-		mutationFn: async ({ id, form }: { id: string; form: DisclosureFormState }) => {
+		mutationFn: async ({
+			id,
+			form,
+			type,
+		}: {
+			id: string
+			form: DisclosureFormState
+			type?: DisclosureType
+		}) => {
 			const latest = await labrinth.projects_v3.getDisclosures(id)
-			const requests = toModifyRequests(form, disclosuresToForm(latest.disclosures))
+			const previous = disclosuresToForm(latest.disclosures)
+			const next = type ? copyDisclosureFormSection(previous, form, type) : form
+			const requests = toModifyRequests(next, previous)
 			try {
 				for (const request of requests) {
 					await labrinth.projects_v3.modifyDisclosures(id, request)
@@ -218,6 +230,57 @@ export function useDisclosureEditor({
 		}
 	}
 
+	function disclosureSaveDisabledReason(type: DisclosureType): string[] {
+		if (!hasPermission.value) return [formatMessage(messages.noPermission)]
+		if (isAdminUser.value) return []
+		const section = copyDisclosureFormSection(disclosuresToForm([]), current.value, type)
+		return getDisclosureFormIssues(section, projectTypes.value).map((issue) =>
+			formatMessage(issueMessages[issue]),
+		)
+	}
+
+	function canSaveDisclosure(type: DisclosureType): boolean {
+		return (
+			disclosuresQuery.isSuccess.value &&
+			canEditDisclosures.value &&
+			!disclosureUpdateProps(type).disabled &&
+			disclosureSaveDisabledReason(type).length === 0
+		)
+	}
+
+	function resetDisclosure(type: DisclosureType, detailsOnly = false) {
+		const key = DISCLOSURE_FORM_KEYS[type]
+		const enabled = current.value[key].enabled
+		const lock = current.value.lockStatuses[type]
+		current.value = copyDisclosureFormSection(current.value, saved.value, type)
+		if (detailsOnly) {
+			current.value[key].enabled = enabled
+			current.value.lockStatuses[type] = lock
+		}
+		mutation.reset()
+	}
+
+	async function saveDisclosure(type: DisclosureType): Promise<boolean> {
+		if (!canSaveDisclosure(type) || saving.value) return false
+		const id = projectId.value
+		try {
+			await mutation.mutateAsync({
+				id,
+				type,
+				form: JSON.parse(JSON.stringify(current.value)) as DisclosureFormState,
+			})
+			if (id !== projectId.value) return false
+			resetDisclosure(type)
+			return true
+		} catch {
+			return false
+		}
+	}
+
+	function disclosureSaveError(type: DisclosureType): boolean {
+		return mutation.variables.value?.type === type && !!mutation.error.value
+	}
+
 	function disclosureUpdateProps(type: DisclosureType) {
 		const disclosure = findDisclosureData(disclosuresResponse.value?.disclosures, type)
 		const savedLockStatus = disclosure?.lock_status ?? 'unlocked'
@@ -259,8 +322,7 @@ export function useDisclosureEditor({
 				!saving.value &&
 				(changedProject ||
 					!previous ||
-					JSON.stringify(current.value) ===
-						JSON.stringify(disclosuresToForm(previous.disclosures)))
+					JSON.stringify(current.value) === JSON.stringify(disclosuresToForm(previous.disclosures)))
 			) {
 				current.value = disclosuresToForm(disclosuresResponse.value?.disclosures ?? [])
 			}
@@ -301,6 +363,11 @@ export function useDisclosureEditor({
 		saving,
 		reset,
 		save,
+		saveDisclosure,
+		resetDisclosure,
+		canSaveDisclosure,
+		disclosureSaveDisabledReason,
+		disclosureSaveError,
 		canSave,
 		saveDisabledReason,
 		issueAction,

From b4447b2b76920ecf3d04f7e42ba05c667ce16806 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Wed, 21 Oct 2026 10:25:10 -0600
Subject: [PATCH 27/28] remove: all i18n messages in project-review

---
 apps/frontend/AGENTS.md                       |    4 +
 .../project-review/description/index.vue      |   28 +-
 .../project-review/disclosures/index.vue      |   17 +-
 .../project-review/disclosures/view.vue       |  182 +--
 .../src/components/project-review/format.ts   |   58 +
 .../project-review/gallery/index.vue          |   33 +-
 .../project-review/image-viewer-actions.vue   |   31 +-
 .../project-review/image-viewer-info.vue      |   52 +-
 .../src/components/project-review/index.vue   |   83 +-
 .../project-review/issue-list/index.vue       |   36 +-
 .../project-review/issue-list/issue-card.vue  |  171 +--
 .../issue-list/issue-picker.vue               |   28 +-
 .../issue-list/issue-toggles.vue              |   20 +-
 .../issue-list/stories/IssueCatalogueRow.vue  |    1 -
 .../layout/controls/sidebar-control.vue       |   16 +-
 .../project-review/layout/empty-popout.vue    |    6 +-
 .../project-review/layout/index.client.vue    |   15 +-
 .../project-review/layout/labels.ts           |   13 +
 .../project-review/layout/panel.vue           |   11 +-
 .../project-review/layout/tabs/tab.vue        |    7 +-
 .../project-review/layout/use-layout.ts       |   24 +-
 .../project-review/link-info/detail-badge.vue |   35 +-
 .../project-review/link-info/index.vue        |   36 +-
 .../project-review/link-info/labels.ts        |   72 +
 .../project-review/link-info/messages.ts      |  286 ----
 .../project-review/link-info/tooltip.vue      |    8 +-
 .../project-review/link-info/types.ts         |    4 +-
 .../project-review/link-info/validation.ts    |   82 ++
 .../project-review/message-thread/index.vue   |   19 +-
 .../markdown-template-picker.vue              |   67 +-
 .../message-thread/message-box.vue            |   36 +-
 .../src/components/project-review/messages.ts |  829 -----------
 .../project-info/edit/button.vue              |    6 +-
 .../project-info/edit/details.vue             |   68 +-
 .../project-info/edit/edit-modal.vue          |   13 +-
 .../project-review/project-info/edit/icon.vue |   26 +-
 .../project-info/edit/license.vue             |  132 +-
 .../project-info/edit/links.vue               |  197 +--
 .../project-info/edit/server-details.vue      |   88 +-
 .../project-review/project-info/edit/tags.vue |  155 +-
 .../project-info/edit/use-project-edit.ts     |   11 +-
 .../edit/use-project-text-edit.ts             |   17 +-
 .../project-review/project-info/index.vue     |   14 +-
 .../project-info/members/index.vue            |   12 +-
 .../project-info/members/member-actions.vue   |   83 +-
 .../project-info/members/member-item.vue      |   17 +-
 .../members/organization-item.vue             |   17 +-
 .../project-info/project/compatibility.vue    |   45 +-
 .../project-info/project/details.vue          |   81 +-
 .../project-info/project/icon.vue             |   10 +-
 .../project-info/project/license.vue          |   11 +-
 .../project-info/project/links.vue            |   59 +-
 .../project-info/project/server-details.vue   |   45 +-
 .../project-info/project/slug.vue             |   25 +-
 .../project-info/project/summary.vue          |   21 +-
 .../project-info/project/tags.vue             |   16 +-
 .../project-info/project/title.vue            |   21 +-
 .../project-info/server-labels.ts             |   86 ++
 .../project-review/project-info/tag-labels.ts |  163 +++
 .../project-info/type-labels.ts               |   11 +
 .../project-review/project-wide-checks.vue    |   11 +-
 .../components/project-review/queue-bar.vue   |  104 +-
 .../project-review/queue-project-list.vue     |   29 +-
 .../project-review/queue-project-preview.vue  |    9 +-
 .../review-outcome-buttons/index.vue          |   66 +-
 .../moderation-locked-card.vue                |   38 +-
 .../review-panel/controls/index.vue           |   55 +-
 .../review-panel/controls/slug-input.vue      |   58 +-
 .../review-panel/findings-count-badge.vue     |    9 +-
 .../project-review/review-panel/index.vue     |   15 +-
 .../project-review/review-panel/popover.vue   |   15 +-
 .../re-review-findings-count-badge.vue        |    8 +-
 .../project-review/slicer/index.vue           |   24 +-
 .../project-review/tech-review/index.vue      |   50 +-
 .../project-review/versions/index.vue         |   26 +-
 .../project-review/versions/modpack-tools.vue |   70 +-
 .../project-review/versions/version-card.vue  |  163 +--
 .../settings/ModerationAppearanceThemes.vue   |    1 -
 .../disclosures/AiDisclosureCard.vue          |    1 -
 .../disclosures/DisclosureLockControls.vue    |    2 +-
 .../ProjectReviewDisclosureCard.vue           |   12 +-
 .../floating-review-panel-appearance.ts       |    3 +-
 apps/frontend/src/composables/moderation.ts   |    2 +-
 apps/frontend/src/locales/en-US/index.json    | 1270 ++---------------
 .../src/pages/moderation/project-review.vue   |    8 +-
 .../providers/project-review/review-lock.ts   |   64 +-
 .../providers/project-review/review-panels.ts |    4 +-
 .../project-review/review-previous-issues.ts  |   16 +-
 .../project-review/review-submission.ts       |   87 +-
 .../project-review/review-target-labels.ts    |   26 +
 packages/ui/src/locales/en-US/index.json      |    9 +
 91 files changed, 1681 insertions(+), 4334 deletions(-)
 create mode 100644 apps/frontend/src/components/project-review/format.ts
 create mode 100644 apps/frontend/src/components/project-review/layout/labels.ts
 create mode 100644 apps/frontend/src/components/project-review/link-info/labels.ts
 delete mode 100644 apps/frontend/src/components/project-review/link-info/messages.ts
 create mode 100644 apps/frontend/src/components/project-review/link-info/validation.ts
 delete mode 100644 apps/frontend/src/components/project-review/messages.ts
 create mode 100644 apps/frontend/src/components/project-review/project-info/server-labels.ts
 create mode 100644 apps/frontend/src/components/project-review/project-info/tag-labels.ts
 create mode 100644 apps/frontend/src/components/project-review/project-info/type-labels.ts
 create mode 100644 apps/frontend/src/providers/project-review/review-target-labels.ts

diff --git a/apps/frontend/AGENTS.md b/apps/frontend/AGENTS.md
index b677a79f9b4..72033833c7b 100644
--- a/apps/frontend/AGENTS.md
+++ b/apps/frontend/AGENTS.md
@@ -28,6 +28,10 @@ Nuxt 3 with SSR — pages are server-rendered and hydrated on the client. Uses `
 
 Rule of thumb: if it doesn't depend on Nuxt-specific APIs or website-only features, it should be in `packages/ui`.
 
+### Project Review Language
+
+Project-review code is English-only. Do not add i18n message definitions, translation keys, or translation helpers to project-review routes, components, providers, or supporting code, including review-only components outside `src/components/project-review/`. Use plain English strings, ordinary interpolation and plural handling, and English date/number formatting. This exception also applies during i18n passes. Preserve localization in shared components used elsewhere.
+
 ### Project Review Popout Windows
 
 Project review panels can be displayed in multiple browser documents while sharing the main window's Vue application and JavaScript context. Use an anchor, panel, or event target's `ownerDocument` for DOM queries and its `defaultView` for window behavior. Global `document` and `window` still identify the main window after a panel moves.
diff --git a/apps/frontend/src/components/project-review/description/index.vue b/apps/frontend/src/components/project-review/description/index.vue
index e117c609936..abfcc933af0 100644
--- a/apps/frontend/src/components/project-review/description/index.vue
+++ b/apps/frontend/src/components/project-review/description/index.vue
@@ -16,9 +16,7 @@
 			/>
 			<div class="mt-0.5 flex shrink-0 justify-end gap-1">
 				<template v-if="editing">
-					<Button type="quiet" size="xs" :disabled="saving" @click="resetEditing">
-						{{ formatMessage(commonMessages.cancelButton) }}
-					</Button>
+					<Button type="quiet" size="xs" :disabled="saving" @click="resetEditing"> Cancel </Button>
 					<Button
 						type="colored"
 						color="brand"
@@ -27,27 +25,23 @@
 						:disabled="!valid"
 						@click="save"
 					>
-						{{ formatMessage(commonMessages.saveButton) }}
+						Save
 					</Button>
 				</template>
 				<EditButton
 					v-else-if="project && !isLoading && !error"
-					:section="formatMessage(messages.description)"
+					section="Description"
 					:disabled="saving"
 					@click="startEditing"
 				/>
 			</div>
 		</div>
 		<div class="min-h-0 flex-1">
-			<p v-if="!selection" class="m-0 text-secondary">
-				{{ formatMessage(messages.empty) }}
-			</p>
-			<p v-else-if="isLoading" role="status" class="m-0">
-				{{ formatMessage(messages.loading) }}
-			</p>
+			<p v-if="!selection" class="m-0 text-secondary">No project selected</p>
+			<p v-else-if="isLoading" role="status" class="m-0">Loading...</p>
 			<div v-else-if="error" role="alert">
-				<p class="m-0">{{ formatMessage(messages.loadError) }}</p>
-				<Button @click="refresh">{{ formatMessage(messages.retry) }}</Button>
+				<p class="m-0">Could not load project data</p>
+				<Button @click="refresh">Retry</Button>
 			</div>
 			<div v-else-if="editing" class="flex min-h-full flex-col gap-2">
 				<TemplateMarkdownEditor
@@ -67,28 +61,24 @@
 				class="text-sm leading-tight"
 				:description="project.description"
 			/>
-			<p v-else class="m-0 text-secondary">
-				{{ formatMessage(messages.emptyDescription) }}
-			</p>
+			<p v-else class="m-0 text-secondary">No description</p>
 		</div>
 	</div>
 </template>
 
 <script setup lang="ts">
 import { moderationSettings } from '@modrinth/moderation'
-import { Button, commonMessages, ProjectPageDescription, useVIntl } from '@modrinth/ui'
+import { Button, ProjectPageDescription } from '@modrinth/ui'
 import { useTemplateRef } from 'vue'
 
 import TemplateMarkdownEditor from '~/components/project-review/message-thread/template-markdown-editor.vue'
 import { useModerationSettings } from '~/composables/moderation'
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
-import { projectReviewMessages as messages } from '../messages'
 import EditButton from '../project-info/edit/button.vue'
 import { useProjectTextEdit } from '../project-info/edit/use-project-text-edit'
 import ReviewPanel from '../review-panel/index.vue'
 
-const { formatMessage } = useVIntl()
 const settings = useModerationSettings()
 const interactionScope = useTemplateRef<HTMLElement>('interactionScope')
 const { selection, isLoading, error, refresh } = injectProjectReviewPageContext()
diff --git a/apps/frontend/src/components/project-review/disclosures/index.vue b/apps/frontend/src/components/project-review/disclosures/index.vue
index 8498b47625f..dd0ea6aef42 100644
--- a/apps/frontend/src/components/project-review/disclosures/index.vue
+++ b/apps/frontend/src/components/project-review/disclosures/index.vue
@@ -3,16 +3,16 @@
 		<div class="shrink-0 p-2">
 			<ReviewPanel mode="inline" :target="{ kind: 'disclosures' }" hide-title />
 		</div>
-		<p v-if="isPending" role="status">{{ formatMessage(statusMessages.loading) }}</p>
+		<p v-if="isPending" role="status">Loading disclosures…</p>
 		<div v-else-if="isError" role="alert">
-			<p>{{ formatMessage(statusMessages.loadError) }}</p>
-			<Button @click="refetch()">{{ formatMessage(statusMessages.retry) }}</Button>
+			<p>Could not load disclosures.</p>
+			<Button @click="refetch()">Retry</Button>
 		</div>
 		<EmptyState
 			v-else-if="!canEditDisclosures"
 			type="no-documents"
-			:heading="formatMessage(editorMessages.uploadVersionFirstHeading)"
-			:description="formatMessage(commonMessages.uploadVersionsEmptyStateDescription)"
+			heading="Upload versions before adding disclosures"
+			description="Come back once you've uploaded your versions."
 		/>
 		<template v-else>
 			<div class="min-h-0 flex-1 overflow-y-auto overscroll-contain px-2 pb-2 pt-3">
@@ -25,7 +25,7 @@
 			</div>
 			<div class="z-10 mt-auto shrink-0">
 				<p v-if="saveError" role="alert" class="text-red">
-					{{ formatMessage(statusMessages.saveError) }}
+					Could not save all disclosure changes. Your edits have been kept. Try saving again.
 				</p>
 				<UnsavedChangesPopup
 					inline
@@ -43,18 +43,15 @@
 </template>
 
 <script setup lang="ts">
-import { Button, commonMessages, EmptyState, UnsavedChangesPopup, useVIntl } from '@modrinth/ui'
+import { Button, EmptyState, UnsavedChangesPopup } from '@modrinth/ui'
 
 import DisclosureCards from '~/components/ui/project-settings/disclosures/DisclosureCards.vue'
-import { disclosureStatusMessages as statusMessages } from '~/components/ui/project-settings/disclosures/messages'
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
 import ReviewPanel from '../review-panel/index.vue'
 
-const { formatMessage } = useVIntl()
 const { project, disclosures } = injectProjectReviewPageContext()
 const {
-	messages: editorMessages,
 	savedSnapshot,
 	currentSnapshot,
 	saving,
diff --git a/apps/frontend/src/components/project-review/disclosures/view.vue b/apps/frontend/src/components/project-review/disclosures/view.vue
index 916a93a2378..bc185c38149 100644
--- a/apps/frontend/src/components/project-review/disclosures/view.vue
+++ b/apps/frontend/src/components/project-review/disclosures/view.vue
@@ -3,30 +3,21 @@ import {
 	ArchiveIcon,
 	BrainCogIcon,
 	CircleDollarSignIcon,
-	EyeIcon,
 	ExternalIcon,
+	EyeIcon,
 	GitForkIcon,
 	MegaphoneIcon,
 	MonitorCogIcon,
 	RadioTowerIcon,
 	SparklesIcon,
 } from '@modrinth/assets'
-import {
-	AutoLink,
-	commonMessages,
-	defineMessages,
-	disclosureAiUsageMessages,
-	disclosureTelemetryConsentMessages,
-	formatDisclosureTypeLabel,
-	TagItem,
-	useVIntl,
-} from '@modrinth/ui'
+import { AutoLink, TagItem } from '@modrinth/ui'
 import { type Component, computed } from 'vue'
 
-import { formToDisclosures } from '~/components/ui/project-settings/disclosures/form'
 import DisclosureLockControls from '~/components/ui/project-settings/disclosures/DisclosureLockControls.vue'
-import ProjectReviewDisclosureCard from '~/components/ui/project-settings/disclosures/ProjectReviewDisclosureCard.vue'
 import DisclosureUpdatedBy from '~/components/ui/project-settings/disclosures/DisclosureUpdatedBy.vue'
+import { formToDisclosures } from '~/components/ui/project-settings/disclosures/form'
+import ProjectReviewDisclosureCard from '~/components/ui/project-settings/disclosures/ProjectReviewDisclosureCard.vue'
 import type {
 	DisclosureFormState,
 	DisclosureType,
@@ -34,66 +25,34 @@ import type {
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 import { injectReviewPanels } from '~/providers/project-review/review-panels'
 
+const aiUsageLabels = {
+	code: 'Code',
+	assets: 'Assets',
+	text: 'Text',
+}
+const consentLabels = {
+	opt_in: 'Opt-in',
+	opt_out: 'Opt-out',
+	always_active: 'Always active',
+}
+const disclosureTitles = {
+	ai_content: 'AI-generated content',
+	ai_functionality: 'Generative AI functionality',
+	advertisements: 'Advertisements',
+	paid_features: 'Paid features',
+	telemetry: 'Telemetry',
+	derivative_work: 'Derivative content',
+	epilepsy_triggers: 'Photosensitivity triggers',
+	system_interactions: 'External system interactions',
+	archived: 'Archived',
+}
+
 const props = defineProps<{ type: DisclosureType }>()
 const emit = defineEmits<{ edit: [] }>()
 
 const { disclosures } = injectProjectReviewPageContext()
 const panels = injectReviewPanels()
-const { formatMessage } = useVIntl()
-const messages = defineMessages({
-	generatedContent: {
-		id: 'moderation.disclosures.fields.generated-content',
-		defaultMessage: 'Content types',
-	},
-	paidFeatures: {
-		id: 'moderation.disclosures.fields.paid-features',
-		defaultMessage: 'Paid features',
-	},
-	consentModel: {
-		id: 'moderation.disclosures.fields.consent-model',
-		defaultMessage: 'Consent model',
-	},
-	dataCollected: {
-		id: 'moderation.disclosures.fields.data-collected',
-		defaultMessage: 'Data collected',
-	},
-	originalWorks: {
-		id: 'moderation.disclosures.fields.original-works',
-		defaultMessage: 'Original works',
-	},
-	originalName: {
-		id: 'moderation.disclosures.fields.original-name',
-		defaultMessage: 'Name',
-	},
-	originalLink: {
-		id: 'moderation.disclosures.fields.original-link',
-		defaultMessage: 'Link',
-	},
-	derivativeExplanation: {
-		id: 'moderation.disclosures.fields.derivative-explanation',
-		defaultMessage: "How it's used",
-	},
-	interactions: {
-		id: 'moderation.disclosures.fields.interactions',
-		defaultMessage: 'System interactions',
-	},
-	photosensitivityDescription: {
-		id: 'moderation.disclosures.fields.photosensitivity-description',
-		defaultMessage: 'Photosensitivity triggers',
-	},
-	archiveReason: {
-		id: 'moderation.disclosures.fields.archive-reason',
-		defaultMessage: 'Reason for archiving',
-	},
-	noneProvided: {
-		id: 'moderation.disclosures.empty.none-provided',
-		defaultMessage: 'None provided.',
-	},
-	noneListed: {
-		id: 'moderation.disclosures.empty.none-listed',
-		defaultMessage: 'None listed.',
-	},
-})
+
 const types = [
 	{ type: 'ai_content', formKey: 'ai', icon: SparklesIcon, key: 'ai' },
 	{
@@ -102,15 +61,30 @@ const types = [
 		icon: BrainCogIcon,
 		key: 'ai-functionality',
 	},
-	{ type: 'advertisements', formKey: 'advertising', icon: MegaphoneIcon, key: 'ads' },
+	{
+		type: 'advertisements',
+		formKey: 'advertising',
+		icon: MegaphoneIcon,
+		key: 'ads',
+	},
 	{
 		type: 'paid_features',
 		formKey: 'paidFeatures',
 		icon: CircleDollarSignIcon,
 		key: 'paid-features',
 	},
-	{ type: 'telemetry', formKey: 'telemetry', icon: RadioTowerIcon, key: 'telemetry' },
-	{ type: 'derivative_work', formKey: 'derivative', icon: GitForkIcon, key: 'derivative-content' },
+	{
+		type: 'telemetry',
+		formKey: 'telemetry',
+		icon: RadioTowerIcon,
+		key: 'telemetry',
+	},
+	{
+		type: 'derivative_work',
+		formKey: 'derivative',
+		icon: GitForkIcon,
+		key: 'derivative-content',
+	},
 	{
 		type: 'epilepsy_triggers',
 		formKey: 'photosensitivity',
@@ -137,9 +111,7 @@ const sections = computed(() =>
 			icon,
 			type,
 			key,
-			title:
-				panels.resolve({ kind: 'disclosure', key })?.panel.title ??
-				formatDisclosureTypeLabel(formatMessage, type),
+			title: panels.resolve({ kind: 'disclosure', key })?.panel.title ?? disclosureTitles[type],
 			data: formToDisclosures(disclosures.current.value).find((entry) => entry.type === type),
 			meta: disclosures.disclosureUpdateProps(type),
 			lock: disclosures.current.value.lockStatuses[type],
@@ -178,7 +150,7 @@ const sections = computed(() =>
 			<template v-if="section.data" #expanded>
 				<dl class="disclosure-fields">
 					<div v-if="section.data.type === 'ai_content'">
-						<dt>{{ formatMessage(messages.generatedContent) }}</dt>
+						<dt>Content types</dt>
 						<dd>
 							<div v-if="section.data.uses.length" class="flex flex-wrap gap-1.5">
 								<TagItem
@@ -186,46 +158,46 @@ const sections = computed(() =>
 									:key="use"
 									class="!border-surface-5 !bg-surface-4 !text-primary"
 								>
-									{{ formatMessage(disclosureAiUsageMessages[use]) }}
+									{{ aiUsageLabels[use] }}
 								</TagItem>
 							</div>
-							<p v-else class="empty-field">{{ formatMessage(messages.noneListed) }}</p>
+							<p v-else class="empty-field">None listed.</p>
 						</dd>
 					</div>
 					<template v-if="section.data.type === 'telemetry'">
 						<div>
-							<dt>{{ formatMessage(messages.consentModel) }}</dt>
+							<dt>Consent model</dt>
 							<dd>
 								<TagItem class="!border-surface-5 !bg-surface-4 !text-primary">{{
-									formatMessage(disclosureTelemetryConsentMessages[section.data.consent])
+									consentLabels[section.data.consent]
 								}}</TagItem>
 							</dd>
 						</div>
 						<div>
-							<dt>{{ formatMessage(messages.dataCollected) }}</dt>
+							<dt>Data collected</dt>
 							<dd>
 								<ul v-if="section.data.data_collected.length">
 									<li v-for="(entry, index) in section.data.data_collected" :key="index">
 										{{ entry }}
 									</li>
 								</ul>
-								<p v-else class="empty-field">{{ formatMessage(messages.noneListed) }}</p>
+								<p v-else class="empty-field">None listed.</p>
 							</dd>
 						</div>
 					</template>
 					<div v-if="section.data.type === 'paid_features'">
-						<dt>{{ formatMessage(messages.paidFeatures) }}</dt>
+						<dt>Paid features</dt>
 						<dd>
 							<ul v-if="section.data.features.length">
 								<li v-for="(feature, index) in section.data.features" :key="index">
 									{{ feature }}
 								</li>
 							</ul>
-							<p v-else class="empty-field">{{ formatMessage(messages.noneListed) }}</p>
+							<p v-else class="empty-field">None listed.</p>
 						</dd>
 					</div>
 					<div v-if="section.data.type === 'system_interactions'">
-						<dt>{{ formatMessage(messages.interactions) }}</dt>
+						<dt>System interactions</dt>
 						<dd>
 							<ul v-if="section.data.interactions.some((entry) => entry.trim())">
 								<li
@@ -237,11 +209,11 @@ const sections = computed(() =>
 									{{ interaction }}
 								</li>
 							</ul>
-							<p v-else class="empty-field">{{ formatMessage(messages.noneListed) }}</p>
+							<p v-else class="empty-field">None listed.</p>
 						</dd>
 					</div>
 					<div v-if="section.data.type === 'derivative_work'" class="original-works">
-						<dt>{{ formatMessage(messages.originalWorks) }}</dt>
+						<dt>Original works</dt>
 						<dd>
 							<div v-if="section.data.sources.length" class="flex flex-col gap-4">
 								<dl
@@ -250,16 +222,14 @@ const sections = computed(() =>
 									class="disclosure-fields border-0 border-l-2 border-solid border-surface-4 pl-3"
 								>
 									<div>
-										<dt>{{ formatMessage(messages.originalName) }}</dt>
+										<dt>Name</dt>
 										<dd>
 											<span v-if="source.label">{{ source.label }}</span>
-											<span v-else class="empty-field">{{
-												formatMessage(messages.noneProvided)
-											}}</span>
+											<span v-else class="empty-field">None provided.</span>
 										</dd>
 									</div>
 									<div>
-										<dt>{{ formatMessage(messages.originalLink) }}</dt>
+										<dt>Link</dt>
 										<dd>
 											<AutoLink
 												v-if="source.link"
@@ -271,36 +241,38 @@ const sections = computed(() =>
 												<span class="min-w-0 break-all underline">{{ source.link }}</span>
 												<ExternalIcon class="mt-0.5 size-4 shrink-0" aria-hidden="true" />
 											</AutoLink>
-											<p v-else class="empty-field">{{ formatMessage(messages.noneProvided) }}</p>
+											<p v-else class="empty-field">None provided.</p>
 										</dd>
 									</div>
 									<div>
-										<dt>{{ formatMessage(messages.derivativeExplanation) }}</dt>
+										<dt>How it's used</dt>
 										<dd>
-											<p v-if="source.note" class="field-text">{{ source.note }}</p>
-											<p v-else class="empty-field">{{ formatMessage(messages.noneProvided) }}</p>
+											<p v-if="source.note" class="field-text">
+												{{ source.note }}
+											</p>
+											<p v-else class="empty-field">None provided.</p>
 										</dd>
 									</div>
 								</dl>
 							</div>
-							<p v-else class="empty-field">{{ formatMessage(messages.noneListed) }}</p>
+							<p v-else class="empty-field">None listed.</p>
 						</dd>
 					</div>
 					<div v-if="'note' in section.data">
 						<dt>
 							{{
-								formatMessage(
-									section.type === 'epilepsy_triggers'
-										? messages.photosensitivityDescription
-										: section.type === 'archived'
-											? messages.archiveReason
-											: commonMessages.explanationLabel,
-								)
+								section.type === 'epilepsy_triggers'
+									? 'Photosensitivity triggers'
+									: section.type === 'archived'
+										? 'Reason for archiving'
+										: 'Explanation'
 							}}
 						</dt>
 						<dd>
-							<p v-if="section.data.note?.trim()" class="field-text">{{ section.data.note }}</p>
-							<p v-else class="empty-field">{{ formatMessage(messages.noneProvided) }}</p>
+							<p v-if="section.data.note?.trim()" class="field-text">
+								{{ section.data.note }}
+							</p>
+							<p v-else class="empty-field">None provided.</p>
 						</dd>
 					</div>
 				</dl>
diff --git a/apps/frontend/src/components/project-review/format.ts b/apps/frontend/src/components/project-review/format.ts
new file mode 100644
index 00000000000..c9c5ddaf9a9
--- /dev/null
+++ b/apps/frontend/src/components/project-review/format.ts
@@ -0,0 +1,58 @@
+const numberFormatter = new Intl.NumberFormat('en-US')
+const compactFormatter = new Intl.NumberFormat('en-US', {
+	notation: 'compact',
+	maximumFractionDigits: 2,
+})
+const shortCompactFormatter = new Intl.NumberFormat('en-US', {
+	notation: 'compact',
+	maximumFractionDigits: 1,
+})
+
+export const formatNumber = (value: number | bigint) => numberFormatter.format(value)
+export const formatCompactNumber = (value: number | bigint) => {
+	if (value < 10_000) return formatNumber(value)
+	return (value < 1_000_000 ? shortCompactFormatter : compactFormatter).format(value)
+}
+
+export function formatBytes(bytes: number, decimals = 2) {
+	if (bytes === 0) return '0 bytes'
+	const units = ['bytes', 'KiB', 'MiB', 'GiB', 'TiB']
+	const exponent = Math.max(
+		0,
+		Math.min(Math.floor(Math.log(bytes) / Math.log(1024)), units.length - 1),
+	)
+	const value = Number((bytes / 1024 ** exponent).toFixed(decimals))
+	return `${formatNumber(value)} ${exponent === 0 && value === 1 ? 'byte' : units[exponent]}`
+}
+
+export function createDateFormatter(options?: Intl.DateTimeFormatOptions) {
+	const formatter = new Intl.DateTimeFormat('en-US', options)
+	return (value: Date | number | string) => formatter.format(new Date(value))
+}
+
+export function createRelativeTimeFormatter(options?: Intl.RelativeTimeFormatOptions) {
+	const formatter = new Intl.RelativeTimeFormat('en-US', {
+		numeric: 'auto',
+		...options,
+	})
+	return (value: Date | number | string | null | undefined) => {
+		if (value == null) return ''
+		const timestamp = new Date(value).getTime()
+		if (Number.isNaN(timestamp)) return ''
+		const difference = timestamp - Date.now()
+		const units: [Intl.RelativeTimeFormatUnit, number, number][] = [
+			['second', 1000, 60],
+			['minute', 60_000, 60],
+			['hour', 3_600_000, 24],
+			['day', 86_400_000, 7],
+			['week', 604_800_000, 4],
+			['month', 2_629_746_000, 12],
+			['year', 31_556_952_000, Infinity],
+		]
+		for (const [unit, duration, limit] of units) {
+			const amount = Math.round(difference / duration)
+			if (Math.abs(amount) < limit) return formatter.format(amount, unit)
+		}
+		return ''
+	}
+}
diff --git a/apps/frontend/src/components/project-review/gallery/index.vue b/apps/frontend/src/components/project-review/gallery/index.vue
index 90332a4ad43..6e38d56e2a7 100644
--- a/apps/frontend/src/components/project-review/gallery/index.vue
+++ b/apps/frontend/src/components/project-review/gallery/index.vue
@@ -9,19 +9,13 @@
 			class="shrink-0"
 		/>
 		<div class="min-h-0 flex-1 overflow-y-auto overscroll-contain">
-			<p v-if="!selection" class="m-0 text-secondary">
-				{{ formatMessage(messages.empty) }}
-			</p>
-			<p v-else-if="isLoading" role="status" class="m-0">
-				{{ formatMessage(messages.loading) }}
-			</p>
+			<p v-if="!selection" class="m-0 text-secondary">No project selected</p>
+			<p v-else-if="isLoading" role="status" class="m-0">Loading...</p>
 			<div v-else-if="error" role="alert">
-				<p class="m-0">{{ formatMessage(messages.loadError) }}</p>
-				<Button @click="refresh">{{ formatMessage(messages.retry) }}</Button>
+				<p class="m-0">Could not load project data</p>
+				<Button @click="refresh">Retry</Button>
 			</div>
-			<p v-else-if="!gallery.length" class="m-0 text-secondary">
-				{{ formatMessage(messages.emptyGallery) }}
-			</p>
+			<p v-else-if="!gallery.length" class="m-0 text-secondary">No gallery images</p>
 			<div
 				v-else
 				class="gallery-grid"
@@ -39,12 +33,12 @@
 					<button
 						type="button"
 						class="cursor-zoom-in border-0 p-0"
-						:aria-label="formatMessage(messages.openImage, { number: index + 1 })"
+						:aria-label="`Open image ${index + 1}`"
 						@click="viewer?.show(index)"
 					>
 						<img
 							:src="item.raw_url || item.url"
-							:alt="item.name || formatMessage(messages.imageNumber, { number: index + 1 })"
+							:alt="item.name || `Image ${index + 1}`"
 							class="aspect-video w-full object-contain"
 							loading="lazy"
 						/>
@@ -52,13 +46,13 @@
 					<div class="flex flex-1 flex-col gap-1.5 p-3">
 						<div class="flex flex-wrap items-center gap-2">
 							<h3 class="m-0 min-w-0 flex-1 break-words text-lg font-semibold text-contrast">
-								{{ item.name || formatMessage(messages.imageNumber, { number: index + 1 }) }}
+								{{ item.name || `Image ${index + 1}` }}
 							</h3>
 							<TagItem
 								v-if="item.featured"
 								class="-my-0.5 !border-brand !bg-transparent !text-brand opacity-90"
 							>
-								{{ formatMessage(messages.featured) }}
+								Featured
 							</TagItem>
 						</div>
 						<p v-if="item.description" class="m-0 whitespace-pre-wrap break-words">
@@ -94,22 +88,21 @@ import type { Labrinth } from '@modrinth/api-client'
 import { CalendarIcon } from '@modrinth/assets'
 import { moderationSettings } from '@modrinth/moderation'
 import { galleryImageReviewKey } from '@modrinth/moderation/src/data/issues/component-builders/gallery-images'
-import { Button, ImageViewerEditor, TagItem, useFormatDateTime, useVIntl } from '@modrinth/ui'
+import { Button, ImageViewerEditor, TagItem } from '@modrinth/ui'
 import { computed, ref, useTemplateRef } from 'vue'
 
 import { useModerationSettings } from '~/composables/moderation'
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 import { injectReviewSubmission } from '~/providers/project-review/review-submission'
 
+import { createDateFormatter } from '../format'
 import ImageViewerActions from '../image-viewer-actions.vue'
-import { projectReviewMessages as messages } from '../messages'
 import ReviewPanel from '../review-panel/index.vue'
 
-const { formatMessage } = useVIntl()
 const settings = useModerationSettings()
 const galleryColumns = computed(() => settings.value.get(moderationSettings.General.GalleryColumns))
 const interactionScope = useTemplateRef<HTMLElement>('interactionScope')
-const formatDate = useFormatDateTime({
+const formatDate = createDateFormatter({
 	year: 'numeric',
 	month: 'long',
 	day: 'numeric',
@@ -124,7 +117,7 @@ const viewerItems = computed(() =>
 	gallery.value.map((item, index) => ({
 		id: item.url,
 		src: item.raw_url || item.url,
-		alt: item.name || formatMessage(messages.imageNumber, { number: index + 1 }),
+		alt: item.name || `Image ${index + 1}`,
 		title: item.name,
 		description: item.description,
 	})),
diff --git a/apps/frontend/src/components/project-review/image-viewer-actions.vue b/apps/frontend/src/components/project-review/image-viewer-actions.vue
index 6b8b775332a..4b0a64b6e5c 100644
--- a/apps/frontend/src/components/project-review/image-viewer-actions.vue
+++ b/apps/frontend/src/components/project-review/image-viewer-actions.vue
@@ -2,16 +2,13 @@
 import { DownloadIcon, ExternalIcon, GridIcon } from '@modrinth/assets'
 import {
 	ButtonLink,
-	defineMessages,
 	IconButton,
 	type ImageViewerEditorMetadata,
 	injectNotificationManager,
-	useVIntl,
 } from '@modrinth/ui'
 import { ref } from 'vue'
 
 import ImageViewerInfo from './image-viewer-info.vue'
-import { projectReviewMessages } from './messages'
 
 const props = defineProps<{
 	src: string
@@ -19,22 +16,8 @@ const props = defineProps<{
 }>()
 const pixelated = defineModel<boolean>('pixelated', { default: false })
 const downloading = ref(false)
-const { formatMessage } = useVIntl()
+
 const { handleError } = injectNotificationManager()
-const messages = defineMessages({
-	enablePixelated: {
-		id: 'project-review.image.enable-pixelated',
-		defaultMessage: 'Enable pixel-art rendering',
-	},
-	disablePixelated: {
-		id: 'project-review.image.disable-pixelated',
-		defaultMessage: 'Disable pixel-art rendering',
-	},
-	download: {
-		id: 'project-review.image.download',
-		defaultMessage: 'Download image',
-	},
-})
 
 async function downloadImage() {
 	if (downloading.value) return
@@ -61,8 +44,8 @@ async function downloadImage() {
 
 <template>
 	<IconButton
-		v-tooltip="formatMessage(pixelated ? messages.disablePixelated : messages.enablePixelated)"
-		:label="formatMessage(pixelated ? messages.disablePixelated : messages.enablePixelated)"
+		v-tooltip="pixelated ? 'Disable pixel-art rendering' : 'Enable pixel-art rendering'"
+		:label="pixelated ? 'Disable pixel-art rendering' : 'Enable pixel-art rendering'"
 		:type="pixelated ? 'colored' : 'quiet'"
 		:color="pixelated ? 'brand' : undefined"
 		:aria-pressed="pixelated"
@@ -71,8 +54,8 @@ async function downloadImage() {
 		<GridIcon aria-hidden="true" />
 	</IconButton>
 	<IconButton
-		v-tooltip="formatMessage(messages.download)"
-		:label="formatMessage(messages.download)"
+		v-tooltip="'Download image'"
+		label="Download image"
 		type="quiet"
 		:loading="downloading"
 		@click="downloadImage"
@@ -80,10 +63,10 @@ async function downloadImage() {
 		<DownloadIcon aria-hidden="true" />
 	</IconButton>
 	<ButtonLink
-		v-tooltip="formatMessage(projectReviewMessages.openImageInNewTab)"
+		v-tooltip="'Open image in new tab'"
 		type="quiet"
 		class="!w-9 !rounded-full !p-0"
-		:aria-label="formatMessage(projectReviewMessages.openImageInNewTab)"
+		aria-label="Open image in new tab"
 		:href="src"
 		target="_blank"
 	>
diff --git a/apps/frontend/src/components/project-review/image-viewer-info.vue b/apps/frontend/src/components/project-review/image-viewer-info.vue
index e0771561578..cd63e170562 100644
--- a/apps/frontend/src/components/project-review/image-viewer-info.vue
+++ b/apps/frontend/src/components/project-review/image-viewer-info.vue
@@ -1,47 +1,17 @@
 <script setup lang="ts">
 import { InfoIcon } from '@modrinth/assets'
-import {
-	defineMessages,
-	FloatingMenu,
-	IconButton,
-	type ImageViewerEditorMetadata,
-	useFormatBytes,
-	useVIntl,
-} from '@modrinth/ui'
+import { FloatingMenu, IconButton, type ImageViewerEditorMetadata } from '@modrinth/ui'
 import { computed, ref } from 'vue'
 
+import { formatBytes } from './format'
+
 const props = defineProps<{
 	metadata?: ImageViewerEditorMetadata
 }>()
 
-const { formatMessage } = useVIntl()
-const formatBytes = useFormatBytes()
 const menu = ref<InstanceType<typeof FloatingMenu>>()
 const open = ref(false)
 
-const messages = defineMessages({
-	info: {
-		id: 'project-review.image.info',
-		defaultMessage: 'Image information',
-	},
-	dimensions: {
-		id: 'project-review.image.dimensions',
-		defaultMessage: 'Dimensions',
-	},
-	size: {
-		id: 'project-review.image.file-size',
-		defaultMessage: 'File size',
-	},
-	format: {
-		id: 'project-review.image.format',
-		defaultMessage: 'Format',
-	},
-	unknown: {
-		id: 'project-review.image.info-unknown',
-		defaultMessage: 'Unknown',
-	},
-})
-
 const format = computed(() => {
 	const mime = props.metadata?.mimeType.toLowerCase().split(';')[0]?.trim() ?? ''
 	const formats: Record<string, string> = {
@@ -70,7 +40,7 @@ const format = computed(() => {
 		@close="open = false"
 	>
 		<IconButton
-			:label="formatMessage(messages.info)"
+			label="Image information"
 			type="quiet"
 			class="!cursor-default !bg-transparent"
 			:aria-expanded="open"
@@ -82,19 +52,21 @@ const format = computed(() => {
 		</IconButton>
 		<template #popper>
 			<section
-				:aria-label="formatMessage(messages.info)"
+				aria-label="Image information"
 				class="w-64 max-w-[calc(100vw_-_2rem)] rounded-xl border border-solid border-surface-5 bg-surface-3 p-4 text-sm text-primary shadow-2xl"
 				@keydown.escape.stop="menu?.hide()"
 			>
 				<dl v-if="metadata" class="m-0 grid grid-cols-[auto_1fr] gap-x-4 gap-y-2">
-					<dt class="text-secondary">{{ formatMessage(messages.dimensions) }}</dt>
+					<dt class="text-secondary">Dimensions</dt>
 					<dd class="m-0 text-right tabular-nums">
 						{{ metadata.width }} × {{ metadata.height }} px
 					</dd>
-					<dt class="text-secondary">{{ formatMessage(messages.size) }}</dt>
-					<dd class="m-0 text-right tabular-nums">{{ formatBytes(metadata.size) }}</dd>
-					<dt class="text-secondary">{{ formatMessage(messages.format) }}</dt>
-					<dd class="m-0 text-right">{{ format || formatMessage(messages.unknown) }}</dd>
+					<dt class="text-secondary">File size</dt>
+					<dd class="m-0 text-right tabular-nums">
+						{{ formatBytes(metadata.size) }}
+					</dd>
+					<dt class="text-secondary">Format</dt>
+					<dd class="m-0 text-right">{{ format || 'Unknown' }}</dd>
 				</dl>
 			</section>
 		</template>
diff --git a/apps/frontend/src/components/project-review/index.vue b/apps/frontend/src/components/project-review/index.vue
index ccc5fe80d9a..a28cf5962d3 100644
--- a/apps/frontend/src/components/project-review/index.vue
+++ b/apps/frontend/src/components/project-review/index.vue
@@ -2,20 +2,25 @@
 	<ClientOnly>
 		<NewModal
 			ref="resetIssuesModal"
-			:header="formatMessage(reviewTabMessages.resetAllIssues)"
+			header="Reset all issues"
 			max-width="800px"
 			danger
 			:initial-focus="() => resetCancelButton?.element ?? null"
 		>
 			<div class="flex max-w-[35rem] flex-col gap-4">
-				<p class="m-0">{{ formatMessage(reviewTabMessages.resetIssuesDescription) }}</p>
-				<p class="m-0">{{ formatMessage(reviewTabMessages.revertCustomizationsDescription) }}</p>
+				<p class="m-0">
+					This will discard your issue changes and move all previous issues back to Re-rev. issues.
+				</p>
+				<p class="m-0">
+					Revert all customizations restores default issue messages while keeping custom issue
+					messages and all issue toggles and selections.
+				</p>
 			</div>
 			<template #actions>
 				<div class="flex flex-wrap justify-end gap-2">
 					<Button ref="resetCancelButton" @click="resetIssuesModal?.hide()">
 						<XIcon />
-						{{ formatMessage(commonMessages.cancelButton) }}
+						Cancel
 					</Button>
 					<Button
 						type="colored"
@@ -23,7 +28,7 @@
 						:disabled="pending || resetting"
 						@click="revertCustomizations"
 					>
-						{{ formatMessage(reviewTabMessages.revertAllCustomizations) }}
+						Revert all customizations
 					</Button>
 					<Button
 						type="colored"
@@ -32,7 +37,7 @@
 						@click="resetAllIssues"
 					>
 						<TrashIcon />
-						{{ formatMessage(reviewTabMessages.resetIssues) }}
+						Reset issues
 					</Button>
 				</div>
 			</template>
@@ -49,16 +54,13 @@
 						<div class="flex shrink-0 flex-wrap items-center gap-2 pb-2.5">
 							<Tabs v-model:value="activeReviewTab" wrap :tabs="rightPanelTabs" />
 							<div class="ml-auto flex items-center gap-1">
-								<Tooltip
-									v-if="!pending && project"
-									:text="formatMessage(reviewTabMessages.resetIssues)"
-								>
+								<Tooltip v-if="!pending && project" text="Reset issues">
 									<Button
 										type="quiet"
 										size="sm"
 										icon-only
 										:disabled="resetting"
-										:aria-label="formatMessage(reviewTabMessages.resetIssues)"
+										aria-label="Reset issues"
 										@click="resetIssuesModal?.show()"
 									>
 										<RotateCounterClockwiseIcon aria-hidden="true" />
@@ -84,9 +86,7 @@
 			<template #slicer><Slicer :key="projectId" /></template>
 		</ProjectReviewLayout>
 		<template #fallback>
-			<p class="m-0 p-4 text-secondary" role="status">
-				{{ formatMessage(projectReviewMessages.loading) }}
-			</p>
+			<p class="m-0 p-4 text-secondary" role="status">Loading...</p>
 		</template>
 	</ClientOnly>
 </template>
@@ -94,16 +94,7 @@
 <script setup lang="ts">
 import { RotateCounterClockwiseIcon, TrashIcon, XIcon } from '@modrinth/assets'
 import { moderationSettings } from '@modrinth/moderation'
-import {
-	Button,
-	commonMessages,
-	defineMessages,
-	injectLoadingState,
-	NewModal,
-	Tabs,
-	Tooltip,
-	useVIntl,
-} from '@modrinth/ui'
+import { Button, injectLoadingState, NewModal, Tabs, Tooltip } from '@modrinth/ui'
 import { computed, onScopeDispose, ref, watch } from 'vue'
 
 import {
@@ -142,7 +133,6 @@ import { useReReviewIssues } from './issue-list/re-review-issues'
 import ProjectReviewLayout from './layout/index.client.vue'
 import { type ProjectReviewTab, projectReviewTabs } from './layout/types'
 import MessageThread from './message-thread/index.vue'
-import { projectReviewMessages } from './messages'
 import Permissions from './permissions/index.vue'
 import ProjectInfo from './project-info/index.vue'
 import ProjectWideChecks from './project-wide-checks.vue'
@@ -158,7 +148,7 @@ const shortcuts = provideReviewShortcuts(createReviewShortcuts())
 function useShortcut(...args: Parameters<typeof shortcuts.register>) {
 	onScopeDispose(shortcuts.register(...args))
 }
-const { formatMessage } = useVIntl()
+
 const {
 	projectId,
 	project,
@@ -282,39 +272,6 @@ const issuePicker = ref<InstanceType<typeof IssuePicker>>()
 const messageThread = ref<InstanceType<typeof MessageThread>>()
 const auth = useAuthState()
 const keybinds = useModerationKeybinds()
-const reviewTabMessages = defineMessages({
-	issues: {
-		id: 'project-review.right-panel.issues',
-		defaultMessage: 'Issues ({count})',
-	},
-	thread: { id: 'project-review.right-panel.thread', defaultMessage: 'Thread' },
-	reReview: {
-		id: 'project-review.right-panel.re-review',
-		defaultMessage: 'Re-review ({count})',
-	},
-	resetIssues: {
-		id: 'project-review.issues.reset',
-		defaultMessage: 'Reset issues',
-	},
-	resetAllIssues: {
-		id: 'project-review.issues.reset-all',
-		defaultMessage: 'Reset all issues',
-	},
-	resetIssuesDescription: {
-		id: 'project-review.issues.reset-description',
-		defaultMessage:
-			'This will discard your issue changes and move all previous issues back to Re-rev. issues.',
-	},
-	revertAllCustomizations: {
-		id: 'project-review.issues.revert-all-customizations',
-		defaultMessage: 'Revert all customizations',
-	},
-	revertCustomizationsDescription: {
-		id: 'project-review.issues.revert-customizations-description',
-		defaultMessage:
-			'Revert all customizations restores default issue messages while keeping custom issue messages and all issue toggles and selections.',
-	},
-})
 
 function resetAllIssues() {
 	resetIssuesModal.value?.hide()
@@ -332,16 +289,14 @@ const rightPanelTabs = computed(() => [
 		? [
 				{
 					value: 're-review',
-					label: formatMessage(reviewTabMessages.reReview, {
-						count: previousIssues.remainingReReviewIssues.value.length,
-					}),
+					label: `Re-review (${previousIssues.remainingReReviewIssues.value.length})`,
 				},
 			]
 		: []),
-	{ value: 'thread', label: formatMessage(reviewTabMessages.thread) },
+	{ value: 'thread', label: 'Thread' },
 	{
 		value: 'issues',
-		label: formatMessage(reviewTabMessages.issues, { count: issueCount.value }),
+		label: `Issues (${issueCount.value})`,
 	},
 ])
 
diff --git a/apps/frontend/src/components/project-review/issue-list/index.vue b/apps/frontend/src/components/project-review/issue-list/index.vue
index 4e62bc601ae..74b035578af 100644
--- a/apps/frontend/src/components/project-review/issue-list/index.vue
+++ b/apps/frontend/src/components/project-review/issue-list/index.vue
@@ -12,15 +12,11 @@
 			class="m-0 p-2 text-sm text-secondary"
 			role="status"
 		>
-			{{ formatMessage(projectReviewMessages.loading) }}
+			Loading...
 		</div>
 		<div v-else-if="wasReviewed && threadQuery.isError.value" class="flex flex-col gap-2 p-2">
-			<p class="m-0 text-sm text-red" role="alert">
-				{{ formatMessage(projectReviewMessages.loadError) }}
-			</p>
-			<Button class="w-fit" @click="() => threadQuery.refetch()">{{
-				formatMessage(projectReviewMessages.retry)
-			}}</Button>
+			<p class="m-0 text-sm text-red" role="alert">Could not load project data</p>
+			<Button class="w-fit" @click="() => threadQuery.refetch()">Retry</Button>
 		</div>
 		<div v-if="issues.length" class="flex flex-col gap-1">
 			<IssueCard
@@ -35,7 +31,7 @@
 			v-else-if="!wasReviewed || (!threadQuery.isPending.value && !threadQuery.isError.value)"
 			class="m-0 p-2 text-sm text-secondary"
 		>
-			{{ formatMessage(reReview ? messages.emptyReReview : messages.empty) }}
+			{{ reReview ? 'No previous issues to re-review.' : 'No issues flagged.' }}
 		</p>
 		<Accordion
 			v-if="reReview && resolvedIssues.length"
@@ -47,7 +43,7 @@
 			<template #button="{ open }">
 				<span class="flex items-center gap-1 text-primary">
 					<span>
-						{{ formatMessage(messages.resolved, { count: resolvedIssues.length }) }}
+						{{ `Auto resolved (${resolvedIssues.length})` }}
 					</span>
 					<DropdownIcon
 						class="size-5 shrink-0 text-primary transition-transform duration-300 motion-reduce:transition-none"
@@ -65,7 +61,7 @@
 import type { Labrinth } from '@modrinth/api-client'
 import { DropdownIcon } from '@modrinth/assets'
 import { IssuePriority } from '@modrinth/moderation/src/data/issues'
-import { Accordion, Button, defineMessages, useVIntl } from '@modrinth/ui'
+import { Accordion, Button } from '@modrinth/ui'
 import { computed } from 'vue'
 
 import { isThreadIssueVerified } from '~/helpers/thread-issues'
@@ -74,11 +70,12 @@ import { injectReviewPanels, type ReviewIssue } from '~/providers/project-review
 import { injectReviewPreviousIssues } from '~/providers/project-review/review-previous-issues'
 import { injectReviewSubmission } from '~/providers/project-review/review-submission'
 
-import { projectReviewMessages } from '../messages'
 import ReviewPanel from '../review-panel/index.vue'
 import IssueCard from './issue-card.vue'
 
-const props = withDefaults(defineProps<{ reReview?: boolean }>(), { reReview: false })
+const props = withDefaults(defineProps<{ reReview?: boolean }>(), {
+	reReview: false,
+})
 const emit = defineEmits<{ add: [] }>()
 const { wasReviewed, threadQuery } = injectProjectReviewPageContext()
 const panels = injectReviewPanels()
@@ -119,19 +116,4 @@ const issues = computed(() => {
 		...activeIssues.filter(({ id }) => !previousIds.has(id)),
 	].sort(compareIssues)
 })
-const { formatMessage } = useVIntl()
-const messages = defineMessages({
-	resolved: {
-		id: 'project-review.issues.resolved',
-		defaultMessage: 'Auto resolved ({count})',
-	},
-	emptyReReview: {
-		id: 'project-review.issues.empty-re-review',
-		defaultMessage: 'No previous issues to re-review.',
-	},
-	empty: {
-		id: 'project-review.issues.empty',
-		defaultMessage: 'No issues flagged.',
-	},
-})
 </script>
diff --git a/apps/frontend/src/components/project-review/issue-list/issue-card.vue b/apps/frontend/src/components/project-review/issue-list/issue-card.vue
index 93b4f4f9bfe..b79b1dd6c9b 100644
--- a/apps/frontend/src/components/project-review/issue-list/issue-card.vue
+++ b/apps/frontend/src/components/project-review/issue-list/issue-card.vue
@@ -12,15 +12,8 @@
 					:aria-controls="contentId"
 					@click="expanded = !expanded"
 				>
-					<Tooltip
-						v-if="previousIssue && previousIssue.verdict !== 'resolved'"
-						:text="formatMessage(messages.reReview)"
-					>
-						<span
-							class="flex shrink-0 items-center text-orange"
-							role="img"
-							:aria-label="formatMessage(messages.reReview)"
-						>
+					<Tooltip v-if="previousIssue && previousIssue.verdict !== 'resolved'" text="Re-review">
+						<span class="flex shrink-0 items-center text-orange" role="img" aria-label="Re-review">
 							<TagCategoryRefreshCcwIcon class="size-4" aria-hidden="true" />
 						</span>
 					</Tooltip>
@@ -34,16 +27,18 @@
 				<div class="flex items-center gap-1">
 					<Tooltip
 						v-if="reviewMessages.hasIssueOverride(messageKey)"
-						:text="formatMessage(messages.editedTooltip)"
+						text="Issue message has been edited"
 					>
-						<span class="text-xs">{{ formatMessage(messages.edited) }}</span>
+						<span class="text-xs">(Edited)</span>
 					</Tooltip>
 					<p
 						v-if="!resolved && missingRequiredFieldCount"
 						class="m-0 text-sm text-red"
 						role="status"
 					>
-						{{ formatMessage(messages.requiredFields, { count: missingRequiredFieldCount }) }}
+						{{
+							missingRequiredFieldCount === 1 ? 'Missing required field' : 'Missing required fields'
+						}}
 					</p>
 					<slot name="action">
 						<Button
@@ -52,23 +47,20 @@
 							type="quiet"
 							class="-my-1 -mb-2 -mr-1.5"
 							:disabled="pending || disabled"
-							:aria-label="formatMessage(messages.add, { issue: issueTitle })"
+							:aria-label="`Add ${issueTitle}`"
 							@click="restoreIssue()"
 						>
 							<PlusIcon aria-hidden="true" />
-							{{ formatMessage(messages.notResolved) }}
+							Not resolved
 						</Button>
-						<Tooltip
-							v-else-if="!resolved"
-							:text="formatMessage(messages.remove)"
-						>
+						<Tooltip v-else-if="!resolved" text="Remove issue">
 							<Button
 								size="sm"
 								type="quiet"
 								circular
 								class="-my-1 -mb-2 -mr-1.5 size-8"
 								:disabled="pending || disabled"
-								:aria-label="formatMessage(messages.remove)"
+								aria-label="Remove issue"
 								@click="removeIssue()"
 							>
 								<XIcon aria-hidden="true" />
@@ -87,7 +79,7 @@
 					:id="contentId"
 					class="issue-content"
 					role="group"
-					:aria-label="formatMessage(messages.message, { issue: issueTitle })"
+					:aria-label="`Message for ${issueTitle}`"
 				>
 					<div class="min-h-0 min-w-0">
 						<div class="flex flex-col gap-2">
@@ -98,41 +90,41 @@
 							>
 								<label class="flex min-w-0 flex-col gap-1">
 									<span>
-										{{ formatMessage(messages.customTitle) }}
+										Title
 										<span class="text-red" aria-hidden="true">*</span>
 									</span>
 									<Input
 										:model-value="issue.custom.title"
 										required
 										:aria-invalid="customTitleMissing"
-										:placeholder="formatMessage(messages.customTitlePlaceholder)"
+										placeholder="Enter title..."
 										@update:model-value="
 											panels.updateCustomIssue(issue.id, { title: String($event ?? '') })
 										"
 									/>
 								</label>
 								<div class="flex min-w-0 flex-col gap-1">
-									<span>{{ formatMessage(messages.customPriority) }}</span>
+									<span>Priority</span>
 									<Combobox
 										:model-value="issue.custom.priority"
 										:options="priorityOptions"
-										:aria-label="formatMessage(messages.customPriority)"
+										aria-label="Priority"
 										:disabled="pending || disabled"
 										trigger-class="!text-primary pl-3.5"
 										@update:model-value="panels.updateCustomIssue(issue.id, { priority: $event })"
 									/>
 								</div>
 								<div class="flex min-w-0 flex-col gap-1">
-									<span>{{ formatMessage(messages.actions) }}</span>
+									<span>Actions</span>
 									<MultiSelect
 										:model-value="issue.custom.facets"
 										:options="facetOptions"
 										searchable
 										:max-tag-rows="3"
-										:search-placeholder="formatMessage(messages.searchFacets)"
+										search-placeholder="Search actions…"
 										:disabled="pending || disabled"
-										:placeholder="formatMessage(messages.addFacets)"
-										:aria-label="formatMessage(messages.actions)"
+										placeholder="Mark as addressed"
+										aria-label="Actions"
 										@update:model-value="panels.updateCustomIssue(issue.id, { facets: $event })"
 									/>
 								</div>
@@ -146,7 +138,7 @@
 								<Controls v-for="binding in fields" :key="binding.key" :binding="binding" />
 							</fieldset>
 							<div class="flex min-w-0 flex-col gap-1">
-								<span v-if="customMessageInput">{{ formatMessage(messages.issueMessage) }}</span>
+								<span v-if="customMessageInput">Message</span>
 								<div
 									class="relative min-w-0"
 									:class="{ 'issue-message-editor': editingMessage && !customMessageInput }"
@@ -158,9 +150,7 @@
 										:model-value="displayMessage"
 										:disabled="pending || disabled || generating"
 										:heading-buttons="false"
-										:placeholder="
-											issue.custom ? formatMessage(messages.customPlaceholder) : undefined
-										"
+										:placeholder="issue.custom ? 'Enter custom issue message...' : undefined"
 										:hide-formatting-buttons="
 											settings.get(moderationSettings.General.HideMarkdownFormattingButtons)
 										"
@@ -182,7 +172,7 @@
 									>
 										<Tooltip
 											v-if="editingMessage && reviewMessages.hasIssueOverride(messageKey)"
-											:text="formatMessage(messages.reset)"
+											text="Reset message"
 										>
 											<Button
 												size="sm"
@@ -190,7 +180,7 @@
 												circular
 												icon-only
 												class="!size-7"
-												:aria-label="formatMessage(messages.reset)"
+												aria-label="Reset message"
 												:disabled="pending || disabled || generating"
 												@click="reviewMessages.resetIssueMessage(messageKey)"
 											>
@@ -203,18 +193,12 @@
 											:color="editingMessage ? 'brand' : undefined"
 											:circular="!editingMessage"
 											:icon-only="!editingMessage"
-											:aria-label="
-												formatMessage(
-													editingMessage ? commonMessages.doneLabel : commonMessages.editButton,
-												)
-											"
+											:aria-label="editingMessage ? 'Done' : 'Edit'"
 											:disabled="pending || disabled || generating"
 											:class="editingMessage ? '!h-7' : ''"
 											@click="editingMessage = !editingMessage"
 										>
-											<template v-if="editingMessage">{{
-												formatMessage(commonMessages.doneLabel)
-											}}</template>
+											<template v-if="editingMessage">Done</template>
 											<EditIcon v-else aria-hidden="true" />
 										</Button>
 									</div>
@@ -231,7 +215,7 @@
 					size="xs"
 					type="quiet"
 					class="!h-auto !min-h-0 !rounded-full !bg-surface-3 !px-2.5 !py-1 !text-xs !font-medium hover:!bg-surface-4"
-					:aria-label="formatMessage(messages.openPanel, { panel: binding.panel.title })"
+					:aria-label="`Open ${binding.panel.title} review panel`"
 					@click="revealPanel(binding.key)"
 				>
 					<PanelTopIcon
@@ -251,7 +235,7 @@
 		</div>
 		<IssueToggles v-if="!resolved" :issue="issue" :disabled="disabled" @remove="removeIssue" />
 		<p v-if="!resolved && needsToggle" class="m-0 text-xs text-orange" role="status">
-			{{ formatMessage(messages.chooseOption) }}
+			Choose at least one option for this issue.
 		</p>
 	</article>
 </template>
@@ -269,17 +253,7 @@ import {
 } from '@modrinth/assets'
 import { moderationSettings } from '@modrinth/moderation'
 import { IssuePriority } from '@modrinth/moderation/src/data/issues'
-import { issueTargetLabels } from '@modrinth/moderation/src/data/issues/component-builders/targets'
-import {
-	Button,
-	Combobox,
-	commonMessages,
-	defineMessages,
-	Input,
-	MultiSelect,
-	Tooltip,
-	useVIntl,
-} from '@modrinth/ui'
+import { Button, Combobox, Input, MultiSelect, Tooltip } from '@modrinth/ui'
 import { computed, nextTick, ref, useId, watch } from 'vue'
 
 import TemplateMarkdownEditor from '~/components/project-review/message-thread/template-markdown-editor.vue'
@@ -294,6 +268,7 @@ import {
 } from '~/providers/project-review/review-panels'
 import { injectReviewPreviousIssues } from '~/providers/project-review/review-previous-issues'
 import { injectReviewSubmission } from '~/providers/project-review/review-submission'
+import { issueTargetLabels } from '~/providers/project-review/review-target-labels'
 
 import { injectReviewContext } from '../review-panel/context'
 import Controls from '../review-panel/controls/index.vue'
@@ -323,7 +298,7 @@ const previousIssue = computed(() => {
 const issue = computed(() =>
 	'controls' in props.issue ? props.issue : previousIssues.cardIssue(props.issue),
 )
-const issueTitle = computed(() => issue.value.title || formatMessage(messages.customIssue))
+const issueTitle = computed(() => issue.value.title || 'Custom issue')
 const active = computed(() =>
 	panels.activeIssues.value.some((entry) => entry.id === issue.value.id),
 )
@@ -378,80 +353,7 @@ watch(
 		if (disabled) editingMessage.value = false
 	},
 )
-const { formatMessage } = useVIntl()
-const messages = defineMessages({
-	customIssue: { id: 'project-review.issues.custom', defaultMessage: 'Custom issue' },
-	customTitle: { id: 'project-review.issues.custom-title', defaultMessage: 'Title' },
-	customTitlePlaceholder: {
-		id: 'project-review.issues.custom-title-placeholder',
-		defaultMessage: 'Enter title...',
-	},
-	issueMessage: { id: 'project-review.issues.issue-message', defaultMessage: 'Message' },
-	customPriority: { id: 'project-review.issues.custom-priority', defaultMessage: 'Priority' },
-	customPlaceholder: {
-		id: 'project-review.issues.custom-placeholder',
-		defaultMessage: 'Enter custom issue message...',
-	},
-	requiredFields: {
-		id: 'project-review.issues.required-fields',
-		defaultMessage:
-			'{count, plural, one {Missing required field} other {Missing required fields}}',
-	},
-	acknowledgeCheckbox: {
-		id: 'project-review.issues.custom-acknowledge-checkbox',
-		defaultMessage: 'Acknowledge checkbox',
-	},
-	acknowledgeReply: {
-		id: 'project-review.issues.custom-acknowledge-reply',
-		defaultMessage: 'Acknowledge reply',
-	},
-	searchFacets: {
-		id: 'project-review.issues.custom-search-facets',
-		defaultMessage: 'Search actions…',
-	},
-	actions: { id: 'project-review.issues.custom-actions', defaultMessage: 'Actions' },
-	addFacets: { id: 'project-review.issues.custom-add-facets', defaultMessage: 'Mark as addressed' },
-	notResolved: {
-		id: 'project-review.issues.not-resolved',
-		defaultMessage: 'Not resolved',
-	},
-	reReview: {
-		id: 'project-review.previous-issues.re-review',
-		defaultMessage: 'Re-review',
-	},
-	openPanel: {
-		id: 'project-review.issues.open-panel',
-		defaultMessage: 'Open {panel} review panel',
-	},
-	edited: {
-		id: 'project-review.issues.edited',
-		defaultMessage: '(Edited)',
-	},
-	editedTooltip: {
-		id: 'project-review.issues.edited-tooltip',
-		defaultMessage: 'Issue message has been edited',
-	},
-	remove: {
-		id: 'project-review.issues.remove',
-		defaultMessage: 'Remove issue',
-	},
-	add: {
-		id: 'project-review.issues.add',
-		defaultMessage: 'Add {issue}',
-	},
-	message: {
-		id: 'project-review.issues.message',
-		defaultMessage: 'Message for {issue}',
-	},
-	reset: {
-		id: 'project-review.issues.reset-message',
-		defaultMessage: 'Reset message',
-	},
-	chooseOption: {
-		id: 'project-review.issues.choose-option',
-		defaultMessage: 'Choose at least one option for this issue.',
-	},
-})
+
 const priorityOptions = Object.keys(IssuePriority).map((value) => ({
 	value,
 	label: value.charAt(0).toUpperCase() + value.slice(1).toLowerCase(),
@@ -462,13 +364,12 @@ const facetOptions = computed(() =>
 		.filter((type) => type !== 'modify_server_languages' || panels.hasServer.value)
 		.map((value) => ({
 			value,
-			label: formatMessage(
+			label:
 				value === 'acknowledge_checkbox'
-					? messages.acknowledgeCheckbox
+					? 'Acknowledge checkbox'
 					: value === 'acknowledge_reply'
-						? messages.acknowledgeReply
+						? 'Acknowledge reply'
 						: issueTargetLabels[value as keyof typeof issueTargetLabels],
-			),
 		})),
 )
 const customTitleMissing = computed(() => !!issue.value.custom && !issue.value.custom.title.trim())
@@ -479,7 +380,7 @@ const facetLabels = computed(() => {
 		[]
 	return [...new Set(facets.map(({ what }) => what.type))]
 		.filter((type) => type !== 'mark_addressed')
-		.map((type) => ({ type, label: formatMessage(issueTargetLabels[type]) }))
+		.map((type) => ({ type, label: issueTargetLabels[type] }))
 })
 const displayMessage = computed(() => {
 	if (props.disabled && props.previewMessage !== undefined) return props.previewMessage
diff --git a/apps/frontend/src/components/project-review/issue-list/issue-picker.vue b/apps/frontend/src/components/project-review/issue-list/issue-picker.vue
index b69d2d67c34..d54866c0c54 100644
--- a/apps/frontend/src/components/project-review/issue-list/issue-picker.vue
+++ b/apps/frontend/src/components/project-review/issue-list/issue-picker.vue
@@ -6,9 +6,9 @@
 		:max-tag-rows="3"
 		:disabled="pending"
 		:searchable="true"
-		:search-placeholder="formatMessage(messages.search)"
-		:no-options-message="formatMessage(messages.empty)"
-		:no-results-message="formatMessage(messages.empty)"
+		search-placeholder="Search issues…"
+		no-options-message="No matching issues."
+		no-results-message="No matching issues."
 		:dropdown-width="288"
 		dropdown-align="right"
 		:max-height="440"
@@ -26,7 +26,7 @@
 		<template #input-content>
 			<span class="flex items-center gap-1">
 				<PlusIcon class="size-4 shrink-0" aria-hidden="true" />
-				{{ formatMessage(messages.add) }}
+				Issue
 			</span>
 		</template>
 	</MultiSelect>
@@ -34,7 +34,7 @@
 
 <script setup lang="ts">
 import { PlusIcon } from '@modrinth/assets'
-import { defineMessages, MultiSelect, type MultiSelectItem, useVIntl } from '@modrinth/ui'
+import { MultiSelect, type MultiSelectItem } from '@modrinth/ui'
 import { computed, ref, watch } from 'vue'
 
 import { injectReviewMessages } from '~/providers/project-review/review-messages'
@@ -47,28 +47,14 @@ const emit = defineEmits<{ selected: [] }>()
 const panels = injectReviewPanels()
 const reviewMessages = injectReviewMessages()
 const { pending } = injectReviewSubmission()
-const { formatMessage } = useVIntl()
-const messages = defineMessages({
-	custom: { id: 'project-review.issues.custom', defaultMessage: 'Custom issue' },
-	add: { id: 'project-review.issues.add', defaultMessage: 'Issue' },
-	search: {
-		id: 'project-review.issues.search',
-		defaultMessage: 'Search issues…',
-	},
-	empty: {
-		id: 'project-review.issues.no-results',
-		defaultMessage: 'No matching issues.',
-	},
-})
+
 const selected = computed(() => panels.activeIssues.value.map(({ id }) => id))
 const picker = ref<{ close: () => void; open: () => Promise<void> }>()
 const shortcuts = injectReviewShortcuts()
 const draft = ref([...selected.value])
 const isOpen = ref(false)
 const options = computed<MultiSelectItem<string>[]>(() => {
-	const items: MultiSelectItem<string>[] = [
-		{ value: 'add-custom-issue', label: formatMessage(messages.custom) },
-	]
+	const items: MultiSelectItem<string>[] = [{ value: 'add-custom-issue', label: 'Custom issue' }]
 	const selectedIds = new Set(selected.value)
 	const categories = new Map<string, ReviewIssue[]>()
 	for (const issue of panels.availableIssues.value) {
diff --git a/apps/frontend/src/components/project-review/issue-list/issue-toggles.vue b/apps/frontend/src/components/project-review/issue-list/issue-toggles.vue
index 37d85b09de1..ee2da225b75 100644
--- a/apps/frontend/src/components/project-review/issue-list/issue-toggles.vue
+++ b/apps/frontend/src/components/project-review/issue-list/issue-toggles.vue
@@ -15,9 +15,7 @@
 					:key="entry.control.id ?? 'active'"
 					size="sm"
 					:disabled="pending || disabled || entry.control.disabled"
-					:aria-label="
-						formatMessage(messages.removeOption, { option: entry.control.issueCardDisplay.label })
-					"
+					:aria-label="`Remove ${entry.control.issueCardDisplay.label}`"
 					@click="removeOption(entry)"
 				>
 					{{ entry.control.issueCardDisplay.label }}
@@ -47,7 +45,7 @@
 					<template #input-content>
 						<span class="flex items-center gap-1">
 							<PlusIcon class="size-4 shrink-0" aria-hidden="true" />
-							<span class="sr-only">{{ formatMessage(messages.addOption) }}</span>
+							<span class="sr-only">Add issue option</span>
 						</span>
 					</template>
 				</MultiSelect>
@@ -58,7 +56,7 @@
 
 <script setup lang="ts">
 import { PlusIcon, XIcon } from '@modrinth/assets'
-import { Button, defineMessages, MultiSelect, type MultiSelectItem, useVIntl } from '@modrinth/ui'
+import { Button, MultiSelect, type MultiSelectItem } from '@modrinth/ui'
 import { computed, h, ref, watch } from 'vue'
 
 import {
@@ -74,17 +72,7 @@ const props = withDefaults(defineProps<{ issue: ReviewIssue; disabled?: boolean
 const emit = defineEmits<{ remove: [] }>()
 const panels = injectReviewPanels()
 const { pending } = injectReviewSubmission()
-const { formatMessage } = useVIntl()
-const messages = defineMessages({
-	addOption: {
-		id: 'project-review.issues.add-option',
-		defaultMessage: 'Add issue option',
-	},
-	removeOption: {
-		id: 'project-review.issues.remove-option',
-		defaultMessage: 'Remove {option}',
-	},
-})
+
 type ToggleControl = Extract<ReviewIssueControl['control'], { type: 'toggle' }>
 interface IssueCardOption extends ReviewIssueControl {
 	control: ToggleControl & {
diff --git a/apps/frontend/src/components/project-review/issue-list/stories/IssueCatalogueRow.vue b/apps/frontend/src/components/project-review/issue-list/stories/IssueCatalogueRow.vue
index bcf91fc016f..5ec9203508a 100644
--- a/apps/frontend/src/components/project-review/issue-list/stories/IssueCatalogueRow.vue
+++ b/apps/frontend/src/components/project-review/issue-list/stories/IssueCatalogueRow.vue
@@ -14,7 +14,6 @@ import { computed, ref } from 'vue'
 
 import { provideReviewPanels } from '../../../../providers/project-review/review-panels'
 import { provideReviewSubmission } from '../../../../providers/project-review/review-submission-context'
-
 import ProjectIssueCard from '../../../ui/project-issue-card/index.vue'
 import ActionButton from '../../review-panel/controls/action-button.vue'
 import IssueToggles from '../issue-toggles.vue'
diff --git a/apps/frontend/src/components/project-review/layout/controls/sidebar-control.vue b/apps/frontend/src/components/project-review/layout/controls/sidebar-control.vue
index b0dbf06a3ef..a72369412a7 100644
--- a/apps/frontend/src/components/project-review/layout/controls/sidebar-control.vue
+++ b/apps/frontend/src/components/project-review/layout/controls/sidebar-control.vue
@@ -4,7 +4,7 @@
 			type="quiet"
 			size="sm"
 			:circular="false"
-			:label="formatMessage(label)"
+			:label="label"
 			:aria-expanded="visible"
 			class="opacity-70 hover:opacity-100"
 			@click="toggleSidebar(side)"
@@ -21,16 +21,18 @@ import {
 	PanelRightCloseIcon,
 	PanelRightOpenIcon,
 } from '@modrinth/assets'
-import { IconButton, useVIntl } from '@modrinth/ui'
+import { IconButton } from '@modrinth/ui'
 import type { IDockviewHeaderActionsProps } from 'dockview-vue'
 import { computed } from 'vue'
 
-import { projectReviewMessages as messages } from '../../messages'
 import { injectProjectReviewContext } from '../context'
 
 defineOptions({ inheritAttrs: false })
-const props = defineProps<{ side: 'left' | 'right'; params: IDockviewHeaderActionsProps }>()
-const { formatMessage } = useVIntl()
+const props = defineProps<{
+	side: 'left' | 'right'
+	params: IDockviewHeaderActionsProps
+}>()
+
 const { leftVisible, rightVisible, topLeftGroupId, topRightGroupId, toggleSidebar } =
 	injectProjectReviewContext()
 const visible = computed(() => (props.side === 'left' ? leftVisible.value : rightVisible.value))
@@ -42,7 +44,7 @@ const cornerGroupId = computed(() =>
 	props.side === 'left' ? topLeftGroupId.value : topRightGroupId.value,
 )
 const label = computed(() => {
-	if (props.side === 'left') return visible.value ? messages.hideLeft : messages.showLeft
-	return visible.value ? messages.hideRight : messages.showRight
+	if (props.side === 'left') return visible.value ? 'Hide project details' : 'Show project details'
+	return visible.value ? 'Hide panel' : 'Show panel'
 })
 </script>
diff --git a/apps/frontend/src/components/project-review/layout/empty-popout.vue b/apps/frontend/src/components/project-review/layout/empty-popout.vue
index 7b5cd6ddef2..82117dea478 100644
--- a/apps/frontend/src/components/project-review/layout/empty-popout.vue
+++ b/apps/frontend/src/components/project-review/layout/empty-popout.vue
@@ -1,17 +1,13 @@
 <template>
 	<div class="flex h-full items-center justify-center p-3 text-secondary">
 		<span v-if="params.group?.api.location.type === 'popout'" role="status">
-			{{ formatMessage(projectReviewMessages.emptyPopout) }}
+			No tabs open in this panel
 		</span>
 	</div>
 </template>
 
 <script setup lang="ts">
-import { useVIntl } from '@modrinth/ui'
 import type { WatermarkRendererInitParameters } from 'dockview-vue'
 
-import { projectReviewMessages } from '../messages'
-
 defineProps<{ params: WatermarkRendererInitParameters }>()
-const { formatMessage } = useVIntl()
 </script>
diff --git a/apps/frontend/src/components/project-review/layout/index.client.vue b/apps/frontend/src/components/project-review/layout/index.client.vue
index 36a1c410d44..de13b833a4d 100644
--- a/apps/frontend/src/components/project-review/layout/index.client.vue
+++ b/apps/frontend/src/components/project-review/layout/index.client.vue
@@ -1,7 +1,7 @@
 <template>
 	<section
 		class="project-review relative flex overflow-hidden bg-bg"
-		:aria-label="formatMessage(messages.title)"
+		aria-label="Project Review"
 		@dblclick="onDividerDoubleClick"
 	>
 		<div class="flex min-h-0 min-w-0 flex-1 flex-col">
@@ -20,25 +20,28 @@
 <script setup lang="ts">
 import 'dockview-vue/dist/styles/dockview.css'
 
-import { useVIntl } from '@modrinth/ui'
 import { onScopeDispose, watch, watchEffect } from 'vue'
 
 import { useModerationKeybinds } from '~/composables/moderation'
 
-import { projectReviewMessages as messages } from '../messages'
 import { injectReviewContext } from '../review-panel/context'
 import { reviewShortcutBlocked, useReviewEventListener, useReviewShortcut } from '../shortcuts'
 import ProjectReviewColumns from './columns.vue'
 import { provideProjectReviewContext } from './context'
+import { reviewPanelLabels } from './labels'
 import { workspacePanelSizes } from './layout-storage'
 import type { ProjectReviewSlots, ProjectReviewTab } from './types'
 import { useProjectReviewLayout } from './use-layout'
 
-const props = defineProps<{ tabs: readonly ProjectReviewTab[]; resetKey: string; ready: boolean }>()
+const props = defineProps<{
+	tabs: readonly ProjectReviewTab[]
+	resetKey: string
+	ready: boolean
+}>()
 const slots = defineSlots<ProjectReviewSlots>()
-const { formatMessage } = useVIntl()
+
 const layout = useProjectReviewLayout(
-	(tab) => formatMessage(messages[tab]),
+	(tab) => reviewPanelLabels[tab],
 	() => props.tabs,
 	() => props.ready,
 )
diff --git a/apps/frontend/src/components/project-review/layout/labels.ts b/apps/frontend/src/components/project-review/layout/labels.ts
new file mode 100644
index 00000000000..891c2fbbf9b
--- /dev/null
+++ b/apps/frontend/src/components/project-review/layout/labels.ts
@@ -0,0 +1,13 @@
+import type { ProjectReviewSlot } from './types'
+
+export const reviewPanelLabels = {
+	left: 'Project details',
+	right: 'Right panel',
+	description: 'Description',
+	gallery: 'Gallery',
+	disclosures: 'Disclosures',
+	permissions: 'Permissions',
+	versions: 'Versions',
+	'tech-review': 'Tech Review',
+	slicer: 'Slicer',
+} satisfies Record<ProjectReviewSlot, string>
diff --git a/apps/frontend/src/components/project-review/layout/panel.vue b/apps/frontend/src/components/project-review/layout/panel.vue
index 0d021a35e66..115dfb1694b 100644
--- a/apps/frontend/src/components/project-review/layout/panel.vue
+++ b/apps/frontend/src/components/project-review/layout/panel.vue
@@ -11,25 +11,24 @@
 				: 'overflow-auto'
 		"
 		:inert="panelHidden"
-		:aria-label="formatMessage(messages[slotName])"
+		:aria-label="reviewPanelLabels[slotName]"
 	>
 		<component :is="content" v-if="content" />
 		<template v-else>
 			<h2 class="m-0 text-lg font-semibold text-contrast">
-				{{ formatMessage(messages[slotName]) }}
+				{{ reviewPanelLabels[slotName] }}
 			</h2>
-			<p class="m-0 text-secondary">{{ formatMessage(messages.empty) }}</p>
+			<p class="m-0 text-secondary">No project selected</p>
 		</template>
 	</section>
 </template>
 
 <script setup lang="ts">
-import { useVIntl } from '@modrinth/ui'
 import type { IDockviewPanelProps } from 'dockview-vue'
 import { computed, ref, watchEffect } from 'vue'
 
-import { projectReviewMessages as messages } from '../messages'
 import { injectProjectReviewContext, provideReviewPanelVisible, provideReviewSlot } from './context'
+import { reviewPanelLabels } from './labels'
 import type { ProjectReviewSlot } from './types'
 
 defineOptions({ inheritAttrs: false })
@@ -39,7 +38,7 @@ const props = defineProps<{
 	params: PanelParams | IDockviewPanelProps<PanelParams>
 }>()
 const { slots, leftVisible, rightVisible } = injectProjectReviewContext()
-const { formatMessage } = useVIntl()
+
 const slotName = computed(() =>
 	'slot' in props.params ? props.params.slot : props.params.params.slot,
 )
diff --git a/apps/frontend/src/components/project-review/layout/tabs/tab.vue b/apps/frontend/src/components/project-review/layout/tabs/tab.vue
index 7f03abd36cd..c8b3f4bb21d 100644
--- a/apps/frontend/src/components/project-review/layout/tabs/tab.vue
+++ b/apps/frontend/src/components/project-review/layout/tabs/tab.vue
@@ -10,7 +10,7 @@
 		]"
 	>
 		<span>
-			{{ formatMessage(projectReviewMessages[params.params.tab]) }}
+			{{ reviewPanelLabels[params.params.tab] }}
 		</span>
 		<span v-if="count !== undefined" class="relative top-px ml-1 rounded text-xs"
 			>({{ count }})</span
@@ -20,21 +20,20 @@
 </template>
 
 <script setup lang="ts">
-import { useVIntl } from '@modrinth/ui'
 import type { IDockviewPanelHeaderProps } from 'dockview-vue'
 import { computed, ref, watchEffect } from 'vue'
 
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
 import KbdChip from '../../kdb-chip.vue'
-import { projectReviewMessages } from '../../messages'
 import { injectProjectReviewContext } from '../context'
+import { reviewPanelLabels } from '../labels'
 import type { ProjectReviewTab } from '../types'
 
 const props = defineProps<{
 	params: IDockviewPanelHeaderProps<{ tab: ProjectReviewTab }>
 }>()
-const { formatMessage } = useVIntl()
+
 const { tabCounts } = injectProjectReviewPageContext()
 const { selectedTabs } = injectProjectReviewContext()
 const isSelected = computed(() => selectedTabs.value.includes(props.params.params.tab))
diff --git a/apps/frontend/src/components/project-review/layout/use-layout.ts b/apps/frontend/src/components/project-review/layout/use-layout.ts
index d7fd45a3b54..6449a120755 100644
--- a/apps/frontend/src/components/project-review/layout/use-layout.ts
+++ b/apps/frontend/src/components/project-review/layout/use-layout.ts
@@ -1,4 +1,4 @@
-import { injectNotificationManager, useVIntl } from '@modrinth/ui'
+import { injectNotificationManager } from '@modrinth/ui'
 import { useIntervalFn } from '@vueuse/core'
 import type {
 	DockviewApi,
@@ -15,7 +15,6 @@ import type {
 import { getGridLocation, LayoutPriority, Orientation } from 'dockview-vue'
 import { onBeforeUnmount, ref, watchEffect } from 'vue'
 
-import { projectReviewMessages } from '../messages'
 import { injectReviewContext } from '../review-panel/context'
 import { injectReviewShortcuts } from '../shortcuts'
 import { registerDragPopouts } from './drag-popout'
@@ -50,7 +49,7 @@ export function useProjectReviewLayout(
 	const detachedTabs = ref<ProjectReviewTab[]>([])
 	const hasPopouts = ref(false)
 	const { addNotification, removeNotification } = injectNotificationManager()
-	const { formatMessage } = useVIntl()
+
 	const poppingOut = ref<string[]>([])
 	const popoutSources = new Map<string, string>()
 	const unavailablePopoutTabs = new Map<
@@ -178,21 +177,19 @@ export function useProjectReviewLayout(
 			id: crypto.randomUUID(),
 			type: 'neutral',
 			containerClass: '!py-1.5 !pr-0.5 !pb-2 !rounded-xl',
-			title: formatMessage(projectReviewMessages.restorePopouts),
-			text: formatMessage(projectReviewMessages.restorePopoutsDescription, {
-				panels,
-			}),
+			title: 'Popout window closed',
+			text: `Panels from this window have been moved to the main window: ${panels}.`,
 			autoCloseMs: null,
 			noIcon: true,
 			buttons: [
 				{
-					label: formatMessage(projectReviewMessages.reopenPopouts),
+					label: 'Reopen window',
 					keepOpen: true,
 					color: 'green',
 					action: () => reopenPopout(popout),
 				},
 				{
-					label: formatMessage(projectReviewMessages.keepPopoutClosed),
+					label: 'Keep closed',
 					keepOpen: true,
 					action: () => keepPopoutClosed(popout),
 				},
@@ -456,7 +453,7 @@ export function useProjectReviewLayout(
 	function notifyPopoutFailure() {
 		addNotification({
 			type: 'error',
-			title: formatMessage(projectReviewMessages.popoutFailed),
+			title: 'Could not open the panel window',
 		})
 	}
 
@@ -502,7 +499,12 @@ export function useProjectReviewLayout(
 					orientation: Orientation.HORIZONTAL,
 					root: {
 						type: 'branch',
-						data: [{ type: 'leaf', data: { id: groupId, views, activeView: views[0] } }],
+						data: [
+							{
+								type: 'leaf',
+								data: { id: groupId, views, activeView: views[0] },
+							},
+						],
 					},
 				},
 			},
diff --git a/apps/frontend/src/components/project-review/link-info/detail-badge.vue b/apps/frontend/src/components/project-review/link-info/detail-badge.vue
index 0384eee43cc..52e078ee426 100644
--- a/apps/frontend/src/components/project-review/link-info/detail-badge.vue
+++ b/apps/frontend/src/components/project-review/link-info/detail-badge.vue
@@ -20,28 +20,34 @@
 </template>
 
 <script setup lang="ts">
-import { TagItem, useFormatBytes, useFormatDateTime, useRelativeTime, useVIntl } from '@modrinth/ui'
+import { TagItem } from '@modrinth/ui'
 import { computed } from 'vue'
 
+import {
+	createDateFormatter,
+	createRelativeTimeFormatter,
+	formatBytes,
+	formatNumber,
+} from '../format'
 import { detailIcon } from './detail-icons'
-import { messages } from './messages'
+import { linkInfoLabels } from './labels'
 import type { Detail } from './types'
 
 const props = defineProps<{ entry: Detail }>()
-const { formatMessage, locale } = useVIntl()
-const formatBytes = useFormatBytes()
-const relativeTime = useRelativeTime({ numeric: 'always' })
-const formatDateTime = useFormatDateTime({ dateStyle: 'long', timeStyle: 'short' })
+
+const relativeTime = createRelativeTimeFormatter({ numeric: 'always' })
+const formatDateTime = createDateFormatter({
+	dateStyle: 'long',
+	timeStyle: 'short',
+})
 
 const value = computed(() => {
 	const entry = props.entry
-	if (typeof entry.value === 'object') return formatMessage(messages[entry.value.message])
+	if (typeof entry.value === 'object') return linkInfoLabels[entry.value.message]
 	if (entry.format === 'date') return relativeTime(entry.value as string) || String(entry.value)
 	if (entry.format === 'bytes' && typeof entry.value === 'number') return formatBytes(entry.value)
-	if (typeof entry.value === 'number')
-		return new Intl.NumberFormat(locale.value).format(entry.value)
-	if (typeof entry.value === 'boolean')
-		return formatMessage(entry.value ? messages.enabled : messages.disabled)
+	if (typeof entry.value === 'number') return formatNumber(entry.value)
+	if (typeof entry.value === 'boolean') return entry.value ? 'Enabled' : 'Disabled'
 	return entry.value
 })
 
@@ -49,10 +55,7 @@ const tooltip = computed(() => {
 	const entry = props.entry
 	const date =
 		entry.format === 'date' && typeof entry.value === 'string' ? new Date(entry.value) : undefined
-	const description = formatMessage(messages.detailTooltip, {
-		label: formatMessage(messages[entry.label]),
-		value: date && !Number.isNaN(date.getTime()) ? formatDateTime(date) : value.value,
-	})
-	return entry.warning ? `${description}\n${formatMessage(messages[entry.warning])}` : description
+	const description = `${linkInfoLabels[entry.label]}: ${date && !Number.isNaN(date.getTime()) ? formatDateTime(date) : value.value}`
+	return entry.warning ? `${description}\n${linkInfoLabels[entry.warning]}` : description
 })
 </script>
diff --git a/apps/frontend/src/components/project-review/link-info/index.vue b/apps/frontend/src/components/project-review/link-info/index.vue
index 7617e5c0c55..cfb38981e0d 100644
--- a/apps/frontend/src/components/project-review/link-info/index.vue
+++ b/apps/frontend/src/components/project-review/link-info/index.vue
@@ -2,7 +2,7 @@
 	<section class="flex flex-col gap-3 rounded-lg bg-surface-2 p-3 text-xs" aria-live="polite">
 		<div class="flex min-w-0 items-center gap-1 font-semibold text-contrast">
 			<GlobeIcon class="size-4 shrink-0" aria-hidden="true" />
-			<span>{{ match.platform }} · {{ formatMessage(messages[match.kind]) }}</span>
+			<span>{{ match.platform }} · {{ linkInfoLabels[match.kind] }}</span>
 		</div>
 		<p
 			v-for="message in validationMessages"
@@ -10,7 +10,7 @@
 			class="m-0 flex items-start gap-1 text-orange"
 		>
 			<TriangleAlertIcon class="size-4 shrink-0" aria-hidden="true" />
-			{{ formatMessage(message.message, message.values) }}
+			{{ message.text }}
 		</p>
 		<p
 			v-for="warning in data?.warnings"
@@ -18,7 +18,7 @@
 			class="m-0 flex items-start gap-2 text-orange"
 		>
 			<TriangleAlertIcon class="size-4 shrink-0" aria-hidden="true" />
-			{{ formatMessage(messages[warning]) }}
+			{{ linkInfoLabels[warning] }}
 		</p>
 		<div v-for="(profile, index) in data?.profiles" :key="index" class="flex flex-col gap-2">
 			<div class="flex items-center gap-2">
@@ -40,9 +40,7 @@
 				</a>
 				<strong v-else class="min-w-0 break-words text-contrast">{{ profile.title }}</strong>
 			</div>
-			<span v-if="profile.label" class="text-secondary">{{
-				formatMessage(messages[profile.label])
-			}}</span>
+			<span v-if="profile.label" class="text-secondary">{{ linkInfoLabels[profile.label] }}</span>
 			<p v-if="profile.description" class="m-0 whitespace-pre-wrap break-words text-secondary">
 				{{ profile.description }}
 			</p>
@@ -50,18 +48,22 @@
 				<DetailBadge v-for="entry in profile.details" :key="entry.label" :entry="entry" />
 			</div>
 		</div>
-		<p v-if="!data?.profiles.length && match.name" class="m-0 break-words">{{ match.name }}</p>
-		<p v-if="isFetching" class="m-0 text-xs text-secondary">
-			{{ formatMessage(messages.loading) }}
+		<p v-if="!data?.profiles.length && match.name" class="m-0 break-words">
+			{{ match.name }}
 		</p>
+		<p v-if="isFetching" class="m-0 text-xs text-secondary">Loading link details…</p>
 		<p v-else-if="error" class="m-0 text-xs text-secondary">
-			{{ formatMessage(notFound ? messages.notFound : messages.unavailable) }}
+			{{
+				notFound
+					? 'This resource was not found. It may be private, deleted, or expired.'
+					: 'Additional details could not be loaded. The service may be unavailable, private, rate limited, or blocked by the browser.'
+			}}
 		</p>
 		<p v-else-if="!match.load" class="m-0 text-xs text-secondary">
-			{{ formatMessage(messages.unsupported) }}
+			No additional public metadata is available for this link.
 		</p>
 		<details v-if="data?.links?.length" class="text-xs">
-			<summary class="cursor-pointer">{{ formatMessage(messages.externalLinks) }}</summary>
+			<summary class="cursor-pointer">External links on this page</summary>
 			<ul class="m-0 mt-2 flex list-none flex-col gap-2 p-0">
 				<li v-for="link in data.links" :key="link.url">
 					<a :href="link.url" target="_blank" rel="noopener noreferrer" class="break-all">{{
@@ -76,24 +78,24 @@
 <script setup lang="ts">
 import { ModrinthApiError } from '@modrinth/api-client'
 import { GlobeIcon, TriangleAlertIcon } from '@modrinth/assets'
-import type { FieldValidationMessage } from '@modrinth/moderation'
-import { injectModrinthClient, useVIntl } from '@modrinth/ui'
+import { injectModrinthClient } from '@modrinth/ui'
 import { useQuery } from '@tanstack/vue-query'
 import { computed } from 'vue'
 
 import { reviewExternalUrl } from '~/providers/project-review/project-links'
 
 import DetailBadge from './detail-badge.vue'
-import { messages } from './messages'
+import { linkInfoLabels } from './labels'
 import { identifyLink, linkInfoQueryOptions } from './query'
+import type { LinkValidationWarning } from './validation'
 
 const props = defineProps<{
 	url: string
 	enabled: boolean
-	validationMessages?: FieldValidationMessage[]
+	validationMessages?: LinkValidationWarning[]
 }>()
 const client = injectModrinthClient()
-const { formatMessage } = useVIntl()
+
 const match = computed(() => identifyLink(props.url))
 const { data, error, isFetching } = useQuery(
 	computed(() => ({
diff --git a/apps/frontend/src/components/project-review/link-info/labels.ts b/apps/frontend/src/components/project-review/link-info/labels.ts
new file mode 100644
index 00000000000..9fa9436bc33
--- /dev/null
+++ b/apps/frontend/src/components/project-review/link-info/labels.ts
@@ -0,0 +1,72 @@
+export const linkInfoLabels = {
+	inviteExpires: 'This invite has an expiry date.',
+	noExpiry: 'No expiry',
+	unlimitedUses: 'Unlimited uses',
+	externalLinks: 'External links on this page',
+	projectUnavailable:
+		'This project is not publicly available or is archived. Check its status below.',
+	inviteExpired: 'This invite has expired.',
+	loading: 'Loading link details…',
+	unavailable:
+		'Additional details could not be loaded. The service may be unavailable, private, rate limited, or blocked by the browser.',
+	unsupported: 'No additional public metadata is available for this link.',
+	notFound: 'This resource was not found. It may be private, deleted, or expired.',
+	archived: 'This repository is archived; its features may be read-only.',
+	issuesDisabled: 'Issues are disabled.',
+	wikiDisabled: 'The wiki is disabled.',
+	discussionsDisabled: 'Discussions are disabled.',
+	privateCommunity: 'This community is private.',
+	repository: 'Repository',
+	user: 'User',
+	organization: 'Organization',
+	issues: 'Issues',
+	wiki: 'Wiki',
+	discussions: 'Discussions',
+	sponsors: 'Sponsors',
+	invite: 'Server invite',
+	server: 'Server',
+	channel: 'Channel',
+	dm: 'DM link',
+	project: 'Project',
+	video: 'Video',
+	playlist: 'Playlist',
+	community: 'Community',
+	document: 'Document',
+	donation: 'Donation profile',
+	board: 'Board',
+	website: 'Website',
+	stars: 'Stars',
+	forks: 'Forks',
+	size: 'Repository size',
+	language: 'Language',
+	license: 'License',
+	lastPush: 'Last push',
+	forkOf: 'Fork of',
+	followers: 'Followers',
+	repositories: 'Public repositories',
+	company: 'Company',
+	owner: 'Owner',
+	openIssues: 'Open issues',
+	closedIssues: 'Closed issues',
+	members: 'Members',
+	online: 'Online',
+	inviter: 'Invited by',
+	expires: 'Expires',
+	uses: 'Uses',
+	maxUses: 'Use limit',
+	target: 'Invite type',
+	stream: 'Stream',
+	activity: 'Activity',
+	created: 'Account created',
+	bot: 'Bot',
+	downloads: 'Downloads',
+	role: 'Role',
+	author: 'Author',
+	subscribers: 'Subscribers',
+	topic: 'Topic',
+	status: 'Status',
+	active: 'Active',
+	archivedValue: 'Archived',
+	enabled: 'Enabled',
+	disabled: 'Disabled',
+} as const
diff --git a/apps/frontend/src/components/project-review/link-info/messages.ts b/apps/frontend/src/components/project-review/link-info/messages.ts
deleted file mode 100644
index 964856f530e..00000000000
--- a/apps/frontend/src/components/project-review/link-info/messages.ts
+++ /dev/null
@@ -1,286 +0,0 @@
-import { defineMessages } from '@modrinth/ui'
-
-export const messages = defineMessages({
-	detailTooltip: {
-		id: 'moderation.project-review.link-info.detailTooltip',
-		defaultMessage: '{label}: {value}',
-	},
-	inviteExpires: {
-		id: 'moderation.project-review.link-info.inviteExpires',
-		defaultMessage: 'This invite has an expiry date.',
-	},
-	noExpiry: {
-		id: 'moderation.project-review.link-info.noExpiry',
-		defaultMessage: 'No expiry',
-	},
-	unlimitedUses: {
-		id: 'moderation.project-review.link-info.unlimitedUses',
-		defaultMessage: 'Unlimited uses',
-	},
-	externalLinks: {
-		id: 'moderation.project-review.link-info.externalLinks',
-		defaultMessage: 'External links on this page',
-	},
-	projectUnavailable: {
-		id: 'moderation.project-review.link-info.projectUnavailable',
-		defaultMessage:
-			'This project is not publicly available or is archived. Check its status below.',
-	},
-	inviteExpired: {
-		id: 'moderation.project-review.link-info.inviteExpired',
-		defaultMessage: 'This invite has expired.',
-	},
-	loading: {
-		id: 'moderation.project-review.link-info.loading',
-		defaultMessage: 'Loading link details…',
-	},
-	unavailable: {
-		id: 'moderation.project-review.link-info.unavailable',
-		defaultMessage:
-			'Additional details could not be loaded. The service may be unavailable, private, rate limited, or blocked by the browser.',
-	},
-	unsupported: {
-		id: 'moderation.project-review.link-info.unsupported',
-		defaultMessage: 'No additional public metadata is available for this link.',
-	},
-	notFound: {
-		id: 'moderation.project-review.link-info.notFound',
-		defaultMessage: 'This resource was not found. It may be private, deleted, or expired.',
-	},
-	archived: {
-		id: 'moderation.project-review.link-info.archived',
-		defaultMessage: 'This repository is archived; its features may be read-only.',
-	},
-	issuesDisabled: {
-		id: 'moderation.project-review.link-info.issuesDisabled',
-		defaultMessage: 'Issues are disabled.',
-	},
-	wikiDisabled: {
-		id: 'moderation.project-review.link-info.wikiDisabled',
-		defaultMessage: 'The wiki is disabled.',
-	},
-	discussionsDisabled: {
-		id: 'moderation.project-review.link-info.discussionsDisabled',
-		defaultMessage: 'Discussions are disabled.',
-	},
-	projectStatus: {
-		id: 'moderation.project-review.link-info.projectStatus',
-		defaultMessage: 'Project status: {status}',
-	},
-	privateCommunity: {
-		id: 'moderation.project-review.link-info.privateCommunity',
-		defaultMessage: 'This community is private.',
-	},
-	repository: {
-		id: 'moderation.project-review.link-info.repository',
-		defaultMessage: 'Repository',
-	},
-	user: {
-		id: 'moderation.project-review.link-info.user',
-		defaultMessage: 'User',
-	},
-	organization: {
-		id: 'moderation.project-review.link-info.organization',
-		defaultMessage: 'Organization',
-	},
-	issues: {
-		id: 'moderation.project-review.link-info.issues',
-		defaultMessage: 'Issues',
-	},
-	wiki: {
-		id: 'moderation.project-review.link-info.wiki',
-		defaultMessage: 'Wiki',
-	},
-	discussions: {
-		id: 'moderation.project-review.link-info.discussions',
-		defaultMessage: 'Discussions',
-	},
-	sponsors: {
-		id: 'moderation.project-review.link-info.sponsors',
-		defaultMessage: 'Sponsors',
-	},
-	invite: {
-		id: 'moderation.project-review.link-info.invite',
-		defaultMessage: 'Server invite',
-	},
-	server: {
-		id: 'moderation.project-review.link-info.server',
-		defaultMessage: 'Server',
-	},
-	channel: {
-		id: 'moderation.project-review.link-info.channel',
-		defaultMessage: 'Channel',
-	},
-	dm: {
-		id: 'moderation.project-review.link-info.dm',
-		defaultMessage: 'DM link',
-	},
-	project: {
-		id: 'moderation.project-review.link-info.project',
-		defaultMessage: 'Project',
-	},
-	video: {
-		id: 'moderation.project-review.link-info.video',
-		defaultMessage: 'Video',
-	},
-	playlist: {
-		id: 'moderation.project-review.link-info.playlist',
-		defaultMessage: 'Playlist',
-	},
-	community: {
-		id: 'moderation.project-review.link-info.community',
-		defaultMessage: 'Community',
-	},
-	document: {
-		id: 'moderation.project-review.link-info.document',
-		defaultMessage: 'Document',
-	},
-	donation: {
-		id: 'moderation.project-review.link-info.donation',
-		defaultMessage: 'Donation profile',
-	},
-	board: {
-		id: 'moderation.project-review.link-info.board',
-		defaultMessage: 'Board',
-	},
-	website: {
-		id: 'moderation.project-review.link-info.website',
-		defaultMessage: 'Website',
-	},
-	stars: {
-		id: 'moderation.project-review.link-info.stars',
-		defaultMessage: 'Stars',
-	},
-	forks: {
-		id: 'moderation.project-review.link-info.forks',
-		defaultMessage: 'Forks',
-	},
-	size: {
-		id: 'moderation.project-review.link-info.size',
-		defaultMessage: 'Repository size',
-	},
-	language: {
-		id: 'moderation.project-review.link-info.language',
-		defaultMessage: 'Language',
-	},
-	license: {
-		id: 'moderation.project-review.link-info.license',
-		defaultMessage: 'License',
-	},
-	lastPush: {
-		id: 'moderation.project-review.link-info.lastPush',
-		defaultMessage: 'Last push',
-	},
-	forkOf: {
-		id: 'moderation.project-review.link-info.forkOf',
-		defaultMessage: 'Fork of',
-	},
-	followers: {
-		id: 'moderation.project-review.link-info.followers',
-		defaultMessage: 'Followers',
-	},
-	repositories: {
-		id: 'moderation.project-review.link-info.repositories',
-		defaultMessage: 'Public repositories',
-	},
-	company: {
-		id: 'moderation.project-review.link-info.company',
-		defaultMessage: 'Company',
-	},
-	owner: {
-		id: 'moderation.project-review.link-info.owner',
-		defaultMessage: 'Owner',
-	},
-	openIssues: {
-		id: 'moderation.project-review.link-info.openIssues',
-		defaultMessage: 'Open issues',
-	},
-	closedIssues: {
-		id: 'moderation.project-review.link-info.closedIssues',
-		defaultMessage: 'Closed issues',
-	},
-	members: {
-		id: 'moderation.project-review.link-info.members',
-		defaultMessage: 'Members',
-	},
-	online: {
-		id: 'moderation.project-review.link-info.online',
-		defaultMessage: 'Online',
-	},
-	inviter: {
-		id: 'moderation.project-review.link-info.inviter',
-		defaultMessage: 'Invited by',
-	},
-	expires: {
-		id: 'moderation.project-review.link-info.expires',
-		defaultMessage: 'Expires',
-	},
-	uses: {
-		id: 'moderation.project-review.link-info.uses',
-		defaultMessage: 'Uses',
-	},
-	maxUses: {
-		id: 'moderation.project-review.link-info.maxUses',
-		defaultMessage: 'Use limit',
-	},
-	target: {
-		id: 'moderation.project-review.link-info.target',
-		defaultMessage: 'Invite type',
-	},
-	stream: {
-		id: 'moderation.project-review.link-info.stream',
-		defaultMessage: 'Stream',
-	},
-	activity: {
-		id: 'moderation.project-review.link-info.activity',
-		defaultMessage: 'Activity',
-	},
-	created: {
-		id: 'moderation.project-review.link-info.created',
-		defaultMessage: 'Account created',
-	},
-	bot: {
-		id: 'moderation.project-review.link-info.bot',
-		defaultMessage: 'Bot',
-	},
-	downloads: {
-		id: 'moderation.project-review.link-info.downloads',
-		defaultMessage: 'Downloads',
-	},
-	role: {
-		id: 'moderation.project-review.link-info.role',
-		defaultMessage: 'Role',
-	},
-	author: {
-		id: 'moderation.project-review.link-info.author',
-		defaultMessage: 'Author',
-	},
-	subscribers: {
-		id: 'moderation.project-review.link-info.subscribers',
-		defaultMessage: 'Subscribers',
-	},
-	topic: {
-		id: 'moderation.project-review.link-info.topic',
-		defaultMessage: 'Topic',
-	},
-	status: {
-		id: 'moderation.project-review.link-info.status',
-		defaultMessage: 'Status',
-	},
-	active: {
-		id: 'moderation.project-review.link-info.active',
-		defaultMessage: 'Active',
-	},
-	archivedValue: {
-		id: 'moderation.project-review.link-info.archivedValue',
-		defaultMessage: 'Archived',
-	},
-	enabled: {
-		id: 'moderation.project-review.link-info.enabled',
-		defaultMessage: 'Enabled',
-	},
-	disabled: {
-		id: 'moderation.project-review.link-info.disabled',
-		defaultMessage: 'Disabled',
-	},
-})
diff --git a/apps/frontend/src/components/project-review/link-info/tooltip.vue b/apps/frontend/src/components/project-review/link-info/tooltip.vue
index 529cfd864d4..9aa54f2a9bb 100644
--- a/apps/frontend/src/components/project-review/link-info/tooltip.vue
+++ b/apps/frontend/src/components/project-review/link-info/tooltip.vue
@@ -32,15 +32,19 @@
 
 <script setup lang="ts">
 import { autoUpdate, flip, offset, shift, size, useFloating } from '@floating-ui/vue'
-import { type FieldValidationMessage, moderationSettings } from '@modrinth/moderation'
+import { moderationSettings } from '@modrinth/moderation'
 import { computed, onScopeDispose, ref, useId, watch } from 'vue'
 
 import { useModerationSettings } from '~/composables/moderation'
 
 import { useReviewEventListener } from '../shortcuts'
 import LinkInfo from './index.vue'
+import type { LinkValidationWarning } from './validation'
 
-const props = defineProps<{ url: string; validationMessages?: FieldValidationMessage[] }>()
+const props = defineProps<{
+	url: string
+	validationMessages?: LinkValidationWarning[]
+}>()
 const emit = defineEmits<{ hover: [hovered: boolean] }>()
 const settings = useModerationSettings()
 const anchor = ref<HTMLElement>()
diff --git a/apps/frontend/src/components/project-review/link-info/types.ts b/apps/frontend/src/components/project-review/link-info/types.ts
index e1942b0e46c..5549350aaa9 100644
--- a/apps/frontend/src/components/project-review/link-info/types.ts
+++ b/apps/frontend/src/components/project-review/link-info/types.ts
@@ -1,8 +1,8 @@
 import type { AbstractModrinthClient } from '@modrinth/api-client'
 
-import type { messages } from './messages'
+import type { linkInfoLabels } from './labels'
 
-export type Label = keyof typeof messages
+export type Label = keyof typeof linkInfoLabels
 export type Detail = {
 	label: Label
 	value: string | number | boolean | { message: Label }
diff --git a/apps/frontend/src/components/project-review/link-info/validation.ts b/apps/frontend/src/components/project-review/link-info/validation.ts
new file mode 100644
index 00000000000..cac7ed9da24
--- /dev/null
+++ b/apps/frontend/src/components/project-review/link-info/validation.ts
@@ -0,0 +1,82 @@
+import type { Labrinth } from '@modrinth/api-client'
+import { normalizeProjectNagKind } from '@modrinth/moderation'
+
+export type LinkValidationWarning = { code: string; text: string }
+
+const fieldNames: Record<string, string> = {
+	issues: 'issue tracker',
+	source: 'source code',
+	wiki: 'wiki',
+	discord: 'Discord invite',
+	site: 'website',
+	store: 'store',
+	license: 'license',
+	description: 'description',
+	patreon: 'Patreon',
+	bmac: 'Buy Me a Coffee',
+	paypal: 'PayPal',
+	github: 'GitHub Sponsors',
+	kofi: 'Ko-fi',
+}
+
+function warningText(details: Labrinth.Projects.v3.ProjectNag['details']) {
+	const rawField = typeof details.field === 'string' ? details.field : 'other'
+	const field = rawField === 'ko-fi' ? 'kofi' : rawField
+	const name = fieldNames[field === 'ko-fi' ? 'kofi' : field] ?? 'donation'
+	const otherField = typeof details.other_field === 'string' ? details.other_field : ''
+	const otherName =
+		otherField === 'description'
+			? undefined
+			: fieldNames[otherField === 'ko-fi' ? 'kofi' : otherField]
+	const other = otherName ? otherName[0].toUpperCase() + otherName.slice(1) : 'another field'
+	switch (details.reason) {
+		case 'global_blocklist_match':
+			return `Your ${name} link uses a prohibited domain. Remove or replace this link.`
+		case 'external_blocklist_match':
+			return `Your ${field} link is not allowed. Please remove this link, or replace it with something appropriate for the ${field} link type.`
+		case 'wrong_field':
+			return `Your ${name} link is not correct for ${name} links. Remove or replace it with the correct link.`
+		case 'ip_address':
+			return `Your ${name} link uses an IP address. Use a URL with a domain name.`
+		case 'malformed':
+			return `Your ${name} link is invalid. Enter a complete HTTPS URL.`
+		case 'not_in_allowlist':
+			return `Your ${name} link may not be appropriate for the link type. Please ensure that it is suitable for its intended purpose.`
+		case 'duplicate':
+			return `Your ${name} link is also used in ${other}. Each link should be listed only once.`
+		case 'download':
+			return 'Links that start a download are not allowed. Please remove any such links from your description.'
+		case 'discord_invite':
+			return 'Your Discord invite is invalid, expired, or does not invite users to a server. Replace it with an active server invite.'
+		case 'source_repository':
+			return 'Your source code link must lead to a repository on a supported host platform, or to a self-hosted Gitea/Forgejo service.'
+		default:
+			return `Your ${name} link could not be verified. Check that it is online and accessible.`
+	}
+}
+
+export function linkValidationWarnings(
+	nags: readonly Labrinth.Projects.v3.ProjectNag[],
+	field: string,
+	url: string,
+): LinkValidationWarning[] {
+	return nags.flatMap((nag) => {
+		if (nag.severity === 'suggestion' || normalizeProjectNagKind(nag.kind) !== 'link-validation')
+			return []
+		const details = nag.details
+		if (typeof details.field === 'string' && details.field !== field) return []
+		if (Array.isArray(details.fields) && !details.fields.includes(field)) return []
+		if (typeof details.gallery_index === 'number' || typeof details.url !== 'string') return []
+		try {
+			if (new URL(details.url).href !== new URL(url).href) return []
+		} catch {
+			return []
+		}
+		return [
+			{
+				code: `link-validation:${JSON.stringify([details.field, details.url, details.reason])}`,
+				text: warningText(details),
+			},
+		]
+	})
+}
diff --git a/apps/frontend/src/components/project-review/message-thread/index.vue b/apps/frontend/src/components/project-review/message-thread/index.vue
index bae23ae1d64..ba8e04ebd6d 100644
--- a/apps/frontend/src/components/project-review/message-thread/index.vue
+++ b/apps/frontend/src/components/project-review/message-thread/index.vue
@@ -21,16 +21,10 @@
 					/>
 				</template>
 				<div v-else-if="isError" class="flex flex-col gap-3 p-4">
-					<p class="m-0 text-red" role="alert">
-						{{ formatMessage(messages.loadError) }}
-					</p>
-					<Button class="w-fit" @click="() => refetch()">{{
-						formatMessage(messages.retry)
-					}}</Button>
+					<p class="m-0 text-red" role="alert">Could not load project data</p>
+					<Button class="w-fit" @click="() => refetch()">Retry</Button>
 				</div>
-				<p v-else class="m-0 p-4 text-secondary" role="status">
-					{{ formatMessage(messages.loading) }}
-				</p>
+				<p v-else class="m-0 p-4 text-secondary" role="status">Loading...</p>
 			</div>
 		</div>
 		<MessageBox v-if="thread" ref="messageBox" class="[&_.markdown-body]:text-xs" />
@@ -49,7 +43,7 @@
 </template>
 
 <script setup lang="ts">
-import { Button, ImageViewerEditor, useVIntl } from '@modrinth/ui'
+import { Button, ImageViewerEditor } from '@modrinth/ui'
 import { useResizeObserver } from '@vueuse/core'
 import { computed, nextTick, ref, watch } from 'vue'
 
@@ -58,7 +52,6 @@ import { injectProjectReviewPageContext } from '~/providers/project-review'
 
 import ImageViewerActions from '../image-viewer-actions.vue'
 import { injectProjectReviewContext } from '../layout/context'
-import { projectReviewMessages as messages } from '../messages'
 import MessageBox from './message-box.vue'
 
 const {
@@ -70,7 +63,7 @@ const {
 const { rightVisible, toggleSidebar } = injectProjectReviewContext()
 const { data: thread, isError, refetch } = threadQuery
 const auth = useAuthState()
-const { formatMessage } = useVIntl()
+
 const viewer = ref<InstanceType<typeof ImageViewerEditor>>()
 const imageItems = ref<{ id: string; src: string; alt: string }[]>([])
 let imageTrigger: HTMLImageElement | undefined
@@ -81,7 +74,7 @@ async function openImage(image: { src: string; alt: string; element: HTMLImageEl
 		{
 			id: image.src,
 			src: image.src,
-			alt: image.alt || formatMessage(messages.imageNumber, { number: 1 }),
+			alt: image.alt || `Image ${1}`,
 		},
 	]
 	await nextTick()
diff --git a/apps/frontend/src/components/project-review/message-thread/markdown-template-picker.vue b/apps/frontend/src/components/project-review/message-thread/markdown-template-picker.vue
index 633061caa42..2c154f315df 100644
--- a/apps/frontend/src/components/project-review/message-thread/markdown-template-picker.vue
+++ b/apps/frontend/src/components/project-review/message-thread/markdown-template-picker.vue
@@ -2,10 +2,10 @@
 	<Button
 		v-if="kind !== 'placeholders'"
 		ref="trigger"
-		v-tooltip="formatMessage(libraryLabel)"
+		v-tooltip="libraryLabel"
 		size="sm"
 		:disabled="disabled"
-		:aria-label="formatMessage(libraryLabel)"
+		:aria-label="libraryLabel"
 		:aria-expanded="open"
 		:aria-controls="listId"
 		aria-haspopup="listbox"
@@ -27,9 +27,7 @@
 					{{ field.label }}
 					<Input v-model="values[field.token]" required />
 				</label>
-				<Button :disabled="!fieldsComplete" @click="insertSelected">
-					{{ formatMessage(messages.insert) }}
-				</Button>
+				<Button :disabled="!fieldsComplete" @click="insertSelected"> Insert message </Button>
 			</form>
 			<template v-else>
 				<Input
@@ -37,25 +35,25 @@
 					ref="searchInput"
 					v-model="search"
 					class="mb-2 w-full"
-					:placeholder="formatMessage(searchLabel)"
-					:aria-label="formatMessage(searchLabel)"
+					:placeholder="searchLabel"
+					:aria-label="searchLabel"
 					:aria-controls="listId"
 					:aria-activedescendant="activeTemplate ? `${listId}-${active}` : undefined"
 				/>
 				<div
 					:id="listId"
 					role="listbox"
-					:aria-label="formatMessage(libraryLabel)"
+					:aria-label="libraryLabel"
 					class="max-h-72 overflow-y-auto"
 				>
 					<div
 						v-for="section in sections"
 						:key="section.kind"
 						role="group"
-						:aria-label="formatMessage(section.label)"
+						:aria-label="section.label"
 					>
 						<div class="px-1.5 pb-2 pt-2.5 text-xs font-semibold text-secondary" aria-hidden="true">
-							{{ formatMessage(section.label) }}
+							{{ section.label }}
 						</div>
 						<div
 							v-for="{ item, index } in section.items"
@@ -75,7 +73,7 @@
 						</div>
 					</div>
 					<div v-if="!filtered.length" class="p-3 text-secondary">
-						{{ formatMessage(emptyLabel) }}
+						{{ emptyLabel }}
 					</div>
 				</div>
 			</template>
@@ -99,7 +97,7 @@
 <script setup lang="ts">
 import { autoUpdate, flip, offset, shift, useFloating } from '@floating-ui/vue'
 import { LibraryIcon } from '@modrinth/assets'
-import { Button, defineMessages, Input, useVIntl } from '@modrinth/ui'
+import { Button, Input } from '@modrinth/ui'
 import { renderHighlightedString } from '@modrinth/utils/highlightjs/index'
 import Fuse from 'fuse.js'
 import { computed, nextTick, ref, useId, watch } from 'vue'
@@ -120,40 +118,17 @@ const emit = defineEmits<{
 	insert: [body: string, inline: boolean]
 	dismiss: []
 }>()
-const { formatMessage } = useVIntl()
-const messages = defineMessages({
-	library: { id: 'markdown-editor.templates.library', defaultMessage: 'Message Library' },
-	search: {
-		id: 'markdown-editor.templates.search-all',
-		defaultMessage: 'Search messages and placeholders…',
-	},
-	empty: {
-		id: 'markdown-editor.templates.empty-all',
-		defaultMessage: 'No matching messages or placeholders.',
-	},
-	templateMessages: {
-		id: 'markdown-editor.templates.section',
-		defaultMessage: 'Template messages',
-	},
-	insert: { id: 'markdown-editor.templates.insert', defaultMessage: 'Insert message' },
-	placeholders: { id: 'markdown-editor.placeholders.label', defaultMessage: 'Placeholders' },
-	searchPlaceholders: {
-		id: 'markdown-editor.placeholders.search',
-		defaultMessage: 'Search placeholders…',
-	},
-	noPlaceholders: {
-		id: 'markdown-editor.placeholders.empty',
-		defaultMessage: 'No matching placeholders.',
-	},
-})
+
 const libraryLabel = computed(() =>
-	props.kind === 'placeholders' ? messages.placeholders : messages.library,
+	props.kind === 'placeholders' ? 'Placeholders' : 'Message Library',
 )
 const searchLabel = computed(() =>
-	props.kind === 'placeholders' ? messages.searchPlaceholders : messages.search,
+	props.kind === 'placeholders' ? 'Search placeholders…' : 'Search messages and placeholders…',
 )
 const emptyLabel = computed(() =>
-	props.kind === 'placeholders' ? messages.noPlaceholders : messages.empty,
+	props.kind === 'placeholders'
+		? 'No matching placeholders.'
+		: 'No matching messages or placeholders.',
 )
 const trigger = ref<InstanceType<typeof Button>>()
 const popup = ref<HTMLElement>()
@@ -195,12 +170,12 @@ const sections = computed(() => {
 	return [
 		{
 			kind: 'messages',
-			label: messages.templateMessages,
+			label: 'Template messages',
 			items: items.filter(({ item }) => item.kind !== 'placeholder'),
 		},
 		{
 			kind: 'placeholders',
-			label: messages.placeholders,
+			label: 'Placeholders',
 			items: items.filter(({ item }) => item.kind === 'placeholder'),
 		},
 	].filter((section) => section.items.length)
@@ -212,7 +187,11 @@ const { floatingStyles } = useFloating(reference, popup, {
 	strategy: 'fixed',
 	middleware: [
 		offset(6),
-		flip({ fallbackPlacements: ['top-start'], flipAlignment: false, padding: 8 }),
+		flip({
+			fallbackPlacements: ['top-start'],
+			flipAlignment: false,
+			padding: 8,
+		}),
 		shift({ padding: 8 }),
 	],
 	whileElementsMounted: autoUpdate,
diff --git a/apps/frontend/src/components/project-review/message-thread/message-box.vue b/apps/frontend/src/components/project-review/message-thread/message-box.vue
index 5347dba6bde..f35cda43554 100644
--- a/apps/frontend/src/components/project-review/message-thread/message-box.vue
+++ b/apps/frontend/src/components/project-review/message-thread/message-box.vue
@@ -10,7 +10,7 @@
 			role="separator"
 			tabindex="0"
 			aria-orientation="horizontal"
-			:aria-label="formatMessage(messages.resizeMessageBox)"
+			aria-label="Resize message box"
 			:aria-valuenow="Math.round(measuredHeight)"
 			:aria-valuemin="180"
 			class="message-box-resize absolute -top-2 left-0 z-10 h-4 w-full cursor-row-resize touch-none"
@@ -30,7 +30,7 @@
 				v-model="draft"
 				:disabled="pending"
 				:templates="templates"
-				:placeholder="formatMessage(messages.replyPlaceholder)"
+				placeholder="Reply to thread…"
 				:on-image-upload="uploadImage"
 				:heading-buttons="false"
 				:hide-formatting-buttons="
@@ -45,12 +45,12 @@
 			<Button :disabled="!canSubmit || pending || !draft.trim()" @click="submit('note')">
 				<SpinnerIcon v-if="loadingAction === 'note'" class="animate-spin" aria-hidden="true" />
 				<StickyNotePlusIcon v-else aria-hidden="true" />
-				{{ formatMessage(messages.addNote) }}
+				Private note
 			</Button>
 			<Button :disabled="!canSubmit || pending || !draft.trim()" @click="submit('reply')">
 				<SpinnerIcon v-if="loadingAction === 'reply'" class="animate-spin" aria-hidden="true" />
 				<ReplyIcon v-else aria-hidden="true" />
-				{{ formatMessage(messages.reply) }}
+				Reply
 			</Button>
 			<Button
 				v-if="showClearIssues"
@@ -63,7 +63,7 @@
 					aria-hidden="true"
 				/>
 				<ReplyIcon v-else aria-hidden="true" />
-				{{ formatMessage(messages.replyAndClearIssues) }}
+				Reply and clear issues
 			</Button>
 		</div>
 	</div>
@@ -73,7 +73,7 @@
 import { ReplyIcon, SpinnerIcon, StickyNotePlusIcon } from '@modrinth/assets'
 import { getMessageTemplates, moderationSettings } from '@modrinth/moderation'
 import { IssuePriority } from '@modrinth/moderation/src/data/issues'
-import { Button, defineMessages, useVIntl } from '@modrinth/ui'
+import { Button } from '@modrinth/ui'
 import { useElementSize } from '@vueuse/core'
 import { computed, nextTick, ref, watch } from 'vue'
 
@@ -89,7 +89,7 @@ import TemplateMarkdownEditor from './template-markdown-editor.vue'
 const keybinds = useModerationKeybinds()
 const settings = useModerationSettings()
 const { project, projectV2 } = injectProjectReviewPageContext()
-const { formatMessage } = useVIntl()
+
 const panels = injectReviewPanels()
 const reviewMessages = injectReviewMessages()
 const previousIssues = injectReviewPreviousIssues()
@@ -120,7 +120,10 @@ const templates = computed(() => {
 	if (!current || !legacy || current.id !== legacy.id) return []
 	return getMessageTemplates({ project: current, projectV2: legacy }).map((template) =>
 		hasCorrectionsHeading(template.body)
-			? { ...template, body: [template.body, ...issueMessages.value].join('\n\n') }
+			? {
+					...template,
+					body: [template.body, ...issueMessages.value].join('\n\n'),
+				}
 			: template,
 	)
 })
@@ -144,22 +147,7 @@ const messageBox = ref<HTMLElement | null>(null)
 const { height: measuredHeight } = useElementSize(messageBox)
 const height = ref<number | null>(null)
 const resizeStart = ref<{ y: number; height: number } | null>(null)
-const messages = defineMessages({
-	resizeMessageBox: {
-		id: 'project-review.message-box.resize',
-		defaultMessage: 'Resize message box',
-	},
-	reply: { id: 'project-review.composer.reply', defaultMessage: 'Reply' },
-	replyAndClearIssues: {
-		id: 'project-review.composer.reply-and-clear-issues',
-		defaultMessage: 'Reply and clear issues',
-	},
-	addNote: { id: 'project-review.composer.add-note', defaultMessage: 'Private note' },
-	replyPlaceholder: {
-		id: 'project-review.composer.reply-placeholder',
-		defaultMessage: 'Reply to thread…',
-	},
-})
+
 function setHeight(value: number) {
 	height.value = Math.max(180, value)
 }
diff --git a/apps/frontend/src/components/project-review/messages.ts b/apps/frontend/src/components/project-review/messages.ts
deleted file mode 100644
index f0c2844a3ae..00000000000
--- a/apps/frontend/src/components/project-review/messages.ts
+++ /dev/null
@@ -1,829 +0,0 @@
-import { defineMessages } from '@modrinth/ui'
-
-export const projectReviewMessages = defineMessages({
-	emptyPopout: {
-		id: 'moderation.project-review.emptyPopout',
-		defaultMessage: 'No tabs open in this panel',
-	},
-	popoutPanel: {
-		id: 'moderation.project-review.popoutPanel',
-		defaultMessage: 'Open panel in its own window',
-	},
-	closePopoutWindows: {
-		id: 'moderation.project-review.closePopoutWindows',
-		defaultMessage: 'Close popout windows',
-	},
-	panelLayout: {
-		id: 'moderation.project-review.panelLayout',
-		defaultMessage: 'Panel layout',
-	},
-	resetPanelLayout: {
-		id: 'moderation.project-review.resetPanelLayout',
-		defaultMessage: 'Reset panel layout',
-	},
-	dockPanel: {
-		id: 'moderation.project-review.dockPanel',
-		defaultMessage: 'Return panel to workspace',
-	},
-	popoutFailed: {
-		id: 'moderation.project-review.popoutFailed',
-		defaultMessage: 'Could not open the panel window',
-	},
-	restorePopouts: {
-		id: 'moderation.project-review.restorePopouts',
-		defaultMessage: 'Popout window closed',
-	},
-	restorePopoutsDescription: {
-		id: 'moderation.project-review.restorePopoutsDescription',
-		defaultMessage: 'Panels from this window have been moved to the main window: {panels}.',
-	},
-	reopenPopouts: {
-		id: 'moderation.project-review.reopenPopouts',
-		defaultMessage: 'Reopen window',
-	},
-	keepPopoutClosed: {
-		id: 'moderation.project-review.keepPopoutClosed',
-		defaultMessage: 'Keep closed',
-	},
-	generalSettings: {
-		id: 'moderation.project-review.generalSettings',
-		defaultMessage: 'General',
-	},
-	appearanceSettings: {
-		id: 'moderation.project-review.appearanceSettings',
-		defaultMessage: 'Appearance',
-	},
-	keybindsSettings: {
-		id: 'moderation.project-review.keybindsSettings',
-		defaultMessage: 'Keybinds',
-	},
-	reviewIssues: {
-		id: 'moderation.project-review.reviewIssues',
-		defaultMessage: 'Issues',
-	},
-	conversationThread: {
-		id: 'moderation.project-review.conversationThread',
-		defaultMessage: 'Conversation thread',
-	},
-	noSelectedIssues: {
-		id: 'moderation.project-review.noSelectedIssues',
-		defaultMessage:
-			'No issues added. Select issues while reviewing the project to see the message here.',
-	},
-	reviewSection: {
-		id: 'moderation.project-review.reviewSection',
-		defaultMessage: 'Review {section}',
-	},
-	selectedFindings: {
-		id: 'moderation.project-review.selectedFindings',
-		defaultMessage: '{count, plural, one {# selected finding} other {# selected findings}}',
-	},
-	reReviewFindings: {
-		id: 'moderation.project-review.reReviewFindings',
-		defaultMessage: '{count, plural, one {# re-review item} other {# re-review items}}',
-	},
-	openReviewGuidance: {
-		id: 'moderation.project-review.openReviewGuidance',
-		defaultMessage: 'Open review guidance in new tab',
-	},
-	closeReview: {
-		id: 'moderation.project-review.closeReview',
-		defaultMessage: 'Close review controls',
-	},
-	pinReview: {
-		id: 'moderation.project-review.pinReview',
-		defaultMessage: 'Pin review controls',
-	},
-	unpinReview: {
-		id: 'moderation.project-review.unpinReview',
-		defaultMessage: 'Unpin review controls',
-	},
-	noReviewActions: {
-		id: 'moderation.project-review.noReviewActions',
-		defaultMessage: 'No review actions available for this section',
-	},
-	noIssues: {
-		id: 'moderation.project-review.noIssues',
-		defaultMessage: 'No issues.',
-	},
-	reviewScope: {
-		id: 'moderation.project-review.reviewScope',
-		defaultMessage: 'These selections apply to the {stage} review for the whole project',
-	},
-	licenseUrl: {
-		id: 'moderation.project-review.licenseUrl',
-		defaultMessage: 'License URL',
-	},
-	withheld: {
-		id: 'moderation.project-review.withheld',
-		defaultMessage: 'Withheld',
-	},
-	resolvePermissions: {
-		id: 'moderation.project-review.resolvePermissions',
-		defaultMessage: 'Review redistribution permissions',
-	},
-	title: {
-		id: 'moderation.project-review.title',
-		defaultMessage: 'Project Review',
-	},
-	left: {
-		id: 'moderation.project-review.left',
-		defaultMessage: 'Project details',
-	},
-	right: {
-		id: 'moderation.project-review.right',
-		defaultMessage: 'Right panel',
-	},
-	description: {
-		id: 'moderation.project-review.description',
-		defaultMessage: 'Description',
-	},
-	gallery: {
-		id: 'moderation.project-review.gallery',
-		defaultMessage: 'Gallery',
-	},
-	disclosures: {
-		id: 'moderation.project-review.disclosures',
-		defaultMessage: 'Disclosures',
-	},
-	permissions: {
-		id: 'moderation.project-review.permissions',
-		defaultMessage: 'Permissions',
-	},
-	permissionsPlaceholder: {
-		id: 'moderation.project-review.permissionsPlaceholder',
-		defaultMessage: 'Permissions review is coming soon',
-	},
-	reupload: {
-		id: 'moderation.project-review.reupload',
-		defaultMessage: 'Reupload',
-	},
-	're-review': {
-		id: 'moderation.project-review.re-review',
-		defaultMessage: 'Re-review',
-	},
-	'post-approval': {
-		id: 'moderation.project-review.post-approval',
-		defaultMessage: 'Post-approval',
-	},
-	'status-alerts': {
-		id: 'moderation.project-review.status-alerts',
-		defaultMessage: 'Status alerts',
-	},
-	undefinedProject: {
-		id: 'moderation.project-review.undefinedProject',
-		defaultMessage: 'Undefined project',
-	},
-	versions: {
-		id: 'moderation.project-review.versions',
-		defaultMessage: 'Versions',
-	},
-	'tech-review': {
-		id: 'moderation.project-review.tech-review',
-		defaultMessage: 'Tech Review',
-	},
-	slicer: {
-		id: 'moderation.project-review.slicer',
-		defaultMessage: 'Slicer',
-	},
-	slicerOpenExternal: {
-		id: 'moderation.project-review.slicerOpenExternal',
-		defaultMessage: 'Open in Slicer in a new tab',
-	},
-	showLeft: {
-		id: 'moderation.project-review.showLeft',
-		defaultMessage: 'Show project details',
-	},
-	hideLeft: {
-		id: 'moderation.project-review.hideLeft',
-		defaultMessage: 'Hide project details',
-	},
-	showRight: {
-		id: 'moderation.project-review.showRight',
-		defaultMessage: 'Show panel',
-	},
-	hideRight: {
-		id: 'moderation.project-review.hideRight',
-		defaultMessage: 'Hide panel',
-	},
-	empty: {
-		id: 'moderation.project-review.empty',
-		defaultMessage: 'No project selected',
-	},
-	loading: {
-		id: 'moderation.project-review.loading',
-		defaultMessage: 'Loading...',
-	},
-	projectTitle: {
-		id: 'moderation.project-review.projectTitle',
-		defaultMessage: 'Title',
-	},
-	editSection: {
-		id: 'moderation.project-review.editSection',
-		defaultMessage: 'Edit {section}',
-	},
-	saveProject: {
-		id: 'moderation.project-review.saveProject',
-		defaultMessage: 'Save project',
-	},
-	slug: {
-		id: 'moderation.project-review.slug',
-		defaultMessage: 'Slug',
-	},
-	slugNotSuggested: {
-		id: 'moderation.project-review.slugNotSuggested',
-		defaultMessage: 'This slug does not match any of the suggested slugs.',
-	},
-	icon: {
-		id: 'moderation.project-review.icon',
-		defaultMessage: 'Icon',
-	},
-	openIcon: {
-		id: 'moderation.project-review.openIcon',
-		defaultMessage: 'View enlarged project icon',
-	},
-	openMemberAvatar: {
-		id: 'moderation.project-review.openMemberAvatar',
-		defaultMessage: 'View enlarged avatar for {username}',
-	},
-	summary: {
-		id: 'moderation.project-review.summary',
-		defaultMessage: 'Summary',
-	},
-	matchesName: {
-		id: 'moderation.project-review.matchesName',
-		defaultMessage: 'Matches the project name',
-	},
-	customSlug: {
-		id: 'moderation.project-review.customSlug',
-		defaultMessage: 'Differs from the project name',
-	},
-	customLicense: {
-		id: 'moderation.project-review.customLicense',
-		defaultMessage: 'Custom',
-	},
-	license: {
-		id: 'moderation.project-review.license',
-		defaultMessage: 'License',
-	},
-	tags: {
-		id: 'moderation.project-review.tags',
-		defaultMessage: 'Tags',
-	},
-	links: {
-		id: 'moderation.project-review.links',
-		defaultMessage: 'Links',
-	},
-	emptyTags: {
-		id: 'moderation.project-review.emptyTags',
-		defaultMessage: 'No tags',
-	},
-	emptyLinks: {
-		id: 'moderation.project-review.emptyLinks',
-		defaultMessage: 'No links',
-	},
-	linkRemoved: {
-		id: 'moderation.project-review.linkRemoved',
-		defaultMessage: 'Link removed: {link}',
-	},
-	linkUnavailable: {
-		id: 'moderation.project-review.linkUnavailable',
-		defaultMessage: 'Link unavailable',
-	},
-	previousLink: {
-		id: 'moderation.project-review.previousLink',
-		defaultMessage: 'Previous link: {url}',
-	},
-	source: {
-		id: 'moderation.project-review.source',
-		defaultMessage: 'Source code',
-	},
-	issues: {
-		id: 'moderation.project-review.issues',
-		defaultMessage: 'Issue tracker',
-	},
-	website: {
-		id: 'moderation.project-review.website',
-		defaultMessage: 'Website',
-	},
-	store: {
-		id: 'moderation.project-review.store',
-		defaultMessage: 'Store',
-	},
-	discord: {
-		id: 'moderation.project-review.discord',
-		defaultMessage: 'Discord invite',
-	},
-	serverDiscord: {
-		id: 'moderation.project-review.serverDiscord',
-		defaultMessage: 'Discord',
-	},
-	wiki: {
-		id: 'moderation.project-review.wiki',
-		defaultMessage: 'Wiki page',
-	},
-	donationPatreon: {
-		id: 'moderation.project-review.donationPatreon',
-		defaultMessage: 'Patreon',
-	},
-	donationBmac: {
-		id: 'moderation.project-review.donationBmac',
-		defaultMessage: 'Buy Me A Coffee',
-	},
-	donationPaypal: {
-		id: 'moderation.project-review.donationPaypal',
-		defaultMessage: 'PayPal',
-	},
-	donationGithub: {
-		id: 'moderation.project-review.donationGithub',
-		defaultMessage: 'GitHub Sponsors',
-	},
-	donationKoFi: {
-		id: 'moderation.project-review.donationKoFi',
-		defaultMessage: 'Ko-fi',
-	},
-	donationOther: {
-		id: 'moderation.project-review.donationOther',
-		defaultMessage: 'Other',
-	},
-	compatibility: {
-		id: 'moderation.project-review.compatibility',
-		defaultMessage: 'Compatibility',
-	},
-	serverDetails: {
-		id: 'moderation.project-review.serverDetails',
-		defaultMessage: 'Server details',
-	},
-	serverAddress: {
-		id: 'moderation.project-review.serverAddress',
-		defaultMessage: 'Address',
-	},
-	serverAddressTemporaryHost: {
-		id: 'moderation.project-review.serverAddressTemporaryHost',
-		defaultMessage: 'This address uses a temporary server host.',
-	},
-	noServerAddress: {
-		id: 'moderation.project-review.noServerAddress',
-		defaultMessage: 'No address.',
-	},
-	serverLanguages: {
-		id: 'moderation.project-review.serverLanguages',
-		defaultMessage: 'Languages',
-	},
-	noServerLanguages: {
-		id: 'moderation.project-review.noServerLanguages',
-		defaultMessage: 'No languages.',
-	},
-	serverRegion: {
-		id: 'moderation.project-review.serverRegion',
-		defaultMessage: 'Region',
-	},
-	serverContent: {
-		id: 'moderation.project-review.serverContent',
-		defaultMessage: 'Content',
-	},
-	vanilla: {
-		id: 'moderation.project-review.vanilla',
-		defaultMessage: 'Vanilla',
-	},
-	modpack: {
-		id: 'moderation.project-review.modpack',
-		defaultMessage: 'Modpack',
-	},
-	modpackVersion: {
-		id: 'moderation.project-review.modpackVersion',
-		defaultMessage: 'Version {version}',
-	},
-	mrpack: {
-		id: 'moderation.project-review.mrpack',
-		defaultMessage: '.mrpack',
-	},
-	recommended: {
-		id: 'moderation.project-review.recommended',
-		defaultMessage: '(Recommended)',
-	},
-	gameVersions: {
-		id: 'moderation.project-review.gameVersions',
-		defaultMessage: 'Game versions',
-	},
-	platforms: {
-		id: 'moderation.project-review.platforms',
-		defaultMessage: 'Platforms',
-	},
-	emptyPlatforms: {
-		id: 'moderation.project-review.emptyPlatforms',
-		defaultMessage: 'No platforms',
-	},
-	environments: {
-		id: 'moderation.project-review.environments',
-		defaultMessage: 'Environments',
-	},
-	emptyEnvironments: {
-		id: 'moderation.project-review.emptyEnvironments',
-		defaultMessage: 'No environments',
-	},
-	members: {
-		id: 'moderation.project-review.members',
-		defaultMessage: 'Members',
-	},
-	memberCount: {
-		id: 'moderation.project-review.memberCount',
-		defaultMessage: '{count, plural, one {# member} other {# members}}',
-	},
-	organization: {
-		id: 'moderation.project-review.organization',
-		defaultMessage: 'Organization',
-	},
-	openOrganizationIcon: {
-		id: 'moderation.project-review.openOrganizationIcon',
-		defaultMessage: 'View enlarged icon for {organization}',
-	},
-	owner: {
-		id: 'moderation.project-review.owner',
-		defaultMessage: 'Owner',
-	},
-	details: {
-		id: 'moderation.project-review.details',
-		defaultMessage: 'Details',
-	},
-	actions: {
-		id: 'moderation.project-review.actions',
-		defaultMessage: 'Actions',
-	},
-	monetization: {
-		id: 'moderation.project-review.monetization',
-		defaultMessage: 'Monetization',
-	},
-	monetizationStatus: {
-		id: 'moderation.project-review.monetizationStatus',
-		defaultMessage:
-			'{status, select, monetized {Monetized} demonetized {Demonetized} forceDemonetized {Force demonetized} other {Unknown}}',
-	},
-	monetizationValue: {
-		id: 'moderation.project-review.monetizationValue',
-		defaultMessage:
-			'{status, select, monetized {Enabled} demonetized {Disabled} forceDemonetized {Force disabled} other {Unknown}}',
-	},
-	visibility: {
-		id: 'moderation.project-review.visibility',
-		defaultMessage: 'Visibility',
-	},
-	visibilityOption: {
-		id: 'moderation.project-review.visibilityOption',
-		defaultMessage:
-			'{status, select, approved {Public} archived {Public} unlisted {Unlisted} private {Private} other {Unknown}}',
-	},
-	projectId: {
-		id: 'moderation.project-review.projectId',
-		defaultMessage: 'Project ID',
-	},
-	permalink: {
-		id: 'moderation.project-review.permalink',
-		defaultMessage: 'Perma link',
-	},
-	copyValue: {
-		id: 'moderation.project-review.copyValue',
-		defaultMessage: 'Copy: {value}',
-	},
-	project: {
-		id: 'moderation.project-review.project',
-		defaultMessage: 'Project',
-	},
-	projectType: {
-		id: 'moderation.project-review.projectType',
-		defaultMessage: 'Type',
-	},
-	created: {
-		id: 'moderation.project-review.created',
-		defaultMessage: 'Created',
-	},
-	updated: {
-		id: 'moderation.project-review.updated',
-		defaultMessage: 'Updated',
-	},
-	submitted: {
-		id: 'moderation.project-review.submitted',
-		defaultMessage: 'Submitted',
-	},
-	submissions: {
-		id: 'moderation.project-review.submissions',
-		defaultMessage: '{count, plural, one {# submission} other {# submissions}}',
-	},
-	downloads: {
-		id: 'moderation.project-review.downloads',
-		defaultMessage: 'Downloads',
-	},
-	requesting: {
-		id: 'moderation.project-review.requesting',
-		defaultMessage: 'Requesting',
-	},
-	complete: {
-		id: 'moderation.project-review.complete',
-		defaultMessage: 'Complete',
-	},
-	completedProjects: {
-		id: 'moderation.project-review.completedProjects',
-		defaultMessage: 'Completed projects',
-	},
-	queuedProjects: {
-		id: 'moderation.project-review.queuedProjects',
-		defaultMessage: 'Next 5 projects',
-	},
-	searchingProjects: {
-		id: 'moderation.project-review.searchingProjects',
-		defaultMessage: 'Searching projects…',
-	},
-	noMatchingProjects: {
-		id: 'moderation.project-review.noMatchingProjects',
-		defaultMessage: 'No matching projects',
-	},
-	skipped: {
-		id: 'moderation.project-review.skipped',
-		defaultMessage: 'Skipped',
-	},
-	skippedProjects: {
-		id: 'moderation.project-review.skippedProjects',
-		defaultMessage: 'Skipped projects',
-	},
-	noSkippedProjects: {
-		id: 'moderation.project-review.noSkippedProjects',
-		defaultMessage: 'No skipped projects',
-	},
-	noCompletedProjects: {
-		id: 'moderation.project-review.noCompletedProjects',
-		defaultMessage: 'No completed projects yet',
-	},
-	noQueuedProjects: {
-		id: 'moderation.project-review.noQueuedProjects',
-		defaultMessage: 'No projects in the queue',
-	},
-	remaining: {
-		id: 'moderation.project-review.remaining',
-		defaultMessage: 'Remaining',
-	},
-	back: {
-		id: 'moderation.project-review.back',
-		defaultMessage: 'Back',
-	},
-	skip: {
-		id: 'moderation.project-review.skip',
-		defaultMessage: 'Skip',
-	},
-	next: {
-		id: 'moderation.project-review.next',
-		defaultMessage: 'Next',
-	},
-	finish: {
-		id: 'moderation.project-review.finish',
-		defaultMessage: 'Finish',
-	},
-	reset: {
-		id: 'moderation.project-review.reset',
-		defaultMessage: 'Reset',
-	},
-	exit: {
-		id: 'moderation.project-review.exit',
-		defaultMessage: 'Exit',
-	},
-	retry: {
-		id: 'moderation.project-review.retry',
-		defaultMessage: 'Retry',
-	},
-	loadError: {
-		id: 'moderation.project-review.loadError',
-		defaultMessage: 'Could not load project data',
-	},
-	queueError: {
-		id: 'moderation.project-review.queueError',
-		defaultMessage: 'Could not change projects. Please try again',
-	},
-	unavailable: {
-		id: 'moderation.project-review.unavailable',
-		defaultMessage: 'Unavailable',
-	},
-	noLicenseUrl: {
-		id: 'moderation.project-review.noLicense',
-		defaultMessage: 'No license URL',
-	},
-	queueNavigation: {
-		id: 'moderation.project-review.queueNavigation',
-		defaultMessage: 'Review queue navigation',
-	},
-	emptyDescription: {
-		id: 'moderation.project-review.emptyDescription',
-		defaultMessage: 'No description',
-	},
-	emptyGallery: {
-		id: 'moderation.project-review.emptyGallery',
-		defaultMessage: 'No gallery images',
-	},
-	imageNumber: {
-		id: 'moderation.project-review.imageNumber',
-		defaultMessage: 'Image {number}',
-	},
-	openImage: {
-		id: 'moderation.project-review.openImage',
-		defaultMessage: 'Open image {number}',
-	},
-	openImageInNewTab: {
-		id: 'moderation.project-review.openImageInNewTab',
-		defaultMessage: 'Open image in new tab',
-	},
-	featured: {
-		id: 'moderation.project-review.featured',
-		defaultMessage: 'Featured',
-	},
-	uploaded: {
-		id: 'moderation.project-review.uploaded',
-		defaultMessage: 'Uploaded {date}',
-	},
-	emptyVersions: {
-		id: 'moderation.project-review.emptyVersions',
-		defaultMessage: 'No versions',
-	},
-	expandAll: {
-		id: 'moderation.project-review.expandAll',
-		defaultMessage: 'Expand all',
-	},
-	collapseAll: {
-		id: 'moderation.project-review.collapseAll',
-		defaultMessage: 'Collapse all',
-	},
-	expandVersion: {
-		id: 'moderation.project-review.expandVersion',
-		defaultMessage: 'Show details',
-	},
-	collapseVersion: {
-		id: 'moderation.project-review.collapseVersion',
-		defaultMessage: 'Hide details',
-	},
-	dependencyCount: {
-		id: 'moderation.project-review.dependencyCount',
-		defaultMessage: '{count, plural, one {# dep} other {# deps}}',
-	},
-	versionNumber: {
-		id: 'moderation.project-review.versionNumber',
-		defaultMessage: 'Version Number',
-	},
-	versionSubtitle: {
-		id: 'moderation.project-review.versionSubtitle',
-		defaultMessage: 'Version Subtitle',
-	},
-	publishedBy: {
-		id: 'moderation.project-review.publishedBy',
-		defaultMessage: 'Published by',
-	},
-	fileCount: {
-		id: 'moderation.project-review.fileCount',
-		defaultMessage: '{count, plural, one {# file} other {# files}}',
-	},
-	files: {
-		id: 'moderation.project-review.files',
-		defaultMessage: 'Files',
-	},
-	primary: {
-		id: 'moderation.project-review.primary',
-		defaultMessage: 'Primary file',
-	},
-	hashes: {
-		id: 'moderation.project-review.hashes',
-		defaultMessage: 'Hashes',
-	},
-	copyHash: {
-		id: 'moderation.project-review.copyHash',
-		defaultMessage: 'Copy {algorithm}',
-	},
-	changelog: {
-		id: 'moderation.project-review.changelog',
-		defaultMessage: 'Changelog',
-	},
-	emptyChangelog: {
-		id: 'moderation.project-review.emptyChangelog',
-		defaultMessage: 'No changelog',
-	},
-	versionId: {
-		id: 'moderation.project-review.versionId',
-		defaultMessage: 'Version ID',
-	},
-	published: {
-		id: 'moderation.project-review.published',
-		defaultMessage: 'Published',
-	},
-	author: {
-		id: 'moderation.project-review.author',
-		defaultMessage: 'Author',
-	},
-	viewVersion: {
-		id: 'moderation.project-review.viewVersion',
-		defaultMessage: 'View version',
-	},
-	download: {
-		id: 'moderation.project-review.download',
-		defaultMessage: 'Download',
-	},
-	openSlicer: {
-		id: 'moderation.project-review.openSlicer',
-		defaultMessage: 'Open in Slicer',
-	},
-	openVersionSlicer: {
-		id: 'moderation.project-review.openVersionSlicer',
-		defaultMessage: 'Open files in Slicer',
-	},
-	viewC2paInfo: {
-		id: 'moderation.project-review.viewC2paInfo',
-		defaultMessage: 'View C2PA info',
-	},
-	dependencies: {
-		id: 'moderation.project-review.dependencies',
-		defaultMessage: 'Dependencies',
-	},
-	emptyDependencies: {
-		id: 'moderation.project-review.emptyDependencies',
-		defaultMessage: 'No dependencies',
-	},
-	searchDependencies: {
-		id: 'moderation.project-review.searchDependencies',
-		defaultMessage: 'Search dependencies…',
-	},
-	noMatchingDependencies: {
-		id: 'moderation.project-review.noMatchingDependencies',
-		defaultMessage: 'No matching dependencies',
-	},
-	listed: {
-		id: 'moderation.project-review.listed',
-		defaultMessage: 'Listed',
-	},
-	archived: {
-		id: 'moderation.project-review.archived',
-		defaultMessage: 'Archived',
-	},
-	draft: {
-		id: 'moderation.project-review.draft',
-		defaultMessage: 'Draft',
-	},
-	unlisted: {
-		id: 'moderation.project-review.unlisted',
-		defaultMessage: 'Unlisted',
-	},
-	scheduled: {
-		id: 'moderation.project-review.scheduled',
-		defaultMessage: 'Scheduled',
-	},
-	unknown: {
-		id: 'moderation.project-review.unknown',
-		defaultMessage: 'Unknown',
-	},
-	required: {
-		id: 'moderation.project-review.required',
-		defaultMessage: 'Required',
-	},
-	sourceAvailabilityRequired: {
-		id: 'moderation.project-review.sourceAvailabilityRequired',
-		defaultMessage: 'License requires source code.',
-	},
-	optional: {
-		id: 'moderation.project-review.optional',
-		defaultMessage: 'Optional',
-	},
-	incompatible: {
-		id: 'moderation.project-review.incompatible',
-		defaultMessage: 'Incompatible',
-	},
-	embedded: {
-		id: 'moderation.project-review.embedded',
-		defaultMessage: 'Embedded',
-	},
-	pendingFiles: {
-		id: 'moderation.project-review.pendingFiles',
-		defaultMessage: 'Pending files ({count})',
-	},
-	completedFiles: {
-		id: 'moderation.project-review.completedFiles',
-		defaultMessage: 'Reviewed files ({count})',
-	},
-	noReports: {
-		id: 'moderation.project-review.noReports',
-		defaultMessage: 'No technical-review reports are available for this project',
-	},
-	noPendingFiles: {
-		id: 'moderation.project-review.noPendingFiles',
-		defaultMessage: 'No files with unresolved flags',
-	},
-	reviewProgress: {
-		id: 'moderation.project-review.reviewProgress',
-		defaultMessage:
-			'Reviewed flags indicate progress, not a safe verdict. Files without flags have no flag verdict',
-	},
-	backToFiles: {
-		id: 'moderation.project-review.backToFiles',
-		defaultMessage: 'Back to files',
-	},
-	noFlagsFiles: {
-		id: 'moderation.project-review.noFlagsFiles',
-		defaultMessage: 'Files without flags ({count})',
-	},
-	sourceError: {
-		id: 'moderation.project-review.sourceError',
-		defaultMessage: 'Could not load source code. Try opening the flag again',
-	},
-})
diff --git a/apps/frontend/src/components/project-review/project-info/edit/button.vue b/apps/frontend/src/components/project-review/project-info/edit/button.vue
index 0f4d606a0ae..c3de28758c9 100644
--- a/apps/frontend/src/components/project-review/project-info/edit/button.vue
+++ b/apps/frontend/src/components/project-review/project-info/edit/button.vue
@@ -14,10 +14,8 @@
 
 <script setup lang="ts">
 import { EditIcon } from '@modrinth/assets'
-import { useVIntl } from '@modrinth/ui'
 import { computed, ref } from 'vue'
 
-import { projectReviewMessages as messages } from '../../messages'
 import { useReviewInteraction } from '../../shortcuts'
 
 const props = defineProps<{ section: string }>()
@@ -28,8 +26,8 @@ useReviewInteraction({
 	edit: () => button.value?.click(),
 	editable: () => !!button.value && !button.value.disabled,
 })
-const { formatMessage } = useVIntl()
-const label = computed(() => formatMessage(messages.editSection, { section: props.section }))
+
+const label = computed(() => `Edit ${props.section}`)
 </script>
 
 <style scoped>
diff --git a/apps/frontend/src/components/project-review/project-info/edit/details.vue b/apps/frontend/src/components/project-review/project-info/edit/details.vue
index 1ad413c3db8..90b96cb6ea7 100644
--- a/apps/frontend/src/components/project-review/project-info/edit/details.vue
+++ b/apps/frontend/src/components/project-review/project-info/edit/details.vue
@@ -1,7 +1,7 @@
 <template>
 	<EditModal
 		ref="modal"
-		:section="formatMessage(reviewMessages.details)"
+		section="Details"
 		:saving="saving"
 		:can-save="canSave"
 		width="32rem"
@@ -11,7 +11,7 @@
 		<div class="flex flex-col gap-6">
 			<div class="flex flex-col gap-2">
 				<label id="project-review-visibility-label" class="font-semibold text-contrast">
-					{{ formatMessage(reviewMessages.visibility) }}
+					Visibility
 				</label>
 				<Combobox
 					v-model="visibility"
@@ -23,7 +23,7 @@
 			</div>
 			<div v-if="!project?.minecraft_server" class="flex flex-col gap-2">
 				<label id="project-review-monetization-label" class="font-semibold text-contrast">
-					{{ formatMessage(reviewMessages.monetization) }}
+					Monetization
 				</label>
 				<Combobox
 					v-model="monetization"
@@ -39,32 +39,15 @@
 
 <script setup lang="ts">
 import type { Labrinth } from '@modrinth/api-client'
-import { Combobox, defineMessages, useVIntl } from '@modrinth/ui'
+import { Combobox } from '@modrinth/ui'
 import { computed, ref, useTemplateRef } from 'vue'
 
-import { projectReviewMessages as reviewMessages } from '../../messages'
 import EditModal from './edit-modal.vue'
 import { useProjectInfoEdit } from './use-project-edit'
 
 type Visibility = 'approved' | 'unlisted' | 'private'
 type MonetizationStatus = Labrinth.Projects.v2.MonetizationStatus
 
-const messages = defineMessages({
-	publicDescription: {
-		id: 'moderation.project-review.details.publicDescription',
-		defaultMessage: 'Visible via URL, on your profile, and in search.',
-	},
-	unlistedDescription: {
-		id: 'moderation.project-review.details.unlistedDescription',
-		defaultMessage: 'Visible via URL only. Not shown on your profile or in search.',
-	},
-	privateDescription: {
-		id: 'moderation.project-review.details.privateDescription',
-		defaultMessage: 'Not publicly visible. Only accessible to project members.',
-	},
-})
-
-const { formatMessage } = useVIntl()
 const { project, saving, beginEditing, saveProject } = useProjectInfoEdit()
 const modal = useTemplateRef<InstanceType<typeof EditModal>>('modal')
 const visibility = ref<Visibility>('approved')
@@ -76,27 +59,28 @@ const currentVisibility = computed<Visibility>(() => {
 	const status = hasPublishedStatus.value ? project.value?.status : project.value?.requested_status
 	return status === 'unlisted' || status === 'private' ? status : 'approved'
 })
-const visibilityOptions = computed(() =>
-	(['approved', 'unlisted', 'private'] as const).map((value) => ({
-		value,
-		label: formatMessage(reviewMessages.visibilityOption, { status: value }),
-		subLabel: formatMessage(
-			value === 'approved'
-				? messages.publicDescription
-				: value === 'unlisted'
-					? messages.unlistedDescription
-					: messages.privateDescription,
-		),
-	})),
-)
-const monetizationOptions = computed(() =>
-	(['monetized', 'demonetized', 'force-demonetized'] as const).map((value) => ({
-		value,
-		label: formatMessage(reviewMessages.monetizationStatus, {
-			status: value === 'force-demonetized' ? 'forceDemonetized' : value,
-		}),
-	})),
-)
+const visibilityOptions = [
+	{
+		value: 'approved',
+		label: 'Public',
+		subLabel: 'Visible via URL, on your profile, and in search.',
+	},
+	{
+		value: 'unlisted',
+		label: 'Unlisted',
+		subLabel: 'Visible via URL only. Not shown on your profile or in search.',
+	},
+	{
+		value: 'private',
+		label: 'Private',
+		subLabel: 'Not publicly visible. Only accessible to project members.',
+	},
+] satisfies { value: Visibility; label: string; subLabel: string }[]
+const monetizationOptions = [
+	{ value: 'monetized', label: 'Monetized' },
+	{ value: 'demonetized', label: 'Demonetized' },
+	{ value: 'force-demonetized', label: 'Force demonetized' },
+] satisfies { value: MonetizationStatus; label: string }[]
 const patch = computed<Labrinth.Projects.v3.EditProjectRequest>(() => {
 	const result: Labrinth.Projects.v3.EditProjectRequest = {}
 	if (visibility.value !== currentVisibility.value) {
diff --git a/apps/frontend/src/components/project-review/project-info/edit/edit-modal.vue b/apps/frontend/src/components/project-review/project-info/edit/edit-modal.vue
index 6afa7b6e6e7..da93ab74f93 100644
--- a/apps/frontend/src/components/project-review/project-info/edit/edit-modal.vue
+++ b/apps/frontend/src/components/project-review/project-info/edit/edit-modal.vue
@@ -1,7 +1,7 @@
 <template>
 	<NewModal
 		ref="modal"
-		:header="formatMessage(messages.editSection, { section })"
+		:header="`Edit ${section}`"
 		:width="width"
 		:disable-close="saving"
 		:on-hide="() => emit('cancel')"
@@ -14,9 +14,7 @@
 		</div>
 		<template #actions>
 			<div class="flex justify-end gap-2">
-				<Button type="quiet" :disabled="saving" @click="modal?.hide()">
-					{{ formatMessage(commonMessages.cancelButton) }}
-				</Button>
+				<Button type="quiet" :disabled="saving" @click="modal?.hide()"> Cancel </Button>
 				<Button
 					type="colored"
 					color="brand"
@@ -24,7 +22,7 @@
 					:disabled="!canSave"
 					@click="emit('save')"
 				>
-					{{ formatMessage(messages.saveProject) }}
+					Save project
 				</Button>
 			</div>
 		</template>
@@ -32,11 +30,9 @@
 </template>
 
 <script setup lang="ts">
-import { Button, commonMessages, NewModal, useVIntl } from '@modrinth/ui'
+import { Button, NewModal } from '@modrinth/ui'
 import { useTemplateRef } from 'vue'
 
-import { projectReviewMessages as messages } from '../../messages'
-
 withDefaults(
 	defineProps<{
 		section: string
@@ -52,7 +48,6 @@ const emit = defineEmits<{
 	save: []
 }>()
 
-const { formatMessage } = useVIntl()
 const modal = useTemplateRef<InstanceType<typeof NewModal>>('modal')
 
 defineExpose({
diff --git a/apps/frontend/src/components/project-review/project-info/edit/icon.vue b/apps/frontend/src/components/project-review/project-info/edit/icon.vue
index c47ed5399fa..55202e75ca9 100644
--- a/apps/frontend/src/components/project-review/project-info/edit/icon.vue
+++ b/apps/frontend/src/components/project-review/project-info/edit/icon.vue
@@ -12,8 +12,8 @@
 				<FileButton
 					:max-size="524288"
 					accept="image/png,image/jpeg,image/gif,image/webp"
-					:prompt="formatMessage(messages.uploadIcon)"
-					:aria-label="formatMessage(messages.uploadIcon)"
+					prompt="Upload icon"
+					aria-label="Upload icon"
 					:disabled="saving"
 					size="sm"
 					@change="selectIcon"
@@ -27,14 +27,12 @@
 					@click="removeIcon"
 				>
 					<TrashIcon aria-hidden="true" />
-					{{ formatMessage(messages.removeIcon) }}
+					Remove icon
 				</Button>
 			</div>
 		</div>
 		<div class="flex justify-end gap-1">
-			<Button type="quiet" size="xs" :disabled="saving" @click="emit('done')">
-				{{ formatMessage(commonMessages.cancelButton) }}
-			</Button>
+			<Button type="quiet" size="xs" :disabled="saving" @click="emit('done')"> Cancel </Button>
 			<Button
 				type="colored"
 				color="brand"
@@ -43,7 +41,7 @@
 				:disabled="saving || (!icon && !deleted)"
 				@click="save"
 			>
-				{{ formatMessage(commonMessages.saveButton) }}
+				Save
 			</Button>
 		</div>
 	</div>
@@ -51,7 +49,7 @@
 
 <script setup lang="ts">
 import { TrashIcon, UploadIcon } from '@modrinth/assets'
-import { Avatar, Button, commonMessages, defineMessages, FileButton, useVIntl } from '@modrinth/ui'
+import { Avatar, Button, FileButton } from '@modrinth/ui'
 import { useObjectUrl } from '@vueuse/core'
 import { onScopeDispose, ref, useTemplateRef } from 'vue'
 
@@ -61,17 +59,7 @@ import { fileDeclaresAi } from '~/helpers/c2pa'
 import { useProjectInfoEdit } from './use-project-edit'
 
 const emit = defineEmits<{ done: [] }>()
-const messages = defineMessages({
-	uploadIcon: {
-		id: 'moderation.project-review.edit.upload-icon',
-		defaultMessage: 'Upload icon',
-	},
-	removeIcon: {
-		id: 'moderation.project-review.edit.remove-icon',
-		defaultMessage: 'Remove icon',
-	},
-})
-const { formatMessage } = useVIntl()
+
 const { project, saving, beginEditing, saveIcon } = useProjectInfoEdit()
 const icon = ref<File>()
 const deleted = ref(false)
diff --git a/apps/frontend/src/components/project-review/project-info/edit/license.vue b/apps/frontend/src/components/project-review/project-info/edit/license.vue
index f5a8f8531f1..ff87862e59c 100644
--- a/apps/frontend/src/components/project-review/project-info/edit/license.vue
+++ b/apps/frontend/src/components/project-review/project-info/edit/license.vue
@@ -1,7 +1,7 @@
 <template>
 	<EditModal
 		ref="modal"
-		:section="formatMessage(reviewMessages.license)"
+		section="License"
 		:saving="saving"
 		:can-save="canSave"
 		@cancel="reset"
@@ -9,16 +9,14 @@
 	>
 		<div class="flex min-w-0 flex-col gap-6">
 			<div class="flex min-w-0 flex-col gap-2">
-				<label class="font-semibold text-contrast">
-					{{ formatMessage(messages.select) }}
-				</label>
+				<label class="font-semibold text-contrast"> Select a license </label>
 				<Combobox
 					v-model="selectedLicense"
 					:options="licenseOptions"
 					:search-options="allLicenseOptions"
 					:display-value="licenseDisplayName(currentLicense)"
-					:placeholder="formatMessage(messages.selectPlaceholder)"
-					:search-placeholder="formatMessage(messages.selectPlaceholder)"
+					placeholder="Select license..."
+					search-placeholder="Select license..."
 					:searchable="true"
 					sync-with-selection
 					select-search-text-on-focus
@@ -27,29 +25,24 @@
 					class="w-full"
 				/>
 				<p class="m-0 text-sm text-secondary">
-					{{ formatMessage(messages.selectDescription) }}
+					How users are and aren't allowed to use your project.
 				</p>
 			</div>
 
 			<div v-if="currentLicense.requiresOnlyOrLater" class="flex flex-col gap-2">
-				<label class="font-semibold text-contrast">
-					{{ formatMessage(messages.later) }}
-				</label>
-				<Checkbox
-					v-model="allowOrLater"
-					:disabled="saving"
-					:description="formatMessage(messages.allowLater)"
-				>
-					{{ formatMessage(messages.allowLater) }}
+				<label class="font-semibold text-contrast"> Later editions </label>
+				<Checkbox v-model="allowOrLater" :disabled="saving" description="Allow later editions">
+					Allow later editions
 				</Checkbox>
 				<p class="m-0 text-sm text-secondary">
-					{{ formatMessage(messages.laterDescription) }}
+					The license you selected has an "or later" clause. If you check this box, users may use
+					your project under later editions of the license.
 				</p>
 			</div>
 
 			<div v-if="currentLicense.friendly" class="flex min-w-0 flex-col gap-2">
 				<label for="project-review-license-url" class="font-semibold text-contrast">
-					{{ formatMessage(licenseUrlMessages.url) }}
+					License URL
 				</label>
 				<Input
 					id="project-review-license-url"
@@ -57,44 +50,34 @@
 					type="url"
 					:maxlength="2048"
 					:placeholder="
-						formatMessage(
-							currentLicense.friendly === 'Custom'
-								? licenseUrlMessages.url
-								: licenseUrlMessages.optionalUrl,
-						)
+						currentLicense.friendly === 'Custom' ? 'License URL' : 'License URL (optional)'
 					"
 					:disabled="saving || licenseId === 'LicenseRef-Unknown'"
 					wrapper-class="w-full"
 				/>
 				<p class="m-0 text-sm text-secondary">
 					{{
-						formatMessage(
-							currentLicense.friendly === 'Custom'
-								? licenseUrlMessages.customUrlDescription
-								: licenseUrlMessages.urlDescription,
-						)
+						currentLicense.friendly === 'Custom'
+							? 'The web location of the full license text. You have to provide a link since this is a custom license.'
+							: "The web location of the full license text. If you don't provide a link, the license text will be displayed instead."
 					}}
 				</p>
 			</div>
 
 			<div v-if="currentLicense.friendly === 'Custom'" class="flex min-w-0 flex-col gap-2">
 				<label for="project-review-license-name" class="font-semibold text-contrast">
-					{{ formatMessage(hasSpdxLicense ? messages.spdx : messages.name) }}
+					{{ hasSpdxLicense ? 'SPDX identifier' : 'License name' }}
 				</label>
 				<Input
 					id="project-review-license-name"
 					v-model="currentLicense.short"
 					:maxlength="128"
-					:placeholder="formatMessage(hasSpdxLicense ? messages.spdx : messages.name)"
+					:placeholder="hasSpdxLicense ? 'SPDX identifier' : 'License name'"
 					:disabled="saving"
 					wrapper-class="w-full"
 				/>
-				<Checkbox
-					v-model="hasSpdxLicense"
-					:disabled="saving"
-					:description="formatMessage(messages.hasSpdx)"
-				>
-					{{ formatMessage(messages.hasSpdx) }}
+				<Checkbox v-model="hasSpdxLicense" :disabled="saving" description="Use SPDX identifier">
+					Use SPDX identifier
 				</Checkbox>
 			</div>
 
@@ -106,23 +89,13 @@
 </template>
 
 <script setup lang="ts">
-import {
-	Checkbox,
-	Combobox,
-	type ComboboxOption,
-	defineMessages,
-	injectModrinthClient,
-	Input,
-	useVIntl,
-} from '@modrinth/ui'
+import { Checkbox, Combobox, type ComboboxOption, injectModrinthClient, Input } from '@modrinth/ui'
 import { defaultLicenseIds } from '@modrinth/utils'
 import { useQuery } from '@tanstack/vue-query'
 import { computed, reactive, ref, useTemplateRef } from 'vue'
 
 import { normalizeProjectUrl } from '~/helpers/project-url'
-import { licenseUrlMessages } from '~/utils/license-messages'
 
-import { projectReviewMessages as reviewMessages } from '../../messages'
 import EditModal from './edit-modal.vue'
 import { useProjectInfoEdit } from './use-project-edit'
 
@@ -132,61 +105,6 @@ interface LicenseChoice {
 	requiresOnlyOrLater?: boolean
 }
 
-const messages = defineMessages({
-	custom: { id: 'project.settings.license.custom', defaultMessage: 'Custom' },
-	allRights: {
-		id: 'project.settings.license.all-rights',
-		defaultMessage: 'All Rights Reserved/No License',
-	},
-	select: {
-		id: 'project.settings.license.select',
-		defaultMessage: 'Select a license',
-	},
-	selectDescription: {
-		id: 'project.settings.license.select-description',
-		defaultMessage: "How users are and aren't allowed to use your project.",
-	},
-	selectPlaceholder: {
-		id: 'project.settings.license.select-placeholder',
-		defaultMessage: 'Select license...',
-	},
-	later: {
-		id: 'project.settings.license.later',
-		defaultMessage: 'Later editions',
-	},
-	laterDescription: {
-		id: 'project.settings.license.later-description',
-		defaultMessage:
-			'The license you selected has an "or later" clause. If you check this box, users may use your project under later editions of the license.',
-	},
-	allowLater: {
-		id: 'project.settings.license.allow-later',
-		defaultMessage: 'Allow later editions',
-	},
-	spdx: {
-		id: 'project.settings.license.spdx',
-		defaultMessage: 'SPDX identifier',
-	},
-	name: { id: 'project.settings.license.name', defaultMessage: 'License name' },
-	hasSpdx: {
-		id: 'project.settings.license.has-spdx',
-		defaultMessage: 'Use SPDX identifier',
-	},
-	missingName: {
-		id: 'project.settings.license.missing-name',
-		defaultMessage: 'Enter a name or SPDX identifier for your custom license.',
-	},
-	missingUrl: {
-		id: 'project.settings.license.missing-url',
-		defaultMessage: 'Enter a URL to the full text of your custom license.',
-	},
-	invalidUrl: {
-		id: 'project.settings.license.invalid-url',
-		defaultMessage: 'Enter a valid HTTP or HTTPS license URL.',
-	},
-})
-
-const { formatMessage } = useVIntl()
 const { project, saving, beginEditing, saveProject } = useProjectInfoEdit()
 const modal = useTemplateRef<InstanceType<typeof EditModal>>('modal')
 const currentLicense = reactive<LicenseChoice>({ friendly: '', short: '' })
@@ -195,8 +113,8 @@ const allowOrLater = ref(false)
 const hasSpdxLicense = ref(true)
 
 function licenseDisplayName(license: LicenseChoice) {
-	if (license.friendly === 'Custom') return formatMessage(messages.custom)
-	if (license.short === 'All-Rights-Reserved') return formatMessage(messages.allRights)
+	if (license.friendly === 'Custom') return 'Custom'
+	if (license.short === 'All-Rights-Reserved') return 'All Rights Reserved/No License'
 	return license.friendly
 }
 
@@ -316,12 +234,12 @@ const urlValid = computed(() => {
 })
 const validationMessage = computed(() => {
 	if (currentLicense.friendly === 'Custom' && !currentLicense.short.trim()) {
-		return formatMessage(messages.missingName)
+		return 'Enter a name or SPDX identifier for your custom license.'
 	}
 	if (currentLicense.friendly === 'Custom' && !normalizedLicenseUrl.value) {
-		return formatMessage(messages.missingUrl)
+		return 'Enter a URL to the full text of your custom license.'
 	}
-	if (!urlValid.value) return formatMessage(messages.invalidUrl)
+	if (!urlValid.value) return 'Enter a valid HTTP or HTTPS license URL.'
 	return ''
 })
 const hasChanges = computed(
diff --git a/apps/frontend/src/components/project-review/project-info/edit/links.vue b/apps/frontend/src/components/project-review/project-info/edit/links.vue
index 529e2b45cce..b9f056c8ed2 100644
--- a/apps/frontend/src/components/project-review/project-info/edit/links.vue
+++ b/apps/frontend/src/components/project-review/project-info/edit/links.vue
@@ -1,7 +1,7 @@
 <template>
 	<EditModal
 		ref="modal"
-		:section="formatMessage(reviewMessages.links)"
+		section="Links"
 		:saving="saving"
 		:can-save="canSave"
 		width="52rem"
@@ -17,14 +17,14 @@
 					<TeleportOverflowMenu
 						v-if="section.id === 'donations' && section.rows.length > 0"
 						:options="donationPlatformOptions"
-						:label="formatMessage(messages.addLink)"
+						label="Add link"
 						:disabled="saving || donationPlatformOptions.length === 0"
 						:icon-only="false"
 						type="outlined"
 						placement="bottom-end"
 					>
 						<PlusIcon aria-hidden="true" />
-						{{ formatMessage(messages.addLink) }}
+						Add link
 					</TeleportOverflowMenu>
 				</div>
 				<Table
@@ -37,11 +37,14 @@
 						<span class="ml-3.5">{{ column.label }}</span>
 					</template>
 					<template #empty-state>
-						<EmptyState :description="formatMessage(messages.donationsDescription)" class="my-4">
+						<EmptyState
+							description="Add donation links for users to support you directly."
+							class="my-4"
+						>
 							<template #actions>
 								<TeleportOverflowMenu
 									:options="donationPlatformOptions"
-									:label="formatMessage(messages.addLink)"
+									label="Add link"
 									:disabled="saving || donationPlatformOptions.length === 0"
 									:icon-only="false"
 									type="outlined"
@@ -49,7 +52,7 @@
 									class="-mt-4"
 								>
 									<PlusIcon aria-hidden="true" />
-									{{ formatMessage(messages.addLink) }}
+									Add link
 								</TeleportOverflowMenu>
 							</template>
 						</EmptyState>
@@ -66,13 +69,11 @@
 								:model-value="row.value"
 								:type="row.donation?.mode === 'username' ? 'text' : 'url'"
 								:placeholder="
-									row.donation
-										? donationPlaceholder(row.donation)
-										: formatMessage(messages.urlPlaceholder)
+									row.donation ? donationPlaceholder(row.donation) : 'Enter a valid URL'
 								"
 								:maxlength="2048"
 								:disabled="saving"
-								:aria-describedby="row.inputId + '-help'"
+								:aria-describedby="`${row.inputId}-help`"
 								autocapitalize="none"
 								autocomplete="off"
 								:spellcheck="false"
@@ -90,16 +91,10 @@
 								@update:value="changeDonationMode(row.donation, $event)"
 							/>
 							<IconButton
-								v-tooltip="
-									visitUrl(row.url)
-										? formatMessage(messages.visitLink, {
-												url: visitUrl(row.url),
-											})
-										: null
-								"
+								v-tooltip="visitUrl(row.url) ? `Visit ${visitUrl(row.url)}` : null"
 								type="base"
 								class="shrink-0"
-								:label="formatMessage(messages.visitLink, { url: visitUrl(row.url) })"
+								:label="`Visit ${visitUrl(row.url)}`"
 								:disabled="!visitUrl(row.url)"
 								@mousedown.stop
 								@click.stop="visitLink(row.url)"
@@ -108,22 +103,22 @@
 							</IconButton>
 							<IconButton
 								v-if="row.donation"
-								v-tooltip="formatMessage(messages.removeDonation)"
+								v-tooltip="'Remove donation link'"
 								type="base"
 								class="shrink-0"
-								:label="formatMessage(messages.removeDonation)"
+								label="Remove donation link"
 								:disabled="saving"
 								@click.stop="removeDonation(row.donation)"
 							>
 								<XIcon />
 							</IconButton>
 						</div>
-						<span :id="row.inputId + '-help'" class="sr-only">{{ row.description }}</span>
+						<span :id="`${row.inputId}-help`" class="sr-only">{{ row.description }}</span>
 					</template>
 				</Table>
 			</section>
 			<p v-if="!urlsValid" class="m-0 text-sm text-red" role="alert">
-				{{ formatMessage(messages.invalidUrl) }}
+				Enter valid HTTP or HTTPS URLs before saving.
 			</p>
 		</div>
 	</EditModal>
@@ -133,7 +128,6 @@
 import type { Labrinth } from '@modrinth/api-client'
 import { ExternalIcon, PlusIcon, XIcon } from '@modrinth/assets'
 import {
-	defineMessages,
 	EmptyState,
 	IconButton,
 	Input,
@@ -142,7 +136,6 @@ import {
 	Tabs,
 	type TabsValue,
 	TeleportOverflowMenu,
-	useVIntl,
 } from '@modrinth/ui'
 import { computed, nextTick, reactive, ref, useTemplateRef } from 'vue'
 
@@ -155,7 +148,6 @@ import {
 } from '~/helpers/donation-links'
 import { normalizeProjectUrl } from '~/helpers/project-url'
 
-import { projectReviewMessages as reviewMessages } from '../../messages'
 import EditModal from './edit-modal.vue'
 import { useProjectInfoEdit } from './use-project-edit'
 
@@ -177,101 +169,6 @@ type LinkTableRow = {
 	donation?: DonationRow
 }
 
-const messages = defineMessages({
-	issues: {
-		id: 'project.settings.links.issues',
-		defaultMessage: 'Issue tracker',
-	},
-	issuesDescription: {
-		id: 'project.settings.links.issues-description',
-		defaultMessage: 'A place for users to report bugs, issues, and concerns about your project.',
-	},
-	source: {
-		id: 'project.settings.links.source',
-		defaultMessage: 'Source code',
-	},
-	sourceDescription: {
-		id: 'project.settings.links.source-description',
-		defaultMessage: 'A page/repository containing the source code for your project',
-	},
-	wiki: { id: 'project.settings.links.wiki', defaultMessage: 'Wiki page' },
-	wikiDescription: {
-		id: 'project.settings.links.wiki-description',
-		defaultMessage: 'A page containing information, documentation, and help for the project.',
-	},
-	discord: {
-		id: 'project.settings.links.discord',
-		defaultMessage: 'Discord invite',
-	},
-	discordDescription: {
-		id: 'project.settings.links.discord-description',
-		defaultMessage: 'An invitation link to your Discord server.',
-	},
-	site: { id: 'project.settings.links.site', defaultMessage: 'Website' },
-	siteDescription: {
-		id: 'project.settings.links.site-description',
-		defaultMessage: "Your server's official website.",
-	},
-	store: { id: 'project.settings.links.store', defaultMessage: 'Store' },
-	storeDescription: {
-		id: 'project.settings.links.store-description',
-		defaultMessage: "A link to your server's store or shop.",
-	},
-	linkType: {
-		id: 'project.settings.links.link-type',
-		defaultMessage: 'Link type',
-	},
-	donationPlatform: {
-		id: 'project.settings.links.donation-platform',
-		defaultMessage: 'Platform',
-	},
-	donationLink: {
-		id: 'project.settings.links.donation-link',
-		defaultMessage: 'Link',
-	},
-	donations: {
-		id: 'project.settings.links.donations',
-		defaultMessage: 'Donation links',
-	},
-	addLink: {
-		id: 'project.settings.links.add-link',
-		defaultMessage: 'Add link',
-	},
-	removeDonation: {
-		id: 'project.settings.links.remove-donation-link',
-		defaultMessage: 'Remove donation link',
-	},
-	donationsDescription: {
-		id: 'project.settings.links.donations-description',
-		defaultMessage: 'Add donation links for users to support you directly.',
-	},
-	urlPlaceholder: {
-		id: 'project.settings.links.url-placeholder',
-		defaultMessage: 'Enter a valid URL',
-	},
-	donationUsernamePlaceholder: {
-		id: 'project.settings.links.donation-username-placeholder',
-		defaultMessage: 'Enter your {platform} username',
-	},
-	donationUrl: {
-		id: 'project.settings.links.donation-url',
-		defaultMessage: 'URL',
-	},
-	donationUsername: {
-		id: 'project.settings.links.donation-username',
-		defaultMessage: 'Username',
-	},
-	visitLink: {
-		id: 'project.settings.links.visit-link',
-		defaultMessage: 'Visit {url}',
-	},
-	invalidUrl: {
-		id: 'project.settings.links.invalid-url',
-		defaultMessage: 'Enter valid HTTP or HTTPS URLs before saving.',
-	},
-})
-
-const { formatMessage } = useVIntl()
 const tags = useGeneratedState()
 const { project, saving, beginEditing, saveProject } = useProjectInfoEdit()
 const modal = useTemplateRef<InstanceType<typeof EditModal>>('modal')
@@ -293,19 +190,31 @@ const visibleFields = computed<EditableLinkField[]>(() =>
 		: ['issues', 'source', 'wiki', 'discord'],
 )
 const fieldMessages = computed(() => ({
-	issues: { title: messages.issues, description: messages.issuesDescription },
-	source: { title: messages.source, description: messages.sourceDescription },
-	wiki: { title: messages.wiki, description: messages.wikiDescription },
+	issues: {
+		title: 'Issue tracker',
+		description: 'A place for users to report bugs, issues, and concerns about your project.',
+	},
+	source: {
+		title: 'Source code',
+		description: 'A page/repository containing the source code for your project',
+	},
+	wiki: {
+		title: 'Wiki page',
+		description: 'A page containing information, documentation, and help for the project.',
+	},
 	discord: {
-		title: messages.discord,
-		description: messages.discordDescription,
+		title: 'Discord invite',
+		description: 'An invitation link to your Discord server.',
+	},
+	site: { title: 'Website', description: "Your server's official website." },
+	store: {
+		title: 'Store',
+		description: "A link to your server's store or shop.",
 	},
-	site: { title: messages.site, description: messages.siteDescription },
-	store: { title: messages.store, description: messages.storeDescription },
 }))
 const donationModeTabs = computed(() => [
-	{ value: 'username', label: formatMessage(messages.donationUsername) },
-	{ value: 'url', label: formatMessage(messages.donationUrl) },
+	{ value: 'username', label: 'Username' },
+	{ value: 'url', label: 'URL' },
 ])
 const donationPlatformOptions = computed(() =>
 	tags.value.donationPlatforms
@@ -319,22 +228,22 @@ const donationPlatformOptions = computed(() =>
 const linkColumns = computed<TableColumn<'name' | 'url'>[]>(() => [
 	{
 		key: 'name',
-		label: formatMessage(messages.linkType),
+		label: 'Link type',
 		width: '12rem',
 		cellClass: 'pr-3 py-3',
 	},
 	{
 		key: 'url',
-		label: formatMessage(messages.donationUrl),
+		label: 'URL',
 		cellClass: 'py-3 pl-1',
 	},
 ])
 const linkRows = computed<LinkTableRow[]>(() => [
 	...visibleFields.value.map((field) => ({
 		id: field,
-		inputId: 'project-review-link-' + field,
-		name: formatMessage(fieldMessages.value[field].title),
-		description: formatMessage(fieldMessages.value[field].description),
+		inputId: `project-review-link-${field}`,
+		name: fieldMessages.value[field].title,
+		description: fieldMessages.value[field].description,
 		value: currentLinks[field],
 		url: currentLinks[field],
 		field,
@@ -342,10 +251,10 @@ const linkRows = computed<LinkTableRow[]>(() => [
 	...(isServerProject.value
 		? []
 		: donationLinks.value.map((donation) => ({
-				id: 'donation-' + donation.key,
-				inputId: 'project-review-donation-' + donation.key,
+				id: `donation-${donation.key}`,
+				inputId: `project-review-donation-${donation.key}`,
 				name: donationPlatformTitle(donation),
-				description: formatMessage(messages.donationsDescription),
+				description: 'Add donation links for users to support you directly.',
 				value: donation.input,
 				url: donation.url,
 				donation,
@@ -354,7 +263,7 @@ const linkRows = computed<LinkTableRow[]>(() => [
 const linkSections = computed(() => [
 	{
 		id: 'links',
-		title: formatMessage(reviewMessages.links),
+		title: 'Links',
 		columns: linkColumns.value,
 		rows: linkRows.value.filter((row) => row.field),
 	},
@@ -363,12 +272,10 @@ const linkSections = computed(() => [
 		: [
 				{
 					id: 'donations',
-					title: formatMessage(messages.donations),
+					title: 'Donation links',
 					columns: linkColumns.value.map((column) => ({
 						...column,
-						label: formatMessage(
-							column.key === 'name' ? messages.donationPlatform : messages.donationLink,
-						),
+						label: column.key === 'name' ? 'Platform' : 'Link',
 					})),
 					rows: linkRows.value.filter((row) => row.donation),
 				},
@@ -425,10 +332,8 @@ function donationPlatformTitle(row: DonationRow) {
 }
 
 function donationPlaceholder(row: DonationRow) {
-	if (row.mode !== 'username') return formatMessage(messages.urlPlaceholder)
-	return formatMessage(messages.donationUsernamePlaceholder, {
-		platform: donationPlatformTitle(row),
-	})
+	if (row.mode !== 'username') return 'Enter a valid URL'
+	return `Enter your ${donationPlatformTitle(row)} username`
 }
 
 function visitUrl(value: string) {
diff --git a/apps/frontend/src/components/project-review/project-info/edit/server-details.vue b/apps/frontend/src/components/project-review/project-info/edit/server-details.vue
index e2ba2c8ae68..9b7d7d90a19 100644
--- a/apps/frontend/src/components/project-review/project-info/edit/server-details.vue
+++ b/apps/frontend/src/components/project-review/project-info/edit/server-details.vue
@@ -1,7 +1,7 @@
 <template>
 	<EditModal
 		ref="modal"
-		:section="formatMessage(reviewMessages.serverDetails)"
+		section="Server details"
 		:saving="saving"
 		:can-save="canSave"
 		width="52rem"
@@ -11,7 +11,7 @@
 		<fieldset :disabled="saving" class="m-0 flex min-w-0 flex-col gap-6 border-0 p-0">
 			<div class="flex flex-col gap-2">
 				<label for="project-review-server-region" class="font-semibold text-contrast">
-					{{ formatMessage(reviewMessages.serverRegion) }}
+					Region
 				</label>
 				<Combobox
 					id="project-review-server-region"
@@ -23,7 +23,7 @@
 			</div>
 			<div class="flex flex-col gap-2">
 				<label for="project-review-server-languages" class="font-semibold text-contrast">
-					{{ formatMessage(reviewMessages.serverLanguages) }}
+					Languages
 				</label>
 				<MultiSelect
 					id="project-review-server-languages"
@@ -37,7 +37,7 @@
 			</div>
 			<div class="flex flex-col gap-2">
 				<label for="project-review-java-address" class="font-semibold text-contrast">
-					{{ formatMessage(messages.javaAddress) }}
+					Java address
 				</label>
 				<Input
 					id="project-review-java-address"
@@ -48,8 +48,8 @@
 				/>
 				<div v-if="javaAddress.trim()" class="flex items-start gap-1.5 text-sm" role="status">
 					<IconButton
-						v-tooltip="formatMessage(messages.refreshPing)"
-						:label="formatMessage(messages.refreshPing)"
+						v-tooltip="'Refresh ping'"
+						label="Refresh ping"
 						:disabled="javaPingLoading || saving"
 						type="quiet"
 						color="orange"
@@ -60,28 +60,24 @@
 						<SpinnerIcon v-if="javaPingLoading" class="animate-spin" />
 						<RefreshCwIcon v-else />
 					</IconButton>
-					<span v-if="javaPingOnline === true" class="mt-0.5 text-green">
-						{{ formatMessage(messages.serverOnline) }}
-					</span>
+					<span v-if="javaPingOnline === true" class="mt-0.5 text-green"> Server is online! </span>
 					<div v-else-if="javaPingOnline === false" class="mt-0.5 text-orange">
-						<IntlFormatted :message-id="messages.pingFailed">
-							<template #support-link="{ children }">
-								<a
-									href="https://support.modrinth.com"
-									target="_blank"
-									rel="noopener noreferrer"
-									class="inline underline"
-								>
-									<component :is="() => normalizeChildren(children)" />
-								</a>
-							</template>
-						</IntlFormatted>
+						We couldn't ping this server. It may be blocked by your host so try refreshing a few
+						times. If it still doesn't respond please
+						<a
+							href="https://support.modrinth.com"
+							target="_blank"
+							rel="noopener noreferrer"
+							class="inline underline"
+						>
+							contact support </a
+						>.
 					</div>
 				</div>
 			</div>
 			<div class="flex flex-col gap-2">
 				<label for="project-review-bedrock-address" class="font-semibold text-contrast">
-					{{ formatMessage(messages.bedrockAddress) }}
+					Bedrock address
 				</label>
 				<Input
 					id="project-review-bedrock-address"
@@ -105,52 +101,16 @@
 <script setup lang="ts">
 import type { Labrinth } from '@modrinth/api-client'
 import { RefreshCwIcon, SpinnerIcon } from '@modrinth/assets'
-import {
-	Combobox,
-	defineMessages,
-	IconButton,
-	Input,
-	IntlFormatted,
-	MultiSelect,
-	normalizeChildren,
-	SERVER_LANGUAGES,
-	SERVER_REGIONS,
-	useVIntl,
-} from '@modrinth/ui'
+import { Combobox, IconButton, Input, MultiSelect } from '@modrinth/ui'
 import { computed, ref, useTemplateRef } from 'vue'
 
 import CompatibilityCard from '~/components/ui/project-settings/CompatibilityCard.vue'
 import { useJavaServerPing } from '~/providers/manage-server-compatibility-modal'
 
-import { projectReviewMessages as reviewMessages } from '../../messages'
+import { SERVER_LANGUAGES, SERVER_REGIONS } from '../server-labels'
 import EditModal from './edit-modal.vue'
 import { useProjectInfoEdit } from './use-project-edit'
 
-const messages = defineMessages({
-	javaAddress: {
-		id: 'project.settings.server.java-address-label',
-		defaultMessage: 'Java address',
-	},
-	bedrockAddress: {
-		id: 'project.settings.server.bedrock-address-label',
-		defaultMessage: 'Bedrock address',
-	},
-	refreshPing: {
-		id: 'project.settings.server.refresh-ping-tooltip',
-		defaultMessage: 'Refresh ping',
-	},
-	serverOnline: {
-		id: 'project.settings.server.server-online',
-		defaultMessage: 'Server is online!',
-	},
-	pingFailed: {
-		id: 'project.settings.server.ping-failed-message',
-		defaultMessage:
-			"We couldn't ping this server. It may be blocked by your host so try refreshing a few times. If it still doesn't respond please <support-link>contact support</support-link>.",
-	},
-})
-
-const { formatMessage, locale } = useVIntl()
 const { project, saving: projectSaving, beginEditing, saveProject } = useProjectInfoEdit()
 const modal = useTemplateRef<InstanceType<typeof EditModal>>('modal')
 const compatibilityBusy = ref(false)
@@ -174,13 +134,13 @@ async function saveCompatibility(patch: Labrinth.Projects.v3.EditProjectRequest)
 
 const regionOptions = computed(() =>
 	Object.entries(SERVER_REGIONS)
-		.map(([value, message]) => ({ value, label: formatMessage(message) }))
-		.sort((a, b) => a.label.localeCompare(b.label, locale.value)),
+		.map(([value, message]) => ({ value, label: message }))
+		.sort((a, b) => a.label.localeCompare(b.label, 'en-US')),
 )
 const languageOptions = computed(() =>
 	Object.entries(SERVER_LANGUAGES)
-		.map(([value, message]) => ({ value, label: formatMessage(message) }))
-		.sort((a, b) => a.label.localeCompare(b.label, locale.value)),
+		.map(([value, message]) => ({ value, label: message }))
+		.sort((a, b) => a.label.localeCompare(b.label, 'en-US')),
 )
 
 function reset() {
diff --git a/apps/frontend/src/components/project-review/project-info/edit/tags.vue b/apps/frontend/src/components/project-review/project-info/edit/tags.vue
index cbf004cf35b..6cc44058898 100644
--- a/apps/frontend/src/components/project-review/project-info/edit/tags.vue
+++ b/apps/frontend/src/components/project-review/project-info/edit/tags.vue
@@ -1,24 +1,13 @@
 <!-- eventually extract content from project settings to be a component so it can be shared here. -->
 <script setup lang="ts">
-import {
-	Checkbox,
-	defineMessages,
-	EmptyState,
-	formatCategory,
-	formatCategoryHeader,
-	formatProjectTypeSentence,
-	FormattedTag,
-	type MessageDescriptor,
-	sortProjectTypes,
-	TagItem,
-	useVIntl,
-} from '@modrinth/ui'
+import { Checkbox, EmptyState, sortProjectTypes, TagItem } from '@modrinth/ui'
 import { capitalizeString, sortedCategories } from '@modrinth/utils'
 import { computed, ref, useTemplateRef } from 'vue'
 
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
-import { projectReviewMessages as reviewMessages } from '../../messages'
+import { categoryHeader, categoryName } from '../tag-labels'
+import { projectTypeLabels } from '../type-labels'
 import EditModal from './edit-modal.vue'
 import { useProjectInfoEdit } from './use-project-edit'
 
@@ -42,79 +31,6 @@ const SHARED_CATEGORY_PROJECT_TYPES: Record<string, string> = {
 	datapack: 'mod',
 }
 
-const messages = defineMessages({
-	uploadVersionFirstHeading: {
-		id: 'project.settings.tags.upload-version-first.heading',
-		defaultMessage: 'Upload versions before adding tags',
-	},
-	uploadVersionFirstDescription: {
-		id: 'project.settings.tags.upload-version-first.description',
-		defaultMessage: 'Upload a version before selecting project tags.',
-	},
-	categoriesDescription: {
-		id: 'project.settings.tags.categories-description',
-		defaultMessage: 'Select all categories that reflect the themes or function of your {type}.',
-	},
-	featuresDescription: {
-		id: 'project.settings.tags.features-description',
-		defaultMessage: 'Select all of the features that your {type} makes use of.',
-	},
-	resolutionsDescription: {
-		id: 'project.settings.tags.resolutions-description',
-		defaultMessage: 'Select the resolution(s) of textures in your {type}.',
-	},
-	performanceImpactDescription: {
-		id: 'project.settings.tags.performance-impact-description',
-		defaultMessage:
-			'Select the realistic performance impact of your {type}. Select multiple if the {type} is configurable to different levels of performance impact.',
-	},
-	featuredTags: {
-		id: 'project.settings.tags.featured-tags',
-		defaultMessage: 'Featured tags',
-	},
-	featuredTagsDescription: {
-		id: 'project.settings.tags.featured-tags-select-description',
-		defaultMessage:
-			'Select your most relevant tags. These are displayed before the rest of your tags.',
-	},
-	selectAtLeastOneCategory: {
-		id: 'project.settings.tags.select-at-least-one-category',
-		defaultMessage: 'Select at least one category in order to feature a category.',
-	},
-	featuredTagsRequired: {
-		id: 'project.settings.tags.featured-tags-required',
-		defaultMessage: 'You must have at least one featured tag.',
-	},
-})
-
-const groupTitleMessages: Record<string, MessageDescriptor> = defineMessages({
-	categories: {
-		id: 'project.settings.tags.group-title.categories',
-		defaultMessage: '{showType, select, yes {{types} categories} other {Categories}}',
-	},
-	features: {
-		id: 'project.settings.tags.group-title.features',
-		defaultMessage: '{showType, select, yes {{types} features} other {Features}}',
-	},
-	resolutions: {
-		id: 'project.settings.tags.group-title.resolutions',
-		defaultMessage: '{showType, select, yes {{types} resolutions} other {Resolutions}}',
-	},
-	'performance impact': {
-		id: 'project.settings.tags.group-title.performance-impact',
-		defaultMessage:
-			'{showType, select, yes {{types} performance impact} other {Performance impact}}',
-	},
-})
-
-const groupDescriptionMessages: Record<string, MessageDescriptor> = {
-	categories: messages.categoriesDescription,
-	features: messages.featuresDescription,
-	resolutions: messages.resolutionsDescription,
-	'performance impact': messages.performanceImpactDescription,
-}
-
-const { formatMessage, locale } = useVIntl()
 const tags = useGeneratedState()
 const { projectV2 } = injectProjectReviewPageContext()
 const { project, saving, beginEditing, saveProject } = useProjectInfoEdit()
@@ -128,9 +44,9 @@ const projectTypes = computed(() => {
 	if (isServerProject.value) return ['minecraft_java_server']
 	return sortProjectTypes(new Set(project.value?.project_types ?? ['mod']))
 })
-const formatCategoryName = (categoryName: string) => formatCategory(formatMessage, categoryName)
+const formatCategoryName = (category: string) => categoryName(category)
 const allCategories = computed(
-	() => sortedCategories(tags.value, formatCategoryName, locale.value) as Category[],
+	() => sortedCategories(tags.value, formatCategoryName, 'en-US') as Category[],
 )
 const projectTypesByCategoryList = computed(() => {
 	const lists = new Map<string, string[]>()
@@ -141,34 +57,37 @@ const projectTypesByCategoryList = computed(() => {
 	return lists
 })
 const projectTypeListFormatter = computed(
-	() => new Intl.ListFormat(locale.value, { style: 'long', type: 'conjunction' }),
+	() => new Intl.ListFormat('en-US', { style: 'long', type: 'conjunction' }),
 )
 
 function formatProjectTypeName(type: string) {
-	return formatProjectTypeSentence(
-		formatMessage,
-		type === 'minecraft_java_server' ? 'server' : type,
-	)
+	return (projectTypeLabels[type] ?? 'Project').toLowerCase()
 }
 
 function formatGroupTitle(header: string, types: string[]) {
-	const message = groupTitleMessages[header]
-	if (!message) return formatCategoryHeader(formatMessage, header)
-	const showType = projectTypes.value.length > 1
-	return formatMessage(message, {
-		showType: showType ? 'yes' : 'other',
-		types: showType
-			? capitalizeString(projectTypeListFormatter.value.format(types.map(formatProjectTypeName)))
-			: '',
-	})
+	const title = categoryHeader(header)
+	if (
+		projectTypes.value.length <= 1 ||
+		!['categories', 'features', 'resolutions', 'performance impact'].includes(header)
+	)
+		return title
+	return `${capitalizeString(projectTypeListFormatter.value.format(types.map(formatProjectTypeName)))} ${header}`
 }
 
 function formatGroupDescription(header: string, types: string[]) {
-	const message = groupDescriptionMessages[header]
-	if (!message) return undefined
-	return formatMessage(message, {
-		type: formatProjectTypeName(types.length > 1 ? 'project' : types[0]),
-	})
+	const type = formatProjectTypeName(types.length > 1 ? 'project' : types[0])
+	switch (header) {
+		case 'categories':
+			return `Select all categories that reflect the themes or function of your ${type}.`
+		case 'features':
+			return `Select all of the features that your ${type} makes use of.`
+		case 'resolutions':
+			return `Select the resolution(s) of textures in your ${type}.`
+		case 'performance impact':
+			return `Select the realistic performance impact of your ${type}. Select multiple if the ${type} is configurable to different levels of performance impact.`
+		default:
+			return undefined
+	}
 }
 
 function withPokemonFirst(categories: Category[]) {
@@ -275,7 +194,7 @@ defineExpose({ show })
 <template>
 	<EditModal
 		ref="modal"
-		:section="formatMessage(reviewMessages.tags)"
+		section="Tags"
 		:saving="saving"
 		:can-save="canSave"
 		width="60rem"
@@ -285,8 +204,8 @@ defineExpose({ show })
 		<EmptyState
 			v-if="!canSelectTags"
 			type="no-documents"
-			:heading="formatMessage(messages.uploadVersionFirstHeading)"
-			:description="formatMessage(messages.uploadVersionFirstDescription)"
+			heading="Upload versions before adding tags"
+			description="Upload a version before selecting project tags."
 		/>
 		<div v-else class="flex flex-col gap-4">
 			<div
@@ -310,7 +229,7 @@ defineExpose({ show })
 						@update:model-value="toggleTag(category.name)"
 					>
 						<span aria-hidden="true">
-							<FormattedTag :tag="category.name" enforce-type="category" />
+							{{ categoryName(category.name) }}
 						</span>
 					</Checkbox>
 				</div>
@@ -318,16 +237,14 @@ defineExpose({ show })
 
 			<div class="rounded-2xl border border-solid border-surface-4 bg-surface-3 p-4">
 				<div class="mb-1 flex items-center gap-2">
-					<h3 class="m-0 text-lg font-semibold text-contrast">
-						{{ formatMessage(messages.featuredTags) }}
-					</h3>
+					<h3 class="m-0 text-lg font-semibold text-contrast">Featured tags</h3>
 					<TagItem> {{ featuredTags.length }}/{{ MAX_FEATURED_TAGS }} </TagItem>
 				</div>
 				<p class="mb-3 mt-0 text-sm text-secondary">
-					{{ formatMessage(messages.featuredTagsDescription) }}
+					Select your most relevant tags. These are displayed before the rest of your tags.
 				</p>
 				<p v-if="selectedTags.length === 0" class="m-0 text-secondary">
-					{{ formatMessage(messages.selectAtLeastOneCategory) }}
+					Select at least one category in order to feature a category.
 				</p>
 				<div v-else class="grid grid-cols-2 gap-x-4 gap-y-2 sm:grid-cols-4">
 					<Checkbox
@@ -341,12 +258,12 @@ defineExpose({ show })
 						@update:model-value="toggleFeatured(name)"
 					>
 						<span aria-hidden="true">
-							<FormattedTag :tag="name" enforce-type="category" />
+							{{ categoryName(name) }}
 						</span>
 					</Checkbox>
 				</div>
 				<p v-if="featuredTags.length === 0" class="mb-0 mt-3 text-sm text-red" role="alert">
-					{{ formatMessage(messages.featuredTagsRequired) }}
+					You must have at least one featured tag.
 				</p>
 			</div>
 		</div>
diff --git a/apps/frontend/src/components/project-review/project-info/edit/use-project-edit.ts b/apps/frontend/src/components/project-review/project-info/edit/use-project-edit.ts
index 66ca5b18baf..ce6b1f0c7c9 100644
--- a/apps/frontend/src/components/project-review/project-info/edit/use-project-edit.ts
+++ b/apps/frontend/src/components/project-review/project-info/edit/use-project-edit.ts
@@ -1,10 +1,5 @@
 import type { Labrinth } from '@modrinth/api-client'
-import {
-	commonMessages,
-	injectModrinthClient,
-	injectNotificationManager,
-	useVIntl,
-} from '@modrinth/ui'
+import { injectModrinthClient, injectNotificationManager } from '@modrinth/ui'
 import { useMutation, useQueryClient } from '@tanstack/vue-query'
 import { watch } from 'vue'
 
@@ -17,7 +12,7 @@ export function useProjectInfoEdit() {
 	const client = injectModrinthClient()
 	const queryClient = useQueryClient()
 	const { addNotification } = injectNotificationManager()
-	const { formatMessage } = useVIntl()
+
 	let draftProjectId: string | undefined
 	let session = 0
 
@@ -54,7 +49,7 @@ export function useProjectInfoEdit() {
 		},
 		onError: (error) => {
 			addNotification({
-				title: formatMessage(commonMessages.errorNotificationTitle),
+				title: 'An error occurred',
 				text: error instanceof Error ? error.message : String(error),
 				type: 'error',
 			})
diff --git a/apps/frontend/src/components/project-review/project-info/edit/use-project-text-edit.ts b/apps/frontend/src/components/project-review/project-info/edit/use-project-text-edit.ts
index d548dbefafe..a06e6a8fd37 100644
--- a/apps/frontend/src/components/project-review/project-info/edit/use-project-text-edit.ts
+++ b/apps/frontend/src/components/project-review/project-info/edit/use-project-text-edit.ts
@@ -1,4 +1,3 @@
-import { defineMessages, useVIntl } from '@modrinth/ui'
 import { computed, nextTick, ref, watch } from 'vue'
 
 import { useProjectInfoEdit } from './use-project-edit'
@@ -12,19 +11,7 @@ const limits: Record<TextField, { min: number; max: number }> = {
 	description: { min: 0, max: 65536 },
 }
 
-const messages = defineMessages({
-	length: {
-		id: 'moderation.project-review.validation.length',
-		defaultMessage: 'Enter between {min} and {max} characters.',
-	},
-	slug: {
-		id: 'moderation.project-review.validation.slug',
-		defaultMessage: 'Use only letters, numbers, periods, underscores, and hyphens.',
-	},
-})
-
 export function useProjectTextEdit(field: TextField, focus: () => unknown) {
-	const { formatMessage } = useVIntl()
 	const { project, saving, beginEditing, saveProject } = useProjectInfoEdit()
 	const editing = ref(false)
 	const draft = ref('')
@@ -32,10 +19,10 @@ export function useProjectTextEdit(field: TextField, focus: () => unknown) {
 	const validationMessage = computed(() => {
 		const length = Array.from(value.value).length
 		if (length < limits[field].min || length > limits[field].max) {
-			return formatMessage(messages.length, limits[field])
+			return `Enter between ${limits[field].min} and ${limits[field].max} characters.`
 		}
 		if (field === 'slug' && !/^[a-zA-Z0-9._-]+$/.test(value.value)) {
-			return formatMessage(messages.slug)
+			return 'Use only letters, numbers, periods, underscores, and hyphens.'
 		}
 		return ''
 	})
diff --git a/apps/frontend/src/components/project-review/project-info/index.vue b/apps/frontend/src/components/project-review/project-info/index.vue
index 89f0b00bbde..6796b6bb398 100644
--- a/apps/frontend/src/components/project-review/project-info/index.vue
+++ b/apps/frontend/src/components/project-review/project-info/index.vue
@@ -1,13 +1,11 @@
 <template>
 	<div class="review-details -mt-1 min-w-0 pb-10 text-sm text-secondary">
-		<p v-if="isLoading" role="status" class="m-0">
-			{{ formatMessage(messages.loading) }}
-		</p>
+		<p v-if="isLoading" role="status" class="m-0">Loading...</p>
 		<div v-else-if="error" role="alert">
-			<p class="m-0">{{ formatMessage(messages.loadError) }}</p>
-			<Button @click="refresh">{{ formatMessage(messages.retry) }}</Button>
+			<p class="m-0">Could not load project data</p>
+			<Button @click="refresh">Retry</Button>
 		</div>
-		<p v-else-if="!project" class="m-0">{{ formatMessage(messages.empty) }}</p>
+		<p v-else-if="!project" class="m-0">No project selected</p>
 		<template v-else>
 			<Title />
 			<Slug />
@@ -25,11 +23,10 @@
 </template>
 
 <script setup lang="ts">
-import { Button, useVIntl } from '@modrinth/ui'
+import { Button } from '@modrinth/ui'
 
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
-import { projectReviewMessages as messages } from '../messages'
 import Members from './members/index.vue'
 import Compatibility from './project/compatibility.vue'
 import Details from './project/details.vue'
@@ -43,7 +40,6 @@ import Tags from './project/tags.vue'
 import Title from './project/title.vue'
 
 const { project, isLoading, error, refresh } = injectProjectReviewPageContext()
-const { formatMessage } = useVIntl()
 </script>
 
 <style scoped>
diff --git a/apps/frontend/src/components/project-review/project-info/members/index.vue b/apps/frontend/src/components/project-review/project-info/members/index.vue
index 870d97584a9..42b6d80f03c 100644
--- a/apps/frontend/src/components/project-review/project-info/members/index.vue
+++ b/apps/frontend/src/components/project-review/project-info/members/index.vue
@@ -1,10 +1,8 @@
 <template>
-	<Section :heading="formatMessage(messages.members)">
-		<p v-if="membersLoading || organizationLoading" role="status" class="m-0">
-			{{ formatMessage(messages.loading) }}
-		</p>
+	<Section heading="Members">
+		<p v-if="membersLoading || organizationLoading" role="status" class="m-0">Loading...</p>
 		<p v-else-if="membersError || organizationError" role="alert" class="m-0">
-			{{ formatMessage(messages.loadError) }}
+			Could not load project data
 		</p>
 		<ul v-else class="m-0 flex list-none flex-col gap-2 p-0">
 			<li v-if="organization" class="flex flex-col gap-2.5">
@@ -33,12 +31,10 @@
 </template>
 
 <script setup lang="ts">
-import { useVIntl } from '@modrinth/ui'
 import { computed } from 'vue'
 
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
-import { projectReviewMessages as messages } from '../../messages'
 import Section from '../section.vue'
 import MemberItem from './member-item.vue'
 import OrganizationItem from './organization-item.vue'
@@ -54,7 +50,7 @@ const {
 	organizationLoading,
 	organizationError,
 } = injectProjectReviewPageContext()
-const { formatMessage } = useVIntl()
+
 const organizationMemberIds = computed(
 	() => new Set(organizationMembers.value.map((member) => member.user.id)),
 )
diff --git a/apps/frontend/src/components/project-review/project-info/members/member-actions.vue b/apps/frontend/src/components/project-review/project-info/members/member-actions.vue
index 55f15983516..f9d1d328b65 100644
--- a/apps/frontend/src/components/project-review/project-info/members/member-actions.vue
+++ b/apps/frontend/src/components/project-review/project-info/members/member-actions.vue
@@ -1,7 +1,7 @@
 <template>
 	<TeleportOverflowMenu
 		v-bind="$attrs"
-		:label="formatMessage(commonMessages.moreOptionsButton)"
+		label="More options"
 		:options="menuOptions"
 		type="quiet"
 		size="sm"
@@ -11,15 +11,11 @@
 	</TeleportOverflowMenu>
 	<template v-if="activated">
 		<EditUserModal v-if="isAdmin" ref="editModal" :user="user" :user-id="user.id" />
-		<NewModal
-			v-if="isStaffViewing"
-			ref="detailsModal"
-			:header="formatMessage(messages.detailsTitle)"
-		>
+		<NewModal v-if="isStaffViewing" ref="detailsModal" header="User details">
 			<dl class="m-0 flex flex-col gap-3">
-				<div v-for="detail in userDetails" :key="detail.label.id">
+				<div v-for="detail in userDetails" :key="detail.label">
 					<dt class="font-semibold text-contrast">
-						{{ formatMessage(detail.label) }}
+						{{ detail.label }}
 					</dt>
 					<dd class="m-0 break-words">{{ detail.value }}</dd>
 				</div>
@@ -40,14 +36,11 @@ import {
 } from '@modrinth/assets'
 import {
 	type ButtonMenuOption,
-	commonMessages,
-	defineMessages,
 	injectModrinthClient,
 	NewModal,
 	provideUserProfile,
 	TeleportOverflowMenu,
 	type UserProfileContext,
-	useVIntl,
 } from '@modrinth/ui'
 import EditUserModal from '@modrinth/ui/src/layouts/shared/user-profile/components/edit-user-modal.vue'
 import { isStaff } from '@modrinth/utils'
@@ -57,29 +50,10 @@ import { computed, ref } from 'vue'
 
 defineOptions({ inheritAttrs: false })
 
-const menuMessages = defineMessages({
-	editUserButton: {
-		id: 'profile.button.edit-user',
-		defaultMessage: 'Edit user',
-	},
-	analyticsButton: {
-		id: 'profile.button.analytics',
-		defaultMessage: 'View user analytics',
-	},
-	infoButton: {
-		id: 'profile.button.info',
-		defaultMessage: 'View user details',
-	},
-	sharedInstancesButton: {
-		id: 'profile.button.shared-instances',
-		defaultMessage: 'View shared instances',
-	},
-})
-
 const props = defineProps<{ user: Labrinth.Users.v3.User }>()
 const auth = useAuthState()
 const client = injectModrinthClient()
-const { formatMessage } = useVIntl()
+
 const config = useRuntimeConfig()
 const { copy } = useClipboard()
 const activated = ref(false)
@@ -110,31 +84,11 @@ provideUserProfile({
 
 const editModal = ref<InstanceType<typeof EditUserModal>>()
 const detailsModal = ref<InstanceType<typeof NewModal>>()
-const messages = defineMessages({
-	detailsTitle: { id: 'profile.details.title', defaultMessage: 'User details' },
-	emailVerified: {
-		id: 'profile.details.label.email-verified',
-		defaultMessage: 'Email verified',
-	},
-	providers: {
-		id: 'profile.details.label.auth-providers',
-		defaultMessage: 'Auth providers',
-	},
-	payments: {
-		id: 'profile.details.label.payment-methods',
-		defaultMessage: 'Payment methods',
-	},
-	password: {
-		id: 'profile.details.label.has-password',
-		defaultMessage: 'Has password',
-	},
-	totp: { id: 'profile.details.label.has-totp', defaultMessage: 'Has TOTP' },
-})
 
 const menuOptions = computed<ButtonMenuOption[]>(() => [
 	{
 		id: 'copy-id',
-		label: formatMessage(commonMessages.copyIdButton),
+		label: 'Copy ID',
 		icon: ClipboardCopyIcon,
 		action: () => {
 			void copy(user.value.id)
@@ -142,7 +96,7 @@ const menuOptions = computed<ButtonMenuOption[]>(() => [
 	},
 	{
 		id: 'copy-permalink',
-		label: formatMessage(commonMessages.copyPermalinkButton),
+		label: 'Copy permanent link',
 		icon: ClipboardCopyIcon,
 		action: () => {
 			void copy(`${config.public.siteUrl}/user/${user.value.id}`)
@@ -151,7 +105,7 @@ const menuOptions = computed<ButtonMenuOption[]>(() => [
 	{ type: 'divider', shown: isStaffViewing.value },
 	{
 		id: 'open-info',
-		label: formatMessage(menuMessages.infoButton),
+		label: 'View user details',
 		icon: InfoIcon,
 		action: () => detailsModal.value?.show(),
 		tone: 'orange',
@@ -161,7 +115,7 @@ const menuOptions = computed<ButtonMenuOption[]>(() => [
 	{
 		id: 'open-shared-instances',
 		type: 'link',
-		label: formatMessage(menuMessages.sharedInstancesButton),
+		label: 'View shared instances',
 		icon: BoxesIcon,
 		href: `/admin/shared-instances/${encodeURIComponent(user.value.id)}`,
 		target: '_blank',
@@ -173,7 +127,7 @@ const menuOptions = computed<ButtonMenuOption[]>(() => [
 	{
 		id: 'open-analytics',
 		type: 'link',
-		label: formatMessage(menuMessages.analyticsButton),
+		label: 'View user analytics',
 		icon: ChartIcon,
 		href: `/dashboard/analytics?user=${encodeURIComponent(user.value.id)}`,
 		target: '_blank',
@@ -185,7 +139,7 @@ const menuOptions = computed<ButtonMenuOption[]>(() => [
 	{ type: 'divider', shown: isAdmin.value },
 	{
 		id: 'edit-user',
-		label: formatMessage(menuMessages.editUserButton),
+		label: 'Edit user',
 		icon: EditIcon,
 		action: () => editModal.value?.show(),
 		tone: 'default',
@@ -195,14 +149,13 @@ const menuOptions = computed<ButtonMenuOption[]>(() => [
 ])
 
 const userDetails = computed(() => {
-	const yesNo = (value: unknown) =>
-		formatMessage(value ? commonMessages.yesLabel : commonMessages.noLabel)
+	const yesNo = (value: unknown) => (value ? 'Yes' : 'No')
 	return [
 		...(isAdmin.value
 			? [
-					{ label: commonMessages.emailLabel, value: user.value.email ?? '—' },
+					{ label: 'Email', value: user.value.email ?? '—' },
 					{
-						label: messages.providers,
+						label: 'Auth providers',
 						value:
 							(user.value.auth_providers ?? [])
 								.map((provider) => {
@@ -219,7 +172,7 @@ const userDetails = computed(() => {
 								.join(', ') || '—',
 					},
 					{
-						label: messages.payments,
+						label: 'Payment methods',
 						value:
 							[user.value.payout_data?.paypal_address, user.value.payout_data?.venmo_handle]
 								.filter(Boolean)
@@ -227,9 +180,9 @@ const userDetails = computed(() => {
 					},
 				]
 			: []),
-		{ label: messages.emailVerified, value: yesNo(user.value.email_verified) },
-		{ label: messages.password, value: yesNo(user.value.has_password) },
-		{ label: messages.totp, value: yesNo(user.value.has_totp) },
+		{ label: 'Email verified', value: yesNo(user.value.email_verified) },
+		{ label: 'Has password', value: yesNo(user.value.has_password) },
+		{ label: 'Has TOTP', value: yesNo(user.value.has_totp) },
 	]
 })
 </script>
diff --git a/apps/frontend/src/components/project-review/project-info/members/member-item.vue b/apps/frontend/src/components/project-review/project-info/members/member-item.vue
index 572fa9aedd8..02daef1de3a 100644
--- a/apps/frontend/src/components/project-review/project-info/members/member-item.vue
+++ b/apps/frontend/src/components/project-review/project-info/members/member-item.vue
@@ -4,11 +4,7 @@
 			v-if="avatarUrl"
 			type="button"
 			class="shrink-0 cursor-zoom-in rounded-full border-0 bg-transparent p-0"
-			:aria-label="
-				formatMessage(messages.openMemberAvatar, {
-					username: member.user.username,
-				})
-			"
+			:aria-label="`View enlarged avatar for ${member.user.username}`"
 			@click="viewer?.show(0)"
 		>
 			<Avatar
@@ -39,11 +35,7 @@
 					class="truncate font-medium text-primary hover:underline"
 					>{{ member.user.username }}</NuxtLink
 				>
-				<CrownIcon
-					v-if="member.is_owner"
-					class="size-3 shrink-0"
-					:aria-label="formatMessage(messages.owner)"
-				/>
+				<CrownIcon v-if="member.is_owner" class="size-3 shrink-0" aria-label="Owner" />
 			</div>
 			<p class="m-0 text-xs">{{ member.role }}</p>
 			<ProjectStatusStats :stats="stats" />
@@ -58,21 +50,20 @@
 <script setup lang="ts">
 import type { Labrinth } from '@modrinth/api-client'
 import { CrownIcon } from '@modrinth/assets'
-import { Avatar, ImageViewerEditor, useVIntl } from '@modrinth/ui'
+import { Avatar, ImageViewerEditor } from '@modrinth/ui'
 import { computed, ref } from 'vue'
 
 import ProjectStatusStats from '~/components/ProjectStatusStats.vue'
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
 import ImageViewerActions from '../../image-viewer-actions.vue'
-import { projectReviewMessages as messages } from '../../messages'
 import MemberActions from './member-actions.vue'
 
 const props = defineProps<{
 	member: Labrinth.Projects.v3.TeamMember
 	stats: { status: string; count: number }[]
 }>()
-const { formatMessage } = useVIntl()
+
 const viewer = ref<InstanceType<typeof ImageViewerEditor>>()
 const { pixelated } = injectProjectReviewPageContext()
 const avatarUrl = computed(() => props.member.user.raw_avatar_url || props.member.user.avatar_url)
diff --git a/apps/frontend/src/components/project-review/project-info/members/organization-item.vue b/apps/frontend/src/components/project-review/project-info/members/organization-item.vue
index 40c48b940a0..2873ee478e1 100644
--- a/apps/frontend/src/components/project-review/project-info/members/organization-item.vue
+++ b/apps/frontend/src/components/project-review/project-info/members/organization-item.vue
@@ -4,9 +4,7 @@
 			v-if="iconUrl"
 			type="button"
 			class="shrink-0 cursor-zoom-in rounded-full border-0 bg-transparent p-0"
-			:aria-label="
-				formatMessage(messages.openOrganizationIcon, { organization: organization.name })
-			"
+			:aria-label="`View enlarged icon for ${organization.name}`"
 			@click="viewer?.show(0)"
 		>
 			<Avatar
@@ -37,12 +35,14 @@
 					class="truncate font-medium text-primary hover:underline"
 					>{{ organization.name }}</NuxtLink
 				>
-				<CrownIcon class="size-3 shrink-0" :aria-label="formatMessage(messages.owner)" />
+				<CrownIcon class="size-3 shrink-0" aria-label="Owner" />
 			</div>
 			<div class="flex items-center gap-1 text-xs">
-				<p class="m-0 text-xs">{{ formatMessage(messages.organization) }}</p>
+				<p class="m-0 text-xs">Organization</p>
 				<span aria-hidden="true">•</span>
-				<p class="m-0">{{ formatMessage(messages.memberCount, { count: memberCount }) }}</p>
+				<p class="m-0">
+					{{ memberCount === 1 ? `${memberCount} member` : `${memberCount} members` }}
+				</p>
 			</div>
 			<ProjectStatusStats :stats="stats" />
 		</div>
@@ -52,20 +52,19 @@
 <script setup lang="ts">
 import type { Labrinth } from '@modrinth/api-client'
 import { CrownIcon } from '@modrinth/assets'
-import { Avatar, ImageViewerEditor, useVIntl } from '@modrinth/ui'
+import { Avatar, ImageViewerEditor } from '@modrinth/ui'
 import { computed, ref } from 'vue'
 
 import ProjectStatusStats from '~/components/ProjectStatusStats.vue'
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
 import ImageViewerActions from '../../image-viewer-actions.vue'
-import { projectReviewMessages as messages } from '../../messages'
 
 const props = defineProps<{
 	organization: Labrinth.Projects.v3.Organization
 	stats: { status: string; count: number }[]
 }>()
-const { formatMessage } = useVIntl()
+
 const viewer = ref<InstanceType<typeof ImageViewerEditor>>()
 const { pixelated } = injectProjectReviewPageContext()
 const memberCount = computed(
diff --git a/apps/frontend/src/components/project-review/project-info/project/compatibility.vue b/apps/frontend/src/components/project-review/project-info/project/compatibility.vue
index 4644ebd2559..d5d570a42be 100644
--- a/apps/frontend/src/components/project-review/project-info/project/compatibility.vue
+++ b/apps/frontend/src/components/project-review/project-info/project/compatibility.vue
@@ -1,7 +1,7 @@
 <template>
-	<Section :heading="formatMessage(messages.compatibility)" :target="{ kind: 'compatibility' }">
+	<Section heading="Compatibility" :target="{ kind: 'compatibility' }">
 		<dl class="m-0 grid grid-cols-[max-content_minmax(0,1fr)] gap-x-3 gap-y-2.5">
-			<dt class="text-sm font-medium text-secondary">{{ formatMessage(messages.gameVersions) }}</dt>
+			<dt class="text-sm font-medium text-secondary">Game versions</dt>
 			<dd class="m-0 flex flex-wrap items-start gap-1">
 				<TagItem
 					v-for="version in gameVersions"
@@ -9,12 +9,10 @@
 					class="!border-surface-4 !bg-surface-3 !text-secondary"
 					>{{ version }}</TagItem
 				>
-				<span v-if="compatibilityError">{{ formatMessage(messages.unavailable) }}</span>
-				<span v-else-if="gameVersions.length === 0">{{
-					formatMessage(messages.emptyVersions)
-				}}</span>
+				<span v-if="compatibilityError">Unavailable</span>
+				<span v-else-if="gameVersions.length === 0">No versions</span>
 			</dd>
-			<dt class="text-sm font-medium text-secondary">{{ formatMessage(messages.platforms) }}</dt>
+			<dt class="text-sm font-medium text-secondary">Platforms</dt>
 			<dd class="m-0 flex flex-wrap items-start gap-1">
 				<TagItem
 					v-for="loader in project?.loaders"
@@ -26,24 +24,20 @@
 						v-if="loader !== 'mrpack' && getLoaderIcon(loader)"
 						aria-hidden="true"
 					/>
-					{{ formatLoader(formatMessage, loader) }}
+					{{ loaderName(loader) }}
 				</TagItem>
-				<span v-if="!project?.loaders.length">{{ formatMessage(messages.emptyPlatforms) }}</span>
+				<span v-if="!project?.loaders.length">No platforms</span>
 			</dd>
 			<template v-if="requiresEnvironmentInfo(project?.project_types ?? [])">
-				<dt class="text-sm font-medium text-secondary">
-					{{ formatMessage(messages.environments) }}
-				</dt>
+				<dt class="text-sm font-medium text-secondary">Environments</dt>
 				<dd class="m-0 flex flex-wrap items-start gap-1">
 					<TagItem
 						v-for="environment in project?.environment"
 						:key="environment"
 						class="max-w-full !text-wrap !border-surface-4 !bg-surface-3 !text-secondary"
-						>{{ formatMessage(ENVIRONMENTS_COPY[environment].title) }}</TagItem
+						>{{ environmentLabels[environment] }}</TagItem
 					>
-					<span v-if="!project?.environment?.length">{{
-						formatMessage(messages.emptyEnvironments)
-					}}</span>
+					<span v-if="!project?.environment?.length">No environments</span>
 				</dd>
 			</template>
 		</dl>
@@ -53,16 +47,29 @@
 <script setup lang="ts">
 import { getLoaderIcon } from '@modrinth/assets'
 import { requiresEnvironmentInfo } from '@modrinth/moderation'
-import { ENVIRONMENTS_COPY, formatLoader, injectTags, TagItem, useVIntl } from '@modrinth/ui'
+import { injectTags, TagItem } from '@modrinth/ui'
 import { formatVersionsForDisplay } from '@modrinth/utils'
 
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
-import { projectReviewMessages as messages } from '../../messages'
 import Section from '../section.vue'
+import { loaderName } from '../tag-labels'
+
+const environmentLabels = {
+	client_only: 'Client-side only',
+	server_only: 'Server-side only, works in singleplayer too',
+	singleplayer_only: 'Singleplayer only',
+	dedicated_server_only: 'Server-side only',
+	client_and_server: 'Client and server, required on both',
+	client_only_server_optional: 'Client and server, optional on server',
+	server_only_client_optional: 'Client and server, optional on client',
+	client_or_server: 'Client and server, optional on both',
+	client_or_server_prefers_both: 'Client and server, best when installed on both',
+	unknown: 'Unknown environment',
+}
 
 const { project, projectV2, compatibilityError } = injectProjectReviewPageContext()
-const { formatMessage } = useVIntl()
+
 const tags = injectTags(null)
 const gameVersions = computed(() => {
 	const versions = projectV2.value?.game_versions ?? []
diff --git a/apps/frontend/src/components/project-review/project-info/project/details.vue b/apps/frontend/src/components/project-review/project-info/project/details.vue
index 3b37951075b..adbeaacad34 100644
--- a/apps/frontend/src/components/project-review/project-info/project/details.vue
+++ b/apps/frontend/src/components/project-review/project-info/project/details.vue
@@ -1,11 +1,11 @@
 <template>
-	<Section :heading="formatMessage(messages.details)">
+	<Section heading="Details">
 		<template #right>
-			<EditButton :section="formatMessage(messages.details)" @click="editModal?.show()" />
+			<EditButton section="Details" @click="editModal?.show()" />
 		</template>
 		<EditModal :key="project?.id" ref="editModal" />
 		<dl v-if="project" class="m-0 grid grid-cols-[5.5rem_minmax(0,1fr)] gap-x-3 gap-y-2">
-			<dt class="font-medium">{{ formatMessage(messages.project) }}</dt>
+			<dt class="font-medium">Project</dt>
 			<dd class="m-0 flex min-w-0 items-center gap-1">
 				<Tooltip class="flex shrink-0">
 					<template #popper>
@@ -31,7 +31,7 @@
 				</NuxtLink>
 			</dd>
 			<template v-if="project.status === 'processing' && project.requested_status">
-				<dt class="font-medium">{{ formatMessage(messages.requesting) }}</dt>
+				<dt class="font-medium">Requesting</dt>
 				<dd class="m-0">
 					<ProjectStatusBadge
 						:status="project.requested_status"
@@ -39,7 +39,7 @@
 					/>
 				</dd>
 			</template>
-			<dt class="font-medium">{{ formatMessage(messages.projectType) }}</dt>
+			<dt class="font-medium">Type</dt>
 			<dd class="m-0 flex flex-col gap-1">
 				<div
 					v-for="type in projectTypes"
@@ -51,64 +51,76 @@
 						:class="{
 							underline: projectTypes.length > 1 && type.id === primaryProjectType,
 						}"
-						>{{ formatMessage(getProjectTypeTitleMessage(type.id), { count: 1 }) }}</span
+						>{{ projectTypeLabels[type.id] ?? 'Project' }}</span
 					>
 				</div>
 			</dd>
-			<dt class="font-medium">{{ formatMessage(messages.created) }}</dt>
+			<dt class="font-medium">Created</dt>
 			<dd class="m-0">
 				<time v-tooltip="formatDateTime(project.published)" :datetime="project.published">{{
 					relativeTime(project.published)
 				}}</time>
 			</dd>
-			<dt class="font-medium">{{ formatMessage(messages.updated) }}</dt>
+			<dt class="font-medium">Updated</dt>
 			<dd class="m-0">
 				<time v-tooltip="formatDateTime(project.updated)" :datetime="project.updated">{{
 					relativeTime(project.updated)
 				}}</time>
 			</dd>
 			<template v-if="project.queued">
-				<dt class="font-medium">{{ formatMessage(messages.submitted) }}</dt>
+				<dt class="font-medium">Submitted</dt>
 				<dd class="m-0 flex flex-wrap items-center gap-x-1.5">
 					<time v-tooltip="formatDateTime(project.queued)" :datetime="project.queued">{{
 						relativeTime(project.queued)
 					}}</time>
 					<template v-if="submissionCount">
 						<BulletDivider aria-hidden="true" />
-						<span>{{ formatMessage(messages.submissions, { count: submissionCount }) }}</span>
+						<span>{{
+							submissionCount === 1
+								? `${submissionCount} submission`
+								: `${submissionCount} submissions`
+						}}</span>
 					</template>
 				</dd>
 			</template>
-			<dt class="font-medium">{{ formatMessage(messages.downloads) }}</dt>
+			<dt class="font-medium">Downloads</dt>
 			<dd class="m-0">{{ formatNumber(project.downloads) }}</dd>
-			<dt class="font-medium">{{ formatMessage(messages.monetization) }}</dt>
+			<dt class="font-medium">Monetization</dt>
 			<dd class="m-0">
-				{{ formatMessage(messages.monetizationValue, { status: monetizationStatus }) }}
+				{{
+					monetizationStatus === 'monetized'
+						? 'Enabled'
+						: monetizationStatus === 'demonetized'
+							? 'Disabled'
+							: monetizationStatus === 'forceDemonetized'
+								? 'Force disabled'
+								: 'Unknown'
+				}}
 			</dd>
 
-			<dt class="mt-0.5 self-start font-medium">{{ formatMessage(messages.actions) }}</dt>
+			<dt class="mt-0.5 self-start font-medium">Actions</dt>
 			<dd class="m-0 flex flex-wrap items-center gap-2">
 				<Button
-					v-tooltip="formatMessage(messages.copyValue, { value: project.id })"
+					v-tooltip="`Copy: ${project.id}`"
 					type="outlined"
 					class="!text-primary"
 					size="sm"
-					:aria-label="formatMessage(commonMessages.copyIdButton)"
+					aria-label="Copy ID"
 					@click="copyProjectId(project.id)"
 				>
-					{{ formatMessage(messages.projectId) }}
+					Project ID
 					<CheckIcon v-if="projectIdCopied" aria-hidden="true" />
 					<CopyIcon v-else aria-hidden="true" />
 				</Button>
 				<Button
-					v-tooltip="formatMessage(messages.copyValue, { value: permalink })"
+					v-tooltip="`Copy: ${permalink}`"
 					type="outlined"
 					class="!text-primary"
 					size="xs"
-					:aria-label="formatMessage(commonMessages.copyPermalinkButton)"
+					aria-label="Copy permanent link"
 					@click="copyPermalink(permalink)"
 				>
-					{{ formatMessage(messages.permalink) }}
+					Perma link
 					<CheckIcon v-if="permalinkCopied" aria-hidden="true" />
 					<CopyIcon v-else aria-hidden="true" />
 				</Button>
@@ -121,7 +133,7 @@
 					class="!text-primary"
 					size="xs"
 				>
-					{{ formatMessage(commonMessages.analyticsButton) }}
+					Analytics
 					<ExternalIcon aria-hidden="true" />
 				</ButtonLink>
 			</dd>
@@ -135,17 +147,11 @@ import {
 	BulletDivider,
 	Button,
 	ButtonLink,
-	commonMessages,
 	getProjectStatusColor,
 	getProjectStatusIcon,
 	getProjectTypeIcon,
-	getProjectTypeTitleMessage,
 	ProjectStatusBadge,
 	Tooltip,
-	useFormatDateTime,
-	useFormatNumber,
-	useRelativeTime,
-	useVIntl,
 } from '@modrinth/ui'
 import { getPrimaryProjectType } from '@modrinth/utils'
 import { useClipboard, useMagicKeys } from '@vueuse/core'
@@ -153,10 +159,11 @@ import { computed, useTemplateRef } from 'vue'
 
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
-import { projectReviewMessages as messages } from '../../messages'
+import { createDateFormatter, createRelativeTimeFormatter, formatNumber } from '../../format'
 import EditButton from '../edit/button.vue'
 import EditModal from '../edit/details.vue'
 import Section from '../section.vue'
+import { projectTypeLabels } from '../type-labels'
 
 const { project, projectV2, submissionCount, members, organizationMembers } =
 	injectProjectReviewPageContext()
@@ -166,8 +173,12 @@ const permalink = computed(
 	() =>
 		`${shiftHeld.value ? 'https://modrinth.com' : config.public.siteUrl}/project/${project.value?.id}`,
 )
-const { copy: copyProjectId, copied: projectIdCopied } = useClipboard({ copiedDuring: 2000 })
-const { copy: copyPermalink, copied: permalinkCopied } = useClipboard({ copiedDuring: 2000 })
+const { copy: copyProjectId, copied: projectIdCopied } = useClipboard({
+	copiedDuring: 2000,
+})
+const { copy: copyPermalink, copied: permalinkCopied } = useClipboard({
+	copiedDuring: 2000,
+})
 const editModal = useTemplateRef<InstanceType<typeof EditModal>>('editModal')
 const monetizationStatus = computed(() =>
 	project.value?.monetization_status === 'force-demonetized'
@@ -198,8 +209,10 @@ const projectTypes = computed(() => {
 		)
 		.map((type) => ({ id: type, icon: getProjectTypeIcon(type) }))
 })
-const { formatMessage } = useVIntl()
-const relativeTime = useRelativeTime({ style: 'narrow' })
-const formatDateTime = useFormatDateTime({ dateStyle: 'long', timeStyle: 'short' })
-const formatNumber = useFormatNumber()
+
+const relativeTime = createRelativeTimeFormatter({ style: 'narrow' })
+const formatDateTime = createDateFormatter({
+	dateStyle: 'long',
+	timeStyle: 'short',
+})
 </script>
diff --git a/apps/frontend/src/components/project-review/project-info/project/icon.vue b/apps/frontend/src/components/project-review/project-info/project/icon.vue
index d8b820b0558..c99601f9c7c 100644
--- a/apps/frontend/src/components/project-review/project-info/project/icon.vue
+++ b/apps/frontend/src/components/project-review/project-info/project/icon.vue
@@ -1,7 +1,7 @@
 <template>
-	<Section :heading="formatMessage(messages.icon)" :target="{ kind: 'icon' }">
+	<Section heading="Icon" :target="{ kind: 'icon' }">
 		<template #right>
-			<EditButton v-if="!editing" :section="formatMessage(messages.icon)" @click="startEditing" />
+			<EditButton v-if="!editing" section="Icon" @click="startEditing" />
 		</template>
 		<IconEdit v-if="editing" :key="projectId" @done="editing = false" />
 		<template v-else-if="project">
@@ -9,7 +9,7 @@
 				v-if="iconUrl"
 				type="button"
 				class="w-fit cursor-zoom-in rounded-xl border-0 bg-transparent p-0"
-				:aria-label="formatMessage(messages.openIcon)"
+				aria-label="View enlarged project icon"
 				@click="viewer?.show(0)"
 			>
 				<Avatar :src="project.raw_icon_url || iconUrl" :alt="project.name" size="5rem" no-shadow />
@@ -33,7 +33,7 @@
 </template>
 
 <script setup lang="ts">
-import { Avatar, ImageViewerEditor, useVIntl } from '@modrinth/ui'
+import { Avatar, ImageViewerEditor } from '@modrinth/ui'
 import { useEventListener } from '@vueuse/core'
 import { computed, ref, watch } from 'vue'
 
@@ -41,13 +41,11 @@ import { useModerationKeybinds } from '~/composables/moderation'
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
 import ImageViewerActions from '../../image-viewer-actions.vue'
-import { projectReviewMessages as messages } from '../../messages'
 import { useReviewShortcut } from '../../shortcuts'
 import EditButton from '../edit/button.vue'
 import IconEdit from '../edit/icon.vue'
 import Section from '../section.vue'
 
-const { formatMessage } = useVIntl()
 const { project, projectId, pixelated } = injectProjectReviewPageContext()
 const viewer = ref<InstanceType<typeof ImageViewerEditor>>()
 const viewerOpen = ref(false)
diff --git a/apps/frontend/src/components/project-review/project-info/project/license.vue b/apps/frontend/src/components/project-review/project-info/project/license.vue
index 75c82b59b41..1639b4de602 100644
--- a/apps/frontend/src/components/project-review/project-info/project/license.vue
+++ b/apps/frontend/src/components/project-review/project-info/project/license.vue
@@ -1,12 +1,12 @@
 <template>
-	<Section :heading="formatMessage(messages.license)" :target="{ kind: 'license' }">
+	<Section heading="License" :target="{ kind: 'license' }">
 		<template #heading-after>
 			<TagItem v-if="isCustomLicense" class="!border-surface-4 !bg-surface-3 !text-secondary">
 				Custom
 			</TagItem>
 		</template>
 		<template #right>
-			<EditButton :section="formatMessage(messages.license)" @click="editModal?.show()" />
+			<EditButton section="License" @click="editModal?.show()" />
 		</template>
 		<EditModal :key="project?.id" ref="editModal" />
 		<div v-if="project" class="flex flex-col gap-1">
@@ -23,7 +23,7 @@
 				</span>
 				<TagItem
 					v-if="licenseRequiresSource(project.license.id)"
-					v-tooltip="formatMessage(messages.sourceAvailabilityRequired)"
+					v-tooltip="'License requires source code.'"
 					class="!border-orange !bg-surface-4 !px-1.5 !py-0.5 !text-orange"
 				>
 					<TagCategoryScrollTextIcon />
@@ -49,19 +49,18 @@
 <script setup lang="ts">
 import { ExternalIcon, TagCategoryScrollTextIcon } from '@modrinth/assets'
 import { licenseRequiresSource } from '@modrinth/moderation'
-import { TagItem, useVIntl } from '@modrinth/ui'
+import { TagItem } from '@modrinth/ui'
 import { computed, useTemplateRef } from 'vue'
 
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 import { reviewExternalUrl } from '~/providers/project-review/project-links'
 
-import { projectReviewMessages as messages } from '../../messages'
 import EditButton from '../edit/button.vue'
 import EditModal from '../edit/license.vue'
 import Section from '../section.vue'
 
 const { project, projectV2 } = injectProjectReviewPageContext()
-const { formatMessage } = useVIntl()
+
 const editModal = useTemplateRef<InstanceType<typeof EditModal>>('editModal')
 const isCustomLicense = computed(() => {
 	const id = project.value?.license.id
diff --git a/apps/frontend/src/components/project-review/project-info/project/links.vue b/apps/frontend/src/components/project-review/project-info/project/links.vue
index b7906a5e9b3..5a7cef447c0 100644
--- a/apps/frontend/src/components/project-review/project-info/project/links.vue
+++ b/apps/frontend/src/components/project-review/project-info/project/links.vue
@@ -1,7 +1,7 @@
 <template>
-	<Section :heading="formatMessage(messages.links)">
+	<Section heading="Links">
 		<template #right>
-			<EditButton :section="formatMessage(messages.links)" @click="editModal?.show()" />
+			<EditButton section="Links" @click="editModal?.show()" />
 		</template>
 		<EditModal :key="project?.id" ref="editModal" />
 		<div v-if="links.length" class="flex flex-col gap-3">
@@ -17,14 +17,14 @@
 						{{ link.label }}
 						<TagItem
 							v-if="link.key === 'source' && project && licenseRequiresSource(project.license.id)"
-							v-tooltip="formatMessage(messages.sourceAvailabilityRequired)"
+							v-tooltip="'License requires source code.'"
 							class="!border-orange !bg-surface-4 !px-1.5 !py-0.5 !text-orange"
 						>
 							<TagCategoryScrollTextIcon />
 						</TagItem>
 					</h4>
 					<span v-if="link.unavailable && !link.removed" class="text-xs text-secondary">
-						{{ formatMessage(messages.linkUnavailable) }}
+						Link unavailable
 					</span>
 					<div v-if="link.url" class="flex min-w-0 items-center gap-1.5">
 						<LinkInfoTooltip
@@ -38,9 +38,9 @@
 								:aria-describedby="tooltipId"
 								:aria-label="
 									link.removed
-										? formatMessage(messages.linkRemoved, { link: link.url })
+										? `Link removed: ${link.url}`
 										: link.unavailable
-											? formatMessage(messages.previousLink, { url: link.url })
+											? `Previous link: ${link.url}`
 											: undefined
 								"
 								target="_blank"
@@ -63,7 +63,7 @@
 				</div>
 			</ReviewPanel>
 		</div>
-		<span v-else>{{ formatMessage(messages.emptyLinks) }}</span>
+		<span v-else>No links</span>
 	</Section>
 </template>
 
@@ -87,26 +87,25 @@ import {
 	WikiIcon,
 } from '@modrinth/assets'
 import { licenseRequiresSource } from '@modrinth/moderation'
-import { injectModrinthClient, TagItem, useVIntl } from '@modrinth/ui'
+import { injectModrinthClient, TagItem } from '@modrinth/ui'
 import { useQuery } from '@tanstack/vue-query'
 import { computed, ref, useTemplateRef, watch } from 'vue'
 
-import { getProjectNagMessages } from '~/composables/project-nag-validation'
 import { projectQueryOptions, STALE_TIME } from '~/composables/queries/project'
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 import { reviewExternalUrl } from '~/providers/project-review/project-links'
 import { injectReviewPanels } from '~/providers/project-review/review-panels'
 
 import LinkInfoTooltip from '../../link-info/tooltip.vue'
-import { projectReviewMessages as messages } from '../../messages'
+import { linkValidationWarnings } from '../../link-info/validation'
 import ReviewPanel from '../../review-panel/index.vue'
 import EditButton from '../edit/button.vue'
 import EditModal from '../edit/links.vue'
 import Section from '../section.vue'
 
-const { project, projectId, projectV2 } = injectProjectReviewPageContext()
+const { project, projectId } = injectProjectReviewPageContext()
 const { previousLinks } = injectReviewPanels()
-const { formatMessage } = useVIntl()
+
 const client = injectModrinthClient()
 const hoveredLink = ref<string>()
 const validation = useQuery(
@@ -165,18 +164,18 @@ const links = computed(() => {
 				'other',
 			]
 	const labels = {
-		site: messages.website,
-		store: messages.store,
-		source: messages.source,
-		issues: messages.issues,
-		discord: isServerProject ? messages.serverDiscord : messages.discord,
-		wiki: messages.wiki,
-		patreon: messages.donationPatreon,
-		bmac: messages.donationBmac,
-		paypal: messages.donationPaypal,
-		github: messages.donationGithub,
-		'ko-fi': messages.donationKoFi,
-		other: messages.donationOther,
+		site: 'Website',
+		store: 'Store',
+		source: 'Source code',
+		issues: 'Issue tracker',
+		discord: isServerProject ? 'Discord' : 'Discord invite',
+		wiki: 'Wiki page',
+		patreon: 'Patreon',
+		bmac: 'Buy Me A Coffee',
+		paypal: 'PayPal',
+		github: 'GitHub Sponsors',
+		'ko-fi': 'Ko-fi',
+		other: 'Other',
 	}
 
 	const currentLinks = project.value?.link_urls ?? {}
@@ -193,25 +192,19 @@ const links = computed(() => {
 			const message = labels[key as keyof typeof labels]
 			const validationMessages =
 				url && !validation.isError.value
-					? getProjectNagMessages(validation.data.value?.nags ?? [], 'link-field', {
-							detailField: key,
-							url,
-							projectType: projectV2.value?.project_type,
-						})
+					? linkValidationWarnings(validation.data.value?.nags ?? [], key, url)
 					: []
 			return url || previousLinks.value.has(key)
 				? [
 						{
 							key,
 							validationMessages,
-							warningText: validationMessages
-								.map((message) => formatMessage(message.message, message.values))
-								.join('\n'),
+							warningText: validationMessages.map((message) => message.text).join('\n'),
 							url: url ?? reviewExternalUrl(previousLinks.value.get(key)),
 							removed: !link?.url,
 							unavailable: !url,
 							icon: linkIcons[key as keyof typeof linkIcons] ?? CurrencyIcon,
-							label: message ? formatMessage(message) : (link?.platform ?? key),
+							label: message ? message : (link?.platform ?? key),
 						},
 					]
 				: []
diff --git a/apps/frontend/src/components/project-review/project-info/project/server-details.vue b/apps/frontend/src/components/project-review/project-info/project/server-details.vue
index fc1d258c591..5ea5197b419 100644
--- a/apps/frontend/src/components/project-review/project-info/project/server-details.vue
+++ b/apps/frontend/src/components/project-review/project-info/project/server-details.vue
@@ -1,33 +1,33 @@
 <template>
-	<Section :heading="formatMessage(messages.serverDetails)" :target="{ kind: 'server' }">
+	<Section heading="Server details" :target="{ kind: 'server' }">
 		<template #right>
-			<EditButton :section="formatMessage(messages.serverDetails)" @click="editModal?.show()" />
+			<EditButton section="Server details" @click="editModal?.show()" />
 		</template>
 		<EditModal :key="project?.id" ref="editModal" />
 		<dl v-if="project" class="m-0 grid grid-cols-[max-content_minmax(0,1fr)] gap-x-3 gap-y-2.5">
-			<dt class="font-medium">{{ formatMessage(messages.serverAddress) }}</dt>
+			<dt class="font-medium">Address</dt>
 			<dd class="m-0 flex items-center gap-1.5 break-all text-primary">
 				<CopyCode
 					v-if="project.minecraft_java_server?.address"
 					:text="project.minecraft_java_server.address"
 					class="!-my-0.5"
 				/>
-				<span v-else>{{ formatMessage(messages.noServerAddress) }}</span>
+				<span v-else>No address.</span>
 				<TriangleAlertIcon
 					v-if="isTemporaryHost"
-					v-tooltip="formatMessage(messages.serverAddressTemporaryHost)"
-					:aria-label="formatMessage(messages.serverAddressTemporaryHost)"
+					v-tooltip="'This address uses a temporary server host.'"
+					aria-label="This address uses a temporary server host."
 					class="size-4 shrink-0 text-orange"
 				/>
 			</dd>
-			<dt class="font-medium">{{ formatMessage(messages.serverRegion) }}</dt>
+			<dt class="font-medium">Region</dt>
 			<dd class="m-0 text-primary">
 				<TagItem v-if="region" class="!border-surface-4 !bg-surface-3 !text-secondary">
 					{{ region }}
 				</TagItem>
 				<span v-else>—</span>
 			</dd>
-			<dt class="font-medium">{{ formatMessage(messages.serverLanguages) }}</dt>
+			<dt class="font-medium">Languages</dt>
 			<dd class="m-0 flex flex-wrap items-start gap-1">
 				<TagItem
 					v-for="language in languages"
@@ -36,37 +36,37 @@
 				>
 					{{ language.name }}
 				</TagItem>
-				<span v-if="languages.length === 0">{{ formatMessage(messages.noServerLanguages) }}</span>
+				<span v-if="languages.length === 0">No languages.</span>
 			</dd>
 
-			<dt class="font-medium">{{ formatMessage(messages.serverContent) }}</dt>
+			<dt class="font-medium">Content</dt>
 			<dd class="m-0 min-w-0">
 				<TagItem
 					v-if="content?.kind === 'vanilla'"
 					class="!border-surface-4 !bg-surface-3 !text-secondary"
 				>
-					{{ formatMessage(messages.vanilla) }}
+					Vanilla
 				</TagItem>
 				<TagItem v-else-if="isMrpack" class="!border-surface-4 !bg-surface-3 !text-secondary">
-					{{ formatMessage(messages.mrpack) }}
+					.mrpack
 				</TagItem>
 				<TagItem
 					v-else-if="content?.kind === 'modpack'"
 					class="!border-surface-4 !bg-surface-3 !text-secondary"
 				>
-					{{ formatMessage(messages.modpack) }}
+					Modpack
 				</TagItem>
 				<span v-else>—</span>
 			</dd>
 			<template v-if="content?.kind === 'vanilla'">
-				<dt class="font-medium">{{ formatMessage(messages.gameVersions) }}</dt>
+				<dt class="font-medium">Game versions</dt>
 				<dd class="m-0 flex flex-wrap items-start gap-1">
 					<TagItem
 						v-if="content.recommended_game_version"
 						class="!border-surface-4 !bg-surface-3 !text-secondary"
 					>
 						{{ content.recommended_game_version }}
-						{{ formatMessage(messages.recommended) }}
+						(Recommended)
 					</TagItem>
 					<TagItem
 						v-for="version in supportedVersions"
@@ -108,10 +108,10 @@
 								rel="noopener noreferrer"
 								class="truncate hover:underline"
 							>
-								{{ formatMessage(messages.modpackVersion, { version: modpackVersionLabel }) }}
+								{{ `Version ${modpackVersionLabel}` }}
 							</NuxtLink>
 							<span v-else class="truncate">
-								{{ formatMessage(messages.modpackVersion, { version: modpackVersionLabel }) }}
+								{{ `Version ${modpackVersionLabel}` }}
 							</span>
 							<template v-if="modpackAuthorId">
 								<BulletDivider aria-hidden="true" />
@@ -141,10 +141,7 @@ import {
 	CopyCode,
 	injectModrinthClient,
 	injectTags,
-	SERVER_LANGUAGES,
-	SERVER_REGIONS,
 	TagItem,
-	useVIntl,
 } from '@modrinth/ui'
 import { formatVersionsForDisplay } from '@modrinth/utils'
 import { useQuery } from '@tanstack/vue-query'
@@ -153,15 +150,15 @@ import { computed, useTemplateRef } from 'vue'
 import { versionQueryOptions } from '~/composables/queries/version'
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
-import { projectReviewMessages as messages } from '../../messages'
 import EditButton from '../edit/button.vue'
 import EditModal from '../edit/server-details.vue'
 import Section from '../section.vue'
+import { SERVER_LANGUAGES, SERVER_REGIONS } from '../server-labels'
 
 const { project } = injectProjectReviewPageContext()
 const editModal = useTemplateRef<InstanceType<typeof EditModal>>('editModal')
 const client = injectModrinthClient()
-const { formatMessage } = useVIntl()
+
 const tags = injectTags(null)
 const isTemporaryHost = computed(() =>
 	isTempHostAddress(project.value?.minecraft_java_server?.address ?? ''),
@@ -207,14 +204,14 @@ const modpackVersionLabel = computed(() => {
 const languages = computed(() =>
 	(project.value?.minecraft_server?.languages ?? []).map((code) => {
 		const message = SERVER_LANGUAGES[code as keyof typeof SERVER_LANGUAGES]
-		return { code, name: message ? formatMessage(message) : code }
+		return { code, name: message ? message : code }
 	}),
 )
 const region = computed(() => {
 	const code = project.value?.minecraft_server?.region
 	if (!code) return null
 	const message = SERVER_REGIONS[code as keyof typeof SERVER_REGIONS]
-	return message ? formatMessage(message) : code
+	return message ? message : code
 })
 const supportedVersions = computed(() => {
 	const vanilla = content.value
diff --git a/apps/frontend/src/components/project-review/project-info/project/slug.vue b/apps/frontend/src/components/project-review/project-info/project/slug.vue
index 9a61f08d583..dc364537724 100644
--- a/apps/frontend/src/components/project-review/project-info/project/slug.vue
+++ b/apps/frontend/src/components/project-review/project-info/project/slug.vue
@@ -1,18 +1,13 @@
 <template>
-	<Section :heading="formatMessage(messages.slug)" :target="{ kind: 'slug' }">
+	<Section heading="Slug" :target="{ kind: 'slug' }">
 		<template #right>
-			<EditButton
-				v-if="!editing"
-				:section="formatMessage(messages.slug)"
-				:disabled="saving"
-				@click="startEditing"
-			/>
+			<EditButton v-if="!editing" section="Slug" :disabled="saving" @click="startEditing" />
 		</template>
 		<div v-if="editing" class="flex flex-col gap-1.5">
 			<Input
 				ref="input"
 				v-model="draft"
-				:aria-label="formatMessage(messages.slug)"
+				aria-label="Slug"
 				:maxlength="64"
 				autocomplete="off"
 				:disabled="saving"
@@ -24,9 +19,7 @@
 				{{ validationMessage }}
 			</p>
 			<div class="flex justify-end gap-1">
-				<Button type="quiet" size="xs" :disabled="saving" @click="resetEditing">
-					{{ formatMessage(commonMessages.cancelButton) }}
-				</Button>
+				<Button type="quiet" size="xs" :disabled="saving" @click="resetEditing"> Cancel </Button>
 				<Button
 					type="colored"
 					color="brand"
@@ -35,7 +28,7 @@
 					:disabled="saving || !valid"
 					@click="save"
 				>
-					{{ formatMessage(commonMessages.saveButton) }}
+					Save
 				</Button>
 			</div>
 		</div>
@@ -47,8 +40,8 @@
 				</span>
 				<TriangleAlertIcon
 					v-if="isNonSuggestedSlug"
-					v-tooltip="formatMessage(messages.slugNotSuggested)"
-					:aria-label="formatMessage(messages.slugNotSuggested)"
+					v-tooltip="'This slug does not match any of the suggested slugs.'"
+					aria-label="This slug does not match any of the suggested slugs."
 					class="size-4 shrink-0 text-orange"
 				/>
 			</div>
@@ -58,19 +51,17 @@
 
 <script setup lang="ts">
 import { TriangleAlertIcon } from '@modrinth/assets'
-import { Button, commonMessages, Input, useVIntl } from '@modrinth/ui'
+import { Button, Input } from '@modrinth/ui'
 import { computed, useTemplateRef } from 'vue'
 
 import { generateProjectSlugSuggestions } from '~/composables/project-slug-suggestions'
 import { getProjectTypeForUrl } from '~/helpers/projects.js'
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
-import { projectReviewMessages as messages } from '../../messages'
 import EditButton from '../edit/button.vue'
 import { useProjectTextEdit } from '../edit/use-project-text-edit'
 import Section from '../section.vue'
 
-const { formatMessage } = useVIntl()
 const { members } = injectProjectReviewPageContext()
 const input = useTemplateRef<InstanceType<typeof Input>>('input')
 const {
diff --git a/apps/frontend/src/components/project-review/project-info/project/summary.vue b/apps/frontend/src/components/project-review/project-info/project/summary.vue
index c865d97f5be..8ecf7bb24d7 100644
--- a/apps/frontend/src/components/project-review/project-info/project/summary.vue
+++ b/apps/frontend/src/components/project-review/project-info/project/summary.vue
@@ -1,18 +1,13 @@
 <template>
-	<Section :heading="formatMessage(messages.summary)" :target="{ kind: 'summary' }">
+	<Section heading="Summary" :target="{ kind: 'summary' }">
 		<template #right>
-			<EditButton
-				v-if="!editing"
-				:section="formatMessage(messages.summary)"
-				:disabled="saving"
-				@click="startEditing"
-			/>
+			<EditButton v-if="!editing" section="Summary" :disabled="saving" @click="startEditing" />
 		</template>
 		<div v-if="editing" class="flex flex-col gap-1.5">
 			<Textarea
 				ref="summaryInput"
 				v-model="draft"
-				:aria-label="formatMessage(messages.summary)"
+				aria-label="Summary"
 				:maxlength="256"
 				:disabled="saving"
 				resize="vertical"
@@ -21,9 +16,7 @@
 				{{ validationMessage }}
 			</p>
 			<div class="flex justify-end gap-1">
-				<Button type="quiet" size="xs" :disabled="saving" @click="resetEditing">
-					{{ formatMessage(commonMessages.cancelButton) }}
-				</Button>
+				<Button type="quiet" size="xs" :disabled="saving" @click="resetEditing"> Cancel </Button>
 				<Button
 					type="colored"
 					color="brand"
@@ -32,7 +25,7 @@
 					:disabled="saving || !valid"
 					@click="save"
 				>
-					{{ formatMessage(commonMessages.saveButton) }}
+					Save
 				</Button>
 			</div>
 		</div>
@@ -43,15 +36,13 @@
 </template>
 
 <script setup lang="ts">
-import { Button, commonMessages, Textarea, useVIntl } from '@modrinth/ui'
+import { Button, Textarea } from '@modrinth/ui'
 import { useTemplateRef } from 'vue'
 
-import { projectReviewMessages as messages } from '../../messages'
 import EditButton from '../edit/button.vue'
 import { useProjectTextEdit } from '../edit/use-project-text-edit'
 import Section from '../section.vue'
 
-const { formatMessage } = useVIntl()
 const summaryInput = useTemplateRef<InstanceType<typeof Textarea>>('summaryInput')
 const {
 	project,
diff --git a/apps/frontend/src/components/project-review/project-info/project/tags.vue b/apps/frontend/src/components/project-review/project-info/project/tags.vue
index 73b3fef7832..2ff82c20b2c 100644
--- a/apps/frontend/src/components/project-review/project-info/project/tags.vue
+++ b/apps/frontend/src/components/project-review/project-info/project/tags.vue
@@ -1,7 +1,7 @@
 <template>
-	<Section :heading="formatMessage(messages.tags)" :target="{ kind: 'tags' }">
+	<Section heading="Tags" :target="{ kind: 'tags' }">
 		<template #right>
-			<EditButton :section="formatMessage(messages.tags)" @click="editModal?.show()" />
+			<EditButton section="Tags" @click="editModal?.show()" />
 		</template>
 		<EditModal :key="project?.id" ref="editModal" />
 		<div v-if="project && hasTags" class="flex flex-wrap gap-1.5">
@@ -9,33 +9,33 @@
 				v-for="category in project.categories"
 				:key="category"
 				class="!border-brand !bg-transparent !text-brand opacity-90"
-				>{{ formatCategory(formatMessage, category) }}</TagItem
+				>{{ categoryName(category) }}</TagItem
 			>
 			<TagItem
 				v-for="category in project.additional_categories"
 				:key="category"
 				class="!border-surface-4 !bg-surface-3 !text-secondary"
 			>
-				{{ formatCategory(formatMessage, category) }}
+				{{ categoryName(category) }}
 			</TagItem>
 		</div>
-		<span v-else>{{ formatMessage(messages.emptyTags) }}</span>
+		<span v-else>No tags</span>
 	</Section>
 </template>
 
 <script setup lang="ts">
-import { formatCategory, TagItem, useVIntl } from '@modrinth/ui'
+import { TagItem } from '@modrinth/ui'
 import { computed, useTemplateRef } from 'vue'
 
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
-import { projectReviewMessages as messages } from '../../messages'
 import EditButton from '../edit/button.vue'
 import EditModal from '../edit/tags.vue'
 import Section from '../section.vue'
+import { categoryName } from '../tag-labels'
 
 const { project } = injectProjectReviewPageContext()
-const { formatMessage } = useVIntl()
+
 const editModal = useTemplateRef<InstanceType<typeof EditModal>>('editModal')
 const hasTags = computed(
 	() => !!(project.value?.categories.length || project.value?.additional_categories.length),
diff --git a/apps/frontend/src/components/project-review/project-info/project/title.vue b/apps/frontend/src/components/project-review/project-info/project/title.vue
index 91be02b0e0e..e004955a11d 100644
--- a/apps/frontend/src/components/project-review/project-info/project/title.vue
+++ b/apps/frontend/src/components/project-review/project-info/project/title.vue
@@ -1,18 +1,13 @@
 <template>
-	<Section :heading="formatMessage(messages.projectTitle)" :target="{ kind: 'title' }">
+	<Section heading="Title" :target="{ kind: 'title' }">
 		<template #right>
-			<EditButton
-				v-if="!editing"
-				:section="formatMessage(messages.projectTitle)"
-				:disabled="saving"
-				@click="startEditing"
-			/>
+			<EditButton v-if="!editing" section="Title" :disabled="saving" @click="startEditing" />
 		</template>
 		<div v-if="editing" class="flex flex-col gap-1.5">
 			<Input
 				ref="input"
 				v-model="draft"
-				:aria-label="formatMessage(messages.projectTitle)"
+				aria-label="Title"
 				:maxlength="64"
 				:disabled="saving"
 				wrapper-class="w-full"
@@ -21,9 +16,7 @@
 				{{ validationMessage }}
 			</p>
 			<div class="flex justify-end gap-1">
-				<Button type="quiet" size="xs" :disabled="saving" @click="resetEditing">
-					{{ formatMessage(commonMessages.cancelButton) }}
-				</Button>
+				<Button type="quiet" size="xs" :disabled="saving" @click="resetEditing"> Cancel </Button>
 				<Button
 					type="colored"
 					color="brand"
@@ -32,7 +25,7 @@
 					:disabled="saving || !valid"
 					@click="save"
 				>
-					{{ formatMessage(commonMessages.saveButton) }}
+					Save
 				</Button>
 			</div>
 		</div>
@@ -88,24 +81,20 @@
 import { RightArrowIcon } from '@modrinth/assets'
 import {
 	Button,
-	commonMessages,
 	getProjectStatusColor,
 	getProjectStatusIcon,
 	Input,
 	ProjectStatusBadge,
 	Tooltip,
-	useVIntl,
 } from '@modrinth/ui'
 import { computed, useTemplateRef } from 'vue'
 
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
-import { projectReviewMessages as messages } from '../../messages'
 import EditButton from '../edit/button.vue'
 import { useProjectTextEdit } from '../edit/use-project-text-edit'
 import Section from '../section.vue'
 
-const { formatMessage } = useVIntl()
 const { projectV2 } = injectProjectReviewPageContext()
 const input = useTemplateRef<InstanceType<typeof Input>>('input')
 const {
diff --git a/apps/frontend/src/components/project-review/project-info/server-labels.ts b/apps/frontend/src/components/project-review/project-info/server-labels.ts
new file mode 100644
index 00000000000..b4072870f3a
--- /dev/null
+++ b/apps/frontend/src/components/project-review/project-info/server-labels.ts
@@ -0,0 +1,86 @@
+export const SERVER_REGIONS = {
+	us_east: 'US East',
+	us_west: 'US West',
+	europe: 'Europe',
+	asia: 'Asia',
+	australia: 'Australia',
+	south_america: 'South America',
+	middle_east: 'Middle East',
+	russia: 'Russia',
+}
+
+export const SERVER_LANGUAGES = {
+	en: 'English',
+	es: 'Spanish',
+	pt: 'Portuguese',
+	fr: 'French',
+	de: 'German',
+	it: 'Italian',
+	nl: 'Dutch',
+	ru: 'Russian',
+	uk: 'Ukrainian',
+	pl: 'Polish',
+	cs: 'Czech',
+	sk: 'Slovak',
+	hu: 'Hungarian',
+	ro: 'Romanian',
+	bg: 'Bulgarian',
+	hr: 'Croatian',
+	sr: 'Serbian',
+	el: 'Greek',
+	tr: 'Turkish',
+	ar: 'Arabic',
+	he: 'Hebrew',
+	hi: 'Hindi',
+	bn: 'Bengali',
+	ur: 'Urdu',
+	zh: 'Chinese',
+	ja: 'Japanese',
+	ko: 'Korean',
+	th: 'Thai',
+	vi: 'Vietnamese',
+	id: 'Indonesian',
+	ms: 'Malay',
+	tl: 'Filipino',
+	sv: 'Swedish',
+	no: 'Norwegian',
+	da: 'Danish',
+	fi: 'Finnish',
+	lt: 'Lithuanian',
+	lv: 'Latvian',
+	et: 'Estonian',
+	af: 'Afrikaans',
+	am: 'Amharic',
+	az: 'Azerbaijani',
+	be: 'Belarusian',
+	bs: 'Bosnian',
+	ca: 'Catalan',
+	eo: 'Esperanto',
+	eu: 'Basque',
+	fa: 'Persian',
+	ga: 'Irish',
+	gl: 'Galician',
+	hy: 'Armenian',
+	is: 'Icelandic',
+	ka: 'Georgian',
+	kk: 'Kazakh',
+	km: 'Khmer',
+	kn: 'Kannada',
+	lo: 'Lao',
+	mk: 'Macedonian',
+	ml: 'Malayalam',
+	mn: 'Mongolian',
+	mr: 'Marathi',
+	my: 'Burmese',
+	ne: 'Nepali',
+	pa: 'Punjabi',
+	si: 'Sinhala',
+	sl: 'Slovenian',
+	sq: 'Albanian',
+	sw: 'Swahili',
+	ta: 'Tamil',
+	te: 'Telugu',
+	uz: 'Uzbek',
+	yo: 'Yoruba',
+	zu: 'Zulu',
+}
diff --git a/apps/frontend/src/components/project-review/project-info/tag-labels.ts b/apps/frontend/src/components/project-review/project-info/tag-labels.ts
new file mode 100644
index 00000000000..ab793cca9f9
--- /dev/null
+++ b/apps/frontend/src/components/project-review/project-info/tag-labels.ts
@@ -0,0 +1,163 @@
+import { capitalizeString } from '@modrinth/utils'
+
+const loaderLabels: Record<string, string> = {
+	babric: 'Babric',
+	'bta-babric': 'BTA (Babric)',
+	bukkit: 'Bukkit',
+	bungeecord: 'BungeeCord',
+	canvas: 'Canvas',
+	datapack: 'Data Pack',
+	fabric: 'Fabric',
+	folia: 'Folia',
+	forge: 'Forge',
+	geyser: 'Geyser Extension',
+	iris: 'Iris',
+	'java-agent': 'Java Agent',
+	'legacy-fabric': 'Legacy Fabric',
+	liteloader: 'LiteLoader',
+	minecraft: 'Resource Pack',
+	modloader: "Risugami's ModLoader",
+	mrpack: 'Modpack',
+	neoforge: 'NeoForge',
+	nilloader: 'NilLoader',
+	optifine: 'OptiFine',
+	ornithe: 'Ornithe',
+	paper: 'Paper',
+	purpur: 'Purpur',
+	quilt: 'Quilt',
+	rift: 'Rift',
+	spigot: 'Spigot',
+	sponge: 'Sponge',
+	vanilla: 'Vanilla Shader',
+	velocity: 'Velocity',
+	waterfall: 'Waterfall',
+}
+
+const categoryLabels: Record<string, string> = {
+	'128x': '128x',
+	'16x': '16x',
+	'256x': '256x',
+	'32x': '32x',
+	'48x': '48x',
+	'512x+': '512x or higher',
+	'64x': '64x',
+	'8x-': '8x or lower',
+	adventure: 'Adventure',
+	'adventure-mode': 'Adventure Mode',
+	anarchy: 'Anarchy',
+	atmosphere: 'Atmosphere',
+	audio: 'Audio',
+	'battle-royale': 'Battle Royale',
+	bedwars: 'Bed Wars',
+	blocks: 'Blocks',
+	bloom: 'Bloom',
+	bosses: 'Bosses',
+	cartoon: 'Cartoon',
+	challenging: 'Challenging',
+	classes: 'Classes',
+	'colored-lighting': 'Colored Lighting',
+	combat: 'Combat',
+	competitive: 'Competitive',
+	'core-shaders': 'Core Shaders',
+	'creative-mode': 'Creative Mode',
+	'creator-community': 'Creator Community',
+	crossplay: 'Crossplay',
+	cursed: 'Cursed',
+	'custom-content': 'Custom Content',
+	decoration: 'Decoration',
+	dungeons: 'Dungeons',
+	economy: 'Economy',
+	entities: 'Entities',
+	environment: 'Environment',
+	equipment: 'Equipment',
+	factions: 'Factions',
+	fantasy: 'Fantasy',
+	foliage: 'Foliage',
+	fonts: 'Fonts',
+	food: 'Food',
+	'game-mechanics': 'Game Mechanics',
+	gens: 'Gens',
+	gui: 'GUI',
+	'hardcore-mode': 'Hardcore Mode',
+	high: 'High',
+	items: 'Items',
+	'keep-inventory': 'Keep Inventory',
+	'kitchen-sink': 'Kitchen Sink',
+	kitpvp: 'Kit PvP',
+	library: 'Library',
+	lifesteal: 'Lifesteal',
+	lightweight: 'Lightweight',
+	locale: 'Locale',
+	low: 'Low',
+	magic: 'Magic',
+	management: 'Management',
+	media: 'Media',
+	medium: 'Medium',
+	microgames: 'Microgames',
+	minigame: 'Minigame',
+	minigames: 'Minigames',
+	mmo: 'MMO',
+	mobs: 'Mobs',
+	modded: 'Modded',
+	models: 'Models',
+	multiplayer: 'Multiplayer',
+	network: 'Network',
+	'offline-mode': 'Offline Mode',
+	oneblock: 'One Block',
+	op: 'OP',
+	optimization: 'Optimization',
+	parkour: 'Parkour',
+	'path-tracing': 'Path Tracing',
+	pbr: 'PBR',
+	'personal-worlds': 'Personal Worlds',
+	plots: 'Plots',
+	pokemon: 'Pokémon',
+	potato: 'Potato',
+	prison: 'Prison',
+	pve: 'PvE',
+	pvp: 'PvP',
+	questing: 'Questing',
+	quests: 'Quests',
+	racing: 'Racing',
+	realistic: 'Realistic',
+	'recording-smp': 'Recording SMP',
+	reflections: 'Reflections',
+	roleplay: 'Roleplay',
+	rpg: 'RPG',
+	screenshot: 'Screenshot',
+	'semi-realistic': 'Semi Realistic',
+	shadows: 'Shadows',
+	simplistic: 'Simplistic',
+	skyblock: 'Skyblock',
+	smp: 'SMP',
+	social: 'Social',
+	storage: 'Storage',
+	'survival-mode': 'Survival Mode',
+	teams: 'Teams',
+	technical: 'Technical',
+	technology: 'Technology',
+	themed: 'Themed',
+	towns: 'Towns',
+	transportation: 'Transportation',
+	tweaks: 'Tweaks',
+	utility: 'Utility',
+	'vanilla-like': 'Vanilla Like',
+	whitelisted: 'Whitelisted',
+	'world-resets': 'World Resets',
+	worldgen: 'World Generation',
+}
+
+const categoryHeaderLabels: Record<string, string> = {
+	resolutions: 'Resolution',
+	categories: 'Category',
+	features: 'Feature',
+	'performance impact': 'Performance impact',
+	minecraft_server_community: 'Community',
+	minecraft_server_features: 'Features',
+	minecraft_server_gameplay: 'Gameplay',
+	minecraft_server_meta: 'Meta',
+}
+
+export const categoryName = (name: string) => categoryLabels[name] ?? capitalizeString(name)
+export const loaderName = (name: string) => loaderLabels[name] ?? capitalizeString(name)
+export const categoryHeader = (name: string) => categoryHeaderLabels[name] ?? capitalizeString(name)
diff --git a/apps/frontend/src/components/project-review/project-info/type-labels.ts b/apps/frontend/src/components/project-review/project-info/type-labels.ts
new file mode 100644
index 00000000000..7a424bc3319
--- /dev/null
+++ b/apps/frontend/src/components/project-review/project-info/type-labels.ts
@@ -0,0 +1,11 @@
+export const projectTypeLabels: Record<string, string> = {
+	mod: 'Mod',
+	modpack: 'Modpack',
+	plugin: 'Plugin',
+	datapack: 'Data Pack',
+	resourcepack: 'Resource Pack',
+	shader: 'Shader',
+	server: 'Server',
+	minecraft_java_server: 'Server',
+	project: 'Project',
+}
diff --git a/apps/frontend/src/components/project-review/project-wide-checks.vue b/apps/frontend/src/components/project-review/project-wide-checks.vue
index f782ffb58d3..9f3a0ed19bf 100644
--- a/apps/frontend/src/components/project-review/project-wide-checks.vue
+++ b/apps/frontend/src/components/project-review/project-wide-checks.vue
@@ -30,7 +30,7 @@
 			role="separator"
 			tabindex="0"
 			aria-orientation="horizontal"
-			:aria-label="formatMessage(messages.resizeActions)"
+			aria-label="Resize project checks"
 			:aria-valuenow="Math.round(measuredHeight)"
 			:aria-valuemin="80"
 			:aria-valuemax="maxActionsHeight"
@@ -50,7 +50,7 @@
 
 <script setup lang="ts">
 import { type MiscReviewPanelKey, reviewPanels } from '@modrinth/moderation/src/data/issues'
-import { defineMessages, Tabs, useVIntl } from '@modrinth/ui'
+import { Tabs } from '@modrinth/ui'
 import { useElementSize } from '@vueuse/core'
 import { computed, onScopeDispose, ref, watch } from 'vue'
 
@@ -60,13 +60,6 @@ import { injectReviewContext } from './review-panel/context'
 import ReviewPanel from './review-panel/index.vue'
 import { injectReviewShortcuts, useReviewShortcut } from './shortcuts'
 
-const { formatMessage } = useVIntl()
-const messages = defineMessages({
-	resizeActions: {
-		id: 'project-review.resize-checks',
-		defaultMessage: 'Resize project checks',
-	},
-})
 const actionsElement = ref<HTMLElement | null>(null)
 const { height: measuredHeight } = useElementSize(actionsElement)
 const actionsHeight = ref<number | null>(null)
diff --git a/apps/frontend/src/components/project-review/queue-bar.vue b/apps/frontend/src/components/project-review/queue-bar.vue
index f7977088982..22214445788 100644
--- a/apps/frontend/src/components/project-review/queue-bar.vue
+++ b/apps/frontend/src/components/project-review/queue-bar.vue
@@ -1,20 +1,23 @@
 <template>
 	<footer class="shrink-0 border-0 border-t border-solid border-divider text-sm">
 		<div v-if="navigationError" role="alert" class="px-3 py-2 text-red">
-			{{ formatMessage(messages.queueError) }}
+			Could not change projects. Please try again
 		</div>
 		<nav
 			class="flex flex-wrap items-center justify-between gap-x-3 gap-y-1 px-2 pr-2.5 text-secondary"
-			:aria-label="formatMessage(messages.queueNavigation)"
+			aria-label="Review queue navigation"
 			:aria-busy="busy"
 		>
 			<div class="flex items-center gap-3 font-medium" aria-live="polite">
 				<div class="flex">
 					<button
-						v-tooltip="{ text: formatMessage(commonMessages.settingsLabel), delay: 500 }"
+						v-tooltip="{
+							text: 'Settings',
+							delay: 500,
+						}"
 						type="button"
 						class="queue-action"
-						:aria-label="formatMessage(commonMessages.settingsLabel)"
+						aria-label="Settings"
 						@click="settingsModal?.show($event)"
 					>
 						<SettingsIcon aria-hidden="true" />
@@ -26,10 +29,13 @@
 						@close="panelMenuOpen = false"
 					>
 						<button
-							v-tooltip="{ text: formatMessage(messages.panelLayout), delay: 500 }"
+							v-tooltip="{
+								text: 'Panel layout',
+								delay: 500,
+							}"
 							type="button"
 							class="queue-action"
-							:aria-label="formatMessage(messages.panelLayout)"
+							aria-label="Panel layout"
 							:aria-expanded="panelMenuOpen"
 						>
 							<LayoutPanelLeftIcon aria-hidden="true" />
@@ -43,7 +49,7 @@
 									@click="runPanelAction(resetPanelLayout, hide)"
 								>
 									<RotateCounterClockwiseIcon aria-hidden="true" />
-									{{ formatMessage(messages.resetPanelLayout) }}
+									Reset panel layout
 								</Button>
 								<Button
 									v-if="hasPopouts"
@@ -52,7 +58,7 @@
 									@click="runPanelAction(closeExternalPanels, hide)"
 								>
 									<MonitorXIcon aria-hidden="true" />
-									{{ formatMessage(messages.closePopoutWindows) }}
+									Close popout windows
 								</Button>
 							</div>
 						</template>
@@ -60,7 +66,7 @@
 				</div>
 
 				<div class="flex items-center gap-2">
-					<template v-for="(column, index) in queueColumns" :key="column.label.id">
+					<template v-for="(column, index) in queueColumns" :key="column.label">
 						<span v-if="index" class="h-5 w-px bg-divider" aria-hidden="true" />
 						<FloatingMenu
 							trigger="hover"
@@ -70,12 +76,12 @@
 							:distance="4"
 						>
 							<span tabindex="0" class="cursor-default pb-1 pt-1.5 text-xs">
-								{{ formatMessage(column.label) }}
+								{{ column.label }}
 								<span class="ml-1 tabular-nums text-primary">{{ column.count }}</span>
 							</span>
 							<template #popper>
 								<div class="flex max-w-80 flex-col gap-2 py-1">
-									<span class="font-semibold">{{ formatMessage(column.heading) }}</span>
+									<span class="font-semibold">{{ column.heading }}</span>
 									<QueueProjectList :project-ids="column.projects" :empty-message="column.empty" />
 								</div>
 							</template>
@@ -84,13 +90,11 @@
 				</div>
 			</div>
 			<div class="flex items-center gap-1">
-				<button type="button" class="queue-action" :disabled="busy" @click="exit">
-					{{ formatMessage(messages.exit) }}
-				</button>
+				<button type="button" class="queue-action" :disabled="busy" @click="exit">Exit</button>
 				<span class="mx-1.5 h-5 w-px bg-divider" aria-hidden="true" />
 				<button type="button" class="queue-action" :disabled="disabled || !canGoBack" @click="back">
 					<LeftArrowIcon class="mb-px" />
-					{{ formatMessage(messages.back) }}
+					Back
 				</button>
 				<button
 					type="button"
@@ -98,25 +102,16 @@
 					:disabled="disabled || (!inQueue && !completed)"
 					@click="next"
 				>
-					{{
-						formatMessage(
-							completed ? (remaining.length ? messages.next : messages.finish) : messages.skip,
-						)
-					}}
+					{{ completed ? (remaining.length ? 'Next' : 'Finish') : 'Skip' }}
 					<RightArrowIcon class="mb-px" />
 				</button>
 			</div>
 		</nav>
 	</footer>
-	<TabbedModal
-		ref="settingsModal"
-		:header="formatMessage(commonMessages.settingsLabel)"
-		:tabs="settingsTabs"
-		width="60rem"
-	>
+	<TabbedModal ref="settingsModal" header="Settings" :tabs="settingsTabs" width="60rem">
 		<template v-if="!isLocal" #footer>
 			<p class="m-0 shrink-0 break-words text-xs text-secondary">
-				{{ formatMessage(deploymentMessages.basedOn) }}
+				Based on
 				<a
 					v-if="config.public.owner && config.public.branch"
 					class="hover:underline"
@@ -127,9 +122,7 @@
 					{{ config.public.owner }}/{{ config.public.branch }}
 				</a>
 				@
-				<span v-if="config.public.hash === 'unknown'">{{
-					formatMessage(deploymentMessages.unknownCommit)
-				}}</span>
+				<span v-if="config.public.hash === 'unknown'">unknown</span>
 				<AutoLink
 					v-else
 					class="text-link"
@@ -157,16 +150,7 @@ import {
 	RotateCounterClockwiseIcon,
 	SettingsIcon,
 } from '@modrinth/assets'
-import {
-	AutoLink,
-	Button,
-	commonMessages,
-	defineMessages,
-	FloatingMenu,
-	TabbedModal,
-	type TabbedModalTab,
-	useVIntl,
-} from '@modrinth/ui'
+import { AutoLink, Button, FloatingMenu, TabbedModal, type TabbedModalTab } from '@modrinth/ui'
 import { computed, ref } from 'vue'
 
 import ModerationAppearance from '~/components/ui/moderation/settings/ModerationAppearance.vue'
@@ -175,7 +159,6 @@ import ModerationSettings from '~/components/ui/moderation/settings/ModerationSe
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
 import { injectProjectReviewContext } from './layout/context'
-import { projectReviewMessages as messages } from './messages'
 import QueueProjectList from './queue-project-list.vue'
 import { useReviewShortcut } from './shortcuts'
 
@@ -187,26 +170,31 @@ const isLocal =
 	hostname.endsWith('.localhost') ||
 	hostname.startsWith('127.') ||
 	hostname === '[::1]'
-const deploymentMessages = defineMessages({
-	basedOn: { id: 'moderation.settings.based-on', defaultMessage: 'Based on' },
-	unknownCommit: { id: 'moderation.settings.unknown-commit', defaultMessage: 'unknown' },
-})
 
 const panelMenuOpen = ref(false)
 const settingsModal = ref<InstanceType<typeof TabbedModal> | null>(null)
 const settingsTabs: TabbedModalTab[] = [
 	{
-		name: messages.generalSettings,
+		name: {
+			id: 'moderation.project-review.generalSettings',
+			defaultMessage: 'General',
+		},
 		icon: SettingsIcon,
 		content: ModerationSettings,
 	},
 	{
-		name: messages.appearanceSettings,
+		name: {
+			id: 'moderation.project-review.appearanceSettings',
+			defaultMessage: 'Appearance',
+		},
 		icon: PaletteIcon,
 		content: ModerationAppearance,
 	},
 	{
-		name: messages.keybindsSettings,
+		name: {
+			id: 'moderation.project-review.keybindsSettings',
+			defaultMessage: 'Keybinds',
+		},
 		icon: KeyboardIcon,
 		content: ModerationKeybinds,
 	},
@@ -226,7 +214,7 @@ const {
 	next,
 	exit,
 } = navigation
-const { formatMessage } = useVIntl()
+
 const disabled = computed(() => busy.value || isLoading.value || !queue.hydrated)
 const queueColumns = computed(() => {
 	const current = queue.currentQueue
@@ -234,23 +222,23 @@ const queueColumns = computed(() => {
 	const skippedIds = new Set(current.skipped)
 	return [
 		{
-			label: messages.complete,
-			heading: messages.completedProjects,
-			empty: messages.noCompletedProjects,
+			label: 'Complete',
+			heading: 'Completed projects',
+			empty: 'No completed projects yet',
 			count: current.completed.length,
 			projects: current.projectOrder.filter((id) => completedIds.has(id)),
 		},
 		{
-			label: messages.skipped,
-			heading: messages.skippedProjects,
-			empty: messages.noSkippedProjects,
+			label: 'Skipped',
+			heading: 'Skipped projects',
+			empty: 'No skipped projects',
 			count: current.skipped.length,
 			projects: current.projectOrder.filter((id) => skippedIds.has(id)),
 		},
 		{
-			label: messages.remaining,
-			heading: messages.queuedProjects,
-			empty: messages.noQueuedProjects,
+			label: 'Remaining',
+			heading: 'Next 5 projects',
+			empty: 'No projects in the queue',
 			count: current.items.length,
 			projects: remaining.value.slice(0, 5),
 		},
diff --git a/apps/frontend/src/components/project-review/queue-project-list.vue b/apps/frontend/src/components/project-review/queue-project-list.vue
index d7b95ab2884..720be5fc904 100644
--- a/apps/frontend/src/components/project-review/queue-project-list.vue
+++ b/apps/frontend/src/components/project-review/queue-project-list.vue
@@ -3,8 +3,8 @@
 		<Input
 			v-if="projectIds.length > 6"
 			v-model="search"
-			:placeholder="formatMessage(commonMessages.searchPlaceholder)"
-			:aria-label="formatMessage(commonMessages.searchLabel)"
+			placeholder="Search..."
+			aria-label="Search"
 			size="small"
 		/>
 		<div
@@ -18,31 +18,22 @@
 				</div>
 			</div>
 		</div>
-		<span v-if="indexing" class="text-xs text-secondary">{{
-			formatMessage(messages.searchingProjects)
-		}}</span>
-		<span v-else-if="indexError && search.trim()" class="text-xs text-secondary">{{
-			formatMessage(messages.loadError)
-		}}</span>
+		<span v-if="indexing" class="text-xs text-secondary">Searching projects…</span>
+		<span v-else-if="indexError && search.trim()" class="text-xs text-secondary"
+			>Could not load project data</span
+		>
 		<span v-if="!filteredIds.length && !indexing" class="text-secondary">{{
-			formatMessage(search.trim() ? messages.noMatchingProjects : emptyMessage)
+			search.trim() ? 'No matching projects' : emptyMessage
 		}}</span>
 	</div>
 </template>
 
 <script setup lang="ts">
-import {
-	commonMessages,
-	injectModrinthClient,
-	Input,
-	type MessageDescriptor,
-	useVIntl,
-} from '@modrinth/ui'
+import { injectModrinthClient, Input } from '@modrinth/ui'
 import { useQuery, useQueryClient } from '@tanstack/vue-query'
 import { refDebounced, useVirtualList } from '@vueuse/core'
 import { computed, onScopeDispose, ref, shallowRef, watch } from 'vue'
 
-import { projectReviewMessages as messages } from './messages'
 import {
 	type QueueProjectPreview as ProjectPreview,
 	queueProjectPreviewKey,
@@ -53,11 +44,11 @@ import QueueProjectPreview from './queue-project-preview.vue'
 
 const props = defineProps<{
 	projectIds: string[]
-	emptyMessage: MessageDescriptor
+	emptyMessage: string
 }>()
 const client = injectModrinthClient()
 const queryClient = useQueryClient()
-const { formatMessage } = useVIntl()
+
 const search = ref('')
 const debouncedSearch = refDebounced(search, 250)
 const projects = shallowRef(new Map<string, ProjectPreview>())
diff --git a/apps/frontend/src/components/project-review/queue-project-preview.vue b/apps/frontend/src/components/project-review/queue-project-preview.vue
index 83758f90d05..de9262fe52c 100644
--- a/apps/frontend/src/components/project-review/queue-project-preview.vue
+++ b/apps/frontend/src/components/project-review/queue-project-preview.vue
@@ -9,23 +9,20 @@
 		<Avatar :src="project.icon_url" size="1.25rem" no-shadow />
 		<span class="truncate" :title="project.name">{{ project.name }}</span>
 	</NuxtLink>
-	<span v-else class="text-secondary">{{
-		formatMessage(projectError ? messages.unavailable : commonMessages.loadingLabel)
-	}}</span>
+	<span v-else class="text-secondary">{{ projectError ? 'Unavailable' : 'Loading...' }}</span>
 </template>
 
 <script setup lang="ts">
-import { Avatar, commonMessages, injectModrinthClient, useVIntl } from '@modrinth/ui'
+import { Avatar, injectModrinthClient } from '@modrinth/ui'
 import { useQuery, useQueryClient } from '@tanstack/vue-query'
 import { computed } from 'vue'
 
-import { projectReviewMessages as messages } from './messages'
 import { queueProjectPreviewOptions } from './queue-project-cache'
 
 const props = defineProps<{ projectId: string }>()
 const client = injectModrinthClient()
 const queryClient = useQueryClient()
-const { formatMessage } = useVIntl()
+
 const { data: project, isError: projectError } = useQuery(
 	computed(() => queueProjectPreviewOptions(props.projectId, client, queryClient)),
 )
diff --git a/apps/frontend/src/components/project-review/review-outcome-buttons/index.vue b/apps/frontend/src/components/project-review/review-outcome-buttons/index.vue
index f10b4cf629f..9fa34144508 100644
--- a/apps/frontend/src/components/project-review/review-outcome-buttons/index.vue
+++ b/apps/frontend/src/components/project-review/review-outcome-buttons/index.vue
@@ -5,7 +5,7 @@
 	/>
 	<div v-else-if="project" class="flex shrink-0 flex-wrap gap-1.5">
 		<span v-if="sendIssuesAsThreadMessage" class="w-full text-xs text-secondary">
-			{{ formatMessage(messages.messageMode) }}
+			Send issues as thread message
 		</span>
 		<Button
 			v-for="action in actions"
@@ -21,21 +21,17 @@
 				class="animate-spin"
 				aria-hidden="true"
 			/>
-			{{ formatMessage(action.label) }}
+			{{ action.label }}
 		</Button>
-		<TeleportOverflowMenu
-			:label="formatMessage(commonMessages.moreOptionsButton)"
-			:options="overflowActions"
-			:circular="false"
-		>
+		<TeleportOverflowMenu label="More options" :options="overflowActions" :circular="false">
 			<MoreHorizontalIcon aria-hidden="true" />
 			<template #send-to-review>
 				<ScaleIcon aria-hidden="true" />
-				{{ formatMessage(messages.sendToReview) }}
+				Send to review
 			</template>
 			<template #set-to-draft>
 				<FileTextIcon aria-hidden="true" />
-				{{ formatMessage(messages.setToDraft) }}
+				Set to draft
 			</template>
 		</TeleportOverflowMenu>
 	</div>
@@ -50,13 +46,7 @@ import {
 	SpinnerIcon,
 } from '@modrinth/assets'
 import { moderationSettings } from '@modrinth/moderation'
-import {
-	Button,
-	commonMessages,
-	defineMessages,
-	TeleportOverflowMenu,
-	useVIntl,
-} from '@modrinth/ui'
+import { Button, TeleportOverflowMenu } from '@modrinth/ui'
 import { computed, ref } from 'vue'
 
 import { useModerationSettings } from '~/composables/moderation'
@@ -82,53 +72,25 @@ const {
 } = injectReviewSubmission()
 const { generating } = injectReviewMessages()
 const advancingAction = ref<Parameters<typeof submitDecision>[0]>()
-const { formatMessage } = useVIntl()
-const messages = defineMessages({
-	messageMode: {
-		id: 'project-review.decision.message-mode',
-		defaultMessage: 'Send issues as thread message',
-	},
-	sendIssuesMessage: {
-		id: 'project-review.decision.send-issues-message',
-		defaultMessage: 'Send issues thread message',
-	},
-	approve: { id: 'project-review.decision.approve', defaultMessage: 'Approve' },
-	withhold: {
-		id: 'project-review.decision.withhold',
-		defaultMessage: 'Withhold',
-	},
-	reject: { id: 'project-review.decision.reject', defaultMessage: 'Reject' },
-	sendToReview: {
-		id: 'project-review.decision.send-to-review',
-		defaultMessage: 'Send to review',
-	},
-	setToDraft: {
-		id: 'project-review.decision.set-to-draft',
-		defaultMessage: 'Set to draft',
-	},
-	addIssues: {
-		id: 'project-review.decision.add-issues',
-		defaultMessage: 'Add issues on project',
-	},
-})
+
 const actions = computed(() => [
 	{
 		status: ['approved', 'unlisted', 'private'].includes(project.value?.requested_status ?? '')
 			? project.value!.requested_status!
 			: ('approved' as const),
-		label: messages.approve,
+		label: 'Approve',
 		type: 'colored' as const,
 		color: 'green' as const,
 	},
 	{
 		status: 'withheld' as const,
-		label: messages.withhold,
+		label: 'Withhold',
 		type: 'outlined' as const,
 		color: 'orange' as const,
 	},
 	{
 		status: 'rejected' as const,
-		label: messages.reject,
+		label: 'Reject',
 		type: 'outlined' as const,
 		color: 'red' as const,
 	},
@@ -136,9 +98,7 @@ const actions = computed(() => [
 const overflowActions = computed(() => [
 	{
 		id: 'add-issues',
-		label: formatMessage(
-			sendIssuesAsThreadMessage.value ? messages.sendIssuesMessage : messages.addIssues,
-		),
+		label: sendIssuesAsThreadMessage.value ? 'Send issues thread message' : 'Add issues on project',
 		tone: 'orange' as const,
 		icon: PlusIcon,
 		action: () => submitIssues(),
@@ -151,7 +111,7 @@ const overflowActions = computed(() => [
 	},
 	{
 		id: 'send-to-review',
-		label: formatMessage(messages.sendToReview),
+		label: 'Send to review',
 		tone: 'orange' as const,
 		hoverFilled: true,
 		action: () => submitDecisionAndContinue('processing', false),
@@ -159,7 +119,7 @@ const overflowActions = computed(() => [
 	},
 	{
 		id: 'set-to-draft',
-		label: formatMessage(messages.setToDraft),
+		label: 'Set to draft',
 		tone: 'orange' as const,
 		hoverFilled: true,
 		action: () => submitDecisionAndContinue('draft', false),
diff --git a/apps/frontend/src/components/project-review/review-outcome-buttons/moderation-locked-card.vue b/apps/frontend/src/components/project-review/review-outcome-buttons/moderation-locked-card.vue
index f9b100bc680..4200b51eb16 100644
--- a/apps/frontend/src/components/project-review/review-outcome-buttons/moderation-locked-card.vue
+++ b/apps/frontend/src/components/project-review/review-outcome-buttons/moderation-locked-card.vue
@@ -6,22 +6,19 @@
 	>
 		<Avatar :src="heldBy.avatar_url" :alt="heldBy.username" size="1.75rem" circle no-shadow />
 		<span class="min-w-0 grow break-words text-contrast">
-			<IntlFormatted :message-id="messages.moderating">
-				<template #username>
-					<NuxtLink
-						:to="`/user/${heldBy.username}`"
-						target="_blank"
-						rel="noopener noreferrer"
-						class="font-semibold hover:underline"
-					>
-						{{ heldBy.username }}
-					</NuxtLink>
-				</template>
-			</IntlFormatted>
+			<NuxtLink
+				:to="`/user/${heldBy.username}`"
+				target="_blank"
+				rel="noopener noreferrer"
+				class="font-semibold hover:underline"
+			>
+				{{ heldBy.username }}
+			</NuxtLink>
+			is moderating
 		</span>
 		<IconButton
-			v-tooltip="formatMessage(messages.takeOver)"
-			:label="formatMessage(messages.takeOver)"
+			v-tooltip="'Take over project'"
+			label="Take over project"
 			type="colored"
 			color="orange"
 			size="xs"
@@ -37,7 +34,7 @@
 
 <script setup lang="ts">
 import { LockIcon, SpinnerIcon } from '@modrinth/assets'
-import { Avatar, defineMessages, IconButton, IntlFormatted, useVIntl } from '@modrinth/ui'
+import { Avatar, IconButton } from '@modrinth/ui'
 
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
@@ -47,15 +44,4 @@ defineProps<{
 
 const { lock } = injectProjectReviewPageContext()
 const { heldBy, pending: lockPending } = lock
-const { formatMessage } = useVIntl()
-const messages = defineMessages({
-	moderating: {
-		id: 'project-review.lock.moderating',
-		defaultMessage: '{username} is moderating',
-	},
-	takeOver: {
-		id: 'project-review.lock.take-over',
-		defaultMessage: 'Take over project',
-	},
-})
 </script>
diff --git a/apps/frontend/src/components/project-review/review-panel/controls/index.vue b/apps/frontend/src/components/project-review/review-panel/controls/index.vue
index 240e7a74bd7..90139557e4d 100644
--- a/apps/frontend/src/components/project-review/review-panel/controls/index.vue
+++ b/apps/frontend/src/components/project-review/review-panel/controls/index.vue
@@ -39,9 +39,7 @@
 							"
 							:max-height="240"
 							:min-height="72"
-							:placeholder="
-								control.placeholder ?? formatMessage(controlMessages.markdownPlaceholder)
-							"
+							:placeholder="control.placeholder ?? 'Explain what needs to change…'"
 							hide-markdown-hint
 							@update:model-value="writeControl(control, $event)"
 						/>
@@ -49,7 +47,7 @@
 							v-else-if="control.type === 'text' && control.key === 'correct-slug'"
 							:ref="(field) => setFieldRef(fieldKey(control), field)"
 							:model-value="panels.textValue(panelBinding, control)"
-							:placeholder="control.placeholder || formatMessage(controlMessages.textPlaceholder)"
+							:placeholder="control.placeholder || 'Enter text…'"
 							:disabled="control.disabled"
 							:label="control.label"
 							:required="control.required"
@@ -59,7 +57,7 @@
 							v-else-if="control.type === 'text'"
 							:ref="(field) => setFieldRef(fieldKey(control), field)"
 							:model-value="panels.textValue(panelBinding, control)"
-							:placeholder="control.placeholder || formatMessage(controlMessages.textPlaceholder)"
+							:placeholder="control.placeholder || 'Enter text…'"
 							:disabled="control.disabled"
 							:aria-label="control.label"
 							:aria-required="control.required"
@@ -69,7 +67,7 @@
 							v-else-if="control.type === 'textarea'"
 							:ref="(field) => setFieldRef(fieldKey(control), field)"
 							:model-value="panels.textValue(panelBinding, control)"
-							:placeholder="control.placeholder || formatMessage(controlMessages.textPlaceholder)"
+							:placeholder="control.placeholder || 'Enter text…'"
 							:disabled="control.disabled"
 							:aria-label="control.label"
 							:aria-required="control.required"
@@ -83,7 +81,7 @@
 							:model-value="panels.selectValues(panelBinding, control)"
 							:options="control.options"
 							:max-tag-rows="3"
-							:placeholder="control.placeholder ?? formatMessage(controlMessages.select)"
+							:placeholder="control.placeholder ?? 'Select an option'"
 							:disabled="control.disabled"
 							:aria-label="control.label"
 							:aria-required="control.required"
@@ -98,11 +96,11 @@
 							:options="[
 								{
 									value: '',
-									label: control.placeholder ?? formatMessage(controlMessages.select),
+									label: control.placeholder ?? 'Select an option',
 								},
 								...control.options,
 							]"
-							:placeholder="control.placeholder ?? formatMessage(controlMessages.select)"
+							:placeholder="control.placeholder ?? 'Select an option'"
 							:disabled="control.disabled"
 							:aria-label="control.label"
 							:aria-required="control.required"
@@ -117,7 +115,7 @@
 							class="m-0 ml-0.5 text-xs text-orange"
 							role="status"
 						>
-							{{ formatMessage(controlMessages.required) }}
+							Complete this required field.
 						</p>
 					</div>
 					<MessagePreview
@@ -155,7 +153,7 @@
 						:href="panelBinding.panel.guidanceUrl"
 						target="_blank"
 						rel="noopener noreferrer"
-						:aria-label="formatMessage(messages.openReviewGuidance)"
+						aria-label="Open review guidance in new tab"
 						class="flex text-secondary hover:text-contrast"
 					>
 						<InfoIcon class="size-4" aria-hidden="true" />
@@ -166,7 +164,7 @@
 	</div>
 	<div v-else class="flex items-center gap-2 text-secondary">
 		<p class="m-0 text-base">
-			{{ formatMessage(panelBinding ? messages.noIssues : messages.noReviewActions) }}
+			{{ panelBinding ? 'No issues.' : 'No review actions available for this section' }}
 		</p>
 		<Tooltip
 			v-if="panelBinding && (!panelBinding.panel.title || hideTitle) && panelBinding.panel.hint"
@@ -177,7 +175,7 @@
 				:href="panelBinding.panel.guidanceUrl"
 				target="_blank"
 				rel="noopener noreferrer"
-				:aria-label="formatMessage(messages.openReviewGuidance)"
+				aria-label="Open review guidance in new tab"
 				class="flex text-secondary hover:text-contrast"
 			>
 				<InfoIcon class="size-4" aria-hidden="true" />
@@ -189,15 +187,7 @@
 <script setup lang="ts">
 import { InfoIcon } from '@modrinth/assets'
 import { moderationSettings } from '@modrinth/moderation'
-import {
-	Combobox,
-	defineMessages,
-	Input,
-	MultiSelect,
-	Textarea,
-	Tooltip,
-	useVIntl,
-} from '@modrinth/ui'
+import { Combobox, Input, MultiSelect, Textarea, Tooltip } from '@modrinth/ui'
 import {
 	type ComponentPublicInstance,
 	computed,
@@ -216,7 +206,6 @@ import {
 } from '~/providers/project-review/review-panels'
 import { injectReviewPreviousIssues } from '~/providers/project-review/review-previous-issues'
 
-import { projectReviewMessages as messages } from '../../messages'
 import ActionButton from './action-button.vue'
 import MessagePreview from './message-preview.vue'
 import SlugInput from './slug-input.vue'
@@ -232,25 +221,7 @@ const emit = defineEmits<{
 	'dropdown-close': [key: string]
 }>()
 const id = useId()
-const controlMessages = defineMessages({
-	textPlaceholder: {
-		id: 'project-review.controls.text-placeholder',
-		defaultMessage: 'Enter text…',
-	},
-	markdownPlaceholder: {
-		id: 'project-review.controls.markdown-placeholder',
-		defaultMessage: 'Explain what needs to change…',
-	},
-	select: {
-		id: 'project-review.controls.select',
-		defaultMessage: 'Select an option',
-	},
-	required: {
-		id: 'project-review.controls.required-value',
-		defaultMessage: 'Complete this required field.',
-	},
-})
-const { formatMessage } = useVIntl()
+
 const panels = injectReviewPanels()
 const previousIssues = injectReviewPreviousIssues()
 const settings = useModerationSettings()
diff --git a/apps/frontend/src/components/project-review/review-panel/controls/slug-input.vue b/apps/frontend/src/components/project-review/review-panel/controls/slug-input.vue
index e339c215257..6cd34c853de 100644
--- a/apps/frontend/src/components/project-review/review-panel/controls/slug-input.vue
+++ b/apps/frontend/src/components/project-review/review-panel/controls/slug-input.vue
@@ -19,10 +19,10 @@
 			:class="status.type === 'error' ? 'text-red' : 'text-secondary'"
 			role="status"
 		>
-			{{ formatMessage(status.message) }}
+			{{ status.message }}
 		</p>
 		<div v-if="suggestions.length" class="flex flex-wrap items-center gap-2">
-			<span class="text-sm text-secondary">{{ formatMessage(messages.suggestions) }}</span>
+			<span class="text-sm text-secondary">Suggestions:</span>
 			<TagItem
 				v-for="suggestion in suggestions"
 				:key="suggestion"
@@ -39,7 +39,7 @@
 <script setup lang="ts">
 import { CheckIcon } from '@modrinth/assets'
 import { isValidProjectSlug } from '@modrinth/moderation/src/utils'
-import { defineMessages, injectModrinthClient, Input, TagItem, useVIntl } from '@modrinth/ui'
+import { injectModrinthClient, Input, TagItem } from '@modrinth/ui'
 import { useQuery } from '@tanstack/vue-query'
 import { refDebounced } from '@vueuse/core'
 import { computed, ref, useId, watch } from 'vue'
@@ -61,33 +61,6 @@ const emit = defineEmits<{
 const input = ref<InstanceType<typeof Input> | null>(null)
 defineExpose({ focus: () => input.value?.focus() })
 
-const { formatMessage } = useVIntl()
-const messages = defineMessages({
-	invalid: {
-		id: 'project-review.controls.slug-invalid',
-		defaultMessage: 'Use 3–64 letters, numbers, periods, underscores, or hyphens.',
-	},
-	unchanged: {
-		id: 'project-review.controls.slug-unchanged',
-		defaultMessage: 'Choose a URL different from the current project URL.',
-	},
-	available: {
-		id: 'project-review.controls.slug-available',
-		defaultMessage: 'This project URL is available.',
-	},
-	suggestions: {
-		id: 'project.slug-suggestions.label',
-		defaultMessage: 'Suggestions:',
-	},
-	taken: {
-		id: 'project-review.controls.slug-taken',
-		defaultMessage: 'This project URL is already taken.',
-	},
-	error: {
-		id: 'project-review.controls.slug-error',
-		defaultMessage: 'Unable to check URL availability. Try again.',
-	},
-})
 const statusId = `${useId()}-status`
 const client = injectModrinthClient()
 const { project, members } = injectProjectReviewPageContext()
@@ -122,14 +95,27 @@ const availability = useQuery(
 )
 const resolvedStatus = computed(() => {
 	if (!slug.value) return undefined
-	if (isSuggestion.value) return { type: 'success', message: messages.available }
-	if (!isValidProjectSlug(slug.value)) return { type: 'error', message: messages.invalid }
+	if (isSuggestion.value) return { type: 'success', message: 'This project URL is available.' }
+	if (!isValidProjectSlug(slug.value))
+		return {
+			type: 'error',
+			message: 'Use 3–64 letters, numbers, periods, underscores, or hyphens.',
+		}
 	if (slug.value === project.value?.slug?.toLowerCase())
-		return { type: 'error', message: messages.unchanged }
+		return {
+			type: 'error',
+			message: 'Choose a URL different from the current project URL.',
+		}
 	if (checkedSlug.value !== slug.value) return undefined
-	if (availability.isError.value) return { type: 'error', message: messages.error }
-	if (availability.data.value === true) return { type: 'success', message: messages.available }
-	if (availability.data.value === false) return { type: 'error', message: messages.taken }
+	if (availability.isError.value)
+		return {
+			type: 'error',
+			message: 'Unable to check URL availability. Try again.',
+		}
+	if (availability.data.value === true)
+		return { type: 'success', message: 'This project URL is available.' }
+	if (availability.data.value === false)
+		return { type: 'error', message: 'This project URL is already taken.' }
 	return undefined
 })
 const status = ref<typeof resolvedStatus.value>()
diff --git a/apps/frontend/src/components/project-review/review-panel/findings-count-badge.vue b/apps/frontend/src/components/project-review/review-panel/findings-count-badge.vue
index 6cbe6980b78..7ddb7d1ca89 100644
--- a/apps/frontend/src/components/project-review/review-panel/findings-count-badge.vue
+++ b/apps/frontend/src/components/project-review/review-panel/findings-count-badge.vue
@@ -4,15 +4,12 @@
 		class="pointer-events-none flex h-[18px] min-w-[18px] shrink-0 items-center justify-center rounded-full border border-solid border-highlight-orange bg-highlight-orange px-1 text-xs font-medium leading-none text-orange"
 	>
 		<span aria-hidden="true" class="[text-box:trim-both_cap_alphabetic]">{{ count }}</span>
-		<span class="sr-only">{{ formatMessage(messages.selectedFindings, { count }) }}</span>
+		<span class="sr-only">{{
+			count === 1 ? `${count} selected finding` : `${count} selected findings`
+		}}</span>
 	</span>
 </template>
 
 <script setup lang="ts">
-import { useVIntl } from '@modrinth/ui'
-
-import { projectReviewMessages as messages } from '../messages'
-
 defineProps<{ count: number }>()
-const { formatMessage } = useVIntl()
 </script>
diff --git a/apps/frontend/src/components/project-review/review-panel/index.vue b/apps/frontend/src/components/project-review/review-panel/index.vue
index ea7e44856d2..455615302a4 100644
--- a/apps/frontend/src/components/project-review/review-panel/index.vue
+++ b/apps/frontend/src/components/project-review/review-panel/index.vue
@@ -34,7 +34,7 @@
 							:href="guidanceUrl"
 							target="_blank"
 							rel="noopener noreferrer"
-							:aria-label="formatMessage(messages.openReviewGuidance)"
+							aria-label="Open review guidance in new tab"
 							class="flex text-secondary hover:text-contrast"
 						>
 							<InfoIcon class="size-4" aria-hidden="true" />
@@ -89,7 +89,7 @@
 						:href="guidanceUrl"
 						target="_blank"
 						rel="noopener noreferrer"
-						:aria-label="formatMessage(messages.openReviewGuidance)"
+						aria-label="Open review guidance in new tab"
 						class="flex text-secondary hover:text-contrast"
 					>
 						<InfoIcon class="size-4" aria-hidden="true" />
@@ -107,7 +107,7 @@
 					@dropdown-close="setInlineDropdownOpen($event, false)"
 				/>
 			</template>
-			<p v-else class="m-0 text-secondary">{{ formatMessage(messages.noReviewActions) }}</p>
+			<p v-else class="m-0 text-secondary">No review actions available for this section</p>
 		</Highlight>
 	</component>
 </template>
@@ -115,7 +115,7 @@
 <script setup lang="ts">
 import { InfoIcon } from '@modrinth/assets'
 import { moderationSettings } from '@modrinth/moderation'
-import { Tooltip, useVIntl } from '@modrinth/ui'
+import { Tooltip } from '@modrinth/ui'
 import { useElementHover } from '@vueuse/core'
 import { computed, nextTick, onScopeDispose, shallowRef, useId, watch } from 'vue'
 
@@ -125,7 +125,6 @@ import type { ReviewTarget } from '~/providers/project-review/review'
 import { injectReviewPanels } from '~/providers/project-review/review-panels'
 
 import { injectProjectReviewContext, injectReviewSlot } from '../layout/context'
-import { projectReviewMessages as messages } from '../messages'
 import Anchor from './anchor.vue'
 import { flashReviewElement, injectReviewContext, scrollReviewElement } from './context'
 import Controls from './controls/index.vue'
@@ -165,7 +164,7 @@ const {
 	setDropdownOpen,
 } = reviewContext
 const inlineActive = computed(() => activePanelId.value === id)
-const { formatMessage } = useVIntl()
+
 const settings = useModerationSettings()
 const { flashBackground } = useReviewHighlight()
 const panels = injectReviewPanels()
@@ -222,9 +221,7 @@ onScopeDispose(
 const title = computed(() => panel.value?.title)
 const hint = computed(() => panel.value?.hint)
 const guidanceUrl = computed(() => panel.value?.guidanceUrl)
-const accessibleTitle = computed(() =>
-	formatMessage(messages.reviewSection, { section: title.value ?? hint.value ?? '' }),
-)
+const accessibleTitle = computed(() => `Review ${title.value ?? hint.value ?? ''}`)
 
 function setInlineDropdownOpen(key: string, open: boolean) {
 	const next = new Set(inlineDropdowns.value)
diff --git a/apps/frontend/src/components/project-review/review-panel/popover.vue b/apps/frontend/src/components/project-review/review-panel/popover.vue
index 9d0ccbe8747..0e3fe9269dc 100644
--- a/apps/frontend/src/components/project-review/review-panel/popover.vue
+++ b/apps/frontend/src/components/project-review/review-panel/popover.vue
@@ -21,9 +21,9 @@
 				<slot name="title" />
 				<div class="flex shrink-0 items-center gap-1">
 					<IconButton
-						v-tooltip="formatMessage(pinned ? messages.unpinReview : messages.pinReview)"
+						v-tooltip="pinned ? 'Unpin review controls' : 'Pin review controls'"
 						size="sm"
-						:label="formatMessage(pinned ? messages.unpinReview : messages.pinReview)"
+						:label="pinned ? 'Unpin review controls' : 'Pin review controls'"
 						:aria-pressed="pinned"
 						type="quiet"
 						:color="pinned ? 'green' : undefined"
@@ -31,12 +31,7 @@
 					>
 						<PinIcon />
 					</IconButton>
-					<IconButton
-						size="sm"
-						:label="formatMessage(messages.closeReview)"
-						type="quiet"
-						@click="dismiss()"
-					>
+					<IconButton size="sm" label="Close review controls" type="quiet" @click="dismiss()">
 						<XIcon />
 					</IconButton>
 				</div>
@@ -51,16 +46,14 @@
 <script setup lang="ts">
 import { autoUpdate, flip, offset, shift, size, useFloating } from '@floating-ui/vue'
 import { PinIcon, XIcon } from '@modrinth/assets'
-import { IconButton, useVIntl } from '@modrinth/ui'
+import { IconButton } from '@modrinth/ui'
 import { computed, nextTick, onBeforeUnmount, shallowRef, watch } from 'vue'
 
 import { useFloatingReviewPanelAppearance } from '~/composables/floating-review-panel-appearance'
 
-import { projectReviewMessages as messages } from '../messages'
 import { useReviewEventListener } from '../shortcuts'
 import { injectReviewContext, type ReviewAnchor } from './context'
 
-const { formatMessage } = useVIntl()
 const { style: appearanceStyle } = useFloatingReviewPanelAppearance()
 const props = defineProps<{
 	anchor: ReviewAnchor
diff --git a/apps/frontend/src/components/project-review/review-panel/re-review-findings-count-badge.vue b/apps/frontend/src/components/project-review/review-panel/re-review-findings-count-badge.vue
index 53d48711ef3..d2acdf97813 100644
--- a/apps/frontend/src/components/project-review/review-panel/re-review-findings-count-badge.vue
+++ b/apps/frontend/src/components/project-review/review-panel/re-review-findings-count-badge.vue
@@ -5,16 +5,14 @@
 	>
 		<TagCategoryRefreshCcwIcon class="size-3 shrink-0 text-orange" aria-hidden="true" />
 		<span aria-hidden="true">{{ count }}</span>
-		<span class="sr-only">{{ formatMessage(messages.reReviewFindings, { count }) }}</span>
+		<span class="sr-only">{{
+			count === 1 ? `${count} re-review item` : `${count} re-review items`
+		}}</span>
 	</span>
 </template>
 
 <script setup lang="ts">
 import { TagCategoryRefreshCcwIcon } from '@modrinth/assets'
-import { useVIntl } from '@modrinth/ui'
-
-import { projectReviewMessages as messages } from '../messages'
 
 defineProps<{ count: number }>()
-const { formatMessage } = useVIntl()
 </script>
diff --git a/apps/frontend/src/components/project-review/slicer/index.vue b/apps/frontend/src/components/project-review/slicer/index.vue
index 9b7d8233d18..6e7e9c7a832 100644
--- a/apps/frontend/src/components/project-review/slicer/index.vue
+++ b/apps/frontend/src/components/project-review/slicer/index.vue
@@ -2,34 +2,31 @@
 	<div v-if="frameSrc" class="relative flex h-full min-h-0 flex-col gap-2">
 		<PageLoadingBar :key="target?.key" :loading="loadingFiles" />
 		<div v-if="loadFailed && !loadingFiles" role="alert" class="flex items-center gap-2">
-			<p class="m-0">{{ formatMessage(messages.loadError) }}</p>
-			<Button @click="retry">{{ formatMessage(messages.retry) }}</Button>
+			<p class="m-0">Could not load project data</p>
+			<Button @click="retry">Retry</Button>
 		</div>
 		<iframe
 			:key="frameKey"
 			ref="frame"
 			:src="frameSrc"
-			:title="formatMessage(messages.slicer)"
+			title="Slicer"
 			:aria-busy="loadingFiles"
 			allow="clipboard-read; clipboard-write"
 			class="block min-h-0 w-full flex-1 rounded-xl border border-solid border-surface-4 bg-surface-1"
 		/>
 	</div>
-	<p v-else-if="isLoading || versionsQuery.isPending.value" role="status" class="m-0">
-		{{ formatMessage(messages.loading) }}
-	</p>
-	<p v-else class="m-0 text-secondary">{{ formatMessage(messages.emptyVersions) }}</p>
+	<p v-else-if="isLoading || versionsQuery.isPending.value" role="status" class="m-0">Loading...</p>
+	<p v-else class="m-0 text-secondary">No versions</p>
 </template>
 
 <script setup lang="ts">
-import { Button, PageLoadingBar, useVIntl } from '@modrinth/ui'
+import { Button, PageLoadingBar } from '@modrinth/ui'
 import { onScopeDispose, ref, useTemplateRef, watch } from 'vue'
 
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 import { injectReviewSlicer, type SlicerTarget } from '~/providers/project-review/review-slicer'
 
 import { injectProjectReviewContext, injectReviewPanelVisible } from '../layout/context'
-import { projectReviewMessages as messages } from '../messages'
 import { useReviewEventListener } from '../shortcuts'
 import bridgeSource from './bridge.js?raw'
 import {
@@ -43,7 +40,6 @@ const SLICER_ORIGIN = 'https://slicer.run'
 const BRIDGE_SOURCE = 'modrinth-slicer-bridge'
 const HANDSHAKE_TIMEOUT_MS = 15_000
 
-const { formatMessage } = useVIntl()
 const { isLoading, versionsQuery } = injectProjectReviewPageContext()
 const { target, openRequests, loadingFiles } = injectReviewSlicer()
 const { openTab } = injectProjectReviewContext()
@@ -105,7 +101,13 @@ function send(next: SlicerTarget) {
 	loadingFiles.value = true
 	loadFailed.value = false
 	targetWindow.postMessage(
-		{ source: BRIDGE_SOURCE, type: 'load', id: ++requestId, files: next.files, entry: next.entry },
+		{
+			source: BRIDGE_SOURCE,
+			type: 'load',
+			id: ++requestId,
+			files: next.files,
+			entry: next.entry,
+		},
 		SLICER_ORIGIN,
 	)
 }
diff --git a/apps/frontend/src/components/project-review/tech-review/index.vue b/apps/frontend/src/components/project-review/tech-review/index.vue
index 9b576c09e9b..6fc46f8d8bf 100644
--- a/apps/frontend/src/components/project-review/tech-review/index.vue
+++ b/apps/frontend/src/components/project-review/tech-review/index.vue
@@ -2,36 +2,33 @@
 	<div
 		class="flex min-w-0 flex-col gap-1 rounded-lg border border-solid border-surface-4 bg-surface-2 p-3"
 	>
-		<p v-if="!selection" class="m-0 text-secondary">
-			{{ formatMessage(messages.empty) }}
-		</p>
+		<p v-if="!selection" class="m-0 text-secondary">No project selected</p>
 		<div v-else-if="error || reportsQuery.isError.value" role="alert">
-			<p class="m-0">{{ formatMessage(messages.loadError) }}</p>
-			<Button @click="retry">{{ formatMessage(messages.retry) }}</Button>
+			<p class="m-0">Could not load project data</p>
+			<Button @click="retry">Retry</Button>
 		</div>
 		<p v-else-if="isLoading || reportsQuery.isPending.value" role="status" class="m-0">
-			{{ formatMessage(messages.loading) }}
+			Loading...
 		</p>
 		<p v-else-if="!reports.length" class="m-0 text-secondary">
-			{{ formatMessage(messages.noReports) }}
+			No technical-review reports are available for this project
 		</p>
 		<template v-else-if="project">
 			<p class="m-0 text-sm text-secondary">
-				{{ formatMessage(messages.reviewProgress) }}
+				Reviewed flags indicate progress, not a safe verdict. Files without flags have no flag
+				verdict
 			</p>
 			<template v-if="selectedFile">
 				<div class="flex flex-wrap items-center justify-between gap-2">
-					<Button @click="selectedFileId = null"
-						><LeftArrowIcon />{{ formatMessage(messages.backToFiles) }}</Button
-					>
+					<Button @click="selectedFileId = null"><LeftArrowIcon />Back to files</Button>
 					<TechRevFileActions :file="selectedFile" />
 				</div>
 				<h3 class="m-0 break-all text-lg font-semibold text-contrast">
 					{{ selectedFile.file_name }}
 				</h3>
 				<div v-if="sourceQueries.some((query) => query.isError)" role="alert">
-					<p class="m-0">{{ formatMessage(messages.sourceError) }}</p>
-					<Button @click="retrySources">{{ formatMessage(messages.retry) }}</Button>
+					<p class="m-0">Could not load source code. Try opening the flag again</p>
+					<Button @click="retrySources">Retry</Button>
 				</div>
 				<TechRevFileDetailTab
 					:key="selectedFile.id"
@@ -44,11 +41,7 @@
 			</template>
 			<template v-else>
 				<h3 class="m-0 text-lg font-semibold text-contrast">
-					{{
-						formatMessage(messages.pendingFiles, {
-							count: pendingReports.length,
-						})
-					}}
+					{{ `Pending files (${pendingReports.length})` }}
 				</h3>
 				<TechRevFilesTab
 					v-if="pendingReports.length"
@@ -56,16 +49,10 @@
 					:project="project"
 					@view-flags="selectFile"
 				/>
-				<p v-else class="m-0 text-secondary">
-					{{ formatMessage(messages.noPendingFiles) }}
-				</p>
+				<p v-else class="m-0 text-secondary">No files with unresolved flags</p>
 				<details v-if="completedReports.length">
 					<summary class="cursor-pointer py-3 font-semibold text-contrast">
-						{{
-							formatMessage(messages.completedFiles, {
-								count: completedReports.length,
-							})
-						}}
+						{{ `Reviewed files (${completedReports.length})` }}
 					</summary>
 					<TechRevFilesTab
 						:reports="completedReports"
@@ -75,11 +62,7 @@
 				</details>
 				<details v-if="unflaggedReports.length">
 					<summary class="cursor-pointer py-3 font-semibold text-contrast">
-						{{
-							formatMessage(messages.noFlagsFiles, {
-								count: unflaggedReports.length,
-							})
-						}}
+						{{ `Files without flags (${unflaggedReports.length})` }}
 					</summary>
 					<TechRevFilesTab
 						:reports="unflaggedReports"
@@ -94,7 +77,7 @@
 
 <script setup lang="ts">
 import { LeftArrowIcon } from '@modrinth/assets'
-import { Button, injectModrinthClient, useVIntl } from '@modrinth/ui'
+import { Button, injectModrinthClient } from '@modrinth/ui'
 import { useQueries } from '@tanstack/vue-query'
 import { computed, provide, ref } from 'vue'
 
@@ -105,9 +88,6 @@ import type { FlattenedFileReport } from '~/components/ui/moderation/tech-review
 import { TECH_REVIEW_DECISIONS_KEY } from '~/components/ui/moderation/tech-review/use-tech-review-decisions'
 import { injectProjectReviewPageContext } from '~/providers/project-review'
 
-import { projectReviewMessages as messages } from '../messages'
-
-const { formatMessage } = useVIntl()
 const client = injectModrinthClient()
 const {
 	selection,
diff --git a/apps/frontend/src/components/project-review/versions/index.vue b/apps/frontend/src/components/project-review/versions/index.vue
index 5c7fb48af60..ea1063e23ab 100644
--- a/apps/frontend/src/components/project-review/versions/index.vue
+++ b/apps/frontend/src/components/project-review/versions/index.vue
@@ -33,15 +33,15 @@
 						class="flex flex-wrap items-center gap-x-6 gap-y-2 pl-2.5"
 					>
 						<h2 class="m-0 flex items-center gap-2 text-sm font-semibold text-secondary">
-							{{ formatMessage(messages.versions) }}
+							Versions
 							<span class="text-contrast">{{ versions.length }}</span>
 						</h2>
 						<span class="flex items-center gap-2 text-sm font-semibold text-secondary">
-							{{ formatMessage(messages.files) }}
+							Files
 							<span class="text-contrast">{{ fileCount }}</span>
 						</span>
 						<span class="flex items-center gap-2 text-sm font-semibold text-secondary">
-							{{ formatMessage(messages.withheld) }}
+							Withheld
 							<span :class="withheldCount ? 'text-orange' : 'text-contrast'">{{
 								withheldCount
 							}}</span>
@@ -58,23 +58,19 @@
 						>
 							<ListChevronsDownUpIcon v-if="allExpanded" aria-hidden="true" />
 							<ListChevronsUpDownIcon v-else aria-hidden="true" />
-							{{ formatMessage(allExpanded ? messages.collapseAll : messages.expandAll) }}
+							{{ allExpanded ? 'Collapse all' : 'Expand all' }}
 						</Button>
 					</div>
 				</div>
-				<p v-if="!selection" class="m-0 text-secondary">
-					{{ formatMessage(messages.empty) }}
-				</p>
+				<p v-if="!selection" class="m-0 text-secondary">No project selected</p>
 				<div v-else-if="error || versionsQuery.isError.value" role="alert">
-					<p class="m-0">{{ formatMessage(messages.loadError) }}</p>
-					<Button @click="retry">{{ formatMessage(messages.retry) }}</Button>
+					<p class="m-0">Could not load project data</p>
+					<Button @click="retry">Retry</Button>
 				</div>
 				<p v-else-if="isLoading || versionsQuery.isPending.value" role="status" class="m-0">
-					{{ formatMessage(messages.loading) }}
-				</p>
-				<p v-else-if="!versions.length" class="m-0 text-secondary">
-					{{ formatMessage(messages.emptyVersions) }}
+					Loading...
 				</p>
+				<p v-else-if="!versions.length" class="m-0 text-secondary">No versions</p>
 				<template v-else>
 					<VersionCard
 						v-for="version in versions"
@@ -95,7 +91,7 @@
 <script setup lang="ts">
 import { ListChevronsDownUpIcon, ListChevronsUpDownIcon } from '@modrinth/assets'
 import { moderationSettings } from '@modrinth/moderation'
-import { Button, useVIntl } from '@modrinth/ui'
+import { Button } from '@modrinth/ui'
 import { useQueryClient } from '@tanstack/vue-query'
 import { computed, ref, useTemplateRef } from 'vue'
 
@@ -106,12 +102,10 @@ import { injectProjectReviewPageContext } from '~/providers/project-review'
 import { injectReviewPanels } from '~/providers/project-review/review-panels'
 import type { ManageVersionHost } from '~/providers/version/manage-version-modal'
 
-import { projectReviewMessages as messages } from '../messages'
 import ReviewPanel from '../review-panel/index.vue'
 import ModpackTools from './modpack-tools.vue'
 import VersionCard from './version-card.vue'
 
-const { formatMessage } = useVIntl()
 const { resolve } = injectReviewPanels()
 const interactionScope = useTemplateRef<HTMLElement>('interactionScope')
 const { selection, projectV2, versions, versionsQuery, isLoading, error, refresh } =
diff --git a/apps/frontend/src/components/project-review/versions/modpack-tools.vue b/apps/frontend/src/components/project-review/versions/modpack-tools.vue
index 9f3cf95311e..5c1ec0cff11 100644
--- a/apps/frontend/src/components/project-review/versions/modpack-tools.vue
+++ b/apps/frontend/src/components/project-review/versions/modpack-tools.vue
@@ -3,13 +3,13 @@
 		<ModpackScanModal ref="scanModal" :project_id="project.id" />
 		<TeleportOverflowMenu
 			type="quiet"
-			:label="formatMessage(messages.tools)"
+			label="Modpack tools"
 			:options="actions"
 			:icon-only="false"
 			:circular="false"
 			:disabled="isLoading || !!error || pending"
 		>
-			{{ formatMessage(messages.tools) }}
+			Modpack tools
 			<ChevronDownIcon aria-hidden="true" />
 		</TeleportOverflowMenu>
 	</template>
@@ -18,13 +18,10 @@
 <script setup lang="ts">
 import { ChevronDownIcon, FileArchiveIcon, FolderSearchIcon, ScanEyeIcon } from '@modrinth/assets'
 import {
-	commonMessages,
-	defineMessages,
 	injectLoadingState,
 	injectModrinthClient,
 	injectNotificationManager,
 	TeleportOverflowMenu,
-	useVIntl,
 } from '@modrinth/ui'
 import { computed, ref, useTemplateRef } from 'vue'
 
@@ -37,65 +34,27 @@ const emit = defineEmits<{
 }>()
 const { project, versions, versionsQuery, isLoading, error } = injectProjectReviewPageContext()
 const { pending } = injectReviewSubmission()
-const { formatMessage } = useVIntl()
+
 const client = injectModrinthClient()
 const { addNotification } = injectNotificationManager()
 const loadingState = injectLoadingState()
 const scanModal = useTemplateRef<InstanceType<typeof ModpackScanModal>>('scanModal')
 const isCheckingModpackArchives = ref(false)
-const messages = defineMessages({
-	tools: {
-		id: 'project-review.versions.modpack-tools',
-		defaultMessage: 'Modpack tools',
-	},
-	viewC2paInfo: {
-		id: 'project-review.versions.view-c2pa-info',
-		defaultMessage: 'View C2PA Info',
-	},
-	rescanModpack: {
-		id: 'project.actions.rescan-modpack',
-		defaultMessage: 'Rescan modpack',
-	},
-	checkModpackArchives: {
-		id: 'project.actions.check-modpack-archives',
-		defaultMessage: 'Check modpack unzip',
-	},
-	checkingModpackArchives: {
-		id: 'project.actions.checking-modpack-archives',
-		defaultMessage: 'Checking...',
-	},
-	checkModpackArchivesSuccess: {
-		id: 'project.notification.check-modpack-archives.success',
-		defaultMessage:
-			'{count, plural, one {The modpack file can be unzipped.} other {All # modpack files can be unzipped.}}',
-	},
-	checkModpackArchivesFailed: {
-		id: 'project.notification.check-modpack-archives.failed',
-		defaultMessage: 'Some modpack files could not be unzipped',
-	},
-	checkModpackArchivesNoFiles: {
-		id: 'project.notification.check-modpack-archives.no-files',
-		defaultMessage: 'No .mrpack files were found for this project.',
-	},
-})
+
 const c2paUrls = computed(() => [
 	...new Set(versions.value.flatMap((version) => version.files.map((file) => file.url))),
 ])
 const actions = computed(() => [
 	{
 		id: 'rescan-modpack',
-		label: formatMessage(messages.rescanModpack),
+		label: 'Rescan modpack',
 		icon: FolderSearchIcon,
 		tone: 'orange' as const,
 		action: () => scanModal.value?.show(),
 	},
 	{
 		id: 'check-modpack-archives',
-		label: formatMessage(
-			isCheckingModpackArchives.value
-				? messages.checkingModpackArchives
-				: messages.checkModpackArchives,
-		),
+		label: isCheckingModpackArchives.value ? 'Checking...' : 'Check modpack unzip',
 		icon: FileArchiveIcon,
 		tone: 'orange' as const,
 		disabled: isCheckingModpackArchives.value,
@@ -103,7 +62,7 @@ const actions = computed(() => [
 	},
 	{
 		id: 'view-c2pa-info',
-		label: formatMessage(messages.viewC2paInfo),
+		label: 'View C2PA Info',
 		icon: ScanEyeIcon,
 		tone: 'orange' as const,
 		disabled:
@@ -130,8 +89,8 @@ async function checkModpackArchives() {
 
 		if (files.length === 0) {
 			addNotification({
-				title: formatMessage(commonMessages.errorNotificationTitle),
-				text: formatMessage(messages.checkModpackArchivesNoFiles),
+				title: 'An error occurred',
+				text: 'No .mrpack files were found for this project.',
 				type: 'error',
 			})
 			return
@@ -158,7 +117,7 @@ async function checkModpackArchives() {
 
 		if (failures.length > 0) {
 			addNotification({
-				title: formatMessage(messages.checkModpackArchivesFailed),
+				title: 'Some modpack files could not be unzipped',
 				text: failures.map((failure) => `${failure.filename}: ${failure.error}`).join('\n'),
 				type: 'error',
 			})
@@ -166,13 +125,16 @@ async function checkModpackArchives() {
 		}
 
 		addNotification({
-			title: formatMessage(commonMessages.successLabel),
-			text: formatMessage(messages.checkModpackArchivesSuccess, { count: files.length }),
+			title: 'Success',
+			text:
+				files.length === 1
+					? 'The modpack file can be unzipped.'
+					: `All ${files.length} modpack files can be unzipped.`,
 			type: 'success',
 		})
 	} catch (error) {
 		addNotification({
-			title: formatMessage(commonMessages.errorNotificationTitle),
+			title: 'An error occurred',
 			text: error instanceof Error ? error.message : String(error),
 			type: 'error',
 		})
diff --git a/apps/frontend/src/components/project-review/versions/version-card.vue b/apps/frontend/src/components/project-review/versions/version-card.vue
index 519228230cb..3642d50476f 100644
--- a/apps/frontend/src/components/project-review/versions/version-card.vue
+++ b/apps/frontend/src/components/project-review/versions/version-card.vue
@@ -8,7 +8,7 @@
 			<div class="mt-0.5 flex min-w-0 flex-1 flex-wrap items-center gap-2">
 				<VersionChannelIndicator
 					:channel="version.version_type"
-					:title="formatMessage(commonMessages[version.version_type])"
+					:title="versionChannels[version.version_type]"
 					size="sm"
 				/>
 				<TagTagItem v-for="loader in platforms" :key="loader" :tag="loader" />
@@ -17,22 +17,22 @@
 				<TagItem
 					v-if="withheld"
 					class="!border-orange-highlight !bg-orange-highlight font-semibold capitalize !text-orange"
-					>{{ formatMessage(messages.withheld) }}</TagItem
+					>Withheld</TagItem
 				>
 				<TagItem v-if="version.status !== 'listed'">{{
-					formatMessage(messages[version.status] ?? messages.unknown)
+					versionLabels[version.status] ?? 'Unknown'
 				}}</TagItem>
 			</div>
 			<div class="ml-auto flex flex-wrap items-center justify-end gap-1.5 text-sm text-secondary">
 				<span>{{
-					formatMessage(messages.dependencyCount, {
-						count: version.dependencies.length,
-					})
+					version.dependencies.length === 1
+						? `${version.dependencies.length} dep`
+						: `${version.dependencies.length} deps`
 				}}</span>
 				<BulletDivider aria-hidden="true" />
 				<span
 					class="inline-flex items-center gap-1"
-					:title="`${formatMessage(messages.downloads)}: ${formatNumber(version.downloads)}`"
+					:title="`${'Downloads'}: ${formatNumber(version.downloads)}`"
 				>
 					<DownloadIcon class="size-4" aria-hidden="true" />{{
 						formatCompactNumber(version.downloads)
@@ -46,8 +46,8 @@
 					<EditVersionMenu v-if="editable" color="default" size="sm" @edit="emit('edit', $event)" />
 					<Button
 						v-if="version.files.length"
-						v-tooltip="formatMessage(messages.openVersionSlicer)"
-						:aria-label="formatMessage(messages.openVersionSlicer)"
+						v-tooltip="'Open files in Slicer'"
+						aria-label="Open files in Slicer"
 						:loading="loadingSlicerButton === 'version'"
 						type="quiet"
 						circular
@@ -63,9 +63,9 @@
 						<CoffeeIcon v-else aria-hidden="true" />
 					</Button>
 					<ButtonLink
-						v-tooltip="formatMessage(messages.viewVersion)"
+						v-tooltip="'View version'"
 						:to="versionHref"
-						:aria-label="formatMessage(messages.viewVersion)"
+						aria-label="View version"
 						target="_blank"
 						type="quiet"
 						circular
@@ -92,16 +92,12 @@
 					</div>
 					<div class="flex flex-wrap items-center gap-0.5 text-sm text-secondary">
 						<span v-if="!file.primary" class="mr-1">{{
-							formatMessage(
-								file.file_type && file.file_type !== 'unknown'
-									? fileTypeMessages[file.file_type]
-									: messages.unknown,
-							)
+							file.file_type && file.file_type !== 'unknown' ? fileTypes[file.file_type] : 'Unknown'
 						}}</span>
 						<TeleportOverflowMenu
 							type="quiet"
 							size="sm"
-							:label="formatMessage(commonMessages.moreOptionsButton)"
+							label="More options"
 							:options="fileActions(file)"
 						>
 							<template #open-slicer="{ option }">
@@ -127,9 +123,7 @@
 				@on-close="expanded && emit('toggle')"
 			>
 				<template #title>
-					<span class="text-primary">
-						{{ formatMessage(messages.details) }}
-					</span>
+					<span class="text-primary"> Details </span>
 				</template>
 				<div
 					:id="`review-version-${version.id}`"
@@ -139,23 +133,15 @@
 						<dl
 							class="m-0 mt-1 grid min-w-0 grid-cols-[minmax(0,max-content)_minmax(0,1fr)] items-baseline gap-x-4 gap-y-3"
 						>
-							<dt class="font-medium text-secondary">
-								{{ formatMessage(messages.versionNumber) }}
-							</dt>
+							<dt class="font-medium text-secondary">Version Number</dt>
 							<dd class="m-0 min-w-0 break-all">
 								{{ version.version_number }}
 							</dd>
-							<dt class="font-medium text-secondary">
-								{{ formatMessage(messages.versionSubtitle) }}
-							</dt>
+							<dt class="font-medium text-secondary">Version Subtitle</dt>
 							<dd class="m-0 min-w-0 break-words">{{ version.name }}</dd>
-							<dt class="font-medium text-secondary">
-								{{ formatMessage(messages.versionId) }}
-							</dt>
+							<dt class="font-medium text-secondary">Version ID</dt>
 							<dd class="m-0 min-w-0"><CopyCode :text="version.id" /></dd>
-							<dt class="self-center font-medium text-secondary">
-								{{ formatMessage(messages.publishedBy) }}
-							</dt>
+							<dt class="self-center font-medium text-secondary">Published by</dt>
 							<dd class="m-0 min-w-0 self-center break-words">
 								<NuxtLink
 									:to="`/user/${version.author_id}`"
@@ -188,20 +174,14 @@
 									:aria-controls="`review-version-dependencies-${version.id}`"
 									@click="dependenciesOpen = !dependenciesOpen"
 								>
-									{{ formatMessage(messages.dependencies) }} ({{
-										formatNumber(version.dependencies.length)
-									}})
+									Dependencies ({{ formatNumber(version.dependencies.length) }})
 									<DropdownIcon
 										class="size-4 shrink-0 transition-transform duration-150 motion-reduce:transition-none"
 										:class="{ 'rotate-180': dependenciesOpen }"
 										aria-hidden="true"
 									/>
 								</button>
-								<span v-else>
-									{{ formatMessage(messages.dependencies) }} ({{
-										formatNumber(version.dependencies.length)
-									}})
-								</span>
+								<span v-else> Dependencies ({{ formatNumber(version.dependencies.length) }}) </span>
 							</h3>
 							<div
 								:id="`review-version-dependencies-${version.id}`"
@@ -218,27 +198,25 @@
 										v-if="version.dependencies.length > 8"
 										v-model="dependencySearch"
 										:icon="SearchIcon"
-										:placeholder="formatMessage(messages.searchDependencies)"
-										:aria-label="formatMessage(messages.searchDependencies)"
+										placeholder="Search dependencies…"
+										aria-label="Search dependencies…"
 										wrapper-class="mb-2 mt-1 w-full"
 										clearable
 									/>
 									<div class="mb-2.5 max-h-[360px] overflow-y-auto">
 										<p v-if="!version.dependencies.length" class="m-0 text-secondary">
-											{{ formatMessage(messages.emptyDependencies) }}
+											No dependencies
 										</p>
 										<p v-else-if="dependenciesQuery.isPending.value" role="status" class="m-0">
-											{{ formatMessage(messages.loading) }}
+											Loading...
 										</p>
 										<div v-else-if="dependenciesQuery.isError.value" role="alert">
-											<p class="m-0">{{ formatMessage(messages.loadError) }}</p>
-											<Button @click="dependenciesQuery.refetch()">{{
-												formatMessage(messages.retry)
-											}}</Button>
+											<p class="m-0">Could not load project data</p>
+											<Button @click="dependenciesQuery.refetch()">Retry</Button>
 										</div>
 										<div v-else class="flex flex-col gap-1.5">
 											<p v-if="!filteredDependencies.length" class="m-0 text-secondary">
-												{{ formatMessage(messages.noMatchingDependencies) }}
+												No matching dependencies
 											</p>
 											<div
 												v-for="(context, index) in filteredDependencies"
@@ -272,7 +250,7 @@
 														>{{ context.version.version_number }}</span
 													>
 													<TagItem class="text-xs">{{
-														formatMessage(messages[context.dependency.dependency_type])
+														versionLabels[context.dependency.dependency_type]
 													}}</TagItem>
 												</div>
 											</div>
@@ -290,26 +268,20 @@
 							button-class="sticky top-0 z-10 w-full cursor-pointer border-0 bg-surface-2 py-2 text-left text-sm font-medium hover:[&>div]:brightness-125 [&>div>svg]:ml-0 [&>div>svg]:size-4"
 						>
 							<template #title>
-								<span class="text-primary">{{ formatMessage(messages.changelog) }}</span>
+								<span class="text-primary">Changelog</span>
 							</template>
 							<div class="mb-1 max-h-[360px] overflow-y-auto">
 								<ProjectPageDescription :description="detailQuery.data.value.changelog" />
 							</div>
 						</Accordion>
 						<div v-else class="mb-1">
-							<h3 class="m-0 py-2 text-sm font-medium text-primary">
-								{{ formatMessage(messages.changelog) }}
-							</h3>
-							<p v-if="detailQuery.isPending.value" role="status" class="m-0">
-								{{ formatMessage(messages.loading) }}
-							</p>
+							<h3 class="m-0 py-2 text-sm font-medium text-primary">Changelog</h3>
+							<p v-if="detailQuery.isPending.value" role="status" class="m-0">Loading...</p>
 							<div v-else-if="detailQuery.isError.value" role="alert">
-								<p class="m-0">{{ formatMessage(messages.loadError) }}</p>
-								<Button @click="detailQuery.refetch()">{{ formatMessage(messages.retry) }}</Button>
+								<p class="m-0">Could not load project data</p>
+								<Button @click="detailQuery.refetch()">Retry</Button>
 							</div>
-							<p v-else class="m-0 text-secondary">
-								{{ formatMessage(messages.emptyChangelog) }}
-							</p>
+							<p v-else class="m-0 text-secondary">No changelog</p>
 						</div>
 					</section>
 				</div>
@@ -340,10 +312,8 @@ import {
 	Button,
 	ButtonLink,
 	type ButtonMenuOption,
-	commonMessages,
 	CopyCode,
 	type DependencyContext,
-	fileTypeMessages,
 	injectModrinthClient,
 	injectTags,
 	Input,
@@ -351,12 +321,6 @@ import {
 	TagItem,
 	TagTagItem,
 	TeleportOverflowMenu,
-	useCompactNumber,
-	useFormatBytes,
-	useFormatDateTime,
-	useFormatNumber,
-	useRelativeTime,
-	useVIntl,
 	VersionChannelIndicator,
 } from '@modrinth/ui'
 import EnvironmentTags from '@modrinth/ui/src/components/project/EnvironmentTags.vue'
@@ -372,9 +336,38 @@ import { injectProjectReviewPageContext } from '~/providers/project-review'
 import { injectReviewSlicer } from '~/providers/project-review/review-slicer'
 import type { EditVersionStage } from '~/providers/version/manage-version-modal'
 
-import { projectReviewMessages as messages } from '../messages'
+import {
+	createDateFormatter,
+	createRelativeTimeFormatter,
+	formatBytes,
+	formatCompactNumber,
+	formatNumber,
+} from '../format'
 import { useReviewInteraction } from '../shortcuts'
 
+const versionLabels = {
+	listed: 'Listed',
+	archived: 'Archived',
+	draft: 'Draft',
+	unlisted: 'Unlisted',
+	scheduled: 'Scheduled',
+	unknown: 'Unknown',
+	required: 'Required',
+	optional: 'Optional',
+	incompatible: 'Incompatible',
+	embedded: 'Embedded',
+}
+const versionChannels = { release: 'Release', beta: 'Beta', alpha: 'Alpha' }
+const fileTypes = {
+	primary: 'Primary',
+	unknown: 'Other',
+	'required-resource-pack': 'Required resource pack',
+	'optional-resource-pack': 'Optional resource pack',
+	'sources-jar': 'Sources jar',
+	'dev-jar': 'Dev jar',
+	'javadoc-jar': 'Javadocs jar',
+	signature: 'Signature file',
+}
 const props = defineProps<{
 	version: Labrinth.Versions.v3.Version
 	expanded: boolean
@@ -385,15 +378,12 @@ const emit = defineEmits<{
 	edit: [stage: EditVersionStage]
 	'scan-ai': [url: string]
 }>()
-const { formatMessage } = useVIntl()
-const formatDateTime = useFormatDateTime({
+
+const formatDateTime = createDateFormatter({
 	dateStyle: 'long',
 	timeStyle: 'short',
 })
-const formatNumber = useFormatNumber()
-const { formatCompactNumber } = useCompactNumber()
-const relativeTime = useRelativeTime({ style: 'narrow' })
-const formatBytes = useFormatBytes()
+const relativeTime = createRelativeTimeFormatter({ style: 'narrow' })
 const client = injectModrinthClient()
 const tags = injectTags(null)
 const { project, members } = injectProjectReviewPageContext()
@@ -476,7 +466,12 @@ const authorQuery = useQuery({
 	enabled: computed(() => props.expanded && !memberAuthor.value),
 })
 const author = computed(() => memberAuthor.value ?? authorQuery.data.value)
-const dependencyTypeOrder = { required: 0, optional: 1, incompatible: 2, embedded: 3 }
+const dependencyTypeOrder = {
+	required: 0,
+	optional: 1,
+	incompatible: 2,
+	embedded: 3,
+}
 function dependencyName(context: DependencyContext) {
 	return (
 		context.project?.title ??
@@ -541,18 +536,18 @@ function fileActions(file: VersionFile): ButtonMenuOption[] {
 	const options: ButtonMenuOption[] = [
 		{
 			id: 'view-c2pa-info',
-			label: formatMessage(messages.viewC2paInfo),
+			label: 'View C2PA info',
 			icon: ScanEyeIcon,
 			action: () => emit('scan-ai', file.url),
 		},
 		{
 			id: 'open-slicer',
-			label: formatMessage(messages.openSlicer),
+			label: 'Open in Slicer',
 			icon: CoffeeIcon,
 			disabled: loadingSlicerButton.value === file.url,
 			action: () => openInSlicer([file.url], file.url),
 			trailingAction: {
-				label: formatMessage(messages.slicerOpenExternal),
+				label: 'Open in Slicer in a new tab',
 				icon: ExternalIcon,
 				action: (event) => {
 					const element = event.currentTarget as HTMLElement
@@ -570,9 +565,7 @@ function fileActions(file: VersionFile): ButtonMenuOption[] {
 		if (!hash) continue
 		options.push({
 			id: `copy-${algorithm}`,
-			label: formatMessage(messages.copyHash, {
-				algorithm: algorithm === 'sha1' ? 'SHA-1' : 'SHA-512',
-			}),
+			label: `Copy ${algorithm === 'sha1' ? 'SHA-1' : 'SHA-512'}`,
 			icon: ClipboardCopyIcon,
 			action: () => navigator.clipboard.writeText(hash),
 		})
@@ -580,7 +573,7 @@ function fileActions(file: VersionFile): ButtonMenuOption[] {
 	options.push({
 		id: 'download',
 		type: 'link',
-		label: formatMessage(messages.download),
+		label: 'Download',
 		icon: DownloadIcon,
 		href: file.url,
 		download: file.filename,
diff --git a/apps/frontend/src/components/ui/moderation/settings/ModerationAppearanceThemes.vue b/apps/frontend/src/components/ui/moderation/settings/ModerationAppearanceThemes.vue
index 8edf3a46a02..208996543bb 100644
--- a/apps/frontend/src/components/ui/moderation/settings/ModerationAppearanceThemes.vue
+++ b/apps/frontend/src/components/ui/moderation/settings/ModerationAppearanceThemes.vue
@@ -4,7 +4,6 @@ import { Button, defineMessages, NewModal, Textarea, useVIntl } from '@modrinth/
 import { ref, useId } from 'vue'
 
 import { useModerationAppearanceTheme, useModerationSettings } from '~/composables/moderation'
-
 import { applyAppearance, exportAppearance, parseAppearance } from '~/helpers/moderation-appearance'
 
 const settings = useModerationSettings()
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/AiDisclosureCard.vue b/apps/frontend/src/components/ui/project-settings/disclosures/AiDisclosureCard.vue
index a7d021c6d4d..6b075bbed16 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/AiDisclosureCard.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/AiDisclosureCard.vue
@@ -6,7 +6,6 @@ import {
 	defineMessages,
 	disclosureAiUsageMessages,
 	IntlFormatted,
-	MultiSelect,
 	normalizeChildren,
 	SettingsFormGroup,
 	useVIntl,
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureLockControls.vue b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureLockControls.vue
index 49a0d7a239e..dc0491e2e5f 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureLockControls.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/DisclosureLockControls.vue
@@ -62,9 +62,9 @@ const options = computed(() =>
 <template>
 	<Combobox
 		v-if="compact"
+		v-tooltip="formatMessage(messages.changeLockStatus)"
 		:model-value="lockStatus"
 		:options="options"
-		v-tooltip="formatMessage(messages.changeLockStatus)"
 		:aria-label="formatMessage(messages.changeLockStatus)"
 		:disabled="disabled"
 		class="!w-8 shrink-0"
diff --git a/apps/frontend/src/components/ui/project-settings/disclosures/ProjectReviewDisclosureCard.vue b/apps/frontend/src/components/ui/project-settings/disclosures/ProjectReviewDisclosureCard.vue
index 8af1aedb1a8..8b6c96820c9 100644
--- a/apps/frontend/src/components/ui/project-settings/disclosures/ProjectReviewDisclosureCard.vue
+++ b/apps/frontend/src/components/ui/project-settings/disclosures/ProjectReviewDisclosureCard.vue
@@ -1,9 +1,7 @@
 <script setup lang="ts">
-import { Button, commonMessages, Toggle, useVIntl } from '@modrinth/ui'
+import { Button, Toggle } from '@modrinth/ui'
 import { type Component, computed, useId } from 'vue'
 
-import { disclosureStatusMessages } from './messages'
-
 import EditButton from '~/components/project-review/project-info/edit/button.vue'
 
 const props = defineProps<{
@@ -23,7 +21,7 @@ const props = defineProps<{
 }>()
 const enabled = defineModel<boolean>({ required: true })
 const titleId = useId()
-const { formatMessage } = useVIntl()
+
 const isToggleLocked = computed(() => !!props.disabled || (!!props.toggleDisabled && enabled.value))
 </script>
 
@@ -74,7 +72,7 @@ const isToggleLocked = computed(() => !!props.disabled || (!!props.toggleDisable
 		>
 			<div v-if="editing" class="absolute right-4 top-2 flex justify-end gap-1.5">
 				<Button type="quiet" size="xs" :disabled="disabled" @click.stop="onCancelEditing?.()">
-					{{ formatMessage(commonMessages.cancelButton) }}
+					Cancel
 				</Button>
 				<Button
 					type="colored"
@@ -84,7 +82,7 @@ const isToggleLocked = computed(() => !!props.disabled || (!!props.toggleDisable
 					:disabled="disabled || !sectionCanSave"
 					@click.stop="onSaveEditing?.()"
 				>
-					{{ formatMessage(commonMessages.saveButton) }}
+					Save
 				</Button>
 			</div>
 			<div v-if="onToggleEditing && !editing" class="absolute right-4 top-4 flex">
@@ -95,7 +93,7 @@ const isToggleLocked = computed(() => !!props.disabled || (!!props.toggleDisable
 			</div>
 			<template v-if="editing">
 				<p v-if="sectionSaveError" role="alert" class="m-0 text-red">
-					{{ formatMessage(disclosureStatusMessages.saveError) }}
+					Could not save all disclosure changes. Your edits have been kept. Try saving again.
 				</p>
 				<p v-if="sectionSaveDisabledReason?.length" role="alert" class="m-0 text-orange">
 					{{ sectionSaveDisabledReason.join(' ') }}
diff --git a/apps/frontend/src/composables/floating-review-panel-appearance.ts b/apps/frontend/src/composables/floating-review-panel-appearance.ts
index 918da68d8e3..106ca7ff2e0 100644
--- a/apps/frontend/src/composables/floating-review-panel-appearance.ts
+++ b/apps/frontend/src/composables/floating-review-panel-appearance.ts
@@ -13,7 +13,8 @@ export function useFloatingReviewPanelAppearance() {
 		const tint = `color-mix(in srgb, ${background} ${opacity}%, transparent)`
 		return {
 			borderColor:
-				settings.value.get(general.FloatingReviewPanelBorderColor) || 'var(--color-orange-highlight)',
+				settings.value.get(general.FloatingReviewPanelBorderColor) ||
+				'var(--color-orange-highlight)',
 			borderWidth: `${settings.value.get(general.FloatingReviewPanelBorderWidth)}px`,
 			backgroundColor: 'var(--surface-1)',
 			backgroundImage: `linear-gradient(${tint}, ${tint})`,
diff --git a/apps/frontend/src/composables/moderation.ts b/apps/frontend/src/composables/moderation.ts
index 7103abc12e6..becf030aa2b 100644
--- a/apps/frontend/src/composables/moderation.ts
+++ b/apps/frontend/src/composables/moderation.ts
@@ -3,9 +3,9 @@ import { computed } from 'vue'
 
 import type { CookieOptions } from '#app'
 import {
+	type AppearanceValues,
 	defaultAppearance,
 	parseAppearance,
-	type AppearanceValues,
 } from '~/helpers/moderation-appearance'
 import { FrontendNotificationManager } from '~/providers/frontend-notifications'
 
diff --git a/apps/frontend/src/locales/en-US/index.json b/apps/frontend/src/locales/en-US/index.json
index 322dd5b5f75..3883939a6fb 100644
--- a/apps/frontend/src/locales/en-US/index.json
+++ b/apps/frontend/src/locales/en-US/index.json
@@ -3029,30 +3029,6 @@
   "layout.publish.email-verification-required.title": {
     "message": "Email verification required"
   },
-  "markdown-editor.placeholders.empty": {
-    "message": "No matching placeholders."
-  },
-  "markdown-editor.placeholders.label": {
-    "message": "Placeholders"
-  },
-  "markdown-editor.placeholders.search": {
-    "message": "Search placeholders…"
-  },
-  "markdown-editor.templates.empty-all": {
-    "message": "No matching messages or placeholders."
-  },
-  "markdown-editor.templates.insert": {
-    "message": "Insert message"
-  },
-  "markdown-editor.templates.library": {
-    "message": "Message Library"
-  },
-  "markdown-editor.templates.search-all": {
-    "message": "Search messages and placeholders…"
-  },
-  "markdown-editor.templates.section": {
-    "message": "Template messages"
-  },
   "messages.noResults": {
     "message": "No results found for your query!"
   },
@@ -3080,6 +3056,45 @@
   "modal.shared-instance.open-in-app.why-use": {
     "message": "Why use the Modrinth App"
   },
+  "moderation.appearance.apply": {
+    "message": "Apply theme"
+  },
+  "moderation.appearance.copied": {
+    "message": "Copied!"
+  },
+  "moderation.appearance.copy": {
+    "message": "Copy JSON"
+  },
+  "moderation.appearance.copy-error": {
+    "message": "Could not copy automatically. Select and copy the JSON below."
+  },
+  "moderation.appearance.download": {
+    "message": "Download JSON"
+  },
+  "moderation.appearance.export": {
+    "message": "Export theme"
+  },
+  "moderation.appearance.export-help": {
+    "message": "Copy your appearance as JSON or download it to share or import later."
+  },
+  "moderation.appearance.file": {
+    "message": "Choose JSON file"
+  },
+  "moderation.appearance.file-error": {
+    "message": "Could not read this file. Choose a JSON file smaller than 64 KB."
+  },
+  "moderation.appearance.import": {
+    "message": "Import theme"
+  },
+  "moderation.appearance.import-help": {
+    "message": "Paste theme JSON or choose a JSON file, then apply it to preview your appearance."
+  },
+  "moderation.appearance.invalid": {
+    "message": "Invalid theme. Use a version 1 review appearance export with all seven values, valid hex colors, opacity from 0–100, and border width from 0–8."
+  },
+  "moderation.appearance.json": {
+    "message": "Theme JSON"
+  },
   "moderation.c2pa-scan.failed": {
     "message": "Failed to scan for AI-generated files."
   },
@@ -3155,6 +3170,48 @@
   "moderation.keybinds.title": {
     "message": "Keybinds"
   },
+  "moderation.keybinds.transfer.apply": {
+    "message": "Apply keybinds"
+  },
+  "moderation.keybinds.transfer.copied": {
+    "message": "Copied!"
+  },
+  "moderation.keybinds.transfer.copy": {
+    "message": "Copy JSON"
+  },
+  "moderation.keybinds.transfer.copy-error": {
+    "message": "Could not copy automatically. Select and copy the JSON below."
+  },
+  "moderation.keybinds.transfer.download": {
+    "message": "Download JSON"
+  },
+  "moderation.keybinds.transfer.export": {
+    "message": "Export keybinds"
+  },
+  "moderation.keybinds.transfer.export-help": {
+    "message": "Copy your custom keybinds as JSON or download them to share or import later."
+  },
+  "moderation.keybinds.transfer.file": {
+    "message": "Choose JSON file"
+  },
+  "moderation.keybinds.transfer.file-error": {
+    "message": "Could not read this file. Choose a JSON file smaller than 64 KB."
+  },
+  "moderation.keybinds.transfer.import": {
+    "message": "Import keybinds"
+  },
+  "moderation.keybinds.transfer.import-help": {
+    "message": "Paste keybind JSON or choose a JSON file. Applying replaces your keybinds; omitted actions return to defaults."
+  },
+  "moderation.keybinds.transfer.invalid": {
+    "message": "Invalid keybinds. Use a version 1 review keybind export with known action IDs, arrays of key definitions, and boolean modifiers."
+  },
+  "moderation.keybinds.transfer.json": {
+    "message": "Keybind JSON"
+  },
+  "moderation.keybinds.transfer.too-large": {
+    "message": "These keybinds exceed the space available in your saved moderation settings. Reduce the number of custom bindings and try again."
+  },
   "moderation.moderate": {
     "message": "Moderate"
   },
@@ -3176,893 +3233,77 @@
   "moderation.page.technicalReview": {
     "message": "Tech review"
   },
-  "moderation.project-review.actions": {
-    "message": "Actions"
-  },
   "moderation.project-review.approvedCount": {
     "message": "{count} approved"
   },
-  "moderation.project-review.archived": {
-    "message": "Archived"
-  },
   "moderation.project-review.archivedCount": {
     "message": "{count} archived"
   },
-  "moderation.project-review.author": {
-    "message": "Author"
-  },
-  "moderation.project-review.back": {
-    "message": "Back"
-  },
-  "moderation.project-review.backToFiles": {
-    "message": "Back to files"
-  },
-  "moderation.project-review.changelog": {
-    "message": "Changelog"
-  },
-  "moderation.project-review.closePopoutWindows": {
-    "message": "Close popout windows"
-  },
-  "moderation.project-review.closeReview": {
-    "message": "Close review controls"
-  },
-  "moderation.project-review.collapseAll": {
-    "message": "Collapse all"
-  },
-  "moderation.project-review.collapseVersion": {
-    "message": "Hide details"
-  },
-  "moderation.project-review.compatibility": {
-    "message": "Compatibility"
-  },
-  "moderation.project-review.complete": {
-    "message": "Complete"
-  },
-  "moderation.project-review.completedFiles": {
-    "message": "Reviewed files ({count})"
-  },
-  "moderation.project-review.completedProjects": {
-    "message": "Completed projects"
-  },
-  "moderation.project-review.conversationThread": {
-    "message": "Conversation thread"
-  },
-  "moderation.project-review.copyHash": {
-    "message": "Copy {algorithm}"
-  },
-  "moderation.project-review.copyValue": {
-    "message": "Copy: {value}"
-  },
-  "moderation.project-review.created": {
-    "message": "Created"
-  },
-  "moderation.project-review.customLicense": {
-    "message": "Custom"
-  },
-  "moderation.project-review.customSlug": {
-    "message": "Differs from the project name"
-  },
-  "moderation.project-review.dependencies": {
-    "message": "Dependencies"
-  },
-  "moderation.project-review.dependencyCount": {
-    "message": "{count, plural, one {# dep} other {# deps}}"
-  },
-  "moderation.project-review.description": {
-    "message": "Description"
-  },
-  "moderation.project-review.details": {
-    "message": "Details"
-  },
-  "moderation.project-review.details.privateDescription": {
-    "message": "Not publicly visible. Only accessible to project members."
-  },
-  "moderation.project-review.details.publicDescription": {
-    "message": "Visible via URL, on your profile, and in search."
-  },
-  "moderation.project-review.details.unlistedDescription": {
-    "message": "Visible via URL only. Not shown on your profile or in search."
-  },
-  "moderation.project-review.disclosures": {
-    "message": "Disclosures"
-  },
-  "moderation.project-review.discord": {
-    "message": "Discord invite"
-  },
-  "moderation.project-review.dockPanel": {
-    "message": "Return panel to workspace"
-  },
-  "moderation.project-review.donationBmac": {
-    "message": "Buy Me A Coffee"
-  },
-  "moderation.project-review.donationGithub": {
-    "message": "GitHub Sponsors"
-  },
-  "moderation.project-review.donationKoFi": {
-    "message": "Ko-fi"
-  },
-  "moderation.project-review.donationOther": {
-    "message": "Other"
-  },
-  "moderation.project-review.donationPatreon": {
-    "message": "Patreon"
-  },
-  "moderation.project-review.donationPaypal": {
-    "message": "PayPal"
-  },
-  "moderation.project-review.download": {
-    "message": "Download"
-  },
-  "moderation.project-review.downloads": {
-    "message": "Downloads"
-  },
-  "moderation.project-review.draft": {
-    "message": "Draft"
-  },
   "moderation.project-review.draftCount": {
     "message": "{count} draft"
   },
-  "moderation.project-review.edit.remove-icon": {
-    "message": "Remove icon"
-  },
-  "moderation.project-review.edit.upload-icon": {
-    "message": "Upload icon"
-  },
-  "moderation.project-review.editSection": {
-    "message": "Edit {section}"
-  },
-  "moderation.project-review.embedded": {
-    "message": "Embedded"
-  },
-  "moderation.project-review.empty": {
-    "message": "No project selected"
-  },
-  "moderation.project-review.emptyChangelog": {
-    "message": "No changelog"
-  },
-  "moderation.project-review.emptyDependencies": {
-    "message": "No dependencies"
-  },
-  "moderation.project-review.emptyDescription": {
-    "message": "No description"
-  },
-  "moderation.project-review.emptyEnvironments": {
-    "message": "No environments"
-  },
-  "moderation.project-review.emptyGallery": {
-    "message": "No gallery images"
-  },
-  "moderation.project-review.emptyLinks": {
-    "message": "No links"
-  },
-  "moderation.project-review.emptyPlatforms": {
-    "message": "No platforms"
-  },
-  "moderation.project-review.emptyPopout": {
-    "message": "No tabs open in this panel"
-  },
-  "moderation.project-review.emptyTags": {
-    "message": "No tags"
-  },
-  "moderation.project-review.emptyVersions": {
-    "message": "No versions"
-  },
-  "moderation.project-review.environments": {
-    "message": "Environments"
-  },
-  "moderation.project-review.exit": {
-    "message": "Exit"
-  },
-  "moderation.project-review.expandAll": {
-    "message": "Expand all"
-  },
-  "moderation.project-review.expandVersion": {
-    "message": "Show details"
-  },
-  "moderation.project-review.featured": {
-    "message": "Featured"
-  },
-  "moderation.project-review.fileCount": {
-    "message": "{count, plural, one {# file} other {# files}}"
-  },
-  "moderation.project-review.files": {
-    "message": "Files"
-  },
-  "moderation.project-review.finish": {
-    "message": "Finish"
-  },
-  "moderation.project-review.gallery": {
-    "message": "Gallery"
-  },
-  "moderation.project-review.gameVersions": {
-    "message": "Game versions"
-  },
-  "moderation.project-review.generalSettings": {
-    "message": "General"
-  },
-  "moderation.project-review.hashes": {
-    "message": "Hashes"
-  },
-  "moderation.project-review.hideLeft": {
-    "message": "Hide project details"
-  },
-  "moderation.project-review.hideRight": {
-    "message": "Hide panel"
-  },
-  "moderation.project-review.icon": {
-    "message": "Icon"
-  },
-  "moderation.project-review.imageNumber": {
-    "message": "Image {number}"
-  },
-  "moderation.project-review.incompatible": {
-    "message": "Incompatible"
-  },
-  "moderation.project-review.issues": {
-    "message": "Issue tracker"
-  },
-  "moderation.project-review.keepPopoutClosed": {
-    "message": "Keep closed"
-  },
-  "moderation.project-review.keybindsSettings": {
-    "message": "Keybinds"
-  },
-  "moderation.project-review.left": {
-    "message": "Project details"
-  },
-  "moderation.project-review.license": {
-    "message": "License"
-  },
-  "moderation.project-review.licenseUrl": {
-    "message": "License URL"
-  },
-  "moderation.project-review.link-info.active": {
-    "message": "Active"
-  },
-  "moderation.project-review.link-info.activity": {
-    "message": "Activity"
-  },
-  "moderation.project-review.link-info.archived": {
-    "message": "This repository is archived; its features may be read-only."
-  },
-  "moderation.project-review.link-info.archivedValue": {
-    "message": "Archived"
-  },
-  "moderation.project-review.link-info.author": {
-    "message": "Author"
-  },
-  "moderation.project-review.link-info.board": {
-    "message": "Board"
-  },
-  "moderation.project-review.link-info.bot": {
-    "message": "Bot"
-  },
-  "moderation.project-review.link-info.channel": {
-    "message": "Channel"
-  },
-  "moderation.project-review.link-info.closedIssues": {
-    "message": "Closed issues"
-  },
-  "moderation.project-review.link-info.community": {
-    "message": "Community"
-  },
-  "moderation.project-review.link-info.company": {
-    "message": "Company"
-  },
-  "moderation.project-review.link-info.created": {
-    "message": "Account created"
-  },
-  "moderation.project-review.link-info.detailTooltip": {
-    "message": "{label}: {value}"
-  },
-  "moderation.project-review.link-info.disabled": {
-    "message": "Disabled"
-  },
-  "moderation.project-review.link-info.discussions": {
-    "message": "Discussions"
-  },
-  "moderation.project-review.link-info.discussionsDisabled": {
-    "message": "Discussions are disabled."
-  },
-  "moderation.project-review.link-info.dm": {
-    "message": "DM link"
-  },
-  "moderation.project-review.link-info.document": {
-    "message": "Document"
-  },
-  "moderation.project-review.link-info.donation": {
-    "message": "Donation profile"
-  },
-  "moderation.project-review.link-info.downloads": {
-    "message": "Downloads"
-  },
-  "moderation.project-review.link-info.enabled": {
-    "message": "Enabled"
-  },
-  "moderation.project-review.link-info.expires": {
-    "message": "Expires"
-  },
-  "moderation.project-review.link-info.externalLinks": {
-    "message": "External links on this page"
-  },
-  "moderation.project-review.link-info.followers": {
-    "message": "Followers"
-  },
-  "moderation.project-review.link-info.forkOf": {
-    "message": "Fork of"
-  },
-  "moderation.project-review.link-info.forks": {
-    "message": "Forks"
-  },
-  "moderation.project-review.link-info.invite": {
-    "message": "Server invite"
-  },
-  "moderation.project-review.link-info.inviteExpired": {
-    "message": "This invite has expired."
-  },
-  "moderation.project-review.link-info.inviteExpires": {
-    "message": "This invite has an expiry date."
-  },
-  "moderation.project-review.link-info.inviter": {
-    "message": "Invited by"
-  },
-  "moderation.project-review.link-info.issues": {
-    "message": "Issues"
-  },
-  "moderation.project-review.link-info.issuesDisabled": {
-    "message": "Issues are disabled."
-  },
-  "moderation.project-review.link-info.language": {
-    "message": "Language"
-  },
-  "moderation.project-review.link-info.lastPush": {
-    "message": "Last push"
-  },
-  "moderation.project-review.link-info.license": {
-    "message": "License"
-  },
-  "moderation.project-review.link-info.loading": {
-    "message": "Loading link details…"
-  },
-  "moderation.project-review.link-info.maxUses": {
-    "message": "Use limit"
-  },
-  "moderation.project-review.link-info.members": {
-    "message": "Members"
-  },
-  "moderation.project-review.link-info.noExpiry": {
-    "message": "No expiry"
-  },
-  "moderation.project-review.link-info.notFound": {
-    "message": "This resource was not found. It may be private, deleted, or expired."
-  },
-  "moderation.project-review.link-info.online": {
-    "message": "Online"
-  },
-  "moderation.project-review.link-info.openIssues": {
-    "message": "Open issues"
-  },
-  "moderation.project-review.link-info.organization": {
-    "message": "Organization"
-  },
-  "moderation.project-review.link-info.owner": {
-    "message": "Owner"
-  },
-  "moderation.project-review.link-info.playlist": {
-    "message": "Playlist"
-  },
-  "moderation.project-review.link-info.privateCommunity": {
-    "message": "This community is private."
-  },
-  "moderation.project-review.link-info.project": {
-    "message": "Project"
-  },
-  "moderation.project-review.link-info.projectStatus": {
-    "message": "Project status: {status}"
-  },
-  "moderation.project-review.link-info.projectUnavailable": {
-    "message": "This project is not publicly available or is archived. Check its status below."
-  },
-  "moderation.project-review.link-info.repositories": {
-    "message": "Public repositories"
-  },
-  "moderation.project-review.link-info.repository": {
-    "message": "Repository"
-  },
-  "moderation.project-review.link-info.role": {
-    "message": "Role"
-  },
-  "moderation.project-review.link-info.server": {
-    "message": "Server"
-  },
-  "moderation.project-review.link-info.size": {
-    "message": "Repository size"
-  },
-  "moderation.project-review.link-info.sponsors": {
-    "message": "Sponsors"
-  },
-  "moderation.project-review.link-info.stars": {
-    "message": "Stars"
-  },
-  "moderation.project-review.link-info.status": {
-    "message": "Status"
-  },
-  "moderation.project-review.link-info.stream": {
-    "message": "Stream"
-  },
-  "moderation.project-review.link-info.subscribers": {
-    "message": "Subscribers"
-  },
-  "moderation.project-review.link-info.target": {
-    "message": "Invite type"
-  },
-  "moderation.project-review.link-info.topic": {
-    "message": "Topic"
-  },
-  "moderation.project-review.link-info.unavailable": {
-    "message": "Additional details could not be loaded. The service may be unavailable, private, rate limited, or blocked by the browser."
-  },
-  "moderation.project-review.link-info.unlimitedUses": {
-    "message": "Unlimited uses"
-  },
-  "moderation.project-review.link-info.unsupported": {
-    "message": "No additional public metadata is available for this link."
-  },
-  "moderation.project-review.link-info.user": {
-    "message": "User"
-  },
-  "moderation.project-review.link-info.uses": {
-    "message": "Uses"
-  },
-  "moderation.project-review.link-info.video": {
-    "message": "Video"
-  },
-  "moderation.project-review.link-info.website": {
-    "message": "Website"
-  },
-  "moderation.project-review.link-info.wiki": {
-    "message": "Wiki"
-  },
-  "moderation.project-review.link-info.wikiDisabled": {
-    "message": "The wiki is disabled."
-  },
-  "moderation.project-review.linkRemoved": {
-    "message": "Link removed: {link}"
-  },
-  "moderation.project-review.linkUnavailable": {
-    "message": "Link unavailable"
-  },
-  "moderation.project-review.links": {
-    "message": "Links"
-  },
-  "moderation.project-review.listed": {
-    "message": "Listed"
-  },
-  "moderation.project-review.loadError": {
-    "message": "Could not load project data"
-  },
-  "moderation.project-review.loading": {
-    "message": "Loading..."
-  },
-  "moderation.project-review.matchesName": {
-    "message": "Matches the project name"
-  },
-  "moderation.project-review.memberCount": {
-    "message": "{count, plural, one {# member} other {# members}}"
-  },
-  "moderation.project-review.members": {
-    "message": "Members"
-  },
-  "moderation.project-review.modpack": {
-    "message": "Modpack"
-  },
-  "moderation.project-review.modpackVersion": {
-    "message": "Version {version}"
-  },
-  "moderation.project-review.monetization": {
-    "message": "Monetization"
-  },
-  "moderation.project-review.monetizationStatus": {
-    "message": "{status, select, monetized {Monetized} demonetized {Demonetized} forceDemonetized {Force demonetized} other {Unknown}}"
-  },
-  "moderation.project-review.monetizationValue": {
-    "message": "{status, select, monetized {Enabled} demonetized {Disabled} forceDemonetized {Force disabled} other {Unknown}}"
-  },
-  "moderation.project-review.mrpack": {
-    "message": ".mrpack"
-  },
-  "moderation.project-review.next": {
-    "message": "Next"
-  },
-  "moderation.project-review.noCompletedProjects": {
-    "message": "No completed projects yet"
-  },
-  "moderation.project-review.noFlagsFiles": {
-    "message": "Files without flags ({count})"
-  },
-  "moderation.project-review.noIssues": {
-    "message": "No issues."
-  },
-  "moderation.project-review.noLicense": {
-    "message": "No license URL"
-  },
-  "moderation.project-review.noMatchingDependencies": {
-    "message": "No matching dependencies"
-  },
-  "moderation.project-review.noMatchingProjects": {
-    "message": "No matching projects"
-  },
-  "moderation.project-review.noPendingFiles": {
-    "message": "No files with unresolved flags"
-  },
-  "moderation.project-review.noQueuedProjects": {
-    "message": "No projects in the queue"
-  },
-  "moderation.project-review.noReports": {
-    "message": "No technical-review reports are available for this project"
-  },
-  "moderation.project-review.noReviewActions": {
-    "message": "No review actions available for this section"
-  },
-  "moderation.project-review.noSelectedIssues": {
-    "message": "No issues added. Select issues while reviewing the project to see the message here."
-  },
-  "moderation.project-review.noServerAddress": {
-    "message": "No address."
-  },
-  "moderation.project-review.noServerLanguages": {
-    "message": "No languages."
-  },
-  "moderation.project-review.noSkippedProjects": {
-    "message": "No skipped projects"
-  },
-  "moderation.project-review.openIcon": {
-    "message": "View enlarged project icon"
-  },
-  "moderation.project-review.openImage": {
-    "message": "Open image {number}"
-  },
-  "moderation.project-review.openImageInNewTab": {
-    "message": "Open image in new tab"
-  },
-  "moderation.project-review.openMemberAvatar": {
-    "message": "View enlarged avatar for {username}"
-  },
-  "moderation.project-review.openOrganizationIcon": {
-    "message": "View enlarged icon for {organization}"
-  },
-  "moderation.project-review.openReviewGuidance": {
-    "message": "Open review guidance in new tab"
-  },
-  "moderation.project-review.openSlicer": {
-    "message": "Open in Slicer"
-  },
-  "moderation.project-review.openVersionSlicer": {
-    "message": "Open files in Slicer"
-  },
-  "moderation.project-review.optional": {
-    "message": "Optional"
-  },
-  "moderation.project-review.organization": {
-    "message": "Organization"
-  },
-  "moderation.project-review.owner": {
-    "message": "Owner"
-  },
-  "moderation.project-review.panelLayout": {
-    "message": "Panel layout"
-  },
-  "moderation.project-review.pendingFiles": {
-    "message": "Pending files ({count})"
-  },
-  "moderation.project-review.permalink": {
-    "message": "Perma link"
-  },
-  "moderation.project-review.permissions": {
-    "message": "Permissions"
-  },
-  "moderation.project-review.permissionsPlaceholder": {
-    "message": "Permissions review is coming soon"
-  },
-  "moderation.project-review.pinReview": {
-    "message": "Pin review controls"
-  },
-  "moderation.project-review.platforms": {
-    "message": "Platforms"
-  },
-  "moderation.project-review.popoutFailed": {
-    "message": "Could not open the panel window"
-  },
-  "moderation.project-review.popoutPanel": {
-    "message": "Open panel in its own window"
-  },
-  "moderation.project-review.post-approval": {
-    "message": "Post-approval"
-  },
-  "moderation.project-review.previousLink": {
-    "message": "Previous link: {url}"
-  },
-  "moderation.project-review.primary": {
-    "message": "Primary file"
-  },
   "moderation.project-review.privateCount": {
     "message": "{count} private"
   },
   "moderation.project-review.processingCount": {
     "message": "{count} under review"
   },
-  "moderation.project-review.project": {
-    "message": "Project"
-  },
-  "moderation.project-review.projectId": {
-    "message": "Project ID"
-  },
-  "moderation.project-review.projectTitle": {
-    "message": "Title"
-  },
-  "moderation.project-review.projectType": {
-    "message": "Type"
-  },
-  "moderation.project-review.published": {
-    "message": "Published"
-  },
-  "moderation.project-review.publishedBy": {
-    "message": "Published by"
-  },
-  "moderation.project-review.queueError": {
-    "message": "Could not change projects. Please try again"
-  },
-  "moderation.project-review.queueNavigation": {
-    "message": "Review queue navigation"
-  },
-  "moderation.project-review.queuedProjects": {
-    "message": "Next 5 projects"
-  },
-  "moderation.project-review.re-review": {
-    "message": "Re-review"
-  },
-  "moderation.project-review.reReviewFindings": {
-    "message": "{count, plural, one {# re-review item} other {# re-review items}}"
-  },
-  "moderation.project-review.recommended": {
-    "message": "(Recommended)"
-  },
   "moderation.project-review.rejectedCount": {
     "message": "{count} rejected"
   },
-  "moderation.project-review.remaining": {
-    "message": "Remaining"
-  },
-  "moderation.project-review.reopenPopouts": {
-    "message": "Reopen window"
-  },
-  "moderation.project-review.requesting": {
-    "message": "Requesting"
-  },
-  "moderation.project-review.required": {
-    "message": "Required"
-  },
-  "moderation.project-review.reset": {
-    "message": "Reset"
-  },
-  "moderation.project-review.resetPanelLayout": {
-    "message": "Reset panel layout"
-  },
-  "moderation.project-review.resolvePermissions": {
-    "message": "Review redistribution permissions"
-  },
-  "moderation.project-review.restorePopouts": {
-    "message": "Popout window closed"
-  },
-  "moderation.project-review.restorePopoutsDescription": {
-    "message": "Panels from this window have been moved to the main window: {panels}."
-  },
-  "moderation.project-review.retry": {
-    "message": "Retry"
-  },
-  "moderation.project-review.reupload": {
-    "message": "Reupload"
-  },
-  "moderation.project-review.reviewIssues": {
-    "message": "Issues"
-  },
-  "moderation.project-review.reviewProgress": {
-    "message": "Reviewed flags indicate progress, not a safe verdict. Files without flags have no flag verdict"
-  },
-  "moderation.project-review.reviewScope": {
-    "message": "These selections apply to the {stage} review for the whole project"
-  },
-  "moderation.project-review.reviewSection": {
-    "message": "Review {section}"
-  },
-  "moderation.project-review.right": {
-    "message": "Right panel"
-  },
-  "moderation.project-review.saveProject": {
-    "message": "Save project"
-  },
-  "moderation.project-review.scheduled": {
-    "message": "Scheduled"
-  },
   "moderation.project-review.scheduledCount": {
     "message": "{count} scheduled"
   },
-  "moderation.project-review.searchDependencies": {
-    "message": "Search dependencies…"
-  },
-  "moderation.project-review.searchingProjects": {
-    "message": "Searching projects…"
-  },
-  "moderation.project-review.selectedFindings": {
-    "message": "{count, plural, one {# selected finding} other {# selected findings}}"
-  },
-  "moderation.project-review.serverAddress": {
-    "message": "Address"
-  },
-  "moderation.project-review.serverAddressTemporaryHost": {
-    "message": "This address uses a temporary server host."
-  },
-  "moderation.project-review.serverContent": {
-    "message": "Content"
-  },
-  "moderation.project-review.serverDetails": {
-    "message": "Server details"
-  },
-  "moderation.project-review.serverDiscord": {
-    "message": "Discord"
-  },
-  "moderation.project-review.serverLanguages": {
-    "message": "Languages"
-  },
-  "moderation.project-review.serverRegion": {
-    "message": "Region"
-  },
-  "moderation.project-review.showLeft": {
-    "message": "Show project details"
-  },
-  "moderation.project-review.showRight": {
-    "message": "Show panel"
-  },
-  "moderation.project-review.skip": {
-    "message": "Skip"
-  },
-  "moderation.project-review.skipped": {
-    "message": "Skipped"
-  },
-  "moderation.project-review.skippedProjects": {
-    "message": "Skipped projects"
-  },
-  "moderation.project-review.slicer": {
-    "message": "Slicer"
-  },
-  "moderation.project-review.slicerOpenExternal": {
-    "message": "Open in Slicer in a new tab"
-  },
-  "moderation.project-review.slug": {
-    "message": "Slug"
-  },
-  "moderation.project-review.slugNotSuggested": {
-    "message": "This slug does not match any of the suggested slugs."
-  },
-  "moderation.project-review.source": {
-    "message": "Source code"
-  },
-  "moderation.project-review.sourceAvailabilityRequired": {
-    "message": "License requires source code."
-  },
-  "moderation.project-review.sourceError": {
-    "message": "Could not load source code. Try opening the flag again"
-  },
-  "moderation.project-review.status-alerts": {
-    "message": "Status alerts"
-  },
-  "moderation.project-review.store": {
-    "message": "Store"
-  },
-  "moderation.project-review.submissions": {
-    "message": "{count, plural, one {# submission} other {# submissions}}"
-  },
-  "moderation.project-review.submitted": {
-    "message": "Submitted"
-  },
-  "moderation.project-review.summary": {
-    "message": "Summary"
-  },
-  "moderation.project-review.tags": {
-    "message": "Tags"
-  },
-  "moderation.project-review.tech-review": {
-    "message": "Tech Review"
-  },
   "moderation.project-review.techReviewFailedCount": {
     "message": "{count} failed technical review"
   },
-  "moderation.project-review.title": {
-    "message": "Project Review"
-  },
-  "moderation.project-review.unavailable": {
-    "message": "Unavailable"
-  },
-  "moderation.project-review.undefinedProject": {
-    "message": "Undefined project"
-  },
-  "moderation.project-review.unknown": {
-    "message": "Unknown"
-  },
   "moderation.project-review.unknownCount": {
     "message": "{count} unknown"
   },
-  "moderation.project-review.unlisted": {
-    "message": "Unlisted"
-  },
   "moderation.project-review.unlistedCount": {
     "message": "{count} unlisted"
   },
-  "moderation.project-review.unpinReview": {
-    "message": "Unpin review controls"
-  },
-  "moderation.project-review.updated": {
-    "message": "Updated"
-  },
-  "moderation.project-review.uploaded": {
-    "message": "Uploaded {date}"
-  },
-  "moderation.project-review.validation.length": {
-    "message": "Enter between {min} and {max} characters."
-  },
-  "moderation.project-review.validation.slug": {
-    "message": "Use only letters, numbers, periods, underscores, and hyphens."
-  },
-  "moderation.project-review.vanilla": {
-    "message": "Vanilla"
-  },
-  "moderation.project-review.versionId": {
-    "message": "Version ID"
-  },
-  "moderation.project-review.versionNumber": {
-    "message": "Version Number"
-  },
-  "moderation.project-review.versionSubtitle": {
-    "message": "Version Subtitle"
+  "moderation.project-review.withheldCount": {
+    "message": "{count} withheld"
   },
-  "moderation.project-review.versions": {
-    "message": "Versions"
+  "moderation.settings.appearance": {
+    "message": "Appearance"
   },
-  "moderation.project-review.viewC2paInfo": {
-    "message": "View C2PA info"
+  "moderation.settings.control-label": {
+    "message": "{section}: {setting}"
   },
-  "moderation.project-review.viewVersion": {
-    "message": "View version"
+  "moderation.settings.debug": {
+    "message": "Debug settings"
   },
-  "moderation.project-review.visibility": {
-    "message": "Visibility"
+  "moderation.settings.default-value-styled": {
+    "message": "Default: <value></value>"
   },
-  "moderation.project-review.visibilityOption": {
-    "message": "{status, select, approved {Public} archived {Public} unlisted {Unlisted} private {Private} other {Unknown}}"
+  "moderation.settings.floating-panel-preview": {
+    "message": "Floating panel preview"
   },
-  "moderation.project-review.website": {
-    "message": "Website"
+  "moderation.settings.floating-panel-section": {
+    "message": "Floating review panel"
   },
-  "moderation.project-review.wiki": {
-    "message": "Wiki page"
+  "moderation.settings.highlight-preview": {
+    "message": "Review highlight preview"
   },
-  "moderation.project-review.withheld": {
-    "message": "Withheld"
+  "moderation.settings.highlight-preview.incorrect-formatting": {
+    "message": "Incorrect formatting"
   },
-  "moderation.project-review.withheldCount": {
-    "message": "{count} withheld"
+  "moderation.settings.highlight-preview.missing-information": {
+    "message": "Missing information"
   },
-  "moderation.settings.appearance": {
-    "message": "Appearance"
+  "moderation.settings.highlight-preview.non-english": {
+    "message": "Non-English"
   },
-  "moderation.settings.based-on": {
-    "message": "Based on"
+  "moderation.settings.highlights-section": {
+    "message": "Highlights"
   },
-  "moderation.settings.debug": {
-    "message": "Debug settings"
+  "moderation.settings.issue-toggle-preview": {
+    "message": "Issue toggle preview"
   },
-  "moderation.settings.default-value-styled": {
-    "message": "Default: <value></value>"
+  "moderation.settings.issue-toggles-section": {
+    "message": "Issue toggles"
   },
   "moderation.settings.localhost": {
     "message": "Set to {hostname}"
@@ -4085,18 +3326,27 @@
   "moderation.settings.project-pages": {
     "message": "Public pages and hosts"
   },
+  "moderation.settings.reset": {
+    "message": "Reset to default"
+  },
+  "moderation.settings.review-panel-appearance": {
+    "message": "Review panel appearance"
+  },
   "moderation.settings.search": {
     "message": "Search settings…"
   },
   "moderation.settings.shortcuts": {
     "message": "Editors and shortcut hints"
   },
+  "moderation.settings.theme-border": {
+    "message": "Theme orange (25% opacity)"
+  },
+  "moderation.settings.theme-default": {
+    "message": "Theme orange"
+  },
   "moderation.settings.title": {
     "message": "General settings"
   },
-  "moderation.settings.unknown-commit": {
-    "message": "unknown"
-  },
   "moderation.settings.workflow": {
     "message": "Review workflow and queue"
   },
@@ -4493,36 +3743,6 @@
   "organization.projects.none-with-create-prompt": {
     "message": "This organization doesn't have any projects yet. Would you like to <create-link>create one</create-link>?"
   },
-  "profile.button.analytics": {
-    "message": "View user analytics"
-  },
-  "profile.button.edit-user": {
-    "message": "Edit user"
-  },
-  "profile.button.info": {
-    "message": "View user details"
-  },
-  "profile.button.shared-instances": {
-    "message": "View shared instances"
-  },
-  "profile.details.label.auth-providers": {
-    "message": "Auth providers"
-  },
-  "profile.details.label.email-verified": {
-    "message": "Email verified"
-  },
-  "profile.details.label.has-password": {
-    "message": "Has password"
-  },
-  "profile.details.label.has-totp": {
-    "message": "Has TOTP"
-  },
-  "profile.details.label.payment-methods": {
-    "message": "Payment methods"
-  },
-  "profile.details.title": {
-    "message": "User details"
-  },
   "project-member-header.error-decline": {
     "message": "Failed to decline team invitation"
   },
@@ -4580,224 +3800,8 @@
   "project-moderation-nags.warning": {
     "message": "Warning"
   },
-  "project-review.composer.add-note": {
-    "message": "Private note"
-  },
-  "project-review.composer.reply": {
-    "message": "Reply"
-  },
-  "project-review.composer.reply-and-clear-issues": {
-    "message": "Reply and clear issues"
-  },
-  "project-review.composer.reply-placeholder": {
-    "message": "Reply to thread…"
-  },
-  "project-review.controls.markdown-placeholder": {
-    "message": "Explain what needs to change…"
-  },
-  "project-review.controls.required-value": {
-    "message": "Complete this required field."
-  },
-  "project-review.controls.select": {
-    "message": "Select an option"
-  },
-  "project-review.controls.slug-available": {
-    "message": "This project URL is available."
-  },
-  "project-review.controls.slug-error": {
-    "message": "Unable to check URL availability. Try again."
-  },
-  "project-review.controls.slug-invalid": {
-    "message": "Use 3–64 letters, numbers, periods, underscores, or hyphens."
-  },
-  "project-review.controls.slug-taken": {
-    "message": "This project URL is already taken."
-  },
-  "project-review.controls.slug-unchanged": {
-    "message": "Choose a URL different from the current project URL."
-  },
-  "project-review.controls.text-placeholder": {
-    "message": "Enter text…"
-  },
-  "project-review.decision.add-issues": {
-    "message": "Add issues on project"
-  },
-  "project-review.decision.approve": {
-    "message": "Approve"
-  },
-  "project-review.decision.message-mode": {
-    "message": "Send issues as thread message"
-  },
-  "project-review.decision.reject": {
-    "message": "Reject"
-  },
-  "project-review.decision.send-issues-message": {
-    "message": "Send issues thread message"
-  },
-  "project-review.decision.send-to-review": {
-    "message": "Send to review"
-  },
-  "project-review.decision.set-to-draft": {
-    "message": "Set to draft"
-  },
-  "project-review.decision.withhold": {
-    "message": "Withhold"
-  },
-  "project-review.image.dimensions": {
-    "message": "Dimensions"
-  },
-  "project-review.image.disable-pixelated": {
-    "message": "Disable pixel-art rendering"
-  },
-  "project-review.image.download": {
-    "message": "Download image"
-  },
-  "project-review.image.enable-pixelated": {
-    "message": "Enable pixel-art rendering"
-  },
-  "project-review.image.file-size": {
-    "message": "File size"
-  },
-  "project-review.image.format": {
-    "message": "Format"
-  },
-  "project-review.image.info": {
-    "message": "Image information"
-  },
-  "project-review.image.info-unknown": {
-    "message": "Unknown"
-  },
-  "project-review.issues.add": {
-    "message": "Issue"
-  },
-  "project-review.issues.add-option": {
-    "message": "Add issue option"
-  },
-  "project-review.issues.choose-option": {
-    "message": "Choose at least one option for this issue."
-  },
-  "project-review.issues.custom": {
-    "message": "Custom issue"
-  },
-  "project-review.issues.custom-acknowledge-checkbox": {
-    "message": "Acknowledge checkbox"
-  },
-  "project-review.issues.custom-acknowledge-reply": {
-    "message": "Acknowledge reply"
-  },
-  "project-review.issues.custom-actions": {
-    "message": "Actions"
-  },
-  "project-review.issues.custom-add-facets": {
-    "message": "Mark as addressed"
-  },
-  "project-review.issues.custom-message-required": {
-    "message": "Enter a message for this custom issue."
-  },
-  "project-review.issues.custom-placeholder": {
-    "message": "Enter custom issue message..."
-  },
-  "project-review.issues.custom-priority": {
-    "message": "Priority"
-  },
-  "project-review.issues.custom-search-facets": {
-    "message": "Search actions…"
-  },
-  "project-review.issues.custom-title": {
-    "message": "Title"
-  },
-  "project-review.issues.custom-title-placeholder": {
-    "message": "Enter title..."
-  },
-  "project-review.issues.edited": {
-    "message": "(Edited)"
-  },
-  "project-review.issues.edited-tooltip": {
-    "message": "Issue message has been edited"
-  },
-  "project-review.issues.empty": {
-    "message": "No issues flagged."
-  },
-  "project-review.issues.empty-re-review": {
-    "message": "No previous issues to re-review."
-  },
-  "project-review.issues.field-option": {
-    "message": "{field}: {option}"
-  },
-  "project-review.issues.issue-message": {
-    "message": "Message"
-  },
-  "project-review.issues.message": {
-    "message": "Message for {issue}"
-  },
-  "project-review.issues.no-results": {
-    "message": "No matching issues."
-  },
-  "project-review.issues.not-resolved": {
-    "message": "Not resolved"
-  },
-  "project-review.issues.open-panel": {
-    "message": "Open {panel} review panel"
-  },
-  "project-review.issues.remove": {
-    "message": "Remove {issue}"
-  },
-  "project-review.issues.remove-option": {
-    "message": "Remove {option}"
-  },
-  "project-review.issues.reset": {
-    "message": "Reset issues"
-  },
-  "project-review.issues.reset-all": {
-    "message": "Reset all issues"
-  },
-  "project-review.issues.reset-description": {
-    "message": "This will discard your issue changes and move all previous issues back to Re-rev. issues."
-  },
-  "project-review.issues.reset-message": {
-    "message": "Reset message"
-  },
-  "project-review.issues.resolved": {
-    "message": "Auto resolved ({count})"
-  },
-  "project-review.issues.revert-all-customizations": {
-    "message": "Revert all customizations"
-  },
-  "project-review.issues.revert-customizations-description": {
-    "message": "Revert all customizations restores default issue messages while keeping custom issue messages and all issue toggles and selections."
-  },
-  "project-review.issues.search": {
-    "message": "Search issues…"
-  },
-  "project-review.lock.moderating": {
-    "message": "{username} is moderating"
-  },
-  "project-review.lock.take-over": {
-    "message": "Take over project"
-  },
-  "project-review.message-box.resize": {
-    "message": "Resize message box"
-  },
-  "project-review.previous-issues.re-review": {
-    "message": "Re-review"
-  },
-  "project-review.resize-checks": {
-    "message": "Resize project checks"
-  },
-  "project-review.right-panel.issues": {
-    "message": "Issues ({count})"
-  },
-  "project-review.right-panel.re-review": {
-    "message": "Re-review ({count})"
-  },
-  "project-review.right-panel.thread": {
-    "message": "Thread"
-  },
-  "project-review.versions.modpack-tools": {
-    "message": "Modpack tools"
-  },
-  "project-review.versions.view-c2pa-info": {
-    "message": "View C2PA Info"
+  "project-review.disclosures.select-ai-uses": {
+    "message": "Select AI usages"
   },
   "project-type.collection.plural": {
     "message": "Collections"
@@ -4931,6 +3935,9 @@
   "project.disclosures.lock-status.cannot-disable": {
     "message": "Cannot disable"
   },
+  "project.disclosures.lock-status.change": {
+    "message": "Change lock status"
+  },
   "project.disclosures.lock-status.fully-locked": {
     "message": "Fully locked"
   },
@@ -5516,24 +4523,15 @@
   "project.settings.license.custom-url-description": {
     "message": "The web location of the full license text. You have to provide a link since this is a custom license."
   },
-  "project.settings.license.has-spdx": {
-    "message": "Use SPDX identifier"
-  },
   "project.settings.license.intro": {
     "message": "It is important to choose a proper license for your {type}. You may choose one from our list or provide a custom license. You may also provide a custom URL to your chosen license; otherwise, the license text will be displayed. See our <guide>licensing guide</guide> for more information."
   },
-  "project.settings.license.invalid-url": {
-    "message": "Enter a valid HTTP or HTTPS license URL."
-  },
   "project.settings.license.later": {
     "message": "Later editions"
   },
   "project.settings.license.later-description": {
     "message": "The license you selected has an \"or later\" clause. If you check this box, users may use your project under later editions of the license."
   },
-  "project.settings.license.missing-name": {
-    "message": "Enter a name or SPDX identifier for your custom license."
-  },
   "project.settings.license.missing-url": {
     "message": "Enter a URL to the full text of your custom license."
   },
@@ -5553,16 +4551,10 @@
     "message": "License URL (optional)"
   },
   "project.settings.license.select": {
-    "message": "Select a license"
-  },
-  "project.settings.license.select-description": {
-    "message": "How users are and aren't allowed to use your project."
+    "message": "License"
   },
   "project.settings.license.select-placeholder": {
-    "message": "Select license..."
-  },
-  "project.settings.license.spdx": {
-    "message": "SPDX identifier"
+    "message": "Search licenses..."
   },
   "project.settings.license.title": {
     "message": "License"
@@ -5612,9 +4604,6 @@
   "project.settings.links.donations-description": {
     "message": "Add donation links for users to support you directly."
   },
-  "project.settings.links.invalid-url": {
-    "message": "Enter valid HTTP or HTTPS URLs before saving."
-  },
   "project.settings.links.issues": {
     "message": "Issue tracker"
   },
@@ -5888,9 +4877,6 @@
   "project.settings.tags.too-many-tags-server-soft-warning": {
     "message": "You've selected {count} tags. Consider reducing to 12 or fewer to keep your server focused and easier to discover."
   },
-  "project.settings.tags.upload-version-first.description": {
-    "message": "Upload a version before selecting project tags."
-  },
   "project.settings.tags.upload-version-first.heading": {
     "message": "Upload versions before adding tags"
   },
diff --git a/apps/frontend/src/pages/moderation/project-review.vue b/apps/frontend/src/pages/moderation/project-review.vue
index 754c358d22f..fb2dc6d0b9c 100644
--- a/apps/frontend/src/pages/moderation/project-review.vue
+++ b/apps/frontend/src/pages/moderation/project-review.vue
@@ -4,17 +4,15 @@
 </template>
 
 <script setup lang="ts">
-import { ConfirmLeaveModal, useVIntl } from '@modrinth/ui'
+import { ConfirmLeaveModal } from '@modrinth/ui'
 import { onBeforeUnmount, onMounted } from 'vue'
 
 import ProjectReview from '~/components/project-review/index.vue'
-import { projectReviewMessages } from '~/components/project-review/messages'
 import {
 	createProjectReviewPageContext,
 	provideProjectReviewPageContext,
 } from '~/providers/project-review'
 
-const { formatMessage } = useVIntl()
 const { confirmLeaveModal, project } = provideProjectReviewPageContext(
 	createProjectReviewPageContext(),
 )
@@ -26,9 +24,7 @@ definePageMeta({
 
 useHead({
 	title: () =>
-		project.value?.name
-			? `${project.value.name} - ${formatMessage(projectReviewMessages.title)}`
-			: formatMessage(projectReviewMessages.title),
+		project.value?.name ? `${project.value.name} - ${'Project Review'}` : 'Project Review',
 })
 useFavicon('review')
 
diff --git a/apps/frontend/src/providers/project-review/review-lock.ts b/apps/frontend/src/providers/project-review/review-lock.ts
index 9efa5a3b356..60b5aaa5baf 100644
--- a/apps/frontend/src/providers/project-review/review-lock.ts
+++ b/apps/frontend/src/providers/project-review/review-lock.ts
@@ -1,11 +1,5 @@
 import type { Labrinth } from '@modrinth/api-client'
-import {
-	commonMessages,
-	defineMessages,
-	injectModrinthClient,
-	injectNotificationManager,
-	useVIntl,
-} from '@modrinth/ui'
+import { injectModrinthClient, injectNotificationManager } from '@modrinth/ui'
 import { useMutation, useQuery, useQueryClient } from '@tanstack/vue-query'
 import { useDocumentVisibility } from '@vueuse/core'
 import { computed, onMounted, onScopeDispose, type Ref, ref, shallowRef, useId, watch } from 'vue'
@@ -36,7 +30,7 @@ export function useReviewLock(projectId: Ref<string>) {
 	const queryClient = useQueryClient()
 	const auth = useAuthState()
 	const config = useRuntimeConfig()
-	const { formatMessage } = useVIntl()
+
 	const { addNotification, removeNotification } = injectNotificationManager()
 	const instanceId = useId()
 	const mounted = ref(false)
@@ -44,32 +38,6 @@ export function useReviewLock(projectId: Ref<string>) {
 	const session = shallowRef<LockSession>()
 	let generation = 0
 	let renewalTimer: ReturnType<typeof setInterval> | undefined
-	const messages = defineMessages({
-		takenOver: {
-			id: 'project-review.lock.taken-over',
-			defaultMessage: '{username} has taken over moderating this project.',
-		},
-		unverified: {
-			id: 'project-review.lock.unverified',
-			defaultMessage: 'Unable to verify the moderation lock on the project.',
-		},
-		acquireFailed: {
-			id: 'project-review.lock.acquire-failed',
-			defaultMessage: 'Unable to acquire the moderation lock for this project.',
-		},
-		renewFailed: {
-			id: 'project-review.lock.renew-failed',
-			defaultMessage: 'Unable to renew the moderation lock for this project.',
-		},
-		takeOverFailed: {
-			id: 'project-review.lock.take-over-failed',
-			defaultMessage: 'Unable to take over moderating this project.',
-		},
-		unknownModerator: {
-			id: 'project-review.lock.unknown-moderator',
-			defaultMessage: 'Another moderator',
-		},
-	})
 
 	function isCurrent(current: LockSession) {
 		return (
@@ -82,7 +50,8 @@ export function useReviewLock(projectId: Ref<string>) {
 	}
 
 	function assertCurrent(current: LockSession) {
-		if (!isCurrent(current)) throw new ReviewLockError(formatMessage(messages.unverified))
+		if (!isCurrent(current))
+			throw new ReviewLockError('Unable to verify the moderation lock on the project.')
 	}
 
 	function dismissTakeoverNotification(current: LockSession) {
@@ -102,9 +71,7 @@ export function useReviewLock(projectId: Ref<string>) {
 				dismissTakeoverNotification(current)
 				current.notifiedOwner = owner
 				current.takeoverNotificationId = addNotification({
-					title: formatMessage(messages.takenOver, {
-						username: status.locked_by?.username ?? formatMessage(messages.unknownModerator),
-					}),
+					title: `${status.locked_by?.username ?? 'Another moderator'} has taken over moderating this project.`,
 					type: 'warning',
 					autoCloseMs: null,
 					dismissible: true,
@@ -152,13 +119,13 @@ export function useReviewLock(projectId: Ref<string>) {
 			current.errorNotified = true
 			const message =
 				kind === 'override'
-					? messages.takeOverFailed
+					? 'Unable to take over moderating this project.'
 					: kind === 'renew'
-						? messages.renewFailed
-						: messages.acquireFailed
+						? 'Unable to renew the moderation lock for this project.'
+						: 'Unable to acquire the moderation lock for this project.'
 			addNotification({
-				title: formatMessage(commonMessages.errorNotificationTitle),
-				text: formatMessage(message),
+				title: 'An error occurred',
+				text: message,
 				type: 'error',
 			})
 		},
@@ -204,7 +171,7 @@ export function useReviewLock(projectId: Ref<string>) {
 			return undefined
 		return status.is_own_lock
 			? undefined
-			: (status.locked_by ?? { id: '', username: formatMessage(messages.unknownModerator) })
+			: (status.locked_by ?? { id: '', username: 'Another moderator' })
 	})
 
 	watch([statusQuery.data, statusQuery.dataUpdatedAt], ([status]) => {
@@ -293,7 +260,7 @@ export function useReviewLock(projectId: Ref<string>) {
 	async function ensureEligible(id: string) {
 		const current = session.value
 		if (!current || current.projectId !== id)
-			throw new ReviewLockError(formatMessage(messages.unverified))
+			throw new ReviewLockError('Unable to verify the moderation lock on the project.')
 		let status: LockStatus | undefined
 		try {
 			status = await operation.mutateAsync({
@@ -302,10 +269,11 @@ export function useReviewLock(projectId: Ref<string>) {
 				forSubmission: true,
 			})
 		} catch {
-			throw new ReviewLockError(formatMessage(messages.unverified))
+			throw new ReviewLockError('Unable to verify the moderation lock on the project.')
 		}
 		assertCurrent(current)
-		if (!isEligibleStatus(status)) throw new ReviewLockError(formatMessage(messages.unverified))
+		if (!isEligibleStatus(status))
+			throw new ReviewLockError('Unable to verify the moderation lock on the project.')
 	}
 
 	function assertEligible(id: string) {
@@ -315,7 +283,7 @@ export function useReviewLock(projectId: Ref<string>) {
 			!isCurrent(session.value) ||
 			!isEligibleStatus(statusQuery.data.value)
 		)
-			throw new ReviewLockError(formatMessage(messages.unverified))
+			throw new ReviewLockError('Unable to verify the moderation lock on the project.')
 	}
 
 	return {
diff --git a/apps/frontend/src/providers/project-review/review-panels.ts b/apps/frontend/src/providers/project-review/review-panels.ts
index d2e90067fdd..2bc55579ce5 100644
--- a/apps/frontend/src/providers/project-review/review-panels.ts
+++ b/apps/frontend/src/providers/project-review/review-panels.ts
@@ -357,9 +357,7 @@ export function createReviewPanels(
 				issueIds,
 				toggleIds: [
 					...new Set(
-						[...Object.keys(session.read(projectV3.id, 'issues')), ...issueIds].flatMap(
-							toggleIds,
-						),
+						[...Object.keys(session.read(projectV3.id, 'issues')), ...issueIds].flatMap(toggleIds),
 					),
 				],
 			},
diff --git a/apps/frontend/src/providers/project-review/review-previous-issues.ts b/apps/frontend/src/providers/project-review/review-previous-issues.ts
index bbae33091cf..264af10cfd6 100644
--- a/apps/frontend/src/providers/project-review/review-previous-issues.ts
+++ b/apps/frontend/src/providers/project-review/review-previous-issues.ts
@@ -1,7 +1,6 @@
 import type { Labrinth } from '@modrinth/api-client'
 import { IssuePriority } from '@modrinth/moderation/src/data/issues'
-import { issueTargetLabels } from '@modrinth/moderation/src/data/issues/component-builders/targets'
-import { createContext, useVIntl } from '@modrinth/ui'
+import { createContext } from '@modrinth/ui'
 import { computed, type Ref, watch } from 'vue'
 
 import type { ReviewTarget } from './review'
@@ -13,6 +12,7 @@ import type {
 	ReviewPanelBinding,
 } from './review-panels'
 import type { createReviewSession } from './review-session'
+import { issueTargetLabels } from './review-target-labels'
 
 type ThreadIssue = Labrinth.Threads.v3.ThreadIssue
 type ThreadIssueFacet = Labrinth.Threads.v3.ThreadIssueFacet
@@ -28,7 +28,6 @@ export function createReviewPreviousIssues(
 	panels: ReturnType<typeof createReviewPanels>,
 	messages: ReturnType<typeof createReviewMessages>,
 ) {
-	const { formatMessage } = useVIntl()
 	const issues = computed(() =>
 		wasReviewed.value && project.value?.thread_id === thread.value?.id
 			? (thread.value?.issues ?? [])
@@ -115,7 +114,7 @@ export function createReviewPreviousIssues(
 					? details.title
 					: typeof details.issue_id === 'string'
 						? details.issue_id.replaceAll('-', ' ')
-						: formatMessage(issueTargetLabels[issue.facets[0]?.what.type ?? 'mark_addressed'])),
+						: issueTargetLabels[issue.facets[0]?.what.type ?? 'mark_addressed']),
 			category: '',
 			priority: issue.why.custom
 				? (IssuePriority[issue.why.custom.priority as keyof typeof IssuePriority] ??
@@ -163,7 +162,10 @@ export function createReviewPreviousIssues(
 			if (what.type === 'modify_links') {
 				for (const key of Object.keys(what.value.links)) targets.push({ kind: 'link', key })
 			} else if (what.type === 'modify_gallery_image') {
-				targets.push({ kind: 'gallery-image', key: String(what.value.image_id) })
+				targets.push({
+					kind: 'gallery-image',
+					key: String(what.value.image_id),
+				})
 			} else if (what.type === 'remove_gallery_images') {
 				for (const id of what.value.image_ids)
 					targets.push({ kind: 'gallery-image', key: String(id) })
@@ -299,7 +301,9 @@ export function createReviewPreviousIssues(
 		const selection = issue.why.selection
 		if (selection) {
 			session.write(projectId, 'issues', definition.id, new Set(selection.toggle_ids ?? []))
-			session.write(projectId, 'issue-text', definition.id, { ...selection.text_values })
+			session.write(projectId, 'issue-text', definition.id, {
+				...selection.text_values,
+			})
 			session.write(
 				projectId,
 				'issue-select',
diff --git a/apps/frontend/src/providers/project-review/review-submission.ts b/apps/frontend/src/providers/project-review/review-submission.ts
index 05efbee1518..85bd4587c71 100644
--- a/apps/frontend/src/providers/project-review/review-submission.ts
+++ b/apps/frontend/src/providers/project-review/review-submission.ts
@@ -1,13 +1,7 @@
 import type { Labrinth } from '@modrinth/api-client'
 import { moderationSettings } from '@modrinth/moderation'
 import { IssuePriority } from '@modrinth/moderation/src/data/issues'
-import {
-	commonMessages,
-	defineMessages,
-	injectModrinthClient,
-	injectNotificationManager,
-	useVIntl,
-} from '@modrinth/ui'
+import { injectModrinthClient, injectNotificationManager } from '@modrinth/ui'
 import { useMutation, useQueryClient } from '@tanstack/vue-query'
 import { computed, onScopeDispose, ref, watch } from 'vue'
 
@@ -38,7 +32,7 @@ export function createReviewSubmission(
 ) {
 	const client = injectModrinthClient()
 	const queryClient = useQueryClient()
-	const { formatMessage } = useVIntl()
+
 	const { addNotification } = injectNotificationManager()
 	const auth = useAuthState()
 	const settings = useModerationSettings()
@@ -61,52 +55,9 @@ export function createReviewSubmission(
 		disposed = true
 	})
 
-	const errors = defineMessages({
-		sendIssuesFailed: {
-			id: 'project-review.decision.send-issues-failed',
-			defaultMessage: 'Failed to send issues thread message',
-		},
-		createIssuesFailed: {
-			id: 'project-review.decision.create-issues-failed',
-			defaultMessage: 'Failed to create issues',
-		},
-		issuesMessageTooLong: {
-			id: 'project-review.decision.issues-message-too-long',
-			defaultMessage: 'The issues thread message must be no larger than 65,536 bytes.',
-		},
-		submitFailed: {
-			id: 'project-review.decision.submit-failed',
-			defaultMessage: 'Failed to submit review',
-		},
-		unresolved: {
-			id: 'project-review.decision.unresolved',
-			defaultMessage:
-				'Verify all remaining fixes and remove new findings before approving this project.',
-		},
-		unsaved: {
-			id: 'project-review.disclosures.unsaved',
-			defaultMessage: 'Save or reset your disclosure changes before changing the project status.',
-		},
-		missing: {
-			id: 'project-review.corrections.missing-fields',
-			defaultMessage: 'Complete the required review fields before submitting a review decision.',
-		},
-		changed: {
-			id: 'project-review.corrections.project-changed',
-			defaultMessage: 'The selected project changed. Review it again.',
-		},
-		imageType: {
-			id: 'project-review.reply.image-type',
-			defaultMessage: 'Choose a PNG, JPEG, GIF, or WebP image.',
-		},
-		imageSize: {
-			id: 'project-review.reply.image-size',
-			defaultMessage: 'Images must be smaller than 1 MiB.',
-		},
-	})
-
 	function assertCurrent(id: string) {
-		if (disposed || project.value?.id !== id) throw new Error(formatMessage(errors.changed))
+		if (disposed || project.value?.id !== id)
+			throw new Error('The selected project changed. Review it again.')
 	}
 
 	function selectedIssues(): NewThreadIssues | undefined {
@@ -190,15 +141,14 @@ export function createReviewSubmission(
 		},
 		onError: (error) => {
 			addNotification({
-				title: formatMessage(
+				title:
 					error instanceof ReviewIssuesError
 						? error.mode === 'message'
-							? errors.sendIssuesFailed
-							: errors.createIssuesFailed
+							? 'Failed to send issues thread message'
+							: 'Failed to create issues'
 						: error instanceof ReviewLockError
-							? errors.submitFailed
-							: commonMessages.errorNotificationTitle,
-				),
+							? 'Failed to submit review'
+							: 'An error occurred',
 				text: error instanceof Error ? error.message : String(error),
 				type: 'error',
 			})
@@ -217,8 +167,8 @@ export function createReviewSubmission(
 		mutationFn: async ({ file, id }: { file: File; id: string }) => {
 			const ext = file.type.split('/')[1]
 			if (!['image/png', 'image/jpeg', 'image/gif', 'image/webp'].includes(file.type))
-				throw new Error(formatMessage(errors.imageType))
-			if (file.size > 1024 * 1024) throw new Error(formatMessage(errors.imageSize))
+				throw new Error('Choose a PNG, JPEG, GIF, or WebP image.')
+			if (file.size > 1024 * 1024) throw new Error('Images must be smaller than 1 MiB.')
 			const response = await client.upload<{ id: string; url: string }>('/image', {
 				api: 'labrinth',
 				version: 3,
@@ -231,7 +181,7 @@ export function createReviewSubmission(
 		},
 		onError: (error) =>
 			addNotification({
-				title: formatMessage(commonMessages.errorNotificationTitle),
+				title: 'An error occurred',
 				text: error instanceof Error ? error.message : String(error),
 				type: 'error',
 			}),
@@ -292,7 +242,7 @@ export function createReviewSubmission(
 		let mutationStarted = false
 		try {
 			if (disclosures.hasChanges.value || disclosures.saving.value)
-				throw new Error(formatMessage(errors.unsaved))
+				throw new Error('Save or reset your disclosure changes before changing the project status.')
 			if (
 				panels.validationErrors.value.some(
 					({ issueId, key }) =>
@@ -300,13 +250,16 @@ export function createReviewSubmission(
 				)
 			)
 				throw new Error('Please select tags to remove for inaccurate tags issue.')
-			if (panels.validationErrors.value.length) throw new Error(formatMessage(errors.missing))
+			if (panels.validationErrors.value.length)
+				throw new Error('Complete the required review fields before submitting a review decision.')
 			if (status && ['approved', 'unlisted', 'private'].includes(status) && !canApprove.value)
-				throw new Error(formatMessage(errors.unresolved))
+				throw new Error(
+					'Verify all remaining fixes and remove new findings before approving this project.',
+				)
 			const messageMode = sendIssuesAsThreadMessage.value
 			const message = messageMode ? issuesMessage.value : undefined
 			if (message && new TextEncoder().encode(message).length > 65536)
-				throw new Error(formatMessage(errors.issuesMessageTooLong))
+				throw new Error('The issues thread message must be no larger than 65,536 bytes.')
 			const facetUpdates = status
 				? previousIssues.facetUpdates.value
 				: previousIssues.replacementFacetUpdates.value
@@ -344,7 +297,7 @@ export function createReviewSubmission(
 		} catch (error) {
 			if (!mutationStarted)
 				addNotification({
-					title: formatMessage(commonMessages.errorNotificationTitle),
+					title: 'An error occurred',
 					text: error instanceof Error ? error.message : String(error),
 					type: 'error',
 				})
diff --git a/apps/frontend/src/providers/project-review/review-target-labels.ts b/apps/frontend/src/providers/project-review/review-target-labels.ts
new file mode 100644
index 00000000000..accd823138b
--- /dev/null
+++ b/apps/frontend/src/providers/project-review/review-target-labels.ts
@@ -0,0 +1,26 @@
+import type { Labrinth } from '@modrinth/api-client'
+
+export const issueTargetLabels = {
+	mark_addressed: 'Mark addressed',
+	modify_title: 'Change title',
+	modify_slug: 'Change URL slug',
+	modify_summary: 'Change summary',
+	modify_description: 'Change description',
+	modify_license: 'Change license',
+	modify_icon: 'Change icon',
+	remove_icon: 'Remove icon',
+	remove_tags: 'Remove tags',
+	modify_links: 'Change links',
+	add_gallery_images: 'Add gallery images',
+	modify_gallery_image: 'Change gallery image',
+	remove_gallery_images: 'Remove gallery images',
+	add_project_disclosures: 'Add disclosures',
+	remove_project_disclosures: 'Remove disclosures',
+	modify_project_disclosure: 'Change disclosure',
+	modify_project_disclosure_note: 'Change disclosure note',
+	version: 'Change version',
+	modify_team_member_role: 'Change team member role',
+	modify_server_languages: 'Change server languages',
+	modify_server_address: 'Change server address',
+	acknowledge: 'Acknowledge',
+} satisfies Record<Labrinth.Threads.v3.ThreadIssueTarget['type'], string>
diff --git a/packages/ui/src/locales/en-US/index.json b/packages/ui/src/locales/en-US/index.json
index 8f6d71baecf..773eac59ccf 100644
--- a/packages/ui/src/locales/en-US/index.json
+++ b/packages/ui/src/locales/en-US/index.json
@@ -368,6 +368,15 @@
   "collections.label.private": {
     "defaultMessage": "Private"
   },
+  "color-picker.hex-value": {
+    "defaultMessage": "{label} hex value"
+  },
+  "color-picker.hue": {
+    "defaultMessage": "{label} hue"
+  },
+  "color-picker.saturation-and-brightness": {
+    "defaultMessage": "{label} saturation and brightness"
+  },
   "console.actions.collapse": {
     "defaultMessage": "Collapse"
   },

From 25de5789d747f9f885f8c2a7d5cf725eb31dced4 Mon Sep 17 00:00:00 2001
From: tdgao <mr.trumgao@gmail.com>
Date: Wed, 21 Oct 2026 13:32:06 -0600
Subject: [PATCH 28/28] fix standards

---
 apps/frontend/AGENTS.md              | 10 ++++------
 packages/ui/AGENTS.md                |  8 ++------
 standards/frontend/POPOUT-WINDOWS.md | 19 +++++++++++++++++++
 3 files changed, 25 insertions(+), 12 deletions(-)
 create mode 100644 standards/frontend/POPOUT-WINDOWS.md

diff --git a/apps/frontend/AGENTS.md b/apps/frontend/AGENTS.md
index 72033833c7b..179a7a5e9d2 100644
--- a/apps/frontend/AGENTS.md
+++ b/apps/frontend/AGENTS.md
@@ -28,15 +28,13 @@ Nuxt 3 with SSR — pages are server-rendered and hydrated on the client. Uses `
 
 Rule of thumb: if it doesn't depend on Nuxt-specific APIs or website-only features, it should be in `packages/ui`.
 
-### Project Review Language
+### Localization
 
-Project-review code is English-only. Do not add i18n message definitions, translation keys, or translation helpers to project-review routes, components, providers, or supporting code, including review-only components outside `src/components/project-review/`. Use plain English strings, ordinary interpolation and plural handling, and English date/number formatting. This exception also applies during i18n passes. Preserve localization in shared components used elsewhere.
+Any admin or internal pages should not be localized. Use plain English strings, ordinary interpolation and plural handling, and English date/number formatting in their routes, components, providers, and supporting code. This exception also applies during i18n passes. Preserve localization in shared components used elsewhere.
 
-### Project Review Popout Windows
+### Popout Windows
 
-Project review panels can be displayed in multiple browser documents while sharing the main window's Vue application and JavaScript context. Use an anchor, panel, or event target's `ownerDocument` for DOM queries and its `defaultView` for window behavior. Global `document` and `window` still identify the main window after a panel moves.
-
-Use the review shortcut context's listeners (`shortcuts.listen` or `useReviewEventListener`) for review interactions that must work in both the workspace and popouts. Shared overlay and modal behavior follows the multiple-document guidance in `packages/ui/AGENTS.md`.
+See `standards/frontend/POPOUT-WINDOWS.md` for DOM ownership, event listeners, and overlay behavior across browser documents.
 
 ## Data Fetching
 
diff --git a/packages/ui/AGENTS.md b/packages/ui/AGENTS.md
index 534958d2ede..8b7316ce342 100644
--- a/packages/ui/AGENTS.md
+++ b/packages/ui/AGENTS.md
@@ -30,13 +30,9 @@ Files inside `layouts/` use the `#ui/*` import alias (resolved via the `"imports
 
 # Code Guidelines
 
-### Multiple Documents and Popout Windows
+### Global `document` or `windows` object usage
 
-Project review can move Vue component DOM into a separate browser window while its JavaScript continues running in the main window. Global `document` and `window` still refer to the main window, so they may differ from the document displaying a component.
-
-For overlays, focus checks, viewport measurements, and event listeners, use the relevant element's `ownerDocument` and its `defaultView`. Teleport overlays into that document's body. Components without an existing trigger element, such as `NewModal` and `ImageViewerEditor`, use a hidden anchor to identify their owning document when opened.
-
-Keep modal stacks and scroll locks separate per document. Otherwise, a modal in one window can suppress Escape handling or focus trapping in another, and closing a modal can leave the wrong document locked. Window closure must release overlay state and listeners even when normal user closing is disabled. Appearance synchronization must preserve each document's own scroll lock.
+See `standards/frontend/POPOUT-WINDOWS.md` for Global `document` or `window` object usage, DOM ownership, event listeners, and overlay behavior across browser documents.
 
 ### Tailwind Configuration
 
diff --git a/standards/frontend/POPOUT-WINDOWS.md b/standards/frontend/POPOUT-WINDOWS.md
new file mode 100644
index 00000000000..6d4d86a312f
--- /dev/null
+++ b/standards/frontend/POPOUT-WINDOWS.md
@@ -0,0 +1,19 @@
+# Popout Windows
+
+Vue component DOM can move into a separate browser window while its JavaScript continues running in the main window. Global `document` and `window` still refer to the main window, so they may differ from the document displaying a component.
+
+## DOM Ownership
+
+For DOM queries, focus checks, viewport measurements, and event listeners, use the relevant anchor, panel, or event target's `ownerDocument` and its `defaultView`.
+
+Teleport overlays into that document's body. Components without an existing trigger element, such as `NewModal` and `ImageViewerEditor`, use a hidden anchor to identify their owning document when opened.
+
+## Event Listeners
+
+Interactions that must work in both the main window and popouts must register listeners with the relevant document or window. Use the feature's shared listener context when available, and release listeners when the component unmounts or the window closes.
+
+## Modals and Scroll Locks
+
+Keep modal stacks and scroll locks separate per document. Otherwise, a modal in one window can suppress Escape handling or focus trapping in another, and closing a modal can leave the wrong document locked.
+
+Window closure must release overlay state and listeners even when normal user closing is disabled. Appearance synchronization must preserve each document's own scroll lock.