:root{--theme-body-bg:#0f0f1a}body{background-color:#0f0f1a;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}:focus{outline:none}:focus-visible{outline:3px solid #09f}a,button,input{transition:all .3s ease}img{background:linear-gradient(135deg,#1a1a2e,#16213e)}:root{--theme-body-bg:#0a0a0f;--theme-body-txt:#fff;--color-primary:#09f;--color-primary-dark:#07c;--color-surface:hsla(0,0%,100%,.05);--color-surface-hover:hsla(0,0%,100%,.1);--color-border:hsla(0,0%,100%,.08)}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#0a0a0f;background-color:var(--theme-body-bg);color:#fff;color:var(--theme-body-txt);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;line-height:1.5}.App{display:flex;flex-direction:column;min-height:100vh}.App-content{background-color:#0a0a0f;background-color:var(--theme-body-bg);color:#fff;color:var(--theme-body-txt);flex:1 1;margin:0 auto;max-width:1400px;padding:1.5rem;width:100%}.App-footer{background:hsla(0,0%,100%,.05);background:var(--color-surface);border-top:1px solid hsla(0,0%,100%,.08);border-top:1px solid var(--color-border);padding:1.5rem;text-align:center}.App-footer p{color:hsla(0,0%,100%,.7);font-size:.95rem;margin:0 0 .5rem}.App-footer small{color:hsla(0,0%,100%,.5);font-size:.8rem}a{color:#09f;color:var(--color-primary);text-decoration:none;transition:color .3s ease}a:hover{color:#33adff}button{font-family:inherit}::-webkit-scrollbar{height:8px;width:8px}::-webkit-scrollbar-track{background:#0a0a0f;background:var(--theme-body-bg)}::-webkit-scrollbar-thumb{background:hsla(0,0%,100%,.15);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:hsla(0,0%,100%,.25)}::selection{background:rgba(0,153,255,.3);color:#fff}:focus-visible{outline:2px solid #09f;outline:2px solid var(--color-primary);outline-offset:2px}@media (max-width:600px){.App-content{padding:1rem}}.Gif{background:hsla(0,0%,100%,.05);border-radius:8px;margin-bottom:0;overflow:hidden}.Gif,.Gif-link{position:relative}.Gif-link{color:inherit;display:block;height:100%;text-decoration:none;width:100%}.Gif h4{background:rgba(0,0,0,.7);bottom:0;color:#fff;font-size:12px;left:0;margin:0;overflow:hidden;padding:.5rem;position:absolute;right:0;text-overflow:ellipsis;transition:background .3s ease;white-space:nowrap;z-index:2}.Gif img{display:block;height:100%;object-fit:cover;transition:-webkit-transform .3s ease;transition:transform .3s ease;transition:transform .3s ease,-webkit-transform .3s ease;width:100%}.Gif:hover img{-webkit-transform:scale(1.05);transform:scale(1.05)}.Gif:hover h4{background:rgba(0,153,255,.9)}.Gif:nth-child(5n+1):hover h4{background:rgba(0,217,255,.9)}.Gif:nth-child(5n+2):hover h4{background:hsla(0,100%,71%,.9)}.Gif:nth-child(5n+3):hover h4{background:rgba(78,205,196,.9)}.Gif:nth-child(5n+4):hover h4{background:rgba(255,230,109,.9);color:#000}.Gif:nth-child(5n+5):hover h4{background:rgba(161,140,209,.9)}.Gif:nth-child(11n+1){grid-column:span 2;grid-row:span 2}.Gif:nth-child(8n+1){grid-column-end:span 2;grid-row-end:span 2}@media screen and (max-width:45rem){.Gif:nth-child(11n+1),.Gif:nth-child(8n+1){grid-column:span 1;grid-row:span 1}}:root{--results-columns:2;--gridList-gap:6px;--brand-color_1:#00d9ff;--brand-color_2:#ff6b6b;--brand-color_3:#4ecdc4;--brand-color_4:#ffe66d;--brand-color_5:#a18cd1}.ListOfGifs{grid-gap:6px;grid-gap:var(--gridList-gap);align-items:stretch;display:grid;gap:6px;gap:var(--gridList-gap);grid-template-columns:repeat(2,1fr);grid-template-columns:repeat(var(--results-columns),1fr);min-height:100vh}.ListOfGifs-item{background-color:#eee;position:relative}.ListOfGifs-empty{align-items:center;color:hsla(0,0%,100%,.8);display:flex;flex-direction:column;justify-content:center;min-height:300px;padding:2rem;text-align:center}.ListOfGifs-empty-emoji{font-size:4rem;margin-bottom:1rem;opacity:.7}.ListOfGifs-empty p{font-size:1.5rem;font-weight:600;margin:0 0 .5rem}.ListOfGifs-empty small{font-size:1rem;opacity:.7}.ListOfGifs-loading{align-items:center;color:hsla(0,0%,100%,.8);display:flex;flex-direction:column;gap:1rem;justify-content:center;padding:2rem}.ListOfGifs-loading-spinner{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;border:4px solid hsla(0,0%,100%,.1);border-radius:50%;border-top-color:#09f;height:40px;width:40px}.ListOfGifs-loading span{font-size:.95rem;opacity:.8}@media (min-width:600px){:root{--results-columns:3}}@media (min-width:800px){:root{--results-columns:4}}@media (min-width:1200px){:root{--results-columns:5}}.SkeletonList{grid-gap:6px;display:grid;gap:6px;grid-template-columns:repeat(2,1fr);grid-template-columns:repeat(var(--results-columns,2),1fr)}.GifSkeleton{aspect-ratio:1/1;background:hsla(0,0%,100%,.05);border-radius:8px;overflow:hidden;position:relative}.GifSkeleton-image{background:linear-gradient(90deg,hsla(0,0%,100%,.03),hsla(0,0%,100%,.08) 50%,hsla(0,0%,100%,.03));background-size:200% 100%;inset:0}.GifSkeleton-image,.GifSkeleton-title{-webkit-animation:shimmer 1.5s infinite;animation:shimmer 1.5s infinite;position:absolute}.GifSkeleton-title{background:linear-gradient(90deg,hsla(0,0%,100%,.05),hsla(0,0%,100%,.1) 50%,hsla(0,0%,100%,.05));background-size:200% 100%;bottom:0;height:36px;left:0;right:0}@-webkit-keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.SkeletonList .GifSkeleton:nth-child(11n+1){grid-column:span 2;grid-row:span 2}.SkeletonList .GifSkeleton:nth-child(8n+1){grid-column-end:span 2;grid-row-end:span 2}@media screen and (max-width:45rem){.SkeletonList .GifSkeleton:nth-child(11n+1),.SkeletonList .GifSkeleton:nth-child(8n+1){grid-column:span 1;grid-row:span 1}}@media (min-width:600px){.SkeletonList{--results-columns:3}}@media (min-width:800px){.SkeletonList{--results-columns:4}}@media (min-width:1200px){.SkeletonList{--results-columns:5}}.loader{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;border:10px solid #f3f3f3;border-radius:50%;border-top-color:#3498db;height:80px;width:80px}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.Home-title{color:#fff;font-size:1.5rem;font-weight:600;margin:2rem 0 1rem}.Home-error{align-items:center;background:hsla(0,100%,71%,.1);border:1px solid hsla(0,100%,71%,.3);border-radius:16px;display:flex;flex-direction:column;justify-content:center;margin:2rem 0;padding:3rem 2rem;text-align:center}.Home-error span{font-size:3rem;margin-bottom:1rem}.Home-error p{color:#ff6b6b;font-size:1.1rem;margin-bottom:1.5rem}.Home-error button{background:#ff6b6b;border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;padding:.75rem 1.5rem;transition:all .3s ease}.Home-error button:hover{background:#ee5a5a;-webkit-transform:translateY(-2px);transform:translateY(-2px)}.Home-popular{background:hsla(0,0%,100%,.03);border:1px solid hsla(0,0%,100%,.05);border-radius:16px;margin-top:3rem;padding:2rem}.Home-popular-title{color:#fff;font-size:1.25rem;font-weight:600;margin:0 0 1rem}.Home-popular-list{display:flex;flex-wrap:wrap;gap:.75rem;list-style:none;margin:0;padding:0}.Home-popular-link{align-items:center;background:hsla(0,0%,100%,.08);border-radius:50px;color:hsla(0,0%,100%,.9);display:inline-flex;font-size:.95rem;gap:.5rem;padding:.625rem 1rem;text-decoration:none;transition:all .3s ease}.Home-popular-link:hover{background:hsla(0,0%,100%,.15);color:#fff;-webkit-transform:translateY(-2px);transform:translateY(-2px)}.Home-popular-icon{align-items:center;display:flex;height:18px;justify-content:center;width:18px}.Home-popular-icon svg{height:100%;width:100%}.Home-title{align-items:center;display:flex;gap:.5rem}.Home-title svg{color:#ff6b6b;height:24px;width:24px}@media (max-width:600px){.Home-popular{padding:1.5rem}}.Toast-overlay{align-items:flex-start;-webkit-animation:fadeIn .2s ease;animation:fadeIn .2s ease;bottom:0;display:flex;justify-content:center;left:0;padding-top:80px;pointer-events:auto;position:fixed;right:0;top:0;z-index:1000}@-webkit-keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.Toast{align-items:center;-webkit-animation:slideDown .3s cubic-bezier(.16,1,.3,1);animation:slideDown .3s cubic-bezier(.16,1,.3,1);background:#fff;border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,.15),0 0 0 1px rgba(0,0,0,.05);display:flex;gap:.875rem;max-width:90vw;min-width:320px;padding:1rem 1.25rem;pointer-events:auto;position:relative}@-webkit-keyframes slideDown{0%{opacity:0;-webkit-transform:translateY(-20px) scale(.96);transform:translateY(-20px) scale(.96)}to{opacity:1;-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1)}}@keyframes slideDown{0%{opacity:0;-webkit-transform:translateY(-20px) scale(.96);transform:translateY(-20px) scale(.96)}to{opacity:1;-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1)}}.Toast--success .Toast-icon{color:#10b981}.Toast--error .Toast-icon{color:#ef4444}.Toast--info .Toast-icon{color:#3b82f6}.Toast-icon{align-items:center;display:flex;flex-shrink:0;height:20px;justify-content:center;width:20px}.Toast-icon svg{height:100%;width:100%}.Toast-message{color:#1f2937;flex:1 1;font-size:.9375rem;font-weight:500;line-height:1.4}.Toast-close{align-items:center;background:transparent;border:none;border-radius:6px;color:#9ca3af;cursor:pointer;display:flex;flex-shrink:0;height:24px;justify-content:center;padding:0;transition:all .2s ease;width:24px}.Toast-close svg{height:16px;width:16px}.Toast-close:hover{background:#f3f4f6;color:#4b5563}.Toast-progress{background:rgba(0,0,0,.06);border-radius:0 0 12px 12px;bottom:0;height:3px;left:0;overflow:hidden;position:absolute;right:0}.Toast-progress-bar{-webkit-animation:progress 3s linear forwards;animation:progress 3s linear forwards;height:100%}.Toast--success .Toast-progress-bar{background:#10b981}.Toast--error .Toast-progress-bar{background:#ef4444}.Toast--info .Toast-progress-bar{background:#3b82f6}@-webkit-keyframes progress{0%{width:100%}to{width:0}}@keyframes progress{0%{width:100%}to{width:0}}@media (prefers-color-scheme:dark){.Toast-overlay{background:rgba(0,0,0,.4)}.Toast{background:#1f2937;box-shadow:0 4px 20px rgba(0,0,0,.4),0 0 0 1px hsla(0,0%,100%,.05)}.Toast-message{color:#f9fafb}.Toast-close:hover{color:#d1d5db}.Toast-close:hover,.Toast-progress{background:hsla(0,0%,100%,.1)}}@media (max-width:480px){.Toast-overlay{align-items:flex-start;padding-top:16px}.Toast{margin:0 1rem;min-width:auto;padding:.875rem 1rem;width:calc(100vw - 2rem)}.Toast-message{font-size:.875rem}}.Detail{min-height:60vh}.Detail-content{margin:0 auto;max-width:800px}.Detail-figure{background:hsla(0,0%,100%,.05);border:1px solid hsla(0,0%,100%,.1);border-radius:16px;margin:0;overflow:hidden}.Detail-image{background:linear-gradient(135deg,#1a1a2e,#16213e);display:block;height:auto;width:100%}.Detail-caption{padding:1.5rem}.Detail-title{color:#fff;font-size:1.5rem;font-weight:600;line-height:1.4;margin:0}.Detail-actions{display:flex;flex-wrap:wrap;gap:1rem;margin-top:1.5rem}.Detail-button{align-items:center;border:none;border-radius:10px;cursor:pointer;display:inline-flex;font-size:.9375rem;font-weight:500;gap:.625rem;padding:.875rem 1.5rem;text-decoration:none;transition:all .2s ease}.Detail-button-icon{align-items:center;display:flex;height:18px;justify-content:center;width:18px}.Detail-button-icon svg{height:100%;width:100%}.Detail-button--primary{background:linear-gradient(135deg,#09f,#06c);color:#fff}.Detail-button--primary:hover{box-shadow:0 8px 25px rgba(0,153,255,.4);-webkit-transform:translateY(-2px);transform:translateY(-2px)}.Detail-button--secondary{background:hsla(0,0%,100%,.1);border:1px solid hsla(0,0%,100%,.2);color:#fff}.Detail-button--secondary:hover{background:hsla(0,0%,100%,.2);-webkit-transform:translateY(-2px);transform:translateY(-2px)}.Detail-error,.Detail-loading,.Detail-notfound{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:60vh;text-align:center}.Detail-error p,.Detail-loading p,.Detail-notfound p{color:hsla(0,0%,100%,.8);font-size:1.1rem;margin-top:1rem}.Detail-error span,.Detail-notfound span{font-size:4rem}.Detail-back{color:#09f;font-weight:600;margin-top:1.5rem;text-decoration:none;transition:color .3s ease}.Detail-back:hover{color:#33adff}@media (max-width:600px){.Detail-title{font-size:1.25rem}.Detail-actions{flex-direction:column}.Detail-button{justify-content:center;width:100%}}.SearchResults{min-height:60vh}.SearchResults-header{border-bottom:1px solid hsla(0,0%,100%,.1);margin-bottom:2rem;padding-bottom:1rem}.SearchResults-title{color:#fff;font-size:1.5rem;font-weight:600;margin:0 0 .5rem}.SearchResults-keyword{color:#09f}.SearchResults-count{color:hsla(0,0%,100%,.6);font-size:.95rem;margin:0}.SearchResults-error{align-items:center;background:hsla(0,100%,71%,.1);border:1px solid hsla(0,100%,71%,.3);border-radius:16px;display:flex;flex-direction:column;justify-content:center;padding:3rem 2rem;text-align:center}.SearchResults-error span{font-size:3rem;margin-bottom:1rem}.SearchResults-error p{color:#ff6b6b;font-size:1.1rem;margin-bottom:1.5rem}.SearchResults-error button{background:#ff6b6b;border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;padding:.75rem 1.5rem;transition:all .3s ease}.SearchResults-error button:hover{background:#ee5a5a;-webkit-transform:translateY(-2px);transform:translateY(-2px)}@media (max-width:600px){.SearchResults-title{font-size:1.25rem}}.ErrorBoundary{align-items:center;background:linear-gradient(135deg,#1a1a2e,#16213e);display:flex;justify-content:center;min-height:100vh;padding:2rem}.ErrorBoundary-content{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:hsla(0,0%,100%,.05);border:1px solid hsla(0,0%,100%,.1);border-radius:20px;max-width:600px;padding:3rem;text-align:center}.ErrorBoundary-emoji{-webkit-animation:shake .5s ease-in-out;animation:shake .5s ease-in-out;display:block;font-size:5rem;margin-bottom:1rem}@-webkit-keyframes shake{0%,to{-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}75%{-webkit-transform:translateX(10px);transform:translateX(10px)}}@keyframes shake{0%,to{-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}75%{-webkit-transform:translateX(10px);transform:translateX(10px)}}.ErrorBoundary-title{color:#fff;font-size:2rem;font-weight:700;margin-bottom:1rem}.ErrorBoundary-message{color:hsla(0,0%,100%,.8);font-size:1.1rem;line-height:1.6;margin-bottom:2rem}.ErrorBoundary-details{background:rgba(0,0,0,.3);border-radius:8px;margin:1.5rem 0;padding:1rem;text-align:left}.ErrorBoundary-details summary{color:#09f;cursor:pointer;font-weight:600}.ErrorBoundary-stack{background:rgba(0,0,0,.5);border-radius:4px;color:#ff6b6b;font-size:.85rem;margin-top:1rem;overflow-x:auto;padding:1rem}.ErrorBoundary-actions{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}.ErrorBoundary-button{border:none;border-radius:12px;cursor:pointer;font-size:1rem;font-weight:600;padding:.875rem 1.5rem;transition:all .3s ease}.ErrorBoundary-button--primary{background:linear-gradient(135deg,#09f,#06c);color:#fff}.ErrorBoundary-button--primary:hover{box-shadow:0 8px 25px rgba(0,153,255,.4);-webkit-transform:translateY(-2px);transform:translateY(-2px)}.ErrorBoundary-button--secondary{background:hsla(0,0%,100%,.1);border:1px solid hsla(0,0%,100%,.2);color:#fff}.ErrorBoundary-button--secondary:hover{background:hsla(0,0%,100%,.2);-webkit-transform:translateY(-2px);transform:translateY(-2px)}@media (max-width:480px){.ErrorBoundary-content{padding:2rem 1.5rem}.ErrorBoundary-title{font-size:1.5rem}.ErrorBoundary-actions{flex-direction:column}.ErrorBoundary-button{width:100%}}.SearchHeader{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,rgba(15,15,26,.98),rgba(22,33,62,.98));border-bottom:1px solid hsla(0,0%,100%,.08);padding:.75rem 1rem;position:-webkit-sticky;position:sticky;top:0;z-index:100}.SearchHeader-container{align-items:center;display:flex;gap:1rem;margin:0 auto;max-width:1400px}.SearchHeader-back{align-items:center;background:hsla(0,0%,100%,.1);border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;flex-shrink:0;font-size:1.25rem;height:40px;justify-content:center;transition:all .3s ease;width:40px}.SearchHeader-back:hover{background:hsla(0,0%,100%,.2);-webkit-transform:translateX(-2px);transform:translateX(-2px)}.SearchHeader-logo{align-items:center;display:flex;flex-shrink:0;gap:.5rem;text-decoration:none}.SearchHeader-logo img{height:40px;object-fit:contain;transition:-webkit-transform .3s ease;transition:transform .3s ease;transition:transform .3s ease,-webkit-transform .3s ease;width:40px}.SearchHeader-logo:hover img{-webkit-transform:scale(1.05) rotate(-5deg);transform:scale(1.05) rotate(-5deg)}.SearchHeader-brand{-webkit-text-fill-color:transparent;background:linear-gradient(135deg,#09f,#00d9ff);-webkit-background-clip:text;background-clip:text;font-size:1.5rem;font-weight:800}.SearchHeader-form{display:flex;flex:1 1;gap:.5rem;margin-left:auto;max-width:500px}.SearchHeader-input{background:hsla(0,0%,100%,.05);border:2px solid hsla(0,0%,100%,.1);border-radius:50px;color:#fff;flex:1 1;font-size:.95rem;padding:.625rem 1rem;transition:all .3s ease}.SearchHeader-input::-webkit-input-placeholder{color:hsla(0,0%,100%,.4)}.SearchHeader-input:-ms-input-placeholder{color:hsla(0,0%,100%,.4)}.SearchHeader-input::placeholder{color:hsla(0,0%,100%,.4)}.SearchHeader-input:focus{background:hsla(0,0%,100%,.08);border-color:#09f;outline:none}.SearchHeader-button{align-items:center;background:linear-gradient(135deg,#09f,#06c);border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;flex-shrink:0;font-size:1rem;height:40px;justify-content:center;transition:all .3s ease;width:40px}.SearchHeader-button:hover:not(:disabled){box-shadow:0 4px 15px rgba(0,153,255,.4);-webkit-transform:scale(1.05);transform:scale(1.05)}.SearchHeader-button:disabled{cursor:not-allowed;opacity:.5}@media (max-width:600px){.SearchHeader-brand{display:none}.SearchHeader-form{max-width:none}}
/*# sourceMappingURL=main.89cc6981.css.map*/