/* ================================================================
   侧栏最新评论（cm-*） · 从 style.css 拆出
   由 tools/css-feature-split.js 生成。加载顺序：style.css 之后、
   layout-airy.css / talk-comment.css 之前，保持原有覆盖关系。
   ================================================================ */
/* 最新评论：旧版无作用域的 .cm-* 基础样式已移除。
   这些规则会为新结构补齐 padding / border-radius / 底色 / 分隔线，
   导致侧栏条目渲染成「新结构 + 旧胶囊」的混合体。
   仅保留 .cm-text：js/main.js 用它定位评论正文容器做表情插入。 */
.cm-text { display: -webkit-box; margin-top: 6px; font-size: 13px; color: var(--ink-2); line-height: 1.6; text-decoration: none; letter-spacing: .2px; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-word; transition: color .2s ease; }

.cm-text:hover { color: var(--accent-ink); }

[data-theme='dark'] .cm-item + .cm-item { border-top-color: rgba(255, 255, 255, .07); }

[data-theme='dark'] .hot-article__cover, [data-theme='dark'] .sort-pill > a,
[data-theme='dark'] .tag-cloud-link, [data-theme='dark'] .tag,
[data-theme='dark'] .sidebar-archive,
[data-theme='dark'] .cm-avatar, [data-theme='dark'] .cm-source { background: rgba(255, 255, 255, .05); color: var(--ink-2); }

/* 最新评论：扁平列表（头像 + 昵称/时间 + 两行正文 + 来源文章），发丝线分隔 */
.sidebar-newcomm .cm-stream {
    list-style: none;
    margin: 0;
    padding: .35rem 1.25rem .9rem;
}

.sidebar-newcomm .cm-entry {
    display: flex;
    align-items: flex-start;
    gap: .7rem;
    padding: .9rem 0;
    min-width: 0;
}

.sidebar-newcomm .cm-entry + .cm-entry { border-top: 1px solid var(--line-2); }

.sidebar-newcomm .cm-figure {
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    overflow: hidden;
    display: block;
    /* 剪影本身透明，再垫浅底就成了「底板 + 人形」两层 */
    background: transparent;
}

.sidebar-newcomm .cm-figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.sidebar-newcomm .cm-body { flex: 1 1 auto; min-width: 0; }

.sidebar-newcomm .cm-head {
    display: flex;
    align-items: baseline;
    gap: 8px;
    min-width: 0;
}

.sidebar-newcomm .cm-user-name {
    flex: 0 1 auto;
    min-width: 0;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: -.01em;
    color: var(--ink);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.sidebar-newcomm .cm-user-time {
    flex: 0 0 auto;
    margin-left: auto;
    font-size: 11px;
    line-height: 1.4;
    color: var(--ink-3);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* 气泡外壳只负责底色 / 圆角 / 内边距，不做任何裁剪 */
.sidebar-newcomm .cm-bubble {
    margin-top: 6px;
    padding: 6px;
    border-radius: 6px;
    background: var(--bg-overlay—caoliao-chorme-app, var(--paper-2));
    /* 兜底裁剪：overflow: hidden 的裁剪线在 padding-box，会在 6px 内边距里
       露出第三行字头；改成 clip + overflow-clip-margin: content-box，
       裁剪线正好落在两行文字的下沿，内边距区域不会再有半截字。 */
    overflow: clip;
    overflow-clip-margin: content-box;
}

/* 正文：零内边距 + 固定两行窗口（2 × 22px 整数行高）做纯几何裁剪。
   不用 -webkit-line-clamp：它在 Chromium 里计算 display 会退化成 flow-root，
   clamp 不生效后只剩气泡 padding 盒在裁，第三行必然露半截字。
   本元素没有内边距，overflow 裁剪线与行盒边界重合，第三行没有露头空间。 */
.sidebar-newcomm .cm-comment {
    word-break: break-word;
    transition: color .18s ease;
}

.sidebar-newcomm .cm-comment:hover { color: var(--accent-ink); }

[data-theme='dark'] .sidebar-newcomm .cm-entry + .cm-entry { border-top-color: rgba(255, 255, 255, .07); }

[data-theme='dark'] .sidebar-newcomm .cm-figure { background: transparent; }

@media (prefers-reduced-motion: reduce) {
    .sidebar-newcomm .cm-entry,
    .sidebar-newcomm .cm-comment { transition: none; }
}

/* 侧栏最新评论 · 终稿：气泡层只负责底色/内边距/圆角，两行截断只发生在零内边距的内层。
   之前把 padding 和 overflow 放在同一层，裁剪线落在内边距盒外沿，第三行就从那 6px 里露字头。 */
.sidebar-newcomm .cm-comment {
    display: block;
    margin-top: 6px;
    padding: 6px;
    border-radius: 6px;
    background: var(--bg-overlay—caoliao-chorme-app, var(--paper-2));
    font-size: 13px;
    line-height: 22px;
    letter-spacing: .15px;
    color: var(--ink-2);
    text-decoration: none;
    max-height: none;
    overflow: visible;
}

/* 侧栏最新评论 · 最终定稿（覆盖前面所有重复的 .cm-comment 声明）
   气泡层：只负责底色 / 6px 内边距 / 6px 圆角，绝不裁剪。
   裁剪层：零内边距的内层 span，两行窗口 2 × 22px = 44px。
   之前把 padding 和 overflow 放在同一层，裁剪线落在内边距盒外沿，
   第三行就从那 6px 里露出字头——这是反复出现半截字的唯一原因。 */
.side-col .sidebar-newcomm .cm-comment {
    letter-spacing: .15px;
    box-sizing: border-box;
    /* 气泡层绝不裁剪：它带 6px 内边距，overflow 的裁剪线落在内边距盒外沿，
       第三行字头就会从这 6px 里透出来。裁剪只交给零内边距的内层 span。 */
    overflow: visible;
}

/* 侧栏最新评论 · 用户指定终稿：line-height: 1.5 / padding: 6px 10px
   行高改 1.5 后，两行窗口必须跟着变：2 × 1.5em = 3em（39px），
   旧的 44px 会多出 0.25 行，第三行字头又会被切出半截。 */



/* 侧栏最新评论 · 头像在左 / 昵称在右（同一行），正文气泡在下一行整宽
   之前头像独占左侧一列、昵称在其右侧列顶，视觉上头像与昵称不在一条线上。 */








/* 侧栏最新评论 · 定稿
   1) 头像在左、昵称在右（同一行），时间靠右；正文气泡在下一行整宽。
   2) 两行截断只用 -webkit-line-clamp 一套边界，且只作用在零内边距的内层；
      气泡层只负责底色 / padding: 6px 10px / 圆角 6px，绝不裁剪。
      之前 padding 层参与裁剪、或 max-height 与 clamp 叠加，都会在 6px 内边距里
      露出第三行字头。 */
.side-col .sidebar-newcomm .cm-entry {
    display: block;
    padding: .9rem 0;
    min-width: 0;
}

.side-col .sidebar-newcomm .cm-head {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.side-col .sidebar-newcomm .cm-figure {
    flex: 0 0 26px;
    width: 26px;
    height: 26px;
    border-radius: 6px;
    overflow: hidden;
    display: block;
    background: var(--paper-2);
}

.side-col .sidebar-newcomm .cm-figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.side-col .sidebar-newcomm .cm-user-name {
    flex: 0 1 auto;
    min-width: 0;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--ink);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.side-col .sidebar-newcomm .cm-user-time {
    flex: 0 0 auto;
    margin-left: auto;
    font-size: 11px;
    line-height: 1.4;
    color: var(--ink-3);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.side-col .sidebar-newcomm .cm-comment {
    display: block;
    margin-top: 8px;
    padding: 6px 10px;
    border-radius: 6px;
    background: var(--bg-overlay—caoliao-chorme-app, var(--paper-2));
    line-height: 1.5;
    font-size: 13px;
    color: var(--ink-2);
    text-decoration: none;
    max-height: none !important;
    overflow: visible !important;
}
