/* ============================================================
   移动端补丁 · resume-library
   站点自身的响应式（480/520/560/640/720/900/960 断点、100dvh、
   setPixelRatio 限 2、prefers-reduced-motion）已经做得不错，
   本文件只补齐几项确定缺失、且不会改变视觉风格的移动端要点。
   在主样式之后加载。
   ============================================================ */

/* 1. 阻止 iOS 横屏自动放大字号 */
html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

/* 2. 去掉移动端点击时的灰色高亮块 */
body,
a,
button {
    -webkit-tap-highlight-color: transparent;
}

/* 3. 窄屏下兜底防横向溢出。
      用 clip 而非 hidden —— hidden 会让 position:sticky/fixed 失效 */
@supports (overflow: clip) {
    @media (max-width: 768px) {
        html,
        body {
            overflow-x: clip;
        }
    }
}

/* 4. 安全区适配：iPhone 刘海与底部横条会遮挡内容，
      站点未使用任何 env(safe-area-inset-*) */
@supports (padding: env(safe-area-inset-bottom)) {
    @media (max-width: 768px) {
        body {
            padding-left: env(safe-area-inset-left);
            padding-right: env(safe-area-inset-right);
        }

        /* 在文档末尾撑出底部安全区高度，避免最后一块内容被小黑条压住 */
        body::after {
            content: "";
            display: block;
            height: env(safe-area-inset-bottom);
        }
    }
}

/* 5. 长串内容（ID、URL、邮箱）在窄屏断行，避免撑破卡片 */
@media (max-width: 768px) {
    p,
    li,
    td,
    th,
    h1,
    h2,
    h3,
    h4 {
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    /* 表格与代码块横向滚动，而不是把页面撑宽 */
    table,
    pre,
    code {
        max-width: 100%;
    }

    table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* 触摸目标不小于 44px（Apple HIG / WCAG 2.5.5） */
    a,
    button,
    [role="button"],
    input[type="button"],
    input[type="submit"] {
        min-height: 44px;
    }

    /* 行内链接不强制改高度，否则会撑开段落 */
    p a,
    li a,
    td a {
        min-height: 0;
    }
}

/* 6. 尊重系统的「减弱动态效果」设置：关掉非必要的过渡与动画 */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}

/* 7. 移动端禁止下拉橡皮筋把 3D 画布整体拖动 */
@media (max-width: 768px) {
    canvas {
        touch-action: pan-y;
    }
}
