/* Animacje JebTo według arkusza CEO „Animated Stickers & GIFs” (5.10.2026): pętle 4-6 klatek (steps), szybko, zadziornie,
   lekko chaotycznie. „Static is dead. Make it move.” Tryb „Reduce animations” (body.malo-ruchu) i prefers-reduced-motion je wyłączają. */

/* MASKOTKI: Cool Cat (5 klatek), Hype Raccoon (6, brainrot), TV Glitch (6) */
@keyframes jt-kot{0%{transform:translateY(0) rotate(0)}20%{transform:translateY(-3px) rotate(-2deg)}40%{transform:translateY(0) rotate(1deg)}60%{transform:translateY(-2px) rotate(-1deg)}80%{transform:translateY(0) rotate(2deg)}100%{transform:translateY(0) rotate(0)}}
@keyframes jt-szop{0%{transform:rotate(0) scale(1)}17%{transform:rotate(-4deg) scale(1.03)}33%{transform:rotate(3deg) scale(.98)}50%{transform:rotate(-2deg) scale(1.04)}67%{transform:rotate(4deg) scale(1)}83%{transform:rotate(-3deg) scale(1.02)}100%{transform:rotate(0) scale(1)}}
@keyframes jt-tv{0%,100%{filter:none;transform:translate(0)}17%{filter:hue-rotate(80deg) contrast(1.4);transform:translate(-2px,1px)}33%{filter:none}50%{filter:saturate(2) brightness(1.2);transform:translate(2px,-1px)}67%{filter:invert(.15)}83%{filter:hue-rotate(-60deg);transform:translate(-1px,0)}}
.kz-deko[src*="cat-crown"],.ft2-kot,.pf-side-d img[src*="cat-crown"]{animation:jt-kot 1.4s steps(5) infinite}
.kz-deko[src*="raccoon-king"],.ft2-szop,.wl2-rac{animation:jt-szop 1.2s steps(6) infinite;transform-origin:50% 90%}
.kz-deko[src*="telewizor"],.ft2-tv,.pf-side-d img[src*="telewizor"]{animation:jt-tv 2.4s steps(6) infinite}

/* KORONA (4 klatki) */
@keyframes jt-korona{0%{transform:rotate(-10deg) translateY(0)}25%{transform:rotate(-16deg) translateY(-3px)}50%{transform:rotate(-8deg) translateY(0)}75%{transform:rotate(-14deg) translateY(-2px)}100%{transform:rotate(-10deg)}}
.rk2-kor,.pf-kor,.ft2-kor,.nv-korona,.nv-korona-roz{animation:jt-korona 1.6s steps(4) infinite}

/* REAKCJE: HELL YEAH (6 klatek pulsu), FUCK NO (4 klatki trzęsienia), WTF (4 klatki chybotania), po kliknięciu */
@keyframes jt-hell{0%{transform:scale(1)}17%{transform:scale(1.25) rotate(-6deg)}33%{transform:scale(.95)}50%{transform:scale(1.15) rotate(4deg)}67%{transform:scale(1)}83%{transform:scale(1.08)}100%{transform:scale(1)}}
@keyframes jt-fuck{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px) rotate(-6deg)}50%{transform:translateX(4px) rotate(5deg)}75%{transform:translateX(-3px)}}
@keyframes jt-wtf{0%,100%{transform:rotate(0)}25%{transform:rotate(12deg) scale(1.1)}50%{transform:rotate(-10deg)}75%{transform:rotate(8deg) scale(1.05)}}
.rx.rx-hell.on .rx-ik,.rx.rx-hell.on svg{animation:jt-hell .6s steps(6) 2}
.rx.rx-fuck.on .rx-ik,.rx.rx-fuck.on svg{animation:jt-fuck .4s steps(4) 3}
.rx.rx-wtf.on .rx-ik,.rx.rx-wtf.on svg{animation:jt-wtf .5s steps(4) 2}

/* PRZYCISK: hover → drgnięcie (DUMP SLOP z iskrami), klik → wciśnięcie */
@keyframes jt-btn{0%,100%{transform:rotate(-1deg) scale(1)}25%{transform:rotate(1.5deg) scale(1.05)}50%{transform:rotate(-1.5deg) scale(1.03)}75%{transform:rotate(1deg) scale(1.06)}}
.btn-dump:hover,.top .btn-dump:hover,.wl2-make:hover,.pf-edit:hover,.pl2-b:hover,.sk2-buy:hover{animation:jt-btn .45s steps(4) infinite}
.btn-dump:active,.wl2-make:active,.pf-edit:active,.sk2-buy:active{transform:scale(.94) rotate(-2deg)!important;animation:none}
.top .btn-dump{overflow:visible}
.top .btn-dump:hover::after{content:'✦ ✧ ✦';position:absolute;left:-6px;right:-6px;top:-14px;text-align:center;color:#ffd400;font:14px/1 var(--f-body);letter-spacing:.6em;animation:jt-iskry .5s steps(4) infinite;pointer-events:none}
@keyframes jt-iskry{0%{opacity:1;transform:translateY(0)}50%{opacity:.4;transform:translateY(-4px)}100%{opacity:1;transform:translateY(0)}}

/* WSKAŹNIK SCROLLA (4 klatki) */
@keyframes jt-strzalki{0%{transform:translateY(0)}25%{transform:translateY(4px)}50%{transform:translateY(8px)}75%{transform:translateY(4px)}}
.ft2-scroll i{display:inline-block;animation:jt-strzalki .8s steps(4) infinite}

/* TOAST: wjazd z drgnięciem (4 klatki) */
@keyframes jt-toast{0%{transform:translate(-50%,30px) rotate(-3deg);opacity:0}33%{transform:translate(-50%,-6px) rotate(2deg);opacity:1}66%{transform:translate(-50%,2px) rotate(-1deg)}100%{transform:translate(-50%,0) rotate(0)}}
#toast.on,#toast.show{animation:jt-toast .32s steps(4) both}

/* ŁADOWANIE: pasek GENERATING BULLSHIT… (6 klatek) */
.ladowanie{position:relative;height:26px;border:3px solid #111;background:#ece6d8 url(/img/papier.webp);overflow:hidden;font:14px/20px var(--f-head);color:#111}
.ladowanie::before{content:'';position:absolute;inset:0;width:0;background:var(--pink);animation:jt-pasek 2.4s steps(6) infinite}
.ladowanie::after{content:'GENERATING BULLSHIT…';position:relative;padding-left:8px}
@keyframes jt-pasek{to{width:100%}}

/* PRZEJŚCIE STRONY: darty papier (4 klatki) */
@keyframes jt-darcie{0%{clip-path:polygon(0 0,100% 0,100% 4%,82% 7%,61% 3%,40% 8%,18% 2%,0 6%);opacity:.6}33%{clip-path:polygon(0 0,100% 0,100% 40%,78% 46%,55% 38%,33% 47%,12% 39%,0 44%)}66%{clip-path:polygon(0 0,100% 0,100% 82%,80% 88%,57% 80%,36% 90%,14% 81%,0 87%)}100%{clip-path:polygon(0 0,100% 0,100% 100%,0 100%);opacity:1}}
main#view.enter>*{animation:jt-darcie .36s steps(4) backwards}

/* NAKLEJKI w sklepie i na profilu: przy najechaniu krótki wiggle (4 klatki) */
@keyframes jt-wiggle{0%,100%{rotate:0deg}25%{rotate:-7deg}50%{rotate:5deg}75%{rotate:-3deg}}
.sk2-k:hover img,.pf-deko:not(.edycja) .dk-n:hover,.odz:hover svg{animation:jt-wiggle .4s steps(4) 2}

/* wyłączanie */
body.malo-ruchu .kz-deko,body.malo-ruchu .rk2-kor,body.malo-ruchu .pf-kor,body.malo-ruchu .ft2-kot,body.malo-ruchu .ft2-szop,body.malo-ruchu .ft2-tv,
body.malo-ruchu .wl2-rac,body.malo-ruchu main#view.enter>*,body.malo-ruchu .ft2-scroll i,body.malo-ruchu .ladowanie::before{animation:none!important}
@media (prefers-reduced-motion:reduce){*{animation-duration:.001s!important;animation-iteration-count:1!important}}