/* =================================================================
   music.css - 私人专属音乐播放器样式表 (Original Layout Restored + Floating Time)
   修复说明：
   1. 完美还原播放条布局：按钮居中，进度条在底部边缘。
   2. 时间显示：以悬浮方式显示在进度条上方左右两侧，不破坏原有结构。
   ================================================================= */

/* =================================================================
   1. 全局基础设置
   ================================================================= */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;700&display=swap');

@keyframes auroraMove {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

@keyframes spinCover {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@keyframes playingBreathe {
    from {
        box-shadow: 0 0 10px rgba(49, 194, 124, 0.1);
    }

    to {
        box-shadow: 0 0 25px rgba(49, 194, 124, 0.4);
    }
}

@keyframes imageFadeIn {
    from {
        opacity: 0;
        transform: scale(0.95);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

::selection {
    background: rgba(49, 194, 124, 0.4);
    color: #fff;
}

img {
    animation: imageFadeIn 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}