.xp-badge-shape{position:absolute;inset:0;z-index:0;pointer-events:none}.xp-badge-shape svg{display:block;width:100%;height:100%;font-variant-numeric:normal;font-feature-settings:normal}.xp-badge-shape-in{animation:xp-badge-in .5s ease}.xp-badge-shape-out{opacity:0;transition:opacity .5s ease}@keyframes xp-badge-in{0%{opacity:0}}.q3-gain-slot{position:relative;display:inline-block}.q3-gain-slot .q3-gain,.q3-gain-slot .q3-swaps{transition:opacity .45s ease,transform .45s ease}.q3-swaps{position:absolute;left:0;top:0;white-space:nowrap;display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:700;color:#c8a5ff;opacity:0;transform:translateY(7px)}.q3-swaps svg{width:13px;height:13px}.q3-gain-slot.swapped .q3-gain{opacity:0;transform:translateY(-7px)}.q3-gain-slot.swapped .q3-swaps{opacity:1;transform:none}@media(prefers-reduced-motion:reduce){.q3-gain-slot .q3-gain,.q3-gain-slot .q3-swaps{transition:none}}.meta-popup-shine{position:absolute;top:0;bottom:0;width:70px;left:-90px;background:linear-gradient(100deg,transparent 0%,rgba(255,255,255,.28) 50%,transparent 100%);transform:skew(-18deg)}@keyframes meta-popup-shine-sweep{0%{left:-90px}to{left:540px}}.xp-popup{display:flex;align-items:center;height:66px;max-width:76px;border-radius:33px;background:linear-gradient(180deg,#2e2f31,#1b1c1e 48%,#101112 52%,#1e1f21);border:1px solid rgba(255,255,255,.22);box-shadow:0 8px 30px #0009,inset 0 1px #ffffff40;overflow:hidden;position:relative;opacity:0;transform:translateY(80px);transition:transform .4s cubic-bezier(.2,.9,.3,1.15),opacity .35s ease,max-width .45s cubic-bezier(.6,0,.2,1)}.xp-popup.shown{opacity:1;transform:translateY(0)}.xp-popup.expanded{max-width:366px}.xp-popup.clickable{pointer-events:auto;cursor:pointer}.xp-popup.clickable:hover{border-color:#fff6}.xp-popup-chevron{flex:0 0 52px;width:52px;height:52px;margin:7px 6px 7px 9px;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 30%,#8ed1ff,#66c0f4 55%,#14425f);clip-path:polygon(50% 0%,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);box-shadow:0 0 14px #66c0f473}.xp-popup-chevron{transition:transform .18s cubic-bezier(.3,0,.2,1.6)}.xp-popup.levelled .xp-popup-chevron{transform:scale(1.22)}.xp-popup-text{padding:0 18px 0 8px;width:288px;text-align:left}.xp-popup-label{font-size:11px;letter-spacing:.04em;color:#b9c0b4;white-space:nowrap;margin-bottom:6px}.xp-popup-track{position:relative;height:9px;border-radius:5px;background:#ffffff1a;box-shadow:inset 0 1px 2px #00000080;overflow:hidden}.xp-popup-fill,.xp-popup-fill-gain{position:absolute;top:0;bottom:0;left:0;width:0;border-radius:0 5px 5px 0}.xp-popup-fill{z-index:1;background:linear-gradient(90deg,color-mix(in srgb,var(--xp-accent) 80%,#000),var(--xp-accent) 45%,var(--xp-accent-bright));transition:width var(--xp-bar-ms, .85s) cubic-bezier(.55,0,.2,1)}.xp-popup-fill-gain{background:linear-gradient(90deg,var(--xp-gain-deep, #e0a13a),var(--xp-gain, #ffd36b));transition:width var(--xp-bar-ms, .7s) cubic-bezier(.16,.84,.3,1),opacity .35s ease}.xp-popup-fill-gain:after{content:"";position:absolute;top:0;bottom:0;right:0;width:6px;border-radius:inherit;background:linear-gradient(90deg,transparent,var(--xp-gain-bright, #fff1c4))}.xp-popup-fill-gain.spent{opacity:0}.xp-popup-track.landed .xp-popup-fill{animation:xp-bar-land .7s ease-out}@keyframes xp-bar-land{0%{filter:brightness(1.9) saturate(.6)}to{filter:none}}.xp-popup-fill.instant,.xp-popup-fill-gain.instant{transition:none}.xp-popup-numbers{display:flex;justify-content:space-between;gap:10px;margin-top:5px;font-size:11.5px;font-variant-numeric:tabular-nums}.xp-popup-gain{color:var(--xp-gain, #ffd36b);font-weight:700}.xp-popup-gain b{font-weight:inherit}.xp-popup-progress{color:#9fb0c0}.xp-popup.expanded .meta-popup-shine{animation:meta-popup-shine-sweep .9s ease-out .35s 1 forwards}.q-popup{display:flex;align-items:center;height:98px;max-width:98px;border-radius:22px;overflow:hidden;position:relative;background:radial-gradient(120% 140% at 0% 0%,rgba(232,195,74,.14),transparent 55%),linear-gradient(180deg,#2c2d30,#1a1b1d 46%,#101112 52%,#1c1d1f);border:1px solid rgba(232,195,74,.32);box-shadow:0 12px 40px #000000a6,0 0 0 1px #00000080,inset 0 1px #ffe08c52;opacity:0;transform:translateY(80px);transition:transform .4s cubic-bezier(.2,.9,.3,1.15),opacity .35s ease,max-width .45s cubic-bezier(.6,0,.2,1)}.q-popup.shown{opacity:1;transform:translateY(0)}.q-popup.expanded{max-width:460px}.q-popup.clickable{pointer-events:auto;cursor:pointer}.q3-seal{position:relative;flex:0 0 72px;width:72px;height:72px;margin:0 4px 0 12px;display:flex;align-items:center;justify-content:center}.q3-hex{position:absolute;inset:0;width:100%;height:100%;transform:scale(.5) rotate(-35deg);opacity:0;transition:transform .5s cubic-bezier(.2,.9,.2,1.45),opacity .25s ease;filter:drop-shadow(0 0 12px rgba(232,195,74,.45))}.q-popup.stamped .q3-hex{transform:scale(1) rotate(0);opacity:1}.q3-check{position:relative;width:34px;height:34px;z-index:2}.q3-check path{fill:none;stroke:#3b2c05;stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:32;stroke-dashoffset:32}.q-popup.stamped .q3-check path{animation:q3-draw .5s cubic-bezier(.3,0,.2,1) .32s forwards}@keyframes q3-draw{to{stroke-dashoffset:0}}.q3-ring{position:absolute;inset:8px;border-radius:50%;border:2px solid rgba(232,195,74,.75);opacity:0;transform:scale(.6);pointer-events:none}.q-popup.stamped .q3-ring{animation:q3-ring .9s ease-out .18s forwards}.q-popup.stamped .q3-ring.r2{animation-delay:.36s;border-width:1px}@keyframes q3-ring{0%{opacity:.9;transform:scale(.6)}to{opacity:0;transform:scale(2.1)}}.q3-spark{position:absolute;left:50%;top:50%;width:5px;height:5px;margin:-2.5px;border-radius:50%;background:#ffe9a8;box-shadow:0 0 6px #e8c34a;opacity:0;pointer-events:none}.q-popup.stamped .q3-spark{animation:q3-spark .8s cubic-bezier(.1,.8,.3,1) .24s forwards}@keyframes q3-spark{0%{opacity:1;transform:rotate(var(--a)) translate(10px) scale(1)}to{opacity:0;transform:rotate(var(--a)) translate(46px) scale(.3)}}.q3-text{flex:1;min-width:0;padding:0 14px 0 6px;width:300px;text-align:left}.q3-label{display:flex;align-items:center;gap:8px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--rare-gold);white-space:nowrap;margin-bottom:4px}.q3-label:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(232,195,74,.5),transparent)}.q3-name{font-size:13.5px;font-weight:600;line-height:1.25;color:#eef3ea;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.q3-name i{font-style:normal;color:#ffe08a}.q3-name .q-link{border:0;color:inherit;pointer-events:none}.q3-track{position:relative;height:7px;border-radius:5px;margin-top:8px;background:#ffffff1a;box-shadow:inset 0 1px 2px #00000080;overflow:hidden}.q3-fill,.q3-gainbar{position:absolute;top:0;bottom:0;left:0;width:0;border-radius:0 5px 5px 0}.q3-fill{z-index:1;background:linear-gradient(90deg,color-mix(in srgb,var(--xp-accent) 80%,#000),var(--xp-accent) 45%,var(--xp-accent-bright));transition:width var(--xp-bar-ms, 1s) cubic-bezier(.55,0,.2,1)}.q3-fill-ready{transition:width 1s cubic-bezier(.25,.9,.3,1)}.q3-gainbar{background:linear-gradient(90deg,var(--xp-gain-deep, #e0a13a),var(--xp-gain, #ffd36b));transition:width var(--xp-bar-ms, .7s) cubic-bezier(.16,.84,.3,1),opacity .35s ease}.q3-gainbar:after{content:"";position:absolute;top:0;bottom:0;right:0;width:6px;border-radius:inherit;background:linear-gradient(90deg,transparent,var(--xp-gain-bright, #fff1c4))}.q3-gainbar.spent{opacity:0}.q3-track.landed .q3-fill{animation:xp-bar-land .7s ease-out}.q3-fill.instant,.q3-gainbar.instant{transition:none}.q3-numbers{display:flex;justify-content:space-between;gap:10px;margin-top:5px;font-size:11.5px;font-variant-numeric:tabular-nums}.q3-gain{color:var(--xp-gain, #ffd36b);font-weight:700}.q3-progress{color:#9fb0c0}.q3-cover{flex:none;width:46px;height:66px;margin-right:14px;border-radius:5px;overflow:hidden;box-shadow:0 6px 16px #0009,0 0 0 1px #ffffff1f;transform:rotate(4deg) translateY(2px);background:#1a1b1d}.q3-cover img{width:100%;height:100%;object-fit:cover;display:block}.q-popup .meta-popup-shine{background:linear-gradient(100deg,transparent 0%,rgba(255,230,160,.26) 50%,transparent 100%)}.q-popup.expanded .meta-popup-shine{animation:meta-popup-shine-sweep 1s ease-out .5s 1 forwards}.q-popup.legendary{background:radial-gradient(120% 140% at 0% 0%,rgba(160,110,255,.26),transparent 55%),linear-gradient(180deg,#2b2240,#1a1528 46%,#100c19 52%,#1b1628);border-color:#c8a5ff8c;box-shadow:0 12px 40px #000000a6,0 0 0 1px #00000080,0 0 44px #9664ff66,inset 0 1px #e1cdff59}.q-popup.legendary.expanded{max-width:520px}.q-popup.legendary .q3-hex{filter:drop-shadow(0 0 16px rgba(170,120,255,.7))}.q-popup.legendary .q3-check path{stroke:#2a1650}.q-popup.legendary .q3-ring{border-color:#c8a5ffd9}.q-popup.legendary .q3-spark{background:#efe6ff;box-shadow:0 0 6px #b48cff}.q-popup.legendary .q3-label{color:#d2b8ff}.q-popup.legendary .q3-label:after{background:linear-gradient(90deg,rgba(200,165,255,.6),transparent)}.q-popup.legendary .q3-name i{color:#e6d8ff}.q-popup.legendary .q3-gain{color:#e6d8ff;text-shadow:0 0 10px rgba(170,120,255,.8)}.q-popup.legendary .meta-popup-shine{background:linear-gradient(100deg,transparent 0%,rgba(225,205,255,.3) 50%,transparent 100%)}.q-popup.legendary{height:112px}.q-popup.legendary.expanded{max-width:540px}.q3-rim{position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;padding:1.5px;overflow:hidden;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.q3-rim:before{content:"";position:absolute;left:50%;top:50%;width:1400px;height:1400px;margin:-700px 0 0 -700px;background:conic-gradient(from 0deg,transparent 0 64%,rgba(235,225,255,.95) 74%,transparent 82%);animation:q-engram-rim 2.6s linear infinite}.q3-rays{position:absolute;left:50%;top:50%;width:260px;height:260px;margin:-130px 0 0 -130px;opacity:0;z-index:0;background:repeating-conic-gradient(from 0deg,rgba(225,205,255,.55) 0 3deg,transparent 3deg 18deg);-webkit-mask:radial-gradient(circle,#000 0%,transparent 45%);mask:radial-gradient(circle,#000 0%,transparent 45%)}.q-popup.legendary.stamped .q3-rays{animation:q3-rays 2.4s ease-out both}@keyframes q3-rays{0%{opacity:0;transform:rotate(0) scale(.2)}25%{opacity:.9}to{opacity:0;transform:rotate(50deg) scale(1.1)}}.q-popup.legendary .q3-track{height:10px;overflow:visible;position:relative}.q-popup.legendary .q3-fill,.q-popup.legendary .q3-gainbar{border-radius:5px}.q-popup.legendary .q3-fill{background:linear-gradient(90deg,#6a3fd6,#9a6cf5 55%,#c9a8ff);box-shadow:0 0 12px #aa78ffcc}.q-popup.legendary .q3-gainbar{background:linear-gradient(90deg,#b48cff,#e6d8ff 60%,#fff);box-shadow:0 0 14px #d7beffe6;transition:width var(--xp-bar-ms, 2.3s) cubic-bezier(.65,0,.35,1),opacity .35s ease}.q-popup.legendary .q3-gainbar.quick{transition-timing-function:cubic-bezier(.16,.84,.3,1),ease}.q-popup.legendary .q3-gainbar.instant{transition:none}.q-popup.legendary .q3-gainbar:after{content:"";position:absolute;inset:50% -7px auto auto;width:16px;height:16px;margin-top:-8px;border-radius:50%;opacity:0;background:radial-gradient(circle,#fff 0 30%,rgba(220,200,255,.9) 50%,transparent 72%);box-shadow:0 0 14px #d2b8ff,0 0 30px #8a5cff;transition:opacity .3s}.q-popup.legendary.charging .q3-gainbar:after{opacity:1}.q3-gainbar .sp{position:absolute;right:0;top:50%;width:4px;height:4px;margin:-2px -2px 0 0;border-radius:50%;opacity:0;background:#efe6ff;box-shadow:0 0 6px #b48cff}.q-popup.legendary.charging .q3-gainbar .sp{animation:q3-spray .55s linear infinite;animation-delay:calc(var(--k, 0) * -80ms)}@keyframes q3-spray{0%{opacity:1;transform:translate(0) scale(1)}to{opacity:0;transform:translate(calc(var(--dx, -10) * 1px),calc(var(--dy, 0) * 1px)) scale(.3)}}.q-popup.legendary.charging .q3-gain{animation:q3-gain-charge .16s ease-in-out infinite alternate}@keyframes q3-gain-charge{0%{transform:translate(0) scale(1)}to{transform:translate(.6px,-.6px) scale(1.06)}}.q-popup.legendary.charging{animation:q3-rumble .09s linear infinite}@keyframes q3-rumble{0%{transform:translate(0)}33%{transform:translate(.7px,-.5px)}66%{transform:translate(-.6px,.6px)}to{transform:translate(0)}}.q3-flash{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;border-radius:inherit;background:radial-gradient(120% 160% at 45% 70%,rgba(255,255,255,.95) 0%,rgba(225,205,255,.6) 30%,transparent 65%)}.q-popup.legendary.charged .q3-flash{animation:q3-flash .8s ease-out both}@keyframes q3-flash{0%{opacity:0}12%{opacity:1}to{opacity:0}}.q3-bar-ring{position:absolute;right:-8px;top:50%;width:22px;height:22px;margin-top:-11px;border-radius:50%;opacity:0;pointer-events:none;border:2px solid rgba(235,225,255,.95);box-shadow:0 0 16px #aa78ffe6}.q-popup.legendary.charged .q3-bar-ring{animation:q3-bar-ring .9s cubic-bezier(.1,.7,.3,1) both}@keyframes q3-bar-ring{0%{opacity:1;transform:scale(.4)}to{opacity:0;transform:scale(6)}}.q-popup.legendary.charged .q3-gain{display:inline-block;animation:q3-gain-pop .7s cubic-bezier(.2,.9,.3,1.4) both}@keyframes q3-gain-pop{0%{transform:scale(1)}30%{transform:scale(1.75);text-shadow:0 0 22px #fff,0 0 40px #b48cff}to{transform:scale(1.15)}}.q-popup.legendary.charged .q3-fill{box-shadow:0 0 18px #c8aaff,0 0 36px #9664ffb3}.q-popup.legendary .q3-track.landed .q3-fill{animation:q3-bar-land .8s ease-out}@keyframes q3-bar-land{0%{filter:brightness(2.4) saturate(.3)}to{filter:none}}.q-popup.legendary.levelup .q3-label{animation:q3-label-pop .6s cubic-bezier(.2,.9,.3,1.4) both}.q-popup.exotic{background:radial-gradient(120% 140% at 0% 0%,rgba(242,193,78,.28),transparent 55%),linear-gradient(180deg,#3a2c10,#221a08 46%,#140f04 52%,#241b08);border-color:#ffe08a99;box-shadow:0 12px 40px #000000a6,0 0 0 1px #00000080,0 0 44px #e8b43c73,inset 0 1px #fff0c866}.q-popup.exotic .q3-hex{filter:drop-shadow(0 0 16px rgba(242,193,78,.75))}.q-popup.exotic .q3-check path{stroke:#4a3005}.q-popup.exotic .q3-ring{border-color:#ffe08ae6}.q-popup.exotic .q3-spark{background:#fff8e1;box-shadow:0 0 6px #f2c14e}.q-popup.exotic .q3-label{color:#ffe08a}.q-popup.exotic .q3-label:after{background:linear-gradient(90deg,rgba(255,224,138,.6),transparent)}.q-popup.exotic .q3-name i{color:#fff0c2}.q-popup.exotic .q3-gain{color:#fff0c2;text-shadow:0 0 10px rgba(242,193,78,.85)}.q-popup.exotic .q3-rim:before{background:conic-gradient(from 0deg,transparent 0 64%,rgba(255,244,210,.95) 74%,transparent 82%)}.q-popup.exotic .q3-rays{background:repeating-conic-gradient(from 0deg,rgba(255,236,190,.55) 0 3deg,transparent 3deg 18deg)}.q-popup.exotic .q3-fill{background:linear-gradient(90deg,#8a5d0a,#d9a22e 55%,#f2c14e);box-shadow:0 0 12px #e8b43ccc}.q-popup.exotic .q3-gainbar{background:linear-gradient(90deg,#f2c14e,#fff0c2 60%,#fff);box-shadow:0 0 14px #ffecbee6}.q-popup.exotic .q3-gainbar:after{background:radial-gradient(circle,#fff 0 30%,rgba(255,236,190,.9) 50%,transparent 72%);box-shadow:0 0 14px #ffe08a,0 0 30px #e8a93a}.q-popup.exotic .q3-gainbar .sp{background:#fff8e1;box-shadow:0 0 6px #f2c14e}.q-popup.exotic.charged .q3-fill{box-shadow:0 0 18px #ffe6a0,0 0 36px #e8b43cb3}.q-popup.exotic .meta-popup-shine{background:linear-gradient(100deg,transparent 0%,rgba(255,240,200,.3) 50%,transparent 100%)}@keyframes q3-label-pop{0%{transform:scale(1)}40%{transform:scale(1.12);color:#fff}to{transform:scale(1)}}.q3-fill.q3-fill-ready{background:linear-gradient(90deg,#c99a2e,#ffe08a);box-shadow:0 0 10px #e8c34a8c}.s-popup{display:flex;align-items:center;height:86px;max-width:70px;border-radius:20px;background:linear-gradient(180deg,#2e2f31,#1b1c1e 48%,#101112 52%,#1e1f21);border:1px solid rgba(255,255,255,.22);box-shadow:0 8px 30px #0009,inset 0 1px #ffffff40;overflow:hidden;position:relative;opacity:0;transform:translateY(80px);transition:transform .4s cubic-bezier(.2,.9,.3,1.15),opacity .35s ease,max-width .45s cubic-bezier(.6,0,.2,1)}.s-popup.shown{opacity:1;transform:translateY(0)}.s-popup.expanded{max-width:430px}.s-popup.clickable{pointer-events:auto;cursor:pointer}.s-popup.clickable:hover{border-color:#fff6}.s-cover{flex:0 0 50px;width:50px;height:70px;margin:7px 8px 7px 9px;border-radius:6px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#141517;box-shadow:0 4px 12px #0000008c,0 0 0 1px #ffffff1f}.s-cover img{display:block;width:100%;height:100%;object-fit:cover}.s-cover img.s-orb{width:32px;height:32px;object-fit:contain}.s-text{width:330px;padding:0 18px 0 4px;text-align:left}.s-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.s-label{font-size:11px;letter-spacing:.04em;color:#b9c0b4;white-space:nowrap}.s-gain{font-size:13px;font-weight:700;color:#9be51a;white-space:nowrap;font-variant-numeric:tabular-nums}.s-name{margin-top:1px;font-size:14px;font-weight:700;color:#eef3ea;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.s-track{position:relative;height:8px;margin-top:6px;border-radius:4px;background:#ffffff1a;box-shadow:inset 0 1px 2px #00000080;overflow:hidden}.s-fill-was,.s-fill-add{position:absolute;top:0;bottom:0;left:0}.s-fill-was{border-radius:4px 0 0 4px;background:linear-gradient(90deg,#3f7410,#5f9f18)}.s-fill-add{width:0;border-radius:0 4px 4px 0;background:linear-gradient(90deg,#9be51a,#d6ff86);box-shadow:0 0 10px #9be51a99;transition:width 1.1s cubic-bezier(.25,.9,.3,1)}.s-numbers{display:flex;justify-content:space-between;gap:10px;margin-top:5px;font-size:11.5px;color:#9fb0c0;white-space:nowrap;font-variant-numeric:tabular-nums}.s-numbers b{color:#eef3ea;font-weight:700}.s-popup.no-hltb .s-numbers{margin-top:7px}.s-popup.expanded .meta-popup-shine{animation:meta-popup-shine-sweep .9s ease-out .35s 1 forwards}
