feat(workspace): refine career workflows

Make job/CV comparisons language-aware and filter recruitment noise. Improve responsive career navigation, shared spacing, dashboard priorities, settings, localized workspace controls, and portable browser tests.

job-tracker-ui/src/components/OnboardingChecklist.tsx

@@ -1,13 +1,15 @@
 import React, { useEffect, useState } from "react";
 import { useNavigate } from "react-router-dom";
 
-import { Box, Button, LinearProgress, Paper, Stack, Typography } from "@mui/material";
+import { Box, Button, IconButton, LinearProgress, Paper, Stack, Typography } from "@mui/material";
 import CheckCircleIcon from "@mui/icons-material/CheckCircle";
+import CloseIcon from "@mui/icons-material/Close";
 import RadioButtonUncheckedIcon from "@mui/icons-material/RadioButtonUnchecked";
 import { alpha, useTheme } from "@mui/material/styles";
 
 import { api } from "../api";
 import { useI18n } from "../i18n/I18nProvider";
+import { getUserKeyFromToken } from "../themePrefs";
 
 type MeResponse = {
   email?: string | null;
@@ -35,6 +37,8 @@ export default function OnboardingChecklist({ hasJobs }: { hasJobs: boolean }) {
   const theme = useTheme();
   const navigate = useNavigate();
   const { t } = useI18n();
+  const dismissalKey = `onboardingDismissed:${getUserKeyFromToken()}`;
+  const [dismissed, setDismissed] = useState(() => window.localStorage.getItem(dismissalKey) === "true");
   const [status, setStatus] = useState<{ profile: boolean; cv: boolean; email: boolean } | null>(null);
 
   useEffect(() => {
@@ -68,7 +72,7 @@ export default function OnboardingChecklist({ hasJobs }: { hasJobs: boolean }) {
     return () => { active = false; };
   }, []);
 
-  if (!status) return null;
+  if (!status || dismissed) return null;
 
   const steps = [
     { done: true, label: t("onboardingStepSignup"), actionLabel: "" },
@@ -83,7 +87,19 @@ export default function OnboardingChecklist({ hasJobs }: { hasJobs: boolean }) {
 
   return (
     <Paper sx={{ p: 2.25, mb: 2, borderRadius: 4, border: "1px solid", borderColor: alpha(theme.palette.primary.main, 0.25), background: alpha(theme.palette.primary.main, 0.04) }}>
-      <Typography sx={{ fontWeight: 900, mb: 0.25 }}>{t("onboardingTitle")}</Typography>
+      <Box sx={{ display: "flex", alignItems: "flex-start", justifyContent: "space-between", gap: 1 }}>
+        <Typography sx={{ fontWeight: 900, mb: 0.25 }}>{t("onboardingTitle")}</Typography>
+        <IconButton
+          size="small"
+          aria-label={t("onboardingDismiss")}
+          onClick={() => {
+            window.localStorage.setItem(dismissalKey, "true");
+            setDismissed(true);
+          }}
+        >
+          <CloseIcon fontSize="small" />
+        </IconButton>
+      </Box>
       <Typography variant="body2" sx={{ color: "text.secondary" }}>{t("onboardingBody")}</Typography>
       <Typography variant="caption" sx={{ color: "text.secondary" }}>{completed} / {steps.length}</Typography>
       <LinearProgress variant="determinate" value={(completed / steps.length) * 100} sx={{ my: 1.5, borderRadius: 2 }} />