/* 背景与对局侧栏：保留本地安装的 7 张背景图，并让对局记录/对手思路常驻右侧。 */

/* ---------- 首页 ---------- */

.page-home .backdrop {
    background:
        linear-gradient(180deg, rgba(7, 6, 5, 0.18), rgba(7, 6, 5, 0.58)),
        url("/static/assets/backgrounds/login.webp") center / cover no-repeat;
}

.page-home .ghost-card {
    display: none;
}

/* ---------- 选人页 ---------- */

.page-setup .backdrop {
    background:
        linear-gradient(180deg, rgba(7, 6, 5, 0.28), rgba(7, 6, 5, 0.62)),
        url("/static/assets/backgrounds/login.webp") center / cover no-repeat fixed;
}

/* ---------- 构筑页 ---------- */

.page-builder[data-faction="north"] .backdrop {
    background:
        linear-gradient(180deg, rgba(8, 7, 5, 0.36), rgba(8, 7, 5, 0.62)),
        url("/static/assets/backgrounds/builder-north.webp") center / cover no-repeat fixed;
}

.page-builder[data-faction="monster"] .backdrop {
    background:
        linear-gradient(180deg, rgba(8, 7, 5, 0.36), rgba(8, 7, 5, 0.62)),
        url("/static/assets/backgrounds/builder-monster.webp") center / cover no-repeat fixed;
}

/* ---------- 对局页 ---------- */

.page-game[data-faction="north"] .backdrop {
    background:
        linear-gradient(180deg, rgba(6, 8, 8, 0.42), rgba(6, 8, 8, 0.58)),
        url("/static/assets/backgrounds/battle-north.webp") center / cover no-repeat fixed;
}

.page-game[data-faction="monster"] .backdrop {
    background:
        linear-gradient(180deg, rgba(6, 8, 8, 0.42), rgba(6, 8, 8, 0.58)),
        url("/static/assets/backgrounds/battle-monster.webp") center / cover no-repeat fixed;
}

@media (min-width: 901px) {
    .page-game .side-panels {
        left: auto;
        right: 14px;
    }

    body.page-game.log-open .board,
    body.page-game.panel-open .board {
        padding-left: 108px;
        padding-right: 334px;
    }

    body.page-game.log-open .leader-rail,
    body.page-game.panel-open .leader-rail {
        left: 8px;
    }
}

/* ---------- 选人页阵营卡 ---------- */

.faction--north .faction__face {
    background:
        linear-gradient(180deg, rgba(8, 7, 5, 0.12), rgba(8, 7, 5, 0.78)),
        url("/static/assets/backgrounds/setup-north.webp") center / cover no-repeat;
}

.faction--monster .faction__face {
    background:
        linear-gradient(180deg, rgba(8, 7, 5, 0.12), rgba(8, 7, 5, 0.78)),
        url("/static/assets/backgrounds/setup-monster.webp") center / cover no-repeat;
}

.faction--north .faction__face:hover,
.faction--monster .faction__face:hover {
    background-color: rgba(255, 255, 255, 0.02);
}