/* circle: clay flash, settle to olive */
.task.done .check {
  animation: settle 380ms
    cubic-bezier(.34,1.56,.64,1) forwards;
}
@keyframes settle {
  0%   { transform: scale(.8);
         background: #D97757; }
  55%  { transform: scale(1.18); }
  100% { transform: scale(1);
         background: #788C5D; }
}

/* checkmark draws via stroke-dashoffset */
.check path        { stroke-dasharray: 20;
  stroke-dashoffset: 20;
  transition: stroke-dashoffset
    220ms var(--ease) 80ms; }
.task.done path    { stroke-dashoffset: 0; }

/* strikethrough grows left to right */
.label::after      { width: 0;
  transition: width 240ms var(--ease) 120ms; }
.task.done .label::after { width: 100%; }

/* row steps back after celebration */
.task.done { max-height: 44px;
  opacity: .6;
  transition-delay: 600ms; }