.ranking_results { position:relative; }
.ranking_container.is-loading .ranking_results { min-height:640px; }
.ranking_container.is-loading .ranking_results > .ranking_list,
.ranking_container.is-loading .ranking_results > .no_games,
.ranking_container.is-loading .ranking_results > .ranking_pagination { visibility:hidden; opacity:0 !important; pointer-events:none; }
.ranking_load_status {
    position:sticky; top:8px; z-index:5; width:fit-content;
    margin:0 auto 12px; padding:9px 16px; border-radius:20px;
    background:#242b3d; color:#dce8ff; font-size:13px;
}
.ranking_loading_preview {
    position:absolute; inset:0; overflow:hidden;
    display:flex; flex-direction:column; gap:15px; pointer-events:none;
}
.ranking_load_status[hidden],.ranking_loading_preview[hidden] { display:none; }
/* The class also supports an older navigation script in a cached document. */
.ranking_container.is-loading .ranking_load_status[hidden] { display:block; }
.ranking_container.is-loading .ranking_loading_preview[hidden] { display:flex; }
.ranking_skeleton_row { flex-shrink:0; }
.ranking_skeleton_block {
    display:block; position:relative; overflow:hidden; border-radius:6px;
    background:#303641;
}
.ranking_skeleton_block::after {
    content:''; position:absolute; inset:0;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.14),transparent);
    transform:translateX(-100%); animation:rankingSkeletonSlide 1.25s ease-in-out infinite;
}
.ranking_skeleton_rank { width:40px; height:40px; border-radius:50%; }
.ranking_skeleton_cover { width:80px; height:107px; flex-shrink:0; }
.ranking_skeleton_title { width:55%; height:19px; margin-bottom:12px; }
.ranking_skeleton_meta { width:35%; height:12px; margin-bottom:12px; }
.ranking_skeleton_platforms { width:70px; height:18px; }
.ranking_skeleton_score { width:50px; height:65px; flex-shrink:0; }
@keyframes rankingSkeletonSlide { to { transform:translateX(100%); } }
@media(max-width:1024px) {
    .ranking_skeleton_cover { width:60px; height:80px; }
}
@media(max-width:768px) {
    .ranking_skeleton_rank { width:32px; height:32px; }
    .ranking_skeleton_cover { width:50px; height:67px; }
    .ranking_skeleton_title { width:75%; height:16px; margin-bottom:8px; }
    .ranking_skeleton_meta { width:55%; margin-bottom:8px; }
    .ranking_skeleton_score { width:38px; height:50px; }
}
@media(prefers-reduced-motion:reduce) {
    .ranking_skeleton_block::after { animation:none; }
}
.ranking_container a { touch-action:manipulation; }

/* Period and participation threshold share one compact, labeled row. */
.is-rating-ranking .filter_section { gap:22px; margin-bottom:10px; }
.is-rating-ranking .ranking_sort_tabs {
    width:fit-content; margin:16px auto 0; padding:0; gap:0;
    border:1px solid #636c80; border-radius:24px; overflow:hidden;
}
.is-rating-ranking .ranking_sort_tabs .sort_tab {
    margin:0; border:0; border-radius:0; padding:12px 24px;
    justify-content:center; background:transparent;
}
.is-rating-ranking .ranking_sort_tabs .sort_tab + .sort_tab { border-left:1px solid #636c80; }
.is-rating-ranking .ranking_sort_tabs .sort_tab.active { background:rgba(102,126,234,.3); color:#fff; }
.ranking_filter_fields {
    display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:16px; width:100%; max-width:600px; margin:0 auto;
}
.is-rating-ranking .ranking_filter_fields .year_selector,
.is-rating-ranking .ranking_filter_fields .rating_count_filter { display:block; margin:0; min-width:0; }
.is-rating-ranking .ranking_filter_field {
    display:block; position:relative; width:100%; box-sizing:border-box;
    border:1px solid #737d90; border-radius:12px; background:transparent; color:#eef1f7;
    color-scheme:dark;
}
.ranking_field_caption {
    position:absolute; top:-9px; left:12px; padding:0 6px;
    font-size:12px; line-height:18px; color:#b6c0d2; background:#242424;
}
.is-rating-ranking .ranking_filter_field select {
    display:block; width:100%; height:58px; box-sizing:border-box;
    appearance:none; -webkit-appearance:none; border:0; border-radius:12px;
    background:#242424; color:inherit; color-scheme:dark; padding:12px 38px 10px 18px;
    font-size:17px; font-weight:600; cursor:pointer;
}
.ranking_filter_field select option { background:#242424; color:#eef1f7; }
.is-rating-ranking .ranking_filter_field:focus-within { border-color:#a8b8ff; }
.is-rating-ranking .ranking_filter_field select:focus-visible { outline:2px solid #a8b8ff; outline-offset:3px; }
.ranking_filter_field .fa-chevron-down { position:absolute; right:16px; top:24px; font-size:11px; pointer-events:none; color:#b6c0d2; }
.ranking_filter_summary { display:flex; flex-direction:column; gap:4px; margin:0 0 16px; color:#aeb7c5; font-size:13px; }
.ranking_filter_fallback { display:flex; flex-wrap:wrap; gap:10px; }
.ranking_filter_popup {
    position:fixed; z-index:10000; box-sizing:border-box; overflow-y:auto;
    padding:4px; border:1px solid #636c80; border-radius:9px;
    background:#242424; color:#eef1f7; color-scheme:dark;
    box-shadow:0 12px 28px rgba(0,0,0,.4); font-size:15px;
    scrollbar-color:#636c80 #242424; overscroll-behavior:contain;
}
.ranking_filter_popup [role="option"] {
    position:relative; min-height:40px; box-sizing:border-box; padding:10px 36px 10px 14px;
    border-radius:5px; line-height:20px; cursor:pointer;
}
.ranking_filter_popup [role="option"].is-highlighted { background:#374365; color:#fff; }
.ranking_filter_popup [aria-selected="true"]::after { content:'✓'; position:absolute; right:14px; color:#b5c3ff; }
@media(min-width:769px) {
    .is-rating-ranking .filter_section {
        display:flex; justify-content:center; align-items:center;
        gap:24px; max-width:900px; margin:22px auto 10px;
    }
    .is-rating-ranking .ranking_sort_tabs { margin:0; border:0; border-radius:0; gap:8px; overflow:visible; }
    .is-rating-ranking .ranking_sort_tabs .sort_tab {
        height:42px; min-height:42px; box-sizing:border-box; padding:10px 16px;
        border:1px solid rgba(255,255,255,.12); border-radius:8px; background:rgba(255,255,255,.04);
    }
    .is-rating-ranking .ranking_sort_tabs .sort_tab + .sort_tab { border-left:1px solid rgba(255,255,255,.12); }
    .is-rating-ranking .ranking_sort_tabs .sort_tab.active { background:rgba(59,130,246,.2); border-color:rgba(59,130,246,.45); }
    .is-rating-ranking .ranking_filter_fields { display:flex; width:auto; gap:24px; max-width:none; margin:0; }
    .is-rating-ranking .ranking_filter_fields .year_selector,
    .is-rating-ranking .ranking_filter_fields .rating_count_filter { width:auto; }
    .is-rating-ranking .ranking_filter_fields .ranking_filter_field {
        display:flex; width:auto; align-items:center; gap:10px;
        border:0; border-radius:0; background:transparent;
    }
    .is-rating-ranking .ranking_field_caption {
        position:static; padding:0; background:transparent; font-size:13px;
        line-height:20px; white-space:nowrap; color:#aeb7c5;
    }
    .is-rating-ranking .ranking_filter_field select {
        width:140px; height:42px; border:1px solid rgba(255,255,255,.12); border-radius:8px;
        background:#2b2b2b; font-size:14px; padding:8px 32px 8px 12px;
    }
    .is-rating-ranking .ranking_filter_field .rating_count_select { width:150px; }
    .is-rating-ranking .ranking_filter_field select:focus-visible { outline:1px solid #a8b8ff; outline-offset:2px; }
    .is-rating-ranking .ranking_filter_field .fa-chevron-down { top:16px; right:12px; }
    .is-rating-ranking .ranking_filter_summary { flex-direction:row; justify-content:space-between; align-items:center; }
    .ranking_filter_fallback { grid-column:1 / -1; }
}
@media(min-width:769px) and (max-width:1024px) {
    .is-rating-ranking .filter_section,.is-rating-ranking .ranking_filter_fields { gap:16px; }
    .is-rating-ranking .ranking_field_caption { font-size:12px; }
    .is-rating-ranking .ranking_filter_field select { width:110px; }
    .is-rating-ranking .ranking_filter_field .rating_count_select { width:125px; }
}
@media(max-width:768px) {
    .is-rating-ranking .filter_section { gap:24px; }
    .is-rating-ranking .ranking_sort_tabs { width:100%; }
    .is-rating-ranking .ranking_sort_tabs .sort_tab { flex:1; padding:11px 10px; font-size:14px; }
    .ranking_filter_fields { gap:12px; }
    .is-rating-ranking .ranking_filter_field select { height:54px; padding-left:14px; font-size:16px; }
    .ranking_field_caption { left:9px; font-size:11px; }
    .ranking_filter_field .fa-chevron-down { right:13px; top:22px; }
}