/* Keep the project link and both controls independently clickable. */
.card-footer{flex-wrap:wrap;row-gap:10px}
.card-footer>:first-child{flex:1 1 130px}
.card-actions{margin-left:auto}
.card-heart{position:relative;z-index:2;display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:44px;min-height:44px;padding:6px 8px;border:0;border-radius:24px;background:#ffffff9c;color:#15191d;font:600 15px/1 var(--font);cursor:pointer;touch-action:manipulation;transition:transform .16s,background .18s,box-shadow .18s}
.card-heart[hidden],.heart-count[hidden]{display:none}
.card-heart svg{width:23px;height:23px;overflow:visible;flex:none;fill:transparent;stroke:#15191d;stroke-width:1.8;stroke-linejoin:round;transition:fill .16s}
.card-heart[aria-pressed="true"] svg{fill:#ed4266;stroke:none}
.card-heart:hover{background:#fff;box-shadow:0 3px 12px #0001;transform:translateY(-1px)}
.card-heart:active{transform:scale(1.12)}
.card-heart:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.card-heart:disabled{cursor:wait}
.heart-count{min-width:1ch;font-variant-numeric:tabular-nums}
.card-heart[data-pop="true"] svg{animation:heart-pop .5s cubic-bezier(.2,.8,.3,1.2)}
.card-heart[data-pop="true"] .heart-count{animation:heart-count .42s ease}
@keyframes heart-pop{0%{transform:scale(.85)}35%{transform:scale(1.35) rotate(-9deg)}65%{transform:scale(.94) rotate(5deg)}100%{transform:scale(1)}}
@keyframes heart-count{40%{transform:translateY(-4px);color:#d52851}}
.heart-particles{position:fixed;inset:0;pointer-events:none;z-index:1001;overflow:hidden}
.heart-particle{position:absolute;width:9px;height:9px;background:var(--heart-color);border-radius:2px;will-change:transform,opacity}
.heart-particle::before,.heart-particle::after{content:"";position:absolute;width:100%;height:100%;border-radius:50%;background:inherit}
.heart-particle::before{left:-50%}.heart-particle::after{top:-50%}
[data-editor] .card-heart{visibility:hidden}
@media(prefers-reduced-motion:reduce){.card-heart,.card-heart svg,.heart-count{transition:none!important;animation:none!important}.heart-particles{display:none}}
@media(forced-colors:active){.card-heart{background:Canvas;color:CanvasText;border:1px solid ButtonText}.card-heart svg{stroke:ButtonText}.card-heart[aria-pressed="true"] svg{fill:Highlight}}
