/* Site-wide glow: a faint, slow red light drifts behind every page, seen through fluted frosted glass.
   Markup: <div class="frame-glow" aria-hidden="true"><i></i><i></i></div> as the first child of <body>. */
.frame-glow{position:fixed;inset:0;overflow:hidden;z-index:15;pointer-events:none;mix-blend-mode:screen}
.frame-glow i{position:absolute;width:60%;height:80vh;border-radius:var(--r-round);opacity:.3;filter:blur(6px);
  background:radial-gradient(closest-side,var(--page-glow-1) 0,var(--page-glow-2) 45%,var(--page-glow-3) 75%,transparent 100%);
  -webkit-mask-image:var(--mask-flute-glow);
  mask-image:var(--mask-flute-glow)}
.frame-glow i:first-child{inset-inline-start:-10%;top:0;animation:fg-a 24s ease-in-out infinite alternate}
.frame-glow i:last-child{inset-inline-end:-15%;top:45vh;width:50%;opacity:.22;animation:fg-b 30s ease-in-out infinite alternate}
@keyframes fg-a{0%{transform:translate(0,0) scale(1)}50%{transform:translate(-18%,12vh) scale(1.08)}100%{transform:translate(-36%,4vh) scale(.98)}}
@keyframes fg-b{0%{transform:translate(0,0) scale(1.05)}50%{transform:translate(20%,-10vh) scale(.96)}100%{transform:translate(40%,2vh) scale(1.08)}}
@media (prefers-reduced-motion:reduce){.frame-glow i{animation:none!important}}
@media print{.frame-glow{display:none!important}}
