



























:root {
  --e-entra:  cubic-bezier(.16, 1, .3, 1);      
  --e-sai:    cubic-bezier(.4, 0, 1, 1);        
  




  --e-liga:   cubic-bezier(.2, .9, .1, 1);      
  --e-fecha:  cubic-bezier(.5, 0, .9, .3);      
  --e-resp:   cubic-bezier(.45, 0, .55, 1);     

  




  --dc-sup:  #1a1817;
  --dc-sup2: #141312;
  --dc-labio:#0d0c0c;
}












.pc-recado {
  position: fixed; right: 16px; bottom: 18px; z-index: 150;
  width: 360px; max-width: calc(100vw - 32px);
  padding: 0; border: 0; background: none; text-align: left; cursor: pointer;

  

  opacity: 0;
  transform: translateX(376px);
  will-change: transform, opacity;
  





  transition: opacity 90ms var(--e-sai), transform 420ms var(--e-entra),
              





              width 340ms var(--e-entra);
}
.pc-recado.dentro { opacity: 1; transform: translateX(0); }

















.pc-recado.mini { width: 70px; }
.pc-recado.mini .pc-recado-txt,
.pc-recado.mini .pc-recado-x {
  opacity: 0;
  pointer-events: none;
  transition: opacity 140ms var(--e-sai);
}


.pc-recado.mini .pc-recado-foto { border-radius: 50%; }



.pc-recado.mini .pc-recado-luz { display: none; }














.pc-recado-corpo {
  


  --rc-cor: 46, 204, 113;

  display: grid; grid-template-columns: 44px minmax(0, 1fr) 18px;
  align-items: center; gap: 12px;
  padding: 12px 12px 12px 14px;
  overflow: hidden;

  



















  border: 0;
  border-radius: 18px;
  background:
    linear-gradient(rgba(var(--rc-cor), .10), rgba(var(--rc-cor), .03)),
    linear-gradient(#252221, #15100f);
  box-shadow:
    inset 0 2px 0 rgba(255, 255, 255, .16),
    inset 0 0 0 1px rgba(var(--rc-cor), .26),
    inset 0 -4px 0 rgba(0, 0, 0, .62),
    0 2px 3px rgba(0, 0, 0, .85),
    0 18px 40px -14px rgba(0, 0, 0, .95);

  scale: .92;
  rotate: -.9deg;
  transition: scale 340ms 40ms var(--mo-mola), rotate 480ms var(--e-entra),
              box-shadow 160ms var(--e-entra);
}
.pc-recado.dentro .pc-recado-corpo { scale: 1; rotate: 0deg; }
.pc-recado > * { position: relative; }

.pc-recado.guardado {
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 90ms var(--e-sai), visibility 0s 90ms;
}

.pc-recado.saindo {
  


  opacity: 0;
  transform: translateX(40px);
  transition: opacity 160ms var(--e-sai), transform 200ms var(--e-sai);
}
.pc-recado.saindo .pc-recado-corpo { scale: .96; transition: scale 200ms var(--e-sai); }






.pc-recado-foto {
  width: 44px; height: 44px; border-radius: 14px; overflow: hidden;
  background: var(--bg-3); display: grid; place-items: center;
  

  box-shadow: 0 0 0 2px rgba(var(--rc-cor), .5), inset 0 0 0 1px rgba(255, 255, 255, .08);
}
.pc-recado-foto img { width: 100%; height: 100%; object-fit: cover; display: block; }



.pc-recado-ini {
  width: 100%; height: 100%; display: grid; place-items: center;
  font-style: normal; font-size: 19px; font-weight: 800; color: #fff;
  background: linear-gradient(hsl(var(--h) 46% 38%), hsl(var(--h) 46% 27%));
}




.pc-recado.dentro .pc-recado-foto { animation: dc-pulso 350ms 140ms var(--e-entra); }



@keyframes dc-pulso {
  0%   { transform: scale(1); }
  26%  { transform: scale(1.12); }
  52%  { transform: scale(1); }
  70%  { transform: scale(1.07); }
  100% { transform: scale(1); }
}










.pc-recado-luz {
  position: absolute; inset: 0; pointer-events: none; z-index: 2;
  background: linear-gradient(105deg,
    transparent 0 36%,
    rgba(255, 255, 255, .22) 50%,
    transparent 64% 100%);
  background-size: 280% 100%;
  background-position: 140% 0;
  mix-blend-mode: screen;
  opacity: 0;
}






.pc-recado.dentro .pc-recado-luz {
  animation: dc-lamina 620ms 220ms var(--e-liga),
             dc-lamina-laco 6.2s 1.2s linear infinite;
}
@keyframes dc-lamina {
  0%   { background-position: 140% 0; opacity: 0; }
  12%  { opacity: 1; }
  88%  { opacity: 1; }
  100% { background-position: -60% 0; opacity: 0; }
}


@keyframes dc-lamina-laco {
  0%    { background-position: 140% 0; opacity: 0; }
  1.2%  { opacity: 1; }
  8.8%  { opacity: 1; }
  10%   { background-position: -60% 0; opacity: 0; }
  100%  { background-position: -60% 0; opacity: 0; }
}










.pc-recado-txt { min-width: 0; display: grid; gap: 2px; }
.pc-recado-txt b {
  font-size: 13.5px; font-weight: 700; line-height: 1.25;
  letter-spacing: -.01em; color: #f4f1f0;
}
.pc-recado-txt i {
  font-style: normal; font-size: 11.5px; font-weight: 600; line-height: 1.3;
  color: rgba(255, 255, 255, .56);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}






.pc-recado-x {
  width: 18px; height: 18px; display: grid; place-items: center;
  font-size: 15px; line-height: 1; color: rgba(255, 255, 255, .42);
  border-radius: 6px; transition: color 140ms var(--e-entra), background 140ms var(--e-entra);
}
.pc-recado:hover .pc-recado-x { color: rgba(255, 255, 255, .8); background: rgba(255, 255, 255, .07); }

.pc-recado-corpo::after {
  content: ""; position: absolute; top: 10px; right: 34px;
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--novo, #2ecc71);
  box-shadow: 0 0 10px -1px var(--novo, #2ecc71);
}
.pc-recado.dentro .pc-recado-corpo::after { animation: dc-respira 2.4s 900ms var(--e-resp) infinite; }
@keyframes dc-respira {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.06); }
}




.pc-recado:hover .pc-recado-corpo {
  box-shadow:
    inset 0 2px 0 rgba(255, 255, 255, .22),
    inset 0 0 0 1px rgba(var(--rc-cor), .46),
    inset 0 -4px 0 rgba(0, 0, 0, .62),
    0 2px 3px rgba(0, 0, 0, .85),
    0 22px 46px -14px rgba(0, 0, 0, .95);
}
.pc-recado.dentro:active .pc-recado-corpo { scale: .975; transition-duration: 80ms; }








.dc-cx {
  position: fixed; inset: 0; z-index: 160;
  display: grid; place-items: center; padding: 26px;
  background: rgba(0, 0, 0, 0);
  

  visibility: hidden; opacity: 0;
  transition: background 240ms var(--e-entra), opacity 200ms var(--e-sai),
              visibility 0s 240ms;
}
.dc-cx.dentro {
  visibility: visible; opacity: 1;
  background: rgba(0, 0, 0, .55);
  transition: background 240ms var(--e-entra), opacity 120ms var(--e-entra),
              visibility 0s;
}





.dc-cx:not(.dentro) .dc-painel {
  transition: transform 240ms var(--e-fecha), opacity 160ms var(--e-sai);
}

.dc-painel {
  position: relative;
  width: min(760px, 100%); max-height: calc(100vh - 52px); overflow: auto;
  padding: 26px 26px 22px;
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 18px;
  background: linear-gradient(var(--dc-sup), var(--dc-sup2));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .07),
    0 1px 2px rgba(0, 0, 0, .8),
    0 30px 80px -24px rgba(0, 0, 0, .9);
  



  transform-origin: var(--dc-ox, 100%) var(--dc-oy, 100%);
  transform: scale(.22) translateY(10px);
  opacity: 0;
  transition: transform 380ms var(--e-liga), opacity 90ms var(--e-entra);
}
.dc-cx.dentro .dc-painel { transform: scale(1) translateY(0); opacity: 1; }

.dc-fechar {
  position: absolute; top: 14px; right: 14px; z-index: 3;
  width: 30px; height: 30px; border-radius: 9px;
  border: 1px solid rgba(255, 255, 255, .1); background: transparent;
  color: rgba(255, 255, 255, .6); font-size: 19px; line-height: 1; cursor: pointer;
}
.dc-fechar:hover { color: #f4f1f0; background: rgba(255, 255, 255, .07); }





.dc-som {
  position: absolute; top: 14px; right: 50px; z-index: 3;
  width: 30px; height: 30px; display: grid; place-items: center;
  border-radius: 9px; border: 1px solid rgba(255, 255, 255, .1);
  background: transparent; color: rgba(255, 255, 255, .6); cursor: pointer;
}
.dc-som:hover { color: #f4f1f0; background: rgba(255, 255, 255, .07); }
.dc-cx.dentro .dc-som { animation-delay: 250ms; }










.dc-painel > * { opacity: 0; transform: translateY(12px); }
.dc-cx.dentro .dc-painel > * {
  animation: dc-sobe 260ms var(--e-entra) forwards;
}
.dc-cx.dentro .dc-pergunta { animation-delay: 160ms; }
.dc-cx.dentro .dc-canal    { animation-delay: 205ms; }
.dc-cx.dentro .dc-guardar  { animation-delay: 250ms; }
.dc-cx.dentro .dc-aval     { animation-delay: 285ms; }
.dc-cx.dentro .dc-pe       { animation-delay: 320ms; }
.dc-cx.dentro .dc-fechar   { animation-delay: 250ms; }
@keyframes dc-sobe {
  to { opacity: 1; transform: translateY(0); }
}





.dc-pergunta {
  margin: 0 0 16px; padding-right: 76px;
  font-size: 26px; font-weight: 800; line-height: 1.15; letter-spacing: -.02em;
  color: #f4f1f0;
}
.dc-pergunta small {
  display: block; margin-top: 6px;
  font-size: 13.5px; font-weight: 500; line-height: 1.45; letter-spacing: 0;
  color: rgba(255, 255, 255, .72);
}
.dc-canal { margin-bottom: 18px; }















.dc-corrente {
  margin: -6px 0 16px; display: inline-flex; align-items: center;
  padding: 5px 12px; border-radius: 999px;
  background: rgba(46, 204, 113, .10);
  border: 1px solid rgba(46, 204, 113, .28);
  font-size: 13.5px; font-weight: 600; line-height: 1.35;
  color: rgba(255, 255, 255, .86);
}




.dc-corrente b { color: var(--novo, #2ecc71); font-weight: 700; }








.pc-recado.dc-joia.dentro .pc-recado-corpo { animation: dc-joia-luz 1100ms 180ms var(--e-entra); }
@keyframes dc-joia-luz {
  0%   { box-shadow: inset 0 1px 0 rgba(255,255,255,.07), inset 0 -2px 0 var(--dc-labio),
                     0 0 0 0 rgba(46, 204, 113, .5), 0 10px 30px -12px rgba(0,0,0,.85); }
  30%  { box-shadow: inset 0 1px 0 rgba(255,255,255,.18), inset 0 -2px 0 var(--dc-labio),
                     0 0 34px 2px rgba(46, 204, 113, .45), 0 10px 30px -12px rgba(0,0,0,.85); }
  100% { box-shadow: inset 0 1px 0 rgba(255,255,255,.07), inset 0 -2px 0 var(--dc-labio),
                     0 0 0 0 rgba(46, 204, 113, 0), 0 10px 30px -12px rgba(0,0,0,.85); }
}
.pc-recado.dc-joia .pc-recado-corpo::after { background: var(--novo, #2ecc71); }

















.dc-guardar { margin: 0 0 20px; display: flex; gap: 10px; flex-wrap: wrap; }
.dc-add-cx { flex: 1 1 260px; display: flex; }
.dc-add-cx .dc-add { flex: 1; }
.dc-add-aluno { flex: 1 1 200px; }

.dc-guardar .nf-salvar-pasta { min-height: 46px; }












.dc-add {
  min-height: 46px;
  font-size: 15px; font-weight: 700; letter-spacing: -.01em;
  border-radius: 12px;
}




.dc-add.feito, .dc-add.feito:disabled {
  opacity: 1; cursor: default;
  background: linear-gradient(rgba(46, 204, 113, .18), rgba(46, 204, 113, .07));
  border-color: rgba(46, 204, 113, .45);
  color: #f4f1f0;
}




.dc-aval {
  margin: 0 0 10px;
  font-size: 16px; font-weight: 700; line-height: 1.3; letter-spacing: -.01em;
  color: #f4f1f0;
}






.dc-pe { display: flex; gap: 10px; flex-wrap: wrap; }
.dc-bt {
  flex: 1 1 200px; min-height: 46px; padding: 0 18px;
  font: inherit; font-size: 15px; font-weight: 700; letter-spacing: -.01em;
  color: #f4f1f0; cursor: pointer;
  border-radius: 12px; border: 1px solid rgba(255, 255, 255, .12);
  background: linear-gradient(rgba(255, 255, 255, .06), rgba(255, 255, 255, .02));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), inset 0 -2px 0 var(--dc-labio);
  transition: transform var(--mo-volta, 320ms) var(--mo-mola), box-shadow 160ms var(--e-entra),
              border-color 160ms var(--e-entra);
}
.dc-bt:hover:not(:disabled) { transform: translateY(-2px); }
.dc-bt:active:not(:disabled) { transform: scale(.97); transition-duration: 80ms; }
.dc-sim {
  border-color: rgba(46, 204, 113, .45);
  background: linear-gradient(rgba(46, 204, 113, .18), rgba(46, 204, 113, .07));
}
.dc-sim:hover:not(:disabled) { box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 0 24px -6px rgba(46, 204, 113, .55); }
.dc-nao:hover:not(:disabled)  { box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 0 20px -8px rgba(255, 255, 255, .4); }
.dc-bt:disabled { opacity: .5; cursor: default; }




.dc-bt i {
  font-style: normal; font-size: 11px; font-weight: 800; line-height: 1;
  margin-right: 9px; padding: 3px 6px; border-radius: 5px;
  background: rgba(255, 255, 255, .1); color: rgba(255, 255, 255, .66);
  vertical-align: 1px;
}









.dc-cx.dentro .dc-painel > .dc-aval.dc-verso {
  animation: dc-planta 420ms var(--e-entra);
}


.dc-aval.dc-verso { font-size: 20px; font-weight: 800; }
.dc-aval.dc-verso small {
  display: block; margin-top: 4px;
  font-size: 13.5px; font-weight: 500; color: rgba(255, 255, 255, .72);
}
@keyframes dc-planta {
  0%   { transform: scale(.92); opacity: 0; }
  60%  { transform: scale(1.03); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}



.dc-painel.dc-sim-feito { animation: dc-ganhou 900ms var(--e-entra); }
@keyframes dc-ganhou {
  0%   { box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 0 0 0 rgba(46, 204, 113, .55),
                     0 30px 80px -24px rgba(0,0,0,.9); }
  22%  { box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 0 60px 6px rgba(46, 204, 113, .5),
                     0 30px 80px -24px rgba(0,0,0,.9); }
  100% { box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 0 0 0 rgba(46, 204, 113, 0),
                     0 30px 80px -24px rgba(0,0,0,.9); }
}









.dc-painel.dc-nao-feito { animation: dc-assenta 260ms var(--e-entra); }
@keyframes dc-assenta {
  0%   { transform: scale(1); }
  40%  { transform: scale(.988); }
  100% { transform: scale(1); }
}


















.dc-canal .nf-salvar,
.dc-canal [data-add],
.dc-canal .nf-julgar,
.dc-canal .nf-sel,
.dc-canal .nf-copiar,
.dc-canal .nf-veio,
.dc-canal .pr-btn,
.dc-canal .nf-nota-btn,
.dc-canal .nf-anunciar,
.dc-canal [data-similares],
.dc-canal [data-reprovar],
.dc-canal [data-desreprovar],
.dc-canal [data-tirar-base] { display: none; }




.dc-canal .nf-nicho { pointer-events: none; }



.dc-canal .nf-card-rodape { grid-template-columns: minmax(0, 1fr); }









@media (prefers-reduced-motion: reduce) {
  .pc-recado, .pc-recado.dentro, .pc-recado.saindo {
    transform: none; transition: opacity 120ms linear;
  }
  .pc-recado-corpo, .pc-recado.dentro .pc-recado-corpo {
    scale: 1; rotate: 0deg; transition: none;
  }
  


  .pc-recado, .pc-recado *, .pc-recado::after,
  .dc-cx, .dc-cx *, .dc-painel { animation: none !important; }
  .pc-recado-luz { opacity: 0 !important; }
  .pc-recado-luz { opacity: 0; }
  .dc-painel { transform: none; transition: opacity 120ms linear; }
  .dc-cx.dentro .dc-painel { transform: none; }
  .dc-cx.dentro .dc-painel > * { animation: none; opacity: 1; transform: none; }
}







@media (max-width: 420px) {
  .pc-recado { right: 8px; left: 8px; bottom: 8px; width: auto; }
}
