:root{
  --lb-bg:#0f1420;
  --lb-bg2:#101625;
  --lb-border:rgba(255,255,255,.07);
  --lb-muted:#aab3c7;
  --lb-text:#e7edf7;
  --lb-primary1:#ffd24d;
  --lb-primary2:#ffb300;
  --lb-radius:18px;
}

.lb-wrap{ display:grid; gap:18px; margin-top:24px; }
.lb-head{ display:flex; align-items:center; gap:12px; }
.lb-title{ margin:0; font-size:1.4rem; }
.lb-actions{ margin-left:auto; display:flex; gap:8px; }

.lb-chip{
  border:1px solid var(--lb-border);
  background:#12182a;
  color:var(--lb-text);
  border-radius:999px;
  padding:8px 12px;
  font-weight:700;
  opacity:.85;
  cursor:not-allowed;
}

.card{
  background:linear-gradient(180deg,#121a2c,#0f1420);
  border:1px solid var(--lb-border);
  border-radius:var(--lb-radius);
}

.lb-podium{
  padding:20px;
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap:18px;
  align-items:end;
}
.lb-spot{ text-align:center; position:relative; display:grid; gap:10px; justify-items:center; }
.lb-spot-1{ transform:translateY(-10px); }
.lb-spot-2{ transform:translateY(8px); }
.lb-spot-3{ transform:translateY(14px); }
.lb-crown{ position:absolute; top:-2px; left:50%; transform:translateX(-50%); font-size:22px; filter:drop-shadow(0 2px 6px rgba(0,0,0,.4)); }

.lb-avatar{
  width:84px; height:84px; border-radius:50%;
  border:1px solid var(--lb-border);
  background:
    radial-gradient(90% 90% at 30% 20%, rgba(123,177,255,.18), transparent 70%),
    radial-gradient(70% 70% at 70% 80%, rgba(199,125,255,.14), transparent 70%),
    #0e1422;
  box-shadow: inset 0 8px 16px rgba(255,255,255,.03);
}
.lb-avatar.sm{ width:38px; height:38px; }

.lb-name{ width:120px; height:14px; border-radius:6px; }
.lb-value{ width:80px; height:14px; border-radius:6px; }
.lb-value.small{ width:70px; }
.lb-sub.tiny{ width:90px; height:10px; border-radius:5px; opacity:.8; }

.lb-plinth{
  width:100%; max-width:160px;
  border-radius:12px;
  padding:12px 10px;
  font-weight:900; letter-spacing:.5px;
  color:#0e1116;
  background:linear-gradient(135deg,#cfd7ff,#9eb2ff);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.25), 0 18px 30px rgba(0,0,0,.25);
}
.lb-spot-1 .lb-plinth{ background:linear-gradient(135deg,var(--lb-primary1),var(--lb-primary2)); }
.lb-spot-2 .lb-plinth{ background:linear-gradient(135deg,#cfd7ff,#9eb2ff); }
.lb-spot-3 .lb-plinth{ background:linear-gradient(135deg,#ffb1a7,#ff8b7d); }

.lb-table{ padding:8px; display:grid; gap:8px; }
.lb-row{
  display:grid;
  grid-template-columns: 56px 44px 1fr auto;
  align-items:center;
  gap:12px;
  padding:12px;
  border-radius:14px;
  border:1px solid var(--lb-border);
  background:linear-gradient(180deg,#121a2c,#0f1420);
}
.lb-row:hover{ border-color:rgba(255,255,255,.12); }

.lb-rank{
  width:42px; height:42px; display:grid; place-items:center;
  border-radius:12px; font-weight:900; color:var(--lb-text);
  background:linear-gradient(135deg,rgba(123,177,255,.14),rgba(199,125,255,.12));
  border:1px solid var(--lb-border);
}
.lb-col.grow{ display:grid; gap:6px; }
.lb-col{ display:grid; justify-items:end; }

.skel{ position:relative; overflow:hidden; }
.skel-text{ background:rgba(255,255,255,.06); }
.skel::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(100deg, transparent 20%, rgba(255,255,255,.08) 40%, transparent 60%);
  transform:translateX(-100%); animation:lb-sheen 2.3s linear infinite; border-radius:inherit;
}
@keyframes lb-sheen{ to{ transform:translateX(100%); } }

.lb-paywall{
  position:fixed;
  top:0; bottom:0;
  left:260px;
  right:0;
  z-index:1000;
  display:grid;
  place-items:center;
  pointer-events:none;
}

.lb-paywall::after{
  content:"";
  position:fixed;
  top:0; bottom:0; left:260px; right:0;
  background: rgba(10,14,22,.68);
  z-index:0;
  pointer-events:none;
}

.lb-paywall::before{
  content:"";
  position:fixed;
  left:260px; right:0; bottom:0;
  height:800px;
  background: linear-gradient(
    to top,
    rgba(10,14,22,0.98) 0%,
    rgba(10,14,22,0.95) 55%,
    rgba(10,14,22,0.00) 100%
  );
  z-index:0;
  pointer-events:none;
}

.lb-paywall-inner{
  position:relative;
  padding:16px 20px;
  background: rgba(16,22,37,.86);
  border:1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(4px);
  display:flex; align-items:center; gap:12px;
  border-radius:16px;
  pointer-events:auto;
  z-index:1;
}
.lb-paywall-text{ display:grid; gap:2px; }
.lb-paywall-sub{ color:var(--lb-muted); font-size:.92rem; }

.lb-btn-primary{
  display:inline-flex; align-items:center; justify-content:center;
  text-decoration:none !important; font-weight:700;
  padding:0 16px; height:40px; line-height:1; border-radius:12px;
  background:linear-gradient(135deg,var(--lb-primary1),var(--lb-primary2));
  color:#0e1116; border:none; cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease;
}
.lb-btn-primary:hover{ transform: translateY(-1px); box-shadow: 0 0 10px rgba(255,210,77,.4); }

.topbar{ position:relative; z-index:3000; }

@media (max-width:1100px){
  .lb-podium{ grid-template-columns: 1fr; gap:28px; }
  .lb-spot-1,.lb-spot-2,.lb-spot-3{ transform:none; }

  .lb-row{ grid-template-columns: 42px 42px 1fr auto; }

  .lb-paywall,
  .lb-paywall::before,
  .lb-paywall::after{
    left:0;
  }
}