html.gpof-active body{
  filter:sepia(var(--gpof-sepia-amount,0));
  -webkit-filter:sepia(var(--gpof-sepia-amount,0));
}
#gpof-film{
  position:fixed;
  top:0;right:0;bottom:0;left:0;
  z-index:2147483000;
  pointer-events:none;
  overflow:hidden;
  isolation:isolate;
  -webkit-transform:translateZ(0);
  transform:translateZ(0);
}
#gpof-film>*{pointer-events:none}

/* Fallback universale: resta visibile anche se clip-path/blend/canvas non vengono renderizzati */
.gpof-beam-fallback{
  position:absolute;
  top:0;right:0;bottom:0;left:0;
  background:
    radial-gradient(ellipse 90% 105% at 50% -8%,
      rgba(255,248,218,.24) 0%,
      rgba(255,226,154,.14) 28%,
      rgba(225,168,80,.07) 58%,
      rgba(0,0,0,0) 82%);
  opacity:var(--gpof-beam-main,.5);
}

/* Fascio principale */
.gpof-beam{
  position:absolute;
  top:-18vh;
  left:50%;
  width:145vw;
  height:142vh;
  -webkit-transform-origin:50% 0;
  transform-origin:50% 0;
  -webkit-clip-path:polygon(46% 0,54% 0,100% 100%,0 100%);
  clip-path:polygon(46% 0,54% 0,100% 100%,0 100%);
  background:
    radial-gradient(ellipse at 50% 5%,
      rgba(255,247,211,.34) 0%,
      rgba(255,226,151,.16) 22%,
      rgba(223,166,73,.075) 52%,
      rgba(0,0,0,0) 76%);
  opacity:var(--gpof-beam-main,.5);
  mix-blend-mode:screen;
  -webkit-filter:blur(8px);
  filter:blur(8px);
  -webkit-animation:gpofBeam 6.5s ease-in-out infinite alternate;
  animation:gpofBeam 6.5s ease-in-out infinite alternate;
  will-change:transform;
}
.gpof-beam-a{
  -webkit-transform:translateX(-50%) rotate(-1.2deg);
  transform:translateX(-50%) rotate(-1.2deg);
}
.gpof-beam-b{
  width:175vw;
  opacity:var(--gpof-beam-soft,.22);
  -webkit-filter:blur(26px);
  filter:blur(26px);
  -webkit-animation-duration:9s;
  animation-duration:9s;
}

.gpof-light-pulse{
  position:absolute;
  top:0;right:0;bottom:0;left:0;
  background:rgba(255,229,170,.055);
  mix-blend-mode:screen;
  opacity:var(--gpof-flicker-a,.04);
  -webkit-animation:gpofPulse .21s steps(1,end) infinite;
  animation:gpofPulse .21s steps(1,end) infinite;
}
#gpof-dust,#gpof-grain{
  position:absolute;
  top:0;right:0;bottom:0;left:0;
  width:100%;
  height:100%;
}
#gpof-dust{opacity:var(--gpof-dust-opacity,.45);mix-blend-mode:screen}
#gpof-grain{
  opacity:var(--gpof-grain-opacity,.03);
  mix-blend-mode:soft-light;
  image-rendering:pixelated;
}
.gpof-scratches{
  position:absolute;
  top:-10%;right:-10%;bottom:-10%;left:-10%;
  opacity:var(--gpof-scratch-opacity,.05);
  background:repeating-linear-gradient(
    90deg,
    transparent 0 13%,
    rgba(255,246,218,.12) 13.05% 13.10%,
    transparent 13.16% 29%
  );
  -webkit-animation:gpofScratch .8s steps(2,end) infinite;
  animation:gpofScratch .8s steps(2,end) infinite;
}
.gpof-vignette{
  position:absolute;
  top:0;right:0;bottom:0;left:0;
  opacity:var(--gpof-vignette-opacity,.28);
  background:radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.12) 75%,rgba(0,0,0,.64) 100%);
  mix-blend-mode:multiply;
}

@-webkit-keyframes gpofBeam{
  0%{-webkit-transform:translateX(-50%) rotate(var(--gpof-rot-left,-1.5deg)) scaleX(.96)}
  50%{-webkit-transform:translateX(-50%) rotate(.2deg) scaleX(1.035)}
  100%{-webkit-transform:translateX(-50%) rotate(var(--gpof-rot-right,1.2deg)) scaleX(.98)}
}
@keyframes gpofBeam{
  0%{transform:translateX(-50%) rotate(var(--gpof-rot-left,-1.5deg)) scaleX(.96)}
  50%{transform:translateX(-50%) rotate(.2deg) scaleX(1.035)}
  100%{transform:translateX(-50%) rotate(var(--gpof-rot-right,1.2deg)) scaleX(.98)}
}
@-webkit-keyframes gpofPulse{
  0%,100%{opacity:var(--gpof-flicker-a,.04)}
  35%{opacity:var(--gpof-flicker-b,.10)}
  52%{opacity:var(--gpof-flicker-c,.02)}
}
@keyframes gpofPulse{
  0%,100%{opacity:var(--gpof-flicker-a,.04)}
  35%{opacity:var(--gpof-flicker-b,.10)}
  52%{opacity:var(--gpof-flicker-c,.02)}
}
@-webkit-keyframes gpofScratch{
  0%{-webkit-transform:translateX(-1%)}
  50%{-webkit-transform:translateX(.6%)}
  100%{-webkit-transform:translateX(1.2%)}
}
@keyframes gpofScratch{
  0%{transform:translateX(-1%)}
  50%{transform:translateX(.6%)}
  100%{transform:translateX(1.2%)}
}

/* Mobile: fascio volutamente più evidente e meno pesante da renderizzare */
@media(max-width:767px){
  .gpof-beam{width:190vw;height:135vh;top:-12vh;-webkit-filter:blur(5px);filter:blur(5px)}
  .gpof-beam-b{width:220vw;-webkit-filter:blur(18px);filter:blur(18px)}
  .gpof-beam-fallback{
    background:
      radial-gradient(ellipse 130% 110% at 50% -4%,
        rgba(255,248,218,.30) 0%,
        rgba(255,226,154,.16) 32%,
        rgba(225,168,80,.08) 62%,
        rgba(0,0,0,0) 86%);
  }
}

/* Se il browser gestisce male i blend mode, il fallback continua comunque a funzionare */
@supports not (mix-blend-mode:screen){
  .gpof-beam,.gpof-light-pulse,#gpof-dust,#gpof-grain{mix-blend-mode:normal}
  .gpof-vignette{mix-blend-mode:normal}
}

@media(prefers-reduced-motion:reduce){
  .gpof-beam,.gpof-light-pulse,.gpof-scratches{
    -webkit-animation:none!important;
    animation:none!important;
  }
}