Make the management app responsive on mobile

Replace the mobile nav's horizontal scroll strip (which wrapped into
an unreadable jumble because daisyUI's .menu sets flex-wrap: wrap and
.menu-horizontal never resets it) with a hamburger button that opens
a proper left-side drawer, mirrored in controlpanel for the same bug.
Move the theme toggle, "Management", and "Django admin" controls into
that drawer below `lg`, leaving only the account icon in the navbar,
so the club name has room to render in full instead of truncating to
initials.

Add a reusable `.table-cards` CSS pattern (app.css) that turns a list
table into a stack of labelled cards below `md`, and apply it to every
list/detail table in the management app -- members, families, teams,
memberships, events, groups, locations, opponents, positions, referee
levels/list, roles, sponsors, news, parent claims, team roster/staff,
and the shared family-members table. Tables revert to normal desktop
layout at `md` and up.

Member list gets extra passes: search submits icon-only below `sm` so
it fits next to the input, the Members/Guardians/Both tabs go
full-width, and last/first name merge into one column. Action-button
rows across every page stack full-width on mobile instead of wrapping
mid-button (shared fix in base.html). Home dashboard's upcoming-events
and news mini-tables become simple lists instead of overflowing
tables. Also: brand truncates instead of overflowing on a long club
name, a stray invalid xmlns attribute removed, a wrapping UUID badge
hidden below `sm` on team detail.

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

management/templates/management/event_list.html

@@ -38,7 +38,7 @@
     <div class="card bg-base-100 shadow">
         <div class="card-body">
             <div class="overflow-x-auto">
-                <table class="table">
+                <table class="table table-cards">
                     <thead>
                         <tr>
                             <th>{% trans "Title" %}</th>
@@ -52,14 +52,14 @@
                     <tbody>
                         {% for event in events %}
                             <tr>
-                                <td class="flex flex-row items-center gap-2">
+                                <td class="flex flex-row items-center gap-2 font-semibold">
                                     <a class="link link-hover" href="{% url 'management:event_detail' event.pk %}">{{ event.title }}</a>
                                     {% if event.series_id %}<span class="tooltip" data-tip="{% trans 'Part of a series' %}">{% lucide "repeat" size=12 %}</span>{% endif %}
                                 </td>
-                                <td>{{ event.get_kind_display }}</td>
-                                <td>{{ event.start|date:"j M Y H:i" }}</td>
-                                <td>{% for team in event.teams.all %}{{ team.short_name }}{% if not forloop.last %}, {% endif %}{% empty %}—{% endfor %}</td>
-                                <td>{{ event.location.name|default:"—" }}</td>
+                                <td data-label="{% trans 'Kind' %}">{{ event.get_kind_display }}</td>
+                                <td data-label="{% trans 'When' %}">{{ event.start|date:"j M Y H:i" }}</td>
+                                <td data-label="{% trans 'Teams' %}">{% for team in event.teams.all %}{{ team.short_name }}{% if not forloop.last %}, {% endif %}{% empty %}—{% endfor %}</td>
+                                <td data-label="{% trans 'Location' %}">{{ event.location.name|default:"—" }}</td>
                                 <td class="text-right">
                                     {% if event.can_manage %}
                                         <div class="flex justify-end gap-1">