.leaderboard-modal{width:min(1040px,calc(100vw - 2rem));height:min(780px,calc(100dvh - 2rem));display:flex;flex-direction:column;overflow:hidden;border:1px solid color-mix(in srgb,var(--accent-primary) 35%,transparent);border-radius:24px;background:color-mix(in srgb,var(--bg-primary) 94%,transparent);box-shadow:0 30px 100px rgba(0,0,0,.55),0 0 45px color-mix(in srgb,var(--accent-primary) 10%,transparent);backdrop-filter:blur(28px) saturate(145%)}
#leaderboardOverlay.visible{animation:leaderboardBackdropIn .22s ease-out both}#leaderboardOverlay.visible .leaderboard-modal{animation:leaderboardModalIn .38s cubic-bezier(.2,.82,.25,1) both}
.leaderboard-header{display:flex;align-items:center;justify-content:space-between;padding:1.35rem 1.55rem;border-bottom:1px solid color-mix(in srgb,var(--text-muted) 14%,transparent);background:linear-gradient(110deg,color-mix(in srgb,var(--accent-primary) 8%,transparent),transparent 55%)}
.leaderboard-header h2{margin:.1rem 0 0;color:var(--text-primary);font:800 clamp(1.35rem,2.5vw,2rem) Manrope,sans-serif}.leaderboard-eyebrow{color:var(--accent-primary);font:800 .62rem Manrope,sans-serif;letter-spacing:.2em}.leaderboard-close{display:grid;place-items:center;width:42px;height:42px;border:1px solid color-mix(in srgb,var(--text-muted) 16%,transparent);border-radius:12px;background:color-mix(in srgb,var(--bg-card) 80%,transparent);color:var(--text-primary);font-size:1.45rem;cursor:pointer}
.leaderboard-filters{display:grid;grid-template-columns:minmax(200px,1.6fr) repeat(3,minmax(130px,1fr));gap:.7rem;padding:1rem 1.55rem}.leaderboard-filters label{display:flex;min-width:0;flex-direction:column;gap:.35rem;color:var(--text-muted);font:750 .62rem Manrope,sans-serif;letter-spacing:.06em;text-transform:uppercase}.leaderboard-filters select{width:100%;height:42px;padding:0 .75rem;border:1px solid color-mix(in srgb,var(--text-muted) 18%,transparent);border-radius:10px;background:var(--bg-card);color:var(--text-primary);font:700 .74rem Manrope,sans-serif;outline:none}.leaderboard-filters select:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent-primary) 12%,transparent)}
.leaderboard-context{min-height:31px;margin:0 1.55rem .55rem;color:var(--text-secondary);font:650 .72rem Manrope,sans-serif}.leaderboard-table-head,.leaderboard-row{display:grid;grid-template-columns:64px minmax(0,1fr) minmax(110px,180px);align-items:center;gap:.8rem}.leaderboard-table-head{margin:0 1.55rem;padding:.45rem 1rem;color:var(--text-muted);font:800 .6rem Manrope,sans-serif;letter-spacing:.12em;text-transform:uppercase}.leaderboard-table-head span:last-child{text-align:right}
.leaderboard-list{display:grid;flex:1;min-height:0;grid-template-rows:repeat(5,minmax(0,1fr));gap:.55rem;padding:.15rem 1.55rem .75rem}.leaderboard-row{position:relative;min-height:0;padding:.75rem 1rem;border:1px solid color-mix(in srgb,var(--text-muted) 13%,transparent);border-radius:15px;background:linear-gradient(110deg,color-mix(in srgb,var(--bg-card) 88%,transparent),color-mix(in srgb,var(--bg-card) 64%,transparent));overflow:hidden}.leaderboard-row:not(.leaderboard-skeleton){animation:leaderboardRowIn .46s cubic-bezier(.2,.82,.25,1) both;animation-delay:calc(var(--leaderboard-row-index,0)*55ms)}.leaderboard-row::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(100deg,color-mix(in srgb,var(--accent-primary) 5%,transparent),transparent 40%)}
.leaderboard-row.rank-1{border-color:rgba(250,204,21,.48);box-shadow:inset 3px 0 #facc15}.leaderboard-row.rank-2{border-color:rgba(203,213,225,.38);box-shadow:inset 3px 0 #cbd5e1}.leaderboard-row.rank-3{border-color:rgba(251,146,60,.42);box-shadow:inset 3px 0 #fb923c}.leaderboard-row:has(.title-absolute-container){z-index:2;overflow:visible}.leaderboard-rank{position:relative;z-index:1;color:var(--text-primary);font:900 1.15rem Manrope,sans-serif}.leaderboard-player{position:relative;z-index:1;display:flex;min-width:0;align-items:center;gap:1rem}.leaderboard-name{flex:0 1 auto;max-width:42%;overflow:hidden;color:var(--text-primary);font:800 clamp(.84rem,1.6vw,1.08rem) Manrope,sans-serif;text-overflow:ellipsis;white-space:nowrap}.leaderboard-user-title{display:flex;min-width:0;flex:1;align-items:center;overflow:hidden}.leaderboard-user-title:has(.title-absolute-container){overflow:visible}.leaderboard-user-title .title-visual{font-size:clamp(.72rem,1.55vw,1.12rem)}.leaderboard-user-title .title-absolute-wrapper{padding:0 .35rem;filter:drop-shadow(0 0 9px rgba(0,229,255,.8)) drop-shadow(0 0 16px rgba(255,0,127,.58))}.leaderboard-user-title .title-absolute-wrapper::after{width:175%;height:230%;opacity:.9;filter:blur(14px)}.leaderboard-result{position:relative;z-index:1;color:var(--accent-primary);font:900 clamp(.9rem,1.8vw,1.2rem) 'JetBrains Mono',monospace;text-align:right;white-space:nowrap}
.leaderboard-empty{grid-row:1/-1;display:grid;place-items:center;border:1px dashed color-mix(in srgb,var(--text-muted) 18%,transparent);border-radius:15px;color:var(--text-muted);font:650 .8rem Manrope,sans-serif;text-align:center;animation:leaderboardFadeIn .28s ease-out both}.leaderboard-skeleton{overflow:hidden}.leaderboard-skeleton::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent);animation:leaderboardShimmer 1.2s linear infinite}.leaderboard-status{margin:0 1.55rem .45rem;color:#f87171;font:700 .7rem Manrope,sans-serif}.leaderboard-footer{display:flex;align-items:center;justify-content:center;gap:.75rem;padding:.7rem 1.55rem 1rem}.leaderboard-footer button{width:38px;height:32px;border:1px solid color-mix(in srgb,var(--text-muted) 16%,transparent);border-radius:9px;background:var(--bg-card);color:var(--text-primary);cursor:pointer}.leaderboard-footer button:disabled{opacity:.35;cursor:default}.leaderboard-footer span{min-width:34px;color:var(--text-secondary);font:800 .72rem Manrope,sans-serif;text-align:center}.hidden{display:none!important}@keyframes leaderboardBackdropIn{from{opacity:0}to{opacity:1}}@keyframes leaderboardModalIn{from{opacity:0;transform:translateY(22px) scale(.975)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes leaderboardRowIn{from{opacity:0;transform:translateY(13px) scale(.988)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes leaderboardFadeIn{from{opacity:0}to{opacity:1}}@keyframes leaderboardShimmer{to{transform:translateX(100%)}}
body.light-theme .leaderboard-modal{background:rgba(248,250,252,.96);box-shadow:0 30px 90px rgba(15,23,42,.2)}body.light-theme .leaderboard-row{background:linear-gradient(110deg,#fff,#f8fafc)}
@media(max-width:720px){.leaderboard-modal{width:calc(100vw - 1rem);height:calc(100dvh - 1rem);border-radius:18px}.leaderboard-header{padding:1rem}.leaderboard-filters{grid-template-columns:1fr 1fr;padding:.8rem 1rem}.leaderboard-context{margin:0 1rem .45rem}.leaderboard-table-head{margin:0 1rem;grid-template-columns:38px minmax(0,1fr) 92px;padding:.4rem .65rem}.leaderboard-list{grid-template-rows:repeat(5,minmax(0,1fr));padding:.1rem 1rem .6rem}.leaderboard-row{grid-template-columns:38px minmax(0,1fr) 92px;gap:.45rem;padding:.58rem .65rem}.leaderboard-player{flex-direction:column;align-items:flex-start;gap:.18rem}.leaderboard-name{max-width:100%;font-size:.78rem}.leaderboard-user-title{width:100%}.leaderboard-user-title .title-visual{font-size:.58rem}.leaderboard-result{font-size:.78rem}.leaderboard-footer{padding:.55rem 1rem .75rem}}
@media(max-width:430px){.leaderboard-filters{grid-template-columns:1fr 1fr;gap:.5rem}.leaderboard-filters label:first-child{grid-column:1/-1}.leaderboard-filters select{height:38px;font-size:.67rem}.leaderboard-header h2{font-size:1.25rem}}
@media(prefers-reduced-motion:reduce){#leaderboardOverlay.visible,#leaderboardOverlay.visible .leaderboard-modal,.leaderboard-row,.leaderboard-empty,.leaderboard-skeleton::before{animation:none!important}}
