/* 第 11 关：Anti-Hero 屋顶接酒，作用域 .mn */
.mn{position:absolute;inset:0;overflow:hidden;background:#0b1533;touch-action:none;user-select:none}
.mn-bg{position:absolute;inset:0}
.mn-bg .art{width:100%;height:100%}

/* 巨人：站在房子右边，只露上半身 */
.mn-giant{position:absolute;left:186px;top:88px;width:240px;height:560px;z-index:2;transform-origin:110px 540px;transition:transform .15s}
.mn-giant .arm-drink{display:none}
.mn-giant.drink .arm-drink{display:block}
.mn-giant.drink .arm-idle{display:none}
.mn-giant .head{transform-box:fill-box;transform-origin:50% 90%;transition:transform .25s}
.mn-giant.drink .head{transform:rotate(-14deg)}
.mn-giant.oops .head{transform:rotate(8deg)}
.mn-giant.oops{filter:saturate(.6)}
.mn-giant.grab{transform:translateX(-6px)}
.mn-giant.cheers .arm-drink{display:block}
.mn-giant.cheers .arm-idle{display:none}
.mn-giant.cheers{animation:mncheer .6s ease-in-out infinite alternate}
@keyframes mncheer{from{transform:translateY(0)}to{transform:translateY(-8px)}}

/* 房子 + 屋顶女生 */
.mn-house{position:absolute;left:-30px;top:262px;width:300px;height:360px;z-index:3;filter:drop-shadow(0 -6px 10px rgba(0,0,0,.45))}
.mn-girl{position:absolute;width:80px;height:80px;z-index:4;filter:drop-shadow(0 3px 3px rgba(0,0,0,.5))}
.mn-girl.a{left:52px;top:252px}
.mn-girl.b{left:108px;top:262px;transform:scaleX(-1) translateX(-6px);transform-origin:center}
.mn-girl .toss{display:none}
.mn-girl.toss .toss{display:block}
.mn-girl.toss .idle{display:none}
.mn-girl.wobble{animation:mnwob .5s ease-in-out}
@keyframes mnwob{25%{transform:rotate(-6deg)}75%{transform:rotate(6deg)}}
.mn-girl.b.wobble{animation:mnwobb .5s ease-in-out}
@keyframes mnwobb{25%{transform:scaleX(-1) translateX(-6px) rotate(-6deg)}75%{transform:scaleX(-1) translateX(-6px) rotate(6deg)}}
.mn-crate{position:absolute;left:8px;top:296px;width:60px;height:34px;z-index:4;filter:drop-shadow(0 3px 3px rgba(0,0,0,.5))}
.mn-crate-n{position:absolute;left:0;top:-20px;font-size:13px;font-weight:900;color:#ffd166;text-shadow:0 1px 2px #000;white-space:nowrap}

/* 飞行中的酒瓶 */
.mn-fly{position:absolute;inset:0;pointer-events:none;z-index:5}
.mn-bottle{position:absolute;left:0;top:0;width:24px;height:64px;margin:-32px 0 0 -12px;filter:drop-shadow(0 4px 3px rgba(0,0,0,.5))}
.mn-bottle.fall{animation:mnfall .5s ease-in forwards}
@keyframes mnfall{to{transform:translate(var(--fx),600px) rotate(200deg)}}
.mn-bottle.tomouth{animation:mnmouth .4s ease-out forwards}
@keyframes mnmouth{from{transform:translate(214px,318px) rotate(0)}to{transform:translate(318px,142px) rotate(-40deg);opacity:0}}

/* 特效 */
.mn-fx{position:absolute;inset:0;pointer-events:none;z-index:6}
.mn-pow{position:absolute;transform:translate(-50%,-50%);font-size:26px;font-weight:900;color:#fff;-webkit-text-stroke:1.5px #1c1c30;paint-order:stroke fill;text-shadow:3px 3px 0 #1c1c30;white-space:nowrap;animation:mnpow .8s ease-out forwards}
.mn-pow.perfect{color:#ffd166;font-size:30px}
.mn-pow.bad{color:#ff6b6b}
.mn-pow.q{color:#bbb;font-size:20px}
@keyframes mnpow{from{transform:translate(-50%,-50%) scale(.4)}40%{transform:translate(-50%,-60%) scale(1.15);opacity:1}to{transform:translate(-50%,-110%) scale(1);opacity:0}}
.mn-shards{position:absolute;width:0;height:0}
.mn-shards i{position:absolute;left:-3px;top:-6px;width:6px;height:12px;background:linear-gradient(#c98a4a,#5a2c0a);border:1px solid #2a1606;transform:rotate(var(--a));animation:mnshard .8s ease-out forwards}
@keyframes mnshard{to{transform:rotate(var(--a)) translateY(calc(var(--d) * -1)) rotate(120deg);opacity:0}}
.mn-shards u{position:absolute;left:-30px;top:-6px;width:60px;height:12px;border-radius:50%;background:radial-gradient(rgba(180,120,60,.7),rgba(180,120,60,0) 70%);animation:mnpuddle .9s ease-out forwards}
@keyframes mnpuddle{from{transform:scale(.3)}to{transform:scale(1.4);opacity:0}}

/* 扔酒进度条 */
.mn-bar{position:absolute;left:40px;top:22px;width:280px;height:28px;border:3px solid #1c1c30;border-radius:999px;background:linear-gradient(#2a3150,#141a30);box-shadow:3px 3px 0 #1c1c30,inset 0 2px 4px rgba(0,0,0,.6);z-index:8;opacity:.45;transition:opacity .2s}
.mn.barring .mn-bar{opacity:1}
.mn-zone{position:absolute;top:0;bottom:0;background:linear-gradient(#ffe08a,#f4a53a);border-left:2px solid #1c1c30;border-right:2px solid #1c1c30;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:900;color:#1c1c30;transition:left .2s,width .2s}
.mn-zone.hot{background:linear-gradient(#b8ffb0,#2ec27e);box-shadow:0 0 12px #7cffb0}
.mn-marker{position:absolute;left:0;top:-12px;width:20px;height:52px;margin-left:-10px;filter:drop-shadow(0 2px 2px rgba(0,0,0,.6))}
.mn-hud{position:absolute;left:0;right:0;top:58px;text-align:center;color:#fff;font-weight:900;font-size:14px;text-shadow:0 1px 3px #000;z-index:8}

/* 气泡 / 提示 */
.mn-say{position:absolute;left:30px;top:196px;background:#fff;color:#1c1c30;font-weight:900;font-size:14px;padding:6px 12px;border-radius:999px;border:3px solid #1c1c30;box-shadow:3px 3px 0 #1c1c30;opacity:0;transition:opacity .1s;z-index:9;white-space:nowrap;pointer-events:none}
.mn-say.b{left:80px;top:206px}
.mn-say::after{content:'';position:absolute;left:22px;bottom:-11px;border:6px solid transparent;border-top-color:#1c1c30;border-bottom:0}
.mn-say.on{opacity:1}
.mn-cue{position:absolute;left:0;right:0;top:118px;text-align:center;font-size:34px;font-weight:900;color:#fff;-webkit-text-stroke:2px #1c1c30;paint-order:stroke fill;text-shadow:4px 4px 0 #1c1c30;opacity:0;z-index:9;pointer-events:none}
.mn-cue.on{animation:mncue .7s ease-out forwards}
@keyframes mncue{from{opacity:0;transform:scale(.4) rotate(-8deg)}30%{opacity:1;transform:scale(1.1) rotate(-4deg)}to{opacity:1;transform:scale(1) rotate(-4deg)}}
.mn-tutor{position:absolute;left:50%;top:86px;transform:translateX(-50%);background:rgba(0,0,0,.62);color:#ffd166;font-weight:900;font-size:14px;padding:8px 16px;border-radius:12px;text-align:center;line-height:1.4;z-index:9;transition:opacity .3s;pointer-events:none;white-space:nowrap}
.mn-tutor small{color:#fff;font-size:12px}
.mn-tutor.off{opacity:0}

.mn:has(.mn-giant.anticipate) .mn-catch-ring{opacity:.55}.mn-giant.ready-hand{filter:drop-shadow(0 0 4px #f4d89f)}
