.swipe-overlay-page{overflow:hidden;background:#05070d;color:#fff}
.swipe-overlay-page>.site-header,.swipe-overlay-page>.site-footer,.swipe-overlay-page>.site-notice,.swipe-overlay-page>.skip-link{visibility:hidden}
.collection-swiper-overlay{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;overflow:hidden;min-height:100vh;min-height:100dvh;background:#05070d;color:#fff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
.collection-swiper-background{position:absolute;inset:-5px;background:#05070d center/cover no-repeat;filter:blur(3px) brightness(.98) saturate(2.15);transform:scale(1.02);transition:background-image .45s ease}
.collection-swiper-scrim{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(0,0,0,0),rgba(0,0,0,.14)),linear-gradient(180deg,rgba(3,6,14,.04),rgba(3,6,14,.1));pointer-events:none}
.collection-swiper-corner{position:absolute;top:20px;z-index:10;display:grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid rgba(255,255,255,.15);border-radius:50%;background:rgba(255,255,255,.1);color:#fff;backdrop-filter:blur(8px);cursor:pointer;text-decoration:none;transition:background .18s ease,transform .18s ease}
.collection-swiper-corner:hover{background:rgba(255,255,255,.18);transform:scale(1.04)}
.collection-swiper-close{left:20px}.collection-swiper-options-button{right:20px}
.collection-swipe-hints{position:absolute;inset:0;z-index:4;pointer-events:none}
.collection-swipe-hints span{position:absolute;color:rgba(255,255,255,.3);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.collection-swipe-hints .hint-left{left:24px;top:50%;transform:translateY(-50%)}
.collection-swipe-hints .hint-right{right:24px;top:50%;transform:translateY(-50%)}
.collection-swipe-hints .hint-up{top:24px;left:50%;transform:translateX(-50%)}
.collection-swipe-hints .hint-down{bottom:24px;left:50%;transform:translateX(-50%)}
.collection-swiper-card{position:relative;z-index:5;display:flex;flex-direction:column;width:min(290px,88vw);max-height:96vh;max-height:96dvh;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:20px;background:rgba(20,20,36,.88);box-shadow:0 24px 80px rgba(0,0,0,.7);backdrop-filter:blur(20px);cursor:grab;touch-action:none;user-select:none;transition:box-shadow .2s ease}
.collection-swiper-card:active{cursor:grabbing}
.collection-swiper-cover{display:block;flex:0 0 auto;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-bottom:1px solid rgba(255,255,255,.08);background:#1a1a2e}
.collection-swiper-card-body{flex:0 0 auto;padding:12px 20px 11px}
.collection-swiper-card-body h1{overflow:hidden;margin:0 0 2px;color:#fff;font-size:15px;font-weight:800;line-height:1.25;text-overflow:ellipsis;white-space:nowrap;letter-spacing:0}
.collection-swiper-artist{overflow:hidden;margin:0 0 2px;color:rgba(255,255,255,.6);font-size:12.5px;text-overflow:ellipsis;white-space:nowrap}
.collection-swiper-meta{display:flex;justify-content:space-between;gap:8px;overflow:hidden;margin-bottom:1px;color:rgba(255,255,255,.38);font-size:10.5px;letter-spacing:.03em;white-space:nowrap}
.collection-swiper-meta [data-playback-mode-label]{color:rgba(255,255,255,.56);font-weight:700}
.collection-swiper-status{overflow:hidden;min-height:15px;margin:0 0 4px;color:rgba(255,255,255,.48);font-size:10.5px;text-overflow:ellipsis;white-space:nowrap}
.collection-swiper-status.is-error{color:#fca5a5}
.collection-swiper-progress{display:block;width:100%;height:18px;margin:0;appearance:none;background:transparent;cursor:pointer;touch-action:none;accent-color:#7c3aed}
.collection-swiper-progress::-webkit-slider-runnable-track{height:4px;border-radius:999px;background:linear-gradient(90deg,#7c3aed 0 var(--progress,0%),rgba(255,255,255,.12) var(--progress,0%) 100%)}
.collection-swiper-progress::-webkit-slider-thumb{width:13px;height:13px;margin-top:-4.5px;appearance:none;border:2px solid #c4b5fd;border-radius:50%;background:#fff;box-shadow:0 3px 12px rgba(0,0,0,.35),0 0 0 4px rgba(124,58,237,.18)}
.collection-swiper-progress::-moz-range-track{height:4px;border-radius:999px;background:rgba(255,255,255,.12)}
.collection-swiper-progress::-moz-range-progress{height:4px;border-radius:999px;background:linear-gradient(90deg,#7c3aed,#a78bfa)}
.collection-swiper-progress::-moz-range-thumb{width:11px;height:11px;border:2px solid #c4b5fd;border-radius:50%;background:#fff;box-shadow:0 3px 12px rgba(0,0,0,.35)}
.collection-swiper-controls{display:flex;flex:0 0 auto;align-items:center;justify-content:center;gap:8px;padding:9px 8px 11px;border-top:1px solid rgba(255,255,255,.07)}
.collection-control{display:grid;place-items:center;flex:0 0 auto;width:31px;height:31px;padding:0;border:1px solid rgba(255,255,255,.1);border-radius:50%;background:rgba(255,255,255,.07);color:#fff;cursor:pointer;transition:background .18s ease,color .18s ease,transform .18s ease}
.collection-control:hover:not(:disabled){background:rgba(255,255,255,.14);transform:scale(1.08)}
.collection-control:disabled{opacity:.3;cursor:not-allowed}
.collection-play-control{width:40px;height:40px;border-color:transparent;background:#7c3aed}
.collection-play-control svg[hidden]{display:none}
.collection-play-control [data-pause-icon]{display:none}
.collection-play-control.is-playing [data-play-icon]{display:none}
.collection-play-control.is-playing [data-pause-icon]{display:block}
.collection-play-control:hover:not(:disabled){background:#6d28d9;box-shadow:0 6px 20px rgba(124,58,237,.5)}
.collection-favorite-control{color:rgba(255,255,255,.64)}
.collection-favorite-control[aria-pressed="true"]{border-color:rgba(248,113,113,.5);background:rgba(127,29,29,.5);color:#ef4444}
.collection-favorite-control[aria-pressed="true"]:hover:not(:disabled){background:rgba(153,27,27,.62)}
.collection-swiper-volume{display:flex;flex:0 0 auto;align-items:center;justify-content:center;gap:8px;padding:0 12px 14px;color:rgba(255,255,255,.7);font-size:11px}
.collection-swiper-volume label{display:inline-flex;align-items:center;gap:8px;padding:4px 10px;border:1px solid rgba(255,255,255,.08);border-radius:999px;background:rgba(255,255,255,.05);font-weight:700}
.collection-swiper-volume input{width:92px;accent-color:#7c3aed;cursor:pointer}
.collection-swiper-volume strong{min-width:78px;color:rgba(255,255,255,.9);font-size:11px}
.collection-swiper-options{position:absolute;top:70px;right:20px;z-index:12;width:min(300px,calc(100vw - 40px));padding:16px;border:1px solid rgba(255,255,255,.15);border-radius:16px;background:rgba(16,17,30,.94);box-shadow:0 20px 55px rgba(0,0,0,.5);backdrop-filter:blur(20px)}
.collection-swiper-options[hidden]{display:none}
.collection-swiper-options p{margin:0 0 10px;color:#fff;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.collection-swiper-options small{display:block;margin-top:10px;color:rgba(255,255,255,.5);font-size:11px;line-height:1.4}
.collection-swiper-options a{display:inline-block;margin-top:10px;color:#86efac;font-size:12px;font-weight:800}
.playback-mode-switch{display:grid;grid-template-columns:1fr 1fr;padding:3px;border-radius:999px;background:rgba(255,255,255,.07)}
.playback-mode-switch button{min-height:34px;border:0;border-radius:999px;background:transparent;color:rgba(255,255,255,.58);font-size:12px;font-weight:800;cursor:pointer}
.playback-mode-switch button[aria-pressed="true"]{background:#7c3aed;color:#fff;box-shadow:0 4px 14px rgba(124,58,237,.35)}
.playback-mode-switch button:disabled{opacity:.35;cursor:not-allowed}
.collection-swiper-unavailable .collection-swiper-card-body{padding-bottom:20px}.collection-swiper-unavailable a{color:#c4b5fd;font-size:12px;font-weight:800}
@keyframes collectionSwipeLeft{to{transform:translateX(-130vw) rotate(-20deg);opacity:0}}
@keyframes collectionSwipeRight{to{transform:translateX(130vw) rotate(20deg);opacity:0}}
@keyframes collectionSwipeUp{to{transform:translateY(-120vh) rotate(-8deg);opacity:0}}
@keyframes collectionSwipeDown{to{transform:translateY(120vh) rotate(8deg);opacity:0}}
.collection-swiper-card.swipe-left{animation:collectionSwipeLeft .2s ease forwards}.collection-swiper-card.swipe-right{animation:collectionSwipeRight .2s ease forwards}.collection-swiper-card.swipe-up{animation:collectionSwipeUp .2s ease forwards}.collection-swiper-card.swipe-down{animation:collectionSwipeDown .2s ease forwards}
@media(max-width:680px){.collection-swiper-card{width:min(90vw,340px)}.collection-swipe-hints .hint-left,.collection-swipe-hints .hint-right{display:none}.collection-swiper-corner{top:14px}.collection-swiper-close{left:14px}.collection-swiper-options-button{right:14px}.collection-swiper-options{top:64px;right:14px}.collection-swipe-hints .hint-up{top:22px}.collection-swipe-hints .hint-down{bottom:16px}}
@media(max-height:590px){.collection-swiper-card{width:min(205px,64vw)}.collection-swiper-volume{display:none}.collection-swipe-hints .hint-up,.collection-swipe-hints .hint-down{display:none}}
@media(prefers-reduced-motion:reduce){.collection-swiper-card[class*="swipe-"]{animation-duration:1ms}.collection-swiper-background{transition:none}}
