*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{width:100%;min-height:100%;font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,Helvetica,Arial,PingFang SC,Microsoft YaHei,sans-serif;background:#ededeb;overflow-x:hidden}img{display:block;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;pointer-events:none}button{background:none;border:none;cursor:pointer;padding:0}.page{position:relative;width:100%;min-height:100vh;background:#ededeb;container-type:inline-size;display:flex;flex-direction:column}.top-area{position:relative;width:100%;height:110cqw;flex-shrink:0}.bg-img{position:absolute;top:0;left:0;width:100%;height:96cqw;object-fit:cover;object-position:top center;pointer-events:none;-webkit-user-select:none;user-select:none;z-index:1}.disc-area{position:absolute;top:58.67cqw;right:2.67cqw;width:61.33cqw;height:61.33cqw;z-index:3;pointer-events:none}.disc{position:absolute;top:0;left:0;width:56cqw;height:56cqw;will-change:transform}.disc img{width:100%;height:100%}.disc.playing{animation:discSpin 6s linear infinite}@keyframes discSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.tonearm{position:absolute;top:-27.2cqw;right:2.67cqw;width:17.6cqw;height:53.33cqw;transform-origin:72% 10%;transform:rotate(-20deg);transition:transform .9s cubic-bezier(.6,.1,.3,1);z-index:6}.tonearm.playing{transform:rotate(3deg)}.tonearm img{width:100%;height:100%}.player{position:relative;width:100%;padding:5cqw 6.4cqw 8cqw;z-index:10;flex-shrink:0}.wave-bars{display:flex;align-items:flex-end;gap:.8cqw;height:14.4cqw;margin-bottom:4.8cqw;margin-top:-16cqw;transform:scale(.8);transform-origin:left bottom}.wave-bars span{display:flex;flex-direction:column-reverse;gap:.4cqw;width:1.4cqw;height:100%}.wave-bars span i{display:block;width:100%;height:1.4cqw;background:#4ea3ad;opacity:0;transition:opacity .32s ease}.wave-bars span i.on{opacity:.9}.title-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:2.87cqw;gap:3.2cqw;margin-top:10cqw}.title-img{height:4.47cqw;width:auto;flex-shrink:0}.title-actions{display:flex;align-items:center;flex-shrink:0}.title-actions img{height:5.87cqw;width:auto}.progress-wrap{position:relative;height:11.2cqw;display:flex;align-items:flex-end}.wave-curve{position:absolute;left:0;right:0;bottom:1.07cqw;height:30.13cqw;pointer-events:none;overflow:visible}.wave-curve svg{width:100%;height:100%;display:block;overflow:visible}.progress{position:relative;height:1.07cqw;border-radius:.53cqw;width:100%;cursor:pointer;touch-action:none}.progress-bg{position:absolute;top:0;right:0;bottom:0;left:0;background:#ffffff;border-radius:.53cqw}.progress-played{position:absolute;top:0;left:0;height:100%;width:0;background:#1d7c8a;border-radius:.53cqw;transition:width .1s linear}.progress-dot{position:absolute;top:50%;left:0;width:3.73cqw;height:3.73cqw;margin-left:-1.87cqw;transform:translateY(-50%);transition:left .1s linear}.progress.dragging .progress-played,.progress.dragging .progress-dot{transition:none}.progress-dot img{width:100%;height:100%}.time-row{display:flex;justify-content:space-between;font-size:3.2cqw;color:#5a5a5a;margin-top:2.13cqw;margin-bottom:6.4cqw;font-family:Helvetica Neue,Arial,sans-serif;letter-spacing:.5px}.controls{display:flex;align-items:center;justify-content:space-between}.ctrl-btn{width:14.93cqw;height:11.2cqw;border-radius:2.13cqw;display:flex;align-items:center;justify-content:center}.ctrl-btn img{width:12.4cqw;height:12.4cqw;object-fit:contain}.ctrl-btn:active{transform:scale(.95)}.right-controls{display:flex;gap:3.2cqw}@media (min-width: 480px){body{background:#2a2a2a;padding:20px 0;display:flex;justify-content:center;align-items:flex-start;min-height:100vh}.page{width:414px;max-width:414px;min-height:0;height:auto;margin:0;border-radius:28px;overflow:hidden;box-shadow:0 0 32px #00000073}}