.track-card.svelte-gs78rf{position:relative;display:flex;height:292px;width:100%;max-width:220px;flex-direction:column;overflow:hidden;border-radius:1rem;background-color:#ffffff1a;padding:.75rem;outline:none;transition:all .3s;container-type:inline-size}@keyframes svelte-gs78rf-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes svelte-gs78rf-hue-rotate{0%{filter:hue-rotate(0deg)}to{filter:hue-rotate(360deg)}}@keyframes svelte-gs78rf-breathe{0%,to{opacity:.3;transform:scale(1)}50%{opacity:.7;transform:scale(1.05)}}@keyframes svelte-gs78rf-hue-rotate-blur{0%{filter:hue-rotate(0deg) blur(50px)}to{filter:hue-rotate(360deg) blur(50px)}}.active-track.svelte-gs78rf{background-color:#000c;box-shadow:0 0 20px #007bff4d}.paused.svelte-gs78rf{animation-play-state:paused!important}.ai-aura.svelte-gs78rf{position:absolute;inset:-50%;width:200%;height:200%;background:conic-gradient(from 0deg,#ff00d4,#00ecbc,#007fff,#ff00d4,#007fff,#00ecbc,#ff00d4 360deg);animation:svelte-gs78rf-spin 4s linear infinite,svelte-gs78rf-hue-rotate-blur 10s linear infinite;opacity:.4;z-index:0;pointer-events:none;will-change:transform,filter}.ai-border-container.svelte-gs78rf{position:absolute;inset:0;padding:2px;border-radius:1rem;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;z-index:1;pointer-events:none}.ai-border-spinner.svelte-gs78rf{position:absolute;inset:-50%;width:200%;height:200%;background:conic-gradient(from 0deg,transparent 0deg,#00ecbc 60deg,#007fff 120deg,#ff00d4 180deg,#007fff 240deg,#00ecbc 300deg,transparent 360deg);animation:svelte-gs78rf-spin 4s linear infinite,svelte-gs78rf-hue-rotate 10s linear infinite;will-change:transform,filter}.track-card.svelte-gs78rf>.relative:where(.svelte-gs78rf){z-index:10}.track-card.svelte-gs78rf:hover,.track-card.svelte-gs78rf:focus-within{background-color:#ffffff1a}.image-spacer.svelte-gs78rf{width:100%;position:relative;pointer-events:none;height:fit-content}.image-content-absolute.svelte-gs78rf{display:flex;width:100%;align-items:flex-start;justify-content:space-between;pointer-events:none;height:fit-content}.track-image-container.svelte-gs78rf{position:relative;aspect-ratio:1 / 1;max-width:100%;flex-grow:1;overflow:hidden;border-radius:.75rem;transition:all .3s;pointer-events:auto}.track-card.svelte-gs78rf:hover .track-image-container:where(.svelte-gs78rf),.track-card.svelte-gs78rf:focus-within .track-image-container:where(.svelte-gs78rf){width:5rem;border-radius:.5rem}.play-button.svelte-gs78rf{position:relative;z-index:20;margin-top:auto;margin-bottom:auto;margin-right:-4rem;margin-left:1rem;display:flex;aspect-ratio:1 / 1;height:fit-content;width:33.333333%;transform:translate(2.5rem);align-items:center;justify-content:center;border-radius:9999px;padding:0;opacity:0;transition:all .3s;background-color:oklch(from var(--color-primary) l c h / .3);color:var(--color-primary);pointer-events:auto}.play-button.svelte-gs78rf:hover{transform:scale(1.1)}.track-card.svelte-gs78rf:hover .play-button:where(.svelte-gs78rf),.track-card.svelte-gs78rf:focus-within .play-button:where(.svelte-gs78rf){margin-right:0;transform:translate(0);opacity:1}.track-info.svelte-gs78rf{margin-top:.5rem;width:100%;text-align:left;transition:all .3s}.track-title.svelte-gs78rf{margin:0;margin-bottom:.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1rem;font-weight:500;color:var(--color-white)}.track-artist.svelte-gs78rf{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;color:var(--color-gray-400)}.action-buttons.svelte-gs78rf{width:100%;z-index:20;display:flex;transform:translateY(2.5rem);align-items:center;justify-content:space-between;gap:.75rem;opacity:0;transition:all .3s;margin-top:8px;margin-bottom:-35px}.track-card.svelte-gs78rf:hover .action-buttons:where(.svelte-gs78rf),.track-card.svelte-gs78rf:focus-within .action-buttons:where(.svelte-gs78rf){transform:translateY(0);opacity:1;margin-top:auto;margin-bottom:8px}.action-btn.svelte-gs78rf{display:flex;aspect-ratio:1 / 1;height:2.5rem;align-items:center;justify-content:center;border-radius:.5rem;background-color:#ffffff1a;padding:1rem;color:var(--color-white);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:background-color .15s}.action-btn.svelte-gs78rf:hover{background-color:#fff3}.view-btn.svelte-gs78rf{display:flex;height:2.5rem;flex:1;align-items:center;justify-content:center;gap:.5rem;border-radius:.5rem;background-color:#ffffff1a;font-size:.875rem;font-weight:500;color:var(--color-white);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);text-decoration:none;transition:background-color .15s}.view-btn.svelte-gs78rf:hover{background-color:#fff3}
