Show Color it optional step as complete if done, make levels accordion style collapsible

src/components/ColoringRunner.tsx

@@ -217,6 +217,10 @@ export default function ColoringRunner({ meta, loggedIn, username, alreadyEarned
   function toggleVisible(id: number) { const l = layersRef.current.find((x) => x.id === id); if (l) { l.visible = !l.visible; composite(); force((n) => n + 1); scheduleSave(); } }
 
   async function finish() {
+    // Record completion of the Color it! lesson so the Learn page can mark it Done.
+    if (loggedIn) {
+      try { await fetch("/api/progress", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ level: meta.level, sublevel: meta.sublevel, step: 1 }) }); } catch { /* */ }
+    }
     if (hasContent()) { const data = flatten(true); setFinalImage(data); if (loggedIn) await saveFinalDrawing(meta.level, meta.sublevel, "canvas", data); }
     setDone(true);
   }