.ranking-page{padding-top:30px;padding-bottom:52px}
.active-nav{color:#fff!important;position:relative}.active-nav:after{content:"";position:absolute;left:8px;right:8px;bottom:-15px;height:2px;background:#2d8dff;border-radius:2px}
.ranking-hero{display:grid;grid-template-columns:1fr 290px;gap:24px;align-items:stretch;padding:30px;border:1px solid #20344a;border-radius:24px;background:radial-gradient(circle at 82% 0,#17304c 0,transparent 35%),linear-gradient(135deg,#0b151f,#080d13 72%)}
.ranking-hero h1{font-size:48px;margin:7px 0 10px;letter-spacing:-1.5px}.ranking-hero p{max-width:800px;color:#91a3b7;line-height:1.65;margin:0;font-size:12px}
.ranking-hero-badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}.ranking-hero-badges span{padding:7px 10px;border:1px solid #28567f;border-radius:999px;background:#0d2134;color:#83c3ff;font-size:8px;font-weight:950}
.ranking-hero-side{border:1px solid #28445f;border-radius:18px;background:linear-gradient(145deg,#0c1b29,#0a1119);padding:22px;display:flex;flex-direction:column;justify-content:center}
.ranking-hero-side small{color:#70869b;font-size:8px;font-weight:950}.ranking-hero-side b{font-size:25px;margin:7px 0;color:#dcecff}.ranking-hero-side span{color:#71baff;font-size:10px}
.ranking-board{margin-top:16px;border:1px solid #1d3045;border-radius:21px;background:linear-gradient(180deg,#0b141e,#080e15);padding:20px}
.ranking-board-head{display:flex;align-items:end;justify-content:space-between;gap:18px}.ranking-board-head h2{font-size:27px;margin:4px 0 0}
.ranking-controls{display:flex;align-items:end;gap:12px;flex-wrap:wrap;justify-content:flex-end}.ranking-controls label{display:flex;flex-direction:column;gap:5px;color:#71859a;font-size:8px;font-weight:950}
.ranking-controls select{min-width:180px;border:1px solid #29425c;background:#0a1622;color:#dce7f2;border-radius:9px;padding:9px 10px;outline:0}
.rank-tabs{display:flex;gap:6px;flex-wrap:wrap}.rank-tab{border:1px solid #28405a;background:#0a1622;color:#8da1b6;border-radius:9px;padding:9px 11px;font-size:9px;font-weight:900;cursor:pointer}.rank-tab.active{background:linear-gradient(135deg,#164f8d,#133a66);border-color:#3c8bd1;color:#fff;box-shadow:0 0 18px #168aff2a}
.ranking-status{margin:13px 0 8px;color:#6f8398;font-size:9px;min-height:14px}.ranking-columns{display:grid;grid-template-columns:54px 1fr auto;gap:12px;padding:8px 12px;color:#5f7388;font-size:8px;font-weight:950;border-bottom:1px solid #172638}
.ranking-list{display:grid}.ranking-row{display:grid;grid-template-columns:54px 1fr auto;gap:12px;align-items:center;padding:13px 12px;border-bottom:1px solid #142334;color:inherit;text-decoration:none}.ranking-row:hover{background:#0d1823}
.ranking-pos{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#132236;color:#8fa4b9;font-size:10px;font-weight:950}.ranking-row:nth-child(1) .ranking-pos{background:#4a3508;color:#ffd45d}.ranking-row:nth-child(2) .ranking-pos{background:#222b35;color:#cbd4de}.ranking-row:nth-child(3) .ranking-pos{background:#3b2718;color:#d49b69}
.ranking-driver{display:flex;align-items:center;gap:10px;min-width:0}.ranking-avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#123b61;color:#80c4ff;font-weight:950}.ranking-driver b{display:block;font-size:13px}.ranking-driver small{display:block;color:#62768a;font-size:9px;margin-top:2px}
.ranking-score{text-align:right}.ranking-score b{display:block;color:#d7e8f8;font-size:14px}.ranking-score small{display:block;color:#74889d;font-size:9px;margin-top:3px}
.ranking-explain{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin-top:15px}.ranking-explain article{display:grid;grid-template-columns:40px 1fr;gap:11px;padding:17px;border:1px solid #1c3044;border-radius:16px;background:#0a121a}.ranking-explain article>span{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:#12263b;color:#74bbff;font-size:9px;font-weight:950}.ranking-explain small{color:#70869a;font-size:8px;font-weight:950}.ranking-explain b{display:block;margin:4px 0 5px}.ranking-explain p{margin:0;color:#74879a;font-size:9px;line-height:1.5}
.footer{margin-top:0}
@media(max-width:900px){.ranking-hero{grid-template-columns:1fr}.ranking-board-head{align-items:flex-start;flex-direction:column}.ranking-controls{justify-content:flex-start}.ranking-explain{grid-template-columns:1fr}}
@media(max-width:600px){.ranking-page{padding-top:16px}.ranking-hero{padding:21px}.ranking-hero h1{font-size:37px}.ranking-controls{width:100%}.ranking-controls label,.ranking-controls select{width:100%}.rank-tabs{width:100%}.rank-tab{flex:1}.ranking-columns,.ranking-row{grid-template-columns:42px 1fr}.ranking-columns span:last-child{display:none}.ranking-score{grid-column:2;text-align:left;margin-top:-5px}.ranking-row{padding:12px 7px}}

.rank-podium[hidden]{display:none}
.rank-podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:end;margin:25px 0}
.podium-place{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:22px 12px;border:1px solid #6c5323;border-radius:18px;background:linear-gradient(160deg,#302712,#101923);color:#e6eef8;text-decoration:none;min-width:0}
.podium-place-1{grid-column:2;grid-row:1;min-height:285px;border-color:#d3a738;box-shadow:0 0 26px #d3a73820}
.podium-place-2{grid-column:1;grid-row:1;min-height:245px;border-color:#8093a8;background:linear-gradient(160deg,#27313c,#101923)}
.podium-place-3{grid-column:3;grid-row:1;min-height:225px;border-color:#a97149;background:linear-gradient(160deg,#35251d,#101923)}
.podium-medal{font-size:36px}.podium-position{font-size:11px;font-weight:900;color:#e9c76b}
.podium-avatar{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:#132e49;color:#9dd4ff;font-size:24px;font-weight:900}
.podium-place strong{font-size:18px;overflow-wrap:anywhere}.podium-place small{font-size:11px;color:#92a8bd;overflow-wrap:anywhere}.podium-place b{font-size:15px;margin-top:auto;padding-top:10px;color:#f4da95}
.podium-place:hover{filter:brightness(1.12)}
@media(max-width:600px){.rank-podium{gap:6px}.podium-place{padding:14px 5px;gap:6px;min-height:195px}.podium-place-1{min-height:235px}.podium-place-2{min-height:215px}.podium-medal{font-size:27px}.podium-place strong{font-size:13px}.podium-place b{font-size:10px}.podium-position,.podium-place small{font-size:9px}.podium-avatar{width:38px;height:38px;font-size:18px}}
