:root{--azul:#1d6fce;--fundo:#f4f6fa;--card:#fff;--txt:#1b2430;--suave:#6b7685;--borda:#dde3ec;--erro:#c0392b;--ok:#1e8e4e}
@media (prefers-color-scheme:dark){:root{--fundo:#11161d;--card:#1b232d;--txt:#e8edf3;--suave:#9aa6b5;--borda:#2a3441}}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--fundo);color:var(--txt);font-size:16px;padding-bottom:env(safe-area-inset-bottom)}
.topo{display:flex;align-items:center;justify-content:space-between;background:var(--azul);color:#fff;padding:12px 16px;padding-top:calc(12px + env(safe-area-inset-top));position:sticky;top:0;z-index:5}
.topo h1{font-size:18px;margin:0}
.btn-sair{background:transparent;border:1px solid #fff8;color:#fff;border-radius:8px;padding:6px 12px;font-size:14px}
main{padding:16px;max-width:560px;margin:0 auto}
.card{background:var(--card);border:1px solid var(--borda);border-radius:12px;padding:14px;margin-bottom:12px}
.card h2{font-size:16px;margin:0 0 6px}
.linha{color:var(--suave);font-size:14px;margin:2px 0}
.linha b{color:var(--txt)}
label{display:block;font-size:14px;color:var(--suave);margin:10px 0 4px}
input{width:100%;padding:12px;border:1px solid var(--borda);border-radius:10px;font-size:16px;background:var(--card);color:var(--txt)}
.btn{display:block;width:100%;padding:13px;border:0;border-radius:10px;background:var(--azul);color:#fff;font-size:16px;font-weight:600;margin-top:14px}
.btn.sec{background:transparent;color:var(--azul);border:1px solid var(--azul)}
.btn.peq{display:inline-block;width:auto;padding:8px 12px;font-size:14px;margin:8px 8px 0 0}
.btn:disabled{opacity:.6}
.aba{display:flex;gap:8px;margin-bottom:12px}
.aba button{flex:1;padding:10px;border-radius:10px;border:1px solid var(--borda);background:var(--card);color:var(--txt);font-size:15px}
.aba button.on{background:var(--azul);color:#fff;border-color:var(--azul)}
.tag{display:inline-block;font-size:12px;padding:2px 8px;border-radius:99px;background:var(--borda);color:var(--txt);margin-left:6px}
.tag.off{background:var(--erro);color:#fff}
.aviso{position:fixed;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));background:#222;color:#fff;padding:12px 14px;border-radius:10px;font-size:15px;z-index:9}
.aviso.erro{background:var(--erro)}
.vazio{text-align:center;color:var(--suave);padding:32px 8px}
a.tel{color:var(--azul);text-decoration:none;font-weight:600}
textarea{width:100%;padding:12px;border:1px solid var(--borda);border-radius:10px;font-size:16px;background:var(--card);color:var(--txt);font-family:inherit}
.oculto{display:none}
.barra{padding:8px 16px;font-size:14px;display:flex;align-items:center;justify-content:space-between;gap:8px;position:sticky;top:48px;z-index:4}
.barra.ok{background:#e6f4ec;color:#1e6b3e}
.barra.pend{background:#fff3cd;color:#7a5b00}
.barra.erro{background:#f9dcd8;color:#8a2a1f}
.barra button{border:1px solid currentColor;background:transparent;color:inherit;border-radius:8px;padding:4px 10px;font-size:13px}
.selo{display:inline-block;font-size:11px;padding:1px 7px;border-radius:99px;margin-left:6px;font-weight:600}
.selo.pendente{background:#fff3cd;color:#7a5b00}
.selo.enviado{background:#d9f0e2;color:#1e6b3e}
.selo.erro{background:#f9dcd8;color:#8a2a1f}
.tag.st-a_caminho{background:#fff3cd;color:#7a5b00}
.tag.st-em_execucao{background:#d6e7fb;color:#12508f}
.tag.st-finalizada{background:#d9f0e2;color:#1e6b3e}
.ck{padding:8px 0;border-top:1px solid var(--borda)}
.ck:first-of-type{border-top:0}
.ckl{display:flex;align-items:flex-start;gap:10px;margin:0;color:var(--txt);font-size:16px}
.ckl input{width:24px;height:24px;flex:none;padding:0;margin:0}
.fotos{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:6px}
.mf{display:inline-flex;flex-direction:column;align-items:center;gap:2px}
.mf .selo{margin:0}
.mini{width:64px;height:64px;object-fit:cover;border-radius:8px;border:1px solid var(--borda);background:#fff}
.mini.grande{width:140px;height:70px;object-fit:contain}
.mini.sem{display:inline-flex;align-items:center;justify-content:center;font-size:24px;background:var(--borda)}
.falta{color:var(--erro);font-size:14px;margin:2px 0}
.erro-card{border-color:var(--erro)}
.sobre{position:fixed;inset:0;background:#000a;z-index:20;display:flex;align-items:center;justify-content:center;padding:16px}
.caixa{background:var(--card);border-radius:14px;padding:16px;width:100%;max-width:520px}
.assina{width:100%;height:200px;border:2px dashed var(--borda);border-radius:10px;background:#fff;touch-action:none;margin-top:8px}
a.btn{text-decoration:none;text-align:center;box-sizing:border-box}
.olho-wrap{position:relative}
.olho-wrap input{padding-right:50px}
.olho-btn{position:absolute;right:2px;top:50%;transform:translateY(-50%);width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:none;border:0;padding:0;color:#64748b;cursor:pointer}
