.authentication{margin:.625rem;position:absolute}.authentication__message{font-optical-sizing:auto;font-variation-settings:"wdth" 100;padding:.5rem;font-family:Open Sans,sans-serif;font-size:.875rem;font-style:normal;font-weight:700}.authentication__message[data-type=success]{color:#a9dc76}.authentication__message[data-type=error]{color:#ff6188}.authentication__input-row{margin-bottom:.625rem}.authentication label{font-optical-sizing:auto;font-variation-settings:"wdth" 100;color:#1a1a1a;margin-right:.25rem;font-family:Open Sans,sans-serif;font-size:1.125rem;font-style:normal;font-weight:400}.authentication input{font-optical-sizing:auto;font-variation-settings:"wdth" 100;background-color:#e6e6e6;border:1px solid #b3b3b3;border-radius:.1875rem;padding:.25rem;font-family:Open Sans,sans-serif;font-size:1rem;font-style:normal;font-weight:400}.authentication button{font-optical-sizing:auto;font-variation-settings:"wdth" 100;cursor:pointer;background-color:#0000;border:1px solid #48a;border-radius:.1875rem;padding:.25rem .5rem;font-family:Open Sans,sans-serif;font-size:1rem;font-style:normal;font-weight:400;transition-property:color,background-color;transition-duration:.25s}.authentication button:hover,.authentication button:focus{color:#fff;background-color:#48a}.library{flex:auto;width:100%;height:100%;overflow:auto}.library__items{margin:0;padding:0;list-style:none}.library__item{border-bottom:1px solid #d9d9d9;align-items:center;padding:.125rem;display:flex}.library__item:hover{background-color:#d9d9d9}.library__item-image-area{display:inline-block;position:relative}.library__item-image{width:2rem;height:2rem;display:block}.library__item-image img{width:100%;height:100%;display:block}.library__item-play{color:#fff;cursor:pointer;opacity:0;background-color:#32323299;border:0;width:100%;height:100%;padding:0;transition-property:opacity;transition-duration:.25s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.library__item:hover .library__item-play{opacity:1}.library__item-play:hover,.library__item-play:focus{color:#fff}.library__item-play span{margin-left:.125rem}.library__item-title{font-optical-sizing:auto;font-variation-settings:"wdth" 100;margin-left:.25rem;font-family:Open Sans,sans-serif;font-size:.875rem;font-style:normal;font-weight:400}.library__item-additional-actions{margin-left:auto}.queue-item{opacity:.35;cursor:grab;background-color:#e6e6e6;border:1px solid #b3b3b3;border-width:1px 0;justify-content:start;align-items:center;transition:opacity .15s;display:flex;position:relative}.queue-item:active,.queue-item[data-is-dragging]{cursor:grabbing}.queue-item:not(:first-child){margin-top:-1px}.queue:not(:has([data-active=true])) .queue-item{opacity:1}.queue-item[data-active=true],.queue-item[data-active=true]~.queue-item,.queue-item:hover,.queue-item:focus{opacity:1}.queue-item[data-active=true]{background-color:#ccc}.queue-item__image{width:3.125rem;height:3.125rem;display:block;position:relative}.queue-item__playing-icon{justify-content:center;align-items:center;column-gap:.25rem;width:2.5rem;height:2.5rem;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.app:not([data-playing=true]) .queue-item__playing-icon div{max-height:20%}.queue-item__playing-icon div{background-color:#000;border-radius:.375rem;width:.1875rem;height:20%;max-height:80%;transition:max-height .5s;animation-name:sound-wave;animation-duration:1s;animation-timing-function:ease;animation-iteration-count:infinite}@keyframes sound-wave{0%{height:70%}50%{height:20%}to{height:80%}}.queue-item__playing-icon div:first-child{animation-delay:0s}.queue-item__playing-icon div:nth-child(2){animation-delay:-.5s}.queue-item__playing-icon div:nth-child(3){animation-delay:-.25s}.queue-item__playing-icon div:nth-child(4){animation-delay:-.75s}.queue-item__track-image{width:2.5rem;height:2.5rem;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.queue-item[data-active=true] .queue-item__track-image{display:none}.queue-item__track-image img{width:100%;height:100%;display:block}.queue-item__actions{margin-left:auto}.queue{width:25rem;height:calc(100vh - var(--player-bar-height));background-color:#e6e6e6;transition:width .25s;display:block;position:relative;overflow-y:auto}.queue__list{margin:0;padding:0;list-style:none}.queue__empty-message{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.queue__empty-message-text{font-optical-sizing:auto;font-variation-settings:"wdth" 100;color:gray;font-family:Open Sans,sans-serif;font-size:1rem;font-style:normal;font-weight:400}.queue-sidebar{width:0;height:calc(100vh - var(--player-bar-height));background-color:#e6e6e6;flex:none;margin:0;padding:0;list-style:none;transition:width .25s;display:block;overflow:hidden auto}.queue-sidebar[data-open]{width:25rem}.progress-bar{--seek-knob-left-percent:var(--seek-knob-percent,var(--progress-percent,0%));align-items:center;column-gap:.375rem;display:inline-block;position:relative}.progress-bar__bar-area{border-radius:.375rem;outline:0;width:18.75rem;height:.9375rem;margin-top:.125rem;padding:.375rem;position:relative}body[data-active-track] .progress-bar__bar-area{cursor:pointer}body[data-active-track] .progress-bar__bar-area:focus{outline:1px solid #e6e6e6}.progress-bar__bar{background-color:#e6e6e6;border-radius:.375rem;width:100%;height:100%;position:relative}.progress-bar__seek-knob{top:50%;left:var(--seek-knob-left-percent);opacity:0;z-index:3;background-color:#48a;border:0;border-radius:50%;outline:0 solid #e6e6e6;width:.875rem;height:.875rem;transition-property:opacity;transition-duration:.15s;transition-timing-function:linear;position:absolute;transform:translate(-50%,-50%)}body[data-active-track] .progress-bar__bar-area:hover .progress-bar__seek-knob,body[data-active-track] .progress-bar__bar-area:active .progress-bar__seek-knob,body[data-active-track] .progress-bar__bar-area:focus .progress-bar__seek-knob{opacity:1}.progress-bar__current-progress{width:var(--progress-percent,0%);z-index:1;background-color:#48a;border-radius:.375rem;height:100%;transition-property:width;transition-duration:.1s;transition-timing-function:linear;position:absolute;top:0;left:0}.progress-bar[data-instant-progress-bar-transition] .progress-bar__current-progress{transition-property:none}.progress-bar__current-duration,.progress-bar__total-duration{font-optical-sizing:auto;font-variation-settings:"wdth" 100;color:#fff;font-family:Open Sans,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;position:absolute;top:50%;transform:translateY(-50%)}.progress-bar__current-duration{right:calc(100% + .5rem)}.progress-bar__total-duration{left:calc(100% + .5rem)}.player{width:100%;height:var(--player-bar-height);background-color:#262626;justify-content:space-between;align-items:center;display:flex;position:fixed;bottom:0;box-shadow:0 0 .625rem .125rem #000}.player__spacer{width:100%;height:var(--player-bar-height)}.player__detail-area{flex-grow:1;flex-basis:0;align-items:center;column-gap:.25rem;height:100%;display:flex}.player__track-image{width:4rem;height:4rem;margin:.5rem;display:block}.player__track-image img{width:100%;height:100%;display:block}.player__text{flex-direction:column;row-gap:.375rem;display:flex}.player__title{font-optical-sizing:auto;font-variation-settings:"wdth" 100;color:#fff;font-family:Open Sans,sans-serif;font-size:1rem;font-style:normal;font-weight:400}.player__artist{font-optical-sizing:auto;font-variation-settings:"wdth" 100;color:#b3b3b3;font-family:Open Sans,sans-serif;font-size:.875rem;font-style:normal;font-weight:400}.player__control-buttons{justify-content:center;align-items:center;margin-bottom:.25rem;display:flex}.player__button-repeat{cursor:pointer;background-color:#0000;border:0;border-radius:50%;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;margin:0;padding:0;display:inline-flex;position:relative}.player__button-repeat:hover:not([disabled]):after,.player__button-repeat:focus:not([disabled]):after{box-shadow:0 0 1.25rem .3125rem #48a}.player__button-repeat:active:not([disabled]) .player__button-repeat-icon path{fill:#48a;transition-duration:0s}.player__button-repeat[disabled]{cursor:default}.player__button-repeat[disabled] .player__button-repeat-icon path{opacity:.5}.player__button-repeat-icon{display:block}.player__button-repeat-icon path{fill:#fff;transition:fill .15s}.player__button-repeat:after{content:"";width:0;height:0;box-shadow:var(--pulse,0);transition-property:box-shadow;transition-duration:.15s;transition-timing-function:ease;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.player__button-repeat:not([aria-label=repeat\ off]):after{box-shadow:0 0 1.25rem .3125rem #48a}.player__button-repeat:not([aria-label=repeat\ off]) .player__button-repeat-icon path{fill:#48a}.player__button-repeat-icon-1{opacity:0;transition:opacity .15s}.player__button-repeat[aria-label=repeat\ one] .player__button-repeat-icon-1{opacity:1}.player__button-skip-previous{cursor:pointer;background-color:#0000;border:0;border-radius:50%;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;margin:0;padding:0;display:inline-flex;position:relative}.player__button-skip-previous:hover:not([disabled]):after,.player__button-skip-previous:focus:not([disabled]):after{box-shadow:0 0 1.25rem .3125rem #48a}.player__button-skip-previous:active:not([disabled]) .player__button-skip-previous-icon path{fill:#48a;transition-duration:0s}.player__button-skip-previous[disabled]{cursor:default}.player__button-skip-previous[disabled] .player__button-skip-previous-icon path{opacity:.5}.player__button-skip-previous-icon{display:block}.player__button-skip-previous-icon path{fill:#fff;transition:fill .15s}.player__button-skip-previous:after{content:"";width:0;height:0;box-shadow:var(--pulse,0);transition-property:box-shadow;transition-duration:.15s;transition-timing-function:ease;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.player__button-play-pause{cursor:pointer;background-color:#48a;border:0;border-radius:50%;width:2.5rem;height:2.5rem;margin:0 .5rem;padding:0;transition:box-shadow .15s;display:inline-block;position:relative}.player__button-play-pause:hover{box-shadow:0 0 .625rem 0 #48a}.player__button-play-pause[disabled]{cursor:default;background-color:#8c8c8c}.player__button-play-pause[disabled]:hover{box-shadow:none}.player__button-play-icon,.player__button-pause-icon{opacity:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.player__button-play-icon path,.player__button-pause-icon path{fill:#fff}.player__button-play-icon{margin-left:.0625rem}.player__button-play-pause[aria-label=play] .player__button-play-icon{opacity:1}.player__button-pause-icon{margin-left:.0625rem}.player__button-play-pause[aria-label=pause] .player__button-pause-icon{opacity:1}.player__button-skip-next{cursor:pointer;background-color:#0000;border:0;border-radius:50%;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;margin:0;padding:0;display:inline-flex;position:relative}.player__button-skip-next:hover:not([disabled]):after,.player__button-skip-next:focus:not([disabled]):after{box-shadow:0 0 1.25rem .3125rem #48a}.player__button-skip-next:active:not([disabled]) .player__button-skip-next-icon path{fill:#48a;transition-duration:0s}.player__button-skip-next[disabled]{cursor:default}.player__button-skip-next[disabled] .player__button-skip-next-icon path{opacity:.5}.player__button-skip-next-icon{display:block}.player__button-skip-next-icon path{fill:#fff;transition:fill .15s}.player__button-skip-next:after{content:"";width:0;height:0;box-shadow:var(--pulse,0);transition-property:box-shadow;transition-duration:.15s;transition-timing-function:ease;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.player__button-skip-next svg{transform:scale(-1)}.player__button-shuffle{cursor:pointer;background-color:#0000;border:0;border-radius:50%;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;margin:0;padding:0;display:inline-flex;position:relative}.player__button-shuffle:hover:not([disabled]):after,.player__button-shuffle:focus:not([disabled]):after{box-shadow:0 0 1.25rem .3125rem #48a}.player__button-shuffle:active:not([disabled]) .player__button-shuffle-icon path{fill:#48a;transition-duration:0s}.player__button-shuffle[disabled]{cursor:default}.player__button-shuffle[disabled] .player__button-shuffle-icon path{opacity:.5}.player__button-shuffle-icon{display:block}.player__button-shuffle-icon path{fill:#fff;transition:fill .15s}.player__button-shuffle:after{content:"";width:0;height:0;box-shadow:var(--pulse,0);transition-property:box-shadow;transition-duration:.15s;transition-timing-function:ease;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.player__button-shuffle[aria-label=shuffled]:after{box-shadow:0 0 1.25rem .3125rem #48a}.player__button-shuffle[aria-label=shuffled] .player__button-shuffle-icon path{fill:#48a}.player__utility-area{flex-grow:1;flex-basis:0;justify-content:end;align-items:center;display:flex}.player__button-volume-toggle{cursor:pointer;background-color:#0000;border:0;border-radius:50%;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;margin:0;padding:0;display:inline-flex;position:relative}.player__button-volume-toggle:hover:not([disabled]):after,.player__button-volume-toggle:focus:not([disabled]):after{box-shadow:0 0 1.25rem .3125rem #48a}.player__button-volume-toggle:active:not([disabled]) .player__button-volume-toggle-icon path{fill:#48a;transition-duration:0s}.player__button-volume-toggle[disabled]{cursor:default}.player__button-volume-toggle[disabled] .player__button-volume-toggle-icon path{opacity:.5}.player__button-volume-toggle-icon{display:block}.player__button-volume-toggle-icon path{fill:#fff;transition:fill .15s}.player__button-volume-toggle:after{content:"";width:0;height:0;box-shadow:var(--pulse,0);transition-property:box-shadow;transition-duration:.15s;transition-timing-function:ease;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.player__button-volume-toggle-icon-sound-wave,.player__button-volume-toggle-icon-x{opacity:0;transition:opacity .15s}.player__button-volume-toggle[aria-label=mute] .player__button-volume-toggle-icon-sound-wave,.player__button-volume-toggle[aria-label=unmute] .player__button-volume-toggle-icon-x{opacity:1}.player__volume-input-range{--track-color:#e6e6e6;appearance:none;cursor:pointer;background-color:#0000;border-radius:.375rem;width:4.6875rem;height:.1875rem;display:inline-block;position:relative}.player__volume-input-range::-webkit-slider-runnable-track{background-color:#0000;border-radius:.375rem;height:.1875rem}.player__volume-input-range::-moz-range-track{background-color:#0000;border-radius:.375rem;height:.1875rem}.player__volume-input-range::-webkit-slider-thumb{appearance:none;background-color:#48a;border:0;border-radius:50%;width:.875rem;height:.875rem;margin-top:-5.5px}.player__volume-input-range::-moz-range-thumb{appearance:none;background-color:#48a;border:0;border-radius:50%;width:.875rem;height:.875rem}.player__button-queue{cursor:pointer;background-color:#0000;border:0;border-radius:50%;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;margin:0;padding:0;display:inline-flex;position:relative}.player__button-queue:hover:not([disabled]):after,.player__button-queue:focus:not([disabled]):after{box-shadow:0 0 1.25rem .3125rem #48a}.player__button-queue:active:not([disabled]) .player__button-queue-icon path{fill:#48a;transition-duration:0s}.player__button-queue[disabled]{cursor:default}.player__button-queue[disabled] .player__button-queue-icon path{opacity:.5}.player__button-queue-icon{display:block}.player__button-queue-icon path{fill:#fff;transition:fill .15s}.player__button-queue:after{content:"";width:0;height:0;box-shadow:var(--pulse,0);transition-property:box-shadow;transition-duration:.15s;transition-timing-function:ease;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.player__button-queue{margin-left:.5rem;margin-right:.5rem}.player__button-queue[aria-label="close queue sidebar"]:after{box-shadow:0 0 1.25rem .3125rem #48a}.player__button-queue[aria-label="close queue sidebar"] .player__button-queue-icon path{fill:#48a}:root{--player-bar-height:5rem;--color-accent-a:#48a}*{box-sizing:border-box}body{margin:0;padding:0}.app__main{width:100%;height:calc(100vh - var(--player-bar-height));display:flex}
