scroll: native Lampa smooth scroll animation (CSS transition on scrollTop, .notransition for instant jumps)

plugin.js

@@ -70,6 +70,10 @@
         // styles (.card / .full-start-new / .full-descr / .full-start__button).
         var css =
             '.mymovies{padding:2.2em 3.4em;overflow-y:auto;height:100%;box-sizing:border-box}' +
+            // Native Lampa scroll animation: smooth transition on scrollTop.
+            // Class "notransition" disables it for instant jumps (mimics Lampa.Scroll).
+            '.mymovies{transition:scroll-top .25s ease-out;-webkit-transition:scroll-top .25s ease-out}' +
+            '.mymovies.notransition{transition:none !important;-webkit-transition:none !important}' +
             '.movies-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:1.4em}' +
             '.mymovies-detail{padding:2em 3em;box-sizing:border-box}' +
             '.mymovies-detail .full-start-new__img{opacity:1 !important}' +
@@ -103,6 +107,9 @@
             var cont = document.querySelector('.mymovies');
             var el = document.querySelector('.mymovies .card.selector.focus');
             if (cont && el) {
+                // Smooth scroll (native Lampa animation). Remove notransition so the
+                // CSS transition on scrollTop runs.
+                cont.classList.remove('notransition');
                 var delta = el.getBoundingClientRect().top - cont.getBoundingClientRect().top;
                 cont.scrollTop += delta - 100;
                 comp._selectedId = el.getAttribute('data-id');
@@ -188,6 +195,7 @@
                     Lampa.Controller.collectionFocus(target, wrap);
                     if (comp._scrollTop) {
                         var cont = wrap[0];
+                        cont.classList.remove('notransition');
                         requestAnimationFrame(function () { cont.scrollTop = comp._scrollTop; });
                     }
                 },