バウンド帰還ドラッグカード

<div class="d08-15-03-card" id="d08-15-03-card">📌<br>ドラッグしてみて</div>

.d08-15-03{width:100%;display:flex;align-items:center;justify-content:center}
        .d08-15-03-card{width:118px;height:96px;border-radius:16px;background:#fff;border:1.5px solid #e2e2e8;box-shadow:0 6px 16px rgba(0,0,0,.1);display:flex;align-items:center;justify-content:center;text-align:center;font-size:13px;font-weight:700;color:#2a2d3a;line-height:1.8;cursor:grab;touch-action:none}
        .d08-15-03-card.is-drag{cursor:grabbing;border-color:#6a5cff}

(function(){
        var root=document.getElementById('item-08-15-03');if(!root)return;
        var card=root.querySelector('#d08-15-03-card');if(!card)return;
        var dragging=false,sx=0,sy=0,px=0,py=0,raf=null;
        function apply(x,y,rot){card.style.transform='translate('+x+'px,'+y+'px) rotate('+rot+'deg)';}
        card.addEventListener('pointerdown',function(e){
          dragging=true;card.classList.add('is-drag');
          if(raf)cancelAnimationFrame(raf);
          sx=e.clientX-px;sy=e.clientY-py;
          try{card.setPointerCapture(e.pointerId);}catch(err){}
        });
        card.addEventListener('pointermove',function(e){
          if(!dragging)return;
          px=e.clientX-sx;py=e.clientY-sy;
          apply(px,py,px/18);
        });
        function end(){
          if(!dragging)return;
          dragging=false;card.classList.remove('is-drag');
          var x=px,y=py,vx=0,vy=0,stiff=.16,damp=.74;
          function step(){
            var fx=(0-x)*stiff,fy=(0-y)*stiff;
            vx=(vx+fx)*damp;vy=(vy+fy)*damp;
            x+=vx;y+=vy;apply(x,y,x/18);
            if(Math.abs(x)>.5||Math.abs(y)>.5||Math.abs(vx)>.5||Math.abs(vy)>.5){
              raf=requestAnimationFrame(step);
            }else{px=0;py=0;apply(0,0,0);}
          }
          raf=requestAnimationFrame(step);
        }
        card.addEventListener('pointerup',end);
        card.addEventListener('pointercancel',end);
      })();