/* Calculadora de Molas — bancada de engenharia: superfícies claras, tinta azul-petróleo,
   um único destaque (azul de cota) e cores de estado só para o veredito. */
@font-face {
  font-family: "Archivo";
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url(fontes/archivo.woff2) format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Archivo";
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url(fontes/archivo-ext.woff2) format("woff2-variations");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  --papel: #f3f5f7;
  --folha: #ffffff;
  --tinta: #0f1b24;
  --grafite: #5a6873;
  --traco: #c9d1d7;
  --traco-leve: #e3e8ec;
  --cota: #1d5fd0;
  --cota-escura: #174ea9;
  --cota-fundo: #eaf1fd;
  --ok: #1f7a4d;
  --ok-fundo: #e9f6ef;
  --atencao: #8a5a00;
  --atencao-fundo: #fdf5e4;
  --alerta: #b3261e;
  --alerta-fundo: #fdeeec;
  --raio: 7px;
  --raio-g: 12px;
  --sombra: 0 1px 2px rgba(15, 27, 36, 0.06), 0 4px 16px rgba(15, 27, 36, 0.06);
  --fonte: "Archivo", "Segoe UI", system-ui, sans-serif;
  --altura-topo: 56px;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { background: var(--papel); }
body { margin: 0; font: 400 15px/1.5 var(--fonte); color: var(--tinta); background: var(--papel); font-variant-numeric: tabular-nums; -webkit-font-smoothing: antialiased; }
a { color: var(--cota); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
:focus-visible { outline: 2px solid var(--cota); outline-offset: 2px; }
.visualmente-oculto { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.envio-oculto { position: absolute; left: -9999px; width: 1px; height: 1px; }

/* Barra superior */
.topo { position: sticky; top: 0; z-index: 30; display: flex; align-items: stretch; gap: 28px; height: var(--altura-topo);
  padding: 0 24px; background: var(--folha); border-bottom: 1px solid var(--traco-leve); }
.topo .marca { display: flex; align-items: center; gap: 10px; font-weight: 700; font-stretch: 90%; font-size: 16px; color: var(--tinta); white-space: nowrap; }
.topo .marca:hover { text-decoration: none; }
.topo .marca svg path { stroke: var(--cota); }
.topo nav { display: flex; gap: 2px; }
.topo nav a { display: flex; align-items: center; white-space: nowrap; padding: 0 12px; color: var(--grafite); font-weight: 500; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.topo nav a:hover { color: var(--tinta); text-decoration: none; }
.topo nav a.ativo { color: var(--tinta); border-bottom-color: var(--cota); }

main { padding: 28px 32px 56px; max-width: 1400px; margin: 0 auto; }
h1 { font-size: 26px; line-height: 1.15; font-weight: 700; font-stretch: 88%; margin: 0 0 20px; letter-spacing: -0.01em; }
h2 { font-size: 14px; font-weight: 650; margin: 0 0 12px; }

/* Controles */
label { display: block; font-size: 13px; font-weight: 500; color: var(--grafite); margin: 0 0 12px; }
input, select, textarea { display: block; width: 100%; margin-top: 5px; min-height: 38px; padding: 7px 11px; border: 1px solid var(--traco);
  border-radius: var(--raio); font: inherit; font-size: 15px; color: var(--tinta); background: var(--folha); transition: border-color 0.12s, box-shadow 0.12s; }
textarea { min-height: 0; }
input:hover, select:hover, textarea:hover { border-color: #aeb8c0; }
input:focus, select:focus, textarea:focus { border-color: var(--cota); outline: none; box-shadow: 0 0 0 3px var(--cota-fundo); }
input[aria-invalid="true"] { border-color: var(--alerta); box-shadow: 0 0 0 3px var(--alerta-fundo); }
input::placeholder { color: #9aa6af; }
.erro-campo { display: block; margin: -6px 0 10px; font-size: 12.5px; font-weight: 500; color: var(--alerta); }
button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 38px; padding: 7px 16px;
  border: 1px solid var(--traco); border-radius: var(--raio); background: var(--folha); color: var(--tinta); font: inherit; font-weight: 550;
  cursor: pointer; transition: background 0.12s, border-color 0.12s; }
button:hover { background: var(--papel); border-color: #aeb8c0; }
button.primario { background: var(--cota); border-color: var(--cota); color: #fff; }
button.primario:hover { background: var(--cota-escura); border-color: var(--cota-escura); }
button.perigo { color: var(--alerta); }
button.perigo:hover { background: var(--alerta-fundo); border-color: #f0b9b3; }
button.discreto { border-color: transparent; background: transparent; color: var(--grafite); min-height: 32px; padding: 4px 10px; }
button.discreto:hover { background: var(--papel); color: var(--tinta); }
.medida { position: relative; display: block; }
.medida input { padding-right: 40px; text-align: right; }
.medida em { position: absolute; right: 11px; bottom: 10px; font-style: normal; font-size: 13px; color: var(--grafite); pointer-events: none; }
label.em-foco { color: var(--cota); }
.ajuda { margin: -4px 0 12px; font-size: 13px; color: var(--grafite); }
.duplo { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.trio { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }

/* Chaves segmentadas (rádios de verdade por baixo) */
.segmentado { display: inline-flex; padding: 3px; gap: 2px; background: var(--papel); border: 1px solid var(--traco-leve); border-radius: 9px; }
.segmentado a, .segmentado label { position: relative; display: flex; align-items: center; margin: 0; padding: 6px 14px; border-radius: 6px;
  font-size: 14px; font-weight: 550; color: var(--grafite); cursor: pointer; white-space: nowrap; }
.segmentado a:hover, .segmentado label:hover { color: var(--tinta); text-decoration: none; }
.segmentado .ativo { background: var(--folha); color: var(--tinta); box-shadow: 0 1px 2px rgba(15, 27, 36, 0.12); }
.segmentado.pequeno label { padding: 4px 10px; font-size: 13px; }
.segmentado input[type=radio] { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; min-height: 0; }
.segmentado label:has(input:focus-visible) { outline: 2px solid var(--cota); outline-offset: 1px; }
.linha-rotulo { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 12px; }
.linha-rotulo .rotulo { font-size: 13px; font-weight: 500; color: var(--grafite); }
.alternativa { margin-bottom: 12px; }
.alternativa .linha-rotulo { margin-bottom: 6px; }
.campo-alternativo input { margin-top: 0; }
details.opcionais { margin: 4px 0 12px; }
details.opcionais summary { cursor: pointer; font-size: 13px; font-weight: 550; color: var(--cota); margin-bottom: 10px; }

/* Tela de cálculo: bancada com entradas à esquerda e resultado ao vivo à direita */
body.tela-bancada main { max-width: none; padding: 0; }
.bancada-v2 { display: grid; grid-template-columns: 380px minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr);
  height: calc(100vh - var(--altura-topo)); }
.cabecalho-calc { grid-column: 1 / -1; display: flex; align-items: center; gap: 20px; padding: 10px 24px;
  background: var(--folha); border-bottom: 1px solid var(--traco-leve); }
.cabecalho-calc .tipos { margin-left: auto; }
.acoes-topo { display: flex; align-items: center; gap: 8px; }
.estado-salvo { font-size: 13px; font-weight: 550; color: var(--ok); opacity: 0; transition: opacity 0.3s; }
.estado-salvo.visivel { opacity: 1; }
.identidade { position: relative; min-width: 0; }
.identidade summary { list-style: none; display: grid; grid-template-columns: auto auto; column-gap: 12px; align-items: baseline;
  padding: 4px 10px; margin-left: -10px; border-radius: var(--raio); cursor: pointer; }
.identidade summary::-webkit-details-marker { display: none; }
.identidade summary:hover { background: var(--papel); }
.identidade-rotulo { grid-column: 1 / -1; font-size: 12px; color: var(--grafite); }
.identidade-nome { font-size: 17px; font-weight: 650; max-width: 42ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.identidade-editar { font-size: 13px; font-weight: 550; color: var(--cota); }
.painel-identidade { position: absolute; z-index: 25; top: calc(100% + 8px); left: -10px; width: 440px; padding: 18px 18px 6px;
  background: var(--folha); border: 1px solid var(--traco-leve); border-radius: var(--raio-g); box-shadow: var(--sombra); }
.coluna-entradas { overflow-y: auto; padding: 4px 22px 40px; background: var(--folha); border-right: 1px solid var(--traco-leve); }
.bloco { padding: 18px 0 8px; border-bottom: 1px solid var(--traco-leve); }
.bloco:last-child { border-bottom: 0; }
.busca { margin: 0 0 8px; background: var(--papel) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%235a6873' stroke-width='2'%3E%3Ccircle cx='7' cy='7' r='5'/%3E%3Cpath d='m11 11 4 4'/%3E%3C/svg%3E") no-repeat 11px center;
  padding-left: 34px; border-color: transparent; }
.busca:focus { background-color: var(--folha); }
#id-material { margin-top: 0; }
.info { margin: 8px 0 14px; font-size: 12.5px; color: var(--grafite); }
.info:empty { display: none; }
.info dl { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 8px 12px; margin: 0; padding: 10px 12px; background: var(--papel); border-radius: var(--raio); }
.info dt { font-size: 11.5px; }
.info dd { margin: 0; color: var(--tinta); font-weight: 550; font-size: 13px; }
.coluna-resultado { overflow-y: auto; padding: 22px 28px 48px; }

/* Resumo: veredito + números principais */
.resumo { display: grid; gap: 14px; }
.vazio-resultado { display: grid; gap: 4px; padding: 26px 24px; border: 1px dashed var(--traco); border-radius: var(--raio-g); color: var(--grafite); }
.vazio-resultado strong { color: var(--tinta); font-weight: 600; }
.veredito { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; padding: 16px 20px;
  border: 1px solid; border-radius: var(--raio-g); }
.veredito .selo { width: 12px; height: 12px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px color-mix(in srgb, currentColor 18%, transparent); }
.veredito-texto strong { display: block; font-size: 17px; font-weight: 650; color: var(--tinta); }
.veredito-texto span { font-size: 14px; color: var(--grafite); }
.veredito-pct { text-align: right; }
.veredito-pct b { display: block; font-size: 30px; line-height: 1; font-weight: 700; font-stretch: 85%; }
.veredito-pct small { font-size: 12px; color: var(--grafite); }
.nivel-ok { color: var(--ok); background: var(--ok-fundo); border-color: #bfe3cf; }
.nivel-atencao { color: var(--atencao); background: var(--atencao-fundo); border-color: #f0d9a3; }
.nivel-critico { color: var(--alerta); background: var(--alerta-fundo); border-color: #f3c0ba; }
.nivel-neutro { color: var(--grafite); background: var(--folha); border-color: var(--traco-leve); }
.kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; background: var(--folha);
  border: 1px solid var(--traco-leve); border-radius: var(--raio-g); }
.kpis > div { padding: 14px 18px; }
.kpis > div + div { border-left: 1px solid var(--traco-leve); }
.kpis dt { font-size: 12.5px; color: var(--grafite); }
.kpis dd { margin: 2px 0 0; }
.kpis b { font-size: 22px; font-weight: 700; font-stretch: 88%; }
.kpis small { font-size: 12.5px; color: var(--grafite); }
details.avisos { font-size: 13.5px; }
details.avisos summary { cursor: pointer; color: var(--atencao); font-weight: 550; }
details.avisos ul { margin: 8px 0 0; padding-left: 18px; color: var(--tinta); }
.aviso-erro { padding: 14px 18px; border: 1px solid #f3c0ba; background: var(--alerta-fundo); border-radius: var(--raio-g); font-size: 14px; }
.aviso-erro strong { color: var(--alerta); }
.aviso-erro ul { margin: 6px 0 0; padding-left: 18px; }

/* Abas do resultado */
.abas-resultado { display: flex; gap: 4px; margin: 22px 0 16px; border-bottom: 1px solid var(--traco-leve); }
.abas-resultado a { padding: 9px 14px; color: var(--grafite); font-weight: 550; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.abas-resultado a:hover { color: var(--tinta); text-decoration: none; }
.abas-resultado a[aria-selected="true"] { color: var(--tinta); border-bottom-color: var(--cota); }
.vazio-aba { padding: 24px; color: var(--grafite); border: 1px dashed var(--traco); border-radius: var(--raio-g); }
.desenho-tecnico { display: grid; grid-template-columns: minmax(260px, 400px) minmax(0, 1fr); background: var(--folha);
  border: 1px solid var(--traco-leve); border-radius: var(--raio-g); overflow: hidden; }
.desenho-tecnico svg.mola { display: block; width: 100%; height: auto; border-right: 1px solid var(--traco-leve); }
.carimbo { display: grid; grid-template-columns: 1fr 1fr; align-content: start; margin: 0; font-size: 13px; }
.carimbo > div { padding: 10px 14px; border-bottom: 1px solid var(--traco-leve); }
.carimbo > div:nth-child(odd) { border-right: 1px solid var(--traco-leve); }
.carimbo .largo { grid-column: 1 / -1; border-right: 0; }
.carimbo dt { color: var(--grafite); font-size: 12px; }
.carimbo dd { margin: 0; font-size: 14.5px; font-weight: 600; }
.cargas-rodape { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; align-items: start; }

/* Verificação */
.grade-tolerancias { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 0 14px; max-width: 900px; }
.grade-tolerancias .medida input { padding-right: 56px; }
.verificacao-resultado:empty { display: none; }
.situacao { font-weight: 600; }
table.verificacao { background: var(--folha); }
.verificacao tr.sit-ok .situacao { color: var(--ok); }
.verificacao tr.sit-atencao .situacao { color: var(--atencao); }
.verificacao tr.sit-apertada .situacao { color: var(--alerta); }
.verificacao tr.sit-neutra .situacao { color: var(--grafite); font-weight: 400; }

/* Tabelas */
table { border-collapse: separate; border-spacing: 0; width: 100%; margin: 0 0 16px; font-size: 14px; background: var(--folha);
  border: 1px solid var(--traco-leve); border-radius: var(--raio-g); overflow: hidden; }
th, td { padding: 9px 14px; text-align: left; border-bottom: 1px solid var(--traco-leve); }
tbody tr:last-child > * { border-bottom: 0; }
table.dados tr:last-child > * { border-bottom: 0; }
thead th { font-size: 12.5px; font-weight: 600; color: var(--grafite); background: #f8fafb; }
tbody tr:hover { background: #fafbfc; }
.num, .cargas td { text-align: right; }
tr.excede td, tr.excede th { color: var(--alerta); font-weight: 650; }
.diagrama { width: 100%; background: var(--folha); border: 1px solid var(--traco-leve); border-radius: var(--raio-g); }
.diagrama text { font: 12px var(--fonte); fill: var(--grafite); }
.eixo { stroke: var(--grafite); } .curva { stroke: var(--cota); stroke-width: 2; }
.limite { stroke: var(--alerta); stroke-dasharray: 4 4; } .ponto { fill: var(--cota); }
.dica { color: var(--grafite); font-size: 13px; margin: 0; }
.comparacao h2 { margin-top: 0; }

/* Outras telas */
a.botao { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; padding: 7px 16px; border: 1px solid var(--traco);
  border-radius: var(--raio); background: var(--folha); color: var(--tinta); font-weight: 550; }
a.botao:hover { text-decoration: none; background: var(--papel); }
a.botao.primario { background: var(--cota); border-color: var(--cota); color: #fff; }
a.botao.primario:hover { background: var(--cota-escura); }
a.botao.discreto { border-color: transparent; background: transparent; color: var(--grafite); min-height: 32px; padding: 4px 10px; font-size: 14px; }
a.botao.discreto:hover { background: var(--papel); color: var(--tinta); }
.barra-lista { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 16px; align-items: stretch; margin-bottom: 16px; }
.filtros { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.filtros .busca { width: auto; flex: 1 1 280px; margin: 0; max-width: 460px; background-color: var(--folha); border-color: var(--traco-leve); }
.zona-soltar { position: relative; display: grid; align-content: center; gap: 2px; height: 100%; min-height: 58px; margin: 0; padding: 8px 16px;
  border: 1.5px dashed var(--traco); border-radius: var(--raio-g); background: var(--folha); cursor: pointer; transition: border-color 0.12s, background 0.12s; }
.zona-soltar:hover, .zona-soltar:focus-within { border-color: var(--cota); background: var(--cota-fundo); }
.zona-soltar input { position: absolute; inset: 0; opacity: 0; cursor: pointer; margin: 0; min-height: 0; }
.zona-soltar strong { color: var(--tinta); font-size: 14px; }
.zona-soltar span { font-size: 12.5px; color: var(--grafite); font-weight: 400; }
table.lista td { vertical-align: middle; padding-top: 12px; padding-bottom: 12px; }
.nome-projeto { display: block; font-weight: 650; color: var(--tinta); }
.sub { display: block; font-size: 13px; color: var(--grafite); }
.lista .material { color: var(--grafite); font-size: 14px; }
.lista .quando { white-space: nowrap; color: var(--grafite); font-size: 14px; }
.acoes-linha { width: 1%; white-space: nowrap; }
.acoes-linha > div { display: flex; justify-content: flex-end; gap: 2px; }
.acoes-linha form { margin: 0; }
.lista tbody tr .acoes-linha { opacity: 0.55; transition: opacity 0.12s; }
.lista tbody tr:hover .acoes-linha, .lista tbody tr:focus-within .acoes-linha { opacity: 1; }
.barra-lista.uma-coluna { grid-template-columns: 1fr; }
.contagem { font-size: 13px; color: var(--grafite); }
.voltar { margin: 0 0 8px; font-size: 14px; }
.barra-desenhos { margin-bottom: 16px; }
.barra-desenhos select { width: auto; margin: 0; min-width: 240px; }
.desenhos { grid-template-columns: minmax(300px, 420px) minmax(0, 1fr); }
.lista-desenhos { position: sticky; top: calc(var(--altura-topo) + 16px); max-height: calc(100vh - var(--altura-topo) - 40px); overflow-y: auto;
  background: var(--folha); border: 1px solid var(--traco-leve); border-radius: var(--raio-g); }
.lista-desenhos .contagem { position: sticky; top: 0; margin: 0; padding: 10px 16px; background: var(--folha); border-bottom: 1px solid var(--traco-leve); }
.lista-desenhos ul { list-style: none; margin: 0; padding: 0; }
.lista-desenhos li { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 4px 8px 4px 4px; border-bottom: 1px solid var(--traco-leve); }
.lista-desenhos li:last-child { border-bottom: 0; }
.abrir-desenho { display: grid; flex: 1; padding: 8px 12px; border-radius: var(--raio); color: var(--tinta); }
.abrir-desenho:hover { background: var(--papel); text-decoration: none; }
.abrir-desenho.ativo { background: var(--cota-fundo); }
.abrir-desenho span { font-size: 13px; color: var(--grafite); }
.lista-desenhos .botao.discreto { font-size: 13px; white-space: nowrap; }
.lista-desenhos .vazio-lista { border: 0; }
.desenhos iframe.visualizador { position: sticky; top: calc(var(--altura-topo) + 16px); height: calc(100vh - var(--altura-topo) - 40px); }
.pagina-material { display: grid; gap: 20px; max-width: 1000px; }
.acoes-formulario { display: flex; justify-content: flex-end; padding: 4px 0 12px; }
.nova-bitola { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)) auto; gap: 10px; align-items: end; margin-bottom: 16px; }
.nova-bitola label { margin: 0; }
.nova-bitola button { margin-bottom: 0; }
.zona-perigo { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 20px;
  border: 1px solid #f3c0ba; border-radius: var(--raio-g); background: var(--folha); }
.zona-perigo strong { display: block; }
.zona-perigo span { font-size: 13px; color: var(--grafite); }
.zona-perigo form { margin: 0; }
.vazio-lista { display: grid; gap: 4px; padding: 40px 24px; text-align: center; color: var(--grafite);
  background: var(--folha); border: 1px dashed var(--traco); border-radius: var(--raio-g); }
.vazio-lista strong { color: var(--tinta); }
.cabecalho-pagina { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; }
.cabecalho-pagina h1 { margin: 0; }
.cabecalho-pagina p { margin: 4px 0 0; color: var(--grafite); }
.lista-busca { display: flex; gap: 8px; margin-bottom: 16px; align-items: center; flex-wrap: wrap; }
.lista-busca input, .lista-busca select { width: auto; min-width: 260px; margin: 0; }
.duas-colunas { display: grid; grid-template-columns: minmax(300px, 1fr) 2fr; gap: 16px; align-items: start; }
iframe.visualizador { width: 100%; height: 80vh; border: 1px solid var(--traco-leve); border-radius: var(--raio-g); background: #fff; }
.aviso { padding: 12px 16px; border: 1px solid #f3c0ba; background: var(--alerta-fundo); border-radius: var(--raio-g); }
.aviso-ok { padding: 12px 16px; margin: 0 0 16px; border: 1px solid #bfe3cf; background: var(--ok-fundo); border-radius: var(--raio-g); }
.alertas { padding: 12px 16px; margin: 0 0 16px; border: 1px solid #f0d9a3; background: var(--atencao-fundo); border-radius: var(--raio-g); }
.alertas ul { margin: 6px 0 0; padding-left: 18px; }
.blocos { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 24px; }
.grupo { padding: 18px 20px 8px; background: var(--folha); border: 1px solid var(--traco-leve); border-radius: var(--raio-g); }
fieldset { border: 0; border-top: 1px solid var(--traco-leve); padding: 14px 0 4px; margin: 0; }
legend { font-weight: 650; padding: 0 8px 0 0; }
.selo-tipo { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: 12.5px; font-weight: 600; background: var(--papel); color: var(--grafite); }
.selo-tipo.compressao { background: #eaf1fd; color: #174ea9; }
.selo-tipo.tracao { background: #efeafd; color: #5a3aa8; }
.selo-tipo.torcao { background: #e7f5f3; color: #16695d; }

/* Desenho SVG */
.mola .arame { fill: none; stroke: var(--tinta); stroke-linecap: round; }
.mola .arame-tras { fill: none; stroke: var(--traco); stroke-linecap: round; }
.mola .apoio { stroke: var(--grafite); stroke-width: 3; }
.mola .cota line, .mola .cota path { stroke: var(--grafite); stroke-width: 1; fill: none; }
.mola .cota text, .mola .marca-altura text { font: 500 12px var(--fonte); fill: var(--grafite); }
.mola .cota .seta { fill: var(--grafite); stroke: none; }
.mola .cota.ativa line, .mola .cota.ativa path { stroke: var(--cota); stroke-width: 1.6; }
.mola .cota.ativa .seta { fill: var(--cota); }
.mola .cota.ativa text { fill: var(--cota); font-weight: 700; }
.mola .marca-altura line { stroke: var(--grafite); stroke-dasharray: 3 3; }
.mola .marca-altura.ativa line { stroke: var(--cota); stroke-dasharray: none; stroke-width: 1.6; }
.mola .marca-altura.ativa text { fill: var(--cota); font-weight: 700; }
.mola .marca-altura[hidden] { display: none; }


/* Ficha técnica (impressão) */
body.ficha { background: #d9dee1; }
.folha { background: #fff; width: 210mm; min-height: 297mm; margin: 16px auto; padding: 12mm; font-size: 11px; }
.folha header { display: flex; justify-content: space-between; align-items: baseline; border-bottom: 2px solid #000; margin-bottom: 6px; }
.folha h1 { font-size: 16px; margin: 0; font-stretch: 100%; }
.folha table { margin: 6px 0; font-size: 11px; border-collapse: collapse; border-radius: 0; border: 0; }
.folha tbody tr:hover { background: none; }
.folha th, .folha td { padding: 3px 5px; border: 1px solid #999; }
.folha thead th { background: #eee; color: #000; }
.folha .imagem-3d { margin: 6px 0; text-align: center; border: 1px solid #ccc; }
.folha .imagem-3d img { max-height: 62mm; max-width: 100%; }
.folha footer { display: flex; justify-content: space-between; border-top: 2px solid #000; margin-top: 8px; padding-top: 6px; }
.folha.producao { font-size: 12px; }
.folha.producao h2 { font-size: 13px; margin: 14px 0 6px; padding-bottom: 3px; border-bottom: 1px solid #000; }
.producao-ident, .producao-destaques { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border: 1px solid #999; }
.producao-destaques { grid-template-columns: repeat(3, 1fr); }
.producao-ident > div, .producao-destaques > div { padding: 6px 8px; }
.producao-ident > div + div, .producao-destaques > div + div { border-left: 1px solid #999; }
.producao-ident span, .producao-destaques span { display: block; font-size: 10px; color: #444; }
.producao-destaques b { display: block; font-size: 20px; line-height: 1.2; }
.producao-destaques small { font-size: 10px; color: #444; }
.nota-producao { font-size: 10.5px; color: #333; margin: 4px 0; }
.operacoes { margin: 0; padding-left: 20px; }
.operacoes li { position: relative; padding: 4px 28px 4px 0; border-bottom: 1px dotted #aaa; }
.operacoes li strong { display: block; }
.operacoes li span { font-size: 11px; }
.operacoes .visto { position: absolute; right: 4px; top: 6px; font-style: normal; font-size: 16px; }
.folha td.anotar { min-width: 70px; }
.folha table.ajuste td { height: 24px; }
@media print {
  @page { size: A4; margin: 0; }
  body.ficha { background: #fff; } .folha { margin: 0; width: auto; min-height: auto; } .nao-imprimir { display: none; }
}


/* Aba 3D */
.vista-3d { background: var(--folha); border: 1px solid var(--traco-leve); border-radius: var(--raio-g); overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr) 300px; grid-template-areas: "palco painel" "extras extras"; }
.palco-3d { grid-area: palco; }
.painel-3d { grid-area: painel; }
.extras-3d { grid-area: extras; display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 0 24px; padding: 0 18px;
  border-top: 1px solid var(--traco-leve); font-size: 14px; }
.extras-3d[hidden] { display: none; }
.extras-3d section { padding: 14px 0; }
.extras-3d h3 { margin: 0 0 10px; font-size: 13px; font-weight: 650; color: var(--grafite); }
.acoes-3d .baixar-3d { margin-top: 0; margin-bottom: 8px; }
.palco-3d { position: relative; height: 520px; border-right: 1px solid var(--traco-leve);
  background: radial-gradient(ellipse at 50% 35%, #ffffff 0%, #eef1f3 70%, #e3e8eb 100%); overflow: hidden; }
.cena-3d { position: absolute; inset: 0; cursor: grab; }
.cena-3d:active { cursor: grabbing; }
.cena-3d canvas { display: block; width: 100%; height: 100%; }
.rotulo-cota-3d { font: 600 12px var(--fonte); color: var(--cota); background: rgba(251, 252, 252, 0.9);
  padding: 2px 6px; border: 1px solid #b8cdf3; border-radius: 2px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.hud-3d { position: absolute; top: 14px; left: 16px; pointer-events: none; }
.hud-3d span { display: block; font-size: 12px; color: var(--grafite); }
.hud-3d strong { display: block; font-size: 30px; line-height: 1.05; font-weight: 750; font-stretch: 82%; }
.hud-3d small { display: block; margin-top: 2px; font-size: 13px; color: var(--grafite); }
.vistas-3d { position: absolute; left: 12px; bottom: 12px; display: flex; gap: 0; background: var(--folha);
  border: 1px solid var(--traco); border-radius: var(--raio); }
.vistas-3d button { border: 0; border-radius: 0; padding: 6px 11px; font-size: 13px; font-weight: 500; background: transparent; }
.vistas-3d button + button { border-left: 1px solid var(--traco-leve); }
.vistas-3d button.ativo, .vistas-3d button[aria-pressed="true"] { background: var(--tinta); color: #fff; }
.dica-3d { position: absolute; right: 12px; bottom: 10px; margin: 0; font-size: 12px; color: var(--grafite); pointer-events: none; }
.painel-3d { padding: 4px 18px 18px; font-size: 14px; }
.painel-3d section { padding: 14px 0; border-bottom: 1px solid var(--traco-leve); }
.painel-3d h3 { margin: 0 0 10px; font-size: 13px; font-weight: 650; color: var(--grafite); }
.aviso-3d { padding: 18px 0; color: var(--grafite); }
.aviso-3d p { margin: 0 0 12px; }
.aviso-3d[hidden] { display: none; }
.trilho-3d { position: relative; padding-bottom: 26px; }
.trilho-3d input[type=range] { padding: 0; margin: 0; accent-color: var(--cota); border: 0; background: transparent; }
.marcas-trilho { position: absolute; left: 8px; right: 8px; top: 22px; height: 22px; }
.marcas-trilho button { position: absolute; transform: translateX(-50%); padding: 1px 5px; font-size: 11px; font-weight: 600;
  border: 0; background: transparent; color: var(--grafite); border-top: 2px solid var(--traco); border-radius: 0; }
.marcas-trilho button.abaixo { top: 16px; border-top: 0; }
.trilho-3d:has(.abaixo) { padding-bottom: 40px; }
.marcas-trilho button.ativo { color: var(--cota); border-top-color: var(--cota); }
.leitura-3d { display: grid; grid-template-columns: auto 1fr; gap: 5px 12px; margin: 4px 0 0; }
.leitura-3d dt { color: var(--grafite); }
.leitura-3d dd { margin: 0; text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.medidor-3d { margin-bottom: 8px; }
.trilho-medidor { position: relative; height: 12px; border-radius: 2px;
  background: linear-gradient(90deg, #3b6fb6 0%, #3b6fb6 36%, #e0b000 48%, #e07b00 68%, #b3261e 80%, #7d1a14 100%); }
.limite-medidor { position: absolute; left: 80%; top: -4px; bottom: -4px; width: 2px; background: var(--tinta); }
.agulha-medidor { position: absolute; top: -6px; width: 0; height: 0; transform: translateX(-6px);
  border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 8px solid var(--tinta); transition: left 0.12s linear; }
.escala-medidor { position: relative; height: 16px; margin-top: 4px; font-size: 11px; color: var(--grafite); }
.escala-medidor span { position: absolute; }
.escala-medidor span:nth-child(1) { left: 0; }
.escala-medidor span:nth-child(2) { left: 40%; transform: translateX(-50%); }
.escala-medidor span:nth-child(3) { left: 80%; transform: translateX(-50%); white-space: nowrap; }
.valor-tensao { margin: 0; font-size: 14px; }
.valor-tensao strong { font-size: 18px; }
.valor-tensao.excede strong { color: var(--alerta); }
.alternar-3d { display: flex; }
.alternar-3d button { flex: 1; border-radius: 0; font-size: 13px; padding: 6px 8px; border-color: var(--traco); font-weight: 500; }
.alternar-3d button:first-child { border-radius: var(--raio) 0 0 var(--raio); }
.alternar-3d button:last-child { border-radius: 0 var(--raio) var(--raio) 0; border-left: 0; }
.alternar-3d button.ativo { background: var(--tinta); border-color: var(--tinta); color: #fff; }
.baixar-3d { width: 100%; margin-top: 16px; }
.simular-3d { width: 100%; margin-top: 12px; }
.grafico-3d { width: 100%; height: auto; margin-top: 10px; }
.grafico-3d text { font: 10px var(--fonte); fill: var(--grafite); }
.grafico-3d .eixo { stroke: var(--grafite); stroke-width: 1; }
.grafico-3d .reta { stroke: var(--traco); stroke-width: 1.5; stroke-dasharray: 3 3; }
.grafico-3d .traco { stroke: var(--cota); stroke-width: 2.5; }
.grafico-3d .limite { stroke: var(--alerta); stroke-dasharray: 4 3; }
.grafico-3d .ponto { fill: var(--cota); }
.grafico-3d .marca { stroke: var(--grafite); }
.extras-3d .duplo label { margin-bottom: 8px; }
.extras-3d .medida input { font-size: 14px; padding: 6px 34px 6px 8px; }
.extras-3d .medida em { bottom: 7px; }
.leitura-3d dd.excede { color: var(--alerta); }
.marcar-3d { display: flex; align-items: center; gap: 8px; margin: 8px 0 0; color: var(--tinta); }
.marcar-3d input { width: auto; margin: 0; }
.vista-3d:fullscreen { background: var(--folha); grid-template-columns: minmax(0, 1fr) 320px; overflow-y: auto; }
.vista-3d:fullscreen .palco-3d { height: 100vh; }
@media (prefers-reduced-motion: reduce) { .agulha-medidor { transition: none; } }


@media (max-width: 1100px) {
  .bancada-v2 { grid-template-columns: 1fr; height: auto; }
  .coluna-entradas, .coluna-resultado { overflow: visible; }
  .coluna-entradas { border-right: 0; border-bottom: 1px solid var(--traco-leve); }
  .cabecalho-calc { flex-wrap: wrap; }
  .cabecalho-calc .tipos { margin-left: 0; }
  .cargas-rodape { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .topo { gap: 12px; padding: 0 12px; overflow-x: auto; scrollbar-width: none; }
  .topo::-webkit-scrollbar { display: none; }
  .topo .marca span { display: none; }
  main { padding: 20px 16px 40px; }
  .cabecalho-calc { padding: 10px 16px; }
  .painel-identidade { width: calc(100vw - 32px); }
  .coluna-entradas, .coluna-resultado { padding-left: 16px; padding-right: 16px; }
  .kpis { grid-template-columns: 1fr 1fr; }
  .kpis > div:nth-child(3) { border-left: 0; }
  .kpis > div:nth-child(n+3) { border-top: 1px solid var(--traco-leve); }
  .veredito { grid-template-columns: auto 1fr; }
  .veredito-pct { grid-column: 1 / -1; text-align: left; }
  .desenho-tecnico { grid-template-columns: 1fr; }
  .desenho-tecnico svg.mola { border-right: 0; border-bottom: 1px solid var(--traco-leve); }
  .vista-3d { grid-template-columns: 1fr; grid-template-areas: "palco" "painel" "extras"; }
  .extras-3d { grid-template-columns: 1fr; }
  .palco-3d { height: 380px; border-right: 0; border-bottom: 1px solid var(--traco-leve); }
  .dica-3d { display: none; }
  .duas-colunas { grid-template-columns: 1fr; }
  .barra-lista { grid-template-columns: 1fr; }
  .nova-bitola { grid-template-columns: 1fr 1fr; }
  .lista .material, .lista th:nth-child(3) { display: none; }
  .trio { grid-template-columns: 1fr 1fr; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }
