/* Bảng điểm dùng cùng bảng màu, kiểu chữ và bầu trời của Tĩnh Ngôn. */
.leaderboard-section {max-width:1160px; margin:auto; padding:88px 5% 110px}
.sky-rank-intro {position:relative; display:grid; grid-template-columns:minmax(0,1.5fr) minmax(280px,1fr); gap:36px; align-items:center; overflow:hidden; padding:clamp(26px,5vw,56px); border:1px solid rgba(248,237,196,.3); border-radius:30px; background:radial-gradient(circle at 76% 32%,rgba(242,214,109,.18),transparent 22%),radial-gradient(circle at 30% 95%,rgba(57,119,169,.38),transparent 45%),linear-gradient(135deg,#132e51,#09122f 72%); box-shadow:0 25px 70px rgba(0,0,0,.25)}
.sky-rank-intro::before {content:""; position:absolute; width:370px; height:370px; right:11%; top:-170px; border:1px solid rgba(248,237,196,.18); border-radius:50%; box-shadow:0 0 0 48px rgba(248,237,196,.035),0 0 0 96px rgba(248,237,196,.025); pointer-events:none}
.sky-rank-copy,.sky-rank-self {position:relative; z-index:1}
.sky-rank-eyebrow {display:block; font:700 10px/1.5 "DM Sans",sans-serif; letter-spacing:2.5px; color:var(--gold)}
.sky-rank-copy h3,.sky-rank-toolbar h3 {font-family:"Ky Viet Display","Cinzel",serif; font-weight:600; color:var(--cream)}
.sky-rank-copy h3 {font-size:clamp(28px,4vw,43px); line-height:1.25; margin:20px 0 14px}
.sky-rank-copy p {max-width:510px; color:#ced8e6; font-size:14px; line-height:1.85}
.sky-rank-cta {display:inline-flex; gap:25px; align-items:center; justify-content:space-between; margin-top:25px; border:1px solid var(--gold); border-radius:50px; background:var(--gold); color:#15233f; padding:13px 20px; font:700 12px "DM Sans",sans-serif; cursor:pointer; transition:transform .2s,box-shadow .2s}
.sky-rank-cta:hover {transform:translateY(-2px); box-shadow:0 8px 28px rgba(242,214,109,.24)}
.sky-rank-self {padding:28px; background:rgba(6,13,35,.53); border:1px solid rgba(248,237,196,.2); border-radius:24px; backdrop-filter:blur(9px)}
.sky-rank-self-label {font-size:11px; letter-spacing:2px; color:var(--gold)}
.sky-rank-self strong {display:block; margin:20px 0 4px; font:600 clamp(42px,6vw,62px)/1 "Ky Viet Display","Cinzel",serif; color:var(--cream)}
.sky-rank-self strong small {font:700 13px "DM Sans",sans-serif; letter-spacing:1px}
.sky-rank-self p {font-size:12px; color:#becbda; line-height:1.6}
.sky-rank-name {display:inline-block; margin-top:23px; padding:0 0 5px; color:var(--cream); background:none; border:0; border-bottom:1px solid rgba(248,237,196,.45); font:600 13px "DM Sans",sans-serif; cursor:pointer}
.sky-rank-name span {margin-left:9px; color:var(--gold)}
.sky-rank-status {margin:16px 3px 28px; font-size:12px; line-height:1.7; color:#bbc8db}
.sky-rank-paper {padding:clamp(20px,4vw,42px); border:1px solid rgba(248,237,196,.24); border-radius:30px; background:linear-gradient(145deg,rgba(19,49,81,.78),rgba(7,13,34,.91)); box-shadow:0 22px 60px rgba(0,0,0,.19)}
.sky-rank-toolbar {display:flex; align-items:flex-end; justify-content:space-between; gap:18px; padding-bottom:23px; border-bottom:1px solid rgba(248,237,196,.22)}
.sky-rank-toolbar h3 {font-size:clamp(22px,3vw,31px); margin:7px 0 0}
.sky-rank-tabs {display:flex; gap:5px; padding:4px; border:1px solid rgba(248,237,196,.22); border-radius:50px}
.sky-rank-tabs button {min-width:85px; border:0; border-radius:50px; background:none; color:#c8d3e1; padding:9px 13px; font:600 12px "DM Sans",sans-serif; cursor:pointer}
.sky-rank-tabs button[aria-pressed=true] {background:var(--gold); color:#102343}
.sky-rank-preview {margin:24px 0 26px; padding:19px; border:1px solid rgba(248,237,196,.2); border-radius:21px; background:radial-gradient(circle at 12% 12%,rgba(242,214,109,.11),transparent 35%),rgba(5,15,38,.35)}
.sky-rank-preview-heading {display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:5px 16px; margin-bottom:15px}
.sky-rank-preview-heading span,.sky-rank-real-heading {font:700 10px/1.5 "DM Sans",sans-serif; letter-spacing:1.8px; color:var(--gold)}
.sky-rank-preview-heading small,.sky-rank-real-heading span {font:400 11px/1.5 "DM Sans",sans-serif; letter-spacing:0; color:#b5c5da}
.sky-rank-preview-grid {display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px}
.sky-rank-preview-card {display:flex; align-items:center; gap:10px; min-width:0; padding:13px; border:1px solid rgba(248,237,196,.18); border-radius:15px; background:rgba(111,149,184,.1)}
.sky-rank-preview-orbit {flex:none; display:grid; place-items:center; width:36px; height:36px; border-radius:50%; border:1px solid rgba(242,214,109,.42); color:var(--gold); font-size:19px}
.sky-rank-preview-info {min-width:0; flex:1}
.sky-rank-preview-info b,.sky-rank-preview-info small {display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis}
.sky-rank-preview-info b {font:600 13px "DM Sans",sans-serif; color:var(--cream)}
.sky-rank-preview-info small {margin-top:4px; font:400 10px "DM Sans",sans-serif; color:#b5c5da}
.sky-rank-preview-xp {flex:none; text-align:right; font:600 16px "Ky Viet Display","Cinzel",serif; color:var(--gold)}
.sky-rank-preview-xp small {display:block; margin-top:3px; font:600 8px "DM Sans",sans-serif; letter-spacing:.7px; color:#b5c5da}
.sky-rank-real-heading {display:flex; align-items:center; gap:13px; padding:3px 8px 10px; border-bottom:1px solid rgba(248,237,196,.14)}
.sky-rank-row {display:grid; grid-template-columns:56px 46px minmax(0,1fr) auto; gap:17px; align-items:center; min-height:76px; padding:13px 8px; border-bottom:1px solid rgba(248,237,196,.13)}
.sky-rank-row:last-child {border-bottom:0}
.sky-rank-row.is-me {background:rgba(242,214,109,.085); border-radius:14px; padding-left:13px; padding-right:13px}
.sky-rank-position {font:600 18px "Ky Viet Display","Cinzel",serif; color:var(--gold); text-align:center}
.sky-rank-row-star {width:42px; height:42px; display:grid; place-items:center; border:1px solid rgba(248,237,196,.42); border-radius:50%; color:var(--gold); background:rgba(242,214,109,.07); font-size:22px}
.sky-rank-person {min-width:0}
.sky-rank-person b {display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; color:var(--cream)}
.sky-rank-person em {font-style:normal; color:var(--gold); font-weight:500}
.sky-rank-person small {display:block; margin-top:5px; color:#aebbd0; font-size:11px}
.sky-rank-points {white-space:nowrap; font:600 19px "Ky Viet Display","Cinzel",serif; color:var(--gold)}
.sky-rank-points small {font:700 10px "DM Sans",sans-serif; letter-spacing:1px}
.sky-rank-empty {padding:48px 15px; text-align:center}
.sky-rank-empty span {display:block; font-size:47px; color:var(--gold); margin-bottom:12px}
.sky-rank-empty strong {font:600 22px "Ky Viet Display","Cinzel",serif; color:var(--cream)}
.sky-rank-empty p {font-size:13px; color:#bdc9d9; margin-top:9px}
html[data-theme=light] .sky-rank-intro {background:radial-gradient(circle at 76% 32%,rgba(255,239,167,.7),transparent 23%),linear-gradient(135deg,#d0eaf4,#a6d3e8); border-color:rgba(36,103,138,.32); box-shadow:0 20px 45px rgba(51,112,151,.15)}
html[data-theme=light] .sky-rank-intro::before {border-color:rgba(24,88,120,.16)}
html[data-theme=light] .sky-rank-copy p,html[data-theme=light] .sky-rank-self p,html[data-theme=light] .sky-rank-status {color:#315974}
html[data-theme=light] .sky-rank-self {background:rgba(255,255,255,.55); border-color:rgba(36,103,138,.25)}
html[data-theme=light] .sky-rank-paper {background:linear-gradient(145deg,rgba(240,250,255,.96),rgba(198,228,242,.95)); border-color:rgba(36,103,138,.25); box-shadow:0 20px 50px rgba(51,112,151,.12)}
html[data-theme=light] .sky-rank-tabs,html[data-theme=light] .sky-rank-toolbar,html[data-theme=light] .sky-rank-row {border-color:rgba(36,103,138,.2)}
html[data-theme=light] .sky-rank-tabs button {color:#315974}
html[data-theme=light] .sky-rank-tabs button[aria-pressed=true] {background:#174b6b; color:#fff}
html[data-theme=light] .sky-rank-row.is-me {background:rgba(191,123,28,.1)}
html[data-theme=light] .sky-rank-person small,html[data-theme=light] .sky-rank-empty p {color:#426c82}
html[data-theme=light] .sky-rank-cta {background:#174b6b; border-color:#174b6b; color:#fff}
html[data-theme=light] .sky-rank-preview {background:radial-gradient(circle at 12% 12%,rgba(249,204,95,.22),transparent 35%),rgba(255,255,255,.35); border-color:rgba(36,103,138,.2)}
html[data-theme=light] .sky-rank-preview-card {background:rgba(255,255,255,.44); border-color:rgba(36,103,138,.17)}
html[data-theme=light] .sky-rank-preview-heading small,html[data-theme=light] .sky-rank-real-heading span,html[data-theme=light] .sky-rank-preview-info small,html[data-theme=light] .sky-rank-preview-xp small {color:#426c82}
@media(max-width:750px) {.sky-rank-intro {grid-template-columns:1fr; gap:24px}.sky-rank-toolbar {align-items:flex-start; flex-direction:column}.sky-rank-self {max-width:none}}
@media(max-width:900px) {.sky-rank-preview-grid {grid-template-columns:1fr}.sky-rank-preview-card {padding:10px 13px}}
@media(max-width:700px) {nav .logo,nav .nav-links a {white-space:nowrap} nav .nav-links a:nth-child(1),nav .nav-links a:nth-child(3),nav .nav-links a:nth-child(4) {display:none} nav .nav-links a:nth-child(2),nav .nav-links a:nth-child(5) {display:block} nav .nav-links {min-width:0;justify-content:center} nav .nav-links a {font-size:11px;padding:8px 7px}}
@media(max-width:500px) {.leaderboard-section {padding:68px 18px 80px}.sky-rank-intro,.sky-rank-paper {border-radius:22px}.sky-rank-row {grid-template-columns:33px 34px minmax(0,1fr) auto; gap:8px; min-height:69px; padding:9px 0}.sky-rank-row-star {width:32px;height:32px;font-size:17px}.sky-rank-position {font-size:14px}.sky-rank-person b {font-size:12px}.sky-rank-points {font-size:15px}.sky-rank-tabs {width:100%}.sky-rank-tabs button {flex:1}}
@media(max-width:420px) {nav .nav-links a:nth-child(2) {display:none} nav .nav-links a:nth-child(5) {font-size:11px}}
@media(prefers-reduced-motion:reduce) {.sky-rank-cta {transition:none}}