/* Rewards, History, Profile: stat tiles, ranked / recent lists (Revenue has its own file, revenue.css). */
.pg{padding-bottom:64px}
.pg .ptl{margin-bottom:16px} .pg.rw{margin-top:16px}
.stile{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); overflow:hidden; border-radius:6px; border:1px solid var(--line); background:var(--card)}
.stile>div{display:flex; min-height:6.5rem; flex-direction:column; padding:16px 20px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); min-width:0}
.stile .l{font-size:11px; color:var(--muted)}
.stile .v{margin:auto 0 2px; font-size:24px; font-weight:500; line-height:1; letter-spacing:-.02em; font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:flex; align-items:center; gap:8px}
.stile .v.lime{color:var(--head)}
.stile .s{font-size:11px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.stile.sm>div{min-height:5.5rem; padding:14px 16px} .stile.sm .v{font-size:20px}
.g2{margin-top:16px; display:grid; grid-template-columns:minmax(0,1fr); gap:16px}
.lst{margin:0 -8px}
.lst .it{display:flex; align-items:center; gap:12px; padding:10px 8px; border-bottom:1px solid color-mix(in srgb,var(--line) 60%,transparent)}
.lst .it:last-child{border-bottom:0}
.lst .it:hover{background:color-mix(in srgb,var(--well) 60%,transparent)}
.lst .rk{width:16px; flex:none; font-size:11px; color:var(--muted); font-variant-numeric:tabular-nums}
.lst .mid{min-width:0; flex:1}
.lst .mid b{display:block; font-size:13px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.lst .mid small{display:block; font-size:11.5px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.lst .rt{flex:none; text-align:right}
.lst .rt b{display:block; font-size:13px; font-weight:500; font-variant-numeric:tabular-nums}
.lst .rt small{display:block; font-size:11px; color:var(--muted); font-variant-numeric:tabular-nums}
.lst .lk{display:flex; min-width:0; flex:1; align-items:center; gap:12px; border-radius:4px}
.lst .gw{width:20px; flex:none}
.lst .go{display:flex; width:20px; height:20px; flex:none; align-items:center; justify-content:center; border-radius:3px; font-size:11px; color:var(--muted)}
.lst .go:hover{background:var(--well); color:var(--ink)}
.lst-foot{padding:12px 0; text-align:center; font-size:11px; color:var(--muted)}
.lst .none{display:flex; min-height:160px; align-items:center; justify-content:center; padding:0 24px; text-align:center; font-size:12px; color:var(--muted)}
.lst.scroll{min-height:0; flex:1; overflow-y:auto; overflow-x:hidden; max-height:520px}
.panel.fill{display:flex; flex-direction:column}
.panel.fill .panel-h{margin-bottom:12px}
.fillwrap{position:relative; min-width:0}

/* profile */
.prof{overflow:hidden; border-radius:6px; border:1px solid var(--line); background:var(--card)}
.pempty{padding:48px 24px; text-align:center}
.pempty h1{font-size:18px; font-weight:500; letter-spacing:-.01em}
.pempty p{margin:8px auto 0; max-width:42ch; font-size:13px; line-height:1.625; color:var(--muted)}
.pempty div{margin-top:20px; display:flex; justify-content:center}
.phead{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 16px; border-bottom:1px solid var(--line); padding:12px 20px}
.phead .addr{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:400 12.5px var(--mono)}
.pbtns{margin-left:auto; display:flex; flex:none; align-items:center; gap:8px}
.pbtn{display:inline-flex; height:32px; align-items:center; gap:6px; border-radius:4px; border:1px solid var(--line); padding:0 12px; font-size:12px; font-weight:500; color:var(--muted); transition:border-color .15s,background .15s,color .15s}
.pbtn:hover{border-color:var(--frame); background:var(--well); color:var(--ink)}
.pbtn.alert{color:var(--alert)} .pbtn.alert:hover{border-color:var(--alert); background:color-mix(in srgb,var(--alert) 5%,transparent); color:var(--alert)}
.pbal{display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:flex-end; gap:20px 32px; padding:20px}
.pbal div{text-align:right}
.pbal p{margin-bottom:6px; font-size:11px; color:var(--muted)}
.pbal b{font-size:20px; font-weight:500; line-height:1; letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.ptabs{border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:10px 12px}
.pills{display:flex; width:100%; min-width:0; align-items:center; gap:4px; overflow-x:auto; border-radius:999px; background:var(--track); padding:4px; scrollbar-width:none}
.pills button{display:flex; flex:none; align-items:center; gap:6px; border-radius:999px; padding:6px 14px; font-size:12.5px; font-weight:500; color:var(--muted); transition:background .15s,color .15s}
.pills button:hover{color:var(--ink)}
.pills button[aria-selected=true]{background:var(--card); color:var(--ink); box-shadow:0 1px 2px rgb(0 0 0/.08)}
.pills button span{font-size:10.5px; color:color-mix(in srgb,var(--muted) 60%,transparent); font-variant-numeric:tabular-nums}
.pills button[aria-selected=true] span{color:var(--muted)}
.plist{height:306px; overflow-y:auto}
.plist .none{display:grid; height:100%; place-items:center; padding:0 24px; text-align:center; font-size:12.5px; color:var(--muted)}
.prow{display:flex; height:60px; cursor:pointer; align-items:center; gap:12px; border-bottom:1px solid var(--line); padding:0 16px; transition:background .15s}
.prow:hover{background:color-mix(in srgb,var(--well) 60%,transparent)}
.prow .th{display:block; width:36px; flex:none; overflow:hidden; border-radius:5px; border:1px solid var(--line)}
.prow .th img{display:block; width:100%; height:auto; aspect-ratio:1; image-rendering:pixelated}
.prow .mid{min-width:0; flex:1}
.prow .mid b{display:block; font-size:13px; font-weight:500; line-height:1; font-variant-numeric:tabular-nums}
.prow .mid span{margin-top:6px; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; color:var(--muted); font-variant-numeric:tabular-nums}
.prow .chipst{flex:none; border-radius:3px; padding:3px 6px; font-size:9px; font-weight:500; text-transform:uppercase; letter-spacing:.08em; background:var(--well); color:var(--muted)}
.prow .chipst.on,.prow .chipst:not(.off){background:color-mix(in srgb,var(--lime) 30%,transparent); color:var(--head)}
.prow .claim{display:inline-flex; height:32px; flex:none; align-items:center; border-radius:4px; padding:0 12px; font-size:12px; font-weight:500; background:var(--fill); color:var(--on-fill); transition:background .15s}
.prow .claim:hover:not(:disabled){background:var(--fill-lit)}
.prow .claim:disabled{cursor:not-allowed; background:var(--track); color:color-mix(in srgb,var(--muted) 70%,transparent)}
.pmint{margin-top:16px; font-size:12px; color:var(--muted)}
.pmint a{color:var(--ink); text-decoration:underline; text-decoration-color:var(--line); text-underline-offset:4px}

@media (min-width:1024px){
  .stile.t4{grid-template-columns:repeat(4,minmax(0,1fr))} .stile.t5{grid-template-columns:repeat(5,minmax(0,1fr))}
  .stile>div{border-bottom:0} .stile>div:last-child{border-right:0}
  .g2{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .fillwrap{min-height:420px; overflow:hidden} .fillwrap>.panel{position:absolute; inset:0} .fillwrap .lst.scroll{max-height:none}
}
@media (min-width:640px) and (max-width:1023px){.stile.t5{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:1023px){.stile>div:nth-child(2n){border-right:0}}