#player-ranking.palpanel-ranking {
  margin: 34px 0;
  scroll-margin-top: 86px;
}

#player-ranking, #player-ranking * { box-sizing: border-box; }
#player-ranking .sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }

#player-ranking .champions-shell {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(117, 88, 255, .25);
  border-radius: 26px;
  background:
    radial-gradient(circle at 50% 18%, rgba(91, 50, 255, .14), transparent 34%),
    linear-gradient(180deg, rgba(7, 13, 28, .98), rgba(4, 10, 23, .98));
  box-shadow: 0 36px 90px rgba(0, 0, 0, .38), inset 0 1px 0 rgba(255,255,255,.04);
}

#player-ranking .champions-shell::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .2;
  background-image:
    linear-gradient(rgba(102, 125, 185, .09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(102, 125, 185, .09) 1px, transparent 1px);
  background-size: 38px 38px;
  mask-image: linear-gradient(to bottom, black, transparent 54%);
}

#player-ranking .champions-header {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  padding: 30px 34px 22px;
  border-bottom: 1px solid rgba(120, 145, 204, .12);
}

#player-ranking .champions-header h2 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 4px 0 6px;
  font-size: clamp(2rem, 4vw, 3.15rem);
  line-height: 1;
  letter-spacing: -.045em;
  text-transform: uppercase;
}

#player-ranking .champions-header h2 span {
  color: #ffc83d;
  filter: drop-shadow(0 0 13px rgba(255, 191, 43, .58));
}

#player-ranking .champions-header p { margin: 0; color: #8294b6; font-size: .92rem; }
#player-ranking .champions-header .section-kicker { color:#be6cff; letter-spacing:.13em; text-transform:uppercase; font-weight:900; font-size:.71rem; }
#player-ranking .champions-header-actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; justify-content:flex-end; }
#player-ranking .ranking-updated { color:#8093b4; font-size:.78rem; white-space:nowrap; }
#player-ranking .ranking-refresh {
  appearance:none; border:1px solid rgba(124,151,211,.22); color:#dce8ff; background:rgba(15,26,51,.8);
  border-radius:12px; padding:10px 14px; font:inherit; font-size:.78rem; font-weight:800; cursor:pointer;
  transition:.2s ease;
}
#player-ranking .ranking-refresh:hover { border-color:rgba(142,95,255,.65); background:rgba(54,36,111,.72); transform:translateY(-1px); }
#player-ranking .ranking-refresh.loading { animation:rankPulse .8s ease-in-out infinite alternate; pointer-events:none; }

#player-ranking .champions-stage {
  position: relative;
  min-height: 555px;
  padding: 72px 34px 30px;
  overflow: hidden;
}
#player-ranking .champions-stage-background {
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse at 50% 97%, rgba(255,198,36,.20), transparent 25%),
    radial-gradient(ellipse at 17% 90%, rgba(58,113,255,.18), transparent 26%),
    radial-gradient(ellipse at 83% 90%, rgba(255,102,24,.16), transparent 26%),
    linear-gradient(180deg, rgba(3,8,20,.36), rgba(3,8,20,.82));
}
#player-ranking .champions-stage-background::after {
  content:""; position:absolute; left:6%; right:6%; bottom:22px; height:2px;
  background:linear-gradient(90deg, transparent, rgba(73,118,255,.8), rgba(255,200,50,.9), rgba(255,102,27,.8), transparent);
  filter:blur(.4px); box-shadow:0 0 25px rgba(104,98,255,.5);
}

#player-ranking .champions-podium {
  position:relative; z-index:2; display:grid; grid-template-columns:1fr 1.18fr 1fr; align-items:end; gap:28px;
  max-width:1120px; margin:0 auto;
}

#player-ranking .champion-card {
  --rank-color:#775cff; --rank-rgb:119,92,255;
  position:relative; min-width:0; border-radius:24px 24px 18px 18px; color:#f5f7ff;
  border:1px solid rgba(var(--rank-rgb), .72);
  background:linear-gradient(180deg, rgba(var(--rank-rgb), .13), rgba(4,10,23,.96) 32%);
  box-shadow:0 22px 70px rgba(0,0,0,.42), 0 0 34px rgba(var(--rank-rgb), .15), inset 0 1px 0 rgba(255,255,255,.08);
  animation:championRise .72s cubic-bezier(.2,.75,.25,1) both;
}
#player-ranking .champion-silver { --rank-color:#79a7ff; --rank-rgb:91,145,255; min-height:388px; }
#player-ranking .champion-gold { --rank-color:#ffc72f; --rank-rgb:255,190,29; min-height:460px; transform:translateY(-24px); animation-delay:.08s; }
#player-ranking .champion-bronze { --rank-color:#ff7a24; --rank-rgb:255,105,28; min-height:370px; animation-delay:.16s; }
#player-ranking .champion-card:hover { transform:translateY(-7px); box-shadow:0 28px 85px rgba(0,0,0,.48),0 0 48px rgba(var(--rank-rgb),.26); }
#player-ranking .champion-gold:hover { transform:translateY(-31px); }
#player-ranking .champion-card-inner { position:relative; z-index:2; padding:64px 22px 22px; text-align:center; }
#player-ranking .champion-particles { position:absolute; inset:0; overflow:hidden; border-radius:inherit; pointer-events:none; }
#player-ranking .champion-particles::before,
#player-ranking .champion-particles::after { content:""; position:absolute; width:5px; height:5px; border-radius:50%; background:var(--rank-color); box-shadow:62px 26px 0 rgba(var(--rank-rgb),.5),155px 72px 0 rgba(var(--rank-rgb),.7),102px 198px 0 rgba(var(--rank-rgb),.35),230px 132px 0 rgba(var(--rank-rgb),.45),36px 251px 0 rgba(var(--rank-rgb),.4); animation:floatParticles 5s ease-in-out infinite alternate; }
#player-ranking .champion-particles::after { left:44%; top:30%; opacity:.6; animation-delay:-2.2s; }

#player-ranking .champion-badge {
  position:absolute; z-index:4; top:-57px; left:50%; translate:-50% 0; width:118px; height:112px;
  display:grid; place-items:center; color:#081020;
  filter:drop-shadow(0 0 18px rgba(var(--rank-rgb),.72));
}
#player-ranking .champion-badge::before {
  content:""; position:absolute; width:80px; height:86px; background:linear-gradient(150deg,#fff8c5,var(--rank-color) 42%,rgba(var(--rank-rgb),.38));
  clip-path:polygon(50% 0,86% 16%,100% 58%,76% 100%,24% 100%,0 58%,14% 16%);
  border-radius:16px;
}
#player-ranking .champion-badge b { position:relative; z-index:2; font-size:2.75rem; line-height:1; text-shadow:0 1px rgba(255,255,255,.45); }
#player-ranking .champion-badge small { position:absolute; z-index:3; top:-8px; color:var(--rank-color); font-size:2rem; text-shadow:0 0 15px rgba(var(--rank-rgb),.7); }
#player-ranking .champion-wings { position:absolute; z-index:0; width:150px; color:var(--rank-color); font-size:4.6rem; opacity:.45; transform:scaleX(1.5) rotate(45deg); }

#player-ranking .champion-avatar { position:relative; width:104px; height:104px; display:inline-grid; place-items:center; margin-bottom:12px; border-radius:50%; border:3px solid var(--rank-color); background:#071329; box-shadow:0 0 0 7px rgba(var(--rank-rgb),.10),0 0 32px rgba(var(--rank-rgb),.38); }
#player-ranking .champion-gold .champion-avatar { width:122px; height:122px; }
#player-ranking .champion-avatar img { width:100%; height:100%; border-radius:50%; object-fit:cover; }
#player-ranking .champion-avatar-glow { position:absolute; inset:-16px; border-radius:50%; border:1px solid rgba(var(--rank-rgb),.23); animation:avatarPulse 2.8s ease-in-out infinite; }
#player-ranking .champion-name-row { display:flex; align-items:center; justify-content:center; gap:8px; }
#player-ranking .champion-name-row h3 { margin:0; font-size:clamp(1.25rem,2vw,1.65rem); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#player-ranking .verified-mark { color:#9b6cff; font-size:.75rem; filter:drop-shadow(0 0 7px #9b6cff); }
#player-ranking .champion-title { display:inline-flex; margin:7px 0 8px; padding:4px 12px; border-radius:999px; color:#081020; background:var(--rank-color); font-size:.67rem; font-weight:1000; letter-spacing:.08em; text-transform:uppercase; box-shadow:0 0 18px rgba(var(--rank-rgb),.38); }
#player-ranking .champion-level { color:#a5b5d1; font-size:.76rem; text-transform:uppercase; letter-spacing:.09em; }
#player-ranking .champion-level b { color:#fff; font-size:.94rem; }
#player-ranking .champion-progress-block { margin-top:18px; padding:15px; border-radius:15px; background:rgba(2,8,19,.64); border:1px solid rgba(var(--rank-rgb),.2); }
#player-ranking .champion-progress-head { display:flex; flex-direction:column; gap:4px; }
#player-ranking .champion-progress-head span { color:#7889aa; text-transform:uppercase; letter-spacing:.07em; font-size:.62rem; }
#player-ranking .champion-progress-head b { font-size:.95rem; }
#player-ranking .champion-progress-head em { color:var(--rank-color); font-style:normal; font-size:.74rem; }
#player-ranking .champion-progress { height:8px; margin-top:10px; overflow:hidden; border-radius:999px; background:rgba(99,119,159,.17); }
#player-ranking .champion-progress i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,rgba(var(--rank-rgb),.68),var(--rank-color)); box-shadow:0 0 15px rgba(var(--rank-rgb),.65); }
#player-ranking .champion-stats { display:grid; grid-template-columns:1fr 1fr; margin-top:17px; padding-top:14px; border-top:1px solid rgba(119,143,188,.12); }
#player-ranking .champion-stats > div { display:grid; grid-template-columns:auto auto; justify-content:center; gap:2px 6px; }
#player-ranking .champion-stats > div + div { border-left:1px solid rgba(119,143,188,.12); }
#player-ranking .champion-stats span { color:var(--rank-color); }
#player-ranking .champion-stats b { font-size:.95rem; }
#player-ranking .champion-stats small { grid-column:1 / -1; color:#7588aa; font-size:.61rem; }

#player-ranking .champions-list { position:relative; z-index:2; padding:0 26px 28px; }
#player-ranking .champions-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:13px; padding:14px 4px; border-bottom:1px solid rgba(119,143,188,.12); }
#player-ranking .champions-toolbar > div:first-child { display:flex; align-items:baseline; gap:10px; }
#player-ranking .champions-toolbar b { font-size:1rem; }
#player-ranking .champions-toolbar small { color:#7184a7; }
#player-ranking .champions-sort { display:flex; gap:7px; flex-wrap:wrap; justify-content:flex-end; }
#player-ranking .champions-sort button { appearance:none; border:1px solid rgba(117,143,196,.16); border-radius:9px; padding:8px 10px; background:rgba(12,23,45,.72); color:#8799b9; font:inherit; font-size:.68rem; font-weight:900; cursor:pointer; text-transform:uppercase; letter-spacing:.04em; transition:.18s; }
#player-ranking .champions-sort button span { margin-left:5px; }
#player-ranking .champions-sort button:hover,#player-ranking .champions-sort button.active { color:#fff; border-color:rgba(143,83,255,.55); background:rgba(81,45,158,.35); }
#player-ranking .champions-list-head,#player-ranking .champion-list-row { display:grid; grid-template-columns:54px minmax(190px,1.35fr) .55fr 1fr .72fr .85fr; gap:14px; align-items:center; }
#player-ranking .champions-list-head { padding:0 17px 9px; color:#697d9f; font-size:.62rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
#player-ranking .champion-list-row { min-height:74px; margin:7px 0; padding:10px 17px; border:1px solid rgba(110,137,190,.11); border-radius:14px; background:linear-gradient(90deg,rgba(16,29,55,.88),rgba(8,17,34,.84)); transition:.2s ease; animation:listReveal .48s ease both; }
#player-ranking .champion-list-row:hover { transform:translateX(3px); border-color:rgba(135,82,255,.35); background:linear-gradient(90deg,rgba(35,31,77,.94),rgba(9,20,39,.94)); box-shadow:0 10px 28px rgba(0,0,0,.25); }
#player-ranking .list-rank { font-size:1.35rem; font-weight:1000; color:#eaf1ff; text-align:center; }
#player-ranking .list-player { min-width:0; display:flex; align-items:center; gap:12px; }
#player-ranking .list-avatar { flex:0 0 auto; width:44px; height:44px; border-radius:50%; padding:2px; border:1px solid rgba(124,91,255,.5); background:#09142a; }
#player-ranking .list-avatar img { width:100%; height:100%; border-radius:50%; display:block; }
#player-ranking .list-player > div { min-width:0; }
#player-ranking .list-player b { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.95rem; }
#player-ranking .list-stat small,#player-ranking .list-paldex small { display:block; margin-bottom:2px; color:#6f82a5; font-size:.58rem; text-transform:uppercase; letter-spacing:.06em; }
#player-ranking .list-stat b,#player-ranking .list-paldex b { font-size:.9rem; }
#player-ranking .list-paldex > div { display:flex; align-items:baseline; gap:7px; flex-wrap:wrap; }
#player-ranking .list-paldex small { width:100%; }
#player-ranking .list-paldex em { color:#9b61ff; font-style:normal; font-size:.67rem; font-weight:900; }
#player-ranking .list-paldex > span { display:block; height:4px; margin-top:7px; overflow:hidden; border-radius:999px; background:rgba(112,130,168,.17); }
#player-ranking .list-paldex > span i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#6554ff,#a445ff); box-shadow:0 0 10px rgba(129,74,255,.55); }
#player-ranking .rank-status { display:inline-flex; align-items:center; gap:6px; width:max-content; color:#899bb8; font-size:.65rem; font-weight:900; text-transform:uppercase; }
#player-ranking .rank-status i { width:8px; height:8px; border-radius:50%; background:#61718f; }
#player-ranking .rank-status.online { color:#38f48d; }
#player-ranking .rank-status.online i { background:#36f58d; box-shadow:0 0 12px rgba(54,245,141,.75); }
#player-ranking .rank-status small { color:#69809e; font-weight:700; text-transform:none; }
#player-ranking .rank-status.compact { margin-top:4px; font-size:.57rem; }
#player-ranking .list-live { justify-self:start; }
#player-ranking .ranking-empty { padding:32px; text-align:center; color:#7185a9; }
#player-ranking .ranking-empty-large { min-height:350px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:8px; }
#player-ranking .ranking-empty-large span { color:#ffc72f; font-size:3rem; }
#player-ranking .ranking-empty-large b { color:#fff; font-size:1.1rem; }
#player-ranking .ranking-empty-large p { margin:0; }

@keyframes championRise { from{opacity:0;transform:translateY(34px) scale(.97)} to{opacity:1} }
@keyframes listReveal { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:none} }
@keyframes avatarPulse { 0%,100%{transform:scale(.96);opacity:.35}50%{transform:scale(1.08);opacity:.75} }
@keyframes floatParticles { from{transform:translate(14px,20px);opacity:.18}to{transform:translate(0,-13px);opacity:.8} }
@keyframes rankPulse { from{opacity:.55}to{opacity:1} }

@media (max-width: 980px) {
  #player-ranking .champions-podium { grid-template-columns:1fr 1fr; }
  #player-ranking .champion-gold { grid-column:1 / -1; grid-row:1; width:min(450px,100%); justify-self:center; }
  #player-ranking .champion-silver { grid-column:1; grid-row:2; }
  #player-ranking .champion-bronze { grid-column:2; grid-row:2; }
  #player-ranking .champions-stage { padding-top:95px; }
  #player-ranking .champions-list-head { display:none; }
  #player-ranking .champion-list-row { grid-template-columns:42px minmax(190px,1.35fr) .6fr 1fr .75fr; }
  #player-ranking .list-live { grid-column:2 / -1; margin-top:-2px; }
}

@media (max-width: 720px) {
  #player-ranking .champions-header { align-items:flex-start; flex-direction:column; padding:25px 21px 19px; }
  #player-ranking .champions-header-actions { justify-content:flex-start; }
  #player-ranking .champions-stage { min-height:auto; padding:86px 18px 26px; }
  #player-ranking .champions-podium { display:flex; flex-direction:column; align-items:stretch; gap:88px; }
  #player-ranking .champion-card,#player-ranking .champion-gold { width:100%; min-height:0; transform:none; }
  #player-ranking .champion-gold { order:-1; }
  #player-ranking .champion-gold:hover,#player-ranking .champion-card:hover { transform:translateY(-4px); }
  #player-ranking .champions-list { padding:0 14px 20px; }
  #player-ranking .champions-toolbar { align-items:flex-start; flex-direction:column; }
  #player-ranking .champions-sort { justify-content:flex-start; }
  #player-ranking .champion-list-row { grid-template-columns:36px minmax(0,1fr) auto; gap:10px; padding:12px; }
  #player-ranking .list-stat,#player-ranking .list-paldex,#player-ranking .list-live { grid-column:2 / -1; }
  #player-ranking .list-stat { display:flex; align-items:baseline; gap:8px; }
  #player-ranking .list-stat small { margin:0; }
  #player-ranking .list-paldex { margin-top:2px; }
}

@media (prefers-reduced-motion: reduce) {
  #player-ranking *,#player-ranking *::before,#player-ranking *::after { animation:none!important; transition:none!important; }
}