/* Minty Swirl Themes 1.0 styles (skins: .mty-skin-dark/-light/-arcade/-pink-tech/-night-drive). Based on Minty Swirl 1.0 styles (Minty 3D v2.1 engine; wrapper pivots at the knots, y=17.4). Every rule is scoped under .mty-layer, so nothing leaks into the host page.
   Only transform and opacity animate. All nodes ignore the pointer. */
.mty-layer{position:absolute;inset:0;overflow:hidden;pointer-events:none!important;z-index:4;contain:layout paint}
.mty-layer *{pointer-events:none!important}
.mty{position:absolute;left:0;top:0;will-change:transform}
/* The clip box ends exactly at the feet line, so emerge/sink read as rising out of / sinking into the line.
   It is 2x wide and 2x tall so hops and a raised arm are never cut off. */
.mty-clip{position:absolute;left:-50%;top:-100%;width:200%;height:200%;overflow:hidden}
.mty-in{position:absolute;left:25%;bottom:0;width:50%;height:50%;transform-origin:50% 100%;will-change:transform}
.mty-svg{display:block;width:100%;height:100%;overflow:visible}

/* parts */
.mty-eyes{transform-box:fill-box;transform-origin:50% 50%}
.mty-eyes-happy,.mty-mouth-big,.mty-mouth-o{opacity:0}
.mty-oh .mty-mouth-s,.mty-oh .mty-mouth-big{opacity:0}
.mty-oh .mty-mouth-o{opacity:1}
.mty-happy .mty-eyes-open,.mty-happy .mty-mouth-s{opacity:0}
.mty-happy .mty-eyes-happy,.mty-happy .mty-mouth-big{opacity:1}
.mty-arm-r{transform-box:view-box;transform-origin:20.6px 17.4px}
.mty-arm-l{transform-box:view-box;transform-origin:3.4px 17.4px}
.mty-legs{transform-box:fill-box;transform-origin:50% 100%}
.mty-leg{transform-box:fill-box;transform-origin:50% 0}
.mty-leaf{transform-box:fill-box;transform-origin:0% 100%}
.mty-plain .mty-leaf{animation:mtyLeaf 1.6s ease-in-out infinite alternate}   /* Disney style: the leaf is a JS follow-through spring instead */
@keyframes mtyLeaf{from{transform:rotate(-10deg)}to{transform:rotate(12deg)}}
.mty-walk .mty-leg-l{animation:mtyLeg .3s ease-in-out infinite alternate}
.mty-walk .mty-leg-r{animation:mtyLeg .3s ease-in-out infinite alternate-reverse}
@keyframes mtyLeg{from{transform:rotate(-28deg)}to{transform:rotate(28deg)}}

/* v2 3D parts: moving highlight, props (coin, chart, sparkle) and the contact shadow (a sibling of the clip box, so it never clips) */
.mty-spec,.mty-prop{transform-box:view-box;transform-origin:0 0}
.mty-prop{opacity:0}
.mty-shadow{position:absolute;left:8%;top:90%;width:84%;height:20%;border-radius:50%;transform-origin:50% 50%;will-change:transform,opacity}
.mty-pixel .mty-shadow{left:15%;top:95%;width:70%;height:10%;border-radius:0}
/* tap target (line mode, or mount({tap:true})): the only node that takes the pointer, and only over Minty himself */
.mty-hit{position:absolute;left:12%;top:6%;width:76%;height:90%;border-radius:45%}
.mty-tap .mty-hit{pointer-events:auto!important;cursor:pointer;-webkit-tap-highlight-color:transparent}
/* line mode with no container: a click-through fixed host that exists only while Minty is out */
.mty-host{position:fixed;inset:0;pointer-events:none!important;z-index:40;contain:layout paint}

/* pixel (arcade): frame swaps, stepped timing, no rotation smoothing */
.mty-pixel.mty-plain .mty-leaf{animation:mtyPxLeaf 1.2s steps(1) infinite}
@keyframes mtyPxLeaf{50%{transform:translateX(1px)}}
.mty-pixel .mty-leg-b,.mty-pixel .mty-f-up,.mty-pixel .mty-f-out{opacity:0}
.mty-pixel .mty-walk .mty-leg-a{animation:mtyF1 .36s steps(1) infinite}
.mty-pixel .mty-walk .mty-leg-b{animation:mtyF2 .36s steps(1) infinite}
.mty-pixel .mty-walk .mty-leg-l,.mty-pixel .mty-walk .mty-leg-r{animation:none}
@keyframes mtyF1{50%{opacity:0}}
@keyframes mtyF2{0%{opacity:0}50%{opacity:1}}

/* tab hidden: freeze CSS loops (the JS loop also holds still) */
.mty-paused,.mty-paused *{animation-play-state:paused!important}
/* belt and braces: the JS creates nothing under reduced motion, but if a layer exists, hide it */
@media (prefers-reduced-motion:reduce){.mty-layer{display:none!important}.mty-layer *{animation:none!important}}

/* v2.1 wander mode: fades out for breaks, dialogs and lost perches; no tap target while travelling or away */
.mty-layer.mty-wander{transition:opacity .35s ease}
.mty-layer.mty-wander.mty-away{opacity:0}
.mty-layer.mty-wander.mty-away .mty-hit,.mty-layer.mty-wander.mty-moving .mty-hit{pointer-events:none!important;cursor:default}
.mty-safe{position:fixed;left:0;top:0;width:0;height:0;visibility:hidden;pointer-events:none;padding:0 env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px)}

/* Swirl: at small sizes drop hairlines + sugar specks so he stays crisp instead of mushy */
.mty-layer.mty-sm .mty-fine{display:none}

/* ---- theme skins ---- */
/* Light: soft drop shadow so the white candy reads on a light page */
.mty-skin-light .mty-svg{filter:drop-shadow(0 .6px .9px rgba(13,26,20,.28))}
/* Arcade: chunky pixels, CRT phosphor glow, knot pivots on the pixel grid */
.mty-skin-arcade .mty-svg{shape-rendering:crispEdges;filter:drop-shadow(0 0 1.2px rgba(61,220,151,.75)) drop-shadow(0 0 3px rgba(169,180,255,.35))}
.mty-skin-arcade .mty-arm-r{transform-origin:21px 17.75px}
.mty-skin-arcade .mty-arm-l{transform-origin:3px 17.75px}
/* Pink Circuit: neon glow + a slow blinking status LED */
.mty-skin-pink-tech .mty-svg{filter:drop-shadow(0 0 1.5px rgba(255,62,165,.45))}
.mty-skin-pink-tech .mty-led{animation:mtyLed 2.4s steps(1) infinite}
/* Night Drive: dual pink/cyan neon outline + status LED */
.mty-skin-night-drive .mty-svg{filter:drop-shadow(0 0 1.5px rgba(255,45,149,.5)) drop-shadow(0 0 2.5px rgba(0,232,255,.4))}
.mty-skin-night-drive .mty-led{animation:mtyLed 2.4s steps(1) infinite}
@keyframes mtyLed{0%,70%{opacity:1}71%,100%{opacity:.25}}
/* v2.3 dance props (mint heart + music note). Only transform/opacity animate; a soft glow on the dark skins, crisp pixels in Arcade. */
.mty-skin-dark .mty-p-heart,.mty-skin-dark .mty-p-note,.mty-skin-pink-tech .mty-p-heart,.mty-skin-pink-tech .mty-p-note,.mty-skin-night-drive .mty-p-heart,.mty-skin-night-drive .mty-p-note{filter:drop-shadow(0 0 .7px rgba(61,220,151,.9))}
.mty-skin-arcade .mty-p-heart,.mty-skin-arcade .mty-p-note{shape-rendering:crispEdges}
/* dance 2 detail layers: hidden unless the dance drives them (transform + opacity only) */
.mty-dfx,.mty-dface{opacity:0}
.mty-dwink .mty-eyes{opacity:0}.mty-dwink .mty-d-wink{opacity:1}
.mty-dsmile .mty-mouth{opacity:0}.mty-dsmile .mty-d-smile{opacity:1}
.mty-d-wink{transform-box:view-box}
.mty-floor{position:absolute;left:-40%;top:80%;width:180%;height:40%;pointer-events:none;opacity:0;will-change:opacity}
.mty-floor svg{display:block;width:100%;height:100%;overflow:visible}
.mty-skin-pink-tech .mty-fc1,.mty-skin-pink-tech .mty-fc2{filter:drop-shadow(0 0 .6px #ff3ea5)}
.mty-skin-night-drive .mty-fc1,.mty-skin-night-drive .mty-fc2{filter:drop-shadow(0 0 .6px #ff2d95) drop-shadow(0 0 .8px #00e8ff)}
.mty-skin-dark .mty-p-note2,.mty-skin-dark .mty-p-note3,.mty-skin-pink-tech .mty-p-note2,.mty-skin-pink-tech .mty-p-note3,.mty-skin-night-drive .mty-p-note2,.mty-skin-night-drive .mty-p-note3,.mty-skin-dark .mty-d-trail,.mty-skin-pink-tech .mty-d-trail,.mty-skin-night-drive .mty-d-trail{filter:drop-shadow(0 0 .6px rgba(61,220,151,.85))}
.mty-skin-arcade .mty-p-note2,.mty-skin-arcade .mty-p-note3{shape-rendering:crispEdges}
/* v2.4.0 moves props: soft glow on dark/pink, crisp pixels on Arcade */
.mty-skin-dark .mty-p-rocket,.mty-skin-dark .mty-p-chute,.mty-skin-dark .mty-p-board,.mty-skin-pink-tech .mty-p-rocket,.mty-skin-pink-tech .mty-p-chute,.mty-skin-pink-tech .mty-p-board,.mty-skin-night-drive .mty-p-rocket,.mty-skin-night-drive .mty-p-chute,.mty-skin-night-drive .mty-p-board{filter:drop-shadow(0 0 .6px rgba(61,220,151,.75))}
.mty-skin-dark .mty-p-flame,.mty-skin-pink-tech .mty-p-flame,.mty-skin-night-drive .mty-p-flame,.mty-skin-dark .mty-p-mcoin,.mty-skin-pink-tech .mty-p-mcoin,.mty-skin-night-drive .mty-p-mcoin{filter:drop-shadow(0 0 .8px rgba(255,212,0,.85))}
.mty-skin-arcade .mty-p-rocket,.mty-skin-arcade .mty-p-flame,.mty-skin-arcade .mty-p-chute,.mty-skin-arcade .mty-p-board,.mty-skin-arcade .mty-p-puff,.mty-skin-arcade .mty-p-mcoin{shape-rendering:crispEdges}