Build M3 Calendar for the mobile app

A bounded chronological agenda (this week / next week, no month paging --
the mobile screen doesn't need the desktop week/month grid
events.services.calendar was built for) scoped to the person switcher's
current selection, plus an "All members" toggle for the whole club's
schedule. Each row links into the still-placeholder-GET event-detail
screen that M2 builds out next.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01ECGMEwrc2k4D8VQuwjstj9

mobile/templates/mobile/_calendar_row.html

@@ -0,0 +1,26 @@
+{% load i18n %}
+{% comment %}
+    One M3 agenda row -- included from calendar.html once per bucket. Expects
+    ``row`` ({event, pill_class, pill_label}) in scope. A 4px club-red left
+    border marks games; other kinds get a 3px colour bar (info for training,
+    warn for everything else) next to the date, per the design doc's M3 row
+    description.
+{% endcomment %}
+<a class="flex items-center gap-3 bg-white p-3.5 {% if row.event.kind == "game" %}border-l-4 border-club{% endif %}" href="{% url "mobile:event_detail" row.event.pk %}">
+    <div class="w-9.5 shrink-0 text-center">
+        <div class="font-mono text-[10px] tracking-wide text-muted uppercase">{{ row.event.start|date:"D" }}</div>
+        <div class="font-display text-2xl leading-none font-extrabold text-ink">{{ row.event.start|date:"d" }}</div>
+    </div>
+    {% if row.event.kind != "game" %}
+        <div class="h-9.5 w-[3px] shrink-0 rounded-full {% if row.event.kind == "training" %}bg-info{% else %}bg-warn{% endif %}"></div>
+    {% endif %}
+    <div class="min-w-0 flex-1">
+        <div class="text-sm font-semibold text-ink">{{ row.event.title }}</div>
+        <div class="truncate text-xs text-muted">
+            {{ row.event.start|date:"H:i" }}
+            {% for team in row.event.teams.all %}&middot; {{ team.name }}{% endfor %}
+            {% if row.event.location %}&middot; {{ row.event.location.name }}{% endif %}
+        </div>
+    </div>
+    <span class="pill {{ row.pill_class }} shrink-0">{{ row.pill_label }}</span>
+</a>

mobile/templates/mobile/calendar.html

@@ -0,0 +1,57 @@
+{% extends "mobile/base.html" %}
+{% load i18n %}
+
+{% comment %}
+    M3 -- design_handoff_rosterchief_platform/README.md's M3 section: a
+    chronological agenda, grouped under "This week"/"Next week", scoped to
+    scope_person's own invites by default or, with the "All members" toggle
+    below, every club event. See CalendarView's own docstring for the
+    browsing-window judgment call (current + next calendar week, no further
+    paging).
+{% endcomment %}
+
+{% block content %}
+    <div class="flex gap-2">
+        <a class="flex h-9 flex-1 items-center justify-center rounded-full font-display text-xs font-extrabold tracking-wide uppercase {% if not scope_all %}bg-ink text-white{% else %}border border-line bg-white text-muted{% endif %}"
+           href="?{% if request.GET.as %}as={{ request.GET.as }}{% endif %}">
+            {% trans "My schedule" %}
+        </a>
+        <a class="flex h-9 flex-1 items-center justify-center rounded-full font-display text-xs font-extrabold tracking-wide uppercase {% if scope_all %}bg-ink text-white{% else %}border border-line bg-white text-muted{% endif %}"
+           href="?scope=all{% if request.GET.as %}&as={{ request.GET.as }}{% endif %}">
+            {% trans "All members" %}
+        </a>
+    </div>
+
+    {% if not scope_all and not scope_person %}
+        <div class="m-card p-6 text-center">
+            <p class="font-display text-lg font-extrabold text-ink uppercase">{% trans "No one to show yet" %}</p>
+            <p class="mt-1 text-sm text-muted">{% trans "Once you're linked to a member record, their schedule will show up here." %}</p>
+        </div>
+    {% elif not this_week and not next_week %}
+        <div class="m-card p-6 text-center">
+            <p class="text-sm text-muted">{% trans "Nothing scheduled in the next two weeks." %}</p>
+        </div>
+    {% else %}
+        {% if this_week %}
+            <div>
+                <div class="sticky top-0 z-10 bg-paper py-1 font-display text-xs font-extrabold tracking-wide text-muted uppercase">{% trans "This week" %}</div>
+                <div class="flex flex-col gap-px overflow-hidden rounded-box bg-line">
+                    {% for row in this_week %}
+                        {% include "mobile/_calendar_row.html" %}
+                    {% endfor %}
+                </div>
+            </div>
+        {% endif %}
+
+        {% if next_week %}
+            <div>
+                <div class="sticky top-0 z-10 bg-paper py-1 font-display text-xs font-extrabold tracking-wide text-muted uppercase">{% trans "Next week" %}</div>
+                <div class="flex flex-col gap-px overflow-hidden rounded-box bg-line">
+                    {% for row in next_week %}
+                        {% include "mobile/_calendar_row.html" %}
+                    {% endfor %}
+                </div>
+            </div>
+        {% endif %}
+    {% endif %}
+{% endblock content %}