/* 详情页 /ps/* 与留言板 /liu 专用：文章上下篇 + 评论区（原 pubic.css 里搬出，两页共用一份） */

/* 上一篇 / 下一篇 */
.pn-card{display:flex;flex-direction:column;padding:6px 16px}
.pn-row{
  display:flex;align-items:center;gap:10px;min-height:44px;padding:6px 0;
  color:var(--text);transition:color .2s var(--ease);
}
.pn-row:hover{color:var(--brand)}
.pn-row:hover .fa{color:var(--brand)}
.pn-row:hover .pn-tag .fa:first-child{transform:translateX(-2px)}
.pn-row:hover .pn-tag .fa:last-child{transform:translateX(2px)}
.pn-tag{
  flex:none;display:inline-flex;align-items:center;gap:5px;
  font-size:.78em;color:var(--text-mute);white-space:nowrap;
}
.pn-title{
  flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:.95em;font-weight:400;
}
.pn-split{flex:none;height:1px;background:var(--line)}
.pn-row.is-disabled{cursor:default}
.pn-row.is-disabled .pn-title{color:var(--text-mute)}
.pn-row.is-disabled:hover{color:var(--text)}
.pn-row.is-disabled:hover .fa{color:inherit;transform:none}
.pn-card .fa{transition:transform .2s var(--ease)}


.ping{
  border:1px solid #dbe4ff;border-radius:999px;padding:.16em .6em;
  color:var(--brand);background:var(--brand-soft);font-size:.78em;
}
/* 评论区 */
.cmt-form{padding:14px 16px}
.cmt-form-hd{display:flex;align-items:center;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.cmt-form-tt{
  font-size:.95em;font-weight:600;line-height:1.4;
  color:var(--brand-deep);
}
.cmt-form-hd button{margin-left:auto;font-size:.85em;padding:.32em .9em;border-radius:999px}
.cmt-form-hd button+button{margin-left:0}
.cmt-submit{
  background:linear-gradient(135deg,var(--brand),#5c74ee);
  border-color:transparent;color:#fff;
  box-shadow:0 4px 12px rgba(63,91,217,.22);
}
.cmt-submit:hover{
  background:linear-gradient(135deg,var(--brand-deep),var(--brand));
  border-color:transparent;color:#fff;
  box-shadow:0 6px 16px rgba(63,91,217,.3);
}
.cmt-form-bd{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.cmt-field{display:flex;flex-direction:column;gap:4px;min-width:0}
.cmt-field>span{font-size:.76em;color:var(--text-mute)}
.cmt-field-full{grid-column:1/-1}
.cmt-field input[type=text],.cmt-field textarea{
  box-sizing:border-box;width:100%;
  border:1px solid var(--line);border-radius:9px;
  background:var(--surface-alt);color:var(--text);
  padding:.5em .65em;font-size:.9em;
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease),background .2s var(--ease);
}
.cmt-field textarea{min-height:96px;resize:vertical;line-height:1.65}
.cmt-field input[type=text]:focus,.cmt-field textarea:focus{
  outline:none;background:#fff;border-color:var(--brand);box-shadow:var(--ring);
}

.cmt{
  display:grid;grid-template-columns:auto minmax(0,1fr);
  column-gap:12px;align-items:start;margin:7px;
}
.cmt-avatar{
  grid-column:1;grid-row:1/span 2;
  width:64px;height:64px;border-radius:12px;object-fit:cover;
  border:1px solid var(--line);background:var(--surface-alt);
  box-shadow:0 2px 8px rgba(23,43,77,.06);
}
.cmt-main{grid-column:2;grid-row:1/span 2;min-width:0}
.cmt .ping{
  border:1px solid var(--line-soft);
  border-radius:var(--radius);
  background:var(--surface-alt);
  color:var(--text);
  padding:.55em .75em;line-height:1.65;
}
.cmt .ping:empty{display:none}
.cmt .ping img{max-width:100%;height:auto;display:block;border-radius:8px;margin:6px 0}
.reply-mark{
  display:inline-flex;align-items:center;gap:.25em;
  margin-right:.35em;padding:0 .5em;border-radius:999px;
  font-size:.9em;line-height:1.7;vertical-align:.08em;
  color:var(--brand);
  background:linear-gradient(135deg,var(--brand-soft),#eef3ff);
}
.reply-mark::before{content:"\f1fa";font-family:FontAwesome;font-size:.9em;font-style:normal;font-weight:400}
.cmt .time{flex-wrap:wrap;gap:.15em 0;color:var(--text-soft)}
.cmt .time i{color:var(--text-soft);opacity:1}
.cmt .time .click{
  margin-left:auto;padding:0 .55em;border-radius:999px;font-style:normal;
  color:var(--brand);transition:background .2s var(--ease),color .2s var(--ease);
}
.cmt .time .click:hover{background:var(--brand-soft);color:var(--brand-deep)}
.cmt-kids{
  position:relative;
  margin:12px 0 0 22px;padding-left:12px;
  background:repeating-linear-gradient(180deg,var(--line-strong) 0 6px,transparent 6px 12px) no-repeat left top/3px 100%;
}
.cmt-kids>.cmt{animation:fadeUp .45s var(--ease) both}
#article-view>.item>hr{border:none;height:1px;background:var(--line);margin:0}
.cmt+.cmt{border-top:1px solid var(--line-soft);padding-top:12px;margin-top:12px}

/* 留言板 */
.shuo>.item+.item{margin-top:1.2rem}

/* 窄屏 */
@media (max-width:520px){
  .cmt{column-gap:9px}
  .cmt-avatar{width:40px;height:40px;border-radius:9px}
  .cmt-kids{margin-left:8px;padding-left:8px}
  .cmt-form{padding:12px}
  .cmt-form-bd{grid-template-columns:minmax(0,1fr)}
  .cmt .time{font-size:.76em}
  .pn-card{padding:4px 14px}
  .pn-row{min-height:40px;gap:8px}
  .pn-title{font-size:.9em}
}