/* One local 1.5-second save ceremony. Only temporary overlay layers transform;
   the shell's carousel/gesture geometry and its animation remain untouched. */
.legacy-favourite-ceremony{position:absolute;inset:0;z-index:2;border-radius:inherit;overflow:hidden;pointer-events:none;--favourite-radius:clamp(32px,18cqh,82px)}
.legacy-favourite-ceremony *{pointer-events:none}
.legacy-favourite-ceremony::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#070d1bc9,#100e20f7 27%,#100e20fa 74%,#070d1beb);opacity:0;pointer-events:none}
.legacy-favourite-aura{position:absolute;inset:4%;border-radius:50%;background:radial-gradient(ellipse at 44% 40%,#fd8bdd70,transparent 54%),radial-gradient(ellipse at 66% 55%,#43e7ea50,transparent 62%);opacity:0;transform:scale(.4)}
.legacy-favourite-sweep{position:absolute;top:-25%;left:-75%;width:50%;height:150%;background:linear-gradient(90deg,transparent,#dafdfc20 38%,#ffd7f74d 50%,transparent 70%);opacity:0;transform:translateX(0) skewX(-18deg)}
.legacy-favourite-heart{position:absolute;left:50%;top:41%;display:block;width:clamp(40px,27%,94px);aspect-ratio:1;color:#ff9de4;opacity:0;transform:translate(-50%,-50%) scale(.35)}
.legacy-favourite-heart svg{display:block;width:100%;height:100%;fill:currentColor;stroke:#ffe2f6;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}
.legacy-favourite-particles{position:absolute;left:50%;top:41%;width:0;height:0}
.legacy-favourite-particles i{position:absolute;left:-2px;top:-4px;width:4px;height:8px;border-radius:1px;background:#a4fff0;opacity:0;transform:rotate(calc(var(--i)*30deg)) translateY(-14px) scale(.4)}
.legacy-favourite-particles i:nth-child(3n+1){background:#ffb4e8;width:3px;height:7px}
.legacy-favourite-particles i:nth-child(3n+2){background:#e7d9ff;width:3px;height:5px}
.legacy-favourite-caption{position:absolute;left:10px;right:10px;top:58%;color:#fff1fb;text-align:center;font-size:clamp(.65rem,3cqh,.85rem);font-weight:750;line-height:1.35;letter-spacing:.025em;text-shadow:0 1px 4px #000,0 0 12px #060914;opacity:0;transform:translateY(8px)}
.legacy-favourite-ceremony::after{content:"";position:absolute;inset:1px;border:1px solid #ffb1e8;border-radius:inherit;box-shadow:inset 0 0 26px #ef6edd55,inset 0 0 4px #91fff166;opacity:0;pointer-events:none}
.song-card[data-favourite-celebration=true] .legacy-favourite-aura{animation:legacy-favourite-aura 1500ms ease-out both}
.song-card[data-favourite-celebration=true] .legacy-favourite-sweep{animation:legacy-favourite-sweep 1500ms ease-in-out both}
.song-card[data-favourite-celebration=true] .legacy-favourite-heart{animation:legacy-favourite-heart 1500ms cubic-bezier(.2,.75,.25,1) both}
.song-card[data-favourite-celebration=true] .legacy-favourite-particles i{animation:legacy-favourite-flecks 1200ms cubic-bezier(.15,.65,.25,1) calc(160ms + var(--i)*8ms) both}
.song-card[data-favourite-celebration=true] .legacy-favourite-caption{animation:legacy-favourite-caption 1500ms ease-out both}
.song-card[data-favourite-celebration=true] .legacy-favourite-ceremony::before{animation:legacy-favourite-scrim 1500ms ease-out both}
.song-card[data-favourite-celebration=true] .legacy-favourite-ceremony::after{animation:legacy-favourite-frame 1500ms ease-out both}
@keyframes legacy-favourite-scrim{0%{opacity:0}16%,82%{opacity:1}100%{opacity:0}}
@keyframes legacy-favourite-aura{0%{opacity:0;transform:scale(.4)}22%{opacity:1}65%{opacity:.65}100%{opacity:0;transform:scale(1.45)}}
@keyframes legacy-favourite-sweep{0%,12%{opacity:0;transform:translateX(0) skewX(-18deg)}25%{opacity:.8}68%{opacity:.4}85%,100%{opacity:0;transform:translateX(390%) skewX(-18deg)}}
@keyframes legacy-favourite-heart{0%{opacity:0;transform:translate(-50%,-35%) scale(.35) rotate(-8deg)}23%{opacity:1;transform:translate(-50%,-50%) scale(1.08) rotate(3deg)}38%{transform:translate(-50%,-50%) scale(.96) rotate(0)}56%{opacity:1;transform:translate(-50%,-54%) scale(1)}80%{opacity:.8}100%{opacity:0;transform:translate(-50%,-76%) scale(.9)}}
@keyframes legacy-favourite-flecks{0%{opacity:0;transform:rotate(calc(var(--i)*30deg)) translateY(-14px) scale(.4)}18%{opacity:.85}72%{opacity:.4}100%{opacity:0;transform:rotate(calc(var(--i)*30deg)) translateY(calc(-1*var(--favourite-radius))) scale(.65)}}
@keyframes legacy-favourite-caption{0%,18%{opacity:0;transform:translateY(8px)}38%,78%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-3px)}}
@keyframes legacy-favourite-frame{0%{opacity:0}23%{opacity:.9}60%{opacity:.6}100%{opacity:0}}
.song-card[data-favourite-celebration=true] .legacy-favourite-ceremony[data-reduced=true] :is(.legacy-favourite-aura,.legacy-favourite-sweep,.legacy-favourite-particles),
.song-card[data-favourite-celebration=true] .legacy-favourite-ceremony[data-reduced=true]::after{display:none;animation:none}
.song-card[data-favourite-celebration=true] .legacy-favourite-ceremony[data-reduced=true] .legacy-favourite-heart{animation:none;opacity:.9;transform:translate(-50%,-50%) scale(.8)}
.song-card[data-favourite-celebration=true] .legacy-favourite-ceremony[data-reduced=true] .legacy-favourite-caption{animation:none;opacity:1;transform:none}
.song-card[data-favourite-celebration=true] .legacy-favourite-ceremony[data-reduced=true]::before{animation:none;opacity:1}
@media(prefers-reduced-motion:reduce){
  .song-card[data-favourite-celebration=true] .legacy-favourite-ceremony :is(.legacy-favourite-aura,.legacy-favourite-sweep,.legacy-favourite-particles),
  .song-card[data-favourite-celebration=true] .legacy-favourite-ceremony::after{display:none;animation:none}
  .song-card[data-favourite-celebration=true] .legacy-favourite-heart{animation:none;opacity:.9;transform:translate(-50%,-50%) scale(.8)}
  .song-card[data-favourite-celebration=true] .legacy-favourite-caption{animation:none;opacity:1;transform:none}
  .song-card[data-favourite-celebration=true] .legacy-favourite-ceremony::before{animation:none;opacity:1}
}

/* A finite LED wall, painted inside the backdrop and behind every album tile. */
.pixel-heart-bloom{position:absolute;inset:0;z-index:3;display:grid;place-items:center;pointer-events:none;overflow:hidden}
.pixel-heart-bloom svg{height:min(88vh,86vw);width:auto;max-width:96%;overflow:visible;transform-origin:50% 55%;animation:pixel-heartbeat 3250ms ease-out both;filter:drop-shadow(0 0 9px #fc61b288)}
.pixel-heart-bloom g{animation:pixel-heart-wave 3000ms ease-out calc(var(--ring)*32ms) both}
@keyframes pixel-heartbeat{
  0%{opacity:0;transform:scale(.82);filter:drop-shadow(0 0 1px #fc61b200)}
  14%{opacity:.86;transform:scale(1);filter:drop-shadow(0 0 8px #ff6ab5aa)}
  25%{opacity:1;transform:scale(1.055);filter:drop-shadow(0 0 19px #ff76c5cc)}
  35%{opacity:.73;transform:scale(.99);filter:drop-shadow(0 0 6px #f764b177)}
  47%{opacity:1;transform:scale(1.045);filter:drop-shadow(0 0 17px #ff9ccfcc)}
  59%{opacity:.82;transform:scale(1);filter:drop-shadow(0 0 8px #fc61b277)}
  76%{opacity:.72;transform:scale(1.005)}
  100%{opacity:0;transform:scale(1.10);filter:drop-shadow(0 0 24px #fc61b200)}
}
@keyframes pixel-heart-wave{0%{opacity:0}16%,70%{opacity:1}100%{opacity:0}}
.pixel-heart-bloom[data-reduced=true] svg{animation:none;opacity:.7;transform:none;filter:drop-shadow(0 0 6px #fc61b244)}
.pixel-heart-bloom[data-reduced=true] g{animation:none;opacity:1}
@media(prefers-reduced-motion:reduce){.pixel-heart-bloom svg{animation:none;transform:none;filter:none;opacity:.7}.pixel-heart-bloom g{animation:none;opacity:1}}

/* Ring timing also works under the player’s self-only style policy. */
.pixel-heart-ring-0{--ring:0}
.pixel-heart-ring-1{--ring:1}
.pixel-heart-ring-2{--ring:2}
.pixel-heart-ring-3{--ring:3}
.pixel-heart-ring-4{--ring:4}
.pixel-heart-ring-5{--ring:5}
.pixel-heart-ring-6{--ring:6}
.pixel-heart-ring-7{--ring:7}