/* 1. 全局重置与优化 */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            -webkit-tap-highlight-color: transparent;
            user-select: none;
            -webkit-user-select: none;
        }

        html, body {
            width: 100%;
            height: 100%;
            overflow: hidden; /* 严禁滚动 */
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
            background: #fff0f5; /* 诱惑性底色 */
        }

        /* 5. 网页观看全屏居中容器 */
        .app-container {
            position: relative;
            max-width: 420px; /* 容器限制 */
            width: 100%;
            height: 100vh; /* 严格单屏高度 */
            margin: 0 auto;
            overflow: hidden;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            box-shadow: 0 0 40px rgba(255, 105, 180, 0.15);
            background: radial-gradient(circle at 50% 10%, #fff7fa 0%, #ffe3ec 50%, #ffd0e0 100%);
        }

        /* 3D高级液态背景流动特效（不留黑边） */
        .liquid-layer {
            position: absolute;
            top: -50%;
            left: -50%;
            width: 200%;
            height: 200%;
            background: radial-gradient(circle, rgba(255,182,193,0.5) 0%, rgba(255,255,255,0.7) 40%, rgba(255,228,225,0.4) 70%, rgba(255,204,229,0.3) 100%);
            filter: blur(40px);
            animation: liquidMove 12s infinite alternate ease-in-out;
            z-index: 1;
            pointer-events: none;
        }

        @keyframes liquidMove {
            0% { transform: translate(0, 0) rotate(0deg) scale(1); }
            50% { transform: translate(-5%, -10%) rotate(180deg) scale(1.1); }
            100% { transform: translate(5%, 5%) rotate(360deg) scale(0.95); }
        }

        /* 页面内容上浮于背景之上 */
        .content-wrapper {
            position: relative;
            z-index: 2;
            width: 100%;
            height: 100%;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            padding: env(safe-area-inset-top) 16px env(safe-area-inset-bottom) 16px;
        }

        /* 顶部导航与常驻下载 (约8vh) */
        .header-section {
            height: 8vh;
            display: flex;
            justify-content: space-between;
            align-items: center;
            border-bottom: 1px solid rgba(255, 255, 255, 0.4);
            padding-bottom: 0.5vh;
        }

        .brand-logo {
            display: flex;
            align-items: center;
            gap: 6px;
        }

        .brand-icon {
            font-size: 24px;
            animation: heartBeat 1.5s infinite;
        }

        .brand-text h1 {
            font-size: 16px;
            font-weight: 800;
            color: #ff3377;
            letter-spacing: 1px;
            text-shadow: 0 2px 4px rgba(255, 51, 119, 0.1);
        }

        .brand-text p {
            font-size: 10px;
            color: #ff77a8;
            font-weight: 600;
        }

        /* 顶部下载按钮 */
        .top-download-btn {
            background: linear-gradient(135deg, #ff5e97, #ff3377);
            color: #fff;
            font-size: 11px;
            font-weight: 700;
            padding: 6px 14px;
            border-radius: 20px;
            text-decoration: none;
            box-shadow: 0 4px 10px rgba(255, 51, 119, 0.3);
            border: 1px solid rgba(255, 255, 255, 0.3);
            letter-spacing: 1px;
            transition: transform 0.2s;
        }
        .top-download-btn:active {
            transform: scale(0.95);
        }

        /* 3D堆叠展示区 (约44vh) */
        .hero-showcase {
            height: 44vh;
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
            perspective: 1200px; /* 3D透视 */
        }

        .stack-container {
            position: relative;
            width: 100%;
            height: 90%;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        /* 通用卡片样式 */
        .stack-card {
            position: absolute;
            width: 170px;
            height: 250px;
            border-radius: 16px;
            overflow: hidden;
            box-shadow: 0 15px 35px rgba(255, 78, 136, 0.25);
            transition: all 0.5s ease-in-out;
            border: 3px solid #fff;
            background-color: #ffe6ee;
        }

        .stack-card img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

        /* 3D 左右及中央堆叠排版 */
        .card-left {
            transform: translateX(-55px) translateZ(-60px) rotateY(28deg) rotateX(4deg);
            z-index: 1;
            filter: brightness(0.85);
        }

        .card-right {
            transform: translateX(55px) translateZ(-60px) rotateY(-28deg) rotateX(4deg);
            z-index: 1;
            filter: brightness(0.85);
        }

        .card-center {
            transform: translateZ(50px) scale(1.05);
            z-index: 3;
            box-shadow: 0 20px 45px rgba(255, 51, 119, 0.35);
            animation: floating 3s ease-in-out infinite alternate;
        }

        /* 尊贵金色禁断角标 */
        .forbidden-badge {
            position: absolute;
            top: 10px;
            right: 10px;
            background: linear-gradient(135deg, #ffe066, #f5b041);
            color: #4a2700;
            font-size: 10px;
            font-weight: 900;
            padding: 3px 8px;
            border-radius: 20px;
            box-shadow: 0 4px 8px rgba(0,0,0,0.15);
            display: flex;
            align-items: center;
            gap: 3px;
        }

        /* 动效 */
        @keyframes floating {
            0% { transform: translateZ(50px) scale(1.05) translateY(0); }
            100% { transform: translateZ(50px) scale(1.05) translateY(-8px); }
        }

        @keyframes heartBeat {
            0% { transform: scale(1); }
            14% { transform: scale(1.15); }
            28% { transform: scale(1); }
            42% { transform: scale(1.15); }
            70% { transform: scale(1); }
        }

        /* 动态文案与利益点模块 (约24vh) */
        .dynamic-panel {
            height: 24vh;
            display: flex;
            flex-direction: column;
            justify-content: center;
            gap: 1.5vh;
        }

        /* 滚动动态弹幕/提示 */
        .live-ticker {
            background: rgba(255, 255, 255, 0.7);
            border-radius: 30px;
            padding: 6px 12px;
            border: 1px solid rgba(255, 255, 255, 0.5);
            backdrop-filter: blur(10px);
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            box-shadow: 0 4px 15px rgba(255, 78, 136, 0.08);
            width: fit-content;
            margin: 0 auto;
        }

        .pulse-light {
            width: 8px;
            height: 8px;
            background-color: #2ecc71;
            border-radius: 50%;
            box-shadow: 0 0 8px #2ecc71;
            animation: pulse 1.2s infinite;
        }

        @keyframes pulse {
            0% { transform: scale(0.9); opacity: 0.6; }
            50% { transform: scale(1.2); opacity: 1; }
            100% { transform: scale(0.9); opacity: 0.6; }
        }

        .ticker-text {
            font-size: 11px;
            color: #cc4477;
            font-weight: 700;
        }

        /* 双核心特色标签 (毛玻璃高级质感) */
        .features-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 10px;
        }

        .feature-card {
            background: rgba(255, 255, 255, 0.5);
            border: 1px solid rgba(255, 255, 255, 0.6);
            backdrop-filter: blur(8px);
            border-radius: 12px;
            padding: 10px;
            display: flex;
            align-items: center;
            gap: 8px;
            transition: all 0.3s;
        }

        .feature-icon {
            font-size: 20px;
        }

        .feature-info h3 {
            font-size: 12px;
            color: #ff2a70;
            font-weight: 800;
            margin-bottom: 2px;
        }

        .feature-info p {
            font-size: 9px;
            color: #b05c78;
            font-weight: 500;
        }

        /* 底部 CTA 核心操作面板 (约24vh) */
        .cta-section {
            height: 24vh;
            display: flex;
            flex-direction: column;
            justify-content: space-around;
            align-items: center;
            background: linear-gradient(180deg, rgba(255, 240, 245, 0) 0%, rgba(255, 218, 230, 0.7) 100%);
            padding-bottom: env(safe-area-inset-bottom);
        }

        /* 极速倒计时提示 */
        .urgency-banner {
            font-size: 11px;
            color: #e74c3c;
            font-weight: 800;
            background: rgba(231, 76, 60, 0.08);
            padding: 4px 14px;
            border-radius: 20px;
            letter-spacing: 1px;
            animation: textPulse 1s infinite alternate;
        }

        @keyframes textPulse {
            0% { transform: scale(1); }
            100% { transform: scale(1.03); }
        }

        /* 4. 极致诱惑行动召唤按钮 (CTA Button) */
        .main-cta-button {
            width: 100%;
            height: 56px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            /* 90度线性渐变 主色调->副色调 */
            background: linear-gradient(90deg, #ff3b7b 0%, #ff7ea5 100%);
            color: #ffffff;
            border-radius: 28px;
            text-decoration: none;
            /* 超粗字体、大字号与宽字间距 */
            font-weight: 900;
            font-size: 23px;
            letter-spacing: 5px;
            text-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
            /* 极强可点击悬浮感长阴影 */
            box-shadow: 0 10px 25px rgba(255, 59, 123, 0.45), 0 4px 10px rgba(255, 255, 255, 0.4) inset;
            border: 1.5px solid rgba(255, 255, 255, 0.4);
            position: relative;
            overflow: hidden;
            animation: btnPulse 2s infinite;
        }

        .main-cta-button::after {
            content: '';
            position: absolute;
            top: -50%;
            left: -60%;
            width: 30%;
            height: 200%;
            background: rgba(255, 255, 255, 0.4);
            transform: rotate(35deg);
            animation: flashLight 3s infinite ease-in-out;
        }

        @keyframes flashLight {
            0% { left: -60%; }
            30% { left: 140%; }
            100% { left: 140%; }
        }

        @keyframes btnPulse {
            0% { transform: scale(1); box-shadow: 0 10px 25px rgba(255, 59, 123, 0.45); }
            50% { transform: scale(1.02); box-shadow: 0 12px 30px rgba(255, 59, 123, 0.65); }
            100% { transform: scale(1); box-shadow: 0 10px 25px rgba(255, 59, 123, 0.45); }
        }

        .main-cta-button .btn-sub-label {
            font-size: 9px;
            font-weight: 700;
            letter-spacing: 1px;
            opacity: 0.9;
            margin-top: 1px;
        }

        /* 极致隐私安全保障脚注 */
        .security-footer {
            font-size: 10px;
            color: #b05c78;
            font-weight: 600;
            display: flex;
            align-items: center;
            gap: 4px;
        }