.rank-portrait{position:relative;isolation:isolate;display:grid;place-items:center;width:min(240px,28dvh);aspect-ratio:1;margin:0 auto 12px;flex:none}
.rank-portrait img{position:relative;z-index:2;display:block;width:100%;height:100%;object-fit:contain;margin:0}
.rank-sparkles{display:none}
[data-rank="time"] .rank-portrait{border-radius:18px;background:linear-gradient(125deg,#b8edf4,#d4b5ee 22%,#e7dea3 42%,#a4eadf 62%,#b3c9f3 80%,#f0c5dd);box-shadow:0 0 0 1px #fff2c2,0 0 0 5px #c5ac6844,0 0 30px #c6dfff33,inset 0 0 22px #fff7;overflow:hidden}
[data-rank="time"] .rank-portrait::before{content:"";position:absolute;inset:0;z-index:0;background:repeating-conic-gradient(from 45deg,#ffffff00 0% 25%,#fff7 0% 50%) 0 0/30px 30px,linear-gradient(135deg,#b6f1ff66,#dcbbff66,#ffdf9b66,#9cf0df66);opacity:.55}
[data-rank="time"] .rank-portrait::after{content:"";position:absolute;inset:-70%;z-index:3;pointer-events:none;background:linear-gradient(115deg,transparent 38%,#c8f7ff00 42%,#fff8 49%,#f3d5ff88 52%,transparent 58%);transform:translateX(-35%);animation:rank-foil-sweep 5.8s ease-in-out infinite;mix-blend-mode:screen}
[data-rank="time"] .rank-portrait img{filter:drop-shadow(0 3px 5px #25305155);transform:scale(1.12)}
[data-rank="time"] .rank-sparkles{display:block;position:absolute;inset:0;z-index:4;pointer-events:none}
.rank-sparkles i{position:absolute;left:12%;top:19%;width:17px;height:17px;background:#fffef0;clip-path:polygon(50% 0,61% 38%,100% 50%,61% 62%,50% 100%,39% 62%,0 50%,39% 38%);animation:rank-star-glow 3.4s ease-in-out infinite;filter:drop-shadow(0 0 5px white)}
.rank-sparkles i:nth-child(2){left:78%;top:14%;width:11px;height:11px;animation-delay:-1.2s}.rank-sparkles i:nth-child(3){left:82%;top:72%;width:21px;height:21px;animation-delay:-2.4s}.rank-sparkles i:nth-child(4){left:17%;top:79%;width:10px;height:10px;animation-delay:-.6s}
@keyframes rank-foil-sweep{0%,15%{transform:translateX(-35%)}75%,100%{transform:translateX(35%)}}
@keyframes rank-star-glow{0%,100%{opacity:.25;transform:scale(.55)}50%{opacity:1;transform:scale(1)}}
@media(max-width:600px){.rank-portrait{width:min(190px,25dvh)}}
@media(prefers-reduced-motion:reduce){[data-rank="time"] .rank-portrait::after,.rank-sparkles i{animation:none}.rank-sparkles i{opacity:.8}}