/* ============ HOPPER — mascote ============ */
.mz-wrap { position: relative; }
.mz { display: block; width: 100%; height: 100%; overflow: visible; }
.mz * { transform-box: view-box; }
.mz .m-char { transform-origin: 130px 256px; animation: m-breathe 3.4s ease-in-out infinite; }
.mz .m-head { transform-origin: 130px 186px; }
.mz .m-armR { transform-origin: 172px 188px; transform: rotate(-14deg); transition: transform .5s cubic-bezier(.3, 1.4, .5, 1); }
.mz .m-armL { transform-origin: 94px 186px; transition: transform .4s; }
.mz .m-pupil { transition: transform .12s ease-out; }
.mz .m-lid { transform: translateY(0); transition: transform .12s ease-in-out; }
.mz .m-happy { opacity: 0; transition: opacity .15s; }
.mz .m-eye { transition: opacity .15s; }
.mz .m-mouth > * { opacity: 0; transition: opacity .15s; }
.mz .mo-smile { opacity: 1; }
.mz .m-lamp { opacity: .55; transform-origin: 130px 44px; animation: m-lamp 2.4s ease-in-out infinite; }
.mz .m-spark { opacity: 0; }
.mz .m-sweat, .mz .m-zzz { opacity: 0; }
.mz.no-scene .m-rock, .mz.no-scene .m-shadow { display: none; }
.mz.blink .m-lid { transform: translateY(50px); }

@keyframes m-breathe { 50% { transform: scale(1.015, .985); } }
@keyframes m-lamp { 50% { opacity: .9; transform: scale(1.12); } }

/* minerando */
.mz.st-mining .m-char { animation: m-bob .8s ease-in-out infinite; }
.mz.st-mining .m-head { animation: m-nod .8s ease-in-out infinite; }
.mz.st-mining .m-armR { animation: m-swing .8s cubic-bezier(.55, 0, .35, 1) infinite; }
.mz.st-mining .m-spark { animation: m-spark .8s ease-out infinite; }
.mz.st-mining .m-spark:nth-child(2) { animation-delay: .03s; }
.mz.st-mining .m-spark:nth-child(3) { animation-delay: .06s; }
.mz.st-mining .m-rock { animation: m-rock .8s ease-out infinite; transform-origin: 230px 254px; }
@keyframes m-bob { 0%, 100% { transform: translateY(0); } 40% { transform: translateY(-4px); } 58% { transform: translateY(2px) scale(1.012, .985); } }
@keyframes m-nod { 0%, 100% { transform: rotate(0); } 40% { transform: rotate(-2.5deg); } 58% { transform: rotate(3deg) translateY(2px); } }
@keyframes m-swing { 0% { transform: rotate(-26deg); } 42% { transform: rotate(-38deg); } 58% { transform: rotate(76deg); } 68% { transform: rotate(68deg); } 100% { transform: rotate(-26deg); } }
@keyframes m-spark { 0%, 56% { opacity: 0; transform: translate(0, 0) scale(.6); } 60% { opacity: 1; transform: translate(0, 0) scale(1); } 100% { opacity: 0; transform: translate(var(--dx), -30px) scale(.4); } }
@keyframes m-rock { 0%, 56%, 100% { transform: none; } 60% { transform: scale(1.04, .94); } 70% { transform: rotate(-2deg); } }

/* turbo */
.mz.st-boost .m-char { animation: m-bob .38s ease-in-out infinite; }
.mz.st-boost .m-head { animation: m-nod .38s ease-in-out infinite; }
.mz.st-boost .m-armR { animation: m-swing .38s cubic-bezier(.55, 0, .35, 1) infinite; }
.mz.st-boost .m-spark { animation: m-spark .38s ease-out infinite; }
.mz.st-boost .m-rock { animation: m-rock .38s ease-out infinite; transform-origin: 230px 254px; }
.mz.st-boost .m-lamp { animation-duration: .5s; opacity: 1; }
.mz.st-boost .m-sweat { opacity: 1; animation: m-sweat .9s ease-in infinite; }
.mz.st-boost .mo-smile { opacity: 0; }
.mz.st-boost .mo-o { opacity: 1; }
.mz.st-boost .m-lid { transform: translateY(12px); }
@keyframes m-sweat { 0% { transform: translateY(-4px); opacity: 0; } 20% { opacity: 1; } 100% { transform: translateY(16px); opacity: 0; } }

/* pausado (dormindo) */
.mz.st-paused .m-char { animation: m-breathe 4.6s ease-in-out infinite; }
.mz.st-paused .m-armR { transform: rotate(70deg); }
.mz.st-paused .m-lid { transform: translateY(46px); }
.mz.st-paused .m-head { transform: rotate(-4deg) translateY(3px); transition: transform .5s; }
.mz.st-paused .m-lamp { opacity: 0; animation: none; }
.mz.st-paused .mo-smile { opacity: 0; }
.mz.st-paused .mo-flat { opacity: 1; }
.mz.st-paused .m-zzz { opacity: 1; }
.mz.st-paused .m-zzz text { animation: m-z 2.4s ease-in-out infinite; }
.mz.st-paused .m-zzz text:nth-child(2) { animation-delay: .4s; }
.mz.st-paused .m-zzz text:nth-child(3) { animation-delay: .8s; }
@keyframes m-z { 0% { opacity: 0; transform: translate(-6px, 8px); } 30% { opacity: 1; } 100% { opacity: 0; transform: translate(8px, -10px); } }

/* reações */
.mz.re-happy .m-char, .mz.re-dance .m-char { animation: m-jump .55s cubic-bezier(.3, .7, .4, 1) 3; }
.mz.re-dance .m-char { animation: m-sway .5s ease-in-out 4; }
.mz.re-happy .m-eye, .mz.re-dance .m-eye { opacity: 0; }
.mz.re-happy .m-happy, .mz.re-dance .m-happy { opacity: 1; }
.mz.re-happy .m-mouth > *, .mz.re-dance .m-mouth > * { opacity: 0; }
.mz.re-happy .m-mouth .mo-open, .mz.re-dance .m-mouth .mo-open { opacity: 1; }
.mz.re-dance .m-armL { animation: m-wave .5s ease-in-out 4; }
.mz.re-happy .m-armL { transform: rotate(-125deg); }
@keyframes m-jump { 0%, 100% { transform: translateY(0) scale(1); } 15% { transform: translateY(2px) scale(1.04, .94); } 50% { transform: translateY(-22px) scale(.97, 1.04); } 85% { transform: translateY(1px) scale(1.03, .96); } }
@keyframes m-sway { 0%, 100% { transform: rotate(0) translateY(0); } 25% { transform: rotate(-7deg) translateY(-6px); } 75% { transform: rotate(7deg) translateY(-6px); } }
@keyframes m-wave { 0%, 100% { transform: rotate(-110deg); } 50% { transform: rotate(-150deg); } }

.mz-fx { position: absolute; left: 50%; top: 42%; width: 0; height: 0; pointer-events: none; }
.mz-fx i { position: absolute; width: 9px; height: 5px; border: 1.5px solid var(--ink); border-radius: 2px; animation: m-conf 1.2s cubic-bezier(.15, .8, .4, 1) forwards; }
.mz-fx i.round { width: 7px; height: 7px; border-radius: 50%; }
@keyframes m-conf { 0% { transform: translate(0, 0) rotate(0); opacity: 1; } 70% { opacity: 1; } 100% { transform: translate(var(--x), calc(var(--y) + 60px)) rotate(var(--r)); opacity: 0; } }
