/* comments 页面专用样式（评论线索） */
.comments-page > section { margin-bottom: 16px; }
.comments-page > section:empty { display: none; }

/* 状态卡 */
.comments-line { margin: 0 0 12px; color: var(--sub); overflow-wrap: anywhere; }
.comments-line .link { font-size: inherit; }
.comments-bad { color: var(--red); font-size: 12.5px; font-weight: 500; }
.comments-warn {
  margin: 0 0 12px; padding: 12px 14px; border-radius: 10px;
  background: #fff7ec; border: 1px solid #ffe2bd; color: #8a4b05;
}
.comments-warn > b { display: flex; align-items: center; gap: 6px; font-size: 13.5px; }
.comments-warn > b .ic { width: 16px; height: 16px; color: var(--orange); }
.comments-warn ul, .comments-notes, .comments-confirm ul { margin: 8px 0 0; padding-left: 20px; line-height: 1.7; font-size: 13.5px; }
.comments-warn li + li, .comments-confirm li + li { margin-top: 4px; }
.comments-notes { margin: 0 0 12px; color: var(--sub); }
.comments-how { margin: 0 0 14px; padding: 12px 14px; background: #fafbfd; border: 1px solid var(--line-2); border-radius: 10px; }
.comments-how p { margin: 0 0 8px; color: var(--sub); font-size: 13px; }
.comments-cmd { display: flex; align-items: center; gap: 10px; min-width: 0; }
.comments-cmd code {
  flex: 1; min-width: 0; padding: 6px 10px; border-radius: 8px; background: #fff; border: 1px solid var(--line);
  font: 12.5px/1.5 ui-monospace, Menlo, monospace; color: var(--text); overflow-wrap: anywhere; user-select: all;
}
.comments-tip { margin: 0 0 12px; font-size: 13px; }
.comments-start-row .btn[disabled] { opacity: .55; cursor: not-allowed; }
.comments-stop { margin-left: auto; }
.comments-stop:hover { color: var(--red); border-color: #ffc9c3; background: #fff6f5; }

/* 启动确认弹窗 */
.comments-confirm p { margin: 0 0 6px; }
.comments-confirm ul { margin-bottom: 12px; }
.comments-confirm-act { margin-top: 16px; }

/* 数字卡 */
.comments-tiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.comments-tile { padding: 14px 16px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.comments-tile span { color: var(--sub); font-size: 13px; }
.comments-tile b { font-size: 24px; font-variant-numeric: tabular-nums; letter-spacing: .5px; }
.comments-tile small { color: var(--mute); font-size: 12px; }
.comments-last { font-size: 12.5px; text-align: right; }
.comments-tbl-wrap { overflow-x: auto; }
.comments-tbl td { font-variant-numeric: tabular-nums; }
.comments-tbl .chip { white-space: nowrap; }
.comments-foot { margin: 0; padding: 10px 18px 14px; font-size: 12.5px; border-top: 1px solid var(--line-2); }

/* 意向评论 */
.comments-filter { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 18px 0; }
.comments-filter:empty { display: none; }
.comments-tabs { max-width: 100%; overflow-x: auto; }
.comments-tabs .tab { white-space: nowrap; }
.comments-toggle { display: inline-flex; align-items: center; gap: 8px; color: var(--sub); font-size: 13px; white-space: nowrap; }
.comments-toggle i { font-style: normal; font-size: 11.5px; padding: 0 7px; border-radius: 99px; background: #fff4e5; color: #c26a00; }
.comments-lead-list { list-style: none; margin: 0; padding: 6px 0; max-height: 520px; overflow-y: auto; }
.comments-lead { padding: 10px 18px; border-bottom: 1px solid var(--line-2); }
.comments-lead:last-child { border-bottom: 0; }
.comments-lead-hd { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.comments-lead-hd b { font-size: 13.5px; }
.comments-lead-time { margin-left: auto; font-size: 12px; white-space: nowrap; }
.comments-lead p { margin: 4px 0 2px; overflow-wrap: anywhere; }
.comments-lead small { font-size: 12px; }

/* 嵌入的面板 */
.comments-embed { overflow: hidden; }
.comments-embed-tip { font-size: 12.5px; }
.comments-frame {
  display: block; width: 100%; height: calc(100vh - 150px); min-height: 640px;
  border: 0; border-top: 1px solid var(--line-2); background: #f6f7f9;
}
.comments-embed-off { border-style: dashed; box-shadow: none; }
.comments-big-btn { height: 44px; padding: 0 22px; font-size: 15px; }

@media (max-width: 1100px) {
  .comments-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
  .comments-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .comments-tile b { font-size: 21px; }
  .comments-page .panel-hd { flex-wrap: wrap; }
  .comments-last { text-align: left; }
  .comments-embed-tip { display: none; }
  .comments-cmd { flex-direction: column; align-items: stretch; }
  .comments-start-row .btn { flex: 1; justify-content: center; }
  .comments-frame { height: 78vh; min-height: 520px; }
  .comments-lead-time { margin-left: 0; width: 100%; }
  /* 账号表在手机上改成一张张小卡片（顺便盖掉全局「窄屏藏第 4、5 列」的规则） */
  .tbl.comments-tbl thead { display: none; }
  .tbl.comments-tbl, .comments-tbl tbody, .comments-tbl tr { display: block; }
  .comments-tbl tr { padding: 10px 16px; border-bottom: 1px solid var(--line-2); }
  .comments-tbl tr:last-child { border-bottom: 0; }
  .tbl.comments-tbl td, .tbl.comments-tbl td:nth-child(4), .tbl.comments-tbl td:nth-child(5) {
    display: flex; justify-content: space-between; align-items: center; gap: 10px;
    padding: 3px 0; border: 0; text-align: right;
  }
  .tbl.comments-tbl td.comments-name { display: block; text-align: left; padding-bottom: 6px; }
  .comments-tbl td[data-label]::before { content: attr(data-label); color: var(--mute); font-size: 12.5px; text-align: left; }
}