/* Evolua · XP, ranks e ranking */
.xpc{--rc:#94a3b8;--rl:#cbd5e1;--rd:#64748b;position:relative;overflow:hidden;background:var(--card);background:linear-gradient(145deg,color-mix(in srgb,var(--rc) 16%,var(--card)),var(--card) 62%);border:1px solid color-mix(in srgb,var(--rc) 45%,var(--bd));border-radius:18px;padding:16px;margin:0 0 14px;animation:in .35s both}
.xpc:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--rd),var(--rc),var(--rl))}
.xpc-t{font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--mu)}
.xpc-m{display:flex;align-items:center;gap:14px;margin:8px 0 12px}
.xpc-ic{flex:none;line-height:0;filter:drop-shadow(0 6px 14px color-mix(in srgb,var(--rc) 45%,transparent))}
.xpc-i{display:flex;flex-direction:column;gap:2px;min-width:0}
.xpc-n{font-size:26px;letter-spacing:.04em;line-height:1.1;color:var(--rc);text-transform:uppercase}
.xpc-lv{font-size:13px;color:var(--mu)}
.xpc-x{font-size:14px;color:var(--mu)}.xpc-x b{font-size:20px;color:var(--tx)}
.xpc-bar{height:10px;background:var(--bd);border-radius:9px;overflow:hidden}
.xpc-bar i{display:block;height:100%;border-radius:9px;background:linear-gradient(90deg,var(--rd),var(--rc),var(--rl));transition:width 1.1s cubic-bezier(.2,.8,.2,1) .5s}
.xpc-f{margin:8px 0 12px;font-size:14px;color:var(--mu)}.xpc-f b{color:var(--tx)}
.xpc-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:8px}
.xpc-g div{background:color-mix(in srgb,var(--rc) 8%,var(--card));border:1px solid var(--bd);border-radius:12px;padding:9px 6px;text-align:center}
.xpc-g b{display:block;font-size:18px}.xpc-g span{font-size:11px;color:var(--mu)}
.xpj-h{margin:14px 0 6px;font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--mu);text-transform:uppercase}
.xpj-s{display:flex;gap:6px;overflow-x:auto;padding:6px 2px 4px;scrollbar-width:none}.xpj-s::-webkit-scrollbar{display:none}
.xpj{flex:none;width:62px;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 2px;border-radius:12px;border:1.5px solid transparent;opacity:.5;filter:saturate(.7)}
.xpj.ok{opacity:.9;filter:none}.xpj.cur{opacity:1;filter:none;border-color:var(--rc);background:color-mix(in srgb,var(--rc) 12%,transparent)}
.xpj small{font-size:10px;line-height:1.1;text-align:center;color:var(--mu)}.xpj.cur small{color:var(--rc);font-weight:700}
.xpc-g0 .xpc-m{margin-bottom:0}.xpc-ld{min-height:90px}
.xpb{margin:0 0 14px}.xpb h2{margin-top:20px}
.xpb-me{margin:-4px 0 10px;font-size:14px}.xpb-me b{color:var(--pr);font-size:18px}
.xpb-l{display:flex;flex-direction:column;gap:6px}
.xpb-r{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--bd);border-radius:14px;padding:8px 12px}
.xpb-r.me{border-color:var(--pr);background:var(--prl)}
.xpb-p{flex:none;min-width:30px;height:30px;padding:0 4px;border-radius:99px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:var(--mu)}
.xpb-p.p1{background:linear-gradient(145deg,#fde047,#ca8a04);color:#422006}.xpb-p.p2{background:linear-gradient(145deg,#f1f5f9,#94a3b8);color:#1e293b}.xpb-p.p3{background:linear-gradient(145deg,#fdba74,#b45309);color:#431407}
.xpb-r .xi{flex:none}
.xpb-n{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.xpb-n b{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.xpb-n em{font-style:normal;font-size:11px;font-weight:700;color:var(--pr);margin-left:4px}
.xpb-n small{font-size:12px;color:var(--rc);font-weight:600}
.xpb-x{flex:none;font-weight:700;font-size:14px}
.xpb-dots{text-align:center;color:var(--mu);line-height:1}
.xi{display:inline-block;vertical-align:middle}
.xi-sp{animation:xpsp 2.4s ease-in-out infinite;transform-origin:center}
@keyframes xpsp{0%,100%{opacity:.25}50%{opacity:1}}
/* +XP flutuante */
.xpg{position:fixed;z-index:60;left:50%;top:76px;transform:translateX(-50%);background:var(--pr);color:#fff;font-weight:800;padding:8px 16px;border-radius:99px;box-shadow:0 8px 24px rgba(0,0,0,.25);animation:xpg 2.1s ease both;pointer-events:none}
@keyframes xpg{0%{opacity:0;transform:translate(-50%,10px) scale(.8)}15%{opacity:1;transform:translate(-50%,0) scale(1.08)}30%{transform:translate(-50%,0) scale(1)}80%{opacity:1}100%{opacity:0;transform:translate(-50%,-14px)}}
/* Subiu de nível */
.xpm{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(8,10,28,.78);backdrop-filter:blur(6px);animation:xpf .3s both}
@keyframes xpf{from{opacity:0}to{opacity:1}}
.xpm-b{position:relative;width:100%;max-width:360px;text-align:center;background:var(--card);border:1px solid color-mix(in srgb,var(--rc) 55%,var(--bd));border-radius:24px;padding:24px 20px 20px;overflow:hidden;box-shadow:0 0 60px color-mix(in srgb,var(--rc) 40%,transparent);animation:xpb .55s cubic-bezier(.2,1.2,.3,1) both}
@keyframes xpb{from{opacity:0;transform:scale(.8) translateY(20px)}to{opacity:1;transform:none}}
.xpm-b>*{position:relative;z-index:1}
.xpm-rays{position:absolute!important;z-index:0!important;left:50%;top:150px;width:420px;height:420px;margin:-210px 0 0 -210px;background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--rc) 30%,transparent) 0 8deg,transparent 8deg 24deg);-webkit-mask:radial-gradient(circle,#000 8%,transparent 62%);mask:radial-gradient(circle,#000 8%,transparent 62%);animation:xpr 14s linear infinite}
@keyframes xpr{to{transform:rotate(360deg)}}
.xpm-ps{position:absolute!important;left:50%;top:150px;width:0;height:0;z-index:2!important;pointer-events:none}
.xpm-ps span{position:absolute;width:8px;height:8px;border-radius:2px;opacity:0;animation:xpp 1.5s var(--dl) ease-out both}
@keyframes xpp{0%{opacity:1;transform:translate(0,0) scale(.4) rotate(0)}100%{opacity:0;transform:translate(var(--x),var(--y)) scale(1) rotate(var(--r))}}
.xpm-k{font-size:28px;font-weight:900;letter-spacing:.06em;background:linear-gradient(90deg,var(--rd),var(--rl),var(--rc));-webkit-background-clip:text;background-clip:text;color:transparent;animation:xpt .6s .15s both}
.xpm-s{font-size:12px;font-weight:700;letter-spacing:.2em;color:var(--mu);margin-top:2px;animation:xpt .6s .3s both}
@keyframes xpt{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.xpm-ic{margin:16px 0 8px;line-height:0;animation:xpi .9s .35s cubic-bezier(.2,1.3,.3,1) both,xpgl 2.8s 1.3s ease-in-out infinite;filter:drop-shadow(0 8px 22px color-mix(in srgb,var(--rc) 60%,transparent))}
@keyframes xpi{0%{opacity:0;transform:scale(.15) rotate(-14deg)}60%{opacity:1;transform:scale(1.18) rotate(4deg)}100%{transform:none}}
@keyframes xpgl{0%,100%{filter:drop-shadow(0 8px 22px color-mix(in srgb,var(--rc) 55%,transparent))}50%{filter:drop-shadow(0 8px 34px color-mix(in srgb,var(--rc) 95%,transparent))}}
.xpm-n{font-size:15px;color:var(--mu);letter-spacing:.04em;animation:xpt .6s .8s both}.xpm-n b{display:block;font-size:30px;line-height:1.15;letter-spacing:.05em;color:var(--rc)}
.xpm-l{font-size:13px;color:var(--mu);margin-bottom:10px;animation:xpt .6s .9s both}
.xpm-x{font-size:14px;color:var(--mu);margin-bottom:6px}.xpm-x b{font-size:20px;color:var(--tx)}
.xpm-f{font-size:13px;color:var(--mu);margin:8px 0 16px}
@media(prefers-reduced-motion:reduce){.xpm *,.xpm,.xpg,.xi-sp{animation:none!important;transition:none!important}.xpm-ps{display:none}}