body{background: #fff;}
.layui-container{width:100%;max-width:1024px}
.header{padding-top: 2px;height: 65px;}
.header .logo a{color:#222;font-size:22px;line-height:55px;}
.header .menu {padding:5px 5px 0 0}
.header .menu span{display:none;text-align:right}
.header .menu span i{font-size:18px;line-height:35px;color:#DDD;cursor:pointer}
.nav{background-color:#222;}
.nav .layui-nav{background-color:#222;padding:0}
.nav .layui-nav li{line-height:40px}
.nav .layui-nav li.active { background-color:#666; }
.nav .layui-nav a{color:#fff;font-size:14px;}
.breadcrumb{margin-top: 20px;margin-bottom: 10px; padding: 5px;visibility: visible}
footer div{ text-align: center; padding: 5px; font-size: 12px; }
footer{ width: 100%; text-align:center; color: #DDD; background-color: #222; padding: 30px 0;  display: block; margin: 100px 0 0;}
.album-detail { display: flex; gap: 40px; margin:20px auto; }
.album-cover { flex: 0 0 300px; display: flex; justify-content: center; }
.cover-image { width: 300px; height: 300px; background-color: #e0e0e0; display: flex; align-items: center; justify-content: center; font-size: 24px; color: #666; border-radius: 4px; object-fit: cover; /* 确保图片按比例填充容器 */ }
.album-info { flex: 1; }
.album-title { font-size: 28px; font-weight: 600; margin-bottom: 25px; color: #222; }
.info-item { margin-bottom: 15px; display: flex; }
.info-label { width: 80px; font-weight: 500; color: #555; }
.info-content { flex: 1; color: #333; }
.album-description { margin-top: 25px; line-height: 1.8; }
.description-title { font-weight: 500; margin-bottom: 10px; color: #555; }
.description-content { color: #444; padding-right: 20px; }
.vplay { border-bottom: 1px solid #ccc; }
.vlist { }
.vlist h2 {font-size: 18px; margin-bottom: 10px; font-weight: bold; color: #333; letter-spacing: 2px; text-align: center;}
.videolist li { text-align: center; padding:10px;cursor: pointer;  }
.videolist li.active { background-color: #e0e0e0; }
.vidplay {border-left: 1px dashed #999; }


.player-container { padding: 0; }
.track { display: flex; align-items: center; background-color: #ffffff; padding: 15px 30px; border-bottom: 1px dashed #ccc; position: relative; cursor: pointer; transition: background-color 0.2s; }
.track:hover { background-color: #f9f9f9; }
.track.playing { background-color: #f0f5ff; }
.play-btn { width: 24px; height: 24px; border-radius: 50%; background-color: transparent; border: 1px solid #333; color: #333; cursor: pointer; display: flex; justify-content: center; align-items: center; font-size: 10px; transition: all 0.2s; margin-right: 20px; flex-shrink: 0; }
.play-btn:hover { background-color: #f0f0f0; }
.play-btn.playing { background-color: #4a6ee0; color: white; border-color: #4a6ee0; }
.track-info { display: flex; align-items: center; flex-wrap: wrap; gap: 30px; font-size: 14px; color: #333; width: 100%; }
.track-title { font-weight: bold; min-width: 25%; }
.track-detail { color: #666; min-width: 14%; padding-left: 5%; }