/* Páginas de acceso (login, código de dos pasos, registro y su verificación):
   el fondo animado de fondo-acceso.js y la tarjeta de vidrio de la portada.

   Oscuras a propósito, como la portada: el fondo es oscuro, y con el tema claro
   las variables --auth-* pasarían a texto oscuro sobre él. Por eso la paleta
   oscura se fija aquí, en el <body>, para estas páginas y solo para ellas. */
body.bz-acceso {
  --auth-bg: #0b0f19; --auth-card: #121824; --auth-border: #1a2333;
  --auth-text: #f8f9fa; --auth-muted: #8997ad; --auth-soft: #ccc; --auth-dim: #666;
  --auth-violet: #7850ff;
  --cyan: #00e5ff; --green: #00ff88; --red: #ff4d4d; --yellow: #ffd700;
  --text-main: #e0e0e0; --text-dim: #555; --border-soft: #222; --border-strong: #333;
  --overlay-06: rgba(255,255,255,.06); --overlay-08: rgba(255,255,255,.08); --overlay-10: rgba(255,255,255,.1);
  background: #0b0f19 !important;
  color: var(--auth-text);
}
/* Los resplandores fijos de CSS de antes sobran: ahora hay fondo animado */
body.bz-acceso::before, body.bz-acceso::after { display: none !important; }

.fondo-acceso { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
.fondo-acceso canvas { display: block; width: 100%; height: 100%; }
/* Todo el contenido, por encima del fondo */
body.bz-acceso > *:not(.fondo-acceso) { position: relative; z-index: 1; }

/* La tarjeta, de vidrio: deja ver el fondo detrás, difuminado */
.acceso-vidrio {
  background: linear-gradient(155deg, rgba(255,255,255,.075), rgba(255,255,255,.012) 55%), rgba(18, 24, 36, .55) !important;
  border: 1px solid rgba(255, 255, 255, .09) !important;
  backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 30px 60px -28px rgba(0,0,0,.8) !important;
}