@font-face{font-display:swap;font-family:Rubik;font-style:normal;font-weight:400;src:url(../fonts/Rubik/Rubik-Regular.woff2) format("woff2")}:root{color-scheme:light dark;--backdrop-blur:13px;--backdrop-brightness:1.25}@media (prefers-color-scheme:dark){:root{--backdrop-brightness:0.333}}[hidden]{display:none!important}.spacer{flex-grow:1}html{background:#000;color:light-dark(#000,#fff);font-family:Rubik,sans-serif;font-size:16px;transition:background-color .5s ease}body,html{height:100%}body{display:flex;justify-content:center;margin:0}button{cursor:pointer}input[type=range]{-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer;width:100%;--thumb-size:20px;--track-height:6px;--primary-color:#3b82f6;--track-color:light-dark(#2f2f2f,#e5e7eb)}input[type=range]:focus{outline:none}input[type=range]::-webkit-slider-runnable-track{background:var(--track-color);border-radius:10px;height:var(--track-height)}input[type=range]::-moz-range-track{background:var(--track-color);border-radius:10px;height:var(--track-height)}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background-color:#fff;border:2px solid var(--primary-color);border-radius:50%;box-shadow:0 4px 6px -1px rgba(0,0,0,.1);height:var(--thumb-size);margin-top:-7px;transition:transform .1s ease-in-out;width:var(--thumb-size)}input[type=range]::-moz-range-thumb{background-color:light-dark(#171717,#fff);border:none;border-radius:50%;box-shadow:0 4px 6px -1px rgba(0,0,0,.1);height:var(--thumb-size);width:var(--thumb-size)}input[type=range]:active::-webkit-slider-thumb{background-color:var(--primary-color);transform:scale(1.2)}input[type=range]:active::-moz-range-thumb{background-color:var(--primary-color);transform:scale(1.2)}#startup{align-items:center;display:flex;flex-direction:column;height:100%;justify-content:center;position:absolute;transition:opacity .5s ease;width:100%;z-index:999}#startup.enabled{background:#000}#startup.disabled{opacity:0}#logo{width:50vw}#logo svg{animation:spin 60s linear infinite}#cover-loading svg path,#logo svg path{animation-iteration-count:infinite;animation-name:spin;animation-timing-function:linear;transform-origin:center}#cover-loading svg path{filter:drop-shadow(0 0 1px black)}#logo-inner{animation-direction:alternate;animation-duration:5s}#logo-middle{animation-duration:4s}#logo-outer{animation-direction:reverse;animation-duration:3s}#app-bg{z-index:-1}#app-bg,#app-bg .cover{height:100%;position:absolute;width:100%}#app-bg .cover{background-blend-mode:screen;background-position:50%;background-size:cover,auto;opacity:0;transition:opacity .5s}#app-bg .cover.active{opacity:1}#app-bg #backdrop{backdrop-filter:blur(var(--backdrop-blur)) brightness(var(--backdrop-brightness));background:url(../assets/noise-pattern.png);background-repeat:round;height:100%}#main{align-items:center;display:flex;flex-direction:column;margin:1rem 1.5rem;width:100%}#cover-wrapper{border-radius:.375rem;box-shadow:0 8px 16px 0 rgba(0,0,0,.15);display:grid;grid-template-areas:"stack";margin:1.5em 0;max-width:400px;overflow:hidden}#cover,#cover-wrapper{aspect-ratio:1/1;width:100%}#cover{background-color:#000;background-size:cover}#cover,#cover-loading{grid-area:stack;height:100%}#cover-loading{backdrop-filter:blur(0);display:grid;grid-template-areas:"stack";transition:all .5s ease;width:100%}#cover-loading.active{backdrop-filter:blur(7px)}#cover-loading-progress{background:#fff;grid-area:stack;height:4px;mix-blend-mode:difference;transition:width 1s ease;width:0}#cover-loading svg{grid-area:stack;opacity:0;place-self:center;transition:opacity .5s ease;width:50%}#cover-loading.active svg{opacity:1}#now-playing{--light-shadow:hsla(0,0%,100%,.33);--dark-shadow:rgba(0,0,0,.5);align-items:center;display:flex;flex-direction:column;line-height:1.4;padding:.5rem 0;text-align:center;text-shadow:1px 1px 0 light-dark(var(--light-shadow),var(--dark-shadow)),-1px -1px 0 light-dark(var(--light-shadow),var(--dark-shadow)),1px -1px 0 light-dark(var(--light-shadow),var(--dark-shadow)),-1px 1px 0 light-dark(var(--light-shadow),var(--dark-shadow))}#title{font-size:1.7rem;line-height:2.2rem;margin-bottom:.25rem}#artistcountry{font-size:1.5rem;margin-bottom:.2rem;opacity:.85}#albumyear{font-size:1.2rem;margin-bottom:.3rem}#albumyear,#license{opacity:.7}#albumyear,#artistcountry,#license,#title{padding:0 .25rem}#license{align-items:center;display:flex;font-size:1.1rem;white-space:preserve}.license-icon{height:1.3em;overflow:visible}.license-icon:first-of-type{margin-left:-.1rem}.license-icon:last-of-type{margin-right:-.1rem}.license-icon use{paint-order:stroke fill;stroke:light-dark(hsla(0,0%,100%,.33),rgba(0,0,0,.5));stroke-width:60px}.icon{height:1em}#country:before,#year:before{content:" ("}#country:after,#year:after{content:")"}#volume-container{display:flex;filter:drop-shadow(0 0 2px light-dark(rgba(255,255,255,.5),#000));justify-content:center;width:75%}#volume-container button{background-color:transparent;border:1px solid transparent;border-radius:50%;color:light-dark(#111,#fff);cursor:pointer;display:inline-block;font-size:24px;line-height:1;padding:.5rem;text-align:center;text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;user-select:none;vertical-align:middle}#volume{flex-grow:1;margin:.75rem .25rem;width:50%}#play,#player-controls,#stop{display:flex;justify-content:center}#play,#stop{align-items:center;background-color:light-dark(#333,#f8f9fa);border:1px solid light-dark(#f8f9fa,#495057);border-radius:50%;color:light-dark(#fff,#000);font-size:3.75em;height:1.5em;margin:.75rem;padding:1rem;width:1.5em}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@media (min-width:576px){#main{margin-top:1.5rem!important}}@media (min-width:768px){#main{margin-top:3rem!important}}