Add birthday celebrations for students

Parents can set a birthday (MM-DD) per student in the Kids panel. During the student's birthday week (Mon–Sun), a festive overlay appears on login with balloons, birthday cake, confetti, and a personalized message — shown once per day via sessionStorage. Summer birthdays (June–Aug) show a note in admin suggesting the parent set an alternate school-week date to celebrate early.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

public/styles.css

@@ -1198,6 +1198,32 @@ body.bg-bubbles {
 .streak-label { color: var(--muted); font-size: 0.9rem; margin-bottom: 1.25rem; }
 .best-streak-label { font-size: 0.85rem; color: var(--gold); font-weight: 700; margin-bottom: 0.5rem; }
 
+/* ---------- birthday overlay ---------- */
+#birthday-overlay {
+  position: fixed; inset: 0; z-index: 210;
+  background: linear-gradient(135deg, rgba(255,182,50,0.92) 0%, rgba(255,80,120,0.92) 100%);
+  display: flex; align-items: center; justify-content: center;
+}
+#birthday-content {
+  background: var(--card); border-radius: var(--radius);
+  padding: 2.5rem 2rem; text-align: center;
+  max-width: 380px; width: 92%;
+  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.28);
+  animation: pop-in 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
+}
+.birthday-balloons {
+  font-size: 2.5rem; letter-spacing: .3rem;
+  animation: balloon-sway 1.8s ease-in-out infinite alternate;
+  display: block; margin-bottom: .25rem;
+}
+@keyframes balloon-sway {
+  from { transform: rotate(-6deg) translateY(0); }
+  to   { transform: rotate(6deg)  translateY(-8px); }
+}
+.birthday-cake { font-size: 5rem; display: block; margin: 0.25rem 0; animation: bounce 0.7s ease infinite alternate; }
+#birthday-content h2 { font-size: 2rem; margin: 0.5rem 0 0.5rem; }
+.birthday-message { color: var(--muted); font-size: 1.05rem; margin: 0 0 1.5rem; }
+
 /* ---------- streak pill on kid home ---------- */
 .streak-pill {
   display: inline-flex; align-items: center; gap: 0.3rem;