/* 🏆 RAKAN leaderboard page (leaderboard.html + leaderboard-ar.html) — on top of styles.css */
.lb-body { background: radial-gradient(1200px 600px at 80% -10%, rgba(255, 181, 71, .10), transparent 60%), radial-gradient(900px 500px at 0% 10%, rgba(10, 132, 255, .12), transparent 60%), var(--bg); }
.lb { padding-block: 34px 70px; }
.lb-wrap { display: grid; gap: 22px; max-width: 980px; }
.lb-hero { display: grid; gap: 10px; }
.lb-kicker { font: 600 .78rem/1 var(--mono); letter-spacing: .22em; text-transform: uppercase; color: #ffcf6e; }
.lb-hero h1 { font-size: clamp(2rem, 5.4vw, 3.3rem); font-weight: 700; }
.lb-hero h1 em { font-style: normal; background: linear-gradient(100deg, #ffcf6e, #ff8a3d); -webkit-background-clip: text; background-clip: text; color: transparent; }
.lb-hero p { margin: 0; color: var(--mute); max-width: 62ch; }
.lb-tabs { display: inline-flex; gap: 6px; padding: 5px; border: 1px solid var(--line-2); border-radius: 14px; background: var(--panel); justify-self: start; }
.lb-tabs button { font: 600 .9rem/1 var(--display); color: var(--mute); background: none; border: 0; border-radius: 10px; padding: 11px 18px; cursor: pointer; }
.lb-tabs button[aria-selected="true"] { color: #1a1205; background: linear-gradient(100deg, #ffcf6e, #ffb547); }
.lb-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.lb-stat { border: 1px solid var(--line); border-radius: 14px; background: var(--panel); padding: 14px 16px; min-width: 0; }
.lb-stat b { display: block; font: 700 1.4rem/1.1 var(--display); color: var(--white); }
.lb-stat span { font: 500 .74rem/1.3 var(--mono); letter-spacing: .08em; color: var(--mute); text-transform: uppercase; }
.lb-podium { display: grid; grid-template-columns: 1fr 1.15fr 1fr; gap: 12px; align-items: end; }
.lb-pod { position: relative; border-radius: 18px; padding: 18px 14px 16px; text-align: center; border: 1px solid var(--line-2); background: var(--panel-solid); min-width: 0; }
.lb-pod .m { font-size: 2rem; line-height: 1; }
.lb-pod .n { margin-top: 8px; font: 700 1.05rem/1.2 var(--display); color: var(--white); overflow-wrap: anywhere; }
.lb-pod .p { margin-top: 6px; font: 700 1.5rem/1 var(--display); }
.lb-pod .s { margin-top: 6px; font: 500 .8rem/1.3 var(--mono); color: var(--mute); }
.lb-pod.g1 { padding-block: 26px 22px; border-color: rgba(255, 207, 110, .6); box-shadow: 0 0 0 1px rgba(255, 207, 110, .25), 0 18px 50px -14px rgba(255, 181, 71, .55); }
.lb-pod.g1 .p { color: #ffcf6e; } .lb-pod.g2 .p { color: #dfe7f2; } .lb-pod.g3 .p { color: #e6a06a; }
.lb-pod.empty { opacity: .45; }
.lb-card { border: 1px solid var(--line); border-radius: 18px; background: var(--panel); padding: 18px; min-width: 0; }
.lb-card h2 { font-size: 1.15rem; margin-bottom: 12px; }
.lb-scroll { overflow-x: auto; }
.lb-table { width: 100%; border-collapse: collapse; font-size: .93rem; }
.lb-table th { font: 600 .72rem/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--mute); text-align: start; padding: 10px 8px; border-bottom: 1px solid var(--line-2); white-space: nowrap; }
.lb-table td { padding: 11px 8px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.lb-table td.r { font: 700 .95rem/1 var(--display); color: var(--white); width: 3ch; }
.lb-table td.nm { color: var(--white); font-weight: 600; white-space: normal; overflow-wrap: anywhere; }
.lb-table tr.me td { background: rgba(255, 207, 110, .08); }
.lb-table .num { font-family: var(--mono); }
.up { color: var(--lower); } .dn { color: var(--high); } .gold { color: #ffcf6e; }
.lb-me { display: grid; gap: 12px; border: 1px solid rgba(255, 207, 110, .45); border-radius: 18px; padding: 18px; background: linear-gradient(140deg, rgba(255, 181, 71, .10), rgba(10, 132, 255, .06)); }
.lb-me .big { font: 700 clamp(1.8rem, 5vw, 2.6rem)/1 var(--display); color: #ffcf6e; }
.lb-me .row { display: flex; flex-wrap: wrap; gap: 10px 22px; color: var(--text); }
.lb-me .row b { color: var(--white); }
.lb-how { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.lb-how div { border: 1px solid var(--line); border-radius: 14px; padding: 14px; background: var(--panel-solid); min-width: 0; }
.lb-how b { display: block; color: var(--white); margin-bottom: 4px; font-family: var(--display); }
.lb-how code { font-family: var(--mono); color: #ffcf6e; }
.lb-pts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.lb-pts span { font: 600 .82rem/1 var(--mono); padding: 8px 10px; border-radius: 10px; border: 1px solid var(--line-2); color: var(--white); }
.lb-note { font-size: .85rem; color: var(--mute); margin: 0; }
.lb-empty { color: var(--mute); padding: 10px 0; }
@media (max-width: 720px) { .lb-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .lb-how { grid-template-columns: 1fr; } .lb-podium { grid-template-columns: 1fr; } .lb-pod.g1 { order: -1; } }
.lb-pod .n, .lb-pod .s, .lb-table td.nm, .lb-table .num, .lb-stat b, .lb-me .big { unicode-bidi: plaintext; }
[dir="rtl"] .lb-table td.nm, [dir="rtl"] .lb-table .num { text-align: right; }