.wplayer{position:fixed;left:50%;bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:990;width:calc(100% - 28px);max-width:1180px;transform:translateX(-50%);}
.audioplayer{position:relative;box-sizing:border-box;height:86px;padding:8px 16px 26px;background:#FFFFFFF2;border:1px solid #DCE6F0;border-radius:10px;box-shadow:0 14px 40px #10243D2E;color:var(--primary-text-color);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);}
.audioplayer-bar{position:absolute;left:16px;right:16px;bottom:7px;height:5px;background:#DDE7F1;border-radius:10px;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent;}

.audioplayer audio{display:none;}

.audioplayer-bar-loaded{position:absolute;left:0;top:0;height:100%;background:#C6D6E7;}
.audioplayer-bar-played{position:absolute;left:0;top:0;height:100%;background:var(--gradient);border-radius:10px;}

.ap-desc{display:flex;align-items:center;width:310px;height:100%;min-width:0;transform:translateY(-4px);}
.ap-btns{position:absolute;left:50%;top:42%;display:flex;align-items:center;gap:8px;transform:translate(-50%,-50%);}
.ap-time{position:absolute;right:108px;top:42%;display:flex;gap:4px;color:var(--secondary-text-color);font-size:12px;transform:translateY(-50%);}

.ap-img{width:48px;height:48px;margin-right:12px;border-radius:10px;overflow:hidden;flex-shrink:0;background:var(--third-color);box-shadow:0 5px 14px #15365C24;}
.ap-img img{display:block;width:100%;height:100%;object-fit:cover;}
.ap-info{min-width:0;}
.ap-title{color:var(--primary-text-color);font-size:15px;font-weight:700;line-height:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ap-artist{margin-top:2px;color:var(--secondary-text-color);font-size:12px;line-height:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.audioplayer-playpause a{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--gradient);border-radius:10px;color:var(--third-text-color);font-size:17px;box-shadow:0 7px 18px #285A9442;transition:transform 0.15s ease,box-shadow 0.15s ease;-webkit-tap-highlight-color:transparent;touch-action:manipulation;}
.audioplayer-playpause a:hover{color:var(--third-text-color);transform:scale(1.04);box-shadow:0 9px 22px #285A9452;}
.ap-prev,.ap-next{display:flex;align-items:center;justify-content:center;width:38px;height:38px;background:#EDF3F9;border:1px solid #DCE6F0;border-radius:10px;color:var(--primary-color);font-size:12px;cursor:pointer;transition:background-color 0.15s ease,color 0.15s ease,border-color 0.15s ease;-webkit-tap-highlight-color:transparent;touch-action:manipulation;}
.ap-prev:hover,.ap-next:hover{background:var(--primary-color);border-color:var(--primary-color);color:var(--third-text-color);}
.audioplayer-time-current{color:var(--primary-color);font-weight:600;}
.audioplayer-time-current:after{content:"/";margin-left:4px;color:var(--fourth-text-color);font-weight:400;}
.audioplayer-dl-button{position:absolute;right:16px;top:42%;display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:#EDF3F9;border:1px solid #DCE6F0;border-radius:10px;color:var(--primary-color);transform:translateY(-50%);transition:background-color 0.15s ease,color 0.15s ease,border-color 0.15s ease;-webkit-tap-highlight-color:transparent;touch-action:manipulation;}
.audioplayer-volume{position:absolute;right:60px;top:42%;transform:translateY(-50%);}
.audioplayer-dl-button:hover{background:var(--primary-color);border-color:var(--primary-color);color:var(--third-text-color);}

.audioplayer-volume-button a{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:#EDF3F9;border:1px solid #DCE6F0;border-radius:10px;color:var(--primary-color);transition:background-color 0.15s ease,color 0.15s ease,border-color 0.15s ease;-webkit-tap-highlight-color:transparent;touch-action:manipulation;}
.audioplayer-volume-button a:hover{background:var(--primary-color);border-color:var(--primary-color);color:var(--third-text-color);}
.audioplayer-volume-adjust{position:absolute;left:50%;bottom:44px;display:none;width:38px;height:112px;padding:10px;background:#FFFFFF;border:1px solid #DCE6F0;border-radius:10px;box-shadow:0 12px 30px #10243D2E;transform:translateX(-50%);}
.audioplayer-volume-adjust>div{position:relative;width:6px;height:100%;margin:0 auto;background:#DDE7F1;border-radius:10px;}
.audioplayer-volume-adjust>div>div{position:absolute;left:0;bottom:0;width:100%!important;background:var(--primary-color);border-radius:10px;}
.audioplayer-volume:hover .audioplayer-volume-adjust{display:block;}
.ap-mob-btn{display:none;}

@media(max-width:900px){
.ap-desc{width:250px;}
.ap-time{display:none;}
}

@media(max-width:768px){
.wplayer{left:0;right:0;bottom:0;width:100%;max-width:none;transform:none;}
.audioplayer{display:flex;align-items:center;height:auto;min-height:72px;padding:7px 10px calc(8px + env(safe-area-inset-bottom,0px));background:#FFFFFFF5;border:0;border-top:1px solid #DCE6F0;border-radius:10px 10px 0 0;box-shadow:0 -8px 28px #10243D24;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);}
.ap-desc{width:auto;max-width:calc(100% - 108px);height:48px;flex-grow:1;transform:none;}

.audioplayer-bar{left:0;right:0;top:0;bottom:auto;height:3px;background:#DDE7F1;border-radius:0;}
.audioplayer-bar-played{border-radius:0;}

.ap-img{width:44px;height:44px;margin-right:10px;border-radius:10px;}
.ap-title{font-size:13px;line-height:18px;}
.ap-artist{margin-top:1px;font-size:11px;line-height:16px;}
.ap-btns{left:auto;right:54px;top:50%;gap:0;transform:translateY(-50%);}

.audioplayer-playpause a{width:42px;height:42px;border-radius:10px;font-size:15px;box-shadow:0 5px 14px #285A943D;}
.ap-prev,.ap-next{display:none;}
.audioplayer-dl-button{right:10px;top:50%;width:36px;height:36px;background:#EDF3F9;border-color:#DCE6F0;border-radius:10px;}
.audioplayer-volume{display:none;}
.ap-time{display:none;}
.ap-mob-btn{display:none!important;}
}

@media(max-width:380px){
.ap-desc{max-width:calc(100% - 98px);}
.ap-img{width:40px;height:40px;margin-right:8px;}
.ap-title{font-size:12px;}
.ap-artist{font-size:10px;}
.audioplayer-playpause a{width:38px;height:38px;}
.ap-btns{right:50px;}
.audioplayer-dl-button{right:8px;width:34px;height:34px;}
}