feat: photo/video capture-date pipeline + premium UI/UX overhaul

Backend — Photos timeline now groups by real capture date instead of upload time. New MediaMetadataService (FileLifecycleHook) extracts EXIF DateTimeOriginal from images and container creation_time from videos (mov/mp4/mkv) via nom-exif, timezone-correct (OffsetTimeOriginal), persisting captured_at so the existing media_sort_date trigger takes over. Adds POST /admin/photos/metadata/reextract to backfill existing media. Falls back to upload date when no embedded date exists.

Frontend — premium grid cards: combined metadata line (relative date · size, owner avatar when shared), custom selection checkbox with a clear checked state, uniform full-width 4:3 thumbnail tiles independent of filename length, centered file-type icons, and a hit-test fix so checkbox/star/kebab clicks reach the controls (the decorative thumbnail no longer captures pointer events). Notification messages internationalised across all 16 locales. Broader polish: design tokens, a11y/focus-visible states, brand + PWA assets.

Chore — bump semver-compatible dependencies (cargo upgrade); add nom-exif 3.6.1.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

static/js/app/navigation.js

@@ -73,16 +73,25 @@ function initSidebarToggle() {
 
     if (!sidebarToggle || !sidebar || !sidebarOverlay) return;
 
+    /** @type {HTMLElement | null} */
+    let drawerPrevFocus = null;
+
     function openSidebar() {
+        drawerPrevFocus = /** @type {HTMLElement | null} */ (document.activeElement);
         sidebar?.classList.add('open');
         sidebarOverlay?.classList.add('active');
         document.body.style.overflow = 'hidden';
+        sidebarToggle?.setAttribute('aria-expanded', 'true');
+        /** @type {HTMLElement | null} */ (sidebar?.querySelector('.nav-item'))?.focus();
     }
 
     function closeSidebar() {
         sidebar?.classList.remove('open');
         sidebarOverlay?.classList.remove('active');
         document.body.style.overflow = '';
+        sidebarToggle?.setAttribute('aria-expanded', 'false');
+        drawerPrevFocus?.focus?.();
+        drawerPrevFocus = null;
     }
 
     function toggleSidebar() {
@@ -99,6 +108,24 @@ function initSidebarToggle() {
     // Close sidebar when clicking overlay
     sidebarOverlay.addEventListener('click', closeSidebar);
 
+    // Trap Tab focus inside the open drawer (mobile).
+    sidebar.addEventListener('keydown', (e) => {
+        if (e.key !== 'Tab' || !sidebar.classList.contains('open')) return;
+        const f = /** @type {NodeListOf<HTMLElement>} */ (
+            sidebar.querySelectorAll('a[href], button:not([disabled]), [tabindex]:not([tabindex="-1"])')
+        );
+        if (!f.length) return;
+        const first = f[0];
+        const last = f[f.length - 1];
+        if (e.shiftKey && document.activeElement === first) {
+            e.preventDefault();
+            last.focus();
+        } else if (!e.shiftKey && document.activeElement === last) {
+            e.preventDefault();
+            first.focus();
+        }
+    });
+
     // Close sidebar on escape key
     document.addEventListener('keydown', (e) => {
         if (e.key === 'Escape' && sidebar.classList.contains('open')) {
@@ -155,7 +182,13 @@ function setCurrentSection(section) {
     // Update nav item active classes by finding matching item from DOM
     appElements.navItems?.forEach((item) => {
         const itemSection = getSectionFromNavItem(item);
-        item.classList.toggle('active', itemSection === section);
+        const isActive = itemSection === section;
+        item.classList.toggle('active', isActive);
+        if (isActive) {
+            item.setAttribute('aria-current', 'page');
+        } else {
+            item.removeAttribute('aria-current');
+        }
     });
 
     // Update page title