

@media (hover: hover) and (pointer: fine) {
  
  html.gc-on,
  html.gc-on *,
  html.gc-on *::before,
  html.gc-on *::after {
    cursor: none !important;
  }

  html.gc-on .cur,
  html.gc-on .cur-dot {
    display: none !important;
  }

  .gc-cursor {
    position: fixed;
    top: 0;
    left: 0;
    
    width: var(--gc-size, 76px);
    height: calc(var(--gc-size, 76px) * 100 / 140);

    margin-left: calc(var(--gc-size, 76px) * -0.143);
    margin-top: calc(var(--gc-size, 76px) * 100 / 140 * -0.53);
    
    z-index: 2147483000;
    pointer-events: none;
    
    background: url('/gamora-cursor.svg') center/0 0 no-repeat;
    will-change: transform;
    opacity: 0;
    transition:
      opacity 0.22s ease-out,
      width 0.2s cubic-bezier(0.2, 1.4, 0.4, 1),
      height 0.2s cubic-bezier(0.2, 1.4, 0.4, 1);
  }
  .gc-cursor.gc-ready {
    opacity: 1;
  }
  
  .gc-cursor.gc-hidden {
    opacity: 0;
  }

  .gc-img {
    position: absolute;
    inset: 0;
    
    transform-origin: 14.3% 53%;
    
    transform: rotate(var(--gc-rot, 0deg)) scaleX(var(--gc-dir, 1));
    
  }
  .gc-img svg {
    display: block;
    width: 100%;
    height: 100%;
    overflow: visible;
  }
  .gc-cursor:not(.gc-hot) .gc-hv,
  .gc-cursor.gc-hot .gc-rp {
    display: none;
  }

  .gc-cursor.gc-hot {
    --gc-size: 95px;
    background-image: url('/gamora-cursor-hover.svg');
    filter: drop-shadow(0 0 10px rgba(198, 255, 61, 0.55));
  }

  .gc-lengua {
    position: absolute;
    
    left: 14.3%;
    top: 53%;
    pointer-events: none;
    height: 4px;
    width: var(--gc-llen, 60px);
    margin-top: -2px;
    border-radius: 2px 3px 3px 2px;
    background: linear-gradient(90deg, #ff3da8, #ff6fc2);
    box-shadow: 0 0 6px rgba(255, 61, 168, 0.6);
    transform-origin: 0 50%;
    transform: rotate(var(--gc-lang, 0deg)) scaleX(0);
    opacity: 0;
  }
  .gc-lengua.gc-on {
    animation: gcLengua 0.32s cubic-bezier(0.23, 1, 0.32, 1) forwards;
  }
  .gc-lengua::after {
    
    content: '';
    position: absolute;
    right: -4px;
    top: -3px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #ff3da8;
    box-shadow: 0 0 8px rgba(255, 61, 168, 0.8);
  }
  @keyframes gcLengua {
    0% {
      transform: rotate(var(--gc-lang, 0deg)) scaleX(0);
      opacity: 1;
    }
    22% {
      transform: rotate(var(--gc-lang, 0deg)) scaleX(1.04);
      opacity: 1;
    }
    34% {
      transform: rotate(var(--gc-lang, 0deg)) scaleX(1);
      opacity: 1;
    }
    100% {
      transform: rotate(var(--gc-lang, 0deg)) scaleX(0);
      opacity: 0;
    }
  }
  
  .gc-cursor.gc-down .gc-img {
    transform: rotate(var(--gc-rot, 0deg)) scaleX(var(--gc-dir, 1)) rotate(-6deg) translateX(2px);
  }

  .gc-cursor.gc-down {
    --gc-size: 68px;
  }
  .gc-cursor.gc-hot.gc-down {
    --gc-size: 86px;
  }

  .gc-fly {
    position: fixed;
    top: 0;
    left: 0;
    width: 34px;
    height: 34px;
    margin: -17px 0 0 -17px;
    z-index: 2147483001;
    pointer-events: none;
    will-change: transform;
    opacity: 0;
    transition: opacity 0.22s ease-out;
  }
  .gc-fly.gc-ready {
    opacity: 1;
  }
  .gc-fly.gc-hidden {
    opacity: 0;
  }
  .gc-fly-img {
    position: absolute;
    inset: 0;
    transform-origin: 50% 50%;
  }
  .gc-fly-img svg {
    display: block;
    width: 100%;
    height: 100%;
    overflow: visible;
  }
  .gc-fly:not(.gc-hot) .gc-hv,
  .gc-fly.gc-hot .gc-rp {
    display: none;
  }
  
  .gc-fly.gc-comida .gc-fly-img {
    animation: gcComida 0.12s ease-in forwards;
  }
  @keyframes gcComida {
    to {
      transform: scale(0);
      opacity: 0;
    }
  }

  .gc-ring {
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 2147482999;
    width: 18px;
    height: 18px;
    margin: -9px 0 0 -9px;
    border-radius: 50%;
    border: 2.5px solid var(--gc-c, #b44dff);
    animation: gcRing 0.58s cubic-bezier(0.2, 0.8, 0.3, 1) forwards;
  }
  @keyframes gcRing {
    0% {
      transform: scale(0.35);
      opacity: 1;
      border-width: 3px;
    }
    70% {
      opacity: 0.5;
    }
    100% {
      transform: scale(4.6);
      opacity: 0;
      border-width: 1px;
    }
  }

  .gc-spark {
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 2147482999;
    width: 6px;
    height: 6px;
    margin: -3px 0 0 -3px;
    border-radius: 50%;
    background: var(--gc-c, #b44dff);
    box-shadow: 0 0 8px var(--gc-c, #b44dff);
    animation: gcSpark 0.56s cubic-bezier(0.2, 0.7, 0.3, 1) forwards;
  }
  @keyframes gcSpark {
    0% {
      transform: translate(0, 0) scale(1);
      opacity: 1;
    }
    100% {
      transform: translate(var(--gc-dx, 0), var(--gc-dy, 0)) scale(0.2);
      opacity: 0;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .gc-cursor {
      transition: opacity 0.15s ease-out;
    }
    .gc-img,
    .gc-cursor.gc-down .gc-img {
      animation: none;
      transition: none;
      transform: rotate(var(--gc-rot, 0deg)) scaleX(var(--gc-dir, 1));
    }
    .gc-img svg * {
      animation: none !important;
    }
    .gc-ring,
    .gc-spark,
    .gc-lengua {
      display: none;
    }
  }
}
