/* ---------- 基础重置 ---------- */
        * { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
        html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
        body {
            font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", Arial, sans-serif;
            font-size: 12px;
            line-height: 1.6;
            color: #333;
            background: #f8f9fc;
            padding-bottom: 40px;
        }
        a { text-decoration: none; color: inherit; }
        img { border: 0; display: block; max-width: 100%; }
        ul, ol { list-style: none; }

        .container { max-width: 640px; margin: 0 auto; padding: 0 12px; }

        /* ---------- 头部站点信息 ---------- */
        .site-header {
            display: -webkit-flex; display: flex;
            -webkit-align-items: center; align-items: center;
            -webkit-flex-wrap: wrap; flex-wrap: wrap;
            padding: 10px 14px;
            background: #fff;
            border-bottom: 1px solid #eee;
        }
        .site-logo { margin-right: 10px; }
        .site-logo img { width: 30px; height: 30px; border-radius: 8px; }
        .site-name {
            font-size: 18px; font-weight: 700; color: #222; letter-spacing: .5px;
        }
        .site-slogan {
            -webkit-flex: 0 0 100%; flex: 0 0 100%;
            margin-top: 4px; font-size: 12px; color: #888;
        }

        /* ---------- 首屏 banner ---------- */
        .banner {
            margin-top: 10px;
            background: #fff;
            border: 1px solid #f0f0f0;
            border-radius: 12px;
            overflow: hidden;
            box-shadow: 0 2px 8px rgba(0, 0, 0, .04);
        }
        .banner-img { position: relative; width: 100%; padding-bottom: 33%; background: #e9edf4; overflow: hidden; }
        /* 用「定位 + 垂直居中裁剪」控制首屏高度（对齐 mof.html 的矮横幅比例），
           不用 aspect-ratio / object-fit，老版 UC 也能正确显示 */
        .banner-img img {
            position: absolute; left: 0; top: 50%; width: 100%; height: auto;
            -webkit-transform: translateY(-50%); transform: translateY(-50%);
        }
        .banner-content { padding: 12px 14px 14px; }
        .banner-content h1 {
            font-size: 18px; font-weight: 700; color: #1a1a2e; line-height: 1.45;
        }
        .banner-content h1 span { color: #ff6b35; }
        .banner-content p { margin-top: 6px; font-size: 13px; color: #666; line-height: 1.8; }

        /* ---------- 下载记录滚动条（浅蓝胶囊，横向无缝滚动） ---------- */
        .download-ticker {
            position: relative;
            height: 34px;
            margin: 10px 0 2px;
            padding-left: 34px;
            background: #f0f4ff;
            border-radius: 20px;
            overflow: hidden;
        }
        .download-ticker:before {
            content: "";
            position: absolute; left: 10px; top: 8px; width: 18px; height: 18px;
            background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23ff6b35"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm1-13h-2v6l5.25 3.15L17 12.23l-4-2.37V7z"/></svg>') no-repeat center;
            background-size: contain;
        }
        .ticker-wrap {
            height: 34px;
            line-height: 34px;
            white-space: nowrap;
            display: inline-block;
            -webkit-animation-name: ticker-scroll;
            animation-name: ticker-scroll;
            -webkit-animation-timing-function: linear;
            animation-timing-function: linear;
            -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
        }
        .ticker-item {
            display: inline-block;
            padding: 0 18px;
            font-size: 13px;
            color: #333;
        }
        @-webkit-keyframes ticker-scroll { from { -webkit-transform: translateX(0); } to { -webkit-transform: translateX(-50%); } }
        @keyframes ticker-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

        /* ---------- 区块标题 ---------- */
        .section-title {
            margin: 16px 0 10px;
            padding-bottom: 10px;
            font-size: 18px; font-weight: 700; color: #222;
            border-bottom: 2px solid #ff6b35;
        }
        #rank-list:before { content: "🔥 "; }
        /* 榜单标题行：左边标题 + 右边「N 人赚钱进行中」计数（计数带 id 供点击递增用） */
        #rank-list {
            display: -webkit-flex; display: flex;
            -webkit-align-items: baseline; align-items: baseline;
            -webkit-justify-content: space-between; justify-content: space-between;
        }
        #rank-list .title-text { -webkit-flex: 1 1 auto; flex: 1 1 auto; }
        .title-count { margin-left: 8px; -webkit-flex-shrink: 0; flex-shrink: 0; font-size: 12px; font-weight: 400; color: #888; }
        .title-count b { color: #ff6b35; font-weight: 700; }
        #user-review:before { content: "💬 "; }
        #guide:before { content: "💡 "; }
        #faq:before { content: "❓ "; }
        .section-sub { margin: -4px 0 10px; font-size: 12px; color: #888; }

        /* ---------- APP 榜单卡片 ---------- */
        .rank-list { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; }
        .rank-item {
            display: -webkit-flex; display: flex;
            -webkit-align-items: center; align-items: center;
            -webkit-flex-wrap: wrap; flex-wrap: wrap;
            margin-bottom: 8px;
            padding: 12px 14px;
            background: #fff;
            border: 1px solid #f0f0f0;
            border-radius: 12px;
            box-shadow: 0 2px 8px rgba(0, 0, 0, .04);
        }
        .rank-num {
            width: 18px; height: 18px; line-height: 18px;
            margin-right: 8px;
            -webkit-flex-shrink: 0; flex-shrink: 0;
            background: #fff7ed;
            border-radius: 4px;
            color: #ff6b35;
            font-size: 11px; font-weight: 700; text-align: center;
        }
        .rank-icon {
            position: relative;
            width: 52px; height: 52px;
            margin-right: 10px;
            -webkit-flex-shrink: 0; flex-shrink: 0;
            display: -webkit-flex; display: flex;
            -webkit-align-items: center; align-items: center;
            -webkit-justify-content: center; justify-content: center;
            background: #f5f7fb;
            border-radius: 12px;
            overflow: hidden;
        }
        .rank-icon img { width: 100%; height: 100%; border-radius: 12px; }
        .logo-fallback {
            display: none;
            width: 100%; height: 100%;
            -webkit-align-items: center; align-items: center;
            -webkit-justify-content: center; justify-content: center;
            border-radius: 12px;
            color: #fff; font-size: 20px; font-weight: 700;
        }
        .img-failed .logo-fallback { display: -webkit-flex; display: flex; }
        .img-failed img { display: none; }

        .rank-name {
            -webkit-flex: 1; flex: 1;
            min-width: 0;
            display: -webkit-flex; display: flex;
            -webkit-align-items: center; align-items: center;
            -webkit-flex-wrap: wrap; flex-wrap: wrap;
        }
        .name-text { font-size: 16px; font-weight: 700; color: #1a1a2e; }
        .hot-flame { font-size: 13px; }
        .app-tag {
            display: inline-block;
            margin-left: 6px;
            padding: 0 8px;
            border-radius: 10px;
            font-size: 10px; font-weight: 600; line-height: 20px;
            color: #fff;
            -webkit-flex-shrink: 0; flex-shrink: 0;
        }
        .tag-first   { background: -webkit-linear-gradient(135deg, #f093fb, #f5576c); background: linear-gradient(135deg, #f093fb, #f5576c); }
        .tag-fast    { background: -webkit-linear-gradient(135deg, #4facfe, #00f2fe); background: linear-gradient(135deg, #4facfe, #00f2fe); }
        .tag-high    { background: -webkit-linear-gradient(135deg, #fa709a, #fee140); background: linear-gradient(135deg, #fa709a, #fee140); color: #1a1a2e; }
        .tag-old     { background: -webkit-linear-gradient(135deg, #43e97b, #38f9d7); background: linear-gradient(135deg, #43e97b, #38f9d7); color: #1a1a2e; }
        .tag-newbie  { background: -webkit-linear-gradient(135deg, #ff6b35, #f7931e); background: linear-gradient(135deg, #ff6b35, #f7931e); }
        .tag-normal  { background: #9aa3af; }

        .rank-desc {
            -webkit-order: 5; order: 5;
            -webkit-flex: 0 0 100%; flex: 0 0 100%;
            width: 100%;
            margin-top: 8px;
            font-size: 12px; color: #888;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .rank-score {
            display: inline-block;
            margin-right: 6px;
            padding: 1px 7px;
            border-radius: 8px;
            background: #fff7ed;
            color: #ff6b35;
            font-size: 12px; font-weight: 600;
            white-space: nowrap;
        }
        .rank-download { -webkit-flex-shrink: 0; flex-shrink: 0; }
        .download-btn {
            display: block;
            min-width: 64px;
            padding: 6px 16px;
            border: 0;
            border-radius: 20px;
            background: -webkit-linear-gradient(135deg, #ff6b35, #f7931e);
            background: linear-gradient(135deg, #ff6b35, #f7931e);
            color: #fff;
            font-family: inherit;
            font-size: 13px; font-weight: 600; letter-spacing: .5px;
            text-align: center;
            cursor: pointer;
        }
        .download-btn[data-unavailable="1"] {
            background: #c9ced6;
            cursor: default;
        }

        /* ---------- 用户真实评价 ---------- */
        .review-item {
            margin-bottom: 8px;
            padding: 12px 14px;
            background: #fff;
            border: 1px solid #f0f0f0;
            border-radius: 12px;
            box-shadow: 0 2px 8px rgba(0, 0, 0, .04);
        }
        .review-user {
            display: -webkit-flex; display: flex;
            -webkit-align-items: center; align-items: center;
            margin-bottom: 6px;
        }
        .review-avatar {
            position: relative;
            width: 36px; height: 36px;
            margin-right: 8px;
            -webkit-flex-shrink: 0; flex-shrink: 0;
            display: -webkit-flex; display: flex;
            -webkit-align-items: center; align-items: center;
            -webkit-justify-content: center; justify-content: center;
            background: #ffedd5;
            border-radius: 50%;
            overflow: hidden;
        }
        .review-avatar img { width: 100%; height: 100%; border-radius: 50%; }
        .avatar-fallback {
            display: none;
            width: 100%; height: 100%;
            -webkit-align-items: center; align-items: center;
            -webkit-justify-content: center; justify-content: center;
            background: #ffedd5;
            border-radius: 50%;
            color: #ff6b35; font-size: 15px; font-weight: 700;
        }
        .review-name { font-size: 14px; font-weight: 600; color: #1a1a2e; }
        .review-rating { margin-left: auto; color: #f5a623; font-size: 12px; letter-spacing: 1px; }
        .review-content { font-size: 13px; color: #666; line-height: 1.8; }

        /* ---------- 挣钱指南 ---------- */
        .guide {
            padding: 14px 16px 12px;
            background: #fff;
            border: 1px solid #f0f0f0;
            border-radius: 12px;
            box-shadow: 0 2px 8px rgba(0, 0, 0, .04);
        }
        .guide h3 {
            padding-bottom: 8px;
            margin-bottom: 8px;
            font-size: 15px; font-weight: 700; color: #1a1a2e;
            border-bottom: 1px dashed #eee;
        }
        .guide li {
            position: relative;
            margin-bottom: 6px;
            padding-left: 16px;
            font-size: 13px; color: #666; line-height: 1.8;
        }
        .guide li:before {
            content: "";
            position: absolute; left: 3px; top: 9px;
            width: 6px; height: 6px;
            background: #ff6b35;
            border-radius: 50%;
        }

        /* ---------- 榜单总结 ---------- */
        .summary {
            margin-top: 16px;
            padding: 18px 16px 20px;
            background: #fff;
            border: 1px solid #f0f0f0;
            border-radius: 16px;
            box-shadow: 0 2px 12px rgba(0, 0, 0, .04);
        }
        .summary h2 {
            padding-bottom: 10px;
            margin-bottom: 12px;
            font-size: 17px; font-weight: 700; color: #1a1a2e;
            border-bottom: 2px solid #ff6b35;
        }
        .summary p { margin-bottom: 10px; font-size: 13px; color: #444; line-height: 1.8; }
        .summary strong { color: #ff6b35; }

        /* ---------- 常见问题 ---------- */
        .faq {
            padding: 4px 16px 8px;
            background: #fff;
            border: 1px solid #f0f0f0;
            border-radius: 16px;
            box-shadow: 0 2px 12px rgba(0, 0, 0, .04);
        }
        .faq-item { padding: 12px 0; border-bottom: 1px solid #f5f5f5; }
        .faq-item:last-child { border-bottom: 0; }
        .faq-question {
            display: -webkit-flex; display: flex;
            font-size: 14px; font-weight: 600; color: #1a1a2e;
        }
        .faq-question span { margin-right: 6px; color: #ff6b35; font-weight: 700; }
        .faq-answer {
            margin-top: 4px;
            padding-left: 20px;
            font-size: 13px; color: #666; line-height: 1.7;
        }
        .faq-answer:before { content: "A: "; color: #4a6cf7; font-weight: 600; }

        /* ---------- 页脚 ---------- */
        .site-footer {
            margin-top: 24px;
            padding: 16px 12px;
            background: #fff;
            border-top: 1px solid #eee;
            text-align: center;
            font-size: 12px; color: #bbb;
        }
        .footer-inner { max-width: 640px; margin: 0 auto; }
        .footer-links { margin-bottom: 6px; color: #999; }
        .footer-link { margin: 0 6px; color: #999; }
        .footer-copy { font-size: 11px; color: #bbb; line-height: 1.8; }

        /* ---------- 平台核心指标对比 ---------- */
        #compare:before { content: "📊 "; }
        .compare-wrap {
            margin-top: 10px;
            padding: 4px 10px 6px;
            background: #fff;
            border: 1px solid #f0f0f0;
            border-radius: 16px;
            box-shadow: 0 2px 12px rgba(0, 0, 0, .04);
            overflow-x: auto;              /* 窄屏横向滑动看完整表格，不撑破页面 */
            -webkit-overflow-scrolling: touch;
        }
        .compare-table { width: 100%; min-width: 460px; border-collapse: collapse; font-size: 12px; }
        .compare-table th,
        .compare-table td {
            padding: 9px 6px;
            text-align: center;
            white-space: nowrap;
            border-bottom: 1px solid #f0f0f0;
        }
        .compare-table th { background: #f8f9fc; color: #1a1a2e; font-weight: 600; }
        .compare-table th:first-child,
        .compare-table td:first-child { text-align: left; }
        .compare-table tbody tr:last-child td { border-bottom: 0; }
        .compare-table strong { color: #1a1a2e; }
        .compare-table .star { color: #f5a623; font-size: 11px; }
        .compare-table .score {
            display: inline-block;
            padding: 0 8px;
            border-radius: 4px;
            background: #eef3ff;
            color: #4a6cf7;
            font-weight: 700;
        }
        .compare-tip { margin-top: 8px; font-size: 11px; color: #999; text-align: right; }

        /* ---------- 响应式微调（对齐 mof.html 的断点） ---------- */
        @media screen and (max-width: 420px) {
            .rank-item { padding: 10px 10px; }
            .rank-icon { width: 44px; height: 44px; }
            .name-text { font-size: 15px; }
            .download-btn { min-width: 56px; padding: 5px 12px; font-size: 12px; }
            .section-title { font-size: 16px; }
            .banner-content h1 { font-size: 16px; }
        }
        @media screen and (min-width: 640px) {
            .container { padding: 0 20px; }
            .rank-item { padding: 16px 20px; }
            .rank-icon { width: 60px; height: 60px; }
        }

        /* ==================== PC / 宽屏：内容铺满整屏 ====================
           手机与平板（宽度 < 1024px）完全不受影响，仍走上面的窄屏规则。
           1024px 起：内容区去掉 640px 上限、横向铺满整屏；榜单与评价卡片
           排成多列把整行填满；页脚同样铺满。 */
        @media screen and (min-width: 1024px) {
            .container { max-width: none; padding: 0 24px; }
            .footer-inner { max-width: none; }
            .site-footer { padding: 20px 24px; }

            .section-title { margin: 22px 0 12px; font-size: 20px; }
            .section-sub { font-size: 13px; }

            /* 首屏横幅：宽屏改用固定高度，避免「高度 = 宽度 33%」把首屏撑到六七百像素 */
            .banner-img { padding-bottom: 0; height: 320px; }
            .banner-content { padding: 16px 20px 18px; }
            .banner-content h1 { font-size: 22px; }
            .banner-content p { font-size: 14px; }

            /* 榜单卡片：一行 3 列，铺满整行（12 条正好 4 行） */
            .rank-list {
                -webkit-flex-direction: row; flex-direction: row;
                -webkit-flex-wrap: wrap; flex-wrap: wrap;
                -webkit-justify-content: space-between; justify-content: space-between;
            }
            .rank-item { -webkit-flex: 0 0 32.3%; flex: 0 0 32.3%; margin-bottom: 12px; }
            .name-text { font-size: 17px; }

            /* 用户评价卡片：同样 3 列铺满 */
            .review-list {
                display: -webkit-flex; display: flex;
                -webkit-flex-wrap: wrap; flex-wrap: wrap;
                -webkit-justify-content: space-between; justify-content: space-between;
            }
            .review-item { -webkit-flex: 0 0 32.3%; flex: 0 0 32.3%; }

            /* 文字类卡片：宽屏把字号行距放大一点，长行更好读 */
            .guide, .summary, .faq { padding-left: 24px; padding-right: 24px; }
            .summary h2 { font-size: 18px; }
            .faq-question { font-size: 16px; }
            .summary p, .guide li, .faq-answer, .review-content { font-size: 14px; line-height: 1.9; }
        }

        /* 超宽屏（>= 1440px）：榜单改一行 4 列、横幅再高一点，避免大屏留白过多 */
        @media screen and (min-width: 1440px) {
            .container { padding: 0 32px; }
            .banner-img { height: 360px; }
            .rank-item { -webkit-flex: 0 0 24.2%; flex: 0 0 24.2%; }
        }

        @media screen and (prefers-reduced-motion: reduce) {
            .ticker-wrap { -webkit-animation: none; animation: none; }
        }