/* ==================== 全局响应式缩放设置 ==================== */
/* 适用于所有页面 */

/* 桌面端默认90%缩放，防止溢出 */
body {
    zoom: 100%;
    -moz-transform: scale(1);
    -moz-transform-origin: 0 0;
    -webkit-transform: scale(1);
    -webkit-transform-origin: 0 0;
    transform: scale(1);
    transform-origin: 0 0;
}

/* 小屏幕桌面端（1366px以下）进一步缩小 */
@media screen and (max-width: 1366px) and (min-width: 1025px) {
    body {
        zoom: 80%;
        -moz-transform: scale(0.8);
        -moz-transform-origin: 0 0;
        -webkit-transform: scale(0.8);
        -webkit-transform-origin: 0 0;
        transform: scale(0.8);
        transform-origin: 0 0;
    }
}

/* 平板端（768px - 1024px）80%缩放 */
@media screen and (min-width: 769px) and (max-width: 1024px) {
    body {
        zoom: 80%;
        -moz-transform: scale(0.8);
        -moz-transform-origin: 0 0;
        -webkit-transform: scale(0.8);
        -webkit-transform-origin: 0 0;
    }
}

/* 移动端强制横屏和小缩放 */
@media screen and (max-width: 768px) {
    body {
        zoom: 50%;
        -moz-transform: scale(0.5);
        -moz-transform-origin: 0 0;
        -webkit-transform: scale(0.5);
        -webkit-transform-origin: 0 0;
        overflow-x: auto;
    }
    
    /* 竖屏提示横屏 */
    @media (orientation: portrait) {
        body::before {
            content: "📱 请横屏查看以获得最佳体验";
            position: fixed;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background: rgba(0, 0, 0, 0.95);
            color: white;
            padding: 30px 50px;
            border-radius: 15px;
            z-index: 999999;
            font-size: 20px;
            font-weight: bold;
            text-align: center;
            box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
            animation: pulse 2s infinite;
        }
        
        @keyframes pulse {
            0%, 100% {
                opacity: 1;
                transform: translate(-50%, -50%) scale(1);
            }
            50% {
                opacity: 0.8;
                transform: translate(-50%, -50%) scale(1.05);
            }
        }
    }
    
    /* 横屏时正常显示 */
    @media (orientation: landscape) {
        body::before {
            display: none;
        }
    }
}

/* 超大屏幕（3840px以上 4K）恢复100% */
@media screen and (min-width: 3840px) {
    body {
        zoom: 100%;
        -moz-transform: scale(1);
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

/* 修复Firefox的transform问题 */
@-moz-document url-prefix() {
    html {
        overflow-x: hidden;
    }
}

/* 确保内容不会因为缩放而被裁剪 */
html {
    overflow-x: auto;
    overflow-y: auto;
}

body {
    min-width: fit-content;
}

