.signal-target{position:relative;isolation:isolate;--signal-cyan:#79c2dc;--signal-violet:#a995d4}
.signal-target[data-signal=logo]{width:max-content;max-width:100%}
.signal-target .signal-base{position:relative;z-index:0}
/* The whole portrait is feathered, so shifted image layers cannot reveal a box. */
.signal-target[data-signal=portrait]{overflow:hidden;mask-image:var(--portrait-mask,radial-gradient(ellipse 60% 64% at 51% 44%,#000 40%,#000b 69%,transparent 99%));-webkit-mask-image:var(--portrait-mask,radial-gradient(ellipse 60% 64% at 51% 44%,#000 40%,#000b 69%,transparent 99%));mask-size:100% 100%;-webkit-mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-mode:alpha}
.signal-target[data-signal=portrait]>.signal-base{mask-image:none;-webkit-mask-image:none}
.signal-target[data-signal=portrait]:after{pointer-events:none;z-index:2;box-shadow:none;background:radial-gradient(ellipse at 53% 39%,transparent 36%,#0305072b 72%,#03050785 100%)}
.signal-trigger{position:absolute;inset:0;z-index:5;display:block;width:100%;height:100%;padding:0;margin:0;border:0;border-radius:0;background:transparent;cursor:pointer;pointer-events:auto;touch-action:manipulation}
.signal-target .signal-trigger:focus-visible{outline:1px solid #8fa7c36b;outline-offset:-5px}
.signal-target[data-signal=portrait] .signal-trigger:focus-visible{outline:none}
.signal-target[data-signal=portrait] .signal-trigger:focus-visible:after{content:'';position:absolute;inset:16%;border:1px solid #a4b6cf50;border-radius:25%;pointer-events:none}
.signal-slice{position:absolute;inset:0;display:block;pointer-events:none;z-index:3;opacity:0;overflow:hidden}
.signal-slice>img{width:100%!important;height:100%!important;max-width:none;object-fit:cover;display:block;pointer-events:none;user-select:none}
.signal-target[data-signal=portrait] .signal-slice{mix-blend-mode:screen}
.signal-target[data-signal=portrait] .signal-slice>img{filter:grayscale(1) brightness(.6) contrast(1.05);mask-image:none;-webkit-mask-image:none}
.signal-target[data-signal=portrait] .signal-slice--a{filter:drop-shadow(1px 0 1px #79c2dc50)}
.signal-target[data-signal=portrait] .signal-slice--b{filter:drop-shadow(-1px 0 1px #a995d450)}
/* Fixed alpha masks clip EVERY logo effect to the unshifted letter silhouettes. */
.signal-target[data-signal=logo] .signal-slice,.signal-target[data-signal=logo] .signal-dropout{inset:auto;mask-image:var(--signal-logo-mask);-webkit-mask-image:var(--signal-logo-mask);mask-size:100% 100%;-webkit-mask-size:100% 100%;mask-position:center;-webkit-mask-position:center;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-mode:alpha}
.signal-target[data-signal=logo] .signal-slice{mix-blend-mode:normal}
.signal-target[data-signal=logo] .signal-slice>img{object-fit:contain}
.signal-target[data-signal=logo] .signal-slice--a>img{filter:brightness(.56) sepia(.6) saturate(1.6) hue-rotate(135deg)}
.signal-target[data-signal=logo] .signal-slice--b>img{filter:brightness(.7) sepia(.45) saturate(1.5) hue-rotate(195deg)}
.signal-dropout{position:absolute;display:block;z-index:4;pointer-events:none;opacity:0;background-image:linear-gradient(to bottom,transparent 0 24%,#020408 24% 31%,transparent 31% 47%,#020408 47% 52%,transparent 52% 73%,#020408 73% 76%,transparent 76%);background-size:100% 100%;background-repeat:no-repeat}
.signal-active .signal-base{animation:signal-base-settle 1040ms ease-out both}
.signal-active .signal-slice{will-change:opacity,clip-path}
.signal-active .signal-slice--a{animation:signal-slice-a 1040ms ease-out both}
.signal-active .signal-slice--b{animation:signal-slice-b 1040ms ease-out both}
.signal-active .signal-slice>img{will-change:transform}
.signal-active .signal-slice--a>img{animation:signal-shift-a 1040ms ease-out both}
.signal-active .signal-slice--b>img{animation:signal-shift-b 1040ms ease-out both}
.signal-active .signal-dropout{animation:signal-internal-dropout 1040ms ease-out both}
.signal-target[data-signal=portrait].signal-active .signal-trigger{background:repeating-linear-gradient(to bottom,transparent 0,transparent 5px,#8fa6c009 6px,#8fa6c009 7px)}
@keyframes signal-base-settle{0%,100%{opacity:1}30%{opacity:.9}65%{opacity:.96}}
@keyframes signal-internal-dropout{0%,100%{opacity:0;background-position:0 0}12%{opacity:.96;background-position:0 3px}43%{opacity:.96;background-position:0 -2px}72%{opacity:.7;background-position:0 1px}90%{opacity:.18;background-position:0 0}}
@keyframes signal-slice-a{0%{opacity:0;clip-path:inset(22% 0 66% 0)}18%{opacity:.8;clip-path:inset(22% 0 66% 0)}46%{opacity:.66;clip-path:inset(45% 0 42% 0)}72%{opacity:.35;clip-path:inset(69% 0 23% 0)}100%{opacity:0;clip-path:inset(69% 0 23% 0)}}
@keyframes signal-slice-b{0%{opacity:0;clip-path:inset(61% 0 29% 0)}28%{opacity:.6;clip-path:inset(61% 0 29% 0)}57%{opacity:.48;clip-path:inset(36% 0 55% 0)}100%{opacity:0;clip-path:inset(36% 0 55% 0)}}
@keyframes signal-shift-a{0%,100%{transform:translateX(0)}18%{transform:translateX(5px)}46%{transform:translateX(-4px)}72%{transform:translateX(2px)}}
@keyframes signal-shift-b{0%,100%{transform:translateX(0)}28%{transform:translateX(-5px)}57%{transform:translateX(3px)}}
@media(max-width:700px){.signal-active .signal-slice--a>img{animation-name:signal-shift-mobile-a}.signal-active .signal-slice--b>img{animation-name:signal-shift-mobile-b}}
@keyframes signal-shift-mobile-a{0%,100%{transform:translateX(0)}22%{transform:translateX(3px)}54%{transform:translateX(-2px)}}
@keyframes signal-shift-mobile-b{0%,100%{transform:translateX(0)}30%{transform:translateX(-3px)}62%{transform:translateX(2px)}}
@media(prefers-reduced-motion:reduce){.signal-target .signal-base,.signal-target .signal-slice,.signal-target .signal-slice>img,.signal-target .signal-dropout{animation:none!important;transition:none!important}.signal-target .signal-slice,.signal-target .signal-dropout,.signal-target .signal-trigger{display:none!important}}