.ai-info {
    position: absolute;
    left: 0;
    bottom: 0;
    font-size: 11px;
    color: rgba(255, 255, 255, 0.6);

    width: 100%;
    text-align: center;
    letter-spacing: 1px;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 80%);
    padding: 20px;
}

.game-link h2 span.en {
    font-size: 0.275em;
    padding-top: 0.8em;
    text-transform: uppercase;
    font-family: "Michroma", sans-serif;
    font-weight: bold;
    font-style: normal;
    letter-spacing: 1px;
}
.game-link h2 span {
    line-height: 1.1;
}

/* 導覽列連結不斷行 */
.main-nav a {
    white-space: nowrap;
}

/* 手機版（0 ~ 979px）漢堡選單 */
.nav-toggle {
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
    z-index: 2;
}

@media (min-width: 0) and (max-width: 979px) {
    .nav {
        top: 0;
    }

    .nav .accesskey {
        left: 50px;
        line-height: 50px;
    }

    /* A. 手機版一開始 Logo 比較大比較高，滾動後縮小 */
    .header {
        height: 80px;
    }
    .header:before {
        height: 80px;
    }

    /* 初始狀態 Logo：移除 margin-top，垂直水平居中，縮放為 1.0 (比原本的 scale(0.8) 大) */
    .header .logo {
        margin-top: 0;
        transform: translate(-50%, -24%) scale(1.3);
    }

    /* 初始狀態漢堡選單高度為 80px 以便置中，並加上動畫 */
    .nav-toggle {
        height: 80px;
        transition: height 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    /* 滾動後狀態（加上 .--min） */
    .--min .header {
        height: 50px;
    }
    .--min .header:before {
        height: 50px;
    }
    .--min .header .logo {
        margin-top: 0;
        transform: translate(-50%, -33%) scale(0.8);
    }
    .--min .nav-toggle {
        height: 50px;
    }
    .--min .main-nav a {
        font-size: 1.125em;
    }
    /* B. 展開選單時，選單 top 與高度隨 header 動態調整，避免擋到 Logo */
    .nav .main-nav {
        transition:
            top 0.5s cubic-bezier(0.215, 0.61, 0.355, 1),
            max-height 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    .nav.--open .main-nav {
        display: flex;
        flex-direction: column;
        position: absolute;
        top: 80px;
        left: 0;
        width: 100%;
        max-height: calc(100vh - 80px);
        overflow-y: auto;
        background: linear-gradient(to bottom, rgba(7, 28, 45, 0.95) 0%, rgba(7, 28, 45, 0.85) 100%);
        backdrop-filter: blur(15px);
        -webkit-backdrop-filter: blur(15px);
    }

    .--min .nav.--open .main-nav {
        top: 50px;
        max-height: calc(100vh - 50px);
    }

    .nav.--open .main-nav a {
        flex: none;
        line-height: 54px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }

    /* C. 當選單展開時，強制將 Header、Logo、漢堡按鈕維持在 80px，確保 Logo 完美展示且不被擋到 */
    body:has(.nav.--open) .header {
        height: 80px;
    }
    body:has(.nav.--open) .header:before {
        height: 80px;
    }
    body:has(.nav.--open) .header .logo {
        margin-top: 0;
        transform: translate(-50%, -50%) scale(1);
    }
    body:has(.nav.--open) .nav-toggle {
        height: 80px;
    }
    body:has(.nav.--open) .nav .main-nav {
        top: 80px;
        max-height: calc(100vh - 80px);
    }
}
