/* 基本样式重置 */
body, html {
    margin: 0;
    padding: 0;
    height: 100%; /* 确保 body 填充整个视口高度 */
    font-family: sans-serif; /* 更通用的字体 */
    background-color: #f0f0f0; /* 浅灰色背景 */
}

/* 主体内容居中 */
body {
    display: flex;
    justify-content: center; /* 水平居中 */
    align-items: center; /* 垂直居中 */
    min-height: 100vh;
}

/* 播放器容器样式 */
#player {
    width: 90%; /* 播放器宽度，在小屏幕上占据大部分宽度 */
    max-width: 1000px; /* 播放器最大宽度，在大屏幕上限制宽度 */
    margin: 20px; /* 留出一些外边距 */
    border-radius: 8px; /* 圆角 */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); /* 阴影效果 */
    background-color: #fff; /* 白色背景 */
    overflow: hidden; /* 确保圆角生效 */
}

/* 可以增加一些 APlayer 相关的样式微调，例如字体颜色、控件颜色等 */
/* 示例： */
.aplayer-title {
    color: #333;
}

.aplayer-author {
    color: #777;
}

.aplayer-bar-wrap {
    height: 6px;
}
.aplayer-bar-inner {
    background: #2980b9; /* 进度条颜色 */
}

.aplayer-volume-bar-inner {
    background: #2980b9; /* 音量条颜色 */
}