/* Editorial de aprovação do PosteAí — identidade EcomSmart v3.0 "O dado" (Figtree, #0A5BF0 / #0B1033, céu #EEF4FF), claro e escuro. */
@font-face{font-family:"Figtree";font-style:normal;font-weight:300 900;font-display:swap;src:url("/editorial/static/figtree-latin.woff2") format("woff2")}
:root{
  --bg:#F6F8FC; --sup:#FFFFFF; --sup2:#EEF1F7; --linha:#E1E6F0; --tinta:#0B1033; --tinta2:#4A5670; --tinta3:#6B7790;
  --azul:#0A5BF0; --azul-h:#0849C4; --azul-s:#EEF4FF; --azul-l:#D3E2FF; --navy:#0B1033;
  --ok:#16A34A; --ok-t:#15803D; --ok-s:#E8F6EE; --aj:#D97706; --aj-t:#B45309; --aj-s:#FEF6E7; --aj-l:#F7D9A6; --erro:#DC2626; --erro-s:#FDECEC;
  --erro-t:#B91C1C; --erro-l:#F6C9C9;
  --vazio:#C9D1DF;
  --sombra:0 30px 80px -30px rgba(11,16,51,.35);
  --sombra-s:0 1px 2px rgba(11,16,51,.05),0 8px 24px -16px rgba(11,16,51,.18);
  --fonte:"Figtree",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
:root[data-theme="dark"]{
  --bg:#0A0F1F; --sup:#101729; --sup2:#182238; --linha:#1E2A44; --tinta:#EEF2FA; --tinta2:#B7C1D9; --tinta3:#8A97B3;
  --azul:#5A8CFA; --azul-h:#8DB0FF; --azul-s:#132446; --azul-l:#2A4A8C; --navy:#1B2A55;
  --ok:#4ADE80; --ok-t:#4ADE80; --ok-s:#10291B; --aj:#F0A62E; --aj-t:#F0A62E; --aj-s:#2C2312; --aj-l:#5A4116; --erro:#F87171; --erro-s:#2E1616;
  --erro-t:#FCA5A5; --erro-l:#5C2626;
  --vazio:#34405C;
  --sombra:0 30px 80px -30px rgba(0,0,0,.7);
  --sombra-s:0 1px 2px rgba(0,0,0,.3),0 8px 24px -16px rgba(0,0,0,.6);
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{scrollbar-gutter:stable}
html,body{background:var(--bg);color:var(--tinta);font:15px/1.5 var(--fonte);-webkit-font-smoothing:antialiased}
button,input,textarea,select{font:inherit;color:inherit}
a{color:var(--azul)}
:focus-visible{outline:2px solid var(--azul);outline-offset:2px}
.sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- cabeçalho ---------- */
.topo{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--sup) 92%,transparent);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--linha)}
.topo-in{max-width:1440px;margin:0 auto;padding:14px 32px;display:flex;align-items:center;gap:18px}
.topo .logo{width:44px;height:44px;border-radius:50%;object-fit:cover;background:var(--sup2);flex:none;border:1px solid var(--linha)}
.topo h1{font-size:22px;font-weight:750;letter-spacing:-.03em;line-height:1.2}
.topo .sub{color:var(--tinta3);font-size:14px}
.topo .dir{margin-left:auto;display:flex;align-items:center;gap:12px}
.progresso{display:flex;align-items:center;gap:12px;color:var(--tinta2);font-size:14px;white-space:nowrap}
.progresso b{color:var(--azul);font-weight:800;font-variant-numeric:tabular-nums}
/* "N já publicados" (fora da conta): ao lado no desktop, na linha de baixo no celular (cabe com "Copiar resumo") */
#n-publicados:not(:empty)::before{content:" · "}
.barra{width:150px;height:6px;border-radius:999px;background:var(--sup2);overflow:hidden}
.barra span{display:block;height:100%;width:0;background:var(--ok);border-radius:999px;transition:width .4s}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;padding:11px 20px;font-weight:600;font-size:14px;cursor:pointer;border:1px solid transparent;white-space:nowrap;text-decoration:none;transition:background-color .15s,border-color .15s,color .15s}
.btn svg{width:16px;height:16px;flex:none}
.btn-pri{background:var(--azul);color:#fff}
.btn-pri:hover{background:var(--azul-h)}
:root[data-theme="dark"] .btn-pri{color:#06102A}
.btn-sec{background:var(--sup);border-color:var(--linha);color:var(--tinta)}
.btn-sec:hover{border-color:var(--azul);color:var(--azul)}
.btn-ok{background:var(--ok);color:#fff}
.btn-ok:hover{background:var(--ok-t)}
:root[data-theme="dark"] .btn-ok{color:#06210F}
.btn-aj{background:transparent;border-color:var(--aj);color:var(--aj-t)}
.btn-aj:hover{background:var(--aj-s)}
.btn:disabled{opacity:.55;cursor:default}
.icone{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--linha);background:var(--sup);cursor:pointer;color:var(--tinta2);flex:none}
.icone:hover{color:var(--azul);border-color:var(--azul)}
.icone svg{width:18px;height:18px}
.icone .sol{display:none}
:root[data-theme="dark"] .icone .lua{display:none}
:root[data-theme="dark"] .icone .sol{display:block}

/* ---------- selos ---------- */
.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:999px;font-size:13px;font-weight:600;white-space:nowrap;background:var(--sup2);color:var(--tinta2);line-height:1.45}
.pill svg{width:13px;height:13px;flex:none}
.pill.aprovado{background:var(--ok-s);color:var(--ok-t)}
.pill.ajuste,.pill.suspenso{background:var(--aj-s);color:var(--aj-t)}
.pill.suspenso{box-shadow:inset 0 0 0 1px var(--aj-l)}
.pill.publicado{background:var(--azul-s);color:var(--azul)}

/* ---------- carregando e erro ---------- */
.carga{display:grid;place-items:center;align-content:center;gap:18px;min-height:60vh;color:var(--tinta2);font-size:16px;text-align:center;padding:24px}
.carga::before{content:"";width:34px;height:34px;border-radius:50%;border:3px solid var(--azul-l);border-top-color:var(--azul);animation:gira .8s linear infinite}
.carga.erro::before{animation:none;border:0;width:52px;height:52px;background:var(--erro-s) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23DC2626' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7.5v5.5M12 16.5v.01'/%3E%3C/svg%3E") center/26px no-repeat}
.carga.entrar::before{background-color:var(--azul-s);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230A5BF0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E")}
.carga .btn{margin-top:4px}
.carga b{color:var(--tinta);font-size:18px;font-weight:650}
@keyframes gira{to{transform:rotate(360deg)}}

/* ---------- 3 colunas (cliente) ---------- */
.palco{max-width:1440px;margin:0 auto;padding:44px 32px 64px;display:grid;grid-template-columns:minmax(0,1fr) 430px minmax(0,1fr);gap:56px;align-items:start}
.rotulo{font-size:17px;font-weight:650;letter-spacing:-.01em;color:var(--tinta);margin-bottom:12px}
.como{justify-self:end;max-width:340px;text-align:right}
.como p{color:var(--tinta2);font-size:16px}
.como p b{color:var(--tinta);font-weight:650}
.como .comecar{margin-top:18px}
.legenda{list-style:none;margin-top:28px;display:grid;gap:10px;justify-items:end;color:var(--tinta2);font-size:15px}
.legenda li{display:flex;align-items:center;gap:10px}
.ponto{width:10px;height:10px;border-radius:50%;flex:none;background:var(--tinta3)}
.ponto.aprovado{background:var(--ok)} .ponto.ajuste{background:var(--aj)} .ponto.aguardando{background:var(--vazio)}
.ponto.pausa{width:18px;height:18px;margin:-4px;background:var(--aj) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Crect x='7' y='6' width='3.4' height='12' rx='1'/%3E%3Crect x='13.6' y='6' width='3.4' height='12' rx='1'/%3E%3C/svg%3E") center/12px no-repeat}

/* ---------- celular ---------- */
.celular{width:430px;border-radius:58px;background:#111522;padding:14px;box-shadow:var(--sombra);position:relative}
.tela{border-radius:46px;background:#fff;color:#0B1033;overflow:hidden;height:860px;display:flex;flex-direction:column}
.status{display:flex;justify-content:space-between;align-items:center;padding:16px 30px 6px;font-weight:600;font-size:16px}
.status .bat{display:flex;gap:6px;align-items:center}
.ig-topo{display:flex;align-items:center;gap:8px;padding:8px 18px;font-weight:700;font-size:21px;letter-spacing:-.01em}
.ig-topo .acoes{margin-left:auto;display:flex;gap:16px}
.ig-topo svg{width:24px;height:24px}
.rolagem{flex:1;overflow-y:auto;scrollbar-width:none}
.rolagem::-webkit-scrollbar{display:none}
.ig-perfil{display:flex;align-items:center;gap:22px;padding:12px 18px 8px}
.anel{width:96px;height:96px;border-radius:50%;padding:3px;background:conic-gradient(from 210deg,#F58529,#DD2A7B,#8134AF,#515BD4,#F58529);flex:none}
.anel img,.anel .vazio{width:100%;height:100%;border-radius:50%;object-fit:cover;border:3px solid #fff;background:#EEF1F7;display:grid;place-items:center;font-weight:700;font-size:30px;color:#0A5BF0}
.numeros{flex:1;display:flex;justify-content:space-around;text-align:center;font-size:14px}
.numeros b{display:block;font-size:18px;font-variant-numeric:tabular-nums}
.ig-bio{padding:4px 18px 12px;font-size:14px;line-height:1.4;white-space:pre-line}
.ig-bio b{display:block;font-size:14px}
.ig-botoes{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:0 18px 12px}
/* P1: botões da moldura são só ilustração (aria-hidden): tom suave, sem cara de clicável */
.ig-botoes span{background:#F2F3F5;color:#6B7280;border-radius:9px;padding:7px 0;text-align:center;font-weight:600;font-size:14px;cursor:default;user-select:none;-webkit-user-select:none;pointer-events:none}
.ig-abas{display:flex;border-top:1px solid #DBDBDB}
.ig-abas span{flex:1;display:grid;place-items:center;padding:10px 0;color:#8E8E8E}
.ig-abas span.on{color:#0B1033;border-bottom:1.5px solid #0B1033}
.ig-abas svg{width:24px;height:24px}
.grade{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}
.celula{position:relative;aspect-ratio:3/4;background:#EFEFEF;cursor:pointer;overflow:hidden;border:0;padding:0;color:#4A5670}
.celula img,.celula video{width:100%;height:100%;object-fit:cover;display:block}
.celula .tipo{position:absolute;top:6px;right:6px;width:20px;height:20px;color:#fff;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}
.celula .selo{position:absolute;left:6px;bottom:6px;width:12px;height:12px;border-radius:50%;border:2px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.celula .selo.aprovado{background:#16A34A} .celula .selo.ajuste{background:#D97706} .celula .selo.aguardando{background:#C9D1DF}
.celula .pausa{position:absolute;left:6px;top:6px;display:flex;align-items:center;gap:4px;background:rgba(180,83,9,.94);color:#fff;font-size:13px;font-weight:700;padding:3px 7px 3px 5px;border-radius:999px;box-shadow:0 1px 4px rgba(0,0,0,.3)}
.celula .pausa svg{width:11px;height:11px}
/* já publicado: selo azul no canto (publicado não fica suspenso, então não disputa o lugar com o "Suspenso") */
.celula .publicado{position:absolute;left:6px;top:6px;background:rgba(10,91,240,.94);color:#fff;font-size:13px;font-weight:700;padding:3px 7px;border-radius:999px;box-shadow:0 1px 4px rgba(0,0,0,.3)}
.celula .selo.publicado{background:#0A5BF0}
.celula .so-texto{position:absolute;inset:0;padding:10px;font-size:13px;line-height:1.3;color:#4A5670;text-align:left;overflow:hidden}
.celula .sem-video{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(160deg,#1B2A55,#0B1033);color:#fff}
.celula .sem-video svg{width:30px;height:30px;opacity:.85}
.celula:hover::after{content:"";position:absolute;inset:0;background:rgba(11,16,51,.18)}
.ig-baixo{display:flex;justify-content:space-around;padding:12px 0 22px;border-top:1px solid #DBDBDB;background:#fff}
.ig-baixo svg{width:26px;height:26px}
.ig-baixo .mini{width:28px;height:28px;border-radius:50%;object-fit:cover;border:1.5px solid #0B1033}

/* ---------- calendário ---------- */
/* a lista tem uma trilha que pode encolher (minmax(0,1fr)): o min-content dos selos nunca alarga a coluna */
.agenda{max-width:500px;min-width:0;container-type:inline-size}
.lista{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
.item{min-width:0;display:flex;align-items:center;gap:16px;background:var(--sup);border:1px solid var(--linha);border-radius:18px;padding:12px 16px 12px 12px;cursor:pointer;text-align:left;width:100%;transition:border-color .15s,box-shadow .15s}
.item:hover{border-color:var(--azul);box-shadow:var(--sombra-s)}
.item.suspenso{border-color:var(--aj-l);background:linear-gradient(90deg,var(--aj-s),var(--sup) 60%)}
.dia{width:64px;height:68px;border-radius:14px;background:var(--navy);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;flex:none}
.dia b{font-size:25px;line-height:1;font-variant-numeric:tabular-nums;font-weight:700}
.dia span{font-size:13px;margin-top:4px;opacity:.8}
.item.aprovado .dia{background:var(--ok)}
:root[data-theme="dark"] .item.aprovado .dia{background:#166534}
.item.ajuste .dia{background:var(--aj)}
:root[data-theme="dark"] .item.ajuste .dia{background:#92400E}
.item .meio{flex:1;min-width:0;display:grid;gap:2px}
.item .tit{font-weight:600;font-size:15.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.item .cat{color:var(--tinta3);font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.item .meio .pill{justify-self:start;margin-top:4px;font-size:13px;padding:3px 10px;max-width:100%;white-space:normal;text-align:left}
.item > .pill{flex:none}
.item .meio .pill.estado-m{display:none}
/* coluna estreita (3 colunas em 1366/1440 px, ou celular): o selo de status desce para baixo do título */
@container (max-width:470px){.item > .pill{display:none}.item .meio .pill.estado-m{display:inline-flex}.item{gap:12px}}
.vazio-lista{border:1.5px dashed var(--linha);border-radius:18px;padding:32px 24px;text-align:center;color:var(--tinta2);background:var(--sup)}
.vazio-lista b{display:block;color:var(--tinta);font-size:16px;margin-bottom:4px}

/* ---------- modal do post ---------- */
.modal{position:fixed;inset:0;z-index:50;background:rgba(6,10,30,.66);display:grid;place-items:center;padding:24px;animation:surge .18s ease-out}
.caixa{background:var(--sup);border-radius:22px;width:min(1080px,100%);max-height:calc(100vh - 48px);display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,1fr);overflow:hidden;box-shadow:0 24px 64px rgba(11,16,51,.35)}
@keyframes surge{from{opacity:0}}
.visor{background:#0B1033;position:relative;display:flex;align-items:center;justify-content:center;min-height:420px}
.visor img,.visor video{max-width:100%;max-height:calc(100vh - 48px);display:block;object-fit:contain}
.visor .seta{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:#0B1033;cursor:pointer;display:grid;place-items:center;box-shadow:0 2px 10px rgba(0,0,0,.25)}
.visor .seta svg{width:18px;height:18px}
.visor .ant{left:12px} .visor .prox{right:12px}
.visor .pontos{position:absolute;bottom:14px;left:0;right:0;display:flex;justify-content:center;gap:6px}
.visor .pontos i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.45)}
.visor .pontos i.on{background:#fff}
.visor .contador{position:absolute;top:14px;right:14px;background:rgba(11,16,51,.7);color:#fff;font-size:13px;font-weight:600;padding:4px 10px;border-radius:999px}
.visor .sem-midia{color:#B9CEFF;padding:40px;text-align:center;display:grid;gap:8px;justify-items:center;max-width:340px}
.visor .sem-midia b{color:#fff;font-size:16px;font-weight:650}
.visor .sem-midia span{font-size:14px}
/* post só de texto: o texto é o próprio post */
.cartao-texto{margin:40px 32px;max-width:420px;background:#fff;color:#0B1033;border-radius:18px;padding:28px 26px 30px;box-shadow:0 20px 50px -20px rgba(0,0,0,.6);display:grid;gap:14px}
.cartao-texto .etq{justify-self:start;font-size:13px;font-weight:650;color:#4A5670;background:#EEF1F7;border-radius:999px;padding:3px 10px}
.cartao-texto p{font-size:20px;line-height:1.4;font-weight:600;letter-spacing:-.01em;white-space:pre-line}
.visor .sem-midia svg{width:36px;height:36px;opacity:.8}
.visor .nota-midia{position:absolute;left:14px;bottom:14px;right:14px;justify-self:center;width:max-content;max-width:calc(100% - 28px);margin:0 auto;background:rgba(11,16,51,.78);color:#fff;font-size:13px;font-weight:600;padding:7px 14px;border-radius:999px;display:flex;align-items:center;gap:8px}
.visor .nota-midia svg{width:15px;height:15px;flex:none}
.lado{display:flex;flex-direction:column;min-height:0}
.lado-topo{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--linha)}
.lado-topo .avatar{width:36px;height:36px;border-radius:50%;flex:none;padding:2px;background:conic-gradient(from 210deg,#F58529,#DD2A7B,#8134AF,#515BD4,#F58529)}
.lado-topo .avatar img,.lado-topo .avatar .vazio{width:100%;height:100%;border-radius:50%;object-fit:cover;border:2px solid var(--sup);background:var(--sup2);display:grid;place-items:center;font-weight:700;font-size:14px;color:var(--azul)}
.lado-topo .quem{flex:1;min-width:0}
.lado-topo .quem b{display:block;font-size:15px}
.lado-topo .quem span{color:var(--tinta3);font-size:13px}
.fechar{background:none;border:0;width:36px;height:36px;border-radius:50%;font-size:26px;line-height:1;color:var(--tinta3);cursor:pointer;display:grid;place-items:center}
.fechar:hover{background:var(--sup2);color:var(--tinta)}
.legenda-post{flex:1;overflow-y:auto;padding:18px 20px;white-space:pre-line;font-size:15px;color:var(--tinta)}
.legenda-post .meta{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.decidir{border-top:1px solid var(--linha);padding:16px 20px;display:grid;gap:12px;background:var(--sup)}
.decidir .linha{display:flex;gap:10px;flex-wrap:wrap}
.decidir .linha .btn{flex:1}
.suspensa{display:flex;gap:12px;align-items:flex-start;background:var(--aj-s);border:1px solid var(--aj-l);color:var(--tinta);border-radius:14px;padding:12px 14px;font-size:14px}
.suspensa .ic{width:30px;height:30px;border-radius:50%;background:var(--aj);color:#fff;display:grid;place-items:center;flex:none}
.suspensa .ic svg{width:14px;height:14px}
.suspensa b{display:block;color:var(--aj-t);font-size:15px}
.suspensa span{color:var(--tinta2)}
.campo{display:grid;gap:6px}
.campo span{font-size:13px;font-weight:600;color:var(--tinta2)}
.campo input,.campo textarea,.campo select{width:100%;border:1px solid var(--linha);border-radius:12px;padding:10px 12px;background:var(--bg);transition:border-color .15s}
.campo input:hover,.campo textarea:hover,.campo select:hover{border-color:var(--azul-l)}
.campo textarea{min-height:84px;resize:vertical}
.campo input:focus,.campo textarea:focus,.campo select:focus{outline:2px solid var(--azul);outline-offset:0;border-color:transparent}
.decisao-atual{font-size:13.5px;color:var(--tinta2);background:var(--sup2);border-radius:12px;padding:10px 12px;display:flex;gap:12px;align-items:flex-start}
.decisao-atual .txt{flex:1;min-width:0}
.decisao-atual b{color:var(--tinta)}
.decisao-atual.aprovado{background:var(--ok-s)} .decisao-atual.aprovado b{color:var(--ok-t)}
.decisao-atual.ajuste{background:var(--aj-s)} .decisao-atual.ajuste b{color:var(--aj-t)}
.desfazer{background:none;border:0;color:var(--azul);font-weight:600;font-size:13.5px;cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.desfazer:hover{color:var(--azul-h)}
/* depois de decidir: o próximo passo é um botão (sem salto automático) */
.seguir{display:grid;gap:10px}
.seguir #m-proximo{display:grid;justify-items:center;gap:1px;padding:10px 20px;border-radius:16px;white-space:normal;text-align:center}
.seguir #m-proximo small{font-weight:500;font-size:13px;opacity:.85;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.seguir .fim{display:grid;gap:2px;text-align:center;background:var(--ok-s);border-radius:14px;padding:12px 14px}
.seguir .fim b{color:var(--ok-t);font-size:15.5px}
.seguir .fim span{color:var(--tinta2);font-size:14px}
/* prévia da agência */
.faixa-previa{background:var(--navy);color:#fff;border-bottom:1px solid rgba(255,255,255,.08)}
:root[data-theme="dark"] .faixa-previa{background:#1B2A55}
.faixa-in{max-width:1440px;margin:0 auto;padding:10px 32px;display:flex;align-items:center;gap:14px}
.faixa-in p{flex:1;min-width:0;font-size:14.5px;color:#D6E0F5}
.faixa-in p b{color:#fff;font-weight:650}
.faixa-in .olho{width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.12);display:grid;place-items:center;flex:none}
.faixa-in .olho svg{width:17px;height:17px}
.btn-claro{background:#fff;color:#0B1033;padding:8px 16px;font-size:13.5px}
.btn-claro:hover{background:#E6EEFF}
.previa-nota{font-size:14px;color:var(--tinta2);background:var(--azul-s);border:1px solid var(--azul-l);border-radius:12px;padding:12px 14px;display:grid;gap:6px;justify-items:start}
.previa-nota b{color:var(--tinta);font-weight:650}
.aviso{position:fixed;left:50%;top:20px;transform:translateX(-50%);z-index:60;background:var(--navy);color:#fff;font-weight:600;font-size:14px;padding:12px 22px;border-radius:999px;box-shadow:0 8px 24px rgba(11,16,51,.3);display:flex;align-items:center;gap:10px;max-width:calc(100vw - 32px);text-align:center;opacity:0;pointer-events:none;translate:0 -8px;transition:opacity .2s,translate .2s}
.aviso.on{opacity:1;translate:0 0}
.aviso{line-height:1.35}
.aviso:empty{padding:0;box-shadow:none}
.aviso:empty::before{display:none}
.aviso::before{content:"";width:18px;height:18px;flex:none;border-radius:50%;background:#4ADE80 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2306210F' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center/12px no-repeat}
.aviso.erro{background:#B91C1C}
.aviso.erro::before{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B91C1C' stroke-width='3.2' stroke-linecap='round'%3E%3Cpath d='M12 6v7M12 17.5v.01'/%3E%3C/svg%3E") center/12px no-repeat}
.rodape{text-align:center;color:var(--tinta3);font-size:13px;padding:0 24px 32px}
.rodape a{color:var(--tinta2);text-decoration:none;font-weight:600}

/* ---------- quem decide (P3), post publicado e link de um post ---------- */
.quem-decide{display:flex;align-items:center;gap:4px 10px;flex-wrap:wrap;font-size:14px;color:var(--tinta2)}
.quem-decide b{color:var(--tinta);font-weight:650}
.campo .dica{font-size:13px;line-height:1.35;color:var(--tinta3)}
.campo .dica:empty{display:none}
.campo .dica.falta{color:var(--aj-t);font-weight:600}
.campo .dica.pronto{color:var(--ok-t)}
.publicado-nota{display:flex;gap:12px;align-items:flex-start;background:var(--ok-s);border-radius:14px;padding:12px 14px;font-size:14px}
.publicado-nota .ic{width:30px;height:30px;border-radius:50%;background:var(--ok);color:#fff;display:grid;place-items:center;flex:none}
:root[data-theme="dark"] .publicado-nota .ic{color:#06210F}
.publicado-nota .ic svg{width:15px;height:15px}
.publicado-nota b{display:block;color:var(--ok-t);font-size:15px}
.publicado-nota span{color:var(--tinta2)}
.previa-acoes{display:flex;flex-wrap:wrap;gap:4px 18px}
.link-post-res{justify-self:stretch;display:grid}
.link-post{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 10px;align-items:center;background:var(--sup);border:1px solid var(--azul-l);border-radius:14px;padding:10px 12px;animation:surge .2s ease-out}
.lp-ic{width:28px;height:28px;border-radius:50%;background:var(--ok);color:#fff;display:grid;place-items:center;flex:none}
:root[data-theme="dark"] .lp-ic{color:#06210F}
.lp-ic svg{width:14px;height:14px}
.lp-txt{display:grid;line-height:1.3;min-width:0}
.lp-txt b{font-size:14.5px;color:var(--tinta);font-weight:650}
.lp-txt small{font-size:13px;color:var(--tinta3)}
.lp-url{grid-column:1/-1;width:100%;min-width:0;min-height:40px;border:1px solid var(--linha);border-radius:10px;padding:8px 10px;background:var(--bg);font-size:13.5px;color:var(--tinta);text-overflow:ellipsis}
.lp-url:focus{outline:2px solid var(--azul);outline-offset:0;border-color:transparent}
/* P4: atalhos por post na lista de atenção */
.at-acoes{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding-top:2px}
.at-acoes .btn{padding:8px 14px;font-size:13.5px}
.at-acoes .md-cal-erro{flex-basis:100%;max-width:none;text-align:left}
.at-link-res:empty{display:none}

/* ---------- link de um post só (/aprovar/p/<token>): o post é a página ---------- */
body.modo-post .palco,body.modo-post #btn-resumo,body.modo-post .progresso,body.modo-post .fechar,body.modo-post .faixa-previa{display:none}
.post-unico{max-width:1180px;margin:0 auto;padding:32px 32px 28px}
body.modo-post .modal{position:static;inset:auto;z-index:auto;background:none;padding:0;animation:none;display:grid;place-items:start center}
body.modo-post .caixa{max-height:none;border:1px solid var(--linha);box-shadow:var(--sombra)}
body.modo-post .topo-in{flex-wrap:nowrap}
body.modo-post .topo .dir{width:auto;margin-left:auto}
body.modo-post .topo-in > div:nth-child(2){min-width:0}
body.modo-post .topo .sub{overflow-wrap:anywhere}
body.modo-post .legenda-post{max-height:none}

/* P2: no computador, a moldura do post tem a proporção da 1ª mídia (medida no navegador) */
@media (min-width:901px){
  .caixa{width:auto;max-width:100%;grid-template-columns:auto minmax(340px,420px);background:#0B1033}
  .lado{background:var(--sup)}
  .visor{--alt:min(calc(100vh - 48px),760px);min-width:360px;align-self:center}
  body.modo-post .visor{--alt:max(440px,min(calc(100vh - 180px),760px))}
  .visor.medida{aspect-ratio:var(--ar);height:min(var(--alt),calc(680px / var(--ar)),calc((100vw - 440px) / var(--ar)));min-height:0;min-width:0}
  .visor.medida img,.visor.medida video{width:100%;height:100%;max-height:none;object-fit:contain}
  /* post único (pós-entrega 2): a altura do cartão é a da mídia; a coluna do texto não estica a linha (contain:size)
     e rola por dentro quando cresce (avisos de decisão e suspensão). Sem faixas em cima e embaixo da foto. */
  body.modo-post .lado{contain:size;min-height:440px;overflow-y:auto}
  body.modo-post .legenda-post{min-height:72px}
}

/* ---------- página da agência ---------- */
.marca{display:flex;align-items:center;gap:10px;font-weight:700;font-size:19px;letter-spacing:-.02em;text-decoration:none;color:var(--tinta);flex:none}
.marca img{width:20px}
.topo .titulo{padding-left:18px;border-left:1px solid var(--linha);min-width:0}
.ag{max-width:1080px;margin:0 auto;padding:36px 32px 72px;display:grid;gap:24px}
.cartao{background:var(--sup);border:1px solid var(--linha);border-radius:20px;padding:28px;box-shadow:var(--sombra-s)}
.cartao h2{font-size:20px;font-weight:650;letter-spacing:-.02em;margin-bottom:4px}
.cartao .ajuda{color:var(--tinta2);margin-bottom:22px;max-width:68ch}
.cab-cartao{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.cab-cartao .conta{color:var(--tinta3);font-size:14px;font-weight:600}
.form{display:grid;grid-template-columns:1.4fr 1fr;gap:16px}
.form .bio{grid-column:1/-1}
.form .acao{grid-column:1/-1;display:grid;gap:14px;justify-items:start}
.link-gerado{width:100%;display:flex;gap:14px;align-items:center;flex-wrap:wrap;background:var(--azul-s);border:1px solid var(--azul-l);border-radius:16px;padding:14px 16px;animation:surge .25s ease-out}
.link-gerado .ok{width:34px;height:34px;border-radius:50%;background:var(--azul);color:#fff;display:grid;place-items:center;flex:none}
:root[data-theme="dark"] .link-gerado .ok{color:#06102A}
.link-gerado .ok svg{width:16px;height:16px}
.link-gerado .url{flex:1;min-width:200px;display:grid}
.link-gerado .url small{color:var(--tinta2);font-size:13px;font-weight:600}
.link-gerado .url span{font-weight:600;word-break:break-all;color:var(--tinta)}
.link-gerado .botoes{display:flex;gap:8px}
.link-gerado .btn{padding:9px 16px;font-size:13.5px}

.modos{display:flex;gap:14px;align-items:flex-start;background:var(--bg);border:1px solid var(--linha);border-radius:16px;padding:14px 16px;margin:-6px 0 20px;color:var(--tinta2);font-size:14.5px;max-width:none}
.modos .ic{width:32px;height:32px;border-radius:10px;background:var(--azul-s);color:var(--azul);display:grid;place-items:center;flex:none}
.modos .ic svg{width:17px;height:17px}
.modos b{color:var(--tinta);font-weight:650}

.eds{display:grid;gap:14px}
.ed{border:1px solid var(--linha);border-radius:18px;background:var(--sup);overflow:hidden;position:relative;transition:border-color .2s}
.ed::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:transparent;transition:background-color .2s}
.ed.estrito{border-color:var(--azul-l)}
.ed.estrito::before{background:var(--azul)}
.ed-topo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) auto;gap:28px;align-items:center;padding:20px 22px}
.ed-mes{font-size:19px;font-weight:700;letter-spacing:-.02em;line-height:1.2}
.ed-canal{display:flex;align-items:center;gap:8px;color:var(--tinta3);font-size:14px;margin-top:4px;min-width:0}
.ed-canal span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-canal .rede svg{width:14px;height:14px}
.ed-canal .rede{width:22px;height:22px;border-radius:7px;background:var(--sup2);color:var(--tinta2);display:grid;place-items:center;flex:none;font-size:13px;font-weight:700}
.ed-prog{display:grid;gap:8px}
.ed-prog .conta{font-size:14.5px;color:var(--tinta2)}
.ed-prog .conta b{color:var(--tinta);font-variant-numeric:tabular-nums;font-weight:700}
.seg{display:flex;height:8px;border-radius:999px;background:var(--sup2);overflow:hidden;gap:2px}
.seg i{display:block;height:100%}
.seg .s-ok{background:var(--ok)} .seg .s-aj{background:var(--aj)} .seg .s-pub{background:var(--azul)}
.ed-selos{display:flex;gap:6px;flex-wrap:wrap}
.ed-selos:empty{display:none}
.ed-acoes{display:flex;gap:8px;justify-content:flex-end}
.ed-acoes .btn{padding:9px 16px;font-size:13.5px}
button.pill{border:0;cursor:pointer;font:inherit;font-size:13px;font-weight:600}
button.pill:hover{box-shadow:inset 0 0 0 1px var(--aj)}
/* posts que precisam da agência: o que é, quando sai e o que fazer */
.ed-atencao{border-top:1px solid var(--aj-l);background:var(--aj-s)}
.ed-atencao summary{list-style:none;display:flex;align-items:center;gap:12px;padding:12px 22px;cursor:pointer;font-size:14.5px;color:var(--tinta)}
.ed-atencao summary::-webkit-details-marker{display:none}
.ed-atencao summary:focus-visible{outline-offset:-3px}
.at-ic{width:26px;height:26px;border-radius:50%;background:var(--aj);color:#fff;display:grid;place-items:center;flex:none}
.at-ic svg{width:12px;height:12px}
:root[data-theme="dark"] .at-ic{color:#2C2312}
.at-resumo{flex:1;min-width:0}
.at-resumo b{font-weight:650}
.at-ver{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:13.5px;color:var(--aj-t);white-space:nowrap}
.at-ver::after{content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.ed-atencao[open] .at-ver{font-size:0;gap:0}
.ed-atencao[open] .at-ver::before{content:"Ocultar";font-size:13.5px;margin-right:6px}
.ed-atencao[open] .at-ver::after{transform:rotate(-135deg) translateY(-2px)}
.at-lista{list-style:none;display:grid;gap:10px;padding:0 22px 4px}
.at-item{background:var(--sup);border:1px solid var(--linha);border-radius:14px;padding:14px 16px;display:grid;gap:8px}
.at-item.susp{border-color:var(--aj-l)}
.at-cab{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.at-cab b{font-weight:650;flex:1;min-width:0;overflow-wrap:anywhere}
.at-data{color:var(--tinta3);font-size:13.5px;white-space:nowrap}
.at-selos{display:flex;gap:6px;flex-wrap:wrap}
.at-item blockquote{border-left:3px solid var(--aj);padding:2px 0 2px 12px;color:var(--tinta);font-size:14.5px;overflow-wrap:anywhere}
.at-item cite{display:block;font-style:normal;color:var(--tinta3);font-size:13px;margin-top:2px}
.at-fazer{font-size:14px;color:var(--tinta2)}
.at-fazer span{font-weight:650;color:var(--tinta)}
.at-rodape{padding:12px 22px 16px}
.at-rodape .btn{padding:9px 16px;font-size:13.5px}
/* ---------- mídia com problema (só a agência) ---------- */
.pill.md-erro{background:var(--erro-s);color:var(--erro-t);box-shadow:inset 0 0 0 1px var(--erro-l)}
.pill.md-sug{background:var(--aj-s);color:var(--aj-t);box-shadow:inset 0 0 0 1px var(--aj-l)}
button.pill.md-erro:hover{box-shadow:inset 0 0 0 1px var(--erro)}
button.pill.md-sug:hover{box-shadow:inset 0 0 0 1px var(--aj)}
button.pill[aria-expanded]::after{content:"";width:6px;height:6px;margin-left:2px;border-right:1.8px solid currentColor;border-bottom:1.8px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .2s}
button.pill[aria-expanded="true"]::after{transform:translateY(1px) rotate(-135deg)}
.md-qtd{display:inline-grid;place-items:center;min-width:21px;height:21px;padding:0 5px;border-radius:999px;background:var(--erro-t);color:var(--sup);font-size:13px;font-weight:700;font-variant-numeric:tabular-nums}
.md-sug .md-qtd{background:var(--aj-t)}

.md-bloco{background:var(--sup);border:1px solid var(--erro-l);border-radius:20px;box-shadow:var(--sombra-s);overflow:hidden;scroll-margin-top:96px;animation:surge .25s ease-out}
.md-bloco:focus{outline:none}  /* recebe foco só pelo link do sino; o destaque é o pulso abaixo */
.md-bloco.destaque{animation:md-pulso 2s ease-out}
@keyframes md-pulso{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--erro) 45%,transparent),var(--sombra-s)}35%{box-shadow:0 0 0 8px color-mix(in srgb,var(--erro) 18%,transparent),var(--sombra-s)}100%{box-shadow:0 0 0 0 transparent,var(--sombra-s)}}
.md-cab{display:flex;gap:16px;align-items:flex-start;padding:22px 28px 20px;background:var(--erro-s);border-bottom:1px solid var(--erro-l)}
.md-ic{width:42px;height:42px;border-radius:14px;background:var(--erro-t);color:var(--sup);display:grid;place-items:center;flex:none}
.md-ic svg{width:21px;height:21px}
.md-cab h2{font-size:20px;font-weight:650;letter-spacing:-.02em;line-height:1.25}
.md-cab p{color:var(--tinta2);margin-top:3px;max-width:72ch}
.md-cab p b{color:var(--tinta);font-weight:650}
.md-grupo{padding:18px 28px 4px}
.md-grupo:last-child{padding-bottom:24px}
.md-grupo + .md-grupo{border-top:1px solid var(--linha);margin-top:14px}
.md-grupo h3{display:flex;align-items:baseline;gap:10px;font-size:16px;font-weight:700;letter-spacing:-.01em;margin-bottom:12px;overflow-wrap:anywhere}
.md-grupo h3 span{color:var(--tinta3);font-size:13.5px;font-weight:600;white-space:nowrap}
.md-lista{list-style:none;display:grid;gap:10px}
.md-item{display:grid;grid-template-columns:58px minmax(0,1fr) auto;gap:16px;align-items:start;background:var(--sup);border:1px solid var(--linha);border-radius:16px;padding:14px 16px}
.md-item.erro{border-color:var(--erro-l)}
.md-dia{display:grid;justify-items:center;align-content:center;gap:0;height:66px;border-radius:13px;background:var(--erro-s);color:var(--erro-t);line-height:1.15}
.md-item.sug .md-dia{background:var(--aj-s);color:var(--aj-t)}
.md-dia b{font-size:23px;font-weight:750;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.md-dia small{font-size:13px;font-weight:650}
.md-corpo{display:grid;gap:6px;min-width:0}
.md-tit{display:flex;align-items:center;gap:8px 10px;flex-wrap:wrap}
.md-tit b{font-weight:650;font-size:15.5px;overflow-wrap:anywhere;min-width:0}
.md-meta{color:var(--tinta3);font-size:13.5px}
.md-msgs{list-style:none;display:grid;gap:5px}
.md-msgs li{position:relative;padding-left:17px;font-size:14.5px;color:var(--tinta);overflow-wrap:anywhere;max-width:78ch}
.md-msgs li::before{content:"";position:absolute;left:3px;top:.58em;width:7px;height:7px;border-radius:50%;background:var(--erro)}
.md-msgs li.s::before{background:var(--aj)}
.md-n{font-weight:650}
.md-acao{align-self:center;display:grid;gap:6px;justify-items:end}
.md-cal-erro{max-width:230px;color:var(--erro-t);font-size:13px;font-weight:600;text-align:right;line-height:1.35}
.md-cal-erro:empty{display:none}
.md-cal{padding:9px 16px;font-size:13.5px}
.md-cal.abrindo{opacity:.7;pointer-events:none}
.md-nao-membro{max-width:230px;color:var(--tinta3);font-size:13px;text-align:right;line-height:1.35}
.md-estado{border-color:var(--linha)}
.md-carga{display:flex;align-items:center;gap:12px;padding:14px 22px;color:var(--tinta2);font-size:14.5px}
.md-gira{width:16px;height:16px;border-radius:50%;border:2px solid var(--azul-l);border-top-color:var(--azul);animation:gira .8s linear infinite;flex:none}
.md-falha{display:flex;align-items:center;gap:12px 14px;padding:12px 16px 12px 22px;flex-wrap:wrap;color:var(--tinta)}
.md-falha > span:nth-child(2){flex:1;min-width:200px}
.md-ic-p{width:30px;height:30px;border-radius:50%;background:var(--erro-s);color:var(--erro-t);display:grid;place-items:center;flex:none}
.md-ic-p svg{width:16px;height:16px}
.md-falha .btn{padding:9px 16px;font-size:13.5px}
/* no card do link: os posts do mês com mídia a revisar */
.ed-midia{border-top:1px solid var(--linha);background:var(--bg);padding:14px 22px}
.ed-midia .md-item{background:var(--sup)}
.at-midia{border-radius:12px;background:var(--bg);padding:10px 12px}

/* ---------- D17: qual post é, o post vindo do sino, outros clientes e "tudo certo" ---------- */
.md-texto{color:var(--tinta2);font-size:14px;font-style:italic;overflow-wrap:anywhere;max-width:78ch}
.md-item{scroll-margin-top:110px;transition:box-shadow .2s}
.md-item:focus{outline:none}
.md-item.destaque{animation:md-item-pulso 2.4s ease-out}
/* post vindo do sino: contorno que fica e o rótulo "Post do aviso" (até clicar em outro lugar ou 10 s) */
.md-item{position:relative}
.md-item.do-aviso{border-color:var(--azul);box-shadow:0 0 0 2px var(--azul),0 12px 32px -14px color-mix(in srgb,var(--azul) 55%,transparent);margin-top:14px}
.md-item.do-aviso::before{content:"Post do aviso";position:absolute;top:-11px;left:14px;padding:2px 10px;border-radius:999px;background:var(--azul);color:#fff;font-size:13px;font-weight:700;letter-spacing:.01em;line-height:18px;box-shadow:0 0 0 3px var(--sup)}
:root[data-theme="dark"] .md-item.do-aviso::before{color:#0B1033}
@keyframes md-item-pulso{0%,30%{box-shadow:0 0 0 3px var(--azul),0 10px 30px -12px color-mix(in srgb,var(--azul) 60%,transparent)}100%{box-shadow:0 0 0 0 transparent}}
.md-rodape{border-top:1px solid var(--linha);padding:14px 28px 18px;background:var(--bg)}
.md-outros{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap}
.md-outros-tit{font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--tinta3)}
.md-chips{display:flex;gap:8px;flex-wrap:wrap;min-width:0}
.md-chip{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:6px 8px 6px 12px;border-radius:999px;border:1px solid var(--linha);background:var(--sup);color:var(--tinta);font-size:13.5px;cursor:pointer;text-align:left;transition:border-color .15s,background-color .15s}
.md-chip b{font-weight:650}
.md-chip:hover{border-color:var(--azul-l);background:var(--azul-s)}
.md-chip:focus-visible{outline:2px solid var(--azul);outline-offset:2px}
.md-chip-ponto{width:8px;height:8px;border-radius:50%;background:var(--erro);flex:none}
.md-chip.sug .md-chip-ponto{background:var(--aj)}
.md-chip-ver{color:var(--azul);font-weight:650;padding:2px 8px;border-radius:999px;background:var(--azul-s)}
/* nenhum problema no cliente do seletor: uma linha só, discreta */
.md-bloco.md-tranquilo{border-color:var(--linha);display:flex;align-items:center;gap:10px 24px;flex-wrap:wrap;padding:12px 20px 12px 14px;animation:surge .25s ease-out}
.md-bloco.md-tranquilo.so-outros{padding-left:20px}
.md-ok{display:flex;align-items:center;gap:12px;font-weight:600;color:var(--tinta);flex:1 1 300px;min-width:0}
.md-ok > span:last-child{display:grid;line-height:1.3}
.md-ok small{font-weight:500;color:var(--tinta3);font-size:13px}
.md-ok-ic{width:34px;height:34px;border-radius:50%;background:var(--ok-s);color:var(--ok-t);display:grid;place-items:center;flex:none}
.md-ok-ic svg{width:17px;height:17px}
.md-tranquilo .md-outros{flex:0 1 auto}
/* "Voltar ao calendário": o espaço entre as palavras é o gap do botão (o espaço do texto some no flex) */
.topo .voltar{gap:.3em}
/* atalho Editorial → Painel (o Painel já tem o atalho de volta) */
.topo .ir-painel{gap:7px}
.topo .ir-painel svg{width:17px;height:17px;flex:none}
/* aviso (toast) no Editorial: embaixo, para não cobrir o subtítulo do cabeçalho */
.ag ~ .aviso{top:auto;bottom:24px;translate:0 8px}
.ag ~ .aviso.on{translate:0 0}

.ed-modo{display:flex;align-items:center;gap:16px;padding:12px 22px;border-top:1px solid var(--linha);background:var(--bg);transition:background-color .2s}
.ed.estrito .ed-modo{background:var(--azul-s);border-top-color:var(--azul-l)}
.ed-modo .estado{margin-left:auto;font-size:13px;font-weight:600;color:var(--tinta3);text-align:right}
.ed.estrito .ed-modo .estado{color:var(--azul)}

/* interruptor de modo: o botão leva um cadeado que fecha quando ligado */
.trava{position:relative;display:inline-flex;align-items:center;gap:12px;cursor:pointer;font-weight:600;font-size:14.5px;color:var(--tinta);user-select:none;-webkit-user-select:none;min-height:36px}
.trava input{position:absolute;left:0;top:50%;transform:translateY(-50%);width:52px;height:30px;margin:0;opacity:0;z-index:1;cursor:pointer}
.trilho{position:relative;width:52px;height:30px;border-radius:999px;background:var(--vazio);flex:none;transition:background-color .2s}
.botao{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;color:var(--tinta3);display:grid;place-items:center;box-shadow:0 1px 3px rgba(11,16,51,.3);transition:transform .22s cubic-bezier(.3,.7,.4,1.2),color .2s}
.botao svg{width:13px;height:13px}
.botao .fechado{display:none}
.trava input:checked + .trilho{background:var(--azul)}
.trava input:checked + .trilho .botao{transform:translateX(22px);color:var(--azul)}
:root[data-theme="dark"] .trava input:checked + .trilho .botao{color:#1B4FD8}
.trava input:checked + .trilho .aberto{display:none}
.trava input:checked + .trilho .fechado{display:block}
.trava input:focus-visible + .trilho{outline:2px solid var(--azul);outline-offset:3px}
.trava input:disabled + .trilho{opacity:.6}
.ed.inativo .trava,.ed.inativo .trava input{cursor:not-allowed}
.ed.inativo .trava{color:var(--tinta3)}
.ed.inativo .trava:hover .trilho{box-shadow:none}
.trava:hover .trilho{box-shadow:0 0 0 4px var(--azul-s)}
.ed.estrito .trava:hover .trilho{box-shadow:0 0 0 4px var(--azul-l)}
.ed.salvando .ed-modo .estado::before{content:"";display:inline-block;width:11px;height:11px;margin-right:6px;vertical-align:-1px;border-radius:50%;border:2px solid var(--azul-l);border-top-color:var(--azul);animation:gira .8s linear infinite}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* ---------- telas menores ---------- */
@media (max-width:420px){.barra{display:none}.topo h1{font-size:18px}.ig-perfil{gap:12px;padding:10px 14px 6px}.anel{width:84px;height:84px}.numeros{font-size:13px}.numeros b{font-size:16px}}
@media (max-width:1360px){
  .palco{grid-template-columns:430px minmax(0,1fr);gap:40px}
  .como{grid-column:1/-1;justify-self:start;text-align:left;max-width:none;display:flex;gap:32px;align-items:flex-start;flex-wrap:wrap}
  .como > div{max-width:560px}
  .como .legenda{margin-top:0;justify-items:start;grid-template-columns:repeat(2,auto);column-gap:28px}
  .legenda li{flex-direction:row-reverse;justify-content:flex-end}
  .agenda{max-width:none}
}
@media (max-width:900px){
  .topo-in{padding:12px 16px;flex-wrap:wrap}
  .topo .dir{width:100%;margin-left:0;justify-content:space-between}
  .barra{width:70px}
  .topo .dir{gap:10px}
  #n-publicados{display:block;font-size:13px}
  #n-publicados:not(:empty)::before{content:none}
  .topo .dir .btn{padding:9px 14px}
  .palco{grid-template-columns:minmax(0,1fr);padding:24px 16px 48px;gap:32px}
  .celular{width:100%;max-width:430px;justify-self:center;border-radius:48px;padding:10px}
  .tela{height:min(860px,82vh);border-radius:38px}
  .caixa{grid-template-columns:minmax(0,1fr);overflow-y:auto}
  .visor img,.visor video{width:100%;height:auto}
  /* celular: a instrução vem primeiro, antes da moldura do perfil */
  .como{order:-1;background:var(--sup);border:1px solid var(--linha);border-radius:18px;padding:16px 18px;box-shadow:var(--sombra-s);gap:12px 24px}
  .como .rotulo{margin-bottom:4px;font-size:16px}
  .como p{font-size:15px}
  .como .comecar{margin-top:12px;width:100%}
  .como .legenda{font-size:13.5px;gap:6px 18px}
  .agenda{order:2}
  .visor{min-height:280px}
  .visor img,.visor video{max-height:60vh}
  .modal{padding:0;place-items:end stretch}
  .caixa{border-radius:22px 22px 0 0;max-height:94vh}
  .lado{min-height:auto}
  .lado-topo{position:sticky;top:0;z-index:3;background:var(--sup)}
  .legenda-post{overflow:visible}
  .visor.medida{aspect-ratio:var(--ar);min-height:0;max-height:75vh}
  .visor.medida img,.visor.medida video{width:100%;height:100%;max-height:none;object-fit:contain}
  .decidir .desfazer,.previa-nota .desfazer{min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center}
  .lp-url{min-height:44px}
  .post-unico{padding:16px 16px 8px}
  /* alvos de toque de 44 px na tela do cliente */
  .topo .icone,.fechar,.visor .seta{width:44px;height:44px}
  .topo .dir .btn,.decidir .btn,.seguir .btn,.btn-claro{min-height:44px}
  .rodape a{display:inline-flex;align-items:center;min-height:44px}
  body.modo-post .caixa{border-radius:20px;max-height:none;overflow:hidden}
  body.modo-post .lado-topo{position:static}
  body.modo-post .topo .dir{width:auto}
}
@media (max-width:760px){
  .ag{padding:20px 16px 56px;gap:16px}
  .cartao{padding:20px 18px;border-radius:18px}
  .form{grid-template-columns:1fr}
  .form .acao .btn-pri{width:100%}
  .link-gerado .botoes{width:100%}
  .link-gerado .botoes .btn{flex:1}
  .ed-topo{grid-template-columns:1fr;gap:14px;padding:18px 18px 16px}
  .ed-acoes{justify-content:stretch}
  .ed-acoes .btn{flex:1}
  .ed-modo{padding:12px 18px;flex-wrap:wrap;gap:6px 16px}
  .ed-modo .estado{margin-left:64px;text-align:left;width:auto}
  .ed-atencao summary{padding:12px 18px}
  .at-lista{padding:0 12px 4px}
  .at-rodape{padding:12px 18px 16px}
  .at-rodape .btn{width:100%;min-height:44px}
  .at-acoes .btn{flex:1 1 180px;min-height:44px}
  button.pill{min-height:44px;padding:8px 14px}
  .md-cab{padding:18px 18px 16px;gap:12px}
  .md-ic{width:36px;height:36px;border-radius:12px}
  .md-ic svg{width:18px;height:18px}
  .md-cab h2{font-size:18px}
  .md-grupo{padding:16px 12px 4px}
  .md-grupo:last-child{padding-bottom:14px}
  .md-grupo h3{padding:0 4px}
  .md-item{grid-template-columns:50px minmax(0,1fr);gap:12px;padding:12px}
  .md-dia{height:58px;border-radius:12px}
  .md-dia b{font-size:20px}
  .md-acao{grid-column:1/-1}
  .md-cal{width:100%;min-height:44px}
  .md-acao{justify-items:stretch}
  .md-cal-erro{max-width:none;text-align:left}
  .md-nao-membro{max-width:none;text-align:left}
  .md-falha{padding:12px 14px}
  .md-falha .btn{width:100%;min-height:44px}
  .ed-midia{padding:12px}
  /* alvos de toque de 44 px no celular */
  .ed-acoes .btn,.link-gerado .botoes .btn,.form .acao .btn,.campo select,.campo input{min-height:44px}
  .md-rodape{padding:12px 14px 14px}
  .md-chip{min-height:44px;width:100%;justify-content:flex-start}
  .md-chip-ver{margin-left:auto}
  .md-chips{width:100%}
  .md-bloco.md-tranquilo{padding:12px 14px}
  /* logo e chave "Só publicar o que o cliente aprovar" com 44 px de alvo */
  .marca{min-height:44px}
  .trava{min-height:44px}
}
@media (max-width:560px){
  /* o dia e o título lado a lado; o resto ocupa a largura toda do cartão */
  .md-item{grid-template-columns:50px minmax(0,1fr);gap:10px 12px;align-items:center}
  .md-corpo{display:contents}
  .md-tit{display:contents}
  .md-tit b{grid-column:2}
  .md-tit .pill,.md-meta,.md-texto,.md-msgs,.md-acao{grid-column:1/-1}
  .md-tit .pill{justify-self:start}
}
@media (max-width:420px){
  /* cartões estreitos: título do post em linha própria e botões do link um sobre o outro */
  .at-cab b{flex-basis:100%}
  .ed-acoes{flex-wrap:wrap}
  .ed-midia{padding:10px}
  .md-item{padding:12px 10px}
  .modos{padding:12px 14px}
  .item{gap:12px;padding:10px 12px 10px 10px}
  .dia{width:54px;height:58px;border-radius:12px}
  .dia b{font-size:21px}
  .item > .pill{display:none}
  .item .meio .pill.estado-m{display:inline-flex}
  /* aviso embaixo, na largura da tela: não cobre os botões do cabeçalho */
  .aviso{top:auto;bottom:max(16px,env(safe-area-inset-bottom));left:16px;right:16px;transform:none;max-width:none;border-radius:16px;text-align:left;justify-content:flex-start;padding:12px 16px;translate:0 8px}
  /* com a janela do post aberta (folha que sobe de baixo), o aviso vai para o topo, sobre a imagem */
  body.com-modal .aviso{bottom:auto;top:max(12px,env(safe-area-inset-top));translate:0 -8px}
  /* post único: o aviso também vai para o topo; embaixo ele cobria Aprovar e Pedir ajuste depois de decidir */
  body.modo-post .aviso{bottom:auto;top:max(12px,env(safe-area-inset-top));translate:0 -8px}
  .aviso.on,body.com-modal .aviso.on,body.modo-post .aviso.on{translate:0 0}
  .faixa-in{padding:10px 16px;flex-wrap:wrap}
  .faixa-in p{flex-basis:calc(100% - 46px)}
  .faixa-in .btn-claro{width:100%}
}

/* P5: cabeçalho do Editorial no celular com no máximo 120 px. Marca (só o símbolo), título, tema e "Voltar" na 1ª
   linha; o seletor de cliente (quando há mais de um) na 2ª; sem o subtítulo */
@media (max-width:760px){
  .topo-ag .topo-in{gap:4px 10px;padding:8px 16px;flex-wrap:wrap}
  /* quebra de linha: marca, título, tema e "Voltar" na 1ª linha; cliente e Painel na 2ª (a linha vazia não soma altura) */
  .topo-ag .topo-in::after{content:"";order:3;flex-basis:100%;height:0}
  .topo-ag .marca{font-size:0;gap:0;min-width:44px;min-height:44px;justify-content:center}
  .topo-ag .marca img{width:24px}
  .topo-ag .titulo{order:0;flex:1 1 0;width:auto;min-width:0;padding-left:0;border-left:0}
  .topo-ag .titulo h1{font-size:17px;line-height:1.2}
  .topo-ag.topo .sub{display:none}
  .topo-ag .dir.ag-dir{display:contents}
  .topo-ag .dir.ag-dir .icone{order:1;width:44px;height:44px;margin-left:0}
  .topo-ag .dir.ag-dir .voltar{order:2;min-height:44px;padding:9px 14px}
  .topo-ag .dir.ag-dir .voltar .longo{display:none}
  .topo-ag #campo-org{order:4;flex:1 1 0;min-width:0}
  /* atalho para o Painel: 2ª linha, ao lado do seletor de cliente (ou sozinho, à esquerda) */
  .topo-ag .dir.ag-dir .ir-painel{order:5;min-height:44px;padding:9px 14px}
  .topo-ag #campo-org select{width:100%;min-height:44px}
}