Fix lightbox alt text overlay

[cbl]

Long alt text covered the image in the media lightbox on mobile, making the image barely visible. Replaced the always-visible overlay with an ALT badge that opens a dialog.

Fixed

• MediaLightbox.vue — alt text was rendered as a persistent black overlay pinned to the bottom of the image. On mobile with long descriptions it dominated the viewport and obscured the content the user opened the lightbox to see.

Changed

• MediaLightbox.vue
  • Removed the bottom-16 full-width alt-text overlay.
  • Added a compact ALT pill badge at bottom-4 left-4 — matches the Twitter/X and Bluesky pattern. Signals that a description exists and keeps the image unobstructed.
  • Badge opens the shared Dialog with title "Image description" and the full text, rendered with whitespace-pre-wrap, break-words, max-h-[80vh] and scrollable body so long descriptions don't clip.
  • Added showAltText state; resets on image navigation and on lightbox close.
  • Escape / arrow key handlers are guarded while the dialog is open so the dialog closes first instead of both layers reacting.

Works on both platforms

• Badge positioned clear of the centered zoom controls at any viewport width.
• Dialog uses DialogPortal at z-[200], stacking above the lightbox at z-[100].
• size="md" (480px max) shrinks to viewport width on narrow phones.
• Touch events (pinch, drag) on the image don't leak into the dialog because the portal mounts outside the image container.