:root {
  --ink: #231318;
  --text: #4a343b;
  --mute: #8a7178;
  --line: #f0dfe4;
  --paper: #fdf7f8;
  --white: #ffffff;
  --pri: #e0556f;
  --pri-deep: #bf3d56;
  --accent: #ffb02e;
  --soft: #fde9ee;
  --soft-2: #fff4dc;
}

/* 门户台：斜置粉色版块 + 倾斜手机 + 圆章评分 + 左侧签到条 */
.hv-portal .hero { padding: 46px 0 40px; }
.hv-portal .hero-grid { grid-template-columns: 1.05fr 0.95fr; gap: 40px; }
.hv-portal .hero::before { right: -6%; top: -14%; width: 58%; height: 124%;
  background: radial-gradient(circle at 48% 44%, rgba(224,85,111,.18), rgba(255,176,46,.10) 54%, transparent 74%); }
.hv-portal .hero-visual { min-height: 520px; }
.hv-portal .hero-visual::before {
  content: ""; position: absolute; inset: 2% -4% 6% 10%; border-radius: 36px;
  background: linear-gradient(202deg, #ffe3ea, #fff7f9 68%);
  border: 1px solid #f6dde4; rotate: 3deg;
  box-shadow: 0 24px 54px rgba(66,30,40,.10);
}
.hv-portal .hero-visual::after {
  content: "今日签到 +5 积分"; position: absolute; left: 1%; top: 5%;
  padding: 8px 14px; border-radius: 12px; background: var(--white);
  border: 1px solid #f3d3dc; color: var(--pri-deep);
  font-size: 12px; font-weight: 800; rotate: -2deg;
  box-shadow: 0 12px 26px rgba(66,30,40,.10);
}
.hv-portal .hero-glow { width: 76%; opacity: .5; background: radial-gradient(circle at 50% 45%, rgba(224,85,111,.28), rgba(255,176,46,.16) 58%, transparent 74%); }
.hv-portal .stage-phone {
  width: min(214px, 50%); justify-self: center; align-self: center; margin-top: 6px;
  padding: 7px; border-radius: 28px; background: #1a1014;
  border-color: rgba(26,16,20,.14); rotate: -5deg; animation: none;
  box-shadow: 0 24px 48px rgba(66,30,40,.26);
}
.hv-portal .stage-phone img { border-radius: 22px; }
.hv-portal .hero-badge {
  left: auto; right: 2%; top: auto; bottom: 5%; width: 92px; height: 92px;
  border-radius: 50%; background: var(--accent); rotate: -8deg;
  box-shadow: 0 16px 34px rgba(255,176,46,.34);
}
.hv-portal .hero-badge strong { color: #3a2400; font-size: 27px; }
.hv-portal .hero-badge span { color: #5c3c00; }
.hv-portal .hero-strip {
  left: 0; right: 34%; bottom: 4%; flex-wrap: wrap; gap: 6px;
  background: transparent; border: 0; box-shadow: none; padding: 0;
}
.hv-portal .hero-strip span { background: var(--white); border: 1px solid var(--line); color: var(--pri-deep); box-shadow: 0 8px 18px rgba(66,30,40,.06); }
.sv-frames .showcase { background: #fff6f8; }
.dv-split .download-panel { background: linear-gradient(120deg, #fde9ee, #ffffff 64%); }

@media (max-width: 640px) {
  .hv-portal .hero-grid { grid-template-columns: 1fr; gap: 16px; }
  .hv-portal .hero-visual { min-height: 470px; }
  .hv-portal .hero-visual::before { inset: 2% 0 4% 0; border-radius: 24px; rotate: 0deg; }
  .hv-portal .hero-visual::after { left: 10px; top: 0; font-size: 10px; padding: 6px 10px; }
  .hv-portal .stage-phone { width: min(176px, 50%); margin-top: 52px; rotate: -4deg; }
  .hv-portal .hero-badge { display: grid; right: 10px; left: auto; top: 0; bottom: auto; width: 62px; height: 62px; border-radius: 50%; }
  .hv-portal .hero-badge strong { font-size: 20px; }
  .hv-portal .hero-strip { left: 12px; right: 12px; bottom: 6px; flex-wrap: nowrap; gap: 4px; justify-content: center; }
  .hv-portal .hero-strip span { padding: 3px 7px; font-size: 10px; }
}

