/* TIPS Royale v30.15.0 - the five TIPS Royale emotes: a big sticker BESIDE the sender's HUD
   (never over a face), each with its own effect, gone again after about 3.4 seconds. */

.poker-stage > .emoji-reaction.emote-sticker{
  position:absolute!important;
  z-index:85!important;
  width:clamp(74px,18cqw,124px)!important;
  height:auto!important;
  font-size:0!important;
  transform:translate(-50%,-50%);
  pointer-events:none!important;
  display:flex!important;
  flex-direction:column;
  align-items:center;
  animation:emoteLife 3.4s cubic-bezier(.2,.9,.3,1) both!important;
  filter:drop-shadow(0 8px 14px rgba(0,0,0,.55));
}
body.decision-dock-open .poker-stage > .emoji-reaction.emote-sticker{visibility:visible!important}
.emote-sticker img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;position:relative;z-index:2}
.emote-cap{
  position:relative;z-index:3;margin-top:-10%;
  padding:2px 9px;border-radius:999px;white-space:nowrap;
  border:1px solid #ffd766;background:linear-gradient(180deg,#1b2c3f,#0b1b2b);
  color:#ffe591;font:1000 clamp(10px,2.3cqw,14px)/1.25 system-ui,sans-serif;letter-spacing:.2px;
  box-shadow:0 3px 8px rgba(0,0,0,.5);
}
@keyframes emoteLife{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.2) rotate(-12deg)}
  9%{opacity:1;transform:translate(-50%,-50%) scale(1.22) rotate(4deg)}
  15%{transform:translate(-50%,-50%) scale(.94) rotate(-2deg)}
  21%{transform:translate(-50%,-50%) scale(1.04) rotate(0)}
  27%,82%{opacity:1;transform:translate(-50%,-50%) scale(1)}
  100%{opacity:0;transform:translate(-50%,-62%) scale(.86)}
}

/* the effect layer: six small particles around the sticker */
.emote-fx{position:absolute;inset:0;z-index:1;pointer-events:none}
.emote-fx i{position:absolute;left:50%;top:45%;width:0;height:0;opacity:0;font-style:normal;font-weight:1000;line-height:1}

/* 💤 Kom nu: slow sway, Zs drift up */
.emote-zzz img{animation:emoteSway 1.6s ease-in-out .35s 2}
.emote-zzz .emote-fx i::before{content:"Z";position:absolute;color:#7fc8ff;font-size:clamp(12px,3.4cqw,22px);text-shadow:0 0 6px rgba(127,200,255,.9),0 2px 3px rgba(0,0,0,.6)}
.emote-zzz .emote-fx i{animation:emoteZ 1.7s ease-out infinite}
.emote-zzz .emote-fx i:nth-child(1){left:72%;animation-delay:.3s}
.emote-zzz .emote-fx i:nth-child(2){left:80%;animation-delay:.85s;transform:scale(.8)}
.emote-zzz .emote-fx i:nth-child(3){left:66%;animation-delay:1.4s}
.emote-zzz .emote-fx i:nth-child(n+4){display:none}
@keyframes emoteZ{0%{opacity:0;transform:translate(0,0) scale(.6)}20%{opacity:1}100%{opacity:0;transform:translate(18px,-46px) scale(1.25)}}
@keyframes emoteSway{0%,100%{transform:rotate(0)}30%{transform:rotate(-7deg)}70%{transform:rotate(5deg)}}

/* 🍀 Held: gold sparkles burst out, a bounce */
.emote-lucky img{animation:emoteBounce .55s ease-out .35s 3}
.emote-lucky .emote-fx i::before{content:"✦";position:absolute;color:#ffe066;font-size:clamp(12px,3.4cqw,22px);text-shadow:0 0 8px #ffd23f,0 0 14px rgba(255,210,63,.8)}
.emote-lucky .emote-fx i{animation:emoteBurst 1.1s ease-out .25s 2}
.emote-lucky .emote-fx i:nth-child(1){--dx:-48px;--dy:-40px}
.emote-lucky .emote-fx i:nth-child(2){--dx:46px;--dy:-44px;animation-delay:.35s}
.emote-lucky .emote-fx i:nth-child(3){--dx:-58px;--dy:6px;animation-delay:.45s}
.emote-lucky .emote-fx i:nth-child(4){--dx:56px;--dy:10px;animation-delay:.3s}
.emote-lucky .emote-fx i:nth-child(5){--dx:-24px;--dy:-60px;animation-delay:.5s}
.emote-lucky .emote-fx i:nth-child(6){--dx:26px;--dy:-62px;animation-delay:.4s}
@keyframes emoteBurst{0%{opacity:0;transform:translate(0,0) scale(.3) rotate(0)}25%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(1.3) rotate(140deg)}}
@keyframes emoteBounce{0%,100%{transform:translateY(0)}40%{transform:translateY(-14%)}}

/* 💢 Grrr: shake, red flash, steam puffs left and right */
.emote-angry img{animation:emoteShake .08s linear .35s 14}
.emote-angry{--glow:rgba(255,60,40,.75)}
.emote-angry .emote-fx i::before{content:"";position:absolute;width:clamp(10px,2.6cqw,18px);height:clamp(10px,2.6cqw,18px);border-radius:50%;background:radial-gradient(circle,#fff,#e8eef5 55%,rgba(232,238,245,0) 72%)}
.emote-angry .emote-fx i{top:22%;animation:emoteSteam .9s ease-out .35s 3}
.emote-angry .emote-fx i:nth-child(odd){--dx:-52px}
.emote-angry .emote-fx i:nth-child(even){--dx:52px}
.emote-angry .emote-fx i:nth-child(3),.emote-angry .emote-fx i:nth-child(4){animation-delay:.6s}
.emote-angry .emote-fx i:nth-child(5),.emote-angry .emote-fx i:nth-child(6){animation-delay:.85s}
@keyframes emoteShake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4%) rotate(-2deg)}75%{transform:translateX(4%) rotate(2deg)}}
@keyframes emoteSteam{0%{opacity:0;transform:translate(0,0) scale(.4)}20%{opacity:.95}100%{opacity:0;transform:translate(var(--dx),-22px) scale(1.6)}}

/* 😎 For nemt: a light sweep over the sticker, a confident nod */
.emote-cool img{animation:emoteNod .7s ease-in-out .4s 2}
.emote-cool .emote-fx{overflow:hidden;border-radius:50%;z-index:3}
.emote-cool .emote-fx i:nth-child(1){left:-60%;top:0;width:40%;height:100%;opacity:1;background:linear-gradient(100deg,transparent,rgba(255,255,255,.75),transparent);transform:skewX(-18deg);animation:emoteShine 1.2s ease-in-out .45s 2}
.emote-cool .emote-fx i:nth-child(n+2){display:none}
@keyframes emoteShine{0%{left:-60%}60%,100%{left:130%}}
@keyframes emoteNod{0%,100%{transform:rotate(0)}50%{transform:rotate(-6deg) translateY(-3%)}}

/* ❤️ Tak: hearts float up */
.emote-love img{animation:emoteBeat .6s ease-in-out .35s 4}
.emote-love .emote-fx i::before{content:"❤";position:absolute;color:#ff4d6d;font-size:clamp(12px,3.4cqw,22px);text-shadow:0 0 6px rgba(255,77,109,.8)}
.emote-love .emote-fx i{animation:emoteHeart 1.5s ease-out infinite}
.emote-love .emote-fx i:nth-child(1){left:18%;animation-delay:.3s}
.emote-love .emote-fx i:nth-child(2){left:82%;animation-delay:.6s}
.emote-love .emote-fx i:nth-child(3){left:30%;animation-delay:.95s}
.emote-love .emote-fx i:nth-child(4){left:72%;animation-delay:1.25s}
.emote-love .emote-fx i:nth-child(n+5){display:none}
@keyframes emoteHeart{0%{opacity:0;transform:translateY(0) scale(.5)}20%{opacity:1}100%{opacity:0;transform:translateY(-58px) scale(1.2)}}
@keyframes emoteBeat{0%,100%{transform:scale(1)}30%{transform:scale(1.1)}}

/* the sender's HUD pulses once in the emote's colour */
.player.emote-pulse .hud-full-frame{animation:emoteSeatPulse 1.2s ease-out 1}
.player.emote-pulse[data-emote="zzz"]{--emote-glow:rgba(127,200,255,.9)}
.player.emote-pulse[data-emote="lucky"]{--emote-glow:rgba(255,210,63,.95)}
.player.emote-pulse[data-emote="angry"]{--emote-glow:rgba(255,70,50,.95)}
.player.emote-pulse[data-emote="cool"]{--emote-glow:rgba(160,220,255,.9)}
.player.emote-pulse[data-emote="love"]{--emote-glow:rgba(255,90,130,.95)}
@keyframes emoteSeatPulse{0%{filter:drop-shadow(0 0 0 transparent)}35%{filter:drop-shadow(0 0 14px var(--emote-glow,#ffd766))}100%{filter:drop-shadow(0 0 0 transparent)}}

/* the menu: five picture buttons */
.emoji-menu.emote-menu{gap:6px!important;padding:8px!important;border-color:#c9a24a!important;background:linear-gradient(180deg,#14283d,#0a1828)!important}
.emoji-menu.emote-menu button{width:clamp(54px,14vw,66px)!important;height:auto!important;display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 2px 5px!important;border:1px solid #2f4d6b!important;border-radius:12px!important;background:#0f2438!important;cursor:pointer;transition:transform .12s ease,border-color .12s ease}
.emoji-menu.emote-menu button:hover,.emoji-menu.emote-menu button:focus-visible{transform:translateY(-3px) scale(1.06);border-color:#ffe591!important}
.emoji-menu.emote-menu img{width:100%;aspect-ratio:1;object-fit:contain}
.emoji-menu.emote-menu span{font-size:10px;font-weight:900;color:#ffe591}

@media(prefers-reduced-motion:reduce){
  .poker-stage > .emoji-reaction.emote-sticker{animation-name:emoteFade!important}
  .emote-sticker img,.emote-fx i,.player.emote-pulse .hud-full-frame{animation:none!important}
  @keyframes emoteFade{0%,100%{opacity:0}10%,85%{opacity:1}}
}