.hlc-root.hlc-motion-ready {
  will-change: left, top;
}
.hlc-root.hlc-motion-positioned {
  left:auto;right:auto;
  bottom: auto !important;
}
.hlc-root.is-dragging {
  cursor: grabbing;
}
.hlc-root.is-dragging .hlc-creature {
  cursor: grabbing;
  filter: drop-shadow(0 18px 22px rgba(0, 0, 0, .5));
  transform: scale(1.035);
}
.hlc-root.hlc-motion-ready .hlc-creature {
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}
.hlc-motion-panel {
  margin: 0 !important;
}
.hlc-paw-restore {
  width: 60px;
  height: 74px;
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 0 22px 22px 0;
  background: transparent;
  color: var(--gold, #e6c66a);
  filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .42));
  box-shadow: none;
  touch-action: manipulation;
}
.hlc-paw-restore.is-end:focus-visible {
  outline-offset: -3px;
}
.hlc-paw-mark {
  display: block;
  width: 60px !important;
  height: 74px !important;
  overflow: visible;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.hlc-paw-finger,
.hlc-paw-body {
  fill: #3a2457;
  stroke: #e6c66a;
  stroke-width: 2;
}
.hlc-paw-body {
  fill: url("#hlc-paw-sheen");
}
.hlc-paw-line {
  fill: none;
  stroke: rgba(230, 198, 106, .42);
  stroke-width: 1.4;
}
.hlc-paw-nail {
  fill: #f2dfad;
  stroke: #c9a24a;
  stroke-width: 1.25;
}
[data-theme="light"] .hlc-paw-finger,
[data-theme="light"] .hlc-paw-body {
  fill: #5a357b;
  stroke: #8b5a25;
}
[data-theme="light"] .hlc-paw-line {
  stroke: rgba(89, 49, 116, .46);
}
[data-theme="light"] .hlc-paw-nail {
  fill: #fff2c9;
  stroke: #8b5a25;
}
@media (hover: hover) {
  .hlc-paw-restore:hover .hlc-paw-mark {
    transform: translateX(3px);
  }
}
@media (max-width: 700px) {
  .hlc-motion-panel {
    top:auto;right:auto;bottom:auto;left:auto;
    width: calc(100vw - 20px) !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .hlc-root.is-dragging .hlc-creature,
  .hlc-paw-restore,
  .hlc-paw-mark {
    transition: none !important;
  }
}
