:root{
  --fundo:#0d0d10; --painel:#16161b; --painel2:#1e1e25; --borda:#2a2a33;
  --texto:#f2f2f5; --suave:#9a9aa8; --acento:#c8a24a; --acento2:#e3c274;
  --ok:#3fbf7f; --nao:#e05a4f; --espera:#e0a83f;
  --r:14px; --sombra:0 8px 30px rgba(0,0,0,.45);
}
*{box-sizing:border-box;margin:0;padding:0}
/* regras com display: flex/grid sobrescrevem o hidden do navegador — esta linha reverte isso */
[hidden]{display:none !important}
html,body{background:var(--fundo);color:var(--texto);
  font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,sans-serif;
  -webkit-font-smoothing:antialiased}
body{padding-bottom:env(safe-area-inset-bottom)}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--acento2)}

/* ---------------------------------------------------------- LOGIN */
.login{min-height:100dvh;display:grid;place-items:center;padding:24px}
.login-caixa{width:100%;max-width:380px;background:var(--painel);border:1px solid var(--borda);
  border-radius:20px;padding:32px 26px;box-shadow:var(--sombra)}
.marca{display:flex;align-items:center;gap:14px;margin-bottom:28px}
.marca-ponto{width:38px;height:38px;border-radius:12px;flex:0 0 auto;
  background:linear-gradient(135deg,var(--acento),#8c6c22)}
.marca h1{font-size:19px;font-weight:650;letter-spacing:-.2px}
.marca p{font-size:13px;color:var(--suave)}
label{display:block;font-size:13px;color:var(--suave);margin-bottom:14px}
input,select,textarea{width:100%;margin-top:6px;background:var(--painel2);border:1px solid var(--borda);
  border-radius:10px;padding:12px 13px;color:var(--texto);outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--acento)}
textarea{resize:vertical}
button{cursor:pointer;border:none;border-radius:10px;padding:13px;background:var(--acento);
  color:#17130a;font-weight:650;width:100%}
button:active{transform:translateY(1px)}
button:disabled{opacity:.55;cursor:default}
.erro{color:var(--nao);font-size:13px;margin-top:12px}
.rodape-login{margin-top:20px;font-size:12px;color:var(--suave);text-align:center;line-height:1.45}

/* ---------------------------------------------------------- TOPO */
.topo{position:sticky;top:0;z-index:20;background:rgba(13,13,16,.92);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--borda);padding:16px 18px 12px;padding-top:calc(16px + env(safe-area-inset-top))}
.topo-linha{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.topo h2{font-size:18px;font-weight:650;letter-spacing:-.2px}
.arroba{font-size:13px;color:var(--suave)}
.sair{width:auto;background:transparent;border:1px solid var(--borda);color:var(--suave);
  padding:7px 13px;font-size:13px;font-weight:500}
.contrato{display:flex;align-items:center;gap:9px;margin-top:12px}
.contrato-barra{flex:1;height:3px;background:var(--painel2);border-radius:2px;overflow:hidden}
.contrato-barra span{display:block;height:100%;background:var(--acento);opacity:.65}
.contrato>span{font-size:11px;color:var(--suave);white-space:nowrap}

main{padding:18px 18px 96px;max-width:760px;margin:0 auto}
.titulo-aba{font-size:14px;font-weight:600;color:var(--suave);margin:22px 0 12px;
  text-transform:uppercase;letter-spacing:.6px}
.titulo-aba:first-child{margin-top:4px}
.vazio{color:var(--suave);font-size:14px;text-align:center;padding:40px 0}

/* ---------------------------------------------------------- MESES */
.meses{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin-bottom:16px;scrollbar-width:none}
.meses::-webkit-scrollbar{display:none}
.mes{width:auto;flex:0 0 auto;background:var(--painel);border:1px solid var(--borda);color:var(--suave);
  padding:9px 15px;font-size:14px;font-weight:500;border-radius:999px}
.mes.ativo{background:var(--acento);color:#17130a;border-color:var(--acento);font-weight:650}
.mes .pend{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--espera);
  margin-left:7px;vertical-align:middle}

.resumo-ciclo{background:var(--painel);border:1px solid var(--borda);border-radius:var(--r);
  padding:14px 16px;margin-bottom:16px;font-size:14px;color:var(--suave);line-height:1.55}

/* ---------------------------------------------------------- GRADE (feed) */
.grade{display:grid;grid-template-columns:repeat(3,1fr);gap:3px}
@media(min-width:620px){.grade{gap:6px}}
.peca{position:relative;aspect-ratio:4/5;background:var(--painel2);border-radius:4px;overflow:hidden;
  border:none;padding:0;width:100%;display:block}
.peca img,.peca video{width:100%;height:100%;object-fit:cover;display:block}
.peca-vazia{display:flex;align-items:center;justify-content:center;height:100%;
  font-size:11px;color:var(--suave);text-align:center;padding:8px;line-height:1.35}
.peca .marcador{position:absolute;top:6px;right:6px;width:18px;height:18px;border-radius:50%;
  display:grid;place-items:center;font-size:10px;font-weight:700;color:#0d0d10}
.m-aprovado{background:var(--ok)} .m-reprovado{background:var(--nao);color:#fff}
.m-espera{background:var(--espera)} .m-publicado{background:#7aa2f7}
.peca .tipo{position:absolute;bottom:5px;left:6px;font-size:9px;letter-spacing:.5px;
  text-transform:uppercase;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.9)}
.peca.extra{aspect-ratio:4/5;background:linear-gradient(150deg,#22222b,#16161b)}

/* ---------------------------------------------------------- MODAL */
.modal{position:fixed;inset:0;z-index:60;display:flex;align-items:flex-end;justify-content:center}
@media(min-width:620px){.modal{align-items:center}}
.modal-fundo{position:absolute;inset:0;background:rgba(0,0,0,.72)}
.modal-caixa{position:relative;background:var(--painel);width:100%;max-width:460px;max-height:92dvh;
  overflow-y:auto;border-radius:20px 20px 0 0;box-shadow:var(--sombra)}
@media(min-width:620px){.modal-caixa{border-radius:20px}}
.modal-x{position:absolute;top:12px;right:12px;z-index:2;width:32px;height:32px;padding:0;
  border-radius:50%;background:rgba(0,0,0,.55);color:#fff;font-size:15px}
.modal-midia{background:#000;display:grid;place-items:center;min-height:120px}
.modal-midia img,.modal-midia video{width:100%;display:block;max-height:58dvh;object-fit:contain}
.modal-midia .sem-midia{padding:44px 20px;color:var(--suave);font-size:13px;text-align:center}
.modal-corpo{padding:18px}
.modal-cabec{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.selo{font-size:11px;font-weight:650;padding:4px 10px;border-radius:999px;letter-spacing:.3px}
.s-aprovado{background:rgba(63,191,127,.16);color:var(--ok)}
.s-reprovado{background:rgba(224,90,79,.16);color:var(--nao)}
.s-espera{background:rgba(224,168,63,.16);color:var(--espera)}
.s-publicado{background:rgba(122,162,247,.16);color:#7aa2f7}
.modal-meta{font-size:12px;color:var(--suave)}
.modal-corpo h4{font-size:16px;font-weight:600;margin-bottom:10px}
.legenda{font-size:14px;white-space:pre-wrap;line-height:1.6;color:#dcdce4}
.hashtags{font-size:13px;color:#7aa2f7;margin-top:8px;word-break:break-word}
.metrica{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px;
  padding-top:16px;border-top:1px solid var(--borda)}
.metrica div{text-align:center}
.metrica b{display:block;font-size:17px;font-weight:650}
.metrica span{font-size:11px;color:var(--suave)}
.acoes{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}
.btn-aprovar{background:var(--ok);color:#062b18}
.btn-reprovar{background:transparent;border:1px solid var(--nao);color:var(--nao)}
.btn-fantasma{background:transparent;border:1px solid var(--borda);color:var(--suave)}
.reprovar{margin-top:18px;padding-top:18px;border-top:1px solid var(--borda)}
.dupla{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.opcional{color:var(--suave);font-weight:400;text-transform:none}
.decidido{margin-top:18px;padding:12px 14px;background:var(--painel2);border-radius:10px;
  font-size:13px;color:var(--suave);line-height:1.5}

/* ---------------------------------------------------------- CARTÕES */
.cartao{background:var(--painel);border:1px solid var(--borda);border-radius:var(--r);
  padding:16px;margin-bottom:12px}
.cartao h4{font-size:15px;font-weight:600;margin-bottom:6px}
.cartao p{font-size:14px;color:#c9c9d4;line-height:1.55}
.etiqueta{display:inline-block;font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px;
  background:var(--painel2);color:var(--suave);margin-bottom:8px;letter-spacing:.3px}
.et-alta{background:rgba(200,162,74,.16);color:var(--acento2)}
.cartao .quando{font-size:12px;color:var(--suave);margin-top:8px}
.comentarios{margin-top:12px;padding-top:12px;border-top:1px solid var(--borda)}
.comentario{background:var(--painel2);border-radius:9px;padding:9px 11px;margin-bottom:7px;font-size:13px}
.comentario small{display:block;color:var(--suave);font-size:11px;margin-top:4px}
.form-comentario{display:flex;gap:8px;margin-top:8px}
.form-comentario input{margin-top:0}
.form-comentario button{width:auto;padding:11px 16px;flex:0 0 auto}

/* ---------------------------------------------------------- NAV */
.navegacao{position:fixed;bottom:0;left:0;right:0;z-index:30;display:grid;grid-template-columns:repeat(4,1fr);
  background:rgba(13,13,16,.95);backdrop-filter:blur(12px);border-top:1px solid var(--borda);
  padding-bottom:env(safe-area-inset-bottom)}
.navegacao button{background:none;border:none;border-radius:0;color:var(--suave);font-size:11px;
  font-weight:500;padding:11px 4px 13px;display:flex;flex-direction:column;align-items:center;gap:3px}
.navegacao button span{font-size:17px;line-height:1}
.navegacao button.ativo{color:var(--acento2)}

/* ---------------------------------------------------------- AVISO */
.aviso{position:fixed;left:50%;transform:translateX(-50%);bottom:88px;z-index:80;
  background:var(--painel2);border:1px solid var(--borda);border-radius:999px;padding:11px 20px;
  font-size:14px;box-shadow:var(--sombra);max-width:88vw;text-align:center}
.aviso.bom{border-color:var(--ok);color:var(--ok)}
.aviso.ruim{border-color:var(--nao);color:var(--nao)}