@import "https://fonts.googleapis.com/css2?family=Press+Start+2P&family=VT323&display=swap";@import "https://cdnjs.cloudflare.com/ajax/libs/material-design-iconic-font/2.2.0/css/material-design-iconic-font.min.css";@import "https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css";:root{--metro-accent-home:#d7c826;--metro-accent-blue:#1ba1e2;--metro-accent-magenta:#ff0097;--metro-accent-purple:#a200ff;--metro-accent-teal:#00aba9;--metro-accent-lime:#8cbf26;--metro-accent-brown:#960;--metro-accent-orange:#f09609;--metro-accent-red:#e51400;--metro-accent-green:#393;--primary-metro-accent:var(--metro-accent-blue);--background-dark:#1e1e1e;--tile-background:#00000069;--border-color:#555;--text-color-primary:#e0e0e0;--text-color-dark:#666;--text-color-secondary:#a0a0a0;--primary-metro-accent-rgb:27, 161, 226;--metro-accent-cyan:#0fc}*{box-sizing:border-box}body{background:var(--background-dark);color:var(--text-color-primary);text-transform:uppercase;padding:0;font-family:VT323,monospace}.animated{animation-duration:.5s}.heading{text-align:center;margin:1rem 0}.heading h1{color:var(--text-color-primary);margin:0 0 .5rem;font-family:"Press Start 2P",monospace;font-size:1rem}.heading p{color:var(--text-color-secondary);margin:0;font-size:.85rem}.heading a{color:var(--metro-accent-teal);text-decoration-style:dotted;transition:all .3s}.audioPlayer{background-color:var(--background-dark);-webkit-user-select:none;user-select:none;border-radius:0;width:360px;height:640px;margin:0 auto;position:relative;overflow:hidden;box-shadow:0 19px 38px #0000004d,0 15px 12px #00000038}.audioPlayer .nav-icon{cursor:pointer;z-index:30;width:15px;height:12px;transition:all .25s ease-in-out;position:absolute;top:1.5rem;left:1.5rem;transform:rotate(0)}.audioPlayer .nav-icon span{text-shadow:0 1px 3px #00000080;opacity:1;background:#fff;border-radius:0;width:100%;height:2px;transition:all .5s ease-in-out;display:block;position:absolute;left:0;transform:rotate(0)}.audioPlayer .nav-icon span:first-child{top:0}.audioPlayer .nav-icon span:nth-child(2){top:5px}.audioPlayer .nav-icon span:nth-child(3){top:10px}.audioPlayer .nav-icon.isActive span:first-child{background:#ffffffbf;top:5px;transform:rotate(135deg)}.audioPlayer .nav-icon.isActive span:nth-child(2){opacity:0;left:-60px}.audioPlayer .nav-icon.isActive span:nth-child(3){background:#ffffffbf;top:5px;transform:rotate(-135deg)}.audioPlayer .audioPlayerList{color:var(--text-color-primary);z-index:20;will-change:transform;background:#1e1e1ef2;width:100%;height:100%;padding:4rem 1.5rem 1.5rem;transition:all .5s;position:absolute;top:0;left:0;overflow:auto;transform:translate(-100%)}.audioPlayer .audioPlayerList.isActive{transform:translate(0)}.audioPlayer .audioPlayerList .item{border-left:.1rem solid #0000;margin-bottom:1.5rem;transition:all .2s}.audioPlayer .audioPlayerList .item:hover{cursor:pointer;padding-left:.5rem}.audioPlayer .audioPlayerList .item .title{color:var(--text-color-primary);margin-bottom:.75rem;font-family:"Press Start 2P",monospace;font-size:.7rem}.audioPlayer .audioPlayerList .item .artist{color:var(--text-color-secondary);font-family:VT323,monospace;font-size:.8rem}.audioPlayer .audioPlayerList .item.isActive{border-left-color:var(--primary-metro-accent);padding-left:1rem}.audioPlayer .audioPlayerList{cursor:pointer;color:var(--metro-accent-red)}.audioPlayer .audioPlayerUI{z-index:10;will-change:transform, filter;background:linear-gradient(#0000001a 0%,#0006 40%,#000000d9 100%);flex-direction:column;justify-content:flex-end;width:100%;height:100%;padding:2rem 1.5rem;transition:all .5s;display:flex;position:relative}.audioPlayer .audioPlayerUI.isDisabled{filter:blur(5px)grayscale();transform:scale(.75)translate(100%)}.audioPlayer .audioPlayerUI .albumImage{z-index:-1;width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden}.audioPlayer .audioPlayerUI .albumImage img{object-fit:cover;object-position:50% 50%;filter:brightness(.65)contrast(1.05);border-radius:0;width:100%;height:100%}.audioPlayer .audioPlayerUI .albumDetails{text-align:center;margin-bottom:2rem}.audioPlayer .audioPlayerUI .albumDetails p{margin:0}.audioPlayer .audioPlayerUI .albumDetails p.title{color:#fff;letter-spacing:.5px;text-shadow:0 2px 20px #000000e6;margin:0;font-family:VT323,monospace;font-size:1.1rem;font-weight:400}.audioPlayer .audioPlayerUI .albumDetails p.artist{color:var(--metro-accent-teal,#00aba9);text-transform:uppercase;text-shadow:0 2px 15px #000000e6;margin-top:.4rem;font-family:"Press Start 2P",monospace;font-weight:400}.audioPlayer .audioPlayerUI .playerButtons{text-align:center;margin:0 auto 2rem;position:relative}.audioPlayer .audioPlayerUI .playerButtons .button{vertical-align:middle;color:#fff;text-shadow:0 2px 4px #00000080;cursor:pointer;border-radius:0;outline:0;margin:0 .5rem;padding:.5rem;font-size:2.5rem;text-decoration:none;transition:all .5s;display:inline-block}.audioPlayer .audioPlayerUI .playerButtons .button.play{margin:0 1.5rem;font-size:4.5rem}.audioPlayer .audioPlayerUI .playerButtons .button:active{opacity:.75;transform:scale(.75)}.audioPlayer .audioPlayerUI .playerButtons .button.isDisabled{color:#ffffff4d;text-shadow:none;cursor:initial}.audioPlayer .audioPlayerUI .playerButtons .button.isDisabled:active{transform:none}.audioPlayer .audioPlayerUI .currentTimeContainer{justify-content:space-between;width:100%;height:1rem;display:flex}.audioPlayer .audioPlayerUI .currentTimeContainer .currentTime,.audioPlayer .audioPlayerUI .currentTimeContainer .totalTime{color:#fff;text-shadow:0 1px 2px #00000080;font-family:VT323,monospace;font-size:1rem}.audioPlayer .audioPlayerUI .currentProgressBar{background-color:#fff3;width:100%;margin:.75rem 0 0}.audioPlayer .audioPlayerUI .currentProgressBar .currentProgress{background-color:var(--primary-metro-accent);width:0;height:4px;transition:all .1s}.loader{text-indent:-9999em;margin:60px auto;font-size:10px;position:relative}.slide-fade-enter-active{transition:all .3s}.slide-fade-leave-active{transition:all .2s cubic-bezier(1,.5,.8,1)}.slide-fade-enter,.slide-fade-leave-to{opacity:0;transform:translateY(10px)}.fade-enter-active,.fade-leave-active{transition:opacity .5s}.fade-enter,.fade-leave-to{opacity:0}
