:root { --fundo:#f3f3f1; --cartao:#fff; --texto:#1f1f1f; --cinza:#6b6b6b; --linha:#e2e2de; --primario:#1f1f1f; --ok:#2e7d32; --alerta:#b26a00; --erro:#b00020; --azul:#1565c0; }
* { box-sizing: border-box; }
html, body { margin:0; background:var(--fundo); color:var(--texto); font: 16px/1.4 "Gill Sans", "Gill Sans MT", -apple-system, "Segoe UI", Roboto, sans-serif; -webkit-text-size-adjust:100%; }
main { max-width: 760px; margin: 0 auto; padding: 12px 16px 48px; }
a { color: var(--azul); }
h1 { font-size: 1.4rem; margin: 8px 0; } h2 { font-size: 1.1rem; margin: 6px 0 8px; }
.topo { display:flex; align-items:center; justify-content:space-between; background:#fff; border-bottom:1px solid var(--linha); padding: 8px 16px; padding-top: calc(8px + env(safe-area-inset-top)); position: sticky; top:0; z-index: 5; }
.marca { display:flex; align-items:center; gap:10px; color:var(--texto); text-decoration:none; font-weight:600; }
.marca img { height: 28px; }
.topo nav a { margin-left: 14px; }
.cartao { background: var(--cartao); border:1px solid var(--linha); border-radius: 12px; padding: 14px 16px; margin: 10px 0; display:block; color: inherit; text-decoration:none; }
a.cartao:active { background:#fafaf8; }
.cab { display:flex; justify-content:space-between; align-items:center; gap:8px; flex-wrap:wrap; }
.codigo { color: var(--cinza); font-size: .85rem; }
.sub { color: var(--cinza); font-size: .92rem; margin: 2px 0 6px; }
.meta { display:flex; flex-wrap:wrap; gap:6px 10px; font-size:.85rem; color:var(--cinza); align-items:center; }
.etiqueta { display:inline-block; font-size:.78rem; padding: 2px 8px; border-radius: 999px; background:#ececea; color:#444; white-space: nowrap; }
.etiqueta.aberto { background:#e3f2fd; color:#0d47a1; } .etiqueta.enviado { background:#fff3e0; color:#8a4b00; } .etiqueta.aprovado { background:#e8f5e9; color:#1b5e20; }
.aviso { padding: 10px 14px; border-radius: 10px; margin: 10px 0; background:#eef; border:1px solid #dde; }
.aviso.erro { background:#fdecea; border-color:#f5c6c2; color:var(--erro); } .aviso.ok { background:#e8f5e9; border-color:#c8e6c9; color:var(--ok); }
.aviso.alerta { background:#fff8e1; border-color:#ffe082; color:#7a4e00; } .aviso.travado { background:#e8f5e9; border-color:#c8e6c9; color:#1b5e20; }
.alerta { color: var(--alerta); font-size:.88rem; }
.linha-titulo { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top: 16px; }
.migalha { font-size:.85rem; color:var(--cinza); margin: 4px 0; }
.vazio { color: var(--cinza); font-style: italic; }
.botao { display:inline-block; border:1px solid var(--primario); background:#fff; color:var(--primario); padding: 10px 16px; border-radius: 10px; font: inherit; font-weight:600; cursor:pointer; text-decoration:none; min-height: 44px; }
.botao.primario { background: var(--primario); color:#fff; } .botao.grande { font-size: 1.1rem; padding: 14px 20px; width:100%; }
.botao.pequeno { padding: 6px 10px; min-height: 36px; font-size:.9rem; } .botao.perigo { border-color: var(--erro); color: var(--erro); }
.botoes { display:flex; gap:10px; flex-wrap:wrap; margin-top: 12px; }
.botoes .botao { flex:1; text-align:center; }
.formulario label { display:block; margin: 10px 0 4px; font-size:.92rem; color:#333; }
.formulario input, .formulario select, .formulario textarea { display:block; width:100%; margin-top:4px; padding: 10px 12px; font: inherit; border:1px solid #cfcfca; border-radius: 8px; background:#fff; }
.formulario textarea[readonly] { background:#f6f6f4; color:#444; }
.estreito { max-width: 400px; margin: 40px auto; }
.dica { color: var(--cinza); font-size:.9rem; }
.progresso { margin-top: 12px; } .progresso .barra { height: 8px; background:#e5e5e0; border-radius: 999px; overflow:hidden; } .progresso .barra span { display:block; height:100%; width:0; background: var(--azul); transition: width .3s; }
.progresso .texto { font-size: .88rem; color: var(--cinza); margin-top: 4px; }
.resultado { list-style:none; padding:0; margin: 8px 0 0; font-size:.9rem; } .resultado li { padding: 6px 0; border-top: 1px solid var(--linha); }
.resultado li.ok { color: #1b5e20; } .resultado li.erro { color: var(--erro); } .resultado li.alerta { color: var(--alerta); }
.fotos { display:grid; gap: 12px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .fotos { grid-template-columns: 1fr 1fr; } }
.foto { border:1px solid var(--linha); border-radius: 10px; overflow:hidden; background:#fafaf8; }
.foto.fora { border-color: #ffe082; background:#fffdf5; }
.foto img { width:100%; display:block; aspect-ratio: 4/3; object-fit: cover; }
.foto .info { padding: 8px 10px; } .foto .info input { margin-top: 6px; }
.legenda { margin-top: 4px; }
.linha-acao { display:flex; gap:8px; align-items:center; flex-wrap:wrap; padding: 8px 0; border-top: 1px solid var(--linha); }
.linha-acao > span { flex: 1 1 100%; }
.inline { display:inline-flex; gap:6px; align-items:center; } .inline input, .inline select { padding: 6px 8px; font: inherit; border:1px solid #cfcfca; border-radius: 8px; }
details.cartao summary { cursor:pointer; font-weight:600; }
.historico { font-size:.85rem; color:#444; padding-left: 18px; }