/* FLF Magic Man – Interaktion */
.mm-click{cursor:pointer;transition:transform .2s}
.mm-click:hover{transform:translateY(-4px) rotate(-2deg)}
.mm-click:focus-visible{outline:3px solid #d6b77f;outline-offset:4px;border-radius:12px}
.mm-dance{animation:mm-dance 1.3s ease-in-out!important;transform-origin:50% 100%}
.mm-dance-long{animation:mm-dance 1.3s ease-in-out 4!important;transform-origin:50% 100%}
@keyframes mm-dance{
 0%{transform:translateY(0) rotate(0)}
 12%{transform:translateY(-22px) rotate(-8deg)}
 25%{transform:translateY(0) rotate(0) scale(1.04,.96)}
 37%{transform:translateY(-22px) rotate(8deg)}
 50%{transform:translateY(0) rotate(0) scale(1.04,.96)}
 62%{transform:translateY(-30px) rotate(-6deg) scale(1.03)}
 75%{transform:translateY(-30px) rotate(6deg) scale(1.03)}
 88%{transform:translateY(0) rotate(0) scale(1.05,.95)}
 100%{transform:translateY(0) rotate(0)}}
.mm-spark{position:fixed;z-index:9999;pointer-events:none;width:7px;height:7px;border-radius:50%;background:#ffd37a;box-shadow:0 0 10px 3px rgba(255,200,90,.75);
 color:#ffd37a;font-size:14px;line-height:7px;text-align:center;animation:mm-spark 1.1s ease-out forwards}
.mm-spark:not(:empty){background:none;box-shadow:none;text-shadow:0 0 8px rgba(255,200,90,.9)}
@keyframes mm-spark{0%{opacity:1;transform:translate(0,0) scale(1)}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.3)}}
.mm-bubble{position:fixed;z-index:9998;background:#fff;color:#15213a;border:2px solid #b8904f;border-radius:16px;padding:12px 14px 10px;box-shadow:0 16px 40px rgba(14,26,47,.25);
 font:500 .95rem/1.45 "Segoe UI",system-ui,Arial,sans-serif;opacity:0;transform:translateY(8px) scale(.96);pointer-events:none;transition:opacity .2s,transform .2s}
.mm-bubble.show{opacity:1;transform:none;pointer-events:auto}
.mm-bubble p{margin:0 0 8px}
.mm-ton{font:inherit;font-size:.78rem;background:#f6efe3;border:0;border-radius:999px;padding:3px 10px;cursor:pointer;color:#6b5634}
.mm-ton:hover{background:#efe3cc}
.mm-ton[aria-pressed="true"]{background:#b8904f;color:#fff}
.mm-float{position:fixed;right:clamp(10px,2vw,24px);bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:50;width:84px;transition:opacity .3s,transform .3s}
.mm-figure{display:block;background:none;border:0;padding:0;cursor:grab;width:100%}
.mm-float img{width:100%;height:auto;filter:drop-shadow(0 10px 14px rgba(14,26,47,.35))}
.mm-float.away{opacity:0;transform:translateY(20px);pointer-events:none}
@media (max-width:560px){.mm-float{width:62px}}
.mm-party{position:fixed;inset:0;z-index:9990;display:grid;place-items:center;background:rgba(14,26,47,.55);backdrop-filter:blur(2px);opacity:0;transition:opacity .25s;padding:16px}
.mm-party.show{opacity:1}
.mm-party-inner{background:#fff;border-radius:22px;padding:24px 26px 22px;max-width:380px;text-align:center;box-shadow:0 30px 80px rgba(0,0,0,.35);display:grid;gap:12px;justify-items:center}
.mm-party-inner img{width:150px;height:auto}
.mm-party-inner p{margin:0;font:500 1.05rem/1.5 "Segoe UI",system-ui,Arial,sans-serif;color:#15213a}
@media (prefers-reduced-motion:reduce){.mm-dance,.mm-dance-long{animation:none!important}.mm-click:hover{transform:none}}
.mm-dragging,.mm-dragging *{cursor:grabbing!important;transition:none!important}
.mm-dragging img{animation:none!important;transform:scale(1.08) rotate(-4deg)}
.magic-btn{cursor:grab}

/* Drehen, Salto, Winken */
.mm-spin{animation:mm-spin 1.2s cubic-bezier(.4,0,.2,1)!important;transform-origin:50% 60%}
@keyframes mm-spin{0%{transform:rotate(0) scale(1)}30%{transform:translateY(-20px) rotate(200deg) scale(1.08)}70%{transform:translateY(-10px) rotate(360deg) scale(1.05)}100%{transform:rotate(360deg) scale(1)}}
.mm-flip{animation:mm-flip 1.2s ease-in-out!important;transform-origin:50% 50%}
@keyframes mm-flip{0%{transform:translateY(0) scaleX(1)}25%{transform:translateY(-26px) scaleX(-1)}50%{transform:translateY(0) scaleX(-1)}75%{transform:translateY(-26px) scaleX(1)}100%{transform:translateY(0) scaleX(1)}}
.mm-wave{animation:mm-wave .4s ease-in-out 4;transform-origin:50% 100%}
@keyframes mm-wave{0%,100%{transform:rotate(0)}50%{transform:rotate(-10deg)}}
/* Schließen und zurückholen */
.mm-close{position:absolute;top:-6px;left:-6px;width:24px;height:24px;border-radius:50%;border:0;background:#0e1a2f;color:#fff;font:700 15px/24px Arial,sans-serif;cursor:pointer;opacity:0;transition:opacity .2s;box-shadow:0 4px 10px rgba(0,0,0,.25);z-index:2;padding:0}
.mm-float:hover .mm-close,#magic:hover .mm-close,.mm-close:focus-visible{opacity:1}
@media (hover:none){.mm-close{opacity:.85}}
#magic{position:fixed}
#magic .mm-close{top:auto;bottom:calc(100% - 8px);left:auto;right:64px}
.mm-off{display:none!important}
.mm-return{position:fixed;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:50;border:0;border-radius:999px;background:#0e1a2f;color:#d6b77f;font:600 .8rem "Segoe UI",system-ui,Arial,sans-serif;padding:.5em 1em;cursor:pointer;box-shadow:0 8px 20px rgba(14,26,47,.3)}
.mm-return[hidden]{display:none}
/* Vorbeiflitzen */
.mm-flyby{position:fixed;left:0;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:9997;width:110px;pointer-events:none;animation:mm-fly 4.2s linear forwards}
.mm-flyby img{width:100%;height:auto;filter:drop-shadow(0 10px 14px rgba(14,26,47,.35));animation:mm-hopwalk .5s ease-in-out infinite}
.mm-fly-bubble{position:absolute;bottom:100%;left:50%;transform:translateX(-30%);width:max-content;max-width:min(260px,70vw);background:#fff;color:#15213a;border:2px solid #b8904f;border-radius:14px;padding:8px 12px;margin-bottom:4px;font:600 .88rem/1.35 "Segoe UI",system-ui,Arial,sans-serif;box-shadow:0 10px 26px rgba(14,26,47,.25)}
@keyframes mm-fly{0%{transform:translateX(-130px)}100%{transform:translateX(calc(100vw + 20px))}}
@keyframes mm-hopwalk{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-12px) rotate(3deg)}}
@media (max-width:560px){.mm-flyby{width:80px}}
@media (prefers-reduced-motion:reduce){.mm-spin,.mm-flip,.mm-wave{animation:none!important}}