*{margin:0;padding:0;box-sizing:border-box}
:root{
--gold:#F5A623;--silver:#8E8E93;--bronze:#D4845A;
--primary:#5B7FFF;--primary-light:#E8EEFF;
--bg:#F0F2F5;--card:#FFFFFF;
--text:#2D2D2D;--text-muted:#777;
--green:#34C759;--orange:#FF9500;--red:#FF3B30;
--blue:#007AFF;--purple:#AF52DE;
}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Microsoft YaHei",sans-serif;background:var(--bg);color:var(--text);line-height:1.6;min-height:100vh;display:flex;flex-direction:column}
a{color:inherit;text-decoration:none}
img{max-width:100%}

/* Header */
.header{background:#fff;border-bottom:1px solid #E5E7EB;position:sticky;top:0;z-index:100;box-shadow:0 1px 4px rgba(0,0,0,.04)}
.header-inner{max-width:1100px;margin:0 auto;padding:14px 20px;display:flex;align-items:center;justify-content:space-between}
.logo{font-size:20px;font-weight:800;color:var(--primary)}
.nav-links{display:flex;gap:24px;font-size:14px;color:var(--text-muted)}
.nav-links a:hover{color:var(--primary)}

/* Hero */
.hero{text-align:center;padding:50px 20px 35px;background:linear-gradient(180deg,#E8EEFF 0%,#F0F2F5 100%)}
.hero h1{font-size:clamp(26px,5vw,40px);font-weight:900;margin-bottom:10px;line-height:1.3}
.hero h1 span{color:var(--primary)}
.hero p{color:var(--text-muted);font-size:15px;max-width:560px;margin:0 auto}
.hero-badge{display:inline-block;margin-top:14px;padding:5px 14px;background:#fff;border:1px solid #E0E0E0;border-radius:20px;font-size:13px;color:var(--primary)}

/* Container */
.container{max-width:1100px;margin:0 auto;padding:0 20px;width:100%;flex:1}

/* Section Title */
.section-title{font-size:22px;font-weight:800;margin:40px 0 24px;display:flex;align-items:center;gap:10px}
.section-title::before{content:'';width:4px;height:24px;background:var(--primary);border-radius:2px}

/* Ranking Cards */
.rank-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.rank-card{background:var(--card);border-radius:14px;padding:18px;display:flex;gap:14px;align-items:center;transition:all .3s;border:1px solid #EBEBEB;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.rank-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.08);border-color:var(--primary-light)}

/* Top 3 Special */
.rank-card.top3{border:2px solid;position:relative}
.rank-card.top3::after{content:'';position:absolute;top:0;left:0;right:0;height:3px;border-radius:14px 14px 0 0}
.rank-card.top3.gold{border-color:rgba(245,166,35,.4);background:linear-gradient(135deg,#FFFBF0,#fff)}
.rank-card.top3.gold::after{background:linear-gradient(90deg,var(--gold),#FFD60A)}
.rank-card.top3.silver{border-color:rgba(142,142,147,.4);background:linear-gradient(135deg,#FAFAFA,#fff)}
.rank-card.top3.silver::after{background:linear-gradient(90deg,var(--silver),#C7C7CC)}
.rank-card.top3.bronze{border-color:rgba(212,132,90,.4);background:linear-gradient(135deg,#FFF5EE,#fff)}
.rank-card.top3.bronze::after{background:linear-gradient(90deg,var(--bronze),#E8956E)}

.rank-badge{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:17px;flex-shrink:0;background:#F0F2F5;color:var(--text-muted)}
.rank-card.top3.gold .rank-badge{background:linear-gradient(135deg,var(--gold),#FFD60A);color:#fff}
.rank-card.top3.silver .rank-badge{background:linear-gradient(135deg,var(--silver),#C7C7CC);color:#fff}
.rank-card.top3.bronze .rank-badge{background:linear-gradient(135deg,var(--bronze),#E8956E);color:#fff}

.app-logo{width:48px;height:48px;border-radius:12px;background:var(--primary-light);display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0;overflow:hidden}
.app-logo img{width:100%;height:100%;object-fit:cover;display:block}
.app-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.app-name{font-size:15px;font-weight:700}
.app-tags{display:flex;flex-wrap:wrap;gap:5px}
.tag{padding:2px 9px;border-radius:8px;font-size:11px;font-weight:600;white-space:nowrap}
.tag-green{background:#E8F8EE;color:var(--green)}
.tag-orange{background:#FFF3E0;color:var(--orange)}
.tag-red{background:#FFEBEE;color:var(--red)}
.tag-blue{background:#E3F2FD;color:var(--blue)}
.tag-purple{background:#F3E8FF;color:var(--purple)}

.app-intro{font-size:12px;color:var(--text-muted);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}

.app-rating{display:flex;align-items:center;gap:6px;font-size:13px}
.stars{color:var(--gold);font-size:13px;letter-spacing:1px;white-space:nowrap}
.rating-num{color:var(--text-muted);font-size:12px;white-space:nowrap}

.btn-download{padding:7px 18px;border-radius:9px;border:none;font-size:13px;font-weight:700;cursor:pointer;transition:all .3s;flex-shrink:0;white-space:nowrap;text-align:center}
.btn-primary{background:linear-gradient(135deg,var(--primary),#4A6FE0);color:#fff}
.btn-primary:hover{transform:scale(1.05);box-shadow:0 3px 12px rgba(91,127,255,.35)}
.btn-outline{background:#fff;border:1px solid #DDD;color:var(--text-muted)}
.btn-outline:hover{border-color:var(--primary);color:var(--primary)}
.rank-card.top3 .btn-download{background:linear-gradient(135deg,var(--gold),#FFD60A);color:#fff}

/* 新APP卡片 关键修复 */
.new-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;margin-top:16px}
.new-card{
background:var(--card);
border-radius:14px;
padding:18px;
display:flex;
flex-wrap:wrap;
align-items:flex-start;
transition:all .3s;
border:2px solid var(--green);
box-shadow:0 1px 3px rgba(52,199,89,.1);
overflow:visible;
/* 底部预留按钮空间 */
padding-bottom:30px;
position:relative;
}
.new-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(52,199,89,.15);border-color:#2DB84D}
.new-badge{
width:38px;
height:38px;
border-radius:10px;
display:flex;
align-items:center;
justify-content:center;
font-weight:900;
font-size:11px;
flex-shrink:0;
background:linear-gradient(135deg,var(--green),#2DB84D);
color:#fff;
}
.new-card .app-logo{background:#E8F8EE}
/* 给new-card里的下载按钮强制填充高度、独占整行 */
.new-card .btn-download{
width:100%;
flex:0 0 100%;
margin-top:18px;
min-height:44px;
line-height:44px;
background:linear-gradient(135deg,var(--green),#2DB84D);
color:#fff;
padding:0;
font-size:14px;
border-radius:9px;
display:block;
visibility:visible;
opacity:1;
}
.new-card .btn-download:hover{box-shadow:0 3px 12px rgba(52,199,89,.35)}

/* Accordion */
.accordion-section{margin:40px 0}
.accordion-item{background:var(--card);border-radius:14px;border:1px solid #EBEBEB;margin-bottom:10px;overflow:hidden}
.accordion-header{padding:16px 18px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;user-select:none;background:#fff;transition:background .3s}
.accordion-header:hover{background:#FAFAFA}
.accordion-header h3{font-size:15px;font-weight:700;display:flex;align-items:center;gap:10px}
.accordion-header h3 .icon{width:26px;height:26px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px}
.accordion-arrow{font-size:12px;color:var(--text-muted);transition:transform .3s}
.accordion-item.active .accordion-arrow{transform:rotate(180deg)}
.accordion-content{max-height:0;overflow:hidden;transition:max-height .4s ease}
.accordion-item.active .accordion-content{max-height:2000px}
.accordion-body{padding:0 18px 18px;color:var(--text-muted);font-size:14px;line-height:1.8}
.accordion-body ul{list-style:none;padding:0}
.accordion-body li{padding:7px 0;border-bottom:1px solid #F0F0F0;display:flex;align-items:center;gap:8px}
.accordion-body li:last-child{border:none}

/* Image Gallery */
.img-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin-top:8px}
.img-item{border-radius:10px;overflow:hidden;border:1px solid #EBEBEB;background:#F8F9FA}
.img-item img{width:100%;height:140px;object-fit:cover;display:block}
.img-caption{padding:6px;font-size:12px;color:var(--text-muted);text-align:center}

/* Stats Bar */
.stats-bar{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin:30px 0}
.stat-card{background:#fff;border-radius:14px;padding:18px;text-align:center;border:1px solid #EBEBEB;box-shadow:0 1px 3px rgba(0,0,0,.03)}
.stat-num{font-size:26px;font-weight:900;color:var(--primary)}
.stat-label{font-size:12px;color:var(--text-muted);margin-top:3px}

/* Footer */
.footer{background:#fff;border-top:1px solid #E5E7EB;padding:35px 20px;margin-top:50px}
.footer-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:25px}
.footer-col h4{font-size:14px;font-weight:700;margin-bottom:10px;color:var(--text)}
.footer-col p{color:var(--text-muted);font-size:13px}
.footer-col a{display:block;color:var(--text-muted);font-size:13px;margin-bottom:7px;transition:color .3s}
.footer-col a:hover{color:var(--primary)}
.footer-bottom{max-width:1100px;margin:25px auto 0;padding-top:16px;border-top:1px solid #F0F0F0;text-align:center;font-size:12px;color:#AAA}

/* 电脑端优化 */
@media(min-width:641px){
.rank-card{flex-direction:row;align-items:flex-start}
.app-info{display:flex;flex-direction:column;gap:8px}
.app-intro{order:3;margin-top:4px}
.app-tags{order:2}
.app-rating{order:4}
.app-name{order:1}
.tag{font-size:11px;padding:3px 8px}
.rank-card .btn-download{margin-left:auto}
}

/* 手机端适配 */
@media(max-width:640px){
.header-inner{padding:12px 16px}
.nav-links{display:none}
.hero{padding:35px 16px 25px}
.rank-grid{grid-template-columns:1fr}
.rank-card{flex-wrap:wrap;align-items:flex-start;padding:14px 16px;gap:12px}
.rank-badge{width:34px;height:34px;font-size:15px;flex-shrink:0}
.app-logo{width:44px;height:44px;font-size:20px}
.app-info{flex:1;min-width:0;gap:4px}
.app-name{font-size:14px}
.app-tags{gap:4px}
.tag{font-size:10px;padding:2px 7px}
.app-intro{font-size:11px;line-height:1.4}
.app-rating{font-size:12px;gap:4px}
.rank-card .btn-download{width:100%;margin-top:10px;padding:8px 0;font-size:12px}

.new-grid{grid-template-columns:1fr}
.new-card{padding:14px 16px;gap:12px;padding-bottom:28px;}
.new-badge{width:34px;height:34px;font-size:10px}
.new-card .app-logo{width:44px;height:44px}
.new-card .app-info{flex:1;min-width:0;gap:4px}
.new-card .btn-download{font-size:12px;min-height:38px;line-height:38px;margin-top:10px;}

.stats-bar{grid-template-columns:repeat(2,1fr)}
.img-grid{grid-template-columns:1fr}
.accordion-header h3{font-size:14px}
}

/* 仅电脑大屏加大NEW和图标间距，手机保持原样 */
@media (min-width:641px) {
  .new-badge {
    margin-right:8px !important;
  }
  .new-card {
    gap:18px !important;
  }
}

/* 缩小截图模块底部空白 */
.img-grid {
  margin-bottom: 8px !important;
}
.accordion-body {
  padding-bottom: 12px !important;
}
.accordion-section {
  margin-bottom: 20px !important;
}
.footer {
  margin-top: 25px !important;
}