.vinyls-header{margin-bottom:2rem}.discogs-link{--tw-text-opacity:1;color:rgb(var(--accent)/var(--tw-text-opacity, 1))}.discogs-link:hover{text-decoration-line:underline}.vinyls-section{margin-bottom:4rem}.vinyls-container{position:relative;width:100%;min-height:700px;border-radius:16px;overflow:hidden}.collection-label{position:absolute;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;background-color:rgb(var(--bg-dark)/.95);--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity, 1));border-radius:var(--radius-lg);padding:1rem 1.5rem;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none}.label-text{font-size:1.25rem;line-height:1.75rem;font-weight:600;letter-spacing:.025em}.label-action{font-size:.875rem;line-height:1.25rem;letter-spacing:.05em;--tw-text-opacity:1;color:rgb(var(--text-secondary)/var(--tw-text-opacity, 1))}.vinyl-card{position:absolute;cursor:grab;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:180px;height:180px;border-radius:4px;overflow:hidden;box-shadow:0 4px 20px #0000004d,0 2px 8px #0003;transition:box-shadow .2s ease,transform .1s ease;opacity:0}.vinyl-card--skeleton,.vinyl-card.positioned{opacity:1}.vinyl-card:hover{box-shadow:0 8px 30px #0006,0 4px 12px #0000004d}.vinyl-card.dragging{cursor:grabbing;box-shadow:0 12px 40px #00000080,0 6px 16px #0006;transform:scale(1.05)!important}.vinyl-cover{height:100%;width:100%;-o-object-fit:cover;object-fit:cover;pointer-events:none}.vinyl-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:.5rem;background-color:#0000;opacity:0;text-align:center;--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity, 1));transition:all .2s ease;pointer-events:none}.vinyl-card:hover .vinyl-overlay{background-color:#000000b3;opacity:1}.vinyl-title{margin-bottom:.25rem;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:.875rem;line-height:1.25rem;font-weight:700}.vinyl-artist{font-size:.75rem;line-height:1rem;color:#fffc}.vinyl-year{margin-top:.25rem;font-size:.75rem;line-height:1rem;color:#fff9}.vinyl-modal{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;display:none;animation:vinyl-fade-in .25s ease forwards;z-index:9999;height:100vh;height:100dvh}.vinyl-modal.active{display:flex}.vinyl-modal.closing{animation:vinyl-fade-out .25s ease forwards}@keyframes vinyl-fade-in{0%{opacity:0}to{opacity:1}}@keyframes vinyl-fade-out{0%{opacity:1}to{opacity:0}}.vinyl-modal-content{position:relative;display:flex;flex-direction:column;align-items:center;gap:1.5rem}@media (min-width:768px){.vinyl-modal-content{flex-direction:row}}.vinyl-modal-content{border-radius:var(--radius-2xl);padding:1.5rem}@media (min-width:768px){.vinyl-modal-content{padding:2rem}}.vinyl-modal-content{margin-left:1rem;margin-right:1rem;width:100%;max-width:42rem;border-width:1px;border-color:rgb(var(--text-secondary)/.2);background:rgb(var(--bg-card));box-shadow:var(--shadow-xl);max-height:90vh;overflow-y:auto;overscroll-behavior:contain;animation:modal-pop-in .38s cubic-bezier(.34,1.56,.64,1) forwards}.vinyl-modal.closing .vinyl-modal-content{animation:modal-pop-out .25s ease forwards}.vinyl-modal-close{position:absolute;top:1rem;right:1rem;z-index:10;display:flex;height:1.75rem;width:1.75rem;flex-shrink:0;align-items:center;justify-content:center;border-radius:var(--radius-md);--tw-text-opacity:1;color:rgb(var(--text-secondary)/var(--tw-text-opacity, 1))}.vinyl-modal-close:hover{background-color:rgb(var(--text-secondary)/.1);--tw-text-opacity:1;color:rgb(var(--text-primary)/var(--tw-text-opacity, 1))}.vinyl-modal-close{cursor:pointer;border-width:0;background-color:transparent;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.vinyl-modal-cover{height:12rem;width:12rem;border-radius:var(--radius-lg);-o-object-fit:cover;object-fit:cover}@media (min-width:768px){.vinyl-modal-cover{height:16rem;width:16rem}}.vinyl-modal-cover{flex-shrink:0;box-shadow:0 8px 30px #0006}.vinyl-modal-info{flex:1 1 0%;--tw-text-opacity:1;color:rgb(var(--text-primary)/var(--tw-text-opacity, 1))}.vinyl-modal-title{margin-bottom:.5rem;font-size:1.5rem;line-height:2rem;font-weight:700;--tw-text-opacity:1;color:rgb(var(--text-primary)/var(--tw-text-opacity, 1))}@media (min-width:768px){.vinyl-modal-title{font-size:1.875rem;line-height:2.25rem}}.vinyl-modal-artist{margin-bottom:1rem;font-size:1.125rem;line-height:1.75rem;--tw-text-opacity:1;color:rgb(var(--text-secondary)/var(--tw-text-opacity, 1))}.vinyl-modal-meta{margin-bottom:1rem;display:flex;align-items:center;gap:1rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity:1;color:rgb(var(--text-secondary)/var(--tw-text-opacity, 1))}.vinyl-modal-meta-item:not(:empty):before{content:"";margin-right:.5rem;display:inline-block;height:.25rem;width:.25rem;border-radius:9999px;background-color:rgb(var(--text-secondary)/.4);vertical-align:middle}.vinyl-modal-meta-item:first-child:not(:empty):before{display:none}.vinyl-modal-genres{display:flex;flex-wrap:wrap;gap:.5rem}.genre-tag{border-radius:9999px;padding:.25rem .75rem;font-size:.75rem;line-height:1rem;background-color:rgb(var(--text-secondary)/.1);--tw-text-opacity:1;color:rgb(var(--text-primary)/var(--tw-text-opacity, 1));border-width:1px;border-color:rgb(var(--text-secondary)/.2)}@media (max-width:768px){.vinyls-container{min-height:800px}.vinyl-card{width:120px;height:120px}}@media (max-width:480px){.vinyl-card{width:100px;height:100px}.vinyls-container{min-height:700px}}