/* Pixel rose cursor set */
@media (hover: hover) and (pointer: fine) {
  :root {
    --cursor-rose: #a32348;
    --cursor-blush: #ffdce6;
    --cursor-hot: #ff5f92;
  }

  html.cursor-ready,
  html.cursor-ready * {
    cursor: none !important;
  }

  .site-cursor,
  .site-cursor-dot {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2147483647;
    pointer-events: none;
    transform: translate3d(-100px, -100px, 0);
    will-change: transform;
  }

  .site-cursor {
    width: 34px;
    height: 34px;
    color: var(--cursor-rose);
    filter:
      drop-shadow(0 2px 0 rgba(255, 255, 255, 0.82))
      drop-shadow(0 10px 18px rgba(81, 21, 39, 0.22));
  }

  .site-cursor svg {
    display: block;
    width: 100%;
    height: 100%;
    shape-rendering: crispEdges;
  }

  .site-cursor-dot {
    width: 8px;
    height: 8px;
    margin: -4px 0 0 -4px;
    border: 2px solid rgba(163, 35, 72, 0.95);
    background: rgba(255, 220, 230, 0.92);
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.55);
    image-rendering: pixelated;
    transition: transform 0.12s ease, opacity 0.12s ease;
  }

  .site-cursor.is-pointer {
    width: 38px;
    height: 38px;
    filter:
      drop-shadow(0 2px 0 rgba(255, 255, 255, 0.9))
      drop-shadow(0 12px 20px rgba(163, 35, 72, 0.28));
  }

  .site-cursor.is-text {
    width: 22px;
    height: 36px;
  }

  .site-cursor.is-hidden,
  .site-cursor-dot.is-hidden {
    opacity: 0;
  }

  .site-cursor-dot.is-pointer {
    transform: translate3d(var(--cursor-x, -100px), var(--cursor-y, -100px), 0) scale(1.7);
    opacity: 0.42;
  }

  .cursor-spark {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 2147483646;
    width: 28px;
    height: 28px;
    margin: -14px 0 0 -14px;
    pointer-events: none;
    color: var(--cursor-hot);
    animation: cursorSpark 0.46s steps(5, end) forwards;
    filter: drop-shadow(0 1px 0 rgba(255, 255, 255, 0.85));
  }

  .cursor-spark svg {
    width: 100%;
    height: 100%;
    display: block;
    shape-rendering: crispEdges;
  }

  @keyframes cursorSpark {
    0% {
      opacity: 0;
      transform: translate3d(var(--spark-x), var(--spark-y), 0) scale(0.45) rotate(0deg);
    }
    18% {
      opacity: 1;
    }
    100% {
      opacity: 0;
      transform: translate3d(var(--spark-x), var(--spark-y), 0) scale(1.45) rotate(45deg);
    }
  }
}
