:root{color-scheme:dark;--bg:#090b10;--surface:#12151c;--surface2:#171b24;--ink:#f6f2e8;--muted:#a9a8a2;--gold:#d8b15a;--line:rgba(216,177,90,.25);--shadow:0 20px 60px rgba(0,0,0,.28)}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 50% -10%,#22212a 0,#0d0f14 36%,var(--bg) 70%);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,a{font:inherit}.rank-shell{width:min(1080px,calc(100% - 28px));margin:auto;padding:24px 0 64px}.rank-hero{text-align:center;padding:20px 8px 14px}.rank-back{display:inline-block;color:var(--muted);text-decoration:none;margin-bottom:18px}.eyebrow{margin:0 0 8px;color:var(--gold);font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:.72rem}.rank-hero h1{font-size:clamp(2.2rem,7vw,4.6rem);margin:0;line-height:.95}.rank-hero>p:last-child{color:var(--muted);max-width:680px;margin:18px auto 0;line-height:1.55}
.rank-controls{display:grid;gap:10px;margin:28px 0}.segmented{display:grid;gap:8px;padding:6px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.06);border-radius:18px}.segmented.games{grid-template-columns:repeat(3,1fr)}.segmented.types{grid-template-columns:repeat(2,1fr);max-width:520px;width:100%;margin:auto}.segmented button{border:1px solid transparent;border-radius:13px;background:transparent;color:var(--muted);padding:13px 10px;font-weight:850;cursor:pointer}.segmented button.active{background:#050607;border-color:var(--gold);color:#fff;box-shadow:0 0 0 1px rgba(216,177,90,.12),0 10px 26px rgba(0,0,0,.25)}
.my-position{position:sticky;top:8px;z-index:8;margin:20px 0;padding:14px 16px;border:1px solid var(--gold);border-radius:16px;background:rgba(7,8,11,.94);backdrop-filter:blur(12px);box-shadow:var(--shadow);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px}.my-position strong{font-size:1.1rem}.my-position .value{font-size:1.15rem;font-weight:900}.my-position .sub{color:var(--muted);font-size:.82rem}
.podium-wrap{margin:22px 0}.podium{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;align-items:end}.podium-card{min-height:150px;background:linear-gradient(180deg,var(--surface2),#0e1016);border:1px solid var(--line);border-radius:22px;padding:18px;text-align:center;box-shadow:var(--shadow)}.podium-card.first{min-height:190px;border-color:var(--gold);transform:translateY(-6px)}.podium-rank{font-size:1.8rem;font-weight:950;color:var(--gold)}.podium-name{font-weight:900;font-size:1.04rem;margin-top:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.podium-score{font-weight:950;font-size:1.35rem;margin-top:6px}.podium-sub{font-size:.76rem;color:var(--muted);margin-top:8px}
.ranking-list-wrap,.rank-explain{background:rgba(18,21,28,.88);border:1px solid rgba(255,255,255,.07);border-radius:24px;padding:18px;box-shadow:var(--shadow)}.ranking-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-end;margin-bottom:12px}.ranking-head h2{margin:0;font-size:1.35rem}.ranking-head>span{color:var(--muted);font-size:.82rem}.ranking-status{padding:16px;color:var(--muted);text-align:center}.ranking-list{display:grid;gap:8px}.rank-row{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:12px;align-items:center;padding:13px 14px;border-radius:15px;background:#0c0e13;border:1px solid rgba(255,255,255,.055)}.rank-position{font-size:1.05rem;font-weight:950;color:var(--gold)}.rank-player{min-width:0}.rank-name{font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rank-detail{font-size:.75rem;color:var(--muted);margin-top:3px}.rank-score{text-align:right;font-weight:950}.rank-score small{display:block;font-size:.68rem;color:var(--muted);font-weight:700}.load-more{display:block;width:100%;margin-top:12px;border:1px solid var(--gold);background:#090a0e;color:#fff;padding:13px;border-radius:14px;font-weight:850;cursor:pointer}.rank-explain{margin-top:16px}.rank-explain h2{margin-top:0}.rank-explain p{color:var(--muted);line-height:1.6;margin-bottom:0}
@media(max-width:680px){.rank-shell{width:min(100% - 18px,1080px);padding-top:10px}.segmented.games button{font-size:.78rem;padding:11px 4px}.podium{gap:6px}.podium-card{min-height:132px;padding:12px 8px;border-radius:17px}.podium-card.first{min-height:158px}.podium-rank{font-size:1.3rem}.podium-name{font-size:.82rem}.podium-score{font-size:1rem}.podium-sub{font-size:.65rem}.my-position{grid-template-columns:auto 1fr}.my-position .value{grid-column:2}.rank-row{grid-template-columns:42px minmax(0,1fr) auto;padding:11px 10px}.rank-detail{font-size:.69rem}}