Enhance lyrics display: add transition effects, manage opacity, and improve styling for empty state

src/assets/styles/player.css

@@ -239,11 +239,14 @@ body {
 }
 
 .lrc-text {
+  opacity: 1;
+  pointer-events: auto;
+  transition: opacity 0.3s ease;
   max-height: 125px;           /* limit block height */
   max-width: 100%;
   overflow-y: auto;            /* scroll if lyrics exceed height */
   margin-top: 1rem;
-  padding: 0 1rem;
+  padding: 0 1rem 1rem;
   text-align: center;
   font-family: "Mukta", sans-serif;
   font-size: 0.85rem;
@@ -256,6 +259,12 @@ body {
   box-sizing: border-box;
   scrollbar-width: thin;       /* Firefox thinner scrollbar */
   scrollbar-color: #999 transparent;
+  scroll-padding-bottom: 1rem;
+}
+
+.lrc-text.empty {
+  opacity: 0;          /* fully transparent */
+  pointer-events: none; /* disable interaction */
 }
 
 .lrc-text::-webkit-scrollbar {
@@ -296,3 +305,7 @@ body {
   color: #4fa2ff;
   text-decoration: dotted underline;
 }
+
+.lrc-line:last-child {
+  margin-bottom: 0.5rem; /* or 0.75rem */
+}