feat: auto-téléchargement par catégorie avec souscription persistante

- Bouton ⬇ sur chaque pill de catégorie pour activer/désactiver l'auto-DL
- Souscriptions sauvegardées en SQLite (table auto_dl_categories)
- Boucle background toutes les AUTO_DL_INTERVAL secondes (défaut 1h)
- Déduplication via already_enqueued() (évite re-queue si déjà queued/done)
- POST /api/auto-dl/check pour déclencher un check immédiat
- GET/POST/DELETE /api/auto-dl/{category} pour gérer les souscriptions

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

static/style.css

@@ -216,10 +216,13 @@ body {
   cursor: pointer;
   font-family: 'Inter', sans-serif;
   font-size: 13px;
-  padding: 6px 16px;
+  padding: 6px 6px 6px 14px;
   white-space: nowrap;
   transition: color var(--transition), border-color var(--transition), background var(--transition);
   flex-shrink: 0;
+  display: flex;
+  align-items: center;
+  gap: 4px;
 }
 
 .cat-pill:hover {
@@ -234,6 +237,37 @@ body {
   font-weight: 600;
 }
 
+.auto-icon {
+  font-size: 11px;
+  line-height: 1;
+  opacity: 0.3;
+  padding: 2px 5px;
+  border-radius: 10px;
+  transition: opacity var(--transition), background var(--transition), color var(--transition);
+  cursor: pointer;
+}
+
+.auto-icon:hover {
+  opacity: 0.8;
+  background: rgba(255,255,255,0.1);
+}
+
+.auto-icon.active {
+  opacity: 1;
+  color: var(--gold);
+}
+
+.cat-pill.active .auto-icon {
+  opacity: 0.5;
+  color: #000;
+}
+
+.cat-pill.active .auto-icon.active {
+  opacity: 1;
+  background: rgba(0,0,0,0.18);
+  color: #000;
+}
+
 /* ══ GRID ══════════════════════════════════════════════════════════════════ */
 .grid {
   display: grid;
@@ -252,7 +286,7 @@ body {
   border-radius: var(--radius);
   overflow: hidden;
   cursor: pointer;
-  transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
+  transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition), opacity var(--transition), filter var(--transition);
   position: relative;
 }
 
@@ -262,6 +296,19 @@ body {
   border-color: var(--gold-dim);
 }
 
+.card.downloaded {
+  opacity: 0.45;
+  filter: grayscale(0.6);
+}
+
+.card.downloaded:hover {
+  opacity: 0.65;
+  filter: grayscale(0.4);
+  transform: none;
+  box-shadow: none;
+  border-color: var(--border);
+}
+
 .card-thumb-wrap {
   position: relative;
   aspect-ratio: 16/9;