.hat-button{background:0 0;padding:0;line-height:0;display:block}.hat-art{transform-origin:50% 80%;width:100%;height:100%;transition:translate .26s cubic-bezier(.34,1.56,.64,1),rotate .26s cubic-bezier(.34,1.56,.64,1),scale .12s ease-out;overflow:visible}@media (hover:hover){.hat-button:hover .hat-art{translate:0 -4px;rotate:-6deg}}.hat-button:active .hat-art{scale:.94}.hat-drop{animation:.48s both hat-drop}@keyframes hat-drop{0%{opacity:0;animation-timing-function:cubic-bezier(.5,0,.9,.5);transform:translateY(-14px)scale(.86,1.1)}40%{opacity:1;animation-timing-function:ease-out;transform:translateY(0)scale(1.1,.88)}68%{animation-timing-function:ease-in-out;transform:translateY(-2px)scale(.97,1.04)}to{transform:none}}@media (prefers-reduced-motion:reduce){.hat-art{animation:none;translate:none;rotate:none;scale:none}}.hat-map{z-index:-1;color:#493a2c;pointer-events:none;width:100%;height:100%;position:fixed;inset:0;-webkit-mask-image:radial-gradient(440px 380px,#0000 62%,#000 100%);mask-image:radial-gradient(440px 380px,#0000 62%,#000 100%)}.hat-map-land{fill:#30372e;fill-opacity:.055}.hat-map-lines{stroke:#30372e;stroke-opacity:.12;stroke-width:.35px}.hat-map-hats{opacity:.62}.hat-map-hat{animation:7s ease-in-out infinite alternate hat-map-bob}@keyframes hat-map-bob{0%{transform:translateY(.6px)}to{transform:translateY(-.6px)}}@media (width<=640px){.hat-map{-webkit-mask-image:radial-gradient(100% 36%,#0000 60%,#000 100%);mask-image:radial-gradient(100% 36%,#0000 60%,#000 100%)}}@media (prefers-reduced-motion:reduce){.hat-map-hat{animation:none}}
