/* Sítio São Pedro — estilo do sistema (mesma linguagem da tela de entrada) */
:root { --verde:#1f4a2b; --verde2:#2b5a34; --verde3:#4f9a63; --campo:#eaf0eb; --fundo:#f4f5f3; --texto:#18212b; --suave:#5d6773; --claro:#8a94a0;
  --borda:#e1e5e8; --borda2:#cdd4d9; --branco:#fff; --erro:#9b2c24; --r:8px; --sombra:0 1px 2px rgba(16,26,20,.05); }
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; font-size:clamp(15.5px, .4vw + 12.5px, 20px); }
body { margin:0; font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif; font-size:1rem; line-height:1.45;
  background:var(--fundo); color:var(--texto); font-variant-numeric:tabular-nums; -webkit-font-smoothing:antialiased; padding-bottom:calc(4.2rem + env(safe-area-inset-bottom)); }
a { color:var(--verde2); }
h1,h2,h3 { line-height:1.15; margin:0; }
h2 { font-size:1.5rem; font-weight:680; letter-spacing:-.02em; color:#101a14; }
h3 { font-size:.68rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--suave); margin:1.8rem 0 .6rem; }
.titulo-pagina { margin:.3rem 0 1.1rem; padding-bottom:.9rem; border-bottom:1px solid var(--borda); }
.titulo-pagina .eyebrow { display:block; font-size:.66rem; font-weight:700; letter-spacing:.24em; text-transform:uppercase; color:var(--verde2); margin-bottom:.4rem; }
.titulo-pagina h2 { display:flex; align-items:center; gap:.7rem; flex-wrap:wrap; }
.ic { width:1.15em; height:1.15em; flex:none; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; vertical-align:-.2em; }

/* estrutura: barra lateral + conteúdo */
.app { display:block; }
.lateral { position:fixed; z-index:30; top:0; bottom:0; left:0; width:17.5rem; max-width:86vw; background:#14301c; color:#dfe9e1; display:flex; flex-direction:column;
  transform:translateX(-102%); transition:transform .22s ease; box-shadow:0 0 30px rgba(0,0,0,.35); }
body.menu-aberto .lateral { transform:none; }
.velo { position:fixed; inset:0; z-index:25; background:rgba(8,20,12,.5); display:none; } body.menu-aberto .velo { display:block; }
.lateral-topo { display:flex; align-items:center; justify-content:space-between; padding:1rem 1rem .9rem 1.1rem; border-bottom:1px solid rgba(255,255,255,.08); }
.fechar-menu { background:none; border:0; color:#fff; padding:.3rem; cursor:pointer; opacity:.8; }
.marca-topo { display:flex; align-items:stretch; gap:.65rem; text-decoration:none; color:#fff; }
.marca-topo .barra { width:2px; background:var(--verde3); }
.marca-topo small { display:block; font-size:.56rem; font-weight:700; letter-spacing:.26em; text-transform:uppercase; opacity:.7; }
.marca-topo b { display:block; font-size:1.05rem; font-weight:650; letter-spacing:-.005em; line-height:1.2; }
.lateral-nav { flex:1; overflow-y:auto; padding:.6rem 0 1rem; }
.nav-item, .grupo summary { display:flex; align-items:center; gap:.7rem; padding:.62rem 1.1rem; color:#dfe9e1; text-decoration:none; font-size:.93rem; font-weight:560; cursor:pointer; list-style:none; border-left:3px solid transparent; }
.grupo summary::-webkit-details-marker { display:none; }
.grupo summary::after { content:"›"; margin-left:auto; opacity:.55; font-size:1.1rem; transition:transform .15s; }
.grupo[open] > summary::after { transform:rotate(90deg); }
.nav-item:hover, .grupo summary:hover { background:rgba(255,255,255,.06); }
.nav-item.ativa { background:rgba(255,255,255,.1); border-left-color:var(--verde3); color:#fff; }
.nav-item .ic, .grupo summary .ic { width:1.15rem; height:1.15rem; opacity:.85; }
.sub-item { display:block; padding:.46rem 1.1rem .46rem 3.05rem; color:#b9cbbd; text-decoration:none; font-size:.86rem; border-left:3px solid transparent; }
.sub-item:hover { color:#fff; background:rgba(255,255,255,.05); }
.sub-item.ativa { color:#fff; font-weight:650; border-left-color:var(--verde3); background:rgba(255,255,255,.08); }
.lateral-rodape { display:flex; align-items:center; justify-content:space-between; padding:.8rem 1.1rem calc(.8rem + env(safe-area-inset-bottom)); border-top:1px solid rgba(255,255,255,.08); font-size:.82rem; opacity:.95; }
.lateral-rodape form { margin:0; } .lateral-rodape button { display:flex; align-items:center; gap:.4rem; background:transparent; color:#fff; border:1px solid rgba(255,255,255,.28); border-radius:6px; padding:.35rem .65rem; font-size:.78rem; font-weight:600; cursor:pointer; }
.conteudo { min-width:0; }

.topo { position:sticky; top:0; z-index:8; display:flex; align-items:center; gap:.8rem; min-height:3.4rem; padding:.45rem max(1rem, env(safe-area-inset-right)) .45rem max(.6rem, env(safe-area-inset-left));
  color:#fff; background:#17331f; border-bottom:1px solid rgba(255,255,255,.08); }
.abrir-menu { background:none; border:0; color:#fff; padding:.4rem; cursor:pointer; } .abrir-menu .ic { width:1.5rem; height:1.5rem; }
.usuario-topo { margin-left:auto; font-size:.8rem; opacity:.7; }

main { padding:1.1rem max(1rem, env(safe-area-inset-right)) 1rem max(1rem, env(safe-area-inset-left)); max-width:52rem; margin:0 auto; }
main.larga { max-width:80rem; }

/* abas de baixo (celular) */
.abas { position:fixed; bottom:0; left:0; right:0; display:flex; background:#fff; border-top:1px solid var(--borda); padding-bottom:env(safe-area-inset-bottom); z-index:7; }
.abas a, .abas button { flex:1; display:flex; flex-direction:column; align-items:center; gap:.18rem; padding:.55rem .3rem .5rem; text-decoration:none; color:var(--claro); font:inherit; font-size:.66rem; font-weight:650; letter-spacing:.04em; text-transform:uppercase; background:none; border:0; cursor:pointer; }
.abas .ic { width:1.35rem; height:1.35rem; stroke-width:1.5; }
.abas a.ativa { color:var(--verde); box-shadow:inset 0 2px 0 var(--verde); }
@media (min-width:980px) {
  body { padding-bottom:2.5rem; }
  .lateral { transform:none; box-shadow:none; width:16.5rem; }
  .conteudo { margin-left:16.5rem; }
  .abas, .velo, .abrir-menu, .fechar-menu, .topo .marca-topo { display:none !important; }
  .topo { padding-left:1.4rem; background:#fff; color:var(--texto); border-bottom:1px solid var(--borda); min-height:3rem; }
  .usuario-topo { opacity:1; color:var(--suave); }
  main { padding-top:1.8rem; }
}

/* botões */
.botao { display:flex; align-items:center; justify-content:center; gap:.5rem; width:100%; min-height:2.8rem; padding:.55rem 1rem; margin:.6rem 0; font:inherit; font-size:.93rem; font-weight:620;
  letter-spacing:.01em; text-align:center; border:1px solid var(--verde); border-radius:var(--r); background:var(--verde); color:#fff; text-decoration:none; cursor:pointer; box-shadow:none; }
.botao:hover { background:#173a21; border-color:#173a21; }
.botao.claro { background:#fff; color:var(--verde); border-color:var(--borda2); }
.botao.claro:hover { background:var(--campo); border-color:#b6c7ba; }
.botao.perigo { background:#fff; color:var(--erro); border-color:#e3c3bf; } .botao.perigo:hover { background:#fdf1ef; }
.botao.vermelho { background:var(--erro); border-color:var(--erro); } .botao.vermelho:hover { background:#7f231d; border-color:#7f231d; }
.grade-botoes { display:grid; grid-template-columns:1fr 1fr; gap:.6rem; margin:.6rem 0; } .grade-botoes .botao { margin:0; }
.barra-acoes { display:grid; grid-template-columns:1fr 1fr; gap:.6rem; margin:.2rem 0 1rem; } .barra-acoes .botao { margin:0; width:100%; } .barra-acoes .botao:first-child:nth-last-child(odd) { grid-column:1 / -1; }
@media (min-width:860px) { .botao { width:auto; min-width:9rem; } form > .botao { width:100%; } .grade-botoes .botao { width:100%; } .barra-acoes { display:flex; flex-wrap:wrap; } .barra-acoes .botao { width:auto; flex:none; } }

/* listas em linhas (cartão único com divisórias) */
.lista { background:#fff; border:1px solid var(--borda); border-radius:10px; box-shadow:var(--sombra); overflow:hidden; margin:.7rem 0; }
.item { display:flex; align-items:center; gap:.85rem; padding:.8rem 1rem; color:inherit; text-decoration:none; border-bottom:1px solid #eef0f2; background:#fff; }
.item:last-child { border-bottom:0; }
a.item:hover { background:#f8faf8; }
.item .avatar, .item img { width:2.6rem; height:2.6rem; flex:none; border-radius:50%; object-fit:cover; background:var(--campo); color:var(--verde); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:1rem; }
.item .avatar .ic { width:1.3rem; height:1.3rem; }
.item .corpo { min-width:0; } .item b { display:block; font-size:.98rem; font-weight:620; }
.item small { display:block; color:var(--suave); font-size:.82rem; margin-top:.05rem; }
.item .direita { margin-left:auto; text-align:right; font-weight:650; white-space:nowrap; }
.item .seta { margin-left:auto; color:#b3bbc3; } .item .seta .ic { width:1.1rem; height:1.1rem; }
.item .data { flex:none; width:3.4rem; font-size:.78rem; font-weight:650; color:var(--suave); letter-spacing:.02em; }
.etiqueta { display:inline-block; font-size:.62rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; padding:.22rem .55rem; border-radius:4px; background:var(--campo); color:var(--verde2); vertical-align:middle; }
.etiqueta.alerta { background:#f9e4e1; color:var(--erro); }
.vazio { color:var(--suave); padding:1.4rem 1rem; text-align:center; font-size:.92rem; }

/* indicadores */
.stats { display:grid; grid-template-columns:repeat(auto-fit, minmax(7.2rem, 1fr)); gap:0; background:#fff; border:1px solid var(--borda); border-radius:10px; box-shadow:var(--sombra); overflow:hidden; margin:.2rem 0 1rem; }
.stats div { background:#fff; padding:.8rem 1rem; border-right:1px solid #eef0f2; border-bottom:1px solid #eef0f2; margin:0 -1px -1px 0; }
.stats b { display:block; font-size:1.45rem; font-weight:650; letter-spacing:-.02em; color:var(--texto); line-height:1.1; }
.stats small { display:block; margin-top:.2rem; color:var(--suave); font-size:.64rem; font-weight:700; text-transform:uppercase; letter-spacing:.14em; }
.stats .total { background:#f3f7f4; box-shadow:inset 0 2px 0 var(--verde); } .stats .total b { color:var(--verde); }

.filtros { background:#fff; border:1px solid var(--borda); border-radius:10px; padding:.1rem 1rem .9rem; margin:.7rem 0; }
.filtros summary { padding:.75rem 0; font-size:.85rem; font-weight:650; cursor:pointer; color:var(--verde); list-style:none; letter-spacing:.02em; }
.filtros summary::-webkit-details-marker { display:none; } .filtros summary::after { content:"+"; float:right; font-size:1.1rem; line-height:1; }
.filtros[open] summary::after { content:"–"; }

/* dados do animal */
.dados { background:#fff; border:1px solid var(--borda); border-radius:10px; box-shadow:var(--sombra); margin:.7rem 0; }
.dados div { display:flex; flex-direction:column; gap:.1rem; padding:.7rem 1rem; border-bottom:1px solid #eef0f2; }
.dados div:last-child { border-bottom:0; }
.dados dt { color:var(--suave); font-size:.64rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.dados dd { margin:0; font-size:.97rem; }
@media (min-width:600px) { .dados div { flex-direction:row; align-items:baseline; gap:1rem; } .dados dt { width:9rem; flex:none; } }
.foto-grande { width:100%; max-height:20rem; object-fit:cover; border-radius:10px; border:1px solid var(--borda); margin-bottom:.9rem; }

/* ações: lista discreta, não botões gigantes */
.acoes { background:#fff; border:1px solid var(--borda); border-radius:10px; box-shadow:var(--sombra); overflow:hidden; display:grid; grid-template-columns:1fr; }
.acoes a { display:flex; align-items:center; gap:.85rem; padding:.78rem 1rem; color:var(--texto); text-decoration:none; border-bottom:1px solid #eef0f2; font-size:.95rem; font-weight:560; }
.acoes a:last-child { border-bottom:0; } .acoes a:hover { background:#f8faf8; }
.acoes a .ic { width:2.2rem; height:2.2rem; padding:.55rem; border-radius:8px; background:var(--campo); color:var(--verde); stroke-width:1.5; }
.acoes a::after { content:"›"; margin-left:auto; color:#b3bbc3; font-size:1.3rem; line-height:1; }
.acoes a.perigo { color:var(--erro); } .acoes a.perigo .ic { background:#f9e4e1; color:var(--erro); }
@media (min-width:700px) { .acoes { grid-template-columns:1fr 1fr; } .acoes a:nth-last-child(2):nth-child(odd) { border-bottom:0; } .acoes a:nth-child(odd) { border-right:1px solid #eef0f2; } }

/* formulários */
input, select, textarea { width:100%; padding:.7rem .85rem; font:inherit; font-size:.97rem; border:1px solid var(--borda2); border-radius:var(--r); background:#fff; color:var(--texto); }
input:focus, select:focus, textarea:focus { outline:0; border-color:var(--verde2); box-shadow:0 0 0 .18rem rgba(43,90,52,.16); }
input[type=checkbox] { width:1.25rem; height:1.25rem; margin-right:.7rem; vertical-align:middle; accent-color:var(--verde); }
label { display:block; margin:1.05rem 0 .35rem; font-size:.8rem; font-weight:650; color:#2c3641; letter-spacing:.01em; }
#id_animais { list-style:none; padding:0; margin:0; background:#fff; border:1px solid var(--borda); border-radius:10px; overflow:hidden; }
#id_animais label { display:flex; align-items:center; margin:0; padding:.7rem 1rem; border-bottom:1px solid #eef0f2; font-size:.97rem; font-weight:500; }
#id_animais li:last-child label { border-bottom:0; }
.erro { display:block; margin-top:.4rem; color:var(--erro); font-size:.85rem; }
form > .botao { margin-top:1.4rem; }

/* caixa */
.mes { display:flex; justify-content:space-between; align-items:center; margin:1rem 0 .6rem; }
.mes span { font-weight:650; font-size:1rem; display:inline-block; } .mes span::first-letter { text-transform:uppercase; }
.mes a { display:flex; width:2.2rem; height:2.2rem; align-items:center; justify-content:center; border-radius:var(--r); border:1px solid var(--borda2); background:#fff; text-decoration:none; color:var(--verde); }
.stats.caixa div { flex:1; } .stats.caixa b { font-size:1.15rem; }
.entrada { color:#1d6b35; } .saida { color:var(--erro); }

/* foto */
.foto-campo { margin:.3rem 0; }
.foto-campo img { display:block; width:100%; max-height:15rem; object-fit:cover; border-radius:10px; margin-bottom:.6rem; }
.foto-campo input[type=file] { display:none; }

/* avisos */
#fila-aviso { background:#fbf4dc; color:#5b4a00; padding:.55rem 1rem; font-size:.85rem; font-weight:600; text-align:center; border-bottom:1px solid #eee0ab; }
#instalar { display:none; background:#fff; border:1px solid var(--borda); border-radius:10px; padding:.7rem 1rem; margin:0 0 1rem; font-size:.88rem; color:var(--suave); }
#instalar summary { cursor:pointer; font-weight:620; color:var(--verde); list-style:none; } #instalar summary::-webkit-details-marker { display:none; }
#instalar p { margin:.6rem 0 0; } #instalar b { color:var(--texto); } #instalar .botao { margin:.6rem 0 0; min-height:2.5rem; }

/* complementos */
.nota { color:var(--suave); font-size:.9rem; margin:.2rem 0 1rem; padding:.7rem .9rem; background:#fff; border:1px solid var(--borda); border-left:3px solid var(--verde3); border-radius:8px; }
.ajuda { display:block; color:var(--claro); font-size:.78rem; margin-top:.25rem; }
label.marcar { display:flex; align-items:center; margin:1rem 0 .3rem; font-size:.95rem; font-weight:560; }
.barra-busca { display:grid; gap:.5rem; margin:.4rem 0; } @media (min-width:700px) { .barra-busca { grid-template-columns:2fr 1fr 1fr; } .barra-busca input:only-child { grid-column:1/-1; } }
.painel-aviso { background:#fff; border:1px solid var(--borda); border-left:3px solid var(--erro); border-radius:8px; padding:.9rem 1rem; margin:.5rem 0 1rem; }
.tabela { width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--borda); border-radius:10px; overflow:hidden; font-size:.9rem; }
.tabela th { text-align:left; font-size:.64rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--suave); padding:.65rem .8rem; background:#f7f9f7; border-bottom:1px solid var(--borda); }
.tabela td { padding:.6rem .8rem; border-bottom:1px solid #eef0f2; vertical-align:middle; } .tabela tr:last-child td { border-bottom:0; }
.tabela td.num, .tabela th.num { text-align:right; } .tabela input { padding:.45rem .6rem; }
.rolagem { overflow-x:auto; }
.item .avatar.alerta { background:#fff1d6; color:#9a6a00; }
.item .data.atraso { color:var(--erro); }
.duas-colunas { display:block; } @media (min-width:860px) { .duas-colunas { display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; } }
.mensagem { background:#e8f3ea; border:1px solid #b9d8c0; border-left:3px solid var(--verde3); color:#1b4a28; border-radius:8px; padding:.7rem .95rem; margin:0 0 1rem; font-size:.92rem; font-weight:560; }
.mensagem.error { background:#fdecea; border-color:#e8bcb7; border-left-color:var(--erro); color:#7a231d; }
.mensagem.warning { background:#fbf4dc; border-color:#eee0ab; border-left-color:#c9a227; color:#5b4a00; }
.selecao-barra { display:grid; grid-template-columns:1fr 1fr; gap:.5rem; margin-bottom:.5rem; } .selecao-barra input { grid-column:1/-1; }
.selecao-barra .botao.pequeno { min-height:2.4rem; margin:0; width:100%; }
.selecao-lista { max-height:24rem; overflow-y:auto; margin:.2rem 0; }
.sel-item { cursor:pointer; margin:0; } .sel-item[hidden] { display:none; } .sel-item input { margin:0; flex:none; }
.selecao-total { color:var(--suave); font-size:.88rem; margin:.4rem 0 1rem; }
.duas-cols-form { display:grid; gap:0 1rem; } @media (min-width:700px) { .duas-cols-form { grid-template-columns:1fr 1fr; } }
.botao.pequeno { display:inline-flex; width:auto; min-height:2.2rem; padding:.3rem .8rem; font-size:.85rem; margin:0; }
.acao-inline { margin:0; display:inline; } .acao-inline button { cursor:pointer; }
.cal { display:grid; grid-template-columns:repeat(7,1fr); gap:2px; margin:.4rem 0 1rem; background:var(--borda); border:1px solid var(--borda); border-radius:10px; overflow:hidden; }
.cal .dow { background:#f7f9f7; font-size:.62rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--suave); text-align:center; padding:.4rem 0; }
.cal a, .cal span.dia { background:#fff; min-height:3.1rem; padding:.3rem .4rem; font-size:.85rem; text-decoration:none; color:var(--texto); display:block; }
.cal span.dia.vazio { background:#fafbfa; } .cal .hoje { box-shadow:inset 0 0 0 2px var(--verde3); }
.cal .pt { display:inline-block; min-width:1.2rem; text-align:center; background:var(--verde); color:#fff; border-radius:9px; font-size:.65rem; font-weight:700; padding:0 .3rem; margin-top:.2rem; } .cal .pt.at { background:var(--erro); }
.dia-titulo { font-size:.74rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--suave); margin:1.2rem 0 .4rem; }
.concluida b { text-decoration:line-through; color:var(--claro); }
.relatorio-cab { display:flex; flex-wrap:wrap; gap:.6rem; align-items:end; margin:.4rem 0 1rem; } .relatorio-cab > * { flex:none; } .relatorio-cab label { margin:0 0 .25rem; }
@media print { .lateral, .topo, .abas, .velo, .no-print, #fila-aviso, #instalar { display:none !important; } .conteudo { margin:0 !important; } body { background:#fff; padding:0 !important; } main { max-width:none; padding:0; } .tabela, .lista, .stats { box-shadow:none; } }
label::first-letter { text-transform:uppercase; }
/* tela de entrada: cartão branco no centro, em qualquer aparelho (tamanhos em "em" crescem com a tela) */
.entrada-pagina { --verde:#1f4a2b; --verde2:#2b5a34; --cinza:#566170; --linha:#cfd6dd;
  margin:0; min-height:100vh; min-height:100dvh; display:grid; place-items:center; position:relative;
  padding:max(16px, 3vmin) max(16px, env(safe-area-inset-right)) max(16px, 3vmin) max(16px, env(safe-area-inset-left));
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:clamp(16px, .55vw + 12.5px, 26px); line-height:1.35; color:#16202a; background:#0e1a12; }
.entrada-fundo { position:fixed; inset:0; z-index:0;
  background:linear-gradient(180deg,rgba(8,20,12,.35) 0%,rgba(8,20,12,.10) 45%,rgba(8,20,12,.45) 100%),
             url('/static/img/fundo-login-celular.jpg') 50% 62% / cover no-repeat, #16301d; }
@media (min-width:900px) {
  .entrada-fundo { background-image:linear-gradient(180deg,rgba(8,20,12,.30) 0%,rgba(8,20,12,.08) 45%,rgba(8,20,12,.40) 100%),
             url('/static/img/fundo-login.jpg'); }
}
.entrada-cartao { position:relative; z-index:1; box-sizing:border-box; width:min(100%, 26em); margin:0; max-width:none;
  background:#fff; border-radius:.9em; padding:2em 2em 1.5em; box-shadow:0 1.6em 4em rgba(0,0,0,.45), 0 .1em .4em rgba(0,0,0,.2); }
.entrada-cartao .marca { text-align:center; padding-bottom:1.3em; margin-bottom:.3em; border-bottom:1px solid #e6eaee; }
.entrada-cartao .marca .eyebrow { display:block; font-size:.7em; font-weight:700; letter-spacing:.24em; text-transform:uppercase; color:var(--verde2); }
.entrada-cartao .marca h1 { margin:.35em 0 .15em; font-size:1.9em; font-weight:750; letter-spacing:-.015em; line-height:1.1; color:var(--verde); }
.entrada-cartao .marca .local { margin:0; font-size:.95em; color:var(--cinza); letter-spacing:.04em; }
.entrada-cartao .marca .fio { display:block; width:2.6em; height:.17em; margin:.7em auto 0; border-radius:.2em; background:linear-gradient(90deg,#4f9a63,var(--verde)); }
.entrada-cartao p.sub { margin:1.1em 0 .2em; font-size:.98em; color:var(--cinza); text-align:center; }
.entrada-cartao label { display:block; margin:1.1em 0 .4em; font-size:.88em; font-weight:650; color:#25303b; text-transform:none; letter-spacing:0; }
.entrada-cartao input { box-sizing:border-box; width:100%; height:3.1em; padding:0 .9em; font-size:1em; color:#101a14; background:#fff;
  border:1px solid var(--linha); border-radius:.6em; }
.entrada-cartao input:focus { outline:0; border-color:var(--verde2); box-shadow:0 0 0 .22em rgba(43,90,52,.18); }
.entrada-senha { position:relative; }
.entrada-senha input { padding-right:5.4em; }
.entrada-senha button { position:absolute; right:.35em; top:50%; transform:translateY(-50%); height:2.3em; padding:0 .8em; border:0; background:transparent;
  color:var(--verde2); font-size:.88em; font-weight:650; border-radius:.5em; cursor:pointer; box-shadow:none; width:auto; }
.entrada-cartao .erro { display:block; margin-top:.9em; padding:.65em .8em; background:#fdecea; color:#9b2c24; border-radius:.5em; font-size:.92em; }
.entrada-cartao .botao { display:block; box-sizing:border-box; width:100%; height:3.2em; margin:1.5em 0 0; padding:0; border:0; border-radius:.6em;
  background:var(--verde); color:#fff; font-size:1em; font-weight:650; letter-spacing:.01em; cursor:pointer; box-shadow:none; }
.entrada-cartao .botao:hover { background:#173a21; }
.entrada-cartao .rodape { margin-top:1.4em; padding-top:1em; border-top:1px solid #e6eaee; text-align:center; font-size:.8em; color:#6b7585; }
/* celular deitado / telas baixas: marca de um lado, formulário do outro, sem precisar rolar */
@media (max-height:520px) and (min-width:560px) {
  .entrada-pagina { font-size:14px; }
  .entrada-cartao { width:min(100%, 44em); display:grid; grid-template-columns:1fr 1.15fr; gap:0 1.8em; align-items:center; padding:1.4em 1.8em; }
  .entrada-cartao .marca { border-bottom:0; border-right:1px solid #e6eaee; padding:.4em 1.4em .4em 0; margin:0; }
  .entrada-cartao p.sub { margin-top:0; }
}