.ranked-shop-categories{display:flex;gap:8px;margin:22px 0;flex-wrap:wrap}
.ranked-shop-categories button{display:flex;align-items:center;gap:9px;border:1px solid var(--r-line);border-radius:12px;padding:13px 18px;background:color-mix(in srgb,var(--r-panel) 80%,transparent);color:var(--r-muted);font:700 14px 'DM Sans',sans-serif;cursor:pointer}
.ranked-shop-categories button[aria-pressed="true"]{background:color-mix(in srgb,var(--r-gold) 12%,var(--r-panel));color:var(--r-gold);border-color:color-mix(in srgb,var(--r-gold) 45%,transparent)}
.ranked-shop-categories small{opacity:.65;font-size:11px}
.ranked-store-products:has(.is-cosmetic){grid-template-columns:repeat(3,minmax(0,1fr))}
.ranked-store-card.is-cosmetic .ranked-store-card-top{height:180px;justify-content:center;background:radial-gradient(ellipse at center,#61678035,transparent 70%);position:relative}
.ranked-cosmetic-art{width:150px;height:150px;object-fit:contain;position:relative;z-index:1;filter:drop-shadow(0 8px 12px #0005)}
.ranked-store-card.is-cosmetic .ranked-store-badge{position:absolute;top:16px;right:16px}
.ranked-store-card.is-cosmetic .ranked-store-category{letter-spacing:2px}
.ranked-store-card.is-cosmetic .ranked-store-detail{min-height:38px}
.ranked-aura-black{position:relative;isolation:isolate}
.ranked-aura-black:before,.ranked-aura-black:after{content:"";position:absolute;pointer-events:none;border-radius:inherit;inset:0;width:auto;height:auto;z-index:0;background:radial-gradient(ellipse at 19% 50%,#0203099c,transparent 29%),radial-gradient(ellipse at 78% 45%,#000000a8,transparent 24%);filter:blur(6px);animation:ranked-black-mist 9s ease-in-out infinite}
.ranked-aura-black:after{background:linear-gradient(115deg,transparent 8%,#949db02e 18%,#05060c80 26%,transparent 37%,transparent 65%,#828a9e26 75%,transparent 85%);background-size:180% 100%;filter:blur(4px);opacity:.45;animation:ranked-black-reflection 12s ease-in-out infinite}
.ranked-aura-black>:not(.ranked-black-effects){position:relative;z-index:1}
.ranked-black-effects{position:absolute!important;inset:0;z-index:0;overflow:hidden;border-radius:inherit;pointer-events:none!important;contain:paint}
.ranked-black-spark{position:absolute;width:16px;height:16px;left:var(--spark-x);top:var(--spark-y);opacity:0;animation:ranked-black-stars var(--spark-speed,7s) ease-in-out infinite;animation-delay:var(--spark-delay);filter:drop-shadow(0 0 5px #000b)}
.ranked-black-spark:before{content:"";position:absolute;inset:-2px;background:linear-gradient(135deg,#8d97acaa,#29304499 42%,#5c667a88);clip-path:polygon(50% 0,62% 37%,100% 50%,62% 63%,50% 100%,38% 63%,0 50%,38% 37%);filter:blur(.7px)}
.ranked-black-spark:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#8e96aa,#0a0c13 42%,#000 60%,#626b80);clip-path:polygon(50% 0,62% 37%,100% 50%,62% 63%,50% 100%,38% 63%,0 50%,38% 37%)}
.ranked-black-spark:nth-child(1){--spark-x:5%;--spark-y:24%;--spark-delay:-1s;--spark-speed:7s}
.ranked-black-spark:nth-child(2){--spark-x:17%;--spark-y:74%;--spark-delay:-4s;--spark-speed:9s;width:9px;height:9px}
.ranked-black-spark:nth-child(3){--spark-x:31%;--spark-y:18%;--spark-delay:-2s;--spark-speed:8s}
.ranked-black-spark:nth-child(4){--spark-x:45%;--spark-y:68%;--spark-delay:-6s;--spark-speed:10s;width:10px;height:10px}
.ranked-black-spark:nth-child(5){--spark-x:59%;--spark-y:28%;--spark-delay:-3s;--spark-speed:7s;width:11px;height:11px}
.ranked-black-spark:nth-child(6){--spark-x:70%;--spark-y:73%;--spark-delay:-7s;--spark-speed:9s}
.ranked-black-spark:nth-child(7){--spark-x:84%;--spark-y:18%;--spark-delay:-5s;--spark-speed:8s;width:9px;height:9px}
.ranked-black-spark:nth-child(8){--spark-x:95%;--spark-y:65%;--spark-delay:-8s;--spark-speed:11s;width:11px;height:11px}
.ranked-frame-black{position:relative;isolation:isolate;box-sizing:border-box;border:4px solid #05060a!important;outline:1px solid #717889;outline-offset:1px;box-shadow:inset 0 0 0 1px #495062,inset 0 0 25px #000b,0 0 0 3px #090a10,0 7px 20px #0007!important;background:radial-gradient(ellipse at 25% 0,#3c43586b,transparent 60%),linear-gradient(135deg,#171b25,#06070c 56%,#151923)!important}
.ranked-frame-black[data-cosmetic-mode="row"]{--r-ink:#f2f3f8;--r-muted:#aeb5c7;border:0!important;border-top:1px solid #555f7759!important;border-radius:0;outline:0;box-shadow:inset 0 1px 0 #8791a014,inset 0 -1px 0 #020308,inset 0 0 32px #0009!important;background:radial-gradient(ellipse at 17% 0,#454d6566,transparent 52%),radial-gradient(ellipse at 77% 110%,#2f364866,transparent 50%),linear-gradient(115deg,#191d28,#05060b 48%,#11141d)!important}
.ranked-frame-black[data-cosmetic-mode="skin"]{--r-ink:#f2f3f8;--r-muted:#aeb5c7;border-radius:22px!important}
.ranked-player-skin-panel.ranked-frame-black:not(.ranked-aura-black):before{background:#080a14;opacity:.5}
.ranked-player-skin-panel.ranked-frame-black>.ranked-player-eyebrow,.ranked-player-skin-panel.ranked-frame-black>small{color:#cad0df}
.ranked-cosmetic-avatar{width:46px;height:46px;border-radius:12px;flex-shrink:0;display:grid;place-items:center}
.ranked-cosmetic-avatar.ranked-frame-black{width:54px;height:54px}
.ranked-cosmetic-avatar img{width:100%;height:100%;object-fit:cover;border-radius:8px}
.ranked-cosmetic-avatar.ranked-frame-black img{width:100%;height:100%;border:0;border-radius:6px}
#ranked-account-character{display:grid;place-items:center;width:80px;height:80px;flex-shrink:0;border-radius:18px}
#ranked-account-character img{width:100%;height:100%;border-radius:14px;object-fit:cover}
.ranked-board-player>.ranked-board-player-copy{display:flex;flex-direction:column;gap:5px;min-width:0;overflow:hidden}
.ranked-board-player-copy>b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ranked-medals{display:flex;gap:7px;align-items:center;flex-wrap:wrap;max-width:100%;margin:12px 0 0}
.ranked-medals.is-compact{gap:4px;margin:0;flex-wrap:nowrap;min-width:0}
.ranked-medal{display:inline-flex;flex-shrink:0;border-radius:10px;background:#111b284d;border:1px solid #87919f30}
.ranked-medal img{width:40px;height:40px;object-fit:contain}
.ranked-medal.is-featured{background:#ffcd7824;border-color:#ffcd7870;filter:drop-shadow(0 0 6px #ffcd7825)}
.ranked-medals:not(.is-compact) .ranked-medal.is-featured img{width:53px;height:53px}
.ranked-medals.is-compact .ranked-medal img{width:25px;height:25px}
.ranked-medal-more{border:1px solid var(--r-line);border-radius:9px;color:var(--r-muted);background:color-mix(in srgb,var(--r-panel) 80%,transparent);font:700 11px 'DM Sans',sans-serif;padding:8px 10px;cursor:pointer;white-space:nowrap}
.ranked-medals.is-compact .ranked-medal-more{font-size:10px;padding:5px}
.ranked-medal-dialog{width:min(640px,calc(100vw - 32px));max-height:80vh;padding:25px;border:1px solid var(--r-line);border-radius:22px;background:var(--r-panel);color:var(--r-ink)}
.ranked-medal-dialog::backdrop{background:#02080dcc;backdrop-filter:blur(8px)}
.ranked-medal-dialog-header{display:flex;justify-content:space-between;align-items:center;gap:16px}
.ranked-medal-dialog h2{font-size:23px;margin:0}
.ranked-medal-dialog-header>button{color:var(--r-ink);background:transparent;border:1px solid var(--r-line);border-radius:9px;font-size:25px;width:36px;height:36px;cursor:pointer}
.ranked-medal-dialog>p{font-size:12px;color:var(--r-muted);line-height:1.6}
.ranked-medal-collection{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;max-height:50vh;overflow-y:auto;overscroll-behavior:contain;padding:4px}
.ranked-medal-collection-item{display:flex;flex-direction:column;align-items:center;gap:7px;padding:14px 5px;border:1px solid var(--r-line);border-radius:14px}
.ranked-medal-collection-item .ranked-medal img{width:68px;height:68px}
.ranked-medal-collection-item strong{font-size:11px;text-align:center}
.ranked-medal-collection-item small{font-size:10px;color:var(--r-gold)}
.ranked-cosmetic-inventory{margin-top:20px;display:grid;gap:15px}
.ranked-cosmetic-slot{display:flex;align-items:end;gap:10px}
.ranked-cosmetic-slot label{display:flex;flex-direction:column;gap:8px;flex:1;min-width:0;font-size:12px;font-weight:700;color:var(--r-muted)}
.ranked-cosmetic-slot select{min-width:0;width:100%;padding:12px;border:1px solid var(--r-line);border-radius:10px;background:var(--r-panel);color:var(--r-ink);font:600 14px 'DM Sans',sans-serif}
#ranked-cosmetics-status{font-size:12px;color:var(--r-muted);min-height:18px}
@keyframes ranked-black-mist{0%,100%{opacity:.4}50%{opacity:.85}}
@keyframes ranked-black-reflection{0%,100%{background-position:100% 0;opacity:.25}50%{background-position:0 0;opacity:.55}}
@keyframes ranked-black-stars{0%,100%{opacity:.12;transform:translateY(5px) scale(.65) rotate(-12deg)}40%{opacity:.9;transform:translateY(-5px) scale(1.08) rotate(8deg)}70%{opacity:.3;transform:translateY(-1px) scale(.8) rotate(0)}}
@media(max-width:650px){.ranked-medal-collection{grid-template-columns:repeat(3,minmax(0,1fr))}.ranked-shop-categories button{flex:1;justify-content:center;padding:12px}.ranked-cosmetic-slot{align-items:stretch;flex-direction:column}.ranked-medal-dialog{padding:18px}.ranked-medals{gap:5px}}
@media(max-width:1200px){.ranked-store-products:has(.is-cosmetic){grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.ranked-store-products:has(.is-cosmetic){grid-template-columns:1fr}#ranked-account-character{width:60px;height:60px}}
@media(prefers-reduced-motion:reduce){.ranked-aura-black:before,.ranked-aura-black:after,.ranked-black-spark{animation:none}.ranked-black-spark{opacity:.45;transform:none}}