.album-player{--track-list-blur:0;--blur-screen-blur:1em;--theme-a:#216f95;--bg-a:#0b0e11;--bg-b:#1c1e21;--bg-d:#4b4b59;--fg-a:#fff;--fg-b:#dfe1e9;--fg-d:#acacb4;--font-xs:.875em;--font-sm:1em;--font-a:Assistant,sans-serif;--font-d:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif;--radius:0px;--radius-lg:0px;--control-height:14px;font-size:1em;letter-spacing:.13em;line-height:calc(1 + .2/var(--font-body-scale));margin-bottom:3em;max-width:50em}.album-player :focus-visible{border-radius:.25em;outline:1px solid var(--theme-a)}.album-player *{border:none!important;font:revert;outline-color:var(--theme-a);outline-width:1px}.album-player .track-list{-webkit-backdrop-filter:blur(var(--track-list-blur,1em));backdrop-filter:blur(var(--track-list-blur,1em))}.album-player .blur-screen{-webkit-backdrop-filter:blur(var(--blur-screen-blur,1em));backdrop-filter:blur(var(--blur-screen-blur,1em));display:block}.album-player .col,.album-player .row{align-items:center;display:flex;gap:.5em;width:100%}.album-player .row{flex-direction:row}.album-player .col{flex-direction:column;justify-content:center}.album-player path,.album-player svg{outline:none!important;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.album-player{align-items:center;animation:fade-in 1s .5s forwards;background:color-mix(in lab,var(--bg-a),transparent 75%);box-sizing:border-box;color:var(--fg-a);display:flex;flex-direction:column;justify-content:space-between;margin:auto;max-width:95vw;min-width:min(100%,95vw);opacity:.01;outline:1px solid color-mix(in lab,var(--fg-d),transparent 90%);padding:.5em;position:relative;touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%;-webkit-tap-highlight-color:transparent}.album-player h2.title{color:var(--fg-a);font-size:var(--font-sm);font-variation-settings:"wght" 100;font-weight:700;letter-spacing:-.5px;width:100%}.album-player .player-controls{border-radius:var(--radius-lg);box-sizing:border-box;display:flex;gap:.5em;margin:auto auto .5em;padding:.5em;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%;z-index:2}@media (max-width:768px){.album-player .player-controls{margin-bottom:.25em;padding:.1rem .1rem .25rem 0}}.album-player .player-controls>.row{gap:1.5em}@media (max-width:768px){.album-player .player-controls>.row{gap:1.25em}}.album-player .visualization{contain:content;height:100%;left:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0;width:100%;z-index:1}.album-player .play-pause-icon{--size:1.6em;cursor:pointer;height:var(--size);max-height:var(--size);max-width:var(--size);padding:0;transition:transform .15s ease-out;width:var(--size)}.album-player .play-pause-icon:focus-visible{outline:1px solid var(--theme-a)}.album-player .play-pause-icon>div{outline:none!important}.album-player .play-pause-icon path,.album-player .play-pause-icon svg{height:var(--size);width:var(--size)}.album-player .play-pause-icon .play:hover{scale:1.1}.album-player .play-pause-icon .pause{display:none}.album-player .playpause:hover{filter:brightness(1.2)}.album-player .progress{width:100%;z-index:15}.album-player .right{width:-moz-max-content;width:max-content}.album-player .track-list{background:color-mix(in lab,var(--bg-d),transparent 75%);border-radius:var(--radius);color:var(--fg-a);cursor:pointer;list-style:none;max-height:16.7em;overflow-x:hidden;overflow-y:scroll;scrollbar-gutter:stable;width:100%;z-index:2}.album-player .track-list::-webkit-scrollbar{width:6px}.album-player .track-list::-webkit-scrollbar-track{border-radius:3px}.album-player .track-list::-webkit-scrollbar-thumb{background-color:var(--bg-a);border-radius:3px}.album-player .track-list::-webkit-scrollbar-thumb:hover{outline:2px solid color-mix(in lab,var(--bg-d),transparent 75%);outline-offset:-1px}.album-player .track-item{align-items:center;background:color-mix(in oklab,var(--bg-a),transparent 15%);color:var(--fg-b);cursor:pointer;display:flex;height:40px;justify-content:center;margin-right:1em;outline-offset:-1px;overflow-x:auto;overflow-y:hidden;padding:.75rem 1em;text-align:left;transition:.25s cubic-bezier(.23,1,.32,1);white-space:nowrap;width:100%;z-index:3}.album-player .track-item::-webkit-scrollbar{height:2px}.album-player .track-item:focus-visible{background:color-mix(in oklab,var(--bg-a),transparent 90%)}.album-player .track-item.active{background:color-mix(in oklab,var(--bg-a),transparent 50%);color:var(--theme-a);filter:brightness(1.1)}.album-player .track-item.active .title{font-weight:700}.album-player .track-item.active .duration{color:var(--theme-a)}.album-player[data-playing=true] .track-item.active{background:color-mix(in oklab,var(--bg-b),transparent 80%)}@media (hover:hover){.album-player .track-item:hover{background:color-mix(in oklab,var(--bg-a),transparent 90%)}}.album-player .track-item.active .track-number{opacity:1}.album-player .track-number{font-variant-numeric:tabular-nums;opacity:.5;width:1.5em}.album-player .title{all:unset;padding-left:.5em;color:var(--fg-a);flex:1;font-weight:400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (max-width:768px){.album-player .title{padding-left:.25em}}.album-player .preview{color:var(--bg-d);font-style:italic;margin-left:auto;padding-left:1em}.album-player .duration{color:var(--fg-d);font-variant-numeric:tabular-nums;margin-left:1em;min-width:2.5em;text-align:right}.album-player .progress-bar{background:color-mix(in lab,var(--bg-d),transparent 50%);border-radius:2px;cursor:pointer;display:flex;height:var(--control-height);overflow:hidden;position:relative;transition:.15s;width:100%}.album-player .progress-bar:hover{background:color-mix(in lab,var(--fg-d),transparent 75%)}.album-player[data-playing=true] .progress-bar{background:color-mix(in oklab,var(--fg-d),transparent 75%)}@media (hover:hover){.album-player[data-playing=true] .progress-bar:hover{background:color-mix(in oklab,var(--fg-d),transparent 60%)}}.album-player .progress-bar-fill{background:var(--theme-a);border-radius:2px;display:block;height:100%;left:0;position:absolute;top:0;transition:width .1s linear}.album-player .progress-bar:active .progress-bar-fill{background:color-mix(in hsl,var(--theme-a),#fff 25%)}.album-player .play-pause-icon .pause,.album-player .playpause.playing .play{display:none}.album-player .playpause.playing .pause{display:block}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.album-player .volume-control-wrapper{align-items:center;display:flex;gap:.5em;height:10px;justify-content:center;min-width:100px;width:140px}@media (max-width:768px){.album-player .volume-control-wrapper{gap:.25em;width:110px}}.album-player .volume-icon{color:var(--fg-d);--size:1.25em;cursor:pointer;height:var(--size);max-width:var(--size);min-width:var(--size);width:var(--size)}.album-player .volume-icon .wave{opacity:1}.album-player .volume-icon .wave,.album-player .volume-icon line{transition:opacity .1s ease}.album-player .volume-icon line{color:tomato;opacity:0}.album-player .volume-icon .icon{cursor:pointer;transition:color .15s ease}.album-player .volume-icon .icon:hover{color:var(--fg-b)}.album-player .volume-icon:hover .icon{color:var(--fg-a)}.album-player .volume-icon.muted{opacity:.75}.album-player .volume-icon.muted .wave{opacity:0}.album-player .volume-icon.muted line{opacity:1}.album-player .volume-control{--thumb-size:13px;accent-color:var(--theme-a);-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border-radius:1em;cursor:pointer;height:var(--control-height);outline:none;overflow:hidden;transition:background .1s ease;width:100%}.album-player .volume-control:focus-visible{outline:1px solid var(--theme-a)}.album-player .volume-control::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--theme-a)!important;border-radius:50%;cursor:pointer;height:var(--thumb-size);width:var(--thumb-size)}.album-player .volume-control::-webkit-slider-runnable-track{background:color-mix(in hsl,var(--bg-d),transparent 50%);min-height:var(--control-height);-webkit-transition:background .1s ease;transition:background .1s ease}@media (hover:hover){.album-player .volume-control:hover::-webkit-slider-runnable-track{background:color-mix(in lab,var(--fg-d),transparent 75%)}}.album-player .volume-control:focus-visible::-webkit-slider-runnable-track{background:color-mix(in lab,var(--fg-d),transparent 75%)}.album-player .volume-control:active::-webkit-slider-thumb{accent-color:color-mix(in hsl,var(--theme-a),#fff 25%)!important;background:color-mix(in hsl,var(--theme-a),#fff 25%)!important}.album-player[data-playing=true] .volume-control::-webkit-slider-runnable-track{background:color-mix(in lab,var(--fg-d),transparent 75%)}.visualization-wrapper{contain:content;height:100%;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.visualization-canvas{box-sizing:border-box;height:100%;opacity:.5;width:100%;z-index:69}.blur-screen{background-color:transparent;top:0;right:0;bottom:0;left:0;opacity:1;position:absolute;transform:translateZ(0);will-change:transform}