/* Signal slips stay inside the surface that triggered them. */
.signal-artifact { position: absolute; inset: 0; pointer-events: none; z-index: 9; }
.project-preview-image img.signal-tear { inset: auto; clip-path: inset(39% 0 49% 0); animation: signal-tear 100ms steps(1, end) both; }
@keyframes signal-tear {
  0% { translate: 6px 0; }
  45% { translate: -4px 0; }
  80% { translate: 2px 0; }
  100% { translate: 0 0; }
}
.signal-noise { overflow: hidden; opacity: .07; background: repeating-conic-gradient(#dce2cf 0% 25%, transparent 0% 50%) 0 0 / 3px 2px; animation: signal-noise 110ms steps(2, end) both; }
@keyframes signal-noise { to { background-position: 3px 5px; } }
.signal-sync { overflow: hidden; animation: signal-lifetime 110ms step-end both; }
.signal-sync::after { content: ''; position: absolute; left: 0; right: 0; top: 40%; height: 1px; background: #d8e4d64d; animation: signal-scan 110ms steps(2, end) both; }
@keyframes signal-scan { to { top: 65%; } }
.window-titlebar { position: relative; }
.signal-rgb { overflow: hidden; box-shadow: inset 2px 0 #db768c99, inset -2px 0 #7ebfc699; animation: signal-lifetime 90ms step-end both; }
.signal-rgb::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #db768c15, transparent 40%, #7ebfc615); }
.window-titlebar:has(> .signal-rgb) > .window-title { text-shadow: 2px 0 #db768cbb, -2px 0 #7ebfc6bb; }
@keyframes signal-lifetime { to { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .signal-artifact { display: none !important; animation: none !important; }
}