:root {
  --dourado: #D4A843; --dourado-escuro: #B8902F;
  --petroleo: #2E4A5A; --petroleo-2: #263D4B;
  --azul-medio: #5C7A8A; --azul-claro: #8FA8B5;
  --texto: #1E2D35; --fundo: #F7F9FB; --painel: #FFFFFF; --linha: #E6ECEF;
  --sombra: 0 4px 14px rgba(46, 74, 90, .08), 0 1px 3px rgba(46, 74, 90, .05);
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--fundo); color: var(--texto); line-height: 1.5;
  font-family: 'Source Sans 3', -apple-system, 'Segoe UI', Roboto, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.container { max-width: 1180px; margin: 0 auto; padding: 0 16px; }
main.container { padding-bottom: 1rem; }
.aviso-noscript { padding: 16px; text-align: center; }

/* ===== TOPBAR ===== */
.topbar {
  position: sticky; top: 0; z-index: 50; margin-bottom: 18px;
  background: linear-gradient(90deg, var(--petroleo), var(--petroleo-2));
  border-bottom: 3px solid var(--dourado); box-shadow: 0 3px 14px rgba(30, 45, 53, .18);
}
.topbar-interna { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; padding: 14px 30px; }
.topbar-marca { display: flex; align-items: center; gap: 15px; }
.topbar-marca img { width: 54px; height: 54px; object-fit: contain; flex: none; }
.marca { color: #fff; font-weight: 700; font-size: 1.08rem; letter-spacing: .2px; line-height: 1.3; white-space: nowrap; }
.marca small { display: block; font-weight: 400; font-size: .76rem; opacity: .82; margin-top: 2px; }
.topbar-divisor { width: 1px; align-self: stretch; background: rgba(255, 255, 255, .18); margin: 3px 0; }
.topbar-app { display: flex; flex-direction: column; }
.topbar-app .nome { font-family: 'Lato', sans-serif; color: #fff; font-weight: 900; font-size: 1.35rem; line-height: 1.2; white-space: nowrap; }
.topbar-app .nome b { color: var(--dourado); }
.topbar-app small { color: #aebbc4; font-size: .74rem; white-space: nowrap; }
.abas { display: flex; gap: 4px; flex-wrap: wrap; }
.aba {
  display: flex; align-items: center; gap: 8px; padding: 11px 16px; border-radius: 8px 8px 0 0;
  font-size: .88rem; font-weight: 600; color: #c8d3da; text-decoration: none; white-space: nowrap;
  border-bottom: 2px solid transparent; transition: background .15s ease, color .15s ease;
}
.aba:hover { background: rgba(212, 168, 67, .10); color: #fff; }
.aba.ativa { background: rgba(212, 168, 67, .16); border-bottom-color: var(--dourado); color: #fff; }
.aba:focus-visible, .btn:focus-visible { outline: 3px solid rgba(212, 168, 67, .6); outline-offset: 2px; }
.topbar-meta { margin-left: auto; color: #aebbc4; font-size: .7rem; text-align: right; line-height: 1.5; }
.topbar-meta .ponto { color: #7FC99A; }
@media (max-width: 900px) {
  .topbar-interna { padding: 12px 16px; gap: 12px; }
  .topbar-meta { margin-left: 0; text-align: left; width: 100%; }
  .marca, .topbar-app .nome, .topbar-app small { white-space: normal; }
  .topbar-divisor { display: none; }
}

/* ===== CONTEÚDO ===== */
.barra-dourada { height: 3px; background: linear-gradient(90deg, var(--dourado), #E4D3A6); border-radius: 3px; margin: 8px 0 20px; }
.titulo-secao { font-family: 'Lato', sans-serif; color: var(--petroleo); font-weight: 700; font-size: 1.2rem; margin: 0 0 4px; display: flex; align-items: center; gap: 10px; }
.legenda { color: var(--azul-medio); font-size: .9rem; margin: 4px 0 14px; }
.card { background: var(--painel); border: 1px solid var(--linha); border-radius: 12px; padding: 20px 24px; margin-bottom: 16px; box-shadow: var(--sombra); }
.card.destaque { border-left: 5px solid var(--dourado); }
.card-titulo { font-family: 'Lato', sans-serif; color: var(--petroleo); font-weight: 700; font-size: 1.2rem; margin: 0 0 4px; display: flex; align-items: center; gap: 10px; }
.card p { margin: 6px 0; }
.card ul { line-height: 1.9; padding-left: 20px; }
.card .suave { color: var(--azul-medio); }

/* ===== FORMULÁRIOS ===== */
.campo { display: block; margin: 0 0 12px; }
.campo > span, .rotulo { display: block; color: var(--petroleo); font-weight: 600; font-size: .9rem; margin-bottom: 4px; }
input[type="text"], textarea, select {
  width: 100%; background: #fff; color: var(--texto); font: inherit;
  border: 1px solid #D5DFE5; border-radius: 10px; padding: .55rem .75rem;
}
input[type="text"]:focus, textarea:focus, select:focus {
  outline: none; border-color: var(--dourado); box-shadow: 0 0 0 3px rgba(212, 168, 67, .16);
}
textarea { resize: vertical; min-height: 120px; }
input[type="file"] { width: 100%; padding: 16px; background: #fff; border: 1.5px dashed #C3D2DA; border-radius: 10px; color: var(--petroleo); font: inherit; }
input[type="file"]::file-selector-button {
  margin-right: 12px; padding: .45rem 1rem; border: none; border-radius: 8px; cursor: pointer;
  background: var(--petroleo); color: #fff; font: inherit; font-weight: 600;
}
.opcoes { display: flex; gap: 18px; flex-wrap: wrap; margin: 6px 0 12px; }
.opcao { display: flex; align-items: center; gap: 6px; cursor: pointer; font-weight: 600; color: var(--petroleo); }
.grade-2 { display: grid; grid-template-columns: 1fr 2fr; gap: 12px; }
.grade-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
@media (max-width: 700px) { .grade-2, .grade-3 { grid-template-columns: 1fr; } }
hr.separador { border: none; border-top: 1px solid var(--linha); margin: 18px 0; }
.btn {
  background: var(--dourado); color: #3A2E05; border: none; border-radius: 9px; cursor: pointer;
  padding: .6rem 1.4rem; font: inherit; font-weight: 700; font-size: .95rem;
  box-shadow: 0 3px 10px rgba(212, 168, 67, .3); transition: all .18s ease;
}
.btn:hover:not(:disabled) { background: var(--dourado-escuro); color: #fff; transform: translateY(-1px); }
.btn:disabled { opacity: .6; cursor: progress; }
.btn-largo { width: 100%; max-width: 360px; }
.acoes { margin: 14px 0; }

/* ===== CAIXAS DE MENSAGEM ===== */
.caixa { border: 1px solid; border-radius: 10px; padding: 12px 16px; margin: 12px 0; font-size: .92rem; }
.caixa-aviso { background: #FBF1D6; border-color: #EAD79E; color: #5C4510; }
.caixa-info { background: #E6EDF2; border-color: #C6D6DE; color: var(--petroleo); }
.caixa-ok { background: #E7F4EC; border-color: #BFE3CC; color: #1B5E32; }
.caixa-erro { background: #FBEAEA; border-color: #EFC4C0; color: #7A1F16; }
details.legal { margin: 8px 0; }
details.legal summary { cursor: pointer; color: var(--petroleo); font-weight: 600; }
details.legal p { white-space: pre-wrap; font-size: .85rem; color: var(--azul-medio); }

/* ===== MÉTRICAS ===== */
.metricas { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 12px 0; }
@media (max-width: 700px) { .metricas { grid-template-columns: repeat(2, 1fr); } }
.metrica {
  background: var(--painel); border: 1px solid var(--linha); border-top: 3px solid var(--dourado);
  border-radius: 12px; padding: 16px 12px; text-align: center; box-shadow: var(--sombra);
}
.metrica-num { font-family: 'Lato', sans-serif; font-size: 2.1rem; font-weight: 900; color: var(--petroleo); line-height: 1.1; }
.metrica-rotulo { font-size: .74rem; color: var(--azul-medio); font-weight: 700; text-transform: uppercase; letter-spacing: .5px; margin-top: 3px; }

/* ===== BADGES ===== */
.badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 999px; font-size: .74rem; font-weight: 700; white-space: nowrap; border: 1px solid transparent; }
.badge::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex: none; }
.badge-zero { background: #E7F4EC; color: #1B7A3D; border-color: #BFE3CC; }
.badge-reducao-alta { background: #E6EDF2; color: #2E4A5A; border-color: #C6D6DE; }
.badge-reducao-media { background: #EDF2F5; color: #4A6675; border-color: #D0DDE4; }
.badge-reducao-baixa { background: #FBF1D6; color: #8A6714; border-color: #EAD79E; }
.badge-integral, .badge-outro { background: #EEF1F3; color: #5A6A72; border-color: #D9DFE3; }
.badge-imune, .badge-isento { background: #F0EAF8; color: #6A3FB0; border-color: #DDD0EF; }

/* ===== TABELA ===== */
.tabela-wrap { overflow-x: auto; border: 1px solid var(--linha); border-radius: 12px; box-shadow: 0 4px 16px rgba(46, 74, 90, .08); background: #fff; }
table.tabela { border-collapse: collapse; width: 100%; font-size: .85rem; }
table.tabela thead th {
  background: var(--petroleo); color: #fff; padding: 13px 14px; text-align: left; white-space: nowrap;
  font-weight: 700; font-size: .74rem; text-transform: uppercase; letter-spacing: .5px; border-bottom: 3px solid var(--dourado);
}
table.tabela tbody td { padding: 12px 14px; border-bottom: 1px solid #EEF2F4; vertical-align: top; line-height: 1.45; }
table.tabela tbody tr:nth-child(even) { background: #F8FAFB; }
table.tabela tbody tr:hover { background: #F0F5F7; }
table.tabela code { background: #EEF3F6; color: var(--petroleo); padding: 2px 7px; border-radius: 5px; font-size: .8rem; font-weight: 600; }
.td-ncm { font-weight: 700; color: var(--petroleo); white-space: nowrap; }
.td-obs { font-size: .79rem; color: var(--azul-medio); }
.td-centro { text-align: center; }
.td-origem { font-size: .76rem; font-weight: 700; color: var(--petroleo); white-space: nowrap; }
.mais { margin: 14px 0; }

/* ===== RODAPÉ ===== */
.rodape { text-align: center; color: var(--azul-claro); font-size: .76rem; margin-top: 30px; padding: 14px 16px 24px; border-top: 1px solid var(--linha); }

/* ===== VÁRIAS ABAS ===== */
.abas-arquivo { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 4px 0 12px; }
.aba-opcao small { color: var(--azul-medio); font-weight: 400; }
.aba-sem-ncm { opacity: .6; cursor: not-allowed; }
.titulo-aba { margin: 22px 0 8px; color: var(--petroleo); font-family: 'Lato', sans-serif; }

/* ===== EXPORTAR NCMs INCORRETOS ===== */
.btn-secundario { background: #fff; color: var(--petroleo); border: 2px solid var(--dourado); }
.btn-secundario:hover:not(:disabled) { background: var(--dourado); color: #fff; }