#cursor-layer {
  position: fixed;
  inset: 0;
  z-index: 10;
  pointer-events: none;
  overflow: hidden;
}

/* カーソルを追いかけるハート */
#heart-cursor {
  position: absolute;
  left: 0;
  top: 0;
  width: 32px;
  height: 32px;
  margin: -16px 0 0 -16px;
  margin: 0;
  will-change: transform;
  filter: drop-shadow(0 4px 8px rgba(120, 40, 50, 0.3));
}
/* 鼓動 — トクン、トクン、と二拍で脈打つ */
#heart-cursor .heart-beat {
  transform-box: fill-box;
  transform-origin: center;
  /* animation: heartbeat 1.6s ease-in-out infinite; */
}
@keyframes heartbeat {
  0%, 40%, 100% { transform: scale(1); }
  10%           { transform: scale(1.18); }
  20%           { transform: scale(1.02); }
  28%           { transform: scale(1.12); }
}

/* 軌跡から舞い上がる小さなハート */
.heart-particle {
  position: absolute;
  left: 0;
  top: 0;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path d="M16 29C8 22 2 17 2 10.5 2 6 5.5 3 9.5 3c2.8 0 5.3 1.6 6.5 4 1.2-2.4 3.7-4 6.5-4 4 0 7.5 3 7.5 7.5C30 17 24 22 16 29z" fill="%23eda0b0"/></svg>') center / contain no-repeat;
  will-change: transform, opacity;
  animation: heart-rise ease-out forwards;
}
@keyframes heart-rise {
  0%   { opacity: 0.95; transform: translate(var(--x0), var(--y0)) scale(0.5) rotate(var(--r0)); }
  20%  { opacity: 0.95; transform: translate(calc(var(--x0) * 0.8 + var(--x1) * 0.2), calc(var(--y0) * 0.8 + var(--y1) * 0.2)) scale(1) rotate(var(--r0)); }
  100% { opacity: 0;    transform: translate(var(--x1), var(--y1)) scale(0.6) rotate(var(--r1)); }
}