Wishlist Heart Fly

Create a wishlist heart that sends a flying copy. A product image tile with a round white heart button in its top-right corner (soft shadow, 0 2px 10px at 14% opacity). Clicking saves the item: the heart fills with the accent color and bursts (scale 1 → 1.4 → 1 over 350ms with a springy ease like cubic-bezier(0.34, 1.56, 0.64, 1)), and simultaneously a small filled copy of the heart detaches and flies toward the wishlist: it travels up and left about 45px on a curve, shrinking to 50% scale, rotating about -18deg, staying fully visible for most of the flight and fading only at the end, over 850ms with easing cubic-bezier(0.22, 1, 0.36, 1), then removes itself. Clicking again unsaves (outline heart, no flight). Press feedback: the button dips to 82%. The flying heart is position absolute inside the button, pointer-events none. Accessibility: the button uses aria-pressed and swaps its aria-label between "Save to wishlist" and "Remove from wishlist". If prefers-reduced-motion is set, toggle the fill instantly with no burst and no flight. Build the component, not this demo of it. - Ambient motion that IS the component may loop: a drifting background, a marquee, a spinner while something is genuinely loading. - Do not add any timer, interval, loop or script that performs a person's action by itself. No auto-hover, no auto-click, no cycling through states, no pretend submitting, no replaying the interaction on a schedule. - Every state that answers a person waits for a real event from that person. - Placeholder copy and sample content are welcome. Simulated behaviour is not.