/* ── 标签云 ───────────────────────────────────────────────────────────────
 *
 * 字号随文章数缩放，但**不在模板里计算最大值** —— 实测几条路都被堵死：
 *   - Thymeleaf 的 #lists 没有 max()           → EL1004E: Method max cannot be found
 *   - SpEL 没有 naturalOrder() 静态工厂         → EL1004E: Method naturalOrder cannot be found
 *   - SpEL 不支持 lambda                        → EL1043E: Unexpected token
 *   - Thymeleaf 禁用 T() 访问 java.util.*        → Access is forbidden for type
 *
 * 因此模板只把原始文章数写进内联样式：
 *
 *     <a class="tag-cloud-item" style="--tag-count: 3">
 *
 * 缩放比例交给 CSS 计算：以 --tag-max 作为「满量程」参考值（默认 10），
 * 用 max(var(--tag-max), 1) 兜底避免除零，clamp() 把比例限制在 0~1。
 * 效果：文章数达到 10 及以上的标签取最大字号，其余按比例递减。
 * 纯 CSS 方案，标签文章数为 0 或超过参考值都不会出错。
 * ──────────────────────────────────────────────────────────────────────── */

.tag-cloud {
  /* 满量程参考值：文章数达到该值即取最大字号 */
  --tag-max: 10;
  /* 字号量程：刻意收窄，保持 Wenxin 克制的语气，避免标签云抢走正文注意力 */
  --tag-size-min: 0.9rem;
  --tag-size-max: 1.9rem;

  /*
    关键：--tag-ratio 必须声明在**父元素**上，且只依赖父级/自身的变量。
    自定义属性的值不会被预先求值，只是原样存储 —— 若把它写在 .tag-cloud-item 上
    并在同一条规则里用 font-size 引用，font-size 拿到的是一段无法参与运算的字符串，
    字号会静默退回继承值（实测为 16px）。
    放在父级后，--tag-count（由模板写在每个 a 的内联样式里）会被子元素替换进来，
    因此父级的 calc 会按每个子元素各自的值求值。
  */
  --tag-ratio: clamp(0, calc(var(--tag-count, 0) / max(var(--tag-max), 1)), 1);

  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-2) var(--space-5);
}

.tag-cloud-item {
  font-family: var(--font-display);
  font-size: calc(
    var(--tag-size-min) + var(--tag-ratio) * (var(--tag-size-max) - var(--tag-size-min))
  );

  color: var(--color-text-primary);
  line-height: var(--leading-snug);
  text-decoration: none;
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-1);
  transition:
    color var(--duration-fast) var(--ease-default),
    transform var(--duration-fast) var(--ease-default);
}

.tag-cloud-item:hover {
  color: var(--color-accent);
}

@media (hover: hover) and (pointer: fine) {
  .tag-cloud-item:hover {
    transform: translateY(-2px);
  }
}

/* 文章数：小号等宽数字，弱化显示 */
.tag-cloud-count {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  font-variant-numeric: tabular-nums;
}

/* 达到满量程的标签用主标题色 + 粗体，作为视觉锚点 */
.tag-cloud-item[data-max="true"] {
  color: var(--color-text-heading);
  font-weight: 700;
}
