/* =====================================================================
   个人虚拟动物园（需求 4）
   风格：写实向的「微缩沙盘」——天空渐变 + 远近山丘 + 草地 + 池塘 + 木栅栏，
        动物用 CSS 关键帧做出走动/游动/跳跃的感觉。
   配色跟随全站「淡色天空蓝」主题。
   ===================================================================== */

.pz-wrap { max-width: 1400px; margin: 0 auto; padding: 18px 16px 48px; }

/* ------------------------------ 顶部 ------------------------------ */
.pz-topbar { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-end;
  justify-content: space-between; margin-bottom: 16px; }
.pz-back { font-size: 13px; color: var(--text-2); }
.pz-title { margin: 6px 0 4px; font-size: 25px; color: var(--brand-deep, #1f5f87); }
.pz-sub { margin: 0; font-size: 13.5px; color: var(--text-2); }
.pz-warn { color: #d9534f; font-weight: 700; }
.pz-topbar__right { display: flex; gap: 9px; flex-wrap: wrap; }

.pz-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 15px; border-radius: 999px;
  border: 1px solid var(--line, #dceaf3); background: #fff; color: var(--text); font-size: 13.5px;
  cursor: pointer; font-weight: 600; text-decoration: none; transition: all .16s ease; }
.pz-btn:hover { border-color: var(--brand, #3d9bd1); color: var(--brand-dark, #2b7aa8); text-decoration: none; }
.pz-btn--primary { background: var(--brand, #3d9bd1); border-color: var(--brand, #3d9bd1); color: #fff; }
.pz-btn--primary:hover { background: var(--brand-dark, #2b7aa8); color: #fff; }
.pz-btn--sm { padding: 5px 12px; font-size: 12.5px; }
.pz-btn--sick { background: #e05c5c; border-color: #e05c5c; color: #fff; }
.pz-btn--sick:hover { background: #c94a4a; color: #fff; }

/* ------------------------------ 布局 ------------------------------ */
.pz-layout { display: grid; grid-template-columns: 310px minmax(0, 1fr); gap: 18px; align-items: start; }
@media (max-width: 980px) { .pz-layout { grid-template-columns: 1fr; } }

.pz-panel { background: #fff; border: 1px solid var(--line, #dceaf3); border-radius: 14px;
  padding: 14px 16px; margin-bottom: 14px; box-shadow: 0 2px 10px rgba(31, 95, 135, .05); }
.pz-panel__title { margin: 0 0 10px; font-size: 15px; color: var(--brand-deep, #1f5f87);
  display: flex; align-items: center; justify-content: space-between; }
.pz-panel__count { font-size: 12px; color: var(--muted); font-weight: 500; }
.pz-panel__hint { margin: 0 0 10px; font-size: 12.5px; line-height: 1.7; color: var(--text-2); }
.pz-panel__actions { margin-top: 10px; display: flex; gap: 8px; }
.pz-inline { display: inline; }
.pz-empty { text-align: center; padding: 12px 0; font-size: 13px; color: var(--text-2); }
.pz-empty-inline { font-size: 12.5px; color: var(--text-2); line-height: 1.8; }

/* ------------------------------ 宠物属性缩略（左上角） ------------------------------ */
.pz-petlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.pz-petcard { border: 1px solid var(--line, #dceaf3); border-radius: 11px; padding: 10px 11px;
  cursor: pointer; transition: all .16s ease; background: #fbfdff; }
.pz-petcard:hover { border-color: var(--brand, #3d9bd1); transform: translateX(2px); }
.pz-petcard.is-sick { border-color: #f0b4b4; background: #fff6f6; }
.pz-petcard__head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.pz-petcard__avatar { width: 34px; height: 34px; border-radius: 9px; overflow: hidden; flex-shrink: 0; background: #eaf5fc; }
.pz-petcard__avatar img { width: 100%; height: 100%; object-fit: contain; }
.pz-petcard__name { flex: 1; min-width: 0; }
.pz-petcard__name strong { display: block; font-size: 13.5px; }
.pz-petcard__name em { font-style: normal; font-size: 11.5px; color: var(--muted); }
.pz-badge { font-size: 11px; padding: 2px 8px; border-radius: 999px; white-space: nowrap; }
.pz-badge--ok { background: #e8f3fc; color: #1f5f87; }
.pz-badge--care { background: #fdf6e3; color: #8a6100; }
.pz-badge--sick { background: #fbeceb; color: #a43a2b; font-weight: 700; }

.pz-stat { display: grid; grid-template-columns: 30px 1fr 28px; align-items: center; gap: 6px; margin: 4px 0; }
.pz-stat__k { font-size: 11.5px; color: var(--muted); }
.pz-stat__bar { height: 7px; border-radius: 4px; background: #eef5fb; overflow: hidden; }
.pz-stat__bar i { display: block; height: 100%; border-radius: 4px; transition: width .3s ease; }
.pz-stat__v { font-size: 11.5px; text-align: right; font-variant-numeric: tabular-nums; }

/* ------------------------------ 道具箱 ------------------------------ */
.pz-catalog { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 8px; }
.pz-catalog__item { border: 1px solid var(--line, #dceaf3); border-radius: 10px; padding: 6px 4px;
  text-align: center; cursor: grab; background: #fbfdff; transition: all .16s ease; }
.pz-catalog__item:hover { border-color: var(--brand, #3d9bd1); background: #eaf5fc; transform: translateY(-2px); }
.pz-catalog__item.is-dragging { opacity: .45; }
.pz-catalog__item img { width: 54px; height: 54px; object-fit: contain; display: block; margin: 0 auto 3px; }
.pz-catalog__item span { font-size: 11px; color: var(--text-2); line-height: 1.3; display: block; }
.pz-details { margin-top: 12px; font-size: 12.5px; }
.pz-details summary { cursor: pointer; color: var(--brand-dark, #2b7aa8); }
.pz-form { display: grid; gap: 7px; margin-top: 9px; }
.pz-form label { font-size: 12px; color: var(--text-2); }
.pz-form input, .pz-form select { border: 1px solid var(--line, #dceaf3); border-radius: 8px; padding: 7px 9px; font-size: 13px; }

/* ==================== 动物园场地（核心视觉） ==================== */
.pz-stagewrap { min-width: 0; }
.pz-stage { position: relative; width: 100%; aspect-ratio: 16 / 10; min-height: 420px;
  border-radius: 18px; overflow: hidden; border: 1px solid #cfe4f2;
  box-shadow: 0 12px 34px rgba(31, 95, 135, .14); user-select: none; }
@media (max-width: 680px) { .pz-stage { aspect-ratio: 4 / 3; min-height: 340px; } }
.pz-stage.is-dropzone { outline: 3px dashed var(--brand, #3d9bd1); outline-offset: -7px; }

/* 天空 */
.pz-sky { position: absolute; inset: 0 0 42% 0;
  background: linear-gradient(180deg, #bfe3f8 0%, #d9eefb 52%, #eaf7fd 100%); }
.pz-sun { position: absolute; right: 9%; top: 9%; width: 62px; height: 62px; border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, #fff8dc, #ffe9a8 62%, #ffd97a);
  box-shadow: 0 0 42px rgba(255, 220, 130, .75); }
.pz-cloud { position: absolute; background: rgba(255, 255, 255, .92); border-radius: 999px;
  filter: blur(.4px); box-shadow: 0 6px 16px rgba(120, 170, 200, .18); }
.pz-cloud::before, .pz-cloud::after { content: ''; position: absolute; background: inherit; border-radius: 50%; }
.pz-cloud--1 { left: 8%; top: 14%; width: 96px; height: 30px; animation: pz-drift 46s linear infinite; }
.pz-cloud--1::before { width: 42px; height: 42px; left: 14px; top: -19px; }
.pz-cloud--1::after { width: 30px; height: 30px; left: 52px; top: -13px; }
.pz-cloud--2 { left: 42%; top: 7%; width: 74px; height: 24px; opacity: .8; animation: pz-drift 62s linear infinite reverse; }
.pz-cloud--2::before { width: 34px; height: 34px; left: 12px; top: -16px; }
.pz-cloud--3 { left: 68%; top: 21%; width: 58px; height: 20px; opacity: .66; animation: pz-drift 78s linear infinite; }
.pz-cloud--3::before { width: 26px; height: 26px; left: 10px; top: -12px; }
@keyframes pz-drift { from { transform: translateX(-16px); } to { transform: translateX(52px); } }

/* 远近山丘 */
.pz-hill { position: absolute; left: -6%; right: -6%; border-radius: 50% 50% 0 0; }
.pz-hill--far { bottom: 40%; height: 26%; background: linear-gradient(180deg, #a9d5ea, #8fc4e0); opacity: .65; }
.pz-hill--near { bottom: 34%; height: 22%; background: linear-gradient(180deg, #93cf9d, #7cc08c); opacity: .85; }

/* 地面 */
.pz-ground { position: absolute; left: 0; right: 0; bottom: 0; height: 44%;
  background:
    radial-gradient(ellipse at 20% 8%, rgba(255,255,255,.35), transparent 60%),
    repeating-linear-gradient(115deg, rgba(120,190,130,.12) 0 12px, transparent 12px 26px),
    linear-gradient(180deg, #a8ddb2 0%, #8ecf9c 42%, #74bd86 100%); }
.pz-ground::after { content: ''; position: absolute; inset: 0;
  background: radial-gradient(circle at 78% 78%, rgba(60,140,90,.16), transparent 62%); }

/* 池塘 */
.pz-pond { position: absolute; left: 6%; bottom: 7%; width: 26%; height: 17%;
  border-radius: 50%; background: radial-gradient(circle at 38% 32%, #d8f1fd, #8ec9e8 58%, #6fb4d8);
  box-shadow: inset 0 3px 10px rgba(30,90,130,.25); opacity: .95; }
.pz-pond::after { content: ''; position: absolute; left: 22%; top: 26%; width: 34%; height: 22%;
  border-radius: 50%; background: rgba(255,255,255,.5); filter: blur(2px); }

/* 木栅栏 */
.pz-fence { position: absolute; left: 0; right: 0; bottom: 0; height: 46px;
  background: repeating-linear-gradient(90deg, #c99a63 0 7px, transparent 7px 26px);
  border-top: 5px solid #b98a52; opacity: .55; }
.pz-fence::before { content: ''; position: absolute; left: 0; right: 0; top: 14px; height: 6px; background: #c99a63; }

/* ------------------------------ 已摆放道具 ------------------------------ */
.pz-decor-layer { position: absolute; inset: 0; }
.pz-decor { position: absolute; width: 84px; cursor: move; text-align: center;
  transition: filter .16s ease; touch-action: none; }
.pz-decor img { width: 100%; height: auto; display: block; filter: drop-shadow(0 6px 9px rgba(20,70,100,.28)); }
.pz-decor:hover { filter: brightness(1.06); }
.pz-decor.is-moving { opacity: .85; z-index: 999 !important; filter: drop-shadow(0 12px 18px rgba(20,70,100,.35)); }
.pz-decor__name { display: block; font-size: 10.5px; color: #2f5f4a; background: rgba(255,255,255,.82);
  border-radius: 999px; padding: 1px 6px; margin-top: -4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pz-decor__del { position: absolute; top: -8px; right: -8px; width: 20px; height: 20px; border-radius: 50%;
  border: 2px solid #fff; background: #e05c5c; color: #fff; font-size: 12px; line-height: 1; cursor: pointer;
  display: none; align-items: center; justify-content: center; padding: 0; }
.pz-decor:hover .pm-decor__del, .pz-decor:hover .pz-decor__del { display: flex; }
.pz-stage__tip { position: absolute; left: 50%; bottom: 12%; transform: translateX(-50%);
  background: rgba(255,255,255,.9); border: 1px dashed var(--brand, #3d9bd1); color: var(--brand-deep, #1f5f87);
  padding: 9px 18px; border-radius: 999px; font-size: 13px; }

/* ------------------------------ 宠物 ------------------------------ */
/*
 * 需求 3 改造说明（重要）
 * ===============================================================
 * 之前的两个真实缺陷：
 *   1. 宠物直接用**真实照片**（.jpg）当移动方块，与卡通场景很不协调；
 *   2. 动画用 `scaleX(-1)` 让宠物转身，而这会把**悬浮提示一起镜像** ——
 *      鼠标移上去看到的文字是反的。
 *
 * 现在的做法：
 *   - 外层 .pz-pet     负责「在场内不规则游走」（只做位移，不做翻转）
 *   - 内层 .pz-pet__sprite 负责「左右朝向翻转 + 走动时上下轻微起伏」
 *   - 提示层 .pz-pet__tip 独立，**永远正立**，不受任何翻转影响
 *   - 猫狗使用内联 SVG 卡通形象（views/zoo/partials/pet-sprite.ejs）
 */
.pz-pet { position: absolute; width: 78px; cursor: pointer;
  z-index: 20; touch-action: none;
  /* 游走范围（由模板按宠物序号注入，让每只宠物的活动区域不同） */
  --pz-range-x: 90px;
  --pz-range-y: 42px;
  --pz-dur: 26s;
  animation: pz-roam var(--pz-dur) ease-in-out infinite;
}
@keyframes pz-roam {
  /* 不规则游走：每个关键点都带轻微偏移与停顿，避免「左右弹跳」的机械感 */
  0%   { transform: translate(-50%, -50%) translate(0, 0); }
  7%   { transform: translate(-50%, -50%) translate(calc(var(--pz-range-x) * 0.28), calc(var(--pz-range-y) * -0.4)); }
  15%  { transform: translate(-50%, -50%) translate(calc(var(--pz-range-x) * 0.52), calc(var(--pz-range-y) * 0.55)); }
  23%  { transform: translate(-50%, -50%) translate(calc(var(--pz-range-x) * 0.46), calc(var(--pz-range-y) * 0.5)); }
  32%  { transform: translate(-50%, -50%) translate(calc(var(--pz-range-x) * 0.82), calc(var(--pz-range-y) * -0.3)); }
  41%  { transform: translate(-50%, -50%) translate(calc(var(--pz-range-x) * 0.95), calc(var(--pz-range-y) * 0.2)); }
  50%  { transform: translate(-50%, -50%) translate(calc(var(--pz-range-x) * 0.6), calc(var(--pz-range-y) * 0.85)); }
  58%  { transform: translate(-50%, -50%) translate(calc(var(--pz-range-x) * 0.34), calc(var(--pz-range-y) * 0.6)); }
  67%  { transform: translate(-50%, -50%) translate(calc(var(--pz-range-x) * -0.18), calc(var(--pz-range-y) * 0.72)); }
  76%  { transform: translate(-50%, -50%) translate(calc(var(--pz-range-x) * -0.5), calc(var(--pz-range-y) * 0.1)); }
  85%  { transform: translate(-50%, -50%) translate(calc(var(--pz-range-x) * -0.38), calc(var(--pz-range-y) * -0.5)); }
  93%  { transform: translate(-50%, -50%) translate(calc(var(--pz-range-x) * -0.12), calc(var(--pz-range-y) * -0.2)); }
  100% { transform: translate(-50%, -50%) translate(0, 0); }
}

/**
 * 宠物形象：**三层结构**（每层只负责一件事，避免互相覆盖）
 * -----------------------------------------------------------------
 *   .pz-pet          外层：场内不规则游走（pz-roam，只做位移）
 *   .pz-pet__flip    翻转层：朝左时 scaleX(-1)（**不放动画**）
 *   .pz-pet__sprite  动画层：走动起伏 / 游动 / 跳跃 / 呼吸
 *   .pz-pet__tip     提示层：完全独立，永远正立
 *
 * 为什么必须拆成三层：
 *   CSS 动画运行时会**接管 transform 属性**，普通声明 transform: scaleX(-1)
 *   会被动画关键帧覆盖 —— 曾导致「宠物不会转身」。
 *   把翻转放在**不带动画的中间层**即可彻底解决。
 */
.pz-pet__flip { display: block; width: 100%; line-height: 0; }
.pz-pet.is-left .pz-pet__flip { transform: scaleX(-1); }
.pz-pet__sprite { display: block; width: 100%; line-height: 0;
  animation: pz-sprite-walk 1.1s ease-in-out infinite; }
.pz-pet__sprite svg, .pz-pet__sprite img { width: 100%; height: auto; display: block;
  filter: drop-shadow(0 5px 8px rgba(20,70,100,.28)); }
@keyframes pz-sprite-walk {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-3px) rotate(-1.2deg); }
}
/* 非猫狗（鱼/鸟/爬宠/鸣虫等）沿用各自的动作，但同样只作用于 sprite */
.pz-pet--swim .pz-pet__sprite { animation: pz-swim-soft 6.2s ease-in-out infinite; }
@keyframes pz-swim-soft {
  0%, 100% { transform: translateY(0) rotate(-3deg); }
  50% { transform: translateY(-4px) rotate(3deg); }
}
.pz-pet--hop .pz-pet__sprite { animation: pz-hop-soft 2.4s ease-in-out infinite; }
@keyframes pz-hop-soft {
  0%, 100% { transform: translateY(0); }
  35% { transform: translateY(-16px); }
  70% { transform: translateY(0); }
}
.pz-pet--idle .pz-pet__sprite { animation: pz-breathe-soft 4.2s ease-in-out infinite; }
@keyframes pz-breathe-soft {
  0%, 100% { transform: scale(1) translateY(0); }
  50% { transform: scale(1.04) translateY(-4px); }
}
/*
 * 旧的 motion 类不再驱动外层游走（否则会覆盖 pz-roam 的不规则轨迹）。
 * 游走统一由 .pz-pet 的 pz-roam 负责；各物种的动作差异体现在 sprite 上。
 */
.pz-pet--walk,
.pz-pet--swim,
.pz-pet--hop,
.pz-pet--idle { animation: pz-roam var(--pz-dur, 26s) ease-in-out infinite; }
@keyframes pz-walk {
  0%   { transform: translate(-50%, -50%) translateX(0) scaleX(1); }
  25%  { transform: translate(-50%, -50%) translateX(46px) scaleX(1); }
  48%  { transform: translate(-50%, -50%) translateX(88px) scaleX(1); }
  50%  { transform: translate(-50%, -50%) translateX(88px) scaleX(-1); }
  75%  { transform: translate(-50%, -50%) translateX(40px) scaleX(-1); }
  98%  { transform: translate(-50%, -50%) translateX(0) scaleX(-1); }
  100% { transform: translate(-50%, -50%) translateX(0) scaleX(1); }
}
/* 鱼：小幅摆动游动 */
.pz-pet--swim { animation: pz-swim 9s ease-in-out infinite; }
@keyframes pz-swim {
  0%, 100% { transform: translate(-50%, -50%) translate(0, 0) rotate(-3deg); }
  33% { transform: translate(-50%, -50%) translate(26px, -8px) rotate(3deg); }
  66% { transform: translate(-50%, -50%) translate(-20px, 6px) rotate(-2deg); }
}
/* 鸟/鸣虫：跳跃 */
.pz-pet--hop { animation: pz-hop 3.6s ease-in-out infinite; }
@keyframes pz-hop {
  0%, 100% { transform: translate(-50%, -50%) translateY(0); }
  18% { transform: translate(-50%, -50%) translateY(-22px); }
  36% { transform: translate(-50%, -50%) translateY(0); }
  54% { transform: translate(-50%, -50%) translateY(-14px); }
  72% { transform: translate(-50%, -50%) translateY(0); }
}
/* 其他：轻微呼吸 */
.pz-pet--idle { animation: pz-breathe 4.6s ease-in-out infinite; }
@keyframes pz-breathe {
  0%, 100% { transform: translate(-50%, -50%) scale(1) translateY(0); }
  50% { transform: translate(-50%, -50%) scale(1.04) translateY(-5px); }
}
.pz-pet.is-focus { z-index: 60; }
.pz-pet.is-focus > .pz-pet__sprite { animation: pz-pulse 1.1s ease-in-out 2; }
@keyframes pz-pulse { 0%,100% { filter: drop-shadow(0 0 0 rgba(61,155,209,0)); } 50% { filter: drop-shadow(0 0 16px rgba(61,155,209,.95)); } }
.pz-pet__sick { position: absolute; right: -3px; top: -8px; font-size: 16px; animation: pz-blink 1.7s ease-in-out infinite;
  z-index: 2; }
@keyframes pz-blink { 0%,100% { opacity: 1; } 50% { opacity: .35; } }

/**
 * 悬浮提示
 * ---------------------------------------------------------------
 * 需求 3 关键点：**任何角度悬停，提示文字都必须正立**。
 * 因此这里显式声明 transform 只做居中与缩放，
 * 且它的父级 .pz-pet 不再参与翻转（翻转只作用在 .pz-pet__sprite 上）。
 * translateZ(0) 让它独立成层，避免被祖先的 transform 影响渲染。
 */
.pz-pet__tip { position: absolute; left: 50%; bottom: calc(100% + 12px);
  transform: translateX(-50%) translateZ(0) scale(.94);
  background: rgba(255,255,255,.99); border: 1px solid var(--line, #dceaf3); border-radius: 12px;
  padding: 11px 13px; width: 214px; opacity: 0; pointer-events: none; transition: opacity .18s ease, transform .18s ease;
  box-shadow: 0 10px 26px rgba(31, 95, 135, .2); z-index: 200; text-align: left;
  direction: ltr; writing-mode: horizontal-tb; }
.pz-pet:hover .pz-pet__tip { opacity: 1; transform: translateX(-50%) translateZ(0) scale(1); pointer-events: auto; }
/* 提示里的头像（需求 3：悬停可查看宠物头像与属性） */
.pz-pet__tip-head { display: flex; align-items: center; gap: 8px; margin-bottom: 7px; }
.pz-pet__tip-avatar { width: 38px; height: 38px; border-radius: 50%; overflow: hidden; flex-shrink: 0;
  background: var(--brand-light, #eaf5fc); border: 1px solid var(--line, #dceaf3); }
.pz-pet__tip-avatar img, .pz-pet__tip-avatar svg { width: 100%; height: 100%; object-fit: contain; display: block; }
.pz-pet__tip-name { min-width: 0; }
.pz-pet__tip strong { display: block; font-size: 13.5px; color: var(--brand-deep, #1f5f87); }
.pz-pet__tip em { display: block; font-style: normal; font-size: 11.5px; color: var(--muted); margin-bottom: 6px; }
.pz-pet__tip ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 3px; }
.pz-pet__tip li { display: flex; justify-content: space-between; font-size: 12px; color: var(--text-2);
  border-bottom: 1px dashed #eef5fb; padding: 2px 0; }
.pz-pet__tip li b { color: var(--text); font-variant-numeric: tabular-nums; }
.pz-pet__tipstate { margin: 7px 0 0; font-size: 12px; color: #1f5f87; font-weight: 600; }
.pz-pet__tipstate.is-sick { color: #d9534f; }
.pz-pet__done { margin: 7px 0 0; font-size: 11.5px; color: #1f8a5b; }

.pz-stage__empty { position: absolute; inset: 0; display: flex; flex-direction: column; gap: 12px;
  align-items: center; justify-content: center; background: rgba(255,255,255,.55); font-size: 15px; color: var(--text-2); }
.pz-stage-foot { margin: 12px 2px 0; font-size: 12.5px; color: var(--muted); line-height: 1.8; }

/* ------------------------------ 提示条 ------------------------------ */
.pz-toast { position: fixed; left: 50%; bottom: 34px; transform: translate(-50%, 20px);
  background: #1f5f87; color: #fff; padding: 11px 22px; border-radius: 999px; font-size: 13.5px;
  opacity: 0; pointer-events: none; transition: all .25s ease; z-index: 999; box-shadow: 0 10px 26px rgba(0,0,0,.22); }
.pz-toast.is-show { opacity: 1; transform: translate(-50%, 0); }
.pz-toast.is-error { background: #c0503f; }

/* ------------------------------ 救助记录页 ------------------------------ */
.pz-record { display: grid; gap: 10px; }
.pz-record__item { display: flex; gap: 12px; align-items: flex-start; background: #fff;
  border: 1px solid var(--line, #dceaf3); border-radius: 12px; padding: 13px 15px; }
.pz-record__icon { font-size: 22px; }
.pz-record__body { flex: 1; min-width: 0; }
.pz-record__body strong { font-size: 14px; }
.pz-record__body p { margin: 4px 0 0; font-size: 12.5px; color: var(--text-2); line-height: 1.75; }
.pz-record__time { font-size: 11.5px; color: var(--muted); }

/* ==================== 需求 2：今日轮播动物园 + 只读互动 ==================== */
.pz-rotate { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between;
  background: linear-gradient(120deg, #eaf5fc, #f6fbff); border: 1px solid #cfe6f7;
  border-radius: 14px; padding: 14px 18px; margin-bottom: 12px; }
.pz-rotate__left { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.pz-rotate__badge { display: inline-block; font-size: 11.5px; font-weight: 700; color: #1f5f87;
  background: #fff; border: 1px solid #cfe6f7; border-radius: 999px; padding: 2px 10px; align-self: flex-start; }
.pz-rotate__title { font-size: 17px; color: var(--brand-deep, #1f5f87); }
.pz-rotate__meta { font-size: 12.5px; color: #55707f; }
.pz-rotate__right { display: flex; gap: 8px; flex-wrap: wrap; }
.pz-rotate__notice { margin: 0 0 16px; font-size: 12.5px; line-height: 1.8; color: #55707f;
  background: #f6fbff; border-left: 3px solid #a5d5f0; border-radius: 0 8px 8px 0; padding: 9px 14px; }
.pz-social { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 6px; }
.pz-social .pz-btn.is-active { background: #eaf5fc; border-color: #3d9bd1; color: #1f5f87; font-weight: 700; }
.pz-panel__hint--tiny { font-size: 11.5px; color: #8ba3b0; margin: 0; }

/* 轮播空状态 */
.pz-empty-rotate { text-align: center; padding: 70px 20px; background: #fff; border: 1px solid var(--line, #dceaf3);
  border-radius: 16px; }
.pz-empty-rotate h2 { margin: 0 0 10px; color: var(--brand-deep, #1f5f87); font-size: 20px; }
.pz-empty-rotate p { margin: 6px 0; color: #55707f; font-size: 14px; line-height: 1.9; }

/* ==================== 需求 3：宠物走路腿部动画 ==================== */
/* 前后腿交替抬起，让 SVG 形象在场内走动时有生命感（仅 stage 模式启用） */
@keyframes pz-leg {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-4px); }
}
/* 提示头像是静态的，确保其中腿部不继承动画 */
.pz-pet__tip-avatar [style*="pz-leg"] { animation: none !important; }