/* Per-element spell projectiles + impacts (muted palette, soft glows, no hard lines). */
.ktk-bolt.se>span:not(.se-x){display:none!important}
.ktk-bolt.se{overflow:visible}
.se-x{position:absolute;pointer-events:none;top:50%;right:0}
/* head */
.se-head{width:26px;height:26px;margin:-13px 0 0;border-radius:50%;z-index:3}
.se-p{position:absolute;top:50%;border-radius:50%;opacity:0;will-change:transform,opacity}
/* FIRE: tumbling fireball, flickering core, ember+smoke trail */
.se-fire .se-head{background:radial-gradient(circle at 45% 45%,#f6dcae 0 14%,#e0965a 32%,#b8502f 55%,rgba(140,45,25,0) 72%);
  box-shadow:0 0 14px 5px rgba(200,85,63,.45);animation:se-tumble .32s linear infinite,se-flick .12s ease-in-out infinite alternate}
.se-fire .se-head::after{content:"";position:absolute;inset:-6px -14px -6px 6px;border-radius:50%;filter:blur(4px);
  background:radial-gradient(ellipse at 80% 50%,rgba(230,140,80,.55),rgba(170,60,35,.25) 50%,transparent 75%)}
.se-fire .se-ember{width:4px;height:4px;background:#e6a06a;box-shadow:0 0 5px rgba(210,110,60,.7);animation:se-ember .5s ease-out var(--dl) infinite}
.se-fire .se-smoke{width:16px;height:16px;background:radial-gradient(circle,rgba(70,60,55,.45),transparent 70%);filter:blur(3px);animation:se-smoke .6s ease-out var(--dl) infinite}
@keyframes se-tumble{to{transform:rotate(360deg)}}
@keyframes se-flick{from{filter:brightness(.92)}to{filter:brightness(1.05)}}
@keyframes se-ember{0%{opacity:.9;transform:translate(-10px,0)}100%{opacity:0;transform:translate(calc(-40px - var(--r)*30px),calc((var(--r) - .5)*26px))}}
@keyframes se-smoke{0%{opacity:.5;transform:translate(-14px,-8px) scale(.5)}100%{opacity:0;transform:translate(-70px,calc(-8px + (var(--r) - .5)*20px)) scale(1.6)}}
/* WIND: spinning crescent blade with translucent streaks */
.se-wind .se-head{width:34px;height:34px;margin-top:-17px;background:none;filter:blur(.6px);animation:se-spin .22s linear infinite}
.se-wind .se-head::before,.se-wind .se-head::after{content:"";position:absolute;inset:0;border-radius:50%;
  background:radial-gradient(circle at 65% 50%,transparent 46%,rgba(225,210,165,.75) 52%,rgba(225,210,165,.15) 64%,transparent 70%)}
.se-wind .se-head::after{transform:rotate(180deg);opacity:.6}
.se-wind .se-streak{height:3px;width:60px;margin-top:-1.5px;border-radius:3px;filter:blur(1.5px);
  background:linear-gradient(90deg,transparent,rgba(225,215,190,.45));animation:se-streak .35s ease-out var(--dl) infinite}
@keyframes se-spin{to{transform:rotate(-360deg)}}
@keyframes se-streak{0%{opacity:.8;transform:translate(-20px,calc((var(--r) - .5)*18px)) scaleX(.6)}100%{opacity:0;transform:translate(-80px,calc((var(--r) - .5)*26px)) scaleX(1.2)}}
/* WATER: liquid lance, shimmering droplet trail */
.se-water .se-head{width:40px;height:12px;margin-top:-6px;border-radius:50% 60% 60% 50%/50%;
  background:linear-gradient(90deg,rgba(80,120,160,0),rgba(111,147,184,.75) 45%,#c6d8e6 85%,rgba(220,235,245,.9));
  box-shadow:0 0 10px 3px rgba(111,147,184,.4);animation:se-shim .18s ease-in-out infinite alternate}
.se-water .se-drop{width:6px;height:6px;background:radial-gradient(circle at 35% 35%,#dbe8f2,#6f93b8 60%,transparent);animation:se-drop .45s ease-out var(--dl) infinite}
@keyframes se-shim{from{opacity:.85;transform:scaleY(.9)}to{opacity:1;transform:scaleY(1.1)}}
@keyframes se-drop{0%{opacity:.85;transform:translate(-30px,0) scale(1)}100%{opacity:0;transform:translate(calc(-60px - var(--r)*30px),calc((var(--r) - .5)*14px + 6px)) scale(.4)}}
/* EARTH: jagged stone shard (soft-edged), dust + pebbles */
.se-earth .se-head{width:26px;height:20px;margin-top:-10px;border-radius:42% 58% 38% 62%/55% 40% 60% 45%;
  background:radial-gradient(circle at 40% 35%,#bfae86,#7a6a48 55%,#4c4230);box-shadow:0 0 8px 2px rgba(124,154,92,.35),inset -3px -3px 5px rgba(0,0,0,.45);
  animation:se-tumble .4s linear infinite}
.se-earth .se-dust{width:18px;height:18px;background:radial-gradient(circle,rgba(160,140,100,.4),transparent 70%);filter:blur(3px);animation:se-smoke .6s ease-out var(--dl) infinite}
.se-earth .se-peb{width:4px;height:4px;border-radius:40%;background:#8d7b58;animation:se-peb .5s ease-in var(--dl) infinite}
@keyframes se-peb{0%{opacity:.9;transform:translate(-14px,0)}100%{opacity:0;transform:translate(calc(-40px - var(--r)*20px),calc(10px + var(--r)*16px))}}
/* IMPACTS */
.se-imp{position:fixed;z-index:1003;width:0;height:0;pointer-events:none}
.se-imp i{position:absolute;left:0;top:0;border-radius:50%;opacity:0;will-change:transform,opacity}
.se-imp .g{width:90px;height:90px;margin:-45px 0 0 -45px;filter:blur(6px);animation:se-bloom .55s ease-out forwards}
.se-imp-fire .g{background:radial-gradient(circle,rgba(240,180,120,.6),rgba(200,85,63,.35) 45%,transparent 70%)}
.se-imp-wind .g{background:radial-gradient(circle,transparent 30%,rgba(225,210,170,.35) 50%,transparent 70%)}
.se-imp-water .g{background:radial-gradient(circle,rgba(200,220,235,.45),rgba(111,147,184,.25) 50%,transparent 70%)}
.se-imp-earth .g{background:radial-gradient(circle,rgba(170,150,105,.5),rgba(110,95,65,.25) 50%,transparent 70%)}
.se-imp .q{width:5px;height:5px;margin:-2.5px 0 0 -2.5px;animation:se-scat var(--d) ease-out forwards}
.se-imp-fire .q{background:#e6a06a;box-shadow:0 0 5px rgba(210,110,60,.7)}
.se-imp-wind .q{width:22px;height:8px;margin:-4px 0 0 -11px;filter:blur(2px);background:radial-gradient(ellipse,rgba(230,220,195,.55),transparent 70%);animation:se-swirl var(--d) ease-out forwards}
.se-imp-water .q{background:radial-gradient(circle at 35% 35%,#dbe8f2,#6f93b8 60%,transparent);width:6px;height:6px;animation:se-splash var(--d) ease-out forwards}
.se-imp-earth .q{border-radius:35%;background:#8d7b58;animation:se-debris var(--d) ease-in forwards}
.se-imp .rp{width:30px;height:12px;margin:-6px 0 0 -15px;border-radius:50%;box-shadow:0 0 6px 2px rgba(150,185,215,.45);filter:blur(1px);animation:se-ripple .7s ease-out forwards}
.se-imp .ck{width:60px;height:4px;margin:-2px 0 0 -30px;border-radius:50%;filter:blur(2px);background:radial-gradient(ellipse,rgba(40,30,20,.7),transparent 70%);transform:rotate(var(--a));animation:se-crack .7s ease-out forwards}
.se-imp .pf{width:70px;height:40px;margin:-10px 0 0 -35px;filter:blur(6px);background:radial-gradient(ellipse,rgba(150,130,95,.45),transparent 70%);animation:se-puff .8s ease-out forwards}
@keyframes se-bloom{0%{opacity:0;transform:scale(.3)}30%{opacity:.85}100%{opacity:0;transform:scale(1.1)}}
@keyframes se-scat{0%{opacity:.95;transform:translate(0,0)}100%{opacity:0;transform:translate(var(--x),calc(var(--y) - 14px)) scale(.4)}}
@keyframes se-swirl{0%{opacity:0;transform:rotate(var(--a)) translateX(10px)}35%{opacity:.85}100%{opacity:0;transform:rotate(calc(var(--a) + 160deg)) translateX(44px)}}
@keyframes se-splash{0%{opacity:.9;transform:translate(0,0)}60%{opacity:.7}100%{opacity:0;transform:translate(var(--x),calc(var(--y) + 18px)) scale(.5)}}
@keyframes se-debris{0%{opacity:.95;transform:translate(0,0) rotate(0)}100%{opacity:0;transform:translate(var(--x),calc(var(--y) + 22px)) rotate(200deg)}}
@keyframes se-ripple{0%{opacity:.8;transform:scale(.4)}100%{opacity:0;transform:scale(3)}}
@keyframes se-crack{0%{opacity:0;transform:rotate(var(--a)) scaleX(.2)}30%{opacity:.8}100%{opacity:0;transform:rotate(var(--a)) scaleX(1)}}
@keyframes se-puff{0%{opacity:0;transform:scale(.4)}35%{opacity:.7}100%{opacity:0;transform:translateY(-10px) scale(1.4)}}
/* default orb-style burst dots replaced by the per-element impact */
html.se-on .element-particle{display:none!important}
@media (prefers-reduced-motion:reduce){.se-x:not(.se-head),.se-imp .q{display:none}.se-head{animation:none!important}}

/* ===== v2: painterly sprite sheets for Fire / Water / Earth (wind unchanged) ===== */
.se-spr{background-repeat:no-repeat;background-size:800% 100%;animation:se-frames var(--sd,.5s) steps(8,jump-none) infinite}
@keyframes se-frames{from{background-position:0 0}to{background-position:100% 0}}
.se-fire .se-head,.se-water .se-head,.se-earth .se-head{box-shadow:none!important;border-radius:0!important;filter:none!important;background-color:transparent!important}
.se-fire .se-head::after{display:none}
.se-fire .se-head{width:112px;height:56px;margin-top:-28px;right:-12px;background:url(../../assets/fx/spells/fire-fly.webp) 0 0/800% 100% no-repeat!important;
  animation:se-frames .42s steps(8,jump-none) infinite!important;mix-blend-mode:screen}
.se-water .se-head{width:130px;height:26px;margin-top:-13px;right:-8px;background:url(../../assets/fx/spells/water-fly.webp) 0 0/800% 100% no-repeat!important;
  animation:se-frames .5s steps(8,jump-none) infinite!important}
.se-earth .se-head{width:40px;height:40px;margin-top:-20px;right:-6px;background:url(../../assets/fx/spells/earth-rock.webp) 0 0/800% 100% no-repeat!important;
  animation:se-frames .45s steps(8,jump-none) infinite!important}
.se-fire .se-smoke{width:26px;height:9px;border-radius:50%;background:radial-gradient(ellipse,rgba(70,58,52,.35),transparent 70%);filter:blur(4px)}
.se-fire .se-ember{width:2.5px;height:2.5px;background:#f0b47a;box-shadow:0 0 4px rgba(220,120,60,.8)}
.se-earth .se-dust{background:radial-gradient(ellipse,rgba(92,72,50,.45),transparent 70%)!important;width:22px;height:12px}
.se-earth .se-peb{background:#5a4a34!important;width:3.5px;height:3px}
.se-earth .se-peb:nth-child(odd){background:#4f6236!important}
.se-imp .sp{position:absolute;left:0;top:0;width:128px;height:128px;margin:-64px 0 0 -64px;border-radius:0;opacity:1;
  background-repeat:no-repeat;background-size:800% 100%;animation:se-frames1 var(--sd,.62s) steps(8,jump-none) forwards}
@keyframes se-frames1{from{background-position:0 0}to{background-position:100% 0}}
.se-imp-fire .sp{background-image:url(../../assets/fx/spells/fire-hit.webp);mix-blend-mode:screen;width:150px;height:150px;margin:-80px 0 0 -75px}
.se-imp-water .sp{background-image:url(../../assets/fx/spells/water-hit.webp);margin:-74px 0 0 -64px}
.se-imp-earth .sp{background-image:url(../../assets/fx/spells/earth-hit.webp);--sd:.75s;margin:-74px 0 0 -64px}
.se-imp-fire .g,.se-imp-water .g,.se-imp-earth .g,.se-imp .rp,.se-imp .ck,.se-imp .pf{display:none!important}
.se-imp-fire .q{width:3px;height:3px;margin:-1.5px 0 0 -1.5px;background:#f0b47a}
.se-imp-water .q{width:4px;height:5px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:linear-gradient(160deg,#dbe8f2,#6f93b8)}
.se-imp-earth .q{width:4px;height:3.5px;background:#5a4a34}.se-imp-earth .q:nth-child(odd){background:#4f6236}
@media (max-width:700px),(orientation:landscape) and (max-height:520px){
  .se-fire .se-head{width:84px;height:42px;margin-top:-21px}.se-water .se-head{width:96px;height:19px;margin-top:-9.5px}
  .se-imp .sp{width:96px;height:96px;margin:-54px 0 0 -48px}.se-imp-fire .sp{width:110px;height:110px;margin:-60px 0 0 -55px}}
@media (prefers-reduced-motion:reduce){.se-fire .se-head,.se-water .se-head,.se-earth .se-head{animation:none!important}.se-imp .sp{animation-duration:.4s}}

/* v3 water: thin translucent jet + fine mist; crisp splash */
.se-water .se-drop{width:2.5px;height:2.5px;background:rgba(215,230,240,.75)!important;box-shadow:0 0 2px rgba(180,205,225,.5)}
.se-imp-water .q{width:2.5px!important;height:2.5px!important;border-radius:50%!important;background:rgba(220,234,244,.85)!important}
.se-imp-water .sp{width:150px;height:150px;margin:-86px 0 0 -75px;--sd:.55s}