:root {
    --azul-marca: #00ABE1;
    --azul-marca-escuro: #0089B8;
    --azul-marca-hover: #006D91;
    --preto: #0A0E1A;
    --cinza-logo: #AAB3BD;
    --cinza-texto: #5B5D66;
    --fundo: #FAFAFC;
    --borda: #E7E7EC;
    --vermelho: #B42318;
    --vermelho-bg: #FDECEC;
    --verde: #17743C;
    --verde-bg: #E9F8EF;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
    margin: 0;
    background: var(--fundo);
    font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    color: var(--preto);
}
.pagina {
    max-width: 440px;
    margin: 0 auto;
    padding: 0 18px 48px;
    min-height: 100vh;
}
.cabecalho-logo {
    display: flex;
    justify-content: center;
    padding: 26px 0 18px;
}
.cabecalho-logo img { height: 44px; width: auto; display: block; }

.topo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--borda);
}
.topo-titulo { font-size: 12px; letter-spacing: .04em; color: var(--cinza-texto); font-weight: 600; text-transform: uppercase; }
.topo a { font-size: 14px; color: var(--cinza-texto); text-decoration: none; }
.topo a:hover { color: var(--azul-marca-escuro); }

.cartao {
    background: #fff;
    border: 1px solid var(--borda);
    border-radius: 16px;
    padding: 20px;
    margin-bottom: 16px;
}
.titulo { font-size: 20px; font-weight: 700; margin: 0 0 6px; }
.subtitulo { font-size: 14px; color: var(--cinza-texto); margin: 0 0 20px; line-height: 1.5; }

.campo { margin-bottom: 16px; }
.campo:last-child { margin-bottom: 0; }
.campo label { font-size: 13px; font-weight: 600; color: var(--cinza-texto); display: block; margin-bottom: 6px; }
.campo input, .campo select {
    width: 100%;
    border: 1px solid #D7D7DE;
    border-radius: 10px;
    padding: 13px 14px;
    font-size: 16px;
    font-family: inherit;
}
.campo input:focus, .campo select:focus { outline: none; border-color: var(--azul-marca); }
.campo-ajuda { font-size: 12.5px; color: var(--cinza-texto); margin-top: 6px; }

.botao {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    border: none;
    border-radius: 12px;
    padding: 15px 18px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    font-family: inherit;
}
.botao-primario { background: var(--azul-marca-escuro); color: #fff; }
.botao-primario:hover { background: var(--azul-marca-hover); }
.botao-secundario { background: #fff; color: var(--preto); border: 1px solid #D7D7DE; }
.botao-secundario:hover { background: var(--fundo); }
.botao-link { background: none; border: none; color: var(--azul-marca-escuro); font-weight: 600; font-size: 14px; text-decoration: none; }

.aviso { padding: 12px 14px; border-radius: 10px; font-size: 13.5px; margin-bottom: 16px; line-height: 1.5; }
.aviso-sucesso { background: var(--verde-bg); color: var(--verde); }
.aviso-erro { background: var(--vermelho-bg); color: var(--vermelho); }

.rodape-link { text-align: center; font-size: 14px; color: var(--cinza-texto); margin-top: 18px; }
.rodape-link a { color: var(--azul-marca-escuro); font-weight: 600; text-decoration: none; }

.crianca-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 0;
    border-bottom: 1px solid #F1F1F4;
}
.crianca-item:last-child { border-bottom: none; }
.crianca-nome { font-size: 15px; font-weight: 600; }
.crianca-status { font-size: 12.5px; margin-top: 3px; }
.status-ativo { color: var(--verde); }
.status-pendente { color: #B7791F; }
.status-expirado { color: var(--vermelho); }

.badge { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; }
.badge-azul { background: #E1F5FC; color: var(--azul-marca-hover); }

.scan-item { padding: 12px 0; border-bottom: 1px solid #F1F1F4; }
.scan-item:last-child { border-bottom: none; }
.scan-crianca { font-size: 14px; font-weight: 600; }
.scan-hora { font-size: 12.5px; color: var(--cinza-texto); margin-top: 2px; }
.scan-mapa { font-size: 13px; color: var(--azul-marca-escuro); text-decoration: none; font-weight: 600; }

.secao-label { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--cinza-logo); margin: 0 0 12px; font-weight: 700; }
.vazio { color: var(--cinza-texto); font-size: 14px; text-align: center; padding: 20px 0; }

#leitor-qr { width: 100%; border-radius: 12px; overflow: hidden; margin-bottom: 14px; }