* {
    box-sizing: border-box;
}

/* === 全局强制禁止水平滚动 === */
html, body {
height: 100%;               /* 必须 */
    margin: 0;
    padding: 0;
    max-width: 100%;
    overflow-x: hidden;           /* 这是最关键的一行 */
    word-break: break-word;       /* 长单词、链接自动换行 */
}

/* === 基础样式 === */
body {
    font-family: system-ui, sans-serif;
    line-height: 1.9;
    font-size: 22px;
}

a {
    text-decoration: none;
    word-break: break-all;        /* 长链接强制换行 */
}

/* ====================== 左侧固定导航栏 ====================== */
nav {
    position: fixed;
    left: 0;
    top: 0;
    width: 9%;
    height: 100%;
    background: #318ce7;
}

/* ====================== 大屏幕样式 ====================== */
@media (min-width: 769px) {
    main {
        margin: 88px auto 100px 10%;
        padding: 0 40px;
    }
    article { margin-bottom: 5rem; }
    p { margin: 1.5em 0; }
footer {
    margin-top: auto;           /* 关键：自动推到底部 */
    padding: 40px 0 1px;
    text-align: center;
    font-size: 0.75rem;
    width: 100%;
}
img {
        max-width: 95% !important;      /* 加强限制 */
        max-height: 90vh !important;    /* 新增：限制最高高度 */
        height: auto !important;
        display: block;
        margin: 1.5em 0;                /* 保持靠左 */
        object-fit: contain;            /* 新增：保持比例不溢出 */
    }
}

/* ====================== 小屏幕样式 (iPhone + iPad竖屏) ====================== */
@media (max-width: 768px) {
    /* 1. 彻底隐藏导航栏 */
    nav {
        display: none;
    }

    /* 2. 全局强制禁止横向滚动 + 防止溢出 */
    html, body {
        max-width: 100%;
        overflow-x: hidden !important;
        font-size: 19px;
    }

    /* 3. main 区域优化 */
    main {
        max-width: 100%;
        margin: 32px 0 0 0;        /* 去掉 auto，彻底杜绝居中溢出 */
        padding: 0 20px;            /* 左右留白稍微小一点，更舒服 */
    }

    /* 4. 防止图片、代码、长链接溢出 */
    img, video, iframe, table, pre, code {
        max-width: 100% !important;
        height: auto !important;
    }
img {
        max-width: 95% !important;      /* 加强限制 */
        max-height: 90vh !important;    /* 新增：限制最高高度 */
        height: auto !important;
        display: block;
        margin: 1.5em 0;                /* 保持靠左 */
        object-fit: contain;            /* 新增：保持比例不溢出 */
    }

    /* 5. 长链接自动换行 */
    a {
        word-break: break-all;
    }

    article {
        margin-bottom: 4rem;
    }

    p {
        margin: 1.5em 0;
    }

footer {
    margin-top: auto;           /* 关键：自动推到底部 */
    padding: 40px 0 1px;
    text-align: center;
    font-size: 0.75rem;
    width: 100%;
}
}