feat: optimize state updates using flushSync for smoother exam transitions

frontend/src/App.tsx

@@ -1,4 +1,5 @@
 import { useState, useEffect, useCallback } from "react";
+import { flushSync } from "react-dom";
 import {
   useNavigate,
   useLocation,
@@ -136,6 +137,7 @@ function AppInner() {
       tweaks.feedbackMode === "auto"
         ? (data.feedbackMode ?? "end")
         : tweaks.feedbackMode;
+    flushSync(() => {
       setExam(data);
       setExamState({
         currentIdx: 0,
@@ -146,14 +148,17 @@ function AppInner() {
         startedAt: Date.now(),
         feedbackMode: fm,
       });
+    });
     navigate(`/exam/${slugify(data.title)}/q1`);
   };
 
   const resume = () => {
     const saved = loadState();
     if (saved?.exam && saved?.state) {
+      flushSync(() => {
         setExam(saved.exam);
         setExamState(withNotes(saved.state));
+      });
       navigate(
         `/exam/${slugify(saved.exam.title)}/q${saved.state.currentIdx + 1}`,
       );
@@ -235,18 +240,24 @@ function AppInner() {
         completedAt: number;
       }>(`/api/results/${remoteId}`)
         .then((data) => {
+          flushSync(() => {
             setExam(data.exam);
             setExamState(withNotes(data.state));
+          });
           navigate(`/review/${slugify(entry.title)}`);
         })
         .catch(() => {
+          flushSync(() => {
             setExam(entry.exam);
             setExamState(withNotes(entry.state));
+          });
           navigate(`/review/${slugify(entry.title)}`);
         });
     } else {
+      flushSync(() => {
         setExam(entry.exam);
         setExamState(withNotes(entry.state));
+      });
       navigate(`/review/${slugify(entry.title)}`);
     }
   };