make the catchup card collapsable

apps/web/src/components/features/catch-up-card.tsx

@@ -1,5 +1,6 @@
 "use client";
 
+import { useState } from "react";
 import { formatDisplayDate } from "@/lib/dates-client";
 
 type Gap = { date: string; reason: string };
@@ -16,11 +17,21 @@ const REASON_LABEL: Record<string, string> = {
 };
 
 export function CatchUpCard({ gaps, onSelectDate }: CatchUpCardProps) {
+  const [open, setOpen] = useState(false);
+
   if (gaps.length === 0) return null;
 
   return (
     <div className="retro-window mb-4">
-      <div className="retro-titlebar">Catch up gently</div>
+      <button
+        type="button"
+        className="retro-titlebar w-full text-left"
+        aria-expanded={open}
+        onClick={() => setOpen(!open)}
+      >
+        Catch up ({gaps.length}) {open ? "▼" : "▶"}
+      </button>
+      {open && (
         <div className="p-3 space-y-2">
           <p className="text-xs text-[var(--warm-grey)]">
             A few recent days could use a note — no pressure, just pick one if you like.
@@ -37,6 +48,7 @@ export function CatchUpCard({ gaps, onSelectDate }: CatchUpCardProps) {
             </button>
           ))}
         </div>
+      )}
     </div>
   );
 }