/* Fixed phosphor texture and subtle brightness flicker on the glass. */
.crt-on .machine>.screen::after{
  opacity:1;
  background:
    repeating-linear-gradient(0deg,#0000 0px,#0000 1px,#0005 1px,#0005 2px,#ffffff06 2px,#ffffff06 3px),
    repeating-linear-gradient(90deg,#ff38380b 0px,#ff38380b 1px,#76ff5307 1px,#76ff5307 2px,#588aff13 2px,#588aff13 3px);
  box-shadow:inset 0 0 45px #0004;
}
.crt-on .machine>.screen::before{
  content:'';position:absolute;inset:0;z-index:12;border-radius:inherit;
  pointer-events:none;background:#000;opacity:.03;
  animation:crt-flicker 1.7s steps(1,end) infinite;
}
.crt-on .screen-picture{
  text-shadow:.6px 0 #ff5a5a35,-.6px 0 #65dfff55,0 0 2px #a5e9ff30;
}
.crt-on .screen-picture :is(h1,h2,h3,.welcome-header nav,.enter-button,.readme-link){
  text-shadow:.7px 0 #ff595930,-.7px 0 #6ddfff55,0 0 2px currentColor;
}
.crt-on .site-logo{image-rendering:pixelated}
@keyframes crt-flicker{
  0%,100%{opacity:.015}7%{opacity:.043}12%{opacity:.023}19%{opacity:.05}
  23%{opacity:.027}31%{opacity:.037}39%{opacity:.015}43%{opacity:.047}
  48%{opacity:.02}56%{opacity:.033}64%{opacity:.05}69%{opacity:.023}
  78%{opacity:.04}83%{opacity:.02}91%{opacity:.037}96%{opacity:.027}
}
@media(prefers-reduced-motion:reduce){
  .crt-on .machine>.screen::before{animation:none;opacity:.023}
}

/* The glass stays powered during every picture transition. */
html[data-crt-phase] .crt-on .machine>.screen::after{opacity:1;animation:none;transition:none}
