/* Painel fluido (14/10): aviso rápido, esqueleto de carregamento e animações do status ao vivo. */
#jf-aviso{position:fixed;left:50%;bottom:24px;z-index:10050;transform:translate(-50%,160%);display:flex;align-items:center;gap:10px;max-width:calc(100vw - 32px);padding:12px 18px 12px 14px;border-radius:14px;
  background:rgba(18,18,28,.96);border:1px solid rgba(255,255,255,.1);color:#fff;font:600 14px "Inter",system-ui,sans-serif;box-shadow:0 24px 50px -16px rgba(0,0,0,.9);transition:transform .35s cubic-bezier(.2,.9,.3,1.2);pointer-events:none}
#jf-aviso::before{content:"✓";display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#16a34a;color:#fff;font-size:12px;flex-shrink:0}
#jf-aviso.erro::before{content:"!";background:#e01414}
#jf-aviso.on{transform:translate(-50%,0)}
.jf-carregando{position:relative;pointer-events:none}
.jf-carregando>*{opacity:.35;transition:opacity .2s}
.jf-carregando::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.06) 50%,transparent 70%);background-size:200% 100%;animation:jfBrilho 1.1s linear infinite}
@keyframes jfBrilho{from{background-position:200% 0}to{background-position:-200% 0}}
body.jf-enviando{cursor:progress}
body.jf-enviando .modal-content{opacity:.85}
.jf-novo{animation:jfNovo .6s ease}
@keyframes jfNovo{from{opacity:.4}}
tr.jf-pago>td{animation:jfPago 1.8s ease}
tr.jf-falhou>td{animation:jfFalhou 1.8s ease}
@keyframes jfPago{0%,40%{background:rgba(34,197,94,.22)!important}}
@keyframes jfFalhou{0%,40%{background:rgba(239,68,68,.2)!important}}
.badge.jf-virou{animation:jfVirou .6s cubic-bezier(.2,.9,.3,1.4)}
@keyframes jfVirou{0%{transform:rotateX(90deg)}100%{transform:none}}
@media(prefers-reduced-motion:reduce){#jf-aviso,.jf-carregando::after,tr.jf-pago>td,tr.jf-falhou>td,.badge.jf-virou{animation:none!important;transition:none!important}}