@property --country-cards-fade-start{syntax:"<length>";inherits:false;initial-value:0}@property --country-cards-fade-end{syntax:"<length>";inherits:false;initial-value:0}.country-cards{padding:var(--spacing-1);margin:calc(-1 * var(--spacing-1));scrollbar-width:none;overscroll-behavior-x:contain;-webkit-mask-image:linear-gradient(to right, transparent, currentColor var(--country-cards-fade-start), currentColor calc(100% - var(--country-cards-fade-end)), transparent);mask-image:linear-gradient(to right, transparent, currentColor var(--country-cards-fade-start), currentColor calc(100% - var(--country-cards-fade-end)), transparent);transition:--country-cards-fade-start var(--motion-duration-moderate) var(--motion-easing-standard), --country-cards-fade-end var(--motion-duration-moderate) var(--motion-easing-standard)}.country-cards::-webkit-scrollbar{display:none}.country-cards[data-more-start]{--country-cards-fade-start:var(--spacing-10)}.country-cards[data-more-end]{--country-cards-fade-end:var(--spacing-10)}.country-cards__item{min-inline-size:var(--size-country-cards-item);rotate:calc(var(--country-flag-tilt,0) * 1deg);transition:rotate var(--motion-duration-slow) var(--motion-easing-soft), color var(--motion-duration-slow) var(--motion-easing-soft);-webkit-tap-highlight-color:transparent;position:relative}@media (hover:hover){.country-cards__flag{filter:saturate(var(--motion-hover-flag-rest-saturation)) brightness(var(--motion-hover-flag-rest-brightness))}.country-cards__item:is(:hover,:focus-visible,:active) .country-cards__flag{filter:none}.country-cards__item{color:var(--color-on-canvas-muted)}.country-cards__item:is(:hover,:focus-visible,:active){color:var(--color-on-canvas)}}.country-cards__item.lean-card{perspective:var(--size-country-flag-perspective)}.country-cards .country-cards__badge{transition:transform var(--motion-duration-slow) var(--motion-easing-soft), scale var(--motion-duration-slow) var(--motion-easing-soft)}.country-cards>li:nth-child(5n+1){--country-flag-tilt:var(--motion-flag-tilt-1)}.country-cards>li:nth-child(5n+2){--country-flag-tilt:var(--motion-flag-tilt-2)}.country-cards>li:nth-child(5n+3){--country-flag-tilt:var(--motion-flag-tilt-3)}.country-cards>li:nth-child(5n+4){--country-flag-tilt:var(--motion-flag-tilt-4)}.country-cards>li:nth-child(5n+5){--country-flag-tilt:var(--motion-flag-tilt-5)}.country-cards .country-cards__item:focus-visible{rotate:0deg}.country-cards .country-cards__item:focus-visible .country-cards__badge{scale:var(--motion-hover-flag-scale)}@media (hover:hover){.country-cards .country-cards__item:hover{rotate:0deg}.country-cards .country-cards__item:hover .country-cards__badge{scale:var(--motion-hover-flag-scale)}}.country-cards__badge{display:flex;position:relative}.country-cards__item:before{content:"";inline-size:calc(var(--size-country-flag-width) + 2 * var(--size-country-flag-ring));block-size:calc(var(--size-country-flag-height) + 2 * var(--size-country-flag-ring));translate:calc(-50% - var(--tilt-nx,0) * var(--spacing-1)) calc(var(--tilt-ny,0) * -1 * var(--spacing-1));border-radius:var(--radius-md);box-shadow:var(--shadow-lift);opacity:0;pointer-events:none;transition:opacity var(--motion-duration-glide) var(--motion-easing-soft), scale var(--motion-duration-glide) var(--motion-easing-soft), translate var(--motion-duration-glide) var(--motion-easing-soft);position:absolute;inset-block-start:var(--spacing-1);inset-inline-start:50%}.country-cards__item:focus-visible:before{opacity:1;scale:var(--motion-hover-flag-scale);transition:opacity var(--motion-duration-slow) var(--motion-easing-soft), scale var(--motion-duration-slow) var(--motion-easing-soft)}@media (hover:hover){.country-cards__item:hover:before{opacity:1;scale:var(--motion-hover-flag-scale);transition:opacity var(--motion-duration-slow) var(--motion-easing-soft), scale var(--motion-duration-slow) var(--motion-easing-soft)}}.country-cards__item:active:before{opacity:0;transition:opacity var(--motion-duration-quick) var(--motion-easing-out), scale var(--motion-duration-quick) var(--motion-easing-out)}.country-cards__flag{inline-size:var(--size-country-flag-width);block-size:var(--size-country-flag-height);box-sizing:content-box;border:var(--size-country-flag-ring) solid var(--color-logo-surface);border-radius:var(--radius-md);transition:filter var(--motion-duration-slow) var(--motion-easing-soft);object-fit:cover}.country-cards__remote{place-items:center;display:grid}.country-cards__globe{inline-size:var(--size-country-remote-icon);block-size:var(--size-country-remote-icon)}.country-cards__glare{pointer-events:none;opacity:0;filter:brightness(var(--motion-hover-flag-glare));-webkit-mask-image:radial-gradient(circle at calc((var(--tilt-nx,0) + 1) * 50%) calc((var(--tilt-ny,0) + 1) * 50%), currentColor, transparent calc(var(--motion-hover-flag-glare-reach) * 100%));mask-image:radial-gradient(circle at calc((var(--tilt-nx,0) + 1) * 50%) calc((var(--tilt-ny,0) + 1) * 50%), currentColor, transparent calc(var(--motion-hover-flag-glare-reach) * 100%));transition:opacity var(--motion-duration-slow) var(--motion-easing-soft);display:flex;position:absolute;inset:0}.country-cards .country-cards__item[data-hovering] .country-cards__badge{--card-tilt:var(--motion-hover-flag-tilt);transition:transform var(--motion-duration-press) linear, scale var(--motion-duration-slow) var(--motion-easing-soft)}.country-cards .country-cards__item:focus-visible .country-cards__badge{--tilt-nx:var(--motion-hover-flag-focus-lean);--tilt-ny:calc(-1 * var(--motion-hover-flag-focus-lean));--card-tilt:var(--motion-hover-flag-tilt)}.country-cards__item[data-hovering] .country-cards__glare,.country-cards__item:focus-visible .country-cards__glare{opacity:1}.country-cards .country-cards__item:active .country-cards__badge{--card-sink:var(--motion-press-control);transition:transform var(--motion-duration-quick) var(--motion-easing-out), scale var(--motion-duration-quick) var(--motion-easing-out)}@media (prefers-reduced-motion:reduce){.country-cards{transition:none}.country-cards__glare{display:none}.country-cards__flag,.country-cards__item,.country-cards__item:before,.country-cards .country-cards__badge,.country-cards .country-cards__item[data-hovering] .country-cards__badge{transition:none}.country-cards .country-cards__item:is(:hover,:focus-visible) .country-cards__badge{scale:none}}
