/* ===== Rejected hub moving background (rfx.css + rfx.js) =====
   Slow drifting blood-red glows, a faint scanline flicker now and then, and Rejected words fading in and out.
   TUNE INTENSITY: change --rfx-intensity (1 = as designed, 0.6 = softer, 1.5 = stronger, 0 = off).
   Word list, counts and timings are at the top of rfx.js.
   How it sits: a fixed layer under the header with mix-blend-mode:screen. Screen can only lighten,
   so white/red text is untouched and the glow and words show up in the dark areas, which reads as "behind". */
:root{--rfx-intensity:1}
#rfx{position:fixed;inset:0;z-index:40;pointer-events:none;overflow:hidden;contain:strict;
  mix-blend-mode:screen;opacity:var(--rfx-intensity)}
#rfx *{pointer-events:none}

/* drifting glows */
#rfx .rg{position:absolute;border-radius:50%;width:var(--s,520px);height:var(--s,520px);
  background:radial-gradient(circle,rgba(var(--c,177,20,25),var(--a,.30)) 0%,rgba(var(--c,177,20,25),0) 66%);
  will-change:transform,opacity;
  animation:rg-drift var(--dur,38s) ease-in-out var(--delay,0s) infinite alternate,
            rg-breathe var(--bdur,11s) ease-in-out var(--delay,0s) infinite alternate}
@keyframes rg-drift{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(var(--dx,18vw),var(--dy,12vh),0) scale(1.18)}}
@keyframes rg-breathe{from{opacity:.45}to{opacity:1}}

/* Rejected words */
#rfx .rw{position:absolute;white-space:nowrap;color:#f4f1ec;opacity:0;line-height:1;will-change:opacity,transform;
  animation:rw-fade var(--dur,10s) ease-in-out var(--delay,0s) 1 both}
#rfx .rw.f-anton{font-family:'Anton',sans-serif;letter-spacing:.04em;text-transform:uppercase}
#rfx .rw.f-type{font-family:'Special Elite',ui-monospace,monospace;letter-spacing:.28em;text-transform:uppercase}
#rfx .rw.f-hand{font-family:'Rock Salt',cursive}
#rfx .rw.red{color:#b11419}
@keyframes rw-fade{0%{opacity:0;transform:translate3d(0,0,0) rotate(var(--r,0deg))}
  50%{opacity:var(--pk,.1)}
  100%{opacity:0;transform:translate3d(var(--dx,0px),var(--dy,0px),0) rotate(var(--r,0deg))}}

/* scanline patch + glitch flicker band */
#rfx .rs{position:absolute;left:0;right:0;height:22vh;top:var(--y,40%);opacity:0;
  background:repeating-linear-gradient(0deg,rgba(244,241,236,.5) 0 1px,transparent 1px 4px);
  -webkit-mask:linear-gradient(transparent,#000 35%,#000 65%,transparent);mask:linear-gradient(transparent,#000 35%,#000 65%,transparent);
  animation:rs-sweep var(--dur,16s) ease-in-out var(--delay,0s) infinite}
@keyframes rs-sweep{0%,100%{opacity:0;transform:translateY(-6vh)}50%{opacity:var(--pk,.06);transform:translateY(6vh)}}
#rfx .rf{position:absolute;left:0;right:0;top:var(--y,50%);height:var(--h,10px);opacity:0;
  background:linear-gradient(rgba(177,20,25,.55) 0 50%,rgba(45,226,230,.35) 50% 100%);transform:translateX(var(--x,0px))}
#rfx .rf.on{opacity:var(--pk,.35)}

/* phones: smaller glows, fewer words (count set in rfx.js) */
@media (max-width:760px){
  #rfx .rg{width:calc(var(--s,520px)*.6);height:calc(var(--s,520px)*.6)}
  #rfx .rw.f-anton{font-size:calc(var(--fs,60px)*.6) !important}
  #rfx .rw.f-type,#rfx .rw.f-hand{font-size:calc(var(--fs,20px)*.8) !important}
}
/* reduced motion: still glows and a few faint still words, no flicker */
@media (prefers-reduced-motion:reduce){
  #rfx .rg,#rfx .rw,#rfx .rs{animation:none !important}
  #rfx .rg{opacity:.6}
  #rfx .rw{opacity:calc(var(--pk,.1)*.6);transform:rotate(var(--r,0deg))}
  #rfx .rs,#rfx .rf{display:none}
}