@import url(https://fonts.googleapis.com/css2?family=Reenie+Beanie&display=swap);*,:after,:before{box-sizing:border-box}:root{--theme-bg:#fff;--theme-color:#000}body{background-color:#fff;background-color:var(--theme-bg);color:#000;color:var(--theme-color);font-size:1.5rem;letter-spacing:1px;line-height:1.4;margin-left:auto;margin-right:auto;max-width:60rem;min-height:100vh;overflow-x:hidden;padding:1.1rem;scroll-behavior:smooth;transition:background .3s ease}[data-theme=dark]{--theme-bg:#000;--theme-color:#add8e6}h1,h2,h3,h4,ul{font-family:Reenie Beanie,cursive;margin:0}h1,h2,h3,h4{line-height:1.1}h3{font-size:1.3rem;margin-top:1rem}ul{background-color:#fff;background-color:var(--theme-bg);color:#000;color:var(--theme-color);height:100%;list-style:none;max-width:270px;min-width:50%;overflow-y:scroll;padding:0;transform:translateX(-100%);transition:transform .3s cubic-bezier(.075,.82,.165,1)}img{max-width:100%}li{cursor:pointer;display:flex;padding:1rem;transition:all .5s cubic-bezier(.165,.84,.44,1)}.selected,li:focus,li:hover{background-color:grey}li img{height:4rem;margin-right:1rem}svg g,svg path{fill:#000;fill:var(--theme-color)}[type=button]{background-color:initial;border:none;cursor:pointer;padding:0}[type=button]:focus,[type=button]:hover{filter:drop-shadow(0 0 3px #000);filter:drop-shadow(0 0 3px var(--theme-color));outline:none}[type=button].selected{box-shadow:0 0 5px 0 #000;box-shadow:0 0 5px 0 var(--theme-color);outline:.125rem dotted #000;outline:.125rem dotted var(--theme-color)}[data-type=toggle]{align-items:center;background-color:#add8e6;border-radius:10px;display:flex;height:1.25rem;justify-content:space-between;padding:.125rem;position:relative;width:2.5rem}[data-type=toggle]>span{height:16px}[data-type=toggle]>.toggle__thumb{background-color:#000;border-radius:50%;height:15px;left:.125rem;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:left .3s cubic-bezier(.075,.82,.165,1);width:15px}[data-type=toggle]>.toggle__thumb[data-toggle=true]{left:1.467rem}[data-type=range]{background-color:#000;background-color:var(--theme-color);border-radius:1rem;cursor:pointer;display:flex;height:1rem;justify-content:center;margin:0 1rem;overflow:hidden;position:relative;width:100%}[data-type=range] :last-child{background-color:grey;height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%}[type=range],[type=range]::-webkit-slider-thumb{cursor:pointer;opacity:0;position:relative;width:100%}.vh{clip:rect(1px,1px,1px,1px);height:1px;overflow:hidden;position:absolute;width:1px}.player{align-items:center;text-align:center}.player,.player__nowPlaying{display:flex;flex-direction:column}.player__nowPlaying{height:70vh;justify-content:center}.player__nowPlaying img{border-radius:50%;height:16rem;margin-bottom:2rem;width:16rem}.player__controls,.player__indicator{align-items:center;display:inline-flex;justify-content:space-around;width:70%}.player__indicator{margin-bottom:2rem}.playing{animation:pulse 3s cubic-bezier(.47,0,.745,.715) infinite}@keyframes pulse{0%{box-shadow:0 0 0 0 #b0d5e6b3;transform:scale(1)}50%{box-shadow:0 0 0 2rem #b0d5e600;transform:scale(1.1)}to{box-shadow:0 0 0 0 #b0d5e600;transform:scale(1)}}header{justify-content:space-between}header,nav{align-items:center;display:flex}nav>*+*{margin-left:1rem}[data-showTracks]{height:100%;left:0;pointer-events:none;position:fixed;top:0;width:100%}[data-showracks]:before{background-color:#000000b3;content:"";height:100%;left:0;opacity:0;position:absolute;top:0;width:100%;z-index:-1}[data-showtracks=true]{pointer-events:visible}[data-showtracks=true]:before{opacity:1}[data-showtracks=true] ul{transform:translateX(0)}.search-container{align-items:center;display:flex;flex:1 1;margin:0 1rem}.search-input{background-color:#fff;background-color:var(--theme-bg);border:2px solid #000;border:2px solid var(--theme-color);border-radius:20px;color:#000;color:var(--theme-color);font-size:1rem;max-width:400px;padding:.5rem 1rem;transition:all .3s ease;width:100%}.search-input:focus{box-shadow:0 0 5px #000;box-shadow:0 0 5px var(--theme-color);outline:none}.search-input::placeholder{color:#000;color:var(--theme-color);opacity:.7}@media (max-width:768px){header{flex-wrap:wrap}.search-container{margin:1rem 0;order:3;width:100%}.search-input{max-width:100%}}
/*# sourceMappingURL=main.e685b442.css.map*/