@layer components{.reward-layer{pointer-events:none;width:100vw;max-width:none;height:100dvh;max-height:none;color:inherit;z-index:90;background:0 0;border:0;margin:0;padding:0;position:fixed;inset:0;overflow:visible}.xp-float{will-change:transform, opacity;animation:1.4s cubic-bezier(.2,.8,.2,1) forwards xp-rise;position:absolute;transform:translate(-50%,-100%)}.xp-float-pill{color:#78350f;white-space:nowrap;font-variant-numeric:tabular-nums;background:linear-gradient(135deg,#fef3c7,#fbbf24 55%,#f59e0b);border:1px solid #ffffffbf;border-radius:999px;align-items:center;gap:4px;padding:3px 10px 3px 8px;font-size:13px;font-weight:800;line-height:1.4;display:inline-flex;position:relative;box-shadow:0 8px 20px -6px #f59e0b99,inset 0 1px #ffffffb3}.xp-float-sparks{position:absolute;top:50%;left:50%}.xp-float-sparks i{opacity:0;background:#f59e0b;border-radius:999px;width:5px;height:5px;margin:-2.5px;animation:.7s ease-out forwards xp-spark;position:absolute}.xp-float-sparks i:first-child{--spark:-26px, -14px}.xp-float-sparks i:nth-child(2){--spark:26px, -16px;background:#8b1e22}.xp-float-sparks i:nth-child(3){--spark:-18px, 14px;background:#fbbf24}.xp-float-sparks i:nth-child(4){--spark:20px, 12px;background:#fcd34d}.xp-bump{animation:.5s cubic-bezier(.2,1.6,.4,1) xp-bump}.levelup-dialog{background:0 0;border:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:16px;position:fixed;inset:0;overflow:hidden auto}.levelup-dialog[open]{place-items:center;display:grid}.levelup-dialog::backdrop{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:radial-gradient(circle at 50% 40%,#0b25458c,#020617cc);animation:.3s ease-out levelup-fade}.levelup-confetti{pointer-events:none;position:fixed;inset:0;overflow:hidden}.levelup-confetti i{opacity:0;width:8px;height:14px;animation-name:confetti-fall;animation-timing-function:cubic-bezier(.25,.6,.5,1);animation-fill-mode:forwards;position:absolute;top:-16px}.levelup-card{text-align:center;background:linear-gradient(#fff 40%,#fff8ef);border-radius:28px;width:min(420px,100%);margin-top:72px;padding:92px 24px 24px;animation:.6s cubic-bezier(.2,1.4,.4,1) both levelup-pop;position:relative;box-shadow:0 30px 80px -20px #02061799,inset 0 0 0 1px #ffffffb3}.levelup-badge-wrap{place-items:center;width:150px;height:150px;display:grid;position:absolute;top:0;left:50%;transform:translate(-50%,-50%)}.levelup-rays{background:repeating-conic-gradient(from 0deg, color-mix(in srgb, var(--tier) 55%, transparent) 0deg 9deg, transparent 9deg 24deg);border-radius:50%;animation:16s linear infinite levelup-spin;position:absolute;inset:-70px;-webkit-mask:radial-gradient(circle,#000 22%,#0000 68%);mask:radial-gradient(circle,#000 22%,#0000 68%)}.levelup-badge{background:conic-gradient(from 210deg, color-mix(in srgb, var(--tier) 65%, white), var(--tier), color-mix(in srgb, var(--tier) 60%, black), var(--tier), color-mix(in srgb, var(--tier) 65%, white));width:132px;height:132px;box-shadow:0 18px 40px -10px color-mix(in srgb, var(--tier) 75%, transparent), 0 0 0 6px #fff, 0 0 0 9px color-mix(in srgb, var(--tier) 30%, transparent);border-radius:50%;place-items:center;animation:.9s cubic-bezier(.2,1.5,.35,1) .15s both levelup-badge-in;display:grid;position:relative;overflow:hidden}.levelup-badge-inner{color:#fff;background:radial-gradient(circle at 35% 30%, color-mix(in srgb, var(--tier) 55%, white), var(--tier) 60%, color-mix(in srgb, var(--tier) 70%, black));filter:drop-shadow(0 2px 2px #00000040);border-radius:50%;place-items:center;width:100px;height:100px;display:grid;box-shadow:inset 0 2px 6px #ffffff73,inset 0 -6px 12px #00000040}.levelup-badge-shine{background:linear-gradient(115deg,#0000 35%,#ffffffa6 50%,#0000 65%);animation:2.8s ease-in-out 1.1s infinite levelup-shine;position:absolute;inset:0;transform:translate(-120%)}.levelup-ribbon{background:var(--navy);color:#fff;letter-spacing:.08em;border:2px solid #fff;border-radius:999px;padding:2px 12px;font-size:12px;font-weight:800;position:absolute;bottom:0;left:50%;transform:translate(-50%);box-shadow:0 4px 10px #02061740}.levelup-eyebrow{background:var(--brand-soft);color:var(--brand);letter-spacing:.14em;text-transform:uppercase;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:800;display:inline-block}.levelup-title{color:var(--ink);letter-spacing:-.02em;margin-top:10px;font-size:26px;font-weight:900;line-height:1.15}.levelup-text{color:var(--text);margin-top:6px;font-size:16px}.levelup-text strong{color:var(--brand)}.levelup-meta{color:#64748b;font-variant-numeric:tabular-nums;margin-top:2px;font-size:13px}.levelup-unlocks{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:18px 0 0;display:grid}.levelup-unlocks>div{background:#fff;border:1px solid #f1f5f9;border-radius:14px;flex-direction:column-reverse;padding:10px 6px;animation:.5s ease-out both levelup-rise;display:flex}.levelup-unlocks>div:nth-child(2){animation-delay:80ms}.levelup-unlocks>div:nth-child(3){animation-delay:.16s}.levelup-unlocks dd{color:var(--navy);font-variant-numeric:tabular-nums;margin:0;font-size:20px;font-weight:900}.levelup-unlocks dt{color:#64748b;font-size:11px;font-weight:600}.levelup-actions{flex-wrap:wrap;justify-content:center;gap:8px;margin-top:20px;display:flex}.levelup-actions>*{flex:140px}@media (prefers-reduced-motion:reduce){.xp-float{transform:translate(-50%,-130%);animation-name:none!important}.xp-float-sparks,.levelup-confetti,.levelup-rays,.levelup-badge-shine{display:none}}}@keyframes xp-rise{0%{opacity:0;transform:translate(-50%,-60%)scale(.6)}15%{opacity:1;transform:translate(-50%,-125%)scale(1.12)}30%{transform:translate(-50%,-145%)scale(1)}75%{opacity:1}to{opacity:0;transform:translate(-50%,-270%)scale(.95)}}@keyframes xp-spark{0%{opacity:1;transform:translate(0)scale(1)}to{opacity:0;transform:translate(var(--spark)) scale(.4)}}@keyframes xp-bump{0%{transform:scale(1)}40%{transform:scale(1.18);box-shadow:0 0 0 4px #fbbf2459}to{transform:scale(1)}}@keyframes levelup-fade{0%{opacity:0}}@keyframes levelup-pop{0%{opacity:0;transform:translateY(24px)scale(.9)}}@keyframes levelup-badge-in{0%{opacity:0;transform:scale(.3)rotate(-25deg)}to{opacity:1;transform:scale(1)rotate(0)}}@keyframes levelup-rise{0%{opacity:0;transform:translateY(8px)}}@keyframes levelup-spin{to{transform:rotate(360deg)}}@keyframes levelup-shine{0%,60%{transform:translate(-120%)}to{transform:translate(120%)}}@keyframes confetti-fall{0%{opacity:1;transform:translateY(-20px)rotate(0)}85%{opacity:1}to{opacity:0;transform:translate3d(var(--drift), 105vh, 0) rotate(calc(var(--spin) + 540deg))}}
