diff --git a/packages/alea-frontend/components/ProblemList.tsx b/packages/alea-frontend/components/ProblemList.tsx
index 1eb7d8938..eaac24e72 100644
--- a/packages/alea-frontend/components/ProblemList.tsx
+++ b/packages/alea-frontend/components/ProblemList.tsx
@@ -188,7 +188,7 @@ const ProblemList: FC<ProblemListProps> = ({ courseSections, courseId }) => {
       >
         <Typography
           variant="body1"
-          sx={{ color: 'secondary.main', fontStyle: 'italic', mb: 3, lineHeight: 1.6 }}
+          sx={{ color: 'text.primary', fontStyle: 'italic', mb: 3, lineHeight: 1.6 }}
         >
           Old exams are great practice resources, but since exam styles evolve, recent exams are
           better models, and any course topic even if not asked before can still appear in upcoming
diff --git a/packages/alea-frontend/pages/exam-problems.tsx b/packages/alea-frontend/pages/exam-problems.tsx
index 75126323d..d268800ac 100644
--- a/packages/alea-frontend/pages/exam-problems.tsx
+++ b/packages/alea-frontend/pages/exam-problems.tsx
@@ -77,6 +77,7 @@ const ExamProblemsPage = () => {
       } catch (error) {
         console.error('Error loading exam data:', error);
       } finally {
+        console.log('Finished loading exam data');
         setLoading(false);
       }
     };
diff --git a/packages/alea-frontend/pages/quiz-problems.tsx b/packages/alea-frontend/pages/quiz-problems.tsx
index e9c6b9b20..1b44958ea 100644
--- a/packages/alea-frontend/pages/quiz-problems.tsx
+++ b/packages/alea-frontend/pages/quiz-problems.tsx
@@ -47,6 +47,7 @@ async function buildQuizProblems(
 const QuizProblemsPage = () => {
   const router = useRouter();
   const quizUri = router.query.quizUri as string | undefined;
+  const courseId = router.query.courseId as string | undefined;
   const targetProblemId = router.query.problemId as string | undefined;
 
   const [quizMeta, setQuizMeta] = useState<any>(null);
@@ -86,13 +87,13 @@ const QuizProblemsPage = () => {
 
   const quizLabelShort = useMemo(() => {
     if (!quizUri || !quizMeta) return '';
-    return formatQuizLabelShortFromUri(quizUri, quizMeta);
-  }, [quizUri, quizMeta]);
+    return formatQuizLabelShortFromUri(quizUri, quizMeta, courseId ?? quizMeta?.courseId);
+  }, [quizUri, quizMeta, courseId]);
 
   const quizLabelFull = useMemo(() => {
     if (!quizUri || !quizMeta) return '';
-    return formatQuizLabelFullFromUri(quizUri, quizMeta);
-  }, [quizUri, quizMeta]);
+    return formatQuizLabelFullFromUri(quizUri, quizMeta, courseId ?? quizMeta?.courseId);
+  }, [quizUri, quizMeta, courseId]);
 
   if (loading) {
     return (
diff --git a/packages/alea-frontend/theme/components.ts b/packages/alea-frontend/theme/components.ts
index 857b5aacc..04b53ebcf 100644
--- a/packages/alea-frontend/theme/components.ts
+++ b/packages/alea-frontend/theme/components.ts
@@ -97,7 +97,7 @@ const components: Components = {
         const isDark = theme.palette.mode === 'dark';
 
         return {
-          backgroundColor: theme.palette.background.paper,
+          backgroundColor: theme.palette.background.default,
           borderRadius: 10,
 
           '&:hover .MuiOutlinedInput-notchedOutline': {
@@ -121,98 +121,96 @@ const components: Components = {
       },
     },
   },
-MuiTextField: {
-  defaultProps: {
-    variant: 'outlined',
-  },
-  styleOverrides: {
-    root: ({ theme }:{theme:any}) => {
-      const isDark = theme.palette.mode === 'dark';
+  MuiTextField: {
+    defaultProps: {
+      variant: 'outlined',
+    },
+    styleOverrides: {
+      root: ({ theme }: { theme: any }) => {
+        const isDark = theme.palette.mode === 'dark';
 
-      return {
-        '& .MuiOutlinedInput-root': {
-          borderRadius: 10,
-          backgroundColor: theme.palette.background.paper,
+        return {
+          '& .MuiOutlinedInput-root': {
+            borderRadius: 10,
+            backgroundColor: theme.palette.background.default,
 
-          '& .MuiOutlinedInput-notchedOutline': {
-            borderColor: isDark
-              ? theme.palette.primary.main:theme.palette.divider,
-          },
+            '& .MuiOutlinedInput-notchedOutline': {
+              borderColor: isDark ? theme.palette.primary.main : theme.palette.divider,
+            },
 
-          '&:hover .MuiOutlinedInput-notchedOutline': {
-            borderColor: isDark
-              ? theme.palette.primary.light
-              : theme.palette.primary.main,
-          },
+            '&:hover .MuiOutlinedInput-notchedOutline': {
+              borderColor: isDark ? theme.palette.primary.light : theme.palette.primary.main,
+            },
 
-          '&.Mui-focused .MuiOutlinedInput-notchedOutline': {
-            borderColor: theme.palette.primary.main,
+            '&.Mui-focused .MuiOutlinedInput-notchedOutline': {
+              borderColor: theme.palette.primary.main,
+            },
           },
-        },
-      };
+        };
+      },
     },
   },
-},
 
   MuiInputLabel: {
-  styleOverrides: {
-    root: ({ theme }:{theme:any}) => ({
-      color: theme.palette.text.secondary,
-
-      '&.Mui-focused': {
+    styleOverrides: {
+      root: ({ theme }: { theme: any }) => ({
         color: theme.palette.text.primary,
-      },
-    }),
+
+        '&.Mui-focused': {
+          color: theme.palette.text.primary.main,
+        },
+      }),
+    },
   },
-},
 
-MuiSelect: {
-  styleOverrides: {
-    select: ({ theme }:{theme:any}) => ({
-      color: theme.palette.text.primary,
-    }),
+  MuiSelect: {
+    styleOverrides: {
+      select: ({ theme }: { theme: any }) => ({
+        color: theme.palette.text.primary,
+      }),
 
-    icon: ({ theme }:{theme:any}) => ({
-      color: theme.palette.text.secondary,
-    }),
+      icon: ({ theme }: { theme: any }) => ({
+        color: theme.palette.text.secondary,
+      }),
+    },
   },
-},
-
-MuiAutocomplete: {
-  styleOverrides: {
-    paper: ({ theme }:{theme:any}) => ({
-      borderRadius: 10,
-      backgroundColor: theme.palette.background.paper,
-      color: theme.palette.text.primary,
-      borderColor: theme.palette.primary.main,
-    }),
-    inputRoot: ({ theme }:{theme:any}) => {
-            const isDark = theme.palette.mode === 'dark';
-
-      return({
-      borderRadius: 10,
-
-      '& .MuiOutlinedInput-notchedOutline': {
-        borderColor: isDark?theme.palette.primary.main:theme.palette.divider,
-      },
 
-      '&.Mui-focused .MuiOutlinedInput-notchedOutline': {
+  MuiAutocomplete: {
+    styleOverrides: {
+      paper: ({ theme }: { theme: any }) => ({
+        borderRadius: 10,
+        backgroundColor: theme.palette.background.paper,
+        color: theme.palette.text.primary,
         borderColor: theme.palette.primary.main,
-        borderWidth: 1.5,
-      },
-    })},
+      }),
+      inputRoot: ({ theme }: { theme: any }) => {
+        const isDark = theme.palette.mode === 'dark';
 
-    option: ({ theme }:{theme:any}) => ({
-      '&[aria-selected="true"]': {
-        backgroundColor: theme.palette.action.selected,
-      },
+        return {
+          borderRadius: 10,
+
+          '& .MuiOutlinedInput-notchedOutline': {
+            borderColor: isDark ? theme.palette.primary.main : theme.palette.divider,
+          },
 
-      '&.Mui-focused': {
-        backgroundColor: theme.palette.action.hover,
+          '&.Mui-focused .MuiOutlinedInput-notchedOutline': {
+            borderColor: theme.palette.primary.main,
+            borderWidth: 1.5,
+          },
+        };
       },
-    }),
+
+      option: ({ theme }: { theme: any }) => ({
+        '&[aria-selected="true"]': {
+          backgroundColor: theme.palette.action.selected,
+        },
+
+        '&.Mui-focused': {
+          backgroundColor: theme.palette.action.hover,
+        },
+      }),
+    },
   },
-},
 
   MuiDialog: {
     styleOverrides: {
diff --git a/packages/stex-react-renderer/src/lib/ExamSelect.tsx b/packages/stex-react-renderer/src/lib/ExamSelect.tsx
index 2bde0ecc0..f7ad0286f 100644
--- a/packages/stex-react-renderer/src/lib/ExamSelect.tsx
+++ b/packages/stex-react-renderer/src/lib/ExamSelect.tsx
@@ -53,7 +53,7 @@ export function ExamSelect({
           return (
             <MenuItem key={exam.uri} value={exam.uri}>
               <Tooltip title={fullLabel} placement="right" arrow>
-                <Typography noWrap sx={{ maxWidth: 300 }}>
+                <Typography variant="body2" noWrap sx={{ maxWidth: 300 }}>
                   {dropdownLabel}
                 </Typography>
               </Tooltip>
diff --git a/spec/src/lib/flams.ts b/spec/src/lib/flams.ts
index 1c04fa2ca..5beff7eb7 100644
--- a/spec/src/lib/flams.ts
+++ b/spec/src/lib/flams.ts
@@ -529,11 +529,23 @@ export function getQuizMetaFromQuizUri(
     number?: string;
     date?: string;
     courseId?: string;
-  }
+  },
+  courseId?: string
 ): QuizMeta {
   const decoded = decodeURIComponent(quizUri);
 
-  const courseAcronym = quiz?.courseId?.toUpperCase() ?? 'UNKNOWN';
+  let courseAcronym = 'UNKNOWN';
+
+  if (courseId) {
+    courseAcronym = courseId.toUpperCase();
+  } else if (quiz?.courseId) {
+    courseAcronym = quiz.courseId.toUpperCase();
+  } else {
+    const match = decoded.match(/courses\/[^/]+\/([^/]+)/);
+    if (match && match[1]) {
+      courseAcronym = match[1].toUpperCase();
+    }
+  }
 
   const rawTerm = quiz?.term ?? '';
   const formattedTerm = rawTerm.replace(/([A-Z]+)(\d{2})(\d{2})/, '$1 $2/$3');
@@ -550,14 +562,14 @@ export function getQuizMetaFromQuizUri(
   };
 }
 
-export function formatQuizLabelShortFromUri(quizUri: string, quiz?: any) {
-  const meta = getQuizMetaFromQuizUri(quizUri, quiz);
+export function formatQuizLabelShortFromUri(quizUri: string, quiz?: any, courseId?: string) {
+  const meta = getQuizMetaFromQuizUri(quizUri, quiz, courseId);
 
   return [meta.courseAcronym, meta.quizNumber, meta.formattedTerm].filter(Boolean).join(' ');
 }
 
-export function formatQuizLabelFullFromUri(quizUri: string, quiz?: any) {
-  const meta = getQuizMetaFromQuizUri(quizUri, quiz);
+export function formatQuizLabelFullFromUri(quizUri: string, quiz?: any, courseId?: string) {
+  const meta = getQuizMetaFromQuizUri(quizUri, quiz, courseId);
 
   return [
     meta.courseAcronym,