#wps-sticky-player{
position:fixed;
left:0;
right:0;
bottom:0;
z-index:9999;
background:#ffffff;
box-shadow:0 -4px 12px rgba(0,0,0,0.12);
display:flex;
align-items:center;
gap:10px;
padding:8px 12px;
transform:translateY(100%);
transition:transform 0.25s ease-out, opacity 0.25s ease-out;
opacity:0;
font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
box-sizing:border-box;
}
#wps-sticky-player.wps-visible{
transform:translateY(0);
opacity:1;
}
#wps-sticky-player .wps-title-wrap{
flex:1;
overflow:hidden;
min-width:0;
position:relative;
max-width:calc(100vw - 250px);
}
#wps-sticky-player .wps-title{
font-size:13px;
font-weight:600;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
display:flex;
flex-direction:column;
max-width:100%;
line-height:1.2;
}
#wps-sticky-player .wps-album-title{
font-size:13px;
font-weight:600;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
#wps-sticky-player .wps-track-title{
font-size:12px;
font-weight:500;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
margin-top:2px;
opacity:0.9;
}
#wps-sticky-player.wps-marquee-on .wps-album-title,
#wps-sticky-player.wps-marquee-on .wps-track-title{
text-overflow:clip !important;
} #wps-sticky-player.wps-size-custom .wps-album-title,
#wps-sticky-player.wps-size-custom .wps-track-title{ }
#wps-sticky-player .wps-title-wrap{
overflow:hidden !important;
position:relative;
}
#wps-sticky-player .wps-track-title.wps-marquee-on,
#wps-sticky-player .wps-album-title.wps-marquee-on{
text-overflow:clip !important;
display:inline-block !important;
will-change:transform;
overflow:visible !important;
white-space:nowrap !important;
} #wps-sticky-player .wps-controls{
display:flex;
align-items:center;
justify-content:flex-end;
gap:6px;
flex-shrink:0;
margin-left:auto;
}
#wps-sticky-player button.wps-btn{
border:none;
border-radius:999px;
background:transparent;
width:28px;
height:28px;
display:flex;
align-items:center;
justify-content:center;
font-size:13px;
cursor:pointer;
padding:0px;
flex-shrink:0;
color:inherit;
}
#wps-sticky-player button.wps-btn svg{
width:100%;
height:100%;
display:block;
}
#wps-sticky-player button.wps-back,
#wps-sticky-player button.wps-fwd{
color:#b79505;
font-weight:600;
}
#wps-sticky-player button.wps-back svg,
#wps-sticky-player button.wps-fwd svg{
width:100%;
height:100%;
display:block;
}
#wps-sticky-player button.wps-main{
width:34px;
height:34px;
font-size:16px;
border-radius:999px;
} #wps-sticky-player.wps-size-compact{
padding:6px 10px;
}
#wps-sticky-player.wps-size-compact .wps-title{font-size:12px;}
#wps-sticky-player.wps-size-compact button.wps-btn{width:24px;height:24px;font-size:11px;padding:0px;}
#wps-sticky-player.wps-size-compact button.wps-main{width:30px;height:30px;font-size:14px;}
#wps-sticky-player.wps-size-medium{
padding:8px 12px;
}
#wps-sticky-player.wps-size-medium .wps-title{font-size:13px;}
#wps-sticky-player.wps-size-medium button.wps-btn{width:28px;height:28px;font-size:13px;padding:0px;}
#wps-sticky-player.wps-size-medium button.wps-main{width:34px;height:34px;font-size:16px;}
#wps-sticky-player.wps-size-large{
padding:12px 16px;
}
#wps-sticky-player.wps-size-large .wps-title{font-size:15px;}
#wps-sticky-player.wps-size-large button.wps-btn{width:32px;height:32px;font-size:15px;padding:0px;}
#wps-sticky-player.wps-size-large button.wps-main{width:40px;height:40px;font-size:18px;}
#wps-sticky-player.wps-size-super-large{
padding:16px 20px;
min-height:80px;
}
#wps-sticky-player.wps-size-super-large .wps-title{
font-size:18px;
}
#wps-sticky-player.wps-size-super-large .wps-album-title{
font-size:18px !important;
font-weight:700 !important;
}
#wps-sticky-player.wps-size-super-large .wps-track-title{
font-size:16px !important;
font-weight:600 !important;
margin-top:4px;
}
#wps-sticky-player.wps-size-super-large button.wps-btn{
width:40px !important;
height:40px !important;
font-size:18px;
padding:0px;
}
#wps-sticky-player.wps-size-super-large button.wps-main{
width:48px !important;
height:48px !important;
font-size:22px;
}
#wps-sticky-player.wps-size-super-large .wps-back svg,
#wps-sticky-player.wps-size-super-large .wps-fwd svg,
#wps-sticky-player.wps-size-super-large .wps-prev svg,
#wps-sticky-player.wps-size-super-large .wps-next svg{
width:40px;
height:40px;
}
#wps-sticky-player.wps-size-super-large .wps-playbtn svg{
width:48px;
height:48px;
}
#wps-sticky-player .wps-progress-wrap{
position:absolute;
left:0;
right:0;
top:0;
height:3px;
background:rgba(0,0,0,0.05);
}
#wps-sticky-player .wps-progress-bar{
height:100%;
width:0;
border-radius:999px;
} .wps-skip-btn{
border:none;
border-radius:999px;
background:transparent;
width:32px;
height:32px;
display:inline-flex;
align-items:center;
justify-content:center;
cursor:pointer;
padding:0px;
color:#b79505;
margin:0 4px;
vertical-align:middle;
line-height:1;
}
.wps-skip-btn svg{
width:100%;
height:100%;
display:block;
}
.wps-skip-btn:hover{
opacity:0.8;
} @media (min-width:1025px){
#wps-sticky-player.wps-size-compact{display:none;}
}