/* 游戏页公共容器 */

.game-root {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 480px;
    color: var(--phosphor);
    font-family: var(--font-pixel);
}

.game-root--battlecity { min-height: 0; }
.game-root--typing { min-height: 0; }
.game-root--chess { min-height: 0; }
.game-root--tetris { min-height: 0; }
.game-root--snake { min-height: 0; }
.game-root--basic { min-height: 520px; }

.game-root .pixel-btn { font-family: var(--font-pixel); }

/* 游戏内小标题 */
.game-kicker {
    margin: 0;
    font-size: 9px;
    letter-spacing: .24em;
    color: var(--phosphor-dim);
}

/* 移动端触控区 */
.game-touch {
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 6px 4px 0;
}

@media (hover: none), (pointer: coarse) {
    .game-touch { display: flex; }
}

.game-dpad {
    display: grid;
    grid-template-columns: repeat(3, 40px);
    grid-template-rows: repeat(3, 40px);
    gap: 2px;
}

.game-dpad button {
    padding: 0;
    font-size: 13px;
    color: var(--cream);
    background: #1b2a1f;
    border: 1px solid #3a5a44;
    border-radius: 4px;
    cursor: pointer;
}

.game-dpad button:active { background: #2c4633; }

.game-dpad [data-dir="up"] { grid-area: 1 / 2; }
.game-dpad [data-dir="left"] { grid-area: 2 / 1; }
.game-dpad [data-dir="down"] { grid-area: 3 / 2; }
.game-dpad [data-dir="right"] { grid-area: 2 / 3; }

.game-fire {
    width: 62px;
    height: 62px;
    border-radius: 50%;
    font-family: var(--font-pixel);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    color: #2a1208;
    background: radial-gradient(circle at 35% 30%, #ff9a7e, #c0392b 60%, #7d1a12);
    border: 2px solid #ffb59e;
    box-shadow: 0 5px 0 #5d110c, 0 8px 18px rgba(0, 0, 0, .5);
    cursor: pointer;
}

.game-fire:active {
    transform: translateY(4px);
    box-shadow: 0 1px 0 #5d110c;
}

@media (max-width: 720px) {
    .game-root { min-height: 0; }
    .tv__screen--game { padding: 8px; }
}