@import "fonts.css";@keyframes rotation{0%{transform:rotate(0deg)}to{transform:rotate(360deg)}}[data-theme=theme-dark],[data-theme=theme-light]{--main-confirm-color:#333;--equalizer-range:dodgerblue;--sb-size:3px}[data-theme=theme-dark]{--main-background:#111;--main-floatboxes:#444;--pane-background:#1c1c1c;--pane-boxshadow:none;--float-boxsahdow:none;--main-text-color:#eee;--main-text-hover:rgba(255, 255, 255, 0.1);--main-confirm-boxshadow:none;--main-confirm-background:white;--menu-button-color:white;--menu-button-hover:rgba(255, 255, 255, 0.1);--menu-checked-image:url('data:image/svg+xml,<svg width="18" height="18" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22ZM15.5355 8.46447C15.9261 8.07394 16.5592 8.07394 16.9498 8.46447C17.3403 8.85499 17.3403 9.48816 16.9498 9.87868L11.2966 15.5318L11.2929 15.5355C11.1919 15.6365 11.0747 15.7114 10.9496 15.7602C10.7724 15.8292 10.5795 15.8459 10.3948 15.8101C10.2057 15.7735 10.0251 15.682 9.87868 15.5355L9.87489 15.5317L7.05028 12.7071C6.65975 12.3166 6.65975 11.6834 7.05028 11.2929C7.4408 10.9024 8.07397 10.9024 8.46449 11.2929L10.5858 13.4142L15.5355 8.46447Z" fill="aqua"/></svg>');--icon-background:rgba(255, 255, 255, 0.3);--support-button:aqua;--track-loader-color:#fff;--range-container:#3d3d3d;--audio-background:invert(0.9);--sb-track-color:#3a3a3a;--sb-thumb-color:#5d5d5d}[data-theme=theme-light]{--main-background:white;--main-floatboxes:linear-gradient(to bottom right, #ada996, #f2f2f2, #dbdbdb, #eaeaea);--pane-background:linear-gradient(to bottom right, #ada996, #f2f2f2, #dbdbdb, #eaeaea);--pane-boxshadow:rgba(0, 0, 0, 0.16) 0px 1px 4px;--float-boxsahdow:rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;--main-text-color:#111;--main-text-hover:rgba(0, 0, 0, 0.06);--main-confirm-boxshadow:rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;--main-confirm-background:#eaeaea;--menu-button-color:#111;--menu-button-hover:rgba(0, 0, 0, 0.06);--menu-checked-image:url('data:image/svg+xml,<svg width="18" height="18" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22ZM15.5355 8.46447C15.9261 8.07394 16.5592 8.07394 16.9498 8.46447C17.3403 8.85499 17.3403 9.48816 16.9498 9.87868L11.2966 15.5318L11.2929 15.5355C11.1919 15.6365 11.0747 15.7114 10.9496 15.7602C10.7724 15.8292 10.5795 15.8459 10.3948 15.8101C10.2057 15.7735 10.0251 15.682 9.87868 15.5355L9.87489 15.5317L7.05028 12.7071C6.65975 12.3166 6.65975 11.6834 7.05028 11.2929C7.4408 10.9024 8.07397 10.9024 8.46449 11.2929L10.5858 13.4142L15.5355 8.46447Z" fill="darkturquoise"/></svg>');--icon-background:#cecece;--support-button:blue;--track-loader-color:#111;--range-container:#eaeaea;--audio-background:invert(0);--sb-track-color:#ccc;--sb-thumb-color:#888}*{box-sizing:border-box;margin:0}#controls,.controls .volume.visible,.menu,body{display:flex}body{align-items:center;background:var(--main-background);color:var(--main-text-color);font:600 18px"Quicksand",sans-serif;flex-direction:column;overflow:hidden}*,.menu{padding:0;outline:0}.menu{background-color:transparent;border:0;cursor:pointer}.line{fill:none;stroke:var(--menu-button-color);stroke-width:6;transition:stroke-dasharray 600ms cubic-bezier(.4,0,.2,1),stroke-dashoffset 600ms cubic-bezier(.4,0,.2,1)}.line1{stroke-dasharray:60 207}.line1,.line2,.line3{stroke-width:6}.line2{stroke-dasharray:60 60}.line3{stroke-dasharray:60 207}.opened .line1{stroke-dasharray:90 207;stroke-dashoffset:-134;stroke-width:6}.opened .line2{stroke-dasharray:1 60;stroke-dashoffset:-30;stroke-width:6}.opened .line3{stroke-dasharray:90 207;stroke-dashoffset:-134;stroke-width:6}#controls{margin:1rem 0;gap:.5rem;justify-content:center}#main{display:grid;grid-template-columns:1fr 300px;grid-template-rows:auto 1fr;grid-template-areas:"header header""tracks player";gap:10px;width:100%;height:100%;padding:10px}#folder-tracks,#header{background:var(--pane-background);box-shadow:var(--pane-boxshadow);border-radius:4px}#header,#header section li a{gap:15px;align-items:center;display:flex}#header{grid-area:header;position:relative;padding:.5rem 1.5rem}#header h1{flex-grow:1;font-size:1.2rem;letter-spacing:1px}#header a{font-size:0;text-decoration:none}#header a svg{pointer-events:none;fill:var(--main-text-color);height:28px;width:28px}#header a svg.stroke{fill:none;stroke:var(--main-text-color)}#header section{background:var(--main-floatboxes);box-shadow:var(--float-boxsahdow);border-radius:4px;position:absolute;overflow:hidden;top:calc(100% + 5px);right:0;max-height:0;width:270px;transition:max-height .3s linear;z-index:2}#header section.visible{max-height:500px}#header section ul{list-style-type:none;margin:0;padding:0;width:100%}#header section li a{background:0 0;color:var(--main-text-color);padding:8px 16px;font-size:1rem;text-decoration:none;transition:.3s background linear;width:100%}#header section li a svg{pointer-events:none;width:20px;height:20px}#header section li a span{pointer-events:none;flex-grow:1}#header section li a:hover{background:var(--menu-button-hover)}#header section li a.active::after{background:var(--menu-checked-image);content:"";height:18px;width:18px}#folder-tracks{grid-area:tracks;overflow-y:auto;overflow-x:hidden;text-overflow:ellipsis;padding:.5rem;white-space:nowrap;-ms-overflow-style:none;scrollbar-width:none}#folder-tracks::-webkit-scrollbar{display:none}@supports not selector(::-webkit-scrollbar){#folder-tracks{scrollbar-color:var(--sb-thumb-color) var(--sb-track-color)}}.controls a,.track{border-radius:6px;text-decoration:none}.track{cursor:pointer;display:block;font-size:1rem;overflow:hidden;position:relative;padding:.5rem;font-weight:400;text-overflow:ellipsis;white-space:nowrap;width:100%}.track::before{box-sizing:border-box;display:inline-block;content:"";margin:0 5px;width:12px;height:12px}.track.loader::before{animation:rotation 1s linear infinite;border:1px solid var(--track-loader-color);border-bottom-color:transparent;border-radius:6px}.confirm div a::after,.confirm p::after,.track::after{content:attr(data-text)}.track.active{font-weight:700}.controls{gap:5px;align-items:center;justify-content:center;display:flex;width:100%}.controls a{color:currentColor;padding:6px;font-size:0}.controls a.active{background:var(--icon-background)}.controls a svg{fill:none;stroke:currentColor;pointer-events:none;height:20px;width:20px}.controls.top{width:auto}.controls.top a{padding:0}.controls.bottom{font:400 12px system-ui,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";font-variant-numeric:tabular-nums;position:absolute;padding:0 10px;bottom:.5rem;left:0}.controls.bottom>div:last-of-type{flex-grow:1;margin:0 0 3px 5px}.controls.bottom>div:last-of-type input[type=range]{width:100%}.controls .volume{background:var(--range-container);box-shadow:var(--pane-boxshadow);border-radius:4px;display:none;position:absolute;padding:16px;top:calc(100% + 5px);right:0;width:200px;z-index:1}.controls input[type=range]{-webkit-appearance:none;appearance:none;background:#fff;border-radius:2.5px;cursor:pointer}.controls input[type=range].horizontal{height:5px;width:100%}.controls input[type=range].vertical{writing-mode:vertical-lr;direction:rtl;height:200px;width:5px}.controls input[type=range]::-moz-range-thumb{background:var(--equalizer-range);border-radius:8px;margin-left:1px;width:16px;height:16px;border:0}.controls input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--equalizer-range);border-radius:8px;margin-left:1px;width:16px;height:16px;border:0}.playing{align-items:center;background:var(--pane-background);box-shadow:var(--pane-boxshadow);border-radius:4px;display:flex;flex-direction:column;gap:10px;grid-area:player;overflow:hidden;position:relative;justify-content:center;padding:.5rem}#cover-image{margin:25px 0;position:relative}#cover-image canvas{background-color:transparent;position:absolute;z-index:1;opacity:1;transition:all .3s ease-in-out;top:-60px;left:-60px}#cover-image img{width:120px;height:120px;border-radius:50%;object-fit:cover}#album-artist{font-size:1.2rem}#album-artist,#album-title,#track-title{font-weight:600;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:90%}#track-title{font-size:.85rem}#play-pause svg path{opacity:0;visibility:hidden;transition:.3s opacity,.3s visibility}#play-pause svg[data-button=pause] path:nth-child(2),#play-pause svg[data-button=pause] path:nth-child(3),#play-pause svg[data-button=play] path:nth-child(1){opacity:1;visibility:visible}#play-pause svg[data-button=pause] path:nth-child(1),#play-pause svg[data-button=play] path:nth-child(2),#play-pause svg[data-button=play] path:nth-child(3){opacity:0;visibility:hidden}.confirm,.equalizer,.version{align-items:center;position:absolute;justify-content:center;flex-direction:column;left:50%;padding:15px}.confirm{background:var(--main-confirm-background);border-bottom-right-radius:6px;border-bottom-left-radius:6px;box-shadow:var(--main-confirm-boxshadow);display:flex;gap:10px;top:-100%;max-width:280px;transition:.3s top linear;transform:translateX(-50%);z-index:2}.confirm.visible{top:0}.confirm p{color:var(--main-confirm-color);font-size:1rem}.confirm div{align-items:center;display:flex;gap:10px}.confirm div a{background:#1e90ff;border-radius:6px;color:#fff;padding:4px 8px;font-weight:700;text-align:center;text-decoration:none;width:100px}.equalizer,.version{background:var(--main-floatboxes);box-shadow:var(--float-boxsahdow);border-radius:6px;display:none;font:600 18px"Quicksand",sans-serif;gap:15px;top:50%;transform:translateX(-50%) translateY(-50%);z-index:3;width:400px}.equalizer.visible,.version.visible{display:flex}.version :not(a),.version :not(label){pointer-events:none}.equalizer>div,.equalizer>div div{gap:15px;align-items:center;justify-content:center;display:flex}.equalizer>div div{gap:10px;background:var(--range-container);box-shadow:var(--pane-boxshadow);border-radius:6px;flex-direction:column;padding:8px;width:45px}.equalizer>div div::after{content:attr(data-text);font-size:.8rem}.equalizer input[type=range]{-webkit-appearance:none;appearance:none;background:#fff;border-radius:2.5px;cursor:pointer;direction:rtl;height:200px;width:5px;writing-mode:vertical-lr}.equalizer input[type=range]::-moz-range-thumb{background:var(--equalizer-range);border-radius:8px;width:16px;height:16px;border:0}.equalizer input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--equalizer-range);border-radius:8px;width:16px;height:16px;border:0}.equalizer h2,.version h2{font-size:1.6rem;white-space:nowrap}.version p{font-size:.95rem;line-height:1.4;white-space:normal;word-wrap:break-word;overflow-wrap:anywhere;hyphens:auto}.version .outro{gap:15px;justify-content:center;font-size:.9rem}.version .outro,.version .outro div{align-items:center;display:flex}.version .outro img{border-radius:6px;height:20px;width:20px}.reset-btn{border-radius:4px;color:#fff;padding:8px 16px;font-size:1rem;text-align:center;text-decoration:none}.reset-btn,.reset-btn:active,.support-btn:visited{background:var(--equalizer-range)}.support-btn{font-size:.9rem}.support-btn,.support-btn:active,.support-btn:visited{color:var(--support-button)}@media (max-width:670px){#main{grid-template-columns:1fr;grid-template-rows:auto 1fr auto;grid-template-areas:"header""tracks""player"}#header section{width:100%}.controls.bottom{position:relative;bottom:0}.track{font-size:.9rem}.confirm{max-width:none;width:80%}.equalizer,.version{width:90%}}@media (max-width:460px){.equalizer>div{flex-direction:column}.equalizer>div div{flex-direction:row;padding:8px;width:auto}.equalizer>div div::after{font-size:.75rem;writing-mode:vertical-lr;direction:rtl}.equalizer input[type=range]{writing-mode:horizontal-tb;direction:ltr;height:5px;width:200px}}@media (max-width:370px){#header{padding:1rem}#header h1{font-size:.9rem}#header a svg{height:24px;width:24px}#elapsed{font-size:.8rem}}@media (max-width:300px){#elapsed{font-size:.6rem}}