Upgrade heatmaps stile Hotjar: movimenti mouse e anteprima pagina live.

Traccia i movimenti aggregati, overlay a gradienti sull’iframe della pagina e toggle click/move in admin.

Co-authored-by: Cursor <cursoragent@cursor.com>

backend/public/admin.css

@@ -960,20 +960,54 @@ body.admin-body {
   transform: translateX(-1px);
 }
 
-.admin-heatmap-wrap {
-  overflow: auto;
-  max-height: 70vh;
+.admin-heatmap-stage {
+  position: relative;
+  overflow: hidden;
+  min-height: 70vh;
+  max-height: 85vh;
   border: 1px solid var(--card-border);
   border-radius: 10px;
-  background: #0d0d12;
+  background: #111;
 }
 
-.admin-heatmap {
-  display: block;
+.admin-heatmap-frame {
+  position: absolute;
+  inset: 0;
   width: 100%;
-  height: auto;
-  max-width: 800px;
-  margin: 0 auto;
+  height: 100%;
+  border: 0;
+  background: #fff;
+  pointer-events: none;
+}
+
+.admin-heatmap-fallback {
+  position: absolute;
+  inset: 0;
+  background:
+    radial-gradient(circle at 20% 20%, #1e293b 0%, transparent 45%),
+    radial-gradient(circle at 80% 10%, #0f172a 0%, transparent 40%),
+    #0d0d12;
+}
+
+.admin-heatmap-fallback-note {
+  position: absolute;
+  z-index: 2;
+  left: 1rem;
+  top: 1rem;
+  margin: 0;
+  max-width: 28rem;
+  padding: 0.5rem 0.75rem;
+  border-radius: 8px;
+  background: rgba(0, 0, 0, 0.55);
+}
+
+.admin-heatmap-overlay {
+  position: absolute;
+  inset: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 1;
+  pointer-events: none;
 }