.pulse-sparks {
  position: absolute;
  inset: 0;
  z-index: 12;
  pointer-events: none;
}

.beat-spark {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff8df;
  background: rgba(255,255,255,.14);
  box-shadow: 0 0 18px rgba(255,78,120,.62);
  animation: sparkFly .9s ease-out forwards;
}

.pulse-hero.is-beating .heart-fill { animation: heartPop .72s ease-out, heartGemBeat 1.2s ease-in-out infinite; }

.pulse-hero.is-beating .pulse-pet.left { animation: petMeetLeft .9s ease-out, petLeanLeft 4.2s ease-in-out .9s infinite; }
.pulse-hero.is-beating .pulse-pet.right { animation: petMeetRight .9s ease-out, petLeanRight 4.2s ease-in-out .9s infinite; }
.pulse-hero.is-beating .pulse-ecg path { animation-duration: 1.12s; }
.pulse-hero.is-super-beating .pulse-mesh { box-shadow: 0 0 46px rgba(255,78,120,.36), inset 0 0 0 1px rgba(255,255,255,.12); }
.pulse-hero.is-super-beating .heart-fill { animation: heartPop .6s ease-out, heartGemBeat .96s ease-in-out infinite; }
.pulse-hero.is-super-beating .pulse-ecg path { animation-duration: .82s; stroke-width: 6; }

@keyframes ecgFlow { from { stroke-dashoffset: 390; } to { stroke-dashoffset: 0; } }
@keyframes routeCharge { 0%,100% { transform: scaleX(.72); opacity: .5; } 50% { transform: scaleX(1); opacity: 1; } }
@keyframes pulseSurface { from { background-position: -80px 0, 0 0; } to { background-position: 80px 0, 28px 0; } }
@keyframes orbGlow { 0%,100% { filter: brightness(1); } 50% { filter: brightness(1.16); } }
@keyframes heartGemBeat { 0%,100% { transform: scale(1); } 16% { transform: scale(1.055); } 31% { transform: scale(.985); } 46% { transform: scale(1.035); } }
@keyframes heartHaloBreath { 0%,100% { opacity: .56; transform: scale(.96); } 50% { opacity: .94; transform: scale(1.08); } }
@keyframes heartSparkBlink { 0%,100% { opacity: .45; transform: scale(.78); } 50% { opacity: 1; transform: scale(1.18); } }
@keyframes heartPop { 0% { transform: scale(1); } 36% { transform: scale(1.17); } 62% { transform: scale(.95); } 100% { transform: scale(1.02); } }
@keyframes petLeanLeft { 0%,100% { transform: translate(0,0) scale(.58) rotate(-2deg); } 50% { transform: translate(18px,-9px) scale(.61) rotate(2deg); } }
@keyframes petLeanRight { 0%,100% { transform: translate(0,0) scale(.58) rotate(2deg); } 50% { transform: translate(-18px,-9px) scale(.61) rotate(-2deg); } }
@keyframes petMeetLeft { 0% { transform: translate(0,0) scale(.58); } 52% { transform: translate(44px,-20px) scale(.66); } 100% { transform: translate(16px,-5px) scale(.6); } }
@keyframes petMeetRight { 0% { transform: translate(0,0) scale(.58); } 52% { transform: translate(-44px,-20px) scale(.66); } 100% { transform: translate(-16px,-5px) scale(.6); } }
@keyframes sparkFly {
  from { opacity: 0; transform: translate(-50%,-50%) scale(.35); }
  18% { opacity: 1; }
  to { opacity: 0; transform: translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) scale(1.12); }
}

@media (max-width: 370px) {
  .pulse-stage { height: 292px; }
  .pulse-hero .pulse-pet { transform: scale(.51); }
  .pulse-hero .heart-orb { width: 168px; height: 168px; }
  .pulse-hero > strong { font-size: 76px; }
}
