:root{
  --fundo:#F4F5F2; --superficie:#fff; --tinta:#16201C; --suave:#566159; --linha:#DCE0DA;
  --marca:#0F6B5E; --marca-escura:#0B574C; --lateral:#16201C;
  --ok:#176B3A; --ok-fundo:#E3F2E8; --alerta:#8A4B08; --alerta-fundo:#FBEBD0; --ruim:#A12626; --ruim-fundo:#F9E0E0; --neutro-fundo:#E8EBE6; --neutro:#3F4A44;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--fundo);color:var(--tinta);font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
h1,h2,h3{margin:0;font-weight:650;text-wrap:balance}
h1{font-size:26px} h2{font-size:18px} h3{font-size:16px}
p{margin:0}
button,input,select,textarea{font:inherit;color:inherit}
[hidden]{display:none !important}
.muted{color:var(--suave);font-size:14px}
.erro{color:var(--ruim);font-size:14px}

.login{min-height:100vh;display:grid;place-items:center;padding:16px}
.login-card{width:min(380px,100%)}

.app{display:flex;flex-wrap:wrap;min-height:100vh}
.lateral{flex:1 1 230px;background:var(--lateral);color:#EEF2EE;padding:24px 16px;display:flex;flex-direction:column;gap:24px}
.marca{display:flex;flex-direction:column;gap:2px}
.marca b{font-size:18px;color:#fff}
.marca span{font-size:13px;color:#B9C4BD}
.menu{display:flex;flex-direction:column;gap:4px}
.menu a{display:flex;justify-content:space-between;align-items:center;min-height:44px;padding:0 12px;border-radius:8px;color:#DDE5DF;text-decoration:none}
.menu a:hover{background:#26342E}
.menu a.ativo{background:var(--ok-fundo);color:var(--tinta);font-weight:600}
.selo{background:#F0B34A;color:#2B1B00;border-radius:999px;font-size:12px;font-weight:600;padding:2px 8px}
.principal{flex:999 1 560px;min-width:0;padding:28px 32px 56px;display:flex;flex-direction:column;gap:20px;outline:none}
.cabeca{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px}

.card{background:var(--superficie);border:1px solid var(--linha);border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:14px}
.colunas{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:16px}
.blocos{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:16px}
.bloco{background:var(--superficie);border:1px solid var(--linha);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:4px}
.bloco b{font-size:32px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1}
.bloco span{color:var(--suave);font-size:14px}
.linha{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px}
.grupo{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.lista{display:flex;flex-direction:column}
.item{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding:12px 0;border-top:1px solid var(--linha)}
.item:first-child{border-top:0}
.item.novo{background:#FFFBF0}

.pilula{display:inline-flex;align-items:center;border-radius:999px;font-size:13px;font-weight:600;padding:3px 10px;white-space:nowrap}
.pilula.ok{background:var(--ok-fundo);color:var(--ok)}
.pilula.alerta{background:var(--alerta-fundo);color:var(--alerta)}
.pilula.ruim{background:var(--ruim-fundo);color:var(--ruim)}
.pilula.neutra{background:var(--neutro-fundo);color:var(--neutro)}

.btn{min-height:44px;padding:0 16px;border-radius:8px;border:1px solid #B5BCB6;background:#fff;cursor:pointer;font-weight:500}
.btn:hover{background:#F0F2EE}
.btn.primario{background:var(--marca);border-color:var(--marca);color:#fff}
.btn.primario:hover{background:var(--marca-escura)}
.btn.fantasma{background:transparent;border-color:#46544D;color:#DDE5DF}
.btn.fantasma:hover{background:#26342E}
.btn.sel{background:var(--ok-fundo);border-color:var(--marca);font-weight:600}
.btn[disabled]{opacity:.55;cursor:default}
:focus-visible{outline:3px solid #F0B34A;outline-offset:2px}

.campo{display:flex;flex-direction:column;gap:6px}
.campo label{font-weight:500;font-size:14px}
.campo input,.campo select,.campo textarea{min-height:44px;border:1px solid #9AA39C;border-radius:8px;padding:8px 12px;background:#fff;width:100%}
.campo textarea{min-height:120px;resize:vertical}
.campos{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(140px,100%),1fr));gap:12px}
fieldset{border:1px solid var(--linha);border-radius:8px;padding:12px 14px;margin:0;display:flex;flex-direction:column;gap:10px}
legend{font-weight:600;padding:0 6px}

progress{width:100%;height:10px;border:0;border-radius:999px;overflow:hidden;background:var(--neutro-fundo);accent-color:var(--marca)}
progress::-webkit-progress-bar{background:var(--neutro-fundo)}
progress::-webkit-progress-value{background:var(--marca)}
progress::-moz-progress-bar{background:var(--marca)}

.balao{background:#E9F3EC;border-radius:4px 14px 14px 14px;padding:10px 14px;font-size:14px;max-width:560px;white-space:pre-line}
.caixa-qr{display:flex;flex-wrap:wrap;gap:24px;align-items:center}
.caixa-qr img{width:280px;height:280px;border:1px solid #9AA39C;border-radius:8px;background:#fff}
.vazio{padding:20px 0;color:var(--suave)}
.camada{position:fixed;inset:0;background:rgba(22,32,28,.55);display:grid;place-items:center;padding:16px;z-index:10}
.camada .card{width:min(620px,100%);max-height:92vh;overflow:auto}
.aviso{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:var(--lateral);color:#fff;padding:12px 18px;border-radius:10px;z-index:20;max-width:92vw}
.aviso.erro-aviso{background:var(--ruim)}
pre.resultado{margin:0;background:var(--neutro-fundo);border-radius:8px;padding:12px;font-size:13px;overflow:auto;white-space:pre-wrap}

@media (max-width:700px){
  .lateral{padding:16px;gap:12px}
  .menu{flex-direction:row;flex-wrap:wrap;gap:6px}
  .menu a{background:#26342E;gap:8px}
  .menu a.ativo{background:var(--ok-fundo)}
  .principal{padding:20px 16px 48px}
}
