.pip-exp-ribbon{z-index:30;color:#dacde2;background:#211a2b;border-bottom:1px solid #e7c89919;justify-content:center;height:32px;min-height:32px;font-size:11px;line-height:1.4;display:flex;position:relative}.pip-exp-ribbon>button{color:inherit;font:inherit;cursor:pointer;background:0 0;border:0;align-items:center;gap:9px;max-width:100%;padding:4px 14px;display:flex;position:relative}.pip-exp-emblem{opacity:.78;flex-shrink:0;place-items:center;width:22px;height:22px;transition:filter .25s,opacity .25s;display:grid}.pip-exp-level{color:#d8bd85;white-space:nowrap;font-variant-numeric:tabular-nums;font-size:11px;font-weight:600}.pip-exp-numbers{color:#ad9fb9;font-variant-numeric:tabular-nums;white-space:nowrap;text-overflow:ellipsis;max-width:42vw;font-size:10px;overflow:hidden}.pip-exp-track{background:#382d45;border:1px solid #76618440;border-radius:9px;flex-shrink:0;width:125px;height:6px;display:block;position:relative;overflow:hidden}.pip-exp-fill{background:linear-gradient(90deg,#b78c42,#e4bb63);border-radius:9px;transition:width .48s cubic-bezier(.2,.7,.3,1),filter .3s;position:absolute;inset:0 auto 0 0;box-shadow:inset 0 0 2px #ffefb035}.pip-exp-fill i,.pip-exp-burst i{clip-path:polygon(50% 0,62% 37%,100% 50%,63% 62%,50% 100%,37% 63%,0 50%,37% 37%);background:#fff0ae;width:4px;height:4px;display:block;position:absolute}.pip-exp-fill i{opacity:.22;top:0;left:28%}.pip-exp-fill i:nth-child(2){width:3px;height:3px;top:1px;left:62%}.pip-exp-fill i:nth-child(3){opacity:.3;left:86%}.pip-exp-ribbon[data-phase=gain] .pip-exp-emblem,.pip-exp-ribbon[data-phase=full] .pip-exp-emblem,.pip-exp-ribbon[data-phase=level] .pip-exp-emblem{opacity:1;filter:drop-shadow(0 0 4px #ffcf7360)}.pip-exp-ribbon[data-phase=gain] .pip-exp-track,.pip-exp-ribbon[data-phase=full] .pip-exp-track{animation:.55s ease-out xp-arrival}.pip-exp-ribbon[data-phase=full] .pip-exp-fill{filter:brightness(1.3)}.pip-exp-ribbon[data-phase=level] .pip-exp-fill{transition:none}.pip-exp-ribbon[data-phase=level] .pip-exp-emblem{animation:.32s ease-out xp-level-star}.pip-exp-ribbon[data-phase=level] .pip-exp-level{animation:.32s ease-out xp-level-number}.pip-exp-burst{pointer-events:none;position:absolute;top:16px;left:25px}.pip-exp-burst i{opacity:0;--x:-15px;--y:-10px;width:5px;height:5px}.pip-exp-burst i:nth-child(2){--x:12px;--y:-12px}.pip-exp-burst i:nth-child(3){--x:16px;--y:8px}.pip-exp-ribbon[data-phase=level] .pip-exp-burst i{animation:.32s ease-out both xp-burst}.pip-exp-ribbon>#pip-exp-details{background:#2c2336;border:1px solid #bfa3cf66;border-radius:0 0 16px 16px;width:min(340px,100vw - 24px);padding:18px;font-size:13px;position:absolute;top:100%;box-shadow:0 14px 35px #0005}.pip-exp-ribbon p{margin:8px 0;line-height:1.55}.pip-exp-ribbon small{color:#d2bfde}.pip-exp-ribbon button:focus-visible{outline-offset:-2px;outline:2px solid #f6d395}.pip-exp-announcement{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}.pip-exp-receipt{z-index:10000;pointer-events:none;color:#ffe5a4;text-shadow:0 1px 4px #241630,0 0 6px #241630;align-items:center;gap:5px;font-family:inherit;font-weight:600;display:flex;position:fixed;transform:translate(-11px,-11px)}.pip-exp-receipt b{white-space:nowrap;font-size:12px;transition:opacity .15s}.pip-exp-traveler{will-change:transform;width:22px;height:22px;display:block}.pip-exp-receipt[data-flying=true] b{opacity:0}.pip-exp-receipt[data-flying=true] .pip-exp-traveler{transform:translate(var(--xp-dx),var(--xp-dy)) scale(.75);transition:transform .48s cubic-bezier(.45,.05,.25,1)}@keyframes xp-arrival{35%{box-shadow:0 0 6px #efc87460}to{box-shadow:none}}@keyframes xp-level-star{50%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes xp-level-number{0%{opacity:.3;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}@keyframes xp-burst{15%{opacity:.7}to{opacity:0;transform:translate(var(--x),var(--y)) scale(.4)}}@media (max-width:420px){.pip-exp-track{width:80px}.pip-exp-ribbon>button{gap:6px;padding-inline:8px}.pip-exp-level{font-size:10px}}@media (prefers-reduced-motion:reduce){.pip-exp-ribbon *{transition:none!important;animation:none!important}.pip-exp-receipt{display:none}.pip-exp-ribbon[data-phase=gain] .pip-exp-track{outline:1px solid #d7b67477}}.pip-exp-track>progress{opacity:0;width:100%;height:100%;position:absolute;inset:0}.pip-exp-ribbon{background:#2d2238;height:auto;min-height:88px;padding:6px 16px 10px}.pip-exp-ribbon>button{text-align:left;grid-template-rows:60px auto;grid-template-columns:42px minmax(0,1fr) 60px;gap:0 8px;width:min(480px,100%);padding:0;display:grid}.pip-exp-star{opacity:1;width:42px;height:42px;display:block;position:relative}.pip-exp-star img{object-fit:contain;width:100%;height:100%;display:block}.pip-exp-star-number{fill:#482845;filter:drop-shadow(0 1px #fff3ad);width:100%;height:100%;font-family:inherit;font-weight:900;position:absolute;inset:0;overflow:visible}.pip-exp-next{width:60px;height:60px}.pip-exp-next img{opacity:var(--xp-warmth);filter:drop-shadow(0 0 var(--xp-glow) #ffd37880);transition:filter .48s,opacity .48s}.pip-exp-track{background:#1d1426;border:1px solid #b79ec566;border-radius:20px;width:100%;height:25px;box-shadow:inset 0 2px 5px #0004}.pip-exp-fill{background:linear-gradient(90deg,#b988dc,#e9a6d7,#ffd78b);border-radius:20px}.pip-exp-numbers{color:#eadff0;text-align:left;grid-area:2/1/auto/-1;justify-self:start;min-width:0;max-width:48%;font-size:11px}.pip-exp-ribbon .pip-exp-remaining{text-overflow:ellipsis;color:#cbbbd6;font-variant-numeric:tabular-nums;white-space:nowrap;pointer-events:none;grid-area:2/1/auto/-1;justify-self:end;width:max-content;max-width:48%;font-size:11px;line-height:1.4;overflow:hidden}.pip-exp-burst{top:30px;left:auto;right:30px}.pip-exp-ribbon[data-phase=full] .pip-exp-track{box-shadow:0 0 18px #ffde85a0}@media (max-width:480px){.pip-exp-ribbon{padding-inline:12px}.pip-exp-ribbon>button{grid-template-rows:52px auto auto;grid-template-columns:36px minmax(0,1fr) 52px;gap:1px 5px}.pip-exp-current{width:36px;height:36px}.pip-exp-next{width:52px;height:52px}.pip-exp-numbers,.pip-exp-ribbon .pip-exp-remaining{text-align:center;text-overflow:ellipsis;grid-column:1/-1;justify-self:center;max-width:100%;overflow:hidden}.pip-exp-numbers{grid-row:2}.pip-exp-ribbon .pip-exp-remaining{grid-row:3}.pip-exp-track{height:24px}}
