/* Still compositions also serve WebGL-disabled and context-loss fallbacks. */
.signal-art{position:relative;isolation:isolate;overflow:hidden;pointer-events:none;contain:paint;background:#060b0d}
.signal-art[hidden]{display:none!important}
.signal-art::before,.signal-art::after{content:"";position:absolute;inset:0;pointer-events:none}
.signal-art[data-signal-art=aurora]::before{background:radial-gradient(ellipse 80% 9% at 25% 53%,#49838188,transparent 75%),radial-gradient(ellipse 90% 5% at 60% 64%,#756bf0aa,transparent 75%),radial-gradient(ellipse 65% 10% at 82% 67%,#61dcb690,transparent 65%),#060b0d}
.signal-art[data-signal-art=aurora]::after{background:linear-gradient(#060b0d 3%,transparent 30%,transparent 80%,#060b0d)}
.signal-art[data-signal-art=silk]{background:#f1f3ef}
.signal-art[data-signal-art=silk]::before{background:linear-gradient(113deg,#f1f3ef 10%,#d9e5e7 22%,#f7f9f7 25%,#bbd2e1 31%,#fbfdfa 33%,#9ebada 42%,#fafdfa 44%,#6f9bbc 51%,#e8f1f3 54%,#bacfe4 60%,#fcfffc 62%,#f1f3ef 80%)}
.signal-art[data-signal-art=silk]::after{background:linear-gradient(90deg,#f1f3ef,transparent 30%,transparent 75%,#f1f3ef)}
.signal-art[data-signal-art=ember]{background:#120f0f}
.signal-art[data-signal-art=ember]::before{inset:60% -12% -70%;border-radius:50% 50% 0 0;border-top:2px solid #da946b;background:linear-gradient(#632c1970,transparent 30%);box-shadow:0 -12px 40px -18px #fbaf63,0 -2px 12px -4px #f0ab71}
.signal-art[data-signal-art=ember]::after{background:linear-gradient(90deg,#120f0f,transparent 23%,transparent 77%,#120f0f)}
.signal-art[data-signal-place=footer][data-signal-art=aurora]::before{transform:translateY(14%)}
.signal-art[data-signal-place=footer][data-signal-art=ember]::before{top:73%}
.signal-art canvas{position:absolute;inset:0;display:block;width:100%;height:100%;opacity:0;z-index:1;transition:opacity .25s ease}
.signal-art[data-signal-ready=true] canvas{opacity:1}
@media(prefers-reduced-motion:reduce){.signal-art canvas{transition:none}}
html[data-art=false] .signal-art{display:none}
/* Page-colour fallbacks for the richer light studies. The canvas renders over
   these only after its first complete frame, so loading never starts blank. */
.signal-art:is([data-signal-art=fluid],[data-signal-art=caustic],[data-signal-art=prism]){background:var(--paper,#080e12)}
.signal-art[data-signal-art=fluid]::before{background:radial-gradient(ellipse 75% 22% at 55% 48%,color-mix(in srgb,var(--signal-a,#75e4c1) 68%,transparent),transparent 85%),radial-gradient(ellipse 65% 30% at 42% 65%,color-mix(in srgb,var(--signal-b,#136e76) 80%,transparent),transparent 80%),var(--paper,#080e12)}
.signal-art[data-signal-art=caustic]::before{background:radial-gradient(ellipse 60% 36% at 63% 60%,#ffffffc9,transparent 85%),radial-gradient(ellipse 55% 35% at 35% 37%,color-mix(in srgb,var(--signal-a,#9fc8d6) 60%,transparent),transparent 80%),radial-gradient(ellipse 35% 55% at 81% 66%,color-mix(in srgb,var(--signal-b,#719aae) 30%,transparent),transparent 85%),var(--paper,#f0f2ed)}
.signal-art[data-signal-art=prism]::before{background:radial-gradient(ellipse 70% 18% at 48% 40%,#8155c89c,transparent 80%),radial-gradient(ellipse 70% 14% at 64% 55%,color-mix(in srgb,var(--signal-a,#70d7ee) 60%,transparent),transparent 85%),radial-gradient(ellipse 60% 20% at 38% 62%,color-mix(in srgb,var(--signal-b,#806be9) 65%,transparent),transparent 85%),var(--paper,#080e12)}
.signal-art:is([data-signal-art=fluid],[data-signal-art=caustic],[data-signal-art=prism])::after{background:linear-gradient(var(--paper,#080e12),transparent 18%,transparent 80%,var(--paper,#080e12))}
