@property --angle{syntax:"<angle>";inherits:false;initial-value:0deg}.card{background:#fff;border-radius:10px;padding:1px;position:relative}.card:before,.card:after{content:"";z-index:-1;background:#e8e8e9;border-radius:10px;transition:opacity .3s;position:absolute;inset:-1px}.card:hover:before,.card:hover:after,.card.featured:before,.card.featured:after{background:conic-gradient(from var(--angle),#3b82f6,#2dd4bf,#4f46e5,#3b82f6);animation:2s linear infinite spin}.card:before{filter:blur(1.5rem);opacity:0}.card:hover:before,.card.featured:before{opacity:.4}@keyframes spin{0%{--angle:0deg}to{--angle:360deg}}@supports (background:conic-gradient(#000, #000)){.card:before,.card:after{transition:opacity .3s,background .3s}}