
.crt-signal-defs{position:absolute;overflow:hidden;pointer-events:none}
.crt-picture{position:absolute;inset:0;z-index:1;pointer-events:none;animation:crt-picture-lock 1320ms step-end both;transform-origin:50% 47%}
.crt-acquire-line{position:absolute;z-index:2;left:0;right:0;top:50%;height:2px;background:#aaca9f;box-shadow:0 0 5px #8fd46b70;pointer-events:none;animation:crt-acquire 660ms step-end both}
.crt-signal-sweep{position:absolute;z-index:2;left:0;right:0;top:0;height:28vh;pointer-events:none;background:linear-gradient(to bottom,transparent 0%,#91b59806 20%,#91b59816 43%,#aaca9f45 49%,#b9d2b570 50%,#91b59822 52%,#91b59808 73%,transparent 100%);animation:crt-roll 1060ms steps(22,end) both}
.crt-tracking-noise{position:absolute;z-index:3;left:0;right:0;top:0;height:20px;pointer-events:none;background:url('/assets/crt-signal-noise.svg') repeat-x;background-size:1200px 20px;mask-image:linear-gradient(to bottom,transparent,#000 20%,#000 80%,transparent);mix-blend-mode:screen;animation:crt-tracking 1600ms step-end both}
.crt-signal-ghost{position:absolute;inset:0;pointer-events:none;overflow:hidden;mix-blend-mode:screen;opacity:0}
.crt-signal-ghost .crt-terminal{filter:none;text-shadow:2px 0 #9dbf8c90,-2px 0 #9dbf8c60}
.crt-signal-ghost-a{animation:crt-tear-a 1600ms step-end both}
.crt-signal-ghost-b{animation:crt-tear-b 1320ms step-end both}

@keyframes crt-acquire{
  0%,8%{opacity:0;transform:scaleX(.7)}
  9%,24%{opacity:.65;transform:scaleX(1)}
  25%,43%{opacity:.4;transform:translateY(-3px)}
  44%,64%{opacity:.55;transform:translateY(4px)}
  65%,100%{opacity:0;transform:none}
}
@keyframes crt-roll{
  0%,12%{opacity:0;transform:translateY(-30vh)}
  13%{opacity:.75;transform:translateY(-26vh)}
  74%{opacity:.75;transform:translateY(74vh)}
  91%{opacity:.3;transform:translateY(98vh)}
  100%{opacity:0;transform:translateY(105vh)}
}
@keyframes crt-picture-lock{
  0%,11%{filter:url('#crt-detune-strong');transform:translate(8px,3px) skewX(-.8deg)}
  12%,23%{filter:url('#crt-detune-strong');transform:translate(-11px,-3px) skewX(.6deg)}
  24%,35%{filter:url('#crt-detune-strong');transform:translate(7px,2px) skewX(-.4deg)}
  36%,48%{filter:url('#crt-detune-soft');transform:translate(-5px,-1px)}
  49%,63%{filter:none;transform:translate(2px,0)}
  64%,74%{filter:url('#crt-detune-soft');transform:translate(-3px,0)}
  75%,100%{filter:none;transform:none}
}
@keyframes crt-tear-a{
  0%,17%{opacity:0;clip-path:inset(0 0 100% 0);transform:none}
  18%,24%{opacity:.7;clip-path:inset(28% 0 65% 0);transform:translateX(27px)}
  25%,33%{opacity:.6;clip-path:inset(39% 0 53% 0);transform:translateX(-22px)}
  34%,43%{opacity:.5;clip-path:inset(49% 0 44% 0);transform:translateX(17px)}
  44%,55%{opacity:0;transform:none}
  56%,61%{opacity:.35;clip-path:inset(45% 0 51% 0);transform:translateX(-13px)}
  62%,80%{opacity:0;transform:none}
  81%,85%{opacity:.25;clip-path:inset(52% 0 45% 0);transform:translateX(8px)}
  86%,100%{opacity:0;transform:none}
}
@keyframes crt-tear-b{
  0%,25%{opacity:0;clip-path:inset(0 0 100% 0);transform:none}
  26%,37%{opacity:.45;clip-path:inset(31% 0 65% 0);transform:translateX(-32px)}
  38%,47%{opacity:.35;clip-path:inset(43% 0 51% 0);transform:translateX(25px)}
  48%,59%{opacity:0;transform:none}
  60%,67%{opacity:.3;clip-path:inset(56% 0 40% 0);transform:translateX(-12px)}
  68%,100%{opacity:0;transform:none}
}
@keyframes crt-tracking{
  0%,17%{opacity:0;transform:translateY(0)}
  18%,23%{opacity:.45;transform:translateY(24vh);background-position:0 0}
  24%,31%{opacity:.3;transform:translateY(39vh);background-position:-173px 0}
  32%,39%{opacity:.5;transform:translateY(46vh);background-position:287px 0}
  40%,50%{opacity:.25;transform:translateY(62vh);background-position:-431px 0}
  51%,68%{opacity:0;transform:translateY(82vh)}
  69%,73%{opacity:.2;transform:translateY(54vh);background-position:139px 0}
  74%,100%{opacity:0;transform:translateY(105vh)}
}
@media(max-width:760px){.crt-picture{transform-origin:50% 45%}}
@media(prefers-reduced-motion:reduce){.crt-picture,.crt-signal-ghost,.crt-acquire-line,.crt-signal-sweep,.crt-tracking-noise{animation:none!important;filter:none!important;transform:none!important}.crt-signal-ghost,.crt-acquire-line,.crt-signal-sweep,.crt-tracking-noise{display:none!important}}
