.loadingCover{z-index:99999;background-color:#000;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.loadingCover svg{width:50vw;margin-top:-5vh;animation:2s ease-in-out infinite upAndDown}.loadingCover svg path{transform-origin:50%;animation:2s linear infinite roll}@keyframes upAndDown{50%{transform:translateY(5vh)}}@-webkit-keyframes upAndDown{50%{-webkit-transform:translateY(5vh)}}.list{z-index:999;background-color:#0003;border-radius:1vw;width:0;height:0;padding:0;transition:all .3s ease-in-out;position:fixed;top:2vh;left:7vw;overflow:hidden;box-shadow:0 0 10px #0000001a}.list.toggle{width:20vw;height:70vh;padding:10px}.list li{-webkit-user-select:none;user-select:none;margin:0;padding:0;list-style:none}.list ul{height:100%;display:none;overflow:auto}.list.toggle ul{display:block}.list li,.mobileList li{white-space:nowrap;word-break:keep-all;text-overflow:ellipsis;cursor:pointer;text-shadow:-1px -1px 1px #00000080;color:#ffffffb3;padding:.3em 1em;font-size:14px;overflow:hidden}.list li:hover,.list li:active{background-color:#0003}.playing{background-color:#fff3;color:#fff!important}.mobileList svg{margin:2vw 0 0 52vw;transition:margin .3s;display:block}.mobileList{z-index:9999;opacity:0;width:100vw;transition:opacity .3s ease-in-out;position:fixed;top:100vh;bottom:0;left:0;overflow:hidden;box-shadow:none!important;background-color:#0000!important}.mobileList ul{background-color:#fff;border-radius:5vw 5vw 0 0;width:100vw;height:70vh;padding:5vw 3vw;transition:transform .5s ease-in;position:fixed;top:0;left:0;right:0;overflow:auto;transform:translateY(100vh)}.mobileList.toggle{opacity:1;transition:opacity .3s ease-in-out;top:0;background-color:#000000b3!important}.mobileList.toggle ul{transform:translateY(30vh)}.toggle:after{display:block}.mobileList li{text-shadow:none;color:#222;padding:2vw 3vw}.mobileList small{color:#b3b3b3}.mobileList .playing{background-color:#efefef;border-radius:10vw;color:initial!important}.mobileList #upDownArrow{display:none}#upDownArrow:hover path{stroke:#fff}#upDownArrow path{transition:all .2s ease-in-out}.expend #upDownArrow path{d:path("M70,20 L30,50 L70,80")}#upDownArrow{opacity:.3;width:20px;height:20px}#upDownArrow:hover{opacity:1}.listIcon{z-index:999;cursor:pointer;color:#00000080;width:4vw;max-width:48px;height:4vw;position:fixed;top:2vh;left:2vw}.listIcon:hover{color:#000}.recordStyle{z-index:999;cursor:pointer;opacity:.3;background-color:#0000;background-size:100%;border:none;border-radius:48px;width:64px;height:64px;transition:opacity .6s;position:absolute;top:20px;right:20px}.recordStyle:hover{opacity:1}.cdIcon svg{filter:drop-shadow(-2px -1px 4px #0000004d);width:50%;height:50%;transition:all .3s}.vinylIcon svg{filter:drop-shadow(-2px -1px 4px #ffffff4d);width:100%;height:100%;transition:all .3s}.vinylIcon .outer{fill:#000;stroke:#000}.vinylIcon .inner{fill:#fff;stroke:#fff}.vinylIcon .vinylInner{opacity:1}.cdIcon .vinylInner{opacity:0}.keyTips{z-index:999;cursor:pointer;opacity:.4;width:56px;height:56px;transition:opacity .6s;position:absolute;top:100px;right:23px}.keyTips:hover{opacity:1}.controller{z-index:999;justify-content:space-around;align-items:center;width:60%;height:60px;margin-left:-23px;display:flex;position:absolute;bottom:60px;left:20%}.controller svg{cursor:pointer;opacity:.5;filter:drop-shadow(0 0 4px #00000080);border-radius:50%;flex:0 0 48px;width:48px;height:48px;margin:0 60px;transition:all .6s}.controller svg.bigIcon{flex:0 0 64px;width:64px;height:64px}.controller svg:active,.controller svg:hover{opacity:.8;transition:all .6s}.controller input{flex:0 0 100px;width:100px;margin-left:-100px;position:relative}.smallIcon{margin:0!important}.volumeBar{opacity:.5;flex:0;transition:opacity .6s;position:relative}.volumeBar:hover{opacity:1;transition:opacity .6s}.volumeBar .speakerIcon{opacity:.5;width:24px;height:24px;margin-top:-11px;margin-left:-25px;position:absolute}.controller input[type=range]{cursor:pointer;appearance:none;font:inherit;background:0 0;margin-top:-2px;padding:0;font-size:0;position:absolute;margin-left:0!important}::-webkit-slider-thumb{appearance:none;background-color:#fff;border-radius:50%;width:15px;height:15px;margin-top:-4px}::-webkit-slider-runnable-track{appearance:none;box-sizing:border-box;background:#ffffff80;border:none;border-radius:6px;width:100px;height:6px}.mobileControll{width:100vw;height:20vw;margin:0;padding:0 4vw;bottom:6vh;left:0}.mobileControll .volumeBar{display:none}.mobileControll path{transition:all .3s}.mobileControll svg{flex:0 0 12vw;width:12vw;height:12vw;margin:0}.mobileControll .smallIcon{flex:0 0 8vw;width:8vw;height:8vw}.mobileControll .bigIcon{border-width:.5vw;flex:0 0 15vw;height:15vw}.toast{color:#ffffffb3;text-align:center;z-index:999;background-color:#ffffff1a;border-radius:3px 0 0 3px;padding:30px;font-size:14px;transition:transform .6s;position:fixed;bottom:200px;right:0;box-shadow:-2px -1px 2px #0000000d}.hide{transition:transform .6s;transform:translate(350px);padding:0!important}.mobileToast{opacity:1;text-align:center;z-index:9999;color:#fff;background-color:#0006;width:100vw;padding:3vw;transition:opacity .6s;position:fixed;bottom:0}.hide.mobileToast{opacity:0;padding:0;transition:opacity .6s}*{-webkit-tap-highlight-color:transparent;box-sizing:border-box}:root{--laser:conic-gradient(#fff, #adadad 10%, #d4d4d4 17%, #fff 29%, #b1ff85, #84ffd5, #80edff, #86b2ff, #d48cff, #ff92ce, #ff6269, #ffb263, #feac00, #fc0 35%, #fff 40%, #b5b5b5 45%, #ababab 48%, #eee 60%, #fff 68%, #cacaca 81%, #b1ff85, #84ffd5, #80edff, #86b2ff, #d691ff, #ff92ce, #ff6269, #ffb263, #feac00 85%, #fff 88%, #eee 90%, #ddd 92%, #fff)}html,body{background-color:#000;width:100%;height:100%;overflow:hidden}body{-webkit-overflow-scrolling:touch;-webkit-font-smoothing:antialiased;color:#666;font:12px/1.5 Microsoft YaHei,tahoma,arial,Hiragino Sans GB,\\5b8b体,sans-serif}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,sumary{margin:0;padding:0}input,select,textarea{appearance:none;border:0;border-radius:0;outline:none}ol,ul{list-style:none}img,a{-webkit-touch-callout:none}a,a:active,a:hover{text-decoration:none}a,button,input,textarea{-webkit-tap-highlight-color:transparent}p{text-align:justify;text-justify:inter-ideograph}:focus{outline:0}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-thumb{background-color:#0003;border-radius:6px}.author{color:#fff3;text-align:right;z-index:999;text-shadow:0 1px 3px #0003;font-size:10px;transition:color 1s;position:absolute;bottom:30px;right:30px}.author:hover{color:#ffffff80;transition:color .6s}.blurCoverBack{z-index:1;filter:blur(20px);opacity:.7;background-position:50%;background-size:120%;width:120vw;height:120vh;transition:opacity .3s ease-in-out;position:fixed;top:-10vh;left:-10vw}.cdBox{z-index:2;justify-content:center;align-items:center;display:flex;position:fixed;inset:-300px 0 0;transform:translateY(-1800px)}.songInfo{text-align:center;z-index:999;color:#fff;text-shadow:-1px -1px 3px #0000004d;font-size:20px;position:absolute;bottom:160px;left:0;right:0}.songInfo span{color:#ddd;margin:0 20px;font-size:80%;display:inline-block}.vinylBack,.vinylStyle .cdShadow{background-size:800px;width:800px;height:800px;position:absolute}.vinylBack{background:#000;border-radius:50%;-webkit-mask:radial-gradient(#0000,#0000 16px,#000 19px);mask:radial-gradient(#0000,#0000 16px,#000 19px)}.vinylStyle .cd{box-sizing:border-box;border:40px solid #0000004d;width:440px;min-width:440px;max-width:440px;height:440px;-webkit-mask:radial-gradient(#0000,#0000 16px,#000 19px);mask:radial-gradient(#0000,#0000 16px,#000 19px)}.vinylStyle .cdLlight{width:800px;min-width:800px;height:800px}.vinylStyle .cd,.vinylStyle .cdLlight{z-index:1;-webkit-mask:radial-gradient(#0000,#0000 16px,#000 19px);mask:radial-gradient(#0000,#0000 16px,#000 19px)}.vinylStyle .cdLlight{box-shadow:none;background-color:#0000;background-image:linear-gradient(127deg,#000 20%,#0000 50%,#000c 80%),repeating-radial-gradient(#000,#00000080 1px,#000 3px),repeating-radial-gradient(#000,#ffffff1a 2px,#000 3px),conic-gradient(#000,#fff 10%,#000 20% 50%,#fff 60%,#000 70% 100%);background-position:0 0,0 0,0 0,0 0;background-repeat:repeat,repeat,repeat,repeat;background-size:100% 100%,100% 100%;background-attachment:scroll,scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box}.vinylStyle .cdLlight.pause{animation-play-state:paused!important}.cdStyle .cd{padding:3px;-webkit-mask:radial-gradient(#0000 80px,#fff6 81px,#000 82px);mask:radial-gradient(#0000 80px,#fff6 81px,#000 82px)}.vinylStyle .cdBox:after{border:none;width:34px;height:34px;box-shadow:inset -2px 0 15px #0000004d,-1px 0 #ffffff40,inset 0 0 #ffffff4d}.vinylStyle .cdShadow{display:none}.cdBox:after{content:"";-webkit-box-shadow:inset 0 0 20px #00000080;z-index:4;border:35px solid #ffffff1a;border-radius:500px;width:72px;height:72px;position:absolute;box-shadow:inset -2px 1px 15px #0000004d,-1px 0 #ffffff40,inset 1px 0 #ffffff4d}.blurCoverBack.loaded{opacity:0;transition:opacity .3s ease-in-out}.cdSlideIn{animation:.6s ease-in-out forwards slideDown}.cd{z-index:99;border-radius:500px;width:500px;min-width:500px;height:500px;animation:6s linear 1s infinite roll;position:absolute}.vinylStyle img.cd{background-color:#000}.cdSlideIn .cd{animation:6s linear .8s infinite roll}.cdLlight{-webkit-mask:radial-gradient(#0000,#0000 35px,#fff6 37px,#000 37px);z-index:2;background:linear-gradient(115deg,#fff0 0% 50%,#ffffff1a 50%,#fff0 100%),0 0;border-radius:500px;width:500px;height:500px;position:absolute;box-shadow:inset 0 0 1px #fff3;-webkit-mask:radial-gradient(#0000 35px,#fff6 37px,#000 37px);mask:radial-gradient(#0000 35px,#fff6 37px,#000 37px)}.cdShadow{background:var(--laser);border-radius:500px;width:500px;height:500px;animation:30s linear infinite reverse roll;position:fixed;-webkit-mask:radial-gradient(#0000 70px,#fff6 71px,#000 72px);mask:radial-gradient(#0000 70px,#fff6 71px,#000 72px)}.pause{animation-play-state:paused!important}@keyframes roll{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@-webkit-keyframes roll{0%{-webkit-transform:rotate(0)}to{-webkit-transform:rotate(360deg)}}@keyframes slideDown{0%{transform:translateY(-100vh)}to{transform:translateY(0)}}@-webkit-keyframes slideDown{0%{-webkit-transform:translateY(-100vh)}to{-webkit-transform:translateY(0)}}.fade-enter-active,.fade-leave-active{transition:opacity 1s}.fade-enter,.fade-leave-to{opacity:0}
