<!doctype html>
<html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
<style>
*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;overflow:hidden;background:#0f0f10;font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.stage{position:absolute;inset:0;display:grid;place-items:center;container-type:size}
.g{position:relative;font-weight:900;font-size:16cqw;color:#f5efe6;letter-spacing:-.04em}
.g::before,.g::after{content:attr(data-t);position:absolute;inset:0}
.g::before{color:#22d3ee;mix-blend-mode:screen;animation:g1 2.5s steps(1) infinite}
.g::after{color:#f0abfc;mix-blend-mode:screen;animation:g2 2.5s steps(1) infinite}
@keyframes g1{0%,20%,26%,60%,64%,100%{clip-path:inset(0 0 100% 0);transform:none}21%{clip-path:inset(20% 0 55% 0);transform:translate(-.8cqw)}23%{clip-path:inset(60% 0 10% 0);transform:translate(.6cqw)}61%{clip-path:inset(40% 0 30% 0);transform:translate(-.5cqw)}}
@keyframes g2{0%,21%,27%,61%,65%,100%{clip-path:inset(0 0 100% 0);transform:none}22%{clip-path:inset(70% 0 5% 0);transform:translate(.8cqw)}24%{clip-path:inset(10% 0 70% 0);transform:translate(-.6cqw)}62%{clip-path:inset(30% 0 45% 0);transform:translate(.5cqw)}}
</style></head>
<body><div class="stage"><div class="g" data-t="SIGNAL">SIGNAL</div></div></body></html>