@layer components{.particles-stage{grid-template-columns:[fullbleed-start]3rem[main-start]1fr[main-end]3rem[fullbleed-end];grid-auto-rows:min-content;margin:0;display:grid}.particles-stage>*{grid-column:fullbleed}}@property --animation-tick{syntax:"<number>";inherits:false;initial-value:0}@property --ring-radius{syntax:"<number>|auto";inherits:false;initial-value:auto}@property --ring-x{syntax:"<number>";inherits:false;initial-value:50}@property --ring-y{syntax:"<number>";inherits:false;initial-value:50}@property --ring-interactive{syntax:"<number>";inherits:false;initial-value:0}@supports (background:paint(something)){@keyframes ripple{0%{--animation-tick:0}to{--animation-tick:1}}@keyframes ring{0%{--ring-radius:150}to{--ring-radius:250}}.particles-welcome{--ring-radius:100;--ring-thickness:600;--particle-count:80;--particle-rows:25;--particle-size:2;--particle-color:#7d9cbb;--particle-min-alpha:.1;--particle-max-alpha:1;--seed:200;background-image:paint(ring-particles);transition:--ring-x 3s,--ring-y 3s;animation:6s linear infinite ripple,6s ease-in-out infinite alternate ring}}
