/* v31 — dimuat PALING AKHIR.
   1) Tidak ada efek pantul (overshoot): toast, toolbar/nav, indikator mengetik, pop ikon.
   2) Toast melayang di atas nav dengan jarak, bukan menempel; masuk dengan fade + geser kecil (tidak membesar ke atas).
   3) Indikator "mengetik" (bot / chat) tanpa kotak latar: hanya titik yang memudar bergantian (tanpa lompat).
   4) Splash: pemudaran ditangani JS (WAAPI); di sini hanya memastikan lapisan tidak menahan frame setelah hilang. */

/* ---------- keyframes tanpa pantulan ---------- */
@keyframes mxDot{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes tbDot{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes tdot{0%,100%{opacity:.3}50%{opacity:1}}
@keyframes bounce{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes tbNavIc{from{opacity:.55;transform:scale(.88)}to{opacity:1;transform:none}}
@keyframes jelly{0%,100%{scale:1 1}}
@keyframes jellySoft{0%,100%{scale:1 1}}
@keyframes tbPop{from{transform:scale(.92)}to{transform:none}}
@keyframes mxSendPop{from{transform:scale(.92)}to{transform:none}}
@keyframes mxAvIn{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}
@keyframes mxFabIn{from{opacity:0;transform:translateY(10px) scale(.9)}to{opacity:1;transform:none}}
@keyframes mxV18Pop{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:none}}
@keyframes mxV18Card{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes selpop{from{transform:scale(.7)}to{transform:none}}
@keyframes proCountBump{from{opacity:.6}to{opacity:1}}

/* ikon logo besar di Meta AI: tanpa melayang naik-turun terus-menerus (animasi tak berujung = kerja GPU/CPU sia-sia di WebView) */
.mx-big{animation:mxAvIn .5s ease-out both!important}
.mx-big svg{animation:none!important}

/* ---------- toast ---------- */
html body #toast#toast{
  position:fixed!important;
  left:12px!important;right:12px!important;width:auto!important;max-width:none!important;margin:0 auto!important;
  bottom:calc(var(--navfull,calc(var(--navh,78px) + max(var(--sab,0px),env(safe-area-inset-bottom,0px)))) + 14px)!important;
  border-radius:14px!important;
  transform:translateY(10px)!important;translate:none!important;transform-origin:50% 100%!important;
  opacity:0;
  transition:opacity .2s ease,transform .22s cubic-bezier(.22,1,.36,1)!important;
  justify-content:center;
}
@media(min-width:781px){html body #toast#toast{left:50%!important;right:auto!important;width:max-content!important;max-width:min(520px,calc(100vw - 32px))!important;margin:0!important;transform:translate(-50%,10px)!important;bottom:24px!important}
  html body #toast#toast.on{transform:translate(-50%,0)!important}}
html body #toast#toast.on{opacity:1;transform:translateY(0)!important}
html body #toast#toast.out{opacity:0;transform:translateY(6px)!important;transition:opacity .16s ease,transform .16s ease!important}
html body #toast#toast .tt{opacity:1!important;transition:none!important;text-align:center}

/* toast layar login */
.vtoast{transition:transform .22s cubic-bezier(.22,1,.36,1),opacity .2s ease!important}

/* ---------- indikator mengetik: tanpa latar ---------- */
html:root:root:root body .gp.mx .mx-row[data-typing] .mx-bub,
html:root:root:root body .mx-bub.typing{
  background:transparent!important;border:0!important;box-shadow:none!important;
  padding:8px 4px!important;min-width:0!important;
  animation:mxFade .2s ease-out both!important;transform:none!important;
}
.mx-dots i{animation:mxDot 1.1s ease-in-out infinite}
.mx-dots i:nth-child(2){animation-delay:.18s}.mx-dots i:nth-child(3){animation-delay:.36s}
.tb-dots i{animation:tbDot 1.1s ease-in-out infinite}
.tgtyp .m i,.ty i{animation-name:tdot}

/* ---------- toolbar / nav: tanpa lompat ---------- */
html:root body .tb-nav button.on .tb-nic{animation:none!important}
html:root body .tb-nav button.on .tb-nic .tb-i{animation:tbNavIc .22s ease-out both!important}
html body #app aside .nav.on i{animation:tbNavIc .22s ease-out both!important}
.navind.jl{animation:none!important}
html body #app main .tb{animation:none!important}

/* ---------- ringan untuk WebView ---------- */
/* lapisan splash yang sudah hilang tidak ikut dilukis */
html body #splash.out{display:none!important}
