.preview-device .device-image,.device-image{z-index:2}.screenshot{position:absolute;top:0;right:0;bottom:0;left:0;transition:opacity .3s}.screenshot--dark,.dark .screenshot--light{display:none}.dark .screenshot--dark{display:block}.device-image{position:absolute;top:0;right:0;bottom:0;left:0}.device-image--dark,.dark .device-image--light{display:none}.dark .device-image--dark{display:block}.preview-device--desktop,.laptop-frame{position:relative;width:min(639px,85%);max-height:100%}.laptop-frame-inner{position:relative;padding-top:60.34%}.preview-device--desktop .preview-device-overlay{position:absolute;top:1%;right:9%;bottom:7%;left:9%;background-color:#001237;border-radius:10px 10px 0 0;opacity:0;transition:opacity .3s}.preview-device--desktop:hover .preview-device-overlay{opacity:.3}.dark .preview-device--desktop:hover .preview-device-overlay{opacity:.72}.preview-device--mobile,.mobile-frame{position:relative;width:min(190px,100%);max-height:100%;container-type:inline-size;container-name:preview-mobile}.mobile-frame-inner{position:relative;padding-top:203%}.mobile .device{width:99%;height:100%}.mobile .screenshot{width:90.4%;height:auto;left:50%;top:7.5%;right:auto;bottom:1%;margin:0;aspect-ratio:auto;-o-object-fit:cover;object-fit:cover;transform:translate(-50%);border-radius:0 0 15px 15px}.mobile-top-bg{position:absolute;width:92%;height:10%;left:50%;top:0%;right:auto;bottom:auto;margin:0;aspect-ratio:auto;transform:translate(-50%);border-radius:25px 25px 0 0;background-color:var(--background-color)}.preview-device--mobile .preview-device-overlay{position:absolute;top:2.1%;left:50%;right:auto;bottom:1%;width:90.4%;height:auto;transform:translate(-50%);background-color:#001237;border-radius:3px 3px 15px 15px;opacity:0;transition:opacity .3s}.preview-device--mobile:hover .preview-device-overlay{opacity:.3}.dark .preview-device--mobile:hover .preview-device-overlay{opacity:.72}@media (max-width: 1152px){.mobile-frame:not(.crossdevice-mobile-frame){max-width:60%}}.preview-device-actions{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;z-index:10;opacity:0;transition:opacity .3s;pointer-events:none}.preview-device:hover .preview-device-actions{opacity:1;pointer-events:auto}.preview-device-actions--desktop{top:1%;right:9%;bottom:7%;left:9%;border-radius:10px 10px 0 0}.preview-device-actions--mobile{top:6%;left:50%;right:auto;bottom:1%;width:90.4%;height:auto;transform:translate(-50%);border-radius:0 0 15px 15px}.preview-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;border-radius:8px;color:var(--white);background:linear-gradient(188deg,#0f68a1 7.86%,#164685 92.75%);cursor:pointer;transition:all .3s;box-shadow:0 0 16px 4px #00000014;will-change:transform;position:relative;overflow:hidden;font-weight:500;font-size:.875rem;line-height:1.25rem;white-space:nowrap}.preview-device-actions--mobile .preview-button{padding:8px 16px;font-size:.8rem}.preview-button:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(-188deg,#0f68a1 7.86%,#164685 92.75%);opacity:0;transition:opacity .3s;z-index:-1}.preview-button:hover:before,.preview-button:focus:before{opacity:1}.preview-button:hover,.preview-button:focus{transform:scale3d(1.05,1.05,1);transform-origin:center center;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a}.discover-link{display:inline-flex;align-items:center;gap:6px;transition:color .2s;color:var(--white);font-weight:500;font-size:.875rem;line-height:1.25rem;white-space:nowrap}.preview-device-actions--mobile .discover-link{font-size:.8rem}.discover-link:hover{color:#fffc}.discover-link .btn-icon{flex-shrink:0;transition:transform .2s ease}.discover-link:hover .btn-icon{transform:translate3d(4px,0,0)}.btn-icon{width:1rem;height:1rem;flex-shrink:0}@container preview-mobile (max-width: 170px){.preview-device-actions{gap:8px}.preview-button{gap:4px;padding:5px 10px;border-radius:5px;font-size:.6rem;line-height:1;box-shadow:0 0 8px 2px #00000014}.discover-link{gap:3px;font-size:.6rem;line-height:1}.btn-icon{width:.7rem;height:.7rem}}@container preview-mobile (max-width: 140px){.preview-device-actions{gap:6px}.preview-button{padding:4px 8px;font-size:.55rem}.discover-link{font-size:.55rem}.btn-icon{width:.625rem;height:.625rem}}@container preview-mobile (max-width: 110px){.preview-device-actions{gap:4px}.preview-button{padding:3px 6px;font-size:.5rem}.discover-link{font-size:.5rem}.btn-icon{width:.55rem;height:.55rem}}@media (max-width: 520px){.preview-device--desktop .preview-button{padding:8px 14px;font-size:.75rem}.preview-device--desktop .discover-link{font-size:.75rem}}@media (max-width: 380px){.preview-device--desktop .preview-button{padding:6px 12px;font-size:.7rem}.preview-device--desktop .discover-link{font-size:.7rem}.preview-device--desktop .btn-icon{width:.875rem;height:.875rem}}.crossdevice-wrapper{position:relative;width:100%;height:100%}.crossdevice-wrapper .preview-device--desktop,.crossdevice-wrapper .laptop{left:4%}.crossdevice-mobile-frame{z-index:11}.crossdevice-wrapper .preview-device--mobile,.crossdevice-wrapper .mobile{position:absolute;right:4%;top:45%;transform:translateY(-42%);width:24.88%;max-height:none}.crossdevice-mobile-frame .preview-device-overlay,.crossdevice-mobile-frame .screenshot{border-radius:0 0 10px 10px}@media (max-width: 1152px){.crossdevice-wrapper .preview-device--mobile,.crossdevice-wrapper .mobile{top:46%}}.crossdevice-mobile-frame .preview-device-actions--mobile{top:1%;right:3%;bottom:1%;left:3%;width:auto;height:auto;transform:none;border-radius:16px;gap:8px}.crossdevice-mobile-frame .preview-button{gap:8px;padding:8px 16px;border-radius:8px;font-size:.8rem;line-height:1.25rem;box-shadow:0 0 16px 4px #00000014}.crossdevice-mobile-frame .discover-link{gap:6px;font-size:.8rem;line-height:1.25rem}.crossdevice-mobile-frame .btn-icon{width:1rem;height:1rem}@media (max-width: 800px){.crossdevice-mobile-frame .preview-device-actions--mobile{gap:6px}.crossdevice-mobile-frame .preview-button{scale:.8;text-wrap:nowrap}.crossdevice-mobile-frame .discover-link{font-size:.7rem;text-wrap:nowrap}.crossdevice-mobile-frame .btn-icon{width:.875rem;height:.875rem}}@media (max-width: 670px){.crossdevice-mobile-frame .preview-device-actions--mobile{gap:4px}.crossdevice-mobile-frame .preview-button{scale:.7}.crossdevice-mobile-frame .discover-link{font-size:.7rem}.crossdevice-mobile-frame .btn-icon{width:.875rem;height:.875rem}}@media (max-width: 570px){.crossdevice-mobile-frame .preview-device-actions--mobile{gap:3px}.crossdevice-mobile-frame .preview-button{scale:.6}.crossdevice-mobile-frame .discover-link{font-size:.6rem}}@media (max-width: 510px){.crossdevice-mobile-frame .preview-device-actions--mobile{gap:2px}.crossdevice-mobile-frame .preview-button{scale:.55;padding:6px 12px;border-radius:5px}.crossdevice-mobile-frame .discover-link{font-size:.55rem}}@media (max-width: 460px){.crossdevice-mobile-frame .preview-device-actions--mobile{gap:1px}.crossdevice-mobile-frame .preview-button{scale:.5}}.gallery-container{margin-left:auto;margin-right:auto;width:100vw;max-width:80rem;padding:3rem 1.5rem}@media (min-width: 640px){.gallery-container{padding:4rem 2rem}}@media (min-width: 1280px){.gallery-container{width:1280px;max-width:1280px}}.filter-wrapper{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:1rem;padding-left:.75rem;padding-right:.75rem;margin-bottom:2rem}.filter-buttons{display:flex;flex-direction:column;gap:.75rem}.filter-buttons-row{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem .5rem}.filter-button{font-weight:400;font-size:14px;line-height:100%;letter-spacing:0%;min-width:120px;height:44px;padding:12px 0;border-radius:8px;transition:all .3s;cursor:pointer;border:1px solid var(--grey-color);background-color:transparent;color:var(--text-secondary-color)}.filter-button:hover{background-color:#d0d7e31a;border-color:var(--grey-color);color:var(--text-secondary-color)}.filter-button.is-checked{background-color:var(--card-color);border-color:transparent;color:var(--text-primary-color);font-weight:700;box-shadow:var(--drop-shadow)}.filter-button.is-checked:hover{border-color:var(--grey-color)}.filter-button[data-category-filter="*"],.filter-button[data-type-filter="*"]{min-width:70px}.searchbar-wrapper{display:flex;flex-direction:column;align-items:flex-end;gap:1rem}.searchbar-container{position:relative;width:100%;min-width:340px}.search-input{width:100%;background-color:transparent;color:var(--text-secondary-color);height:44px;padding:.5rem 2rem .5rem .75rem;font-weight:400;font-size:.875rem;line-height:100%;letter-spacing:0%;border:1px solid var(--grey-color);border-radius:.375rem}.search-input:focus{outline:none;box-shadow:0 0 0 1px var(--accent-color)}.search-input::-webkit-search-cancel-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:none}.search-input::-webkit-search-decoration{-webkit-appearance:none;-moz-appearance:none;appearance:none}.search-input::-moz-placeholder{color:var(--text-secondary-color);font-weight:400;font-size:14px;line-height:100%;opacity:.5}.search-input::placeholder{color:var(--text-secondary-color);font-weight:400;font-size:14px;line-height:100%;opacity:.5}.search-icon-wrapper{position:absolute;right:8px;top:50%;transform:translateY(-50%);pointer-events:none}.search-icon{color:var(--text-primary-color)}.clear-filters-btn{cursor:pointer;padding-right:4px;text-decoration:underline;transition:opacity .2s;color:var(--text-secondary-color);font-weight:400;font-size:.875rem;line-height:100%;letter-spacing:0%}.clear-filters-btn:hover{opacity:.8}.clear-filters-btn.hidden{display:none}@media (max-width: 1152px){.filter-wrapper{max-width:866px;margin-left:auto;margin-right:auto}}@media (max-width: 897px){.searchbar-wrapper{width:100%}.searchbar-wrapper>div{min-width:0!important}.searchbar-container{min-width:0}.filter-buttons{width:100%}.filter-buttons button{min-width:0!important;flex:1}.filter-button[data-category-filter="*"],.filter-button[data-type-filter="*"]{flex:.35}}@media (max-width: 768px){.filter-wrapper{padding:0}}@media (max-width: 520px){.filter-button,#quicksearch{font-size:clamp(12px,2.6vw,14px)}.filter-button[data-category-filter="*"],.filter-button[data-type-filter="*"]{padding-left:3px;padding-right:3px}}.grid-isotope{width:100%;opacity:0;transition:opacity .3s ease}.grid-isotope.loaded{opacity:1}.grid-item{float:left;padding:12px;width:calc(100% / 3);aspect-ratio:36/55}.grid-item.large-item{width:calc(100% / 3 * 2);aspect-ratio:72/55}.alone-in-row{width:100%!important;aspect-ratio:108/55!important}.alone-in-row>div{display:flex;justify-content:center}@media (max-width: 1151px){.grid-isotope{max-width:866px;margin:0 auto}.grid-item{width:50%;aspect-ratio:36/50}.grid-item.large-item{width:100%;aspect-ratio:72/50}.alone-in-row{aspect-ratio:108/50!important}}@media (max-width: 767px){.grid-isotope{max-width:100%;margin:0 auto}.grid-item{width:100%;aspect-ratio:unset}.grid-item.large-item{aspect-ratio:unset}.alone-in-row{aspect-ratio:unset!important}}.preview-card-container{position:relative;display:flex;flex-direction:column;padding:clamp(24px,2.6vw,32px) 24px;gap:16px;width:100%;height:100%;overflow:hidden;border-radius:16px;background-color:var(--card-background-color);box-shadow:var(--card-shadow);transition:transform .3s,box-shadow .3s;will-change:transform;backface-visibility:hidden;z-index:1}.preview-card-container:hover{transform:translateY(-.25rem);box-shadow:var(--card-shadow-hover)}.preview-card-container:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:16px;background:radial-gradient(ellipse at top left,var(--top-radial) 0%,rgba(21,75,138,0) 50%),radial-gradient(ellipse at bottom right,var(--bottom-radial) 0%,rgba(21,75,138,0) 50%),var(--card-background-color);opacity:0;transition:opacity .3s ease;pointer-events:none;z-index:0}.preview-card-container:hover:after{opacity:1}.preview-card-container:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:16px;padding:2px;background:linear-gradient(-45deg,var(--stroke-0) 0%,rgba(21,76,138,0) 45%,var(--stroke-1) 100%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;z-index:10;opacity:0;transition:opacity .3s ease;pointer-events:none}.preview-card-container:hover:before{opacity:1}.preview-card-device{position:relative;flex:1;z-index:1;display:flex;justify-content:center;align-items:center;min-height:0}.preview-card-container:hover .preview-device-actions{opacity:1;pointer-events:auto}.preview-card-container:hover .preview-device--desktop .preview-device-overlay,.preview-card-container:hover .preview-device--mobile .preview-device-overlay{opacity:.3}.dark .preview-card-container:hover .preview-device--desktop .preview-device-overlay,.dark .preview-card-container:hover .preview-device--mobile .preview-device-overlay{opacity:.72}.alone-in-row .crossdevice-wrapper{width:calc(100% / 3 * 2)}.preview-card-header{position:relative;z-index:1}.preview-card-title{margin-bottom:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-primary-color);font-weight:600;font-size:1.5rem;letter-spacing:.01rem}.card-badges{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px}.card-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:9999px;font-weight:400;font-size:.75rem;color:var(--text-primary-color)}.card-badge--brand{background-color:transparent;padding-left:0!important}.card-badge--type{background-color:var(--card-badge-background-color)}.badge-icon{display:inline-block;width:16px;height:16px;background-color:var(--text-primary-color);-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:contain;mask-repeat:no-repeat;mask-position:center;mask-size:contain}@media (max-width: 1151px){.preview-card-title{font-size:1.25rem}.card-badge{font-size:.625rem;padding:4px 8px}}.no-results-wrapper{padding:8rem 0;text-align:center}.no-results-wrapper.hidden{display:none}.no-results-text{font-size:1.25rem;color:var(--text-secondary-color)}.load-more-wrapper{padding:2rem 0;text-align:center}.load-more-wrapper.hidden{display:none}.load-more-btn{cursor:pointer;text-decoration:underline;transition:opacity .2s;color:var(--text-secondary-color);background:transparent;border:none;font-weight:300;font-size:24px}.load-more-btn:hover{opacity:.8}