.rankings-pagina{position:relative;isolation:isolate}.rankings-pagina:before{content:"";position:fixed;inset:0;z-index:-2;background:radial-gradient(70% 50% at 50% 0%,rgba(255,170,60,.18),transparent 70%),radial-gradient(40% 40% at 90% 90%,rgba(255,170,60,.15),transparent 70%),var(--bg)}.rankings{padding-bottom:56px}.cabecera.banda:after{background:linear-gradient(90deg,#070c18f2,#070c18d9,#070c1880)}.panel-rank{margin-top:18px;padding:clamp(24px,2.6vw,34px);border:1px solid transparent;border-image:url(/mu/hud/xshop/art/vip/marco-duracion.png) 40 fill / 22px stretch;filter:drop-shadow(0 20px 40px rgba(0,0,0,.5))}.grupos{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px}.grupos button{position:relative;min-width:220px;height:64px;padding:0 18px;border-radius:8px;border:1px solid rgba(221,170,72,.35);overflow:hidden;cursor:pointer;color:var(--bright);font:700 17px var(--display);text-align:left;background:#0d0a07;isolation:isolate;filter:grayscale(1);opacity:.75;transition:filter .2s,opacity .2s,box-shadow .2s}.grupos button:before{content:"";position:absolute;inset:0;z-index:-1;background:var(--img) right center/cover no-repeat;opacity:.9}.grupos button:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0a1428f2 30%,#0a142833)}.grupos button:hover{opacity:1}.grupos button.on{filter:none;opacity:1;border-color:#ddaa48d9;box-shadow:0 0 0 1px #f0cf7a59,inset 0 -3px #ddaa48,0 0 18px #ffaa3c73}.categorias{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px}.categorias button{position:relative;display:inline-flex;align-items:center;gap:10px;min-width:160px;padding:10px 34px 10px 12px;background:linear-gradient(180deg,#1c150d,#0d0a06);border:1px solid rgba(221,170,72,.32);color:var(--text);border-radius:8px;font:700 14px var(--display);cursor:pointer;transition:background .2s,border-color .2s}.categorias button img{width:38px;height:38px;padding:5px;border-radius:50%;object-fit:cover;object-position:top;background:url(/mu/hud/inicio/arte/hud/aro.webp) center/100% 100% no-repeat}.categorias button:hover{border-color:#ddaa4899;color:var(--bright)}.categorias button.on{background:radial-gradient(90% 120% at 50% 100%,rgba(255,170,60,.55),transparent 70%),linear-gradient(180deg,#4a3315,#1a120a);color:#fff;border-color:#ddaa48bf;box-shadow:inset 0 -2px #ddaa48,0 0 12px #ffaa3c59}.categorias button.on img{background-image:url(/mu/hud/inicio/arte/hud/aro.webp)}.categorias button i{position:absolute;top:8px;right:10px;width:16px;height:16px;border-radius:50%;border:1px solid rgba(255,255,255,.4);font:700 10px/14px var(--display);font-style:normal;text-align:center;color:var(--muted)}.categorias button:hover i{color:var(--bright);border-color:var(--bright)}.filtro-fila{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding:16px 0 12px;background:url(/mu/hud/unificado/art/separador_3.png) center top/100% 10px no-repeat}.clases-filtro{display:flex;flex-wrap:wrap;align-items:center;gap:4px}.clases-filtro button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:44px;height:40px;padding:0 10px;border-radius:12px;border:1px solid transparent;background:none;color:var(--muted);font:700 13px var(--display);cursor:pointer;position:relative}.clases-filtro button img{width:30px;height:30px;border-radius:50%;object-fit:cover;object-position:top;background:#0d0a07;border:1px solid rgba(255,255,255,.15);filter:grayscale(.6)}.clases-filtro button:hover,.clases-filtro button.on{color:var(--bright)}.clases-filtro button.on img,.clases-filtro button:hover img{filter:none;border-color:#ffd475;box-shadow:0 0 8px #ffaa3c80}.clases-filtro button.on:after{content:"";position:absolute;left:20%;right:20%;bottom:0;height:2px;background:#ddaa48;border-radius:2px;box-shadow:0 0 6px #ddaa48}.buscar{position:relative;display:flex;align-items:center;min-width:min(280px,100%)}.buscar .lupa{position:absolute;left:12px;color:var(--muted);font-size:18px;pointer-events:none}.buscar input{padding-left:34px}.explica{font-size:13px;color:var(--muted);margin-bottom:10px}.rank-tabla td.num,.rank-tabla th.num{text-align:right;font-family:var(--mono);white-space:nowrap}.rank-tabla td.nombre{color:var(--bright);font-weight:700;white-space:nowrap}.rank-tabla tr.oro td.nombre{color:var(--gold)}.rank-tabla tr.plata td.nombre{color:#d7dce6}.rank-tabla tr.bronce td.nombre{color:#e09a5a}.rank-tabla td.puesto{width:52px}.rank-tabla .medalla{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;font:700 13px var(--display);background:radial-gradient(circle,#2a1e12,#0a0705);border:1px solid rgba(221,170,72,.5);color:var(--text)}.rank-tabla tr.oro .medalla{background:var(--gold-grad);color:#0d0d10;box-shadow:0 0 10px #f0cf7a80}.rank-tabla tr.plata .medalla{background:linear-gradient(180deg,#f2f4f8,#aeb6c4);color:#0d0d10}.rank-tabla tr.bronce .medalla{background:linear-gradient(180deg,#f0b27a,#b86b2c);color:#0d0d10}.rank-tabla .en-linea{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 6px var(--ok);margin-right:6px;vertical-align:middle}.rank-tabla .fuera{display:inline-block;width:8px;height:8px;border-radius:50%;background:#fff3;margin-right:6px;vertical-align:middle}.rank-tabla .clase-chip{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}.rank-tabla .clase-chip img{width:28px;height:28px;border-radius:50%;object-fit:cover;object-position:top;background:#0d0a07;border:1px solid rgba(255,255,255,.15)}.rank-tabla td.valor{color:#fff;font-weight:700;text-shadow:0 0 10px rgba(255,170,60,.6)}.rank-tabla td.sitio,.rank-tabla td.gremio{color:var(--muted)}.rank-tabla td.gremio b{color:var(--text);font-weight:500}.estado-rank{padding:28px 16px;text-align:center;color:var(--muted)}.centro{text-align:center}.nota{color:var(--muted);font-size:13px;margin-top:14px}@media(max-width:900px){.grupos button{min-width:0;flex:1}.categorias button{min-width:0;flex:1 1 140px}.rank-tabla td.sitio,.rank-tabla th.sitio{display:none}}@media(max-width:600px){.rank-tabla td.gremio,.rank-tabla th.gremio,.clases-filtro button span{display:none}}.rank-tabla .nombre .a-ficha{color:inherit;text-decoration:none}.rank-tabla .nombre .a-ficha:hover{color:var(--gold-hi, #FFD475);text-decoration:underline;text-underline-offset:3px}
