/* الرفيق — حوشي العائم في تطبيق العميل */
.hm-buddy{position:fixed;left:0;top:0;z-index:1029;width:50px;opacity:0;pointer-events:none;
  transition:transform .75s cubic-bezier(.34,1.25,.64,1),opacity .3s;will-change:transform;-webkit-tap-highlight-color:transparent}
.hm-buddy.ready{opacity:1}
.hm-buddy.is-fast{transition:transform .35s cubic-bezier(.2,.8,.3,1),opacity .3s}
.hm-buddy.is-drag{transition:none}
.hm-buddy.is-away{opacity:0}
.hm-buddy.is-away .bd-body{transform:scale(.3) translateY(30px)}
.bd-body{position:relative;--lag:0px;transform:translateY(var(--lag));transition:transform .35s cubic-bezier(.34,1.56,.64,1)}
.hm-buddy.face-l .bd-m .hmm-svg{transform:scaleX(-1)}
.hm-buddy .hm-mascot{display:block}
.hm-buddy .hmm-say{font-size:.76rem}
.hm-buddy.is-quiet .hmm-say{display:none}
.bd-trail{position:absolute;left:50%;top:50%;pointer-events:none}
.bd-trail i{position:absolute;width:6px;height:6px;margin:-3px;border-radius:50%;background:#FFD36B;box-shadow:0 0 6px #FFD36B;opacity:0;
  animation:bdTrail .8s ease-out var(--d) forwards}
@keyframes bdTrail{0%{opacity:.9;transform:translate(0,0) scale(1)}100%{opacity:0;transform:translate(var(--x),18px) scale(.2)}}
.bd-burst{position:absolute;left:50%;top:45%;pointer-events:none;z-index:3}
.bd-burst i{position:absolute;width:6px;height:6px;border-radius:2px;background:var(--c);animation:bdBurst 1.1s cubic-bezier(.2,.8,.3,1) forwards}
.bd-burst.big i{width:7px;height:7px;border-radius:50%}
@keyframes bdBurst{0%{transform:rotate(var(--a)) translateX(0) scale(1);opacity:1}100%{transform:rotate(var(--a)) translateX(var(--d)) scale(.3);opacity:0}}

@media (prefers-reduced-motion:reduce){
  .hm-buddy,.bd-body{transition:opacity .2s!important}
  .bd-trail,.bd-burst{display:none}
}
html.mascot-off .hm-buddy{display:none!important}
/* فقاعة الكلام بتطلع ناحية جوه الشاشة دايمًا */
.hm-buddy .hm-mascot .hmm-say{inset-inline-start:auto;max-width:min(240px,70vw);white-space:normal;width:max-content}
.hm-buddy[data-side="l"] .hm-mascot .hmm-say{left:-4px;right:auto;transform:translate(0,6px) scale(.9);transform-origin:12px 100%}
.hm-buddy[data-side="r"] .hm-mascot .hmm-say{right:-4px;left:auto;transform:translate(0,6px) scale(.9);transform-origin:calc(100% - 12px) 100%}
.hm-buddy .hm-mascot.is-saying .hmm-say{transform:translate(0,0) scale(1)!important;translate:none!important}
.hm-buddy[data-side="l"] .hmm-say::after{left:20px}
.hm-buddy[data-side="r"] .hmm-say::after{left:auto;right:14px}
.hm-buddy.face-l .bd-m .hmm-pics{transform:scaleX(-1)}