.library-emoji-animation-item{width:min(100%,13.6rem);aspect-ratio:1;border-radius:1.6rem;transition:background-color .4s ease-out}.library-emoji-animation-item .image{width:100%;aspect-ratio:1;cursor:pointer;padding:.15em}.library-emoji-animation-item .image ._image{aspect-ratio:1;background-size:cover;scale:1.3}.library-emoji-animation-item .image.v-enter-active{transition:opacity .2s ease,scale .3s ease-out}.library-emoji-animation-item .image.v-enter-from,.library-emoji-animation-item .image.v-leave-to{scale:.6;opacity:0}.library-emoji-animation-item:hover{background:var(--clr-green-400)}.animations-list{--clamp-nested: var(--clamp, clamp(10.4rem, 8vw, 13.6rem));font-size:var(--clamp-nested);display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--clamp-nested),1fr));gap:.15em}@media (width < 600px){.animations-list{--clamp: clamp(8.8rem, 12vw, 10.4rem)}}.library-emoji-animations-set{display:flex;flex-direction:column;gap:var(--gap, 1.6em)}.library-emoji-animations-set .search-results-label{font-size:1.8em;color:var(--clr-metal-600)}.library-emoji-animations-set .cat-header{position:sticky;top:var(--stickyFiltersHeight, 156px);z-index:2;background:light-dark(var(--clr-white),var(--clr-metal-900));padding-block:1.6em;box-shadow:0 6px 6px 6px light-dark(var(--clr-white),var(--clr-metal-900))}.library-emoji-animations-set .results{--clamp: clamp(5.8rem, 8vw, 14rem);position:relative;font-size:var(--clamp);height:var(--h, auto)}.library-emoji-animations-set .results.no-results{height:auto;overflow:visible}.library-emoji-animations-set .results.no-results .emoji-list{display:flex;place-items:center;place-content:center}.library-emoji-animations-set .results .loading-ui{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;width:100%;height:100%;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:1.6rem;display:flex;place-content:center;place-items:center;transition:opacity .2s ease-out}.library-emoji-animations-set .results .loading-ui .emoji{font-size:8rem;animation:rock 3s ease-in-out infinite;transition:scale .3s ease-out}.library-emoji-animations-set .results .loading-ui.v-enter-from,.library-emoji-animations-set .results .loading-ui.v-leave-to{opacity:0}.library-emoji-animations-set .results .loading-ui.v-enter-from .emoji,.library-emoji-animations-set .results .loading-ui.v-leave-to .emoji{scale:.6}@keyframes rock{0%{transform:rotate(0)}20%{transform:rotate(-10deg)}40%{transform:rotate(0)}60%{transform:rotate(10deg)}80%{transform:rotate(10deg)}to{transform:rotate(0)}}.library-emoji-animations{min-height:100vh;display:flex;flex-direction:column;padding-top:clamp(2.4rem,5cqw,8rem);gap:1.6em}.animations-sub-header{--h-space: 0em;display:grid;gap:1.6em 1.6em;align-items:center;grid-template-columns:1fr;grid-template-areas:"tabs" "." "title" "." "text" "." "tags" "toggle";grid-auto-rows:auto;padding:0 var(--pad-lr)}.animations-sub-header .library-segmented-control-tabs{grid-area:tabs}.animations-sub-header h2{grid-area:title}.animations-sub-header p{grid-area:text}.animations-sub-header .tag-group{grid-area:tags}.animations-sub-header .with-label{grid-area:toggle;justify-self:end}.animations-sub-header h2{font-family:var(--ff-dm-sans)!important;font-size:clamp(3rem,4cqw,5.6rem);font-weight:900;color:light-dark(var(--clr-metal-950),var(--clr-white))}.animations-sub-header>p{color:light-dark(var(--clr-metal-700),var(--clr-metal-300));line-height:1.4em}@media (width <= 1000px){.library-sub-header{grid:auto / 1fr auto;grid-template-areas:"tabs tabs" "text text" "tags tags" ". toggle"}.library-sub-header h2{display:none}}.template-emoji-details.__animation{grid-template-rows:auto auto;grid-template-areas:"header header" "viewer features" "footer  footer"}.template-emoji-details.__animation:not(:has(>footer)){grid-template-rows:auto auto;grid-template-areas:"header header" "viewer features"}@container (width < 950px){.template-emoji-details.__animation{grid-template-columns:1fr;grid-template-rows:auto auto auto auto;grid-template-areas:"header" "viewer" "features" "footer"}.template-emoji-details.__animation:not(:has(>footer)){grid-template-rows:auto auto auto;grid-template-areas:"header" "viewer" "features"}}@container (width < 415px){.template-emoji-details.__animation section.premium-features{display:block!important}.template-emoji-details.__animation>.features-container>.features>section>.buttons{grid-template-columns:1fr}}#page-library-animations .flow.col.end{display:flex;flex-direction:column;align-items:flex-end;gap:1.6em}html[data-theme=light] #page-library-animations{color-scheme:light}html[data-theme=dark] #page-library-animations{color-scheme:dark}
