.xp{background:var(--bg);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:20px;margin:0;overflow:hidden}.xp-stage{isolation:isolate;aspect-ratio:4/5;max-height:62vh;display:grid;position:relative;overflow:hidden}.xp-poster{color:#fff;font:inherit;cursor:pointer;background:0 0;border:0;align-content:center;place-items:center;gap:10px;display:grid}.xp-poster strong{text-shadow:0 2px #00000040;font-size:22px}.xp-poster-mascot{width:42%}.xp-play{color:#0a1633;background:#fff;border-radius:999px;align-items:center;gap:8px;padding:10px 18px;font-weight:700;animation:1.6s ease-in-out infinite xp-pulse;display:inline-flex;box-shadow:0 4px #00000040}@keyframes xp-pulse{50%{transform:scale(1.06)}}.xp-scene{align-content:center;place-items:center;gap:16px;padding:18px 18px 96px;animation:.4s cubic-bezier(.2,.9,.3,1.2) both xp-in;display:grid}@keyframes xp-in{0%{opacity:0;filter:blur(6px);transform:scale(1.25)rotate(-2deg)}}.xp-step{place-items:center;gap:14px;animation:.35s both xp-in;display:grid}.xp-host{width:64px;position:absolute;bottom:54px;left:10px}.xp-host.is-talking{animation:.5s ease-in-out infinite xp-talk}@keyframes xp-talk{50%{transform:translateY(-3px)rotate(-3deg)}}.xp-caption{color:#fff;text-align:center;text-shadow:0 2px #0000008c,0 0 12px #00000080;flex-wrap:wrap;place-content:center;gap:0 .28em;min-height:64px;margin:0;font-size:19px;font-weight:800;line-height:1.2;display:flex;position:absolute;bottom:12px;left:78px;right:10px}.xp-caption span{animation:xp-word .28s cubic-bezier(.2, 1.6, .4, 1) var(--d) both;display:inline-block}.xp-caption .is-hot{color:#fc3;transform-origin:50% 80%;animation-name:xp-word-hot}@keyframes xp-word{0%{opacity:0;transform:translateY(14px)scale(.6)}}@keyframes xp-word-hot{0%{opacity:0;transform:translateY(10px)scale(.4)rotate(-6deg)}60%{transform:scale(1.25)rotate(3deg)}}.xp-bar{background:#0000004d;align-items:center;gap:6px;padding:8px 10px;display:flex}.xp-bar button{color:#fff;cursor:pointer;background:#ffffff26;border:0;border-radius:50%;width:36px;height:36px;font-size:14px}.xp-progress{flex:1;gap:4px;display:flex}.xp-progress span{background:#ffffff40;border-radius:3px;flex:1;height:5px;position:relative;overflow:hidden}.xp-progress span:after{content:"";transform-origin:0;background:#fff;position:absolute;inset:0;transform:scaleX(0)}.xp-progress .is-done:after{transform:scaleX(1)}.xp-progress .is-on:after{animation:xp-fill var(--ms) linear forwards}.xp-progress .is-paused:after{animation-play-state:paused}@keyframes xp-fill{to{transform:scaleX(1)}}.xp-dice{align-items:center;gap:14px;display:flex}.xp-die{background:var(--face);width:74px;height:74px;animation:xp-roll .7s cubic-bezier(.3, 1.4, .5, 1) var(--delay) both;border-radius:18px;grid-template-columns:repeat(3,1fr);gap:5px;padding:11px;display:grid;box-shadow:inset 0 -5px #0000002e,0 6px #00000040}.xp-die i{border-radius:50%}.xp-die i.is-pip{background:var(--pip)}@keyframes xp-roll{0%{transform:translateY(-70px)rotate(-260deg)scale(.6)}70%{transform:translateY(6px)rotate(12deg)}}.xp-sum{color:#fff;text-shadow:0 3px #00000040;font-size:34px;font-weight:800;animation:.4s cubic-bezier(.3,1.6,.5,1) .6s both xp-pop}.xp-badge{color:#fff;animation:xp-pop .45s var(--delay) cubic-bezier(.3, 1.6, .5, 1) both;border-radius:999px;align-items:center;gap:8px;padding:10px 18px;font-size:20px;font-weight:800;display:inline-flex;box-shadow:0 5px #00000040}.xp-badge.is-give{background:#0f9d58}.xp-badge.is-drink{background:#e8362d}.xp-badge.is-gold{color:#3b2314;background:linear-gradient(135deg,#fc3,#f29100)}@keyframes xp-pop{0%{transform:scale(0)}}.xp-note{color:#fff;text-align:center;max-width:260px;font-size:15px;animation:.4s .9s both xp-pop}.xp-table{width:210px;height:190px;position:relative}.xp-table-top{background:#0000002e;border-radius:50%;position:absolute;inset:48px 58px;box-shadow:inset 0 0 0 4px #fff3}.xp-seat{color:#fff;background:#fff3;border-radius:50%;place-items:center;width:54px;height:54px;transition:transform .3s,background .3s;display:grid;position:absolute}.xp-seat.is-top{top:0;left:78px}.xp-seat.is-left{top:68px;left:0}.xp-seat.is-right{top:68px;right:0}.xp-seat.is-me{background:#ffffff52;bottom:0;left:78px}.xp-seat small{font-size:12px;font-weight:700;position:absolute;bottom:-18px}.xp-seat.is-on{background:#e8362d;animation:.8s ease-in-out infinite alternate xp-glow;transform:scale(1.18)}@keyframes xp-glow{to{box-shadow:0 0 0 8px #e8362d59}}.xp-seat b{white-space:nowrap;font-size:14px;position:absolute;top:-26px}.xp-seat em{font-size:20px;font-style:normal;animation:.4s both xp-pop;position:absolute;bottom:-4px;right:-6px}@media (prefers-reduced-motion:reduce){.xp *,.xp{animation-duration:.01ms!important}}.xp-big-mascot{width:46%}.xp-shout{z-index:2;color:#fc3;letter-spacing:.02em;text-transform:uppercase;-webkit-text-stroke:4px #3b2314;paint-order:stroke fill;text-shadow:0 6px #3b2314;animation:xp-slam .5s cubic-bezier(.2, 1.5, .4, 1) var(--delay) both;font-size:54px;font-weight:900;position:relative}@keyframes xp-slam{0%{opacity:0;transform:scale(3)rotate(-8deg)}55%{opacity:1;transform:scale(.92)rotate(2deg)}}:is(.xp-scene:has(.xp-shout),.xp-scene:has(.xp-forbid)){animation:xp-in .4s cubic-bezier(.2, .9, .3, 1.2) both, xp-shake .45s linear var(--shake,.5s) both}.xp-step:has(.xp-shout){animation:.3s both xp-in,.45s linear .25s both xp-shake}@keyframes xp-shake{10%,50%,90%{translate:-6px 3px}30%,70%{translate:6px -3px}to{translate:0}}.xp-confetti{pointer-events:none;position:absolute;top:38%;left:50%}.xp-confetti i{background:var(--c);opacity:0;width:9px;height:14px;animation:xp-confetto 1.6s cubic-bezier(.1, .8, .3, 1) var(--delay) both;border-radius:2px;position:absolute}@keyframes xp-confetto{0%{opacity:1;transform:translate(0)rotate(0)scale(.4)}60%{opacity:1}to{opacity:0;transform:translate(var(--x), calc(var(--y) + 140px)) rotate(calc(var(--r) + 540deg)) scale(1)}}.xp-forbid{animation:xp-pop .4s cubic-bezier(.2, 1.5, .4, 1) var(--delay) both;justify-items:center;gap:8px;display:grid}.xp-forbid-card{color:#0a1633;background:#fff;border-radius:22px;place-items:center;min-width:150px;padding:18px 22px;font-size:34px;font-weight:900;display:grid;position:relative;box-shadow:0 6px #0000004d}.xp-forbid-card:after{content:"";animation:xp-ban .35s cubic-bezier(.2, 1.6, .4, 1) calc(var(--delay) + .45s) both;background:linear-gradient(to top right,#0000 calc(50% - 4px),#e8362d calc(50% - 4px) calc(50% + 4px),#0000 calc(50% + 4px));border:8px solid #e8362d;border-radius:50%;position:absolute;inset:-10px}@keyframes xp-ban{0%{opacity:0;transform:scale(2.2)}}.xp-forbid small{color:#fff;font-size:15px;font-weight:700}.xp-end{text-align:center;justify-items:center;gap:8px;display:grid}.xp-end-mascot{width:150px;animation:.5s cubic-bezier(.2,1.5,.4,1) both xp-pop}.xp-end-name{color:#fc3;-webkit-text-stroke:4px #3b2314;paint-order:stroke fill;text-shadow:0 5px #3b2314;font-size:46px;font-weight:900;animation:.5s cubic-bezier(.2,1.5,.4,1) .3s both xp-slam}.xp-end-tag{color:#fff;font-size:22px;font-weight:800;animation:.4s .55s both xp-word}.xp-end-games{gap:6px;margin:6px 0;display:flex}.xp-end-games i{color:#fff;width:38px;height:38px;animation:xp-pop .35s cubic-bezier(.2, 1.6, .4, 1) var(--delay) both;background:#ffffff24;border-radius:14px;place-items:center;display:grid}.xp-end-site{color:#0a1633;background:#fff;border-radius:999px;padding:8px 18px;font-size:18px;font-weight:800;animation:.4s cubic-bezier(.2,1.5,.4,1) 1.3s both xp-pop,1.4s ease-in-out 1.8s infinite xp-pulse}.xp-brand{z-index:3;color:#fff;justify-content:center;align-items:center;gap:8px;display:flex;position:absolute;top:18px;left:0;right:0}.xp-brand-mascot{width:34px}.xp-brand b{color:#fc3;font-size:22px}.xp-brand span{background:#ffffff26;border-radius:999px;padding:3px 10px;font-size:14px;font-weight:700}.xp.is-promo{width:100%;height:100%;box-shadow:none;border:0;border-radius:0}.xp.is-promo .xp-stage{aspect-ratio:auto;height:100%;max-height:none}.xp.is-promo .xp-scene{zoom:1.6;padding:88px 8px 212px}.xp.is-promo .xp-host{display:none}.xp.is-promo .xp-caption{min-height:136px;font-size:38px;line-height:1.12;bottom:196px;left:22px;right:22px}.xp.is-promo .xp-brand{gap:10px;top:78px}.xp.is-promo .xp-brand-mascot{width:46px}.xp.is-promo .xp-brand b{font-size:30px}.xp.is-promo .xp-brand span{padding:4px 12px;font-size:17px}.xp.is-promo .xp-end-mascot{width:104px}.xp.is-promo .xp-end-name{font-size:40px}.promo-page{background:#000;place-items:center;display:grid;position:fixed;inset:0}.promo-page .xp{width:min(100vw,56.25dvh);height:min(100dvh,177.778vw)}.xp-nose{font-size:76px;line-height:1;animation:.4s cubic-bezier(.2,1.6,.4,1) both xp-pop;position:relative}.xp-nose b{font-size:52px;animation:.5s cubic-bezier(.2,1.6,.4,1) .35s both xp-tap;position:absolute;top:34%;left:46%}@keyframes xp-tap{0%{opacity:0;transform:translate(40px,60px)rotate(20deg)}}.xp-oops{width:84px;animation:.9s ease-in-out both xp-gulp}@keyframes xp-gulp{0%{transform:scale(.6)rotate(0)}30%{transform:scale(1.1)rotate(-14deg)}60%{transform:scale(1)rotate(8deg)}}.xp-scene:has(.xp-end)~.xp-caption{display:none}.xp.is-promo .xp-scene:has(.xp-end){padding-bottom:140px}.xp-hand{justify-content:center;gap:6px;display:flex}.xp-card{perspective:600px;width:54px;height:78px;animation:.35s cubic-bezier(.2,1.5,.4,1) both xp-pop}.xp-card-in{width:100%;height:100%;transform-style:preserve-3d;animation:xp-flip .6s cubic-bezier(.3, 1.3, .5, 1) var(--delay) both;display:block;position:relative}.xp-card.is-hidden .xp-card-in{animation:none;transform:rotateY(180deg)}@keyframes xp-flip{0%{transform:rotateY(180deg)}}.xp-card-face,.xp-card-back{backface-visibility:hidden;border-radius:12px;align-content:center;place-items:center;gap:4px;display:grid;position:absolute;inset:0;box-shadow:0 5px #0000004d}.xp-card-face{color:#0a1633;background:#fff;border:3px solid #fff}.xp-card-face small{text-align:center;font-size:11px;font-weight:800;line-height:1.05}.xp-card.is-soft .xp-card-face{background:linear-gradient(160deg,#a9d6ff,#6fb6ff)}.xp-card.is-pinte .xp-card-face{color:#3b2314;background:linear-gradient(160deg,#ffe27a,#fc3)}.xp-card.is-shot .xp-card-face{color:#fff;background:linear-gradient(160deg,#ff6b57,#e8362d)}.xp-card-back{color:#fc3;background:repeating-linear-gradient(45deg,#1d4ed8 0 8px,#2f6bff 8px 16px);border:3px solid #fc3;transform:rotateY(180deg)}.xp-end-tag em{color:#fc3;font-style:normal}.xp-phone{background:#11131c;border-radius:26px;width:112px;height:194px;padding:7px;animation:.4s cubic-bezier(.2,1.5,.4,1) both xp-pop;display:block;position:relative;box-shadow:inset 0 0 0 2px #ffffff2e,0 8px #0000004d}.xp-phone:before{content:"";z-index:1;background:#11131c;border-radius:3px;width:30px;height:6px;margin-left:-15px;position:absolute;top:13px;left:50%}.xp-phone-screen{color:#fff;text-align:center;background:#1d2440;border-radius:19px;align-content:center;place-items:center;gap:6px;height:100%;display:grid;position:relative;overflow:hidden}.xp-phone.is-small{border-radius:16px;width:64px;height:112px;padding:5px}.xp-phone.is-small:before{width:18px;height:4px;margin-left:-9px;top:8px}.xp-phone.is-small .xp-phone-screen{border-radius:12px}.xp-tap{z-index:2;pointer-events:none;position:absolute;top:56%;left:50%}.xp-tap b{filter:drop-shadow(0 4px #0000004d);animation:xp-press .55s cubic-bezier(.3, 1.2, .5, 1) var(--delay) both;font-size:54px;line-height:1;position:absolute;top:-6px;left:-12px}@keyframes xp-press{0%{opacity:0;transform:translate(40px,120px)rotate(18deg)}60%{opacity:1;transform:translate(0)scale(1)}75%{transform:translateY(6px)scale(.9)}}.xp-tap i{opacity:0;width:60px;height:60px;animation:xp-ripple .6s ease-out calc(var(--delay) + .35s) both;border:4px solid #fff;border-radius:50%;position:absolute;top:-30px;left:-30px}@keyframes xp-ripple{0%{opacity:.9;transform:scale(.2)}to{opacity:0;transform:scale(1.6)}}.xp-count{font-variant-numeric:tabular-nums}.xp-rank{gap:8px;width:250px;margin:0;padding:0;list-style:none;display:grid}.xp-rank li{color:#fff;animation:xp-drop .45s cubic-bezier(.2, 1.5, .4, 1) var(--delay) both;background:#ffffff24;border-radius:14px;align-items:center;gap:8px;padding:8px 12px;font-size:17px;font-weight:800;display:flex;position:relative;box-shadow:0 4px #0003}@keyframes xp-drop{0%{opacity:0;transform:translateY(-30px)scale(.8)}}.xp-rank li>b{background:#00000040;border-radius:50%;place-items:center;width:24px;height:24px;font-size:13px;display:grid}.xp-rank-name{flex:1;align-items:center;gap:5px;display:inline-flex}.xp-rank-value{font-variant-numeric:tabular-nums}.xp-rank li.is-give{background:#0f9d58}.xp-rank li.is-drink{background:#e8362d}.xp-rank li.is-gold{color:#3b2314;background:linear-gradient(135deg,#fc3,#f29100)}.xp-rank li em{color:#0a1633;animation:xp-pop .4s cubic-bezier(.2, 1.6, .4, 1) var(--delay) both;background:#fff;border-radius:999px;padding:2px 9px;font-size:12px;font-style:normal;position:absolute;top:-11px;right:-8px;transform:rotate(4deg);box-shadow:0 3px #00000040}.xp.is-frozen .xp-stage *,.xp.is-frozen .xp-stage :before,.xp.is-frozen .xp-stage :after{animation-play-state:paused!important}