.music-page-root{position:relative;z-index:1;overflow:visible}.music-feed-bg{position:fixed;inset:0;z-index:0;background:radial-gradient(ellipse 100% 60% at 50% 0,rgba(var(--ambient-r,102),var(--ambient-g,181),var(--ambient-b,255),.3),transparent 70%),radial-gradient(ellipse 80% 50% at 80% 80%,rgba(var(--ambient-r,102),var(--ambient-g,181),var(--ambient-b,255),.22),transparent 65%),radial-gradient(ellipse 70% 40% at 20% 100%,rgba(var(--ambient-r,102),var(--ambient-g,181),var(--ambient-b,255),.16),transparent 60%)}.music-feed-bg:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,transparent 0,var(--background-color-primary,#07090d) 100%);opacity:.72}.music-feed-container{--music-bg:var(--background-color-primary,#07090d);--music-surface:var(--background-color-secondary,#0f141d);--music-border:var(--border-default,rgba(190,214,255,0.24));--music-text-primary:var(--text-color-primary,#f4f8ff);--music-text-secondary:var(--text-color-secondary,#b9c4d9);--music-text-tertiary:var(--text-tertiary,#8b95aa);--music-glass:var(--glass,rgba(11,16,24,0.6));width:100vw;height:100vh;position:relative;z-index:1;overflow:hidden;background:transparent;color:var(--music-text-primary);font-family:var(--font-ui,var(--font-inter,sans-serif))}.music-feed-container,.music-feed-container *{box-sizing:border-box;-webkit-tap-highlight-color:transparent}.music-collection-wrapper{position:relative;z-index:2;background:transparent;overflow:visible}.slider-root{--dynamic-number-of-slides:1;--config-slide-grid-size:4;--config-next-slide-column-offset:3;--config-next-slide-row-offset:2;--config-slide-gap:28px;--config-canvas-height:var(--global-content-available-screen-height);--config-slide-size:min(calc(100vw - 80px),calc(var(--config-canvas-height) - 20vh));--helper-slide-gap-overall-width:calc(var(--config-slide-gap) * (var(--config-slide-grid-size) - 1));--helper-non-active-space-width:calc((100vw - var(--config-slide-size)) / 2);--helper-non-active-space-height:calc((var(--config-canvas-height) - var(--config-slide-size)) / 2);width:100%;height:var(--config-canvas-height);position:relative}.slider-root:before{content:"";position:absolute;top:0;left:0;z-index:10;width:var(--helper-non-active-space-width);height:100%;background:linear-gradient(90deg,#000,#0003 40%,#0000);-webkit-mask-image:linear-gradient(180deg,black 70%,transparent);mask-image:linear-gradient(180deg,black 70%,transparent);pointer-events:none}.canvasesWrapper{display:grid}.canvasWrapper{grid-column:1/1;grid-row:1/1;width:100%;height:var(--config-canvas-height);position:relative}.canvasVisible{overflow:hidden;z-index:1;pointer-events:none}.canvasVisible:before{content:"";position:absolute;top:0;left:0;z-index:5;width:clamp(48px,12vw,260px);height:100%;pointer-events:none;background:linear-gradient(to right,var(--music-bg),rgba(10,10,12,.25) 55%,transparent)}.canvasVisible .card,.canvasVisible a,.canvasVisible button,.canvasVisible input{pointer-events:auto}.canvasOrchestrator{overflow-x:scroll;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;z-index:10;-ms-overflow-style:none;scrollbar-width:none}.canvasOrchestrator::-webkit-scrollbar{display:none}.canvasGrid{list-style:none;display:inline-grid;gap:var(--config-slide-gap);padding:var(--helper-non-active-space-height) var(--helper-non-active-space-width);margin:0;grid-template-columns:repeat(calc(var(--dynamic-number-of-slides) * var(--config-slide-grid-size) - (var(--dynamic-number-of-slides) - 1) * -1 * (var(--config-next-slide-column-offset) - var(--config-slide-grid-size))),calc((var(--config-slide-size) - var(--helper-slide-gap-overall-width)) / var(--config-slide-grid-size)));grid-template-rows:repeat(calc(var(--dynamic-number-of-slides) * var(--config-slide-grid-size) - (var(--dynamic-number-of-slides) - 1) * -1 * (var(--config-next-slide-row-offset) - var(--config-slide-grid-size))),calc((var(--config-slide-size) - var(--helper-slide-gap-overall-width)) / var(--config-slide-grid-size)))}.slide-positioner{grid-row:calc(var(--dynamic-slide-index) * var(--config-next-slide-row-offset) + 1) /span var(--config-slide-grid-size);grid-column:calc(var(--dynamic-slide-index) * var(--config-next-slide-column-offset) + 1) /span var(--config-slide-grid-size)}.visible-slide{z-index:calc(var(--dynamic-number-of-slides) - var(--dynamic-slide-index));will-change:transform;transform:translateZ(0)}.visible-slide,.visible-slide *{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.orchestrator-slide-x{scroll-snap-align:center;width:var(--config-slide-size);height:var(--config-slide-size);background:transparent;border:0;outline:0;touch-action:pan-x}.orchestrator-slide-x:not(.is-active){pointer-events:none}.convergeWrapper{width:100%;height:100%;display:flex;align-items:center;justify-content:center;will-change:transform}.showcase-slide-inner{width:var(--config-slide-size);height:var(--config-slide-size);position:relative;transform-style:preserve-3d;will-change:transform}.slide{min-width:0;align-items:center;justify-content:center;padding:0}.card,.slide{width:100%;height:100%;display:flex}.card{--cvr-rds:var(--r-md,6px);flex-direction:column;background:var(--music-glass);border:1px solid var(--music-border);border-radius:var(--cvr-rds);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.card,.card-cover{position:relative;overflow:hidden}.card-cover{flex:1;width:100%;background:var(--music-surface)}.card-cover img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;transition:transform .42s ease,filter .28s ease;position:relative;z-index:2}.visible-slide[data-active="1"] .card-cover img{transform:scale(1.01)}.cover-placeholder{width:100%;height:100%;display:grid;place-items:center;color:var(--music-text-tertiary)}.card-glow{position:absolute;inset:-36px;border-radius:50%;opacity:.5;filter:blur(48px);transform:translateZ(0);will-change:filter,opacity,transform;pointer-events:none;z-index:0}.card-info{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:clamp(10px,2.8vw,var(--global-container-padding,16px));background:color-mix(in srgb,var(--music-glass) 88%,transparent);border-top:1px solid color-mix(in srgb,var(--music-border) 70%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.card-title{display:block;color:var(--music-text-primary);text-decoration:none;line-height:1.25;letter-spacing:-.02em;margin:0 0 .375rem;font-size:clamp(1rem,4vw,1.2rem)}.card-meta{display:flex;align-items:center;gap:.375rem;margin-bottom:.5rem;flex-wrap:wrap;color:var(--music-text-secondary);font-size:10px;font-family:monospace,var(--font-mono,"Fira Mono",monospace)!important}.card-meta span{gap:.25rem}.badge,.card-meta span{display:inline-flex;align-items:center}.badge{padding:.1875rem .4375rem;border-radius:var(--r-sm,4px);border:1px solid color-mix(in srgb,var(--music-border) 70%,transparent);background:color-mix(in srgb,var(--music-glass) 62%,transparent);text-transform:uppercase;letter-spacing:.025em;font-family:var(--font-mono,"Fira Mono",monospace);font-weight:400;line-height:1;font-size:10px}.divider{color:var(--music-text-tertiary)}.audio-status{margin-top:.5rem;padding-top:.5rem;border-top:1px solid color-mix(in srgb,var(--music-border) 70%,transparent);overflow:hidden}.status-indicator{display:flex;align-items:center;gap:.375rem;color:var(--music-text-secondary);font-size:12px}.status-indicator span:first-child{width:5px;height:5px;width:6px;height:6px;border-radius:50%;background:var(--music-text-tertiary)}.status-indicator span.active{background:#22c55e;box-shadow:0 0 8px rgba(34,197,94,.6);animation:pulse 2s ease-in-out infinite}.card-accent{height:4px;width:100%;z-index:11;transition:opacity .5s ease,box-shadow .5s ease,background .5s ease}.showcase-inner-border{position:absolute;top:var(--cvr-rds,6px);right:-4px;width:4px;height:calc(100% - (var(--cvr-rds, 6px) * 2));transform:rotateY(90deg);transform-origin:left;background:var(--dynamic-color,#1b1b1b);pointer-events:none}.showcase-inner-drop-shadow{position:absolute;inset:0;z-index:-1;background:rgba(0,0,0,.55);filter:blur(12px);pointer-events:none}.showcase-inner-inset-shadow{position:absolute;inset:0;z-index:10;pointer-events:none;opacity:0;background:radial-gradient(farthest-corner at 75% 75%,rgba(0,0,0,1) 0,rgba(0,0,0,.8) 10%,rgba(0,0,0,.2) 100%),linear-gradient(0deg,rgba(0,0,0,1) 0,rgba(0,0,0,1) 30%,rgba(0,0,0,.5) 60%,rgba(0,0,0,0) 80%)}.indicator-slider{position:absolute;left:50%;bottom:calc((var(--config-canvas-height) - var(--config-slide-size)) / 4);transform:translateX(-50%);z-index:50;overflow:hidden;width:min(var(--config-slide-size),calc(100vw - 2 * var(--global-container-padding, 16px)))}.indicator-root{width:100%;height:32px;position:relative;touch-action:pan-x}.indicator-root:before{content:"";position:absolute;left:0;top:50%;width:100%;height:1px;transform:translateY(-50%);background:color-mix(in srgb,var(--music-text-primary) 30%,transparent)}.thumb-indicator{position:absolute;top:calc(50% - 4px);left:0;height:8px;width:calc(100% / var(--ci-dynamic-number-of-slides, 1));border-radius:24px;background:var(--music-text-primary);transform-origin:center;touch-action:none;will-change:transform;cursor:grab}.thumb-indicator:active{cursor:grabbing}@media (min-width:1000px){.card-info{padding:1.25rem;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.card-title{margin-bottom:.5rem;font-size:clamp(1.1rem,1.5vw,1.3rem)}.card-meta{gap:.5rem;margin-bottom:.625rem}.badge{padding:.25rem .5rem}.audio-status{margin-top:.625rem;padding-top:.625rem}.status-indicator{gap:.5rem}.status-indicator span:first-child{width:6px;height:6px}.slider-root{--config-slide-size:max(30vw,calc(var(--config-canvas-height) - 30vh));--config-slide-gap:48px;--config-next-slide-column-offset:4;--config-next-slide-row-offset:2;--config-canvas-height:var(--global-content-available-screen-height)}.slider-root:before{background:linear-gradient(90deg,#000,#000 20%,#0000004d 80%,#0000)}.canvasVisible:before{width:clamp(80px,18vw,360px);background:linear-gradient(to right,var(--music-bg),rgba(10,10,12,.55) 35%,rgba(10,10,12,.2) 70%,transparent);mask-image:linear-gradient(180deg,black 70%,transparent);-webkit-mask-image:linear-gradient(180deg,black 70%,transparent)}.indicator-slider{width:min(600px,34vw)}}@media (prefers-reduced-motion:reduce){.canvasGrid,.card-cover img,.card-glow,.convergeWrapper,.showcase-slide-inner,.status-indicator span.active,.thumb-indicator{animation:none!important;transition:none!important;will-change:auto!important}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}