/* Top banner: keep each creative's requested proportions without horizontal overflow. */
.top-banner { margin: 1.5rem 0 2rem; }
.top-banner-no-desktop { display: none; }
.top-banner-variant { max-width: 100%; }
.top-banner-collection { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 16px; width: 100%; }
.top-banner-centered { justify-content: center; }
/* Empty cells keep the last row on the left; occupied rows span the content width. */
.top-banner-start { display: grid; grid-template-columns: repeat(auto-fit, 250px); justify-content: space-between; }
.top-banner-item { flex: 0 0 250px; width: 250px; height: 250px; }
.top-banner-mobile { display: none; width: 468px; aspect-ratio: 468 / 60; margin-inline: auto; }
.top-banner-variant a, .top-banner-variant img { display: block; width: 100%; height: 100%; }
.top-banner-variant img { object-fit: contain; }
.top-banner-placeholder { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .3rem; border: 1px dashed #50617c; border-radius: 4px; background: #19273e; color: #a8b8cf; font-size: .75rem; letter-spacing: .04em; }
.top-banner-placeholder small { font-size: .65rem; color: #8294af; }
.top-banner-variant a:focus-visible { outline: 2px solid #32acff; outline-offset: 4px; }
.clone-country-flags { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 5px; margin-inline-start: .4em; vertical-align: middle; line-height: 1; }
img.clone-country-flag { display: inline-block; width: 24px; height: 18px; max-width: none; object-fit: contain; border-radius: 2px; box-shadow: 0 0 0 1px #ffffff26; vertical-align: middle; }
.platform-about { margin: 0 0 1rem; overflow-wrap: anywhere; }
.platform-about > strong { display: block; margin-bottom: .4rem; }
.platform-about ul, .platform-about ol { padding-inline-start: 1.2rem; margin: .25rem 0; }
.platform-about li + li { margin-top: .3rem; }
.platform-about p { margin-bottom: .5rem; }
/* The country picker shares the same local assets as the public directory. */
.clone-country-picker { margin-top: 1.25rem; }
.clone-country-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 4px; max-height: 320px; overflow-y: auto; padding: 8px; border: 1px solid #c3c4c7; border-radius: 3px; }
.clone-country-option { display: flex; align-items: center; gap: 8px; min-height: 36px; padding: 4px; border-radius: 3px; }
.clone-country-option:has(input:checked) { background: #e5f3ff; }
.clone-country-option input { margin: 0; flex-shrink: 0; }
.clone-country-option img { width: 24px; height: 18px; object-fit: contain; flex-shrink: 0; }
.clone-country-option small { color: #646970; }
.clone-country-option[hidden], .clone-country-empty[hidden] { display: none; }
.clone-country-selection { color: #50575e; }
@media (max-width: 768px) {
    .top-banner { margin: 1rem 0 1.5rem; }
    .top-banner-no-desktop { display: block; }
    .top-banner-desktop { display: none; }
    .top-banner-mobile { display: block; }
}
