/* PawPal 网页版增量样式：子页面 / 底部弹层 / 功能组件。
   与 mp.css（小程序 wxss 转换产物）配套，单位统一用 var(--rpx) 保持等比。 */

/* ===== 子页面容器 =====
   现仅作全屏挂载点：五个功能子页在 JS 内自建 feature-stage/feature-phone 外壳（自带内边距），
   这里不再叠一层 padding，否则上/左右出现双重留白。 */
.web-subpage {
  position: absolute;
  inset: 0;
  z-index: 300;
  background: #fffaf2;
  display: flex;
  flex-direction: column;
  padding: 0;
  box-sizing: border-box;
}
.web-subpage-topbar {
  display: flex;
  align-items: center;
  gap: calc(16 * var(--rpx));
  padding: calc(16 * var(--rpx)) 0;
}
.web-subpage-back {
  width: calc(64 * var(--rpx));
  height: calc(64 * var(--rpx));
  border: none;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 calc(6 * var(--rpx)) calc(18 * var(--rpx)) rgba(96, 72, 50, 0.12);
  font-size: calc(44 * var(--rpx));
  line-height: 1;
  color: #3b3229;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: calc(6 * var(--rpx));
}
.web-subpage-titles { display: flex; flex-direction: column; }
.web-subpage-title { font-size: calc(36 * var(--rpx)); font-weight: 800; color: #2f2a24; }
.web-subpage-subtitle { font-size: calc(24 * var(--rpx)); color: #9a8f83; margin-top: calc(4 * var(--rpx)); }
.web-subpage-body {
  flex: 1;
  overflow-y: auto;
  padding: calc(8 * var(--rpx)) calc(4 * var(--rpx)) calc(60 * var(--rpx));
}
.web-subpage-body::-webkit-scrollbar { display: none; }
.web-subpage-body { scrollbar-width: none; }

/* 子页 hero 彩条 */
.web-hero {
  border-radius: calc(32 * var(--rpx));
  padding: calc(30 * var(--rpx)) calc(32 * var(--rpx));
  color: #fff;
  margin-bottom: calc(24 * var(--rpx));
}
.web-hero text { display: block; }
.web-hero .wh1 { font-size: calc(38 * var(--rpx)); font-weight: 900; }
.web-hero .wh2 { font-size: calc(24 * var(--rpx)); opacity: 0.92; margin-top: calc(8 * var(--rpx)); line-height: 1.5; }
.web-hero-check { background: linear-gradient(135deg, #ffae3d, #ff8a4c); }
.web-hero-voice { background: linear-gradient(135deg, #43c6ac, #2ea28c); }
.web-hero-nearby { background: linear-gradient(135deg, #6aa8ff, #4d7df0); }
.web-hero-avatar { background: linear-gradient(135deg, #b98cf5, #8a63e0); }

/* 通用白卡 */
.web-card {
  background: #ffffff;
  border-radius: calc(28 * var(--rpx));
  padding: calc(26 * var(--rpx)) calc(28 * var(--rpx));
  box-shadow: 0 calc(10 * var(--rpx)) calc(28 * var(--rpx)) rgba(96, 72, 50, 0.07);
  margin-bottom: calc(24 * var(--rpx));
}
.web-card-title { display: block; font-size: calc(28 * var(--rpx)); font-weight: 800; color: #2f2a24; margin-bottom: calc(14 * var(--rpx)); }
.web-muted { color: #9a8f83; font-size: calc(24 * var(--rpx)); line-height: 1.55; }
.web-note { font-size: calc(22 * var(--rpx)); color: #b0a698; line-height: 1.55; display: block; }

/* chips 单选行 */
.web-chip-row { display: flex; flex-wrap: wrap; gap: calc(14 * var(--rpx)); }
.web-chip {
  padding: calc(12 * var(--rpx)) calc(26 * var(--rpx));
  border-radius: calc(999 * var(--rpx));
  background: #f6efe4;
  color: #6f6459;
  font-size: calc(24 * var(--rpx));
  cursor: pointer;
}
.web-chip-active { background: #ffae3d; color: #fff; font-weight: 700; }

/* 上传区 */
.web-upload {
  border: calc(3 * var(--rpx)) dashed #e4d7c3;
  border-radius: calc(28 * var(--rpx));
  min-height: calc(300 * var(--rpx));
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: calc(10 * var(--rpx));
  color: #b0a698;
  font-size: calc(26 * var(--rpx));
  cursor: pointer;
  overflow: hidden;
  background: #fffdf8;
}
.web-upload img { width: 100%; max-height: calc(460 * var(--rpx)); object-fit: contain; }

/* 主按钮 */
.web-primary-btn {
  width: 100%;
  height: calc(88 * var(--rpx));
  border: none;
  border-radius: calc(44 * var(--rpx));
  background: #ffae3d;
  color: #fff;
  font-size: calc(32 * var(--rpx));
  font-weight: 800;
  margin-top: calc(24 * var(--rpx));
}
.web-primary-btn[disabled] { opacity: 0.55; cursor: default; }
.web-ghost-btn {
  border: calc(2 * var(--rpx)) solid #eadfce;
  background: #fff;
  color: #6f6459;
  border-radius: calc(999 * var(--rpx));
  padding: calc(10 * var(--rpx)) calc(28 * var(--rpx));
  font-size: calc(24 * var(--rpx));
}

/* 结果卡 */
.web-result-head { display: flex; align-items: center; gap: calc(14 * var(--rpx)); margin-bottom: calc(12 * var(--rpx)); }
.web-risk-badge {
  padding: calc(6 * var(--rpx)) calc(20 * var(--rpx));
  border-radius: calc(999 * var(--rpx));
  font-size: calc(24 * var(--rpx));
  font-weight: 700;
  background: #eef7ee;
  color: #3f8f4f;
}
.web-risk-mid { background: #fff4e0; color: #c07a1d; }
.web-risk-high { background: #fdeaea; color: #cf4436; }
.web-result-line { display: block; font-size: calc(26 * var(--rpx)); color: #4a4238; line-height: 1.65; margin-top: calc(8 * var(--rpx)); white-space: pre-wrap; }
.web-result-label { color: #9a8f83; font-size: calc(22 * var(--rpx)); margin-right: calc(8 * var(--rpx)); }

/* 录音按钮 */
.web-record-wrap { display: flex; flex-direction: column; align-items: center; padding: calc(26 * var(--rpx)) 0; }
.web-record-btn {
  width: calc(220 * var(--rpx));
  height: calc(220 * var(--rpx));
  border-radius: 50%;
  border: none;
  background: radial-gradient(circle at 32% 28%, #5fd7bd, #2ea28c);
  color: #fff;
  font-size: calc(30 * var(--rpx));
  font-weight: 800;
  box-shadow: 0 calc(16 * var(--rpx)) calc(40 * var(--rpx)) rgba(46, 162, 140, 0.35);
  position: relative;
}
.web-record-btn.recording { background: radial-gradient(circle at 32% 28%, #ff9a7a, #e65c4f); box-shadow: 0 calc(16 * var(--rpx)) calc(40 * var(--rpx)) rgba(230, 92, 79, 0.35); }
.web-record-btn.recording::after {
  content: "";
  position: absolute;
  inset: calc(-18 * var(--rpx));
  border-radius: 50%;
  border: calc(4 * var(--rpx)) solid rgba(230, 92, 79, 0.4);
  animation: web-ring 1.2s ease-out infinite;
}
@keyframes web-ring { 0% { transform: scale(0.9); opacity: 1; } 100% { transform: scale(1.25); opacity: 0; } }
.web-record-status { margin-top: calc(22 * var(--rpx)); color: #6f6459; font-size: calc(26 * var(--rpx)); }

/* 附近列表 */
.web-place-row {
  display: flex;
  align-items: center;
  gap: calc(18 * var(--rpx));
  padding: calc(20 * var(--rpx)) 0;
  border-bottom: calc(2 * var(--rpx)) solid #f4ecdf;
}
.web-place-row:last-child { border-bottom: none; }
.web-place-main { flex: 1; min-width: 0; }
.web-place-name { display: block; font-size: calc(28 * var(--rpx)); font-weight: 700; color: #2f2a24; }
.web-place-meta { display: block; font-size: calc(22 * var(--rpx)); color: #9a8f83; margin-top: calc(6 * var(--rpx)); line-height: 1.5; }
.web-place-tag {
  display: inline-block;
  margin-top: calc(8 * var(--rpx));
  padding: calc(2 * var(--rpx)) calc(14 * var(--rpx));
  border-radius: calc(999 * var(--rpx));
  background: #f0f5ff;
  color: #4d7df0;
  font-size: calc(20 * var(--rpx));
}
.web-place-nav {
  border: none;
  border-radius: calc(999 * var(--rpx));
  background: #4d7df0;
  color: #fff;
  padding: calc(12 * var(--rpx)) calc(26 * var(--rpx));
  font-size: calc(24 * var(--rpx));
  flex: 0 0 auto;
}

/* ===== 分身页 ===== */
.web-stage {
  position: relative;
  border-radius: calc(32 * var(--rpx));
  background: linear-gradient(180deg, #fdf3ff 0%, #f2ecff 100%);
  min-height: calc(480 * var(--rpx));
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  overflow: hidden;
  margin-bottom: calc(24 * var(--rpx));
  padding-bottom: calc(30 * var(--rpx));
}
.web-stage-bubble {
  position: absolute;
  top: calc(26 * var(--rpx));
  left: 50%;
  transform: translateX(-50%);
  max-width: 82%;
  background: #ffffff;
  border-radius: calc(22 * var(--rpx));
  padding: calc(12 * var(--rpx)) calc(24 * var(--rpx));
  font-size: calc(24 * var(--rpx));
  color: #5a4f44;
  box-shadow: 0 calc(8 * var(--rpx)) calc(22 * var(--rpx)) rgba(120, 90, 180, 0.12);
  text-align: center;
}
.web-stage-pet-wrap { position: relative; width: calc(320 * var(--rpx)); height: calc(320 * var(--rpx)); }
.web-stage-pet { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 calc(14 * var(--rpx)) calc(20 * var(--rpx)) rgba(120, 90, 180, 0.22)); }
.web-stage-pet-wrap.state-idle { animation: web-bob 3.2s ease-in-out infinite; }
.web-stage-pet-wrap.state-play { animation: web-bounce 0.9s ease-in-out infinite; }
.web-stage-pet-wrap.state-sleep { animation: web-breathe 4.5s ease-in-out infinite; filter: saturate(0.85); }
.web-stage-pet-wrap.state-eat { animation: web-nibble 1.4s ease-in-out infinite; }
.web-stage-pet-wrap.glow .web-stage-pet { filter: drop-shadow(0 0 calc(26 * var(--rpx)) rgba(255, 200, 90, 0.85)); }
@keyframes web-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(calc(-14 * var(--rpx))); } }
@keyframes web-bounce { 0%, 100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(calc(-30 * var(--rpx))) rotate(2deg); } }
@keyframes web-breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.03); } }
@keyframes web-nibble { 0%, 100% { transform: translateY(0); } 30% { transform: translateY(calc(8 * var(--rpx))) rotate(1.5deg); } 60% { transform: translateY(0); } }
.web-stage-outfit { position: absolute; pointer-events: none; }
.web-stage-outfit.anchor-torso { left: 18%; right: 18%; bottom: 4%; height: 52%; }
.web-stage-outfit.anchor-head { left: 26%; right: 26%; top: -10%; height: 34%; }
.web-stage-outfit img { width: 100%; height: 100%; object-fit: contain; }
.web-stage-state-label {
  margin-top: calc(10 * var(--rpx));
  font-size: calc(22 * var(--rpx));
  color: #8d7fb0;
}
.web-stage-actions { display: flex; gap: calc(16 * var(--rpx)); margin-top: calc(18 * var(--rpx)); flex-wrap: wrap; justify-content: center; }
.web-stage-actions button {
  border: none;
  border-radius: calc(999 * var(--rpx));
  background: #ffffff;
  color: #6a5c8f;
  font-size: calc(24 * var(--rpx));
  padding: calc(12 * var(--rpx)) calc(26 * var(--rpx));
  box-shadow: 0 calc(6 * var(--rpx)) calc(16 * var(--rpx)) rgba(120, 90, 180, 0.14);
}
.web-twin-row { display: flex; gap: calc(14 * var(--rpx)); }
.web-twin-choice {
  flex: 1;
  border: none;
  border-radius: calc(20 * var(--rpx));
  background: #f6efe4;
  color: #6f6459;
  font-size: calc(24 * var(--rpx));
  padding: calc(16 * var(--rpx)) 0;
}
.web-twin-choice.on { background: #ffae3d; color: #fff; font-weight: 700; }
.web-wardrobe-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: calc(18 * var(--rpx)); }
.web-outfit-card {
  border-radius: calc(24 * var(--rpx));
  background: #fffdf8;
  border: calc(2 * var(--rpx)) solid #f0e6d6;
  padding: calc(18 * var(--rpx));
  text-align: center;
  cursor: pointer;
  position: relative;
}
.web-outfit-card.selected { border-color: #ffae3d; box-shadow: 0 0 0 calc(4 * var(--rpx)) rgba(255, 174, 61, 0.18); }
.web-outfit-card.locked { opacity: 0.62; }
.web-outfit-thumb { width: 100%; height: calc(150 * var(--rpx)); display: flex; align-items: center; justify-content: center; border-radius: calc(18 * var(--rpx)); }
.web-outfit-thumb img { max-width: 86%; max-height: 92%; object-fit: contain; }
.web-outfit-name { display: block; font-size: calc(24 * var(--rpx)); font-weight: 700; color: #4a4238; margin-top: calc(10 * var(--rpx)); }
.web-outfit-state { display: block; font-size: calc(20 * var(--rpx)); color: #9a8f83; margin-top: calc(4 * var(--rpx)); line-height: 1.4; }

/* ===== 底部弹层（复用小程序观感） ===== */
.web-sheet-mask {
  position: fixed;
  inset: 0;
  z-index: 800;
  background: rgba(31, 24, 16, 0.42);
  display: flex;
  align-items: flex-end;
}
.web-sheet {
  width: 100%;
  max-height: calc(78 * var(--vhu));
  background: #fffaf2;
  border-radius: calc(36 * var(--rpx)) calc(36 * var(--rpx)) 0 0;
  padding: calc(30 * var(--rpx)) calc(30 * var(--rpx)) calc(40 * var(--rpx));
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}
.web-sheet-head { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: calc(20 * var(--rpx)); }
.web-sheet-title { font-size: calc(32 * var(--rpx)); font-weight: 800; color: #2f2a24; display: block; }
.web-sheet-sub { font-size: calc(22 * var(--rpx)); color: #9a8f83; margin-top: calc(6 * var(--rpx)); display: block; }
.web-sheet-close {
  border: none;
  background: #f2e9da;
  color: #6f6459;
  width: calc(52 * var(--rpx));
  height: calc(52 * var(--rpx));
  border-radius: 50%;
  font-size: calc(30 * var(--rpx));
  line-height: 1;
  flex: 0 0 auto;
}
.web-sheet-body { flex: 1; overflow-y: auto; min-height: 0; }
.web-sheet-body::-webkit-scrollbar { display: none; }
.web-sheet-body { scrollbar-width: none; }

/* 表单行 / 开关 */
.web-form-row { display: flex; align-items: center; justify-content: space-between; padding: calc(18 * var(--rpx)) 0; border-bottom: calc(2 * var(--rpx)) solid #f4ecdf; gap: calc(16 * var(--rpx)); }
.web-form-row:last-child { border-bottom: none; }
.web-form-label { font-size: calc(26 * var(--rpx)); color: #4a4238; }
.web-form-sub { display: block; font-size: calc(20 * var(--rpx)); color: #b0a698; margin-top: calc(4 * var(--rpx)); }
.web-form-input {
  flex: 1;
  text-align: right;
  font-size: calc(26 * var(--rpx));
  color: #2f2a24;
  border: none;
  background: transparent;
}
.web-textarea {
  width: 100%;
  min-height: calc(160 * var(--rpx));
  border: calc(2 * var(--rpx)) solid #eadfce;
  border-radius: calc(20 * var(--rpx));
  background: #fff;
  padding: calc(16 * var(--rpx));
  box-sizing: border-box;
  font-size: calc(26 * var(--rpx));
  font-family: inherit;
  color: #2f2a24;
  resize: none;
  outline: none;
}
.web-switch {
  width: calc(88 * var(--rpx));
  height: calc(48 * var(--rpx));
  border-radius: calc(999 * var(--rpx));
  background: #e7dcc9;
  position: relative;
  cursor: pointer;
  flex: 0 0 auto;
  transition: background 0.2s;
}
.web-switch::after {
  content: "";
  position: absolute;
  top: calc(4 * var(--rpx));
  left: calc(4 * var(--rpx));
  width: calc(40 * var(--rpx));
  height: calc(40 * var(--rpx));
  border-radius: 50%;
  background: #fff;
  transition: left 0.2s;
  box-shadow: 0 calc(2 * var(--rpx)) calc(6 * var(--rpx)) rgba(0, 0, 0, 0.15);
}
.web-switch.on { background: #ffae3d; }
.web-switch.on::after { left: calc(44 * var(--rpx)); }

/* 健康/喂食/疫苗/驱虫记录编辑器（复刻小程序 health-sheet） */
.web-care-badge {
  display: flex;
  align-items: center;
  gap: calc(16 * var(--rpx));
  background: #fdf6ea;
  border-radius: calc(20 * var(--rpx));
  padding: calc(16 * var(--rpx)) calc(20 * var(--rpx));
  margin-bottom: calc(12 * var(--rpx));
}
.web-care-badge img {
  width: calc(72 * var(--rpx));
  height: calc(72 * var(--rpx));
  border-radius: 50%;
  object-fit: cover;
  background: #fff;
  flex: 0 0 auto;
}
.web-care-badge-name { display: block; font-size: calc(26 * var(--rpx)); font-weight: 700; color: #2f2a24; }
.web-care-badge-sub { display: block; font-size: calc(20 * var(--rpx)); color: #b0a698; margin-top: calc(4 * var(--rpx)); }
.web-form-hint {
  display: block;
  font-size: calc(20 * var(--rpx));
  color: #b0a698;
  padding: calc(6 * var(--rpx)) 0 calc(10 * var(--rpx));
  border-bottom: calc(2 * var(--rpx)) solid #f4ecdf;
}
.web-status-choice-row { display: flex; gap: calc(12 * var(--rpx)); flex-wrap: wrap; justify-content: flex-end; }
.web-status-choice {
  border: calc(2 * var(--rpx)) solid #eadfce;
  background: #fff;
  color: #6f6459;
  border-radius: calc(999 * var(--rpx));
  padding: calc(8 * var(--rpx)) calc(20 * var(--rpx));
  font-size: calc(22 * var(--rpx));
  line-height: 1.4;
}
.web-status-choice-active { background: #ffae3d; border-color: #ffae3d; color: #fff; font-weight: 700; }
.web-consult-ai-btn { width: 100%; margin: calc(16 * var(--rpx)) 0 calc(4 * var(--rpx)); }

/* 记忆卡 */
.web-memory-card {
  background: #fff;
  border-radius: calc(22 * var(--rpx));
  padding: calc(20 * var(--rpx)) calc(24 * var(--rpx));
  margin-bottom: calc(16 * var(--rpx));
  box-shadow: 0 calc(6 * var(--rpx)) calc(16 * var(--rpx)) rgba(96, 72, 50, 0.06);
}
.web-memory-head { display: flex; align-items: center; gap: calc(10 * var(--rpx)); flex-wrap: wrap; }
.web-memory-type {
  padding: calc(2 * var(--rpx)) calc(14 * var(--rpx));
  border-radius: calc(999 * var(--rpx));
  background: #f0f5ff;
  color: #4d7df0;
  font-size: calc(20 * var(--rpx));
}
.web-memory-status { font-size: calc(20 * var(--rpx)); color: #9a8f83; }
.web-memory-summary { display: block; font-size: calc(26 * var(--rpx)); color: #3b3229; line-height: 1.6; margin: calc(10 * var(--rpx)) 0; }
.web-memory-actions { display: flex; gap: calc(14 * var(--rpx)); flex-wrap: wrap; }
.web-memory-actions text {
  font-size: calc(22 * var(--rpx));
  color: #4d7df0;
  cursor: pointer;
  padding: calc(4 * var(--rpx)) calc(10 * var(--rpx));
}
.web-memory-actions text.danger { color: #cf4436; }

/* 方案卡 */
.web-tier-card {
  border: calc(2 * var(--rpx)) solid #eadfce;
  border-radius: calc(24 * var(--rpx));
  padding: calc(22 * var(--rpx)) calc(26 * var(--rpx));
  margin-bottom: calc(18 * var(--rpx));
  background: #fff;
  cursor: pointer;
}
.web-tier-card.active { border-color: #ffae3d; box-shadow: 0 0 0 calc(4 * var(--rpx)) rgba(255, 174, 61, 0.16); }
.web-tier-head { display: flex; align-items: baseline; justify-content: space-between; }
.web-tier-name { font-size: calc(30 * var(--rpx)); font-weight: 800; color: #2f2a24; }
.web-tier-price { font-size: calc(26 * var(--rpx)); color: #c07a1d; font-weight: 700; }
.web-tier-highlights { margin-top: calc(10 * var(--rpx)); }
.web-tier-highlights text { display: block; font-size: calc(22 * var(--rpx)); color: #6f6459; line-height: 1.7; }

/* 体重趋势（真实数据版） */
.web-trend-bars { display: flex; align-items: flex-end; gap: calc(20 * var(--rpx)); height: calc(150 * var(--rpx)); padding: calc(6 * var(--rpx)) 0; }
.web-trend-col { display: flex; flex-direction: column; align-items: center; gap: calc(6 * var(--rpx)); flex: 1; }
.web-trend-bar { width: calc(30 * var(--rpx)); border-radius: calc(10 * var(--rpx)) calc(10 * var(--rpx)) 0 0; background: #f0e2c8; }
.web-trend-bar.latest { background: #ffae3d; }
.web-trend-val { font-size: calc(18 * var(--rpx)); color: #9a8f83; }
.web-record-row { padding: calc(16 * var(--rpx)) 0; border-bottom: calc(2 * var(--rpx)) solid #f4ecdf; display: flex; justify-content: space-between; align-items: center; gap: calc(12 * var(--rpx)); }
.web-record-row:last-child { border-bottom: none; }
.web-record-main { flex: 1; min-width: 0; }
.web-record-title { display: block; font-size: calc(26 * var(--rpx)); color: #3b3229; font-weight: 600; }
.web-record-sub { display: block; font-size: calc(20 * var(--rpx)); color: #9a8f83; margin-top: calc(4 * var(--rpx)); line-height: 1.5; }
.web-record-del { color: #cf4436; font-size: calc(22 * var(--rpx)); cursor: pointer; flex: 0 0 auto; }

/* 历史 turn */
.web-turn { background: #fff; border-radius: calc(20 * var(--rpx)); padding: calc(18 * var(--rpx)) calc(22 * var(--rpx)); margin-bottom: calc(16 * var(--rpx)); }
.web-turn-q { display: block; font-size: calc(24 * var(--rpx)); color: #2f2a24; font-weight: 700; }
.web-turn-a { display: block; font-size: calc(22 * var(--rpx)); color: #6f6459; margin-top: calc(8 * var(--rpx)); line-height: 1.6; }
.web-turn-bar { display: flex; justify-content: space-between; align-items: center; margin-bottom: calc(6 * var(--rpx)); }
.web-turn-time { font-size: calc(20 * var(--rpx)); color: #b0a698; }

/* 诊前卡（聊天内） */
.web-previsit {
  margin-top: calc(14 * var(--rpx));
  border-left: calc(6 * var(--rpx)) solid #cf4436;
  background: #fdf3f1;
  border-radius: calc(14 * var(--rpx));
  padding: calc(14 * var(--rpx)) calc(18 * var(--rpx));
}
.web-previsit text { display: block; font-size: calc(22 * var(--rpx)); color: #6b3f38; line-height: 1.6; }
.web-previsit .t { font-weight: 800; color: #cf4436; font-size: calc(24 * var(--rpx)); }

/* 空态 */
.web-empty { text-align: center; color: #b0a698; font-size: calc(24 * var(--rpx)); padding: calc(40 * var(--rpx)) 0; display: block; }

/* AI 形象生成进度条（网页版真生图链路） */
.avatar-gen-progress {
  margin: calc(12 * var(--rpx)) 0 calc(4 * var(--rpx));
  height: calc(12 * var(--rpx));
  border-radius: calc(8 * var(--rpx));
  background: #f0e2c8;
  overflow: hidden;
}
.avatar-gen-progress-bar {
  width: 0;
  height: 100%;
  border-radius: calc(8 * var(--rpx));
  background: linear-gradient(90deg, #ffcf7a, #ffae3d);
  transition: width .3s ease;
}