.game-v3-menu-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 12px;
    margin: 18px 2px 10px;
}

.game-v3-menu-head h4,
.game-v3-menu-head p {
    margin: 0;
}

.game-v3-menu-head h4 {
    color: #12233c;
    font-size: 20px;
}

.game-v3-menu-head p {
    color: #66758a;
    font-size: 12px;
}

.game-v3-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.game-v3-card {
    position: relative;
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    align-items: center;
    min-height: 106px;
    padding: 10px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--v3-accent) 28%, #dce5ed);
    border-radius: 8px;
    background: linear-gradient(135deg, #fff 20%, var(--v3-soft));
    color: #17243a;
    text-align: left;
    box-shadow: 0 5px 0 color-mix(in srgb, var(--v3-accent) 13%, #dce3e9);
    cursor: pointer;
    touch-action: manipulation;
}

.game-v3-card:active {
    transform: translateY(3px);
    box-shadow: 0 2px 0 color-mix(in srgb, var(--v3-accent) 13%, #dce3e9);
}

.game-v3-card img {
    width: 68px;
    height: 78px;
    object-fit: contain;
    object-position: center bottom;
    filter: drop-shadow(0 5px 5px rgba(20, 40, 70, .14));
}

.game-v3-card-copy {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 3px;
    min-width: 0;
}

.game-v3-card b {
    color: var(--v3-accent);
    font-size: 10px;
    letter-spacing: .08em;
}

.game-v3-card strong {
    font-size: 15px;
    line-height: 1.3;
}

.game-v3-card small {
    color: #627086;
    font-size: 11px;
    line-height: 1.35;
}

.game-v3-card .game-v3-arrow {
    position: absolute;
    right: 8px;
    bottom: 7px;
    display: grid;
    width: 25px;
    height: 25px;
    place-items: center;
    border-radius: 50%;
    background: #fff;
    color: var(--v3-accent);
    font-size: 18px;
    box-shadow: 0 2px 6px rgba(24, 42, 68, .12);
}

.game-v3-card[data-game-v3="bell"] { --v3-accent: #d83b36; --v3-soft: #fff0dc; }
.game-v3-card[data-game-v3="bazooka"] { --v3-accent: #e05c34; --v3-soft: #fff0d7; }
.game-v3-card[data-game-v3="pk"] { --v3-accent: #1666c5; --v3-soft: #e6f2ff; }
.game-v3-card[data-game-v3="whack"] { --v3-accent: #198462; --v3-soft: #e4f8ed; }
.game-v3-card[data-game-v3="homerun"] { --v3-accent: #b36b05; --v3-soft: #fff4d2; }
.game-v3-card[data-game-v3="billiards"] { --v3-accent: #147466; --v3-soft: #ddf7f2; }

.game-version-block {
    margin-top: 14px;
    border: 1px solid #dde4e9;
    border-radius: 7px;
    background: #fff;
}

.game-version-block > summary {
    padding: 12px 14px;
    color: #425169;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
}

.game-version-block > div {
    padding: 0 10px 12px;
}

body[data-game-version="v3"] :is(#screen-bazooka .bazooka-hero, #screen-whack .whack-hero, #screen-homerun .stadium-hero, #screen-pk .stadium-hero, #screen-billiards .billiards-hero)::before {
    content: "V3 / SIMPLE EDITION";
    display: inline-flex;
    margin-bottom: 5px;
    padding: 4px 8px;
    border-radius: 999px;
    background: #17243a;
    color: #fff;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .06em;
}

body[data-game-version="v3"] :is(#screen-bazooka, #screen-whack, #screen-homerun, #screen-pk, #screen-billiards) :is(.bazooka-game-shell, .whack-game-shell, .stadium-game-shell, .billiards-game-shell) {
    max-width: 920px;
    margin-inline: auto;
}

body[data-game-version="v3"] #screen-bazooka .bazooka-tap-button {
    min-width: 132px;
    min-height: 132px;
    border: 6px solid rgba(255, 255, 255, .82);
    background: linear-gradient(180deg, #ff7a3e, #e64325);
    box-shadow: 0 9px 0 #a62f1e, 0 14px 25px rgba(166, 47, 30, .24);
    font-size: 24px;
}

body[data-game-version="v3"] #screen-bazooka .bazooka-tap-button.is-charging {
    animation: v3TapPulse .32s ease-in-out infinite alternate;
}

body[data-game-version="v3"] #screen-pk .pk-kicker,
body[data-game-version="v3"] #screen-pk .pk-keeper,
body[data-game-version="v3"] #screen-homerun :is(.homerun-pitcher, .homerun-batter),
body[data-game-version="v3"] #screen-billiards .billiards-cue-chinanago {
    object-fit: contain;
    object-position: center bottom;
}

body[data-game-version="v3"] #screen-pk :is(.pk-kicker, .pk-keeper) {
    position: absolute;
}

body[data-game-version="v3"] #screen-pk .pk-keeper {
    top: 45px;
    right: auto;
    bottom: auto;
    left: 50%;
    width: 112px;
    height: 132px;
    transform: translateX(-50%);
    transform-origin: 50% 90%;
}

body[data-game-version="v3"] #screen-pk .pk-keeper.is-stretch-left,
body[data-game-version="v3"] #screen-pk .pk-keeper.is-stretch-right {
    top: 18px;
    right: auto;
    bottom: auto;
    width: min(78vw, 360px);
    height: min(38vw, 175px);
    animation: v3KeeperPop .24s cubic-bezier(.15, 1.2, .25, 1);
}

body[data-game-version="v3"] #screen-pk .pk-keeper.is-stretch-left {
    right: auto;
    left: 50%;
    transform: translateX(-88%);
    transform-origin: 88% 88%;
}

body[data-game-version="v3"] #screen-pk .pk-keeper.is-stretch-right {
    right: auto;
    left: 50%;
    transform: translateX(-12%);
    transform-origin: 12% 88%;
}

body[data-game-version="v3"] #screen-pk .pk-keeper.is-stretch-center {
    top: -72px;
    right: auto;
    bottom: auto;
    left: 50%;
    width: min(46vw, 190px);
    height: min(72vw, 260px);
    transform: translateX(-50%);
    transform-origin: 50% 92%;
    animation: v3KeeperPop .24s cubic-bezier(.15, 1.2, .25, 1);
}

body[data-game-version="v3"] #screen-pk .pk-kicker {
    right: 4%;
    left: auto;
    bottom: 12px;
    z-index: 8;
    width: min(34vw, 150px);
    height: min(36vw, 160px);
    object-position: center bottom;
    transition: none;
}

body[data-game-version="v3"] #screen-pk .pk-kicker.is-visible {
    opacity: 1;
}

body[data-game-version="v3"] #screen-pk .pk-kicker.is-kicking,
body[data-game-version="v3"] #screen-pk .pk-kicker.is-after-kick {
    right: 1%;
    left: auto;
    bottom: 8px;
    width: min(44vw, 190px);
    height: min(44vw, 190px);
    animation: v3PkKick .42s cubic-bezier(.15, 1.25, .25, 1);
}

@keyframes v3KeeperPop {
    from { scale: .82 .62; opacity: .72; }
    to { scale: 1; opacity: 1; }
}

body[data-game-version="v3"] #screen-pk .pk-choice-btn {
    min-height: 52px;
    font-weight: 900;
}

body[data-game-version="v3"] #screen-pk #pkArena {
    touch-action: none;
}

body[data-game-version="v3"] #screen-whack .whack-hole.is-gold {
    border-color: #f6c945;
    box-shadow: 0 0 0 3px rgba(246, 201, 69, .3), 0 0 22px rgba(246, 201, 69, .58);
}

body[data-game-version="v3"] #screen-whack .whack-hole.is-gold .whack-target {
    filter: drop-shadow(0 0 10px #ffe45d) saturate(1.2);
}


@keyframes v3TapPulse {
    from { transform: scale(.98); }
    to { transform: scale(1.03); }
}

@keyframes v3PkKick {
    0% { transform: translateX(16px) rotate(-4deg) scale(.94); }
    52% { transform: translateX(-10px) rotate(4deg) scale(1.04); }
    100% { transform: translateX(0) rotate(0) scale(1); }
}


@media (max-width: 760px) {
    .games-menu-shell {
        padding-bottom: calc(20px + env(safe-area-inset-bottom));
    }

    .games-menu-hero {
        min-height: 0;
        padding: 14px;
    }

    .games-menu-hero p {
        display: none;
    }

    .game-v3-menu-head {
        align-items: center;
        margin-top: 12px;
    }

    .game-v3-menu-head h4 {
        font-size: 17px;
    }

    .game-v3-menu-head p {
        max-width: 150px;
        text-align: right;
    }

    .game-v3-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .game-v3-card {
        grid-template-columns: 54px minmax(0, 1fr);
        min-height: 88px;
        padding: 7px;
    }

    .game-v3-card img {
        width: 52px;
        height: 64px;
    }

    .game-v3-card strong {
        padding-right: 12px;
        font-size: 13px;
    }

    .game-v3-card small {
        display: none;
    }

    .game-version-block {
        margin-top: 10px;
    }

    body[data-game-version="v3"] :is(#screen-bazooka .bazooka-hero, #screen-whack .whack-hero, #screen-homerun .stadium-hero, #screen-pk .stadium-hero, #screen-billiards .billiards-hero) {
        padding: 10px 12px;
    }

    body[data-game-version="v3"] :is(#screen-bazooka .bazooka-hero, #screen-whack .whack-hero, #screen-homerun .stadium-hero, #screen-pk .stadium-hero, #screen-billiards .billiards-hero) .home-eyebrow,
    body[data-game-version="v3"] :is(#screen-bazooka .bazooka-hero, #screen-whack .whack-hero, #screen-homerun .stadium-hero, #screen-pk .stadium-hero, #screen-billiards .billiards-hero) p {
        display: none;
    }

    body[data-game-version="v3"] :is(#screen-bazooka .bazooka-hero, #screen-whack .whack-hero, #screen-homerun .stadium-hero, #screen-pk .stadium-hero, #screen-billiards .billiards-hero) h3 {
        margin: 0;
        font-size: 18px;
    }

    body[data-game-version="v3"] :is(#screen-bazooka, #screen-whack, #screen-homerun, #screen-pk, #screen-billiards) :is(.bazooka-game-shell, .whack-game-shell, .stadium-game-shell, .billiards-game-shell) {
        gap: 8px;
        padding: 8px;
    }

    body[data-game-version="v3"] #screen-bazooka .bazooka-arena {
        min-height: min(46vh, 390px);
    }

    body[data-game-version="v3"] #screen-bazooka .bazooka-control-panel {
        grid-template-columns: minmax(0, 1fr) 112px;
        gap: 8px;
        padding: 9px;
    }

    body[data-game-version="v3"] #screen-bazooka .bazooka-tap-button {
        min-width: 104px;
        min-height: 104px;
        font-size: 20px;
    }

    body[data-game-version="v3"] #screen-bazooka .bazooka-actions {
        grid-template-columns: 1fr 96px;
    }

    body[data-game-version="v3"] #screen-whack .whack-score-row {
        gap: 4px;
    }

    body[data-game-version="v3"] #screen-whack .whack-score-card {
        padding: 6px 4px;
    }

    body[data-game-version="v3"] #screen-whack .whack-board {
        min-height: min(53vh, 430px);
    }

    body[data-game-version="v3"] :is(#screen-pk, #screen-homerun) .stadium-arena {
        min-height: min(50vh, 430px);
    }

    body[data-game-version="v3"] :is(#screen-pk, #screen-homerun) .stadium-panel {
        padding: 9px;
    }

    body[data-game-version="v3"] #screen-pk .pk-buttons {
        position: relative;
        z-index: 12;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px;
    }

    body[data-game-version="v3"] #screen-pk .pk-kicker {
        right: 3%;
        left: auto;
        bottom: 10px;
        width: 118px;
        height: 132px;
    }

    body[data-game-version="v3"] #screen-pk .pk-kicker.is-kicking,
    body[data-game-version="v3"] #screen-pk .pk-kicker.is-after-kick {
        right: 1%;
        left: auto;
        bottom: 6px;
        width: 164px;
        height: 164px;
    }

    body[data-game-version="v3"] #screen-pk .pk-keeper {
        top: 40px;
        bottom: auto;
    }

    body[data-game-version="v3"] #screen-pk .pk-keeper.is-stretch-left,
    body[data-game-version="v3"] #screen-pk .pk-keeper.is-stretch-right {
        top: 16px;
        bottom: auto;
        width: min(82vw, 320px);
        height: 150px;
    }

    body[data-game-version="v3"] #screen-pk .pk-keeper.is-stretch-center {
        top: -58px;
        bottom: auto;
        width: 170px;
        height: 238px;
    }

    body[data-game-version="v3"] #screen-billiards .billiards-table {
        min-height: min(60vh, 520px);
        touch-action: none;
    }
}
