.lbWrap{ max-width: 860px; padding-bottom: 96px; }
.lbTabs{ display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; margin: 0 auto 34px; }
.lbTab{ display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 0 20px; border-radius: 999px; border: 1px solid var(--line-2); background: #fff; color: var(--ink); font: 700 15px/1 var(--font-body, inherit); cursor: pointer; transition: transform .15s ease, background .15s ease, color .15s ease; }
.lbTab:hover{ transform: translateY(-2px); }
.lbTab img{ width: 22px; height: 22px; object-fit: contain; }
.lbTab.active{ background: var(--lav-900); border-color: var(--lav-900); color: #fff; box-shadow: 0 4px 0 var(--lav-950); }

.lbSub{ display: flex; justify-content: center; gap: 6px; width: max-content; margin: -18px auto 28px; padding: 5px; border-radius: 999px; background: var(--lav-100, #F1EAFF); }
.lbSub[hidden]{ display: none; }
.lbSub button{ padding: 9px 16px; border: 0; border-radius: 999px; background: transparent; color: var(--lav-800); font: 700 13px/1 var(--font-body, inherit); cursor: pointer; }
.lbSub button.active{ background: #fff; color: #7B3FE4; box-shadow: 0 2px 8px rgba(60,48,130,.12); }
.lbVal b i, .lbPodVal b i{ font-size: 16px; }

.lbPodium{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; align-items: end; margin-bottom: 22px; }
.lbPod{ display: grid; justify-items: center; gap: 10px; padding: 22px 12px 20px; border-radius: 28px; background: #fff; border: 1px solid var(--line); box-shadow: 0 6px 0 var(--lav-200); text-decoration: none; color: var(--ink); text-align: center; transition: transform .2s ease; }
.lbPod:hover{ transform: translateY(-4px); }
.lbPod.p1{ padding-top: 34px; background: linear-gradient(160deg, #fff, #F3EAFF); border-color: var(--lav-300); box-shadow: 0 8px 0 #B99AF5; }
.lbPodAv{ position: relative; width: 84px; height: 84px; border-radius: 26px; overflow: visible; }
.lbPod.p1 .lbPodAv{ width: 104px; height: 104px; }
.lbPodAv img, .lbPodAv span{ display: grid; place-items: center; width: 100%; height: 100%; border-radius: inherit; object-fit: cover; background: var(--lav-200); color: var(--lav-800); font-weight: 800; font-size: 28px; border: 4px solid #fff; box-shadow: 0 10px 24px rgba(60,48,130,.18); }
.lbPodAv em{ position: absolute; right: -8px; bottom: -8px; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; font: 800 16px/1 var(--font-display); font-style: normal; color: #fff; background: #B9A7F5; border: 3px solid #fff; }
.lbPod.p1 .lbPodAv em{ background: linear-gradient(140deg, #FFD86B, #E6B422); color: #5C3D00; }
.lbPod.p2 .lbPodAv em{ background: linear-gradient(140deg, #E8EAF0, #B9BECC); color: #3F4456; }
.lbPod.p3 .lbPodAv em{ background: linear-gradient(140deg, #F6C9A0, #D08A55); }
.lbPodName{ max-width: 100%; font-weight: 800; font-size: 17px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lbPodBy{ margin-top: -8px; color: var(--muted); font-size: 12px; font-weight: 600; }
.lbPodVal b, .lbVal b{ display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-display); font-weight: 800; color: #7B3FE4; font-size: 18px; }
.lbPodVal b img, .lbVal b img{ width: 22px; height: 22px; object-fit: contain; }
.lbPodVal small, .lbVal small{ display: block; color: var(--muted); font-size: 12px; font-weight: 600; }

.lbMe{ display: grid; grid-template-columns: auto auto 44px minmax(0, 1fr) auto; align-items: center; gap: 14px; margin-bottom: 14px; padding: 14px 20px; border-radius: 22px; background: linear-gradient(120deg, #A06BF5, #7B3FE4); color: #fff; box-shadow: 0 6px 0 #5B2BB8; }
.lbMe .lbVal b, .lbMe .lbVal small{ color: #fff; }
.lbMeLabel{ font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; opacity: .85; }

.lbList{ display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.lbRow a{ display: grid; grid-template-columns: 54px 44px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 10px 18px; border-radius: 20px; background: #fff; border: 1px solid var(--line); text-decoration: none; color: var(--ink); transition: transform .15s ease, border-color .15s ease; }
.lbRow a:hover{ transform: translateX(4px); border-color: var(--lav-400); }
.lbRow.isMe a{ border: 2px solid var(--lav-500); background: var(--lav-50); }
.lbPos{ font: 800 18px/1 var(--font-display); color: var(--lav-700); }
.lbMe .lbPos{ color: #fff; }
.lbAv{ width: 44px; height: 44px; border-radius: 14px; overflow: hidden; }
.lbAv img, .lbAv span{ display: grid; place-items: center; width: 100%; height: 100%; object-fit: cover; background: var(--lav-200); color: var(--lav-800); font-weight: 800; }
.lbName{ min-width: 0; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lbName small{ margin-left: 8px; color: var(--muted); font-weight: 600; }
.lbMe .lbName small{ color: rgba(255,255,255,.75); }
.lbVal{ text-align: right; }
.lbState{ padding: 50px 20px; text-align: center; color: var(--muted); font-weight: 600; }

@media (max-width: 560px){
  .lbPodium{ gap: 8px; }
  .lbPod{ padding: 16px 6px 14px; border-radius: 22px; }
  .lbPodAv{ width: 60px; height: 60px; border-radius: 18px; }
  .lbPod.p1 .lbPodAv{ width: 74px; height: 74px; }
  .lbPodName{ font-size: 14px; }
  .lbPodVal b{ font-size: 15px; }
  .lbRow a{ grid-template-columns: 40px 36px minmax(0, 1fr) auto; gap: 10px; padding: 10px 12px; }
  .lbAv{ width: 36px; height: 36px; border-radius: 12px; }
  .lbName small{ display: none; }
  .lbMe{ grid-template-columns: auto 36px minmax(0, 1fr) auto; gap: 10px; padding: 12px 14px; }
  .lbMe .lbAv{ width: 36px; height: 36px; }
  .lbMeLabel{ display: none; }
}
