#musicPlayer {
    transform: translateY(150%);
    transition: all 0.8s cubic-bezier(0.22, 1, 0.36, 1);
    z-index: 100;
}

    #musicPlayer.active {
        transform: translateY(0);
    }
#p-progress {
    background: linear-gradient(to right, #BF953F, #FCF6BA);
    box-shadow: 0 0 15px rgba(252, 246, 186, 0.5);
    position: relative;
    transition: width 0.1s linear;
}

    /* Add a little "knob" or glow at the end of the progress bar */
    #p-progress::after {
        content: '';
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 8px;
        height: 8px;
        background: #FCF6BA;
        border-radius: 50%;
        box-shadow: 0 0 10px #FCF6BA;
    }

.media-card:hover .play-overlay {
    opacity: 1;
    transform: scale(1);
}

#heartIcon {
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

#likeBtn svg {
    transition: all 0.3s ease;
}

@@keyframes gold-pulse {
    0% {
        filter: drop-shadow(0 0 12px rgba(191, 149, 63, 0.7));
        transform: scale(1.1);
    }

    50% {
        filter: drop-shadow(0 0 20px rgba(252, 246, 186, 0.9));
        transform: scale(1.15);
    }

    100% {
        filter: drop-shadow(0 0 12px rgba(191, 149, 63, 0.7));
        transform: scale(1.1);
    }
}

.liked-glow {
    fill: #BF953F !important;
    stroke: #FCF6BA !important;
    animation: gold-pulse 2s infinite ease-in-out;
}