Style every MFA screen through the element system

The MFA pages (manage, TOTP activate/deactivate, recovery codes, security keys,
reauthenticate) are built almost entirely from allauth's `element` primitives, so
they are styled by overriding the elements rather than by rewriting eight page
templates. New allauth pages then inherit the look for free.

- field + img elements were missing entirely, so allauth fell back to bare HTML:
  the TOTP secret and recovery-code list rendered as unstyled inputs. The QR now
  sits on a white plate -- it is dark modules on a transparent ground, so on the
  dark theme it was dark-on-dark and phones could not scan it.
- button now honours the tags allauth sets. They were all flattened to
  btn-primary, which made "Deactivate" look exactly as safe as "View".
- the `code` field renders as a daisyUI otp wherever it appears, so the
  reauthenticate and activate pages get the same input as the login challenge.
  The boxes step aside past six characters: allauth accepts a TOTP code (6) or a
  recovery code (8) in that one field.

Fixes a crash: the security-key list does {% load humanize %}, which raised
TemplateSyntaxError because django.contrib.humanize was not installed. That page
500'd on every request; it is now installed and covered by a test.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

templates/allauth/elements/img.html

@@ -0,0 +1,10 @@
+{% load allauth %}
+
+{% comment %}
+    Only used for the TOTP QR code. The white plate is not decoration: the QR is dark
+    modules on a transparent ground, so on the dark theme it would be dark-on-dark and
+    phones could not scan it.
+{% endcomment %}
+<div class="my-4 flex justify-center">
+    <img class="rounded-box bg-white p-3" src="{{ attrs.src }}" {% if attrs.alt %}alt="{{ attrs.alt }}"{% endif %}>
+</div>