* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --safe-top: env(safe-area-inset-top, 0px);
    --safe-bottom: env(safe-area-inset-bottom, 0px);
    --safe-left: env(safe-area-inset-left, 0px);
    --safe-right: env(safe-area-inset-right, 0px);
    --app-height: 100vh;
}

html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
    font-size: 16px;
}

@supports (height: 100dvh) {
    :root {
        --app-height: 100dvh;
    }
}

html,
body {
    width: 100%;
    min-height: 100%;
    min-height: var(--app-height);
}

body {
    -webkit-tap-highlight-color: transparent;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: none;
    touch-action: manipulation;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
    padding-top: var(--safe-top);
    padding-bottom: var(--safe-bottom);
    padding-left: var(--safe-left);
    padding-right: var(--safe-right);
}

.container {
    width: 100%;
    max-width: 100vw;
    min-height: calc(var(--app-height) - var(--safe-top) - var(--safe-bottom));
    margin: 0 auto;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.container img {
    width: 100%;
    max-width: 100%;
    height: auto;
    display: block;
    vertical-align: top;
    border: 0;
    -webkit-user-drag: none;
    user-select: none;
    -webkit-touch-callout: none;
    pointer-events: none;
}

/* 超小屏（iPhone SE 等） */
@media screen and (max-width: 320px) {
    html {
        font-size: 14px;
    }
}

/* 横屏：限制内容宽度，避免图片被过度拉伸 */
@media screen and (orientation: landscape) and (max-height: 500px) {
    .container {
        max-width: min(100vw, calc(var(--app-height) * 0.5625));
    }
}

/* 大屏手机 / 平板竖屏 */
@media screen and (min-width: 414px) {
    .container {
        max-width: 750px;
    }
}

@media screen and (min-width: 768px) {
    .container {
        max-width: 480px;
    }
}