Let users upload a profile picture, cropped in the browser

Users now have an avatar. The account page takes an image, lets the user
drag and zoom it under a circular mask, and uploads exactly what the circle
shows as a 256x256 PNG. The picture replaces the initial-letter circle in
the sidebar, on the account page, on the on-call hero and week strip, on
the schedule's day chips and in the incident assign menu; someone without
one keeps the initial.

The picture lives in Postgres (user_avatars, bytea) rather than on a
volume: the chart runs two replicas on a read-only root filesystem, and
the k8up pg_dump backup then covers it without any chart or operator
change. The server does not trust the client's crop. It decodes the PNG or
JPEG, checks the declared size before decoding, centre-crops to a square,
scales to 256 and re-encodes, which drops EXIF and anything that is not
pixels. Standard library only; WebP is cropped by the browser and arrives
as PNG, a raw WebP sent to the API is refused.

GET/PUT/DELETE /api/users/{id}/avatar: anyone signed in may read, only the
owner or an administrator may change. /api/me and /api/users gain
avatar_version, absent when there is no picture, which is also the ?v= that
busts the cache after a change. Incident timeline entries and the queue are
text-only and are unchanged.

Claude-Session: https://claude.ai/code/session_016mBLURvJoMuUEr9cB2RpUN

internal/web/static/js/avatar.js

@@ -0,0 +1,35 @@
+// Profile pictures. A user either has one (the server says so with an
+// avatar_version, which is also the cache buster in the image URL) or shows
+// their initial in a coloured circle, as before.
+
+const versions = new Map(); // user id -> avatar_version
+
+// Learn from a user list (or a single user) which people have a picture.
+export function noteAvatars(list) {
+  for (const u of list || []) setAvatarVersion(u.id, u.avatar_version);
+}
+
+export function setAvatarVersion(userID, version) {
+  if (version == null) versions.delete(userID);
+  else versions.set(userID, version);
+}
+
+export function clearAvatars() {
+  versions.clear();
+}
+
+// withAvatar lays the person's picture over el, which keeps its initial
+// underneath: if the image fails to load, the initial is what shows.
+export function withAvatar(el, userID) {
+  const v = versions.get(userID);
+  if (v == null) return el;
+  el.classList.add('has-img');
+  const img = document.createElement('img');
+  img.className = 'avatar-img';
+  img.alt = '';
+  img.decoding = 'async';
+  img.src = `/api/users/${userID}/avatar?v=${v}`;
+  img.addEventListener('error', () => img.remove());
+  el.append(img);
+  return el;
+}