/* Fontes usadas no desenho do rótulo (canvas). Pesos confirmados por
   comparação objetiva de densidade de tinta contra o PDF de referência:
   Regular 400, Bold 700, Black 900 — ver DIAGNOSTICO_ETAPA0.md. */

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('../assets/fonts/montserrat-400.woff2') format('woff2');
  font-display: block;
}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: url('../assets/fonts/montserrat-700.woff2') format('woff2');
  font-display: block;
}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 900;
  src: url('../assets/fonts/montserrat-900.woff2') format('woff2');
  font-display: block;
}

/* O canvas é desenhado na resolução física exata da impressora
   (400x800 dots = 50x100mm a 203dpi/8 dots-por-mm) — o atributo width/height
   do elemento <canvas> (ver index.html) NUNCA muda, é o mesmo buffer de
   pixels que, na impressão, vira o bitmap ZPL enviado à Zebra (zpl.js lê
   canvas.width/height, não o tamanho CSS).
   O tamanho de EXIBIÇÃO em tela (largura/altura CSS) é só apresentação: é
   calculado dinamicamente em app.js (fitLabelPreview) para a etiqueta
   inteira caber na moldura sem cortar e sem precisar rolar, mantendo a
   proporção real 1:2 (50x100mm). Os valores abaixo são só o estado inicial
   antes do primeiro cálculo. */
.label-frame {
  width: 100%;
  max-width: 420px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
}

#label-canvas {
  width: 100%;
  max-width: 100%;
  height: auto;
  display: block;
  image-rendering: auto;
  background: #ffffff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}