/* 全面响应式优化 - 覆盖 Tachyons */

/* ============ 手机端 < 600px ============ */
@media screen and (max-width: 600px) {
  /* 标题 */
  article h1.f3,
  .blah h1.f3 {
    font-size: 1.1rem !important;
    line-height: 1.4 !important;
    margin-bottom: 0.5rem !important;
  }
  
  header h1.f2 {
    font-size: 1.3rem !important;
    padding: 0 0.5rem !important;
  }
  
  header h2 {
    font-size: 14px !important;
    padding: 0 1rem !important;
  }
  
  /* 正文 */
  .nested-copy-line-height,
  .nested-links,
  article p {
    font-size: 16px !important;
    line-height: 1.7 !important;
  }
  
  /* 摘要 */
  .f6.f5-l {
    font-size: 14px !important;
    line-height: 1.6 !important;
  }
  
  /* 日期来源 */
  .f6.gray {
    font-size: 12px !important;
    margin-top: 0.3rem !important;
  }
  
  /* 导航 */
  nav .f3 {
    font-size: 1rem !important;
  }
  
  nav li a {
    font-size: 14px !important;
    padding: 0.3rem 0.5rem !important;
  }
  
  /* 标签 */
  a.ph2.pv1 {
    font-size: 11px !important;
    padding: 4px 10px !important;
    margin: 2px 4px 2px 0 !important;
  }
  
  /* 按钮 */
  .f7.ba {
    font-size: 12px !important;
    padding: 5px 12px !important;
  }
  
  /* 布局 */
  .ph3 {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  
  .pv4 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
  }
  
  /* 文章卡片 */
  article.bb {
    padding: 1rem 0 !important;
    margin-bottom: 0 !important;
  }
  
  /* 间距 */
  .mb4 {
    margin-bottom: 1rem !important;
  }
  
  .mt2 { margin-top: 0.3rem !important; }
  .mt4 { margin-top: 1rem !important; }
  
  /* 页面头部 */
  header .pb3-m {
    padding-bottom: 1rem !important;
  }
  
  /* 首页介绍区 */
  article.cf.ph3 {
    padding: 1rem !important;
    font-size: 14px !important;
  }
  
  article.cf h1 {
    font-size: 1.3rem !important;
  }
  
  article.cf h2 {
    font-size: 1rem !important;
  }
  
  /* 列表 */
  ul, li {
    font-size: 14px !important;
    margin: 0.3rem 0 !important;
  }
}

/* ============ 小屏平板 600-768px ============ */
@media screen and (min-width: 601px) and (max-width: 768px) {
  article h1.f3 {
    font-size: 1.2rem !important;
  }
  
  header h1.f2 {
    font-size: 1.5rem !important;
  }
  
  .nested-copy-line-height,
  article p {
    font-size: 16px !important;
    line-height: 1.7 !important;
  }
  
  .f6.f5-l {
    font-size: 15px !important;
  }
  
  nav li a {
    font-size: 15px !important;
  }
}

/* ============ 平板 769-1024px ============ */
@media screen and (min-width: 769px) and (max-width: 1024px) {
  article h1.f3 {
    font-size: 1.3rem !important;
  }
  
  header h1.f2 {
    font-size: 1.8rem !important;
  }
  
  .nested-copy-line-height,
  article p {
    font-size: 17px !important;
    line-height: 1.7 !important;
  }
  
  .w-70-ns {
    width: 85% !important;
  }
}

/* ============ 小桌面 1025-1280px ============ */
@media screen and (min-width: 1025px) and (max-width: 1280px) {
  .w-70-ns {
    width: 75% !important;
  }
  
  article h1.f3 {
    font-size: 1.4rem !important;
  }
  
  .nested-copy-line-height {
    font-size: 16px !important;
    line-height: 1.8 !important;
  }
}

/* ============ 大桌面 > 1280px ============ */
@media screen and (min-width: 1281px) {
  .w-70-ns {
    width: 60% !important;
    max-width: 900px !important;
  }
  
  article h1.f3 {
    font-size: 1.5rem !important;
  }
  
  .nested-copy-line-height {
    font-size: 17px !important;
    line-height: 1.8 !important;
  }
}

/* ============ 全局优化 ============ */

/* 基础字号 */
body {
  font-size: 16px !important;
  line-height: 1.6 !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 文章段落 */
article p {
  margin: 0.8rem 0 !important;
}

/* 链接 */
a {
  text-decoration: none !important;
}

a:hover {
  text-decoration: underline !important;
}

/* 图片自适应 */
img {
  max-width: 100% !important;
  height: auto !important;
}

/* 阅读更多按钮 */
article .ba.b--moon-gray {
  display: inline-block !important;
  margin-top: 0.5rem !important;
}

/* 标签悬停 */
a.ph2.pv1:hover {
  background: #e0e0e0 !important;
}

/* 导航悬停 */
nav a:hover {
  opacity: 0.8 !important;
}

/* 文章卡片悬停 */
article.bb:hover {
  background: #fafafa !important;
}

/* 滚动优化 */
@media screen and (max-width: 600px) {
  body {
    -webkit-overflow-scrolling: touch;
  }
  
  /* 防止横向滚动 */
  html, body {
    overflow-x: hidden !important;
    width: 100% !important;
  }
}
