.soft-aurora-container{width:100%;height:100%}.floating-lines-container{width:100%;height:100%;position:relative;overflow:hidden}.side-rays-container{pointer-events:none;z-index:3;width:100%;height:100%;position:relative;overflow:hidden}.ferrofluid-container{width:100%;height:100%;position:relative;overflow:hidden}
/*$vite$:1*/
/* ── Reduced-motion fallback (2026-08-28) ────────────────────────────────────
   The animated background is the real one and is what everybody sees. But
   assets/js/rb-bg.js is 778 KB of React + Three.js, and its own
   prefers-reduced-motion check sits INSIDE the bundle — so a visitor who had
   asked their device for less motion used to download all of it and then have
   it switch itself off.

   The loader in each page now checks that media query BEFORE fetching the
   script, so those visitors download nothing at all. This static wash is what
   they get instead of a blank white page. Its colours were sampled from the
   shader's own output, so it is the same wash, just not moving.

   Scoped to the media query on purpose: for everyone else the canvas paints
   and this must not sit underneath it. */
@media (prefers-reduced-motion: reduce){
  #rb-bg{
    opacity:1;
    background:
      radial-gradient( 46%  8% at 16% 55%, rgba( 87,209,153,0.45) 0%, rgba( 87,209,153,0) 100%),
      radial-gradient( 34%  7% at 50% 56%, rgba( 94,178,169,0.33) 0%, rgba( 94,178,169,0) 100%),
      radial-gradient( 46%  8% at 84% 54%, rgba( 99,160,181,0.43) 0%, rgba( 99,160,181,0) 100%),
      radial-gradient(100% 30% at 50% 56%, rgba(130,196,178,0.13) 0%, rgba(130,196,178,0) 100%),
      #FFFFFF;
  }
}
