/* community_v 组（（無路由））專屬樣式。
 * 全部用 app.css 的 token；class 用 cv- 前綴。兼容 iOS Safari 14：不用 inset / flex gap / aspect-ratio / :is() / dvh / color-mix。
 */

/* ---- 作者徽章（信息流卡腳部 / 帖子詳情頭部 / 評論行）----
 * 名字有省略號的地方（.cmty-card__name 是 flex:1 + ellipsis），徽章放名字外層且 flex-shrink:0，
 * 名字先截斷、徽章不被擠成兩行。 */
.cv-badges {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  margin-left: var(--sp-1);
  white-space: nowrap;
}
.cv-badge {
  display: inline-block;
  padding: 1px 6px;
  border-radius: var(--radius-pill);
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
  white-space: nowrap;
}
.cv-badge + .cv-badge {
  margin-left: 4px;
}
.cv-badge-v {
  background: var(--tint);
  color: var(--on-tint);
}
.cv-badge-member {
  background: var(--fill);
  color: var(--label-2);
  border: 1px solid var(--separator);
  padding: 0 5px;
}

/* ---- 贊助貼片（頂部橫幅 / 信息流卡）---- */
.cv-slot {
  display: block;
  margin: var(--sp-2) var(--gutter) 0;
  border-radius: var(--radius);
  background: var(--tint-soft);
  overflow: hidden;
}
.cv-slot--feed {
  background: var(--fill);
}
.cv-slot__link {
  display: block;
  color: inherit;
  text-decoration: none;
}
.cv-slot__main {
  display: block;
  padding: var(--sp-2);
}
.cv-slot__head {
  display: flex;
  align-items: center;
}
.cv-slot__tag {
  flex: 0 0 auto;
  display: inline-block;
  padding: 1px 8px;
  border-radius: var(--radius-pill);
  background: var(--tint);
  color: var(--on-tint);
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
  white-space: nowrap;
}
.cv-slot__sponsor {
  flex: 1 1 auto;
  min-width: 0;
  margin-left: var(--sp-1);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: var(--label-2);
  font-size: 12px;
  line-height: 18px;
}
.cv-slot__title {
  margin-top: var(--sp-1);
  color: var(--label);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  word-break: break-word;
}
.cv-slot__body {
  margin-top: 2px;
  color: var(--label-2);
  font-size: 13px;
  line-height: 1.45;
  word-break: break-word;
}
.cv-slot__img {
  display: block;
  width: 100%;
  max-height: 120px;
  margin-top: var(--sp-1);
  border-radius: var(--radius-sm);
  object-fit: cover;
}

@media (prefers-reduced-motion: reduce) {
  .cv-slot,
  .cv-slot__link,
  .cv-badge {
    transition: none;
  }
}