.picmo{background:var(--color-bg)!important;border-color:var(--color-border)!important}.picmo .picmo__categoryName{display:none!important}.picmo .picmo__header,.picmo .picmo__preview{background:transparent;border-color:var(--color-border)!important}.picmo .picmo__preview *{color:var(--color-text)!important}#comment-content p{word-break:break-all}

/* ===== 评论列表 ===== */
#comments ol{list-style:none;margin:0;padding:0}
#comments li{list-style:none}

/* 评论之间的间距 */
#comments .c-item{margin:0 0 1.75rem}
#comments .c-item:last-child{margin-bottom:0}

/* 子评论与主评论同一竖线，不缩进 */
#comments .c-children{margin-left:0;padding-top:1rem}
#comments .c-children .c-item{margin-bottom:1.25rem}

#comments .c-main{display:flex;align-items:flex-start;gap:.5rem}

/* 头像：32px 小圆角方块 */
#comments .c-avatar-wrap{
  position:relative;
  width:32px;
  height:32px;
  flex:0 0 32px;
  border-radius:6px;
  border:1px solid #e5e7eb;
  background:#fff;
}
#comments .c-avatar{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:5px;
}

/* 悬停头像：整块变白 + 中间出现 @，点击即可回复 */
#comments .c-avatar-wrap > a{
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  left:0;
  z-index:2;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:5px;
  background:rgba(255,255,255,.86);
  color:#555;
  font-size:15px;
  font-weight:600;
  line-height:1;
  text-decoration:none;
  opacity:0;
  transition:opacity .3s;
}
/* 只让鼠标所在那一条的头像出现 @：用 .c-main:hover 而不是 .c-item:hover，
   否则鼠标停在子评论上时，父级 .c-item 也会命中，父头像跟着亮 */
#comments .c-main:hover > .c-avatar-wrap > a{opacity:1}

/* 正在回复的那一条：头像加一圈蓝边，明确回复对象 */
#comments .c-item.replying > .c-main > .c-avatar-wrap{
  box-shadow:0 0 0 2px #3b82f6;
}

#comments .c-body{flex:1;min-width:0}

/* 昵称行 */
#comments .c-head{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.5rem;
  margin-bottom:.25rem;
  min-height:20px;
}
#comments .c-name{
  font-size:13px;
  font-weight:600;
  line-height:1.4;
  color:#374151;
  word-break:break-all;
}
#comments .c-at{
  font-size:12px;
  line-height:1.4;
  color:#3b82f6;
  text-decoration:none;
}
#comments .c-at:hover{text-decoration:underline}

/* 博主标识：头像右下角的蓝色小徽章 */
#comments .c-verified{
  position:absolute;
  right:-4px;
  bottom:-4px;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:center;
  width:14px;
  height:14px;
  pointer-events:none;
}
#comments .c-verified svg{display:block;width:14px;height:14px}

/* 时间：默认隐藏，悬停该条评论时显示 */
#comments .c-time{
  font-size:11px;
  line-height:1.4;
  color:#9ca3af;
  opacity:0;
  transition:opacity .3s;
}
#comments .c-main:hover .c-time{opacity:1}

/* 灰色气泡 */
#comments .c-content{
  display:inline-block;
  max-width:88%;
  padding:.5rem;
  background:#f9fafb;
  border-radius:6px;
  box-shadow:0 1px 2px rgba(0,0,0,.05);
  font-size:13px;
  line-height:1.6;
  color:#374151;
  text-align:left;
  word-break:break-word;
}
#comments .c-content p{margin:0;line-height:1.6}
#comments .c-content p:last-child{margin-bottom:0}
#comments .c-content img{max-width:100%;height:auto;border-radius:5px;vertical-align:middle}

/* ===== 暗色模式 ===== */
.dark #comments .c-avatar-wrap{border-color:#475569;background:#1e293b}
.dark #comments .c-avatar-wrap > a{background:rgba(30,41,59,.86);color:#e4e4e7}
.dark #comments .c-name,.dark #comments .c-content{color:#d4d4d8}
.dark #comments .c-content{background:#334155}
.dark #comments .c-time{color:#71717a}
.dark #comments .c-at{color:#60a5fa}

/* 触摸设备没有 hover：@ 变成左下角小圆点，仍然可点（右下角留给博主徽章） */
@media(hover:none){
  #comments .c-avatar-wrap > a{
    opacity:1;
    top:auto;
    right:auto;
    left:-2px;
    bottom:-2px;
    width:15px;
    height:15px;
    border-radius:50%;
    background:#fff;
    border:1px solid #e5e7eb;
    font-size:10px;
    color:#777;
  }
  .dark #comments .c-avatar-wrap > a{background:#27272a;border-color:#475569;color:#d4d4d8}
}

@media(max-width:600px){
  #comments .c-avatar-wrap{width:28px;height:28px;flex-basis:28px;border-radius:5px}
  #comments .c-item{margin-bottom:1.5rem}
}

/* ===== 评论表单（折叠态，点头像展开昵称/邮箱/网址） ===== */
.c-respond{margin-top:1.5rem}
.c-cancel{
  margin-bottom:.5rem;
  padding:4px 10px;
  font-size:12px;
  color:#4b5563;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:6px;
  cursor:pointer;
}
.c-cancel:hover{background:#f6f7f9;color:#111}

.c-form{
  background:#fff;
  border:1px solid #ecedf0;
  border-radius:10px;
  box-shadow:0 1px 2px rgba(0,0,0,.03);
}
.c-form.open{box-shadow:0 2px 10px rgba(0,0,0,.05)}

.c-fields{
  display:flex;
  gap:8px;
  padding:0 12px;
  max-height:0;
  opacity:0;
  overflow:hidden;
  visibility:hidden;
  transition:max-height .26s ease, opacity .2s ease, padding .26s ease, visibility 0s .26s;
}
.c-form.open .c-fields{
  padding:12px 12px 0;
  max-height:90px;
  opacity:1;
  visibility:visible;
  transition:max-height .26s ease, opacity .2s ease, padding .26s ease, visibility 0s;
}
.c-input{
  flex:1 1 0;
  min-width:0;
  padding:8px 10px;
  font-size:13px;
  line-height:1.4;
  color:#374151;
  background:#f4f5f7;
  border:0;
  border-radius:6px;
  outline:none;
  transition:background .2s ease, box-shadow .2s ease;
}
.c-input::placeholder{color:#9aa1ab}
/* 聚焦不显示任何外框，保持原样 */
.c-input:focus,
.c-input:focus-visible{background:#f4f5f7;box-shadow:none!important;outline:none!important}

.c-editor{padding:10px 12px}
.c-textarea{
  display:block;
  width:100%;
  height:26px;
  padding:2px 2px 0;
  font-size:13.5px;
  line-height:22px;
  color:#374151;
  background:transparent;
  border:0;
  border-radius:0;
  outline:none!important;
  box-shadow:none!important;
  -webkit-appearance:none;
  appearance:none;
  resize:none;
  overflow:hidden;
  transition:height .22s ease;
}
.c-textarea:focus,
.c-textarea:focus-visible{outline:none!important;box-shadow:none!important;border:0}
.c-textarea::placeholder{color:#9aa1ab}
.c-form.open .c-textarea{height:90px;line-height:1.65;overflow:auto}

.c-bar{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  background:#f4f6f8;
  border-radius:0 0 9px 9px;
}
.c-bar-left{display:flex;align-items:center;gap:8px}
.c-bar-right{margin-left:auto;display:flex;align-items:center;gap:10px}

/* 头像与表情按钮：同样的方块尺寸 / 圆角 / 描边 */
.c-avatar-btn,
.c-emoji-btn{
  width:30px;
  height:30px;
  padding:0;
  box-sizing:border-box;
  background:#fff;
  border:1px solid #e6e8ec;
  border-radius:6px;
  cursor:pointer;
  transition:background .2s ease;
}
.c-avatar-btn{overflow:hidden}
.c-avatar-btn img{display:block;width:100%;height:100%;object-fit:cover}

.c-emoji{position:relative;display:flex}
.c-emoji-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  color:#6b7280;
}
.c-emoji-btn:hover{background:#eef1f4}

.c-who{font-size:11px;color:#9ca3af;white-space:nowrap}
.c-who a{color:#6b7280;text-decoration:none}
.c-who a:hover{color:#111;text-decoration:underline}

.c-send{
  padding:5px 10px;
  font-size:12.5px;
  font-weight:500;
  line-height:1.4;
  color:#fff;
  background:#5b9bf3;
  border:0;
  border-radius:5px;
  cursor:pointer;
  transition:background .2s ease;
}
.c-send:hover{background:#4a8cea}
.c-send:active{background:#3f7fd9}

/* 表单暗色 */
.dark .c-form{background:#27272a;border-color:#3f3f46}
.dark .c-input{background:#3a3a3f;color:#e4e4e7}
.dark .c-input::placeholder{color:#8b8b93}
.dark .c-input:focus{background:#3a3a3f;box-shadow:none}
.dark .c-textarea{color:#e4e4e7}
.dark .c-textarea::placeholder{color:#8b8b93}
.dark .c-bar{background:#323236}
.dark .c-avatar-btn,
.dark .c-emoji-btn{background:#3a3a3f;border-color:#4b4b52;color:#a1a1aa}
.dark .c-emoji-btn:hover{background:#44444a}
.dark .c-cancel{background:#27272a;border-color:#3f3f46;color:#a1a1aa}
.dark .c-cancel:hover{background:#323236;color:#fafafa}
.dark .c-who{color:#8b8b93}
.dark .c-who a{color:#a1a1aa}

@media(max-width:600px){
  .c-fields{flex-direction:column;gap:6px}
  .c-form.open .c-fields{max-height:200px}
  .c-send{padding:4px 8px;font-size:12px}
}