/* Global ranking, same look as the daily rewards: gold-lit card, hero strip, podium cards and glowing rows. */
.lb2-card {
  width: min(58rem, 94vw); max-width: 58rem; max-height: min(92vh, 52rem); display: flex; flex-direction: column;
  background: radial-gradient(ellipse 70% 40% at 50% 0, #fbbf2426, transparent 70%), radial-gradient(ellipse 50% 40% at 100% 100%, #a855f722, transparent 70%), linear-gradient(160deg, #1a2540, #0e1628 70%);
}
.lb2-header { padding-bottom: .5rem; }
.lb2-title-group { display: flex; align-items: center; gap: .8rem; min-width: 0; }
.lb2-icon { flex: none; display: grid; place-items: center; width: 2.8rem; height: 2.8rem; border-radius: .7rem; border: 2px solid #fcd34d; background: radial-gradient(circle at 30% 25%, #ffe58f, #f59e0b 60%, #b45309); color: #4a2a05; box-shadow: 0 0 1.2rem #fbbf24aa, inset 0 0 .5rem #fff8; animation: dailyIconPulse 2.2s ease-in-out infinite; }
.lb2-icon svg { width: 1.7rem; height: 1.7rem; }
.lb2-title { margin: 0; color: #fff7d6; font: 800 1.15rem var(--font-pixel-ui); letter-spacing: .04em; text-shadow: 0 0 .8rem #fbbf2477; }
.lb2-body { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: .8rem; padding-top: .4rem; }

/* Your position */
.lb2-hero { display: flex; align-items: center; gap: .9rem; padding: .7rem .9rem; border: 1px solid #fbbf2455; border-radius: .8rem; background: linear-gradient(100deg, #fbbf2420, #0f1a2e 60%); box-shadow: inset 0 0 1.6rem #fbbf2410; flex: none; }
.lb2-hero-avatar { width: 3.6rem; height: 3.6rem; object-fit: contain; image-rendering: pixelated; border-radius: .8rem; border: 2px solid #fcd34d; background: radial-gradient(circle at 50% 30%, #3a3017, #0b1222); flex: none; }
.lb2-hero-info { flex: 1; min-width: 0; }
.lb2-hero-info small { display: block; color: #fcd34d; font: 800 .58rem var(--font-pixel-ui); letter-spacing: .14em; }
.lb2-hero-info strong { display: block; margin-top: .2rem; color: #fff7d6; font: 800 1rem/1.3 var(--font-pixel-ui); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lb2-hero-stats { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .4rem; }
.lb2-hero-stats span { padding: .15rem .55rem; border-radius: 2rem; border: 1px solid #334155; background: #0b1222aa; color: #cbd5e1; font: 700 .62rem var(--font-clean); }
.lb2-hero-stats b { color: #fde68a; font: 800 .62rem var(--font-pixel-ui); }
.lb2-hero-rank { display: grid; justify-items: center; align-content: center; min-width: 6.5rem; padding: .4rem .8rem; border-radius: .6rem; border: 1px solid #86efac66; background: linear-gradient(#14532d55, #0b1222cc); flex: none; }
.lb2-hero-rank small { color: #94a3b8; font: 700 .5rem var(--font-pixel-ui); letter-spacing: .08em; }
.lb2-hero-rank strong { color: #86efac; font: 800 1.5rem/1.2 var(--font-pixel-ui); text-shadow: 0 0 .6rem #22c55e88; }

/* List: scrolls, with a fade at the bottom */
.lb2-list { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: .8rem; padding: .3rem .2rem 2.4rem; scrollbar-width: thin; scrollbar-color: #2e4063 transparent; -webkit-mask-image: linear-gradient(#000 calc(100% - 2.6rem), transparent); mask-image: linear-gradient(#000 calc(100% - 2.6rem), transparent); }

/* Podium */
.lb2-podium { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; align-items: end; padding-top: .6rem; }
.lb2-podium-card { --m: #cbd5e1; position: relative; display: grid; justify-items: center; gap: .45rem; padding: 1.7rem .7rem .8rem; overflow: hidden; isolation: isolate; border: 2px solid color-mix(in srgb, var(--m) 55%, #334a6b); border-radius: .8rem; background: radial-gradient(ellipse at 50% 0, color-mix(in srgb, var(--m) 30%, transparent), transparent 70%), linear-gradient(#17243c, #101a2e); transition: transform .2s, box-shadow .2s; }
.lb2-podium-card:hover { transform: translateY(-3px); box-shadow: 0 0 1.2rem color-mix(in srgb, var(--m) 40%, transparent); }
.lb2-podium-card.is-gold { --m: #fcd34d; padding-top: 2.1rem; box-shadow: 0 0 1.6rem #fbbf2466, inset 0 0 1.2rem #fbbf2422; transform: translateY(-6px); animation: dailyCurrent 2.2s ease-in-out infinite; }
.lb2-podium-card.is-gold:hover { transform: translateY(-9px); }
.lb2-podium-card.is-gold::after { content: ''; position: absolute; inset: 0; z-index: 3; pointer-events: none; background: linear-gradient(105deg, transparent 38%, #ffffff33 50%, transparent 62%); background-size: 250% 100%; animation: dailyShine 2.8s ease-in-out infinite; }
.lb2-podium-card.is-silver { --m: #cbd5e1; }
.lb2-podium-card.is-bronze { --m: #fb923c; }
.lb2-podium-card.is-self { outline: 2px solid #38bdf8; outline-offset: 2px; }
.lb2-podium-badge { position: absolute; top: .5rem; left: 50%; transform: translateX(-50%); padding: .12rem .6rem; border-radius: 2rem; background: color-mix(in srgb, var(--m) 85%, #000); border: 1px solid color-mix(in srgb, var(--m) 70%, #fff); color: #1a1203; font: 800 .6rem var(--font-pixel-ui); letter-spacing: .06em; white-space: nowrap; box-shadow: 0 0 .7rem color-mix(in srgb, var(--m) 60%, transparent); }
.lb2-podium-avatar { display: grid; place-items: center; width: 4.4rem; height: 4.4rem; border-radius: 50%; border: 2px solid var(--m); background: radial-gradient(circle at 35% 30%, color-mix(in srgb, var(--m) 35%, transparent), #ffffff08 70%); box-shadow: 0 0 1rem color-mix(in srgb, var(--m) 35%, transparent); }
.lb2-podium-avatar img { width: 3.6rem; height: 3.6rem; object-fit: contain; image-rendering: pixelated; }
.lb2-podium-name { max-width: 100%; color: #f8fafc; font: 800 .85rem var(--font-pixel-ui); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: center; }
.lb2-podium-card small { color: #94a3b8; font: 700 .52rem var(--font-pixel-ui); letter-spacing: .05em; text-align: center; }
.lb2-podium-card .lb2-bar { width: 86%; }

/* Rows */
.lb2-rows { display: grid; gap: .45rem; }
.lb2-row { display: grid; grid-template-columns: 3rem 2.6rem minmax(0, 1.2fr) minmax(6rem, 1fr) auto; align-items: center; gap: .7rem; padding: .45rem .75rem; border: 1px solid #334a6b; border-left: 4px solid #4a6290; border-radius: .7rem; background: radial-gradient(ellipse at 0 50%, #2a3f6644, transparent 60%), linear-gradient(#17243c, #101a2e); transition: transform .15s, border-color .15s, box-shadow .15s; }
.lb2-row:hover { transform: translateX(3px); border-color: #7dd3fc; box-shadow: 0 0 1rem #38bdf833; }
.lb2-row.is-self { border-color: #38bdf8; border-left-color: #38bdf8; background: radial-gradient(ellipse at 0 50%, #0ea5e933, transparent 60%), linear-gradient(#10304a, #0e1b30); box-shadow: 0 0 1rem #38bdf833; }
.lb2-rank { color: #94a3b8; font: 800 .85rem var(--font-pixel-ui); text-align: center; }
.lb2-avatar { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #ffffff30, #ffffff08 70%); border: 1px solid #ffffff22; }
.lb2-avatar img { width: 2.2rem; height: 2.2rem; object-fit: contain; image-rendering: pixelated; }
.lb2-who { min-width: 0; display: grid; gap: .15rem; }
.lb2-who strong { color: #f1f5f9; font: 800 .82rem var(--font-pixel-ui); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lb2-who small { color: #94a3b8; font: 700 .5rem var(--font-pixel-ui); letter-spacing: .05em; white-space: nowrap; }
.lb2-bar { display: block; height: .5rem; border-radius: .3rem; background: #0b1222; border: 1px solid #334155; overflow: hidden; }
.lb2-bar u { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #fbbf24, #f97316, #c084fc); box-shadow: 0 0 .5rem #fbbf24aa; }
.lb2-team-btn { padding: .3rem .7rem; border-radius: .45rem; border: 1px solid #7dd3fc88; background: #0c2238; color: #bae6fd; font: 800 .55rem var(--font-pixel-ui); letter-spacing: .05em; cursor: pointer; transition: background .15s, box-shadow .15s; }
.lb2-team-btn:hover, .lb2-team-btn:focus-visible { background: #12334f; box-shadow: 0 0 .8rem #38bdf855; outline: none; }
.lb2-podium-card .lb-team-tooltip-wrap { justify-self: center; }
.lb2-who strong .dev-tag, .lb2-podium-name .dev-tag { margin-left: .4rem; }

/* ---- v2: single list, medal rows for the top 3, margins, working reflection ---- */
.lb2-body { padding: .7rem 1.2rem 1.2rem; }
.lb2-list { padding: .5rem .55rem 2.4rem; gap: 0; }
.lb2-rows { display: grid; gap: .6rem; }
.lb2-row { position: relative; overflow: hidden; isolation: isolate; min-height: 3.6rem; padding: .55rem .9rem; gap: .8rem; grid-template-columns: 3.2rem 2.8rem minmax(0, 1.2fr) minmax(7rem, 1fr) auto; }
.lb2-row > * { position: relative; z-index: 2; }
.lb2-medal { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; justify-self: center; border-radius: 50%; border: 2px solid var(--m); background: radial-gradient(circle at 35% 30%, color-mix(in srgb, var(--m) 80%, #fff), var(--m) 60%, color-mix(in srgb, var(--m) 55%, #000)); color: #1a1203; font: 800 1rem var(--font-pixel-ui); box-shadow: 0 0 .9rem color-mix(in srgb, var(--m) 70%, transparent), inset 0 -2px 4px #0004; }
/* medal rows: bigger, each with its own colour and glow */
.lb2-row.is-gold, .lb2-row.is-silver, .lb2-row.is-bronze { min-height: 4.6rem; border-width: 2px; border-left-width: 6px; border-color: var(--m); }
.lb2-row.is-gold { --m: #fcd34d; background: radial-gradient(ellipse at 0 50%, #fbbf2455, transparent 62%), linear-gradient(90deg, #3a3017, #1a1a1c 70%); animation: lbGold 2.6s ease-in-out infinite; }
.lb2-row.is-silver { --m: #dbe4f0; background: radial-gradient(ellipse at 0 50%, #cbd5e144, transparent 62%), linear-gradient(90deg, #2b3446, #16192a 70%); box-shadow: 0 0 1rem #cbd5e144, inset 0 0 1rem #cbd5e110; }
.lb2-row.is-bronze { --m: #f08a3c; background: radial-gradient(ellipse at 0 50%, #f9731644, transparent 62%), linear-gradient(90deg, #3b2314, #1b1519 70%); box-shadow: 0 0 1rem #f9731633, inset 0 0 1rem #f9731610; }
@keyframes lbGold { 0%, 100% { box-shadow: 0 0 .9rem #fbbf2455, inset 0 0 .8rem #fbbf2418; } 50% { box-shadow: 0 0 1.8rem #fde047aa, inset 0 0 1.3rem #fbbf2440; } }
.lb2-row.is-gold .lb2-avatar, .lb2-row.is-silver .lb2-avatar, .lb2-row.is-bronze .lb2-avatar { width: 3.2rem; height: 3.2rem; border: 2px solid var(--m); box-shadow: 0 0 .9rem color-mix(in srgb, var(--m) 55%, transparent); }
.lb2-row.is-gold .lb2-avatar img, .lb2-row.is-silver .lb2-avatar img, .lb2-row.is-bronze .lb2-avatar img { width: 2.7rem; height: 2.7rem; }
.lb2-row.is-gold .lb2-who strong, .lb2-row.is-silver .lb2-who strong, .lb2-row.is-bronze .lb2-who strong { font-size: .95rem; color: color-mix(in srgb, var(--m) 35%, #fff); }
/* reflection: a slanted bright band sweeping across the row (same technique as the mode cards), staggered */
.lb2-row.is-gold::before, .lb2-row.is-silver::before, .lb2-row.is-bronze::before { content: ''; position: absolute; top: -30%; bottom: -30%; left: 0; width: 22%; z-index: 1; pointer-events: none; transform: translateX(-200%) skewX(-18deg); background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--m) 20%, #ffffff00) 25%, color-mix(in srgb, #ffffff 45%, var(--m)) 50%, color-mix(in srgb, var(--m) 20%, #ffffff00) 75%, transparent); filter: blur(1px); animation: lbShine 7s cubic-bezier(.45, 0, .25, 1) infinite; }
.lb2-row.is-silver::before { animation-delay: 2.3s; }
.lb2-row.is-bronze::before { animation-delay: 4.6s; }
@keyframes lbShine { 0% { transform: translateX(-200%) skewX(-18deg); opacity: 0; } 6% { opacity: 1; } 38% { transform: translateX(520%) skewX(-18deg); opacity: 1; } 42%, 100% { transform: translateX(520%) skewX(-18deg); opacity: 0; } }
.lb2-row.is-self { outline: 2px solid #38bdf8; outline-offset: 2px; }
/* Nível da conta + escudo do elo (só o contorno até os elos existirem) */
.lb2-stats { display: flex; align-items: center; gap: .7rem; }
.lb2-lv { padding: .2rem .6rem; border-radius: 2rem; border: 1px solid #fbbf2477; background: #0b1222aa; color: #fde68a; font: 800 .72rem var(--font-pixel-ui); white-space: nowrap; }
.lb2-elo { display: inline-grid; place-items: center; color: #64748b; }
.lb2-shield { width: 1.7rem; height: 1.7rem; opacity: .75; }
.lb2-hero-stats .lb2-elo { padding: .1rem .45rem; }
.lb2-hero-stats .lb2-shield { width: 1.1rem; height: 1.1rem; }
@media (prefers-reduced-motion: reduce) { .lb2-row.is-gold, .lb2-row.is-gold::before, .lb2-row.is-silver::before, .lb2-row.is-bronze::before { animation: none; } }