Merge origin/WorkflowChange into logestic_chnage

Resolves conflicts: - LicenseReviewPage: dropped a duplicated schedule-issuance ActionIcon, keeping the Tooltip-wrapped one and adding scheduledPeriod (required by the scheduleIssuance mutation) to it. - portal i18n (en.ts/am.ts): both sides added distinct keys under licensing.card (reportDamaged/reissueFailed vs status/statusReason) — kept both, additive. - licensing.helpers.ts: kept sectionAppliesToKind (this branch) and switched to the centralized BASE_API_URL import from base-api/base-query-with-reauth (WorkflowChange), dropping the local duplicate constant.
2026-09-07 13:05:46 +00:00 · 2026-08-28 16:27:36 +03:00
parent a4fe5a7111 bff1ae5375
commit fa217fc577
58 changed files with 2348 additions and 412 deletions
--- a/apps/backoffice/src/app/features/biometric-enrollment/pages/BiometricEnrollmentPage.tsx
+++ b/apps/backoffice/src/app/features/biometric-enrollment/pages/BiometricEnrollmentPage.tsx
@@ -0,0 +1,322 @@
+import { useMemo, useState } from 'react';
+import {
+  Alert,
+  Badge,
+  Button,
+  Card,
+  Container,
+  Group,
+  Loader,
+  Select,
+  Stack,
+  Table,
+  Text,
+  TextInput,
+  ThemeIcon,
+} from '@mantine/core';
+import { IconAlertTriangle, IconFingerprint, IconPrinter, IconScan, IconSearch, IconX } from '@tabler/icons-react';
+import { useDebouncedValue } from '@mantine/hooks';
+import {
+  extractErrorMessage,
+  openAuthedDocument,
+  useEnrollBiometricMutation,
+  useGenerateBsidMutation,
+  useGetBiometricEnrollmentsQuery,
+  useGetBiometricSimulateCapabilitiesQuery,
+  useListSeafarerRegistrationsQuery,
+  useRevokeBiometricEnrollmentMutation,
+  type BiometricModality,
+  type SeafarerRegistration,
+} from '@ema-platform/api';
+import { notify, PageHeader, StatusBadge } from '@ema-platform/ui';
+import { useDateDisplayer } from '@ema-platform/shared';
+
+const MODALITIES: { value: BiometricModality; label: string }[] = [
+  { value: 'FINGERPRINT', label: 'Fingerprint' },
+  { value: 'FACE', label: 'Face' },
+];
+
+function applicantName(r: Pick<SeafarerRegistration, 'firstName' | 'middleName' | 'lastName'>): string {
+  return [r.firstName, r.middleName, r.lastName].filter(Boolean).join(' ') || '—';
+}
+
+/**
+ * No scanner is wired yet (US-BIO placeholder): "Simulate Scan" stands in for
+ * the real vendor SDK capture, producing a random template so the rest of the
+ * pipeline — encrypt, store, print — is exercisable end to end. Swap the
+ * simulated bytes for the SDK's real template once a vendor is chosen; the
+ * API call shape (base64 template + format tag) does not change.
+ */
+function fakeTemplate(): string {
+  const bytes = crypto.getRandomValues(new Uint8Array(64));
+  return btoa(String.fromCharCode(...bytes));
+}
+
+/** Pick a registered seafarer to enroll — approved registrations carry a profileId. */
+function ProfilePicker({ onPick }: { onPick: (r: SeafarerRegistration) => void }) {
+  const [search, setSearch] = useState('');
+  const [debounced] = useDebouncedValue(search, 300);
+  const { data, isFetching } = useListSeafarerRegistrationsQuery({
+    status: 'APPROVED',
+    search: debounced || undefined,
+    take: 10,
+  });
+
+  return (
+    <Card withBorder radius="md" p="md">
+      <TextInput
+        placeholder="Search seafarer by name, ID or registration number…"
+        leftSection={<IconSearch size={14} />}
+        value={search}
+        onChange={(e) => setSearch(e.currentTarget.value)}
+        mb="sm"
+      />
+      {isFetching && <Loader size="sm" />}
+      <Table highlightOnHover fz="sm">
+        <Table.Tbody>
+          {(data?.items ?? []).map((r) => (
+            <Table.Tr key={r.id} onClick={() => onPick(r)} style={{ cursor: 'pointer' }}>
+              <Table.Td>
+                <Text fz="sm" fw={600}>{applicantName(r)}</Text>
+                <Text fz="xs" c="dimmed" ff="monospace">{r.seafarerNumber}</Text>
+              </Table.Td>
+            </Table.Tr>
+          ))}
+          {!isFetching && (data?.items ?? []).length === 0 && (
+            <Table.Tr>
+              <Table.Td>
+                <Text fz="sm" c="dimmed">No registered seafarer matches.</Text>
+              </Table.Td>
+            </Table.Tr>
+          )}
+        </Table.Tbody>
+      </Table>
+    </Card>
+  );
+}
+
+/** Backoffice counter screen: enroll a scanner capture against a profile, view what's on file, print the slip. */
+export function BiometricEnrollmentPage() {
+  const showDate = useDateDisplayer();
+  const [selected, setSelected] = useState<SeafarerRegistration | null>(null);
+  const [modality, setModality] = useState<BiometricModality>('FINGERPRINT');
+  const [deviceId, setDeviceId] = useState('');
+
+  const profileId = selected?.profileId ?? '';
+  const { data: enrollments, isLoading } = useGetBiometricEnrollmentsQuery(profileId, { skip: !profileId });
+  // No vendor SDK integrated yet — "Simulate Scan" fakes a capture so the
+  // rest of the flow is exercisable. Reports false in production unless
+  // ALLOW_BIOMETRIC_SIMULATION=true, same shortcut the payment bypass uses.
+  const { data: capabilities } = useGetBiometricSimulateCapabilitiesQuery();
+  const simulateEnabled = capabilities?.simulateEnabled ?? false;
+  const [generateBsid, { isLoading: generatingBsid }] = useGenerateBsidMutation();
+  // Seeded from the seafarer registration list (which does not carry BSID
+  // yet) and updated locally once generated — this screen's only source of
+  // truth for it until the registry surfaces the profile's BSID directly.
+  const [bsid, setBsid] = useState<string | null>(null);
+  const [enroll, { isLoading: enrolling }] = useEnrollBiometricMutation();
+  const [revoke, { isLoading: revoking }] = useRevokeBiometricEnrollmentMutation();
+  const [printing, setPrinting] = useState(false);
+
+  const hasActive = useMemo(
+    () => (m: BiometricModality) => (enrollments ?? []).some((e) => e.modality === m),
+    [enrollments],
+  );
+
+  async function handleEnroll() {
+    if (!profileId) return;
+    try {
+      await enroll({
+        profileId,
+        modality,
+        template: fakeTemplate(),
+        templateFormat: 'SIMULATED',
+        deviceId: deviceId || undefined,
+        consentAt: new Date().toISOString(),
+      }).unwrap();
+      notify.success(`${modality === 'FINGERPRINT' ? 'Fingerprint' : 'Face'} enrolled.`);
+    } catch (err) {
+      notify.error(extractErrorMessage(err, 'Enrollment failed.'));
+    }
+  }
+
+  async function handleGenerateBsid() {
+    if (!profileId) return;
+    try {
+      const result = await generateBsid(profileId).unwrap();
+      setBsid(result.bsid);
+      notify.success(`BSID ${result.bsid} generated.`);
+    } catch (err) {
+      notify.error(extractErrorMessage(err, 'Could not generate BSID.'));
+    }
+  }
+
+  async function handleRevoke(id: string) {
+    if (!profileId) return;
+    try {
+      await revoke({ id, profileId, reason: 'Withdrawn at counter' }).unwrap();
+      notify.success('Enrollment revoked.');
+    } catch (err) {
+      notify.error(extractErrorMessage(err, 'Could not revoke.'));
+    }
+  }
+
+  async function handlePrint() {
+    if (!profileId) return;
+    setPrinting(true);
+    try {
+      await openAuthedDocument(
+        `/biometric-enrollments/profile/${profileId}/certificate`,
+        `biometric-enrollment-${profileId}.pdf`,
+      );
+    } catch (err) {
+      notify.error(extractErrorMessage(err, 'Could not open the certificate.'));
+    } finally {
+      setPrinting(false);
+    }
+  }
+
+  return (
+    <Container size="md" py="md">
+      <PageHeader
+        title="Biometric Enrollment"
+        subtitle="Capture a fingerprint or face template for a registered seafarer, and print the enrollment slip."
+      />
+
+      {!selected ? (
+        <ProfilePicker
+          onPick={(r) => {
+            setSelected(r);
+            setBsid(null);
+          }}
+        />
+      ) : (
+        <Stack gap="md">
+          <Card withBorder radius="md" p="md">
+            <Group justify="space-between">
+              <div>
+                <Text fw={600}>{applicantName(selected)}</Text>
+                <Text fz="xs" c="dimmed" ff="monospace">{selected.seafarerNumber}</Text>
+              </div>
+              <Button
+                variant="subtle"
+                size="xs"
+                leftSection={<IconX size={14} />}
+                onClick={() => {
+                  setSelected(null);
+                  setBsid(null);
+                }}
+              >
+                Change seafarer
+              </Button>
+            </Group>
+          </Card>
+
+          <Card withBorder radius="md" p="md">
+            <Text fz="sm" fw={600} mb="sm">Capture</Text>
+            {simulateEnabled ? (
+              <>
+                <Alert color="yellow" icon={<IconAlertTriangle size={16} />} mb="sm" variant="light">
+                  No scanner is wired yet — this simulates a capture so the rest of the flow can be tested.
+                </Alert>
+                <Group align="flex-end">
+                  <Select label="Modality" data={MODALITIES} value={modality} onChange={(v) => setModality((v as BiometricModality) ?? 'FINGERPRINT')} w={160} />
+                  <TextInput label="Device (optional)" placeholder="scanner-01" value={deviceId} onChange={(e) => setDeviceId(e.currentTarget.value)} w={180} />
+                  <Button leftSection={<IconScan size={16} />} onClick={handleEnroll} loading={enrolling}>
+                    Simulate Scan &amp; Enroll
+                  </Button>
+                </Group>
+              </>
+            ) : (
+              <Alert color="gray" icon={<IconAlertTriangle size={16} />} variant="light">
+                No scanner is wired yet, and capture simulation is off in this environment.
+              </Alert>
+            )}
+          </Card>
+
+          <Card withBorder radius="md" p="md">
+            <Text fz="sm" fw={600} mb="sm">Biometric Subject ID (BSID)</Text>
+            <Text fz="xs" c="dimmed" mb="sm">
+              Required before this registration can be approved. Generating it is final —
+              confirm the capture is good first.
+            </Text>
+            <Group justify="space-between">
+              {bsid ? (
+                <StatusBadge tone="success" label={`BSID ${bsid}`} />
+              ) : (
+                <Badge color="gray" variant="light">Not generated</Badge>
+              )}
+              {!bsid && (
+                <Button
+                  size="xs"
+                  onClick={handleGenerateBsid}
+                  loading={generatingBsid}
+                  disabled={!hasActive('FINGERPRINT') && !hasActive('FACE')}
+                >
+                  Generate BSID
+                </Button>
+              )}
+            </Group>
+          </Card>
+
+          <Card withBorder radius="md" p="md">
+            <Group justify="space-between" mb="sm">
+              <Text fz="sm" fw={600}>On file</Text>
+              <Button
+                variant="light"
+                size="xs"
+                leftSection={<IconPrinter size={14} />}
+                onClick={handlePrint}
+                loading={printing}
+              >
+                Print certificate
+              </Button>
+            </Group>
+            {isLoading ? (
+              <Loader size="sm" />
+            ) : (
+              <Stack gap="xs">
+                {MODALITIES.map((m) => (
+                  <Group key={m.value} justify="space-between" p="xs" style={{ borderRadius: 8, background: 'var(--mantine-color-default-hover)' }}>
+                    <Group gap="xs">
+                      <ThemeIcon variant="light" color={hasActive(m.value) ? 'teal' : 'gray'} size={30} radius="md">
+                        <IconFingerprint size={15} />
+                      </ThemeIcon>
+                      <Text fz="sm">{m.label}</Text>
+                    </Group>
+                    {hasActive(m.value) ? (
+                      <Group gap="xs">
+                        <StatusBadge tone="success" label="Enrolled" />
+                        <Button
+                          size="xs"
+                          color="red"
+                          variant="subtle"
+                          loading={revoking}
+                          onClick={() => {
+                            const row = (enrollments ?? []).find((e) => e.modality === m.value);
+                            if (row) handleRevoke(row.id);
+                          }}
+                        >
+                          Revoke
+                        </Button>
+                      </Group>
+                    ) : (
+                      <Badge color="gray" variant="light">Not enrolled</Badge>
+                    )}
+                  </Group>
+                ))}
+                {(enrollments ?? []).map((e) => (
+                  <Text key={e.id} fz="xs" c="dimmed">
+                    {e.modality} captured {showDate(e.enrolledAt)}{e.deviceId ? ` · ${e.deviceId}` : ''}
+                  </Text>
+                ))}
+              </Stack>
+            )}
+          </Card>
+        </Stack>
+      )}
+    </Container>
+  );
+}
+
+export default BiometricEnrollmentPage;
--- a/apps/backoffice/src/app/features/certificate-designer/config/designer.ts
+++ b/apps/backoffice/src/app/features/certificate-designer/config/designer.ts
@@ -1,9 +1,9 @@
 import type { Bilingual, LicenseCategory, LicenseTemplate, LicenseType } from '@ema-platform/api';

+import { BASE_API_URL } from '@ema-platform/api';
+
 /** Same resolution — and same fallback — the shared RTK Query baseQuery uses. */
-export const API_BASE_URL =
-  (import.meta as { env?: Record<string, string> }).env?.['VITE_BASE_API_URL'] ??
-  'http://localhost:3000/api';
+export const API_BASE_URL = BASE_API_URL;

 export const STATUS_COLOR: Record<LicenseTemplate['status'], string> = {
  DRAFT: 'gray',
--- a/apps/backoffice/src/app/features/certificate-requirements/components/ConditionBuilder.tsx
+++ b/apps/backoffice/src/app/features/certificate-requirements/components/ConditionBuilder.tsx
@@ -198,7 +198,7 @@ function ConditionArmFields({
              fz="xs"
              px={6}
              py={2}
-              bg="var(--mantine-color-gray-1)"
+              bg="var(--mantine-color-default-hover)"
              style={{ borderRadius: 4, cursor: 'pointer' }}
              onClick={() => setInValues((value.in ?? []).filter((_, idx) => idx !== i).map(String))}
              title={t('certReq.condition.removeValue', 'Click to remove')}
--- a/apps/backoffice/src/app/features/certificate-requirements/components/DocumentRequirementsTab.tsx
+++ b/apps/backoffice/src/app/features/certificate-requirements/components/DocumentRequirementsTab.tsx
@@ -127,7 +127,7 @@ export function DocumentRequirementsTab({ licenseType }: { licenseType: LicenseT
            ) : (
              <Stack gap="xs">
                {rows.map((req) => (
-                  <Card key={req.id} withBorder radius="sm" p="xs" bg="var(--mantine-color-gray-0)">
+                  <Card key={req.id} withBorder radius="sm" p="xs" bg="var(--mantine-color-default-hover)">
                    <Group justify="space-between" wrap="nowrap">
                      <div style={{ minWidth: 0 }}>
                        <Group gap={6}>
--- a/apps/backoffice/src/app/features/certificate-requirements/components/FormSchemaTab.tsx
+++ b/apps/backoffice/src/app/features/certificate-requirements/components/FormSchemaTab.tsx
@@ -209,7 +209,7 @@ export function FormSchemaTab({ licenseType }: { licenseType: LicenseType }) {
            <Card key={section.key} withBorder radius="md" p="md">
              <Group justify="space-between" align="flex-start" mb="sm">
                <Group gap="xs" wrap="nowrap">
-                  <IconGripVertical size={16} color="var(--mantine-color-gray-5)" />
+                  <IconGripVertical size={16} color="var(--mantine-color-dimmed)" />
                  <div>
                    <Group gap="xs">
                      <Text fw={700}>{localized(section.title) || section.key}</Text>
@@ -237,7 +237,7 @@ export function FormSchemaTab({ licenseType }: { licenseType: LicenseType }) {

              <Stack gap="xs">
                {section.fields.map((field, fIndex) => (
-                  <Card key={field.key} withBorder radius="sm" p="xs" bg="var(--mantine-color-gray-0)">
+                  <Card key={field.key} withBorder radius="sm" p="xs" bg="var(--mantine-color-default-hover)">
                    <Group justify="space-between" wrap="nowrap">
                      <Group gap="xs" wrap="nowrap" style={{ minWidth: 0 }}>
                        <div style={{ minWidth: 0 }}>
--- a/apps/backoffice/src/app/features/exam/api/exam-api.ts
+++ b/apps/backoffice/src/app/features/exam/api/exam-api.ts
@@ -12,6 +12,7 @@ import type {
  CreateIncidentPayload,
  ResolveIncidentPayload,
  RegradeOutcome,
+  GradingSheet,
 } from '../types/exam';

 const examApi = baseApi.injectEndpoints({
@@ -101,6 +102,15 @@ const examApi = baseApi.injectEndpoints({
      }),
      invalidatesTags: ['Api'],
    }),
+    /** The candidate's answers plus auto-computable CHOICE scores, for RecordResultModal. */
+    getGradingSheet: builder.query<
+      GradingSheet,
+      { examId: string; profileId: string }
+    >({
+      query: ({ examId, profileId }) =>
+        `/exam-attempts/exam/${examId}/candidate/${profileId}/grading-sheet`,
+      providesTags: ['Api'],
+    }),
  }),
  overrideExisting: false,
 });
@@ -119,4 +129,5 @@ export const {
  useRecordIncidentMutation,
  useResolveIncidentMutation,
  useRegradeAttemptMutation,
+  useGetGradingSheetQuery,
 } = examApi;
--- a/apps/backoffice/src/app/features/exam/pages/ExamDetailPage.tsx
+++ b/apps/backoffice/src/app/features/exam/pages/ExamDetailPage.tsx
@@ -22,6 +22,7 @@ import {
  TextInput,
  ThemeIcon,
  Box,
+  Tooltip,
  rem,
 } from "@mantine/core";
 import { useDisclosure } from "@mantine/hooks";
@@ -48,6 +49,7 @@ import {
  useUpdateExamMutation,
  useAssignQuestionsMutation,
  useSelectRandomQuestionsMutation,
+  useGetExamRegistrationsQuery,
 } from '../api/exam-api';
 import { useGetQuestionsQuery } from '../../question/api/question-api';
 import { useGetCertificationsQuery } from '../../certification/api/certification-api';
@@ -114,6 +116,12 @@ export function ExamDetailPage() {
  const [selectRandom, { isLoading: isDrawing }] = useSelectRandomQuestionsMutation();

  const { data: exam, isLoading, isError } = useGetExamQuery(id ?? '', { skip: !id });
+  // The backend locks the paper the moment the first candidate registers
+  // (ExamService.assertPaperEditable) — every candidate must sit the same
+  // paper. Same query ExamCandidatesPanel already runs, so RTK Query serves
+  // it from cache rather than issuing a second request.
+  const { data: registrations } = useGetExamRegistrationsQuery(id ?? '', { skip: !id });
+  const paperLocked = (registrations?.length ?? 0) > 0;
  const { data: qRes } = useGetQuestionsQuery();
  const { data: certRes } = useGetCertificationsQuery();
  const allQuestions = qRes?.items ?? [];
@@ -122,10 +130,14 @@ export function ExamDetailPage() {
  // Only approved bank items may go on a paper (US-EXAM-003), so the picker
  // must not offer drafts or retired questions either.
  //
-  // BOTH describes a mixed paper — a question itself is never "BOTH" (see
+  // Filters on exam.form alone, not administrationMethod: the backend no
+  // longer restricts ONLINE to CHOICE (ExamService no longer has an
+  // assertOnlineIsChoiceOnly gate), so exam.form is now the sole source of
+  // truth for what belongs on the paper, ONLINE or OFFLINE alike. BOTH
+  // describes a mixed paper — a question itself is never "BOTH" (see
  // QuestionForm), so an equality check against it would match nothing and
-  // silently offer zero questions. Same skip-condition as the backend's own
-  // random draw (ExamService.selectRandomQuestions).
+  // silently offer zero questions; skipped the same way the backend's own
+  // random draw does (ExamService.selectRandomQuestions).
  const eligibleQuestions = useMemo(() => {
    if (!exam) return [];
    return allQuestions
@@ -179,7 +191,9 @@ export function ExamDetailPage() {
    } catch (error) {
      const key = extractErrorMessage(error, t('exam.randomError'));
      notify.error(
-        key.startsWith('insufficient_approved_questions')
+        key === 'paper_locked_after_registration'
+          ? t('exam.paperLockedHint', { count: registrations?.length ?? 0 })
+          : key.startsWith('insufficient_approved_questions')
          ? `${t('exam.notEnoughApproved')} (${key.split(':')[1] ?? ''})`
          : key.startsWith('paper_cannot_reach_cutting_point')
            ? t('exam.cannotReachCuttingPoint', {
@@ -200,7 +214,9 @@ export function ExamDetailPage() {
    } catch (error) {
      const key = extractErrorMessage(error, 'Failed to assign questions');
      notify.error(
-        key.startsWith('question_not_approved')
+        key === 'paper_locked_after_registration'
+          ? t('exam.paperLockedHint', { count: registrations?.length ?? 0 })
+          : key.startsWith('question_not_approved')
          ? t('question.qc.onlyApprovedUsable')
          : key.startsWith('paper_cannot_reach_cutting_point')
            ? t('exam.cannotReachCuttingPoint', {
@@ -452,19 +468,45 @@ export function ExamDetailPage() {
            {t("exam.detail.questionsSection", { pts: totalPoints })}
          </Title>
          <RequirePermission anyOf={[LICENSE_PERMISSIONS.MANAGE_EXAMS]} hideOnly>
-            <Button
-              variant="light"
-              size="xs"
-              leftSection={<IconPlus size={14} />}
-              onClick={openAssignModal}
-            >
-              {t("exam.manageQuestions")}
-            </Button>
+            <Group gap="xs">
+              {paperLocked && (
+                <Badge size="sm" variant="light" color="gray">
+                  {t("exam.paperLocked")}
+                </Badge>
+              )}
+              <Tooltip
+                label={t("exam.paperLockedHint", {
+                  count: registrations?.length ?? 0,
+                })}
+                disabled={!paperLocked}
+                multiline
+                w={280}
+              >
+                {/* Wrapped: a disabled Mantine Button fires no pointer events,
+                    so the tooltip needs an enabled element to hang off. */}
+                <Box>
+                  <Button
+                    variant="light"
+                    size="xs"
+                    leftSection={<IconPlus size={14} />}
+                    onClick={openAssignModal}
+                    disabled={paperLocked}
+                  >
+                    {t("exam.manageQuestions")}
+                  </Button>
+                </Box>
+              </Tooltip>
+            </Group>
          </RequirePermission>
        </Group>
        {(exam.questions ?? []).length === 0 ? (
-          <Alert color="gray" icon={<IconInfoCircle size={16} />}>
-            {t("exam.noQuestionsAssigned")}
+          <Alert
+            color={paperLocked ? "red" : "gray"}
+            icon={<IconInfoCircle size={16} />}
+          >
+            {paperLocked
+              ? t("exam.paperLockedHint", { count: registrations?.length ?? 0 })
+              : t("exam.noQuestionsAssigned")}
          </Alert>
        ) : (
          <Stack gap="md">
--- a/apps/backoffice/src/app/features/exam/pages/ExamPage/index.tsx
+++ b/apps/backoffice/src/app/features/exam/pages/ExamPage/index.tsx
@@ -79,21 +79,44 @@ function ExamForm({
  const [status, setStatus] = useState<string | null>(editing?.status ?? null);
  const [activeTab, setActiveTab] = useState<string | null>("basic");

-  const handleSubmit = (e: React.FormEvent) => {
-    e.preventDefault();
+  /**
+   * Split per tab so "Next" can check just the tab in front of the user.
+   * Submitting from Basic Info used to complain about Settings fields the
+   * user had not been shown yet — the error was correct and unactionable at
+   * the same time. Each returns the message key for what is missing, or null.
+   */
+  const validateBasic = (): string | null => {
    if (!certificationId || !titleEn || !titleAm || !date || !venue) {
-      setActiveTab("basic");
-      notify.error(t("exam.form.fillRequiredBasic"));
-      return;
+      return "exam.form.fillRequiredBasic";
    }
    if ((directionEn || directionAm) && !(directionEn && directionAm)) {
-      setActiveTab("basic");
-      notify.error(t("exam.form.directionBothLanguages"));
+      return "exam.form.directionBothLanguages";
+    }
+    return null;
+  };
+
+  const validateSettings = (): string | null =>
+    !type || !form || !adminMethod || !evalMethod || !cuttingPoint
+      ? "exam.form.fillRequiredSettings"
+      : null;
+
+  const goNext = () => {
+    const error = validateBasic();
+    if (error) {
+      notify.error(t(error));
      return;
    }
-    if (!type || !form || !adminMethod || !evalMethod || !cuttingPoint) {
-      setActiveTab("settings");
-      notify.error(t("exam.form.fillRequiredSettings"));
+    setActiveTab("settings");
+  };
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+    // Still checks both: the tabs are clickable, so a user can reach Settings
+    // without going through Next.
+    const error = validateBasic() ?? validateSettings();
+    if (error) {
+      setActiveTab(error === "exam.form.fillRequiredSettings" ? "settings" : "basic");
+      notify.error(t(error));
      return;
    }
    onSubmit(
@@ -255,12 +278,6 @@ function ExamForm({
                  onChange={setForm}
                  size="sm"
                  required
-                  disabled={adminMethod === "ONLINE"}
-                  description={
-                    adminMethod === "ONLINE"
-                      ? t("exam.form.onlineChoiceOnlyHint")
-                      : undefined
-                  }
                />
                <Select
                  label={t("exam.detail.administration")}
@@ -270,14 +287,7 @@ function ExamForm({
                    { value: "ONLINE", label: t("exam.form.online") },
                  ]}
                  value={adminMethod}
-                  onChange={(value) => {
-                    setAdminMethod(value);
-                    // Online exams are graded automatically, and that only
-                    // has an answer model for CHOICE — matches the backend
-                    // rule (online_exam_requires_choice_form), not just a
-                    // UI nicety.
-                    if (value === "ONLINE") setForm("CHOICE");
-                  }}
+                  onChange={setAdminMethod}
                  size="sm"
                  required
                />
@@ -350,9 +360,26 @@ function ExamForm({
          <Button variant="default" onClick={onCancel} size="sm">
            {t("exam.cancel")}
          </Button>
-          <Button type="submit" size="sm" loading={isSubmitting}>
-            {editing ? t("exam.update") : t("exam.create")}
-          </Button>
+          {activeTab === "basic" ? (
+            /* Not type="submit": Basic Info is not the last step, so the
+               primary action advances rather than saves. */
+            <Button size="sm" onClick={goNext}>
+              {t("exam.form.next")}
+            </Button>
+          ) : (
+            <>
+              <Button
+                variant="default"
+                size="sm"
+                onClick={() => setActiveTab("basic")}
+              >
+                {t("exam.form.back")}
+              </Button>
+              <Button type="submit" size="sm" loading={isSubmitting}>
+                {editing ? t("exam.update") : t("exam.create")}
+              </Button>
+            </>
+          )}
        </ModalFooter>
      </form>
    </Modal>
--- a/apps/backoffice/src/app/features/exam/types/exam.ts
+++ b/apps/backoffice/src/app/features/exam/types/exam.ts
@@ -133,6 +133,24 @@ export interface ExamRegistration {
 export type RegradeOutcome =
  { graded: true; resultId: string } | { graded: false; reason: string };

+/** One question's row on the staff grading sheet — the candidate's own
+ * answer plus the auto-computable score, where one exists. */
+export interface GradingSheetQuestion {
+  questionId: string;
+  form: QuestionForm;
+  points: number;
+  answerText: string | null;
+  selectedOptionId: string | null;
+  selectedOptionText: { en?: string; am?: string } | null;
+  /** null means "no auto-score" — examiner enters one by hand. */
+  autoScore: number | null;
+}
+
+export interface GradingSheet {
+  attemptStatus: 'IN_PROGRESS' | 'SUBMITTED' | 'EXPIRED';
+  questions: GradingSheetQuestion[];
+}
+
 export interface RecordAttendancePayload {
  registrationId: string;
  status: AttendanceStatus;
--- a/apps/backoffice/src/app/features/license-review/components/ScheduleExamModal.tsx
+++ b/apps/backoffice/src/app/features/license-review/components/ScheduleExamModal.tsx
@@ -22,6 +22,9 @@ interface Props {
 * of a per-candidate appointment. Scoped to sittings whose certification
 * matches this application's rank, so a Chief Mate candidate cannot be seated
 * into an OOW Deck sitting by accident.
+ *
+ * Scheduling makes the sitting available; it does not register the candidate.
+ * That is their own act, from the portal's Register button.
 */
 export function ScheduleExamModal({
  opened,
@@ -61,7 +64,7 @@ export function ScheduleExamModal({
        <Text size="sm" c="dimmed">
          {t('review.scheduleExam.intro', {
            defaultValue:
-              'Assign {{applicant}} to a scheduled sitting. They will be notified with the date and their admission number.',
+              'Make a sitting available to {{applicant}}. They register for it themselves from the portal.',
            applicant: applicantName,
          })}
        </Text>
@@ -89,7 +92,7 @@ export function ScheduleExamModal({
        <Text size="xs" c="dimmed">
          {t(
            'review.scheduleExam.admissionHint',
-            'An admission number is issued automatically when the candidate is seated.',
+            'Scheduling does not seat the candidate. They must register for the sitting from the portal, and the admission number is issued then.',
          )}
        </Text>

--- a/apps/backoffice/src/app/features/license-review/config/actions.ts
+++ b/apps/backoffice/src/app/features/license-review/config/actions.ts
@@ -28,6 +28,7 @@ export type ActionId =
  | 'complete-review'
  | 'approve-documents'
  | 'schedule-inspection'
+  | 'reschedule-inspection'
  | 'record-inspection'
  | 'final-approve'
  | 'request-adjustment'
@@ -200,6 +201,17 @@ export const ACTIONS: ActionDefinition[] = [
    permissions: ['can:create:inspection'],
    emphasis: 'filled',
  },
+  {
+    id: 'reschedule-inspection',
+    tier: 'primary',
+    labelKey: 'review.actions.rescheduleInspection',
+    from: ['INSPECTION_PENDING', 'INSPECTION_FAILED'],
+    // Either permission: the team leader who booked the visit holds CREATE,
+    // the inspector who has to attend holds UPDATE, and both have a reason to
+    // move it. The server guards the same pair.
+    permissions: ['can:create:inspection', 'can:update:inspection'],
+    emphasis: 'light',
+  },
  {
    id: 'record-inspection',
    tier: 'primary',
@@ -212,12 +224,15 @@ export const ACTIONS: ActionDefinition[] = [
    id: 'final-approve',
    tier: 'primary',
    labelKey: 'review.actions.finalApprove',
-    from: ['INSPECTION_COMPLETED',
-      'REVIEW_REPORTED',
-      'INSPECTION_REPORTED', 'UNDER_EVALUATION'],
    // ELIGIBILITY_PAID: an examined certificate (CoC/CoP) is decided straight
    // off the eligibility queue — no assignment step.
-    from: ['INSPECTION_COMPLETED', 'UNDER_EVALUATION', 'ELIGIBILITY_PAID'],
+    from: [
+      'INSPECTION_COMPLETED',
+      'REVIEW_REPORTED',
+      'INSPECTION_REPORTED',
+      'UNDER_EVALUATION',
+      'ELIGIBILITY_PAID',
+    ],
    permissions: ['can:approve:license-application'],
    emphasis: 'filled',
    color: 'teal',
@@ -227,13 +242,12 @@ export const ACTIONS: ActionDefinition[] = [
    id: 'request-adjustment',
    tier: 'primary',
    labelKey: 'review.actions.requestAdjustment',
-    from: ['UNDER_REVIEW', 'UNDER_EVALUATION', 'INSPECTION_COMPLETED',
-      'REVIEW_REPORTED',
-      'INSPECTION_REPORTED'],
    from: [
      'UNDER_REVIEW',
      'UNDER_EVALUATION',
      'INSPECTION_COMPLETED',
+      'REVIEW_REPORTED',
+      'INSPECTION_REPORTED',
      'INSPECTION_FAILED',
      'ELIGIBILITY_PAID',
    ],
@@ -439,6 +453,12 @@ export function resolveActions(ctx: ResolveContext): ResolvedAction[] {
      // one applies depends on whether an inspection is already booked.
      if (action.id === 'schedule-inspection' && ctx.hasPendingInspection) return [];
      if (action.id === 'record-inspection' && !ctx.hasPendingInspection) return [];
+      // The mirror of the scheduling gate: there is nothing to move until a
+      // visit is booked, and once one is, moving it is the officer's only
+      // option until the day arrives.
+      if (action.id === 'reschedule-inspection' && !ctx.hasPendingInspection) {
+        return [];
+      }

      // The transition table doesn't know which types need an inspection, so
      // `availableEvents` lists approve-documents at UNDER_EVALUATION even for
--- a/apps/backoffice/src/app/features/license-review/pages/LicenseReviewPage/index.tsx
+++ b/apps/backoffice/src/app/features/license-review/pages/LicenseReviewPage/index.tsx
@@ -32,6 +32,7 @@ import {
  IconLayoutSidebarRightCollapse,
  IconLayoutSidebarRightExpand,
  IconPaperclip,
+  IconPencil,
  IconQuestionMark,
  IconX,
 } from "@tabler/icons-react";
@@ -70,6 +71,7 @@ import {
  useRequestAdjustmentMutation,
  useResumeApplicationMutation,
  useScheduleInspectionMutation,
+  useRescheduleInspectionMutation,
  useGetCertificateUrlForOfficerMutation,
  uploadDocument,
  type RemarkTargetType,
@@ -218,6 +220,7 @@ export function LicenseReviewPage() {
  const [finalApprove] = useFinalApproveMutation();
  const [rejectApplication] = useRejectApplicationMutation();
  const [scheduleInspection] = useScheduleInspectionMutation();
+  const [rescheduleInspection] = useRescheduleInspectionMutation();
  const [recordResult] = useRecordInspectionResultMutation();
  const [confirmPayment] = useConfirmPaymentMutation();
  const [scheduleIssuance] = useScheduleIssuanceMutation();
@@ -261,6 +264,9 @@ export function LicenseReviewPage() {
  const [inspectionTimeSlot, setInspectionTimeSlot] = useState<"MORNING" | "AFTERNOON">(
    "MORNING",
  );
+  /** The booking modal moves an existing visit rather than creating one. */
+  const [rescheduling, setRescheduling] = useState(false);
+  const [rescheduleReason, setRescheduleReason] = useState("");
  const [issuanceOpen, setIssuanceOpen] = useState(false);
  const [issuanceDate, setIssuanceDate] = useState("");
  const [issuancePeriod, setIssuancePeriod] = useState<"MORNING" | "AFTERNOON">(
@@ -314,10 +320,14 @@ export function LicenseReviewPage() {

  const pendingInspection = inspections.find((i) => i.status === 'SCHEDULED');
  // A visit cannot have an outcome before it happens — mirror of the server's
-  // inspection_not_yet_due guard, compared instant-to-instant.
+  // inspection_not_yet_due guard. The column holds a calendar day, so the
+  // comparison is between day strings in the authority's timezone: parsing
+  // "2026-08-28" as a Date would read it as UTC midnight, i.e. 03:00 in Addis.
  const inspectionNotYetDue = Boolean(
    pendingInspection?.scheduledDate &&
-      new Date(pendingInspection.scheduledDate) > new Date(),
+      new Intl.DateTimeFormat("en-CA", { timeZone: "Africa/Addis_Ababa" }).format(
+        new Date(),
+      ) < pendingInspection.scheduledDate.slice(0, 10),
  );

  const { data: findingsEvidence = [], refetch: refetchFindingsEvidence } =
@@ -561,12 +571,29 @@ export function LicenseReviewPage() {
    }
  }

+  /** Opens the booking modal seeded with the visit already on the books. */
+  function openReschedule() {
+    if (!pendingInspection) return;
+    setRescheduling(true);
+    setInspectionDate(pendingInspection.scheduledDate ?? "");
+    setInspectionTimeSlot(pendingInspection.timeSlot ?? "MORNING");
+    setRescheduleReason("");
+    setInspectionOpen(true);
+  }
+
  /** Actions with their own dedicated form open that; the rest confirm. */
  function handleAction(action: ResolvedAction) {
    switch (action.id) {
      case "schedule-inspection":
+        setRescheduling(false);
+        setInspectionDate("");
+        setInspectionTimeSlot("MORNING");
+        setRescheduleReason("");
        setInspectionOpen(true);
        return;
+      case "reschedule-inspection":
+        openReschedule();
+        return;
      case "schedule-issuance":
        setIssuanceOpen(true);
        return;
@@ -1222,18 +1249,6 @@ export function LicenseReviewPage() {
            </Tabs.Panel>

            <Tabs.Panel value="inspection">
-              {status === "INSPECTION_FAILED" && (
-                <Alert
-                  mb="md"
-                  color="red"
-                  icon={<IconAlertTriangle size={16} />}
-                >
-                  {t(
-                    "review.inspectionFailedBlocked",
-                    "Approval is unavailable because the inspection failed. Schedule a re-inspection, request corrections, or reject the application.",
-                  )}
-                </Alert>
-              )}
              <Paper withBorder p="md">
                {inspections.length === 0 ? (
                  <Text size="sm" c="dimmed">
@@ -1266,21 +1281,48 @@ export function LicenseReviewPage() {
                            </Text>
                          )}
                        </div>
-                        <Badge
-                          variant="light"
-                          color={
-                            inspection.result === "FAILED" ? "red" : "teal"
-                          }
-                        >
-                          {inspection.result === "PASSED"
-                            ? t("review.passed", "Passed")
-                            : inspection.result === "FAILED"
-                              ? t("review.failed", "Failed")
-                              : t(
-                                  `review.inspectionStatus.${inspection.status}`,
-                                  inspection.status,
+                        <Group gap="xs">
+                          {inspection.status === "SCHEDULED" &&
+                            inspection.id === pendingInspection?.id &&
+                            can([
+                              "can:create:inspection",
+                              "can:update:inspection",
+                            ]) && (
+                              <Tooltip
+                                label={t(
+                                  "review.actions.rescheduleInspection",
+                                  "Reschedule inspection",
                                )}
-                        </Badge>
+                              >
+                                <ActionIcon
+                                  variant="subtle"
+                                  size="sm"
+                                  aria-label={t(
+                                    "review.actions.rescheduleInspection",
+                                    "Reschedule inspection",
+                                  )}
+                                  onClick={openReschedule}
+                                >
+                                  <IconPencil size={16} />
+                                </ActionIcon>
+                              </Tooltip>
+                            )}
+                          <Badge
+                            variant="light"
+                            color={
+                              inspection.result === "FAILED" ? "red" : "teal"
+                            }
+                          >
+                            {inspection.result === "PASSED"
+                              ? t("review.passed", "Passed")
+                              : inspection.result === "FAILED"
+                                ? t("review.failed", "Failed")
+                                : t(
+                                    `review.inspectionStatus.${inspection.status}`,
+                                    inspection.status,
+                                  )}
+                          </Badge>
+                        </Group>
                      </Group>
                    ))}
                  </Stack>
@@ -1289,6 +1331,18 @@ export function LicenseReviewPage() {
            </Tabs.Panel>
          </Tabs>

+          {/* Page-level, not inside the inspection tab: a license type
+              configured without an inspection detail section must still show
+              why approval is blocked if it ever lands here. */}
+          {status === "INSPECTION_FAILED" && (
+            <Alert mt="md" color="red" icon={<IconAlertTriangle size={16} />}>
+              {t(
+                "review.inspectionFailedBlocked",
+                "Approval is unavailable because the inspection failed. Schedule a re-inspection, request corrections, or reject the application.",
+              )}
+            </Alert>
+          )}
+
          {status === "PAYMENT_PENDING" && (
            <Alert
              mt="md"
@@ -1438,7 +1492,11 @@ export function LicenseReviewPage() {
      <Modal
        opened={inspectionOpen}
        onClose={() => setInspectionOpen(false)}
-        title={t("review.actions.scheduleInspection", "Schedule inspection")}
+        title={
+          rescheduling
+            ? t("review.actions.rescheduleInspection", "Reschedule inspection")
+            : t("review.actions.scheduleInspection", "Schedule inspection")
+        }
      >
        <Stack>
          <AmharicDatePicker
@@ -1454,36 +1512,72 @@ export function LicenseReviewPage() {
              { value: "AFTERNOON", label: t("review.afternoon", "Afternoon") },
            ]}
          />
+          {rescheduling && (
+            <Textarea
+              label={t("review.rescheduleReason", "Why is it moving?")}
+              description={t(
+                "review.rescheduleReasonHint",
+                "Kept in the audit trail and sent to the applicant.",
+              )}
+              value={rescheduleReason}
+              onChange={(e) => setRescheduleReason(e.currentTarget.value)}
+              autosize
+              minRows={2}
+            />
+          )}
          <ModalFooter>
+            {/* Mantine strips pointer events from a disabled control, so the
+                tooltip wraps a span — same trick as DecisionBar's ActionButton;
+                a disabled button must still say why. */}
            <Tooltip
              label={t("review.pickDate", "Pick a date first")}
              disabled={Boolean(inspectionDate)}
            >
-              <span>
-                <button type="button" hidden aria-hidden />
-              </span>
-            </Tooltip>
+              <span style={{ display: "inline-flex" }}>
            <ActionIcon
              variant="filled"
              size="lg"
              disabled={!inspectionDate}
-              aria-label={t("review.schedule", "Schedule")}
+              aria-label={
+                rescheduling
+                  ? t("review.reschedule", "Reschedule")
+                  : t("review.schedule", "Schedule")
+              }
              onClick={() =>
                run(
                  async () => {
-                    await scheduleInspection({
-                      applicationId: id,
-                      scheduledDate: inspectionDate,
-                      timeSlot: inspectionTimeSlot,
-                    }).unwrap();
+                    if (rescheduling) {
+                      // Guarded by the action's own gate, which only offers
+                      // rescheduling while a booking exists.
+                      if (!pendingInspection) return;
+                      await rescheduleInspection({
+                        inspectionId: pendingInspection.id,
+                        applicationId: id,
+                        scheduledDate: inspectionDate,
+                        timeSlot: inspectionTimeSlot,
+                        ...(rescheduleReason.trim()
+                          ? { reason: rescheduleReason.trim() }
+                          : {}),
+                      }).unwrap();
+                    } else {
+                      await scheduleInspection({
+                        applicationId: id,
+                        scheduledDate: inspectionDate,
+                        timeSlot: inspectionTimeSlot,
+                      }).unwrap();
+                    }
                    setInspectionOpen(false);
                  },
-                  t("review.done.scheduled", "Inspection scheduled"),
+                  rescheduling
+                    ? t("review.done.rescheduled", "Inspection rescheduled")
+                    : t("review.done.scheduled", "Inspection scheduled"),
                )
              }
            >
              <IconCheck size={18} />
            </ActionIcon>
+              </span>
+            </Tooltip>
          </ModalFooter>
        </Stack>
      </Modal>
@@ -1508,35 +1602,37 @@ export function LicenseReviewPage() {
            ]}
          />
          <ModalFooter>
+            {/* Span-wrapped like DecisionBar's ActionButton — Mantine strips
+                pointer events from a disabled control, and a disabled button
+                must still say why. */}
            <Tooltip
              label={t("review.pickDate", "Pick a date first")}
              disabled={Boolean(issuanceDate)}
            >
-              <span>
-                <button type="button" hidden aria-hidden />
+              <span style={{ display: "inline-flex" }}>
+                <ActionIcon
+                  variant="filled"
+                  size="lg"
+                  disabled={!issuanceDate}
+                  aria-label={t("review.schedule", "Schedule")}
+                  onClick={() =>
+                    run(
+                      async () => {
+                        await scheduleIssuance({
+                          id,
+                          scheduledDate: issuanceDate,
+                          scheduledPeriod: issuancePeriod,
+                        }).unwrap();
+                        setIssuanceOpen(false);
+                      },
+                      t("review.done.scheduleIssuance", "Pickup scheduled"),
+                    )
+                  }
+                >
+                  <IconCheck size={18} />
+                </ActionIcon>
              </span>
            </Tooltip>
-            <ActionIcon
-              variant="filled"
-              size="lg"
-              disabled={!issuanceDate}
-              aria-label={t("review.schedule", "Schedule")}
-              onClick={() =>
-                run(
-                  async () => {
-                    await scheduleIssuance({
-                      id,
-                      scheduledDate: issuanceDate,
-                      scheduledPeriod: issuancePeriod,
-                    }).unwrap();
-                    setIssuanceOpen(false);
-                  },
-                  t("review.done.scheduleIssuance", "Pickup scheduled"),
-                )
-              }
-            >
-              <IconCheck size={18} />
-            </ActionIcon>
          </ModalFooter>
        </Stack>
      </Modal>
--- a/apps/backoffice/src/app/features/result/components/RecordResultModal/columns.tsx
+++ b/apps/backoffice/src/app/features/result/components/RecordResultModal/columns.tsx
@@ -1,7 +1,7 @@
-import { NumberInput, Text, TextInput } from '@mantine/core';
+import { Badge, Group, NumberInput, Text, TextInput } from '@mantine/core';
 import type { TFunction } from 'i18next';
 import type { AdvancedColumn } from '@ema-platform/ui';
-import type { QuestionBrief } from '../../../exam/types/exam';
+import type { GradingSheetQuestion, QuestionBrief } from '../../../exam/types/exam';

 export function recordResultColumns(
  t: TFunction,
@@ -11,6 +11,9 @@ export function recordResultColumns(
    questionRemarks: Record<string, string>;
    onScoreChange: (questionId: string, value: number) => void;
    onRemarkChange: (questionId: string, value: string) => void;
+    /** The candidate's own answer + auto-score, when available (empty for
+     *  an OFFLINE candidate or one who hasn't sat an online attempt). */
+    answersByQuestion: Map<string, GradingSheetQuestion>;
  },
 ): AdvancedColumn<QuestionBrief>[] {
  return [
@@ -22,6 +25,20 @@ export function recordResultColumns(
        </Text>
      ),
    },
+    {
+      header: t('result.recordModal.candidateAnswer'),
+      cell: ({ row }) => {
+        const answer = handlers.answersByQuestion.get(row.original.id);
+        if (!answer || (!answer.answerText && !answer.selectedOptionText)) {
+          return <Text fz="xs" c="dimmed">{t('result.recordModal.noAnswer')}</Text>;
+        }
+        return (
+          <Text fz="sm" maw={220} lineClamp={3}>
+            {answer.selectedOptionText?.[locale] ?? answer.answerText}
+          </Text>
+        );
+      },
+    },
    {
      header: t('result.recordModal.maxPoints'),
      cell: ({ row }) => (
@@ -32,16 +49,26 @@ export function recordResultColumns(
    },
    {
      header: t('result.recordModal.score'),
-      cell: ({ row }) => (
-        <NumberInput
-          value={handlers.scores[row.original.id] ?? 0}
-          onChange={(v) => handlers.onScoreChange(row.original.id, Number(v))}
-          min={0}
-          max={row.original.points}
-          size="xs"
-          style={{ width: 80 }}
-        />
-      ),
+      cell: ({ row }) => {
+        const autoGraded = handlers.answersByQuestion.get(row.original.id)?.autoScore != null;
+        return (
+          <Group gap={4} wrap="nowrap">
+            <NumberInput
+              value={handlers.scores[row.original.id] ?? 0}
+              onChange={(v) => handlers.onScoreChange(row.original.id, Number(v))}
+              min={0}
+              max={row.original.points}
+              size="xs"
+              style={{ width: 80 }}
+            />
+            {autoGraded && (
+              <Badge size="xs" variant="light" color="teal">
+                {t('result.recordModal.autoGraded')}
+              </Badge>
+            )}
+          </Group>
+        );
+      },
    },
    {
      header: t('result.recordModal.remark'),
--- a/apps/backoffice/src/app/features/result/components/RecordResultModal/index.tsx
+++ b/apps/backoffice/src/app/features/result/components/RecordResultModal/index.tsx
@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import {
  Modal,
@@ -20,7 +20,7 @@ import { extractErrorMessage } from '@ema-platform/api';
 import { LICENSE_PERMISSIONS, RequirePermission } from '@ema-platform/auth';
 import { recordResultColumns } from './columns';
 import { useCreateResultMutation } from '../../api/result-api';
-import { useGetExamRegistrationsQuery } from '../../../exam/api/exam-api';
+import { useGetExamRegistrationsQuery, useGetGradingSheetQuery } from '../../../exam/api/exam-api';
 import type { Exam } from '../../../exam/types/exam';

 function InfoRow({ label, value }: { label: string; value: string }) {
@@ -55,12 +55,39 @@ export function RecordResultModal({
  const { data: registrations } = useGetExamRegistrationsQuery(exam.id, {
    skip: !opened,
  });
+  // The candidate's own answers plus whatever score auto-grading could
+  // already compute for the CHOICE portion — degrades to "no data" for an
+  // OFFLINE candidate or one who never sat an online attempt, same as
+  // before this existed.
+  const { data: gradingSheet } = useGetGradingSheetQuery(
+    { examId: exam.id, profileId: selectedSeafarerId ?? '' },
+    { skip: !opened || !selectedSeafarerId },
+  );
+  const answersByQuestion = new Map(
+    (gradingSheet?.questions ?? []).map((q) => [q.questionId, q]),
+  );
  const [createResult, { isLoading: isSaving }] = useCreateResultMutation();
  const table = useServerTable();

  const questions = exam.questions ?? [];
  const pagedQuestions = table.paginate(questions);

+  // Prefill (never override) the CHOICE questions auto-grading already
+  // scored — the examiner only has to key in the ESSAY marks. A fresh
+  // seafarer selection always starts from an empty scores map, so this
+  // only ever fills in blanks, never stomps a manual edit already made.
+  useEffect(() => {
+    if (!gradingSheet) return;
+    const autoScores: Record<string, number> = {};
+    for (const q of gradingSheet.questions) {
+      if (q.autoScore !== null) autoScores[q.questionId] = q.autoScore;
+    }
+    if (Object.keys(autoScores).length) {
+      setScores((prev) => ({ ...autoScores, ...prev }));
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [gradingSheet]);
+
  const seafarerOptions = (registrations ?? [])
    .filter((registration) =>
      ['PRESENT', 'LATE'].includes(registration.attendanceStatus),
@@ -175,6 +202,7 @@ export function RecordResultModal({
                questionRemarks,
                onScoreChange: handleScoreChange,
                onRemarkChange: handleQuestionRemarkChange,
+                answersByQuestion,
              })}
              data={pagedQuestions.rows}
              itemCount={pagedQuestions.itemCount}
--- a/apps/backoffice/src/app/features/seafarer-registration-review/pages/SeafarerRegistrationQueuePage.tsx
+++ b/apps/backoffice/src/app/features/seafarer-registration-review/pages/SeafarerRegistrationQueuePage.tsx
@@ -26,7 +26,7 @@ export function applicantName(r: Pick<SeafarerRegistration, 'firstName' | 'middl
  return [r.firstName, r.middleName, r.lastName].filter(Boolean).join(' ') || '—';
 }

-/** Submitted seafarer registrations, oldest first — click a row to review it. */
+/** Submitted seafarer registrations, newest first — click a row to review it. */
 export function SeafarerRegistrationQueuePage() {
  const navigate = useNavigate();
  const showDate = useDateDisplayer();
@@ -43,6 +43,8 @@ export function SeafarerRegistrationQueuePage() {
  const { data, isLoading, isFetching, refetch } = useListSeafarerRegistrationsQuery({
    status: status ?? undefined,
    search: debouncedSearch || undefined,
+    sortBy: 'submittedAt',
+    sortDir: 'DESC',
    take: pageSize,
    skip: page * pageSize,
  });
--- a/apps/backoffice/src/app/features/seafarer-registry/pages/SeafarerRegistryPage.tsx
+++ b/apps/backoffice/src/app/features/seafarer-registry/pages/SeafarerRegistryPage.tsx
@@ -184,7 +184,7 @@ export function SeafarerRegistryPage() {
      </SimpleGrid>

      {/* Search + filters */}
-      <Paper withBorder radius="lg" p="xl">
+      <Paper withBorder radius="lg" p={{ base: 'md', sm: 'xl' }}>
        <Group mb="sm" gap="sm" justify="space-between">
          <TextInput
            placeholder="Search by name, seafarer ID, or seaman book…"
@@ -215,6 +215,7 @@ export function SeafarerRegistryPage() {

        <Text fz="xs" c="dimmed" mb="sm">{filtered.length} seafarer(s) found</Text>

+        <Table.ScrollContainer minWidth={1100}>
        <Table highlightOnHover fz="sm" verticalSpacing="sm">
          <Table.Thead bg="var(--mantine-color-default-hover)">
            <Table.Tr>
@@ -278,6 +279,7 @@ export function SeafarerRegistryPage() {
            )}
          </Table.Tbody>
        </Table>
+        </Table.ScrollContainer>
      </Paper>

      <DetailModal sf={selected} opened={!!selected} onClose={() => setSelected(null)} />
--- a/apps/backoffice/src/app/features/user-management/UserManagementPage.tsx
+++ b/apps/backoffice/src/app/features/user-management/UserManagementPage.tsx
@@ -1,10 +1,14 @@
-import Cookies from 'js-cookie';
-import { useCallback, useEffect, useRef } from 'react';
-import { createRoot, type Root } from 'react-dom/client';
-import { useNavigate } from 'react-router-dom';
-import { UserManagementApp } from '@tria-plc/iamui';
-import type { DesignConfig, UserManagementSessionOptions } from '@tria-plc/iamui';
-import '@tria-plc/iamui/style.css';
+import Cookies from "js-cookie";
+import { useCallback, useEffect, useRef } from "react";
+import { createRoot, type Root } from "react-dom/client";
+import { useNavigate } from "react-router-dom";
+import { UserManagementApp } from "@tria-plc/iamui";
+import { BASE_API_URL } from "@ema-platform/api";
+import type {
+  DesignConfig,
+  UserManagementSessionOptions,
+} from "@tria-plc/iamui";
+import "@tria-plc/iamui/style.css";

 const UM_OVERRIDES = `
 .um-theme-light {
@@ -58,73 +62,73 @@ const UM_OVERRIDES = `

 const UM_CONFIG: DesignConfig = {
  brand: {
-    appName: 'Ethiopian Maritime Licence',
-    logoUrl: '/assets/emaLogo.jpg',
+    appName: "Ethiopian Maritime Licence",
+    logoUrl: "/assets/emaLogo.jpg",
  },
  colors: {
-    primary: '#2563eb',
-    sidebar: '#ffffff',
-    background: '#f8fafc',
-    foreground: '#1e293b',
-    border: '#e2e8f0',
-    mutedForeground: '#94a3b8',
-    card: '#ffffff',
+    primary: "#2563eb",
+    sidebar: "#ffffff",
+    background: "#f8fafc",
+    foreground: "#1e293b",
+    border: "#e2e8f0",
+    mutedForeground: "#94a3b8",
+    card: "#ffffff",
  },
  typography: {
-    fontFamily: 'Inter, ui-sans-serif, system-ui, sans-serif',
+    fontFamily: "Inter, ui-sans-serif, system-ui, sans-serif",
  },
  layout: {
-    userManagementView: 'classic',
-    sidebarBrandLabel: 'Ethiopian Maritime Authority',
-    sidebarBrandSublabel: 'User Management',
-    sidebarBackground: '#ffffff',
-    sidebarColor: '#1e293b',
-    sidebarMutedColor: '#94a3b8',
-    sidebarActiveBackground: '#eff6ff',
-    sidebarActiveColor: '#2563eb',
-    sidebarHoverBackground: '#f8fafc',
-    sidebarBorder: '#e2e8f0',
-    sidebarWidth: '280px',
-    sidebarCollapsedWidth: '80px',
-    modalAccentColor: '#2563eb',
-    modalHeaderBackground: '#f8fafc',
-    modalHeaderEditBackground: '#eff6ff',
-    modalIconBackground: '#eff6ff',
-    modalIconColor: '#2563eb',
-    modalTitleColor: '#1e293b',
-    modalFocusColor: '#2563eb',
-    modalSurface: '#ffffff',
+    userManagementView: "classic",
+    sidebarBrandLabel: "Ethiopian Maritime Authority",
+    sidebarBrandSublabel: "User Management",
+    sidebarBackground: "#ffffff",
+    sidebarColor: "#1e293b",
+    sidebarMutedColor: "#94a3b8",
+    sidebarActiveBackground: "#eff6ff",
+    sidebarActiveColor: "#2563eb",
+    sidebarHoverBackground: "#f8fafc",
+    sidebarBorder: "#e2e8f0",
+    sidebarWidth: "280px",
+    sidebarCollapsedWidth: "80px",
+    modalAccentColor: "#2563eb",
+    modalHeaderBackground: "#f8fafc",
+    modalHeaderEditBackground: "#eff6ff",
+    modalIconBackground: "#eff6ff",
+    modalIconColor: "#2563eb",
+    modalTitleColor: "#1e293b",
+    modalFocusColor: "#2563eb",
+    modalSurface: "#ffffff",
  },
 };

 const UM_RUNTIME = {
-  basename: '/um',
+  basename: "/um",
  // Keep the embedded IAM module on the same API as the backoffice client.
  // When VITE_BASE_API_URL is absent locally, passing undefined makes iamui
  // fall back to its remote development server, where the local JWT is
  // rejected and the module redirects to its login page.
-  apiUrl: import.meta.env.VITE_BASE_API_URL ?? 'http://localhost:3000/api',
+  apiUrl: import.meta.env.VITE_BASE_API_URL ?? "http://localhost:3000/api",
 };

 const buttonStyle: React.CSSProperties = {
-  position: 'fixed',
+  position: "fixed",
  top: 12,
  left: 12,
  zIndex: 9999,
-  display: 'flex',
-  alignItems: 'center',
+  display: "flex",
+  alignItems: "center",
  gap: 6,
-  padding: '8px 16px',
-  border: '1px solid #e2e8f0',
+  padding: "8px 16px",
+  border: "1px solid #e2e8f0",
  borderRadius: 8,
-  background: '#ffffff',
-  color: '#2563eb',
+  background: "#ffffff",
+  color: "#2563eb",
  fontSize: 14,
  fontWeight: 600,
-  cursor: 'pointer',
-  fontFamily: 'Inter, ui-sans-serif, system-ui, sans-serif',
-  boxShadow: '0 1px 3px rgba(0,0,0,0.08)',
-  transition: 'all 150ms ease',
+  cursor: "pointer",
+  fontFamily: "Inter, ui-sans-serif, system-ui, sans-serif",
+  boxShadow: "0 1px 3px rgba(0,0,0,0.08)",
+  transition: "all 150ms ease",
 };

 export default function UserManagementPage() {
@@ -133,29 +137,31 @@ export default function UserManagementPage() {
  const navigate = useNavigate();

  const handleReturn = useCallback(() => {
-    navigate('/dashboard');
+    navigate("/dashboard");
  }, [navigate]);

  useEffect(() => {
    if (!containerRef.current) return;

-    const style = document.createElement('style');
+    const style = document.createElement("style");
    style.textContent = UM_OVERRIDES;
    document.head.appendChild(style);

-    const token = Cookies.get('ema-backoffice-auth-token') ?? '';
-    const refreshToken = Cookies.get('ema-backoffice-refresh-token');
+    const token = Cookies.get("ema-backoffice-auth-token") ?? "";
+    const refreshToken = Cookies.get("ema-backoffice-refresh-token");

    const session: UserManagementSessionOptions = {
-      initialSession: token
-        ? { token, refreshToken, rememberMe: true }
-        : null,
+      initialSession: token ? { token, refreshToken, rememberMe: true } : null,
      enableEmbeddedAuthBridge: false,
    };

    rootRef.current = createRoot(containerRef.current);
    rootRef.current.render(
-      <UserManagementApp config={UM_CONFIG} runtime={UM_RUNTIME} session={session} />,
+      <UserManagementApp
+        config={UM_CONFIG}
+        runtime={UM_RUNTIME}
+        session={session}
+      />,
    );

    return () => {
@@ -173,21 +179,28 @@ export default function UserManagementPage() {
        onClick={handleReturn}
        style={buttonStyle}
        onMouseEnter={(e) => {
-          e.currentTarget.style.background = '#f8fafc';
-          e.currentTarget.style.boxShadow = '0 1px 6px rgba(0,0,0,0.12)';
+          e.currentTarget.style.background = "#f8fafc";
+          e.currentTarget.style.boxShadow = "0 1px 6px rgba(0,0,0,0.12)";
        }}
        onMouseLeave={(e) => {
-          e.currentTarget.style.background = '#ffffff';
-          e.currentTarget.style.boxShadow = '0 1px 3px rgba(0,0,0,0.08)';
-        }}
-      >
-        <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+          e.currentTarget.style.background = "#ffffff";
+          e.currentTarget.style.boxShadow = "0 1px 3px rgba(0,0,0,0.08)";
+        }}>
+        <svg
+          width="16"
+          height="16"
+          viewBox="0 0 24 24"
+          fill="none"
+          stroke="currentColor"
+          strokeWidth="2"
+          strokeLinecap="round"
+          strokeLinejoin="round">
          <path d="m12 19-7-7 7-7" />
          <path d="M19 12H5" />
        </svg>
        Return to EMA
      </button>
-      <div ref={containerRef} style={{ position: 'fixed', inset: 0 }} />
+      <div ref={containerRef} style={{ position: "fixed", inset: 0 }} />
    </>
  );
 }
--- a/apps/backoffice/src/app/i18n/locales/am.ts
+++ b/apps/backoffice/src/app/i18n/locales/am.ts
@@ -88,11 +88,14 @@ export const am: Translations = {
    btcQueue: "የBTC ወረፋ",
    cocQueue: "የCoC ወረፋ",
    copQueue: "የCoP ወረፋ",
+    endorsementCocQueue: "የCoC እውቅና ወረፋ",
+    endorsementGocQueue: "የGOC እውቅና ወረፋ",
    endorsementQueue: "የማስተያየት ወረፋ",
    vesselRegistrations: "የመርከብ ምዝገባ",
    // vesselRegistrationReport: 'የምዝገባ ሪፖርት',
    vesselTransfers: "የመርከብ ባለቤትነት ዝውውር",
    seafarerRegistry: "የመርከበኞች መዝገብ",
+    biometricEnrollment: "ባዮሜትሪክ ምዝገባ",
    seafarerRegistrationQueue: "የመርከበኞች ምዝገባ ወረፋ",
    applications: "ማመልከቻዎች",
    paymentConfig: "የክፍያ ውቅረት",
@@ -262,7 +265,6 @@ export const am: Translations = {
      both: "ሁለቱም",
      offline: "ከመስመር ውጪ",
      online: "በመስመር",
-      onlineChoiceOnlyHint: "የመስመር ላይ ፈተናዎች በራስ-ሰር ይመዘገባሉ፣ ይህም ለምርጫ ጥያቄዎች ብቻ ይሰራል።",
      sum: "ድምር",
      average: "አማካይ",
      percentage: "መቶኛ",
@@ -274,6 +276,8 @@ export const am: Translations = {
      cuttingPointPercentageHint: "የመቶኛ ግምገማ — ከ100 አይበልጥም።",
      fillRequiredBasic: "በመሠረታዊ መረጃ ውስጥ ያሉ አስፈላጊ መስኮችን ይሙሉ።",
      fillRequiredSettings: "በቅንብሮች ውስጥ ያሉ አስፈላጊ መስኮችን ይሙሉ — ዓይነት፣ ቅጽ፣ የአስተዳደር ዘዴ፣ የግምገማ ዘዴ እና የማለፊያ ነጥብ።",
+      next: "ቀጣይ",
+      back: "ተመለስ",
      directionBothLanguages: "መመሪያ በሁለቱም እንግሊዝኛ እና አማርኛ ጽሑፍ ያስፈልገዋል፣ ወይም ሁለቱንም ባዶ ይተዉ።",
      status: "ሁኔታ",
      statusPlaceholder: "የፈተና ሁኔታ",
@@ -390,6 +394,9 @@ export const am: Translations = {
    notEnoughApproved: "ለዚህ ትምህርት በቂ የጸደቁ ጥያቄዎች የሉም።",
    cannotReachCuttingPoint:
      "ይህ ወረቀት የማለፊያ ነጥቡን ሊደርስ አይችልም (ከፍተኛ {{max}}፣ የማለፊያ ነጥብ {{cuttingPoint}})። ተጨማሪ ወይም ከፍ ያለ ነጥብ ያላቸው ጥያቄዎችን ጨምር፣ ወይም የማለፊያ ነጥቡን ቀንስ።",
+    paperLocked: "ወረቀቱ ተቆልፏል",
+    paperLockedHint:
+      "ለዚህ ፈተና {{count}} ተፈታኝ(ዎች) ተመዝግበዋል። ሁሉም ተፈታኞች አንድ ዓይነት ወረቀት መፈተን ስላለባቸው ጥያቄዎቹ ከዚህ በኋላ አይቀየሩም።",
  },

  country: {
@@ -660,6 +667,9 @@ export const am: Translations = {
      seafarerPlaceholder: "መርከበኛ ይፈልጉ እና ይምረጡ",
      scorePerQuestion: "በጥያቄ ውጤት",
      question: "ጥያቄ",
+      candidateAnswer: "የተፈታኙ መልስ",
+      noAnswer: "የተመዘገበ መልስ የለም",
+      autoGraded: "በራስ-ሰር የተመዘነ",
      maxPoints: "ከፍተኛ ውጤት",
      score: "ውጤት",
      remark: "ማስታወሻ",
@@ -875,6 +885,7 @@ export const am: Translations = {
      DRAFT: "ረቂቅ",
      SUBMITTED: "ቀርቧል",
      UNDER_REVIEW: "በግምገማ ላይ",
+      AWAITING_BIOMETRICS: "ባዮሜትሪክ በመጠባበቅ ላይ",
      UNDER_EVALUATION: "በምዘና ላይ",
      RESUBMIT_REQUIRED: "እንደገና ማቅረብ ያስፈልጋል",
      INSPECTION_PENDING: "ምርመራ በመጠባበቅ ላይ",
@@ -995,6 +1006,9 @@ export const am: Translations = {
    morning: "ጠዋት",
    afternoon: "ከሰዓት በኋላ",
    schedule: "ያዝ",
+    reschedule: "አዛውር",
+    rescheduleReason: "ለምን ይዛወራል?",
+    rescheduleReasonHint: "በኦዲት መዝገብ ውስጥ ተይዞ ለአመልካቹ ይላካል።",
    pickDate: "መጀመሪያ ቀን ይምረጡ",
    passed: "አልፏል",
    failed: "ወድቋል",
@@ -1021,7 +1035,6 @@ export const am: Translations = {
    actions: {
      claim: "ውሰድ",
      assign: "መድብ",
-      assignReviewer: "ግምገማ መድብ",
      reportReview: "ለቡድን መሪ አሳውቅ",
      assignInspector: "ምርመራ መድብ",
      reportInspection: "የምርመራ ውጤት አሳውቅ",
@@ -1032,6 +1045,7 @@ export const am: Translations = {
      completeReview: "ግምገማ አጠናቅቅ",
      approveDocuments: "ሰነዶችን አጽድቅ",
      scheduleInspection: "ምርመራ ያዝ",
+      rescheduleInspection: "ምርመራ አዛውር",
      recordInspection: "የምርመራ ውጤት መዝግብ",
      finalApprove: "አጽድቅ እና ስጥ",
      requestAdjustment: "ማስተካከያ ጠይቅ",
@@ -1185,6 +1199,7 @@ export const am: Translations = {
      assign: "እንደገና ተመድቧል",
      assignReviewer: "ግምገማ ተመድቧል",
      scheduled: "ምርመራ ተይዟል",
+      rescheduled: "ምርመራ ተዛውሯል",
      inspectionPassed: "ምርመራ አልፏል",
      inspectionFailed: "ምርመራ ወድቋል",
    },
--- a/apps/backoffice/src/app/i18n/locales/en.ts
+++ b/apps/backoffice/src/app/i18n/locales/en.ts
@@ -88,10 +88,13 @@ export const en = {
    postWaiverQueue: 'Post-Waiver Queue',
    cocQueue: 'CoC Queue',
    copQueue: 'CoP Queue',
+    endorsementCocQueue: 'CoC Endorsement Queue',
+    endorsementGocQueue: 'GOC Endorsement Queue',
    endorsementQueue: 'Endorsement Queue',
    vesselRegistrations: 'Vessel Registration',
    vesselTransfers: 'Vessel Ownership Transfer',
    seafarerRegistry: 'Seafarer Registry',
+    biometricEnrollment: 'Biometric Enrollment',
    seafarerRegistrationQueue: 'Seafarer Registration Queue',
    applications: 'Applications',
    paymentConfig: 'Payment Config',
@@ -261,7 +264,6 @@ export const en = {
      both: 'Both',
      offline: 'Offline',
      online: 'Online',
-      onlineChoiceOnlyHint: 'Online exams are graded automatically, which only works for multiple choice.',
      sum: 'Sum',
      average: 'Average',
      percentage: 'Percentage',
@@ -274,6 +276,8 @@ export const en = {
      fillRequiredBasic: 'Please fill all required fields in Basic Info.',
      fillRequiredSettings: 'Please fill all required fields in Settings — type, form, administration method, evaluation method, and cutting point.',
      directionBothLanguages: 'Direction needs text in both English and Amharic, or leave both empty.',
+      next: 'Next',
+      back: 'Back',
      status: 'Status',
      statusPlaceholder: 'Exam status',
      pending: 'Pending',
@@ -389,6 +393,9 @@ export const en = {
      'Not enough approved questions in the bank for this subject.',
    cannotReachCuttingPoint:
      'This paper cannot reach the passing mark (max {{max}}, pass mark {{cuttingPoint}}). Add more/higher-point questions, or lower the cutting point.',
+    paperLocked: 'Paper locked',
+    paperLockedHint:
+      '{{count}} candidate(s) have registered for this session. Every candidate must sit the same paper, so questions can no longer be changed.',
  },

  country: {
@@ -660,6 +667,9 @@ export const en = {
      seafarerPlaceholder: 'Search and select a seafarer',
      scorePerQuestion: 'Score per Question',
      question: 'Question',
+      candidateAnswer: "Candidate's Answer",
+      noAnswer: 'No answer on file',
+      autoGraded: 'Auto-graded',
      maxPoints: 'Max Points',
      score: 'Score',
      remark: 'Remark',
@@ -882,6 +892,7 @@ export const en = {
      DRAFT: 'Draft',
      SUBMITTED: 'Submitted',
      UNDER_REVIEW: 'Under Review',
+      AWAITING_BIOMETRICS: 'Awaiting Biometrics',
      UNDER_EVALUATION: 'Under Evaluation',
      RESUBMIT_REQUIRED: 'Resubmit Required',
      INSPECTION_PENDING: 'Inspection Pending',
@@ -1004,6 +1015,9 @@ export const en = {
    morning: 'Morning',
    afternoon: 'Afternoon',
    schedule: 'Schedule',
+    reschedule: 'Reschedule',
+    rescheduleReason: 'Why is it moving?',
+    rescheduleReasonHint: 'Kept in the audit trail and sent to the applicant.',
    pickDate: 'Pick a date first',
    passed: 'Passed',
    failed: 'Failed',
@@ -1030,7 +1044,6 @@ export const en = {
    actions: {
      claim: 'Claim',
      assign: 'Assign',
-      assignReviewer: 'Assign review',
      reportReview: 'Report to team leader',
      assignInspector: 'Assign inspection',
      reportInspection: 'Report inspection result',
@@ -1041,6 +1054,7 @@ export const en = {
      completeReview: 'Complete review',
      approveDocuments: 'Approve documents',
      scheduleInspection: 'Schedule inspection',
+      rescheduleInspection: 'Reschedule inspection',
      recordInspection: 'Record inspection result',
      finalApprove: 'Approve & issue',
      requestAdjustment: 'Request adjustment',
@@ -1191,6 +1205,7 @@ export const en = {
      assign: 'Reassigned',
      assignReviewer: 'Review assigned',
      scheduled: 'Inspection scheduled',
+      rescheduled: 'Inspection rescheduled',
      inspectionPassed: 'Inspection passed',
      inspectionFailed: 'Inspection failed',
    },
--- a/apps/backoffice/src/app/layouts/nav-config.ts
+++ b/apps/backoffice/src/app/layouts/nav-config.ts
@@ -10,6 +10,7 @@ import {
  IconCreditCard,
  IconFileDescription,
  IconFilePlus,
+  IconFingerprint,
  IconGauge,
  IconGavel,
  IconHeart,
@@ -27,9 +28,9 @@ import {
  IconTruck,
  IconUsers,
  IconUserShield,
-} from '@tabler/icons-react';
-import type { NavSection } from '@ema-platform/ui';
-import { LICENSE_PERMISSIONS as P } from '@ema-platform/auth';
+} from "@tabler/icons-react";
+import type { NavSection } from "@ema-platform/ui";
+import { LICENSE_PERMISSIONS as P } from "@ema-platform/auth";

 /**
 * Every licence-type queue and its review workspace share one gate: the
@@ -37,6 +38,18 @@ import { LICENSE_PERMISSIONS as P } from '@ema-platform/auth';
 */
 const APPLICATION_QUEUE = [P.VIEW_APPLICATION_QUEUE, P.VIEW_APPLICATIONS];

+/**
+ * Seafarer queues are reachable by registry staff and application reviewers
+ * alike, so both permission families gate them as any-of.
+ */
+const SEAFARER_QUEUE = [P.VIEW_SEAFARER_REGISTRY, ...APPLICATION_QUEUE];
+
+const BIOMETRIC_ENROLLMENT = [
+  P.ENROLL_BIOMETRICS,
+  P.VIEW_BIOMETRICS,
+  P.VIEW_SEAFARER_REGISTRY,
+];
+
 /**
 * The backoffice information architecture.
 *
@@ -52,116 +65,255 @@ const APPLICATION_QUEUE = [P.VIEW_APPLICATION_QUEUE, P.VIEW_APPLICATIONS];
 */
 export const NAV_SECTIONS: NavSection[] = [
  {
-    items: [{ to: '/dashboard', label: 'nav.dashboard', icon: IconLayoutDashboard }],
+    items: [
+      { to: "/dashboard", label: "nav.dashboard", icon: IconLayoutDashboard },
+    ],
  },
  {
-    label: 'nav.groupLicensing',
+    label: "nav.groupLicensing",
    items: [
      {
-        to: '/licence-review',
-        label: 'nav.allApplications',
+        to: "/licence-review",
+        label: "nav.allApplications",
        icon: IconListCheck,
        permissions: APPLICATION_QUEUE,
      },
      {
        // A disclosure, not a destination — each child deep-links the grid to
        // one type, which is a facet of the same workspace.
-        label: 'nav.byType',
+        label: "nav.byType",
        icon: IconTruck,
        permissions: APPLICATION_QUEUE,
        children: [
-          { to: '/licence-review/type/FREIGHT_FORWARDER', label: 'nav.typeFreightForwarder', icon: IconTruck, permissions: APPLICATION_QUEUE },
-          { to: '/licence-review/type/SHIPPING_AGENT', label: 'nav.typeShippingAgent', icon: IconShip, permissions: APPLICATION_QUEUE },
-          { to: '/licence-review/type/COMBINED_SA_FF', label: 'nav.typeCombined', icon: IconFileDescription, permissions: APPLICATION_QUEUE },
-          { to: '/licence-review/type/JOINT_INVESTOR', label: 'nav.typeJointInvestment', icon: IconUsers, permissions: APPLICATION_QUEUE },
-          { to: '/licence-review/type/MULTIMODAL_TRANSPORT_OPERATOR', label: 'nav.typeMto', icon: IconAnchor, permissions: APPLICATION_QUEUE },
+          {
+            to: "/licence-review/type/FREIGHT_FORWARDER",
+            label: "nav.typeFreightForwarder",
+            icon: IconTruck,
+            permissions: APPLICATION_QUEUE,
+          },
+          {
+            to: "/licence-review/type/SHIPPING_AGENT",
+            label: "nav.typeShippingAgent",
+            icon: IconShip,
+            permissions: APPLICATION_QUEUE,
+          },
+          {
+            to: "/licence-review/type/COMBINED_SA_FF",
+            label: "nav.typeCombined",
+            icon: IconFileDescription,
+            permissions: APPLICATION_QUEUE,
+          },
+          {
+            to: "/licence-review/type/JOINT_INVESTOR",
+            label: "nav.typeJointInvestment",
+            icon: IconUsers,
+            permissions: APPLICATION_QUEUE,
+          },
+          {
+            to: "/licence-review/type/MULTIMODAL_TRANSPORT_OPERATOR",
+            label: "nav.typeMto",
+            icon: IconAnchor,
+            permissions: APPLICATION_QUEUE,
+          },
        ],
      },
      {
-        to: '/licence-register',
-        label: 'nav.licenceRegister',
+        to: "/licence-register",
+        label: "nav.licenceRegister",
        icon: IconListCheck,
        permissions: [P.VIEW_LICENSES],
      },
-      { to: '/licence-review/type/PRE_WAIVER', label: 'nav.preWaiverQueue', icon: IconShieldOff, permissions: APPLICATION_QUEUE },
-      { to: '/licence-review/type/POST_WAIVER', label: 'nav.postWaiverQueue', icon: IconShieldOff, permissions: APPLICATION_QUEUE },
+      {
+        to: "/licence-review/type/PRE_WAIVER",
+        label: "nav.preWaiverQueue",
+        icon: IconShieldOff,
+        permissions: APPLICATION_QUEUE,
+      },
+      {
+        to: "/licence-review/type/POST_WAIVER",
+        label: "nav.postWaiverQueue",
+        icon: IconShieldOff,
+        permissions: APPLICATION_QUEUE,
+      },
      {
        // Every figure on it is derived from the licence application queue.
-        to: '/logistics-head-dashboard',
-        label: 'nav.logisticsHeadDashboard',
+        to: "/logistics-head-dashboard",
+        label: "nav.logisticsHeadDashboard",
        icon: IconGauge,
        permissions: APPLICATION_QUEUE,
      },
    ],
  },
  {
-    label: 'nav.groupSeafarer',
+    label: "nav.groupSeafarer",
    items: [
-      { to: '/seafarer-registry', label: 'nav.seafarerRegistry', icon: IconUsers, permissions: [P.VIEW_SEAFARER_REGISTRY] },
-      { to: '/seafarer-registrations', label: 'nav.seafarerRegistrationQueue', icon: IconId, permissions: [P.VIEW_SEAFARER_REGISTRY] },
-      { to: '/licence-review/type/CERTIFICATE_OF_COMPETENCY', label: 'nav.cocQueue', icon: IconShieldCheck, permissions: [P.VIEW_SEAFARER_REGISTRY] },
-      { to: '/licence-review/type/CERTIFICATE_OF_PROFICIENCY', label: 'nav.copQueue', icon: IconShieldCheck, permissions: [P.VIEW_SEAFARER_REGISTRY] },
-      { to: '/seaman-book-queue', label: 'nav.seamanBookQueue', icon: IconBook2, permissions: [P.VIEW_SEAFARER_REGISTRY] },
-      { to: '/btc-queue', label: 'nav.btcQueue', icon: IconShieldCheck, permissions: [P.VIEW_SEAFARER_REGISTRY] },
-      { to: '/licence-review/type/ENDORSEMENT_COC', label: 'nav.endorsementCocQueue', icon: IconRubberStamp, permissions: [P.VIEW_SEAFARER_REGISTRY] },
-      { to: '/licence-review/type/ENDORSEMENT_GOC', label: 'nav.endorsementGocQueue', icon: IconRubberStamp, permissions: [P.VIEW_SEAFARER_REGISTRY] },
-      { to: '/seafarer-registrations', label: 'nav.seafarerRegistrationQueue', icon: IconId, permissions: APPLICATION_QUEUE },
-      { to: '/licence-review/type/CERTIFICATE_OF_COMPETENCY', label: 'nav.cocQueue', icon: IconShieldCheck, permissions: APPLICATION_QUEUE },
-      { to: '/licence-review/type/CERTIFICATE_OF_PROFICIENCY', label: 'nav.copQueue', icon: IconShieldCheck, permissions: APPLICATION_QUEUE },
-      { to: '/seaman-book-queue', label: 'nav.seamanBookQueue', icon: IconBook2, permissions: APPLICATION_QUEUE },
-      { to: '/btc-queue', label: 'nav.btcQueue', icon: IconShieldCheck, permissions: APPLICATION_QUEUE },
-      { to: '/licence-review/type/ENDORSEMENT_SEAFARER', label: 'nav.endorsementQueue', icon: IconRubberStamp, permissions: APPLICATION_QUEUE },
-      { to: '/sea-service-verification', label: 'nav.seaServiceVerification', icon: IconAnchor, permissions: [P.VERIFY_SEAFARER_RECORDS] },
-      { to: '/medical-verification', label: 'nav.medicalVerification', icon: IconHeart, permissions: [P.VERIFY_SEAFARER_RECORDS] },
-    ],
-  },
-  {
-    label: 'nav.groupVessels',
-    items: [
-      { to: '/vessel-registration-report', label: 'nav.vesselRegistrationReport', icon: IconChartBar, permissions: [P.VIEW_VESSEL_REGISTRY] },
-      { to: '/vessel-registration-queue', label: 'nav.vesselRegistrationQueue', icon: IconAnchor, permissions: [P.VIEW_VESSEL_REGISTRY] },
-      { to: '/licence-review/type/VESSEL_REGISTRATION', label: 'nav.vesselRegistrationApplicationQueue', icon: IconAnchor, permissions: [P.VIEW_VESSEL_REGISTRY] },
-      { to: '/licence-review/type/VESSEL_OWNERSHIP_TRANSFER', label: 'nav.ownershipTransferQueue', icon: IconArrowsExchange, permissions: [P.VIEW_VESSEL_REGISTRY] },
-      { to: '/vessel-registration-queue/new', label: 'nav.vesselFormBuilder', icon: IconFilePlus, soon: true, permissions: [P.VIEW_VESSEL_REGISTRY] },
-    ],
-  },
-  {
-    label: 'nav.groupExaminations',
-    items: [
-      { to: '/questions', label: 'nav.questions', icon: IconQuestionMark, permissions: [P.APPROVE_QUESTION, P.AUTHOR_QUESTION] },
      {
-        to: '/exams',
-        label: 'nav.exams',
+        to: "/seafarer-registry",
+        label: "nav.seafarerRegistry",
+        icon: IconUsers,
+        permissions: [P.VIEW_SEAFARER_REGISTRY],
+      },
+      {
+        to: "/biometric-enrollment",
+        label: "nav.biometricEnrollment",
+        icon: IconFingerprint,
+        permissions: BIOMETRIC_ENROLLMENT,
+      },
+      {
+        to: "/seafarer-registrations",
+        label: "nav.seafarerRegistrationQueue",
+        icon: IconId,
+        permissions: SEAFARER_QUEUE,
+      },
+      {
+        to: "/licence-review/type/CERTIFICATE_OF_COMPETENCY",
+        label: "nav.cocQueue",
+        icon: IconShieldCheck,
+        permissions: SEAFARER_QUEUE,
+      },
+      {
+        to: "/licence-review/type/CERTIFICATE_OF_PROFICIENCY",
+        label: "nav.copQueue",
+        icon: IconShieldCheck,
+        permissions: SEAFARER_QUEUE,
+      },
+      {
+        to: "/seaman-book-queue",
+        label: "nav.seamanBookQueue",
+        icon: IconBook2,
+        permissions: SEAFARER_QUEUE,
+      },
+      {
+        to: "/btc-queue",
+        label: "nav.btcQueue",
+        icon: IconShieldCheck,
+        permissions: SEAFARER_QUEUE,
+      },
+      {
+        to: "/licence-review/type/ENDORSEMENT_COC",
+        label: "nav.endorsementCocQueue",
+        icon: IconRubberStamp,
+        permissions: [P.VIEW_SEAFARER_REGISTRY],
+      },
+      {
+        to: "/licence-review/type/ENDORSEMENT_GOC",
+        label: "nav.endorsementGocQueue",
+        icon: IconRubberStamp,
+        permissions: [P.VIEW_SEAFARER_REGISTRY],
+      },
+      {
+        to: "/licence-review/type/ENDORSEMENT_SEAFARER",
+        label: "nav.endorsementQueue",
+        icon: IconRubberStamp,
+        permissions: APPLICATION_QUEUE,
+      },
+      {
+        to: "/sea-service-verification",
+        label: "nav.seaServiceVerification",
+        icon: IconAnchor,
+        permissions: [P.VERIFY_SEAFARER_RECORDS],
+      },
+      {
+        to: "/medical-verification",
+        label: "nav.medicalVerification",
+        icon: IconHeart,
+        permissions: [P.VERIFY_SEAFARER_RECORDS],
+      },
+    ],
+  },
+  {
+    label: "nav.groupVessels",
+    items: [
+      {
+        to: "/vessel-registration-report",
+        label: "nav.vesselRegistrationReport",
+        icon: IconChartBar,
+        permissions: [P.VIEW_VESSEL_REGISTRY],
+      },
+      {
+        to: "/vessel-registration-queue",
+        label: "nav.vesselRegistrationQueue",
+        icon: IconAnchor,
+        permissions: [P.VIEW_VESSEL_REGISTRY],
+      },
+      {
+        to: "/licence-review/type/VESSEL_REGISTRATION",
+        label: "nav.vesselRegistrationApplicationQueue",
+        icon: IconAnchor,
+        permissions: [P.VIEW_VESSEL_REGISTRY],
+      },
+      {
+        to: "/licence-review/type/VESSEL_OWNERSHIP_TRANSFER",
+        label: "nav.ownershipTransferQueue",
+        icon: IconArrowsExchange,
+        permissions: [P.VIEW_VESSEL_REGISTRY],
+      },
+      {
+        to: "/vessel-registration-queue/new",
+        label: "nav.vesselFormBuilder",
+        icon: IconFilePlus,
+        soon: true,
+        permissions: [P.VIEW_VESSEL_REGISTRY],
+      },
+    ],
+  },
+  {
+    label: "nav.groupExaminations",
+    items: [
+      {
+        to: "/questions",
+        label: "nav.questions",
+        icon: IconQuestionMark,
+        permissions: [P.APPROVE_QUESTION, P.AUTHOR_QUESTION],
+      },
+      {
+        to: "/exams",
+        label: "nav.exams",
        icon: IconClipboardList,
-        permissions: [P.MANAGE_EXAMS, P.RECORD_EXAM_ATTENDANCE, P.MANAGE_EXAM_INCIDENTS, P.PUBLISH_EXAM_RESULT],
+        permissions: [
+          P.MANAGE_EXAMS,
+          P.RECORD_EXAM_ATTENDANCE,
+          P.MANAGE_EXAM_INCIDENTS,
+          P.PUBLISH_EXAM_RESULT,
+        ],
      },
      {
-        to: '/exam-results',
-        label: 'nav.examResults',
+        to: "/exam-results",
+        label: "nav.examResults",
        icon: IconReport,
-        permissions: [P.RECORD_EXAM_RESULT, P.MODERATE_EXAM_RESULT, P.APPROVE_EXAM_RESULT, P.PUBLISH_EXAM_RESULT],
+        permissions: [
+          P.RECORD_EXAM_RESULT,
+          P.MODERATE_EXAM_RESULT,
+          P.APPROVE_EXAM_RESULT,
+          P.PUBLISH_EXAM_RESULT,
+        ],
+      },
+      {
+        to: "/exam-appeals",
+        label: "nav.examAppeals",
+        icon: IconGavel,
+        permissions: [P.DECIDE_EXAM_APPEAL],
      },
-      { to: '/exam-appeals', label: 'nav.examAppeals', icon: IconGavel, permissions: [P.DECIDE_EXAM_APPEAL] },
    ],
  },
  {
-    label: 'nav.groupShared',
+    label: "nav.groupShared",
    items: [
      {
-        to: '/certificate-designer',
-        label: 'nav.certificateDesigner',
+        to: "/certificate-designer",
+        label: "nav.certificateDesigner",
        icon: IconRosetteDiscountCheck,
        permissions: [P.VIEW_TEMPLATES],
      },
      {
-        to: '/certificate-requirements',
-        label: 'nav.certificateRequirements',
+        to: "/certificate-requirements",
+        label: "nav.certificateRequirements",
        icon: IconClipboardText,
        permissions: [P.VIEW_LICENSE_TYPES],
      },
      {
-        to: '/payment-config',
-        label: 'nav.paymentConfig',
+        to: "/payment-config",
+        label: "nav.paymentConfig",
        icon: IconCreditCard,
        permissions: [P.VIEW_PAYMENTS],
      },
@@ -180,18 +332,27 @@ export const NAV_SECTIONS: NavSection[] = [
    ],
  },
  {
-    label: 'nav.groupAdministration',
+    label: "nav.groupAdministration",
    items: [
-      { to: '/um/user-management/dashboard', label: 'nav.userManagement', icon: IconUserShield },
+      {
+        to: "/um/user-management/dashboard",
+        label: "nav.userManagement",
+        icon: IconUserShield,
+      },
      {
        // Professions, locations and certifications have no dedicated keys;
        // the config-view keys are the closest published contract.
-        to: '/configuration',
-        label: 'nav.configuration',
+        to: "/configuration",
+        label: "nav.configuration",
        icon: IconSettings,
        permissions: [P.VIEW_LICENSE_TYPES, P.VIEW_TEMPLATES],
      },
-      { to: '/analytics', label: 'nav.analytics', icon: IconChartBar, soon: true },
+      {
+        to: "/analytics",
+        label: "nav.analytics",
+        icon: IconChartBar,
+        soon: true,
+      },
    ],
  },
  // `/profile` deliberately absent: it is a property of the signed-in user,
--- a/apps/backoffice/src/app/router/index.tsx
+++ b/apps/backoffice/src/app/router/index.tsx
@@ -50,10 +50,17 @@ import { LicenseReviewPage } from '../features/license-review/pages/LicenseRevie
 import { LogisticsHeadDashboardPage } from '../features/logistics-head/pages/LogisticsHeadDashboardPage';
 import { CertificateDesignerPage } from '../features/certificate-designer/pages/CertificateDesignerPage';
 import { CertificateRequirementsPage } from '../features/certificate-requirements/pages/CertificateRequirementsPage';
+import { BiometricEnrollmentPage } from '../features/biometric-enrollment/pages/BiometricEnrollmentPage';

 /** Any-of gate shared by every licence-type queue and its review workspace. */
 const APPLICATION_QUEUE = [P.VIEW_APPLICATION_QUEUE, P.VIEW_APPLICATIONS];

+const BIOMETRIC_ENROLLMENT = [
+  P.ENROLL_BIOMETRICS,
+  P.VIEW_BIOMETRICS,
+  P.VIEW_SEAFARER_REGISTRY,
+];
+
 /** Route gate: same keys as the route's nav item in nav-config.ts. */
 const guard = (anyOf: string[], element: ReactNode) => (
  <RequirePermission anyOf={anyOf}>{element}</RequirePermission>
@@ -104,6 +111,7 @@ const router = createBrowserRouter([
          { path: 'pickup-desk', element: guard([P.MANAGE_PICKUP_DESK], <PickupDeskPage />) },
          { path: 'pickup-offices', element: guard([P.CONFIGURE_PICKUP_OFFICES], <PickupOfficesPage />) },
          { path: 'seafarer-registry', element: guard([P.VIEW_SEAFARER_REGISTRY], <SeafarerRegistryPage />) },
+          { path: 'biometric-enrollment', element: guard(BIOMETRIC_ENROLLMENT, <BiometricEnrollmentPage />) },
          // Seafarer registration is not a licence: own queue, own review.
          { path: 'seafarer-registrations', element: guard(APPLICATION_QUEUE, <SeafarerRegistrationQueuePage />) },
          { path: 'seafarer-registrations/:id', element: guard(APPLICATION_QUEUE, <SeafarerRegistrationReviewPage />) },