Add bulk remove all 10/10 ratings

Bouton dans le header (visible uniquement en filtre 10/10) qui supprime
toutes les notes 10/10 en une fois via l'API Trakt bulk.

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

static/app.js

@@ -63,6 +63,7 @@ async function init() {
     document.getElementById('filter-select').addEventListener('change', e => {
       currentFilter = e.target.value;
       currentPage = 1;
+      document.getElementById('remove-all-10-btn').classList.toggle('hidden', currentFilter !== '10');
       loadMovies();
     });
     document.getElementById('sort-select').addEventListener('change', e => {
@@ -219,6 +220,28 @@ function buildRow(movie) {
   return row;
 }
 
+/* ── Remove all 10/10 ──────────────────────────────────── */
+async function removeAll10() {
+  const btn = document.getElementById('remove-all-10-btn');
+  const total = document.getElementById('count-badge').textContent;
+  if (!confirm(`Supprimer les notes de ${total} films notés 10/10 ?`)) return;
+
+  btn.disabled = true;
+  btn.textContent = 'Suppression…';
+  try {
+    const r = await fetch('/api/rates/all10', { method: 'DELETE' });
+    if (!r.ok) throw new Error();
+    const { deleted } = await r.json();
+    showToast(`${deleted} notes 10/10 supprimées`);
+    loadMovies();
+  } catch {
+    showToast('Erreur lors de la suppression', true);
+  } finally {
+    btn.disabled = false;
+    btn.textContent = 'Supprimer tous les 10/10';
+  }
+}
+
 /* ── Remove rating ──────────────────────────────────────── */
 async function removeRating(movie, row) {
   row.style.pointerEvents = 'none';

static/index.html

@@ -50,6 +50,7 @@
             <option value="year">Année</option>
           </select>
         </div>
+        <button id="remove-all-10-btn" class="btn-danger hidden" onclick="removeAll10()">Supprimer tous les 10/10</button>
         <button id="skipped-toggle" class="btn-ghost" onclick="toggleSkipped()">Voir les passés (<span id="skipped-count">0</span>)</button>
         <a href="/auth/logout" class="btn-ghost">Déconnexion</a>
       </div>

static/style.css

@@ -163,6 +163,20 @@ select:hover, select:focus { border-color: var(--accent); }
 }
 .btn-ghost:hover { color: #f43f5e; border-color: rgba(244,63,94,.4); }
 
+.btn-danger {
+  color: #f87191;
+  font-size: .78rem;
+  font-family: inherit;
+  padding: .3rem .65rem;
+  border: 1px solid rgba(244,63,94,.35);
+  border-radius: 7px;
+  background: rgba(244,63,94,.08);
+  cursor: pointer;
+  transition: background .15s, border-color .15s;
+}
+.btn-danger:hover { background: rgba(244,63,94,.15); border-color: rgba(244,63,94,.6); }
+.btn-danger:disabled { opacity: .5; cursor: not-allowed; }
+
 /* ── Main ─────────────────────────────────────────────── */
 main {
   max-width: 1420px;