/* ===== 打地鼠 · 地鼠工会 ===== */
.wm-panel { max-width: 720px; margin-left: auto; margin-right: auto; }

.wm-arena {
    position: relative;
    background: linear-gradient(180deg, #fef3c7 0%, #fde68a 100%);
    border-radius: 16px;
    padding: 18px;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    transition: filter .2s;
}
.wm-arena.strike { filter: grayscale(.45) brightness(.96); }

.wm-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    max-width: 520px;
    margin: 0 auto;
}

.wm-hole {
    position: relative;
    aspect-ratio: 1 / 0.82;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    overflow: hidden;
}

.wm-dirt {
    position: absolute;
    bottom: 4px;
    width: 82%;
    height: 30%;
    background: radial-gradient(ellipse at center, #92400e 0%, #78350f 60%, transparent 100%);
    border-radius: 50%;
    z-index: 1;
}

.wm-sock { position: absolute; bottom: -4px; width: 82%; height: 22%; background: inherit; z-index: 4; }

.wm-mole {
    position: absolute;
    bottom: 8%;
    width: 58%;
    aspect-ratio: 1/1.08;
    border: 0;
    padding: 0;
    background: transparent;
    cursor: pointer;
    z-index: 3;
    transform: translateY(115%);
    transition: transform .16s ease-out;
    border-radius: 40% 40% 18% 18%;
    background-image:
        radial-gradient(circle at 34% 30%, #fff 6%, transparent 7%),
        radial-gradient(circle at 66% 30%, #fff 6%, transparent 7%),
        radial-gradient(circle at 34% 31%, #111 3.4%, transparent 4.5%),
        radial-gradient(circle at 66% 31%, #111 3.4%, transparent 4.5%),
        radial-gradient(ellipse at 50% 62%, #fbbf24 26%, transparent 27%),
        linear-gradient(180deg, #a16207 0%, #854d0e 100%);
    box-shadow: inset 0 -8px 0 rgba(0,0,0,.14);
}

.wm-mole::before {
    content: '';
    position: absolute;
    top: -8%;
    left: 32%;
    width: 36%;
    height: 16%;
    background: inherit;
    border-radius: 50% 50% 0 0;
    background-image: none;
    background-color: #a16207;
    box-shadow: inset 0 -3px 0 rgba(0,0,0,.12);
}

/* 状态：冒头 */
.wm-hole.up .wm-mole { transform: translateY(6%); }

/* 金地鼠 */
.wm-mole.gold {
    background-image:
        radial-gradient(circle at 34% 30%, #fff 6%, transparent 7%),
        radial-gradient(circle at 66% 30%, #fff 6%, transparent 7%),
        radial-gradient(circle at 34% 31%, #111 3.4%, transparent 4.5%),
        radial-gradient(circle at 66% 31%, #111 3.4%, transparent 4.5%),
        radial-gradient(ellipse at 50% 62%, #fde68a 26%, transparent 27%),
        linear-gradient(180deg, #fbbf24 0%, #d97706 100%);
    box-shadow: 0 0 0 3px rgba(251, 191, 36, .45), inset 0 -8px 0 rgba(0,0,0,.12);
    animation: wm-gold .5s ease-in-out infinite alternate;
}

@keyframes wm-gold {
    from { filter: brightness(1); }
    to { filter: brightness(1.25); }
}

/* 炸弹 */
.wm-mole.bomb {
    background-image:
        radial-gradient(circle at 40% 26%, rgba(255,255,255,.55) 5%, transparent 7%),
        radial-gradient(circle at 50% 64%, #fca5a5 12%, transparent 13%),
        linear-gradient(180deg, #374151 0%, #111827 100%);
    box-shadow: inset 0 -8px 0 rgba(0,0,0,.3);
    animation: wm-bomb .5s ease-in-out infinite alternate;
}

@keyframes wm-bomb {
    from { filter: brightness(1); }
    to { filter: brightness(1.35); }
}

/* 罢工鼠：举着牌子 */
.wm-mole.strike {
    background-image:
        radial-gradient(circle at 34% 30%, #fff 6%, transparent 7%),
        radial-gradient(circle at 66% 30%, #fff 6%, transparent 7%),
        radial-gradient(circle at 34% 31%, #111 3.4%, transparent 4.5%),
        radial-gradient(circle at 66% 31%, #111 3.4%, transparent 4.5%),
        radial-gradient(ellipse at 50% 62%, #fca5a5 24%, transparent 25%),
        linear-gradient(180deg, #d6d3d1 0%, #a8a29e 100%);
    box-shadow: inset 0 -8px 0 rgba(0,0,0,.12), 0 0 0 2px rgba(120,113,108,.35);
    animation: wm-strike .4s ease-in-out infinite alternate;
}
.wm-mole.strike::after {
    content: "罢工";
    position: absolute;
    top: -26%;
    left: 50%;
    transform: translateX(-50%) rotate(-4deg);
    background: #fef08a;
    color: #92400e;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    padding: 3px 5px;
    border-radius: 4px;
    white-space: nowrap;
    box-shadow: 0 2px 4px rgba(0,0,0,.18);
    border: 1px solid #facc15;
}
@keyframes wm-strike {
    from { transform: translateY(6%) rotate(-2deg); }
    to { transform: translateY(6%) rotate(2deg); }
}

/* 安全帽：第一下会弹开 */
.wm-mole.helmet::after {
    content: "";
    position: absolute;
    top: -13%;
    left: 16%;
    width: 68%;
    height: 27%;
    background: linear-gradient(180deg, #fbbf24 0%, #d97706 100%);
    border-radius: 50% 50% 18% 18%;
    box-shadow: inset 0 -3px 0 rgba(120,53,15,.35), 0 2px 5px rgba(0,0,0,.2);
}

/* 救援鼠 */
.wm-mole.rescue {
    background-image:
        radial-gradient(circle at 34% 30%, #fff 6%, transparent 7%),
        radial-gradient(circle at 66% 30%, #fff 6%, transparent 7%),
        radial-gradient(circle at 34% 31%, #111 3.4%, transparent 4.5%),
        radial-gradient(circle at 66% 31%, #111 3.4%, transparent 4.5%),
        radial-gradient(ellipse at 50% 62%, #93c5fd 26%, transparent 27%),
        linear-gradient(180deg, #60a5fa 0%, #2563eb 100%);
    box-shadow: inset 0 -8px 0 rgba(0,0,0,.14), 0 0 0 2px rgba(37,99,235,.35);
}
.wm-mole.rescue::after {
    content: "🚑";
    position: absolute;
    top: -24%;
    right: -6%;
    font-size: 15px;
    line-height: 1;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,.3));
}

/* 被击中 */
.wm-hole.hit .wm-mole { transform: translateY(115%) scale(.7); transition: transform .18s ease-in; }
.wm-hole.hit .wm-dirt { animation: wm-dirt .25s ease-out; }

@keyframes wm-dirt {
    0% { transform: scale(1); }
    50% { transform: scale(1.18); }
    100% { transform: scale(1); }
}

/* 弹开（安全帽） */
.wm-mole.bounce { animation: wm-bounce .22s ease-out; }
@keyframes wm-bounce {
    0% { transform: translateY(6%) scale(1); }
    40% { transform: translateY(14%) scale(.94); }
    100% { transform: translateY(6%) scale(1); }
}

/* 眩晕 */
.wm-arena.stunned { filter: saturate(.4) blur(1px); }

/* 罢工横幅 */
.wm-strike-banner {
    position: absolute;
    left: 50%;
    top: 12px;
    transform: translateX(-50%);
    z-index: 30;
    padding: 6px 16px;
    border-radius: 99px;
    background: linear-gradient(90deg, #dc2626, #f97316);
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .5px;
    box-shadow: 0 6px 18px rgba(220,38,38,.4);
    animation: wm-banner .3s ease-out;
    pointer-events: none;
    white-space: nowrap;
}
.wm-strike-banner[hidden] { display: none; }
@keyframes wm-banner { from { opacity: 0; transform: translate(-50%, -8px); } to { opacity: 1; transform: translate(-50%, 0); } }

/* 开局日记 */
.wm-diary {
    position: absolute;
    left: 50%;
    bottom: 12px;
    transform: translateX(-50%);
    z-index: 26;
    max-width: 92%;
    padding: 8px 16px;
    border-radius: 12px;
    background: rgba(15,23,42,.88);
    color: #e5e7eb;
    font-size: 12.5px;
    line-height: 1.6;
    text-align: center;
    box-shadow: 0 8px 24px rgba(15,23,42,.35);
    pointer-events: none;
    animation: wm-di .3s ease-out;
}
.wm-diary[hidden] { display: none; }
.wm-diary b { color: #fbbf24; }
@keyframes wm-di { from { opacity: 0; transform: translate(-50%, 8px); } to { opacity: 1; transform: translate(-50%, 0); } }

.wm-pop {
    position: absolute;
    font-size: 21px;
    font-weight: 800;
    pointer-events: none;
    z-index: 30;
    animation: wm-pop .6s ease-out forwards;
    text-shadow: 0 2px 4px rgba(0,0,0,.18);
}

@keyframes wm-pop {
    0% { opacity: 0; transform: translateY(0) scale(.7); }
    25% { opacity: 1; transform: translateY(-16px) scale(1.15); }
    100% { opacity: 0; transform: translateY(-52px) scale(1); }
}

/* 锤子光标 */
.wm-arena.playing { cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='36' viewBox='0 0 36 36'%3E%3Ctext y='26' x='4' font-size='26'%3E🔨%3C/text%3E%3C/svg%3E") 6 6, pointer; }

@media (max-width: 560px) {
    .wm-arena { padding: 10px; }
    .wm-grid { gap: 8px; }
    .wm-diary { font-size: 11.5px; padding: 7px 12px; }
}
