:root{
  --bg:#f6f4f7; --surf:#fff; --surf2:#faf7fb; --linha:#e6dfe9;
  --ink:#221b26; --ink2:#6b6070; --ink3:#8a7f8e;
  --vinho:#8c3a63; --ambar:#9a6a14; --azul:#3c5f8a; --verde:#2c7a5c;
}
*{box-sizing:border-box;margin:0}
body{font-family:"Avenir Next","Helvetica Neue",Helvetica,Arial,sans-serif;background:var(--bg);color:var(--ink);font-size:15px;-webkit-font-smoothing:antialiased}
.topo{background:var(--surf);border-bottom:1px solid var(--linha);padding:14px 16px;position:sticky;top:0;z-index:5}
.topo .volta{font-size:13px;color:var(--vinho);text-decoration:none;display:inline-block;margin-bottom:6px}
h1{font-size:19px;letter-spacing:-.01em}
.sub{color:var(--ink2);font-size:13px;margin-top:2px}
.metro{display:flex;align-items:center;gap:10px;margin-top:12px}
.barra{flex:1;height:7px;border-radius:99px;background:var(--linha);overflow:hidden;max-width:220px}
.barra i{display:block;height:100%;background:var(--vinho);border-radius:99px}
main{max-width:640px;margin:0 auto;padding:12px 12px 32px;display:flex;flex-direction:column;gap:10px}
.cartao{background:var(--surf);border:1px solid var(--linha);border-radius:12px;padding:13px 14px;box-shadow:0 1px 2px rgba(34,27,38,.05)}
.linha1{display:flex;align-items:baseline;gap:8px}
.num{color:#a79cab;font-size:12px;min-width:16px;font-variant-numeric:tabular-nums}
h2{font-size:16.5px;font-weight:700;flex:1;line-height:1.2}
.etiqueta{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:3px 7px;border-radius:5px;white-space:nowrap;color:#fff}
.f1{background:var(--vinho)}.f2{background:var(--ambar)}.f3{background:var(--azul)}.f4{background:var(--ink2)}
.fatos{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:12.5px;color:var(--ink2);margin-top:7px}
.fatos b{color:var(--ink)}
.tags{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}
.tag.forte{background:#f6e7ef;color:#8c3a63;font-weight:700}
.tag{font-size:11px;background:#f1eaf3;color:#6b4a72;padding:3px 8px;border-radius:99px}
.hist{font-size:12px;color:var(--ink2);margin-top:8px;background:#f3eef5;padding:6px 9px;border-radius:7px}
.hist.sem{color:var(--ink3);background:#f7f5f8}
.gancho{font-size:13.5px;color:#4a4050;line-height:1.45;margin-top:9px;border-left:2px solid #e0d4e6;padding-left:9px}
.acoes{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.b{font:inherit;font-size:13px;font-weight:600;padding:9px 12px;border-radius:8px;border:1px solid #d9cede;background:var(--surf2);color:var(--ink);text-decoration:none;cursor:pointer;display:inline-block}
.b.zap{background:var(--vinho);border-color:var(--vinho);color:#fff}
.b.ok{background:#e9f3ee;border-color:transparent;color:var(--verde)}
.b.g{color:var(--ink2)}
.rodape{color:var(--ink3);font-size:12.5px;text-align:center;padding:10px 4px 0;line-height:1.5}
.menu{display:flex;flex-direction:column;gap:10px}
.item{display:block;background:var(--surf);border:1px solid var(--linha);border-radius:12px;padding:16px;text-decoration:none;color:inherit}
.item h3{font-size:16px;display:flex;align-items:center;gap:8px}
.item p{color:var(--ink2);font-size:13px;margin-top:4px;line-height:1.4}
.item .contador{font-size:12px;color:var(--vinho);font-weight:700;margin-top:8px;display:block}
.item.breve{opacity:.55}
.selo{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;background:#f1eaf3;color:#6b4a72;padding:2px 7px;border-radius:99px;font-weight:700}
.bloco{background:var(--surf);border:1px solid var(--linha);border-radius:12px;padding:14px}
.bloco h3{font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:var(--vinho);margin-bottom:11px}
.grandes{display:flex;gap:10px}
.g{flex:1;background:var(--surf2);border-radius:10px;padding:11px}
.g b{display:block;font-size:20px;letter-spacing:-.02em}
.g span{font-size:11.5px;color:var(--ink2);display:block;margin-top:3px;line-height:1.3}
.et{display:grid;grid-template-columns:1fr auto;gap:2px 8px;margin-bottom:9px}
.et .b2{grid-column:1/3;height:7px;background:#efe9f1;border-radius:99px;overflow:hidden}
.et .b2 i{display:block;height:100%;border-radius:99px;background:var(--vinho)}
table{width:100%;border-collapse:collapse;font-size:13px}
th{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink3);text-align:right;padding-bottom:6px}
th:first-child{text-align:left}
td{text-align:right;padding:9px 0;border-top:1px solid #efe9f1;font-variant-numeric:tabular-nums}
td.p{text-align:left;font-weight:700}
.pin{max-width:320px;margin:18vh auto;padding:0 16px;text-align:center}
.pin input{width:100%;font-size:26px;text-align:center;letter-spacing:.3em;padding:14px;border:1px solid #d9cede;border-radius:10px;margin:18px 0 12px;font-family:"IBM Plex Mono",monospace}
.pin .b{width:100%;padding:13px}
.erro{color:#b3402f;font-size:13px;margin-top:8px}
.quem{display:flex;gap:6px;margin-top:10px}
.quem a{font-size:13px;font-weight:700;padding:6px 14px;border-radius:99px;border:1px solid #d9cede;text-decoration:none;color:var(--ink);background:var(--surf)}
.quem a.on{background:var(--vinho);border-color:var(--vinho);color:#fff}

.chips{display:flex;gap:6px;overflow-x:auto;margin-top:12px;padding-bottom:2px}
.chip{white-space:nowrap;font-size:12.5px;padding:6px 11px;border-radius:99px;border:1px solid var(--linha);background:var(--surf);color:var(--ink);text-decoration:none}
.chip span{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--ink3);margin-left:4px}
.chip.on{background:var(--vinho);border-color:var(--vinho);color:#fff}
.chip.on span{color:#f0d8e4}
.b.mais{display:block;text-align:center;margin:6px 0 2px}

.txt{font-size:13.5px;line-height:1.55;color:#3f3646;margin-bottom:9px}
.txt b{color:var(--ink)}

.ajuda{color:var(--vinho);text-decoration:underline;text-underline-offset:2px}

.resumo{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;background:var(--surf);border:1px solid var(--linha);border-radius:12px;padding:12px}
.resumo div{background:var(--surf2);border-radius:9px;padding:9px}
.resumo b{display:block;font-size:17px;letter-spacing:-.02em}
.resumo span{display:block;font-size:11px;color:var(--ink2);line-height:1.25;margin-top:2px}

.cartao.linha{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 13px}
.cartao.linha b{display:block;font-size:14.5px}
.cartao.linha .fatos{margin-top:2px}

.et.total{border-top:1px solid var(--linha);padding-top:8px;margin-top:4px}

.aviso{background:#fdf1e7;border:1px solid #f0d3b4;border-radius:12px;padding:12px 14px;margin-bottom:10px}
.aviso b{color:#9a6a14;font-size:14px}
.aviso p{font-size:12.5px;color:#7a5f3a;line-height:1.45;margin-top:4px}
.aviso .nomes{color:#9a6a14;font-weight:600}

.esteira{background:var(--surf);border:1px solid var(--linha);border-radius:12px;padding:14px}
.esteira h3{font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:var(--vinho);margin-bottom:12px}
.etapa{border:1px dashed var(--linha2);border-radius:10px;padding:10px 11px}
.etapa.entrada{border-style:solid;border-color:#d9e6f2;background:#f6fafd}
.etapa.ganho{border-style:solid;border-color:#cfe9db;background:#f3faf6}
.etapa.fora{border-style:solid;border-color:#efe9f1;background:var(--surf2)}
.rotulo{font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:700;color:var(--ink2)}
.explica{font-size:12px;color:var(--ink2);line-height:1.45;margin:5px 0 8px}
.caixas{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:8px}
.caixas.tres{grid-template-columns:repeat(3,1fr)}
.caixas.quatro{grid-template-columns:repeat(2,1fr)}
.cx{background:var(--surf);border:1px solid var(--linha);border-radius:9px;padding:9px;text-decoration:none;color:inherit;display:block}
.cx b{display:block;font-size:17px;letter-spacing:-.02em}
.cx span{display:block;font-size:11px;color:var(--ink2);line-height:1.3;margin-top:2px}
.cx i{font-style:normal;color:var(--ink3);font-size:10.5px}
.cx.clicavel:hover{border-color:var(--vinho)}
.cx.on{border-color:var(--vinho);background:#fbf2f6}
.cx.forte b{color:var(--verde)}
.cx.verde b{color:var(--verde)}
.cx.vermelho b{color:#b3402f}
.seta{text-align:center;color:var(--ink3);font-size:15px;margin:6px 0}
.seta small{display:block;font-size:11px}
.todas{display:inline-block;margin-top:8px;font-size:12.5px;color:var(--vinho);text-decoration:underline;text-underline-offset:2px}
.todas.on{font-weight:700}
.titulo-lista{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink2);margin:16px 2px 2px}

.esteira{padding:12px 0 6px;background:transparent;border:0}
.trilho{display:flex;align-items:stretch;gap:8px;overflow-x:auto;padding:2px 12px 8px;scroll-snap-type:x proximity}
.trilho::-webkit-scrollbar{height:6px}
.trilho::-webkit-scrollbar-thumb{background:#ded5e3;border-radius:99px}
.grupo{flex:0 0 auto;background:var(--surf);border:1px solid var(--linha);border-radius:12px;padding:9px 10px;scroll-snap-align:start}
.grupo.destaque{border-color:var(--vinho);box-shadow:0 0 0 1px rgba(140,58,99,.12)}
.grupo.ganho{border-color:#cfe9db;background:#f3faf6}
.grupo.fora{background:var(--surf2)}
.grupo.saida{background:#fdf3f1;border-color:#f0d6d0}
.grupo-nome{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.07em;color:var(--ink2);font-weight:700;margin-bottom:7px;white-space:nowrap}
.paradas{display:flex;gap:6px}
.parada{flex:0 0 auto;min-width:74px;background:var(--surf2);border:1px solid transparent;border-radius:9px;padding:7px 9px;text-decoration:none;color:inherit}
.grupo.fora .parada,.grupo.saida .parada,.grupo.ganho .parada{background:var(--surf)}
.parada b{display:block;font-size:17px;letter-spacing:-.02em;white-space:nowrap}
.parada span{display:block;font-size:10.5px;color:var(--ink2);margin-top:1px;white-space:nowrap}
.parada.on{border-color:var(--vinho);background:#fbf2f6}
.parada.verde b{color:var(--verde)}
.parada.vermelho b{color:#b3402f}
.parada.info{background:#f2f7fb}
.liga{flex:0 0 auto;align-self:center;color:var(--ink3);font-size:15px;text-align:center;padding:0 2px}
.liga small{display:block;font-size:9.5px;line-height:1.1;max-width:52px}
.dica{font-size:11px;color:var(--ink3);text-align:center;margin-top:2px}
.selecionado{margin:14px 2px 4px}
.selecionado h3{font-size:14px;color:var(--ink)}
.selecionado p{font-size:12.5px;color:var(--ink2);line-height:1.45;margin-top:3px}
@media (min-width:900px){ .dica{display:none} }

/* ------- computador: usa a tela inteira ------- */
@media (min-width:900px){
  main{max-width:1180px;padding:16px 20px 40px}
  .topo{padding:16px 20px}
  .topo > *{max-width:1180px;margin-left:auto;margin-right:auto;width:100%}
  .trilho{padding-left:0;padding-right:0;justify-content:flex-start;flex-wrap:nowrap}
  .parada{min-width:86px}
  .cartoes{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
  .menu{max-width:760px}
  .resumo{grid-template-columns:repeat(6,1fr)}
}
@media (min-width:1400px){
  main{max-width:1340px}
  .topo > *{max-width:1340px}
  .cartoes{grid-template-columns:repeat(3,1fr)}
}

.fatos.tel{font-size:13.5px;color:var(--ink);letter-spacing:.02em}
.hist b{display:block;font-size:11.5px;color:var(--ink2);margin-bottom:3px}
.canal{display:block;font-size:11.5px;color:var(--ink2);line-height:1.5}
.verconversa{display:inline-block;margin-top:5px;font-size:12px;color:var(--vinho);text-decoration:underline;text-underline-offset:2px}
.conversa{display:flex;flex-direction:column;gap:6px;max-height:380px;overflow-y:auto;padding-right:2px}
.msg{border-radius:9px;padding:7px 9px;max-width:88%}
.msg.dela{background:var(--surf2);align-self:flex-start}
.msg.nossa{background:#f0e7f2;align-self:flex-end}
.msg.interna{background:#fdf1e7;align-self:center;max-width:100%}
.msg p{font-size:13px;line-height:1.4;white-space:pre-wrap;overflow-wrap:anywhere}
.msg .quando{font-size:10px;color:var(--ink3);display:block;margin-bottom:2px}

.naoident{color:var(--ink3);font-style:italic}

/* abas de conversa, um número por aba */
.abas{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 4px}
.aba{font:inherit;font-size:12.5px;padding:6px 13px;border-radius:99px;cursor:pointer;
     border:1px solid var(--linha);background:var(--surf);color:var(--ink)}
.aba.vale{background:var(--vinho);border-color:var(--vinho);color:#fff}
.grupo-por{display:block;font-size:11.5px;line-height:1.45;color:var(--ink3);margin:-2px 0 7px;max-width:44ch}

.item .links{margin-top:9px;font-size:13px;font-weight:700}
.item .links a{color:var(--vinho);text-decoration:none}
.item .links a:hover{text-decoration:underline}

/* Detalhe da compra no cartão da esteira (Aislan, 23/09): a Nat precisa saber o que a pessoa fez e
   quanto pagou antes de gravar o áudio, sem abrir a ficha. Letra menor que o resto do cartão e uma
   linha por compra, com respiro entre elas: emendado vira parágrafo e ninguém lê. */
.cartao .compras{margin:10px 0 0;padding:9px 11px;background:#faf8fb;border:1px solid var(--linha);border-radius:10px}
.cartao .compras > b{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:#6b4a72;margin:0 0 6px}
.cartao .compras .compra{display:grid;grid-template-columns:70px 1fr auto;gap:0 8px;align-items:baseline;font-size:12.5px;line-height:1.45;color:var(--texto);margin:0 0 5px}
.cartao .compras .compra:last-child{margin-bottom:0}
.cartao .compras .compra i{font-style:normal;font-size:11.5px;color:#8a8a8a;font-variant-numeric:tabular-nums}
.cartao .compras .compra b{font-weight:700;font-variant-numeric:tabular-nums}
.cartao .compras .compra.mais{display:block;color:#8a8a8a;font-size:11.5px;padding-left:78px}
.cartao .compras.pendente{background:#fdf6ec;border-color:#f0dcc0}
.cartao .compras.pendente > b{color:#8a5a12}
.aviso.marcado{background:#fdecec;border-color:#f1c9c9}
.aviso.marcado b{color:#a12b2b}
.b.ce{background:#eef4fb;color:#24557f;border:1px solid #cfe0f0}
.b.ce:hover{background:#e2edf8}
/* Marcações: separar o que o painel percebeu sozinho do que alguém marcou à mão (Aislan, 23/09). */
.cartao.linha .comofoi{display:block;margin-top:3px;font-size:11.5px;line-height:1.4}
.cartao.linha .comofoi.auto{color:#4a7c59}
.cartao.linha .comofoi.auto::before{content:"⚙ "}
.cartao.linha .comofoi.mao{color:#6b4a72}
.cartao.linha .comofoi.mao::before{content:"👤 "}
/* Busca por nome ou telefone no alto da esteira (Aislan, 23/09). */
.topo .buscar{display:flex;gap:6px;align-items:center;margin:10px 0 0}
.topo .buscar input{flex:1;min-width:0;padding:9px 11px;font-size:14px;border:1px solid var(--linha);border-radius:10px;background:var(--surf);color:var(--texto)}
.topo .buscar input:focus{outline:2px solid var(--vinho);outline-offset:-1px}
.topo .buscar .b{flex:0 0 auto;padding:9px 16px;white-space:nowrap}
.topo .buscar .limpar{font-size:12.5px;color:var(--vinho);white-space:nowrap}
.cartao .situacao.fatos{margin-top:2px;color:#6b4a72}
.aviso.ja{background:#eef4fb;border-color:#cfe0f0}
.aviso.ja b{color:#24557f}
/* Fora da esteira: cada quadradinho carrega a própria regra de volta, em vez de uma linha corrida
   com as quatro emendadas (Aislan, 23/09). */
.parada.larga{min-width:104px}
.parada em{display:block;font-style:normal;font-size:10px;line-height:1.3;color:var(--ink3);margin-top:3px;
  padding-top:3px;border-top:1px solid var(--linha);white-space:normal}
.parada.on em{border-top-color:#e6cddc}
@media (min-width:600px){.parada.larga{min-width:116px}}

/* ---------------------------------------------------------------------------
   Linha de produção: cartões alinhados em vez de fita apertada (Aislan, 23/09).
   No computador vira grade: todos os cartões da mesma linha nascem na mesma
   altura, os quadradinhos dividem a largura por igual e as setas somem, porque
   com os cartões quebrando em linhas elas apontavam para o lugar errado.
--------------------------------------------------------------------------- */
.grupo{padding:12px 13px 13px}
.grupo-nome{margin-bottom:5px;white-space:normal;line-height:1.35}
.grupo-por{margin:0 0 10px}
.paradas{gap:8px;flex-wrap:wrap}
.parada{padding:9px 11px}
.parada b{font-size:18px}

@media (min-width:900px){
  /* No computador a fita continua fita: uma linha só, arrastando de lado (Aislan, 23/09). A grade
     alinhava bonito, mas quebrava o caminho em três pedaços e ninguém lia como sequência. */
  .esteira{padding:14px 0 8px}
  .trilho{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:10px;padding:2px 2px 10px;align-items:stretch}
  .grupo{display:flex;flex-direction:column;padding:15px 16px 16px;min-width:min-content}
  .grupo-por{min-height:36px;max-width:34ch}
  .paradas{margin-top:auto;flex-wrap:nowrap;gap:9px}
  .parada{min-width:96px}
  .parada b{font-size:20px}
  .liga{display:block;align-self:center}
  .dica{display:block}
}
}
/* Descrição e valor da compra em colunas, para o valor nunca cair sozinho na linha de baixo, e os
   botões do cartão numa grade de larguras iguais, para a fileira não ficar torta (Aislan, 23/09). */
.cartao .compras .compra .oq{min-width:0}
.cartao .compras .compra b{white-space:nowrap}
.cartao .acoes{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:8px;margin-top:12px;align-items:stretch}
.cartao .acoes form{display:block}
.cartao .acoes .b{display:flex;align-items:center;justify-content:center;width:100%;min-height:42px;padding:9px 10px;text-align:center}
/* Cartões da mesma linha terminam juntos: altura igual e os botões colados no rodapé, em vez de cada
   cartão acabar onde o texto dele acabou (Aislan, 23/09). */
@media (min-width:900px){
  .cartoes{align-items:stretch}
  .cartoes .cartao{display:flex;flex-direction:column}
  .cartoes .cartao .acoes{margin-top:auto}
}
/* No celular os cartões vinham quase colados: um respiro entre eles para a leitura não embolar
   (Aislan, 23/09, vendo no telefone). */
.cartoes{display:flex;flex-direction:column;gap:16px}
@media (min-width:900px){.cartoes{display:grid;gap:14px}}
/* Barra de identidade + relatar erro, e a tela do registro (Aislan, 23/09). */
.barra-quem{position:sticky;bottom:0;z-index:50;display:flex;gap:10px;align-items:center;justify-content:space-between;
  flex-wrap:wrap;padding:8px 14px;background:var(--surf);border-top:1px solid var(--linha);font-size:12.5px}
.barra-quem .quem{display:flex;gap:6px;align-items:center;color:var(--ink2)}
.barra-quem select{font:inherit;font-size:12.5px;padding:5px 8px;border:1px solid var(--linha);border-radius:8px;background:var(--surf2);color:var(--texto)}
.barra-quem .b{flex:0 0 auto;font-size:12px;padding:6px 10px}
.cx-problema{position:fixed;inset:auto 0 0;z-index:60;background:var(--surf);border-top:1px solid var(--linha);
  box-shadow:0 -6px 20px rgba(34,27,38,.12);padding:16px 16px 20px}
.cx-problema h3{font-size:15px;margin-bottom:4px}
.cx-problema textarea{width:100%;font:inherit;font-size:14px;padding:10px;border:1px solid var(--linha);border-radius:10px;margin-top:8px;background:var(--surf2);color:var(--texto)}
.acoes-problema{display:flex;gap:8px;margin-top:10px}
.recibo{position:fixed;left:50%;transform:translateX(-50%);bottom:56px;z-index:70;background:#e9f3ee;color:var(--verde);
  border:1px solid #cfe9db;border-radius:99px;padding:8px 16px;font-size:13px;font-weight:600}
@media (min-width:900px){.cx-problema{left:auto;right:16px;bottom:16px;width:420px;border-radius:14px;border:1px solid var(--linha)}}
.cartao.linha.registro{align-items:flex-start}
.cartao.linha.registro b{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink2)}
.cartao.linha.problema{background:#fdf6ec;border-color:#f0dcc0}
.cartao.linha.problema b{color:#8a5a12}
.cartao.linha.erro{background:#fdecec;border-color:#f1c9c9}
.cartao.linha.erro b{color:#a12b2b}
.so-problemas{display:flex;gap:5px;align-items:center;font-size:12.5px;color:var(--ink2);white-space:nowrap}
.topo .buscar input[type=date],.topo .buscar select{font:inherit;font-size:13px;padding:8px 10px;border:1px solid var(--linha);border-radius:10px;background:var(--surf);color:var(--texto)}
/* Adiar com prazo: o botão abre 7, 15 e 30 dias no lugar dele (Aislan, 23/09). */
.cartao .acoes .adiar{position:relative}
.cartao .acoes .adiar > summary{list-style:none;display:flex;align-items:center;justify-content:center;
  width:100%;min-height:42px;padding:9px 10px;text-align:center;cursor:pointer}
.cartao .acoes .adiar > summary::-webkit-details-marker{display:none}
.cartao .acoes .adiar[open] > summary{border-color:var(--vinho);color:var(--vinho)}
/* Os prazos flutuam por cima, em vez de empurrar a fileira: abrindo o Adiar, os outros botões
   esticavam e o cartão inteiro ficava torto (Aislan, 23/09). */
.cartao .acoes{align-items:start}
.cartao .acoes .prazos{position:absolute;left:0;right:0;bottom:calc(100% + 6px);z-index:20;
  display:flex;gap:6px;padding:7px;background:var(--surf);border:1px solid var(--linha);
  border-radius:10px;box-shadow:0 6px 18px rgba(34,27,38,.14)}
.cartao .acoes .prazos form{flex:1}
.cartao .acoes .prazos .b{width:100%;min-height:34px;font-size:12.5px;padding:6px 4px}
.cartao .acoes .adiar[open] > summary{background:#fbf2f6}
/* Entrada por pessoa (Aislan, 23/09). */
.pin label{display:block;text-align:left;font-size:12.5px;color:var(--ink2);margin:12px 2px 4px}
.pin select{width:100%;font:inherit;font-size:16px;padding:12px;border:1px solid #d9cede;border-radius:10px;background:var(--surf);color:var(--texto)}
.pin input{margin:0}
.pin .b{margin-top:16px}
.ajuda-pin{margin-top:10px;font-size:12.5px}
.ajuda-pin a{color:var(--vinho);text-decoration:underline;text-underline-offset:2px}
.aviso-pin{margin-top:12px;font-size:11.5px;color:var(--ink3);line-height:1.5;text-align:left}
.acoes-linha{display:flex;gap:6px;align-items:center}
.grupo-por b{color:var(--ink2);font-weight:700}
/* Placar resumido no alto da esteira (Aislan, 23/09): sem meta diária, a conta é quanto falta zerar. */
.placar-curto{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;margin:10px 0 6px;font-size:12.5px;color:var(--ink2)}
.placar-curto .p b{font-size:15px;color:var(--ink);font-variant-numeric:tabular-nums;margin-right:3px}
.placar-curto .falta b{color:var(--vinho)}
.placar-curto .ganho b{color:var(--verde)}
.placar-curto .link{margin-left:auto;color:var(--vinho);text-decoration:underline;text-underline-offset:2px}
.metro small{display:block;margin-top:3px;font-size:11.5px;color:var(--ink3)}
td.p .sub{display:block;font-size:11px;color:var(--ink3);font-weight:400;margin-top:1px}
.cartao .adiada-ate{margin-top:6px;padding:6px 9px;background:#f3f0f6;border-radius:8px;font-size:12.5px;color:var(--ink2)}
.cartao .adiada-ate b{color:var(--ink)}