chore: preserve app workspace t_41bd9518

2026-08-09 20:24:43 +01:00
17 changed files with 61 additions and 1118 deletions
@@ -7,37 +7,13 @@ RUN if [ ! -f package-lock.json ]; then npm install --package-lock-only; fi && n
 COPY . .
-# Vite bakes VITE_* values at build time. Pass the public VITE_* values as
+# Vite bakes VITE_* values at build time, so compose must choose the env file
-# build args (docker compose --env-file .env.dev) instead of COPYing an env file;
+# during image build, not only at container runtime.
-# service-host worktrees keep .env.dev as a symlink outside the Docker context.
+ARG ENV_FILE=.env
-ARG VITE_API_BASE
+COPY ${ENV_FILE} .env
-ARG VITE_API_URL
+
-ARG VITE_APP_NAME
+# Run build with production mode
-ARG VITE_APP_HMR_URL
+RUN npm run build -- --mode production
 ARG VITE_DEV
 ARG VITE_FRONTEND_SITE_URL
 ARG VITE_SEARCH_URL
 ARG VITE_SUPABASE_ANON_KEY
 ARG VITE_SUPABASE_URL
 ARG VITE_SUPER_ADMIN_EMAIL
 ARG VITE_TLSYNC_URL
 ARG VITE_WHISPERLIVE_URL
 # Run build with production mode. Keep these as build-step environment values
 # rather than final-image ENV entries; Vite still embeds the public client config
 # into the static bundle, but nginx image metadata does not need them.
 RUN VITE_API_BASE="${VITE_API_BASE}" \
    VITE_API_URL="${VITE_API_URL}" \
    VITE_APP_NAME="${VITE_APP_NAME}" \
    VITE_APP_HMR_URL="${VITE_APP_HMR_URL}" \
    VITE_DEV="${VITE_DEV}" \
    VITE_FRONTEND_SITE_URL="${VITE_FRONTEND_SITE_URL}" \
    VITE_SEARCH_URL="${VITE_SEARCH_URL}" \
    VITE_SUPABASE_ANON_KEY="${VITE_SUPABASE_ANON_KEY}" \
    VITE_SUPABASE_URL="${VITE_SUPABASE_URL}" \
    VITE_SUPER_ADMIN_EMAIL="${VITE_SUPER_ADMIN_EMAIL}" \
    VITE_TLSYNC_URL="${VITE_TLSYNC_URL}" \
    VITE_WHISPERLIVE_URL="${VITE_WHISPERLIVE_URL}" \
    npm run build -- --mode production
 FROM nginx:alpine
 # Copy built files
@@ -55,33 +31,6 @@ RUN echo 'server { \
    expires -1; \
    add_header Cache-Control "no-store, no-cache, must-revalidate"; \
    } \
    location = /health { \
    proxy_pass http://192.168.0.64:18000/health; \
    proxy_set_header Host $host; \
    proxy_set_header X-Real-IP $remote_addr; \
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; \
    } \
    location /__ccapi/ { \
    proxy_pass http://192.168.0.64:18000/; \
    proxy_set_header Host $host; \
    proxy_set_header X-Real-IP $remote_addr; \
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; \
    } \
    location /__supabase/ { \
    proxy_pass http://192.168.0.94:8000/; \
    proxy_set_header Host $host; \
    proxy_set_header X-Real-IP $remote_addr; \
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; \
    proxy_set_header Upgrade $http_upgrade; \
    proxy_set_header Connection "upgrade"; \
    proxy_http_version 1.1; \
    } \
    location /api/ { \
    proxy_pass http://192.168.0.64:18000/api/; \
    proxy_set_header Host $host; \
    proxy_set_header X-Real-IP $remote_addr; \
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; \
    } \
    location / { \
    try_files $uri $uri/ /index.html; \
    expires 30d; \
@@ -16,28 +16,7 @@ services:
      context: .
      dockerfile: Dockerfile
      args:
-        # app-dev is served by nginx on the app host; browser API calls must stay
+        ENV_FILE: .env.dev
        # same-origin and pass through Dockerfile's /__ccapi proxy. The proxy
        # strips that prefix before forwarding, preserving mixed backend routes
        # such as /api/exam, /me/bootstrap, and /database/timetable.
        # Supabase is likewise routed same-origin via Dockerfile's /__supabase
        # proxy -> dev Supabase .94 (no CORS, browser-network-agnostic). The
        # leading-slash URL is resolved against window.location.origin in
        # supabaseClient.ts. Provide the matching .94 anon key as a build arg
        # (VITE_SUPABASE_ANON_KEY) so it pairs with the .94 backend.
        # .env.dev still points at the LAN API/Supabase for local Vite/dev tooling.
        VITE_API_BASE: /__ccapi
        VITE_API_URL: /__ccapi
        VITE_SUPABASE_URL: /__supabase
        VITE_APP_NAME: ${VITE_APP_NAME:-Classroom Copilot}
        VITE_APP_HMR_URL: ${VITE_APP_HMR_URL:-}
        VITE_DEV: ${VITE_DEV:-false}
        VITE_FRONTEND_SITE_URL: ${VITE_FRONTEND_SITE_URL:-}
        VITE_SEARCH_URL: ${VITE_SEARCH_URL:-}
        VITE_SUPABASE_ANON_KEY: ${VITE_SUPABASE_ANON_KEY:-}
        VITE_SUPER_ADMIN_EMAIL: ${VITE_SUPER_ADMIN_EMAIL:-}
        VITE_TLSYNC_URL: ${VITE_TLSYNC_URL:-}
        VITE_WHISPERLIVE_URL: ${VITE_WHISPERLIVE_URL:-}
    env_file:
      - .env.dev
    ports:
@@ -7,7 +7,7 @@ import LoginPage from './pages/auth/loginPage';
 import SignupPage from './pages/auth/signupPage';
 import SinglePlayerPage from './pages/tldraw/singlePlayerPage';
 import MultiplayerUser from './pages/tldraw/multiplayerUser';
-import { ExamDashboardPage, ExamMarkingPage, ExamResultsPage, ExamTemplateSetupPage, MarkSchemePage, QuestionBankPage } from './pages/exam';
+import { ExamDashboardPage, ExamMarkingPage, ExamResultsPage, ExamTemplateSetupPage, MarkSchemePage } from './pages/exam';
 import { ErrorBoundary } from './components/ErrorBoundary';
 import CalendarPage from './pages/user/calendarPage';
 import SettingsPage from './pages/user/settingsPage';
@@ -169,7 +169,6 @@ const AppRoutes: React.FC = () => {
            <Route path="/classes" element={<ClassesPage />} />
            <Route path="/my-classes" element={<MyClassesPage />} />
            <Route path="/classes/:classId" element={<ClassDetailPage />} />
            <Route path="/timetable/classes/:classId" element={<ClassDetailPage />} />
            <Route path="/student-lessons" element={<StudentLessonsPage />} />
            <Route path="/lesson-plans" element={<LessonPlansPage />} />
            <Route path="/lesson-plans/:planId" element={<LessonPlanDetailPage />} />
@@ -184,7 +183,6 @@ const AppRoutes: React.FC = () => {
            <Route path="/search" element={<SearxngPage />} />
            <Route path="/teacher-planner" element={<TeacherPlanner />} />
            <Route path="/exam-marker" element={<ErrorBoundary><ExamDashboardPage /></ErrorBoundary>} />
            <Route path="/exam-marker/bank" element={<ErrorBoundary><QuestionBankPage /></ErrorBoundary>} />
            <Route path="/exam-marker/:templateId/setup" element={<ErrorBoundary><ExamTemplateSetupPage /></ErrorBoundary>} />
            <Route path="/exam-marker/:templateId/marks" element={<ErrorBoundary><MarkSchemePage /></ErrorBoundary>} />
            <Route path="/exam-marker/:batchId/mark" element={<ErrorBoundary><ExamMarkingPage /></ErrorBoundary>} />
@@ -102,17 +102,6 @@ const PlatformAdminPage: React.FC = () => {
                </Grid>
            )}
            <Alert severity="warning" sx={{ mb: 3 }}>
                <Typography variant="subtitle2" sx={{ fontWeight: 700 }}>Destructive reset scope: exam-corpus</Typography>
                <Typography variant="body2">
                    The <strong>exam-corpus</strong> reset is not limited to public papers. It wipes the entire
                    exam-marker subsystem: public corpus/eb_* data, cc.examboards storage, templates, template
                    layouts, questions, boundaries, response areas, marking batches, student submissions, and
                    mark entries. Use it only when you intend to rebuild all exam-marker data; it does not reset
                    schools, users, or timetable data.
                </Typography>
            </Alert>
            <Typography variant="subtitle2" sx={{ mb: 1 }}>Schools ({loading ? '…' : schools.length})</Typography>
            {loading ? (
@@ -25,7 +25,6 @@ import AssignmentIcon from '@mui/icons-material/Assignment';
 import ContentCopyIcon from '@mui/icons-material/ContentCopy';
 import EditIcon from '@mui/icons-material/Edit';
 import GradingIcon from '@mui/icons-material/Grading';
 import PlaylistAddCheckIcon from '@mui/icons-material/PlaylistAddCheck';
 import { useAuth } from '../../contexts/AuthContext';
 import { examRepository } from '../../services/exam/examRepository';
@@ -234,14 +233,9 @@ const ExamDashboardPage: React.FC = () => {
              Build multiple named templates for the same paper, version them as your setup changes, and archive drafts you no longer need.
            </Typography>
          </Box>
-          <Stack direction="row" spacing={1}>
+          <Button variant="contained" startIcon={<AddIcon />} onClick={openCreate}>
-            <Button variant="outlined" startIcon={<PlaylistAddCheckIcon />} onClick={() => navigate('/exam-marker/bank')}>
+            New template
-              Question bank
+          </Button>
            </Button>
            <Button variant="contained" startIcon={<AddIcon />} onClick={openCreate}>
              New template
            </Button>
          </Stack>
        </Box>
        {error && (
@@ -1,4 +1,4 @@
-import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import { useNavigate, useParams } from 'react-router-dom';
 import { v5 as uuidv5 } from 'uuid';
 import {
@@ -21,7 +21,6 @@ import {
 import ArrowBackIcon from '@mui/icons-material/ArrowBack';
 import SaveIcon from '@mui/icons-material/Save';
 import TableChartIcon from '@mui/icons-material/TableChart';
 import UploadFileIcon from '@mui/icons-material/UploadFile';
 import { examRepository } from '../../services/exam/examRepository';
 import type { BatchQueueResponse, ExamQuestion, ExamTemplateDetail, StudentSubmission } from '../../types/exam.types';
@@ -44,8 +43,6 @@ const ExamMarkingPage: React.FC = () => {
  const [saving, setSaving] = useState(false);
  const [message, setMessage] = useState<string | null>(null);
  const [error, setError] = useState<string | null>(null);
  const [uploading, setUploading] = useState(false);
  const fileInputRef = useRef<HTMLInputElement | null>(null);
  const load = useCallback(async () => {
    if (!batchId) return;
@@ -71,28 +68,6 @@ const ExamMarkingPage: React.FC = () => {
    () => (template?.questions ?? []).filter((q) => !q.is_container).sort((a, b) => a.order - b.order),
    [template],
  );
  const onScanFiles = useCallback(async (files: FileList | null) => {
    if (!batchId || !files || files.length === 0) return;
    setUploading(true); setError(null); setMessage(null);
    let ok = 0;
    const failures: string[] = [];
    for (const file of Array.from(files)) {
      try {
        // 'ordered' assigns each scan to the next not-yet-submitted roster slot; unmatched scans
        // become an unmatched submission the teacher can reconcile.
        await examRepository.uploadScan(batchId, file, { matchingMethod: 'ordered' });
        ok += 1;
      } catch (e) {
        failures.push(`${file.name}: ${e instanceof Error ? e.message : String(e)}`);
      }
    }
    setUploading(false);
    if (fileInputRef.current) fileInputRef.current.value = '';
    await load();
    if (ok) setMessage(`Uploaded ${ok} scan${ok === 1 ? '' : 's'}${failures.length ? `, ${failures.length} failed` : ''}`);
    if (failures.length) setError(failures.join(' · '));
  }, [batchId, load]);
  const selected = queue?.submissions.find((s) => s.id === selectedId) ?? null;
  const saveSelected = async () => {
@@ -179,29 +154,7 @@ const ExamMarkingPage: React.FC = () => {
        <Stack direction={{ xs: 'column', md: 'row' }} spacing={2} alignItems="stretch">
          <Card variant="outlined" sx={{ width: { xs: '100%', md: 340 }, flexShrink: 0 }}>
            <CardContent>
-              <Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 1, mb: 1 }}>
+              <Typography variant="h6" gutterBottom>Marking queue</Typography>
                <Typography variant="h6">Marking queue</Typography>
                <Button
                  size="small"
                  variant="outlined"
                  startIcon={<UploadFileIcon fontSize="small" />}
                  disabled={uploading}
                  onClick={() => fileInputRef.current?.click()}
                >
                  {uploading ? 'Uploading…' : 'Upload scans'}
                </Button>
                <input
                  ref={fileInputRef}
                  type="file"
                  accept="application/pdf"
                  multiple
                  hidden
                  onChange={(e) => { void onScanFiles(e.target.files); }}
                />
              </Box>
              <Typography variant="caption" color="text.secondary" sx={{ display: 'block', mb: 1 }}>
                Scanned PDFs fill the roster in order; unmatched scans appear below to reconcile.
              </Typography>
              <Stack direction="row" spacing={1} sx={{ mb: 1 }} flexWrap="wrap" useFlexGap>
                <Chip size="small" label={`${queue?.progress.total ?? 0} total`} />
                <Chip size="small" label={`${queue?.progress.absent ?? 0} absent`} color="warning" variant="outlined" />
@@ -1,207 +0,0 @@
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import { useNavigate } from 'react-router-dom';
 import {
  Alert, Box, Button, Card, CardActionArea, CardContent, Chip, CircularProgress, Container,
  Dialog, DialogActions, DialogContent, DialogTitle, Stack, TextField, Typography,
 } from '@mui/material';
 import ArrowBackIcon from '@mui/icons-material/ArrowBack';
 import PlaylistAddCheckIcon from '@mui/icons-material/PlaylistAddCheck';
 import CheckCircleIcon from '@mui/icons-material/CheckCircle';
 import RadioButtonUncheckedIcon from '@mui/icons-material/RadioButtonUnchecked';
 import { examRepository } from '../../services/exam/examRepository';
 import type { BankQuestion, BankResponse } from '../../types/exam.types';
 import { cropQuestion } from './bankCrops';
 const QuestionCrop: React.FC<{ q: BankQuestion }> = ({ q }) => {
  const [src, setSrc] = useState<string | null>(null);
  const [done, setDone] = useState(false);
  useEffect(() => {
    let alive = true;
    cropQuestion({ templateId: q.template_id, page: q.page, bounds: q.bounds })
      .then((d) => { if (alive) { setSrc(d); setDone(true); } })
      .catch(() => { if (alive) setDone(true); });
    return () => { alive = false; };
  }, [q.template_id, q.page, q.bounds]);
  if (src) {
    return <Box component="img" src={src} alt="" loading="lazy" sx={{ width: '100%', maxHeight: 150, objectFit: 'cover', objectPosition: 'top', display: 'block', bgcolor: '#fff', borderBottom: 1, borderColor: 'divider' }} />;
  }
  return (
    <Box sx={{ height: 56, display: 'flex', alignItems: 'center', justifyContent: 'center', bgcolor: 'action.hover', borderBottom: 1, borderColor: 'divider', color: 'text.disabled', fontSize: 12 }}>
      {done ? 'no preview' : <CircularProgress size={16} />}
    </Box>
  );
 };
 const QuestionBankPage: React.FC = () => {
  const navigate = useNavigate();
  const [bank, setBank] = useState<BankResponse | null>(null);
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState<string | null>(null);
  const [specRef, setSpecRef] = useState<string | null>(null);
  const [subject, setSubject] = useState<string | null>(null);
  const [selected, setSelected] = useState<Set<string>>(new Set());
  const [dialogOpen, setDialogOpen] = useState(false);
  const [title, setTitle] = useState('');
  const [creating, setCreating] = useState(false);
  const load = useCallback(async () => {
    setLoading(true); setError(null);
    try {
      setBank(await examRepository.getBank({ specRef: specRef ?? undefined, subject: subject ?? undefined }));
    } catch (e) {
      setError(e instanceof Error ? e.message : String(e));
    } finally {
      setLoading(false);
    }
  }, [specRef, subject]);
  useEffect(() => { void load(); }, [load]);
  const toggle = (id: string) => setSelected((prev) => {
    const next = new Set(prev);
    if (next.has(id)) next.delete(id); else next.add(id);
    return next;
  });
  const selectedList = useMemo(() => Array.from(selected), [selected]);
  const selectedQuestions = useMemo(
    () => (bank?.questions ?? []).filter((q) => selected.has(q.id)),
    [bank, selected],
  );
  const totalMarks = selectedQuestions.reduce((s, q) => s + (q.max_marks ?? 0), 0);
  // facet lists (sorted) with counts
  const specFacets = Object.entries(bank?.facets.spec_ref ?? {}).sort((a, b) => (a[0] < b[0] ? -1 : 1));
  const subjectFacets = Object.entries(bank?.facets.subject ?? {}).sort((a, b) => (a[0] < b[0] ? -1 : 1));
  const create = async () => {
    setCreating(true); setError(null);
    try {
      const subj = subject ?? selectedQuestions[0]?.paper.subject ?? undefined;
      const res = await examRepository.createCustomPaper({
        title: title.trim() || `Custom paper — ${new Date().toISOString().slice(0, 10)}`,
        subject: subj ?? undefined,
        question_ids: selectedList,
      });
      navigate(`/exam-marker/${res.id}/setup`);
    } catch (e) {
      setError(e instanceof Error ? e.message : String(e));
      setCreating(false);
      setDialogOpen(false);
    }
  };
  return (
    <Container maxWidth="lg" sx={{ py: 4 }}>
      <Button size="small" startIcon={<ArrowBackIcon />} onClick={() => navigate('/exam-marker')} sx={{ mb: 1 }}>
        Exam Marker
      </Button>
      <Box sx={{ display: 'flex', alignItems: 'flex-start', justifyContent: 'space-between', gap: 2, flexWrap: 'wrap', mb: 2 }}>
        <Box>
          <Typography variant="h4" component="h1" fontWeight={700}>Question bank</Typography>
          <Typography variant="body2" color="text.secondary">
            Plan by spec point, then assemble a custom paper from questions across your papers.
          </Typography>
        </Box>
        <Button
          variant="contained"
          startIcon={<PlaylistAddCheckIcon />}
          disabled={selected.size === 0}
          onClick={() => setDialogOpen(true)}
        >
          Create paper ({selected.size}{totalMarks ? ` · ${totalMarks}m` : ''})
        </Button>
      </Box>
      {error && <Alert severity="error" sx={{ mb: 2 }} onClose={() => setError(null)}>{error}</Alert>}
      {/* Filters */}
      <Stack spacing={1} sx={{ mb: 2 }}>
        <Stack direction="row" spacing={0.75} alignItems="center" flexWrap="wrap" useFlexGap>
          <Typography variant="caption" color="text.secondary" sx={{ mr: 0.5 }}>Spec point:</Typography>
          <Chip size="small" label="all" color={specRef ? 'default' : 'primary'} onClick={() => setSpecRef(null)} variant={specRef ? 'outlined' : 'filled'} />
          {specFacets.map(([ref, count]) => (
            <Chip key={ref} size="small" label={`${ref} · ${count}`} color={specRef === ref ? 'primary' : 'default'} variant={specRef === ref ? 'filled' : 'outlined'} onClick={() => setSpecRef(ref)} />
          ))}
        </Stack>
        {subjectFacets.length > 1 && (
          <Stack direction="row" spacing={0.75} alignItems="center" flexWrap="wrap" useFlexGap>
            <Typography variant="caption" color="text.secondary" sx={{ mr: 0.5 }}>Subject:</Typography>
            <Chip size="small" label="all" color={subject ? 'default' : 'secondary'} onClick={() => setSubject(null)} variant={subject ? 'outlined' : 'filled'} />
            {subjectFacets.map(([s, count]) => (
              <Chip key={s} size="small" label={`${s} · ${count}`} color={subject === s ? 'secondary' : 'default'} variant={subject === s ? 'filled' : 'outlined'} onClick={() => setSubject(s)} sx={{ textTransform: 'capitalize' }} />
            ))}
          </Stack>
        )}
      </Stack>
      {loading ? (
        <Box sx={{ display: 'flex', justifyContent: 'center', py: 6 }}><CircularProgress /></Box>
      ) : (bank?.questions.length ?? 0) === 0 ? (
        <Alert severity="info">
          No questions match yet. Questions appear here once your templates have parts with spec points
          (set them in the mark-scheme editor). Auto-map + confirm on a paper to populate it.
        </Alert>
      ) : (
        <>
          <Typography variant="body2" color="text.secondary" sx={{ mb: 1 }}>
            {bank?.n} question{bank?.n === 1 ? '' : 's'} · click to add to your paper
          </Typography>
          <Box sx={{ display: 'grid', gridTemplateColumns: { xs: '1fr', sm: '1fr 1fr', md: '1fr 1fr 1fr' }, gap: 1.5 }}>
            {(bank?.questions ?? []).map((q: BankQuestion) => {
              const on = selected.has(q.id);
              return (
                <Card key={q.id} variant="outlined" sx={{ borderColor: on ? 'primary.main' : 'divider', borderWidth: on ? 2 : 1 }}>
                  <CardActionArea onClick={() => toggle(q.id)}>
                    <QuestionCrop q={q} />
                    <CardContent sx={{ pb: 1.5 }}>
                      <Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', mb: 0.5 }}>
                        <Typography variant="subtitle2" fontWeight={700}>Q{q.label ?? '?'}</Typography>
                        {on ? <CheckCircleIcon color="primary" fontSize="small" /> : <RadioButtonUncheckedIcon color="disabled" fontSize="small" />}
                      </Box>
                      <Stack direction="row" spacing={0.5} flexWrap="wrap" useFlexGap sx={{ mb: 0.75 }}>
                        <Chip size="small" label={`${q.max_marks ?? 0} marks`} />
                        {q.answer_type && <Chip size="small" variant="outlined" label={q.answer_type} />}
                        {q.spec_ref && <Chip size="small" color="info" label={q.spec_ref} />}
                      </Stack>
                      <Typography variant="caption" color="text.secondary" noWrap sx={{ display: 'block', textTransform: 'capitalize' }}>
                        {[q.paper.subject, q.paper.title].filter(Boolean).join(' · ') || 'Untitled paper'}
                      </Typography>
                    </CardContent>
                  </CardActionArea>
                </Card>
              );
            })}
          </Box>
        </>
      )}
      <Dialog open={dialogOpen} onClose={() => !creating && setDialogOpen(false)} fullWidth maxWidth="sm">
        <DialogTitle>Create custom paper</DialogTitle>
        <DialogContent>
          <Typography variant="body2" color="text.secondary" sx={{ mb: 2 }}>
            {selected.size} question{selected.size === 1 ? '' : 's'} · {totalMarks} marks. This creates a new
            template you can open in setup and use for marking.
          </Typography>
          <TextField
            autoFocus
            fullWidth
            label="Paper title"
            value={title}
            onChange={(e) => setTitle(e.target.value)}
            placeholder={`Custom paper — ${new Date().toISOString().slice(0, 10)}`}
          />
        </DialogContent>
        <DialogActions>
          <Button onClick={() => setDialogOpen(false)} disabled={creating}>Cancel</Button>
          <Button variant="contained" onClick={create} disabled={creating} startIcon={creating ? <CircularProgress size={16} color="inherit" /> : undefined}>
            {creating ? 'Creating…' : 'Create & open'}
          </Button>
        </DialogActions>
      </Dialog>
    </Container>
  );
 };
 export default QuestionBankPage;
@@ -1,68 +0,0 @@
 // Client-side crop thumbnails for the question bank. A bank question carries `bounds` (x,y,w,h) in the
 // 780px stacked-page canvas space and a `page` number; the source PDF renders at that same 780px width
 // (pdfLoader), so a thumbnail is just the page image cropped to the bounds. Renders each template's PDF
 // once (cached) and reuses it for all of that template's questions. No API/infra change.
 import { examRepository } from '../../services/exam/examRepository';
 import { loadPdfPageImages, PdfPageImage } from './setup/pdfLoader';
 const renderCache = new Map<string, Promise<PdfPageImage[]>>();
 const imageCache = new Map<string, Promise<HTMLImageElement>>();
 function templateRender(templateId: string): Promise<PdfPageImage[]> {
  let p = renderCache.get(templateId);
  if (!p) {
    p = examRepository.getTemplateSourcePdf(templateId).then((bytes) => loadPdfPageImages(bytes));
    p.catch(() => renderCache.delete(templateId)); // let a failed render be retried
    renderCache.set(templateId, p);
  }
  return p;
 }
 function loadImage(src: string): Promise<HTMLImageElement> {
  let p = imageCache.get(src);
  if (!p) {
    p = new Promise<HTMLImageElement>((resolve, reject) => {
      const img = new Image();
      img.onload = () => resolve(img);
      img.onerror = () => reject(new Error('image decode failed'));
      img.src = src;
    });
    imageCache.set(src, p);
  }
  return p;
 }
 export interface CropInput {
  templateId: string;
  page: number | null;
  bounds: Record<string, number> | null;
 }
 // Returns a PNG data-URL cropped to the question, or null if it can't be produced (no bounds/page/PDF).
 export async function cropQuestion(input: CropInput, maxWidth = 320): Promise<string | null> {
  const { templateId, page, bounds } = input;
  if (!bounds || !page) return null;
  const pages = await templateRender(templateId);
  const pageImg = pages.find((pg) => pg.pageNumber === page);
  if (!pageImg) return null;
  // stacked y-offset of this page (bounds.y is absolute across the vertically-stacked pages)
  let yTop = 0;
  for (const pg of pages) { if (pg.pageNumber === page) break; yTop += pg.height; }
  const sx = Math.max(0, Math.round(bounds.x ?? 0));
  const sy = Math.max(0, Math.round((bounds.y ?? 0) - yTop));
  const sw = Math.min(Math.round(bounds.w ?? pageImg.width), pageImg.width - sx);
  const sh = Math.min(Math.round(bounds.h ?? 80), pageImg.height - sy);
  if (sw <= 1 || sh <= 1) return null;
  const img = await loadImage(pageImg.src);
  const scale = Math.min(1, maxWidth / sw);
  const canvas = document.createElement('canvas');
  canvas.width = Math.max(1, Math.round(sw * scale));
  canvas.height = Math.max(1, Math.round(sh * scale));
  const ctx = canvas.getContext('2d');
  if (!ctx) return null;
  ctx.drawImage(img, sx, sy, sw, sh, 0, 0, canvas.width, canvas.height);
  return canvas.toDataURL('image/png');
 }
@@ -1,5 +1,4 @@
 export { default as ExamDashboardPage } from './ExamDashboardPage';
 export { default as QuestionBankPage } from './QuestionBankPage';
 export { default as ExamTemplateSetupPage } from './setup/ExamTemplateSetupPage';
 export { default as MarkSchemePage } from './MarkSchemePage';
 export { default as ExamMarkingPage } from './ExamMarkingPage';
@@ -4,12 +4,8 @@ import { useNavigate, useParams } from 'react-router-dom'
 import { Alert, Box, Button, Chip, CircularProgress, Collapse, Divider, IconButton, Paper, Snackbar, Stack, Tooltip, Typography, useTheme } from '@mui/material'
 import ArrowBackIcon from '@mui/icons-material/ArrowBack'
 import HelpOutlineIcon from '@mui/icons-material/HelpOutline'
 import AutoFixHighIcon from '@mui/icons-material/AutoFixHigh'
 import SaveIcon from '@mui/icons-material/Save'
 import MouseIcon from '@mui/icons-material/Mouse'
 import CheckIcon from '@mui/icons-material/Check'
 import CloseIcon from '@mui/icons-material/Close'
 import DoneAllIcon from '@mui/icons-material/DoneAll'
 import '@tldraw/tldraw/tldraw.css'
 import { Editor, Tldraw, createShapeId, TLShape } from '@tldraw/tldraw'
 import axios from 'axios'
@@ -17,7 +13,7 @@ import axios from 'axios'
 import { ErrorBoundary } from '../../../components/ErrorBoundary'
 import { logger } from '../../../debugConfig'
 import { examRepository } from '../../../services/exam/examRepository'
-import type { AutoMapJobStatus, ExamTemplateDetail } from '../../../types/exam.types'
+import type { ExamTemplateDetail } from '../../../types/exam.types'
 import { CanvasPageGeometry, ExamCanvasShapeModel, PAGE_HEIGHT, PAGE_WIDTH, isUuid, newDomainId, serializeCanvasShapes, shapesFromTemplate } from '../../../utils/exam-canvas/model'
 import { PDF_PAGE_SHAPE_TYPE, canvasShapePalette, examCanvasShapeUtils, examCanvasTools, ExamCanvasTLShape, SHAPE_TYPES, isPdfPageShape, shapeTypeToKind } from './examCanvasShapes'
 import { loadPdfPageImages, PdfPageImage } from './pdfLoader'
@@ -38,8 +34,6 @@ const PAGE_START_X = 0
 const PDF_PAGE_IDS_PREFIX = 'pdf-page-'
 function pageGeometryFromImages(pages: PdfPageImage[]): CanvasPageGeometry[] {
  // S5 coordinate contract: use the actual pdf.js raster dimensions that feed each page src.
  // Server mapper emits canvas coordinates against the same PAGE_START_X=0 and stacked page heights.
  let y = 0
  return pages.map((page) => {
    const geometry = { pageNumber: page.pageNumber, x: PAGE_START_X, y, w: page.width, h: page.height }
@@ -73,33 +67,6 @@ function apiMessage(err: unknown): { message: string; conflict: boolean } {
  return { conflict: false, message: err instanceof Error ? err.message : String(err) }
 }
 function reviewSummary(template: ExamTemplateDetail | null) {
  if (!template) return { ai: 0, unconfirmed: 0, lowConfidence: 0 }
  const rows = [...(template.questions ?? []), ...(template.response_areas ?? []), ...(template.boundaries ?? []), ...(template.layout ?? [])]
  return rows.reduce((acc, row) => {
    if (row.source === 'ai') acc.ai += 1
    if (row.source === 'ai' && row.confirmed === false) acc.unconfirmed += 1
    if (typeof row.confidence === 'number' && row.confidence < 0.7) acc.lowConfidence += 1
    return acc
  }, { ai: 0, unconfirmed: 0, lowConfidence: 0 })
 }
 // Live review counts read straight off the canvas shapes, so accept/reject update them immediately
 // (the template-derived reviewSummary only reflects the last *saved* state).
 function reviewFromShapes(editor: Editor | null) {
  const acc = { ai: 0, unconfirmed: 0, lowConfidence: 0 }
  if (!editor) return acc
  for (const shape of editor.getCurrentPageShapes()) {
    if (!shapeTypeToKind(shape.type)) continue
    const p = (shape as ExamCanvasTLShape).props
    if (p.source === 'ai') acc.ai += 1
    if (p.source === 'ai' && p.confirmed === false) acc.unconfirmed += 1
    if (typeof p.confidence === 'number' && p.confidence < 0.7) acc.lowConfidence += 1
  }
  return acc
 }
 function stripShapePrefix(id: string) {
  return id.startsWith('shape:') ? id.slice('shape:'.length) : id
 }
@@ -135,10 +102,6 @@ function modelFromTLShape(shape: TLShape): ExamCanvasShapeModel | null {
    responseForm: s.props.responseForm as ExamCanvasShapeModel['responseForm'],
    contextType: s.props.contextType,
    questionId: s.props.questionId ?? null,
    source: s.props.source ?? 'manual',
    confirmed: s.props.confirmed ?? s.props.source !== 'ai',
    confidence: typeof s.props.confidence === 'number' ? s.props.confidence : null,
    derivation: s.props.derivation ?? null,
  }
 }
@@ -148,15 +111,15 @@ function bringDomainShapesToFront(editor: Editor) {
 }
 function loadShapes(editor: Editor, models: ExamCanvasShapeModel[]) {
  if (!models.length) return
  const existing = editor.getCurrentPageShapes().filter((s) => shapeTypeToKind(s.type)).map((s) => s.id)
  if (existing.length) editor.deleteShapes(existing)
  if (!models.length) return
  editor.createShapes(models.map((m) => ({
    id: createShapeId(m.id),
    type: SHAPE_TYPES[m.kind],
    x: m.x,
    y: m.y,
-    props: { w: m.w, h: m.h, label: m.label ?? m.kind, kind: m.kind, maxMarks: m.maxMarks, responseForm: m.responseForm, contextType: m.contextType, questionId: m.questionId, domainId: m.id, source: m.source ?? 'manual', confirmed: m.confirmed ?? m.source !== 'ai', confidence: m.confidence ?? undefined, derivation: m.derivation ?? undefined, reviewFlags: m.reviewFlags?.join('|') },
+    props: { w: m.w, h: m.h, label: m.label ?? m.kind, kind: m.kind, maxMarks: m.maxMarks, responseForm: m.responseForm, contextType: m.contextType, questionId: m.questionId, domainId: m.id },
  })))
 }
@@ -191,20 +154,6 @@ function seedGuide(editor: Editor) {
  ])
 }
 function isAutoMapAccepted(value: unknown): value is { status: 'accepted'; job_id: string } {
  return !!value && typeof value === 'object' && (value as { status?: string }).status === 'accepted' && typeof (value as { job_id?: unknown }).job_id === 'string'
 }
 function autoMapStatusLabel(status: AutoMapJobStatus | null): string {
  if (!status) return 'Auto-map running'
  if (status.status === 'queued') return 'Auto-map queued'
  if (status.status === 'running') return 'Auto-map running'
  if (status.status === 'completed') return 'Auto-map complete'
  if (status.status === 'failed') return 'Auto-map failed'
  return `Auto-map ${status.status}`
 }
 const ExamTemplateSetupInner: React.FC = () => {
  const { templateId } = useParams<{ templateId: string }>()
  const navigate = useNavigate()
@@ -221,52 +170,6 @@ const ExamTemplateSetupInner: React.FC = () => {
  const [pdfStatus, setPdfStatus] = useState<'loading' | 'ready' | 'missing' | 'error'>('loading')
  const [pdfError, setPdfError] = useState<string | null>(null)
  const [guideOpen, setGuideOpen] = useState(false)
  const [autoMapStatus, setAutoMapStatus] = useState<AutoMapJobStatus | null>(null)
  const [autoMapBusy, setAutoMapBusy] = useState(false)
  const [liveReview, setLiveReview] = useState({ ai: 0, unconfirmed: 0, lowConfidence: 0 })
  const autoMapPollRef = useRef<number | null>(null)
  const refreshReview = useCallback(() => setLiveReview(reviewFromShapes(editorRef.current)), [])
  const applyTemplateToCanvas = useCallback((detail: ExamTemplateDetail) => {
    setTemplate(detail)
    const editor = editorRef.current
    if (editor) {
      const shapes = shapesFromTemplate(detail, pageGeometriesRef.current)
      loadShapes(editor, shapes)
      if (!shapes.length) seedGuide(editor)
      bringDomainShapesToFront(editor)
    }
    setDirty(false)
  }, [])
  const acceptShapes = useCallback((shapes: TLShape[]) => {
    const editor = editorRef.current
    if (!editor) return
    const updates = shapes
      .filter((s) => !!shapeTypeToKind(s.type) && (s as ExamCanvasTLShape).props.source === 'ai' && (s as ExamCanvasTLShape).props.confirmed === false)
      .map((s) => ({ id: s.id, type: s.type, props: { confirmed: true } }))
    if (updates.length) { editor.updateShapes(updates as any); refreshReview(); setDirty(true) }
  }, [refreshReview])
  const selectedDomainShapes = useCallback((): TLShape[] => {
    const editor = editorRef.current
    if (!editor) return []
    return editor.getSelectedShapeIds().map((id) => editor.getShape(id)).filter((s): s is TLShape => !!s && !!shapeTypeToKind(s.type))
  }, [])
  const acceptSelected = useCallback(() => acceptShapes(selectedDomainShapes()), [acceptShapes, selectedDomainShapes])
  const acceptAllAi = useCallback(() => { const ed = editorRef.current; if (ed) acceptShapes(ed.getCurrentPageShapes()) }, [acceptShapes])
  const rejectSelected = useCallback(() => {
    const editor = editorRef.current
    if (!editor) return
    const ids = selectedDomainShapes().map((s) => s.id)
    if (ids.length) { editor.deleteShapes(ids); refreshReview(); setDirty(true) }
  }, [refreshReview, selectedDomainShapes])
  // Displayed counts come live from the canvas so accept/reject reflect immediately (falls back to the
  // saved-template summary only for the brief moment before shapes have mounted).
  const review = (liveReview.ai || liveReview.unconfirmed) ? liveReview : reviewSummary(template)
  const load = useCallback(async () => {
    if (!templateId) return
@@ -324,62 +227,6 @@ const ExamTemplateSetupInner: React.FC = () => {
  useEffect(() => { void load() }, [load])
  useEffect(() => () => {
    if (autoMapPollRef.current !== null) window.clearTimeout(autoMapPollRef.current)
  }, [])
  const pollAutoMapStatus = useCallback(async (jobId: string) => {
    if (!templateId) return
    try {
      const status = await examRepository.getAutoMapStatus(templateId, jobId)
      setAutoMapStatus(status)
      if (status.status === 'completed') {
        if (autoMapPollRef.current !== null) window.clearTimeout(autoMapPollRef.current)
        autoMapPollRef.current = null
        setAutoMapBusy(false)
        const detail = status.template ?? await examRepository.getTemplate(templateId)
        applyTemplateToCanvas(detail)
        return
      }
      if (status.status === 'failed') {
        if (autoMapPollRef.current !== null) window.clearTimeout(autoMapPollRef.current)
        autoMapPollRef.current = null
        setAutoMapBusy(false)
        setError(status.error ?? 'Auto-map failed; existing template state was preserved.')
        return
      }
      autoMapPollRef.current = window.setTimeout(() => void pollAutoMapStatus(jobId), 2500)
    } catch (e) {
      const msg = apiMessage(e).message
      setAutoMapBusy(false)
      setError(msg)
      logger.warn('cc-exam-marker', 'Auto-map status poll failed', { templateId, jobId, message: msg })
    }
  }, [applyTemplateToCanvas, templateId])
  const autoMapFromPdf = useCallback(async () => {
    if (!templateId || autoMapBusy) return
    let queued = false
    setAutoMapBusy(true); setAutoMapStatus(null); setError(null); setConflict(null)
    try {
      const result = await examRepository.autoMapTemplate(templateId)
      if (isAutoMapAccepted(result)) {
        queued = true
        setAutoMapStatus({ job_id: result.job_id, status: 'queued', template_id: templateId })
        await pollAutoMapStatus(result.job_id)
        return
      }
      setAutoMapStatus(null)
      applyTemplateToCanvas(result)
    } catch (e) {
      const msg = apiMessage(e)
      if (msg.conflict) setConflict(msg.message); else setError(msg.message)
      logger.warn('cc-exam-marker', 'Auto-map request failed', { templateId, message: msg.message })
    } finally {
      if (!queued) setAutoMapBusy(false)
    }
  }, [applyTemplateToCanvas, autoMapBusy, pollAutoMapStatus, templateId])
  const save = useCallback(async () => {
    const editor = editorRef.current
    if (!editor || !templateId || !template) return
@@ -401,11 +248,6 @@ const ExamTemplateSetupInner: React.FC = () => {
    }
  }, [template, templateId])
  const layoutSummary = useMemo(() => {
    const rows = (template?.layout ?? []).filter((row) => row.margins_enabled && row.margin_left !== null && row.margin_right !== null)
    return rows.slice(0, 4).map((row) => `P${row.page_index + 1} ${row.role ?? 'page'} L${Math.round(row.margin_left ?? 0)} R${Math.round(row.margin_right ?? 0)} T${Math.round(row.margin_top ?? 0)} B${Math.round(row.margin_bottom ?? 0)}`)
  }, [template?.layout])
  const toolButtons = useMemo(() => TOOLS.map((tool) => (
    <Tooltip title={tool.tip} key={tool.id} placement="right">
      <Button
@@ -436,10 +278,7 @@ const ExamTemplateSetupInner: React.FC = () => {
        </Tooltip>
        <Divider orientation="vertical" flexItem />
        <Typography variant="subtitle2" noWrap sx={{ flex: 1, minWidth: 0 }}>{template?.title ?? 'Template setup'}</Typography>
        <Chip size="small" color={review.unconfirmed ? 'warning' : review.ai ? 'info' : 'default'} label={review.ai ? `AI review: ${review.unconfirmed} unconfirmed · ${review.lowConfidence} low conf` : 'Manual template'} />
        <Chip size="small" color={dirty ? 'warning' : 'success'} label={dirty ? 'Unsaved' : 'Saved'} />
        {(autoMapBusy || autoMapStatus) && <Chip size="small" color={autoMapStatus?.status === 'failed' ? 'error' : autoMapStatus?.status === 'completed' ? 'success' : 'info'} label={autoMapStatusLabel(autoMapStatus)} />}
        <Button size="small" variant="outlined" startIcon={autoMapBusy ? <CircularProgress size={14} /> : <AutoFixHighIcon fontSize="small" />} onClick={autoMapFromPdf} disabled={autoMapBusy || saving || loading || !template || pdfStatus !== 'ready'}>Auto-map from PDF</Button>
        <Button size="small" variant="contained" startIcon={saving ? <CircularProgress size={14} color="inherit" /> : <SaveIcon fontSize="small" />} onClick={save} disabled={saving || loading || !template}>Save</Button>
      </Paper>
@@ -463,54 +302,15 @@ const ExamTemplateSetupInner: React.FC = () => {
              onMount={(editor) => {
                editorRef.current = editor
                editor.user.updateUserPreferences({ colorScheme: theme.palette.mode === 'dark' ? 'dark' : 'light' })
-                editor.store.listen(() => { setDirty(true); refreshReview() }, { scope: 'document' })
+                editor.store.listen(() => setDirty(true), { scope: 'document' })
                // Treat a user nudge/resize of an AI ghost as implicit confirmation (R3.3): a teacher who
                // adjusts a suggestion has reviewed it. Only geometry edits count, so the confirmed-only
                // update below can't recurse.
                editor.store.listen((entry) => {
                  try {
                    const updates: Array<{ id: TLShape['id']; type: string; props: { confirmed: boolean } }> = []
                    for (const rec of Object.values(entry.changes.updated)) {
                      const [from, to] = rec as [any, any]
                      if (!to || to.typeName !== 'shape' || !shapeTypeToKind(to.type)) continue
                      if (to.props?.source !== 'ai' || to.props?.confirmed !== false) continue
                      const moved = from.x !== to.x || from.y !== to.y || from.props?.w !== to.props?.w || from.props?.h !== to.props?.h
                      if (moved) updates.push({ id: to.id, type: to.type, props: { confirmed: true } })
                    }
                    if (updates.length) editor.updateShapes(updates as any)
                  } catch { /* non-fatal: implicit-confirm is best-effort */ }
                }, { scope: 'document', source: 'user' })
                applyDocViewConstraints(editor, [])
                editor.resetZoom()
-                // Only seed the example guide for a genuinely-empty template AFTER it has loaded.
+                if (template) loadShapes(editor, shapesFromTemplate(template, pageGeometriesRef.current)); else seedGuide(editor)
                // (Previously `else seedGuide` fired on mount while `template` was still null during
                // the async fetch, flashing placeholder shapes before the real shapes/PDF rendered.)
                if (template) {
                  const s = shapesFromTemplate(template, pageGeometriesRef.current)
                  loadShapes(editor, s)
                  if (!s.length) seedGuide(editor)
                }
                bringDomainShapesToFront(editor)
              }}
            />
          </Box>
          {/* AI review actions — appears while there are unconfirmed suggestions to resolve */}
          {review.unconfirmed > 0 && (
            <Paper elevation={6} sx={{ position: 'absolute', left: 16, bottom: 16, zIndex: 1002, px: 1, py: 0.75, borderRadius: 2, bgcolor: 'background.paper', display: 'flex', alignItems: 'center', gap: 0.75 }}>
              <Chip size="small" color="warning" label={`${review.unconfirmed} AI unconfirmed`} sx={{ fontWeight: 700 }} />
              <Tooltip title="Accept the selected AI suggestions (nudging one also confirms it)">
                <span><Button size="small" color="success" startIcon={<CheckIcon fontSize="small" />} onClick={acceptSelected}>Accept</Button></span>
              </Tooltip>
              <Tooltip title="Reject (delete) the selected shapes">
                <span><Button size="small" color="error" startIcon={<CloseIcon fontSize="small" />} onClick={rejectSelected}>Reject</Button></span>
              </Tooltip>
              <Tooltip title="Accept every AI suggestion on the page">
                <span><Button size="small" variant="contained" startIcon={<DoneAllIcon fontSize="small" />} onClick={acceptAllAi}>Accept all</Button></span>
              </Tooltip>
            </Paper>
          )}
          {/* Guide toggle */}
          <Tooltip title={guideOpen ? 'Hide guide' : 'Show setup guide'} placement="left">
            <IconButton onClick={() => setGuideOpen((v) => !v)} size="small" sx={{ position: 'absolute', right: 16, bottom: 16, zIndex: 1001, bgcolor: 'background.paper', boxShadow: 2, '&:hover': { bgcolor: 'background.paper' } }}>
@@ -523,11 +323,8 @@ const ExamTemplateSetupInner: React.FC = () => {
            <Paper elevation={4} sx={{ p: 2, borderRadius: 3, bgcolor: 'background.paper' }}>
              <Typography variant="subtitle2" gutterBottom>Setup guide</Typography>
              <Typography variant="body2" color="text.secondary" sx={{ mb: 1 }}>
-                1) Boundary start/end lines define each main question. 2) Draw amber Part boxes for markable sub-questions. 3) AI suggestions render dashed/translucent with confidence and cheap review flags; manual shapes stay solid.
+                1) Boundary start/end lines define each main question. 2) Draw amber Part boxes for markable sub-questions. 3) Draw coloured Response, Context, Q Number, Mark Area, Reference, and Furniture regions; Save derives parent links by containment.
              </Typography>
              <Alert severity={review.unconfirmed || review.lowConfidence ? 'warning' : 'info'} variant="outlined" sx={{ my: 1 }}>
                Review layer: {review.ai} AI suggestions, {review.unconfirmed} unconfirmed, {review.lowConfidence} below 70% confidence. Cheap flags include overlap, missing marks, uncertain labels, low confidence, and unconfirmed AI.
              </Alert>
              <Stack direction="row" spacing={0.75} useFlexGap flexWrap="wrap" sx={{ my: 1 }}>
                {(['boundary', 'part', 'response', 'context', 'question_number', 'mark_area', 'reference', 'furniture'] as const).map((kind) => {
                  const p = canvasShapePalette[kind]
@@ -540,9 +337,6 @@ const ExamTemplateSetupInner: React.FC = () => {
              <Typography variant="caption" color={pdfStatus === 'ready' ? 'success.main' : pdfStatus === 'error' ? 'error.main' : 'text.secondary'} sx={{ display: 'block', mt: 1 }}>
                PDF: {pdfStatus === 'ready' ? 'loaded' : pdfStatus === 'loading' ? 'loading…' : pdfStatus === 'missing' ? 'no source PDF' : pdfError ?? 'failed'}
              </Typography>
              <Typography variant="caption" color="text.secondary" sx={{ display: 'block', mt: 1 }}>
                Margins: {layoutSummary.length ? layoutSummary.join(' · ') : 'not detected yet'}
              </Typography>
            </Paper>
          </Collapse>
@@ -1,10 +1,7 @@
 import React from 'react'
-import { BaseBoxShapeTool, BaseBoxShapeUtil, Edge2d, HTMLContainer, ShapeUtil, T, TLBaseBoxShape, Vec, toDomPrecision } from '@tldraw/tldraw'
+import { BaseBoxShapeTool, BaseBoxShapeUtil, HTMLContainer, T, TLBaseBoxShape, toDomPrecision } from '@tldraw/tldraw'
 import type { TLHandle } from '@tldraw/tldraw'
 import { PAGE_WIDTH } from '../../../utils/exam-canvas/model'
 import type { ExamCanvasRegionKind, ExamCanvasShapeKind } from '../../../utils/exam-canvas/model'
 import type { ExamTemplateSource } from '../../../types/exam.types'
 export const PDF_PAGE_SHAPE_TYPE = 'exam-pdf-page'
@@ -36,11 +33,6 @@ export type ExamCanvasTLShape = TLBaseBoxShape & {
    contextType?: string
    questionId?: string | null
    domainId?: string
    source?: 'manual' | 'ai'
    confirmed?: boolean
    confidence?: number | null
    derivation?: string | null
    reviewFlags?: string
  }
 }
@@ -70,71 +62,13 @@ const shapeCss = `
 .exam-canvas-shape { --exam-stroke: var(--exam-light-stroke); --exam-fill: var(--exam-light-fill); }
 [data-color-mode="dark"] .exam-canvas-shape, .tl-theme__dark .exam-canvas-shape { --exam-stroke: var(--exam-dark-stroke); --exam-fill: var(--exam-dark-fill); }
 .exam-canvas-shape__pill { background: rgba(255,255,255,.90); color: var(--exam-stroke); box-shadow: 0 1px 4px rgba(15,23,42,.14); }
 .exam-canvas-shape__flag { background: rgba(251,191,36,.94); color: #78350f; box-shadow: 0 1px 4px rgba(120,53,15,.18); }
 .exam-canvas-shape__confidence { background: rgba(15,23,42,.82); color: #fff; }
 [data-color-mode="dark"] .exam-canvas-shape__pill, .tl-theme__dark .exam-canvas-shape__pill { background: rgba(15,23,42,.88); color: var(--exam-stroke); box-shadow: 0 1px 5px rgba(0,0,0,.35); }
 [data-color-mode="dark"] .exam-canvas-shape__flag, .tl-theme__dark .exam-canvas-shape__flag { background: rgba(251,191,36,.88); color: #422006; }
 `
 function confidenceLabel(confidence: number | null | undefined) {
  return typeof confidence === 'number' ? `${Math.round(confidence * 100)}%` : null
 }
 // Unconfirmed AI ghosts fade by confidence (fainter = less certain); confirmed/manual render solid.
 function ghostOpacity(confidence: number | null | undefined) {
  if (typeof confidence !== 'number') return 0.72
  return 0.5 + 0.4 * Math.max(0, Math.min(1, confidence))
 }
 function reviewFlags(shape: ExamCanvasTLShape): string[] {
  return (shape.props.reviewFlags ?? '').split('|').map((flag) => flag.trim()).filter(Boolean)
 }
 function provenanceTitle(shape: ExamCanvasTLShape, base: string) {
  const bits = [base]
  if (shape.props.source === 'ai') bits.push(shape.props.confirmed === false ? 'AI suggestion, unconfirmed' : 'AI, confirmed')
  const confidence = confidenceLabel(shape.props.confidence)
  if (confidence) bits.push(`confidence ${confidence}`)
  if (shape.props.derivation) bits.push(`derivation: ${shape.props.derivation}`)
  const flags = reviewFlags(shape)
  if (flags.length) bits.push(`review flags: ${flags.join(', ')}`)
  return bits.join(' • ')
 }
 function renderBoundaryLine(shape: ExamCanvasTLShape) {
  const p = canvasShapePalette.boundary
  const lineY = Math.max(1, Math.min(shape.props.h - 1, shape.props.h / 2))
  const isAi = shape.props.source === 'ai'
  const isGhost = isAi && shape.props.confirmed === false
  const confidence = confidenceLabel(shape.props.confidence)
  const flags = reviewFlags(shape)
  return (
    <HTMLContainer id={shape.id} style={{ width: toDomPrecision(shape.props.w), height: toDomPrecision(shape.props.h), overflow: 'visible', pointerEvents: 'all' }}>
      <style>{shapeCss}</style>
      <svg width={toDomPrecision(shape.props.w)} height={toDomPrecision(shape.props.h)} aria-label={`${p.label}: ${p.role}`} style={{ display: 'block', overflow: 'visible' }}>
        <line x1={0} x2={toDomPrecision(shape.props.w)} y1={lineY} y2={lineY} stroke="var(--exam-stroke)" strokeWidth={2.5} strokeDasharray={isGhost ? '4 6' : p.dash} strokeLinecap="round" opacity={isGhost ? ghostOpacity(shape.props.confidence) : 1} style={{ '--exam-light-stroke': p.stroke, '--exam-dark-stroke': p.darkStroke } as React.CSSProperties} />
      </svg>
      <span className="exam-canvas-shape__pill" style={{ position: 'absolute', left: 8, top: -24, fontSize: 11, fontWeight: 900, textTransform: 'uppercase', letterSpacing: 0.6, borderRadius: 999, padding: '2px 7px', display: 'inline-flex', alignItems: 'center', gap: 5, color: p.stroke }}>
        <span aria-hidden="true">{isGhost ? 'AI' : p.icon}</span>
        {shape.props.label || p.label}
      </span>
      {confidence && <span className="exam-canvas-shape__pill exam-canvas-shape__confidence" style={{ position: 'absolute', right: 8, top: -24, fontSize: 11, fontWeight: 900, borderRadius: 999, padding: '2px 7px' }}>{confidence}</span>}
      {flags.slice(0, 2).map((flag, index) => <span key={flag} className="exam-canvas-shape__pill exam-canvas-shape__flag" style={{ position: 'absolute', left: 8, top: 10 + index * 22, fontSize: 10, fontWeight: 900, borderRadius: 999, padding: '1px 6px' }}>{flag}</span>)}
    </HTMLContainer>
  )
 }
 function renderShape(shape: ExamCanvasTLShape) {
  const kind = shape.props.kind
  const p = canvasShapePalette[kind] ?? canvasShapePalette.response
  const isBoundary = kind === 'boundary'
  const isAiSuggestion = shape.props.source === 'ai' && shape.props.confirmed === false
  if (isBoundary) return renderBoundaryLine(shape)
  const isAi = shape.props.source === 'ai'
  const confidence = confidenceLabel(shape.props.confidence)
  const flags = reviewFlags(shape)
  const title = provenanceTitle(shape, `${p.label}: ${p.role}`)
  return (
    <HTMLContainer id={shape.id} style={{ width: toDomPrecision(shape.props.w), height: toDomPrecision(shape.props.h), pointerEvents: 'all' }}>
      <style>{shapeCss}</style>
@@ -146,21 +80,19 @@ function renderShape(shape: ExamCanvasTLShape) {
          '--exam-dark-stroke': p.darkStroke,
          '--exam-dark-fill': p.darkFill,
          width: '100%', height: '100%', boxSizing: 'border-box', border: `${isBoundary ? 2 : 1.5}px solid var(--exam-stroke)`,
-          borderStyle: isAiSuggestion ? 'dashed' : p.dash ? 'dashed' : 'solid', borderRadius: isBoundary ? 999 : 10,
+          borderStyle: p.dash ? 'dashed' : 'solid', borderRadius: isBoundary ? 999 : 10,
-          background: isBoundary ? 'transparent' : 'var(--exam-fill)', opacity: isAiSuggestion ? ghostOpacity(shape.props.confidence) : 1, color: 'var(--exam-stroke)', fontFamily: 'Inter, system-ui, sans-serif',
+          background: isBoundary ? 'transparent' : 'var(--exam-fill)', color: 'var(--exam-stroke)', fontFamily: 'Inter, system-ui, sans-serif',
          display: 'flex', alignItems: isBoundary ? 'center' : 'flex-start', justifyContent: isBoundary ? 'center' : 'space-between',
          padding: isBoundary ? '0 8px' : 8, boxShadow: isBoundary ? '0 0 0 3px rgba(239,68,68,0.08)' : '0 10px 22px rgba(15,23,42,0.10)', overflow: 'hidden', gap: 6,
        } as React.CSSProperties}
-        aria-label={title}
+        aria-label={`${p.label}: ${p.role}`}
-        title={title}
+        title={`${p.label}: ${p.role}`}
      >
        <span className="exam-canvas-shape__pill" style={{ fontSize: 12, fontWeight: 900, textTransform: 'uppercase', letterSpacing: 0.6, borderRadius: 999, padding: '2px 7px', display: 'inline-flex', alignItems: 'center', gap: 5 }}>
-          <span aria-hidden="true">{isAiSuggestion ? 'AI' : p.icon}</span>
+          <span aria-hidden="true">{p.icon}</span>
          {shape.props.label || p.label}
        </span>
-        {confidence && <span className="exam-canvas-shape__pill exam-canvas-shape__confidence" style={{ fontSize: 11, fontWeight: 900, borderRadius: 999, padding: '2px 7px' }}>{confidence}</span>}
+        {!isBoundary && shape.props.questionId && <span className="exam-canvas-shape__pill" style={{ fontSize: 11, fontWeight: 800, borderRadius: 999, padding: '2px 7px' }}>Attached</span>}
        {!confidence && !isBoundary && shape.props.questionId && <span className="exam-canvas-shape__pill" style={{ fontSize: 11, fontWeight: 800, borderRadius: 999, padding: '2px 7px' }}>Attached</span>}
        {flags.length > 0 && <span className="exam-canvas-shape__pill exam-canvas-shape__flag" style={{ position: 'absolute', left: 8, bottom: 8, fontSize: 10, fontWeight: 900, borderRadius: 999, padding: '1px 6px', maxWidth: 'calc(100% - 16px)', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}>{flags.slice(0, 2).join(' · ')}</span>}
        {isBoundary && <span className="exam-canvas-shape__pill" style={{ fontSize: 10, fontWeight: 800, borderRadius: 999, padding: '1px 6px' }}>pair across pages</span>}
      </div>
    </HTMLContainer>
@@ -169,10 +101,10 @@ function renderShape(shape: ExamCanvasTLShape) {
 function defaultProps(kind: ExamCanvasShapeKind, w: number, h: number) {
  const p = canvasShapePalette[kind]
-  return { w, h, label: p.label, kind, responseForm: kind === 'response' ? 'lines' : undefined, contextType: kind === 'context' ? 'generic' : undefined, source: 'manual' as const, confirmed: true }
+  return { w, h, label: p.label, kind, responseForm: kind === 'response' ? 'lines' : undefined, contextType: kind === 'context' ? 'generic' : undefined }
 }
-const sharedProps = { w: T.number, h: T.number, label: T.string, kind: T.string, maxMarks: T.optional(T.number), responseForm: T.optional(T.string), contextType: T.optional(T.string), questionId: T.optional(T.string), domainId: T.optional(T.string), source: T.optional(T.string), confirmed: T.optional(T.boolean), confidence: T.optional(T.number), derivation: T.optional(T.string), reviewFlags: T.optional(T.string) }
+const sharedProps = { w: T.number, h: T.number, label: T.string, kind: T.string, maxMarks: T.optional(T.number), responseForm: T.optional(T.string), contextType: T.optional(T.string), questionId: T.optional(T.string), domainId: T.optional(T.string) }
 const ind = (s: ExamCanvasTLShape | ExamPdfPageTLShape) => <rect width={toDomPrecision(s.props.w)} height={toDomPrecision(s.props.h)} />
 class PdfPageUtil extends BaseBoxShapeUtil<ExamPdfPageTLShape> {
@@ -189,55 +121,7 @@ class PdfPageUtil extends BaseBoxShapeUtil<ExamPdfPageTLShape> {
  }
  override indicator(shape: ExamPdfPageTLShape) { return ind(shape) }
 }
-class BoundaryUtil extends ShapeUtil<ExamCanvasTLShape> {
+class BoundaryUtil extends BaseBoxShapeUtil<ExamCanvasTLShape> { static override type = SHAPE_TYPES.boundary; static override props = sharedProps; override getDefaultProps(){ return defaultProps('boundary', 680, 8) }; override component(shape: ExamCanvasTLShape){ return renderShape(shape) }; override indicator(shape: ExamCanvasTLShape){ return ind(shape) } }
  static override type = SHAPE_TYPES.boundary
  static override props = sharedProps
  override getDefaultProps() { return defaultProps('boundary', PAGE_WIDTH, 8) }
  override canEdit() { return false }
  override canResize() { return false }
  override canBind() { return false }
  override hideResizeHandles() { return true }
  override hideRotateHandle() { return true }
  override hideSelectionBoundsBg() { return true }
  private pageSpanForY(y: number) {
    const pages = this.editor.getCurrentPageShapes().filter((shape): shape is ExamPdfPageTLShape => shape.type === PDF_PAGE_SHAPE_TYPE)
    const hit = pages.find((page) => y >= page.y && y <= page.y + page.props.h)
    const nearest = hit ?? pages.reduce<ExamPdfPageTLShape | null>((best, page) => {
      if (!best) return page
      const pageDy = Math.min(Math.abs(y - page.y), Math.abs(y - (page.y + page.props.h)))
      const bestDy = Math.min(Math.abs(y - best.y), Math.abs(y - (best.y + best.props.h)))
      return pageDy < bestDy ? page : best
    }, null)
    return nearest ? { x: nearest.x, w: nearest.props.w } : { x: 0, w: PAGE_WIDTH }
  }
  private normalize(shape: ExamCanvasTLShape): ExamCanvasTLShape {
    const span = this.pageSpanForY(shape.y + shape.props.h / 2)
    return { ...shape, x: span.x, rotation: 0, props: { ...shape.props, w: span.w, h: 8, kind: 'boundary' } }
  }
  override getGeometry(shape: ExamCanvasTLShape) {
    const y = shape.props.h / 2
    return new Edge2d({ start: new Vec(0, y), end: new Vec(shape.props.w, y) })
  }
  override getHandles(shape: ExamCanvasTLShape): TLHandle[] {
    return [{ id: 'y', type: 'vertex', index: 'a1' as any, x: shape.props.w / 2, y: shape.props.h / 2, canSnap: false }]
  }
  override onBeforeCreate(next: ExamCanvasTLShape) { return this.normalize(next) }
  override onBeforeUpdate(_prev: ExamCanvasTLShape, next: ExamCanvasTLShape) { return this.normalize(next) }
  override onTranslate(initial: ExamCanvasTLShape, current: ExamCanvasTLShape): any {
    return this.normalize({ ...current, x: initial.x })
  }
  override onHandleDrag(shape: ExamCanvasTLShape, { handle }: { handle: TLHandle }): any {
    return this.normalize({ ...shape, y: shape.y + handle.y - shape.props.h / 2 })
  }
  override component(shape: ExamCanvasTLShape) { return renderShape(shape) }
  override indicator(shape: ExamCanvasTLShape) { return <path d={`M 0 ${toDomPrecision(shape.props.h / 2)} L ${toDomPrecision(shape.props.w)} ${toDomPrecision(shape.props.h / 2)}`} /> }
 }
 class PartUtil extends BaseBoxShapeUtil<ExamCanvasTLShape> { static override type = SHAPE_TYPES.part; static override props = sharedProps; override getDefaultProps(){ return defaultProps('part', 420, 170) }; override component(shape: ExamCanvasTLShape){ return renderShape(shape) }; override indicator(shape: ExamCanvasTLShape){ return ind(shape) } }
 function regionUtil(type: string, kind: ExamCanvasRegionKind, w = 360, h = 120) { return class extends BaseBoxShapeUtil<ExamCanvasTLShape> { static override type = type; static override props = sharedProps; override getDefaultProps(){ return defaultProps(kind, w, h) }; override component(shape: ExamCanvasTLShape){ return renderShape(shape) }; override indicator(shape: ExamCanvasTLShape){ return ind(shape) } } }
@@ -132,20 +132,10 @@ const ClassDetailPage: React.FC = () => {
        setLoading(true);
        setError(null);
        try {
-            const clsRes = await fetch(`${API_BASE}/database/timetable/classes/${classId}`, {
+            const clsRes = await fetch(`${API_BASE}/classes/${classId}`, {
                headers: { Authorization: `Bearer ${accessToken}` },
            }).then(r => r.json());
-            if (clsRes.id) {
+            if (clsRes.id) setCls(clsRes);
                setCls({
                    ...clsRes,
                    class_code: clsRes.class_code || clsRes.code,
                    year_group: clsRes.year_group || clsRes.school_year,
                    teachers: clsRes.teachers || [],
                    students: clsRes.students || [],
                    enrollment_requests: clsRes.enrollment_requests || [],
                    student_count: clsRes.student_count ?? clsRes.students?.length ?? 0,
                });
            }
            else setError(clsRes.detail || 'Class not found');
            const role = bootstrapData?.active_institute?.membership_role || '';
            setIsAdmin(role === 'school_admin' || role === 'department_head');
@@ -185,20 +175,20 @@ const ClassDetailPage: React.FC = () => {
    const handleAddStudent = async (studentId: string) => {
        setActionError(null);
-        const res = await apiPost(`/database/timetable/classes/${classId}/students`, { student_id: studentId });
+        const res = await apiPost(`/classes/${classId}/students`, { student_id: studentId });
        if (res.status === 'ok') load();
        else setActionError(res.detail || 'Failed to add student');
    };
    const handleRemoveStudent = async (studentId: string) => {
        setActionError(null);
-        await apiDelete(`/database/timetable/classes/${classId}/students/${studentId}`);
+        await apiDelete(`/classes/${classId}/students/${studentId}`);
        load();
    };
    const handleEnrollmentResponse = async (requestId: string, action: 'approve' | 'reject') => {
        setActionError(null);
-        const res = await apiPatch(`/database/timetable/classes/${classId}/enrollment-requests/${requestId}`, { action });
+        const res = await apiPatch(`/classes/${classId}/enrollment-requests/${requestId}`, { action });
        if (res.status === 'ok') load();
        else setActionError(res.detail || 'Action failed');
    };
@@ -11,27 +11,20 @@ import { API_BASE } from '../../config/apiConfig';
 import { logger } from '../../debugConfig';
 import { supabase } from '../../supabaseClient';
 import type {
  AutoMapJobStatus,
  AutoMapResponse,
  BankResponse,
  BatchQueueResponse,
  BatchResultsResponse,
  CreateBatchPayload,
  CreateCustomPaperPayload,
  CreateCustomPaperResult,
  CreateTemplatePayload,
  ExamBoundary,
  ExamQuestion,
  ExamResponseArea,
  ExamTemplate,
  ExamTemplateDetail,
  ExamTemplateLayout,
  MarkingBatch,
  MarkUpsertPayload,
  Neo4jSyncResult,
  PatchQuestionPayload,
  SpecPoint,
  StudentSubmission,
  TemplateReplacePayload,
  UpdateTemplateMetaPayload,
 } from '../../types/exam.types';
@@ -71,10 +64,6 @@ function questionPayload(q: ExamQuestion, idMap?: Map<string, string>) {
    spec_ref: q.spec_ref,
    bounds: q.bounds ?? null,
    page: q.page ?? null,
    source: q.source ?? 'manual',
    confirmed: q.confirmed ?? true,
    confidence: q.confidence ?? null,
    derivation: q.derivation ?? null,
  };
 }
@@ -90,8 +79,6 @@ function responseAreaPayload(r: ExamResponseArea, idMap?: Map<string, string>, d
    source: r.source,
    confirmed: r.confirmed,
    confidence: r.confidence,
    mark_subtype: r.mark_subtype ?? null,
    derivation: r.derivation ?? null,
  };
 }
@@ -105,26 +92,6 @@ function boundaryPayload(b: ExamBoundary, idMap?: Map<string, string>, duplicate
    bounds: b.bounds,
    source: b.source,
    confirmed: b.confirmed,
    confidence: b.confidence ?? null,
    derivation: b.derivation ?? null,
  };
 }
 function layoutPayload(layout: ExamTemplateLayout, duplicate = false) {
  return {
    id: duplicate ? newUuid() : layout.id,
    page_index: layout.page_index,
    role: layout.role ?? null,
    margin_left: layout.margin_left ?? null,
    margin_right: layout.margin_right ?? null,
    margin_top: layout.margin_top ?? null,
    margin_bottom: layout.margin_bottom ?? null,
    margins_enabled: layout.margins_enabled ?? true,
    source: layout.source ?? 'manual',
    confirmed: layout.confirmed ?? true,
    confidence: layout.confidence ?? null,
    derivation: layout.derivation ?? null,
    meta: layout.meta ?? {},
  };
 }
@@ -146,7 +113,6 @@ async function replaceTemplate(
      questions: detail.questions.map((q) => questionPayload(q, idMap)),
      response_areas: detail.response_areas.map((r) => responseAreaPayload(r, idMap, duplicateIds)),
      boundaries: detail.boundaries.map((b) => boundaryPayload(b, idMap, duplicateIds)),
      layout: (detail.layout ?? []).map((layout) => layoutPayload(layout, duplicateIds)),
    },
    { headers },
  );
@@ -169,18 +135,6 @@ export const examRepository = {
    return res.data;
  },
  async autoMapTemplate(templateId: string): Promise<AutoMapResponse> {
    const headers = await authHeaders();
    const res = await axios.post<AutoMapResponse>(`${EXAM_BASE}/templates/${templateId}/auto-map`, {}, { headers });
    return res.data;
  },
  async getAutoMapStatus(templateId: string, jobId: string): Promise<AutoMapJobStatus> {
    const headers = await authHeaders();
    const res = await axios.get<AutoMapJobStatus>(`${EXAM_BASE}/templates/${templateId}/auto-map/${jobId}/status`, { headers });
    return res.data;
  },
  async getTemplateSourcePdf(templateId: string): Promise<ArrayBuffer> {
    const headers = await authHeaders();
    const res = await axios.get<ArrayBuffer>(`${EXAM_BASE}/templates/${templateId}/source-pdf`, {
@@ -302,36 +256,6 @@ export const examRepository = {
    const res = await axios.put(`${EXAM_BASE}/marks/${markId}`, payload, { headers });
    return res.data;
  },
  async getBank(params: { specRef?: string; subject?: string } = {}): Promise<BankResponse> {
    const headers = await authHeaders();
    const res = await axios.get<BankResponse>(`${EXAM_BASE}/bank`, {
      headers,
      params: { spec_ref: params.specRef, subject: params.subject },
    });
    return res.data;
  },
  async createCustomPaper(payload: CreateCustomPaperPayload): Promise<CreateCustomPaperResult> {
    const headers = await authHeaders();
    const res = await axios.post<CreateCustomPaperResult>(`${EXAM_BASE}/custom-papers`, payload, { headers });
    return res.data;
  },
  async uploadScan(
    batchId: string,
    file: File,
    opts: { studentId?: string; matchingMethod?: 'manual' | 'ordered' } = {},
  ): Promise<StudentSubmission> {
    const headers = await authHeaders();
    const form = new FormData();
    form.append('file', file);
    form.append('matching_method', opts.matchingMethod ?? 'ordered');
    if (opts.studentId) form.append('student_id', opts.studentId);
    // Let axios set the multipart Content-Type + boundary (only Authorization is forwarded).
    const res = await axios.post<StudentSubmission>(`${EXAM_BASE}/batches/${batchId}/scans`, form, { headers });
    return res.data;
  },
 };
 export default examRepository;
@@ -1,17 +1,9 @@
 import { createClient, SupabaseClient } from '@supabase/supabase-js';
 import { logger } from './debugConfig';
-const rawSupabaseUrl = import.meta.env.VITE_SUPABASE_URL;
+const supabaseUrl = import.meta.env.VITE_SUPABASE_URL;
 const supabaseAnonKey = import.meta.env.VITE_SUPABASE_ANON_KEY;
 // Same-origin proxy support: a leading-slash value (e.g. "/__supabase") is
 // resolved against the current browser origin so supabase-js receives an
 // absolute URL while every request stays same-origin (no CORS) and routes
 // through the app host's /__supabase nginx proxy to the backend Supabase.
 const supabaseUrl = rawSupabaseUrl?.startsWith('/')
  ? `${window.location.origin}${rawSupabaseUrl}`
  : rawSupabaseUrl;
 if (!supabaseUrl || !supabaseAnonKey) {
  throw new Error('Missing Supabase configuration');
 }
@@ -75,8 +75,6 @@ export interface UpdateTemplateMetaPayload {
 }
 /** Canvas children (used from S4-9 onward; defined here so the seam is complete). */
 export type ExamTemplateSource = 'manual' | 'ai';
 export interface ExamQuestion {
  id: string;
  template_id: string;
@@ -91,10 +89,6 @@ export interface ExamQuestion {
  spec_ref: string | null;
  bounds?: Record<string, number> | null;
  page?: number | null;
  source: ExamTemplateSource;
  confirmed: boolean;
  confidence: number | null;
  derivation: string | null;
 }
 export type ExamResponseAreaKind =
@@ -105,8 +99,6 @@ export type ExamResponseAreaKind =
  | 'reference'
  | 'furniture';
 export type ExamMarkSubtype = 'part_marks' | 'question_total' | 'grader_box';
 export interface ExamResponseArea {
  id: string;
  question_id: string;
@@ -116,11 +108,9 @@ export interface ExamResponseArea {
  kind: ExamResponseAreaKind;
  response_form: string | null;
  context_type?: string | null;
-  source: ExamTemplateSource;
+  source: 'manual' | 'ai';
  confirmed: boolean;
  confidence: number | null;
  mark_subtype?: ExamMarkSubtype | null;
  derivation?: string | null;
 }
 export interface ExamBoundary {
@@ -131,36 +121,14 @@ export interface ExamBoundary {
  page_index: number;
  y: number;
  bounds: Record<string, number> | null;
-  source: ExamTemplateSource;
+  source: 'manual' | 'ai';
  confirmed: boolean;
  confidence: number | null;
  derivation: string | null;
 }
 export interface ExamTemplateLayout {
  id: string;
  template_id: string;
  page_index: number;
  role: string | null;
  margin_left: number | null;
  margin_right: number | null;
  margin_top: number | null;
  margin_bottom: number | null;
  margins_enabled: boolean;
  source: ExamTemplateSource;
  confirmed: boolean;
  confidence: number | null;
  derivation: string | null;
  meta: Record<string, unknown>;
  created_at?: string;
  updated_at?: string;
 }
 export interface ExamTemplateDetail extends ExamTemplate {
  questions: ExamQuestion[];
  response_areas: ExamResponseArea[];
  boundaries: ExamBoundary[];
  layout: ExamTemplateLayout[];
 }
@@ -184,10 +152,6 @@ export interface TemplateReplacePayload {
    spec_ref?: string | null;
    bounds?: Record<string, number> | null;
    page?: number | null;
    source?: ExamTemplateSource;
    confirmed?: boolean;
    confidence?: number | null;
    derivation?: string | null;
  }>;
  response_areas: Array<{
    id?: string;
@@ -200,8 +164,6 @@ export interface TemplateReplacePayload {
    source?: 'manual' | 'ai';
    confirmed?: boolean;
    confidence?: number | null;
    mark_subtype?: ExamMarkSubtype | null;
    derivation?: string | null;
  }>;
  boundaries: Array<{
    id?: string;
@@ -210,25 +172,8 @@ export interface TemplateReplacePayload {
    page_index: number;
    y: number;
    bounds?: Record<string, number> | null;
-    source?: ExamTemplateSource;
+    source?: 'manual' | 'ai';
    confirmed?: boolean;
    confidence?: number | null;
    derivation?: string | null;
  }>;
  layout?: Array<{
    id?: string;
    page_index: number;
    role?: string | null;
    margin_left?: number | null;
    margin_right?: number | null;
    margin_top?: number | null;
    margin_bottom?: number | null;
    margins_enabled?: boolean;
    source?: ExamTemplateSource;
    confirmed?: boolean;
    confidence?: number | null;
    derivation?: string | null;
    meta?: Record<string, unknown>;
  }>;
 }
@@ -257,23 +202,6 @@ export interface Neo4jSyncResult {
  projection?: Record<string, unknown>;
 }
 export interface AutoMapAcceptedResponse {
  status: 'accepted';
  job_id: string;
 }
 export interface AutoMapJobStatus {
  job_id: string;
  status: 'queued' | 'running' | 'completed' | 'failed' | string;
  template_id: string;
  updated_at?: number;
  counts?: Record<string, number>;
  error?: string;
  template?: ExamTemplateDetail;
 }
 export type AutoMapResponse = ExamTemplateDetail | AutoMapAcceptedResponse;
 export interface MarkingBatch {
  id: string;
  template_id: string;
@@ -338,36 +266,3 @@ export interface MarkUpsertPayload {
  comment?: string;
  confirmed?: boolean;
 }
 // ── Mode-3 question bank + custom-paper assembly ──────────────────────────────
 export interface BankQuestion {
  id: string;
  template_id: string;
  label: string | null;
  max_marks: number | null;
  answer_type: string | null;
  spec_ref: string | null;
  bounds: Record<string, number> | null;
  page: number | null;
  paper: { id: string | null; title: string | null; subject: string | null; exam_code: string | null };
 }
 export interface BankResponse {
  questions: BankQuestion[];
  n: number;
  facets: { spec_ref: Record<string, number>; subject: Record<string, number> };
 }
 export interface CreateCustomPaperPayload {
  title: string;
  subject?: string;
  question_ids: string[];
 }
 export interface CreateCustomPaperResult {
  id: string;
  title: string;
  subject: string | null;
  n_questions: number;
  n_response_areas: number;
 }
@@ -4,7 +4,7 @@ import { isUuid, pageForY, serializeCanvasShapes, shapesFromTemplate } from './m
 const template: ExamTemplateDetail = {
  id: 'tpl-1', title: 'Physics', subject: 'Physics', exam_id: null, exam_code: null, source_file_id: null, page_count: 1,
-  institute_id: 'inst', teacher_id: 'teacher', status: 'draft', created_at: 'now', updated_at: 'now', questions: [], response_areas: [], boundaries: [], layout: [],
+  institute_id: 'inst', teacher_id: 'teacher', status: 'draft', created_at: 'now', updated_at: 'now', questions: [], response_areas: [], boundaries: [],
 }
 describe('exam setup canvas serialization', () => {
@@ -43,7 +43,6 @@ describe('exam setup canvas serialization', () => {
    ], pages)
    expect(payload.questions.find((q) => !q.is_container)?.page).toBe(2)
    expect(payload.boundaries.every((b) => b.page_index === 1)).toBe(true)
    expect(payload.boundaries.every((b) => b.bounds?.x === 260 && b.bounds?.w === 780)).toBe(true)
    expect(payload.response_areas[0].page).toBe(2)
  })
@@ -51,69 +50,16 @@ describe('exam setup canvas serialization', () => {
    const shapes = shapesFromTemplate({
      ...template,
      questions: [
-        { id: 'q1', template_id: 'tpl-1', parent_id: null, label: 'Q1', order: 0, max_marks: 0, answer_type: null, mcq_options: null, mark_scheme: {}, is_container: true, spec_ref: null, source: 'manual', confirmed: true, confidence: null, derivation: null },
+        { id: 'q1', template_id: 'tpl-1', parent_id: null, label: 'Q1', order: 0, max_marks: 0, answer_type: null, mcq_options: null, mark_scheme: {}, is_container: true, spec_ref: null },
-        { id: 'p1', template_id: 'tpl-1', parent_id: 'q1', label: 'Q1(a)', order: 0, max_marks: 2, answer_type: 'written', mcq_options: null, mark_scheme: {}, is_container: false, spec_ref: null, bounds: { x: 1, y: 2, w: 3, h: 4 }, page: 1, source: 'manual', confirmed: true, confidence: null, derivation: null },
+        { id: 'p1', template_id: 'tpl-1', parent_id: 'q1', label: 'Q1(a)', order: 0, max_marks: 2, answer_type: 'written', mcq_options: null, mark_scheme: {}, is_container: false, spec_ref: null, bounds: { x: 1, y: 2, w: 3, h: 4 }, page: 1 },
      ],
      response_areas: [
-        { id: 'r1', question_id: 'p1', template_id: 'tpl-1', page: 1, bounds: { x: 10, y: 20, w: 30, h: 40 }, kind: 'response', response_form: 'lines', source: 'manual', confirmed: true, confidence: null, derivation: null },
+        { id: 'r1', question_id: 'p1', template_id: 'tpl-1', page: 1, bounds: { x: 10, y: 20, w: 30, h: 40 }, kind: 'response', response_form: 'lines', source: 'manual', confirmed: true, confidence: null },
-        { id: 'f1', question_id: 'p1', template_id: 'tpl-1', page: 1, bounds: { x: 11, y: 21, w: 31, h: 41 }, kind: 'furniture', response_form: null, source: 'manual', confirmed: true, confidence: null, derivation: null },
+        { id: 'f1', question_id: 'p1', template_id: 'tpl-1', page: 1, bounds: { x: 11, y: 21, w: 31, h: 41 }, kind: 'furniture', response_form: null, source: 'manual', confirmed: true, confidence: null },
      ],
-      boundaries: [{ id: 'b1', template_id: 'tpl-1', question_id: 'q1', label: 'Q1 start', page_index: 0, y: 100, bounds: { x: 0, y: 100, w: 700, h: 8 }, source: 'manual', confirmed: true, confidence: null, derivation: null }],
+      boundaries: [{ id: 'b1', template_id: 'tpl-1', question_id: 'q1', label: 'Q1 start', page_index: 0, y: 100, bounds: { x: 0, y: 100, w: 700, h: 8 }, source: 'manual', confirmed: true }],
    })
    expect(shapes.map((s) => s.kind).sort()).toEqual(['boundary', 'furniture', 'part', 'response'])
    expect(shapes.find((s) => s.kind === 'boundary')).toMatchObject({ id: 'b1', x: 0, y: 100, w: 780, h: 8 })
    expect(shapes.find((s) => s.kind === 'part')).toMatchObject({ id: 'p1', x: 1, y: 2, w: 3, h: 4 })
  })
  it('carries AI provenance into canvas models, flags cheap review issues, and preserves it on save', () => {
    const detail: ExamTemplateDetail = {
      ...template,
      questions: [
        { id: '11111111-1111-4111-8111-111111111111', template_id: 'tpl-1', parent_id: null, label: 'Q?', order: 0, max_marks: 0, answer_type: null, mcq_options: null, mark_scheme: {}, is_container: true, spec_ref: null, source: 'ai', confirmed: false, confidence: 0.62, derivation: 'g6' },
        { id: '22222222-2222-4222-8222-222222222222', template_id: 'tpl-1', parent_id: '11111111-1111-4111-8111-111111111111', label: 'Q?', order: 0, max_marks: 0, answer_type: 'written', mcq_options: null, mark_scheme: {}, is_container: false, spec_ref: null, bounds: { x: 100, y: 120, w: 200, h: 100 }, page: 1, source: 'ai', confirmed: false, confidence: 0.62, derivation: 'g6' },
        { id: '66666666-6666-4666-8666-666666666666', template_id: 'tpl-1', parent_id: '11111111-1111-4111-8111-111111111111', label: 'Q1(b)', order: 1, max_marks: 1, answer_type: 'written', mcq_options: null, mark_scheme: {}, is_container: false, spec_ref: null, bounds: { x: 150, y: 150, w: 200, h: 100 }, page: 1, source: 'ai', confirmed: false, confidence: 0.8, derivation: 'g6' },
      ],
      response_areas: [
        { id: '33333333-3333-4333-8333-333333333333', question_id: '22222222-2222-4222-8222-222222222222', template_id: 'tpl-1', page: 1, bounds: { x: 120, y: 140, w: 120, h: 40 }, kind: 'response', response_form: 'lines', source: 'ai', confirmed: false, confidence: 0.8, derivation: 'regions' },
      ],
      boundaries: [
        { id: '44444444-4444-4444-8444-444444444444', template_id: 'tpl-1', question_id: '11111111-1111-4111-8111-111111111111', label: 'Q? start', page_index: 0, y: 100, bounds: { x: 0, y: 100, w: 700, h: 8 }, source: 'ai', confirmed: false, confidence: 0.62, derivation: 'g6' },
        { id: '55555555-5555-4555-8555-555555555555', template_id: 'tpl-1', question_id: '11111111-1111-4111-8111-111111111111', label: 'Q? end', page_index: 0, y: 500, bounds: { x: 0, y: 500, w: 700, h: 8 }, source: 'ai', confirmed: false, confidence: 0.62, derivation: 'g6' },
      ],
    }
    const shapes = shapesFromTemplate(detail)
    const part = shapes.find((shape) => shape.kind === 'part')
    expect(part).toMatchObject({ source: 'ai', confirmed: false, confidence: 0.62, derivation: 'g6' })
    expect(part?.reviewFlags).toEqual(expect.arrayContaining(['unconfirmed AI', 'low confidence', 'uncertain question label', 'missing marks', 'overlapping shapes']))
    const payload = serializeCanvasShapes(template, shapes)
    expect(payload.questions.find((q) => q.id === '22222222-2222-4222-8222-222222222222')).toMatchObject({ source: 'ai', confirmed: false, confidence: 0.62, derivation: 'g6' })
    expect(payload.response_areas.find((r) => r.id === '33333333-3333-4333-8333-333333333333')).toMatchObject({ source: 'ai', confirmed: false, confidence: 0.8, derivation: 'regions' })
    expect(payload.boundaries.find((b) => b.id === '44444444-4444-4444-8444-444444444444')).toMatchObject({ source: 'ai', confirmed: false, confidence: 0.62, derivation: 'g6' })
  })
  it('never drops a response region that has no enclosing part — it falls back to a question', () => {
    const payload = serializeCanvasShapes(template, [
      { id: 'b-top', kind: 'boundary', x: 40, y: 100, w: 700, h: 8, label: 'Q1 start' },
      { id: 'b-bottom', kind: 'boundary', x: 40, y: 700, w: 700, h: 8, label: 'Q1 end' },
      { id: 'part-1', kind: 'part', x: 100, y: 180, w: 400, h: 120, label: 'Q1(a)', maxMarks: 3 },
      { id: 'resp-far', kind: 'response', x: 100, y: 520, w: 300, h: 90, responseForm: 'lines' }, // outside the part box
    ])
    const part = payload.questions.find((q) => !q.is_container)
    expect(payload.response_areas).toHaveLength(1)               // previously dropped (no containing part)
    expect(payload.response_areas[0].question_id).toBe(part?.id) // falls back to the part, not lost
  })
  it('respects a region persisted question over geometric nearest when no part contains it', () => {
    const A = '11111111-1111-4111-8111-111111111111'
    const B = '22222222-2222-4222-8222-222222222222'
    const R = '33333333-3333-4333-8333-333333333333'
    const payload = serializeCanvasShapes(template, [
      { id: 'pa', kind: 'part', x: 100, y: 120, w: 300, h: 80, label: 'A', questionId: A },
      { id: 'pb', kind: 'part', x: 100, y: 500, w: 300, h: 80, label: 'B', questionId: B },
      { id: R, kind: 'response', x: 120, y: 260, w: 200, h: 60, questionId: B }, // contained by neither; nearest is A
    ])
    expect(payload.response_areas.find((r) => r.id === R)?.question_id).toBe(B) // persisted B wins over nearest A
  })
 })
@@ -1,16 +1,17 @@
-import type { ExamTemplateDetail, ExamTemplateSource, TemplateReplacePayload } from '../../types/exam.types'
+import type { ExamTemplateDetail, TemplateReplacePayload } from '../../types/exam.types'
 export const PAGE_HEIGHT = 1100
 export const PAGE_WIDTH = 780
 export const PAGE_GAP = 0
 export const BOUNDARY_LINE_HEIGHT = 12
 export interface CanvasPageGeometry { pageNumber: number; x: number; y: number; w: number; h: number }
 export type ExamCanvasRegionKind = 'response' | 'context' | 'question_number' | 'mark_area' | 'reference' | 'furniture'
 export type ExamCanvasShapeKind = 'boundary' | 'part' | ExamCanvasRegionKind
-export interface CanvasBounds extends Record<string, number> { x: number; y: number; w: number; h: number }
+export interface CanvasBounds { x: number; y: number; w: number; h: number }
 export interface ExamCanvasShapeModel {
  /** Stable domain UUID persisted to Supabase. Do not reuse tldraw shape ids for new shapes. */
@@ -26,11 +27,6 @@ export interface ExamCanvasShapeModel {
  responseForm?: 'lines' | 'answer-box' | 'working' | 'diagram' | 'tick-boxes' | 'table' | 'blanks'
  contextType?: string
  questionId?: string | null
  source?: ExamTemplateSource
  confirmed?: boolean
  confidence?: number | null
  derivation?: string | null
  reviewFlags?: string[]
 }
 export function pageForY(y: number, pages?: CanvasPageGeometry[]): number {
@@ -70,35 +66,10 @@ export function newDomainId(): string {
  })
 }
-function bounds(shape: Pick<ExamCanvasShapeModel, 'x' | 'y' | 'w' | 'h'>): CanvasBounds & Record<string, number> {
+function bounds(shape: Pick<ExamCanvasShapeModel, 'x' | 'y' | 'w' | 'h'>): CanvasBounds {
  return { x: shape.x, y: shape.y, w: shape.w, h: shape.h }
 }
 function pageGeometry(pageNumber: number, pages?: CanvasPageGeometry[]): CanvasPageGeometry {
  return pages?.find((page) => page.pageNumber === pageNumber) ?? { pageNumber, x: 0, y: pageTop(pageNumber, pages), w: PAGE_WIDTH, h: PAGE_HEIGHT }
 }
 function boundaryBounds(shape: Pick<ExamCanvasShapeModel, 'y' | 'h'>, pages?: CanvasPageGeometry[]): CanvasBounds & Record<string, number> {
  const page = pageGeometry(pageForShape(shape, pages), pages)
  return { x: page.x, y: shape.y, w: page.w, h: 8 }
 }
 function persistedSource(shape: ExamCanvasShapeModel): ExamTemplateSource {
  return shape.source ?? 'manual'
 }
 function persistedConfirmed(shape: ExamCanvasShapeModel): boolean {
  return shape.confirmed ?? persistedSource(shape) !== 'ai'
 }
 function persistedConfidence(shape: ExamCanvasShapeModel): number | null {
  return typeof shape.confidence === 'number' ? shape.confidence : null
 }
 function persistedDerivation(shape: ExamCanvasShapeModel): string | null {
  return shape.derivation ?? null
 }
 function contains(outer: CanvasBounds, inner: CanvasBounds): boolean {
  const ox2 = outer.x + outer.w
  const oy2 = outer.y + outer.h
@@ -132,10 +103,10 @@ export function serializeCanvasShapes(template: ExamTemplateDetail, shapes: Exam
    const qNum = bands.length + 1
    const questionId = isUuid(top.questionId) ? top.questionId : isUuid(bottom.questionId) ? bottom.questionId : newDomainId()
    const label = top.label?.replace(/\s+(start|end)$/i, '') || bottom.label?.replace(/\s+(start|end)$/i, '') || `Q${qNum}`
-    questions.push({ id: questionId, label, order: qNum - 1, max_marks: 0, is_container: true, mark_scheme: {}, source: persistedSource(top), confirmed: persistedConfirmed(top), confidence: persistedConfidence(top), derivation: persistedDerivation(top) })
+    questions.push({ id: questionId, label, order: qNum - 1, max_marks: 0, is_container: true, mark_scheme: {} })
    bands.push({ questionId, top, bottom })
    for (const b of [top, bottom]) {
-      boundaries.push({ id: isUuid(b.id) ? b.id : newDomainId(), question_id: questionId, label: b === top ? `${label} start` : `${label} end`, page_index: pageForShape(b, pages) - 1, y: b.y, bounds: boundaryBounds(b, pages), source: persistedSource(b), confirmed: persistedConfirmed(b), confidence: persistedConfidence(b), derivation: persistedDerivation(b) })
+      boundaries.push({ id: isUuid(b.id) ? b.id : newDomainId(), question_id: questionId, label: b === top ? `${label} start` : `${label} end`, page_index: pageForShape(b, pages) - 1, y: b.y, bounds: bounds(b), source: 'manual', confirmed: true })
    }
  }
@@ -144,76 +115,37 @@ export function serializeCanvasShapes(template: ExamTemplateDetail, shapes: Exam
    const parentBand = bands.find((band) => bandContains(band.top, band.bottom, part))
    const qid = isUuid(part.questionId) ? part.questionId : isUuid(part.id) ? part.id : newDomainId()
    partQuestionIds.set(part.id, qid)
-    questions.push({ id: qid, parent_id: parentBand?.questionId ?? null, label: part.label || `Part ${index + 1}`, order: index, max_marks: Number(part.maxMarks ?? 0), answer_type: part.answerType ?? 'written', mcq_options: null, mark_scheme: {}, is_container: false, spec_ref: null, bounds: bounds(part), page: pageForShape(part, pages), source: persistedSource(part), confirmed: persistedConfirmed(part), confidence: persistedConfidence(part), derivation: persistedDerivation(part) })
+    questions.push({ id: qid, parent_id: parentBand?.questionId ?? null, label: part.label || `Part ${index + 1}`, order: index, max_marks: Number(part.maxMarks ?? 0), answer_type: part.answerType ?? 'written', mcq_options: null, mark_scheme: {}, is_container: false, spec_ref: null, bounds: bounds(part), page: pageForShape(part, pages) })
  })
  // Resolve each region's owner question. Order: current geometric containment (a user who drags a
  // region into a part re-attaches it) → the PERSISTED attachment if it still points at a saved
  // question (survives pixel-overflow drift and regions with no enclosing part) → nearest part on the
  // page → first part → first question of any kind. exam_response_areas.question_id is NOT NULL, so we
  // never silently drop a region while any question exists (only a template with zero questions can).
  const questionIds = new Set(questions.map((q) => q.id))
  const response_areas: TemplateReplacePayload['response_areas'] = []
  for (const region of regions) {
    const containingPart = parts.find((part) => contains(bounds(part), bounds(region)))
-    const persisted = isUuid(region.questionId) && questionIds.has(region.questionId) ? region.questionId : undefined
+    const fallbackPart = parts.find((part) => pageForShape(part, pages) === pageForShape(region, pages)) ?? parts[0]
-    const nearestPart = parts.find((part) => pageForShape(part, pages) === pageForShape(region, pages)) ?? parts[0]
+    const questionId = containingPart ? partQuestionIds.get(containingPart.id) : fallbackPart ? partQuestionIds.get(fallbackPart.id) : undefined
    const questionId =
      (containingPart && partQuestionIds.get(containingPart.id))
      || persisted
      || (nearestPart && partQuestionIds.get(nearestPart.id))
      || questions[0]?.id
    if (!questionId) continue
    const kind = region.kind as ExamCanvasRegionKind
-    response_areas.push({ id: isUuid(region.id) ? region.id : newDomainId(), question_id: questionId, page: pageForShape(region, pages), bounds: bounds(region), kind, response_form: kind === 'response' ? (region.responseForm ?? 'lines') : null, context_type: kind === 'context' ? (region.contextType ?? 'generic') : null, source: persistedSource(region), confirmed: persistedConfirmed(region), confidence: persistedConfidence(region), mark_subtype: null, derivation: persistedDerivation(region) })
+    response_areas.push({ id: isUuid(region.id) ? region.id : newDomainId(), question_id: questionId, page: pageForShape(region, pages), bounds: bounds(region), kind, response_form: kind === 'response' ? (region.responseForm ?? 'lines') : null, context_type: kind === 'context' ? (region.contextType ?? 'generic') : null, source: 'manual', confirmed: true, confidence: null })
  }
-  return { meta: { title: template.title, subject: template.subject ?? undefined, page_count: template.page_count ?? undefined, status: template.status }, questions, response_areas, boundaries, layout: template.layout ?? [] }
+  return { meta: { title: template.title, subject: template.subject ?? undefined, page_count: template.page_count ?? undefined, status: template.status }, questions, response_areas, boundaries }
 }
 export function shapesFromTemplate(detail: ExamTemplateDetail, pages?: CanvasPageGeometry[]): ExamCanvasShapeModel[] {
  const shapes: ExamCanvasShapeModel[] = []
  const questions = new Map(detail.questions.map((q) => [q.id, q]))
  for (const b of detail.boundaries ?? []) {
-    const page = pageGeometry((b.page_index ?? 0) + 1, pages)
+    const bb = b.bounds ?? { x: 48, y: b.y, w: PAGE_WIDTH - 96, h: 8 }
-    // Boundary rows are y-lines. The old bounds rect is vestigial: keep y/domain ids,
+    shapes.push({ id: b.id, kind: 'boundary', x: Number(bb.x ?? 48), y: Number(bb.y ?? b.y), w: Number(bb.w ?? PAGE_WIDTH - 96), h: Number(bb.h ?? 8), label: b.label ?? undefined, questionId: b.question_id })
    // but render and save a full rendered-page-width horizontal rule.
    shapes.push({ id: b.id, kind: 'boundary', x: page.x, y: Number(b.y), w: page.w, h: 8, label: b.label ?? undefined, questionId: b.question_id, source: b.source, confirmed: b.confirmed, confidence: b.confidence, derivation: b.derivation })
  }
  for (const q of detail.questions ?? []) {
    if (q.is_container || !q.bounds) continue
-    shapes.push({ id: q.id, kind: 'part', x: Number(q.bounds.x ?? 80), y: Number(q.bounds.y ?? 120), w: Number(q.bounds.w ?? 420), h: Number(q.bounds.h ?? 180), label: q.label, maxMarks: q.max_marks, answerType: (q.answer_type as ExamCanvasShapeModel['answerType']) ?? 'written', questionId: q.id, source: q.source, confirmed: q.confirmed, confidence: q.confidence, derivation: q.derivation })
+    shapes.push({ id: q.id, kind: 'part', x: Number(q.bounds.x ?? 80), y: Number(q.bounds.y ?? 120), w: Number(q.bounds.w ?? 420), h: Number(q.bounds.h ?? 180), label: q.label, maxMarks: q.max_marks, answerType: q.answer_type ?? 'written', questionId: q.id })
  }
  for (const r of detail.response_areas ?? []) {
    const bb = r.bounds ?? { x: 100, y: pageTop(r.page, pages) + 360, w: 360, h: 120 }
    const q = questions.get(r.question_id)
-    shapes.push({ id: r.id, kind: r.kind, x: Number(bb.x ?? 100), y: Number(bb.y ?? pageTop(r.page, pages) + 360), w: Number(bb.w ?? 360), h: Number(bb.h ?? 120), label: q ? `→ ${q.label}` : r.kind, responseForm: (r.response_form as ExamCanvasShapeModel['responseForm']) ?? undefined, contextType: r.context_type ?? undefined, questionId: r.question_id, source: r.source, confirmed: r.confirmed, confidence: r.confidence, derivation: r.derivation })
+    shapes.push({ id: r.id, kind: r.kind, x: Number(bb.x ?? 100), y: Number(bb.y ?? pageTop(r.page, pages) + 360), w: Number(bb.w ?? 360), h: Number(bb.h ?? 120), label: q ? `→ ${q.label}` : r.kind, responseForm: r.response_form ?? undefined, contextType: r.context_type ?? undefined, questionId: r.question_id })
  }
-  return addCheapReviewFlags(shapes, pages)
+  return shapes
 }
 function overlaps(a: ExamCanvasShapeModel, b: ExamCanvasShapeModel): boolean {
  const ax2 = a.x + a.w
  const ay2 = a.y + a.h
  const bx2 = b.x + b.w
  const by2 = b.y + b.h
  return a.x < bx2 && ax2 > b.x && a.y < by2 && ay2 > b.y
 }
 function looksUncertainLabel(label: string | undefined): boolean {
  return !label || /\b(unknown|uncertain|maybe|todo|tbd)\b|\?/.test(label.toLowerCase())
 }
 function addCheapReviewFlags(shapes: ExamCanvasShapeModel[], pages?: CanvasPageGeometry[]): ExamCanvasShapeModel[] {
  const markAreasByQuestion = new Set(shapes.filter((shape) => shape.kind === 'mark_area' && shape.questionId).map((shape) => shape.questionId as string))
  return shapes.map((shape, index) => {
    const flags: string[] = []
    if (shape.source === 'ai' && shape.confirmed === false) flags.push('unconfirmed AI')
    if (typeof shape.confidence === 'number' && shape.confidence < 0.7) flags.push('low confidence')
    if ((shape.kind === 'part' || shape.kind === 'question_number') && looksUncertainLabel(shape.label)) flags.push('uncertain question label')
    if (shape.kind === 'part' && (!shape.maxMarks || shape.maxMarks <= 0) && !markAreasByQuestion.has(shape.questionId ?? shape.id)) flags.push('missing marks')
    const samePageOverlap = shapes.some((other, otherIndex) => otherIndex !== index && shape.kind !== 'boundary' && other.kind !== 'boundary' && pageForShape(shape, pages) === pageForShape(other, pages) && overlaps(shape, other) && (shape.kind === other.kind || (!contains(bounds(shape), bounds(other)) && !contains(bounds(other), bounds(shape)))))
    if (samePageOverlap) flags.push('overlapping shapes')
    return flags.length ? { ...shape, reviewFlags: flags } : shape
  })
 }