/* =====================================================================
   TekLaser · Portal de Cotações
   Direção visual: ficha técnica / desenho de fabricação.
   Traço de corte = laranja. Linha de dobra = traço-ponto azul.
   Todo número é monoespaçado, como em instrumento de medição.
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@500;600;700&family=IBM+Plex+Mono:wght@400;500;600&family=IBM+Plex+Sans:wght@400;500;600&display=swap');

:root{
  --papel:#EDEFF2;
  --chapa:#FFFFFF;
  --chapa-2:#F6F8FA;
  --tinta:#12161B;
  --grafite:#59626E;
  --neblina:#8B94A0;
  --linha:#D6DCE3;
  --linha-fraca:#E8ECF0;

  --azul:#1A5EAB;
  --azul-esc:#134A8A;
  --azul-luz:rgba(26,94,171,.10);
  --corte:#EA5314;
  --corte-luz:rgba(234,83,20,.12);
  --verde:#127A57;
  --verde-luz:rgba(18,122,87,.12);
  --roxo:#5B4BC4;
  --roxo-luz:rgba(91,75,196,.12);
  --fumo:#5A6472;
  --fumo-luz:rgba(90,100,114,.11);
  --alerta:#B4530A;
  --erro:#C0342B;

  --r:12px; --r-sm:9px; --r-xs:6px;
  --sombra:0 1px 2px rgba(18,22,27,.06), 0 6px 20px rgba(18,22,27,.05);
  --sombra-alta:0 12px 40px rgba(18,22,27,.14);

  --display:'Archivo',system-ui,sans-serif;
  --corpo:'IBM Plex Sans',system-ui,sans-serif;
  --dado:'IBM Plex Mono',ui-monospace,monospace;
}

*{margin:0;padding:0;box-sizing:border-box;-webkit-font-smoothing:antialiased}

html{-webkit-text-size-adjust:100%}

body{
  font-family:var(--corpo);
  font-size:15px;
  line-height:1.5;
  color:var(--tinta);
  background:var(--papel);
  background-image:
    linear-gradient(rgba(89,98,110,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(89,98,110,.045) 1px, transparent 1px);
  background-size:22px 22px;
  min-height:100vh;
  min-height:100dvh;
}

/* ---------- tipografia ---------- */
h1,h2,h3{font-family:var(--display);letter-spacing:-.015em;line-height:1.15}
h1{font-size:26px;font-weight:700}
h2{font-size:19px;font-weight:600}
h3{font-size:15px;font-weight:600}

.rotulo{
  font-family:var(--display);
  font-size:11px;font-weight:600;
  letter-spacing:.11em;text-transform:uppercase;
  color:var(--neblina);
}
.rotulo .dica{
  text-transform:none;letter-spacing:0;
  font-family:var(--corpo);font-weight:400;
}
.dado{font-family:var(--dado);font-variant-numeric:tabular-nums}
.mudo{color:var(--grafite)}
.pequeno{font-size:13px}

/* ---------- header ---------- */
header{
  position:sticky;top:0;z-index:60;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--linha);
}
.header-in{
  max-width:1240px;margin:0 auto;
  height:58px;padding:0 16px;
  display:flex;align-items:center;gap:12px;
}
/* identidade da página, à esquerda */
.cab-titulo{flex-shrink:0;text-decoration:none;color:inherit;line-height:1.15}
.cab-titulo .rotulo{font-size:9.5px;display:block}
.cab-titulo b{
  font-family:var(--display);font-size:15px;font-weight:700;
  letter-spacing:-.02em;display:block;margin-top:1px;
}
.cab-titulo.admin .rotulo{color:var(--corte)}

/* logo da TekLaser, canto superior esquerdo */
.logo-emp{
  flex-shrink:0;display:block;
  margin-right:13px;padding-right:13px;
  border-right:1px solid var(--linha);
}
.logo-emp img{height:19px;width:auto;display:block}

.nav{display:flex;gap:2px;margin-left:auto}
.nav-btn{
  background:none;border:none;cursor:pointer;
  font-family:var(--corpo);font-size:14px;font-weight:500;
  color:var(--grafite);padding:8px 13px;border-radius:var(--r-sm);
  transition:background .15s,color .15s;
}
.nav-btn:hover{background:var(--chapa-2);color:var(--tinta)}
.nav-btn.on{background:var(--tinta);color:#fff}

.usuario{
  display:flex;align-items:center;gap:8px;
  padding-left:12px;margin-left:8px;border-left:1px solid var(--linha);
}
.usuario-nome{font-size:13px;font-weight:500;line-height:1.2}
.usuario-emp{font-size:11px;color:var(--neblina);line-height:1.2}
.sair{
  background:none;border:1px solid var(--linha);color:var(--grafite);
  border-radius:var(--r-xs);padding:6px 10px;font-size:12px;font-weight:500;
  cursor:pointer;font-family:var(--corpo);transition:.15s;
}
.sair:hover{border-color:var(--erro);color:var(--erro)}

/* ---------- layout ---------- */
.wrap{max-width:1240px;margin:0 auto;padding:22px 16px 96px}
.pagina{display:none}
.pagina.on{display:block}

.topo{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:14px;flex-wrap:wrap;margin-bottom:18px;
}
.topo p{color:var(--grafite);font-size:14px;margin-top:3px}

.duas{display:grid;grid-template-columns:1fr;gap:16px}

/* ---------- cartão ---------- */
.cartao{
  background:var(--chapa);
  border:1px solid var(--linha);
  border-radius:var(--r);
  box-shadow:var(--sombra);
  overflow:hidden;
}
.cartao + .cartao{margin-top:14px}
.cartao-topo{
  padding:13px 16px;
  border-bottom:1px solid var(--linha-fraca);
  background:var(--chapa-2);
  display:flex;align-items:center;justify-content:space-between;gap:10px;
}
.cartao-corpo{padding:16px}

/* ---------- formulário ---------- */
.campo{display:flex;flex-direction:column;gap:6px}
.campo label{
  font-size:12px;font-weight:600;color:var(--grafite);
  display:flex;align-items:center;gap:5px;
}
.campo label b{color:var(--corte);font-weight:600}
.dica{font-size:11px;color:var(--neblina);font-weight:400}

input,select,textarea{
  width:100%;
  font-family:var(--dado);
  font-size:16px;               /* 16px trava o zoom automático do iOS */
  font-variant-numeric:tabular-nums;
  color:var(--tinta);
  background:var(--chapa);
  border:1px solid var(--linha);
  border-radius:var(--r-sm);
  padding:11px 12px;
  transition:border-color .15s, box-shadow .15s;
  -webkit-appearance:none;appearance:none;
}
textarea{font-family:var(--corpo);resize:vertical;min-height:72px;line-height:1.5}
select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' stroke='%2359626E' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;
  padding-right:34px;font-family:var(--corpo);
}
input::placeholder{color:#B9C1CA;font-family:var(--dado)}
input:focus,select:focus,textarea:focus{
  outline:none;border-color:var(--azul);box-shadow:0 0 0 3px var(--azul-luz);
}
input:disabled,select:disabled{background:var(--chapa-2);color:var(--neblina)}

.grade{display:grid;gap:13px}
.g2{grid-template-columns:1fr 1fr}
.g3{grid-template-columns:repeat(3,1fr)}

/* trio de dimensões com o × entre os campos */
.dims{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:8px;align-items:end}
.dims-x{
  font-family:var(--dado);color:var(--neblina);font-size:15px;
  padding-bottom:12px;user-select:none;
}

/* contador de quantidade */
.qtd{display:flex;align-items:stretch}
.qtd input{
  border-radius:0;text-align:center;border-left:none;border-right:none;
  font-weight:600;
}
.qtd button{
  width:44px;flex-shrink:0;
  background:var(--chapa-2);border:1px solid var(--linha);
  color:var(--grafite);font-size:19px;font-family:var(--dado);
  cursor:pointer;transition:.15s;
}
.qtd button:first-child{border-radius:var(--r-sm) 0 0 var(--r-sm)}
.qtd button:last-child{border-radius:0 var(--r-sm) var(--r-sm) 0}
.qtd button:hover{background:var(--azul);color:#fff;border-color:var(--azul)}

/* seletor de faixas (furos) */
.faixas{display:grid;grid-template-columns:repeat(auto-fit,minmax(84px,1fr));gap:7px}
.faixa{
  background:var(--chapa);border:1px solid var(--linha);
  border-radius:var(--r-sm);padding:11px 6px;cursor:pointer;
  font-family:var(--corpo);font-size:13px;font-weight:500;color:var(--grafite);
  transition:.15s;text-align:center;line-height:1.3;
}
.faixa:hover{border-color:var(--azul);color:var(--tinta)}
.faixa.on{background:var(--azul);border-color:var(--azul);color:#fff}

/* interruptor */
.chave{
  display:flex;align-items:center;gap:11px;cursor:pointer;
  padding:11px 13px;border:1px solid var(--linha);
  border-radius:var(--r-sm);background:var(--chapa-2);
}
.chave input{display:none}
.chave-caixa{
  width:38px;height:22px;border-radius:11px;background:var(--linha);
  position:relative;flex-shrink:0;transition:background .18s;
}
.chave-caixa::after{
  content:'';position:absolute;top:2px;left:2px;
  width:18px;height:18px;border-radius:50%;background:#fff;
  box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .18s;
}
.chave input:checked + .chave-caixa{background:var(--azul)}
.chave input:checked + .chave-caixa::after{transform:translateX(16px)}
.chave-txt{font-size:13px;font-weight:500;line-height:1.35}
.chave-txt small{display:block;color:var(--neblina);font-weight:400;font-size:11px}

/* ---------- botões ---------- */
.btn{
  font-family:var(--corpo);font-size:14px;font-weight:600;
  padding:12px 18px;border-radius:var(--r-sm);border:1px solid transparent;
  cursor:pointer;transition:.15s;
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  min-height:44px;
}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn-p{background:var(--azul);color:#fff}
.btn-p:hover:not(:disabled){background:var(--azul-esc)}
.btn-c{background:var(--corte);color:#fff}
.btn-v{background:var(--verde);color:#fff}
.btn-v:hover:not(:disabled){background:#0E6647}
.btn-r{background:var(--roxo);color:#fff}
.btn-r:hover:not(:disabled){background:#4A3CA8}
.btn-c:hover:not(:disabled){background:#CE460F}
.btn-s{background:var(--chapa);color:var(--tinta);border-color:var(--linha)}
.btn-s:hover:not(:disabled){border-color:var(--grafite);background:var(--chapa-2)}
.btn-f{background:none;color:var(--grafite);border:none;padding:9px 12px}
.btn-f:hover{color:var(--tinta);background:var(--chapa-2)}
.btn-x{color:var(--erro)}
.btn-larg{width:100%}

/* ---------- desenho técnico (elemento assinatura) ---------- */
.prancheta{
  background:var(--chapa-2);
  border-bottom:1px solid var(--linha-fraca);
  padding:14px;
  position:relative;
}
.prancheta svg{width:100%;height:auto;display:block;max-height:290px}
.prancheta-vazia{
  height:190px;display:grid;place-items:center;text-align:center;
  color:var(--neblina);font-size:13px;padding:20px;
}
.legenda{
  display:flex;gap:14px;flex-wrap:wrap;
  padding:9px 14px;border-bottom:1px solid var(--linha-fraca);
  font-size:11px;color:var(--grafite);background:var(--chapa);
}
.legenda i{display:inline-block;width:20px;height:0;vertical-align:middle;margin-right:5px}
.leg-corte{border-top:2px solid var(--corte)}
.leg-dobra{border-top:1.5px dashed var(--azul)}

/* ---------- painel de preço ---------- */
.preco{padding:16px;border-top:1px solid var(--linha-fraca)}
.preco-linha{
  display:flex;align-items:baseline;justify-content:space-between;
  gap:12px;padding:7px 0;
}
.preco-linha + .preco-linha{border-top:1px dashed var(--linha-fraca)}
.preco-linha span{font-size:13px;color:var(--grafite)}
.preco-linha b{font-family:var(--dado);font-size:15px;font-weight:500}
.preco-total{
  margin-top:12px;padding-top:14px;border-top:2px solid var(--tinta);
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
}
.preco-total span{font-family:var(--display);font-size:12px;font-weight:600;
  letter-spacing:.11em;text-transform:uppercase;color:var(--grafite)}
.preco-total b{
  font-family:var(--dado);font-size:30px;font-weight:600;
  letter-spacing:-.02em;line-height:1;
}
.aviso-min{
  margin-top:10px;padding:9px 11px;border-radius:var(--r-xs);
  background:rgba(180,83,10,.09);color:var(--alerta);
  font-size:12px;line-height:1.45;
}

/* ---------- lista de itens ---------- */
.item{
  display:flex;align-items:center;gap:12px;
  padding:12px 16px;border-bottom:1px solid var(--linha-fraca);
}
.item:last-child{border-bottom:none}
.item-n{
  width:26px;height:26px;flex-shrink:0;border-radius:var(--r-xs);
  background:var(--chapa-2);border:1px solid var(--linha);
  display:grid;place-items:center;
  font-family:var(--dado);font-size:11px;font-weight:600;color:var(--grafite);
}
.item-txt{flex:1;min-width:0}
.item-desc{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.item-esp{font-family:var(--dado);font-size:11.5px;color:var(--grafite);margin-top:2px}
.item-peso{
  text-align:right;flex-shrink:0;min-width:104px;
  padding-right:14px;margin-right:2px;
  border-right:1px solid var(--linha-fraca);
}
.item-peso b{
  display:block;font-family:var(--dado);font-size:14px;
  font-weight:600;color:var(--grafite);white-space:nowrap;
}
.item-peso small{
  display:block;font-size:10.5px;color:var(--neblina);
  margin-top:2px;white-space:nowrap;
}
.item-val{text-align:right;flex-shrink:0}

.soma-peso{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:14px 18px;border-top:1.5px solid var(--linha);
  background:var(--chapa-2);
}
.soma-peso b{
  font-family:var(--dado);font-size:19px;font-weight:700;
  color:var(--tinta);white-space:nowrap;
}
.item-val b{font-family:var(--dado);font-size:14px;font-weight:600;display:block}
.item-val small{font-family:var(--dado);font-size:11px;color:var(--neblina)}

/* ---------- kanban ---------- */
.quadro{display:grid;gap:14px;grid-template-columns:1fr;align-items:start}
.coluna{
  background:rgba(255,255,255,.6);
  border:1px solid var(--linha);border-radius:var(--r);
}
.coluna-topo{
  padding:12px 14px;border-bottom:1px solid var(--linha-fraca);
  display:flex;align-items:center;gap:9px;
}
.coluna-marca{width:3px;height:16px;border-radius:2px;background:var(--grafite)}
.col-cotacao .coluna-marca{background:var(--azul)}
.col-liberado .coluna-marca{background:var(--corte)}
.col-fabricando .coluna-marca{background:var(--roxo)}
.col-pronto .coluna-marca{background:var(--verde)}
.col-retirado .coluna-marca{background:var(--fumo)}
.col-entregue .coluna-marca{background:var(--verde)}
.coluna-nome{font-family:var(--display);font-size:13px;font-weight:600;letter-spacing:-.01em}
.coluna-cont{
  margin-left:auto;font-family:var(--dado);font-size:11px;font-weight:600;
  background:var(--chapa-2);border:1px solid var(--linha);
  border-radius:20px;padding:2px 8px;color:var(--grafite);
}
.coluna-cartoes{padding:10px;display:flex;flex-direction:column;gap:9px;min-height:70px}
.coluna-vazia{
  text-align:center;color:var(--neblina);font-size:12.5px;
  padding:22px 12px;line-height:1.5;
}

.ficha{
  background:var(--chapa);border:1px solid var(--linha);
  border-radius:var(--r-sm);padding:12px;box-shadow:var(--sombra);
  transition:box-shadow .15s,border-color .15s;
}
.ficha:hover{border-color:var(--neblina);box-shadow:var(--sombra-alta)}
.ficha-clica{cursor:pointer;transition:border-color .12s,box-shadow .12s}
.ficha-clica:hover{border-color:var(--azul);box-shadow:var(--sombra-alta)}
.ficha-clica:active{transform:translateY(1px)}
.ficha-topo{display:flex;align-items:baseline;justify-content:space-between;gap:9px}
.ficha-num{font-family:var(--dado);font-size:10.5px;font-weight:600;
  letter-spacing:.04em;color:var(--neblina)}
.ficha-val{font-family:var(--dado);font-size:14px;font-weight:600}
.ficha-tit{font-size:14px;font-weight:600;margin:4px 0 6px;line-height:1.3}
.ficha-meta{
  display:flex;gap:10px;flex-wrap:wrap;
  font-family:var(--dado);font-size:11px;color:var(--grafite);
}
.ficha-acoes{display:flex;gap:6px;margin-top:11px}
.ficha-acoes .btn{flex:1;min-height:38px;padding:8px 10px;font-size:12.5px}

.etiqueta{
  display:inline-block;font-family:var(--display);font-size:10px;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;
  padding:3px 8px;border-radius:20px;
}
.et-cotacao{background:var(--azul-luz);color:var(--azul)}
.et-liberado{background:var(--corte-luz);color:var(--corte)}
.et-fabricando{background:var(--roxo-luz);color:var(--roxo)}
.et-pronto{background:var(--verde-luz);color:var(--verde)}
.et-retirado{background:var(--fumo-luz);color:var(--fumo)}
.et-entregue{background:var(--verde-luz);color:var(--verde)}

/* ---------- tabela (admin) ---------- */
.rolagem{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:680px}
th{
  font-family:var(--display);font-size:11px;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;color:var(--neblina);
  text-align:left;padding:10px 12px;border-bottom:1px solid var(--linha);
  white-space:nowrap;
}
td{padding:11px 12px;border-bottom:1px solid var(--linha-fraca);vertical-align:middle}
tbody tr:last-child td{border-bottom:none}
tbody tr:hover{background:var(--chapa-2)}
td.num{font-family:var(--dado);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}

/* ---------- indicadores ---------- */
.indicadores{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}
.indicador{
  background:var(--chapa);border:1px solid var(--linha);
  border-radius:var(--r);padding:14px;
}
.indicador .rotulo{font-size:10px}
.indicador b{
  display:block;font-family:var(--dado);font-size:23px;font-weight:600;
  margin-top:5px;letter-spacing:-.02em;
}

/* ---------- login ---------- */
.entrada{
  min-height:100vh;min-height:100dvh;
  display:grid;place-items:center;padding:22px 16px;
}
.entrada-cartao{
  width:100%;max-width:390px;
  background:var(--chapa);border:1px solid var(--linha);
  border-radius:var(--r);box-shadow:var(--sombra-alta);
  padding:30px 26px;
}
.entrada-marca{margin-bottom:26px}
.entrada-marca img{width:172px;max-width:62%;height:auto;display:block}
.entrada h1{font-size:22px;margin-bottom:5px}
.entrada .mudo{font-size:13.5px;margin-bottom:22px}
.entrada .campo + .campo{margin-top:13px}
.entrada .btn{margin-top:20px}
.rodape-entrada{
  text-align:center;margin-top:18px;font-size:12px;color:var(--neblina);line-height:1.6;
}

/* ---------- importação e seleção de DXF ---------- */
.solta{
  display:block;                      /* label é inline: sem isso a borda quebra */
  border:1.5px dashed var(--linha);border-radius:var(--r-sm);
  background:var(--chapa-2);padding:22px 16px;text-align:center;
  cursor:pointer;transition:.15s;
}
.solta:hover,.solta.sobre{border-color:var(--azul);background:var(--azul-luz)}
.solta-tit{
  display:block;font-family:var(--display);font-weight:600;
  font-size:14.5px;color:var(--tinta);margin-bottom:4px;
}
.solta-txt{
  display:block;font-size:12.5px;color:var(--grafite);line-height:1.6;
  max-width:340px;margin:0 auto;
}
.solta-txt b{color:var(--azul);font-weight:600}
.solta input{display:none}

.tela{
  background:var(--chapa-2);border:1px solid var(--linha-fraca);
  border-radius:var(--r-sm);padding:8px;position:relative;
  overflow:hidden;
}
.tela svg{width:100%;height:auto;display:block;max-height:340px}
.tela path{transition:stroke .1s,stroke-width .1s}
.tela path:hover{stroke:var(--azul) !important;stroke-width:2.6 !important}

.barrinha{height:7px;border-radius:4px;background:var(--linha);overflow:hidden;margin-top:7px}
.barrinha i{
  display:block;height:100%;border-radius:4px;
  background:var(--corte);transition:width .25s ease;
}
.barrinha.cheia i{background:var(--verde)}
.pct-linha{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.pct-linha b{font-family:var(--dado);font-size:17px;font-weight:600}
.pct-linha span{font-size:12px;color:var(--grafite)}

.acoes-sel{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.acoes-sel .btn{flex:1;min-width:104px;min-height:38px;padding:8px 10px;font-size:12.5px}

.camadas{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.camada{
  font-family:var(--dado);font-size:11px;
  border:1px solid var(--linha);background:var(--chapa);
  border-radius:20px;padding:4px 10px;cursor:pointer;transition:.15s;
}
.camada:hover{border-color:var(--azul)}
.camada.on{background:var(--corte);border-color:var(--corte);color:#fff}

/* ---------- modal do detalhe da conta ---------- */
.veu{
  position:fixed;inset:0;z-index:150;
  background:rgba(18,22,27,.55);backdrop-filter:blur(3px);
  display:none;align-items:flex-start;justify-content:center;
  padding:22px 14px;overflow-y:auto;-webkit-overflow-scrolling:touch;
}
.veu.on{display:flex}
.janela{
  background:var(--chapa);border-radius:var(--r);
  box-shadow:var(--sombra-alta);width:100%;max-width:560px;
  margin:auto;overflow:hidden;
}
.janela-topo{
  padding:15px 18px;border-bottom:1px solid var(--linha);
  background:var(--chapa-2);
  display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
}
.janela-fecha{
  background:none;border:none;cursor:pointer;font-size:22px;line-height:1;
  color:var(--neblina);padding:2px 6px;border-radius:var(--r-xs);flex-shrink:0;
}
.janela-fecha:hover{background:var(--linha-fraca);color:var(--tinta)}
.janela-corpo{padding:6px 18px 18px}

.conta-secao{
  font-family:var(--display);font-size:10.5px;font-weight:600;
  letter-spacing:.11em;text-transform:uppercase;color:var(--neblina);
  margin:18px 0 7px;padding-bottom:5px;border-bottom:1px solid var(--linha-fraca);
}
.conta-linha{
  display:flex;align-items:baseline;gap:10px;
  padding:5px 0;font-size:13px;
}
.conta-linha > span:first-child{color:var(--grafite);flex-shrink:0}
.conta-pontos{flex:1;border-bottom:1px dotted var(--linha);min-width:14px;transform:translateY(-3px)}
.conta-linha b{font-family:var(--dado);font-weight:500;white-space:nowrap}
.conta-linha em{
  font-family:var(--corpo);font-style:normal;font-size:11.5px;
  color:var(--neblina);white-space:nowrap;
}
.conta-forte b{font-size:15px;font-weight:600}
.conta-o2{color:var(--corte)}

/* ---------- avisos ---------- */
.recado{
  padding:11px 13px;border-radius:var(--r-sm);font-size:13px;line-height:1.5;
  margin-top:14px;display:none;
}
.recado.on{display:block}
.recado-erro{background:rgba(192,52,43,.09);color:var(--erro);border:1px solid rgba(192,52,43,.2)}
.recado-ok{background:var(--verde-luz);color:var(--verde);border:1px solid rgba(18,122,87,.2)}

.toast{
  position:fixed;left:50%;bottom:22px;transform:translate(-50%,140%);
  background:var(--tinta);color:#fff;
  padding:12px 20px;border-radius:var(--r-sm);
  font-size:13.5px;font-weight:500;z-index:200;
  box-shadow:var(--sombra-alta);transition:transform .28s cubic-bezier(.2,.8,.3,1);
  max-width:calc(100vw - 32px);text-align:center;
}
.toast.on{transform:translate(-50%,0)}

.vazio{
  text-align:center;padding:48px 20px;color:var(--grafite);
}
.vazio h3{margin-bottom:6px;color:var(--tinta)}
.vazio p{font-size:13.5px;max-width:340px;margin:0 auto 18px}

.carregando{text-align:center;padding:38px;color:var(--neblina);font-size:13.5px}

/* barra fixa de ação no rodapé (mobile) */
.barra{
  position:fixed;left:0;right:0;bottom:0;z-index:70;
  background:rgba(255,255,255,.96);backdrop-filter:blur(14px);
  border-top:1px solid var(--linha);
  padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  display:none;align-items:center;gap:12px;
}
.barra.on{display:flex}
.barra-val{flex:1;min-width:0}
.barra-val .rotulo{font-size:9.5px}
.barra-val b{font-family:var(--dado);font-size:19px;font-weight:600;display:block;line-height:1.2}
.barra .btn{flex-shrink:0}

/* =====================================================================
   TABLET — a partir de 700px
   ===================================================================== */
@media (min-width:700px){
  body{font-size:15.5px}
  .header-in{height:64px;padding:0 22px}
  .wrap{padding:28px 22px 40px}
  h1{font-size:30px}
  .grade.g2{grid-template-columns:1fr 1fr}
  .indicadores{grid-template-columns:repeat(4,1fr)}
  .quadro{grid-template-columns:repeat(2,1fr)}
  .barra{display:none !important}
  .cartao-corpo{padding:18px}
}

/* =====================================================================
   DESKTOP — a partir de 1024px
   ===================================================================== */
@media (min-width:1024px){
  .quadro{grid-template-columns:repeat(5,1fr);gap:11px}
  .coluna-cartoes{padding:8px}
  .ficha{padding:10px}
  .ficha-tit{font-size:13px}
  .duas{grid-template-columns:minmax(0,1.35fr) minmax(340px,1fr);gap:20px;align-items:start}
  .grude{position:sticky;top:82px}
  .prancheta svg{max-height:340px}
  .coluna-cartoes{min-height:180px}
}

/* =====================================================================
   CELULAR — até 699px
   ===================================================================== */
@media (max-width:699px){
  .header-in{height:54px;padding:0 13px;gap:8px}
  .cab-titulo .rotulo{display:none}
  .cab-titulo b{font-size:14px}
  .usuario-nome,.usuario-emp{display:none}
  .usuario{padding-left:9px;margin-left:auto
  .item{flex-wrap:wrap}
  .item-peso{
    order:3;width:100%;text-align:left;border-right:none;
    border-top:1px solid var(--linha-fraca);
    padding:8px 0 0;margin:8px 0 0;min-width:0;
  }
  .item-peso b{display:inline;font-size:13px}
  .item-peso small{display:inline;margin-left:8px}
  .soma-peso{padding:13px 15px}
  .soma-peso b{font-size:17px}
}
  .logo-emp{margin-right:9px;padding-right:10px}
  .logo-emp img{height:15px}
  .nav{
    position:fixed;left:0;right:0;top:54px;z-index:55;
    background:var(--chapa);border-bottom:1px solid var(--linha);
    padding:7px 10px;gap:6px;margin:0;
    overflow-x:auto;-webkit-overflow-scrolling:touch;
  }
  .nav-btn{flex-shrink:0;font-size:13.5px;padding:8px 14px}
  .wrap{padding:66px 13px 96px}
  h1{font-size:22px}
  .topo{margin-bottom:14px}
  .cartao-corpo{padding:14px}
  .dims{grid-template-columns:1fr;gap:11px}
  .dims-x{display:none}
  .grade.g3{grid-template-columns:1fr 1fr}
  .grade.g3 > .campo:only-child{grid-column:1/-1}
  .faixas{grid-template-columns:1fr 1fr}
  .preco-total b{font-size:26px}
  .indicadores{gap:9px}
  .indicador{padding:12px}
  .indicador b{font-size:19px}
  .ficha-acoes{flex-direction:column}
  .prancheta{padding:11px}
  .prancheta svg{max-height:210px}
  .legenda{font-size:10.5px;gap:11px}
  .toast{left:13px;right:13px;transform:translateY(140%);max-width:none}
  .toast.on{transform:translateY(0)}
}

@media (max-width:359px){
  .cab-titulo{display:none}
  .logo-emp{border-right:none;padding-right:0}
  .faixas{grid-template-columns:1fr}
  .grade.g2,.grade.g3{grid-template-columns:1fr}
}

/* =====================================================================
   ACESSIBILIDADE / IMPRESSÃO
   ===================================================================== */
:focus-visible{outline:2px solid var(--azul);outline-offset:2px;border-radius:3px}

@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important}
}

@media print{
  body{background:#fff}
  header,.nav,.barra,.ficha-acoes,.btn{display:none !important}
  .cartao{box-shadow:none;border-color:#999;break-inside:avoid}
  .wrap{padding:0}
}
