.magic-card{--glow-x:50%;--glow-y:50%;--glow-intensity:0;--glow-radius:300px;--glow-color:132,0,255;--magic-border-color:rgba(57,46,78,.6);--magic-ease:cubic-bezier(0.4,0,0.2,1);transition:box-shadow .3s var(--magic-ease),transform .3s var(--magic-ease);contain:layout;transform:translateZ(0);backface-visibility:hidden}:where(.magic-card){border-radius:.5rem}.magic-card--light,html:not(.dark) .magic-card{--magic-border-color:rgba(10,186,181,.25)}.magic-card:hover{transform:translateZ(0);box-shadow:0 8px 25px rgba(0,0,0,.08)}html.dark .magic-card:hover{box-shadow:0 4px 20px rgba(46,24,78,.2),0 0 30px rgba(var(--glow-color),.15)}html:not(.dark) .magic-card:hover{box-shadow:0 4px 20px rgba(10,186,181,.12),0 0 24px rgba(var(--glow-color),.08)}.magic-card-glow-wrap{position:relative;display:block;border-radius:inherit;overflow:hidden}.magic-card-glow-wrap:after{content:"";position:absolute;inset:0;padding:1px;background:radial-gradient(var(--glow-radius) circle at var(--glow-x) var(--glow-y),rgba(var(--glow-color),calc(var(--glow-intensity) * .6)) 0,rgba(var(--glow-color),calc(var(--glow-intensity) * .3)) 30%,transparent 60%);border-radius:inherit;box-sizing:border-box;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:1;transition:opacity .2s ease;z-index:1;clip-path:inset(0 0 1px 0)}.magic-card--light .magic-card-glow-wrap:after,html:not(.dark) .magic-card-glow-wrap:after{background:radial-gradient(var(--glow-radius) circle at var(--glow-x) var(--glow-y),rgba(var(--glow-color),calc(var(--glow-intensity) * .35)) 0,rgba(var(--glow-color),calc(var(--glow-intensity) * .15)) 40%,transparent 65%)}.magic-card-particle,.magic-card-ripple{will-change:transform,opacity}