.music-area iframe{background-color:var(--bg);border-radius:1rem;box-shadow:0 2px 8px #0000000f;overflow:hidden;aspect-ratio:16/9;transition:transform .3s cubic-bezier(.4,0,.2,1),box-shadow .3s cubic-bezier(.4,0,.2,1);animation:scale-in .5s .3s cubic-bezier(.4,0,.2,1) backwards}@media (prefers-color-scheme: dark){.music-area iframe{box-shadow:0 2px 8px #0003}}.music-area iframe:nth-child(1){animation-delay:.05s}.music-area iframe:nth-child(2){animation-delay:.1s}.music-area iframe:nth-child(3){animation-delay:.15s}.music-area iframe:nth-child(4){animation-delay:.2s}.music-area iframe:nth-child(5){animation-delay:.25s}.music-area iframe:nth-child(6){animation-delay:.3s}.music-area iframe:nth-child(7){animation-delay:.35s}.music-area iframe:nth-child(8){animation-delay:.4s}.music-area iframe:nth-child(9){animation-delay:.45s}.music-area iframe:nth-child(10){animation-delay:.5s}.music-area iframe:nth-child(11){animation-delay:.55s}.music-area iframe:nth-child(12){animation-delay:.6s}.music-area iframe:nth-child(13){animation-delay:.65s}.music-area iframe:nth-child(14){animation-delay:.7s}.music-area iframe:nth-child(15){animation-delay:.75s}.music-area iframe:nth-child(16){animation-delay:.8s}.music-area iframe:nth-child(17){animation-delay:.85s}.music-area iframe:nth-child(18){animation-delay:.9s}.music-area iframe:nth-child(19){animation-delay:.95s}.music-area iframe:nth-child(20){animation-delay:1s}.music-area iframe:hover{transform:translateY(-4px);box-shadow:0 8px 24px #0000001f}@media (prefers-color-scheme: dark){.music-area iframe:hover{box-shadow:0 8px 24px #0000004d}}@media (prefers-reduced-motion: reduce){.music-area iframe{animation:fade-in .3s ease;transition-duration:.1s}.music-area iframe:hover{transform:none;transition-duration:.1s}}@keyframes scale-in{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}.large-frame{position:relative;box-sizing:border-box;max-width:100%;aspect-ratio:var(--ar, 2);background-position:center;background-repeat:no-repeat;background-size:contain;background-color:var(--bg);border-radius:1rem;box-shadow:0 2px 8px #0000000f;overflow:hidden;overflow:clip;isolation:isolate;transition:transform .3s cubic-bezier(.4,0,.2,1),box-shadow .3s cubic-bezier(.4,0,.2,1);animation:scale-in .5s .3s cubic-bezier(.4,0,.2,1) backwards}@media (prefers-color-scheme: dark){.large-frame{box-shadow:0 2px 8px #0003}}.large-frame:nth-child(1){animation-delay:.05s}.large-frame:nth-child(2){animation-delay:.1s}.large-frame:nth-child(3){animation-delay:.15s}.large-frame:nth-child(4){animation-delay:.2s}.large-frame:nth-child(5){animation-delay:.25s}.large-frame:nth-child(6){animation-delay:.3s}.large-frame:nth-child(7){animation-delay:.35s}.large-frame:nth-child(8){animation-delay:.4s}.large-frame:nth-child(9){animation-delay:.45s}.large-frame:nth-child(10){animation-delay:.5s}.large-frame:nth-child(11){animation-delay:.55s}.large-frame:nth-child(12){animation-delay:.6s}.large-frame:nth-child(13){animation-delay:.65s}.large-frame:nth-child(14){animation-delay:.7s}.large-frame:nth-child(15){animation-delay:.75s}.large-frame:nth-child(16){animation-delay:.8s}.large-frame:nth-child(17){animation-delay:.85s}.large-frame:nth-child(18){animation-delay:.9s}.large-frame:nth-child(19){animation-delay:.95s}.large-frame:nth-child(20){animation-delay:1s}.large-frame>*,.large-frame:before,.large-frame:after{position:absolute;inset:0;margin:auto}.large-frame .checker{appearance:none}.large-frame:has(.checker:not(:checked)){cursor:pointer}.large-frame:has(.checker:checked){pointer-events:none}.large-frame .checker:checked~:not(.checker):not(.frame):before,.large-frame .checker:checked~:not(.checker):not(.frame):after,.large-frame:has(.checker:checked):before,.large-frame:has(.checker:checked):after{display:none}.large-frame .checker:not(:checked)~.frame{display:none}.large-frame .img{display:block;width:100%;background-image:var(--bg);background-size:cover;background-position:center;background-repeat:no-repeat;z-index:1}.large-frame .info{padding:1rem;width:100%;height:100%;background-color:hsla(0,0%,var(--bg-lightness),.75);opacity:0;user-select:none;display:flex;flex-direction:column;gap:.5rem;transition:opacity .5s;z-index:2}.large-frame .info>*{margin-block:0;white-space:nowrap;overflow-x:hidden;text-overflow:ellipsis}@supports (overflow-x: clip){.large-frame .info>*{overflow-x:clip}}.large-frame .frame{box-sizing:inherit;max-width:unset;aspect-ratio:unset;background-color:#000;background-position:unset;background-repeat:unset;background-size:unset;border:none;border-radius:0;pointer-events:all;z-index:4}.large-frame:hover{transform:translateY(-4px);box-shadow:0 8px 24px #0000001f}@media (prefers-color-scheme: dark){.large-frame:hover{box-shadow:0 8px 24px #0000004d}}.large-frame:hover .info{opacity:1}.large-frame:hover:after{opacity:1}.large-frame:before,.large-frame:after{content:"";height:25%;aspect-ratio:1;clip-path:polygon(10% 0,90% 50%,10% 100%);z-index:3}.large-frame:before{background-color:#8b0000}.large-frame:after{opacity:0;background-color:hsla(0,0%,var(--color-lightness),1);transition:opacity .5s}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion: reduce){.large-frame{animation:fade-in .3s ease;transition-duration:.1s}.large-frame:hover{transform:none;transition-duration:.1s}.large-frame .info{transition-duration:.1s}.large-frame:after{transition-duration:.1s}}.videos.grid{margin-inline:auto;width:min(100%,100rem)}
