/* GENERADO por herramientas/generar-fondos.mjs -- NO EDITAR A MANO.
   evaluacion/paridad-fondos.mjs vuelve a llamar cssDeFondos() y compara: un cambio hecho aqui
   a mano (una opacidad, una url) se pierde en el proximo "node herramientas/generar-fondos.mjs"
   y hasta entonces la guardia lo marca como DERIVA. Para cambiar un numero, edita
   herramientas/fondos-catalogo.mjs y vuelve a correr el generador. */
:root{
  --fondo-remolino:url(/fondos/remolino.3fe0938d.jpg);
  --fondo-corrientes:url(/fondos/corrientes.502cff36.jpg);
  --fondo-trama:url(/fondos/trama.e9a6b8fc.jpg);
  --fondo-rayado:url(/fondos/rayado.dcedcfc7.jpg);
  --fondo-recorte:url(/fondos/recorte.abc36583.jpg);
  --fondo-amanecer:url(/fondos/amanecer.0c1eb8c0.jpg);
  --fondo-pintura:url(/fondos/pintura.1a3a416b.jpg);
  --fondo-espirales-milpa:url(/fondos/espirales-milpa.3f9bad2f.jpg);
  --fondo-trenza-milpa:url(/fondos/trenza-milpa.9f2743e6.jpg);
  --fondo-cosecha:url(/fondos/cosecha.c39ef523.jpg);
  --fondo-gota-de-tinta:url(/fondos/gota-de-tinta.c281e352.jpg);
  --ilus-camaras:url(/fondos/camaras.72b8fdf6.jpg);
  --ilus-fotografo:url(/fondos/fotografo.5a930148.jpg);
  --ilus-novios:url(/fondos/novios.1c97032e.jpg);
  --ilus-perritos:url(/fondos/perritos.b51b94f2.jpg);
  --ilus-camaras-cubista:url(/fondos/camaras-cubista.72903e18.jpg);
  --ilus-novios-cubista:url(/fondos/novios-cubista.bbaca627.jpg);
  --ilus-fotografo-cubista:url(/fondos/fotografo-cubista.42cd3aba.jpg);
  --ave-posada:url(/fondos/posada.7e247d31.jpg);
  --ave-la-bandada:url(/fondos/la-bandada.08ea97d9.jpg);
  --ave-con-sol:url(/fondos/con-sol.9e395ce2.jpg);
  --ave-de-frente:url(/fondos/de-frente.cc7f917c.jpg);
  --ave-la-pareja:url(/fondos/la-pareja.50c1752a.jpg);
  --ave-aterrizando:url(/fondos/aterrizando.8ee3001f.jpg);
  --ave-cruzando-la-abertura:url(/fondos/cruzando-la-abertura.8e322fb4.jpg);
  --fondo-opacidad:0.55;
  --fondo-velo:0.82;
}
:root[data-theme="dark"]{ --fondo-velo:0.76; }

/* ---- .fondo: textura + velo de dos capas ----
   Dos capas y no una plana: una sola no sostenia el contraste de --muted (medido con
   evaluacion/paridad-fondos.mjs). Terminan en var(--paper): se invierten solas con el tema,
   mismo principio que .fb-hero-velo (ficha.css). */
.fondo{ position:relative; isolation:isolate; background-color:var(--paper); }
/* SIN ".fondo > *{ position:relative }": no hace falta (un hijo estatico ya pinta despues
   de los pseudo-elementos de z-index negativo, ver CSS2.1 Apendice E) y de hecho rompia --
   le ganaba por cascada a cualquier hijo que de verdad necesitara position:fixed/absolute
   propio (ej. .quiz-ilus), dejandolo position:relative sin que nadie lo pidiera. */
.fondo::before{ content:""; position:absolute; inset:0; z-index:-2; pointer-events:none;
  background:var(--fondo-img) center/cover no-repeat; opacity:var(--fondo-opacidad); }
.fondo::after{ content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--paper) calc(var(--fondo-velo) * 100%), transparent) 0%, var(--paper) 100%),
    linear-gradient(90deg, color-mix(in srgb, var(--paper) calc(var(--fondo-velo) * 100%), transparent) 0%, transparent 100%); }

/* ---- .fondo-invertido: tarjetas que invierten por tema (ej. .fsec-next: tinta de fondo en
   claro, papel en oscuro). Mismo mecanismo, velo de tinta en vez de papel -- con su PROPIA
   opacidad de textura (mas alta: pinta texto claro sobre la textura, no --muted, asi que
   aguanta mucho mas antes de romper 4.5, ver fondos-catalogo.mjs). --fondo-opacidad no tiene
   override por tema (solo --fondo-velo lo tiene), asi que esta reescritura le gana por orden
   de cascada en los dos temas sin necesitar !important; el velo de este veil va HORNEADO como
   numero fijo (no via --fondo-velo), asi que tampoco compite con el override de tema. */
.fondo-invertido{ background-color:var(--ink); --fondo-opacidad:0.9; }
.fondo-invertido::after{ background:
  linear-gradient(180deg, color-mix(in srgb, var(--ink) calc(0.65 * 100%), transparent) 0%, var(--ink) 100%); }

[data-fondo="remolino"]{ --fondo-img:var(--fondo-remolino); }
[data-fondo="corrientes"]{ --fondo-img:var(--fondo-corrientes); }
[data-fondo="trama"]{ --fondo-img:var(--fondo-trama); }
[data-fondo="rayado"]{ --fondo-img:var(--fondo-rayado); }
[data-fondo="recorte"]{ --fondo-img:var(--fondo-recorte); }
[data-fondo="amanecer"]{ --fondo-img:var(--fondo-amanecer); }
[data-fondo="pintura"]{ --fondo-img:var(--fondo-pintura); }
[data-fondo="espirales-milpa"]{ --fondo-img:var(--fondo-espirales-milpa); }
[data-fondo="trenza-milpa"]{ --fondo-img:var(--fondo-trenza-milpa); }
[data-fondo="cosecha"]{ --fondo-img:var(--fondo-cosecha); }
[data-fondo="gota-de-tinta"]{ --fondo-img:var(--fondo-gota-de-tinta); }

/* ---- Ilustraciones (pinturas figurativas) y aves: SIN velo, nunca bajo texto.
   Cada superficie decide su propio tamano/mascara y consume var(--ilus) / var(--ave). ---- */
[data-ilus="camaras"]{ --ilus:var(--ilus-camaras); }
[data-ilus="fotografo"]{ --ilus:var(--ilus-fotografo); }
[data-ilus="novios"]{ --ilus:var(--ilus-novios); }
[data-ilus="perritos"]{ --ilus:var(--ilus-perritos); }
[data-ilus="camaras-cubista"]{ --ilus:var(--ilus-camaras-cubista); }
[data-ilus="novios-cubista"]{ --ilus:var(--ilus-novios-cubista); }
[data-ilus="fotografo-cubista"]{ --ilus:var(--ilus-fotografo-cubista); }

[data-ave="posada"]{ --ave:var(--ave-posada); }
[data-ave="la-bandada"]{ --ave:var(--ave-la-bandada); }
[data-ave="con-sol"]{ --ave:var(--ave-con-sol); }
[data-ave="de-frente"]{ --ave:var(--ave-de-frente); }
[data-ave="la-pareja"]{ --ave:var(--ave-la-pareja); }
[data-ave="aterrizando"]{ --ave:var(--ave-aterrizando); }
[data-ave="cruzando-la-abertura"]{ --ave:var(--ave-cruzando-la-abertura); }

@media (prefers-reduced-data: reduce){
  .fondo::before{ background-image:none !important; }
  [data-ilus], [data-ave]{ background-image:none !important; }
}