feat(mobile): offline downloads, persistent event queue and offline start (M5)

- Downloads queue (2 parallel, Wi-Fi only by default) stores files under
  the app's document directory and track metadata in SQLite; Collection
  gets a Downloads tab, album and player screens get download buttons.
- Player plays downloaded files and local covers; My Wave falls back to
  a shuffle of downloaded tracks when the server is unreachable.
- Playback events that fail on the network are kept in SQLite and sent
  when the connection returns.
- AuthSession can open offline with the cached user and fetches an
  access token before the first request once online.

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

apps/mobile/src/ui/kit.tsx

@@ -1,7 +1,7 @@
 import MaterialIcons from '@expo/vector-icons/MaterialIcons';
 import { ApiError, type Track } from '@pipu/core';
 import type { ComponentProps, ReactNode } from 'react';
-import { useState } from 'react';
+import { useState, useSyncExternalStore } from 'react';
 import { useTranslation } from 'react-i18next';
 import {
   ActivityIndicator,
@@ -18,6 +18,7 @@ import {
 import { SafeAreaView } from 'react-native-safe-area-context';
 
 import { useSessionCtx } from '../lib/session';
+import { downloads } from '../offline/downloads';
 import { absolute } from '../player/controller';
 import { colors, radius } from '../theme';
 
@@ -143,13 +144,16 @@ export function Cover({
   round?: boolean;
 }) {
   const { server } = useSessionCtx();
-  const uri = server ? absolute(server, album.cover_url) : undefined;
+  const remote = server ? absolute(server, album.cover_url) : undefined;
   const px = size * 2 <= 64 ? 64 : size * 2 <= 300 ? 300 : 1200;
+  // У скачанных альбомов обложка 300 px лежит на устройстве — работает и без сети.
+  const local = useSyncExternalStore(downloads.subscribe, () => (px <= 300 ? downloads.localAlbumCover(album.id) : undefined));
+  const uri = local ?? (remote ? `${remote}&size=${px}` : undefined);
   const bg = album.cover_colors?.[0] ?? colors.surface3;
   return (
     <View style={{ width: size, height: size, borderRadius: round ? size / 2 : 8, backgroundColor: bg, overflow: 'hidden', alignItems: 'center', justifyContent: 'center' }}>
       {uri ? (
-        <Image source={{ uri: `${uri}&size=${px}` }} style={{ width: size, height: size }} />
+        <Image source={{ uri }} style={{ width: size, height: size }} />
       ) : (
         <Icon name={round ? 'person' : 'album'} size={size * 0.45} color="rgba(255,255,255,0.8)" />
       )}
@@ -169,6 +173,7 @@ export function TrackRow({
   onLike,
   numbered,
   meta,
+  trailing,
 }: {
   track: Track;
   current?: boolean;
@@ -176,9 +181,11 @@ export function TrackRow({
   onLike?: () => void;
   numbered?: number;
   meta?: string;
+  trailing?: ReactNode;
 }) {
   const { t } = useTranslation();
   const liked = track.reaction === 'like';
+  const saved = useSyncExternalStore(downloads.subscribe, () => downloads.isDownloaded(track.id));
   return (
     <Pressable
       onPress={onPress}
@@ -211,6 +218,8 @@ export function TrackRow({
           <Icon name={liked ? 'favorite' : 'favorite-border'} size={20} color={liked ? colors.accent2 : colors.text3} />
         </Pressable>
       )}
+      {trailing}
+      {saved && !trailing && <Icon name="download-done" size={16} color={colors.accent2} />}
       <Text style={s.duration}>{formatDuration(track.duration_ms)}</Text>
     </Pressable>
   );