.spark-hang { position: fixed; left: var(--hx); top: var(--hy); z-index: 84; width: 0; height: 0; clip-path: inset(0 -320px -320px -320px); }
.spark-hang-swing { position: absolute; left: 0; top: 0; width: 0; height: 0; transform-origin: 0 0; animation: sparkHangSwing 2.8s ease-out 0.3s both; }
.spark-hang-drop { position: absolute; left: 0; top: 0; display: flex; flex-direction: column; align-items: center; width: max-content; translate: -50% 0; animation: sparkHangDrop 0.85s cubic-bezier(0.3, 0.9, 0.35, 1) both; }
.spark-hang-thread { flex: none; width: 1px; height: var(--hl); background: rgba(214, 224, 244, 0.5); }
.spark-hang .spark-tag { pointer-events: auto; translate: var(--shift, 0px) 0; }
.spark-hang.is-up .spark-hang-drop { animation: sparkHangLift 0.5s cubic-bezier(0.6, 0, 0.9, 0.5) both; }
@keyframes sparkHangDrop { 0% { translate: -50% -105%; } 62% { translate: -50% 3px; } 82% { translate: -50% -1px; } 100% { translate: -50% 0; } }
@keyframes sparkHangLift { 0% { translate: -50% 0; } 100% { translate: -50% -105%; } }
@keyframes sparkHangSwing { 0% { rotate: 0deg; } 12% { rotate: 7deg; } 30% { rotate: -5deg; } 48% { rotate: 3.2deg; } 66% { rotate: -1.8deg; } 84% { rotate: 0.8deg; } 100% { rotate: 0deg; } }
.fx-spider.is-busy .fx-spider-eye { fill: #ffd35c; }
.spark-sign { position: absolute; left: calc(var(--sign-side, 16) * var(--gs, 1) * 1px); bottom: 0; width: 0; height: 0; clip-path: inset(-400px -400px 0 -400px); }
.spark-sign-rise { position: absolute; left: 0; bottom: 0; display: flex; flex-direction: column; align-items: center; width: max-content; translate: -50% 105%; transition: translate 0.45s cubic-bezier(0.55, 0, 0.9, 0.45); }
.spark-sign.is-up .spark-sign-rise { translate: -50% 0; transition: translate 0.65s cubic-bezier(0.2, 1.35, 0.45, 1); }
.spark-sign-stick { flex: none; width: 2px; height: calc(46px * var(--gs, 1)); border-radius: 1px; background: linear-gradient(#8fa3c7, #2a4680); rotate: 3deg; transform-origin: 50% 100%; }
.spark-sign .spark-tag { pointer-events: auto; translate: var(--shift, 0px) 0; rotate: 3deg; }
@media (prefers-reduced-motion: reduce) {
  .spark-sign-rise, .spark-sign.is-up .spark-sign-rise { transition: none; }
  .spark-hang-swing, .spark-hang-drop { animation: none; }
}
