/* 页面专属样式：news
   站点级样式（设计令牌 / 顶栏 / 页头 / 搜索 / 按钮 / 栅格容器）由 site.css 统一提供，
   本文件只保留该页特有的规则。 */
.bread{
padding:12px 0;font-size:13px;color:var(--muted);border-bottom:1px solid var(--line);background:var(--white)
}

.page-head{
padding:24px 0 16px
}
.page-head h1{
font-size:26px;font-weight:700;margin-bottom:4px
}
.page-head p{
font-size:14px;color:var(--muted)
}
.tabs{
display:flex;gap:0;border-bottom:2px solid var(--line);margin-bottom:20px
}
.tabs a{
padding:10px 18px;font-size:15px;font-weight:600;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-2px;white-space:nowrap
}
.tabs a:hover{
color:var(--green)
}
.tabs a.on{
color:var(--green-d);border-bottom-color:var(--green-d)
}
.posts{
display:flex;flex-direction:column
}
.post{
display:flex;gap:16px;padding:20px 0;border-bottom:1px solid var(--line2)
}
.post:first-child{
padding-top:0
}
.post .thumb{
flex:none;width:200px;height:130px;background:linear-gradient(135deg,#e8f3ea,#cbe2d4);border-radius:var(--r);overflow:hidden;flex-shrink:0
}
.post .thumb span{
width:100%;height:100%;display:grid;place-items:center;color:#8a9e90;font-size:12px
}
.post .body{
flex:1;display:flex;flex-direction:column
}
.post .cat{
display:inline-block;font-size:11px;font-weight:700;color:#fff;background:var(--green);padding:2px 8px;border-radius:4px;margin-bottom:8px;width:fit-content
}
.post h2{
font-size:18px;line-height:1.5;font-weight:700;margin-bottom:6px
}
.post h2 a:hover{
color:var(--green-d)
}
.post .sum{
font-size:14px;color:var(--ink2);line-height:1.7;flex:1;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden
}
.post .meta{
margin-top:auto;display:flex;gap:14px;font-size:12px;color:var(--muted);margin-top:10px
}
.post .meta time{
font-variant-numeric:tabular-nums
}
.post .meta .views::before{
content:"阅读 ";opacity:.7
}
.page-nav{
display:flex;align-items:center;justify-content:center;gap:5px;padding:28px 0
}
.page-nav a,.page-nav span{
display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:0 10px;border:1px solid var(--line);border-radius:var(--r);font-size:14px
}
.page-nav a:hover{
border-color:var(--green-l);background:var(--green-bg);color:var(--green-d)
}
.page-nav .cur{
background:var(--green);border-color:var(--green);color:#fff;font-weight:700
}
.page-nav .dots{
border:0;color:var(--muted)
}
@media(max-width:800px){
.post{
flex-direction:column
}
.post .thumb{
width:100%;height:160px
}
}
@media(max-width:500px){
.post h2{
font-size:16px
}
}
@media(prefers-reduced-motion:reduce){
.post:hover{
transform:none
}
}