/* 966SEO 栏目页：栏目头 / 子栏目 / 工具条 / 列表 / 侧栏（依赖 site.css token） */
.mid{max-width:1240px;margin:0 auto}
.cat-wrap{display:grid;grid-template-columns:minmax(0,1fr) 316px;gap:26px;margin-top:20px;align-items:start}
@media(max-width:1080px){.cat-wrap{grid-template-columns:1fr}.cat-wrap .cat-side{display:none}}

/* 栏目标头 */
.cat-hero{position:relative;overflow:hidden;border-radius:24px;padding:30px 32px 28px;margin-top:14px;
  display:grid;grid-template-columns:1fr 292px;gap:38px;align-items:center}
@media(max-width:940px){.cat-hero{grid-template-columns:1fr;gap:22px}.ch-aside{display:none}}
.ch-main{position:relative;min-width:0}
.ch-aside{position:relative;border-left:1px solid var(--line2);padding-left:26px}
.ca-q{font-size:14.2px;line-height:1.86;color:var(--fg);font-weight:620;letter-spacing:-.015em;text-wrap:pretty}
.ca-q::before{content:"\201C";font-family:Georgia,serif;font-size:34px;line-height:0;color:var(--accent);
  opacity:.5;margin-right:1px;vertical-align:-6px}
.ca-by{margin-top:13px;font-family:var(--mono);font-size:9px;color:var(--fg3);letter-spacing:.08em}
.cat-hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(78deg,color-mix(in srgb,var(--fg) 7%,transparent) 0 1px,transparent 1px 30px);
  -webkit-mask-image:linear-gradient(100deg,transparent 38%,#000 96%);
  mask-image:linear-gradient(100deg,transparent 38%,#000 96%)}
.cat-hero::after{content:"";position:absolute;right:4%;top:-58%;width:34%;height:210%;pointer-events:none;
  background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--a2) 22%,transparent),transparent 66%);filter:blur(70px)}
.ch-k{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:9px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--accent);font-weight:750;margin-bottom:11px}
.ch-k::before{content:"";width:16px;height:1.5px;background:var(--accent)}
.cat-hero h1{font-size:clamp(28px,3.4vw,42px);font-weight:900;letter-spacing:-.015em;line-height:1.1}
.cat-hero .dek{font-size:13.6px;color:var(--fg2);line-height:1.72;margin-top:11px;max-width:62ch}
.ch-m{display:flex;gap:34px;margin-top:22px;flex-wrap:wrap;position:relative}
.ch-m div{display:flex;flex-direction:column;gap:2px}
.ch-m b{font-family:var(--mono);font-size:21px;font-weight:800;letter-spacing:-.04em}
.ch-m span{font-family:var(--mono);font-size:8.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--fg3)}
.ch-subs{display:flex;gap:7px;flex-wrap:wrap;margin-top:20px;position:relative}

/* 排序条 */
.bar2{display:flex;align-items:center;gap:14px;margin-top:18px;padding:0 2px;flex-wrap:wrap}
.sorts{display:flex;gap:2px;padding:3px;border-radius:11px;background:var(--glass);border:1px solid var(--line2)}
.sorts a{display:flex;align-items:center;height:28px;padding:0 13px;border-radius:8px;font-size:11.8px;font-weight:650;color:var(--fg3);transition:.18s}
.sorts a:hover{color:var(--fg)}
.sorts a.on{background:var(--panel);color:var(--fg);box-shadow:0 1px 4px rgba(8,11,20,.08)}
[data-theme=dark] .sorts a.on{background:rgba(255,255,255,.15);color:#fff}
.bar2 .st{margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--fg3);letter-spacing:.06em}
.bar2 .st b{color:var(--fg2);font-weight:750}

/* 列表 */
.posts{display:flex;flex-direction:column;margin-top:6px}
.post{display:grid;grid-template-columns:198px 1fr 20px;gap:20px;padding:20px 0;position:relative;align-items:start}
.post::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line)}
.post:first-child{padding-top:14px}
.post:hover .pt-th{transform:scale(1.03)}
.post:hover h2{color:var(--accent)}
.pt-th{aspect-ratio:16/10;border-radius:12px;position:relative;overflow:hidden;transition:.34s cubic-bezier(.22,1,.36,1);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
.pt-th::after{content:attr(data-c);position:absolute;left:8px;bottom:7px;font-family:var(--mono);font-size:7.5px;
  letter-spacing:.12em;text-transform:uppercase;color:#fff;background:rgba(0,0,0,.3);padding:2px 6px;border-radius:5px}
@media(max-width:620px){.post{grid-template-columns:1fr;gap:10px}.pt-th{display:none}}
.pt-b{min-width:0}
.pt-top{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.pt-time{font-family:var(--mono);font-size:9.5px;color:var(--fg3);letter-spacing:.04em}
.post h2{font-size:17.5px;font-weight:800;line-height:1.42;letter-spacing:-.012em;transition:.18s;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.post .dk{font-size:12.8px;color:var(--fg2);line-height:1.68;margin-top:7px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:76ch}
.pt-m{display:flex;align-items:center;gap:9px;margin-top:12px;font-family:var(--mono);font-size:9.5px;color:var(--fg3);flex-wrap:wrap}
.pt-m .av{width:19px;height:19px;font-size:8.5px}
.pt-m .dot{width:3px;height:3px;border-radius:50%;background:var(--line2)}
.pt-m b{color:var(--fg2);font-weight:750}
.pt-arw{color:var(--fg3);align-self:center;opacity:0;transform:translateX(-5px);transition:.24s}
.post:hover .pt-arw{opacity:1;transform:none;color:var(--accent)}
.pt-arw svg{width:15px;height:15px}
@media(max-width:620px){.pt-arw{display:none}}

/* 渐变缩略 */
.g1{background:linear-gradient(140deg,color-mix(in srgb,var(--a1) 62%,#fff),color-mix(in srgb,var(--accent) 40%,#fff))}
.g2{background:linear-gradient(200deg,color-mix(in srgb,var(--a2) 56%,#fff),color-mix(in srgb,var(--a1) 38%,#fff))}
.g3{background:linear-gradient(160deg,color-mix(in srgb,var(--a3) 58%,#fff),color-mix(in srgb,var(--a1) 42%,#fff))}
.g4{background:linear-gradient(120deg,color-mix(in srgb,var(--accent) 38%,#fff),color-mix(in srgb,var(--a2) 48%,#fff))}
[data-theme=dark] .g1{background:linear-gradient(140deg,color-mix(in srgb,var(--a1) 66%,#111722),color-mix(in srgb,var(--accent) 66%,#0b0e15))}
[data-theme=dark] .g2{background:linear-gradient(200deg,color-mix(in srgb,var(--a2) 54%,#111722),color-mix(in srgb,var(--a1) 46%,#111722))}
[data-theme=dark] .g3{background:linear-gradient(160deg,color-mix(in srgb,var(--a3) 52%,#111722),color-mix(in srgb,var(--a1) 48%,#111722))}
[data-theme=dark] .g4{background:linear-gradient(120deg,color-mix(in srgb,var(--accent) 72%,#111722),color-mix(in srgb,var(--a2) 46%,#111722))}

/* 侧栏 */
.cat-side{position:sticky;top:88px;display:flex;flex-direction:column;gap:14px;margin-top:14px}
.sc{padding:18px 20px;border-radius:18px}
.sc h4{font-family:var(--mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--fg3);
  font-weight:700;margin-bottom:13px;display:flex;align-items:center;gap:7px}
.sc h4::before{content:"";width:3px;height:11px;border-radius:2px;background:var(--accent)}
.subs a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 0;font-size:12.5px;color:var(--fg2);transition:.16s}
.subs a:hover{color:var(--accent);transform:translateX(2px)}
.subs a.on{color:var(--fg);font-weight:750}
.subs a em{font-style:normal;font-family:var(--mono);font-size:9.5px;color:var(--fg3)}
.tags2{display:flex;flex-wrap:wrap;gap:6px}
.tags2 .chip{height:25px;font-size:10.8px;padding:0 9px}
.hot5 a{display:flex;gap:10px;padding:8px 0;font-size:12.2px;line-height:1.5;color:var(--fg2);transition:.16s}
.hot5 a:hover{color:var(--accent)}
.hot5 .n{font-family:var(--mono);font-size:10px;font-weight:800;color:var(--fg3);flex:none;width:14px}
.hot5 a:nth-child(-n+3) .n{color:var(--accent)}
.hot5 .t{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}