/* Film-bay background: soft light leaks, sprocket rails, grain, vignette */
#bg{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
#bg .leak{position:absolute;border-radius:50%;filter:blur(90px);opacity:.28;will-change:transform}
#bg .l1{width:46vmax;height:46vmax;left:-14vmax;top:-10vmax;background:radial-gradient(circle,#e2a64a 0%,rgba(226,166,74,0) 68%);animation:leakA 26s ease-in-out infinite alternate}
#bg .l2{width:40vmax;height:40vmax;right:-12vmax;top:28vh;background:radial-gradient(circle,#4a78d8 0%,rgba(74,120,216,0) 68%);opacity:.2;animation:leakB 32s ease-in-out infinite alternate}
#bg .l3{width:36vmax;height:36vmax;left:22vw;bottom:-18vmax;background:radial-gradient(circle,#c4553a 0%,rgba(196,85,58,0) 68%);opacity:.18;animation:leakA 38s ease-in-out infinite alternate-reverse}
@keyframes leakA{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(6vw,5vh,0) scale(1.15)}}
@keyframes leakB{from{transform:translate3d(0,0,0) scale(1.05)}to{transform:translate3d(-7vw,-6vh,0) scale(.9)}}
#bg .rail{position:absolute;top:0;bottom:0;width:22px;opacity:.5;
  background:
    repeating-linear-gradient(to bottom,transparent 0 18px,rgba(236,234,228,.16) 18px 34px,transparent 34px 52px);
  background-size:10px 52px;background-repeat:repeat-y;background-position:6px 0}
#bg .rl{left:6px}
#bg .rr{right:6px}
#bg .grain{position:absolute;inset:-50%;opacity:.07;mix-blend-mode:screen;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  animation:grain 1.1s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}
#bg .vig{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,rgba(0,0,0,0) 55%,rgba(0,0,0,.55) 100%)}
@media (max-width:700px){#bg .rail{display:none}}
@media (prefers-reduced-motion:reduce){#bg .leak,#bg .grain{animation:none}}