/* 根元素 */
html {
    font-size: 16px;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: fixed;
    /* 防止过度滚动 */
    overscroll-behavior: none;
    -webkit-overscroll-behavior: none;
}

/* 页面基础样式 */
body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: fixed;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* 防止过度滚动 */
    overscroll-behavior: none;
    -webkit-overscroll-behavior: none;
}

/* 滚动容器 */
.scroll-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    /* 移除 -webkit-overflow-scrolling: touch 以防止橡皮筋效果 */
    scrollbar-width: none;
    touch-action: pan-y;

    /* 完全防止过度滚动 */
    overscroll-behavior: none;
    overscroll-behavior-y: none;
    -webkit-overscroll-behavior: none;
    -webkit-overscroll-behavior-y: none;

    /* 背景图片 */
    background-color: #f5e6d3;
    background-image: url('https://n8n-tyfmc.oss-cn-beijing.aliyuncs.com/picgo/20260207163916653.png');
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100% auto;
    background-attachment: local; /* 关键：背景跟内部滚动走 */
}

.bg-spacer {
    width: 100%;
    min-height: 50vh; /* 确保至少有 50vh 的留白 */
}


.scroll-container::-webkit-scrollbar {
    display: none;
}

/* 屏幕/区块基础样式 */
.screen {
    width: 100vw;
    height: 100vh;
    box-sizing: border-box;
    flex-shrink: 0;
}

/* 底部提示层 */
.hint-layer {
    position: fixed;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1000;
    display: flex;
    align-items: center;
    gap: 8px;
    color: rgba(255, 255, 255, 0.7);
    transform: rotate(90deg);
    font-size: 14px;
    background: rgba(0, 0, 0, 0.3);
    padding: 8px 16px;
    border-radius: 20px;
}


/* 工具类 */
.hidden { display: none !important; }
.visible { display: block !important; }

/* 移动端适配 */
@media screen and (max-width: 768px) {
    html { font-size: 14px; }
    .hint-layer { font-size: 12px; }
}