feat(stats): shareable Top-Albums card export (#425)

* feat(stats): add shareable Top-Albums card export

Adds a shareable PNG export of the user's most-played albums,
available from the Statistics page under the "Most Played Albums"
section header.

Layout:
* 3 formats — Story (1080×1920, 9:16), Square (1080×1080), Twitter
  Card (1200×675, 16:9). Story and Square stack a centered URL footer;
  Twitter packs logo + label + URL into a single header row.
* 3 grid sizes — 3×3 (default), 4×4, 5×5. Modal fetches up to 25
  frequent albums on open so larger grids work even when the entry
  surface only loaded a handful.
* Cover tiles render the rank + play count in a thin black info strip
  at the bottom of the cover (rank left, "N Plays" right).
* Header label is hardcoded English ("Top Albums") so a shared image
  remains legible to followers who don't share the user's UI language.
  Caller can override via `opts.meta`.

Source path is local-only — `getAlbumList(type='frequent')` from
Subsonic. Last.fm is intentionally not used.

Implementation:
* `src/utils/exportAlbumCard.ts` — pure Canvas-API renderer. Reads
  theme accent / bg from the document's CSS variables so the export
  matches the active theme. Cover art is loaded through the existing
  `getCachedBlob` IndexedDB cache, so repeated exports are cheap.
  Wordmark is rendered from the `PsysonicLogo` React component via
  `renderToStaticMarkup`, with both gradient stops baked to a single
  accent color for crisp single-tone branding.
* `src/components/StatsExportModal.tsx` — UI: format + grid pickers,
  live downscaled preview, native save dialog via
  `@tauri-apps/plugin-dialog` + `plugin-fs`.
* `src/components/AlbumRow.tsx` — adds optional `headerExtra` slot so
  the share button sits next to the existing scroll-nav arrows.
* i18n keys added under `statistics.*` (`en`, `de`) — other locales
  fall back to English.

* docs(changelog): add Top-Albums card export for PR #425

src/pages/Statistics.tsx

@@ -1,4 +1,5 @@
 import React, { useEffect, useState } from 'react';
+import { Share2 } from 'lucide-react';
 import {
   fetchStatisticsFormatSample,
   fetchStatisticsLibraryAggregates,
@@ -9,6 +10,7 @@ import {
 } from '../api/subsonic';
 import { formatHumanHoursMinutes } from '../utils/formatHumanDuration';
 import AlbumRow from '../components/AlbumRow';
+import StatsExportModal from '../components/StatsExportModal';
 import { useTranslation } from 'react-i18next';
 import { useAuthStore } from '../store/authStore';
 import { useNavigate } from 'react-router-dom';
@@ -51,6 +53,8 @@ export default function Statistics() {
   const [formatData, setFormatData] = useState<{ format: string; count: number }[] | null>(null);
   const [formatSampleSize, setFormatSampleSize] = useState(0);
 
+  const [exportOpen, setExportOpen] = useState(false);
+
   const [lfmPeriod, setLfmPeriod] = useState<LastfmPeriod>('1month');
   const [lfmTopArtists, setLfmTopArtists] = useState<LastfmTopArtist[]>([]);
   const [lfmTopAlbums, setLfmTopAlbums] = useState<LastfmTopAlbum[]>([]);
@@ -270,6 +274,17 @@ export default function Statistics() {
             albums={frequent}
             onLoadMore={() => loadMore('frequent', frequent, setFrequent)}
             moreText={t('statistics.loadMore')}
+            headerExtra={frequent.length >= 9 ? (
+              <button
+                type="button"
+                className="nav-btn"
+                onClick={() => setExportOpen(true)}
+                data-tooltip={t('statistics.exportTitle')}
+                aria-label={t('statistics.exportTitle')}
+              >
+                <Share2 size={18} />
+              </button>
+            ) : undefined}
           />
 
           <AlbumRow
@@ -384,6 +399,11 @@ export default function Statistics() {
 
         </div>
       )}
+      <StatsExportModal
+        open={exportOpen}
+        albums={frequent}
+        onClose={() => setExportOpen(false)}
+      />
     </div>
   );
 }