/* 主色与充值/礼包商城一致 (#ff4d4f)，白底卡片、浅灰页面 */
        :root {
            --primary: #ff4d4f;
            --primary-light: #ff7875;
            --primary-soft: #fff5f5;
            --primary-border: #ffd1d1;
            --page-bg: #f3f4f6;
            --card-radius: 16px;
        }
        * { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
        html, body {
            font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
            background: var(--page-bg);
            color: #333;
            font-size: 14px;
            line-height: 1.5;
        }
        a { text-decoration: none; color: inherit; }
        img { display: block; max-width: 100%; }

        .app-wrap {
            position: relative;
            width: 100%;
            max-width: 480px;
            min-height: 100vh;
            margin: 0 auto;
            background: var(--page-bg);
            padding: 0 0 calc(72px + env(safe-area-inset-bottom));
        }
        @media (min-width: 768px) {
            body { background: #e9eaee; }
            .app-wrap { box-shadow: 0 0 16px rgba(0, 0, 0, 0.08); }
            .cta-bar { box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08); }
        }

        /* ========== 截图横滑（对齐 fkssj 宣传页 gd-shots：居中主图 + 两侧缩小 + 渐变底） ========== */
        .promo-shots-section {
            /* 纵向仅深灰过渡到底部再接页面灰，避免中段大块浅灰/发白带 */
            background: linear-gradient(180deg, #141414 0%, #1e1e1e 38%, #262626 78%, var(--page-bg) 100%);
            padding: 1.85rem 0 1.65rem;
            margin: 0;
            position: relative;
        }
        .promo-shots-section::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 110px;
            /* 商城主色淡高光，非橙色 */
            background: linear-gradient(180deg, rgba(255, 77, 79, 0.14) 0%, transparent 100%);
            pointer-events: none;
        }
        .promo-shots-wrapper {
            position: relative;
            overflow: hidden;
            width: 100%;
            /* 横滑时两侧露底用深色铺满，避免 contain 留白或裁切误显示成大白块 */
            background: #1a1a1a;
        }
        .promo-shots {
            display: flex;
            gap: .65rem;
            overflow: visible;
            padding-bottom: .25rem;
            transition: transform 0.5s ease;
            -webkit-overflow-scrolling: touch;
            padding-left: 1rem;
            padding-right: 1rem;
            will-change: transform;
        }
        .promo-shot-item {
            flex: 0 0 auto;
            width: 78vw;
            max-width: 340px;
            height: var(--promo-shot-h, 188px);
            border-radius: 12px;
            overflow: hidden;
            transition: transform .3s ease, box-shadow .3s ease, opacity .3s ease;
            opacity: 0.58;
            transform: scale(0.92);
            box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
            background: #111;
        }
        .promo-shot-item.active {
            opacity: 1;
            transform: scale(1);
            box-shadow: 0 12px 36px rgba(0, 0, 0, 0.42), 0 0 0 1px rgba(255, 255, 255, 0.12);
        }
        .promo-shot-item img {
            width: 100%;
            height: 100%;
            display: block;
            pointer-events: none;
            object-fit: cover;
            object-position: center center;
        }
        @media (min-width: 576px) {
            .promo-shot-item { width: 72vw; max-width: 380px; }
        }
        @media (min-width: 768px) {
            .promo-shots-section { padding: 1.75rem 0 2rem; }
            .promo-shots { padding-left: 1.5rem; padding-right: 1.5rem; }
            .promo-shot-item {
                width: 68vw;
                max-width: 400px;
                height: var(--promo-shot-h-md, 248px);
            }
        }

        .info-card.layui-card {
            margin: 8px 14px 12px;
            border-radius: var(--card-radius);
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
            border: none;
        }
        .info-card .layui-card-body { padding: 14px; }

        .info-head { display: flex; align-items: flex-start; gap: 10px; }
        .game-ico {
            width: 56px;
            height: 56px;
            border-radius: 12px;
            flex-shrink: 0;
            border: 1px solid #f0f0f0;
            overflow: hidden;
            background: #eee center/cover no-repeat;
        }
        .game-meta { flex: 1; min-width: 0; }
        .game-title { font-size: 16px; font-weight: 700; color: #222; line-height: 1.3; }
        .game-sub { margin-top: 4px; font-size: 12px; color: #999; }
        .game-rate { margin-top: 6px; font-size: 13px; color: var(--primary); font-weight: 600; }
        .game-rate .stars { letter-spacing: 1px; margin-right: 4px; }

        .btn-down-wrap { flex-shrink: 0; }
        .btn-down {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 8px 16px;
            background: linear-gradient(135deg, var(--primary-light), var(--primary));
            color: #fff !important;
            font-size: 13px;
            border-radius: 22px;
            border: none;
            box-shadow: 0 4px 10px rgba(255, 77, 79, 0.3);
        }
        .btn-down:active { opacity: .92; transform: scale(.98); }
        .btn-down .layui-icon { font-size: 15px; margin-right: 4px; }

        .tag-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
        .tag-pill {
            padding: 3px 10px;
            font-size: 12px;
            color: var(--primary);
            border: 1px solid var(--primary-border);
            background: var(--primary-soft);
            border-radius: 4px;
        }

        .action-grid { margin-top: 14px; }
        .action-grid .layui-row { margin-left: -6px; margin-right: -6px; }
        .action-grid .layui-col-xs6 { padding: 6px; }
        /* 与商城/充值视觉统一：白底细边 + 左侧纯色红渐变图标块 */
        .act-btn {
            display: flex;
            align-items: center;
            padding: 12px 10px;
            background: #fff;
            border: 1px solid #eee;
            border-radius: 12px;
            cursor: pointer;
            transition: background .2s;
            min-height: 52px;
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
        }
        .act-btn:active { background: var(--primary-soft); }
        .act-btn .ico {
            width: 36px;
            height: 36px;
            border-radius: 10px;
            background: linear-gradient(135deg, var(--primary-light), var(--primary));
            color: #fff;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            margin-right: 8px;
        }
        .act-btn .ico .layui-icon { font-size: 20px; }
        .act-btn .txt { font-size: 13px; font-weight: 600; color: #222; }

        .sect {
            margin: 10px 14px;
            padding: 16px;
            background: #fff;
            border-radius: var(--card-radius);
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
        }
        .sect h3 {
            font-size: 15px;
            font-weight: 700;
            color: var(--primary);
            margin-bottom: 10px;
        }
        .sect p.intro { font-size: 14px; color: #333; line-height: 1.75; text-align: justify; }
        .feat-list { line-height: 2; font-size: 14px; color: #333; padding-left: 0; }
        .feat-list li { position: relative; padding-left: 14px; list-style: none; }
        .feat-list li::before {
            content: "";
            position: absolute;
            left: 0;
            top: 0.72em;
            border: 4px solid transparent;
            border-left-color: var(--primary);
            transform: translateY(-2px);
        }

        .cta-bar {
            position: fixed;
            left: 50%;
            bottom: 0;
            transform: translateX(-50%);
            width: 100%;
            max-width: 480px;
            padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
            background: #fff;
            border-top: 1px solid #ececec;
            z-index: 99;
        }
        .cta-bar .layui-btn {
            height: 46px;
            line-height: 46px;
            background: linear-gradient(135deg, var(--primary-light), var(--primary));
            border: none;
            border-radius: 23px;
            font-size: 15px;
            font-weight: 600;
            color: #fff !important;
            box-shadow: 0 4px 10px rgba(255, 77, 79, 0.3);
        }
        .cta-bar .layui-btn:active { opacity: .92; }
        .cta-bar .layui-btn .layui-icon { font-size: 18px; margin-right: 6px; }