/* Puerta de acceso: pagina blanca, loader verde (Bancoomeva #7AB929) centrado */
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { height: 100%; }
body {
  background: #fff;
  font-family: Arial, "Segoe UI", sans-serif;
  color: #333;
}
.puerta {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 28px;
}
.anillo {
  width: 74px;
  height: 74px;
  border: 7px solid #e6f3d8;
  border-top-color: #7ab929;
  border-right-color: #7ab929;
  border-radius: 50%;
  animation: girar 0.9s linear infinite;
}
.anillo::after {              /* halo interno verde */
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(122, 185, 41, 0.30) 0%, rgba(122, 185, 41, 0) 70%);
}
@keyframes girar { to { transform: rotate(360deg); } }
.mensaje {
  font-size: 15px;
  letter-spacing: 0.4px;
  color: #7ab929;
}
/* Pantalla de bloqueo: sobria, sin detalles */
.bloqueo {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-align: center;
  padding: 24px;
}
.bloqueo h2 { color: #444; font-size: 22px; font-weight: 600; }
.bloqueo p  { color: #888; font-size: 15px; max-width: 420px; }
.oculto { display: none; }