.skills-hero .tile{cursor:pointer;--eye-factor-x:0.18;--eye-factor-y:0.18;--buddy-factor-x:0.28;--buddy-factor-y:0.28;--eye-x:1px;--eye-y:-0.6px;--buddy-x:2px;--buddy-y:-1.4px}.skills-hero .tile .buddy,.skills-hero .tile .eyes,.skills-hero .tile .tile-shell{transition:transform .28s cubic-bezier(.2,.9,.22,1),filter .28s ease;transform-box:fill-box;transform-origin:center;will-change:transform,filter}.skills-hero .tile:hover .tile-shell{filter:drop-shadow(0 10px 18px rgba(17,17,17,.08))}.skills-hero .tile:hover .eyes{transform:translate(-moz-calc(var(--pointer-x,0) * var(--eye-factor-x,.2) + var(--eye-x,1.2px)),-moz-calc(var(--pointer-y,0) * var(--eye-factor-y,.2) + var(--eye-y,-.8px)));transform:translate(calc(var(--pointer-x, 0px) * var(--eye-factor-x, .2) + var(--eye-x, 1.2px)),calc(var(--pointer-y, 0px) * var(--eye-factor-y, .2) + var(--eye-y, -.8px)))}.skills-hero .tile:hover .buddy{transform:translate(-moz-calc(var(--pointer-x,0) * var(--buddy-factor-x,.34) + var(--buddy-x,2px)),-moz-calc(var(--pointer-y,0) * var(--buddy-factor-y,.34) + var(--buddy-y,-2px)));transform:translate(calc(var(--pointer-x, 0px) * var(--buddy-factor-x, .34) + var(--buddy-x, 2px)),calc(var(--pointer-y, 0px) * var(--buddy-factor-y, .34) + var(--buddy-y, -2px)))}@media(prefers-reduced-motion:reduce){.skills-hero .tile .buddy,.skills-hero .tile .eyes,.skills-hero .tile .tile-shell{transition:none}}