diff --git a/src/components/watch/watch.component.html b/src/components/watch/watch.component.html
index a55c3a3..1a67404 100644
--- a/src/components/watch/watch.component.html
+++ b/src/components/watch/watch.component.html
@@ -5,11 +5,12 @@
       <div class="min-w-0">
         <!-- Lecteur : monté dès que l'URL d'embed est calculable (route),
              sans attendre /details, suggestions ou historique. -->
-        <section aria-label="Lecteur vidéo" class="relative overflow-hidden rounded-2xl bg-black shadow-2xl ring-1 ring-white/10">
+        <section aria-label="Lecteur vidéo" class="group relative overflow-hidden rounded-2xl bg-black shadow-2xl ring-1 ring-white/10">
           <button (click)="toggleCinema()" [attr.aria-pressed]="cinemaMode()"
                   [title]="cinemaMode() ? 'Quitter le mode cinéma (Échap)' : 'Mode cinéma : élargir la vidéo (T)'"
                   [attr.aria-label]="cinemaMode() ? 'Quitter le mode cinéma' : 'Activer le mode cinéma'"
-                  class="absolute right-3 top-12 z-10 inline-flex items-center gap-1.5 rounded-full px-3 py-1.5 text-xs font-semibold shadow-lg transition focus:outline-none focus-visible:ring-2 focus-visible:ring-red-400"
+                  class="absolute right-3 top-12 z-10 inline-flex items-center gap-1.5 rounded-full px-3 py-1.5 text-xs font-semibold shadow-lg transition-opacity focus-visible:opacity-100 focus:outline-none focus-visible:ring-2 focus-visible:ring-red-400"
+                  [class.opacity-0]="!cinemaMode()" [class.group-hover:opacity-100]="!cinemaMode()" [class.group-focus-within:opacity-100]="!cinemaMode()"
                   [class.bg-red-600]="cinemaMode()" [class.text-white]="cinemaMode()"
                   [class.bg-black/70]="!cinemaMode()" [class.text-slate-200]="!cinemaMode()" [class.hover:bg-black/90]="!cinemaMode()">
             <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">