:root{
  --ink:#1a1d21; --muted:#5b6470; --line:#e3e7ec; --bg:#f7f8fa;
  --accent:#2563eb; --accent-bg:#eaf1fe; --card:#ffffff;
  --good:#15803d; --good-bg:#f0fdf4; --warn:#b45309; --warn-bg:#fffbeb;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:-apple-system,"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;color:var(--ink);background:var(--bg);line-height:1.7}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
header.site{background:linear-gradient(135deg,#111827,#1e3a5f);color:#fff;padding:28px 20px 22px}
header.site .wrap,main,footer.site .wrap{max-width:980px;margin:0 auto}
header.site h1{margin:0 0 6px;font-size:26px}
header.site p{margin:0;color:#c7cedb;font-size:14px}
header.site a{color:#fff}
nav.cats{margin-top:14px;display:flex;gap:8px;flex-wrap:wrap}
nav.cats a{background:#1f2937;color:#e5e7eb;padding:4px 12px;border-radius:999px;font-size:13px}
nav.cats a:hover{background:#374151;text-decoration:none}
main{padding:24px 20px 40px}
section.cat{margin-bottom:36px;scroll-margin-top:16px}
section.cat h2{font-size:20px;border-left:4px solid var(--accent);padding-left:10px;margin:0 0 6px}
section.cat p.desc{color:var(--muted);margin:0 0 12px;font-size:14px}
/* 表格：外层 .tw 负责小屏横向滚动，表格本身保持卡片样式 */
.tw{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:8px;background:var(--card)}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{background:var(--accent-bg);font-weight:600;white-space:nowrap}
tr:last-child td{border-bottom:none}
tbody tr:nth-child(even) td{background:#fafbfc}
td.tool{font-weight:600;white-space:nowrap}
td.tool a{font-size:15px}
.price{font-weight:600;color:var(--ink);white-space:nowrap}
.note{color:var(--muted);font-size:13px}
.card{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:20px 22px}
.card h1{margin-top:0;font-size:24px}
.kv{display:grid;grid-template-columns:110px 1fr;gap:6px 14px;margin:16px 0;font-size:15px}
.kv dt{color:var(--muted)}
.kv dd{margin:0}
.btn{display:inline-block;background:var(--accent);color:#fff;padding:9px 20px;border-radius:6px;margin:10px 0 4px;font-weight:600}
.btn:hover{background:#1d4ed1;text-decoration:none}
.aff-note{color:var(--muted);font-size:12px;margin:2px 0 10px}
ul{padding-left:20px}
/* 首页快速选 */
.picks{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px;margin:0 0 30px}
.picks a{display:block;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:12px 14px;color:var(--ink)}
.picks a:hover{border-color:var(--accent);text-decoration:none;box-shadow:0 2px 8px rgba(37,99,235,.12)}
.picks b{display:block;font-size:14px;margin-bottom:2px}
.picks span{font-size:13px;color:var(--muted)}
/* 详情页优缺点 */
.pc{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:14px 0}
.pc .box{border:1px solid var(--line);border-radius:8px;padding:12px 16px}
.pc .box h3{margin:0 0 6px;font-size:15px}
.pc .box ul{margin:0;padding-left:18px;font-size:14px}
.pc .pros{background:var(--good-bg)}
.pc .pros h3{color:var(--good)}
.pc .cons{background:var(--warn-bg)}
.pc .cons h3{color:var(--warn)}
footer.site{border-top:1px solid var(--line);padding:18px 20px 30px;color:var(--muted);font-size:13px;background:#fff}
footer.site .friends{margin-bottom:10px}
footer.site .friends b{color:var(--ink);font-weight:600;margin-right:6px}
footer.site .friends a{margin-right:14px;white-space:nowrap}
.crumb{font-size:13px;color:var(--muted);margin-bottom:10px}
.tag{display:inline-block;background:var(--accent-bg);color:var(--accent);border-radius:4px;padding:0 6px;font-size:12px;margin-left:6px}
@media (max-width:640px){
  header.site h1{font-size:21px}
  main{padding:16px 12px 32px}
  .card{padding:16px 14px}
  .card h1{font-size:20px}
  table{min-width:620px}
  .card table{min-width:480px}
  .kv{grid-template-columns:84px 1fr;font-size:14px}
  .pc{grid-template-columns:1fr}
  td.tool{white-space:normal}
}
