:root{
  --pinho:#1F4D3A; --pinho-esc:#163828; --pinho-clr:#2C6B51;
  --ouro:#C39A52; --ouro-luz:#E3C88B;
  --creme:#FBF7EF; --creme-som:#F2EBDD;
  --tinta:#1A1A18; --cinza:#6B6A64; --fio:#E2DACA;
  --erro:#9B2C2C; --ok:#2F6B4F;
  --raio:14px;
  --sombra:0 2px 4px rgba(31,77,58,.06), 0 8px 24px rgba(31,77,58,.08);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--creme); color:var(--tinta);
  font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--pinho)}

/* topo */
.topo{background:var(--pinho); color:#fff; padding:18px 20px}
.topo .in{max-width:920px;margin:0 auto;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.topo img{height:30px;width:auto;display:block}
.topo .quem{margin-left:auto;font-size:.85rem;opacity:.85;display:flex;align-items:center;gap:14px}
.topo .quem a{color:var(--ouro-luz);text-decoration:none}
.topo .quem a:hover{text-decoration:underline}

.env{max-width:920px;margin:0 auto;padding:28px 20px 64px}

h1{font-size:1.6rem;line-height:1.25;margin:0 0 6px;letter-spacing:-.02em}
h2{font-size:1.1rem;margin:34px 0 12px;color:var(--pinho);letter-spacing:-.01em}
h2 .mark{color:var(--ouro);margin-right:6px}
.sub{color:var(--cinza);margin:0 0 26px}

/* cartões */
.cartao{
  background:#fff;border:1px solid var(--fio);border-radius:var(--raio);
  padding:20px;box-shadow:var(--sombra);margin-bottom:16px;
}
.cartao.destaque{border-left:4px solid var(--ouro)}

/* seletor de duração */
.abas{display:flex;gap:8px;margin-bottom:22px;flex-wrap:wrap}
.abas a{
  flex:1;min-width:150px;text-align:center;padding:13px 16px;border-radius:var(--raio);
  border:1.5px solid var(--fio);background:#fff;text-decoration:none;color:var(--cinza);
  font-weight:600;transition:.15s;
}
.abas a.on{background:var(--pinho);border-color:var(--pinho);color:#fff}
.abas a:hover:not(.on){border-color:var(--pinho-clr);color:var(--pinho)}

/* dia */
.dia{margin-bottom:18px}
.dia h3{
  margin:0 0 10px;font-size:.98rem;color:var(--pinho);text-transform:capitalize;
  display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;
}
.dia h3 small{font-weight:400;color:var(--cinza);text-transform:none;font-size:.82rem}
.selo{
  background:var(--ouro);color:#fff;font-size:.68rem;font-weight:700;
  padding:2px 9px;border-radius:99px;text-transform:uppercase;letter-spacing:.04em;
}
.horas{display:flex;flex-wrap:wrap;gap:8px}
.horas button{
  font:inherit;font-weight:600;cursor:pointer;padding:11px 18px;border-radius:10px;
  border:1.5px solid var(--pinho);background:#fff;color:var(--pinho);transition:.12s;
}
.horas button:hover{background:var(--pinho);color:#fff;transform:translateY(-1px)}

/* formulário */
label{display:block;font-weight:600;font-size:.86rem;margin:0 0 6px;color:var(--pinho)}
input,select,textarea{
  width:100%;font:inherit;padding:11px 13px;border:1.5px solid var(--fio);
  border-radius:10px;background:#fff;color:var(--tinta);
}
input:focus,select:focus,textarea:focus{outline:2px solid var(--ouro);border-color:var(--ouro)}
textarea{resize:vertical;min-height:90px}
.campo{margin-bottom:16px}
.linha{display:flex;gap:12px;flex-wrap:wrap}
.linha>*{flex:1;min-width:140px}

.btn{
  font:inherit;font-weight:700;cursor:pointer;padding:13px 26px;border-radius:10px;
  border:none;background:var(--pinho);color:#fff;transition:.15s;text-decoration:none;
  display:inline-block;text-align:center;
}
.btn:hover{background:var(--pinho-esc)}
.btn.ouro{background:var(--ouro)}
.btn.ouro:hover{background:#A9843F}
.btn.risco{background:#fff;color:var(--erro);border:1.5px solid var(--erro)}
.btn.risco:hover{background:var(--erro);color:#fff}
.btn.fraco{background:#fff;color:var(--pinho);border:1.5px solid var(--fio)}
.btn.mini{padding:7px 14px;font-size:.82rem}

/* avisos */
.aviso{
  border-radius:var(--raio);padding:15px 18px;margin-bottom:20px;
  border-left:4px solid var(--ouro);background:var(--creme-som);
}
.aviso.bom{border-left-color:var(--ok);background:#EFF6F1}
.aviso.ruim{border-left-color:var(--erro);background:#FBEFEF}
.aviso b{display:block;margin-bottom:3px}

/* tabelas */
table{width:100%;border-collapse:collapse;font-size:.9rem}
th{
  text-align:left;padding:9px 10px;border-bottom:2px solid var(--fio);
  color:var(--pinho);font-size:.76rem;text-transform:uppercase;letter-spacing:.05em;
}
td{padding:11px 10px;border-bottom:1px solid var(--fio);vertical-align:middle}
tr:last-child td{border-bottom:none}
.rolar{overflow-x:auto;-webkit-overflow-scrolling:touch}

code.cod{
  background:var(--pinho);color:var(--ouro-luz);padding:3px 9px;border-radius:6px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:700;letter-spacing:.08em;
}
.morto{opacity:.45}
.kpi{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.kpi div{
  flex:1;min-width:130px;background:var(--pinho);color:#fff;
  border-radius:var(--raio);padding:16px 18px;
}
.kpi b{display:block;font-size:1.8rem;line-height:1.1;color:var(--ouro-luz)}
.kpi span{font-size:.78rem;opacity:.85;text-transform:uppercase;letter-spacing:.05em}

.rodape{text-align:center;color:var(--cinza);font-size:.82rem;margin-top:40px}
.rodape .mark{color:var(--ouro)}

@media (max-width:560px){
  .env{padding:20px 15px 48px}
  h1{font-size:1.35rem}
  .horas button{flex:1;min-width:88px}
}

/* janela sobreposta de confirmação */
.fundo{
  display:none;position:fixed;inset:0;z-index:50;
  background:rgba(22,56,40,.55);backdrop-filter:blur(3px);
  align-items:center;justify-content:center;padding:20px;overflow-y:auto;
}
.fundo.on{display:flex}
.modal{
  background:#fff;border-radius:var(--raio);padding:26px;
  width:100%;max-width:470px;box-shadow:0 20px 60px rgba(0,0,0,.28);
  border-top:4px solid var(--ouro);margin:auto;
}
.modal #resumo{
  font-size:1.2rem;font-weight:700;color:var(--pinho);
  margin:0 0 20px;padding-bottom:16px;border-bottom:1px solid var(--fio);
}
@media (max-width:560px){ .modal{padding:20px} }
