@media (hover: hover) and (pointer: fine) {
  html.mascot-cursor-active,
  html.mascot-cursor-active * { cursor: none !important; }
  .mascot-cursor {
    position: fixed;
    left: 0;
    top: 0;
    width: 56px;
    height: 56px;
    pointer-events: none;
    z-index: 2147483647;
    opacity: 0;
    contain: layout style;
    transform: translate3d(-100px, -100px, 0);
  }
  .mascot-cursor.is-visible { opacity: 1; }
  .mascot-cursor::before {
    content: '';
    position: absolute;
    left: 23px;
    top: 12px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #c5ff36;
    box-shadow: 0 0 0 1px #17240a;
    z-index: 1;
  }
  .mascot-cursor img { display: block; width: 56px; height: 56px; object-fit: contain; filter: drop-shadow(0 2px 3px #0007); }
  .mascot-cursor.is-moving img { animation: mascot-step 150ms ease-in-out infinite alternate; }
  .mascot-cursor.is-interactive img { scale: 1.08; filter: drop-shadow(0 0 5px #c5ff3680); }
  .mascot-cursor.is-pressed img { transform: scale(.88, .8); animation: none; }
  @keyframes mascot-step { from { transform: rotate(-5deg) translateY(-1px); } to { transform: rotate(5deg) translateY(1px); } }
}
@media (prefers-reduced-motion: reduce) {
  .mascot-cursor.is-moving img { animation: none; }
  .mascot-cursor.is-pressed img { transform: none; }
}
@media (hover: none), (pointer: coarse) { .mascot-cursor { display: none !important; } }