/* Fondo del Cuartel General.

   Capa técnica tenue: rejilla de plano, un trazo diagonal en oro y dos halos
   muy difusos. Va enmascarada para desvanecerse justo en el centro, que es
   donde vive el contenido: por eso se nota en los bordes y no molesta al leer.
   Sin imágenes ni peticiones externas, y sin animación — un fondo que se mueve
   es un fondo que distrae.

   Colores en hexadecimal literal a propósito: esta hoja también se carga en la
   pantalla de acceso, donde no existen las variables de mando.css. */

html{
  background:#090b10;
}

body::before,
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
}

/* Rejilla de plano técnico y trazo diagonal. La máscara los apaga en el
   centro y los deja vivir solo hacia los bordes. */
body::before{
  background-image:
    repeating-linear-gradient(0deg, rgba(232,234,239,0.032) 0 1px, transparent 1px 72px),
    repeating-linear-gradient(90deg, rgba(232,234,239,0.032) 0 1px, transparent 1px 72px),
    repeating-linear-gradient(135deg, rgba(201,162,75,0.05) 0 1px, transparent 1px 46px);
  -webkit-mask-image: radial-gradient(ellipse 72% 62% at 50% 44%, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 46%, #000 100%);
  mask-image: radial-gradient(ellipse 72% 62% at 50% 44%, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 46%, #000 100%);
}

/* Dos halos y un viñeteado. Nada de esto toca el contraste del texto: las
   tarjetas van sobre fondo opaco y esto solo se ve en los márgenes. */
body::after{
  background-image:
    radial-gradient(48% 38% at 84% 6%, rgba(201,162,75,0.085), rgba(201,162,75,0) 68%),
    radial-gradient(52% 40% at 10% 96%, rgba(91,141,239,0.075), rgba(91,141,239,0) 70%),
    radial-gradient(135% 105% at 50% 0%, rgba(0,0,0,0) 38%, rgba(0,0,0,0.55) 100%);
}

/* En pantallas estrechas el contenido ocupa todo el ancho: menos adorno. */
@media (max-width:860px){
  body::before{opacity:.5;}
}

@media print{
  body::before,
  body::after{display:none;}
}
