@font-face{font-family:Anton;src:url('/assets/Anton-Regular.ttf') format('truetype');font-display:swap}
@font-face{font-family:Barlow;src:url('/assets/Barlow-SemiBold.ttf') format('truetype');font-display:swap}
*{box-sizing:border-box}html,body{margin:0;background:transparent;color:#fff;font-family:Barlow,sans-serif}body{width:460px;height:105px;overflow:hidden}
.rank-panel{--rank-color:#77c8ff;width:460px;height:105px;border-radius:15px;background:linear-gradient(115deg,rgba(16,19,28,.55),rgba(20,23,32,.45));border:1px solid #ffffff1a;display:flex;align-items:center;padding:12px 16px 12px 12px;gap:13px}
.badge-wrap{width:78px;height:78px;flex-shrink:0;display:grid;place-items:center}.badge-wrap img{width:78px;height:78px;object-fit:contain;filter:drop-shadow(0 3px 5px #0006)}[hidden]{display:none!important}#unranked{font:54px Anton;color:#8995a9}
.details{flex:1;min-width:0;text-shadow:0 1px 3px #000b}.account{font-size:12px;letter-spacing:.7px;color:#d5d8df;line-height:15px}.account span{color:#999fae;font-size:10px;letter-spacing:1.2px}
.rank-line{display:flex;justify-content:space-between;align-items:baseline;height:35px;gap:8px}h1{margin:0;font:28px/35px Anton,sans-serif;text-transform:uppercase;letter-spacing:.5px;color:var(--rank-color);white-space:nowrap}#percent{font:23px/30px Anton;color:#f4f6fb}
.progress{height:6px;background:#ffffff1c;border-radius:5px;overflow:hidden;margin:3px 0 6px}#fill{height:100%;width:0;background:var(--rank-color);border-radius:5px;transition:width .7s ease}
.footer{font-size:11px;display:flex;justify-content:space-between;color:#a7afbf;gap:8px;line-height:14px}.today{white-space:nowrap}.today strong{color:#87e7b2;font-size:12px;margin-left:4px}.today strong.negative{color:#ff9eab}.today strong.unavailable{color:#a7afbf}
@media(prefers-reduced-motion:reduce){#fill{transition:none}}