/* 评论项  */

/* ===================== 评论区 ===================== */
.comments-section{margin-top:3rem;scroll-margin-top:4.625rem}
.comments-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding-bottom:1rem;border-bottom:1px solid var(--line);margin-bottom:1.75rem}
.comments-title{margin:0;font-family:var(--serif);font-size:1.1875rem;letter-spacing:.06em}
.comments-count{font-size:.78125rem;color:var(--muted);letter-spacing:.03em}
.comments-count strong{color:var(--c-post);font-family:var(--serif);font-size:.9375rem;margin:0 .15rem}
.comment-list{display:flex;flex-direction:column;gap:1.5rem}
.comment{display:flex;gap:1rem;align-items:flex-start}
.comment-avatar{flex:0 0 auto;width:2.75rem;height:2.75rem;border-radius:50%;object-fit:cover;margin-top:-.6rem;border:2px solid rgba(255,255,255,.95);box-shadow:0 .375rem 1rem -.375rem rgba(31,31,31,.5);background:#EDEAE3}
.comment-avatar.anon{display:grid;place-items:center;background:linear-gradient(140deg,#D8D4CC,#B5AFA4);color:#fff;font-family:var(--serif);font-size:.9375rem;letter-spacing:.02em}
.comment-main{flex:1 1 auto;min-width:0}
.comment-top{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;margin-bottom:.35rem}
.comment-name{font-size:.8125rem;font-weight:600;color:var(--ink);letter-spacing:.02em;cursor:pointer;transition:color .22s}
.comment-name:hover{color:var(--c-post)}
.comment-time{font-size:.6875rem;color:var(--muted);letter-spacing:.02em;margin-left:auto}
.comment-text{margin:0;font-size:.84375rem;line-height:1.9;color:#3A3A3A}
.reply{position:relative;margin-top:.875rem;padding:.875rem 1rem;border-radius:.625rem;border:1px solid rgba(47,93,80,.16);background:rgba(47,93,80,.055)}
.reply-head{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}
.reply-avatar{width:1.625rem;height:1.625rem;border-radius:50%;object-fit:cover;border:1.5px solid rgba(255,255,255,.95);box-shadow:0 .1875rem .5rem -.1875rem rgba(31,31,31,.4)}
.reply-name{font-size:.75rem;font-weight:600;color:var(--c-post);letter-spacing:.03em}
.reply-badge{padding:.08rem .4rem;border-radius:999px;font-size:.5625rem;letter-spacing:.1em;color:#fff;background:var(--c-post)}
.reply-text{margin:0;font-size:.8125rem;line-height:1.9;color:#3A4540}

/* ===================== 文字头像 ===================== */
.comment-avatar{
  flex:0 0 auto;
  width:2.75rem;
  height:2.75rem;
  border-radius:50%;
  display:grid;
  place-items:center;
  margin-top:-.6rem;
  border:2px solid rgba(255,255,255,.95);
  box-shadow:0 .375rem 1rem -.375rem rgba(31,31,31,.5);
  font-family:var(--serif);
  font-size:1.125rem;
  font-weight:600;
  color:#fff;
  letter-spacing:0;
  text-transform:uppercase;
  user-select:none;
  overflow:hidden;
}

/* 匿名网友 */
.comment-avatar.is-anon{
  background:linear-gradient(140deg,#D8D4CC,#B5AFA4);
  color:#fff;
}

/* 有网址的评论者 */
.comment-avatar.is-user{
  background:#2F5D50;  
}

/* ===================== 评论表单 ===================== */
.comment-form-wrap{margin-top:2.5rem;padding:1.875rem 2rem 2rem;border:1px solid rgba(255,255,255,.66);border-radius:var(--radius);background:rgba(255,255,255,.5);-webkit-backdrop-filter:blur(1.5rem) saturate(1.6);backdrop-filter:blur(1.5rem) saturate(1.6);box-shadow:0 .0625rem .125rem rgba(31,31,31,.03),0 1.25rem 2.5rem -1.5rem rgba(31,31,31,.26)}
.form-title{display:flex;align-items:center;gap:.5rem;margin:0 0 1.5rem;font-family:var(--serif);font-size:1.0625rem;font-weight:600;letter-spacing:.06em}
.form-title svg{width:1rem;height:1rem;fill:none;stroke:var(--c-post);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.125rem;margin-bottom:1.125rem}
.field{display:flex;flex-direction:column;gap:.4rem}
.field label{font-size:.71875rem;letter-spacing:.04em;color:var(--muted)}
.field label .req{color:var(--c-video);margin-left:.15rem}
.field input,.field textarea{width:100%;padding:.7rem .95rem;border:1px solid var(--line);border-radius:.5rem;background:rgba(255,255,255,.75);font:inherit;font-size:.8125rem;color:var(--ink);outline:none;transition:border-color .22s,background .22s,box-shadow .22s}
.field input::placeholder,.field textarea::placeholder{color:#A8A8A8}
.field input:focus,.field textarea:focus{border-color:rgba(47,93,80,.45);background:#fff;box-shadow:0 0 0 .1875rem rgba(47,93,80,.09)}
.field textarea{min-height:11rem;resize:vertical;line-height:1.85;padding:.875rem .95rem}

 
.form-foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:1.375rem}
.form-note{font-size:.6875rem;line-height:1.7;color:var(--muted);max-width:24rem}
.form-note a{color:var(--c-post);border-bottom:1px solid rgba(47,93,80,.3)}
.submit-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.7rem 1.75rem;border:0;border-radius:999px;cursor:pointer;background:var(--c-post);color:#fff;font-size:.8125rem;letter-spacing:.1em;box-shadow:0 .625rem 1.375rem -.625rem rgba(47,93,80,.85);transition:transform .22s,background .22s,box-shadow .22s}
.submit-btn:hover{transform:translateY(-.125rem);background:#274F44;box-shadow:0 .875rem 1.75rem -.625rem rgba(47,93,80,.9)}
.submit-btn:active{transform:translateY(0)}
.submit-btn svg{width:.875rem;height:.875rem;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}