/* Entrar (templates/entrar.html): o codigo em 6 quadrinhos sobre o campo do kit, e o texto do envio. O campo de verdade
   (data-wm-aurora-otp) fica por cima, invisivel: e ele que recebe a digitacao e que o kit le. Tokens --wm-aurora-*. */
.wm-auth-aurora__field--otp { position: relative; }
.wm-auth-aurora__field--otp input { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; margin: 0; padding: 0 16px;
  opacity: 0; font-size: 16px; letter-spacing: 0; cursor: text; }
.entrar__celulas { flex: 1; display: flex; justify-content: center; gap: 6px; min-width: 0; pointer-events: none; }
.entrar__celula { flex: 0 1 40px; min-width: 0; height: 42px; display: grid; place-items: center; border-radius: 12px;
  background: rgba(255, 255, 255, .7); box-shadow: inset 0 0 0 1px var(--wm-aurora-linha); font-size: 20px; font-weight: 600;
  color: var(--wm-aurora-tinta); font-variant-numeric: tabular-nums; transition: box-shadow .2s, background .2s; }
.entrar__celula:not(:empty) { background: #fff; }
.entrar__celula--ativa { box-shadow: inset 0 0 0 2px var(--wm-aurora-azul); }
.entrar__status { margin: 8px 0 0; font-size: 13.5px; line-height: 1.45; color: var(--wm-aurora-tinta); opacity: .75; text-align: center; }
.entrar__status[hidden] { display: none !important; }
@media (prefers-reduced-motion: reduce) { .entrar__celula { transition: none; } }
