*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;line-height:1.6;color:#222;background:#fafafa;}
a{color:#0a7c9d;text-decoration:none;}
a:hover{text-decoration:underline;}
.container{max-width:1100px;margin:0 auto;padding:0 16px;}
.site-header{background:#fff;border-bottom:1px solid #eee;margin-bottom:24px;}
.site-header .inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0;}
.logo a{font-size:20px;font-weight:700;color:#0a7c9d;}
.main-nav ul{display:flex;gap:14px;list-style:none;font-size:14px;}
.main-nav a{padding:6px 10px;border-radius:999px;}
.main-nav a.active,.main-nav a:hover{background:#0a7c9d;color:#fff;text-decoration:none;}
.site-main{padding-bottom:40px;}
.hero{background:#f2fbfd;border-bottom:1px solid #e4f4f8;margin-bottom:24px;}
.hero-inner{display:flex;flex-wrap:wrap;align-items:center;padding:32px 0;gap:24px;}
.hero-text{flex:1 1 260px;min-width:260px;}
.hero-text h1{font-size:26px;margin-bottom:12px;}
.hero-text p{margin-bottom:10px;font-size:15px;color:#444;}
.hero-cta{margin-top:10px;}
.btn-primary,.btn-secondary{display:inline-block;padding:8px 16px;border-radius:999px;font-size:14px;margin-right:8px;}
.btn-primary{background:#0a7c9d;color:#fff;}
.btn-secondary{border:1px solid #0a7c9d;color:#0a7c9d;background:#fff;}
.hero-note{font-size:13px;color:#777;margin-top:6px;}
.hero-image{flex:0 0 260px;min-height:160px;background:#e5f5f9;border-radius:18px;}
.hero-image-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#0a7c9d;font-size:13px;}

.section{padding:24px 0;border-bottom:1px solid #eee;background:#fff;margin-bottom:12px;}
.section h2{font-size:20px;margin-bottom:10px;}
.section p{margin-bottom:8px;font-size:15px;color:#444;}
.section ul,.section ol{margin-left:18px;margin-bottom:8px;font-size:15px;color:#444;}
.section-tip{font-size:13px;color:#777;margin-top:6px;}

.entry-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:10px;}
.entry-item{border:1px solid #eee;border-radius:12px;padding:14px;background:#fcfcfc;}
.entry-item h3{font-size:17px;margin-bottom:6px;}
.entry-item p{font-size:14px;margin-bottom:6px;}

.table-wrapper{overflow:auto;margin-top:8px;}
.compare-table{width:100%;border-collapse:collapse;font-size:14px;}
.compare-table th,.compare-table td{border:1px solid #ddd;padding:6px 8px;vertical-align:top;}
.compare-table thead{background:#f3f8fb;}

.page-header{padding:20px 0 10px;background:#fff;border-bottom:1px solid #eee;margin-bottom:12px;}
.page-header h1{font-size:24px;margin-bottom:8px;}
.page-intro{font-size:15px;color:#444;}
.page-content{background:#fff;padding:10px 0;}

.howto-list{margin-left:18px;}
.howto-list li{margin-bottom:4px;}

.link-list{list-style:none;margin:8px 0;}
.link-list li{margin-bottom:4px;font-size:14px;}

.faq-item{margin-bottom:10px;}
.faq-item h3{font-size:15px;margin-bottom:4px;}
.faq-item p{font-size:14px;color:#444;}

.tutorial-list{list-style:none;margin-top:8px;}
.tutorial-list li{margin-bottom:4px;font-size:14px;}

.img-wrap{margin:12px 0;text-align:center;}
.img-wrap img{max-width:100%;border-radius:10px;border:1px solid #eee;}

.site-footer{border-top:1px solid #eee;padding:14px 0;margin-top:20px;background:#fff;font-size:13px;color:#666;}
@media (max-width:768px){
  .hero-inner{flex-direction:column;}
}