/* Direct DispariX · base visual do painel (docs/AUTH.md §7.1).
   Porte enxuto de assets/app.css da bancada: os mesmos tokens de cor (claro e escuro) e os componentes que as telas
   de entrada e de contas usam. Regras:
   - celular primeiro: 375 px sem rolagem lateral; botão principal com 48 px ou mais; toque com 40 px ou mais;
     campo com letra de 16 px (o iPhone não dá zoom);
   - largura fixa acima de 343 px só dentro de @media (min-width…);
   - nada de estilo inline nem fonte de fora (CSP): a fonte Onest entra só se já estiver no aparelho. */

:root{
  /* Marca DispariX: marinho #071535, azul #1560E0, limão #A8E02E. Toque Instagram só em degradê decorativo e no botão. */
  --bg:#F5F5F1; --surface:#FFFFFF; --surface-2:#F8F8F5; --surface-3:#EFEFEA; --ink:#0B1633; --ink-2:#45506A; --muted:#636C80;
  --line:#E4E4DF; --axis:#C8CBD2; --ring:rgba(7,21,53,.08); --shadow:0 12px 32px -12px rgba(7,21,53,.20);
  --side:#071535; --side-ink:#C9D3E8; --side-muted:#7E8BA8; --side-line:#13234A; --side-active:#0E2048;
  --brand:#1560E0; --brand-ink:#0F55CC; --brand-soft:rgba(21,96,224,.10); --brand-hover:#0F55CC;
  --link:#2166C2;
  --lime:#A8E02E;
  --ig-filete:linear-gradient(90deg,#0672FF 0%,#4F5BD5 17%,#962FBF 38%,#D62976 60%,#FA7E1E 82%,#FEDA75 100%);
  --ig-txt-escuro:linear-gradient(90deg,#C084FC 0%,#F56AA6 52%,#FB9A4B 100%);
  --ig-passo:linear-gradient(135deg,var(--brand) 0%,#962FBF 100%);   /* número branco: 5,5:1 ou mais */
  --ig-cta:linear-gradient(100deg,#3D5AE0 0%,#7B3CCB 50%,#C92F7C 100%); /* botão do Instagram, texto branco: 5,0:1 ou mais */
  --ig-traco:linear-gradient(90deg,#962FBF,#D62976);
  --ig-soft:linear-gradient(135deg,rgba(250,126,30,.15) 0%,rgba(214,41,118,.13) 50%,rgba(150,47,191,.16) 100%);
  --ig-ink:#8530B0;
  --good:#0ca30c; --good-ink:#006300; --good-soft:#E3F5E3;
  --warn:#fab219; --warn-ink:#8A5A00; --warn-soft:#FFF4DB;
  --crit:#d03b3b; --crit-ink:#B02727; --crit-soft:#FCE6E6;
  --focus:#962FBF; --focus-escuro:#D59CF5;
  --font:"Onest","Segoe UI",system-ui,-apple-system,"Roboto","Helvetica Neue",Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,"Cascadia Mono",Consolas,monospace;
  --r-sm:8px; --r:12px; --r-lg:16px;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#060C1C; --surface:#0E1629; --surface-2:#121C33; --surface-3:#18233D; --ink:#EEF2FA; --ink-2:#B6C0D6; --muted:#828EA8;
    --line:#1E2A45; --axis:#2A3754; --ring:rgba(255,255,255,.08); --shadow:0 12px 32px -12px rgba(0,0,0,.6);
    --side:#040A18; --side-line:#12203D; --side-active:#0E1A36;
    --brand-ink:#6EA8FF; --brand-soft:rgba(61,139,255,.16); --brand-hover:#1254C4; --link:#5A9BF0;
    --ig-cta:linear-gradient(100deg,#4A66EC 0%,#8A48D8 50%,#D0357F 100%);
    --ig-traco:linear-gradient(90deg,#C084FC,#F56AA6);
    --ig-soft:linear-gradient(135deg,rgba(250,126,30,.18) 0%,rgba(214,41,118,.17) 50%,rgba(150,47,191,.24) 100%);
    --ig-ink:#D99AF0;
    --good-ink:#22B522; --good-soft:#12301A; --warn-ink:#fab219; --warn-soft:#2E2510; --crit-ink:#F27272; --crit-soft:#3A1A1C;
    --focus:#D59CF5;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#060C1C; --surface:#0E1629; --surface-2:#121C33; --surface-3:#18233D; --ink:#EEF2FA; --ink-2:#B6C0D6; --muted:#828EA8;
  --line:#1E2A45; --axis:#2A3754; --ring:rgba(255,255,255,.08); --shadow:0 12px 32px -12px rgba(0,0,0,.6);
  --side:#040A18; --side-line:#12203D; --side-active:#0E1A36;
  --brand-ink:#6EA8FF; --brand-soft:rgba(61,139,255,.16); --brand-hover:#1254C4; --link:#5A9BF0;
  --ig-cta:linear-gradient(100deg,#4A66EC 0%,#8A48D8 50%,#D0357F 100%);
  --ig-traco:linear-gradient(90deg,#C084FC,#F56AA6);
  --ig-soft:linear-gradient(135deg,rgba(250,126,30,.18) 0%,rgba(214,41,118,.17) 50%,rgba(150,47,191,.24) 100%);
  --ig-ink:#D99AF0;
  --good-ink:#22B522; --good-soft:#12301A; --warn-ink:#fab219; --warn-soft:#2E2510; --crit-ink:#F27272; --crit-soft:#3A1A1C;
  --focus:#D59CF5;
  color-scheme:dark;
}

/* ── Base ─────────────────────────────────── */
*{box-sizing:border-box}
html,body{margin:0}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
[hidden]{display:none!important}
body{background:var(--bg);color:var(--ink);font-family:var(--font);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column;overflow-wrap:anywhere}
/* Filete Instagram no topo de toda página */
body::before{content:"";position:fixed;left:0;right:0;top:0;height:3px;background:var(--ig-filete);z-index:60;pointer-events:none}
a{color:var(--link)}
h1,h2,h3{margin:0;letter-spacing:-.01em;text-wrap:balance}
p{margin:0}
ul,ol{margin:0}
img{max-width:100%}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.topo :focus-visible{outline-color:var(--focus-escuro)}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.muted{color:var(--muted)} .ink2{color:var(--ink-2)} .mono{font-family:var(--mono)}
.ic{width:18px;height:18px;flex:none}
[data-ic]{display:inline-flex;align-items:center}

/* ── Topo com a marca (marinho nos dois temas) ── */
.topo{background:var(--side);color:var(--side-ink);border-bottom:1px solid var(--side-line);padding:10px 16px;display:flex;align-items:center;gap:12px;min-height:56px}
.topo .sp{flex:1}
.marca{display:inline-flex;flex-direction:column;gap:2px;text-decoration:none;flex:none}
.marca-direct{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;align-self:flex-start;
  background:var(--ig-txt-escuro);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--lime)}
.marca-logo{display:block;height:22px;width:auto}
.topo-cliente{font-size:13px;font-weight:600;color:#fff;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:50%}
.topo .btn.tema{color:var(--side-ink);background:transparent;border-color:var(--side-line)}
.topo .btn.tema:hover{background:var(--side-active)}

/* Abas do painel (Contas | Ajustes) */
.abas{display:flex;gap:4px;padding:0 16px;background:var(--surface);border-bottom:1px solid var(--line);overflow-x:auto}
.abas a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;font-size:14px;font-weight:600;color:var(--muted);text-decoration:none;white-space:nowrap}
.abas a[aria-current="page"]{color:var(--ink);background:var(--ig-traco) bottom/100% 2px no-repeat}
.abas a:hover{color:var(--ink)}

/* ── Página ───────────────────────────────── */
.pg{width:100%;max-width:560px;margin:0 auto;padding:24px 16px 40px;display:flex;flex-direction:column;gap:18px;flex:1 0 auto}
.pg.larga{max-width:880px}
.titulo{font-size:24px;font-weight:750;line-height:1.2;letter-spacing:-.02em}
.sub{font-size:14px;color:var(--ink-2)}
.secao-t{font-size:17px;font-weight:700}
.rodape{padding:18px 16px 28px;display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;justify-content:center;font-size:13px;color:var(--muted)}
.rodape a{color:var(--muted);display:inline-flex;align-items:center;min-height:40px}

/* ── Botões ───────────────────────────────── */
.btn{font:inherit;font-size:14px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;border-radius:10px;padding:8px 14px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;text-decoration:none;text-align:center;white-space:normal}
.btn:hover{background:var(--surface-2)}
.btn .ic{width:17px;height:17px}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.primary:hover{background:var(--brand-hover);border-color:var(--brand-hover)}
/* Botão principal: 48 px ou mais em TODA tela (PRODUTO §3.3 regra 6), também sem .lg. Fica ANTES do .btn.lg: com as
   duas classes o .btn.lg (52 px) vem depois, com a mesma especificidade, e ganha. */
.btn.primary,.btn.ig{min-height:48px}
/* "Continuar com o Instagram": degradê do Instagram, texto branco */
.btn.ig{background:var(--ig-cta);border-color:transparent;color:#fff}
.btn.ig:hover{background:var(--ig-cta);filter:brightness(.93)}
.btn.ig .ic{width:22px;height:22px}
.btn.ghost{background:transparent;border-color:transparent;color:var(--ink-2)}
.btn.ghost:hover{background:var(--surface-2)}
.btn.danger{color:var(--crit-ink);border-color:var(--crit-soft)}
.btn.danger.cheio{background:var(--crit);border-color:var(--crit);color:#fff}
/* Botão principal: 48 px ou mais e largura cheia no celular */
.btn.lg{min-height:52px;width:100%;font-size:16px;padding:12px 20px;border-radius:12px}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed}
.btn[aria-busy="true"]{cursor:progress}
.giro{width:16px;height:16px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:giro .7s linear infinite;flex:none}
@keyframes giro{to{transform:rotate(360deg)}}
/* Link pequeno que é botão (abre uma caixa) */
.link-peq{font:inherit;font-size:14px;font-weight:600;color:var(--link);background:none;border:0;padding:0 4px;min-height:40px;display:inline-flex;align-items:center;gap:6px;cursor:pointer;text-decoration:underline;text-underline-offset:3px;border-radius:6px;align-self:flex-start}
.link-peq .ic{width:15px;height:15px}
.acoes{display:flex;flex-wrap:wrap;gap:8px;align-items:center}

/* ── Campos ───────────────────────────────── */
.field{display:flex;flex-direction:column;gap:6px}
.field label,.rot{font-size:13.5px;font-weight:600;color:var(--ink)}
.hint{font-size:12.5px;color:var(--muted)}
input,select,textarea,.input{font:inherit;font-size:16px}
.input{color:var(--ink);background:var(--surface);border:1px solid var(--axis);border-radius:10px;padding:10px 12px;width:100%;min-height:48px}
textarea.input{min-height:88px;resize:vertical;line-height:1.45}
.input:focus{outline:2px solid var(--focus);outline-offset:0;border-color:transparent}
.input[aria-invalid="true"]{border-color:var(--crit)}
.input[readonly]{background:var(--surface-2)}
.erro-campo{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:500;color:var(--crit-ink)}
.erro-campo .ic{width:15px;height:15px}
.linha-campo{display:flex;flex-direction:column;gap:8px}
.form{display:flex;flex-direction:column;gap:14px}

/* Interruptor */
.switch{position:relative;display:inline-flex;align-items:center;gap:10px;cursor:pointer;font-size:14px;font-weight:600;min-height:40px}
.switch input{position:absolute;opacity:0;width:1px;height:1px}
.switch .tg{width:40px;height:24px;border-radius:999px;background:var(--axis);position:relative;transition:background .2s;flex:none}
.switch .tg::after{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .2s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.switch input:checked + .tg{background:var(--good)}
.switch input:checked + .tg::after{transform:translateX(16px)}
.switch input:focus-visible + .tg{outline:2px solid var(--focus);outline-offset:2px}
.switch input:disabled + .tg{opacity:.55}

/* ── Blocos ───────────────────────────────── */
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:14px;min-width:0}
.callout{display:flex;gap:10px;align-items:flex-start;border-radius:10px;padding:10px 12px;font-size:14px;color:var(--ink-2);background:var(--surface-2)}
.callout .ic{width:18px;height:18px;margin-top:1px}
.callout.ok{background:var(--good-soft);color:var(--ink)} .callout.ok .ic{color:var(--good-ink)}
.callout.warn{background:var(--warn-soft);color:var(--ink)} .callout.warn .ic{color:var(--warn-ink)}
.callout.crit{background:var(--crit-soft);color:var(--ink)} .callout.crit .ic{color:var(--crit-ink)}
.msg{font-size:14px}
.msg.ok{color:var(--good-ink)} .msg.erro{color:var(--crit-ink)}
.carregando{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:14px;padding:12px 0}

/* Selos e estados (status sempre com texto) */
.st{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:650;border-radius:999px;padding:3px 10px;white-space:nowrap}
.st .ic{width:14px;height:14px}
.st.ok{background:var(--good-soft);color:var(--good-ink)}
.st.at{background:var(--warn-soft);color:var(--warn-ink)}
.st.er{background:var(--crit-soft);color:var(--crit-ink)}
.st.off{background:var(--surface-3);color:var(--muted)}
/* "Em teste · não envia": tracejado neutro (mapa da bancada) */
.st.teste{background:transparent;color:var(--ink-2);border:1px dashed var(--axis);padding:2px 9px}
.pill{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;border-radius:999px;padding:2px 9px;white-space:nowrap;background:var(--brand-soft);color:var(--brand-ink)}

/* ── Avisos (toast) ───────────────────────── */
.toasts{position:fixed;left:12px;right:12px;bottom:16px;z-index:95;display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}
.toast{background:var(--ink);color:var(--surface);border-radius:12px;padding:11px 14px;font-size:14px;box-shadow:var(--shadow);display:flex;gap:9px;align-items:center;max-width:100%;animation:tin .2s ease-out;transition:opacity .3s}
.toast .ic{color:var(--good)}
.toast.erro .ic{color:var(--crit)}
.toast.saindo{opacity:0}
@keyframes tin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ── Janela (modal): no celular sobe do pé da tela ── */
.modal-fundo{position:fixed;inset:0;background:rgba(10,11,15,.5);z-index:86;display:flex;align-items:flex-end;justify-content:center;padding:24px 0 0}
.modal{background:var(--surface);color:var(--ink);border-radius:16px 16px 0 0;width:100%;max-height:calc(100vh - 24px);overflow:auto;box-shadow:var(--shadow);display:flex;flex-direction:column}
.modal-h{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 12px 12px 16px;border-bottom:1px solid var(--line)}
.modal-h h2{font-size:16.5px}
.modal-b{padding:16px;display:flex;flex-direction:column;gap:14px;font-size:14.5px}
.modal-f{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;padding:12px 16px 16px;border-top:1px solid var(--line)}
.modal-f .btn{flex:1 1 auto}
.x{font:inherit;background:none;border:0;color:var(--muted);cursor:pointer;min-width:40px;min-height:40px;border-radius:8px;display:grid;place-items:center}
.x:hover{background:var(--surface-2);color:var(--ink)}

/* Link mostrado uma vez (convite, link de entrada) */
.link-unico{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2)}
.link-unico .input{font-family:var(--mono);font-size:16px}

/* ── Telas com um botão (ops, link, convite, e-mail) ── */
.foco{display:flex;flex-direction:column;align-items:stretch;gap:18px;text-align:left}
.foco-ic{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:var(--ig-soft);color:var(--ig-ink)}
.foco-ic .ic{width:26px;height:26px}
.foco-ic.ok{background:var(--good-soft);color:var(--good-ink)}
.foco-ic.at{background:var(--warn-soft);color:var(--warn-ink)}
.foco .titulo{font-size:22px}

/* ── Tela de entrada ──────────────────────── */
.entrada{gap:16px;padding-top:28px}
.entrada .titulo{font-size:26px}
.nota{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;color:var(--ink-2)}
.nota .ic{width:15px;height:15px;margin-top:3px;color:var(--muted)}
.termos{font-size:12.5px;color:var(--muted)}
.termos a{color:var(--link)}
.bloco-ig{display:flex;flex-direction:column;gap:12px}
.divisa{height:1px;background:var(--line);border:0;margin:4px 0}
.caixa{display:flex;flex-direction:column;gap:12px;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}

/* ── Pendências: conserto em 3 passos ─────── */
.pend{border:1px solid var(--line);border-left:3px solid var(--warn);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:12px;background:var(--surface)}
.pend h3{font-size:15px;font-weight:650;line-height:1.35}
.passos{list-style:none;padding:0;display:flex;flex-direction:column;gap:10px;counter-reset:p}
.passos li{display:flex;gap:10px;align-items:flex-start;counter-increment:p;font-size:14px;color:var(--ink-2)}
.passos li::before{content:counter(p);width:24px;height:24px;border-radius:50%;flex:none;display:grid;place-items:center;font-size:12px;font-weight:700;background:var(--ig-passo);color:#fff}
.pend .acoes .btn{flex:1 1 auto}

/* ── Conta conectada ──────────────────────── */
.av{width:52px;height:52px;border-radius:50%;flex:none;display:grid;place-items:center;font-weight:700;font-size:19px;color:var(--ink);background:var(--surface-3);overflow:hidden}
.av img{width:100%;height:100%;object-fit:cover;display:block}
.av.g{width:72px;height:72px;font-size:26px}
.conectado-topo{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.conectado-topo .titulo .ok-ic{color:var(--good-ink)}
.arroba{font-size:17px;font-weight:700;color:var(--ink)}
.id-linha{display:flex;align-items:center;gap:12px;min-width:0}
.id-linha > div{display:flex;flex-direction:column;gap:2px;min-width:0}

/* ── Contas ───────────────────────────────── */
.faixa{display:flex;flex-direction:column;gap:10px;border-radius:12px;padding:12px 14px;font-size:14px;background:var(--crit-soft);color:var(--ink)}
.faixa.at{background:var(--warn-soft)}
.faixa p{display:flex;gap:8px;align-items:flex-start}
.faixa .ic{color:var(--crit-ink);margin-top:2px}
.faixa.at .ic{color:var(--warn-ink)}
.faixa .btn{align-self:flex-start}
.conta{gap:16px}
.conta-h{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap}
.conta-id{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.conta-id h2{font-size:17px;font-weight:700}
.conta-id p{font-size:13.5px;color:var(--muted)}
.conta-selos{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.info{list-style:none;padding:0;display:flex;flex-direction:column;gap:8px;font-size:14px;color:var(--ink-2)}
.info li{display:flex;gap:8px;align-items:flex-start}
.info .ic{width:16px;height:16px;margin-top:3px;color:var(--muted)}
.info .at{color:var(--warn-ink);font-weight:600}
.info .at .ic{color:var(--warn-ink)}
.perm-falta{color:var(--crit-ink);font-weight:600}
.conta-f{display:flex;flex-direction:column;gap:12px;border-top:1px solid var(--line);padding-top:14px}
.aviso-login{font-size:13px;color:var(--muted)}
.vaga{display:flex;flex-direction:column;gap:10px;padding:16px;border:1.5px dashed var(--axis);border-radius:14px}
.vazio{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}

/* ── Listas (aparelhos, equipe, admin) ────── */
.lista{list-style:none;padding:0;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.lista > li{display:flex;flex-direction:column;gap:8px;padding:12px 14px}
.lista > li + li{border-top:1px solid var(--line)}
.lista .l-t{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-weight:650}
.lista .l-s{font-size:13px;color:var(--muted)}
.lista .acoes .btn{min-height:40px}
/* O botão principal dentro da lista não fica nos 40 px do de cima (mais específico: vence o .btn.primary só no empate). */
.lista .acoes .btn.primary{min-height:48px}
.lista select.input{width:auto;min-width:0}

/* ── Termos e privacidade ─────────────────── */
.rascunho{display:flex;gap:8px;align-items:flex-start;border:1px dashed var(--warn-ink);background:var(--warn-soft);color:var(--ink);border-radius:10px;padding:10px 12px;font-size:14px;font-weight:600}
.doc{display:flex;flex-direction:column;gap:14px;font-size:15px;line-height:1.6}
.doc h2{font-size:17px;margin-top:6px}
.doc ul{padding-left:20px;display:flex;flex-direction:column;gap:4px}

/* ── Telas maiores ────────────────────────── */
@media (min-width:720px){
  .pg{padding:36px 24px 56px}
  .entrada{margin-top:4vh;padding:32px 28px;background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);flex:0 0 auto}
  .foco{margin-top:6vh;padding:32px 28px;background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);flex:0 0 auto}
  .modal-fundo{align-items:center;padding:16px}
  .modal{width:480px;border-radius:16px}
  .modal-f .btn{flex:0 0 auto}
  .toasts{left:auto;right:18px;align-items:flex-end}
  .conta-f{flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between}
  .lista > li{flex-direction:row;align-items:center;justify-content:space-between;gap:14px}
  .pend .acoes .btn{flex:0 0 auto}
  .faixa{flex-direction:row;align-items:center;justify-content:space-between}
  .faixa .btn{align-self:auto}
  .topo{padding:10px 24px}
  .abas{padding:0 24px}
}
@media (prefers-reduced-motion:reduce){ *{animation:none!important;transition:none!important} }
@media print{ body::before{display:none} .topo,.abas,.rodape{display:none} }