From df34337b4ac5f7291fe329ea78b31a1d3055bf8c Mon Sep 17 00:00:00 2001
From: Martin Dvorak <dvorak@dvorakmortonxd.dev>
Date: Mon, 12 Oct 2026 21:15:56 +0000
Subject: [PATCH] Accessibility pass, report control for homework exercises,
 clearer rail actions
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- axe is clean across every screen in both themes, phone and desktop. Fixed:
  the hidden file inputs (aria-hidden + tabIndex -1 — they are opened by
  labelled buttons, so they should not be in the accessibility tree), the
  heading order (deck/homework/smart-review cards are h2 under the page h1;
  LearningSection takes a level so it stays h2 on the library and h3 inside
  the settings dialog) and landmarks around the study and review feeds.
- tests/contrast.mjs (new diagnostic): samples rendered pixels, because axe
  cannot judge text on blurred glass — it reports those nodes as incomplete.
  It skips disabled controls (1.4.3 exempts them) and content behind an open
  sheet. Result: no below-minimum text on any scanned screen.
- The report control exists in the homework guide too: under each "Try it
  yourself" exercise, labelled "Report exercise", without a skip (there is no
  queue to skip). lib/question-reports now takes deckId/deckTitle directly.
- The rail's two creation actions are buttons now (.nav-action) rather than
  quiet nav rows — once the library is full they were the only way to start
  something on desktop and read as just more navigation. "Make my homework"
  is "New homework" wherever it is an action (rail, empty state, share
  chooser, manifest shortcut); the page title and mode switch keep their
  wording.

Version 0.1.6 (three task bumps), SW -> freezmo-v52.
---
 app/deck/[id]/page.tsx                |   5 +-
 app/globals.css                       |  22 ++++
 app/manifest.ts                       |   2 +-
 components/DataSection.tsx            |   2 +
 components/DeckCard.tsx               |   4 +-
 components/HomeworkCard.tsx           |   4 +-
 components/LearningSection.tsx        |  13 +-
 components/LibraryScreen.tsx          |   2 +
 components/ReportQuestionButton.tsx   |  31 +++--
 components/ReviewClient.tsx           |  63 +++++-----
 components/SessionFeed.tsx            |   3 +-
 components/SettingsDialog.tsx         |   4 +-
 components/Sidebar.tsx                |  13 +-
 components/StudyFeed.tsx              |   3 +-
 components/UploadScreen.tsx           |   8 ++
 components/chat/Composer.tsx          |   2 +
 components/homework/HomeworkGuide.tsx |  13 +-
 components/homework/HomeworkInput.tsx |  12 ++
 lib/i18n-dict.ts                      |  10 +-
 lib/question-reports.ts               |  11 +-
 package.json                          |   2 +-
 public/sw.js                          |   2 +-
 tests/contrast.mjs                    | 169 ++++++++++++++++++++++++++
 tests/mobile-test.mjs                 |   4 +-
 tests/native-test.mjs                 |   2 +-
 tests/regression.mjs                  |   4 +-
 tests/wizard-test.mjs                 |   2 +-
 27 files changed, 337 insertions(+), 75 deletions(-)
 create mode 100644 tests/contrast.mjs

diff --git a/app/deck/[id]/page.tsx b/app/deck/[id]/page.tsx
index bb6eac8..5927fad 100644
--- a/app/deck/[id]/page.tsx
+++ b/app/deck/[id]/page.tsx
@@ -72,7 +72,10 @@ export default function DeckPage() {
 
   return (
     <ApiKeyGate>
-      <StudyFeed key={deck.id} deck={deck} />
+      {/* The feed is a fixed overlay, but its content still needs a landmark. */}
+      <main>
+        <StudyFeed key={deck.id} deck={deck} />
+      </main>
     </ApiKeyGate>
   );
 }
diff --git a/app/globals.css b/app/globals.css
index 4357eb8..c5d4249 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -647,6 +647,28 @@ body:has(.overlay-open) :is(.app-header, .segmented, .tabbar) {
   background: var(--hover);
   color: var(--text);
 }
+
+/* The rail's two creation actions ("New deck", "New homework") are buttons,
+   not nav rows: once the library is full the empty-state CTAs are long gone,
+   and on desktop the rail is the only place left to start something. */
+.nav-action {
+  display: flex;
+  align-items: center;
+  gap: 0.625rem;
+  width: 100%;
+  border-radius: 0.75rem;
+  padding: 0.5rem 0.625rem;
+  font-size: 13.5px;
+  font-weight: 600;
+  color: var(--text);
+  background: var(--surface-strong);
+  border: 1px solid var(--glass-border);
+  transition: background-color 160ms ease, border-color 160ms ease;
+}
+.nav-action:hover {
+  background: var(--hover);
+  border-color: var(--nav-active-border);
+}
 .nav-row[aria-current="page"],
 .nav-row[aria-pressed="true"] {
   background: var(--nav-active-bg);
diff --git a/app/manifest.ts b/app/manifest.ts
index 205c105..26d61e4 100644
--- a/app/manifest.ts
+++ b/app/manifest.ts
@@ -55,7 +55,7 @@ export default function manifest(): MetadataRoute.Manifest {
     ],
     shortcuts: [
       { name: "New deck", short_name: "New", url: "/create" },
-      { name: "Make my homework", short_name: "Homework", url: "/homework" },
+      { name: "New homework", short_name: "Homework", url: "/homework" },
       { name: "Library", short_name: "Library", url: "/" },
     ],
     /* Share text and links from other apps (GET). Files are POSTed to the
diff --git a/components/DataSection.tsx b/components/DataSection.tsx
index bc33178..1bf771d 100644
--- a/components/DataSection.tsx
+++ b/components/DataSection.tsx
@@ -78,6 +78,8 @@ export function DataSection() {
         <input
           ref={fileRef}
           type="file"
+        aria-hidden="true"
+        tabIndex={-1}
           accept="application/json,.json"
           className="hidden"
           onChange={(event) => void pick(event.target.files?.[0])}
diff --git a/components/DeckCard.tsx b/components/DeckCard.tsx
index e42fce4..3a8621a 100644
--- a/components/DeckCard.tsx
+++ b/components/DeckCard.tsx
@@ -182,12 +182,12 @@ export function DeckCard({
               </Button>
             </div>
           ) : (
-            <h3
+            <h2
               className="line-clamp-2 text-[15px] font-semibold leading-snug tracking-[-0.01em] text-[var(--text)]"
               title={deck.title}
             >
               {truncate(deck.title, 90)}
-            </h3>
+            </h2>
           )}
           {/* Phones: one compact meta line. */}
           <p className="mt-1 text-[12.5px] text-[var(--text-subtle)] sm:hidden">
diff --git a/components/HomeworkCard.tsx b/components/HomeworkCard.tsx
index 43019e7..c085181 100644
--- a/components/HomeworkCard.tsx
+++ b/components/HomeworkCard.tsx
@@ -62,12 +62,12 @@ export function HomeworkCard({
 
       <div className="flex items-start justify-between gap-3">
         <div className="min-w-0 flex-1">
-          <h3
+          <h2
             className="line-clamp-2 text-[15px] font-semibold leading-snug tracking-[-0.01em] text-[var(--text)]"
             title={record.title}
           >
             {truncate(record.title, 90)}
-          </h3>
+          </h2>
           <p className="mt-1 flex flex-wrap items-center gap-x-1.5 gap-y-0.5 text-[12.5px] text-[var(--text-subtle)]">
             <span className="inline-flex items-center gap-1">
               {record.mode === "make" ? <BoltIcon className="size-3.5" /> : <PlayIcon className="size-3.5" />}
diff --git a/components/LearningSection.tsx b/components/LearningSection.tsx
index ebe20ef..0043eaf 100644
--- a/components/LearningSection.tsx
+++ b/components/LearningSection.tsx
@@ -25,7 +25,12 @@ function urlBase64ToUint8Array(base64: string): Uint8Array {
  * the server has VAPID keys configured. Without them the reminder block is
  * hidden completely, exactly as if the feature did not exist.
  */
-export function LearningSection() {
+/**
+ * `level` keeps the heading order right in both places it is used: h2 on the
+ * library page (under its h1) and h3 inside the settings dialog (under its h2
+ * title).
+ */
+export function LearningSection({ level = 2 }: { level?: 2 | 3 } = {}) {
   const { t } = useI18n();
   const dailyGoal = useSyncExternalStore(
     settingsStore.subscribe,
@@ -154,7 +159,11 @@ export function LearningSection() {
 
   return (
     <section className="mb-4 space-y-3 rounded-2xl border border-[var(--hairline)] bg-[var(--surface-sunken)] p-3">
-      <h3 className="text-sm font-semibold text-frost-950 dark:text-frost-50">{t("settings.learning")}</h3>
+      {level === 3 ? (
+        <h3 className="text-sm font-semibold text-frost-950 dark:text-frost-50">{t("settings.learning")}</h3>
+      ) : (
+        <h2 className="text-sm font-semibold text-frost-950 dark:text-frost-50">{t("settings.learning")}</h2>
+      )}
 
       <div className="space-y-1.5">
         <p className="text-[12px] font-semibold text-[var(--text)]">{t("settings.dailyGoal")}</p>
diff --git a/components/LibraryScreen.tsx b/components/LibraryScreen.tsx
index ac7cc77..4e1bba6 100644
--- a/components/LibraryScreen.tsx
+++ b/components/LibraryScreen.tsx
@@ -220,6 +220,8 @@ export function LibraryScreen({ initialTab = "decks" }: { initialTab?: "decks" |
         <input
           ref={importRef}
           type="file"
+        aria-hidden="true"
+        tabIndex={-1}
           accept="application/json,.json"
           className="sr-only"
           onChange={(event) => {
diff --git a/components/ReportQuestionButton.tsx b/components/ReportQuestionButton.tsx
index b26686a..a2cef9c 100644
--- a/components/ReportQuestionButton.tsx
+++ b/components/ReportQuestionButton.tsx
@@ -3,22 +3,31 @@
 import { haptic } from "@/lib/haptics";
 import { useI18n } from "@/lib/i18n";
 import { reportQuestion, unreportQuestion } from "@/lib/question-reports";
-import type { Activity, Deck } from "@/lib/schemas";
+import type { Activity } from "@/lib/schemas";
 import { showToast } from "@/lib/toast";
 
 /**
  * The red "!" report control that sits under the card (bottom-right of the
- * exercise): records the question, sends the operator a copy and skips past
- * it. Undo lives in the toast. 44px, because it is a thumb target.
+ * exercise): records the question, sends the operator a copy and — in the
+ * study feeds — skips past it. Undo lives in the toast. 44px, because it is a
+ * thumb target.
+ *
+ * `deckId` is a deck id in the feeds and the homework record's id for a
+ * homework exercise; `onSkip` is omitted where there is no queue to skip.
  */
 export function ReportQuestionButton({
-  deck,
+  deckId,
+  deckTitle,
   activity,
   onSkip,
+  labelKey = "feed.report",
 }: {
-  deck: Deck;
+  deckId: string;
+  deckTitle?: string;
   activity: Activity;
-  onSkip: () => void;
+  onSkip?: () => void;
+  /** i18n key for the accessible name ("Report question" / "Report exercise"). */
+  labelKey?: string;
 }) {
   const { t } = useI18n();
 
@@ -27,16 +36,16 @@ export function ReportQuestionButton({
       type="button"
       onClick={() => {
         haptic("tap");
-        reportQuestion({ deck, activity });
+        reportQuestion({ deckId, deckTitle, activity });
         showToast({
           message: t("feed.reported"),
           actionLabel: t("toast.undo"),
-          onAction: () => unreportQuestion(deck.id, activity.id),
+          onAction: () => unreportQuestion(deckId, activity.id),
         });
-        onSkip();
+        onSkip?.();
       }}
-      aria-label={t("feed.report")}
-      title={t("feed.report")}
+      aria-label={t(labelKey)}
+      title={t(labelKey)}
       className="grid size-11 shrink-0 place-items-center rounded-xl border-2 border-rose-400/80 text-base font-black leading-none text-rose-600 transition hover:bg-rose-50 dark:border-rose-400/50 dark:text-rose-300 dark:hover:bg-rose-400/10"
     >
       <span aria-hidden>!</span>
diff --git a/components/ReviewClient.tsx b/components/ReviewClient.tsx
index aabd2e6..dfb4598 100644
--- a/components/ReviewClient.tsx
+++ b/components/ReviewClient.tsx
@@ -81,36 +81,39 @@ export function ReviewClient({ mistakes, deckId }: { mistakes: boolean; deckId?:
   const sessionItems: SessionItem[] = session.map(({ deck, activity }) => ({ deck, activity }));
 
   return (
-    <SessionFeed
-      title={title}
-      items={sessionItems}
-      testId="review-feed"
-      onExit={() => router.push("/")}
-      onAnswered={(item, correct) => {
-        haptic(correct ? "success" : "error");
-        recordAnswer({
-          deckId: item.deck.id,
-          deckTitle: item.deck.title,
-          activityId: item.activity.id,
-          type: item.activity.type,
-          topic: item.activity.topic,
-          correct,
-        });
-      }}
-      renderResults={({ correct, total, score }) => (
-        <div className="card space-y-4 p-5 text-center">
-          <p className="text-[11px] font-semibold uppercase tracking-wider text-[var(--text-subtle)]">{title}</p>
-          <p className="text-[42px] font-extrabold leading-none text-[var(--text)]">{score}%</p>
-          <p className="text-sm font-medium text-[var(--text-muted)]">
-            {t("results.gotOf", { correct, total, retry: "" })}
-          </p>
-          <div className="flex flex-wrap justify-center gap-2">
-            <Button size="lg" className="touch-target" onClick={() => router.push("/")}>
-              {t("review.done")}
-            </Button>
+    // The feed is a fixed overlay, but its content still needs a landmark.
+    <main>
+      <SessionFeed
+        title={title}
+        items={sessionItems}
+        testId="review-feed"
+        onExit={() => router.push("/")}
+        onAnswered={(item, correct) => {
+          haptic(correct ? "success" : "error");
+          recordAnswer({
+            deckId: item.deck.id,
+            deckTitle: item.deck.title,
+            activityId: item.activity.id,
+            type: item.activity.type,
+            topic: item.activity.topic,
+            correct,
+          });
+        }}
+        renderResults={({ correct, total, score }) => (
+          <div className="card space-y-4 p-5 text-center">
+            <p className="text-[11px] font-semibold uppercase tracking-wider text-[var(--text-subtle)]">{title}</p>
+            <p className="text-[42px] font-extrabold leading-none text-[var(--text)]">{score}%</p>
+            <p className="text-sm font-medium text-[var(--text-muted)]">
+              {t("results.gotOf", { correct, total, retry: "" })}
+            </p>
+            <div className="flex flex-wrap justify-center gap-2">
+              <Button size="lg" className="touch-target" onClick={() => router.push("/")}>
+                {t("review.done")}
+              </Button>
+            </div>
           </div>
-        </div>
-      )}
-    />
+        )}
+      />
+    </main>
   );
 }
diff --git a/components/SessionFeed.tsx b/components/SessionFeed.tsx
index 78b5cf8..40dc1f5 100644
--- a/components/SessionFeed.tsx
+++ b/components/SessionFeed.tsx
@@ -221,7 +221,8 @@ export function SessionFeed({
                   <AiDisclaimer />
                   <div className="flex justify-end">
                     <ReportQuestionButton
-                      deck={item.deck}
+                      deckId={item.deck.id}
+                      deckTitle={item.deck.title}
                       activity={item.activity}
                       onSkip={() => {
                         setSkipped((current) => [...current, item.activity.id]);
diff --git a/components/SettingsDialog.tsx b/components/SettingsDialog.tsx
index 3096328..8db0245 100644
--- a/components/SettingsDialog.tsx
+++ b/components/SettingsDialog.tsx
@@ -407,7 +407,7 @@ export function SettingsDialog({
                     </section>
 
                     {/* ------------------------------------------- data & sync */}
-                    <LearningSection />
+                    <LearningSection level={3} />
                     <DataSection />
                     <SyncSection />
 
@@ -746,7 +746,7 @@ export function SettingsDialog({
                 </section>
 
                 {/* ------------------------------------------- data & sync */}
-                <LearningSection />
+                <LearningSection level={3} />
                 <DataSection />
                 <SyncSection />
 
diff --git a/components/Sidebar.tsx b/components/Sidebar.tsx
index 0950082..bba0f29 100644
--- a/components/Sidebar.tsx
+++ b/components/Sidebar.tsx
@@ -137,23 +137,24 @@ function NavContent({ collapsed = false }: { collapsed?: boolean }) {
         {!collapsed ? <span className="flex-1 truncate text-left">{t("sidebar.collapse")}</span> : null}
       </button>
 
-      {/* new deck: a quiet row, not a competing primary button ---------- */}
+      {/* new deck: a button, not a nav row — it stays visible when the
+          library is already full (see .nav-action in globals.css) --------- */}
       <Link
         href="/create"
-        className={cn("nav-row mb-3", collapsed && "justify-center px-2")}
+        className={cn("nav-action mb-2.5", collapsed && "justify-center px-2")}
         title={t("common.newDeck")}
       >
-        <PlusIcon className="size-4 shrink-0" />
+        <PlusIcon className="size-4 shrink-0 text-accent-600 dark:text-accent-200" />
         {!collapsed ? <span className="flex-1 truncate text-left">{t("common.newDeck")}</span> : null}
       </Link>
 
-      {/* make my homework: same quiet row --------------------------------- */}
+      {/* new homework: the same button ------------------------------------ */}
       <Link
         href="/homework"
-        className={cn("nav-row mb-3", collapsed && "justify-center px-2")}
+        className={cn("nav-action mb-3", collapsed && "justify-center px-2")}
         title={t("homework.nav")}
       >
-        <SparklesIcon className="size-4 shrink-0" />
+        <SparklesIcon className="size-4 shrink-0 text-accent-600 dark:text-accent-200" />
         {!collapsed ? <span className="flex-1 truncate text-left">{t("homework.nav")}</span> : null}
       </Link>
 
diff --git a/components/StudyFeed.tsx b/components/StudyFeed.tsx
index b86aa45..b9d8a6d 100644
--- a/components/StudyFeed.tsx
+++ b/components/StudyFeed.tsx
@@ -332,7 +332,8 @@ export function StudyFeed({ deck }: { deck: Deck }) {
                   <AiDisclaimer />
                   <div className="flex justify-end">
                     <ReportQuestionButton
-                      deck={currentDeck}
+                      deckId={currentDeck.id}
+                      deckTitle={currentDeck.title}
                       activity={activity}
                       onSkip={() => {
                         setSkipped((current) => [...current, activity.id]);
diff --git a/components/UploadScreen.tsx b/components/UploadScreen.tsx
index 4558cae..7dca7bb 100644
--- a/components/UploadScreen.tsx
+++ b/components/UploadScreen.tsx
@@ -650,6 +650,8 @@ export function UploadScreen() {
       <input
         ref={fileInputRef}
         type="file"
+        aria-hidden="true"
+        tabIndex={-1}
         accept={`${ACCEPTED_TYPES.join(",")},${DOCUMENT_ACCEPT_ATTR}`}
         multiple
         className="sr-only"
@@ -663,6 +665,8 @@ export function UploadScreen() {
       <input
         ref={cameraInputRef}
         type="file"
+        aria-hidden="true"
+        tabIndex={-1}
         accept="image/*"
         capture="environment"
         className="sr-only"
@@ -1128,6 +1132,8 @@ export function UploadScreen() {
           <input
             ref={fileInputRef}
             type="file"
+        aria-hidden="true"
+        tabIndex={-1}
             accept={`${ACCEPTED_TYPES.join(",")},${DOCUMENT_ACCEPT_ATTR}`}
             multiple
             className="sr-only"
@@ -1139,6 +1145,8 @@ export function UploadScreen() {
           <input
             ref={cameraInputRef}
             type="file"
+        aria-hidden="true"
+        tabIndex={-1}
             accept="image/*"
             capture="environment"
             className="sr-only"
diff --git a/components/chat/Composer.tsx b/components/chat/Composer.tsx
index 1eba70d..f88c0d3 100644
--- a/components/chat/Composer.tsx
+++ b/components/chat/Composer.tsx
@@ -105,6 +105,8 @@ export function Composer({
         <input
           ref={fileInput}
           type="file"
+        aria-hidden="true"
+        tabIndex={-1}
           accept="image/*,application/pdf,.docx,.pptx,.odt,.txt,.md,.csv"
           className="sr-only"
           onChange={(event) => {
diff --git a/components/homework/HomeworkGuide.tsx b/components/homework/HomeworkGuide.tsx
index a7af976..0ad75ef 100644
--- a/components/homework/HomeworkGuide.tsx
+++ b/components/homework/HomeworkGuide.tsx
@@ -6,6 +6,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { ActivityRenderer } from "@/components/activities";
 import { PromptCard, QuestionText } from "@/components/activities/shared";
 import { AiDisclaimer } from "@/components/AiDisclaimer";
+import { ReportQuestionButton } from "@/components/ReportQuestionButton";
 import { XIcon } from "@/components/icons";
 import { Button, ProgressBar } from "@/components/ui";
 import { AskButton } from "@/components/chat/AskButton";
@@ -246,7 +247,7 @@ export function HomeworkGuide({
 
               {/* checkpoint or a plain next button */}
               {step.checkpoint ? (
-                <div className="space-y-2">
+                <div className="space-y-3">
                   <p className="text-[11px] font-semibold uppercase tracking-wider text-[var(--text-subtle)]">
                     {t("homework.guide.tryIt")}
                   </p>
@@ -263,6 +264,16 @@ export function HomeworkGuide({
                     }}
                     onNext={() => goTo(stepIndex + 1)}
                   />
+                  {/* Same report control as the study feeds, under the
+                      exercise (the homework record is the "deck" here). */}
+                  <div className="flex justify-end">
+                    <ReportQuestionButton
+                      deckId={record.id}
+                      deckTitle={record.title}
+                      activity={step.checkpoint}
+                      labelKey="homework.report"
+                    />
+                  </div>
                 </div>
               ) : (
                 <Button className="touch-target self-start" onClick={() => goTo(stepIndex + 1)}>
diff --git a/components/homework/HomeworkInput.tsx b/components/homework/HomeworkInput.tsx
index 6bc0f92..aae8b52 100644
--- a/components/homework/HomeworkInput.tsx
+++ b/components/homework/HomeworkInput.tsx
@@ -246,6 +246,8 @@ export function HomeworkInput({
       <input
         ref={solutionFileRef}
         type="file"
+        aria-hidden="true"
+        tabIndex={-1}
         accept={`${ACCEPTED_TYPES.join(",")},${DOCUMENT_ACCEPT_ATTR}`}
         multiple
         className="sr-only"
@@ -257,6 +259,8 @@ export function HomeworkInput({
       <input
         ref={solutionCameraRef}
         type="file"
+        aria-hidden="true"
+        tabIndex={-1}
         accept="image/*"
         capture="environment"
         className="sr-only"
@@ -378,6 +382,8 @@ export function HomeworkInput({
     <input
       ref={fileInputRef}
       type="file"
+        aria-hidden="true"
+        tabIndex={-1}
       accept={`${ACCEPTED_TYPES.join(",")},${DOCUMENT_ACCEPT_ATTR}`}
       multiple
       className="sr-only"
@@ -391,6 +397,8 @@ export function HomeworkInput({
     <input
       ref={cameraInputRef}
       type="file"
+        aria-hidden="true"
+        tabIndex={-1}
       accept="image/*"
       capture="environment"
       className="sr-only"
@@ -756,6 +764,8 @@ export function HomeworkInput({
         <input
           ref={fileInputRef}
           type="file"
+        aria-hidden="true"
+        tabIndex={-1}
           accept={`${ACCEPTED_TYPES.join(",")},${DOCUMENT_ACCEPT_ATTR}`}
           multiple
           className="sr-only"
@@ -767,6 +777,8 @@ export function HomeworkInput({
         <input
           ref={cameraInputRef}
           type="file"
+        aria-hidden="true"
+        tabIndex={-1}
           accept="image/*"
           capture="environment"
           className="sr-only"
diff --git a/lib/i18n-dict.ts b/lib/i18n-dict.ts
index 583f4f2..bfb7ca8 100644
--- a/lib/i18n-dict.ts
+++ b/lib/i18n-dict.ts
@@ -270,7 +270,7 @@ const en: Record<string, string> = {
   "health.createKey.end": "instead and set",
 
   /* make my homework ------------------------------------------------- */
-  "homework.nav": "Make my homework",
+  "homework.nav": "New homework",
   "wizard.mode.deck": "Study deck",
   "wizard.mode.homework": "Make my homework",
   "wizard.mode.aria": "Study deck or homework",
@@ -317,6 +317,7 @@ const en: Record<string, string> = {
   "homework.guide.stepOf": "Step {n} of {total}",
   "homework.guide.close": "Close the guide",
   "homework.guide.tryIt": "Try it yourself",
+  "homework.report": "Report exercise",
   "homework.guide.hint": "Show a hint",
   "homework.guide.hintMore": "Another hint",
   "homework.guide.hintAnswer": "Show the answer",
@@ -344,7 +345,7 @@ const en: Record<string, string> = {
 
   /* quick actions (library empty state + /create switcher) ----------- */
   "emptyStateCreateDeck": "Create study deck",
-  "emptyStateHomework": "Make my homework",
+  "emptyStateHomework": "New homework",
 
   /* library --------------------------------------------------------- */
   "library.title": "Your icebox",
@@ -1212,7 +1213,7 @@ const cs: Record<string, string> = {
   "health.createKey.end": "a nastavit",
 
   /* make my homework ------------------------------------------------- */
-  "homework.nav": "Udělej mi úkol",
+  "homework.nav": "Nový úkol",
   "wizard.mode.deck": "Studijní sada",
   "wizard.mode.homework": "Udělej mi úkol",
   "wizard.mode.aria": "Studijní sada nebo úkol",
@@ -1259,6 +1260,7 @@ const cs: Record<string, string> = {
   "homework.guide.stepOf": "Krok {n}/{total}",
   "homework.guide.close": "Zavřít návod",
   "homework.guide.tryIt": "Zkus si to",
+  "homework.report": "Nahlásit cvičení",
   "homework.guide.hint": "Ukaž nápovědu",
   "homework.guide.hintMore": "Další nápověda",
   "homework.guide.hintAnswer": "Ukaž odpověď",
@@ -1286,7 +1288,7 @@ const cs: Record<string, string> = {
 
   /* quick actions (library empty state + /create switcher) ----------- */
   "emptyStateCreateDeck": "Vytvořit studijní balíček",
-  "emptyStateHomework": "Udělej mi úkol",
+  "emptyStateHomework": "Nový úkol",
 
   /* library --------------------------------------------------------- */
   "library.title": "Tvoje mraznička",
diff --git a/lib/question-reports.ts b/lib/question-reports.ts
index c162fbb..2cd3164 100644
--- a/lib/question-reports.ts
+++ b/lib/question-reports.ts
@@ -132,10 +132,15 @@ export function withoutReported(deckId: string, activities: Activity[]): Activit
 }
 
 /** Adds (or refreshes) a report and sends a copy to the server, best effort. */
-export function reportQuestion(input: { deck: { id: string; title: string }; activity: Activity }): QuestionReport {
+export function reportQuestion(input: {
+  /** A deck id, or the homework record's id for a homework exercise. */
+  deckId: string;
+  deckTitle?: string;
+  activity: Activity;
+}): QuestionReport {
   const entry: QuestionReport = {
-    deckId: input.deck.id,
-    deckTitle: input.deck.title,
+    deckId: input.deckId,
+    deckTitle: input.deckTitle,
     activityId: input.activity.id,
     type: input.activity.type,
     question: activityText(input.activity).slice(0, 600),
diff --git a/package.json b/package.json
index 7c12ce6..08976dd 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "freezmo",
-  "version": "0.1.3",
+  "version": "0.1.6",
   "private": true,
   "license": "GPL-3.0-only",
   "scripts": {
diff --git a/public/sw.js b/public/sw.js
index bf3e14c..241e2c4 100644
--- a/public/sw.js
+++ b/public/sw.js
@@ -9,7 +9,7 @@
  *
  * Bumping CACHE_VERSION is how a new deploy invalidates old assets.
  */
-const CACHE_VERSION = "freezmo-v51";
+const CACHE_VERSION = "freezmo-v52";
 const SHELL_CACHE = `${CACHE_VERSION}-shell`;
 const ASSET_CACHE = `${CACHE_VERSION}-assets`;
 
diff --git a/tests/contrast.mjs b/tests/contrast.mjs
new file mode 100644
index 0000000..d7271ea
--- /dev/null
+++ b/tests/contrast.mjs
@@ -0,0 +1,169 @@
+/**
+ * Contrast diagnostic (NOT part of `npm run test:e2e`): axe cannot judge text
+ * on a blurred glass surface — it reports those nodes as "incomplete" — so
+ * this samples the **rendered pixels** instead.
+ *
+ * For every text element it takes a screenshot of that element's box, finds
+ * the dominant colour in it (the background: glyphs are the minority of the
+ * pixels) and compares it with the text colour from the computed style using
+ * the WCAG relative-luminance formula. Large text (>= 24px, or >= 18.66px
+ * bold) is held to 3:1, everything else to 4.5:1.
+ *
+ *   node tests/contrast.mjs            # every screen, both themes
+ *   node tests/contrast.mjs study      # filter by screen name
+ *
+ * It always exits 0 — the numbers are for tuning the palette.
+ */
+import { BASE, DECK, launchBrowser, makePage, seed } from "./lib.mjs";
+
+const filter = process.argv[2] ?? "";
+const browser = await launchBrowser();
+const failures = [];
+
+/** WCAG relative luminance of an [r, g, b] triple (0-255). */
+const LUMINANCE = `
+  const luminance = ([r, g, b]) => {
+    const channel = (value) => {
+      const v = value / 255;
+      return v <= 0.03928 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4);
+    };
+    return 0.2126 * channel(r) + 0.7152 * channel(g) + 0.0722 * channel(b);
+  };
+  const contrast = (a, b) => {
+    const [l1, l2] = [luminance(a), luminance(b)].sort((x, y) => y - x);
+    return (l1 + 0.05) / (l2 + 0.05);
+  };
+`;
+
+const screens = [
+  ["library", "/", null],
+  ["study", "/deck/seed_deck", null],
+  ["create", "/create", null],
+  ["homework", "/homework", null],
+  ["chat", "/chat", null],
+  ["stats", "/stats", null],
+  ["exam", "/exam", null],
+  ["settings", "/", "settings"],
+];
+
+for (const [label, path, mode] of screens) {
+  if (filter && !label.includes(filter)) continue;
+  for (const theme of ["dark", "light"]) {
+    const { context, page } = await makePage(browser, { width: 390, height: 844, deviceScaleFactor: 1 });
+    await seed(page, { decks: [DECK], theme });
+    await page.goto(`${BASE}${path}`, { waitUntil: "networkidle" });
+    await page.waitForTimeout(1000);
+    if (mode === "settings") {
+      await page.locator("nav.tabbar").getByRole("button").click();
+      await page.getByRole("dialog").waitFor({ timeout: 6000 });
+      await page.waitForTimeout(700);
+    }
+
+    // Every text-bearing element with a visible box, small enough to sample.
+    // Content behind an open sheet is dimmed on purpose and not readable, and
+    // disabled controls are exempt from 1.4.3 — both are skipped.
+    const targets = await page.evaluate(() => {
+      const out = [];
+      const dialog = document.querySelector('[role="dialog"]');
+      const root = dialog ?? document;
+      for (const element of root.querySelectorAll("p, span, li, h1, h2, h3, button, a, label, dt, dd")) {
+        if (element.closest("[disabled]") || element.closest('[aria-disabled="true"]')) continue;
+        const text = (element.textContent ?? "").trim();
+        if (text.length < 2) continue;
+        if (element.children.length > 0 && [...element.children].some((child) => (child.textContent ?? "").trim().length > 0)) continue;
+        const style = getComputedStyle(element);
+        if (style.visibility === "hidden" || style.display === "none" || Number(style.opacity) < 0.5) continue;
+        const box = element.getBoundingClientRect();
+        if (box.width < 8 || box.height < 8 || box.bottom < 0 || box.top > window.innerHeight) continue;
+        out.push({
+          id: out.length,
+          text: text.slice(0, 40),
+          color: style.color,
+          fontSize: Number.parseFloat(style.fontSize),
+          fontWeight: Number(style.fontWeight),
+          box: { x: box.x, y: box.y, width: box.width, height: box.height },
+        });
+      }
+      return out;
+    });
+
+    const screenshot = await page.screenshot({ type: "png", scale: "css" });
+    const dataUrl = `data:image/png;base64,${screenshot.toString("base64")}`;
+    const report = await page.evaluate(
+      async ({ targets, dataUrl, luminanceSource }) => {
+        const image = await new Promise((resolve, reject) => {
+          const img = new Image();
+          img.onload = () => resolve(img);
+          img.onerror = reject;
+          img.src = dataUrl;
+        });
+        const canvas = document.createElement("canvas");
+        canvas.width = image.width;
+        canvas.height = image.height;
+        const ctx = canvas.getContext("2d");
+        ctx.drawImage(image, 0, 0);
+        const full = ctx.getImageData(0, 0, canvas.width, canvas.height).data;
+        const { contrast } = new Function(`${luminanceSource} return { contrast };`)();
+        const parseColor = (value) => {
+          const match = /rgba?\(([^)]+)\)/.exec(value);
+          if (!match) return null;
+          const parts = match[1].split(",").map((part) => Number.parseFloat(part));
+          return [parts[0], parts[1], parts[2], parts[3] ?? 1];
+        };
+        const results = [];
+        for (const target of targets) {
+          const text = parseColor(target.color);
+          if (!text) continue;
+          // Sample a slightly larger box and ignore pixels close to the text
+          // colour: those are the glyphs themselves, not the background.
+          const x0 = Math.max(0, Math.floor(target.box.x) - 2);
+          const y0 = Math.max(0, Math.floor(target.box.y) - 2);
+          const x1 = Math.min(canvas.width, Math.ceil(target.box.x + target.box.width) + 2);
+          const y1 = Math.min(canvas.height, Math.ceil(target.box.y + target.box.height) + 2);
+          if (x1 - x0 < 4 || y1 - y0 < 4) continue;
+          const counts = new Map();
+          let sampled = 0;
+          for (let y = y0; y < y1; y += 1) {
+            for (let x = x0; x < x1; x += 1) {
+              const index = (y * canvas.width + x) * 4;
+              const pixel = [full[index], full[index + 1], full[index + 2]];
+              const distance = Math.max(
+                Math.abs(pixel[0] - text[0]),
+                Math.abs(pixel[1] - text[1]),
+                Math.abs(pixel[2] - text[2]),
+              );
+              if (distance <= 24) continue; // glyph pixel (or its antialiasing)
+              const key = `${pixel[0]},${pixel[1]},${pixel[2]}`;
+              counts.set(key, (counts.get(key) ?? 0) + 1);
+              sampled += 1;
+            }
+          }
+          if (sampled < 12) continue; // all glyphs: nothing to measure against
+          let best = null;
+          for (const [key, count] of counts) if (!best || count > best.count) best = { key, count };
+          const background = best.key.split(",").map(Number);
+          const ratio = contrast(text, background);
+          const large = target.fontSize >= 24 || (target.fontSize >= 18.66 && Number(target.fontWeight) >= 700);
+          const minimum = large ? 3 : 4.5;
+          if (ratio < minimum) {
+            results.push({ text: target.text, ratio: Number(ratio.toFixed(2)), minimum, color: target.color, background: best.key });
+          }
+        }
+        return results;
+      },
+      { targets, dataUrl, luminanceSource: LUMINANCE },
+    );
+
+    if (report.length > 0) {
+      console.log(`\n[${theme}] ${label} — ${report.length} below minimum`);
+      for (const row of report) {
+        console.log(`  ${row.ratio}:1 (needs ${row.minimum}) "${row.text}" — ${row.color} on rgb(${row.background})`);
+        failures.push({ theme, label, ...row });
+      }
+    }
+    await context.close();
+  }
+}
+
+console.log(`\ncontrast scan done — ${failures.length} below-minimum findings`);
+await browser.close();
diff --git a/tests/mobile-test.mjs b/tests/mobile-test.mjs
index b7b5dc6..d7cf214 100644
--- a/tests/mobile-test.mjs
+++ b/tests/mobile-test.mjs
@@ -74,7 +74,7 @@ const dragDown = async (page, locator, dy = 170, steps = 9) => {
   check("CTA >= 44px tall", ctaBox.height >= 43.5, String(Math.round(ctaBox.height)));
   await page.getByRole("link", { name: "Homework", exact: true }).click();
   await page.waitForTimeout(700);
-  const hwCta = page.getByRole("link", { name: "Make my homework", exact: true });
+  const hwCta = page.getByRole("link", { name: "New homework", exact: true });
   check("homework quick action", await hwCta.isVisible());
   await page.getByRole("link", { name: "Study Decks", exact: true }).click();
   await page.waitForTimeout(700);
@@ -174,7 +174,7 @@ for (const locale of ["en", "cs"]) {
   check("scrolled: drag snaps back, sheet stays", (await dialog.count()) === 1);
   await page.locator(".sheet-scroll").evaluate((el) => (el.scrollTop = 0));
   await page.waitForTimeout(250);
-  await dragDown(page, dialog.locator("h2"));
+  await dragDown(page, dialog.locator("#settings-title"));
   await page.waitForTimeout(800);
   check("handle+header swipe closes the sheet", (await dialog.count()) === 0);
 
diff --git a/tests/native-test.mjs b/tests/native-test.mjs
index 198212d..ffaadce 100644
--- a/tests/native-test.mjs
+++ b/tests/native-test.mjs
@@ -97,7 +97,7 @@ const browser = await launchBrowser();
   await page.goto(target, { waitUntil: "networkidle" });
   await page.waitForTimeout(600);
   check("share: chooser lists the file", await page.getByText("shared.txt").isVisible());
-  await page.getByRole("button", { name: "Make my homework" }).first().click();
+  await page.getByRole("button", { name: "New homework" }).first().click();
   await page.waitForTimeout(1200);
   check("share: homework got the file", await page.getByText("shared.txt").first().isVisible());
   await context.close();
diff --git a/tests/regression.mjs b/tests/regression.mjs
index 1d81d13..6c6911f 100644
--- a/tests/regression.mjs
+++ b/tests/regression.mjs
@@ -16,7 +16,7 @@ const browser = await launchBrowser();
 
   check("library title", await page.getByRole("heading", { name: "Your icebox" }).isVisible());
   const sidebar = page.getByRole("complementary", { name: "Sidebar" });
-  for (const row of ["New deck", "Make my homework", "All decks", "Unorganized", "Biology", "Progress", "Exam mode", "Settings"]) {
+  for (const row of ["New deck", "New homework", "All decks", "Unorganized", "Biology", "Progress", "Exam mode", "Settings"]) {
     check(`sidebar row: ${row}`, (await sidebar.getByText(row, { exact: true }).count()) >= 1);
   }
   check("desktop hides the tab bar", !(await page.locator("nav.tabbar").isVisible()));
@@ -74,7 +74,7 @@ const browser = await launchBrowser();
 
   await page.getByRole("link", { name: "Homework", exact: true }).click();
   await page.waitForTimeout(600);
-  check("homework tab empty state", await page.getByRole("link", { name: "Make my homework", exact: true }).isVisible());
+  check("homework tab empty state", await page.getByRole("link", { name: "New homework", exact: true }).isVisible());
   await context.close();
 }
 
diff --git a/tests/wizard-test.mjs b/tests/wizard-test.mjs
index 78b6dd6..78b7bfe 100644
--- a/tests/wizard-test.mjs
+++ b/tests/wizard-test.mjs
@@ -89,7 +89,7 @@ for (const viewport of [{ width: 390, height: 844 }, { width: 360, height: 740 }
 
   await page.getByRole("link", { name: "Homework", exact: true }).click();
   await page.waitForTimeout(600);
-  await page.getByRole("link", { name: "Make my homework", exact: true }).click();
+  await page.getByRole("link", { name: "New homework", exact: true }).click();
   await sampleBar(page, "homework empty state → homework");
   check("homework headline is the step name", await page.getByRole("heading", { name: "The assignment" }).isVisible());
   check("homework Next disabled with nothing", await page.getByRole("button", { name: "Next" }).isDisabled());