diff --git a/src/App.css b/src/App.css
index 92399a30..2100840d 100644
--- a/src/App.css
+++ b/src/App.css
@@ -6170,6 +6170,25 @@ body.has-player .chat-fab {
   pointer-events: none;
   z-index: var(--z-toast);
   box-shadow: var(--shadow-2);
+  /* The inline `transform` places it above the anchor, so the entrance rides
+     on the independent `translate`/`scale` properties, which compose with it.
+     A short delay keeps it from flashing while the pointer sweeps across. */
+  transform-origin: 50% 100%;
+  animation: tooltip-in 160ms cubic-bezier(0.2, 0.7, 0.3, 1) 120ms both;
+}
+
+@keyframes tooltip-in {
+  from { opacity: 0; translate: 0 4px; scale: 0.96; }
+  to   { opacity: 1; translate: 0 0; scale: 1; }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .tooltip {
+    animation-name: tooltip-fade;
+  }
+  @keyframes tooltip-fade {
+    from { opacity: 0; }
+  }
 }
 
 /* ── Search bar (in header center slot) ── */