/* ── 链接卡片 ──────────────────────────────────────────────
   消息里的裸链接渲染成的卡片。贴合暖纸/陶土色板：纸感扁平，radius 12，
   无框无影（design-system 卡片规范）。
   布局参考 dwell songcard：封面 | 两行文字 | 右侧按钮，紧凑不铺满。 */

/* 占位（等 /api/card 返回前的形态）：像个普通链接，但可点复制 */
.link-card-host {
  display: inline;
  color: var(--accent, #c96442);
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-style: dotted;
  cursor: pointer;
  word-break: break-all;
}

/* 解析失败 → 降级成普通外链 */
.link-card-fallback {
  color: var(--accent, #c96442);
  text-decoration: underline;
  text-underline-offset: 2px;
  word-break: break-all;
}

/* 卡片本体：一行内排封面/文字/右侧按钮。
   宽度由内容决定（fit-content），封顶 ~250px，像微信/QQ 分享卡那样
   在气泡里只占一部分、不撑满整个框。 */
.link-card {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 6px 0;
  padding: 8px 10px;
  background: var(--card-bg, #f0eee6);
  border-radius: 12px;
  width: fit-content;
  max-width: min(250px, 100%);
  min-width: 0;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}

.link-card:active {
  opacity: .85;
}

/* 封面：固定小方图，所有类型统一，像微信分享卡的缩略图 */
.lc-pic {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  object-fit: cover;
  border-radius: 8px;
  background: var(--bg-sunken, #ece8dc);
}

.lc-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  justify-content: center;
}

.lc-title {
  font: 600 14px/1.3 var(--font-sans, inherit);
  color: var(--text-primary, #2c2a26);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.lc-desc {
  font: 400 12px/1.35 var(--font-sans, inherit);
  color: var(--text-secondary, #6b6660);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* 类型小字：右下角，微信分享卡那种右上角小标签的弱化版 */
.lc-type {
  align-self: flex-end;
  flex: none;
  font: 400 11px/1 var(--font-sans, inherit);
  color: var(--text-faint, #a09a90);
  padding-bottom: 2px;
}

/* 右侧：音乐卡播放键，其他卡一个柔和箭头提示可点 */
.lc-play {
  flex: none;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: #c96442;
  color: #fff;
  font-size: 12px;
  line-height: 1;
  padding: 0;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: transform .12s ease, opacity .12s ease;
}

.lc-play:active {
  transform: scale(.9);
}

.lc-play.playing {
  background: var(--text-secondary, #6b6660);
  font-size: 10px;
  letter-spacing: -1px;
}

.lc-arrow {
  flex: none;
  color: var(--text-faint, #a09a90);
  font-size: 20px;
  line-height: 1;
  margin-right: 2px;
}
