/* pages/article.css — بخشی از سیستم سبک سایت عمومی پلاس */
.art-copy{max-inline-size:64ch}
.bookhint{position:absolute;inset-block-end:clamp(18px,2.4vw,28px);inset-inline-end:clamp(20px,3vw,44px);
  z-index:3;display:inline-flex;align-items:center;gap:9px;pointer-events:none;
  font-family:var(--font-display);font-size:11.5px;font-weight:800;color:#B9C9E2;
  padding:8px 14px;border-radius:var(--chip-radius);
  border:1px solid rgba(255,255,255,.14);background:rgba(11,18,38,.5);
  opacity:1;transform:none;transition:opacity .6s var(--ease-soft),transform .6s var(--ease-out)}
.bookhint i{inline-size:7px;block-size:7px;border-radius:50%;background:var(--accent-soft);
  animation:hintPulse 2.2s var(--ease-soft) infinite}
.bookhint.off{opacity:0;transform:translateY(8px)}
@media (max-width:820px){
.bookhint{display:none}
}
.art-copy h1{font-family:var(--font-display);font-size:clamp(26px,3.8vw,46px);font-weight:900;
  color:#fff;line-height:1.5;max-inline-size:24ch}
.art-copy .lede{max-inline-size:56ch}
.art-meta{display:flex;align-items:center;gap:12px 26px;flex-wrap:wrap;margin-block-start:26px}
.am-au{display:inline-flex;align-items:center;gap:11px;text-decoration:none}
.am-au b{display:block;font-family:var(--font-display);font-size:13.5px;font-weight:800;color:#fff}
.am-au > span > span{display:block;font-size:11px;color:#93A5C6;margin-block-start:3px}
.am-d{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:#B9C9E2}
.am-d svg{inline-size:16px;block-size:16px;color:var(--accent-soft)}
.am-d b{font-family:var(--font-display);font-weight:800;color:#fff}
.art-cover{margin-block-end:clamp(28px,3.6vw,44px)}
.art-cover figcaption{margin-block-start:12px;font-size:12px;color:var(--fg-muted);text-align:center}
.art-foot{display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  margin-block:clamp(30px,4vw,44px);padding-block:22px;
  border-block:1px solid var(--line)}
.art-foot .sh-l{margin-inline-start:auto}
.aubox{display:grid;grid-template-columns:96px minmax(0,1fr);gap:clamp(16px,2.4vw,24px);
  padding:clamp(18px,2.4vw,26px);border:1px solid var(--line);border-radius:var(--card-radius);
  background:var(--surface)}
.au-k{display:block;font-family:var(--font-display);font-size:11px;font-weight:800;
  letter-spacing:1.4px;color:var(--fg-muted);margin-block-end:8px}
.aubox h3{font-family:var(--font-display);font-size:18px;font-weight:900;color:var(--fg)}
.aubox p{margin-block:10px 14px;font-size:13.5px;line-height:2.05;color:var(--fg-muted)}
.aubox .ilink{color:var(--teal-600)}
.aubox .ilink:hover{color:var(--fg)}
.pnav{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-block-start:clamp(24px,3vw,34px)}
.pn{display:flex;flex-direction:column;gap:8px;text-decoration:none;
  padding:18px 20px;border:1px solid var(--line);border-radius:var(--card-radius);
  background:var(--surface);transition:border-color var(--dur-fast),transform var(--dur-fast) var(--ease-out)}
.pn:hover{border-color:var(--teal-600);transform:translateY(-3px)}
.pn-k{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-display);
  font-size:11.5px;font-weight:800;color:var(--fg-muted)}
.pn-k svg{inline-size:15px;block-size:15px}
.pn.next{text-align:end}
.pn.next .pn-k{justify-content:flex-end}
.pn b{font-family:var(--font-display);font-size:14.5px;font-weight:900;color:var(--fg);line-height:1.7}
.pn-d{font-size:11.5px;color:var(--fg-muted)}
.cnum{display:inline-grid;place-items:center;min-inline-size:30px;block-size:26px;
  padding-inline:8px;border-radius:var(--chip-radius);vertical-align:middle;
  font-family:var(--font-display);font-size:12.5px;font-weight:800;
  color:var(--teal-600);background:color-mix(in oklab,var(--teal-600) 12%,transparent)}
.clist{list-style:none;display:flex;flex-direction:column;gap:14px}
.clist.reply{margin-block-start:14px;padding-inline-start:0;padding-inline-end:clamp(22px,4vw,52px)}
.citem{display:flex;gap:14px;padding:clamp(16px,2vw,20px);
  border:1px solid var(--line);border-radius:var(--card-radius);background:var(--surface)}
.cav{font-style:normal;flex:none;display:grid;place-items:center;inline-size:42px;block-size:42px;
  border-radius:50%;font-family:var(--font-display);font-size:12.5px;font-weight:900;
  color:var(--teal-600);background:color-mix(in oklab,var(--teal-600) 12%,transparent)}
.cav.off{color:#fff;background:var(--teal-600)}
.cbody{min-inline-size:0}
.chead{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-block-end:9px}
.chead b{font-family:var(--font-display);font-size:13.5px;font-weight:800;color:var(--fg)}
.chead span{font-size:11.5px;color:var(--fg-muted)}
.cbadge{font-family:var(--font-display);font-size:10.5px;font-weight:800;
  color:#fff;background:var(--teal-600);padding:3px 9px;border-radius:var(--chip-radius)}
.cbody > p:last-child{font-size:13.5px;line-height:2.1;color:var(--fg-muted)}
.cf-act{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-block-start:14px}
.toc-k{font-family:var(--font-display);font-size:11.5px;font-weight:800;letter-spacing:1px;
  color:var(--fg-muted);margin-block-end:12px}
.sc-k{font-family:var(--font-display);font-size:11.5px;font-weight:800;letter-spacing:1px;
  color:var(--fg-muted);margin-block-end:14px}
.rlist2{list-style:none;display:flex;flex-direction:column;gap:14px}
.rlist2 a{display:flex;gap:12px;text-decoration:none}
.rlist2 b{display:block;font-family:var(--font-display);font-size:12.5px;font-weight:800;
  line-height:1.85;color:var(--fg)}
.rlist2 span span{display:block;margin-block-start:5px;font-size:11px;color:var(--fg-muted)}
.rlist2 a:hover b{color:var(--teal-600)}
.catlist{list-style:none;display:flex;flex-direction:column;gap:2px}
.catlist a{display:flex;align-items:center;justify-content:space-between;gap:10px;
  font-size:13px;text-decoration:none;color:var(--fg-muted);
  padding:10px 12px;border-radius:10px;transition:color var(--dur-fast),background-color var(--dur-fast)}
.catlist a:hover{color:var(--teal-600);background:var(--paper-200)}
.catlist span{font-family:var(--font-display);font-size:11.5px;font-weight:800;
  color:var(--fg-muted);padding:3px 9px;border-radius:var(--chip-radius);background:var(--paper-200)}
@media (max-width:1040px){
.aubox{grid-template-columns:1fr}
.pnav{grid-template-columns:1fr}
.pn.next{text-align:start}
.pn.next .pn-k{justify-content:flex-start}
}
@media (max-width:820px){
.clist.reply{padding-inline-end:20px}
}
.am-au--plain{pointer-events:none}
.am-au--plain > span{margin-inline-start:0}
