/* Caixa de e-mail: palco fixo abaixo do topo; as "portas" são duas cópias da tela, cada uma recortada numa metade */
.cx-botao{margin-bottom:14px}
.cx-botao .badge{background:var(--ouro)}
html.cx-travado,html.cx-travado body{overflow:hidden}
.cx-palco{position:fixed;left:0;right:0;bottom:0;top:0;z-index:15;overflow:hidden;perspective:1600px;
  background:radial-gradient(ellipse at 50% 40%,#1d3a5c 0%,var(--marinho) 70%)}
.cx-porta{position:absolute;inset:0;overflow:hidden;background:var(--fundo);pointer-events:none;
  transition:transform 1s cubic-bezier(.7,0,.25,1),opacity 1s ease .25s,filter 1s ease}
.cx-porta.esq{clip-path:inset(0 50% 0 0);transform-origin:0 50%}
.cx-porta.dir{clip-path:inset(0 0 0 50%);transform-origin:100% 50%}
.cx-porta::after{content:'';position:absolute;top:0;bottom:0;width:28px;left:calc(50% - 28px);background:linear-gradient(90deg,transparent,#0f223855)}
.cx-porta.dir::after{left:50%;background:linear-gradient(270deg,transparent,#0f223855)}
.cx-palco.aberto .cx-porta.esq{transform:translateX(-52%) rotateY(14deg);opacity:0;filter:brightness(.8)}
.cx-palco.aberto .cx-porta.dir{transform:translateX(52%) rotateY(-14deg);opacity:0;filter:brightness(.8)}
.cx-caixa{position:absolute;inset:14px 20px;display:grid;grid-template-columns:400px 1fr;background:#fff;border-radius:16px;overflow:hidden;
  box-shadow:0 0 0 1px #c9a24a55,0 30px 80px #0008;transform:scale(.9);opacity:0;transition:transform .9s cubic-bezier(.2,.8,.2,1) .3s,opacity .6s ease .3s}
.cx-palco.aberto .cx-caixa{transform:none;opacity:1}
@media (prefers-reduced-motion:reduce){.cx-porta,.cx-caixa{transition:none!important}}

.cx-lado{display:flex;flex-direction:column;min-height:0;border-right:1px solid var(--linha);background:#fbfbfc}
.cx-cab{display:flex;align-items:center;gap:8px;padding:12px 14px;background:var(--marinho);color:#fff}
.cx-cab>div{flex:1;min-width:0}.cx-cab b{display:block;font-size:15px}.cx-cab small{color:#ffffffaa;font-size:11.5px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cx-fechar{border:0;background:#ffffff1f;color:#fff;width:32px;height:32px;border-radius:50%;font-size:20px;cursor:pointer;flex:none}
.cx-fechar:hover{background:var(--ouro)}
.cx-filtros{display:flex;gap:5px;flex-wrap:wrap;padding:10px 12px 4px}
.cx-filtros button{border:1px solid var(--linha);background:#fff;border-radius:99px;padding:4px 10px;font-size:12px;cursor:pointer;font-weight:600;color:var(--texto)}
.cx-filtros button.ativa{background:var(--marinho);border-color:var(--marinho);color:#fff}
.cx-filtros em{font-style:normal;background:var(--ouro);color:#fff;border-radius:99px;padding:0 6px;margin-left:3px;font-size:11px}
.cx-lado>input{margin:6px 12px;width:auto;border-radius:99px;padding:7px 14px}
#cx-aviso .aviso{margin:4px 12px}.cx-erro{background:#fbe9e7!important;border-color:#f0b8b0!important;color:#8a2a20!important}
.cx-lista{overflow:auto;flex:1}
.cx-item{display:flex;flex-direction:column;gap:2px;width:100%;text-align:left;border:0;border-bottom:1px solid #eef0f2;background:none;padding:10px 14px;cursor:pointer;color:var(--texto);font:inherit}
.cx-item:hover{background:#f3f4f6}.cx-item.ativo{background:var(--ouro-claro)}
.cx-item.nao-lida{border-left:4px solid var(--ouro);padding-left:10px}.cx-item.nao-lida .cx-assunto,.cx-item.nao-lida b{font-weight:800}
.cx-l1{display:flex;gap:6px;align-items:center}.cx-l1 b{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600}
.cx-l1 i{font-style:normal;font-size:11px;color:var(--mudo)}.cx-l1 span{font-size:11.5px;color:var(--mudo);flex:none}
.cx-assunto{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cx-trecho{font-size:12px;color:var(--mudo);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cx-selos{display:flex;gap:4px;flex-wrap:wrap;margin-top:2px}.cx-selos:empty{display:none}

.cx-leitura{overflow:auto;min-height:0;background:var(--fundo);display:flex;flex-direction:column}
.cx-vazio{margin:auto;text-align:center;max-width:380px;padding:30px}.cx-vazio span{font-size:44px}
.cx-leitura-cab{background:#fff;padding:16px 22px;border-bottom:1px solid var(--linha)}
.cx-leitura-cab h2{margin:0 0 6px}.cx-acoes{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.cx-voltar{display:none;margin-bottom:8px}
.cx-transbordo{display:grid;grid-template-columns:240px 1fr auto;gap:10px;align-items:end;padding:10px 22px;background:var(--ouro-claro);border-bottom:1px solid #ead9a8}
.cx-transbordo label{margin:0}
.cx-trilha{padding:8px 22px;font-size:12px;color:var(--mudo);border-bottom:1px solid var(--linha);background:#fff}
.cx-fio{padding:14px 22px;display:flex;flex-direction:column;gap:10px}
.cx-msg{background:#fff;border:1px solid var(--linha);border-radius:12px;padding:12px 16px}
.cx-msg.nossa{border-left:4px solid var(--verde)}
.cx-msg header{margin-bottom:8px}.cx-data{float:right;font-size:12px}
.cx-corpo{white-space:pre-wrap;word-wrap:break-word;line-height:1.55;font-size:14px}
.cx-corpo a{color:var(--azul)}
.cx-cit{margin-top:8px}.cx-cit summary{cursor:pointer;color:var(--mudo);font-size:12px}.cx-cit .cx-corpo{color:var(--mudo);font-size:13px}
.cx-responder{padding:4px 22px 22px;margin-top:auto}
.cx-responder textarea{min-height:110px}

@media (max-width:900px){
  .cx-caixa{inset:0;border-radius:0;grid-template-columns:minmax(0,1fr)}
  .cx-lado,.cx-leitura{min-width:0}.cx-filtros{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.cx-filtros button{flex:none}
  .cx-caixa.lendo .cx-lado{display:none}.cx-caixa:not(.lendo) .cx-leitura{display:none}
  .cx-voltar{display:inline-flex}
  .cx-transbordo{grid-template-columns:1fr}
  .cx-leitura-cab,.cx-fio,.cx-responder,.cx-transbordo,.cx-trilha{padding-left:16px;padding-right:16px}
}