/* Leitor de QR Code — página standalone (/leitor-qr.html) e painel da SPA.
   Só tokens do design system (regras.md): nada de cor/raio/espaço fixo. */
.go-ds .glq { display: flex; flex-direction: column; gap: var(--space-3); max-width: 720px; margin: 0 auto; }
.go-ds .glq-camera {
  position: relative; width: 100%; aspect-ratio: 4 / 3; overflow: hidden;
  background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-lg);
}
.go-ds .glq-camera video { width: 100%; height: 100%; object-fit: cover; display: block; }
.go-ds .glq-mira {
  position: absolute; top: 50%; left: 50%; width: 62%; aspect-ratio: 1; transform: translate(-50%, -50%);
  border: 3px solid var(--accent); border-radius: var(--radius-lg); pointer-events: none;
  box-shadow: 0 0 0 100vmax color-mix(in srgb, var(--surface-2) 45%, transparent);
}
.go-ds .glq-status {
  position: absolute; left: var(--space-3); right: var(--space-3); bottom: var(--space-3);
  display: flex; align-items: center; justify-content: center; gap: var(--space-2);
  padding: var(--space-2) var(--space-3); border-radius: var(--radius-md);
  background: var(--card); color: var(--text); font-size: var(--font-sm); font-weight: 600; box-shadow: var(--shadow);
}
.go-ds .glq-status.glq-status-erro { color: var(--danger); }
.go-ds .glq-resultado {
  display: flex; flex-direction: column; gap: var(--space-2); align-items: flex-start;
  padding: var(--space-4); border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--card);
}
.go-ds .glq-res-titulo { display: flex; align-items: center; gap: var(--space-2); font-weight: 700; }
.go-ds .glq-res-valor { font-size: var(--font-sm); color: var(--text-muted); word-break: break-all; }
.go-ds .glq-dica { font-size: var(--font-xs); color: var(--text-muted); text-align: center; }
@media (max-width: 600px) {
  .go-ds .glq-camera { aspect-ratio: 3 / 4; }
  .go-ds .glq-mira { width: 72%; }
}

/* Janela do Gestor com a página lida (ficha etc.) — tela cheia, dentro da página. */
.glq-janela.modal-overlay { position: fixed; inset: 0; z-index: 9999; display: flex; padding: var(--space-3); }
.go-ds .glq-janela-modal {
  /* !important: vence o .modal global do style.css no mobile (regras.md §15). */
  width: 100% !important; max-width: none !important; height: 100%; max-height: none !important; margin: 0;
  display: flex; flex-direction: column; padding: 0; overflow: hidden; border-radius: var(--radius-lg);
}
.go-ds .glq-janela-topo {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-3);
  padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--border); background: var(--card);
}
.go-ds .glq-janela-titulo { display: flex; align-items: center; gap: var(--space-2); font-weight: 700; }
.go-ds .glq-janela-frame { flex: 1; width: 100%; border: 0; background: var(--card); }

/* Lanterna / zoom sobre a imagem da câmera (só quando o aparelho suporta). */
.go-ds .glq-ctrl { position: absolute; top: var(--space-3); right: var(--space-3); display: flex; flex-direction: column; gap: var(--space-2); }
.go-ds .glq-ctrl-btn {
  width: 48px; height: 48px; border-radius: 999px; border: 1px solid var(--border);
  background: var(--card); color: var(--text); font-weight: 700; font-size: var(--font-sm);
  display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: var(--shadow);
}
.go-ds .glq-ctrl-btn.ativo { background: var(--accent); color: var(--card); border-color: var(--accent); }
.go-ds .glq-ctrl-btn[hidden] { display: none; }