
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:Arial,Helvetica,sans-serif;background:#f8fafc;color:#1e293b;line-height:1.6}
a{text-decoration:none;color:#2563eb}
header{background:#ffffff;padding:15px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e2e8f0}
.logo{font-size:22px;font-weight:bold;color:#2563eb}
nav a{margin-left:15px;font-size:14px}
.container{max-width:1100px;margin:auto;padding:50px 20px}
h1,h2,h3{margin-bottom:15px}
.hero{text-align:center;padding:60px 20px;background:#e0f2fe;border-radius:10px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-top:30px}
.card{background:#ffffff;padding:20px;border-radius:10px;border:1px solid #e2e8f0;transition:transform 0.3s ease, box-shadow 0.3s ease;text-align:center;}
.card-image{width: 100%;}
.card:hover{transform: translateY(-8px);box-shadow: 0 12px 20px rgba(0,0,0,0.08);}
.btn{display:inline-block;background:#2563eb;color:#fff;padding:7px 10px;border-radius:5px;margin-top:10px}
footer{background:#ffffff;text-align:center;padding:20px;font-size:14px;margin-top:40px;border-top:1px solid #e2e8f0}
.game-container{background:#ffffff;padding:25px;border-radius:10px;border:1px solid #e2e8f0;margin-top:20px}
textarea{width:100%;padding:10px;border-radius:5px;margin-top:10px;border:1px solid #cbd5e1}
button{padding:10px 15px;border:none;border-radius:5px;margin-top:10px;background:#2563eb;color:#fff;cursor:pointer}
section{margin-top:60px}
.faq-item{margin-bottom:15px}
.leaderboard{margin-top:20px;background:#f1f5f9;padding:15px;border-radius:8px}
#ad-top,#ad-bottom{margin:30px 0;text-align:center;padding:20px;background:#f1f5f9;border-radius:8px}

.game-header{display:flex; gap:1rem;}

.seo-content {
    margin-top: 80px;
  }
  
  .seo-content section {
    margin-bottom: 60px;
  }
  
  .seo-content h2 {
    font-size: 26px;
    margin-bottom: 20px;
  }
  
  .seo-content h3 {
    font-size: 20px;
    margin-top: 20px;
    margin-bottom: 10px;
  }
  
  .feature-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin-top: 20px;
  }
  
  .feature-item {
    background: #ffffff;
    padding: 20px;
    border-radius: 10px;
    border: 1px solid #e2e8f0;
  }
  
  .faq-item {
    background-color: white;
    padding: 1px 10px 20px 10px;
    margin-bottom: 20px;
  }
  
  .benefit-list {
    list-style: none;
    padding-left: 0;
    margin-top: 20px;
  }
  
  .benefit-list li {
    margin-bottom: 10px;
  }

  .typing-stats,
.typing-tips {
  margin-top: 20px;
  padding-left: 20px;
}

.typing-stats li,
.typing-tips li {
  margin-bottom: 8px;
}  
