/* ===== 首页 · AI 导航栏目（最常用 30 款） ===== */
.hnav{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:16px 18px 12px;margin-bottom:20px}
.hnav-hd{display:flex;align-items:center;gap:10px;margin-bottom:4px}
.hnav-hd h2{margin:0;font-size:18px;line-height:1.45;display:flex;align-items:center;gap:8px}
.hnav-hd h2:before{content:"";width:4px;height:18px;border-radius:2px;background:#2563eb;flex:0 0 auto}
.hnav-hd em{font-style:normal;font-size:13px;font-weight:400;color:#94a3b8}
.hnav-more{margin-left:auto;font-size:13px;color:#2563eb;white-space:nowrap}
.hnav-more:hover{color:#1d4ed8;text-decoration:underline}
.hnav-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:4px}
.hnav-item{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 2px;border-radius:10px;text-align:center;transition:.15s}
.hnav-item:hover{background:#f5f8ff}
.hnav-ic{width:46px;height:46px;border-radius:12px;background:#f8fafc;border:1px solid #eef2f7;
  display:flex;align-items:center;justify-content:center;overflow:hidden;flex:0 0 auto}
.hnav-ic img{width:32px;height:32px;object-fit:contain;display:block}
.hnav-ph{width:32px;height:32px;border-radius:8px;background:#e0e7ff;color:#4338ca;
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:15px}
.hnav-nm{font-size:13px;line-height:1.25;color:#374151;max-width:100%;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}
.hnav-item:hover .hnav-nm{color:#2563eb}

@media (max-width:820px){
  .hnav{padding:14px 12px 10px;border-radius:10px}
  .hnav-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .hnav-ic{width:42px;height:42px}
  .hnav-ic img,.hnav-ph{width:28px;height:28px}
  .hnav-nm{font-size:12px}
}
@media (max-width:560px){
  .hnav-hd em{display:none}
  .hnav-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
  .hnav-ic{width:40px;height:40px}
  .hnav-nm{font-size:12px}
}
@media (max-width:400px){
  .hnav-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .hnav-item{padding:8px 1px}
}

/* 手机端：只展示最常用 20 款（隐藏第 21~30 款） */
@media (max-width:640px){
  .hnav-item:nth-child(n+21){display:none}
  .hnav-hd em{display:none}
}