/* =========================================================
   chibi-pod.css —— 天梯图前三名台子上的 Q 版形象位

   卡片实测（1280 视口）：368×232，内边距 20/18，正文只排到 y=180，
   底部本来就有约 50px 空档。所以这里不挤压文字，而是把正文列收窄、
   形象放在右下角空白区。
   ========================================================= */

/* 有形象的卡片：正文列收窄，给右侧形象让位（名字、请求数仍能单行放下）。
   只要有一张有形象，三张一起收窄 —— 缺图的那张就是纯留白，不会让文字宽度忽宽忽窄。 */
#podium.podium-chibi .pod {
  padding-right: 118px;
}

.pod-chibi {
  position: absolute;
  right: 12px;
  bottom: 12px;
  width: 100px;
  height: 128px;
  display: grid;
  place-items: end center;
  pointer-events: none;   /* 不挡卡片本身的点击 */
  z-index: 1;
}

/* 厂商主色柔光，让形象和玻璃卡片过渡自然 */
.pod-chibi::before {
  content: "";
  position: absolute;
  inset: -14% -20% -8%;
  background: radial-gradient(54% 52% at 50% 58%, var(--chibi-glow, rgba(130, 160, 220, .26)), transparent 72%);
  filter: blur(4px);
  z-index: -1;
  pointer-events: none;
}

.pod-chibi img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  object-position: bottom;
  /* --chibi-lift 由 js 按每张素材的亮度单独给（深色形象提亮，浅色不动） */
  filter: brightness(var(--chibi-lift, 1.08)) saturate(1.04) drop-shadow(0 8px 18px rgba(0, 0, 0, .55));
  /* 图片进来时轻微上浮，避免生硬弹出 */
  animation: pod-chibi-in .45s cubic-bezier(.2, .8, .3, 1) both;
}

@keyframes pod-chibi-in {
  from { opacity: 0; transform: translateY(8px) scale(.97); }
  to   { opacity: 1; transform: none; }
}

/* 台子悬停时形象跟着浮起来，和卡片位移一致 */
.pod:hover .pod-chibi img {
  filter: brightness(var(--chibi-lift, 1.08)) saturate(1.04) drop-shadow(0 12px 22px rgba(0, 0, 0, .6));
}

/* 单列布局（窄屏）时卡片变宽、变矮，形象按比例收一点 */
@media (max-width: 940px) {
  #podium.podium-chibi .pod {
    padding-right: 100px;
  }
  .pod-chibi {
    width: 84px;
    height: 108px;
    right: 10px;
    bottom: 12px;
  }
}

@media (max-width: 640px) {
  #podium.podium-chibi .pod {
    padding-right: 100px;
  }
  .pod-chibi {
    width: 86px;
    height: 110px;
    right: 8px;
    bottom: 10px;
  }
}

/* 用户关掉动效时不做动画 */
@media (prefers-reduced-motion: reduce) {
  .pod-chibi img {
    animation: none;
  }
}