html{font-size:1rem}a{--pico-text-decoration:none}#grid{display:grid;height:100vh;padding-block:0}@media(min-width:1280px){#grid{border:2px solid var(--pico-muted-color)}}#list{padding-left:0;height:100%;overflow-y:scroll;counter-reset:list}#list li>span,#list small:nth-last-of-type(n+3){display:inline-block;text-align:right;width:3ch}#list small:nth-last-of-type(5){width:3.7ch}#list small:nth-last-of-type(4){width:2.7ch}#list small:nth-last-of-type(2){padding-right:.5ch}#list small:last-of-type{padding-left:.7ch}#list li{counter-increment:list;cursor:pointer;border:1px solid rgba(0,0,0,0);border-radius:var(--pico-border-radius);margin:0;padding-left:.5rem;list-style-position:inside;list-style-type:"\2726\202F"}#list li>a:active{pointer-events:none}#list li:hover{background:var(--pico-background-color);filter:invert(1) hue-rotate(180deg);transition:all .5s cubic-bezier(.77,0,.175,1)}#list li:focus-visible{outline:medium solid var(--pico-color);outline-offset:-2px}#list li[data-rate]{list-style-type:"\202F\01D11E\00A0"}#list li[data-rate=gold]::marker{color:#daa520}#list li[data-rate=silver]::marker{color:var(--pico-code-color)}#list li[data-rate=bronze]::marker{color:var(--pico-del-color)}.up,.down,.same,.new{background:center/1em no-repeat;display:inline-block;width:3ch}.up{background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36"><rect width="36" height="36" rx="4" ry="4" fill="%233B88C3"/><path fill="white" d="M22 29v-9h7L18 7 7 20h7v9z"/></svg>')}.down{background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36"><rect width="36" height="36" rx="4" ry="4" fill="%233B88C3"/><path fill="white" d="M22 7v9h7L18 29 7 16h7V7z"/></svg>')}.same{background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36"><rect width="36" height="36" rx="4" ry="4" fill="%233B88C3"/><path fill="white" d="M13 9L3 18l10 9zm20 9L23 9v18z"/><path fill="%23FFF" d="M12 14h12v8H12z"/></svg>')}.new{background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36"><rect width="36" height="36" rx="4" ry="4" fill="%2377B255"/><path d="m8.2 21 7.2 6.8m0 0L27.9 8.5" stroke="white" stroke-width="5" stroke-linecap="round"/></svg>')}#filter{display:none;grid-area:1/1/2/2;text-align:center;white-space:nowrap;border-bottom:2px solid var(--pico-muted-color)}@supports selector(:has(*)){#filter{display:block}#list li{display:none}:has(#gold:checked)+#list li[data-rate=gold]{display:list-item}:has(#silver:checked)+#list li[data-rate=silver]{display:list-item}:has(#bronze:checked)+#list li[data-rate=bronze]{display:list-item}:not(:has(#silver:checked,#gold:checked,#bronze:checked))+#list li{display:list-item}:has(#numbers:checked)+#list li::before,li span{content:counter(list) " ";text-shadow:1px 1px 1px var(--pico-muted-color)}:has(.years:checked)+#list li{list-style-type:none}:has(.years:checked)+#list li::before{content:""}:not(:has(#album:checked))+#list small:nth-last-of-type(1){display:none}}#player,#ytframe{height:100%;width:100%}#info{overflow-y:scroll}#info h1{text-align:center}#info img{height:auto;float:right;max-width:100%;border-radius:var(--pico-border-radius);background-color:var(--pico-primary-inverse);margin:0 0 1rem 1rem}#info time{font-style:italic;font-weight:700;margin-right:.5rem}#info [data-theme=light] #info article{background-color:hsla(0,0%,100%,.85)}#info [data-theme=dark] #info article{background-color:rgba(0,0,0,.7)}@media(min-width:601px){#grid{grid-template-columns:1fr 5px 3fr;grid-template-rows:26px 2fr 5px 1fr}#list{grid-area:2/1/5/2}#gutter1{grid-area:1/2/5/3}#player{grid-area:1/3/3/4}#gutter2{grid-area:3/3/4/4}#info{grid-area:4/3/5/4}}@media(max-width:600px){#grid{grid-template-columns:1fr;grid-template-rows:0fr 1fr 5px 1fr 5px 1fr}#list{grid-area:2/1/3/2}#gutter1{grid-area:3/1/4/2}#player{grid-area:4/1/5/2}#gutter2{grid-area:5/1/6/2}#info{grid-area:6/1/7/2}}.gutter{background-color:var(--pico-secondary);display:flex;align-items:center;justify-content:center;user-select:none;touch-action:none}.gutter::after{content:"";background:rgba(0,0,0,.4);border-radius:2px}.gutter[data-direction=horizontal]{cursor:col-resize}.gutter[data-direction=horizontal]::after{width:2px;height:25%}.gutter[data-direction=vertical]{cursor:row-resize}.gutter[data-direction=vertical]::after{height:2px;width:25%}.gutter:active,.gutter:hover{background-color:var(--pico-primary-hover-border)}.is-dragging-x{transform:scaleX(3);background-color:var(--pico-primary-hover-border)}.is-dragging-y{transform:scaleY(3);background-color:var(--pico-primary-hover-border)}.selected{background:var(--pico-form-element-selected-background-color);filter:invert(1) hue-rotate(180deg)}.loading{display:flex;align-items:center;justify-content:center;height:100%;color:var(--pico-muted-color)}