/* ============================================================
   PlayHub — Liderlik Tablosu (Top Players) stilleri
   ============================================================ */

.lb-wrap{max-width:1080px;margin:0 auto}

/* başlık */
.lb-title{text-align:center;margin:6px 0 38px}
.lb-title h1{font-size:38px;font-weight:800;letter-spacing:.5px;text-transform:uppercase}
.lb-title .lb-sub{color:var(--txt-dim);font-weight:600;font-size:16px;margin-top:8px}
.lb-title::after{content:"";display:block;width:120px;height:4px;border-radius:4px;margin:18px auto 0;
  background:linear-gradient(90deg,#ff5c8a,#7c4dff,#41a0ff)}

/* ============ PODYUM (top 3) ============ */
.podium{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:end;margin-bottom:40px;max-width:760px;margin-inline:auto}
.pod{position:relative;background:var(--panel);border-radius:20px;padding:30px 20px 24px;text-align:center;
  border:1px solid var(--line);transition:transform .18s,box-shadow .2s}
.pod:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(0,0,0,.45)}
.pod.first{padding-top:42px;background:linear-gradient(180deg,#23123f,#191527);border-color:#3a2a6b}
.pod.first .pod-av{width:108px;height:108px}

/* madalya kurdele */
.pod .ribbon{position:absolute;top:-2px;right:16px;width:34px;height:48px;display:flex;align-items:flex-start;justify-content:center;
  color:#fff;font-family:"Baloo 2",sans-serif;font-weight:800;font-size:15px;padding-top:6px;
  clip-path:polygon(0 0,100% 0,100% 100%,50% 82%,0 100%)}
.pod .ribbon.gold{background:linear-gradient(180deg,#ffcf3a,#f5a623)}
.pod .ribbon.silver{background:linear-gradient(180deg,#cfd6e2,#9aa6b8)}
.pod .ribbon.bronze{background:linear-gradient(180deg,#ff9d5c,#e8662b)}

/* avatar */
.pod-av{width:92px;height:92px;border-radius:50%;margin:0 auto 16px;padding:4px;display:flex;
  background:conic-gradient(from 200deg,#ff5c8a,#7c4dff,#41a0ff,#37d399,#ff5c8a)}
.pod-av .av-fill{width:100%;height:100%;border-radius:50%;display:block;object-fit:cover;
  background:linear-gradient(135deg,#3a2a6b,#1c1340);display:flex;align-items:center;justify-content:center;
  font-family:"Baloo 2",sans-serif;font-weight:800;font-size:34px;color:#fff;text-transform:uppercase}
.pod.first .pod-av{background:conic-gradient(from 200deg,#ffcf3a,#ff5c8a,#7c4dff,#41a0ff,#ffcf3a)}
.pod h3{font-size:20px;font-weight:800;color:var(--txt)}
.pod .pod-xp{color:var(--accent-2);font-weight:800;font-size:17px;margin-top:6px}
.pod .pod-role{color:var(--txt-dim);font-weight:700;font-size:14px;margin-top:4px}
.pod .pod-role.master{color:var(--gold)}

/* ============ LİSTE (4+) ============ */
.lb-list{background:var(--panel);border-radius:20px;overflow:hidden;border:1px solid var(--line)}
.lb-row{display:grid;grid-template-columns:64px 64px 1fr auto auto;align-items:center;gap:18px;
  padding:16px 26px;transition:background .15s}
.lb-row + .lb-row{border-top:1px solid var(--line)}
.lb-row:hover{background:var(--panel-2)}
.lb-rank{font-family:"Baloo 2",sans-serif;font-weight:800;font-size:22px;color:var(--txt-dim);text-align:center}
.lb-av{width:54px;height:54px;border-radius:50%;padding:3px;background:conic-gradient(from 200deg,#ff5c8a,#7c4dff,#41a0ff,#37d399,#ff5c8a)}
.lb-av .av-fill{width:100%;height:100%;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-family:"Baloo 2",sans-serif;font-weight:800;font-size:20px;color:#fff;text-transform:uppercase;
  background:linear-gradient(135deg,#3a2a6b,#1c1340)}
.lb-name{font-weight:800;font-size:17px;color:var(--txt)}
.lb-name .lb-xp{color:#ff5c63;font-weight:800;margin-left:4px}
.lb-tier{display:flex;align-items:center;justify-content:center;width:40px;color:#6e6688}
.lb-tier svg{width:30px;height:30px}
.lb-level{color:var(--txt-dim);font-weight:700;font-size:15px;min-width:84px;text-align:right}

/* tier renkleri (kademe) */
.lb-tier.bronze{color:#c8814a} .lb-level.bronze{color:#c8814a}
.lb-tier.silver{color:#aeb6c4} .lb-level.silver{color:#aeb6c4}
.lb-tier.gold{color:var(--gold)} .lb-level.gold{color:var(--gold)}

@media (max-width:680px){
  .podium{grid-template-columns:1fr;max-width:340px}
  .pod.first{order:-1}
  .lb-row{grid-template-columns:40px 50px 1fr auto;gap:12px;padding:14px 16px}
  .lb-tier{display:none}
  .lb-title h1{font-size:28px}
}