.kfx {
	position: relative;
	z-index: 0;
	display: inline;
	color: inherit;
	background: none;
	font: inherit;
	white-space: nowrap;
}

.kfx-ink,
.kfx-anno,
.kfx-line {
	position: absolute;
	pointer-events: none;
	z-index: -1;
}

.kfx-ink {
	left: -0.12em;
	right: -0.1em;
	top: 0.08em;
	bottom: 0.04em;
	color: var(--kfx-c1, #ffde3a);
	clip-path: inset(0 100% 0 0);
	transform: rotate(-0.6deg);
}

.kfx.is-on .kfx-ink { animation: kfx-draw 0.8s cubic-bezier(0.22, 1, 0.36, 1) forwards; }
.kfx[data-fx="highlight-thin"] .kfx-ink { top: 0.55em; bottom: 0.02em; }
.kfx[data-color="orange"] .kfx-ink, .kfx[data-fx="highlight-orange"] .kfx-ink { color: #ff7a1a; }
.kfx[data-color="cyan"] .kfx-ink, .kfx[data-fx="highlight-cyan"] .kfx-ink { color: #3ec6e8; }
.kfx-ink svg, .kfx-line svg, .kfx-anno svg { width: 100%; height: 100%; display: block; overflow: visible; }
.kfx-ink path { fill: currentColor; }

.kfx-word, .kfx-type-word, .kfx-ch, .kfx-wd {
	position: relative;
	display: inline-block;
}
.kfx-ch { white-space: pre; }

.kfx-cursor {
	display: inline-block;
	width: 0.08em;
	height: 0.9em;
	margin-left: 0.1em;
	background: currentColor;
	vertical-align: -0.08em;
	animation: kfx-blink 0.85s step-end infinite;
}
.kfx[data-cursor="underscore"] .kfx-cursor {
	width: 0.55em; height: 0.08em; vertical-align: 0; margin-left: 0.06em;
}
.kfx[data-cursor="block"] .kfx-cursor {
	width: 0.55em; height: 1em; opacity: 0.85;
}

.kfx-line {
	left: 0; right: 0; bottom: 0.02em; height: 0.2em; color: #ffde3a;
}
.kfx-line path {
	fill: none; stroke: currentColor; stroke-width: 8; stroke-linecap: round;
	stroke-dasharray: 1; stroke-dashoffset: 1;
}
.kfx.is-on .kfx-line path { animation: kfx-stroke 0.7s cubic-bezier(0.22, 1, 0.36, 1) forwards; }

.kfx-anno {
	inset: -0.28em -0.35em;
	color: #ffde3a;
}
.kfx-anno path, .kfx-anno rect, .kfx-anno ellipse, .kfx-anno line {
	fill: none; stroke: currentColor; stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round;
	stroke-dasharray: 1; stroke-dashoffset: 1;
}
.kfx.is-on .kfx-anno :is(path, rect, ellipse, line) {
	animation: kfx-stroke 0.75s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
.kfx[data-fx="circle"] .kfx-anno { color: #3ec6e8; }
.kfx[data-fx="box"] .kfx-anno { color: #ff7a1a; }
.kfx[data-fx="strike"] .kfx-anno, .kfx[data-fx="cross"] .kfx-anno { color: #ff4d4d; }
.kfx[data-fx="brackets"] .kfx-anno { color: #b7f08a; }

.kfx[data-fx="split-up"] .kfx-ch,
.kfx[data-fx="split-fade"] .kfx-ch,
.kfx[data-fx="split-scale"] .kfx-ch,
.kfx[data-fx="wave"] .kfx-ch,
.kfx[data-fx="bounce"] .kfx-ch,
.kfx[data-fx="blur"] .kfx-ch,
.kfx[data-fx="elastic"] .kfx-ch,
.kfx[data-fx="rotate"] .kfx-ch,
.kfx[data-fx="random-color"] .kfx-ch,
.kfx[data-fx="words-up"] .kfx-wd {
	opacity: 0;
}
.kfx[data-fx="split-up"].is-on .kfx-ch { animation: kfx-up 0.55s cubic-bezier(0.16, 1, 0.3, 1) forwards; animation-delay: calc(var(--i) * 38ms); }
.kfx[data-fx="split-fade"].is-on .kfx-ch { animation: kfx-fade 0.5s ease forwards; animation-delay: calc(var(--i) * 32ms); }
.kfx[data-fx="split-scale"].is-on .kfx-ch { animation: kfx-scale 0.5s cubic-bezier(0.16, 1, 0.3, 1) forwards; animation-delay: calc(var(--i) * 36ms); }
.kfx[data-fx="wave"].is-on .kfx-ch { animation: kfx-wave 1.15s ease-in-out calc(var(--i) * 55ms) infinite; opacity: 1; }
.kfx[data-fx="bounce"].is-on .kfx-ch { animation: kfx-bounce 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) forwards; animation-delay: calc(var(--i) * 40ms); }
.kfx[data-fx="blur"].is-on .kfx-ch { animation: kfx-blur 0.6s ease forwards; animation-delay: calc(var(--i) * 28ms); }
.kfx[data-fx="elastic"].is-on .kfx-ch { animation: kfx-elastic 0.8s cubic-bezier(0.34, 1.7, 0.64, 1) forwards; animation-delay: calc(var(--i) * 35ms); }
.kfx[data-fx="rotate"].is-on .kfx-ch { animation: kfx-spin 0.55s cubic-bezier(0.16, 1, 0.3, 1) forwards; animation-delay: calc(var(--i) * 30ms); }
.kfx[data-fx="random-color"].is-on .kfx-ch { animation: kfx-fade 0.4s ease forwards; animation-delay: calc(var(--i) * 40ms); }
.kfx[data-fx="words-up"].is-on .kfx-wd { animation: kfx-up 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards; animation-delay: calc(var(--i) * 90ms); }

.kfx[data-fx="clip"] { display: inline-block; overflow: hidden; vertical-align: bottom; }
.kfx[data-fx="clip"] .kfx-inner { display: inline-block; transform: translateY(110%); }
.kfx[data-fx="clip"].is-on .kfx-inner { animation: kfx-clip 0.7s cubic-bezier(0.16, 1, 0.3, 1) forwards; }

.kfx[data-fx="tracking"] { letter-spacing: 0.35em; opacity: 0; }
.kfx[data-fx="tracking"].is-on { animation: kfx-track 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards; }

.kfx[data-fx="flip"] { display: inline-block; perspective: 600px; }
.kfx[data-fx="flip"] .kfx-inner { display: inline-block; transform: rotateX(-90deg); opacity: 0; transform-origin: 50% 100%; }
.kfx[data-fx="flip"].is-on .kfx-inner { animation: kfx-flip 0.7s cubic-bezier(0.16, 1, 0.3, 1) forwards; }

.kfx[data-fx="slide"] .kfx-inner { display: inline-block; opacity: 0; }
.kfx[data-fx="slide"].is-on .kfx-inner { animation: kfx-slide 0.65s cubic-bezier(0.16, 1, 0.3, 1) forwards; }

.kfx[data-fx="oscillate"].is-on { display: inline-block; animation: kfx-osc 2.4s ease-in-out infinite; }

.kfx[data-fx="gradient"] {
	background: linear-gradient(90deg, var(--kfx-c1, #3ec6e8), var(--kfx-c2, #ffde3a), #ff7a1a, var(--kfx-c1, #3ec6e8));
	background-size: 300% 100%;
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.kfx[data-fx="gradient"].is-on { animation: kfx-grad 4s linear infinite; }

.kfx[data-fx="shine"] {
	background: linear-gradient(110deg, currentColor 35%, #fff 50%, currentColor 65%);
	background-size: 220% 100%;
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.kfx[data-fx="shine"].is-on { animation: kfx-shine 2.4s ease-in-out infinite; }

.kfx[data-fx="glitch"] { display: inline-block; }
.kfx[data-fx="glitch"].is-on { animation: kfx-glitch 1.2s steps(2) infinite; }

.kfx[data-fx="glow"].is-on { animation: kfx-glow 1.8s ease-in-out infinite; }

.kfx[data-fx="stroke"] {
	-webkit-text-stroke: 1.5px currentColor;
	color: transparent;
}
.kfx[data-fx="stroke"].is-on { animation: kfx-fill 1.1s ease forwards; }

.kfx[data-fx="marquee"] { display: inline-flex; overflow: hidden; max-width: 16ch; }
.kfx[data-fx="marquee"] .kfx-inner { display: inline-block; padding-right: 2em; animation: kfx-marquee 7s linear infinite; }

@keyframes kfx-draw { to { clip-path: inset(0 -2% 0 0); } }
@keyframes kfx-stroke { to { stroke-dashoffset: 0; } }
@keyframes kfx-blink { 50% { opacity: 0; } }
@keyframes kfx-up { from { opacity: 0; transform: translateY(0.65em); } to { opacity: 1; transform: none; } }
@keyframes kfx-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes kfx-scale { from { opacity: 0; transform: scale(0.4); } to { opacity: 1; transform: none; } }
@keyframes kfx-wave { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-0.28em); } }
@keyframes kfx-bounce { 0% { opacity: 0; transform: translateY(-0.8em); } 60% { opacity: 1; transform: translateY(0.12em); } 100% { opacity: 1; transform: none; } }
@keyframes kfx-blur { from { opacity: 0; filter: blur(8px); } to { opacity: 1; filter: none; } }
@keyframes kfx-elastic { from { opacity: 0; transform: scaleX(0.2); } to { opacity: 1; transform: none; } }
@keyframes kfx-spin { from { opacity: 0; transform: rotate(-18deg) translateY(0.4em); } to { opacity: 1; transform: none; } }
@keyframes kfx-clip { to { transform: none; } }
@keyframes kfx-track { to { letter-spacing: 0.02em; opacity: 1; } }
@keyframes kfx-flip { to { transform: none; opacity: 1; } }
@keyframes kfx-slide {
	from { transform: translate(calc(var(--dx, -40) * 1px * var(--kfx-int, 1)), calc(var(--dy, 0) * 1px * var(--kfx-int, 1))); opacity: 0; }
	to { transform: none; opacity: 1; }
}
@keyframes kfx-osc { 0%, 100% { transform: rotate(-2deg); } 50% { transform: rotate(2deg); } }
@keyframes kfx-grad { to { background-position: 300% 0; } }
@keyframes kfx-shine { 0% { background-position: 120% 0; } 100% { background-position: -120% 0; } }
@keyframes kfx-glitch {
	0%, 100% { text-shadow: 0 0 currentColor; transform: none; }
	20% { text-shadow: 2px 0 #3ec6e8, -2px 0 #ff4d4d; transform: translate(1px, -1px); }
	40% { text-shadow: -2px 0 #3ec6e8, 2px 0 #ffde3a; transform: translate(-1px, 1px); }
	60% { text-shadow: 1px 0 #ff7a1a; transform: none; }
}
@keyframes kfx-glow {
	0%, 100% { text-shadow: 0 0 0 transparent; }
	50% { text-shadow: 0 0 12px #3ec6e8, 0 0 28px #3ec6e8; }
}
@keyframes kfx-fill { to { color: currentColor; -webkit-text-stroke: 0; } }
@keyframes kfx-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

.kfx[data-fx="blink"].is-on { animation: kfx-hardblink 1s step-end infinite; }
.kfx[data-fx="neon"] { color: var(--kfx-c1, #7af0ff); }
.kfx[data-fx="neon"].is-on { animation: kfx-neon 1.4s ease-in-out infinite; }
.kfx[data-fx="neon-flicker"].is-on { color: #ff4de8; animation: kfx-flicker 2.2s linear infinite; }
.kfx[data-fx="pixel"].is-on { display: inline-block; image-rendering: pixelated; animation: kfx-pixel 1.1s steps(6) forwards; }
.kfx[data-fx="pixel-in"] .kfx-ch { opacity: 0; }
.kfx[data-fx="pixel-in"].is-on .kfx-ch { animation: kfx-pixelch 0.45s steps(3) forwards; animation-delay: calc(var(--i) * 45ms); }
.kfx[data-fx="rainbow"] .kfx-ch { color: hsl(calc(var(--i) * 28), 90%, 62%); }
.kfx[data-fx="rainbow"].is-on { animation: kfx-hue 4s linear infinite; }
.kfx[data-fx="rgb"].is-on { display: inline-block; animation: kfx-rgb 0.9s steps(2) infinite; }
.kfx[data-fx="fire"] {
	background: linear-gradient(180deg, #fff 10%, var(--kfx-c1, #ffde3a) 40%, var(--kfx-c2, #ff7a1a) 70%, #ff2a00);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.kfx[data-fx="fire"].is-on { animation: kfx-fire 0.7s linear infinite; filter: drop-shadow(0 0 8px #ff7a1a); }
.kfx[data-fx="chrome"] {
	background: linear-gradient(180deg, #fff, #9ad7ff 35%, #fff 50%, #6aa 70%, #cfd 100%);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.kfx[data-fx="liquid"] {
	background: linear-gradient(var(--kfx-c1, #3ec6e8) 50%, var(--kfx-c2, #0e3353) 50%);
	background-size: 100% 200%;
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.kfx[data-fx="liquid"].is-on { animation: kfx-liquid 2.8s ease-in-out infinite; }
.kfx[data-fx="hologram"].is-on { display: inline-block; animation: kfx-holo 2s linear infinite; }
.kfx[data-fx="smoke"].is-on { display: inline-block; animation: kfx-smoke 3s ease-in-out infinite; }
.kfx[data-fx="crt"] { font-family: ui-monospace, Consolas, monospace; }
.kfx[data-fx="crt"].is-on { animation: kfx-crt 0.12s infinite; }
.kfx[data-fx="scanline"] { position: relative; display: inline-block; }
.kfx[data-fx="scanline"]::after {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: repeating-linear-gradient(transparent 0 2px, rgba(0,0,0,.25) 2px 3px);
	animation: kfx-scan 2.5s linear infinite;
}
.kfx[data-fx="spotlight"] {
	background: radial-gradient(circle at 0 50%, #fff, currentColor 40%);
	background-size: 220% 100%;
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.kfx[data-fx="spotlight"].is-on { animation: kfx-spot 2.8s ease-in-out infinite; }
.kfx[data-fx="outline-dash"] { -webkit-text-stroke: 1.5px currentColor; color: transparent; }
.kfx[data-fx="outline-dash"].is-on { animation: kfx-dash 1.2s linear infinite; }
.kfx[data-fx="stamp"].is-on { display: inline-block; animation: kfx-stamp .7s cubic-bezier(.2,1.6,.4,1) forwards; color: #ff4d4d; }
.kfx[data-fx="comic"] { text-shadow: 3px 3px 0 #000; }
.kfx[data-fx="stacked"] { display: inline-block; text-shadow: 1px 1px #3ec6e8, 2px 2px #ff7a1a, 3px 3px #ffde3a; }
.kfx[data-fx="stacked"].is-on { animation: kfx-stack 1.6s ease-in-out infinite; }
.kfx[data-fx="zebra"] {
	background: repeating-linear-gradient(90deg, currentColor 0 8px, transparent 8px 16px);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.kfx[data-fx="zebra"].is-on { animation: kfx-zebra 1.5s linear infinite; background-size: 32px 100%; }
.kfx[data-fx="mirror"] { display: inline-block; }
.kfx[data-fx="mirror"] .kfx-inner { display: inline-block; }
.kfx[data-fx="mirror"].is-on .kfx-inner { animation: kfx-mirror 2.4s ease-in-out infinite; }
.kfx[data-fx="led"] { font-family: ui-monospace, Consolas, monospace; letter-spacing: .12em; }
.kfx[data-fx="led"].is-on { animation: kfx-led 1.1s step-end infinite; }
.kfx[data-fx="heartbeat"].is-on { display: inline-block; animation: kfx-heart 1s ease-in-out infinite; }
.kfx[data-fx="wobble"].is-on { display: inline-block; animation: kfx-wobble .7s ease-in-out infinite; }
.kfx[data-fx="skew"].is-on { display: inline-block; animation: kfx-skew 1.8s ease-in-out infinite; }
.kfx[data-fx="zoom-pulse"].is-on { display: inline-block; animation: kfx-zoom 1.4s ease-in-out infinite; }
.kfx[data-fx="float"].is-on { display: inline-block; animation: kfx-float 2.6s ease-in-out infinite; }
.kfx[data-fx="blur-pulse"].is-on { display: inline-block; animation: kfx-blurp 1.8s ease-in-out infinite; }
.kfx[data-fx="shadow-long"].is-on { display: inline-block; animation: kfx-long 1.6s ease-in-out infinite; }
.kfx[data-fx="fill-bar"] { position: relative; display: inline-block; }
.kfx[data-fx="fill-bar"]::before {
	content: ""; position: absolute; left: -.12em; right: -.12em; top: .2em; bottom: .08em;
	background: var(--kfx-c1, #ffde3a); z-index: -1; transform: scaleX(0); transform-origin: left;
}
.kfx[data-fx="fill-bar"].is-on::before { animation: kfx-bar 1s cubic-bezier(.22,1,.36,1) forwards; }
.kfx[data-fx="fill-bar"][data-pct].is-on::before,
.kfx[data-fx="fill-bar"][data-until].is-on::before {
	animation: none;
	transform: scaleX(calc(var(--kfx-pct, 0) / 100));
}
.kfx[data-fx="slice"] { display: inline-block; }
.kfx[data-fx="slice"].is-on { animation: kfx-slice .8s cubic-bezier(.22,1,.36,1) forwards; }
.kfx[data-fx="spin"] { display: inline-block; }
.kfx[data-fx="spin"].is-on { animation: kfx-spin360 3.5s linear infinite; }
.kfx[data-fx="spin-y"] { display: inline-block; perspective: 500px; }
.kfx[data-fx="spin-y"] .kfx-inner { display: inline-block; }
.kfx[data-fx="spin-y"].is-on .kfx-inner { animation: kfx-spiny 2.4s linear infinite; }
.kfx[data-fx="pendulum"] { display: inline-block; transform-origin: var(--kfx-origin, top center); }
.kfx[data-fx="pendulum"].is-on { animation: kfx-pend calc(1.8s * var(--kfx-dur, 1)) ease-in-out var(--kfx-loop, infinite); }
.kfx[data-fx="vertical"] { writing-mode: vertical-rl; letter-spacing: .15em; display: inline-block; height: 7.2rem; overflow: hidden; }
.kfx[data-fx="vertical"].is-on .kfx-inner { display: inline-block; animation: kfx-vert 7s linear infinite; }
.kfx[data-fx="vertical"].is-on .kfx-inner { display: inline-block; animation: kfx-vert 5s linear infinite; }
.kfx[data-fx="invert-blink"].is-on { animation: kfx-invert 1.1s step-end infinite; }
.kfx-orb { width: 190px; height: 190px; display: block; }
.kfx[data-fx="circle-path"].is-on .kfx-orb { animation: kfx-spin360 10s linear infinite; }
.kfx[data-fx="circle-path"] { display: inline-block; }
.kfx[data-fx="terminal"] { font-family: ui-monospace, Consolas, monospace; color: #7CFF9A; }
.kfx[data-fx="terminal"]::before { content: "> "; color: #3ec6e8; }
.kfx[data-fx="matrix"] { position: relative; display: inline-block; color: #7CFF9A; }
.kfx-matrix {
	position: absolute; inset: -.4em -.2em; overflow: hidden; color: #1dff6a; opacity: .35;
	font-family: ui-monospace, Consolas, monospace; font-size: .55em; line-height: 1; pointer-events: none;
	animation: kfx-rain 1.8s linear infinite; word-break: break-all;
}
.kfx[data-fx="binary"], .kfx[data-fx="clock"], .kfx[data-fx="countdown"] {
	font-family: ui-monospace, Consolas, monospace; letter-spacing: .06em; font-variant-numeric: tabular-nums;
}
.kfx[data-fx="morse"].is-on { animation: kfx-morse 2.4s step-end infinite; }
.kfx[data-fx="karaoke"] .kfx-wd { opacity: .35; }
.kfx[data-fx="karaoke"].is-on .kfx-wd { animation: kfx-kara 2.4s ease-in-out infinite; animation-delay: calc(var(--i) * .6s); }
.kfx[data-fx="drop"] .kfx-ch { opacity: 0; }
.kfx[data-fx="drop"].is-on .kfx-ch { animation: kfx-drop .6s cubic-bezier(.2,1.4,.3,1) forwards; animation-delay: calc(var(--i) * 40ms); }
.kfx[data-fx="explode"] .kfx-ch { opacity: 0; }
.kfx[data-fx="explode"].is-on .kfx-ch { animation: kfx-boom .8s cubic-bezier(.16,1,.3,1) forwards; animation-delay: calc(var(--i) * 28ms); }
.kfx[data-fx="join"] { display: inline-flex; overflow: hidden; }
.kfx[data-fx="join"] .kfx-left { transform: translateX(-120%); }
.kfx[data-fx="join"] .kfx-right { transform: translateX(120%); }
.kfx[data-fx="join"].is-on .kfx-left, .kfx[data-fx="join"].is-on .kfx-right { animation: kfx-clip .7s cubic-bezier(.16,1,.3,1) forwards; }
.kfx[data-fx="slot"], .kfx[data-fx="ticker-v"] { display: inline-block; overflow: hidden; height: 1.25em; vertical-align: bottom; }
.kfx[data-fx="slot"] .kfx-reel, .kfx[data-fx="ticker-v"] .kfx-reel { display: block; }
.kfx[data-fx="ticker-v"] .kfx-reel { animation: kfx-tickv 3.2s cubic-bezier(.22,1,.36,1) infinite; }

@keyframes kfx-hardblink { 50% { opacity: 0; } }
@keyframes kfx-neon { 0%,100% { text-shadow: 0 0 4px #7af0ff, 0 0 16px #3ec6e8, 0 0 32px #3ec6e8; } 50% { text-shadow: 0 0 8px #fff, 0 0 28px #7af0ff, 0 0 48px #3ec6e8; } }
@keyframes kfx-flicker { 0%,19%,21%,23%,80%,100% { opacity: 1; text-shadow: 0 0 8px #ff4de8, 0 0 24px #ff4de8; } 20%,22%,81% { opacity: .35; text-shadow: none; } }
@keyframes kfx-pixel { from { transform: scale(.15); filter: contrast(4) blur(2px); } to { transform: none; filter: none; } }
@keyframes kfx-pixelch { from { opacity: 0; transform: scale(2); filter: contrast(6); } to { opacity: 1; transform: none; filter: none; } }
@keyframes kfx-hue { to { filter: hue-rotate(360deg); } }
@keyframes kfx-rgb { 0%,100% { text-shadow: 2px 0 #ff2a2a, -2px 0 #2ad0ff; } 50% { text-shadow: -2px 0 #ff2a2a, 2px 0 #2ad0ff; } }
@keyframes kfx-fire { 50% { filter: drop-shadow(0 -4px 10px #ff7a1a) hue-rotate(12deg); } }
@keyframes kfx-liquid { 50% { background-position: 0 100%; } }
@keyframes kfx-holo { 0%,100% { text-shadow: 0 0 0 #3ec6e8; } 50% { text-shadow: 0 0 18px #ffde3a; filter: hue-rotate(80deg); } }
@keyframes kfx-smoke { 50% { filter: blur(3px); opacity: .7; letter-spacing: .12em; } }
@keyframes kfx-crt { 50% { opacity: .92; transform: translate(.4px,-.4px); } }
@keyframes kfx-scan { to { transform: translateY(8px); } }
@keyframes kfx-spot { to { background-position: 220% 0; } }
@keyframes kfx-dash { 50% { -webkit-text-stroke-color: #ffde3a; } }
@keyframes kfx-stamp { 0% { transform: scale(2.2) rotate(-8deg); opacity: 0; } 100% { transform: rotate(-6deg); opacity: 1; } }
@keyframes kfx-stack { 50% { text-shadow: 2px 2px #3ec6e8, 4px 4px #ff7a1a, 6px 6px #ffde3a; } }
@keyframes kfx-zebra { to { background-position: 32px 0; } }
@keyframes kfx-mirror { 50% { transform: scaleY(-1); opacity: .55; } }
@keyframes kfx-led { 50% { opacity: .45; } }
@keyframes kfx-heart { 0%,100% { transform: scale(1); } 20% { transform: scale(1.18); } }
@keyframes kfx-wobble { 25% { transform: rotate(-6deg); } 75% { transform: rotate(6deg); } }
@keyframes kfx-skew { 50% { transform: skewX(-12deg); } }
@keyframes kfx-zoom { 50% { transform: scale(1.12); } }
@keyframes kfx-float { 50% { transform: translateY(-.28em); } }
@keyframes kfx-blurp { 50% { filter: blur(5px); opacity: .75; } }
@keyframes kfx-long { 50% { text-shadow: 12px 0 0 rgba(62,198,232,.35); } }
@keyframes kfx-bar { to { transform: scaleX(1); } }
@keyframes kfx-slice { from { clip-path: inset(0 50% 0 50%); } to { clip-path: inset(0 0 0 0); } }
@keyframes kfx-spin360 { to { transform: rotate(360deg); } }
@keyframes kfx-spiny { to { transform: rotateY(360deg); } }
@keyframes kfx-pend { 0%,100% { transform: rotate(-14deg); } 50% { transform: rotate(14deg); } }
@keyframes kfx-vert { from { transform: translateY(15%); } to { transform: translateY(-15%); } }
@keyframes kfx-invert { 50% { filter: invert(1); } }
@keyframes kfx-rain { to { transform: translateY(-40%); } }
@keyframes kfx-morse { 0%,10%,20%,100% { opacity: 1; } 5%,15%,40%,70% { opacity: 0; } }
@keyframes kfx-kara { 0%,100% { opacity: .3; } 20%,50% { opacity: 1; color: #ffde3a; } }
@keyframes kfx-drop { from { opacity: 0; transform: translateY(-1.1em) rotate(-12deg); } to { opacity: 1; transform: none; } }
@keyframes kfx-boom { 0% { opacity: 0; transform: translate(calc(var(--i) * -3px), -18px) scale(1.6); } 100% { opacity: 1; transform: none; } }
@keyframes kfx-tickv { 0%,20% { transform: translateY(0); } 45%,70% { transform: translateY(-1.25em); } 95%,100% { transform: translateY(-2.5em); } }

.kfx[data-fx="wave-path"] .kfx-ch { display: inline-block; }
.kfx[data-fx="wave-path"].is-on .kfx-ch { animation: kfx-sine 1.4s ease-in-out infinite; animation-delay: calc(var(--i) * 70ms); opacity: 1; }
.kfx[data-fx="cascade"] .kfx-ch { opacity: 0; }
.kfx[data-fx="cascade"].is-on .kfx-ch { animation: kfx-scale 0.55s cubic-bezier(0.16,1,0.3,1) forwards; animation-delay: calc(var(--i) * 55ms); }
.kfx[data-fx="arc"] { display: inline-block; position: relative; width: 220px; height: 130px; }
.kfx[data-fx="arc"] .kfx-ch { position: absolute; left: 50%; top: 58%; }
.kfx[data-fx="spiral"] { display: inline-block; position: relative; width: 200px; height: 200px; }
.kfx[data-fx="spiral"] .kfx-ch { position: absolute; left: 50%; top: 50%; }
.kfx[data-fx="magnetic"] { display: inline-block; cursor: pointer; }
.kfx[data-fx="magnetic"] .kfx-ch { display: inline-block; transition: transform 0.12s ease-out; }
.kfx[data-fx="z-depth"] { display: inline-block; position: relative; perspective: 400px; }
.kfx[data-fx="z-depth"] .kfx-z {
	position: absolute; left: 0; top: 0; white-space: nowrap;
	transform: translate(calc(var(--z) * 1.2px), calc(var(--z) * 1.2px));
	opacity: calc(1 - var(--z) * 0.09); color: #3ec6e8; pointer-events: none;
}
.kfx[data-fx="z-depth"] .kfx-z:last-child { position: relative; color: inherit; opacity: 1; }
.kfx[data-fx="credits"] { display: inline-block; overflow: hidden; height: 4.6em; max-width: 16ch; }
.kfx[data-fx="credits"] .kfx-inner { display: block; animation: kfx-credits 9s linear infinite; }
.kfx[data-fx="starwars"] { display: inline-block; perspective: 420px; height: 7em; overflow: hidden; max-width: 18ch; }
.kfx[data-fx="starwars"] .kfx-inner { display: block; color: #ffde3a; animation: kfx-wars 11s linear infinite; }
.kfx[data-fx="flag"] .kfx-ch { display: inline-block; }
.kfx[data-fx="flag"].is-on .kfx-ch { animation: kfx-flag 1.1s ease-in-out infinite; animation-delay: calc(var(--i) * 70ms); }
.kfx[data-fx="aurora"] {
	background: linear-gradient(90deg, var(--kfx-c1, #3ec6e8), var(--kfx-c2, #b7f08a), #ff8bd0, #7af0ff, var(--kfx-c1, #3ec6e8));
	background-size: 300% 100%; -webkit-background-clip: text; background-clip: text; color: transparent;
}
.kfx[data-fx="aurora"].is-on { animation: kfx-grad 5s linear infinite; }
.kfx[data-fx="sparkle"] { position: relative; display: inline-block; }
.kfx[data-fx="sparkle"]::before, .kfx[data-fx="sparkle"]::after {
	position: absolute; font-size: .55em; animation: kfx-spark 1.4s ease-in-out infinite; pointer-events: none;
}
.kfx[data-fx="sparkle"]::before { content: "✦"; left: -0.55em; bottom: 0.1em; }
.kfx[data-fx="sparkle"]::after { content: "✧"; right: -0.5em; top: -0.15em; animation-delay: .45s; }
.kfx[data-fx="ice"] {
	background: linear-gradient(#fff, var(--kfx-c1, #9ad7ff) 42%, var(--kfx-c2, #3ec6e8));
	-webkit-background-clip: text; background-clip: text; color: transparent;
	filter: drop-shadow(0 0 8px rgba(158,215,255,.55));
}
.kfx[data-fx="gold"] {
	background: linear-gradient(#fff, var(--kfx-c1, #ffde3a) 42%, var(--kfx-c2, #c9a227) 72%, #fff8dc);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.kfx[data-fx="glass"] { color: rgba(255,255,255,.5); -webkit-text-stroke: 1px rgba(255,255,255,.85); }
.kfx[data-fx="vhs"].is-on { display: inline-block; animation: kfx-vhs 0.9s steps(2) infinite; }
.kfx[data-fx="static"].is-on { display: inline-block; animation: kfx-static 0.18s steps(2) infinite; }
.kfx[data-fx="electric"].is-on { color: #ffde3a; animation: kfx-electric 0.35s step-end infinite; }
.kfx[data-fx="graffiti"] { color: #ff4de8; text-shadow: 3px 4px 0 #122, 6px 8px 0 rgba(0,0,0,.35); transform: rotate(-4deg); display: inline-block; }
.kfx[data-fx="chalk"] { color: #f4f0e0; text-shadow: 0 0 1px #fff, 1px 1px 0 #8aa; letter-spacing: .06em; }
.kfx[data-fx="emboss"] { color: #d6ecff; text-shadow: 1px 1px 0 #fff, -1px -1px 0 #123; }
.kfx[data-fx="iridescent"] {
	background: linear-gradient(110deg, #ff4de8, #3ec6e8, #ffde3a, #b7f08a);
	background-size: 220% 100%; -webkit-background-clip: text; background-clip: text; color: transparent;
}
.kfx[data-fx="iridescent"].is-on { animation: kfx-grad 3.2s linear infinite; }
.kfx[data-fx="line-shadow"] { display: inline-block; }
.kfx[data-fx="line-shadow"].is-on { animation: kfx-linesh 1.8s linear infinite; }
.kfx[data-fx="dual"] {
	background: linear-gradient(180deg, var(--kfx-c1, #3ec6e8) 50%, var(--kfx-c2, #ff7a1a) 50%);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.kfx[data-fx="mask-wipe"] { display: inline-block; }
.kfx[data-fx="mask-wipe"].is-on { animation: kfx-wipe 1.1s cubic-bezier(.22,1,.36,1) forwards; }
.kfx[data-fx="stroke-draw"] { -webkit-text-stroke: 1.6px currentColor; color: transparent; }
.kfx[data-fx="stroke-draw"].is-on { animation: kfx-strokedraw 1.4s ease forwards; }
.kfx[data-fx="underline-grow"] { display: inline-block; background-image: linear-gradient(var(--kfx-c1, #ffde3a), var(--kfx-c1, #ffde3a)); background-repeat: no-repeat; background-position: 0 100%; background-size: 0 0.18em; }
.kfx[data-fx="underline-grow"].is-on { animation: kfx-ugrow .7s cubic-bezier(.22,1,.36,1) forwards; }
.kfx[data-fx="skeleton"] {
	background: linear-gradient(90deg, #8aa 20%, #fff 50%, #8aa 80%);
	background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent;
}
.kfx[data-fx="skeleton"].is-on { animation: kfx-shine 1.4s linear infinite; }
.kfx[data-fx="press-start"] { font-family: ui-monospace, Consolas, monospace; letter-spacing: .18em; font-size: .85em; }
.kfx[data-fx="press-start"].is-on { animation: kfx-hardblink 1.1s step-end infinite; }
.kfx[data-fx="game-over"] { color: #ff4d4d; letter-spacing: .12em; }
.kfx[data-fx="game-over"].is-on { animation: kfx-hardblink 0.85s step-end infinite; }
.kfx[data-fx="loading"] { font-family: ui-monospace, Consolas, monospace; }
.kfx[data-fx="loading"]::after {
	content: "..."; display: inline-block; width: 0; overflow: hidden; vertical-align: bottom;
	animation: kfx-dotw 1.2s steps(4) infinite;
}
.kfx[data-fx="seven"] {
	font-family: ui-monospace, Consolas, monospace; color: #ff3b3b; letter-spacing: .14em;
	background: #140404; padding: .12em .4em; border-radius: 4px;
	text-shadow: 0 0 8px #ff3b3b; box-shadow: inset 0 0 12px #000;
}
.kfx[data-fx="counter"], .kfx[data-fx="hex"] { font-family: ui-monospace, Consolas, monospace; font-variant-numeric: tabular-nums; }
.kfx[data-fx="boot"] { font-family: ui-monospace, Consolas, monospace; color: #7CFF9A; font-size: .92em; }
.kfx[data-fx="boot"]::before { content: "[ OK ] "; color: #3ec6e8; }
.kfx[data-fx="shake"].is-on { display: inline-block; animation: kfx-shake .55s ease-in-out infinite; }
.kfx[data-fx="jello"].is-on { display: inline-block; animation: kfx-jello 1.1s ease-in-out infinite; }
.kfx[data-fx="rubber"].is-on { display: inline-block; animation: kfx-rubber 1s ease-in-out infinite; }
.kfx[data-fx="swing"].is-on { display: inline-block; transform-origin: var(--kfx-origin, top center); animation: kfx-swing calc(1.2s * var(--kfx-dur, 1)) ease-in-out var(--kfx-loop, infinite); }
.kfx[data-fx="tada"].is-on { display: inline-block; animation: kfx-tada 1.15s ease-in-out infinite; }
.kfx[data-fx="flash"].is-on { animation: kfx-hardblink .7s step-end infinite; }
.kfx[data-fx="lightspeed"] { display: inline-block; }
.kfx[data-fx="lightspeed"].is-on { animation: kfx-speed .7s cubic-bezier(.22,1,.36,1) forwards; }
.kfx[data-fx="roll"] { display: inline-block; }
.kfx[data-fx="roll"].is-on { animation: kfx-roll .8s cubic-bezier(.22,1,.36,1) forwards; }
.kfx[data-fx="hinge"] { display: inline-block; transform-origin: var(--kfx-origin, top left); }
.kfx[data-fx="hinge"].is-on { animation: kfx-hinge calc(1.6s * var(--kfx-dur, 1)) ease-in-out var(--kfx-loop, infinite); }
.kfx[data-fx="jack"] { display: inline-block; }
.kfx[data-fx="jack"].is-on { animation: kfx-jack .8s cubic-bezier(.34,1.56,.64,1) forwards; }

@keyframes kfx-sine { 0%,100% { transform: translateY(0) rotate(-8deg); } 50% { transform: translateY(-0.38em) rotate(8deg); } }
@keyframes kfx-credits { from { transform: translateY(110%); } to { transform: translateY(-110%); } }
@keyframes kfx-wars { from { transform: rotateX(58deg) translateY(70%); } to { transform: rotateX(58deg) translateY(-90%); } }
@keyframes kfx-flag { 0%,100% { transform: translateY(0) skewX(0); } 50% { transform: translateY(-0.18em) skewX(-10deg); } }
@keyframes kfx-spark { 0%,100% { opacity: .2; transform: scale(.6) rotate(0); } 50% { opacity: 1; transform: scale(1.2) rotate(20deg); } }
@keyframes kfx-vhs {
	0%,100% { text-shadow: 2px 0 #f0f, -2px 0 #0ff; transform: none; }
	25% { transform: skewX(-10deg) translateX(2px); }
	50% { text-shadow: -2px 0 #f0f, 2px 0 #0ff; transform: skewX(6deg); }
}
@keyframes kfx-static { 50% { filter: contrast(2.4) grayscale(.2); transform: translate(1px,-1px); } }
@keyframes kfx-electric {
	0%,100% { text-shadow: 0 0 4px #ffde3a, 0 0 16px #fff; }
	40% { text-shadow: none; opacity: .55; }
	70% { text-shadow: 0 0 18px #fff, 0 0 28px #3ec6e8; }
}
@keyframes kfx-linesh {
	0%,100% { text-shadow: 0 4px 0 #ffde3a; }
	50% { text-shadow: 0 10px 0 #3ec6e8; }
}
@keyframes kfx-wipe { from { clip-path: inset(var(--wipe-t, 0) var(--wipe-r, 100%) var(--wipe-b, 0) var(--wipe-l, 0)); } to { clip-path: inset(0 0 0 0); } }
@keyframes kfx-strokedraw { to { color: currentColor; -webkit-text-stroke: 0; } }
@keyframes kfx-ugrow { to { background-size: 100% 0.18em; } }
@keyframes kfx-dotw { to { width: 1.15em; } }
@keyframes kfx-shake { 25% { transform: translateX(-6px); } 75% { transform: translateX(6px); } }
@keyframes kfx-jello { 25% { transform: skewX(-12deg); } 50% { transform: skewX(8deg); } 75% { transform: skewX(-4deg); } }
@keyframes kfx-rubber { 30% { transform: scaleX(1.25) scaleY(.75); } 40% { transform: scaleX(.75) scaleY(1.25); } 60% { transform: none; } }
@keyframes kfx-swing { 20% { transform: rotate(12deg); } 40% { transform: rotate(-8deg); } 60% { transform: rotate(4deg); } 80% { transform: none; } }
@keyframes kfx-tada { 10%,20% { transform: scale(.92) rotate(-3deg); } 30%,50%,70% { transform: scale(1.12) rotate(3deg); } 40%,60% { transform: scale(1.12) rotate(-3deg); } }
@keyframes kfx-speed { from { opacity: 0; transform: translate(calc(var(--dx, 56) * 1px * var(--kfx-int, 1)), calc(var(--dy, 0) * 1px * var(--kfx-int, 1))) skewX(-18deg); } to { opacity: 1; transform: none; } }
@keyframes kfx-roll { from { opacity: 0; transform: translate(calc(var(--dx, -56) * 1px * var(--kfx-int, 1)), calc(var(--dy, 0) * 1px * var(--kfx-int, 1))) rotate(calc(var(--rot, -120) * 1deg)); } to { opacity: 1; transform: none; } }
@keyframes kfx-hinge { 20%,60% { transform: rotate(70deg); } 40%,80% { transform: rotate(50deg); } 100% { transform: translateY(0.4em) rotate(70deg); opacity: .4; } }
@keyframes kfx-jack { from { opacity: 0; transform: scale(0.2) rotate(-8deg); } 50% { transform: rotate(8deg) scale(1.08); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
	.kfx-ink, .kfx.is-on .kfx-ink { clip-path: none; animation: none; }
	.kfx-cursor { display: none; }
	.kfx .kfx-ch, .kfx .kfx-wd, .kfx .kfx-inner, .kfx.is-on { animation: none !important; opacity: 1 !important; transform: none !important; filter: none !important; }
}