* {
margin: 0;
padding: 0;
box-sizing: border-box;
}

:root {
--color-primary: #5eb3f6;
--color-secondary: #f9a8d4;
--color-accent: #a78bfa;
--color-dark: #1e293b;
--color-light: #f8fafc;
--color-text: #334155;
--color-border: #e2e8f0;
--gradient-main: linear-gradient(135deg, #5eb3f6 0%, #a78bfa 100%);
--gradient-soft: linear-gradient(135deg, #dbeafe 0%, #fce7f3 100%);
--shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
--shadow-md: 0 4px 16px rgba(0, 0, 0, 0.12);
--shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.16);
}

body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Microsoft YaHei', sans-serif;
line-height: 1.6;
color: var(--color-text);
background: var(--color-light);
overflow-x: hidden;
}

img {
max-width: 100%;
height: auto;
display: block;
}

a {
text-decoration: none;
color: var(--color-primary);
transition: color 0.3s ease;
}

a:hover {
color: var(--color-secondary);
}

.container9x4k {
max-width: 1200px;
margin: 0 auto;
padding: 0 20px;
}

.nav7m2p {
background: white;
box-shadow: var(--shadow-sm);
position: sticky;
top: 0;
z-index: 1000;
}

.nav7m2p .container9x4k {
display: flex;
justify-content: space-between;
align-items: center;
padding: 15px 20px;
}

.logo3a8n {
display: flex;
align-items: center;
gap: 12px;
}

.icon2m5p {
width: 40px;
height: 40px;
border-radius: 8px;
}

.title8k3v {
font-size: 1.3rem;
font-weight: 700;
background: var(--gradient-main);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}

.menu-toggle5w7q {
display: none;
background: none;
border: none;
font-size: 1.5rem;
color: var(--color-primary);
cursor: pointer;
padding: 8px;
}

.menu6p2n {
display: flex;
list-style: none;
gap: 30px;
align-items: center;
}

.menu6p2n a {
color: var(--color-text);
font-weight: 500;
padding: 8px 0;
position: relative;
}

.menu6p2n a::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 0;
height: 2px;
background: var(--gradient-main);
transition: width 0.3s ease;
}

.menu6p2n a:hover::after {
width: 100%;
}

.hero3k8m {
background: var(--gradient-soft);
padding: 60px 0;
}

.hero-content2m7p {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 40px;
align-items: center;
}

.game-info4x9n {
display: flex;
gap: 20px;
}

.app-icon6m2k {
width: 120px;
height: 120px;
border-radius: 20px;
box-shadow: var(--shadow-md);
}

.info-text8p5n {
flex: 1;
}

.game-title3m9x {
font-size: 2.5rem;
color: var(--color-dark);
margin-bottom: 15px;
line-height: 1.2;
}

.tags7k2m {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-bottom: 20px;
}

.tag4x8p {
background: white;
padding: 6px 14px;
border-radius: 20px;
font-size: 0.9rem;
color: var(--color-primary);
font-weight: 500;
box-shadow: var(--shadow-sm);
display: inline-flex;
align-items: center;
gap: 6px;
}

.description6n3k {
font-size: 1.1rem;
color: var(--color-text);
margin-bottom: 25px;
line-height: 1.7;
}

.download-btn2k9m {
background: var(--gradient-main);
color: white;
border: none;
padding: 15px 35px;
border-radius: 30px;
font-size: 1.1rem;
font-weight: 600;
cursor: pointer;
box-shadow: var(--shadow-md);
transition: all 0.3s ease;
display: inline-flex;
align-items: center;
gap: 10px;
}

.download-btn2k9m:hover {
transform: translateY(-3px);
box-shadow: var(--shadow-lg);
}

.hero-image5p7k {
border-radius: 20px;
overflow: hidden;
box-shadow: var(--shadow-lg);
}

.hero-image5p7k img {
width: 100%;
height: auto;
object-fit: cover;
}

.section4k7n {
padding: 80px 0;
}

.section-alt2m9k {
background: white;
}

.section-title5m8p {
font-size: 2.2rem;
color: var(--color-dark);
text-align: center;
margin-bottom: 50px;
display: flex;
align-items: center;
justify-content: center;
gap: 15px;
}

.section-title5m8p i {
color: var(--color-primary);
}

.intro-content7x3m .text-block9k4p p {
font-size: 1.05rem;
line-height: 1.8;
margin-bottom: 25px;
color: var(--color-text);
}

.content-img3m7k {
width: 100%;
max-width: 800px;
margin: 30px auto;
border-radius: 15px;
box-shadow: var(--shadow-md);
}

.features-grid6x8m {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 30px;
}

.feature-card4m7p {
background: white;
padding: 30px;
border-radius: 15px;
box-shadow: var(--shadow-sm);
transition: all 0.3s ease;
text-align: center;
}

.feature-card4m7p:hover {
transform: translateY(-5px);
box-shadow: var(--shadow-md);
}

.feature-icon8k3n {
width: 70px;
height: 70px;
background: var(--gradient-main);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 20px;
}

.feature-icon8k3n i {
font-size: 2rem;
color: white;
}

.feature-title9x2k {
font-size: 1.3rem;
color: var(--color-dark);
margin-bottom: 15px;
}

.feature-card4m7p p {
color: var(--color-text);
line-height: 1.6;
}

.content-grid7m4x {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 30px;
}

.content-card6k9p {
background: white;
border-radius: 15px;
overflow: hidden;
box-shadow: var(--shadow-sm);
transition: all 0.3s ease;
}

.content-card6k9p:hover {
transform: translateY(-5px);
box-shadow: var(--shadow-md);
}

.content-card6k9p img {
width: 100%;
height: 220px;
object-fit: cover;
}

.card-body3x7m {
padding: 25px;
}

.card-body3x7m h3 {
font-size: 1.3rem;
color: var(--color-dark);
margin-bottom: 12px;
display: flex;
align-items: center;
gap: 10px;
}

.card-body3x7m h3 i {
color: var(--color-primary);
}

.card-body3x7m p {
color: var(--color-text);
line-height: 1.6;
}

.guide-content8x4m {
max-width: 900px;
margin: 0 auto;
}

.guide-step7k2p {
display: flex;
gap: 25px;
margin-bottom: 40px;
}

.step-number5m9x {
width: 60px;
height: 60px;
background: var(--gradient-main);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.8rem;
font-weight: 700;
color: white;
flex-shrink: 0;
}

.step-content3x6k h3 {
font-size: 1.4rem;
color: var(--color-dark);
margin-bottom: 10px;
}

.step-content3x6k p {
color: var(--color-text);
line-height: 1.7;
}

.reviews-summary6m8x {
background: white;
padding: 40px;
border-radius: 15px;
box-shadow: var(--shadow-sm);
margin-bottom: 40px;
display: grid;
grid-template-columns: 250px 1fr;
gap: 40px;
align-items: center;
}

.rating-overview4k7p {
text-align: center;
}

.rating-score9x3m {
font-size: 4rem;
font-weight: 700;
color: var(--color-primary);
line-height: 1;
margin-bottom: 10px;
}

.rating-stars6k2p {
font-size: 1.5rem;
color: #fbbf24;
margin-bottom: 10px;
}

.rating-count3m7x {
color: var(--color-text);
font-size: 0.95rem;
}

.rating-breakdown7x5m {
display: flex;
flex-direction: column;
gap: 15px;
}

.rating-bar4k9p {
display: grid;
grid-template-columns: 100px 1fr 60px;
gap: 15px;
align-items: center;
}

.bar-container8m3x {
height: 10px;
background: var(--color-border);
border-radius: 5px;
overflow: hidden;
}

.bar-fill6k2p {
height: 100%;
background: var(--gradient-main);
border-radius: 5px;
}

.reviews-grid5x9m {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 30px;
}

.review-card7k3p {
background: white;
padding: 25px;
border-radius: 15px;
box-shadow: var(--shadow-sm);
}

.reviewer-info4m8x {
display: flex;
gap: 15px;
margin-bottom: 15px;
}

.avatar6k2m {
width: 50px;
height: 50px;
background: var(--gradient-main);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
color: white;
font-weight: 600;
flex-shrink: 0;
}

.reviewer-details3x7p h4 {
font-size: 1rem;
color: var(--color-dark);
margin-bottom: 5px;
}

.stars4m9k {
color: #fbbf24;
font-size: 0.9rem;
}

.review-card7k3p p {
color: var(--color-text);
line-height: 1.7;
}

.articles-grid3x8m {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 40px;
}

.article-section5k7p h3 {
font-size: 1.5rem;
color: var(--color-dark);
margin-bottom: 20px;
display: flex;
align-items: center;
gap: 10px;
}

.article-section5k7p h3 i {
color: var(--color-primary);
}

.article-list6m4k {
list-style: none;
}

.article-list6m4k li {
margin-bottom: 15px;
}

.article-list6m4k a {
color: var(--color-text);
font-size: 1.05rem;
display: flex;
align-items: flex-start;
gap: 10px;
padding: 12px;
border-radius: 8px;
transition: all 0.3s ease;
}

.article-list6m4k a:hover {
background: var(--gradient-soft);
color: var(--color-primary);
}

.article-list6m4k i {
color: var(--color-primary);
margin-top: 3px;
}

.cta-section9m6x {
background: var(--gradient-main);
color: white;
text-align: center;
}

.cta-content5x8p h2 {
font-size: 2.5rem;
margin-bottom: 15px;
color: white;
}

.cta-content5x8p p {
font-size: 1.2rem;
margin-bottom: 30px;
opacity: 0.95;
}

.cta-section9m6x .download-btn2k9m {
background: white;
color: var(--color-primary);
}

.cta-section9m6x .download-btn2k9m:hover {
transform: translateY(-3px) scale(1.05);
}

.links-grid7k4m {
display: flex;
flex-wrap: wrap;
gap: 15px;
justify-content: center;
}

.link-item3x9p {
background: white;
padding: 12px 24px;
border-radius: 25px;
box-shadow: var(--shadow-sm);
transition: all 0.3s ease;
}

.link-item3x9p:hover {
transform: translateY(-2px);
box-shadow: var(--shadow-md);
background: var(--gradient-soft);
}

.footer6m8k {
background: var(--color-dark);
color: white;
padding: 50px 0 20px;
}

.footer-content3x7m {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 40px;
margin-bottom: 40px;
}

.footer-section4k9p h4 {
font-size: 1.2rem;
margin-bottom: 15px;
color: var(--color-secondary);
}

.footer-section4k9p p {
color: rgba(255, 255, 255, 0.8);
line-height: 1.6;
}

.footer-links5m2x {
list-style: none;
}

.footer-links5m2x li {
margin-bottom: 10px;
}

.footer-links5m2x a {
color: rgba(255, 255, 255, 0.8);
}

.footer-links5m2x a:hover {
color: var(--color-secondary);
}

.footer-links5m2x i {
margin-right: 8px;
color: var(--color-primary);
}

.footer-bottom7x3k {
border-top: 1px solid rgba(255, 255, 255, 0.1);
padding-top: 20px;
text-align: center;
color: rgba(255, 255, 255, 0.6);
}

@media (max-width: 768px) {
.menu-toggle5w7q {
display: block;
}

.menu6p2n {
position: fixed;
top: 70px;
left: -100%;
width: 100%;
height: calc(100vh - 70px);
background: white;
flex-direction: column;
padding: 20px;
box-shadow: var(--shadow-md);
transition: left 0.3s ease;
align-items: flex-start;
overflow-y: auto;
}

.menu6p2n.active {
left: 0;
}

.menu6p2n a {
width: 100%;
padding: 15px;
border-bottom: 1px solid var(--color-border);
color: var(--color-dark);
font-size: 1.1rem;
}

.hero-content2m7p {
grid-template-columns: 1fr;
gap: 30px;
}

.game-info4x9n {
flex-direction: column;
align-items: center;
text-align: center;
}

.app-icon6m2k {
width: 100px;
height: 100px;
}

.game-title3m9x {
font-size: 1.8rem;
}

.tags7k2m {
justify-content: center;
}

.hero-image5p7k {
order: -1;
}

.section4k7n {
padding: 50px 0;
}

.section-title5m8p {
font-size: 1.8rem;
}

.features-grid6x8m,
.content-grid7m4x,
.articles-grid3x8m {
grid-template-columns: 1fr;
}

.reviews-summary6m8x {
grid-template-columns: 1fr;
padding: 30px 20px;
}

.reviews-grid5x9m {
grid-template-columns: 1fr;
}

.guide-step7k2p {
flex-direction: column;
align-items: center;
text-align: center;
}

.footer-content3x7m {
grid-template-columns: 1fr;
gap: 30px;
}

.cta-content5x8p h2 {
font-size: 1.8rem;
}

.cta-content5x8p p {
font-size: 1.05rem;
}
}

@media (max-width: 480px) {
.game-title3m9x {
font-size: 1.5rem;
}

.section-title5m8p {
font-size: 1.5rem;
flex-direction: column;
gap: 10px;
}

.download-btn2k9m {
padding: 12px 25px;
font-size: 1rem;
}

.rating-score9x3m {
font-size: 3rem;
}
}
.back-btn4x7m {
background: var(--gradient-main);
color: white;
padding: 10px 20px;
border-radius: 25px;
display: inline-flex;
align-items: center;
gap: 8px;
font-weight: 500;
transition: all 0.3s ease;
}

.back-btn4x7m:hover {
transform: translateY(-2px);
box-shadow: var(--shadow-md);
color: white;
}

.article-container6k9m {
max-width: 900px;
margin: 0 auto;
padding: 40px 20px;
}

.article-header5m8p {
margin-bottom: 40px;
padding-bottom: 30px;
border-bottom: 2px solid var(--color-border);
}

.article-header5m8p h1 {
font-size: 2.5rem;
color: var(--color-dark);
margin-bottom: 20px;
line-height: 1.3;
}

.article-meta3x7k {
display: flex;
flex-wrap: wrap;
gap: 20px;
color: var(--color-text);
font-size: 0.95rem;
}

.article-meta3x7k span {
display: inline-flex;
align-items: center;
gap: 6px;
}

.article-meta3x7k i {
color: var(--color-primary);
}

.article-content7m2x {
line-height: 1.8;
}

.content-section4k8p {
margin-bottom: 50px;
}

.content-section4k8p h2 {
font-size: 1.8rem;
color: var(--color-dark);
margin-bottom: 20px;
display: flex;
align-items: center;
gap: 12px;
padding-bottom: 10px;
border-bottom: 2px solid var(--gradient-main);
}

.content-section4k8p h2 i {
color: var(--color-primary);
}

.content-section4k8p h3 {
font-size: 1.4rem;
color: var(--color-dark);
margin: 25px 0 15px;
}

.content-section4k8p h4 {
font-size: 1.2rem;
color: var(--color-dark);
margin: 20px 0 10px;
}

.content-section4k8p p {
margin-bottom: 15px;
color: var(--color-text);
font-size: 1.05rem;
}

.content-section4k8p ol,
.content-section4k8p ul {
margin: 20px 0;
padding-left: 30px;
}

.content-section4k8p li {
margin-bottom: 12px;
color: var(--color-text);
font-size: 1.05rem;
}

.content-section4k8p strong {
color: var(--color-dark);
font-weight: 600;
}

.tips-box7m3k {
background: linear-gradient(135deg, #dbeafe 0%, #e0e7ff 100%);
border-left: 4px solid var(--color-primary);
padding: 20px;
margin: 25px 0;
border-radius: 8px;
display: flex;
gap: 15px;
}

.tips-box7m3k.warning {
background: linear-gradient(135deg, #fef3c7 0%, #fecaca 100%);
border-left-color: #f59e0b;
}

.tips-box7m3k > i {
font-size: 1.5rem;
color: var(--color-primary);
flex-shrink: 0;
}

.tips-box7m3k.warning > i {
color: #f59e0b;
}

.tips-box7m3k strong {
display: block;
margin-bottom: 10px;
color: var(--color-dark);
}

.tips-box7m3k ul {
margin: 10px 0 0;
padding-left: 20px;
}

.tips-box7m3k li {
margin-bottom: 8px;
}

.faq-item5m9x {
background: white;
padding: 20px;
margin-bottom: 15px;
border-radius: 8px;
box-shadow: var(--shadow-sm);
}

.faq-item5m9x h4 {
color: var(--color-primary);
margin-bottom: 10px;
font-size: 1.1rem;
}

.faq-item5m9x p {
margin: 0;
color: var(--color-text);
}

.article-footer3x9k {
margin-top: 50px;
padding-top: 30px;
border-top: 2px solid var(--color-border);
text-align: center;
}

.btn-primary6m4x {
background: var(--gradient-main);
color: white;
padding: 12px 30px;
border-radius: 25px;
display: inline-flex;
align-items: center;
gap: 10px;
font-weight: 600;
transition: all 0.3s ease;
}

.btn-primary6m4x:hover {
transform: translateY(-2px);
box-shadow: var(--shadow-md);
color: white;
}

@media (max-width: 768px) {
.article-header5m8p h1 {
font-size: 1.8rem;
}

.content-section4k8p h2 {
font-size: 1.5rem;
}

.content-section4k8p h3 {
font-size: 1.2rem;
}

.article-meta3x7k {
flex-direction: column;
gap: 10px;
}

.tips-box7m3k {
flex-direction: column;
}
}

.seo-news-section{padding:3rem 1rem;margin:2rem auto;max-width:1180px}.seo-news-section h2{margin:0 0 1.25rem}.seo-news-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:1rem}.seo-news-card{padding:1rem;border:1px solid rgba(127,127,127,.24);border-radius:10px;background:var(--bg-card,var(--light-bg,rgba(255,255,255,.9)));color:var(--text-primary,var(--text-dark,#222));box-shadow:0 8px 24px rgba(0,0,0,.08)}.seo-news-card h2,.seo-news-card h3{margin:.1rem 0 .55rem}.seo-news-card a{color:inherit}.seo-news-card time{font-size:.85rem;opacity:.72}.seo-news-card p{margin:.65rem 0 0;line-height:1.7;opacity:.86}.seo-friend-section{padding:1.5rem 1rem;max-width:1180px;margin:auto}.seo-friend-links{display:flex;flex-wrap:wrap;gap:.75rem}.seo-friend-links a{display:inline-block;padding:.45rem .7rem;border:1px solid rgba(127,127,127,.25);border-radius:7px;color:inherit;text-decoration:none}.seo-prose{line-height:1.9;white-space:normal;overflow-wrap:anywhere}.seo-return{max-width:920px;margin:2rem auto;padding:0 1rem}.seo-return a{color:inherit;text-decoration:underline}@media(max-width:600px){.seo-news-section{padding:2rem .75rem}.seo-news-card{min-width:0}.seo-prose{font-size:1rem}}
