.wmi-card-fx-surface { position:absolute; inset:0; z-index:10; border-radius:inherit; overflow:hidden; pointer-events:none; opacity:0; transition:opacity .2s; background:radial-gradient(circle at var(--fx-x,50%) var(--fx-y,50%),#fff0c74d,transparent 35%); mix-blend-mode:screen; }
.wmi-card-fx.is-fx-active > .wmi-card-fx-surface { opacity:var(--wmi-card-hover-alpha,.65); }
.wmi-card-fx-surface i { position:absolute; left:var(--fx-x,50%); top:var(--fx-y,50%); width:var(--spark-size); height:var(--spark-size); background:#ffe9b7; border-radius:50%; opacity:0; font-size:0; font-style:normal; clip-path:none; box-shadow:0 0 7px #f6c270; }
.wmi-card-fx.is-fx-active[data-hover-effect=stardust] .wmi-card-fx-surface i { animation:wmi-fx-stars 2s ease-out var(--spark-delay) infinite; clip-path:polygon(50% 0,62% 37%,100% 50%,62% 63%,50% 100%,38% 63%,0 50%,38% 37%); width:calc(var(--spark-size) + 3px); height:calc(var(--spark-size) + 3px); }
.wmi-card-fx.is-fx-active[data-hover-effect=orbit] .wmi-card-fx-surface i { animation:wmi-fx-orbit 3.6s linear var(--spark-delay) infinite; }
.wmi-card-fx.is-fx-active[data-hover-effect=comet] .wmi-card-fx-surface i { width:calc(var(--spark-size) * 6); height:2px; border-radius:50%; background:linear-gradient(90deg,transparent,#eabc73,#fff8e0); animation:wmi-fx-comet 1.4s ease-out var(--spark-delay) infinite; }
.wmi-card-fx.is-fx-active[data-hover-effect=runes] .wmi-card-fx-surface i { left:var(--spark-x); top:var(--spark-y); width:20px; height:22px; font-size:calc(11px + var(--spark-size)); color:#ffe0a1; background:none; border-radius:0; box-shadow:none; text-shadow:0 0 8px #e3b06a; animation:wmi-fx-runes 2.8s ease-out var(--spark-delay) infinite; }
.wmi-card-fx.is-fx-active[data-hover-effect=embers] .wmi-card-fx-surface i { background:#ffcf8b; box-shadow:0 0 6px #ee9253,0 0 12px #e86942; animation:wmi-fx-embers 1.7s ease-out var(--spark-delay) infinite; }
.wmi-card-fx[data-hover-effect=foil] .wmi-card-fx-surface { background:radial-gradient(circle at var(--fx-x,50%) var(--fx-y,50%),#fff0c778,transparent 30%),linear-gradient(115deg,transparent 28%,#eac37966 50%,transparent 61%); }
.wmi-card-fx[data-hover-effect=off] .wmi-card-fx-surface { display:none; }
@keyframes wmi-fx-stars { 0%{opacity:0;transform:translate(0,10px) scale(.2)} 18%{opacity:1} 100%{opacity:0;transform:translate(var(--spark-dx),calc(var(--spark-dy) - 65px)) scale(.15)} }
@keyframes wmi-fx-orbit { 0%{opacity:.15;transform:rotate(var(--spark-angle)) translateX(var(--spark-radius)) scale(.3)} 40%{opacity:1} 100%{opacity:.15;transform:rotate(calc(var(--spark-angle) + 360deg)) translateX(var(--spark-radius)) scale(.3)} }
@keyframes wmi-fx-comet { 0%{opacity:0;transform:translate(calc(var(--spark-dx) * -.25),calc(var(--spark-dy) * -.25)) rotate(-35deg) scaleX(.1)} 15%{opacity:1} 100%{opacity:0;transform:translate(calc(var(--spark-dx) - 75px),calc(var(--spark-dy) + 65px)) rotate(-35deg) scaleX(.1)} }
@keyframes wmi-fx-runes { 0%{opacity:0;transform:translateY(18px) rotate(-15deg) scale(.6)} 30%{opacity:.9} 100%{opacity:0;transform:translateY(-55px) rotate(25deg) scale(1.1)} }
@keyframes wmi-fx-embers { 0%{opacity:0;transform:translate(0,0) scale(.5)} 10%{opacity:1} 100%{opacity:0;transform:translate(var(--spark-dx),calc(var(--spark-dy) + 60px)) scale(.1)} }
.wmi-card-fx[data-fx-motion=off] .wmi-card-fx-surface i { animation:none !important; }
@media(prefers-reduced-motion:reduce){.wmi-card-fx-surface i{animation:none!important}.wmi-card-fx-surface{transition:none}}