/* Auto-built from miniprogram report wxss — run: node scripts/build-growth-report-css.js */
.gr-book{--gr-phone:min(100vw,420px);width:100%;max-width:420px;margin:0 auto;height:100dvh;position:relative;overflow:hidden;background:#0b1220;}
.gr-swiper{height:100%;overflow-y:auto;scroll-snap-type:y mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.gr-swiper::-webkit-scrollbar{width:0;height:0;display:none;}
.gr-slide{min-height:100%;scroll-snap-align:start;scroll-snap-stop:always;}
.gr-book .rp-swiper{height:100%;}
.gr-book .rp-swiper-item,.gr-slide{display:block;height:100%;min-height:100dvh;}

/* ---- subpage-shell.wxss ---- */


/* 与班主任 classroom 首页顶栏同一套：safe-area + 胶囊右侧留白 */
.ht-header {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: calc(16 * min(100vw, 420px) / 750);
  padding: env(safe-area-inset-top) calc(28 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750);
  box-sizing: border-box;
}

.ht-header__left {
  display: flex;
  align-items: center;
  gap: calc(12 * min(100vw, 420px) / 750);
  flex-shrink: 0;
  min-width: 0;
}

.ht-header__center {
  flex: 1;
  min-width: 0;
  text-align: center;
  font-size: calc(32 * min(100vw, 420px) / 750);
  font-weight: 700;
  color: #2f3242;
}

.sp-header {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  padding: calc(16 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.9);
  border-bottom: calc(1 * min(100vw, 420px) / 750) solid #E4F1FA;
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(140, 203, 250, 0.1);
}

.sp-header__back {
  padding: calc(12 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750);
  border-radius: calc(16 * min(100vw, 420px) / 750);
  background: #EAF6FF;
  border: calc(1 * min(100vw, 420px) / 750) solid #E4F1FA;
  color: #5BAFEA;
  font-size: calc(28 * min(100vw, 420px) / 750);
  font-weight: 600;
}

/* 学生子页：上统计/摘要卡 + 下主内容卡（与宠物页一致） */
.st-.gr-book-stack,
.sp-.gr-book-stack {
  flex: 1;
  height: 0;
  display: flex;
  flex-direction: column;
  gap: calc(16 * min(100vw, 420px) / 750);
  min-height: 0;
  box-sizing: border-box;
}

.st-stack-panel,
.sp-stack-panel {
  flex-shrink: 0;
  box-sizing: border-box;
  border-radius: calc(32 * min(100vw, 420px) / 750);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(140, 203, 250, 0.22);
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 calc(12 * min(100vw, 420px) / 750) calc(36 * min(100vw, 420px) / 750) rgba(91, 175, 234, 0.12);
  backdrop-filter: blur(calc(16 * min(100vw, 420px) / 750));
  -webkit-backdrop-filter: blur(calc(16 * min(100vw, 420px) / 750));
}

.st-stack-panel--top,
.sp-stack-panel--top {
  padding: calc(8 * min(100vw, 420px) / 750) calc(12 * min(100vw, 420px) / 750);
}

.st-stack-panel--flush,
.sp-stack-panel--flush {
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* 与首页一致：内容区左右留白，顶栏下方 calc(8 * min(100vw, 420px) / 750) 再接卡片 */
.st-body {
  flex: 1;
  height: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 0 var(--st-.gr-book-gutter, calc(24 * min(100vw, 420px) / 750));
  box-sizing: border-box;
}

.st-body > .st-.gr-book-stack,
.st-body > .sp-.gr-book-stack,
.st-main > .st-.gr-book-stack,
.st-main > .sp-.gr-book-stack {
  padding: var(--st-header-to-content-gap, calc(8 * min(100vw, 420px) / 750)) 0 0;
  flex: 1;
  height: 0;
  min-height: 0;
}

/* 首页整页滚动：与背包顶栏下留白一致 */
.st-home-scroll-inner,
.st-scroll-inner {
  padding-top: var(--st-header-to-content-gap, calc(8 * min(100vw, 420px) / 750));
}

.st-stack-panel--main,
.sp-stack-panel--main {
  flex: 1;
  height: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.st-stack-panel--main.st-stack-panel--scroll,
.sp-stack-panel--main.sp-stack-panel--scroll {
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.sp-scroll {
  flex: 1;
  height: 0;
  width: 100%;
}

.sp-scroll-inner {
  padding: calc(16 * min(100vw, 420px) / 750) 0 calc(calc(24 * min(100vw, 420px) / 750) + var(--st-tabbar-scroll-pad, calc(calc(88 * min(100vw, 420px) / 750) + var(--tabbar-safe-bottom, calc(28 * min(100vw, 420px) / 750)))));
  box-sizing: border-box;
}

/* 答题/背包等子页：底栏与首页同高，避免全局旧 Tab 样式撑高 */
.m-app--proto > .m-bottom-nav--student {
  flex-shrink: 0;
  width: 100%;
  overflow: visible;
}

.sp-points-card {
  position: relative;
  overflow: hidden;
  margin: 0;
  padding: calc(36 * min(100vw, 420px) / 750) calc(32 * min(100vw, 420px) / 750);
  text-align: center;
  border-radius: calc(32 * min(100vw, 420px) / 750);
  background-color: #eaf7ff;
  border: calc(1 * min(100vw, 420px) / 750) solid #E4F1FA;
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(140, 203, 250, 0.12);
}

.sp-points-card__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

.sp-points-card__value,
.sp-points-card__label {
  position: relative;
  z-index: 1;
}

.sp-points-card__value {
  font-size: calc(72 * min(100vw, 420px) / 750);
  font-weight: 700;
  color: #F0A82E;
  line-height: 1.1;
}

.sp-points-card__label {
  margin-top: calc(8 * min(100vw, 420px) / 750);
  font-size: calc(28 * min(100vw, 420px) / 750);
  color: #6F7485;
  font-weight: 500;
}

.sp-panel {
  margin: 0;
  padding: calc(20 * min(100vw, 420px) / 750) calc(12 * min(100vw, 420px) / 750);
  border-radius: calc(32 * min(100vw, 420px) / 750);
  background: #FFFFFF;
  border: calc(1 * min(100vw, 420px) / 750) solid #E4F1FA;
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(140, 203, 250, 0.12);
}

.sp-segment-tabs {
  display: flex;
  gap: calc(12 * min(100vw, 420px) / 750);
  margin-bottom: calc(20 * min(100vw, 420px) / 750);
  padding: calc(8 * min(100vw, 420px) / 750);
  border-radius: calc(24 * min(100vw, 420px) / 750);
  background: #EFF8FF;
  border: calc(1 * min(100vw, 420px) / 750) solid #E4F1FA;
}

.sp-segment {
  flex: 1;
  padding: calc(20 * min(100vw, 420px) / 750) calc(12 * min(100vw, 420px) / 750);
  text-align: center;
  border-radius: calc(18 * min(100vw, 420px) / 750);
  color: #6F7485;
  font-size: calc(28 * min(100vw, 420px) / 750);
  font-weight: 600;
  gap: calc(10 * min(100vw, 420px) / 750);
}

.sp-segment--active {
  color: #FFFFFF;
  background: linear-gradient(135deg, #5BAFEA 0%, #8CCBFA 100%);
  border: calc(1 * min(100vw, 420px) / 750) solid transparent;
}

.sp-section-title {
  margin: calc(8 * min(100vw, 420px) / 750) 0 calc(16 * min(100vw, 420px) / 750);
  color: #2F3242;
  font-size: calc(34 * min(100vw, 420px) / 750);
  font-weight: 700;
  text-shadow: none;
}

.sp-shop-wrap {
  padding: calc(6 * min(100vw, 420px) / 750);
  border-radius: calc(32 * min(100vw, 420px) / 750);
  background: #EFF8FF;
  border: calc(1 * min(100vw, 420px) / 750) solid #E4F1FA;
}

.sp-products-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: calc(12 * min(100vw, 420px) / 750);
}

.sp-product-card {
  display: grid;
  grid-template-columns: calc(86 * min(100vw, 420px) / 750) minmax(0, 1fr);
  grid-template-rows: minmax(calc(94 * min(100vw, 420px) / 750), auto) calc(56 * min(100vw, 420px) / 750);
  gap: calc(10 * min(100vw, 420px) / 750) calc(12 * min(100vw, 420px) / 750);
  min-height: calc(168 * min(100vw, 420px) / 750);
  padding: calc(14 * min(100vw, 420px) / 750);
  border-radius: calc(22 * min(100vw, 420px) / 750);
  box-sizing: border-box;
  overflow: hidden;
  background: #FFFFFF;
  border: calc(1 * min(100vw, 420px) / 750) solid #E4F1FA;
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(140, 203, 250, 0.1);
}

.sp-product-card__icon-wrap {
  grid-column: 1;
  grid-row: 1;
  min-height: calc(94 * min(100vw, 420px) / 750);
  padding: 0;
  border-radius: calc(16 * min(100vw, 420px) / 750);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background: linear-gradient(180deg, #EAF6FF, #F4FAFF);
}

.sp-product-card__icon {
  font-size: calc(56 * min(100vw, 420px) / 750);
  line-height: 1;
}

.sp-product-card__body {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.sp-product-card__name {
  min-height: 0;
  text-align: left;
  color: #2F3242;
  font-size: calc(26 * min(100vw, 420px) / 750);
  font-weight: 700;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.sp-product-card__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(6 * min(100vw, 420px) / 750);
  margin: calc(10 * min(100vw, 420px) / 750) 0 0;
}

.sp-product-card__price {
  flex-shrink: 0;
  padding: calc(6 * min(100vw, 420px) / 750) calc(14 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: rgba(251, 191, 36, 0.42);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(180, 83, 9, 0.22);
  color: #F0A82E;
  font-size: calc(22 * min(100vw, 420px) / 750);
  font-weight: 700;
  white-space: nowrap;
}

.sp-product-card__stock {
  flex: 1;
  min-width: 0;
  text-align: right;
  color: #6F7485;
  font-size: calc(22 * min(100vw, 420px) / 750);
  font-weight: 600;
}

.sp-product-card__btn {
  grid-column: 1 / 3;
  grid-row: 2;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 0;
  text-align: center;
  border-radius: calc(20 * min(100vw, 420px) / 750);
  color: #fff;
  font-size: calc(26 * min(100vw, 420px) / 750);
  font-weight: 600;
  background: linear-gradient(135deg, #5BAFEA 0%, #8CCBFA 100%);
}

.sp-product-card__btn--disabled {
  color: #9EA4B5;
  background: #F2F6FA;
}

.sp-my-items-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: calc(16 * min(100vw, 420px) / 750);
}

.sp-my-items-grid--pocket {
  display: flex;
  flex-direction: column;
  gap: calc(12 * min(100vw, 420px) / 750);
}

.sp-my-item {
  padding: calc(24 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750);
  text-align: center;
  border-radius: calc(24 * min(100vw, 420px) / 750);
  background: #f8fcff;
  border: calc(1 * min(100vw, 420px) / 750) solid #e4f1fa;
  box-sizing: border-box;
}

.sp-my-item--row {
  display: flex;
  flex-direction: row;
  align-items: center;
  text-align: left;
  gap: calc(16 * min(100vw, 420px) / 750);
  padding: calc(20 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750);
}

.sp-my-item--row .sp-my-item__icon {
  flex-shrink: 0;
  font-size: calc(56 * min(100vw, 420px) / 750);
}

.sp-my-item__info {
  flex: 1;
  min-width: 0;
}

.sp-my-item--row .sp-my-item__name {
  margin-top: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sp-my-item--row .sp-my-item__time {
  margin-top: calc(6 * min(100vw, 420px) / 750);
}

.sp-my-item__icon {
  font-size: calc(64 * min(100vw, 420px) / 750);
  line-height: 1;
}

.sp-my-item__name {
  margin-top: calc(12 * min(100vw, 420px) / 750);
  color: #2f3242;
  font-size: calc(28 * min(100vw, 420px) / 750);
  font-weight: 700;
  line-height: 1.35;
  word-break: break-all;
}

.sp-my-item__time {
  margin-top: calc(8 * min(100vw, 420px) / 750);
  color: #6f7485;
  font-size: calc(22 * min(100vw, 420px) / 750);
  line-height: 1.3;
}

.sp-badge-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: calc(16 * min(100vw, 420px) / 750);
}

.sp-badge-earned {
  padding: calc(20 * min(100vw, 420px) / 750) calc(12 * min(100vw, 420px) / 750);
  text-align: center;
  border-radius: calc(16 * min(100vw, 420px) / 750);
  background: linear-gradient(135deg, #FFF5D9, #FFE1A8);
  border: calc(2 * min(100vw, 420px) / 750) solid #F0A82E;
}

.sp-badge-earned__icon {
  font-size: calc(52 * min(100vw, 420px) / 750);
  line-height: 1.1;
}

.sp-badge-earned__img {
  width: calc(96 * min(100vw, 420px) / 750);
  height: calc(96 * min(100vw, 420px) / 750);
  display: block;
  margin: 0 auto;
}

.sp-badge-progress__img {
  width: calc(88 * min(100vw, 420px) / 750);
  height: calc(88 * min(100vw, 420px) / 750);
  display: block;
  margin: 0 auto;
}

.sp-badge-earned__head {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: calc(6 * min(100vw, 420px) / 750) calc(8 * min(100vw, 420px) / 750);
  margin-top: calc(8 * min(100vw, 420px) / 750);
  width: 100%;
  box-sizing: border-box;
  padding: 0 calc(4 * min(100vw, 420px) / 750);
}

.sp-badge-earned__name {
  margin-top: calc(8 * min(100vw, 420px) / 750);
  color: #F0A82E;
  font-size: calc(28 * min(100vw, 420px) / 750);
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
}

.sp-badge-rule-btn {
  flex-shrink: 0;
  color: #5BAFEA;
  font-size: calc(24 * min(100vw, 420px) / 750);
  font-weight: 600;
  line-height: 1.2;
}

.sp-badge-progress__head .sp-badge-rule-btn {
  margin-left: auto;
}

.sp-badge-earned__story {
  margin-top: calc(6 * min(100vw, 420px) / 750);
  padding: 0 calc(8 * min(100vw, 420px) / 750);
  color: #9a6b1a;
  font-size: calc(22 * min(100vw, 420px) / 750);
  line-height: 1.4;
  text-align: center;
}

.sp-badge-earned__date {
  margin-top: calc(4 * min(100vw, 420px) / 750);
  color: #c9922e;
  font-size: calc(20 * min(100vw, 420px) / 750);
}

.sp-badge-progress {
  margin-bottom: calc(16 * min(100vw, 420px) / 750);
  padding: calc(20 * min(100vw, 420px) / 750);
  border-radius: calc(16 * min(100vw, 420px) / 750);
  background: #F8FCFF;
  border: calc(1 * min(100vw, 420px) / 750) solid #E4F1FA;
}

.sp-badge-progress__head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: calc(12 * min(100vw, 420px) / 750);
  margin-bottom: calc(8 * min(100vw, 420px) / 750);
}

.sp-badge-progress__icon {
  font-size: calc(40 * min(100vw, 420px) / 750);
  line-height: 1;
}

.sp-badge-progress__name {
  color: #2F3242;
  font-size: calc(30 * min(100vw, 420px) / 750);
  font-weight: 700;
}

.sp-badge-progress__type {
  color: #6F7485;
  font-size: calc(24 * min(100vw, 420px) / 750);
}

.sp-badge-progress__text {
  margin-bottom: calc(8 * min(100vw, 420px) / 750);
  color: #4a5568;
  font-size: calc(26 * min(100vw, 420px) / 750);
  line-height: 1.5;
}

.sp-badge-progress__track {
  height: calc(12 * min(100vw, 420px) / 750);
  border-radius: calc(8 * min(100vw, 420px) / 750);
  background: #E4F1FA;
  overflow: hidden;
}

.sp-badge-progress__fill {
  height: 100%;
  background: linear-gradient(90deg, #8CCBFA, #A7DCC9);
}

.sp-badge-progress__percent {
  margin-top: calc(6 * min(100vw, 420px) / 750);
  text-align: right;
  color: #6F7485;
  font-size: calc(24 * min(100vw, 420px) / 750);
  font-weight: 600;
}

.sp-block-title {
  margin-bottom: calc(8 * min(100vw, 420px) / 750);
  color: #2F3242;
  font-size: calc(32 * min(100vw, 420px) / 750);
  font-weight: 700;
}

.sp-block-sub {
  margin-bottom: calc(16 * min(100vw, 420px) / 750);
  color: #6F7485;
  font-size: calc(24 * min(100vw, 420px) / 750);
  line-height: 1.45;
}

.sp-empty {
  padding: calc(60 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750);
  text-align: center;
  color: #6F7485;
}

.sp-empty__icon {
  font-size: calc(72 * min(100vw, 420px) / 750);
  margin-bottom: calc(12 * min(100vw, 420px) / 750);
}

.sp-empty__text {
  font-size: calc(28 * min(100vw, 420px) / 750);
  line-height: 1.5;
}

/* 答题页 */
.sp-stats-bar {
  display: flex;
  margin: 0;
  padding: calc(20 * min(100vw, 420px) / 750) calc(8 * min(100vw, 420px) / 750);
  border-radius: 0;
  background: transparent;
  border: none;
}

.sp-stat-item {
  flex: 1;
  text-align: center;
}

.sp-stat-item + .sp-stat-item {
  border-left: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.28);
}

.sp-stat-item__value {
  color: #2F3242;
  font-size: calc(40 * min(100vw, 420px) / 750);
  font-weight: 700;
  line-height: 1.2;
}

.sp-stat-item__label {
  margin-top: calc(6 * min(100vw, 420px) / 750);
  color: #6F7485;
  font-size: calc(22 * min(100vw, 420px) / 750);
}

/* 答题 Banner：widthFix 按宽铺满、高度自适应，完整显示不切边 */
.sp-banner-wrap {
  width: 100%;
  margin-bottom: calc(18 * min(100vw, 420px) / 750);
  border-radius: calc(24 * min(100vw, 420px) / 750);
  overflow: hidden;
  box-shadow: 0 calc(10 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) rgba(91, 175, 234, 0.12);
  background: linear-gradient(135deg, #eaf6ff, #d4ecff);
}

.sp-banner-wrap .sp-banner {
  display: block;
  width: 100%;
  height: auto;
  vertical-align: top;
}

.sp-glass-panel {
  padding: calc(28 * min(100vw, 420px) / 750);
  border-radius: calc(28 * min(100vw, 420px) / 750);
  background: #FFFFFF;
  border: calc(1 * min(100vw, 420px) / 750) solid #E4F1FA;
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(140, 203, 250, 0.12);
}

.sp-quiz-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: calc(12 * min(100vw, 420px) / 750);
  margin-bottom: calc(16 * min(100vw, 420px) / 750);
}

.sp-quiz-type {
  padding: calc(8 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: #EAF6FF;
  color: #5BAFEA;
  font-size: calc(28 * min(100vw, 420px) / 750);
  font-weight: 600;
}

.sp-quiz-points {
  color: #F0A82E;
  font-size: calc(26 * min(100vw, 420px) / 750);
  font-weight: 700;
}

.sp-quiz-hint {
  margin-bottom: calc(12 * min(100vw, 420px) / 750);
  color: #6F7485;
  font-size: calc(24 * min(100vw, 420px) / 750);
  line-height: 1.45;
}

.sp-question-text {
  margin-bottom: calc(20 * min(100vw, 420px) / 750);
  color: #2F3242;
  font-size: calc(36 * min(100vw, 420px) / 750);
  font-weight: 700;
  line-height: 1.5;
}

.sp-options {
  display: flex;
  flex-direction: column;
  gap: calc(12 * min(100vw, 420px) / 750);
  margin-bottom: calc(16 * min(100vw, 420px) / 750);
}

.sp-option-btn {
  padding: calc(22 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750);
  border-radius: calc(18 * min(100vw, 420px) / 750);
  background: #F8FCFF;
  border: calc(1 * min(100vw, 420px) / 750) solid #DCEEF8;
  color: #2F3242;
  font-size: calc(28 * min(100vw, 420px) / 750);
  line-height: 1.4;
}

.sp-option-btn--selected {
  background: #EAF6FF;
  border-color: #8CCBFA;
}

.sp-answer-input {
  width: 100%;
  box-sizing: border-box;
  margin-bottom: calc(16 * min(100vw, 420px) / 750);
  min-height: calc(96 * min(100vw, 420px) / 750);
  padding: calc(28 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750);
  border-radius: calc(18 * min(100vw, 420px) / 750);
  background: #F8FCFF;
  border: calc(1 * min(100vw, 420px) / 750) solid #DCEEF8;
  color: #2F3242;
  font-size: calc(30 * min(100vw, 420px) / 750);
  line-height: 1.5;
}

.sp-primary-btn {
  width: 100%;
  padding: calc(22 * min(100vw, 420px) / 750) 0;
  text-align: center;
  border-radius: calc(20 * min(100vw, 420px) / 750);
  background: linear-gradient(135deg, #5BAFEA 0%, #8CCBFA 100%);
  color: #fff;
  font-size: calc(36 * min(100vw, 420px) / 750);
  font-weight: 700;
}

.sp-primary-btn--disabled {
  opacity: 0.6;
}

.sp-result-icon {
  font-size: calc(88 * min(100vw, 420px) / 750);
  line-height: 1;
  margin-bottom: calc(12 * min(100vw, 420px) / 750);
}

.sp-result-icon-img {
  display: block;
  margin: 0 auto calc(16 * min(100vw, 420px) / 750);
}

.sp-result-icon-img--wrong {
  width: calc(138 * min(100vw, 420px) / 750);
  height: calc(138 * min(100vw, 420px) / 750);
}

.sp-result-title {
  margin-bottom: calc(12 * min(100vw, 420px) / 750);
  font-size: calc(36 * min(100vw, 420px) / 750);
  font-weight: 700;
}

.sp-result-title--correct {
  color: #8DDDBB;
}

.sp-result-title--wrong {
  color: #FF9A9A;
}

.sp-result-encourage {
  margin: -calc(2 * min(100vw, 420px) / 750) 0 calc(14 * min(100vw, 420px) / 750);
  color: #6f7485;
  font-size: calc(26 * min(100vw, 420px) / 750);
  font-weight: 600;
  line-height: 1.45;
}

.sp-result-answer,
.sp-result-explanation {
  margin-bottom: calc(10 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.9);
  font-size: calc(28 * min(100vw, 420px) / 750);
  line-height: 1.5;
}

.sp-result-boost-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin: calc(8 * min(100vw, 420px) / 750) 0 calc(18 * min(100vw, 420px) / 750);
  color: #d48b22;
  font-size: calc(48 * min(100vw, 420px) / 750);
  line-height: 1;
  text-align: center;
}

/* 学生一级子页：毛玻璃内容块（与 sp-stack-panel 一致，用于 scroll 内平铺） */
.sp-glass-surface {
  box-sizing: border-box;
  border-radius: calc(28 * min(100vw, 420px) / 750);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(140, 203, 250, 0.22);
  background: rgba(255, 255, 255, 0.75);
  box-shadow: 0 calc(10 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) rgba(91, 175, 234, 0.1);
  backdrop-filter: blur(calc(14 * min(100vw, 420px) / 750));
  -webkit-backdrop-filter: blur(calc(14 * min(100vw, 420px) / 750));
}

.sp-glass-surface--soft {
  background: rgba(248, 252, 255, 0.58);
  border-color: rgba(228, 241, 250, 0.72);
  box-shadow: 0 calc(6 * min(100vw, 420px) / 750) calc(18 * min(100vw, 420px) / 750) rgba(140, 203, 250, 0.08);
}

/* 新手手册 / 帮喂等：顶区摘要卡（标题在卡内，不再叠一层 sp-subpage-topbar） */
.sp-guide-intro {
  margin-bottom: calc(16 * min(100vw, 420px) / 750);
  padding: calc(28 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750);
  text-align: center;
}

.sp-guide-intro__logo {
  width: calc(120 * min(100vw, 420px) / 750);
  height: calc(120 * min(100vw, 420px) / 750);
  margin: 0 auto calc(12 * min(100vw, 420px) / 750);
}

.sp-guide-intro__title {
  font-size: calc(34 * min(100vw, 420px) / 750);
  font-weight: 800;
  color: #2f3242;
  line-height: 1.25;
}

.sp-guide-intro__tagline {
  margin-top: calc(8 * min(100vw, 420px) / 750);
  font-size: calc(28 * min(100vw, 420px) / 750);
  font-weight: 600;
  color: #5bafea;
  line-height: 1.35;
}

.sp-guide-intro__hint {
  margin-top: calc(8 * min(100vw, 420px) / 750);
  font-size: calc(24 * min(100vw, 420px) / 750);
  color: #6f7485;
  line-height: 1.45;
}

/* 学生一级子页（遗留独立页）：居中标题条，主壳子页请勿使用 */
.sp-subpage-topbar {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  padding: calc(12 * min(100vw, 420px) / 750) var(--st-.gr-book-gutter, calc(24 * min(100vw, 420px) / 750)) calc(8 * min(100vw, 420px) / 750);
  box-sizing: border-box;
}

.sp-subpage-topbar__title {
  width: 100%;
  text-align: center;
  font-size: calc(32 * min(100vw, 420px) / 750);
  font-weight: 700;
  color: #2f3242;
}

.sp-help-feed-banner {
  display: flex;
  align-items: center;
  gap: calc(16 * min(100vw, 420px) / 750);
  margin-bottom: calc(16 * min(100vw, 420px) / 750);
  padding: calc(22 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750);
  border-radius: calc(28 * min(100vw, 420px) / 750);
  background: linear-gradient(135deg, rgba(234, 255, 246, 0.75), rgba(234, 246, 255, 0.75));
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(167, 220, 201, 0.56);
  box-shadow: 0 calc(10 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) rgba(91, 175, 234, 0.1);
  backdrop-filter: blur(calc(14 * min(100vw, 420px) / 750));
  -webkit-backdrop-filter: blur(calc(14 * min(100vw, 420px) / 750));
  box-sizing: border-box;
}

.sp-help-feed-banner__icon {
  width: calc(56 * min(100vw, 420px) / 750);
  height: calc(56 * min(100vw, 420px) / 750);
  flex-shrink: 0;
}

.sp-help-feed-banner__body {
  flex: 1;
  min-width: 0;
}

.sp-help-feed-banner__title {
  font-size: calc(28 * min(100vw, 420px) / 750);
  font-weight: 800;
  color: #2f3242;
  line-height: 1.3;
}

.sp-help-feed-banner__desc {
  margin-top: calc(6 * min(100vw, 420px) / 750);
  font-size: calc(23 * min(100vw, 420px) / 750);
  color: #6f7485;
  line-height: 1.35;
}

.sp-classmate-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: calc(12 * min(100vw, 420px) / 750);
}

.sp-classmate-row {
  min-height: calc(88 * min(100vw, 420px) / 750);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: calc(12 * min(100vw, 420px) / 750);
  padding: calc(12 * min(100vw, 420px) / 750) calc(14 * min(100vw, 420px) / 750);
  border-radius: calc(22 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.75);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(140, 203, 250, 0.22);
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750) rgba(140, 203, 250, 0.08);
  backdrop-filter: blur(calc(14 * min(100vw, 420px) / 750));
  -webkit-backdrop-filter: blur(calc(14 * min(100vw, 420px) / 750));
  box-sizing: border-box;
}

.sp-classmate-row--disabled {
  opacity: 0.62;
}

.sp-classmate-row__body {
  flex: 1;
  min-width: 0;
}

.sp-classmate-row__name {
  font-size: calc(26 * min(100vw, 420px) / 750);
  font-weight: 800;
  color: #2f3242;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sp-classmate-row__meta {
  margin-top: calc(4 * min(100vw, 420px) / 750);
  font-size: calc(20 * min(100vw, 420px) / 750);
  color: #6f7485;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sp-classmate-row__action {
  flex-shrink: 0;
  padding: calc(8 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: linear-gradient(135deg, #5bafea, #8ccbfa);
  color: #fff;
  font-size: calc(21 * min(100vw, 420px) / 750);
  font-weight: 700;
}

.sp-classmate-row--disabled .sp-classmate-row__action {
  background: #dceef8;
  color: #9ea4b5;
}

.sp-subpage-empty {
  padding: calc(56 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750);
  border-radius: calc(28 * min(100vw, 420px) / 750);
  text-align: center;
  background: rgba(255, 255, 255, 0.75);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(140, 203, 250, 0.22);
  color: #6f7485;
  font-size: calc(26 * min(100vw, 420px) / 750);
  backdrop-filter: blur(calc(14 * min(100vw, 420px) / 750));
  -webkit-backdrop-filter: blur(calc(14 * min(100vw, 420px) / 750));
  box-sizing: border-box;
}

/* ---- report-layout-typography.wxss ---- */
/**
 * 字号 / 对齐：由场景 layoutStyle 注入 --rp-block-{id}-size / -align / -self
 * 与后台 report-layout-editor 的 blockFontStyle 一致；勿在 scene 级用 !important 盖对齐
 */
.rp-blk-tagline,
.rp-blk-badge,
.rp-blk-year,
.rp-blk-title,
.rp-blk-term,
.rp-blk-meta,
.rp-blk-greeting,
.rp-blk-story,
.rp-blk-cta,
.rp-blk-sticker,
.rp-blk-tag,
.rp-blk-stats,
.rp-blk-daySub,
.rp-blk-body,
.rp-blk-lead,
.rp-blk-tail,
.rp-blk-sub,
.rp-blk-narrativeTag,
.rp-blk-date,
.rp-blk-hook,
.rp-blk-inline,
.rp-blk-preface,
.rp-blk-tags,
.rp-blk-lines,
.rp-blk-closing,
.rp-blk-headline,
.rp-blk-summary,
.rp-blk-bridge,
.rp-blk-num,
.rp-blk-dim,
.rp-blk-proof,
.rp-blk-rank,
.rp-blk-brand,
.rp-blk-letter,
.rp-blk-shareHint,
.rp-blk-shareBtn,
.rp-blk-brandPill {
  box-sizing: border-box;
  max-width: 100%;
}

.rp-blk-tagline { font-size: var(--rp-block-tagline-size); text-align: var(--rp-block-tagline-align); align-self: var(--rp-block-tagline-self); width: 100%; }
.rp-blk-badge { font-size: var(--rp-block-badge-size); text-align: var(--rp-block-badge-align); align-self: var(--rp-block-badge-self); width: 100%; }
.rp-blk-year { font-size: var(--rp-block-year-size); text-align: var(--rp-block-year-align); align-self: var(--rp-block-year-self); width: 100%; }
.rp-blk-title { font-size: var(--rp-block-title-size); text-align: var(--rp-block-title-align); align-self: var(--rp-block-title-self); width: 100%; }
.rp-blk-term { font-size: var(--rp-block-term-size); text-align: var(--rp-block-term-align); align-self: var(--rp-block-term-self); width: 100%; }
.rp-blk-meta { font-size: var(--rp-block-meta-size); text-align: var(--rp-block-meta-align); align-self: var(--rp-block-meta-self); width: 100%; }
.rp-blk-greeting { font-size: var(--rp-block-greeting-size); text-align: var(--rp-block-greeting-align); align-self: var(--rp-block-greeting-self); width: 100%; }
.rp-blk-story { font-size: var(--rp-block-story-size); text-align: var(--rp-block-story-align); align-self: var(--rp-block-story-self); width: 100%; }
.rp-blk-cta { font-size: var(--rp-block-cta-size); text-align: var(--rp-block-cta-align); align-self: var(--rp-block-cta-self); width: 100%; }
.rp-blk-sticker { font-size: var(--rp-block-sticker-size); text-align: var(--rp-block-sticker-align); align-self: var(--rp-block-sticker-self); }
.rp-blk-tag { font-size: var(--rp-block-tag-size); text-align: var(--rp-block-tag-align); align-self: var(--rp-block-tag-self); width: 100%; }
.rp-blk-stats { text-align: var(--rp-block-stats-align, left); align-self: var(--rp-block-stats-self, flex-start); }
.rp-scene--universe_intro .rp-uni__days-num.rp-blk-stats {
  width: auto;
  max-width: 100%;
}
.rp-blk-daySub { font-size: var(--rp-block-daySub-size); text-align: var(--rp-block-daySub-align); align-self: var(--rp-block-daySub-self); }
.rp-blk-body { font-size: var(--rp-block-body-size); text-align: var(--rp-block-body-align); align-self: var(--rp-block-body-self); width: 100%; }
.rp-blk-lead { font-size: var(--rp-block-lead-size); text-align: var(--rp-block-lead-align); align-self: var(--rp-block-lead-self); width: 100%; }
.rp-blk-tail { font-size: var(--rp-block-tail-size); text-align: var(--rp-block-tail-align); align-self: var(--rp-block-tail-self); max-width: 100%; box-sizing: border-box; }
.rp-firsts-tail.rp-blk-tail { width: calc(100% - var(--rp-gutter-lg) * 2); max-width: calc(100% - var(--rp-gutter-lg) * 2); }
.rp-blk-sub { font-size: var(--rp-block-sub-size); text-align: var(--rp-block-sub-align); align-self: var(--rp-block-sub-self); width: 100%; }
.rp-blk-narrativeTag { font-size: var(--rp-block-narrativeTag-size); text-align: var(--rp-block-narrativeTag-align); align-self: var(--rp-block-narrativeTag-self); width: 100%; }
.rp-blk-date { font-size: var(--rp-block-date-size); text-align: var(--rp-block-date-align); align-self: var(--rp-block-date-self); }
.rp-blk-hook { font-size: var(--rp-block-hook-size); text-align: var(--rp-block-hook-align); align-self: var(--rp-block-hook-self); width: 100%; }
.rp-blk-inline { text-align: var(--rp-block-inline-align, center); align-self: var(--rp-block-inline-self, center); width: 100%; max-width: 100%; box-sizing: border-box; }
.rp-blk-preface { font-size: var(--rp-block-preface-size); text-align: var(--rp-block-preface-align); align-self: var(--rp-block-preface-self); width: 100%; }
.rp-blk-tags { font-size: var(--rp-block-tags-size); text-align: var(--rp-block-tags-align); align-self: var(--rp-block-tags-self); width: 100%; }
.rp-blk-lines { font-size: var(--rp-block-lines-size); text-align: var(--rp-block-lines-align); align-self: var(--rp-block-lines-self); width: 100%; }
.rp-blk-closing { font-size: var(--rp-block-closing-size); text-align: var(--rp-block-closing-align); align-self: var(--rp-block-closing-self); width: 100%; }
.rp-blk-headline { font-size: var(--rp-block-headline-size); text-align: var(--rp-block-headline-align); align-self: var(--rp-block-headline-self); width: 100%; }
.rp-blk-summary { font-size: var(--rp-block-summary-size); text-align: var(--rp-block-summary-align); align-self: var(--rp-block-summary-self); width: 100%; }
.rp-blk-bridge { font-size: var(--rp-block-bridge-size); text-align: var(--rp-block-bridge-align); align-self: var(--rp-block-bridge-self); width: 100%; }
.rp-blk-num { font-size: var(--rp-block-num-size); text-align: var(--rp-block-num-align); align-self: var(--rp-block-num-self); width: 100%; }
.rp-blk-dim { font-size: var(--rp-block-dim-size); text-align: var(--rp-block-dim-align); align-self: var(--rp-block-dim-self); width: 100%; }
.rp-blk-proof { font-size: var(--rp-block-proof-size); text-align: var(--rp-block-proof-align); align-self: var(--rp-block-proof-self); width: 100%; }
.rp-blk-rank { font-size: var(--rp-block-rank-size); text-align: var(--rp-block-rank-align); align-self: var(--rp-block-rank-self); width: 100%; }
.rp-blk-brand { font-size: var(--rp-block-brand-size); text-align: var(--rp-block-brand-align); align-self: var(--rp-block-brand-self); width: 100%; }
.rp-blk-letter { font-size: var(--rp-block-letter-size); text-align: var(--rp-block-letter-align); align-self: var(--rp-block-letter-self); width: 100%; }
.rp-blk-shareHint { font-size: var(--rp-block-shareHint-size); text-align: var(--rp-block-shareHint-align); align-self: var(--rp-block-shareHint-self); width: 100%; }
.rp-blk-shareBtn { font-size: var(--rp-block-shareBtn-size); text-align: var(--rp-block-shareBtn-align); align-self: var(--rp-block-shareBtn-self); width: 100%; }
.rp-blk-brandPill { font-size: var(--rp-block-brandPill-size); text-align: var(--rp-block-brandPill-align); align-self: var(--rp-block-brandPill-self); }

/* ---- report-universe-intro.wxss ---- */
/**
 * 宇宙引言 · 报告第二页（rp-uni）
 * 结构见 report.wxml；字号/对齐走 blockInlineStyles + rp-blk-*
 */

.rp-scene--universe_intro .rp-deco {
  opacity: 0.48;
}

.rp-scene--universe_intro .rp-orbit-path {
  border-color: rgba(255, 255, 255, 0.18);
}

.rp-scene--universe_intro .rp-poster.rp-uni {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  text-align: left;
  gap: 0;
  min-height: 0;
  flex: 1;
}

.rp-scene--universe_intro .rp-uni__copy {
  position: relative;
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-shrink: 0;
  align-self: stretch;
  width: auto;
  max-width: calc(100% - var(--rp-gutter-lg) * 2);
  margin-left: var(--rp-gutter-lg) !important;
  margin-right: var(--rp-gutter-lg) !important;
  padding: 0 calc(28 * min(100vw, 420px) / 750);
  box-sizing: border-box;
  overflow: hidden;
  background: transparent;
  border: none;
  box-shadow: none;
}

/* Promo recording fine tune: from the 3rd page onward, lift the text/content area slightly. */
html.gr-promo-record .gr-slide:nth-child(n+3) .rp-poster {
  transform: translateY(-15px);
}

.rp-scene--universe_intro .rp-uni__copy > .rp-blk-sticker,
.rp-scene--universe_intro .rp-uni__copy > .rp-blk-tag,
.rp-scene--universe_intro .rp-uni__copy > .rp-uni__days,
.rp-scene--universe_intro .rp-uni__copy > .rp-blk-daySub,
.rp-scene--universe_intro .rp-uni__copy > .rp-blk-title,
.rp-scene--universe_intro .rp-uni__copy > .rp-blk-body {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  text-align: left;
  align-self: flex-start;
}

.rp-scene--universe_intro .rp-uni__sticker {
  display: block;
  margin: 0 0 calc(8 * min(100vw, 420px) / 750);
  padding: 0;
  color: #fff;
  font-weight: 600;
  letter-spacing: calc(1 * min(100vw, 420px) / 750);
  line-height: 1.25;
  opacity: 0.92;
  background: transparent;
  border: none;
  box-shadow: none;
  transform: none;
}

.rp-scene--universe_intro .rp-uni__tag {
  display: block;
  margin: 0 0 calc(6 * min(100vw, 420px) / 750);
  padding: 0;
  color: rgba(255, 255, 255, 0.8);
  font-weight: 500;
  letter-spacing: calc(1 * min(100vw, 420px) / 750);
  line-height: 1.4;
  white-space: pre-line;
}

.rp-scene--universe_intro .rp-uni__days {
  position: relative;
  width: 100%;
  min-height: calc(180 * min(100vw, 420px) / 750);
  margin: calc(8 * min(100vw, 420px) / 750) 0 calc(4 * min(100vw, 420px) / 750);
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
}

.rp-scene--universe_intro .rp-uni__days-glow {
  position: absolute;
  left: 0;
  bottom: 0;
  width: calc(240 * min(100vw, 420px) / 750);
  height: 70%;
  transform: none;
  border-radius: 50%;
  background: radial-gradient(ellipse at 30% 85%, rgba(56, 189, 248, 0.28) 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
}

.rp-scene--universe_intro .rp-uni__days-row {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: flex-start;
  flex-wrap: nowrap;
  max-width: 100%;
}

/* 天数：字号仅由内联 style / statsSizeRpx 控制（与尾页年份同机制） */
.rp-scene--universe_intro .rp-uni__days-num.rp-blk-stats {
  display: inline-block;
  width: auto !important;
  max-width: 100%;
  vertical-align: bottom;
  line-height: 0.92;
  text-align: left;
  align-self: auto;
  font-family: 'MontserratExtraBold', 'DIN Alternate', 'Helvetica Neue', Arial, sans-serif;
  font-weight: normal;
  letter-spacing: -calc(2 * min(100vw, 420px) / 750);
  color: #f0f9ff;
  text-shadow:
    0 calc(12 * min(100vw, 420px) / 750) calc(36 * min(100vw, 420px) / 750) rgba(56, 189, 248, 0.45),
    0 0 calc(48 * min(100vw, 420px) / 750) rgba(125, 211, 252, 0.32);
  font-variant-numeric: tabular-nums;
}

.rp-scene--universe_intro .rp-uni__days-unit {
  flex-shrink: 0;
  margin-left: calc(10 * min(100vw, 420px) / 750);
  margin-bottom: 0.14em;
  font-size: calc(32 * min(100vw, 420px) / 750);
  font-weight: 600;
  line-height: 1;
  color: rgba(255, 255, 255, 0.58);
  letter-spacing: calc(2 * min(100vw, 420px) / 750);
  text-shadow: 0 calc(10 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) rgba(38, 18, 105, 0.24);
}

.rp-scene--universe_intro .rp-uni__pill {
  display: inline-block;
  width: auto;
  max-width: 100%;
  margin: calc(6 * min(100vw, 420px) / 750) 0 calc(10 * min(100vw, 420px) / 750);
  padding: calc(8 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  line-height: 1.35;
  color: #fff;
  white-space: pre-line;
  background: rgba(255, 255, 255, 0.14);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.22);
  box-shadow: none;
}

.rp-scene--universe_intro .rp-uni__title {
  display: block;
  margin: calc(4 * min(100vw, 420px) / 750) 0 0;
  padding: 0 calc(4 * min(100vw, 420px) / 750);
  color: #fff;
  -webkit-text-fill-color: #fff;
  background: none;
  font-weight: normal;
  line-height: 1.18;
  letter-spacing: calc(1 * min(100vw, 420px) / 750);
  white-space: pre-line;
  word-break: break-word;
  overflow-wrap: break-word;
  text-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(38, 18, 105, 0.2);
  -webkit-text-stroke: 0;
}

.rp-scene--universe_intro .rp-uni__body {
  display: block;
  margin-top: calc(16 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.94);
  line-height: 1.72;
  white-space: pre-line;
  word-break: break-word;
  overflow-wrap: break-word;
}

.rp-scene--universe_intro .rp-uni__stage {
  position: relative;
  z-index: 2;
  flex: 1;
  min-height: calc(280 * min(100vw, 420px) / 750);
  margin-top: auto;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  background: transparent !important;
}

.rp-scene--universe_intro .rp-uni__mascot {
  width: calc(420 * min(100vw, 420px) / 750);
  height: calc(420 * min(100vw, 420px) / 750);
  max-width: 88vw;
}

.rp-scene--universe_intro .rp-uni__buddy {
  position: absolute;
  right: 12%;
  bottom: 18%;
  font-size: calc(48 * min(100vw, 420px) / 750);
  line-height: 1;
  opacity: 0.85;
  text-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750) rgba(38, 18, 105, 0.25);
  pointer-events: none;
}

@media (max-height: 700px) {
  .rp-scene--universe_intro .rp-uni__days {
    min-height: calc(140 * min(100vw, 420px) / 750);
  }

  .rp-scene--universe_intro .rp-uni__mascot {
    width: calc(340 * min(100vw, 420px) / 750);
    height: calc(340 * min(100vw, 420px) / 750);
  }
}

/* ---- report-shell.wxss ---- */
/* Classyoo · 马卡龙黏土插画风设计令牌 */
.gr-book {
  height: 100%;
  overflow: hidden;
  background: #e0f2fe;
  --rp-blue: #4bafff;
  --rp-green: #34d399;
  --rp-sun: #ffb84d;
  --rp-pink: #f9a8d4;
  --rp-violet: #c4b5fd;
  --rp-ink: #1e3a5f;
  --rp-clay-shadow: 0 calc(12 * min(100vw, 420px) / 750) 0 rgba(30, 58, 95, 0.06), 0 calc(24 * min(100vw, 420px) / 750) calc(48 * min(100vw, 420px) / 750) rgba(75, 175, 255, 0.18);
  --rp-card: rgba(255, 255, 255, 0.92);
}

.rp-book {
  position: relative;
  width: 100%;
  max-width: calc(750 * min(100vw, 420px) / 750);
  margin: 0 auto;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
  background: #e0f2fe;
  font-family: 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
}

/* 品牌字体：各页主标题统一特黑体 tehei.ttf · 年份/天数用 Montserrat（见 utils/reportFonts.js） */
.rp-font-tehei,
.rp-title-round.rp-font-tehei,
.rp-cover__title.rp-font-tehei,
.rp-finale-title.rp-font-tehei,
.rp-poster__title,
.rp-poster__title--dark,
.rp-poster__persona-title,
.rp-poster__end-title,
.rp-first-card__title,
.rp-glass__title,
.rp-glass__title--lg,
.rp-end-card__title,
.rp-persona-you.rp-font-tehei {
  font-family: 'ReportTeHei', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
  font-weight: normal;
  font-synthesis: none;
  -webkit-text-stroke: 0;
  text-stroke: 0;
}

.rp-cover__year,
.rp-end-year,
.rp-poster__end-year {
  font-family: 'MontserratExtraBold', 'DIN Alternate', 'Helvetica Neue', 'Arial', sans-serif;
  font-weight: normal;
  letter-spacing: 0;
}

/* —— 场景底：每页独立马卡龙渐变（inline style） —— */
.rp-scene {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  opacity: 0.88;
  transform: scale(0.985);
  transition: opacity 0.42s ease, transform 0.42s ease;
  --rp-book-text-align: center;
  --rp-.gr-book-text-align: center;
}

.rp-.gr-book,
.rp-poster {
  text-align: var(--rp-.gr-book-text-align, center);
}

.rp-page,
.rp-poster {
  text-align: var(--rp-book-text-align, center);
}

.rp-page {
  position: relative;
  z-index: 3;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding:
    calc(env(safe-area-inset-top, 0px) + 44 * min(100vw, 420px) / 750)
    calc(42 * min(100vw, 420px) / 750)
    calc(env(safe-area-inset-bottom, 0px) + 42 * min(100vw, 420px) / 750);
}

.rp-page--cover {
  justify-content: space-between;
}

.rp-cover__quote,
.rp-cover__badge,
.rp-cover__title,
.rp-cover__term,
.rp-cover__meta,
.rp-cover__greeting,
.rp-title-round,
.rp-sticker,
.rp-poster__title,
.rp-poster__line,
.rp-poster__lead,
.rp-poster__tail,
.rp-hint-whisper,
.rp-clay-card__line,
.rp-first-card__line {
  text-align: inherit;
  word-break: break-word;
  overflow-wrap: break-word;
}

/* Main theme titles should follow the page layout alignment instead of inheriting a centered card. */
.rp-title-round.rp-blk-title,
.rp-cover__title.rp-blk-title {
  text-align: var(--rp-block-title-align, inherit);
  align-self: var(--rp-block-title-self, auto);
}

.rp-title-round.rp-blk-headline {
  text-align: var(--rp-block-headline-align, inherit);
  align-self: var(--rp-block-headline-self, auto);
}

/* Promo video: the second report cover should not show the down arrow CTA or its label. */
html.gr-promo-record .rp-scene--cover .rp-cover__cta {
  display: none !important;
}

/* 录屏/手机端：雷达画像页本身不要抢纵向触摸滚动，统一交给外层整页翻页。 */
html.gr-promo-record .rp-poster--radar-mech {
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: auto !important;
  overscroll-behavior: none;
  touch-action: pan-y;
}

.rp-scene--in {
  opacity: 1;
  transform: scale(1);
}

.rp-scene--cover {
  background: linear-gradient(165deg, #7dd3fc 0%, #6ee7b7 42%, #fde68a 88%, #fbcfe8 100%);
}

.rp-stars {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    radial-gradient(calc(2 * min(100vw, 420px) / 750) calc(2 * min(100vw, 420px) / 750) at 20% 30%, rgba(255, 255, 255, 0.9), transparent),
    radial-gradient(calc(1 * min(100vw, 420px) / 750) calc(1 * min(100vw, 420px) / 750) at 60% 20%, rgba(255, 255, 255, 0.7), transparent),
    radial-gradient(calc(2 * min(100vw, 420px) / 750) calc(2 * min(100vw, 420px) / 750) at 80% 60%, rgba(255, 255, 255, 0.8), transparent),
    radial-gradient(calc(1 * min(100vw, 420px) / 750) calc(1 * min(100vw, 420px) / 750) at 35% 75%, rgba(255, 255, 255, 0.6), transparent),
    radial-gradient(calc(2 * min(100vw, 420px) / 750) calc(2 * min(100vw, 420px) / 750) at 90% 85%, rgba(255, 255, 255, 0.75), transparent),
    radial-gradient(calc(1 * min(100vw, 420px) / 750) calc(1 * min(100vw, 420px) / 750) at 10% 55%, rgba(255, 255, 255, 0.5), transparent);
  background-size: 100% 100%;
  animation: rpTwinkle 4s ease-in-out infinite;
}

.rp-nebula {
  position: absolute;
  width: 120%;
  height: 50%;
  left: -10%;
  top: 10%;
  pointer-events: none;
  background: radial-gradient(ellipse at 50% 50%, rgba(157, 78, 221, 0.42) 0%, transparent 68%);
  filter: blur(calc(12 * min(100vw, 420px) / 750));
}

.rp-nebula--blue {
  top: auto;
  bottom: 0;
  height: 45%;
  background: radial-gradient(ellipse at 50% 80%, rgba(75, 175, 255, 0.38) 0%, transparent 70%);
}

.rp-sparkle {
  position: absolute;
  z-index: 2;
  font-size: calc(28 * min(100vw, 420px) / 750);
  color: var(--rp-gold);
  text-shadow: 0 0 calc(16 * min(100vw, 420px) / 750) rgba(255, 215, 0, 0.9);
  pointer-events: none;
  animation: rpSparkle 2.4s ease-in-out infinite;
}

.rp-sparkle--1 {
  top: 18%;
  left: 12%;
}

.rp-sparkle--2 {
  top: 32%;
  right: 14%;
  animation-delay: 0.6s;
}

.rp-sparkle--3 {
  bottom: 28%;
  left: 20%;
  animation-delay: 1.2s;
}

.rp-sparkle--4 {
  bottom: 18%;
  right: 18%;
  animation-delay: 0.3s;
}

@keyframes rpSparkle {
  0%,
  100% {
    opacity: 0.35;
    transform: scale(0.85) rotate(0deg);
  }
  50% {
    opacity: 1;
    transform: scale(1.15) rotate(12deg);
  }
}

.rp-orbit {
  position: absolute;
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

.rp-orbit--1 {
  width: calc(520 * min(100vw, 420px) / 750);
  height: calc(520 * min(100vw, 420px) / 750);
  right: -calc(180 * min(100vw, 420px) / 750);
  bottom: calc(80 * min(100vw, 420px) / 750);
  animation: rpSpin 28s linear infinite;
}

.rp-orbit--2 {
  width: calc(360 * min(100vw, 420px) / 750);
  height: calc(360 * min(100vw, 420px) / 750);
  left: -calc(100 * min(100vw, 420px) / 750);
  top: calc(120 * min(100vw, 420px) / 750);
  animation: rpSpin 20s linear infinite reverse;
}

@keyframes rpTwinkle {
  0%,
  100% {
    opacity: 0.7;
  }
  50% {
    opacity: 1;
  }
}

@keyframes rpSpin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* —— 顶栏 —— */
.rp-topbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 40;
  display: flex;
  align-items: center;
  padding: calc(env(safe-area-inset-top) + calc(8 * min(100vw, 420px) / 750)) calc(24 * min(100vw, 420px) / 750) calc(8 * min(100vw, 420px) / 750);
  background: transparent;
  border: none;
  box-shadow: none;
}

.rp-topbar__back {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  height: calc(56 * min(100vw, 420px) / 750);
  min-width: calc(100 * min(100vw, 420px) / 750);
  padding: 0 calc(24 * min(100vw, 420px) / 750);
  line-height: 1;
  border-radius: calc(999 * min(100vw, 420px) / 750);
  font-size: calc(26 * min(100vw, 420px) / 750);
  font-weight: 600;
  color: #fff;
  background: rgba(255, 255, 255, 0.18);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.28);
}

.rp-topbar__center {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-left: calc(16 * min(100vw, 420px) / 750);
}

.rp-topbar__brand {
  font-size: calc(22 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.65);
  letter-spacing: calc(4 * min(100vw, 420px) / 750);
}

.rp-topbar__progress {
  font-size: calc(26 * min(100vw, 420px) / 750);
  font-weight: 700;
  color: var(--rp-gold);
  margin-top: calc(4 * min(100vw, 420px) / 750);
  text-shadow: 0 0 calc(12 * min(100vw, 420px) / 750) rgba(255, 215, 0, 0.6);
}

.rp-topbar__spacer {
  flex: 1;
}

.rp-bgm-btn {
  flex-shrink: 0;
  width: calc(68 * min(100vw, 420px) / 750);
  height: calc(68 * min(100vw, 420px) / 750);
  margin-right: calc(8 * min(100vw, 420px) / 750);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.14);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.28);
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.2);
}

.rp-bgm-btn--off {
  opacity: 0.75;
}

.rp-bgm-btn__icon {
  font-size: calc(34 * min(100vw, 420px) / 750);
  line-height: 1;
}

.rp-topbar__safe {
  width: calc(172 * min(100vw, 420px) / 750);
  flex-shrink: 0;
}

.rp-topbar__share {
  margin: 0;
  min-width: calc(168 * min(100vw, 420px) / 750);
  height: calc(64 * min(100vw, 420px) / 750);
  line-height: calc(64 * min(100vw, 420px) / 750);
  padding: 0 calc(20 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  font-size: calc(24 * min(100vw, 420px) / 750);
  font-weight: 800;
  color: #0f172a;
  background: linear-gradient(135deg, #fde68a, #fbbf24);
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) 0 rgba(180, 83, 9, 0.12);
}

.rp-topbar__share::after {
  border: none;
}

/* —— 状态 —— */
.rp-state {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: calc(120 * min(100vw, 420px) / 750) calc(48 * min(100vw, 420px) / 750);
}

.rp-state__icon {
  font-size: calc(72 * min(100vw, 420px) / 750);
  margin-bottom: calc(20 * min(100vw, 420px) / 750);
}

.rp-state__text {
  color: rgba(255, 255, 255, 0.92);
  font-size: calc(28 * min(100vw, 420px) / 750);
  text-align: center;
}

.rp-btn {
  margin-top: calc(32 * min(100vw, 420px) / 750);
  padding: 0 calc(48 * min(100vw, 420px) / 750);
  height: calc(72 * min(100vw, 420px) / 750);
  line-height: calc(72 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  font-size: calc(28 * min(100vw, 420px) / 750);
  color: #3d1f7a;
  font-weight: 700;
  background: linear-gradient(135deg, #ffe566, var(--rp-gold));
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.5);
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) rgba(255, 215, 0, 0.45);
}

.rp-btn::after {
  border: none;
}

.rp-swiper {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100vh;
  height: 100dvh;
}

.rp-swiper swiper-item {
  height: 100%;
}

/* 平台排版：颜色走 CSS 变量；字号仅由各元素 style 内联（pg.blockInlineStyles）控制，勿写共用 font-size */
.rp-scene .rp-title-round,
.rp-scene .rp-cover__title {
  color: var(--rp-.gr-book-title-color, inherit);
}

.rp-scene .rp-cover__year,
.rp-scene .rp-end-year {
  color: var(--rp-.gr-book-year-color, inherit);
}

.rp-scene--stats .rp-num-hero__val,
.rp-scene--stats .rp-stat-ticker__val {
  color: var(--rp-.gr-book-year-color, inherit);
}

.rp-scene .rp-cover__greeting,
.rp-scene .rp-cover__story,
.rp-scene .rp-cover__meta,
.rp-scene .rp-cover__term,
.rp-scene .rp-clay-card__line,
.rp-scene .rp-clay-card__story,
.rp-scene .rp-poster__lead,
.rp-scene .rp-poster__tail,
.rp-scene .rp-memory__line,
.rp-scene .rp-bridge-whisper,
.rp-scene .rp-milestone__line,
.rp-scene .rp-persona__closing,
.rp-scene .rp-letter-p,
.rp-scene .rp-end-sub {
  color: var(--rp-.gr-book-body-color, inherit);
}

.rp-scene .rp-cover__quote,
.rp-scene .rp-sticker,
.rp-scene .rp-clay-card__tag,
.rp-scene .rp-tag-pill,
.rp-scene .rp-whisper,
.rp-scene .rp-bridge-hint,
.rp-scene .rp-radar-bridge,
.rp-scene .rp-flip-hint {
  color: var(--rp-.gr-book-whisper-color, var(--rp-whisper-color, rgba(255, 255, 255, 0.82)));
}

.rp-.gr-book {
  position: relative;
  z-index: 3;
  box-sizing: border-box;
  height: 100%;
  padding: calc(env(safe-area-inset-top) + calc(88 * min(100vw, 420px) / 750)) calc(32 * min(100vw, 420px) / 750) calc(env(safe-area-inset-bottom) + calc(72 * min(100vw, 420px) / 750));
  display: flex;
  flex-direction: column;
}

.rp-.gr-book--stack {
  justify-content: flex-start;
  gap: calc(20 * min(100vw, 420px) / 750);
}

/* —— 竖屏 9:16：上 55% 叙事 / 下 45% 插画（银行年报 + 宇宙参考） —— */
.rp-.gr-book--portrait {
  padding: calc(env(safe-area-inset-top) + calc(80 * min(100vw, 420px) / 750)) 0 calc(env(safe-area-inset-bottom) + calc(56 * min(100vw, 420px) / 750));
  display: flex;
  flex-direction: column;
  height: 100%;
  box-sizing: border-box;
}

.rp-portrait__upper {
  flex: 0 0 52%;
  max-height: 52%;
  box-sizing: border-box;
  padding: 0 calc(36 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  overflow: hidden;
}

.rp-portrait__lower {
  flex: 1;
  min-height: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  padding-bottom: calc(24 * min(100vw, 420px) / 750);
}

.rp-portrait__lower--arc::before,
.rp-portrait__lower--accent-cyan::before,
.rp-portrait__lower--accent-pink::before,
.rp-portrait__lower--accent-gold::before,
.rp-portrait__lower--accent-mint::before,
.rp-portrait__lower--accent-violet::before {
  display: none;
  content: none;
}

.rp-portrait__lower--accent-cyan {
  background: linear-gradient(180deg, rgba(103, 232, 249, 0.12) 0%, rgba(45, 27, 105, 0.4) 100%);
}

.rp-portrait__lower--accent-pink {
  background: linear-gradient(180deg, rgba(249, 168, 212, 0.14) 0%, rgba(45, 27, 105, 0.4) 100%);
}

.rp-portrait__lower--accent-gold {
  background: linear-gradient(180deg, rgba(253, 224, 71, 0.12) 0%, rgba(45, 27, 105, 0.4) 100%);
}

.rp-portrait__lower--accent-mint {
  background: linear-gradient(180deg, rgba(134, 239, 172, 0.12) 0%, rgba(45, 27, 105, 0.4) 100%);
}

.rp-portrait__lower--accent-violet {
  background: linear-gradient(180deg, rgba(196, 181, 253, 0.14) 0%, rgba(45, 27, 105, 0.4) 100%);
}

.rp-portrait__lower--mini {
  min-height: calc(160 * min(100vw, 420px) / 750);
  flex: 0;
  padding-bottom: calc(8 * min(100vw, 420px) / 750);
}

.rp-glass__title--lg {
  font-size: calc(48 * min(100vw, 420px) / 750);
}

.rp-metric-inline {
  margin-top: auto;
  padding-top: calc(20 * min(100vw, 420px) / 750);
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: calc(8 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750);
}

.rp-metric-inline__num {
  font-size: calc(72 * min(100vw, 420px) / 750);
  font-weight: 900;
  color: var(--rp-sky);
  line-height: 1;
  text-shadow: var(--rp-neon);
}

.rp-metric-inline__unit {
  font-size: calc(28 * min(100vw, 420px) / 750);
  font-weight: 700;
  color: #fff;
}

.rp-metric-inline__hint {
  width: 100%;
  font-size: calc(24 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.65);
}

.rp-hero--stage {
  position: relative;
  z-index: 2;
  font-size: calc(88 * min(100vw, 420px) / 750);
  animation: rpFloat 3s ease-in-out infinite;
}

.rp-hero--stage-xl {
  position: relative;
  z-index: 2;
  font-size: calc(132 * min(100vw, 420px) / 750);
  line-height: 1;
  animation: rpFloat 3s ease-in-out infinite;
}

.rp-hero--orbit {
  position: absolute;
  right: calc(56 * min(100vw, 420px) / 750);
  top: calc(24 * min(100vw, 420px) / 750);
  font-size: calc(56 * min(100vw, 420px) / 750);
  opacity: 0.85;
  animation: rpFloat 3.5s ease-in-out infinite;
}

.rp-hero--buddy {
  position: relative;
  z-index: 1;
  margin-top: calc(8 * min(100vw, 420px) / 750);
  font-size: calc(52 * min(100vw, 420px) / 750);
  opacity: 0.9;
}

/* —— 课思悠班级神兽 kl.png（与小程序 mode=aspectFit 一致，禁止拉伸） —— */
.rp-mascot,
.rp-uni__mascot {
  display: block;
  position: relative;
  z-index: 2;
  filter: none;
  -webkit-filter: none;
  object-fit: contain;
  object-position: center bottom;
  flex-shrink: 0;
}

.rp-mascot--float {
  animation: rpFloat 3s ease-in-out infinite;
}

.rp-mascot--cover {
  width: calc(420 * min(100vw, 420px) / 750);
  height: calc(420 * min(100vw, 420px) / 750);
  margin: 0 auto;
}

.rp-mascot--stage {
  width: calc(360 * min(100vw, 420px) / 750);
  height: calc(360 * min(100vw, 420px) / 750);
  margin: 0 auto;
}

.rp-mascot--persona {
  width: calc(400 * min(100vw, 420px) / 750);
  height: calc(400 * min(100vw, 420px) / 750);
  margin: 0 auto;
}

.rp-mascot--buddy {
  width: calc(200 * min(100vw, 420px) / 750);
  height: calc(200 * min(100vw, 420px) / 750);
  margin: -calc(24 * min(100vw, 420px) / 750) auto 0;
  opacity: 0.95;
}

.rp-mascot--mini {
  width: calc(160 * min(100vw, 420px) / 750);
  height: calc(160 * min(100vw, 420px) / 750);
  margin: 0 auto;
}

.rp-mascot--comment {
  width: calc(280 * min(100vw, 420px) / 750);
  height: calc(280 * min(100vw, 420px) / 750);
}

.rp-mascot--end {
  width: calc(320 * min(100vw, 420px) / 750);
  height: calc(320 * min(100vw, 420px) / 750);
  margin: 0 auto;
}

.rp-event-emoji {
  position: relative;
  z-index: 3;
  line-height: 1;
  filter: drop-shadow(0 calc(8 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750) rgba(0, 0, 0, 0.25));
}

.rp-event-emoji--main {
  font-size: calc(120 * min(100vw, 420px) / 750);
  animation: rpFloat 3s ease-in-out infinite;
}

.rp-event-emoji--orbit {
  position: absolute;
  right: calc(48 * min(100vw, 420px) / 750);
  top: calc(16 * min(100vw, 420px) / 750);
  z-index: 4;
  font-size: calc(64 * min(100vw, 420px) / 750);
  animation: rpFloat 3.5s ease-in-out infinite;
}

/* —— 封面（网易云仪式感 + 星球） —— */
.rp-.gr-book--cover {
  justify-content: space-between;
}

.rp-cover__quote {
  color: rgba(255, 255, 255, 0.92);
  letter-spacing: calc(6 * min(100vw, 420px) / 750);
  line-height: 1.6;
  max-width: 80%;
}

.rp-cover__badge {
  margin-top: calc(16 * min(100vw, 420px) / 750);
  display: inline-block;
  padding: calc(8 * min(100vw, 420px) / 750) calc(22 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  font-size: calc(22 * min(100vw, 420px) / 750);
  font-weight: 700;
  color: #3d1f7a;
  letter-spacing: calc(2 * min(100vw, 420px) / 750);
  background: linear-gradient(135deg, #ffe566, var(--rp-gold));
  box-shadow: 0 calc(4 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750) rgba(255, 215, 0, 0.45);
}

.rp-cover__main {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding-bottom: calc(24 * min(100vw, 420px) / 750);
}

.rp-cover__year {
  font-weight: 900;
  line-height: 0.95;
  color: rgba(255, 255, 255, 0.14);
  letter-spacing: -calc(6 * min(100vw, 420px) / 750);
}

.rp-cover__title {
  margin-top: -calc(20 * min(100vw, 420px) / 750);
  font-weight: 800;
  color: #fff;
  letter-spacing: calc(8 * min(100vw, 420px) / 750);
}

.rp-neon-title {
  color: #fff;
  font-weight: 800;
  text-shadow: var(--rp-neon);
}

.rp-cover__term {
  margin-top: calc(16 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.78);
}

.rp-cover__meta {
  margin-top: calc(12 * min(100vw, 420px) / 750);
  font-weight: 600;
  color: var(--rp-gold);
  text-shadow: 0 0 calc(16 * min(100vw, 420px) / 750) rgba(255, 215, 0, 0.5);
}

.rp-cover__stage {
  position: relative;
  height: calc(280 * min(100vw, 420px) / 750);
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

.rp-cover__cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-right: 0;
}

.rp-planet {
  position: absolute;
  bottom: 0;
  width: calc(280 * min(100vw, 420px) / 750);
  height: calc(120 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: linear-gradient(180deg, #9d4edd 0%, #4bafff 45%, #3d1f7a 100%);
  box-shadow:
    0 -calc(8 * min(100vw, 420px) / 750) calc(40 * min(100vw, 420px) / 750) rgba(157, 78, 221, 0.5),
    0 0 calc(48 * min(100vw, 420px) / 750) rgba(75, 175, 255, 0.35),
    inset 0 calc(12 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(255, 255, 255, 0.2);
}

.rp-planet--small {
  width: calc(200 * min(100vw, 420px) / 750);
  height: calc(88 * min(100vw, 420px) / 750);
}

.rp-start-btn {
  width: calc(108 * min(100vw, 420px) / 750);
  height: calc(108 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: linear-gradient(145deg, #fff4b0, var(--rp-gold));
  border: calc(2 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.65);
  box-shadow:
    0 calc(12 * min(100vw, 420px) / 750) calc(36 * min(100vw, 420px) / 750) rgba(255, 215, 0, 0.55),
    0 0 calc(32 * min(100vw, 420px) / 750) rgba(157, 78, 221, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  animation: rpPulse 2s ease-in-out infinite;
}

.rp-start-btn__arrow {
  font-size: calc(44 * min(100vw, 420px) / 750);
  color: #5b2da3;
  font-weight: 700;
}

.rp-start-label {
  margin-top: calc(12 * min(100vw, 420px) / 750);
  font-size: calc(24 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.9);
  letter-spacing: calc(4 * min(100vw, 420px) / 750);
}

@keyframes rpPulse {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.06);
  }
}

/* —— 玻璃卡片 —— */
.rp-glass {
  padding: calc(28 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750);
  border-radius: calc(28 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.1);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.2);
  box-shadow: 0 calc(16 * min(100vw, 420px) / 750) calc(48 * min(100vw, 420px) / 750) rgba(0, 0, 0, 0.25);
}

.rp-glass--accent-cyan {
  border-color: rgba(103, 232, 249, 0.45);
  box-shadow: 0 0 calc(40 * min(100vw, 420px) / 750) rgba(103, 232, 249, 0.15);
}

.rp-glass--accent-pink {
  border-color: rgba(249, 168, 212, 0.45);
  box-shadow: 0 0 calc(40 * min(100vw, 420px) / 750) rgba(249, 168, 212, 0.15);
}

.rp-glass--accent-gold {
  border-color: rgba(253, 224, 71, 0.45);
  box-shadow: 0 0 calc(40 * min(100vw, 420px) / 750) rgba(253, 224, 71, 0.12);
}

.rp-glass--accent-mint {
  border-color: rgba(134, 239, 172, 0.45);
  box-shadow: 0 0 calc(40 * min(100vw, 420px) / 750) rgba(134, 239, 172, 0.12);
}

.rp-glass--accent-violet {
  border-color: rgba(196, 181, 253, 0.45);
  box-shadow: 0 0 calc(40 * min(100vw, 420px) / 750) rgba(196, 181, 253, 0.15);
}

.rp-glass--persona {
  position: relative;
  border-color: rgba(255, 215, 0, 0.45);
  background: linear-gradient(135deg, rgba(75, 175, 255, 0.2), rgba(157, 78, 221, 0.32));
  box-shadow:
    0 0 calc(56 * min(100vw, 420px) / 750) rgba(255, 215, 0, 0.18),
    0 calc(16 * min(100vw, 420px) / 750) calc(48 * min(100vw, 420px) / 750) rgba(157, 78, 221, 0.35);
}

.rp-glass--comment {
  flex: 1;
  max-height: 46vh;
  display: flex;
  flex-direction: column;
}

.rp-glass--compact {
  padding-bottom: calc(16 * min(100vw, 420px) / 750);
}

.rp-glass__tag {
  display: block;
  font-size: calc(22 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.65);
  letter-spacing: calc(2 * min(100vw, 420px) / 750);
}

.rp-glass__date {
  display: block;
  margin-top: calc(12 * min(100vw, 420px) / 750);
  font-size: calc(34 * min(100vw, 420px) / 750);
  font-weight: 700;
  color: var(--rp-gold);
  text-shadow: 0 0 calc(16 * min(100vw, 420px) / 750) rgba(255, 215, 0, 0.55);
}

.rp-glass__title {
  display: block;
  margin-top: calc(12 * min(100vw, 420px) / 750);
  font-size: calc(44 * min(100vw, 420px) / 750);
  font-weight: 800;
  color: #fff;
  line-height: 1.25;
}

.rp-glass__sub {
  display: block;
  margin-top: calc(10 * min(100vw, 420px) / 750);
  font-size: calc(26 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.5;
}

.rp-glass__lines {
  margin-top: calc(16 * min(100vw, 420px) / 750);
  display: flex;
  flex-direction: column;
  gap: calc(8 * min(100vw, 420px) / 750);
}

.rp-glass__line {
  font-size: calc(28 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.92);
  line-height: 1.55;
}

.rp-glass__hook {
  display: block;
  margin-top: calc(18 * min(100vw, 420px) / 750);
  font-size: calc(26 * min(100vw, 420px) / 750);
  color: #b8e8ff;
  font-style: italic;
  text-shadow: 0 0 calc(12 * min(100vw, 420px) / 750) rgba(75, 175, 255, 0.5);
}

.rp-station-pill {
  align-self: flex-start;
  padding: calc(8 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  font-size: calc(22 * min(100vw, 420px) / 750);
  color: #3d1f7a;
  font-weight: 700;
  background: linear-gradient(135deg, #ffe566, var(--rp-gold));
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.5);
  box-shadow: 0 calc(4 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750) rgba(255, 215, 0, 0.35);
}

/* —— 大数字指标（宇宙引言） —— */
.rp-metric-hero {
  text-align: center;
  padding: calc(16 * min(100vw, 420px) / 750) 0 calc(8 * min(100vw, 420px) / 750);
}

.rp-metric-hero__num {
  font-size: calc(96 * min(100vw, 420px) / 750);
  font-weight: 900;
  color: #67e8f9;
  line-height: 1;
  text-shadow: 0 0 calc(40 * min(100vw, 420px) / 750) rgba(103, 232, 249, 0.5);
}

.rp-metric-hero__unit {
  display: block;
  margin-top: calc(8 * min(100vw, 420px) / 750);
  font-size: calc(30 * min(100vw, 420px) / 750);
  font-weight: 700;
  color: #fff;
}

.rp-metric-hero__hint {
  display: block;
  margin-top: calc(8 * min(100vw, 420px) / 750);
  font-size: calc(24 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.65);
}

/* —— 角色舞台 —— */
.rp-hero-stage {
  position: relative;
  flex: 1;
  min-height: calc(200 * min(100vw, 420px) / 750);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  padding-bottom: calc(16 * min(100vw, 420px) / 750);
}

.rp-hero-stage--side {
  min-height: calc(120 * min(100vw, 420px) / 750);
  flex: 0;
}

.rp-hero-stage--mini {
  min-height: calc(100 * min(100vw, 420px) / 750);
  flex: 0;
}

.rp-hero-stage--wave {
  flex-direction: row;
  justify-content: center;
  gap: calc(24 * min(100vw, 420px) / 750);
  align-items: flex-end;
}

.rp-pedestal {
  position: absolute;
  bottom: calc(24 * min(100vw, 420px) / 750);
  width: calc(240 * min(100vw, 420px) / 750);
  height: calc(48 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(255, 255, 255, 0.35) 0%, transparent 70%);
}

.rp-pedestal--glow-cyan {
  box-shadow: 0 0 calc(60 * min(100vw, 420px) / 750) rgba(103, 232, 249, 0.4);
}

.rp-pedestal--glow-pink {
  box-shadow: 0 0 calc(60 * min(100vw, 420px) / 750) rgba(249, 168, 212, 0.4);
}

.rp-pedestal--glow-gold {
  box-shadow: 0 0 calc(60 * min(100vw, 420px) / 750) rgba(253, 224, 71, 0.35);
}

.rp-pedestal--glow-mint {
  box-shadow: 0 0 calc(60 * min(100vw, 420px) / 750) rgba(134, 239, 172, 0.35);
}

.rp-pedestal--glow-violet {
  box-shadow: 0 0 calc(60 * min(100vw, 420px) / 750) rgba(196, 181, 253, 0.45);
}

.rp-hero {
  position: relative;
  z-index: 2;
  font-size: calc(72 * min(100vw, 420px) / 750);
  line-height: 1;
  filter: drop-shadow(0 calc(12 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(0, 0, 0, 0.35));
}

.rp-hero--float {
  animation: rpFloat 3s ease-in-out infinite;
}

.rp-hero--lg {
  font-size: calc(96 * min(100vw, 420px) / 750);
}

.rp-hero--xl {
  font-size: calc(140 * min(100vw, 420px) / 750);
}

@keyframes rpFloat {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-calc(16 * min(100vw, 420px) / 750));
  }
}

/* —— 人设 —— */
.rp-persona-lead {
  display: block;
  margin-top: calc(20 * min(100vw, 420px) / 750);
  font-size: calc(32 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.85);
}

.rp-persona-name {
  display: block;
  margin-top: calc(12 * min(100vw, 420px) / 750);
  font-size: calc(48 * min(100vw, 420px) / 750);
  font-weight: 900;
  color: var(--rp-gold);
  letter-spacing: calc(4 * min(100vw, 420px) / 750);
  text-shadow: var(--rp-neon);
}

.rp-tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: calc(12 * min(100vw, 420px) / 750);
  margin-top: calc(20 * min(100vw, 420px) / 750);
}

.rp-tag {
  padding: calc(8 * min(100vw, 420px) / 750) calc(18 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  font-size: calc(22 * min(100vw, 420px) / 750);
  color: #fff;
  background: linear-gradient(135deg, rgba(75, 175, 255, 0.35), rgba(157, 78, 221, 0.4));
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 215, 0, 0.35);
}

.rp-base-deco {
  position: absolute;
  right: calc(40 * min(100vw, 420px) / 750);
  top: 38%;
  width: calc(120 * min(100vw, 420px) / 750);
  opacity: 0.5;
}

.rp-base-deco__roof {
  width: 0;
  height: 0;
  margin: 0 auto;
  border-left: calc(60 * min(100vw, 420px) / 750) solid transparent;
  border-right: calc(60 * min(100vw, 420px) / 750) solid transparent;
  border-bottom: calc(40 * min(100vw, 420px) / 750) solid rgba(167, 139, 250, 0.6);
}

.rp-base-deco__body {
  width: calc(100 * min(100vw, 420px) / 750);
  height: calc(64 * min(100vw, 420px) / 750);
  margin: 0 auto;
  border-radius: calc(12 * min(100vw, 420px) / 750);
  background: rgba(139, 92, 246, 0.35);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(196, 181, 253, 0.4);
}

/* —— 雷达全息台 —— */
.rp-holo {
  margin: calc(8 * min(100vw, 420px) / 750) auto;
  padding: calc(20 * min(100vw, 420px) / 750);
  width: calc(340 * min(100vw, 420px) / 750);
  border-radius: calc(40 * min(100vw, 420px) / 750) calc(36 * min(100vw, 420px) / 750) calc(44 * min(100vw, 420px) / 750) calc(32 * min(100vw, 420px) / 750);
  background: var(--rp-glass-bg);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(75, 175, 255, 0.45);
  box-shadow:
    0 0 calc(48 * min(100vw, 420px) / 750) rgba(157, 78, 221, 0.28),
    inset 0 calc(1 * min(100vw, 420px) / 750) 0 rgba(255, 255, 255, 0.2);
  -webkit-backdrop-filter: blur(calc(16 * min(100vw, 420px) / 750));
  backdrop-filter: blur(calc(16 * min(100vw, 420px) / 750));
}

.rp-radar-canvas {
  width: calc(300 * min(100vw, 420px) / 750);
  height: calc(260 * min(100vw, 420px) / 750);
  display: block;
}

.rp-bubble-row {
  display: flex;
  flex-wrap: wrap;
  gap: calc(12 * min(100vw, 420px) / 750);
  justify-content: center;
}

.rp-chip {
  display: flex;
  align-items: center;
  gap: calc(8 * min(100vw, 420px) / 750);
  padding: calc(10 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  border: calc(1 * min(100vw, 420px) / 750) solid;
}

.rp-chip__emoji {
  font-size: calc(24 * min(100vw, 420px) / 750);
}

.rp-chip__name {
  font-size: calc(22 * min(100vw, 420px) / 750);
  color: #fff;
}

.rp-chip__val {
  font-size: calc(22 * min(100vw, 420px) / 750);
  font-weight: 700;
  color: var(--rp-gold);
}

/* —— 金色羽翼（荣誉 / 人设） —— */
.rp-wings {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 0;
  z-index: 0;
  pointer-events: none;
}

.rp-wing {
  position: absolute;
  top: -calc(48 * min(100vw, 420px) / 750);
  width: calc(72 * min(100vw, 420px) / 750);
  height: calc(96 * min(100vw, 420px) / 750);
  border-radius: 70% 30% 70% 30%;
  opacity: 0.55;
  background: linear-gradient(145deg, rgba(255, 228, 120, 0.9), rgba(255, 215, 0, 0.35));
  box-shadow: 0 0 calc(24 * min(100vw, 420px) / 750) rgba(255, 215, 0, 0.4);
}

.rp-wing--l {
  left: calc(8 * min(100vw, 420px) / 750);
  transform: rotate(-28deg);
}

.rp-wing--r {
  right: calc(8 * min(100vw, 420px) / 750);
  transform: scaleX(-1) rotate(-28deg);
}

.rp-wings--gold .rp-wing {
  opacity: 0.75;
}

/* —— 数据统计 —— */
.rp-stat-hero {
  position: relative;
  text-align: center;
  padding: calc(28 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750);
  margin: calc(8 * min(100vw, 420px) / 750) 0;
}

.rp-stat-hero--honor {
  overflow: visible;
}

.rp-stat-hero__emoji {
  font-size: calc(64 * min(100vw, 420px) / 750);
}

.rp-stat-hero__num {
  display: block;
  font-size: calc(80 * min(100vw, 420px) / 750);
  font-weight: 900;
  color: var(--rp-sky);
  line-height: 1;
  text-shadow: var(--rp-neon);
}

.rp-stat-hero__label {
  font-size: calc(28 * min(100vw, 420px) / 750);
  color: #fff;
  font-weight: 600;
}

.rp-rank-line {
  text-align: center;
  font-size: calc(24 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.5;
  padding: 0 calc(16 * min(100vw, 420px) / 750);
}

.rp-chip-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: calc(12 * min(100vw, 420px) / 750);
}

.rp-chip-card {
  padding: calc(18 * min(100vw, 420px) / 750) calc(14 * min(100vw, 420px) / 750);
  border-radius: calc(28 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) calc(32 * min(100vw, 420px) / 750) calc(22 * min(100vw, 420px) / 750);
  text-align: center;
  background: var(--rp-glass-bg);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.22);
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(157, 78, 221, 0.2);
  -webkit-backdrop-filter: blur(calc(12 * min(100vw, 420px) / 750));
  backdrop-filter: blur(calc(12 * min(100vw, 420px) / 750));
}

.rp-chip-card--wide {
  grid-column: span 2;
}

.rp-chip-card__val {
  font-size: calc(32 * min(100vw, 420px) / 750);
  font-weight: 800;
  color: var(--rp-gold);
  text-shadow: 0 0 calc(12 * min(100vw, 420px) / 750) rgba(255, 215, 0, 0.45);
}

.rp-chip-card__lbl {
  margin-top: calc(6 * min(100vw, 420px) / 750);
  font-size: calc(22 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.6);
}

.rp-medal-row {
  display: flex;
  flex-wrap: wrap;
  gap: calc(10 * min(100vw, 420px) / 750);
  justify-content: center;
}

.rp-medal-chip {
  padding: calc(8 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  font-size: calc(22 * min(100vw, 420px) / 750);
  color: #3d1f7a;
  font-weight: 600;
  background: linear-gradient(135deg, #fff4b0, var(--rp-gold));
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.55);
  box-shadow: 0 calc(4 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750) rgba(255, 215, 0, 0.35);
}

/* —— 评语 —— */
.rp-comment-scroll {
  flex: 1;
  max-height: 32vh;
  margin-top: calc(16 * min(100vw, 420px) / 750);
}

.rp-comment-empty {
  padding: calc(32 * min(100vw, 420px) / 750) 0;
  text-align: center;
  color: rgba(255, 255, 255, 0.55);
  font-size: calc(28 * min(100vw, 420px) / 750);
}

.rp-comment__p {
  font-size: calc(28 * min(100vw, 420px) / 750);
  line-height: 1.85;
  color: rgba(255, 255, 255, 0.9);
  margin-bottom: calc(20 * min(100vw, 420px) / 750);
}

.rp-wave-hand {
  font-size: calc(64 * min(100vw, 420px) / 750);
  animation: rpWave 1.2s ease-in-out infinite;
}

@keyframes rpWave {
  0%,
  100% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(18deg);
  }
}

/* —— 封底 —— */
.rp-.gr-book--end {
  justify-content: center;
  align-items: center;
}

.rp-end-card {
  text-align: center;
  padding: calc(40 * min(100vw, 420px) / 750) calc(32 * min(100vw, 420px) / 750);
  border-radius: calc(32 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.08);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.18);
}

.rp-end-card__icon {
  font-size: calc(72 * min(100vw, 420px) / 750);
}

.rp-end-card__title {
  display: block;
  margin-top: calc(20 * min(100vw, 420px) / 750);
  font-size: calc(40 * min(100vw, 420px) / 750);
  font-weight: 800;
  color: #fff;
}

.rp-end-card__sub {
  display: block;
  margin-top: calc(16 * min(100vw, 420px) / 750);
  font-size: calc(26 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.78);
}

.rp-end-card__brand {
  display: block;
  margin-top: calc(40 * min(100vw, 420px) / 750);
  font-size: calc(22 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.45);
  letter-spacing: calc(4 * min(100vw, 420px) / 750);
}

/* —— 上滑提示 —— */
.rp-flip-hint {
  position: fixed;
  left: 50%;
  right: auto;
  bottom: calc(env(safe-area-inset-bottom) + calc(12 * min(100vw, 420px) / 750));
  z-index: 35;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: calc(6 * min(100vw, 420px) / 750);
  width: max-content;
  max-width: 88%;
  transform: translateX(-50%);
  font-size: calc(24 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.8);
  text-align: center;
  animation: rpHintPulse 2.2s ease-in-out infinite;
  pointer-events: none;
}

.rp-flip-hint__chev {
  font-size: calc(22 * min(100vw, 420px) / 750);
}

@keyframes rpHintPulse {
  0%,
  100% {
    opacity: 0.45;
  }
  50% {
    opacity: 1;
  }
}

/* ---- report-poster-clay.wxss ---- */
/* ═══════════════════════════════════════
   海报版式 · 竖屏 9:16 一页一海报
   ═══════════════════════════════════════ */
.rp-poster {
  position: relative;
  z-index: 3;
  box-sizing: border-box;
  height: 100%;
  padding: calc(env(safe-area-inset-top) + calc(72 * min(100vw, 420px) / 750)) 0 calc(env(safe-area-inset-bottom) + calc(48 * min(100vw, 420px) / 750));
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.rp-poster__ribbon {
  align-self: center;
  margin-bottom: calc(16 * min(100vw, 420px) / 750);
  padding: calc(10 * min(100vw, 420px) / 750) calc(32 * min(100vw, 420px) / 750);
  font-size: calc(22 * min(100vw, 420px) / 750);
  font-weight: 800;
  letter-spacing: calc(6 * min(100vw, 420px) / 750);
  color: #3d1f7a;
  background: linear-gradient(90deg, #ffe566, var(--rp-gold), #ffe566);
  border-radius: calc(8 * min(100vw, 420px) / 750);
  box-shadow: 0 calc(6 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750) rgba(255, 215, 0, 0.45);
}

/* 上半：浅色海报纸（高对比正文） */
.rp-poster__sheet {
  margin: 0 calc(28 * min(100vw, 420px) / 750);
  padding: calc(32 * min(100vw, 420px) / 750) calc(32 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750);
  border-radius: calc(12 * min(100vw, 420px) / 750);
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.96) 0%, rgba(240, 249, 255, 0.94) 100%);
  box-shadow:
    0 calc(24 * min(100vw, 420px) / 750) calc(64 * min(100vw, 420px) / 750) rgba(0, 0, 0, 0.28),
    inset 0 0 0 calc(2 * min(100vw, 420px) / 750) rgba(255, 255, 255, 0.9);
  flex-shrink: 0;
}

.rp-poster__sheet--light {
  color: #1e1b4b;
}

.rp-poster__sheet--compact {
  padding: calc(24 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750);
  text-align: center;
}

.rp-poster__sheet--stats {
  text-align: center;
}

.rp-poster__kicker {
  display: block;
  font-size: calc(22 * min(100vw, 420px) / 750);
  letter-spacing: calc(4 * min(100vw, 420px) / 750);
  color: var(--rp-magic);
  font-weight: 600;
}

.rp-poster__kicker--dark {
  color: #7c3aed;
}

.rp-poster__mega-row {
  display: flex;
  align-items: flex-end;
  margin-top: calc(8 * min(100vw, 420px) / 750);
}

.rp-poster__mega {
  font-size: calc(140 * min(100vw, 420px) / 750);
  font-weight: 900;
  line-height: 0.9;
  color: var(--rp-sky);
  text-shadow: var(--rp-neon);
}

.rp-poster__mega-unit {
  margin-left: calc(8 * min(100vw, 420px) / 750);
  margin-bottom: calc(20 * min(100vw, 420px) / 750);
  font-size: calc(40 * min(100vw, 420px) / 750);
  font-weight: 800;
  color: #1e1b4b;
}

.rp-poster__mega-sub {
  display: block;
  font-size: calc(24 * min(100vw, 420px) / 750);
  color: #64748b;
  margin-top: calc(4 * min(100vw, 420px) / 750);
}

.rp-poster__date {
  display: block;
  margin-top: calc(4 * min(100vw, 420px) / 750);
  font-size: calc(36 * min(100vw, 420px) / 750);
  font-weight: 800;
  color: #7c3aed;
}

.rp-poster__title {
  display: block;
  margin-top: calc(12 * min(100vw, 420px) / 750);
  font-size: calc(52 * min(100vw, 420px) / 750);
  font-weight: 900;
  line-height: 1.15;
  color: #fff;
  text-shadow: var(--rp-neon);
}

.rp-poster__title--dark {
  font-size: calc(48 * min(100vw, 420px) / 750);
  color: #1e1b4b;
  text-shadow: none;
}

.rp-poster__line {
  display: block;
  margin-top: calc(14 * min(100vw, 420px) / 750);
  font-size: calc(28 * min(100vw, 420px) / 750);
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.92);
}

.rp-poster__line--dark {
  color: #334155;
  font-size: calc(30 * min(100vw, 420px) / 750);
}

.rp-poster__line--light {
  color: rgba(255, 255, 255, 0.9);
  font-size: calc(28 * min(100vw, 420px) / 750);
}

.rp-poster__foot {
  display: block;
  margin-top: calc(16 * min(100vw, 420px) / 750);
  font-size: calc(24 * min(100vw, 420px) / 750);
  color: #64748b;
}

.rp-poster__quote {
  display: block;
  margin-top: calc(20 * min(100vw, 420px) / 750);
  padding-top: calc(16 * min(100vw, 420px) / 750);
  border-top: calc(1 * min(100vw, 420px) / 750) dashed rgba(124, 58, 237, 0.25);
  font-size: calc(26 * min(100vw, 420px) / 750);
  font-style: italic;
  color: #6366f1;
  line-height: 1.5;
}

/* 下半：全幅主视觉区 */
.rp-poster__visual {
  position: relative;
  flex: 1;
  min-height: 0;
  margin-top: calc(12 * min(100vw, 420px) / 750);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  padding-bottom: calc(8 * min(100vw, 420px) / 750);
}

.rp-poster__visual--cyan {
  background: radial-gradient(ellipse at 50% 100%, rgba(75, 175, 255, 0.35) 0%, transparent 65%);
}

.rp-poster__visual--pink {
  background: radial-gradient(ellipse at 50% 100%, rgba(249, 168, 212, 0.35) 0%, transparent 65%);
}

.rp-poster__visual--gold {
  background: radial-gradient(ellipse at 50% 100%, rgba(255, 215, 0, 0.28) 0%, transparent 65%);
}

.rp-poster__visual--mint {
  background: radial-gradient(ellipse at 50% 100%, rgba(134, 239, 172, 0.3) 0%, transparent 65%);
}

.rp-poster__visual--violet {
  background: radial-gradient(ellipse at 50% 100%, rgba(157, 78, 221, 0.4) 0%, transparent 65%);
}

.rp-poster__visual--persona {
  background: radial-gradient(ellipse at 50% 80%, rgba(255, 215, 0, 0.25) 0%, transparent 60%);
}

.rp-poster__event-icon {
  position: relative;
  z-index: 2;
  font-size: calc(128 * min(100vw, 420px) / 750);
  line-height: 1;
  margin-bottom: -calc(40 * min(100vw, 420px) / 750);
  filter: drop-shadow(0 calc(12 * min(100vw, 420px) / 750) calc(32 * min(100vw, 420px) / 750) rgba(0, 0, 0, 0.35));
  animation: rpFloat 3s ease-in-out infinite;
}

.rp-poster__orbit-emoji {
  position: absolute;
  right: calc(48 * min(100vw, 420px) / 750);
  top: calc(24 * min(100vw, 420px) / 750);
  font-size: calc(72 * min(100vw, 420px) / 750);
  z-index: 4;
  animation: rpFloat 3.2s ease-in-out infinite;
}

.rp-poster__halo {
  position: absolute;
  width: calc(360 * min(100vw, 420px) / 750);
  height: calc(360 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 215, 0, 0.35) 0%, transparent 70%);
  bottom: calc(80 * min(100vw, 420px) / 750);
}

.rp-mascot--poster-hero {
  width: calc(480 * min(100vw, 420px) / 750);
  height: calc(480 * min(100vw, 420px) / 750);
  margin-bottom: -calc(24 * min(100vw, 420px) / 750);
}

.rp-mascot--poster-mark {
  width: calc(240 * min(100vw, 420px) / 750);
  height: calc(240 * min(100vw, 420px) / 750);
  opacity: 0.92;
}

.rp-mascot--poster-corner {
  position: absolute;
  right: calc(16 * min(100vw, 420px) / 750);
  bottom: calc(24 * min(100vw, 420px) / 750);
  width: calc(200 * min(100vw, 420px) / 750);
  height: calc(200 * min(100vw, 420px) / 750);
  z-index: 5;
  opacity: 0.88;
}

/* —— 人设称号海报 —— */
.rp-poster--persona .rp-poster__persona-core {
  margin: 0 calc(28 * min(100vw, 420px) / 750);
  padding: calc(28 * min(100vw, 420px) / 750) calc(32 * min(100vw, 420px) / 750);
  text-align: center;
  border-radius: calc(12 * min(100vw, 420px) / 750);
  background: linear-gradient(180deg, rgba(45, 27, 105, 0.85), rgba(157, 78, 221, 0.55));
  border: calc(2 * min(100vw, 420px) / 750) solid rgba(255, 215, 0, 0.45);
  box-shadow: 0 0 calc(48 * min(100vw, 420px) / 750) rgba(157, 78, 221, 0.4);
}

.rp-poster__persona-lead {
  display: block;
  margin-top: calc(16 * min(100vw, 420px) / 750);
  font-size: calc(32 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.85);
}

.rp-poster__persona-title {
  display: block;
  margin-top: calc(8 * min(100vw, 420px) / 750);
  font-size: calc(56 * min(100vw, 420px) / 750);
  font-weight: 900;
  color: var(--rp-gold);
  letter-spacing: calc(6 * min(100vw, 420px) / 750);
  text-shadow: var(--rp-neon);
}

.rp-poster__tag-strip {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: calc(12 * min(100vw, 420px) / 750);
  margin-top: calc(24 * min(100vw, 420px) / 750);
}

.rp-poster__tag {
  padding: calc(8 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750);
  font-size: calc(22 * min(100vw, 420px) / 750);
  font-weight: 700;
  color: #fff;
  background: rgba(75, 175, 255, 0.35);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.35);
  border-radius: calc(6 * min(100vw, 420px) / 750);
}

/* —— 雷达海报 —— */
.rp-poster--radar {
  padding-bottom: calc(env(safe-area-inset-bottom) + calc(56 * min(100vw, 420px) / 750));
}

.rp-poster__radar-frame {
  margin: calc(16 * min(100vw, 420px) / 750) auto calc(8 * min(100vw, 420px) / 750);
  width: calc(400 * min(100vw, 420px) / 750);
  height: calc(340 * min(100vw, 420px) / 750);
  padding: calc(16 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: linear-gradient(145deg, rgba(255, 215, 0, 0.25), rgba(75, 175, 255, 0.15));
  border: calc(3 * min(100vw, 420px) / 750) solid rgba(255, 215, 0, 0.55);
  box-shadow:
    0 0 calc(60 * min(100vw, 420px) / 750) rgba(157, 78, 221, 0.35),
    inset 0 0 calc(40 * min(100vw, 420px) / 750) rgba(75, 175, 255, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
}

.rp-poster--radar .rp-radar-canvas {
  width: calc(340 * min(100vw, 420px) / 750);
  height: calc(300 * min(100vw, 420px) / 750);
}

.rp-poster__dim-bars {
  margin: 0 calc(36 * min(100vw, 420px) / 750);
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: calc(14 * min(100vw, 420px) / 750);
}

.rp-poster__dim {
  display: flex;
  align-items: center;
  gap: calc(12 * min(100vw, 420px) / 750);
}

.rp-poster__dim-emoji {
  width: calc(40 * min(100vw, 420px) / 750);
  font-size: calc(28 * min(100vw, 420px) / 750);
  text-align: center;
}

.rp-poster__dim-track {
  flex: 1;
  height: calc(16 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.15);
  overflow: hidden;
}

.rp-poster__dim-fill {
  height: 100%;
  border-radius: calc(999 * min(100vw, 420px) / 750);
  box-shadow: 0 0 calc(12 * min(100vw, 420px) / 750) rgba(255, 255, 255, 0.35);
}

.rp-poster__dim-label {
  width: calc(120 * min(100vw, 420px) / 750);
  font-size: calc(22 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.9);
  text-align: right;
}

/* —— 数据高光海报 —— */
.rp-poster--stats {
  padding-bottom: calc(env(safe-area-inset-bottom) + calc(200 * min(100vw, 420px) / 750));
}

.rp-poster__stat-focus {
  margin-top: calc(12 * min(100vw, 420px) / 750);
  padding: calc(16 * min(100vw, 420px) / 750) 0;
}

.rp-poster__stat-emoji {
  font-size: calc(56 * min(100vw, 420px) / 750);
}

.rp-poster__stat-num {
  display: block;
  font-size: calc(96 * min(100vw, 420px) / 750);
  font-weight: 900;
  line-height: 1;
  color: var(--rp-sky);
}

.rp-poster__stat-name {
  display: block;
  margin-top: calc(8 * min(100vw, 420px) / 750);
  font-size: calc(32 * min(100vw, 420px) / 750);
  font-weight: 800;
  color: #7c3aed;
}

.rp-poster__rank {
  display: block;
  margin-top: calc(12 * min(100vw, 420px) / 750);
  font-size: calc(24 * min(100vw, 420px) / 750);
  color: #64748b;
  line-height: 1.5;
}

.rp-poster__stat-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: calc(12 * min(100vw, 420px) / 750);
  margin: calc(16 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) 0;
}

.rp-poster__stat-cell {
  padding: calc(20 * min(100vw, 420px) / 750) calc(12 * min(100vw, 420px) / 750);
  text-align: center;
  border-radius: calc(10 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.12);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.22);
}

.rp-poster__stat-cell-val {
  display: block;
  font-size: calc(34 * min(100vw, 420px) / 750);
  font-weight: 900;
  color: var(--rp-gold);
}

.rp-poster__stat-cell-lbl {
  display: block;
  margin-top: calc(6 * min(100vw, 420px) / 750);
  font-size: calc(22 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.75);
}

.rp-poster__seals {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: calc(10 * min(100vw, 420px) / 750);
  margin: calc(16 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) calc(80 * min(100vw, 420px) / 750);
}

.rp-poster__seal {
  padding: calc(8 * min(100vw, 420px) / 750) calc(18 * min(100vw, 420px) / 750);
  font-size: calc(22 * min(100vw, 420px) / 750);
  font-weight: 700;
  color: #3d1f7a;
  background: linear-gradient(135deg, #fff4b0, var(--rp-gold));
  border-radius: calc(999 * min(100vw, 420px) / 750);
  border: calc(2 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.6);
}

/* —— 信笺海报 —— */
.rp-poster--letter {
  padding-left: calc(24 * min(100vw, 420px) / 750);
  padding-right: calc(24 * min(100vw, 420px) / 750);
}

.rp-poster__letter {
  flex: 1;
  margin-top: calc(8 * min(100vw, 420px) / 750);
  padding: calc(28 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750);
  border-radius: calc(8 * min(100vw, 420px) / 750) calc(8 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750);
  background: linear-gradient(180deg, #fffef8 0%, #f8f4ff 100%);
  box-shadow:
    0 calc(28 * min(100vw, 420px) / 750) calc(56 * min(100vw, 420px) / 750) rgba(0, 0, 0, 0.35),
    inset 0 0 0 calc(1 * min(100vw, 420px) / 750) rgba(157, 78, 221, 0.15);
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.rp-poster__letter-head {
  display: flex;
  align-items: center;
  gap: calc(16 * min(100vw, 420px) / 750);
  padding-bottom: calc(20 * min(100vw, 420px) / 750);
  border-bottom: calc(2 * min(100vw, 420px) / 750) solid rgba(157, 78, 221, 0.2);
}

.rp-mascot--letter-seal {
  width: calc(88 * min(100vw, 420px) / 750);
  height: calc(88 * min(100vw, 420px) / 750);
}

.rp-poster__letter-brand {
  font-size: calc(32 * min(100vw, 420px) / 750);
  font-weight: 900;
  color: #7c3aed;
  letter-spacing: calc(2 * min(100vw, 420px) / 750);
}

.rp-poster__letter-body {
  flex: 1;
  margin-top: calc(20 * min(100vw, 420px) / 750);
  max-height: 42vh;
}

.rp-poster__letter-p {
  display: block;
  font-size: calc(30 * min(100vw, 420px) / 750);
  line-height: 1.85;
  color: #334155;
  margin-bottom: calc(24 * min(100vw, 420px) / 750);
}

.rp-poster__letter-empty {
  padding: calc(48 * min(100vw, 420px) / 750) 0;
  text-align: center;
  font-size: calc(28 * min(100vw, 420px) / 750);
  color: #94a3b8;
}

/* —— 封底毕业海报 —— */
.rp-poster--end {
  align-items: center;
  justify-content: flex-end;
  text-align: center;
  padding-bottom: calc(env(safe-area-inset-bottom) + calc(64 * min(100vw, 420px) / 750));
}

.rp-poster__end-glow {
  position: absolute;
  width: calc(600 * min(100vw, 420px) / 750);
  height: calc(600 * min(100vw, 420px) / 750);
  bottom: 10%;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 215, 0, 0.2) 0%, transparent 65%);
  pointer-events: none;
}

.rp-poster__end-year {
  position: relative;
  z-index: 2;
  font-size: calc(160 * min(100vw, 420px) / 750);
  font-weight: 900;
  line-height: 1;
  color: rgba(255, 255, 255, 0.12);
}

.rp-poster__end-title {
  position: relative;
  z-index: 2;
  margin-top: -calc(48 * min(100vw, 420px) / 750);
  font-size: calc(48 * min(100vw, 420px) / 750);
  font-weight: 900;
  color: #fff;
  text-shadow: var(--rp-neon);
  letter-spacing: calc(8 * min(100vw, 420px) / 750);
}

.rp-poster__end-sub {
  position: relative;
  z-index: 2;
  margin-top: calc(16 * min(100vw, 420px) / 750);
  font-size: calc(28 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.85);
}

.rp-poster__end-brand {
  position: relative;
  z-index: 2;
  margin-top: calc(24 * min(100vw, 420px) / 750);
  font-size: calc(22 * min(100vw, 420px) / 750);
  color: var(--rp-gold);
  letter-spacing: calc(6 * min(100vw, 420px) / 750);
}

.rp-poster--end .rp-mascot--poster-hero {
  position: relative;
  z-index: 2;
  margin-top: calc(24 * min(100vw, 420px) / 750);
}

/* ═══════════════════════════════════════
   马卡龙黏土风 · 图册版式（v2）
   ═══════════════════════════════════════ */

/* 动感背景纹理：气泡 + 星点 */
.rp-deco {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background-image:
    radial-gradient(circle at 12% 22%, rgba(255, 255, 255, 0.55) 0%, transparent 8%),
    radial-gradient(circle at 88% 18%, rgba(255, 255, 255, 0.45) 0%, transparent 6%),
    radial-gradient(circle at 72% 78%, rgba(255, 255, 255, 0.4) 0%, transparent 7%),
    radial-gradient(calc(2 * min(100vw, 420px) / 750) calc(2 * min(100vw, 420px) / 750) at 18% 40%, rgba(255, 255, 255, 0.9), transparent),
    radial-gradient(calc(2 * min(100vw, 420px) / 750) calc(2 * min(100vw, 420px) / 750) at 76% 32%, rgba(255, 255, 255, 0.75), transparent),
    radial-gradient(calc(1 * min(100vw, 420px) / 750) calc(1 * min(100vw, 420px) / 750) at 42% 68%, rgba(255, 255, 255, 0.65), transparent),
    radial-gradient(calc(1 * min(100vw, 420px) / 750) calc(1 * min(100vw, 420px) / 750) at 90% 62%, rgba(255, 255, 255, 0.55), transparent);
  animation: rpDecoDrift 8s ease-in-out infinite;
}

@keyframes rpDecoDrift {
  0%,
  100% {
    opacity: 0.85;
  }
  50% {
    opacity: 1;
  }
}

.rp-deco-emoji {
  position: absolute;
  z-index: 2;
  font-size: calc(36 * min(100vw, 420px) / 750);
  pointer-events: none;
  opacity: 0.55;
  animation: rpFloat 4s ease-in-out infinite;
}

.rp-deco-emoji--1 {
  top: 14%;
  left: 8%;
}

.rp-deco-emoji--2 {
  top: 22%;
  right: 10%;
  animation-delay: 0.5s;
}

.rp-deco-emoji--3 {
  bottom: 32%;
  left: 12%;
  animation-delay: 1s;
}

.rp-deco-emoji--4 {
  bottom: 20%;
  right: 14%;
  animation-delay: 1.4s;
}

/* 入场：淡入 + 弹簧弹跳 */
.rp-clay-pop {
  opacity: 0;
  transform: translateY(calc(56 * min(100vw, 420px) / 750)) scale(0.92);
}

.rp-scene--in .rp-clay-pop {
  animation: rpClayPop 0.78s cubic-bezier(0.34, 1.45, 0.64, 1) forwards;
}

.rp-scene--in .rp-clay-pop--d1 {
  animation-delay: 0.06s;
}

.rp-scene--in .rp-clay-pop--d2 {
  animation-delay: 0.14s;
}

.rp-scene--in .rp-clay-pop--d3 {
  animation-delay: 0.22s;
}

@keyframes rpClayPop {
  0% {
    opacity: 0;
    transform: translateY(calc(56 * min(100vw, 420px) / 750)) scale(0.92);
  }
  70% {
    opacity: 1;
    transform: translateY(-calc(8 * min(100vw, 420px) / 750)) scale(1.03);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* 顶栏 · 明亮底 */
.rp-topbar__back {
  color: var(--rp-ink);
  background: rgba(255, 255, 255, 0.72);
  border: calc(2 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.9);
  box-shadow: var(--rp-clay-shadow);
}

.rp-topbar__brand {
  color: #64748b;
}

.rp-topbar__progress {
  color: var(--rp-blue);
  text-shadow: none;
}

.rp-flip-hint {
  color: var(--rp-ink);
  background: rgba(255, 255, 255, 0.55);
  padding: calc(8 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
}

/* 圆润标题字 */
.rp-title-round {
  display: block;
  line-height: 1.16;
  color: #fff;
  letter-spacing: calc(5 * min(100vw, 420px) / 750);
  -webkit-text-stroke: calc(1 * min(100vw, 420px) / 750) rgba(15, 23, 42, 0.18);
  text-shadow: 0 calc(4 * min(100vw, 420px) / 750) 0 rgba(15, 23, 42, 0.18);
}

.rp-title-round--dark {
  color: var(--rp-ink);
  text-shadow: none;
}

.rp-title-round--gold {
  color: #b45309;
  background: linear-gradient(135deg, #fde047, #fbbf24);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.rp-title-round--sm {
  text-align: center;
}

/* 亮色标签贴纸 */
.rp-sticker {
  align-self: flex-start;
  margin: 0 calc(28 * min(100vw, 420px) / 750) calc(12 * min(100vw, 420px) / 750);
  padding: calc(14 * min(100vw, 420px) / 750) calc(34 * min(100vw, 420px) / 750);
  font-weight: 800;
  letter-spacing: calc(2 * min(100vw, 420px) / 750);
  color: var(--rp-ink);
  border-radius: calc(16 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750);
  box-shadow: var(--rp-clay-shadow);
  transform: rotate(-2deg);
}

.rp-sticker--sun {
  background: linear-gradient(135deg, #fde68a, #fbbf24);
}

.rp-sticker--blue {
  background: linear-gradient(135deg, #bae6fd, #7dd3fc);
}

.rp-sticker--green {
  background: linear-gradient(135deg, #a7f3d0, #6ee7b7);
}

.rp-sticker--pink {
  background: linear-gradient(135deg, #fbcfe8, #f9a8d4);
}

.rp-tag-pill {
  display: inline-block;
  margin-top: calc(12 * min(100vw, 420px) / 750);
  padding: calc(10 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750);
  font-size: calc(28 * min(100vw, 420px) / 750);
  font-weight: 700;
  color: var(--rp-ink);
  background: rgba(255, 255, 255, 0.85);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  box-shadow: 0 calc(6 * min(100vw, 420px) / 750) 0 rgba(30, 58, 95, 0.06);
}

.rp-tag-pill--date {
  background: linear-gradient(135deg, #ddd6fe, #e9d5ff);
}

.rp-tag-pill--sun {
  background: linear-gradient(135deg, #fef08a, #fde047);
  color: #92400e;
}

.rp-tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: calc(12 * min(100vw, 420px) / 750);
  margin-top: calc(16 * min(100vw, 420px) / 750);
}

/* 黏土圆角卡片 */
.rp-clay-card {
  margin: 0 calc(28 * min(100vw, 420px) / 750);
  padding: calc(32 * min(100vw, 420px) / 750) calc(32 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750);
  border-radius: calc(40 * min(100vw, 420px) / 750);
  background: var(--rp-card);
  border: calc(3 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.95);
  box-shadow: var(--rp-clay-shadow);
  backdrop-filter: blur(12px);
}

.rp-clay-card--hero {
  flex-shrink: 0;
}

.rp-clay-card--story,
.rp-clay-card--persona {
  flex-shrink: 0;
  max-height: 46vh;
  overflow: hidden;
}

.rp-clay-card--persona {
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.95), rgba(254, 243, 199, 0.92));
}

.rp-clay-card--compact {
  padding: calc(20 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750);
  text-align: center;
}

.rp-clay-card--stat {
  text-align: center;
}

.rp-clay-card--letter {
  flex: 1;
  margin-top: calc(8 * min(100vw, 420px) / 750);
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: linear-gradient(180deg, #fffef8 0%, #f0f9ff 100%);
}

.rp-clay-card__tag {
  display: block;
  font-size: calc(26 * min(100vw, 420px) / 750);
  font-weight: 700;
  letter-spacing: calc(3 * min(100vw, 420px) / 750);
  color: var(--rp-blue);
}

.rp-clay-card__line {
  display: block;
  margin-top: calc(14 * min(100vw, 420px) / 750);
  line-height: 1.62;
  color: #334155;
}

.rp-clay-card__line--light {
  color: #475569;
}

.rp-clay-card__quote {
  display: block;
  margin-top: calc(18 * min(100vw, 420px) / 750);
  padding-top: calc(14 * min(100vw, 420px) / 750);
  border-top: calc(2 * min(100vw, 420px) / 750) dashed rgba(75, 175, 255, 0.35);
  font-size: calc(26 * min(100vw, 420px) / 750);
  color: #6366f1;
  line-height: 1.5;
}

.rp-clay-card__sub {
  display: block;
  margin-top: calc(12 * min(100vw, 420px) / 750);
  font-size: calc(26 * min(100vw, 420px) / 750);
  color: #64748b;
}

.rp-clay-card__story {
  display: block;
  margin: calc(16 * min(100vw, 420px) / 750) auto 0;
  max-width: calc(520 * min(100vw, 420px) / 750);
  font-size: calc(27 * min(100vw, 420px) / 750);
  line-height: 1.55;
  color: #475569;
}

/* 超大数字 */
.rp-num-hero {
  display: flex;
  align-items: flex-end;
  margin-top: calc(8 * min(100vw, 420px) / 750);
}

.rp-num-hero--inline {
  justify-content: center;
}

.rp-num-hero__val {
  font-size: calc(156 * min(100vw, 420px) / 750);
  font-weight: 900;
  line-height: 0.9;
  color: var(--rp-blue);
}

.rp-num-hero__val--green {
  color: var(--rp-green);
}

.rp-num-hero__unit {
  margin-left: calc(8 * min(100vw, 420px) / 750);
  margin-bottom: calc(22 * min(100vw, 420px) / 750);
  font-size: calc(48 * min(100vw, 420px) / 750);
  font-weight: 800;
  color: var(--rp-ink);
}

.rp-persona-you {
  display: block;
  margin-top: calc(12 * min(100vw, 420px) / 750);
  font-size: calc(32 * min(100vw, 420px) / 750);
  color: #64748b;
}

/* 主视觉区 */
.rp-visual {
  position: relative;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  padding-bottom: calc(16 * min(100vw, 420px) / 750);
}

.rp-visual--cyan,
.rp-visual--blue,
.rp-visual--green,
.rp-visual--sun,
.rp-visual--pink,
.rp-visual--violet,
.rp-visual--persona {
  background: transparent;
}

.rp-visual__icon {
  position: relative;
  z-index: 3;
  font-size: calc(100 * min(100vw, 420px) / 750);
  line-height: 1;
  filter: drop-shadow(0 calc(8 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750) rgba(0, 0, 0, 0.08));
}

.rp-visual__icon--lg {
  font-size: calc(120 * min(100vw, 420px) / 750);
  display: block;
  text-align: center;
  margin: calc(8 * min(100vw, 420px) / 750) 0;
}

.rp-visual__buddy {
  position: relative;
  z-index: 1;
  margin-top: -calc(24 * min(100vw, 420px) / 750);
  font-size: calc(56 * min(100vw, 420px) / 750);
}

.rp-clay-cloud {
  position: absolute;
  bottom: calc(40 * min(100vw, 420px) / 750);
  left: 50%;
  width: calc(320 * min(100vw, 420px) / 750);
  height: calc(80 * min(100vw, 420px) / 750);
  margin-left: -calc(160 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.65);
  box-shadow:
    -calc(80 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750) 0 rgba(255, 255, 255, 0.5),
    calc(80 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750) 0 rgba(255, 255, 255, 0.45);
}

/* 封面 · 明亮黏土 */
.rp-cover__quote {
  color: var(--rp-ink);
  font-weight: 600;
  text-shadow: none;
}

.rp-cover__badge {
  color: #92400e;
  background: linear-gradient(135deg, #fef08a, #fde047);
  box-shadow: var(--rp-clay-shadow);
}

.rp-cover__year {
  color: rgba(30, 58, 95, 0.12);
}

.rp-cover__title {
  letter-spacing: calc(10 * min(100vw, 420px) / 750);
  -webkit-text-stroke: calc(1.5 * min(100vw, 420px) / 750) rgba(15, 23, 42, 0.22);
  color: var(--rp-ink);
  text-shadow: 0 calc(6 * min(100vw, 420px) / 750) 0 rgba(255, 255, 255, 0.82), 0 calc(10 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(15, 23, 42, 0.12);
}

.rp-cover__term,
.rp-cover__meta {
  color: #475569;
  text-shadow: none;
}

.rp-cover__meta {
  color: var(--rp-blue);
  font-weight: 700;
}

.rp-start-label {
  color: var(--rp-ink);
}

.rp-start-btn {
  background: linear-gradient(145deg, #fff, #fde047);
  box-shadow: var(--rp-clay-shadow);
}

.rp-start-btn__arrow {
  color: var(--rp-blue);
}

/* 神兽尺寸与姿态 */
.rp-mascot--hero {
  width: calc(400 * min(100vw, 420px) / 750);
  height: calc(400 * min(100vw, 420px) / 750);
}

.rp-mascot--mark {
  width: calc(280 * min(100vw, 420px) / 750);
  height: calc(280 * min(100vw, 420px) / 750);
  margin-top: -calc(40 * min(100vw, 420px) / 750);
}

.rp-mascot--corner {
  position: absolute;
  right: calc(16 * min(100vw, 420px) / 750);
  bottom: calc(env(safe-area-inset-bottom) + calc(24 * min(100vw, 420px) / 750));
  width: calc(200 * min(100vw, 420px) / 750);
  height: calc(200 * min(100vw, 420px) / 750);
  z-index: 5;
}

.rp-mascot--letter {
  width: calc(240 * min(100vw, 420px) / 750);
  height: calc(240 * min(100vw, 420px) / 750);
  margin: calc(16 * min(100vw, 420px) / 750) auto 0;
}

.rp-mascot--seal {
  width: calc(88 * min(100vw, 420px) / 750);
  height: calc(88 * min(100vw, 420px) / 750);
}

.rp-mascot--pose-float {
  animation: rpMascotFloat 3.2s ease-in-out infinite;
}

.rp-mascot--pose-cheer {
  animation: rpMascotCheer 2.4s ease-in-out infinite;
}

.rp-mascot--pose-point {
  animation: rpMascotPoint 2.8s ease-in-out infinite;
}

.rp-mascot--pose-proud {
  animation: rpMascotProud 3s ease-in-out infinite;
}

.rp-mascot--pose-think {
  animation: rpMascotThink 3.5s ease-in-out infinite;
}

.rp-mascot--pose-celebrate {
  animation: rpMascotCelebrate 1.8s ease-in-out infinite;
}

.rp-mascot--pose-wave {
  animation: rpMascotWave 2.2s ease-in-out infinite;
}

.rp-mascot--pose-bye {
  animation: rpMascotBye 2.6s ease-in-out infinite;
}

@keyframes rpMascotFloat {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-calc(16 * min(100vw, 420px) / 750));
  }
}

@keyframes rpMascotCheer {
  0%,
  100% {
    transform: scale(1) rotate(0deg);
  }
  40% {
    transform: scale(1.05) rotate(-4deg);
  }
  70% {
    transform: scale(1.02) rotate(4deg);
  }
}

@keyframes rpMascotPoint {
  0%,
  100% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(calc(12 * min(100vw, 420px) / 750)) scale(1.02);
  }
}

@keyframes rpMascotProud {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.04);
  }
}

@keyframes rpMascotThink {
  0%,
  100% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(-3deg) translateY(-calc(8 * min(100vw, 420px) / 750));
  }
}

@keyframes rpMascotCelebrate {
  0%,
  100% {
    transform: translateY(0) scale(1);
  }
  30% {
    transform: translateY(-calc(20 * min(100vw, 420px) / 750)) scale(1.06);
  }
  60% {
    transform: translateY(-calc(8 * min(100vw, 420px) / 750)) scale(1.02);
  }
}

@keyframes rpMascotWave {
  0%,
  100% {
    transform: rotate(0deg);
  }
  25% {
    transform: rotate(-8deg);
  }
  75% {
    transform: rotate(8deg);
  }
}

@keyframes rpMascotBye {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-calc(24 * min(100vw, 420px) / 750)) scale(1.03);
  }
}

/* 游戏化 · 雷达 + 血条 */
.rp-poster--game {
  overflow-y: auto;
}

.rp-game-radar {
  position: relative;
  margin: calc(8 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) 0;
  height: calc(340 * min(100vw, 420px) / 750);
  border-radius: calc(36 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.72);
  border: calc(3 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.95);
  box-shadow: var(--rp-clay-shadow);
  overflow: hidden;
}

.rp-game-radar__ring {
  position: absolute;
  inset: calc(16 * min(100vw, 420px) / 750);
  border-radius: 50%;
  border: calc(4 * min(100vw, 420px) / 750) dashed rgba(75, 175, 255, 0.35);
  animation: rpSpin 24s linear infinite;
}

.rp-poster--game .rp-radar-canvas {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
}

.rp-game-bars {
  margin: calc(16 * min(100vw, 420px) / 750) var(--rp-gutter-lg) calc(120 * min(100vw, 420px) / 750);
  display: flex;
  flex-direction: column;
  gap: calc(14 * min(100vw, 420px) / 750);
}

.rp-game-bar {
  padding: calc(16 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750);
  border-radius: calc(28 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) 0 rgba(30, 58, 95, 0.05);
}

.rp-game-bar__sym {
  font-size: calc(38 * min(100vw, 420px) / 750);
  line-height: 1;
}

.rp-game-bar__head {
  display: flex;
  align-items: center;
  gap: calc(8 * min(100vw, 420px) / 750);
}

.rp-game-bar__track {
  height: calc(24 * min(100vw, 420px) / 750);
  margin-top: calc(8 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: rgba(30, 58, 95, 0.08);
  overflow: hidden;
}

.rp-game-bar__fill {
  height: 100%;
  border-radius: calc(999 * min(100vw, 420px) / 750);
  transition: width 0.6s cubic-bezier(0.34, 1.2, 0.64, 1);
}

.rp-game-bar__meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: calc(8 * min(100vw, 420px) / 750);
}

.rp-game-bar__name {
  font-size: calc(30 * min(100vw, 420px) / 750);
  font-weight: 700;
  color: var(--rp-ink);
}

.rp-game-bar__hearts {
  font-size: calc(26 * min(100vw, 420px) / 750);
  letter-spacing: calc(2 * min(100vw, 420px) / 750);
}

/* 统计宫格 */
.rp-clay-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(16 * min(100vw, 420px) / 750);
  margin: calc(16 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750);
}

.rp-clay-tile {
  padding: calc(24 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750);
  text-align: center;
  border-radius: calc(32 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: var(--rp-clay-shadow);
}

.rp-clay-tile__icon {
  font-size: calc(48 * min(100vw, 420px) / 750);
}

.rp-clay-tile__val {
  display: block;
  margin-top: calc(8 * min(100vw, 420px) / 750);
  font-size: calc(46 * min(100vw, 420px) / 750);
  font-weight: 900;
  color: var(--rp-blue);
}

.rp-clay-tile__lbl {
  display: block;
  margin-top: calc(4 * min(100vw, 420px) / 750);
  font-size: calc(26 * min(100vw, 420px) / 750);
  color: #64748b;
}

.rp-medal-strip {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: calc(12 * min(100vw, 420px) / 750);
  margin: 0 var(--rp-gutter-lg) calc(24 * min(100vw, 420px) / 750);
  padding-bottom: calc(env(safe-area-inset-bottom) + calc(8 * min(100vw, 420px) / 750));
}

.rp-medal-badge {
  padding: calc(10 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750);
  font-size: calc(24 * min(100vw, 420px) / 750);
  font-weight: 700;
  color: var(--rp-ink);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: linear-gradient(135deg, #fef08a, #fde68a);
  box-shadow: var(--rp-clay-shadow);
}

/* 信笺 */
.rp-letter-head {
  display: flex;
  align-items: center;
  gap: calc(16 * min(100vw, 420px) / 750);
  padding-bottom: calc(16 * min(100vw, 420px) / 750);
  border-bottom: calc(2 * min(100vw, 420px) / 750) solid rgba(75, 175, 255, 0.2);
}

.rp-letter-brand {
  font-size: calc(32 * min(100vw, 420px) / 750);
  font-weight: 900;
  color: var(--rp-blue);
}

.rp-letter-scroll {
  flex: 1;
  min-height: 0;
  margin-top: calc(16 * min(100vw, 420px) / 750);
  max-height: none;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: calc(4 * min(100vw, 420px) / 750);
}

.rp-letter-p {
  display: block;
  line-height: 1.58;
  color: #334155;
  margin-bottom: calc(12 * min(100vw, 420px) / 750);
}

.rp-letter-p:last-child {
  margin-bottom: 0;
}

.rp-letter-empty {
  padding: calc(40 * min(100vw, 420px) / 750) 0;
  text-align: center;
  font-size: calc(28 * min(100vw, 420px) / 750);
  color: #94a3b8;
}

/* 封底 */
.rp-poster--end {
  align-items: center;
  justify-content: center;
  text-align: center;
}

.rp-end-year {
  font-weight: 900;
  line-height: 1;
  color: rgba(30, 58, 95, 0.1);
}

.rp-end-sub {
  display: block;
  margin-top: calc(12 * min(100vw, 420px) / 750);
  font-size: calc(34 * min(100vw, 420px) / 750);
  color: #475569;
}

.rp-poster--end .rp-title-round {
  color: var(--rp-ink);
}

.rp-state__text {
  color: var(--rp-ink);
  font-weight: 600;
}

/* 强叙事版封面：保留 Classyoo 卡通形象，改成宇宙舞台 */
.rp-scene--cover {
  background: linear-gradient(180deg, #351A84 0%, #5430BE 42%, #7146DF 72%, #A85CF2 100%) !important;
}

.rp-scene--cover .rp-deco {
  opacity: 0.52;
}

.rp-scene--cover .rp-orbit-path {
  border-color: rgba(255, 255, 255, 0.18);
}

.rp-scene--cover .rp-deco-emoji {
  color: #fff;
  opacity: 0.72;
}

.rp-scene--cover .rp-cover__quote {
  max-width: 88%;
  padding: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.9);
  line-height: 1.55;
  letter-spacing: calc(1 * min(100vw, 420px) / 750);
  text-align: var(--rp-block-tagline-align, var(--rp-.gr-book-text-align, left));
  align-self: var(--rp-block-tagline-self, flex-start);
  white-space: pre-line;
}

.rp-scene--cover .rp-cover__badge {
  align-self: var(--rp-block-badge-self, flex-start);
  text-align: var(--rp-block-badge-align, var(--rp-.gr-book-text-align, left));
}

.rp-scene--cover .rp-cover__title {
  text-align: var(--rp-block-title-align, var(--rp-.gr-book-text-align, left));
  align-self: var(--rp-block-title-self, flex-start);
  white-space: pre-line;
}

.rp-scene--cover .rp-cover__term {
  text-align: var(--rp-block-term-align, var(--rp-.gr-book-text-align, left));
  align-self: var(--rp-block-term-self, flex-start);
}

.rp-scene--cover .rp-cover__cta {
  align-self: var(--rp-block-cta-self, center);
}

.rp-scene--cover .rp-start-label {
  text-align: var(--rp-block-cta-align, var(--rp-.gr-book-text-align, center));
  white-space: pre-line;
}

.rp-scene--cover .rp-.gr-book--cover {
  padding-top: calc(env(safe-area-inset-top) + calc(142 * min(100vw, 420px) / 750));
  padding-bottom: calc(env(safe-area-inset-bottom) + calc(108 * min(100vw, 420px) / 750));
}

.rp-scene--cover .rp-cover__badge {
  margin-top: calc(14 * min(100vw, 420px) / 750);
  color: #fff;
  background: rgba(255, 255, 255, 0.16);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.22);
  box-shadow: none;
}

.rp-scene--cover .rp-cover__main {
  justify-content: flex-start;
  padding-top: calc(30 * min(100vw, 420px) / 750);
  align-items: stretch;
  width: 100%;
}

.rp-scene--cover .rp-cover__year {
  color: rgba(255, 255, 255, 0.12);
  text-shadow: none;
  text-align: var(--rp-block-year-align, var(--rp-.gr-book-text-align, left));
  align-self: var(--rp-block-year-self, flex-start);
}

.rp-scene--cover .rp-cover__title {
  margin-top: -calc(20 * min(100vw, 420px) / 750);
  color: #fff;
  line-height: 1.08;
  letter-spacing: calc(2 * min(100vw, 420px) / 750);
  -webkit-text-stroke: 0;
  text-shadow: 0 calc(12 * min(100vw, 420px) / 750) calc(26 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.35);
}

.rp-scene--cover .rp-cover__term {
  color: rgba(255, 255, 255, 0.78);
}

.rp-scene--cover .rp-cover__meta {
  color: #fff;
  background: rgba(255, 255, 255, 0.16);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.2);
}

.rp-cover__greeting {
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  margin-top: calc(20 * min(100vw, 420px) / 750);
  font-weight: 700;
  line-height: 1.5;
  color: #fff;
  white-space: pre-line;
  word-break: normal;
  overflow-wrap: break-word;
  text-align: var(--rp-block-greeting-align, var(--rp-.gr-book-text-align, left));
  align-self: stretch;
}

.rp-cover__story {
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  margin-top: calc(14 * min(100vw, 420px) / 750);
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.92);
  white-space: pre-line;
  word-break: normal;
  overflow-wrap: break-word;
  text-align: var(--rp-block-story-align, var(--rp-.gr-book-text-align, left));
  align-self: stretch;
}

.rp-first-card__line {
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.95);
  word-break: break-word;
  overflow-wrap: break-word;
}

.rp-end-share-hint {
  display: block;
  max-width: calc(560 * min(100vw, 420px) / 750);
  margin: 0 auto calc(16 * min(100vw, 420px) / 750);
  text-align: center;
}

.rp-scene--cover .rp-cover__stage {
  height: calc(330 * min(100vw, 420px) / 750);
  min-height: calc(330 * min(100vw, 420px) / 750);
  margin-top: -calc(18 * min(100vw, 420px) / 750);
  overflow: visible;
}

.rp-scene--cover .rp-cover__planet {
  bottom: calc(28 * min(100vw, 420px) / 750);
  width: calc(500 * min(100vw, 420px) / 750);
  height: calc(146 * min(100vw, 420px) / 750);
  margin-left: -calc(250 * min(100vw, 420px) / 750);
  background:
    radial-gradient(ellipse at 36% 20%, rgba(255, 255, 255, 0.64), transparent 22%),
    linear-gradient(180deg, #c4a1ff 0%, #8b5cf6 48%, #6d28d9 100%);
  box-shadow:
    inset 0 calc(18 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) rgba(255, 255, 255, 0.16),
    0 calc(28 * min(100vw, 420px) / 750) calc(46 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.24);
}

.rp-scene--cover .rp-clay-cloud {
  display: none;
}

.rp-scene--cover .rp-mascot--cover {
  width: calc(430 * min(100vw, 420px) / 750);
  height: calc(430 * min(100vw, 420px) / 750);
  margin-bottom: -calc(18 * min(100vw, 420px) / 750);
}

.rp-scene--cover .rp-cover__cta {
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(env(safe-area-inset-bottom) + calc(34 * min(100vw, 420px) / 750));
  z-index: 6;
}

.rp-scene--cover .rp-start-btn {
  width: calc(104 * min(100vw, 420px) / 750);
  height: calc(104 * min(100vw, 420px) / 750);
  background: #fff;
  box-shadow: 0 calc(16 * min(100vw, 420px) / 750) calc(34 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.24);
}

.rp-scene--cover .rp-start-label {
  color: rgba(255, 255, 255, 0.84);
}

/* 插画道具层：用小程序原生 view 搭建，避免只有文字和数字 */
.rp-illust-props,
.rp-radar-scene,
.rp-stat-illustration,
.rp-letter-illust,
.rp-end-illust {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}

.rp-illust-cloud {
  position: absolute;
  width: calc(112 * min(100vw, 420px) / 750);
  height: calc(42 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(226, 232, 240, 0.7));
  box-shadow:
    calc(30 * min(100vw, 420px) / 750) -calc(14 * min(100vw, 420px) / 750) 0 rgba(255, 255, 255, 0.82),
    calc(62 * min(100vw, 420px) / 750) calc(2 * min(100vw, 420px) / 750) 0 rgba(255, 255, 255, 0.7);
}

.rp-illust-cloud--left {
  left: calc(70 * min(100vw, 420px) / 750);
  top: calc(84 * min(100vw, 420px) / 750);
}

.rp-illust-cloud--right {
  right: calc(94 * min(100vw, 420px) / 750);
  top: calc(40 * min(100vw, 420px) / 750);
  transform: scale(0.78);
  opacity: 0.88;
}

.rp-illust-book {
  position: absolute;
  left: calc(86 * min(100vw, 420px) / 750);
  bottom: calc(88 * min(100vw, 420px) / 750);
  width: calc(92 * min(100vw, 420px) / 750);
  height: calc(64 * min(100vw, 420px) / 750);
  border-radius: calc(12 * min(100vw, 420px) / 750) calc(8 * min(100vw, 420px) / 750) calc(10 * min(100vw, 420px) / 750) calc(12 * min(100vw, 420px) / 750);
  background: linear-gradient(135deg, #fb7185, #f97316);
  transform: rotate(-16deg);
  box-shadow: calc(10 * min(100vw, 420px) / 750) calc(10 * min(100vw, 420px) / 750) 0 rgba(59, 130, 246, 0.55), calc(18 * min(100vw, 420px) / 750) calc(18 * min(100vw, 420px) / 750) 0 rgba(250, 204, 21, 0.42);
}

.rp-illust-book::after {
  content: '';
  position: absolute;
  left: calc(12 * min(100vw, 420px) / 750);
  top: calc(12 * min(100vw, 420px) / 750);
  width: calc(46 * min(100vw, 420px) / 750);
  height: calc(6 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 calc(18 * min(100vw, 420px) / 750) 0 rgba(255, 255, 255, 0.45);
}

.rp-illust-pencil {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.rp-illust-flag {
  position: absolute;
  left: 48%;
  bottom: calc(176 * min(100vw, 420px) / 750);
  width: calc(8 * min(100vw, 420px) / 750);
  height: calc(104 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.86);
  transform: rotate(-6deg);
}

.rp-illust-flag::after {
  content: '';
  position: absolute;
  left: calc(8 * min(100vw, 420px) / 750);
  top: calc(8 * min(100vw, 420px) / 750);
  width: calc(74 * min(100vw, 420px) / 750);
  height: calc(46 * min(100vw, 420px) / 750);
  border-radius: calc(8 * min(100vw, 420px) / 750) calc(18 * min(100vw, 420px) / 750) calc(18 * min(100vw, 420px) / 750) calc(8 * min(100vw, 420px) / 750);
  background: linear-gradient(135deg, #fef08a, #f97316);
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(18 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.12);
}

.rp-illust-block {
  position: absolute;
  width: calc(52 * min(100vw, 420px) / 750);
  height: calc(52 * min(100vw, 420px) / 750);
  border-radius: calc(12 * min(100vw, 420px) / 750);
  background: linear-gradient(135deg, #7dd3fc, #38bdf8);
  box-shadow: 0 calc(12 * min(100vw, 420px) / 750) calc(18 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.14);
}

.rp-illust-block--a {
  left: calc(122 * min(100vw, 420px) / 750);
  bottom: calc(154 * min(100vw, 420px) / 750);
  transform: rotate(16deg);
}

.rp-illust-block--b {
  right: calc(132 * min(100vw, 420px) / 750);
  bottom: calc(172 * min(100vw, 420px) / 750);
  background: linear-gradient(135deg, #c4b5fd, #a78bfa);
  transform: rotate(-18deg);
}

.rp-illust-shield {
  position: absolute;
  right: calc(110 * min(100vw, 420px) / 750);
  bottom: calc(132 * min(100vw, 420px) / 750);
  width: calc(88 * min(100vw, 420px) / 750);
  height: calc(104 * min(100vw, 420px) / 750);
  border-radius: calc(28 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) calc(42 * min(100vw, 420px) / 750) calc(42 * min(100vw, 420px) / 750);
  background: linear-gradient(160deg, #93c5fd, #7c3aed);
  box-shadow: inset 0 calc(10 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750) rgba(255, 255, 255, 0.22), 0 calc(14 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.16);
}

.rp-illust-shield::after {
  content: '✓';
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fde047;
  font-size: calc(48 * min(100vw, 420px) / 750);
  font-weight: 900;
}

.rp-illust-card {
  position: absolute;
  width: calc(82 * min(100vw, 420px) / 750);
  height: calc(60 * min(100vw, 420px) / 750);
  border-radius: calc(12 * min(100vw, 420px) / 750);
  background: linear-gradient(135deg, #fff, #bfdbfe);
  box-shadow: 0 calc(14 * min(100vw, 420px) / 750) calc(22 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.14);
}

.rp-illust-card--a {
  left: calc(86 * min(100vw, 420px) / 750);
  bottom: calc(160 * min(100vw, 420px) / 750);
  transform: rotate(-20deg);
}

.rp-illust-card--b {
  right: calc(86 * min(100vw, 420px) / 750);
  top: calc(84 * min(100vw, 420px) / 750);
  transform: rotate(16deg);
  background: linear-gradient(135deg, #fff7ed, #fbcfe8);
}

.rp-illust-star-medal {
  position: absolute;
  left: 50%;
  top: calc(18 * min(100vw, 420px) / 750);
  width: calc(104 * min(100vw, 420px) / 750);
  height: calc(104 * min(100vw, 420px) / 750);
  margin-left: -calc(52 * min(100vw, 420px) / 750);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #92400e;
  font-size: calc(60 * min(100vw, 420px) / 750);
  font-weight: 900;
  background: linear-gradient(135deg, #fef08a, #facc15);
  box-shadow: 0 calc(16 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) rgba(250, 204, 21, 0.2);
}

.rp-illust-footprint {
  position: absolute;
  left: calc(86 * min(100vw, 420px) / 750);
  bottom: calc(42 * min(100vw, 420px) / 750);
  width: calc(36 * min(100vw, 420px) / 750);
  height: calc(24 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: rgba(14, 165, 233, 0.28);
  box-shadow: calc(50 * min(100vw, 420px) / 750) calc(18 * min(100vw, 420px) / 750) 0 rgba(14, 165, 233, 0.2), calc(98 * min(100vw, 420px) / 750) -calc(6 * min(100vw, 420px) / 750) 0 rgba(14, 165, 233, 0.16);
  transform: rotate(-12deg);
}

.rp-radar-scene {
  z-index: 1;
  opacity: 0.82;
}

.rp-radar-scene__planet {
  position: absolute;
  right: calc(36 * min(100vw, 420px) / 750);
  bottom: calc(28 * min(100vw, 420px) / 750);
  width: calc(120 * min(100vw, 420px) / 750);
  height: calc(70 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: linear-gradient(180deg, #c4b5fd, #7c3aed);
}

.rp-radar-scene__scope {
  position: absolute;
  left: calc(42 * min(100vw, 420px) / 750);
  bottom: calc(50 * min(100vw, 420px) / 750);
  width: calc(106 * min(100vw, 420px) / 750);
  height: calc(28 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: linear-gradient(90deg, #38bdf8, #1d4ed8);
  transform: rotate(-20deg);
}

.rp-radar-scene__scope::after {
  content: '';
  position: absolute;
  right: -calc(18 * min(100vw, 420px) / 750);
  top: -calc(10 * min(100vw, 420px) / 750);
  width: calc(46 * min(100vw, 420px) / 750);
  height: calc(46 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.82);
  border: calc(8 * min(100vw, 420px) / 750) solid #38bdf8;
}

.rp-radar-scene__star {
  position: absolute;
  width: calc(18 * min(100vw, 420px) / 750);
  height: calc(18 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: #facc15;
  box-shadow: 0 0 calc(18 * min(100vw, 420px) / 750) rgba(250, 204, 21, 0.85);
}

.rp-radar-scene__star--a {
  left: calc(150 * min(100vw, 420px) / 750);
  top: calc(54 * min(100vw, 420px) / 750);
}

.rp-radar-scene__star--b {
  right: calc(160 * min(100vw, 420px) / 750);
  top: calc(88 * min(100vw, 420px) / 750);
  transform: scale(0.7);
}

.rp-stat-illustration {
  position: relative;
  height: calc(138 * min(100vw, 420px) / 750);
  margin-top: calc(12 * min(100vw, 420px) / 750);
}

.rp-stat-illustration .rp-illust-shield {
  right: calc(70 * min(100vw, 420px) / 750);
  bottom: calc(8 * min(100vw, 420px) / 750);
}

.rp-stat-illustration .rp-illust-footprint {
  left: calc(80 * min(100vw, 420px) / 750);
  bottom: calc(26 * min(100vw, 420px) / 750);
}

.rp-letter-illust {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.rp-letter-illust .rp-illust-cloud--left {
  left: auto;
  right: calc(38 * min(100vw, 420px) / 750);
  top: calc(42 * min(100vw, 420px) / 750);
  opacity: 0.42;
  transform: scale(0.62);
}

.rp-letter-illust .rp-illust-pencil {
  right: calc(28 * min(100vw, 420px) / 750);
  bottom: calc(38 * min(100vw, 420px) / 750);
  opacity: 0.35;
}

.rp-letter-illust .rp-illust-card--a {
  left: calc(34 * min(100vw, 420px) / 750);
  bottom: calc(44 * min(100vw, 420px) / 750);
  opacity: 0.34;
}

.rp-end-illust {
  position: relative;
  width: 100%;
  height: calc(240 * min(100vw, 420px) / 750);
  z-index: 2;
}

.rp-end-illust .rp-milestone-planet {
  left: 50%;
  bottom: calc(12 * min(100vw, 420px) / 750);
}

.rp-end-illust .rp-illust-flag {
  left: 56%;
  bottom: calc(84 * min(100vw, 420px) / 750);
}

.rp-end-illust .rp-illust-cloud--left {
  left: calc(84 * min(100vw, 420px) / 750);
  top: calc(54 * min(100vw, 420px) / 750);
  transform: scale(0.7);
}

.rp-end-illust .rp-illust-book {
  left: auto;
  right: calc(104 * min(100vw, 420px) / 750);
  bottom: calc(54 * min(100vw, 420px) / 750);
}

.rp-end-share {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  margin: calc(20 * min(100vw, 420px) / 750) auto 0;
  width: auto;
  min-width: calc(280 * min(100vw, 420px) / 750);
  max-width: calc(100% - calc(64 * min(100vw, 420px) / 750));
  min-height: calc(76 * min(100vw, 420px) / 750);
  height: auto;
  line-height: 1.35;
  padding: calc(18 * min(100vw, 420px) / 750) calc(36 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  color: #351a84;
  font-size: calc(26 * min(100vw, 420px) / 750);
  font-weight: 900;
  text-align: center;
  white-space: normal;
  word-break: break-word;
  background: linear-gradient(135deg, #fff, #fef08a);
  box-shadow: 0 calc(16 * min(100vw, 420px) / 750) calc(34 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.22);
}

.rp-end-share::after {
  border: none;
}

/* ---- report-milestone.wxss ---- */
/* ═══════════════════════════════════════
   成长宇宙之旅 · 期末报告视觉升级
   ═══════════════════════════════════════ */
.gr-book {
  --rp-gold: #facc15;
  --rp-sky: #38bdf8;
  --rp-magic: #8b5cf6;
  --rp-neon: 0 calc(8 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(56, 189, 248, 0.32);
  --rp-glass-bg: rgba(255, 255, 255, 0.74);
}

.rp-book {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.3), transparent 42%),
    #dff7ff;
}

.rp-scene {
  opacity: 1;
}

/* 全页底部半弧装饰已关闭（原 ::after 椭圆 clip-path + 底部星球/光晕） */
.rp-scene::after,
.rp-scene--cover::after,
.rp-scene--universe_intro::after,
.rp-scene--pet_journey::after,
.rp-scene--milestone::after,
.rp-scene--persona::after,
.rp-scene--finale::after,
.rp-scene--radar::after,
.rp-scene--stats::after,
.rp-scene--comment::after,
.rp-scene--end::after,
.rp-scene--first_memories::after,
.rp-scene--milestones_bridge::after {
  display: none !important;
  content: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  clip-path: none !important;
  background: none !important;
  pointer-events: none !important;
}

.rp-cover__planet,
.rp-planet-road,
.rp-milestone-planet,
.rp-milestone-ring {
  display: none !important;
  visibility: hidden !important;
}

.rp-deco {
  opacity: 0.78;
  background-image:
    radial-gradient(calc(2 * min(100vw, 420px) / 750) calc(2 * min(100vw, 420px) / 750) at 14% 20%, rgba(255, 255, 255, 0.95), transparent),
    radial-gradient(calc(3 * min(100vw, 420px) / 750) calc(3 * min(100vw, 420px) / 750) at 82% 18%, rgba(255, 255, 255, 0.9), transparent),
    radial-gradient(calc(2 * min(100vw, 420px) / 750) calc(2 * min(100vw, 420px) / 750) at 66% 52%, rgba(255, 255, 255, 0.72), transparent),
    radial-gradient(calc(2 * min(100vw, 420px) / 750) calc(2 * min(100vw, 420px) / 750) at 18% 70%, rgba(255, 255, 255, 0.82), transparent);
}

.rp-orbit-path {
  position: absolute;
  z-index: 1;
  pointer-events: none;
  border: calc(2 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.34);
  border-radius: 50%;
  transform: rotate(-18deg);
}

.rp-orbit-path--a {
  width: calc(760 * min(100vw, 420px) / 750);
  height: calc(260 * min(100vw, 420px) / 750);
  left: -calc(210 * min(100vw, 420px) / 750);
  top: calc(150 * min(100vw, 420px) / 750);
}

.rp-orbit-path--b {
  width: calc(640 * min(100vw, 420px) / 750);
  height: calc(210 * min(100vw, 420px) / 750);
  right: -calc(260 * min(100vw, 420px) / 750);
  bottom: calc(190 * min(100vw, 420px) / 750);
  transform: rotate(18deg);
  opacity: 0.6;
}

.rp-comet {
  position: absolute;
  z-index: 2;
  right: calc(86 * min(100vw, 420px) / 750);
  top: calc(138 * min(100vw, 420px) / 750);
  width: calc(96 * min(100vw, 420px) / 750);
  height: calc(8 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.96));
  transform: rotate(-28deg);
  animation: rpComet 4.8s ease-in-out infinite;
}

@keyframes rpComet {
  0%,
  58%,
  100% {
    opacity: 0;
    transform: translate3d(0, 0, 0) rotate(-28deg);
  }
  68% {
    opacity: 1;
  }
  82% {
    opacity: 0;
    transform: translate3d(-calc(160 * min(100vw, 420px) / 750), calc(86 * min(100vw, 420px) / 750), 0) rotate(-28deg);
  }
}

.rp-topbar {
  padding-bottom: calc(8 * min(100vw, 420px) / 750);
}

.rp-topbar__brand {
  font-size: calc(22 * min(100vw, 420px) / 750);
  letter-spacing: calc(3 * min(100vw, 420px) / 750);
}

.rp-topbar__share,
.rp-topbar__back {
  min-height: calc(60 * min(100vw, 420px) / 750);
}

.rp-topbar__share {
  color: #92400e;
  background: linear-gradient(135deg, #fff7ad, #facc15);
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) 0 rgba(146, 64, 14, 0.08), 0 calc(18 * min(100vw, 420px) / 750) calc(30 * min(100vw, 420px) / 750) rgba(250, 204, 21, 0.18);
}

.rp-.gr-book--cover {
  padding-left: calc(38 * min(100vw, 420px) / 750);
  padding-right: calc(38 * min(100vw, 420px) / 750);
}

.rp-cover__quote {
  max-width: 92%;
  padding: calc(12 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.62);
  letter-spacing: calc(2 * min(100vw, 420px) / 750);
}

.rp-cover__main {
  padding-bottom: 0;
  justify-content: center;
}

.rp-cover__year {
  letter-spacing: 0;
}

.rp-cover__title {
  margin-top: -calc(16 * min(100vw, 420px) / 750);
  line-height: 1.12;
  letter-spacing: calc(4 * min(100vw, 420px) / 750);
}

.rp-cover__term {
  margin-top: calc(22 * min(100vw, 420px) / 750);
}

.rp-cover__meta {
  display: inline-block;
  align-self: var(--rp-block-meta-self, flex-start);
  text-align: var(--rp-block-meta-align, var(--rp-.gr-book-text-align, left));
  margin-top: calc(14 * min(100vw, 420px) / 750);
  padding: calc(10 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.72);
}

.rp-cover__stage {
  height: calc(310 * min(100vw, 420px) / 750);
}

.rp-cover__planet {
  position: absolute;
  left: 50%;
  bottom: calc(32 * min(100vw, 420px) / 750);
  width: calc(430 * min(100vw, 420px) / 750);
  height: calc(96 * min(100vw, 420px) / 750);
  margin-left: -calc(215 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(125, 211, 252, 0.36));
  box-shadow: inset 0 -calc(10 * min(100vw, 420px) / 750) calc(22 * min(100vw, 420px) / 750) rgba(14, 165, 233, 0.12), 0 calc(16 * min(100vw, 420px) / 750) calc(36 * min(100vw, 420px) / 750) rgba(15, 23, 42, 0.08);
}

.rp-clay-cloud {
  bottom: calc(58 * min(100vw, 420px) / 750);
  opacity: 0.82;
}

.rp-cover__cta {
  align-items: center;
  padding-right: 0;
}

.rp-start-label {
  letter-spacing: calc(2 * min(100vw, 420px) / 750);
}

.rp-poster {
  padding-top: calc(env(safe-area-inset-top) + calc(128 * min(100vw, 420px) / 750));
  gap: calc(12 * min(100vw, 420px) / 750);
}

.rp-sticker {
  position: relative;
  z-index: 4;
  margin-bottom: calc(6 * min(100vw, 420px) / 750);
  border: calc(3 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.8);
}

.rp-sticker--violet {
  background: linear-gradient(135deg, #ddd6fe, #c4b5fd);
}

.rp-clay-card {
  position: relative;
  z-index: 3;
  border-radius: calc(34 * min(100vw, 420px) / 750);
  box-shadow:
    0 calc(12 * min(100vw, 420px) / 750) 0 rgba(30, 58, 95, 0.05),
    0 calc(28 * min(100vw, 420px) / 750) calc(50 * min(100vw, 420px) / 750) rgba(15, 23, 42, 0.1);
}

.rp-clay-card--hero,
.rp-clay-card--story,
.rp-clay-card--persona {
  max-height: none;
}

.rp-clay-card--story {
  padding-bottom: calc(30 * min(100vw, 420px) / 750);
}

.rp-clay-card__tag {
  color: #0284c7;
  font-size: calc(23 * min(100vw, 420px) / 750);
  letter-spacing: calc(2 * min(100vw, 420px) / 750);
}

.rp-clay-card__line:not([class*='rp-blk-']) {
  font-size: calc(30 * min(100vw, 420px) / 750);
  line-height: 1.55;
}

.rp-clay-card__quote {
  background: rgba(224, 242, 254, 0.72);
  border-top: none;
  border-radius: calc(20 * min(100vw, 420px) / 750);
  padding: calc(14 * min(100vw, 420px) / 750) calc(18 * min(100vw, 420px) / 750);
}

.rp-num-hero__val {
  font-size: calc(138 * min(100vw, 420px) / 750);
  color: #0284c7;
}

.rp-num-hero__unit {
  font-size: calc(42 * min(100vw, 420px) / 750);
}

.rp-journey-line {
  margin-top: calc(22 * min(100vw, 420px) / 750);
  padding: calc(18 * min(100vw, 420px) / 750) calc(6 * min(100vw, 420px) / 750) calc(8 * min(100vw, 420px) / 750);
  display: flex;
  justify-content: space-between;
  border-top: calc(3 * min(100vw, 420px) / 750) dashed rgba(56, 189, 248, 0.34);
}

.rp-journey-node {
  width: 31%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(8 * min(100vw, 420px) / 750);
}

.rp-journey-node__dot {
  width: calc(44 * min(100vw, 420px) / 750);
  height: calc(44 * min(100vw, 420px) / 750);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #0f172a;
  font-size: calc(22 * min(100vw, 420px) / 750);
  font-weight: 900;
  background: linear-gradient(135deg, #fef08a, #7dd3fc);
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(18 * min(100vw, 420px) / 750) rgba(14, 165, 233, 0.18);
}

.rp-journey-node__label {
  font-size: calc(21 * min(100vw, 420px) / 750);
  line-height: 1.25;
  color: #64748b;
  text-align: center;
}

.rp-visual {
  z-index: 3;
  padding-bottom: calc(env(safe-area-inset-bottom) + calc(18 * min(100vw, 420px) / 750));
}

.rp-planet-road {
  position: absolute;
  left: 12%;
  right: 12%;
  bottom: calc(82 * min(100vw, 420px) / 750);
  height: calc(84 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.62), rgba(167, 243, 208, 0.32));
}

.rp-milestone-planet {
  position: absolute;
  left: 50%;
  bottom: calc(70 * min(100vw, 420px) / 750);
  width: calc(360 * min(100vw, 420px) / 750);
  height: calc(92 * min(100vw, 420px) / 750);
  margin-left: -calc(180 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(203, 213, 225, 0.28));
}

.rp-milestone-ring {
  position: absolute;
  left: 50%;
  bottom: calc(120 * min(100vw, 420px) / 750);
  width: calc(410 * min(100vw, 420px) / 750);
  height: calc(120 * min(100vw, 420px) / 750);
  margin-left: -calc(205 * min(100vw, 420px) / 750);
  border: calc(3 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.44);
  border-radius: 50%;
  transform: rotate(-8deg);
}

.rp-visual__icon {
  margin-bottom: calc(20 * min(100vw, 420px) / 750);
  font-size: calc(116 * min(100vw, 420px) / 750);
}

.rp-mascot--cover {
  width: calc(390 * min(100vw, 420px) / 750);
  height: calc(390 * min(100vw, 420px) / 750);
}

.rp-mascot--hero {
  width: calc(390 * min(100vw, 420px) / 750);
  height: calc(390 * min(100vw, 420px) / 750);
}

.rp-mascot--mark {
  width: calc(270 * min(100vw, 420px) / 750);
  height: calc(270 * min(100vw, 420px) / 750);
  margin-top: -calc(34 * min(100vw, 420px) / 750);
}

.rp-visual__buddy {
  margin-top: -calc(44 * min(100vw, 420px) / 750);
  padding: calc(8 * min(100vw, 420px) / 750) calc(18 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.7);
  font-size: calc(24 * min(100vw, 420px) / 750);
  line-height: 1.2;
  max-width: 80%;
  text-align: center;
  align-self: center;
}

.rp-clay-card--persona {
  text-align: center;
  background:
    linear-gradient(165deg, rgba(255, 255, 255, 0.96), rgba(255, 247, 237, 0.94)),
    linear-gradient(135deg, #fef08a, #fbcfe8);
}

.rp-persona-you {
  font-size: calc(30 * min(100vw, 420px) / 750);
}

.rp-persona-medal {
  position: absolute;
  left: calc(112 * min(100vw, 420px) / 750);
  top: calc(52 * min(100vw, 420px) / 750);
  z-index: 1;
  font-size: calc(70 * min(100vw, 420px) / 750);
  color: #f59e0b;
  opacity: 0.55;
  animation: rpFloat 3.4s ease-in-out infinite;
}

.rp-persona-medal--right {
  left: auto;
  right: calc(96 * min(100vw, 420px) / 750);
  top: calc(112 * min(100vw, 420px) / 750);
  animation-delay: 0.7s;
}

.rp-game-radar {
  height: calc(318 * min(100vw, 420px) / 750);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(236, 254, 255, 0.82));
}

.rp-game-bars {
  margin-bottom: calc(108 * min(100vw, 420px) / 750);
  gap: calc(12 * min(100vw, 420px) / 750);
}

.rp-game-bar {
  padding: calc(14 * min(100vw, 420px) / 750) calc(18 * min(100vw, 420px) / 750);
  border: calc(2 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.7);
}

.rp-game-bar__name {
  font-size: calc(28 * min(100vw, 420px) / 750);
}

.rp-game-bar__hearts {
  max-width: calc(190 * min(100vw, 420px) / 750);
  white-space: nowrap;
  overflow: hidden;
}

.rp-clay-card--stat {
  padding-top: calc(28 * min(100vw, 420px) / 750);
}

.rp-clay-grid {
  gap: calc(14 * min(100vw, 420px) / 750);
}

.rp-clay-tile {
  padding: calc(20 * min(100vw, 420px) / 750) calc(12 * min(100vw, 420px) / 750);
}

.rp-clay-tile__val {
  font-size: calc(40 * min(100vw, 420px) / 750);
  word-break: break-all;
}

.rp-scene--stats .rp-medal-strip {
  max-height: none;
  overflow: visible;
  flex-shrink: 0;
  margin-bottom: calc(32 * min(100vw, 420px) / 750);
}

.rp-clay-card--letter {
  margin-bottom: 0;
  overflow: hidden;
  padding-bottom: calc(24 * min(100vw, 420px) / 750);
}

.rp-letter-scroll {
  max-height: none;
}

.rp-letter-p {
  font-size: calc(31 * min(100vw, 420px) / 750);
}

.rp-poster--end {
  padding-left: calc(36 * min(100vw, 420px) / 750);
  padding-right: calc(36 * min(100vw, 420px) / 750);
}

.rp-end-year {
  font-size: calc(170 * min(100vw, 420px) / 750);
}

.rp-poster--end .rp-title-round {
  font-size: calc(62 * min(100vw, 420px) / 750);
}

.rp-flip-hint {
  left: 50%;
  right: auto;
  bottom: calc(env(safe-area-inset-bottom) + calc(12 * min(100vw, 420px) / 750));
  transform: translateX(-50%);
  width: max-content;
  max-width: 88%;
  min-width: 0;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 calc(10 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(15, 23, 42, 0.08);
}

@media (max-height: 700px) {
  .rp-cover__stage {
    height: calc(250 * min(100vw, 420px) / 750);
  }

  .rp-mascot--cover,
  .rp-mascot--hero {
    width: calc(330 * min(100vw, 420px) / 750);
    height: calc(330 * min(100vw, 420px) / 750);
  }

  .rp-clay-card {
    padding: calc(24 * min(100vw, 420px) / 750) calc(26 * min(100vw, 420px) / 750) calc(22 * min(100vw, 420px) / 750);
  }

  .rp-clay-card__line {
    font-size: calc(28 * min(100vw, 420px) / 750);
    line-height: 1.45;
  }

  .rp-num-hero__val {
    font-size: calc(112 * min(100vw, 420px) / 750);
  }

  .rp-game-radar {
    height: calc(400 * min(100vw, 420px) / 750);
  }
}

/* NPLUS 参考图取向：宇宙页/里程碑/人设改为深色舞台、少卡片感 */
.rp-scene--pet_journey .rp-deco,
.rp-scene--milestone .rp-deco,
.rp-scene--persona .rp-deco {
  opacity: 0.48;
}

.rp-scene--pet_journey .rp-orbit-path,
.rp-scene--milestone .rp-orbit-path,
.rp-scene--persona .rp-orbit-path {
  border-color: rgba(255, 255, 255, 0.18);
}

.rp-scene--pet_journey .rp-sticker,
.rp-scene--persona .rp-sticker {
  margin-left: calc(48 * min(100vw, 420px) / 750);
  color: #fff;
  background: transparent;
  border: none;
  box-shadow: none;
  transform: none;
  padding: 0;
  font-size: calc(25 * min(100vw, 420px) / 750);
  font-weight: 600;
  letter-spacing: calc(1 * min(100vw, 420px) / 750);
  opacity: 0.9;
}

.rp-scene--pet_journey .rp-clay-card--pet-story,
.rp-scene--milestone .rp-clay-card--story,
.rp-scene--persona .rp-clay-card--persona {
  margin: 0 var(--rp-gutter-lg);
  padding: calc(10 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) 0;
  background: transparent;
  border: none;
  box-shadow: none;
  backdrop-filter: none;
  text-align: left;
  align-items: flex-start;
  box-sizing: border-box;
  max-width: calc(100% - var(--rp-gutter-lg) * 2);
}

.rp-scene--pet_journey .rp-clay-card__tag,
.rp-scene--milestone .rp-clay-card__tag,
.rp-scene--persona .rp-clay-card__tag {
  color: rgba(255, 255, 255, 0.8);
  font-weight: 500;
  letter-spacing: calc(1 * min(100vw, 420px) / 750);
}

.rp-scene--pet_journey .rp-title-round--dark,
.rp-scene--milestone .rp-title-round--dark,
.rp-scene--persona .rp-title-round--gold {
  color: #fff;
  -webkit-text-fill-color: #fff;
  background: none;
  text-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(38, 18, 105, 0.2);
  -webkit-text-stroke: 0;
  letter-spacing: calc(1 * min(100vw, 420px) / 750);
  line-height: 1.18;
  white-space: pre-line;
  word-break: break-word;
  overflow-wrap: break-word;
}

.rp-num-hero__val.rp-blk-num {
  font-size: var(--rp-block-num-size);
}

.rp-scene--pet_journey .rp-clay-card__line,
.rp-scene--milestone .rp-clay-card__line,
.rp-scene--persona .rp-clay-card__line {
  color: rgba(255, 255, 255, 0.94);
  line-height: 1.72;
  margin-top: calc(16 * min(100vw, 420px) / 750);
  display: block;
  white-space: pre-line;
  word-break: break-word;
  overflow-wrap: break-word;
  max-width: 100%;
  box-sizing: border-box;
}

.rp-scene--pet_journey .rp-tag-pill,
.rp-scene--milestone .rp-tag-pill,
.rp-scene--persona .rp-tag-pill {
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
  box-shadow: none;
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.22);
}

.rp-scene--milestone .rp-tag-pill--date {
  margin-top: calc(18 * min(100vw, 420px) / 750);
  font-size: calc(28 * min(100vw, 420px) / 750);
}

.rp-scene--milestone .rp-clay-card__quote {
  color: #fff;
  background: rgba(255, 255, 255, 0.12);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.18);
}

.rp-memory-label {
  display: inline-flex;
  margin-top: calc(14 * min(100vw, 420px) / 750);
  padding: calc(8 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  color: #fff;
  font-size: calc(24 * min(100vw, 420px) / 750);
  font-weight: 800;
  background: rgba(255, 255, 255, 0.16);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.22);
}

.rp-poster--pet {
  gap: calc(10 * min(100vw, 420px) / 750);
}

.rp-pet-evolution {
  position: relative;
  z-index: 4;
  margin: calc(20 * min(100vw, 420px) / 750) calc(48 * min(100vw, 420px) / 750) 0;
  display: grid;
  grid-template-columns: 1fr calc(72 * min(100vw, 420px) / 750) 1fr;
  align-items: center;
}

.rp-pet-form-card {
  min-height: calc(194 * min(100vw, 420px) / 750);
  padding: calc(18 * min(100vw, 420px) / 750) calc(12 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750);
  border-radius: calc(28 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.16);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.24);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.rp-pet-form-card--now {
  background: rgba(255, 255, 255, 0.22);
  box-shadow: 0 calc(16 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.12);
}

.rp-pet-form-card__label {
  font-size: calc(23 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.72);
}

.rp-pet-form-card__img {
  width: calc(118 * min(100vw, 420px) / 750);
  height: calc(104 * min(100vw, 420px) / 750);
  margin-top: calc(8 * min(100vw, 420px) / 750);
}

.rp-pet-form-card__emoji {
  margin-top: calc(12 * min(100vw, 420px) / 750);
  font-size: calc(74 * min(100vw, 420px) / 750);
  line-height: 1;
}

.rp-pet-form-card__name {
  margin-top: calc(8 * min(100vw, 420px) / 750);
  font-size: calc(25 * min(100vw, 420px) / 750);
  line-height: 1.25;
  color: #fff;
  font-weight: 800;
  text-align: center;
}

.rp-pet-evolution__arrow {
  color: #fff;
  font-size: calc(46 * min(100vw, 420px) / 750);
  font-weight: 900;
  text-align: center;
}

.rp-visual--pet {
  min-height: calc(260 * min(100vw, 420px) / 750);
}

.rp-illust-props--pet .rp-illust-footprint {
  left: calc(96 * min(100vw, 420px) / 750);
  bottom: calc(88 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.34);
  box-shadow: calc(48 * min(100vw, 420px) / 750) calc(18 * min(100vw, 420px) / 750) 0 rgba(255, 255, 255, 0.22), calc(96 * min(100vw, 420px) / 750) -calc(6 * min(100vw, 420px) / 750) 0 rgba(255, 255, 255, 0.16);
}

.rp-illust-props--pet .rp-illust-book {
  right: calc(82 * min(100vw, 420px) / 750);
  left: auto;
  bottom: calc(110 * min(100vw, 420px) / 750);
}

.rp-scene--persona .rp-persona-you {
  color: rgba(255, 255, 255, 0.78);
}

.rp-scene--persona .rp-tag-row {
  justify-content: flex-start;
}

.rp-scene--pet_journey .rp-visual,
.rp-scene--milestone .rp-visual,
.rp-scene--persona .rp-visual {
  margin-top: auto;
  min-height: calc(320 * min(100vw, 420px) / 750);
  background: transparent;
}

/* 里程碑 · 章节行与正文同一左栏 */
.rp-scene--milestone .rp-poster--milestone {
  text-align: left;
  align-items: stretch;
  justify-content: flex-start;
}

.rp-milestone-footer {
  margin-top: auto;
  flex-shrink: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  padding: calc(12 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) 0;
  min-height: calc(300 * min(100vw, 420px) / 750);
  box-sizing: border-box;
  pointer-events: none;
  z-index: 6;
}

.rp-scene--milestone .rp-mascot--milestone-foot {
  width: calc(380 * min(100vw, 420px) / 750);
  height: calc(380 * min(100vw, 420px) / 750);
  opacity: 0.96;
}

.rp-scene--milestone .rp-clay-card--story {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0 calc(28 * min(100vw, 420px) / 750);
}

.rp-scene--milestone .rp-milestone-station {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 0 0 calc(10 * min(100vw, 420px) / 750);
  padding: 0;
  text-align: left;
  align-self: flex-start;
  color: rgba(255, 255, 255, 0.92);
  font-size: var(--rp-block-tag-size, calc(25 * min(100vw, 420px) / 750));
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: calc(0.5 * min(100vw, 420px) / 750);
  background: transparent;
  border: none;
  box-shadow: none;
  transform: none;
  box-sizing: border-box;
}

.rp-scene--milestone .rp-clay-card--story > .rp-milestone-station,
.rp-scene--milestone .rp-clay-card--story > .rp-blk-narrativeTag,
.rp-scene--milestone .rp-clay-card--story > .rp-blk-date,
.rp-scene--milestone .rp-clay-card--story > .rp-blk-title,
.rp-scene--milestone .rp-clay-card--story > .rp-blk-lead,
.rp-scene--milestone .rp-clay-card--story > .rp-blk-tail,
.rp-scene--milestone .rp-clay-card--story > .rp-blk-hook {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.rp-scene--milestone .rp-clay-card--story .rp-blk-tag,
.rp-scene--milestone .rp-clay-card--story .rp-blk-narrativeTag,
.rp-scene--milestone .rp-clay-card--story .rp-blk-date,
.rp-scene--milestone .rp-clay-card--story .rp-blk-title,
.rp-scene--milestone .rp-clay-card--story .rp-blk-lead,
.rp-scene--milestone .rp-clay-card--story .rp-blk-tail,
.rp-scene--milestone .rp-clay-card--story .rp-blk-hook {
  text-align: left;
  align-self: flex-start;
}

.rp-scene--milestone .rp-tag-pill.rp-blk-date {
  align-self: flex-start;
}

/* 里程碑：装饰层在正文/宠物之下，避免黄色斜杆等遮挡宠物图 */
.rp-scene--milestone .rp-clay-card--story {
  position: relative;
  z-index: 8;
}

.rp-scene--milestone .rp-milestone-inline-visual {
  position: relative;
  z-index: 9;
  width: 100%;
  max-width: 100%;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: calc(16 * min(100vw, 420px) / 750) 0 calc(8 * min(100vw, 420px) / 750);
  padding: 0;
  text-align: center;
  background: transparent;
  border: none;
  box-shadow: none;
}

.rp-scene--milestone .rp-visual {
  z-index: 1;
}

.rp-scene--milestone .rp-milestone-ring {
  bottom: calc(92 * min(100vw, 420px) / 750);
  border-color: rgba(255, 255, 255, 0.28);
}

.rp-scene--pet_journey .rp-mascot--hero,
.rp-scene--persona .rp-mascot--hero {
  width: calc(420 * min(100vw, 420px) / 750);
  height: calc(420 * min(100vw, 420px) / 750);
}

.rp-scene--milestone .rp-visual__icon {
  color: #fff;
  filter: drop-shadow(0 calc(16 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.34));
}

.rp-scene--milestone .rp-mascot--mark {
  width: calc(250 * min(100vw, 420px) / 750);
  height: calc(250 * min(100vw, 420px) / 750);
}

@media (max-height: 700px) {
  .rp-milestone-footer {
    min-height: calc(240 * min(100vw, 420px) / 750);
    padding-top: calc(4 * min(100vw, 420px) / 750);
  }

  .rp-scene--milestone .rp-mascot--milestone-foot {
    width: calc(300 * min(100vw, 420px) / 750);
    height: calc(300 * min(100vw, 420px) / 750);
  }
}

.rp-milestone-inline-visual {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: calc(12 * min(100vw, 420px) / 750) 0 calc(4 * min(100vw, 420px) / 750);
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

.rp-milestone-inline-visual__frame {
  display: contents;
}

.rp-milestone-inline-visual__img {
  width: calc(360 * min(100vw, 420px) / 750);
  height: calc(360 * min(100vw, 420px) / 750);
  max-width: calc(100% - calc(16 * min(100vw, 420px) / 750));
  display: block;
  margin-left: auto;
  margin-right: auto;
  object-fit: contain;
  object-position: center bottom;
  filter: none;
  -webkit-filter: none;
}

.rp-scene--milestone .rp-milestone-inline-visual__img {
  width: calc(380 * min(100vw, 420px) / 750);
  height: calc(380 * min(100vw, 420px) / 750);
  margin-left: auto;
  margin-right: auto;
}

.rp-scene--milestone .rp-milestone-inline-visual__img--badge {
  width: calc(360 * min(100vw, 420px) / 750);
  height: calc(360 * min(100vw, 420px) / 750);
  max-width: min(78vw, calc(360 * min(100vw, 420px) / 750));
  margin-top: calc(12 * min(100vw, 420px) / 750);
  margin-bottom: calc(12 * min(100vw, 420px) / 750);
  object-position: center center;
}

.rp-milestone-badge-row {
  display: flex;
  flex-wrap: wrap;
  gap: calc(18 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750);
  justify-content: flex-start;
  width: 100%;
  margin: calc(18 * min(100vw, 420px) / 750) 0 calc(8 * min(100vw, 420px) / 750);
}

.rp-milestone-badge-chip {
  width: calc((100% - calc(32 * min(100vw, 420px) / 750)) / 3);
  max-width: calc(168 * min(100vw, 420px) / 750);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.rp-milestone-badge-chip__img {
  width: calc(112 * min(100vw, 420px) / 750);
  height: calc(112 * min(100vw, 420px) / 750);
  object-fit: contain;
}

.rp-milestone-badge-chip__emoji {
  font-size: calc(72 * min(100vw, 420px) / 750);
  line-height: 1;
}

.rp-milestone-badge-chip__name {
  margin-top: calc(8 * min(100vw, 420px) / 750);
  font-size: calc(22 * min(100vw, 420px) / 750);
  line-height: 1.25;
  color: rgba(255, 255, 255, 0.92);
  font-weight: 700;
}

.rp-milestone-inline-visual__emoji {
  line-height: 1;
  filter: drop-shadow(0 calc(8 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.2));
}

.rp-milestone-inline-visual__emoji--lg {
  font-size: calc(160 * min(100vw, 420px) / 750);
}

.rp-scene--milestone .rp-milestone-inline-visual__emoji--lg {
  display: block;
  font-size: calc(128 * min(100vw, 420px) / 750);
  line-height: 1;
  margin: calc(8 * min(100vw, 420px) / 750) auto calc(4 * min(100vw, 420px) / 750);
}

.rp-scene--milestone .rp-milestone-inline-visual__emoji--badge {
  font-size: calc(240 * min(100vw, 420px) / 750);
  margin: calc(12 * min(100vw, 420px) / 750) auto;
}

.rp-milestone-inline-visual__caption {
  display: block;
  width: 100%;
  margin-top: calc(12 * min(100vw, 420px) / 750);
  padding-top: calc(4 * min(100vw, 420px) / 750);
  font-size: calc(26 * min(100vw, 420px) / 750);
  font-weight: 600;
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.95);
  text-align: center;
  align-self: center;
}

.rp-scene--milestone .rp-milestone-inline-visual__emoji--lg {
  align-self: center;
  text-align: center;
}

.rp-milestone-pet {
  position: relative;
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: calc(8 * min(100vw, 420px) / 750);
  padding: calc(16 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750) calc(8 * min(100vw, 420px) / 750);
}

.rp-milestone-pet__label {
  font-size: calc(22 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.82);
  margin-bottom: calc(12 * min(100vw, 420px) / 750);
}

.rp-milestone-pet__frame {
  width: calc(280 * min(100vw, 420px) / 750);
  height: calc(280 * min(100vw, 420px) / 750);
  border-radius: calc(36 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.14);
  border: calc(2 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.28);
  box-shadow: 0 calc(20 * min(100vw, 420px) / 750) calc(48 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.28);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.rp-milestone-pet__img {
  width: calc(248 * min(100vw, 420px) / 750);
  height: calc(248 * min(100vw, 420px) / 750);
  object-fit: contain;
  object-position: center bottom;
}

.rp-milestone-pet__emoji {
  font-size: calc(120 * min(100vw, 420px) / 750);
  line-height: 1;
}

.rp-milestone-pet__name {
  margin-top: calc(14 * min(100vw, 420px) / 750);
  font-size: calc(26 * min(100vw, 420px) / 750);
  font-weight: 600;
  color: #fff;
  text-shadow: 0 calc(4 * min(100vw, 420px) / 750) calc(12 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.35);
}

.rp-scene--persona .rp-persona-medal {
  color: rgba(255, 255, 255, 0.5);
}

.rp-scene--stats .rp-clay-card--stat,
.rp-scene--stats .rp-clay-tile,
.rp-scene--radar .rp-game-radar,
.rp-scene--radar .rp-game-bar,
.rp-scene--comment .rp-clay-card--letter {
  background: rgba(255, 255, 255, 0.88);
}

.rp-scene--radar {
  background: linear-gradient(180deg, #EEF2FF 0%, #BAE6FD 38%, #CCFBF1 72%, #FEF3C7 100%) !important;
}

.rp-scene--radar .rp-clay-card--compact {
  margin-top: calc(12 * min(100vw, 420px) / 750);
  margin-left: var(--rp-gutter-lg);
  margin-right: var(--rp-gutter-lg);
  max-width: calc(100% - var(--rp-gutter-lg) * 2);
  box-sizing: border-box;
  background: transparent;
  border: none;
  box-shadow: none;
  padding-left: calc(28 * min(100vw, 420px) / 750);
  padding-right: calc(28 * min(100vw, 420px) / 750);
  text-align: left;
}

.rp-scene--radar .rp-title-round--sm {
  font-size: calc(46 * min(100vw, 420px) / 750);
  text-align: left;
  line-height: 1.22;
}

.rp-scene--stats .rp-clay-card--stat {
  margin-top: calc(18 * min(100vw, 420px) / 750);
  background:
    linear-gradient(165deg, rgba(255, 255, 255, 0.94), rgba(240, 253, 244, 0.9));
}

.rp-scene--stats .rp-num-hero__val {
  font-size: calc(112 * min(100vw, 420px) / 750);
}

.rp-scene--stats .rp-title-round--dark {
  font-size: calc(52 * min(100vw, 420px) / 750);
}

.rp-scene--comment {
  background: linear-gradient(180deg, #FFF7ED 0%, #FCE7F3 36%, #E9D5FF 72%, #BFDBFE 100%) !important;
}

.rp-scene--comment .rp-sticker {
  margin-left: calc(42 * min(100vw, 420px) / 750);
  transform: rotate(-1deg);
}

.rp-scene--comment .rp-clay-card--letter {
  margin-top: calc(9 * min(100vw, 420px) / 750);
  border-radius: calc(18 * min(100vw, 420px) / 750);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(255, 251, 235, 0.92));
}

.rp-scene--end {
  background: linear-gradient(180deg, #462098 0%, #5B35C8 46%, #7C3AED 88%, #4C1D95 100%) !important;
}

.rp-scene--end .rp-end-year {
  color: rgba(255, 255, 255, 0.14);
}

.rp-scene--end .rp-title-round,
.rp-scene--end .rp-end-sub {
  color: #fff;
  -webkit-text-fill-color: #fff;
  text-shadow: 0 calc(10 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.28);
}

.rp-scene--end .rp-tag-pill--sun {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.22);
}

@media (max-height: 700px) {
  .rp-scene--milestone .rp-visual,
  .rp-scene--persona .rp-visual {
    min-height: calc(250 * min(100vw, 420px) / 750);
  }
}

/* Unified storybook pass: keep the final-.gr-book background across the report. */
.rp-scene,
.rp-scene--radar,
.rp-scene--stats,
.rp-scene--comment,
.rp-scene--end {
  background: var(
    --rp-.gr-book-bg,
    linear-gradient(180deg, #462098 0%, #5B35C8 46%, #7C3AED 88%, #4C1D95 100%)
  ) !important;
}

.rp-topbar {
  left: 0;
  right: 0;
  top: 0;
  width: 100%;
  min-height: auto;
  padding: calc(env(safe-area-inset-top) + calc(8 * min(100vw, 420px) / 750)) calc(24 * min(100vw, 420px) / 750) calc(8 * min(100vw, 420px) / 750);
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
  box-shadow: none;
}

.rp-topbar__back {
  min-width: calc(100 * min(100vw, 420px) / 750);
  height: calc(56 * min(100vw, 420px) / 750);
  color: #462098;
  background: rgba(255, 255, 255, 0.92);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.95);
  box-shadow: 0 calc(6 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.14);
}

.rp-poster {
  padding-top: calc(env(safe-area-inset-top) + var(--rp-poster-top, calc(150 * min(100vw, 420px) / 750)));
}

.rp-scene--pet_journey .rp-sticker,
.rp-scene--first_memories .rp-sticker,
.rp-scene--milestones_bridge .rp-sticker,
.rp-scene--persona .rp-sticker {
  margin-left: calc(46 * min(100vw, 420px) / 750);
  margin-bottom: calc(14 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.92);
  font-size: calc(25 * min(100vw, 420px) / 750);
  line-height: 1.25;
  background: transparent;
  border: 0;
  box-shadow: none;
  transform: none;
}

.rp-scene--pet_journey .rp-clay-card--pet-story,
.rp-scene--first_memories .rp-clay-card--firsts,
.rp-scene--milestones_bridge .rp-clay-card--bridge,
.rp-scene--persona .rp-clay-card--persona {
  margin-left: var(--rp-gutter-lg);
  margin-right: var(--rp-gutter-lg);
  max-width: calc(100% - var(--rp-gutter-lg) * 2);
  padding: calc(4 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) 0;
  color: #fff;
  background: transparent;
  border: 0;
  box-shadow: none;
  box-sizing: border-box;
}

.rp-scene--milestone .rp-clay-card--story {
  margin-left: var(--rp-gutter-lg);
  margin-right: var(--rp-gutter-lg);
  max-width: calc(100% - var(--rp-gutter-lg) * 2);
  padding: 0 calc(28 * min(100vw, 420px) / 750);
  color: #fff;
  background: transparent;
  border: 0;
  box-shadow: none;
  box-sizing: border-box;
}

.rp-scene--first_memories .rp-clay-card__tag,
.rp-scene--first_memories .rp-clay-card__line {
  color: rgba(255, 255, 255, 0.86);
}

.rp-scene--first_memories .rp-title-round--dark,
.rp-scene--milestones_bridge .rp-title-round--dark {
  color: #fff;
  -webkit-text-fill-color: #fff;
  background: none;
  text-shadow: 0 calc(10 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.28);
  font-size: calc(50 * min(100vw, 420px) / 750);
  line-height: 1.18;
}

.rp-scene--milestones_bridge .rp-clay-card__line {
  color: rgba(255, 255, 255, 0.94);
  font-size: calc(30 * min(100vw, 420px) / 750);
  line-height: 1.62;
}

.rp-firsts-list {
  position: relative;
  z-index: 5;
  margin: calc(26 * min(100vw, 420px) / 750) var(--rp-gutter-lg) 0;
  max-width: calc(100% - var(--rp-gutter-lg) * 2);
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: calc(14 * min(100vw, 420px) / 750);
}

.rp-first-card {
  min-height: calc(104 * min(100vw, 420px) / 750);
  padding: calc(16 * min(100vw, 420px) / 750) calc(18 * min(100vw, 420px) / 750);
  border-radius: calc(26 * min(100vw, 420px) / 750);
  display: grid;
  grid-template-columns: calc(82 * min(100vw, 420px) / 750) 1fr;
  gap: calc(14 * min(100vw, 420px) / 750);
  align-items: center;
  background: rgba(255, 255, 255, 0.17);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.24);
  box-shadow: 0 calc(14 * min(100vw, 420px) / 750) calc(26 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.13);
}

.rp-first-card:nth-child(2n) {
  transform: translateX(calc(18 * min(100vw, 420px) / 750));
}

.rp-first-card__icon {
  width: calc(76 * min(100vw, 420px) / 750);
  height: calc(76 * min(100vw, 420px) / 750);
  border-radius: calc(24 * min(100vw, 420px) / 750);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(42 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.22);
}

.rp-first-card__icon-img {
  width: calc(76 * min(100vw, 420px) / 750);
  height: calc(76 * min(100vw, 420px) / 750);
  display: block;
  object-fit: contain;
}

.rp-first-card__body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: calc(4 * min(100vw, 420px) / 750);
}

.rp-first-card__date {
  color: rgba(255, 255, 255, 0.72);
  font-size: calc(21 * min(100vw, 420px) / 750);
}

.rp-first-card__label {
  color: #fff;
  font-size: calc(26 * min(100vw, 420px) / 750);
  font-weight: 900;
}

.rp-first-card__title {
  color: rgba(255, 255, 255, 0.86);
  font-size: calc(24 * min(100vw, 420px) / 750);
  line-height: 1.25;
}

.rp-scene--first_memories .rp-visual {
  margin-top: auto;
  min-height: calc(286 * min(100vw, 420px) / 750);
  background: transparent;
}

.rp-scene--first_memories .rp-milestone-ring {
  bottom: calc(90 * min(100vw, 420px) / 750);
  border-color: rgba(255, 255, 255, 0.28);
}

.rp-scene--first_memories .rp-mascot--hero {
  width: calc(390 * min(100vw, 420px) / 750);
  height: calc(390 * min(100vw, 420px) / 750);
}

.rp-scene--radar .rp-title-round--sm,
.rp-scene--stats .rp-title-round--dark {
  color: #fff;
  -webkit-text-fill-color: #fff;
  text-shadow: 0 calc(10 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.26);
}

.rp-scene--stats .rp-clay-card--stat,
.rp-scene--comment .rp-clay-card--letter {
  background: rgba(255, 255, 255, 0.9);
}

.rp-scene--radar .rp-clay-card--compact {
  background: transparent;
}

.rp-scene--stats .rp-clay-card--stat-hero .rp-title-round--dark,
.rp-scene--stats .rp-clay-card--stat-hero .rp-clay-card__tag {
  color: rgba(255, 255, 255, 0.92);
  -webkit-text-fill-color: rgba(255, 255, 255, 0.92);
  text-shadow: 0 calc(6 * min(100vw, 420px) / 750) calc(18 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.22);
}

.rp-pet-evolution {
  margin-top: calc(26 * min(100vw, 420px) / 750);
  gap: 0;
}

.rp-pet-form-card {
  min-height: calc(216 * min(100vw, 420px) / 750);
  border-radius: calc(30 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.18);
}

.rp-pet-form-card__img {
  width: calc(142 * min(100vw, 420px) / 750);
  height: calc(126 * min(100vw, 420px) / 750);
  object-fit: contain;
  object-position: center bottom;
}

.rp-pet-form-card__name {
  max-width: calc(180 * min(100vw, 420px) / 750);
}

@media (max-height: 700px) {
  .rp-poster {
    padding-top: calc(env(safe-area-inset-top) + calc(128 * min(100vw, 420px) / 750));
  }

  .rp-scene--first_memories .rp-title-round--dark {
    font-size: calc(44 * min(100vw, 420px) / 750);
  }

  .rp-first-card {
    min-height: calc(92 * min(100vw, 420px) / 750);
    padding-top: calc(12 * min(100vw, 420px) / 750);
    padding-bottom: calc(12 * min(100vw, 420px) / 750);
  }

  .rp-scene--first_memories .rp-visual {
    min-height: calc(218 * min(100vw, 420px) / 750);
  }
}

/* ---- report-scenes-patch.wxss ---- */
/* ═══════════════════════════════════════
   视觉排版升级 · 字阶 / 留白 / 进度 / 光晕
   公式：卡片悬浮，数字拉大；四周留空气，IP 叠层跨
   ═══════════════════════════════════════ */
.gr-book {
  --rp-gutter: calc(36 * min(100vw, 420px) / 750);
  --rp-gutter-lg: calc(40 * min(100vw, 420px) / 750);
}

.rp-sticker {
  margin-left: var(--rp-gutter-lg) !important;
  margin-right: var(--rp-gutter);
}

.rp-scene--milestone .rp-clay-card--story .rp-milestone-station {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.rp-clay-card {
  margin-left: var(--rp-gutter-lg) !important;
  margin-right: var(--rp-gutter-lg) !important;
  max-width: calc(100% - var(--rp-gutter-lg) * 2);
  box-sizing: border-box;
}

.rp-scene--pet_journey .rp-clay-card--pet-story,
.rp-scene--first_memories .rp-clay-card--firsts,
.rp-scene--milestone .rp-clay-card--story,
.rp-scene--persona .rp-clay-card--persona,
.rp-scene--milestones_bridge .rp-clay-card--bridge {
  margin-left: var(--rp-gutter-lg) !important;
  margin-right: var(--rp-gutter-lg) !important;
}

.rp-firsts-list {
  margin-left: var(--rp-gutter-lg) !important;
  margin-right: var(--rp-gutter-lg) !important;
}

/* 弱提示文案（12sp 量级）· 与故事正文拉开 */
.rp-hint-whisper {
  display: block;
  margin-top: calc(14 * min(100vw, 420px) / 750);
  font-size: calc(24 * min(100vw, 420px) / 750);
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.52);
  letter-spacing: calc(0.5 * min(100vw, 420px) / 750);
  white-space: pre-line;
}

.rp-scene--stats .rp-hint-whisper,
.rp-scene--radar .rp-hint-whisper {
  color: var(--rp-whisper-color, rgba(255, 255, 255, 0.82));
  font-size: var(--rp-whisper-size, calc(24 * min(100vw, 420px) / 750));
  line-height: var(--rp-line-height, 1.62);
}

.rp-scene--radar .rp-clay-card--compact .rp-clay-card__line {
  color: var(--rp-body-text-color, rgba(255, 255, 255, 0.92));
  line-height: var(--rp-line-height, 1.62);
}

.rp-scene--stats .rp-clay-card--stat-hero .rp-hint-whisper {
  color: rgba(255, 255, 255, 0.78);
}

.rp-firsts-tail {
  display: block;
  box-sizing: border-box;
  width: calc(100% - var(--rp-gutter-lg) * 2);
  max-width: calc(100% - var(--rp-gutter-lg) * 2);
  margin: calc(18 * min(100vw, 420px) / 750) var(--rp-gutter-lg) 0;
  padding: 0 calc(12 * min(100vw, 420px) / 750);
  text-align: center;
  word-break: break-word;
  overflow-wrap: break-word;
  white-space: normal;
}

.rp-scene--first_memories .rp-firsts-tail.rp-blk-tail {
  width: calc(100% - var(--rp-gutter-lg) * 2);
  max-width: calc(100% - var(--rp-gutter-lg) * 2);
  align-self: center;
}

.rp-bridge-whisper {
  margin-top: calc(18 * min(100vw, 420px) / 750);
}

/* Narrative bridge page: all copy stays left-aligned. */
.rp-scene--milestones_bridge .rp-poster--bridge,
.rp-scene--milestones_bridge .rp-clay-card--bridge,
.rp-scene--milestones_bridge .rp-sticker,
.rp-scene--milestones_bridge .rp-title-round--dark,
.rp-scene--milestones_bridge .rp-clay-card__line,
.rp-scene--milestones_bridge .rp-bridge-whisper {
  text-align: left !important;
}

.rp-scene--milestones_bridge .rp-clay-card--bridge {
  align-items: flex-start !important;
}

.rp-scene--milestones_bridge .rp-title-round--dark,
.rp-scene--milestones_bridge .rp-clay-card__line,
.rp-scene--milestones_bridge .rp-bridge-whisper {
  width: 100% !important;
  align-self: stretch !important;
}

/* 极端字阶 · 水晶渐变数字 */
.rp-num-glow-wrap {
  position: relative;
  margin-top: calc(4 * min(100vw, 420px) / 750);
  padding: calc(8 * min(100vw, 420px) / 750) 0 calc(4 * min(100vw, 420px) / 750);
}

.rp-num-glow-wrap--compact {
  margin: calc(4 * min(100vw, 420px) / 750) auto 0;
  padding: 0;
}

.rp-num-glow {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 72%;
  height: 88%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  filter: blur(calc(28 * min(100vw, 420px) / 750));
  opacity: 0.72;
  pointer-events: none;
}

.rp-num-glow--cyan {
  background: radial-gradient(circle, rgba(56, 189, 248, 0.85) 0%, rgba(139, 92, 246, 0.35) 55%, transparent 72%);
}

.rp-num-glow--green {
  background: radial-gradient(circle, rgba(52, 211, 153, 0.82) 0%, rgba(250, 204, 21, 0.28) 58%, transparent 72%);
}

.rp-num-hero--mega .rp-num-hero__val {
  font-size: calc(168 * min(100vw, 420px) / 750);
  font-weight: 1000;
  line-height: 0.88;
  background: linear-gradient(180deg, #ffffff 8%, #7dd3fc 42%, #38bdf8 72%, #c4b5fd 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: none;
  filter: drop-shadow(0 calc(12 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) rgba(56, 189, 248, 0.35));
}

.rp-num-hero--mega .rp-num-hero__unit {
  margin-bottom: calc(28 * min(100vw, 420px) / 750);
  font-size: calc(32 * min(100vw, 420px) / 750);
  font-weight: 600;
  color: rgba(255, 255, 255, 0.62);
  letter-spacing: calc(2 * min(100vw, 420px) / 750);
}

.rp-num-hero--mega.rp-num-hero--inline .rp-num-hero__val {
  font-size: calc(128 * min(100vw, 420px) / 750);
}

.rp-num-hero--mega.rp-num-hero--inline .rp-num-hero__val--green {
  background: linear-gradient(180deg, #ecfdf5 6%, #6ee7b7 38%, #34d399 70%, #fde047 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.rp-stat-dim-label {
  display: block;
  margin-top: calc(6 * min(100vw, 420px) / 750);
  font-size: calc(28 * min(100vw, 420px) / 750);
  font-weight: 700;
  color: #475569;
  letter-spacing: calc(2 * min(100vw, 420px) / 750);
}

/* 卡片环境光晕 */
.rp-card-glow-wrap {
  position: relative;
  margin: calc(8 * min(100vw, 420px) / 750) var(--rp-gutter-lg) 0;
}

.rp-card-glow {
  position: absolute;
  inset: -calc(12 * min(100vw, 420px) / 750) -calc(8 * min(100vw, 420px) / 750);
  border-radius: calc(44 * min(100vw, 420px) / 750);
  filter: blur(calc(22 * min(100vw, 420px) / 750));
  opacity: 0.55;
  pointer-events: none;
  z-index: 0;
}

.rp-card-glow--violet {
  background: radial-gradient(ellipse at 50% 40%, rgba(167, 139, 250, 0.75), rgba(56, 189, 248, 0.2) 68%, transparent 78%);
}

.rp-card-glow--mint {
  background: radial-gradient(ellipse at 50% 30%, rgba(110, 231, 183, 0.7), rgba(250, 204, 21, 0.22) 62%, transparent 76%);
}

.rp-card-glow-wrap .rp-game-radar,
.rp-stats-hero-wrap .rp-clay-card {
  position: relative;
  z-index: 1;
}

/* 数据证据页 · 通栏 + 错落宫格 */
.rp-poster--stats {
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: calc(
    env(safe-area-inset-bottom) + var(--rp-.gr-book-pad-bottom, var(--rp-stats-pad-bottom, calc(220 * min(100vw, 420px) / 750)))
  );
}

.rp-stats-hero-wrap {
  position: relative;
  width: calc(100% - var(--rp-gutter-lg) * 2);
  max-width: calc(100% - var(--rp-gutter-lg) * 2);
  margin: 0 var(--rp-gutter-lg);
  box-sizing: border-box;
  align-self: center;
}

.rp-clay-card--stat-hero {
  margin: 0 !important;
  padding-top: calc(24 * min(100vw, 420px) / 750);
  padding-bottom: calc(22 * min(100vw, 420px) / 750);
  box-shadow:
    0 calc(16 * min(100vw, 420px) / 750) 0 rgba(30, 58, 95, 0.04),
    0 calc(32 * min(100vw, 420px) / 750) calc(56 * min(100vw, 420px) / 750) rgba(15, 23, 42, 0.14);
}

.rp-stats-hero-wrap {
  margin-bottom: calc(4 * min(100vw, 420px) / 750);
}

.rp-stat-rank-hint {
  margin-top: calc(10 * min(100vw, 420px) / 750);
  text-align: center;
}

.rp-stats-grid {
  display: grid;
  grid-template-columns: 0.92fr 1.08fr;
  grid-template-rows: auto auto;
  gap: calc(14 * min(100vw, 420px) / 750);
  margin: calc(16 * min(100vw, 420px) / 750) var(--rp-gutter-lg) 0;
}

.rp-stats-grid .rp-clay-tile {
  margin: 0;
  min-height: calc(128 * min(100vw, 420px) / 750);
  padding: calc(18 * min(100vw, 420px) / 750) calc(14 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-shadow:
    0 calc(10 * min(100vw, 420px) / 750) 0 rgba(30, 58, 95, 0.04),
    0 calc(18 * min(100vw, 420px) / 750) calc(34 * min(100vw, 420px) / 750) rgba(15, 23, 42, 0.1);
}

.rp-clay-tile--tall {
  min-height: calc(142 * min(100vw, 420px) / 750);
}

.rp-clay-tile--spotlight {
  min-height: calc(156 * min(100vw, 420px) / 750);
  transform: translateY(-calc(6 * min(100vw, 420px) / 750));
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.98), rgba(254, 249, 195, 0.94));
  border: calc(2 * min(100vw, 420px) / 750) solid rgba(250, 204, 21, 0.45);
  box-shadow:
    0 calc(18 * min(100vw, 420px) / 750) 0 rgba(146, 64, 14, 0.06),
    0 calc(28 * min(100vw, 420px) / 750) calc(48 * min(100vw, 420px) / 750) rgba(250, 204, 21, 0.22),
    0 0 calc(36 * min(100vw, 420px) / 750) rgba(56, 189, 248, 0.12);
}

.rp-clay-tile--wide {
  grid-column: 1 / -1;
  min-height: calc(108 * min(100vw, 420px) / 750);
  flex-direction: row;
  justify-content: flex-start;
  gap: calc(16 * min(100vw, 420px) / 750);
  padding-left: calc(24 * min(100vw, 420px) / 750);
  padding-right: calc(24 * min(100vw, 420px) / 750);
}

.rp-clay-tile--wide .rp-clay-tile__icon {
  margin-right: calc(4 * min(100vw, 420px) / 750);
}

.rp-clay-tile--wide .rp-clay-tile__num-row {
  flex: 1;
  text-align: left;
}

.rp-clay-tile--wide .rp-clay-tile__lbl {
  margin-left: auto;
  margin-top: 0;
  align-self: center;
}

.rp-clay-tile__num-row {
  width: 100%;
  margin-top: calc(6 * min(100vw, 420px) / 750);
}

.rp-clay-tile__val {
  font-size: calc(52 * min(100vw, 420px) / 750);
  line-height: 1;
}

.rp-clay-tile__val--xl {
  font-size: calc(64 * min(100vw, 420px) / 750);
  background: linear-gradient(180deg, #0284c7, #34d399);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.rp-clay-tile__val--sm {
  font-size: calc(40 * min(100vw, 420px) / 750);
}

.rp-clay-tile__lbl {
  font-size: calc(22 * min(100vw, 420px) / 750);
  color: rgba(71, 85, 105, 0.78);
}

/* 左侧霓虹冒险进度 */
.rp-adventure-track {
  position: fixed;
  left: calc(env(safe-area-inset-left) + calc(8 * min(100vw, 420px) / 750));
  top: calc(env(safe-area-inset-top) + calc(118 * min(100vw, 420px) / 750));
  bottom: calc(env(safe-area-inset-bottom) + calc(120 * min(100vw, 420px) / 750));
  z-index: 38;
  width: calc(10 * min(100vw, 420px) / 750);
  pointer-events: none;
}

.rp-adventure-track__rail {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.12);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.22);
  overflow: visible;
}

.rp-adventure-track__glow {
  position: absolute;
  left: calc(1 * min(100vw, 420px) / 750);
  right: calc(1 * min(100vw, 420px) / 750);
  top: 0;
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: linear-gradient(180deg, rgba(250, 204, 21, 0.95), rgba(56, 189, 248, 0.85));
  box-shadow: 0 0 calc(18 * min(100vw, 420px) / 750) rgba(250, 204, 21, 0.55);
  transition: height 0.45s cubic-bezier(0.34, 1.2, 0.64, 1);
}

.rp-adventure-track__dots {
  position: absolute;
  inset: calc(10 * min(100vw, 420px) / 750) 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}

.rp-adventure-track__dot {
  width: calc(4 * min(100vw, 420px) / 750);
  height: calc(4 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.22);
}

.rp-adventure-track__dot--lit {
  background: #fff;
  box-shadow: 0 0 calc(10 * min(100vw, 420px) / 750) rgba(255, 255, 255, 0.85);
}

.rp-adventure-track__ship {
  position: absolute;
  left: 50%;
  width: calc(14 * min(100vw, 420px) / 750);
  height: calc(14 * min(100vw, 420px) / 750);
  margin-left: -calc(7 * min(100vw, 420px) / 750);
  margin-top: -calc(7 * min(100vw, 420px) / 750);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(10 * min(100vw, 420px) / 750);
  color: #fde047;
  text-shadow: 0 0 calc(12 * min(100vw, 420px) / 750) rgba(253, 224, 71, 0.9);
  transition: top 0.45s cubic-bezier(0.34, 1.2, 0.64, 1);
  animation: rpTrackStar 2.4s ease-in-out infinite;
}

@keyframes rpTrackStar {
  0%,
  100% {
    transform: scale(1);
    opacity: 0.88;
  }
  50% {
    transform: scale(1.18);
    opacity: 1;
  }
}

/* 悠悠破框叠层 */
.rp-mascot--peek {
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(env(safe-area-inset-bottom) + calc(28 * min(100vw, 420px) / 750));
  width: calc(320 * min(100vw, 420px) / 750);
  height: calc(320 * min(100vw, 420px) / 750);
  margin-left: auto;
  margin-right: auto;
  z-index: 8;
  pointer-events: none;
}

.rp-poster--bridge {
  padding-bottom: calc(15vh + env(safe-area-inset-bottom) + calc(24 * min(100vw, 420px) / 750));
}

.rp-poster--bridge .rp-clay-card--bridge {
  position: relative;
  z-index: 3;
  max-width: calc(100% - var(--rp-gutter-lg) * 2);
}

.rp-scroll-guide-zone {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 15vh;
  min-height: calc(110 * min(100vw, 420px) / 750);
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: calc(6 * min(100vw, 420px) / 750);
  pointer-events: none;
}

.rp-scroll-guide__foot,
.rp-scroll-guide__chev {
  animation: rpHintPulse 2s ease-in-out infinite;
}

.rp-scroll-guide__foot {
  font-size: calc(40 * min(100vw, 420px) / 750);
  opacity: 0.9;
}

.rp-scroll-guide__chev {
  font-size: calc(22 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.72);
}

.rp-mascot--peek-letter {
  position: absolute;
  right: calc(24 * min(100vw, 420px) / 750);
  top: calc(env(safe-area-inset-top) + calc(200 * min(100vw, 420px) / 750));
  width: calc(200 * min(100vw, 420px) / 750);
  height: calc(200 * min(100vw, 420px) / 750);
  z-index: 6;
  pointer-events: none;
  transform: rotate(-6deg);
}

.rp-poster--comment .rp-clay-card--letter {
  position: relative;
  z-index: 4;
  flex: 1 1 auto;
  min-height: 0;
  margin-top: calc(24 * min(100vw, 420px) / 750) !important;
}

.rp-poster--comment {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

.rp-scene--comment .rp-mascot--peek-letter {
  display: none !important;
}

.rp-scene--comment .rp-mascot--comment-foot {
  display: block !important;
  position: relative;
  flex-shrink: 0;
  width: calc(320 * min(100vw, 420px) / 750);
  height: calc(320 * min(100vw, 420px) / 750);
  margin: auto auto 0;
  margin-top: auto;
  align-self: center;
  pointer-events: none;
}

/* 上滑引导 · 呼吸动效 */
.rp-flip-hint__icon {
  font-size: calc(28 * min(100vw, 420px) / 750);
  line-height: 1;
}

.rp-flip-hint--footprint .rp-flip-hint__icon {
  font-size: calc(34 * min(100vw, 420px) / 750);
  animation: rpFootBreathe 2s ease-in-out infinite;
}

@keyframes rpFootBreathe {
  0%,
  100% {
    opacity: 0.45;
    transform: translateY(0) scale(0.92);
  }
  50% {
    opacity: 1;
    transform: translateY(-calc(10 * min(100vw, 420px) / 750)) scale(1.08);
  }
}

.rp-flip-hint--footprint {
  min-width: 0;
  max-width: 88%;
  padding: calc(10 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750);
}

.rp-scene--radar .rp-clay-card__sub {
  font-size: calc(24 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.58);
}

@media (max-height: 700px) {
  .rp-num-hero--mega .rp-num-hero__val {
    font-size: calc(132 * min(100vw, 420px) / 750);
  }

  .rp-num-hero--mega.rp-num-hero--inline .rp-num-hero__val {
    font-size: calc(104 * min(100vw, 420px) / 750);
  }

  .rp-mascot--peek {
    width: calc(260 * min(100vw, 420px) / 750);
    height: calc(260 * min(100vw, 420px) / 750);
    bottom: calc(env(safe-area-inset-bottom) + calc(20 * min(100vw, 420px) / 750));
  }

  .rp-poster--bridge {
    padding-bottom: calc(12vh + env(safe-area-inset-bottom) + calc(16 * min(100vw, 420px) / 750));
  }
}

/* ---- report-overrides.wxss ---- */
/* ═══════════════════════════════════════
   PAGE 12 · 机甲魔法阵雷达 + 能量条
   PAGE 13 · 毛玻璃 2+1 + 数字滚动
   ═══════════════════════════════════════ */

.rp-poster--radar-mech {
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: calc(
    env(safe-area-inset-bottom) + var(--rp-.gr-book-pad-bottom, var(--rp-radar-pad-bottom, calc(96 * min(100vw, 420px) / 750)))
  );
}

.rp-poster--radar-mech .rp-clay-card--compact {
  margin-left: var(--rp-gutter-lg);
  margin-right: var(--rp-gutter-lg);
  max-width: calc(100% - var(--rp-gutter-lg) * 2);
  box-sizing: border-box;
  padding-left: calc(28 * min(100vw, 420px) / 750);
  padding-right: calc(28 * min(100vw, 420px) / 750);
  background: transparent;
  border: none;
  box-shadow: none;
}

.rp-poster--radar-mech .rp-clay-card--compact .rp-clay-card__line,
.rp-poster--radar-mech .rp-clay-card--compact .rp-title-round--sm,
.rp-poster--radar-mech .rp-radar-sub {
  max-width: 100%;
  word-break: break-word;
  overflow-wrap: break-word;
}

.rp-radar-sub {
  margin-top: calc(10 * min(100vw, 420px) / 750);
  text-align: left;
}

.rp-shield-wrap {
  position: relative;
  margin: calc(8 * min(100vw, 420px) / 750) var(--rp-gutter-lg) 0;
  width: calc(100% - var(--rp-gutter-lg) * 2);
  max-width: calc(100% - var(--rp-gutter-lg) * 2);
  align-self: center;
  box-sizing: border-box;
  height: calc(520 * min(100vw, 420px) / 750);
  min-height: calc(520 * min(100vw, 420px) / 750);
}

.rp-shield-ring {
  position: absolute;
  left: 50%;
  top: 50%;
  border-radius: 50%;
  border: calc(2 * min(100vw, 420px) / 750) dashed rgba(125, 211, 252, 0.45);
  pointer-events: none;
  z-index: 1;
}

.rp-shield-ring--spin {
  width: calc(460 * min(100vw, 420px) / 750);
  height: calc(460 * min(100vw, 420px) / 750);
  margin-left: -calc(230 * min(100vw, 420px) / 750);
  margin-top: -calc(230 * min(100vw, 420px) / 750);
  animation: rpSpin 18s linear infinite;
}

.rp-shield-ring--pulse {
  width: calc(400 * min(100vw, 420px) / 750);
  height: calc(400 * min(100vw, 420px) / 750);
  margin-left: -calc(200 * min(100vw, 420px) / 750);
  margin-top: -calc(200 * min(100vw, 420px) / 750);
  border-color: rgba(167, 139, 250, 0.35);
  animation: rpShieldPulse 2.8s ease-in-out infinite;
}

@keyframes rpShieldPulse {
  0%,
  100% {
    transform: scale(0.94);
    opacity: 0.45;
  }
  50% {
    transform: scale(1.04);
    opacity: 0.9;
  }
}

.rp-game-radar--shield {
  position: relative;
  z-index: 3;
  width: 100%;
  height: 100%;
  min-height: 100%;
  margin: 0;
  border-radius: calc(24 * min(100vw, 420px) / 750);
  background:
    radial-gradient(circle at 50% 42%, rgba(91, 141, 255, 0.22), transparent 54%),
    rgba(255, 255, 255, 0.06);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(126, 168, 255, 0.26);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow:
    inset 0 calc(1 * min(100vw, 420px) / 750) 0 rgba(255, 255, 255, 0.08),
    0 calc(24 * min(100vw, 420px) / 750) calc(48 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.18);
  overflow: hidden;
}

.rp-poster--radar-mech .rp-radar-canvas {
  display: block;
  position: relative;
  z-index: 4;
  width: 100%;
  height: 100%;
  min-height: calc(480 * min(100vw, 420px) / 750);
}

.rp-stat-num-hint {
  display: block;
  width: 100%;
  margin: calc(4 * min(100vw, 420px) / 750) 0 calc(2 * min(100vw, 420px) / 750);
  font-size: calc(22 * min(100vw, 420px) / 750);
  font-weight: 500;
  line-height: 1.3;
  text-align: center;
  color: rgba(255, 255, 255, 0.58);
  letter-spacing: calc(1 * min(100vw, 420px) / 750);
}

/* 能量条 · 机甲血条 */
.rp-energy-bars {
  margin: calc(12 * min(100vw, 420px) / 750) var(--rp-gutter-lg) 0;
  display: flex;
  flex-direction: column;
  gap: calc(12 * min(100vw, 420px) / 750);
}

.rp-energy-bar {
  padding: calc(14 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750) calc(12 * min(100vw, 420px) / 750);
  border-radius: calc(22 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.1);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.rp-energy-bar--legend {
  border: calc(2 * min(100vw, 420px) / 750) solid rgba(250, 204, 21, 0.65);
  box-shadow:
    0 0 calc(28 * min(100vw, 420px) / 750) rgba(250, 204, 21, 0.22),
    inset 0 0 calc(20 * min(100vw, 420px) / 750) rgba(255, 255, 255, 0.08);
}

.rp-energy-bar__head {
  display: flex;
  align-items: center;
  gap: calc(8 * min(100vw, 420px) / 750);
  margin-bottom: calc(8 * min(100vw, 420px) / 750);
}

.rp-energy-bar__icon {
  font-size: calc(30 * min(100vw, 420px) / 750);
  line-height: 1;
}

.rp-energy-bar__name {
  flex: 1;
  text-align: left;
  font-size: calc(26 * min(100vw, 420px) / 750);
  font-weight: 700;
  color: rgba(255, 255, 255, 0.94);
}

.rp-energy-bar__badge {
  padding: calc(4 * min(100vw, 420px) / 750) calc(12 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  font-size: calc(20 * min(100vw, 420px) / 750);
  font-weight: 800;
  color: #92400e;
  background: linear-gradient(135deg, #fef08a, #fbbf24);
  box-shadow: 0 0 calc(12 * min(100vw, 420px) / 750) rgba(250, 204, 21, 0.45);
}

.rp-energy-bar__track {
  position: relative;
  height: calc(22 * min(100vw, 420px) / 750);
  border-radius: calc(8 * min(100vw, 420px) / 750);
  background: rgba(15, 23, 42, 0.28);
  overflow: hidden;
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.12);
}

.rp-energy-bar__segments {
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    90deg,
    transparent,
    transparent calc(18 * min(100vw, 420px) / 750),
    rgba(255, 255, 255, 0.08) calc(18 * min(100vw, 420px) / 750),
    rgba(255, 255, 255, 0.08) calc(20 * min(100vw, 420px) / 750)
  );
  pointer-events: none;
  z-index: 1;
}

.rp-energy-bar__fill {
  position: relative;
  height: 100%;
  min-width: calc(8 * min(100vw, 420px) / 750);
  border-radius: calc(6 * min(100vw, 420px) / 750);
  transition: width 0.08s linear;
  overflow: hidden;
}

.rp-energy-bar__shine {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -40%;
  width: 40%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.55), transparent);
  animation: rpEnergyShine 2.2s ease-in-out infinite;
}

@keyframes rpEnergyShine {
  0% {
    left: -45%;
  }
  100% {
    left: 120%;
  }
}

.rp-energy-bar__sparks {
  position: absolute;
  right: calc(6 * min(100vw, 420px) / 750);
  top: 50%;
  margin-top: -calc(14 * min(100vw, 420px) / 750);
  font-size: calc(22 * min(100vw, 420px) / 750);
  animation: rpSparkle 1.4s ease-in-out infinite;
}

.rp-radar-bridge {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.rp-radar-bridge__foot {
  font-size: calc(36 * min(100vw, 420px) / 750);
  animation: rpFootBreathe 2s ease-in-out infinite;
}

.rp-radar-bridge__hint {
  font-size: var(--rp-whisper-size, calc(26 * min(100vw, 420px) / 750));
  font-weight: 600;
  color: var(--rp-bridge-hint-color, rgba(255, 255, 255, 0.88));
  letter-spacing: calc(1 * min(100vw, 420px) / 750);
  text-shadow: 0 calc(4 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.35);
}

.rp-radar-bridge__chev {
  font-size: calc(22 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.72);
  animation: rpHintPulse 2s ease-in-out infinite;
}

/* PAGE 13 · 毛玻璃错落 */
.rp-stats-masonry {
  width: calc(100% - var(--rp-gutter-lg) * 2);
  max-width: calc(100% - var(--rp-gutter-lg) * 2);
  margin: calc(14 * min(100vw, 420px) / 750) var(--rp-gutter-lg) 0;
  box-sizing: border-box;
  align-self: center;
  display: flex;
  flex-direction: column;
  gap: calc(14 * min(100vw, 420px) / 750);
}

.rp-stats-masonry__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(14 * min(100vw, 420px) / 750);
}

.rp-glass-tile {
  position: relative;
  overflow: hidden;
  border-radius: calc(28 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.1);
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.18);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 calc(16 * min(100vw, 420px) / 750) calc(36 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.14);
}

.rp-glass-tile__glow {
  position: absolute;
  inset: -20%;
  pointer-events: none;
  opacity: 0.65;
}

.rp-glass-tile--gold .rp-glass-tile__glow {
  background: radial-gradient(circle at 30% 20%, rgba(250, 204, 21, 0.55), transparent 62%);
}

.rp-glass-tile--neon .rp-glass-tile__glow {
  background: radial-gradient(circle at 70% 30%, rgba(167, 139, 250, 0.55), rgba(56, 189, 248, 0.25) 58%, transparent 72%);
}

.rp-glass-tile--hero {
  display: flex;
  align-items: center;
  gap: calc(18 * min(100vw, 420px) / 750);
  padding: calc(22 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750);
  min-height: calc(132 * min(100vw, 420px) / 750);
}

.rp-glass-tile--gold {
  border-color: rgba(250, 204, 21, 0.42);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.16), rgba(250, 204, 21, 0.14));
}

.rp-glass-tile--neon {
  border-color: rgba(167, 139, 250, 0.45);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.14), rgba(124, 58, 237, 0.2));
}

.rp-glass-tile--sub {
  padding: calc(20 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750);
  min-height: calc(148 * min(100vw, 420px) / 750);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.rp-glass-tile__icon {
  position: relative;
  z-index: 1;
  font-size: calc(52 * min(100vw, 420px) / 750);
  line-height: 1;
  flex-shrink: 0;
}

.rp-glass-tile__icon--sm {
  font-size: calc(44 * min(100vw, 420px) / 750);
  margin-bottom: calc(6 * min(100vw, 420px) / 750);
}

.rp-glass-tile__icon-img {
  position: relative;
  z-index: 1;
  width: calc(72 * min(100vw, 420px) / 750);
  height: calc(72 * min(100vw, 420px) / 750);
  object-fit: contain;
  flex-shrink: 0;
}

.rp-glass-tile__icon-img--sm {
  width: calc(56 * min(100vw, 420px) / 750);
  height: calc(56 * min(100vw, 420px) / 750);
  margin-bottom: calc(6 * min(100vw, 420px) / 750);
}

.rp-glass-tile__num-block {
  position: relative;
  z-index: 1;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.rp-glass-tile--sub .rp-glass-tile__num-block {
  align-items: center;
}

.rp-glass-tile__num {
  font-size: calc(56 * min(100vw, 420px) / 750);
  font-weight: 1000;
  line-height: 1;
  color: #fff;
  text-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.28);
  font-variant-numeric: tabular-nums;
}

.rp-glass-tile__num--hero {
  font-size: calc(72 * min(100vw, 420px) / 750);
  background: linear-gradient(180deg, #fff 10%, #fde047 55%, #f59e0b 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.rp-glass-tile--neon .rp-glass-tile__num--hero {
  background: linear-gradient(180deg, #fff 8%, #c4b5fd 45%, #38bdf8 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.rp-glass-tile__lbl {
  margin-top: calc(8 * min(100vw, 420px) / 750);
  font-size: calc(22 * min(100vw, 420px) / 750);
  color: rgba(255, 255, 255, 0.68);
  letter-spacing: calc(1 * min(100vw, 420px) / 750);
}

/* 闪光存证 · 顶部去掉玻璃卡片，与下方宫格同宽对齐 */
.rp-stats-hero-wrap .rp-card-glow,
.rp-stats-hero-wrap .rp-clay-card--stat-hero {
  display: none !important;
}

.rp-stats-hero {
  width: 100%;
  box-sizing: border-box;
  padding: calc(4 * min(100vw, 420px) / 750) 0 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

.rp-stats-hero__tag {
  display: block;
  text-align: center;
  margin-bottom: calc(12 * min(100vw, 420px) / 750);
}

.rp-stats-hero-metric {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.rp-stat-dim-label--above {
  margin: 0 0 calc(8 * min(100vw, 420px) / 750);
  font-size: calc(30 * min(100vw, 420px) / 750);
  font-weight: 800;
  letter-spacing: calc(3 * min(100vw, 420px) / 750);
  text-align: center;
}

.rp-scene--stats .rp-stat-dim-label,
.rp-scene--stats .rp-clay-card__story,
.rp-scene--stats .rp-stats-hero-proof {
  color: rgba(255, 255, 255, 0.88);
}

.rp-scene--stats .rp-clay-card__story.rp-stats-hero-proof,
.rp-scene--stats .rp-stats-hero-proof {
  display: block;
  width: 100%;
  max-width: none;
  margin: calc(16 * min(100vw, 420px) / 750) 0;
  padding: 0;
  box-sizing: border-box;
  align-self: stretch;
  line-height: 1.7;
  text-align: justify;
  text-align-last: justify;
  text-justify: inter-ideograph;
}

.rp-scene--stats .rp-hint-whisper.rp-stat-rank-hint,
.rp-scene--stats .rp-stat-rank-hint {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: calc(16 * min(100vw, 420px) / 750) 0 0;
  padding: 0;
  box-sizing: border-box;
  align-self: stretch;
  line-height: 1.55;
  text-align: justify;
  text-align-last: justify;
  text-justify: inter-ideograph;
}

.rp-scene--radar .rp-mascot--corner,
.rp-scene--stats .rp-mascot--corner {
  bottom: calc(env(safe-area-inset-bottom) + var(--rp-mascot-bottom, calc(128 * min(100vw, 420px) / 750)));
  width: calc(168 * min(100vw, 420px) / 750);
  height: calc(168 * min(100vw, 420px) / 750);
  opacity: 0.92;
  pointer-events: none;
}

.rp-scene--stats .rp-medal-badge {
  color: #451a03;
  background: linear-gradient(135deg, #fef9c3, #fde047, #fbbf24);
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.18);
}

@media (max-height: 700px) {
  .rp-shield-wrap {
    height: calc(420 * min(100vw, 420px) / 750);
    min-height: calc(420 * min(100vw, 420px) / 750);
  }

  .rp-shield-ring--spin {
    width: calc(380 * min(100vw, 420px) / 750);
    height: calc(380 * min(100vw, 420px) / 750);
    margin-left: -calc(190 * min(100vw, 420px) / 750);
    margin-top: -calc(190 * min(100vw, 420px) / 750);
  }

  .rp-shield-ring--pulse {
    width: calc(330 * min(100vw, 420px) / 750);
    height: calc(330 * min(100vw, 420px) / 750);
    margin-left: -calc(165 * min(100vw, 420px) / 750);
    margin-top: -calc(165 * min(100vw, 420px) / 750);
  }

  .rp-poster--radar-mech .rp-radar-canvas {
    min-height: calc(380 * min(100vw, 420px) / 750);
  }

  .rp-glass-tile__num--hero {
    font-size: calc(60 * min(100vw, 420px) / 750);
  }

  .rp-glass-tile__num {
    font-size: calc(48 * min(100vw, 420px) / 750);
  }
}

/* ═══════════════════════════════════════
   里程碑终章 · 终极觉醒开箱动效
   ═══════════════════════════════════════ */
.rp-scene--finale {
  background: linear-gradient(
    180deg,
    #1a0a3d 0%,
    #4c1d95 38%,
    #7c3aed 62%,
    #312e81 100%
  ) !important;
}

.rp-scene--milestone.rp-scene--finale,
.rp-poster--finale {
  overflow: hidden;
}

.rp-poster--finale {
  position: relative;
  z-index: 3;
  min-height: 100%;
  padding: calc(env(safe-area-inset-top) + calc(132 * min(100vw, 420px) / 750)) var(--rp-gutter-lg)
    calc(env(safe-area-inset-bottom) + calc(48 * min(100vw, 420px) / 750));
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.rp-finale-flash {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: #0c0420;
  opacity: 0;
  pointer-events: none;
}

.rp-finale-aurora {
  position: absolute;
  left: -20%;
  right: -20%;
  top: 18%;
  height: 62%;
  z-index: 1;
  background:
    radial-gradient(ellipse at 50% 42%, rgba(250, 204, 21, 0.42) 0%, transparent 52%),
    radial-gradient(ellipse at 30% 60%, rgba(56, 189, 248, 0.38) 0%, transparent 55%),
    radial-gradient(ellipse at 72% 55%, rgba(167, 139, 250, 0.45) 0%, transparent 58%);
  opacity: 0.35;
  filter: blur(calc(8 * min(100vw, 420px) / 750));
  pointer-events: none;
}

.rp-finale-particles {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background-image:
    radial-gradient(calc(2 * min(100vw, 420px) / 750) calc(2 * min(100vw, 420px) / 750) at 20% 30%, rgba(255, 255, 255, 0.9), transparent),
    radial-gradient(calc(2 * min(100vw, 420px) / 750) calc(2 * min(100vw, 420px) / 750) at 70% 22%, rgba(255, 255, 255, 0.75), transparent),
    radial-gradient(calc(3 * min(100vw, 420px) / 750) calc(3 * min(100vw, 420px) / 750) at 82% 68%, rgba(253, 224, 71, 0.85), transparent);
  opacity: 0;
}

.rp-finale-copy,
.rp-finale-epilogue {
  position: relative;
  z-index: 6;
  padding: 0 calc(8 * min(100vw, 420px) / 750);
}

.rp-finale-station {
  display: block;
  color: rgba(255, 255, 255, 0.78);
  letter-spacing: calc(2 * min(100vw, 420px) / 750);
}

/* 1–8 章叙事标签：黄色发光（里程碑 + 终章共用） */
.rp-narrative-tag-glow {
  font-weight: 800;
  color: #fde047 !important;
  -webkit-text-fill-color: #fde047;
  text-shadow:
    0 0 calc(24 * min(100vw, 420px) / 750) rgba(250, 204, 21, 0.55),
    0 0 calc(48 * min(100vw, 420px) / 750) rgba(250, 204, 21, 0.28);
}

.rp-scene--milestone .rp-clay-card--story .rp-narrative-tag-glow {
  display: block;
  margin-top: calc(6 * min(100vw, 420px) / 750);
  letter-spacing: calc(1 * min(100vw, 420px) / 750);
}

.rp-finale-tag {
  display: block;
  margin-top: calc(12 * min(100vw, 420px) / 750);
}

.rp-finale-title {
  display: block;
  margin-top: calc(16 * min(100vw, 420px) / 750);
  font-weight: 1000;
  line-height: 1.2;
  color: #fff;
  text-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.35);
}

.rp-finale-lead {
  display: block;
  margin-top: calc(14 * min(100vw, 420px) / 750);
  line-height: 1.68;
  color: rgba(255, 255, 255, 0.94);
}

.rp-finale-epilogue {
  margin-top: calc(8 * min(100vw, 420px) / 750);
}

.rp-finale-epilogue__line {
  display: block;
  margin-top: calc(12 * min(100vw, 420px) / 750);
  line-height: 1.62;
  color: rgba(255, 255, 255, 0.9);
}

.rp-finale-date {
  position: relative;
  z-index: 6;
  align-self: flex-start;
  margin-top: calc(20 * min(100vw, 420px) / 750);
}

.rp-finale-stage {
  position: relative;
  z-index: 5;
  flex: 1;
  min-height: calc(420 * min(100vw, 420px) / 750);
  margin: calc(8 * min(100vw, 420px) / 750) -calc(12 * min(100vw, 420px) / 750) 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.rp-finale-charge-core {
  position: absolute;
  width: calc(120 * min(100vw, 420px) / 750);
  height: calc(120 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.95), rgba(56, 189, 248, 0.2) 55%, transparent 72%);
  opacity: 0;
  transform: scale(0.2);
  filter: blur(calc(2 * min(100vw, 420px) / 750));
}

.rp-finale-pet-hero {
  position: relative;
  z-index: 8;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  transform: scale(1.2);
  opacity: 1;
  filter: none;
}

.rp-finale-max-badge {
  position: absolute;
  right: 12%;
  top: 0;
  z-index: 12;
  padding: calc(10 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750);
  font-size: calc(20 * min(100vw, 420px) / 750);
  font-weight: 900;
  letter-spacing: calc(2 * min(100vw, 420px) / 750);
  color: #451a03;
  background: linear-gradient(135deg, #fef08a, #fbbf24, #f59e0b);
  border: calc(2 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.75);
  border-radius: calc(8 * min(100vw, 420px) / 750);
  transform: rotate(12deg);
  box-shadow:
    0 calc(8 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750) rgba(180, 83, 9, 0.35),
    0 0 calc(24 * min(100vw, 420px) / 750) rgba(250, 204, 21, 0.55);
}

.rp-finale-pet-glow {
  position: absolute;
  left: 50%;
  top: 42%;
  width: calc(440 * min(100vw, 420px) / 750);
  height: calc(440 * min(100vw, 420px) / 750);
  margin-left: -calc(220 * min(100vw, 420px) / 750);
  margin-top: -calc(220 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(56, 189, 248, 0.55) 0%, rgba(250, 204, 21, 0.28) 42%, transparent 68%);
  filter: blur(calc(18 * min(100vw, 420px) / 750));
  opacity: 0;
}

.rp-finale-pet-silhouette {
  position: absolute;
  left: 50%;
  top: 38%;
  width: calc(320 * min(100vw, 420px) / 750);
  height: calc(320 * min(100vw, 420px) / 750);
  margin-left: -calc(160 * min(100vw, 420px) / 750);
  margin-top: -calc(160 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.22), rgba(15, 23, 42, 0.85) 72%);
  opacity: 0;
}

.rp-finale-pet-frame {
  position: relative;
  z-index: 3;
  width: 100%;
  max-width: calc(520 * min(100vw, 420px) / 750);
  height: calc(400 * min(100vw, 420px) / 750);
  display: flex;
  align-items: center;
  justify-content: center;
}

.rp-finale-pet-img {
  width: 120%;
  max-width: calc(600 * min(100vw, 420px) / 750);
  height: calc(400 * min(100vw, 420px) / 750);
  object-fit: contain;
  object-position: center bottom;
  filter: none;
  -webkit-filter: none;
}

.rp-finale-pet-emoji {
  font-size: calc(200 * min(100vw, 420px) / 750);
  line-height: 1;
}

.rp-finale-pet-name {
  position: relative;
  z-index: 4;
  margin-top: calc(4 * min(100vw, 420px) / 750);
  font-size: calc(34 * min(100vw, 420px) / 750);
  font-weight: 900;
  color: #fff;
  text-shadow: 0 0 calc(20 * min(100vw, 420px) / 750) rgba(250, 204, 21, 0.45);
}

.rp-finale-pet-lv {
  position: relative;
  z-index: 4;
  margin-top: calc(6 * min(100vw, 420px) / 750);
  font-size: calc(26 * min(100vw, 420px) / 750);
  font-weight: 700;
  color: rgba(255, 255, 255, 0.72);
}

/* 文案逐行浮现：默认可读，仅蓄力阶段隐藏，避免动效未触发时整页空白 */
.rp-poster--finale-idle .rp-finale-line,
.rp-poster--finale-done .rp-finale-line {
  opacity: 1;
  transform: translateY(0);
  filter: none;
}

.rp-poster--finale-charge .rp-finale-copy--reveal .rp-finale-line,
.rp-poster--finale-charge .rp-finale-epilogue .rp-finale-line {
  opacity: 0;
  transform: translateY(calc(28 * min(100vw, 420px) / 750));
  filter: blur(calc(6 * min(100vw, 420px) / 750));
}

.rp-poster--finale-done .rp-finale-copy--reveal .rp-finale-line,
.rp-poster--finale-done .rp-finale-epilogue .rp-finale-line {
  animation: rpFinaleLineIn 0.72s cubic-bezier(0.34, 1.2, 0.64, 1) forwards;
}

.rp-poster--finale-done .rp-finale-line--1 {
  animation-delay: 0.05s;
}
.rp-poster--finale-done .rp-finale-line--2 {
  animation-delay: 0.14s;
}
.rp-poster--finale-done .rp-finale-line--3 {
  animation-delay: 0.24s;
}
.rp-poster--finale-done .rp-finale-line--4 {
  animation-delay: 0.34s;
}
.rp-poster--finale-done .rp-finale-line--5 {
  animation-delay: 0.44s;
}
.rp-poster--finale-done .rp-finale-line--6 {
  animation-delay: 0.54s;
}
.rp-poster--finale-done .rp-finale-line--7 {
  animation-delay: 0.64s;
}

@keyframes rpFinaleLineIn {
  to {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}

/* 阶段一：蓄力 */
.rp-poster--finale-charge .rp-finale-flash {
  animation: rpFinaleFlashIn 0.48s ease-out forwards;
}

.rp-poster--finale-charge .rp-finale-aurora {
  opacity: 0.55;
  animation: rpFinaleAuroraPulse 0.9s ease-in-out infinite;
}

.rp-poster--finale-charge .rp-finale-charge-core {
  animation: rpFinaleCharge 0.52s ease-in forwards;
}

.rp-poster--finale-charge .rp-finale-pet-silhouette {
  opacity: 1;
  animation: rpFinaleSilPulse 0.52s ease-in-out infinite;
}

.rp-poster--finale-charge .rp-finale-pet-hero {
  opacity: 0.25;
  transform: scale(0.78);
  filter: blur(calc(16 * min(100vw, 420px) / 750)) brightness(0.4);
}

@keyframes rpFinaleFlashIn {
  0% {
    opacity: 0.92;
  }
  100% {
    opacity: 0;
  }
}

@keyframes rpFinaleCharge {
  to {
    opacity: 1;
    transform: scale(1.15);
  }
}

@keyframes rpFinaleSilPulse {
  0%,
  100% {
    transform: scale(0.92);
    opacity: 0.75;
  }
  50% {
    transform: scale(1.05);
    opacity: 1;
  }
}

@keyframes rpFinaleAuroraPulse {
  0%,
  100% {
    opacity: 0.4;
  }
  50% {
    opacity: 0.72;
  }
}

/* 阶段二：炸裂（无黄色光爆射线，仅宠物揭示） */
.rp-poster--finale-burst .rp-finale-pet-hero {
  animation: rpFinalePetReveal 0.78s cubic-bezier(0.34, 1.35, 0.64, 1) forwards;
}

@keyframes rpFinalePetReveal {
  0% {
    opacity: 0.2;
    transform: scale(0.72);
    filter: blur(calc(14 * min(100vw, 420px) / 750)) brightness(0.5);
  }
  70% {
    transform: scale(1.08);
    filter: blur(0) brightness(1.15);
  }
  100% {
    opacity: 1;
    transform: scale(1.2);
    filter: blur(0) brightness(1);
  }
}

@keyframes rpFinaleGlowPulse {
  0%,
  100% {
    opacity: 0.65;
    transform: scale(0.96);
  }
  50% {
    opacity: 1;
    transform: scale(1.04);
  }
}

@keyframes rpFinaleParticles {
  0% {
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
  100% {
    opacity: 0.35;
  }
}

.rp-poster--finale-done .rp-finale-pet-hero {
  opacity: 1;
  transform: scale(1.2);
  filter: none;
}

.rp-poster--finale-done .rp-finale-pet-glow {
  opacity: 1;
}

.rp-poster--finale-done .rp-finale-aurora {
  opacity: 0.72;
}

.rp-poster--finale-high .rp-finale-aurora {
  background:
    radial-gradient(ellipse at 50% 42%, rgba(250, 204, 21, 0.55) 0%, transparent 52%),
    radial-gradient(ellipse at 30% 60%, rgba(251, 191, 36, 0.4) 0%, transparent 55%),
    radial-gradient(ellipse at 72% 55%, rgba(253, 224, 71, 0.38) 0%, transparent 58%);
}

.rp-poster--finale-mid .rp-finale-aurora {
  background:
    radial-gradient(ellipse at 50% 42%, rgba(56, 189, 248, 0.42) 0%, transparent 52%),
    radial-gradient(ellipse at 30% 60%, rgba(167, 139, 250, 0.38) 0%, transparent 55%),
    radial-gradient(ellipse at 72% 55%, rgba(52, 211, 153, 0.28) 0%, transparent 58%);
}

.rp-poster--finale-low .rp-finale-aurora {
  background:
    radial-gradient(ellipse at 50% 42%, rgba(134, 239, 172, 0.38) 0%, transparent 52%),
    radial-gradient(ellipse at 30% 60%, rgba(196, 181, 253, 0.32) 0%, transparent 55%),
    radial-gradient(ellipse at 72% 55%, rgba(125, 211, 252, 0.25) 0%, transparent 58%);
}

.rp-poster--finale-high .rp-finale-max-badge {
  background: linear-gradient(135deg, #fff7ad, #facc15, #f59e0b);
}

.rp-poster--finale-low .rp-finale-max-badge {
  background: linear-gradient(135deg, #d9f99d, #86efac, #4ade80);
  color: #14532d;
}

@media (max-height: 700px) {
  .rp-finale-stage {
    min-height: calc(340 * min(100vw, 420px) / 750);
  }

  .rp-finale-pet-frame {
    height: calc(320 * min(100vw, 420px) / 750);
  }

  .rp-finale-pet-img {
    height: calc(320 * min(100vw, 420px) / 750);
  }

  .rp-poster--finale-done .rp-finale-pet-hero {
    transform: scale(1.05);
  }
}

/* 字号/对齐以 WXML 块级 style（pg.blockInlineStyles）为准，勿在此 !important 覆盖 */

/* 底部半弧：兜底关闭（覆盖文件后部重复定义） */
.rp-scene::after,
.rp-scene--cover::after,
.rp-scene--universe_intro::after,
.rp-scene--pet_journey::after,
.rp-scene--milestone::after,
.rp-scene--persona::after,
.rp-scene--finale::after,
.rp-scene--first_memories::after,
.rp-scene--milestones_bridge::after,
.rp-scene--radar::after,
.rp-scene--stats::after,
.rp-scene--comment::after,
.rp-scene--end::after {
  display: none !important;
  content: none !important;
}

.rp-cover__planet,
.rp-planet-road,
.rp-milestone-planet,
.rp-milestone-ring,
.rp-end-illust .rp-milestone-planet {
  display: none !important;
}

.rp-scene--pet_journey .rp-visual,
.rp-scene--milestone .rp-visual,
.rp-scene--persona .rp-visual,
.rp-scene--first_memories .rp-visual,
.rp-visual--cyan,
.rp-visual--blue,
.rp-visual--green,
.rp-visual--sun,
.rp-visual--pink,
.rp-visual--violet,
.rp-visual--persona,
.rp-visual--pet {
  background: transparent !important;
}

/* 装饰精简：去底部黄带、云朵、角标悠悠、过渡页爪印、终章光带、黄色斜杆铅笔等 */
.rp-illust-cloud,
.rp-deco-emoji--1,
.rp-illust-pencil,
.rp-comet,
.rp-orbit-path,
.rp-illust-book,
.rp-illust-flag,
.rp-illust-block {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.rp-scene--milestone .rp-illust-props,
.rp-scene--milestone .rp-illust-props--milestone {
  display: none !important;
}

.rp-scroll-guide-zone {
  display: none !important;
}

.rp-finale-aurora,
.rp-finale-charge-core,
.rp-finale-flash,
.rp-finale-particles,
.rp-finale-burst-ring,
.rp-finale-burst-rays,
.rp-finale-max-badge,
.rp-finale-pet-glow,
.rp-finale-pet-silhouette,
.rp-illust-props,
.rp-illust-pencil,
.rp-comet {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  animation: none !important;
  background: none !important;
  box-shadow: none !important;
}

/* 篇章页 1–8：关闭场景斜向光带，避免叠在宠物图上 */
.rp-scene--milestone .rp-deco,
.rp-scene--milestone.rp-scene--finale .rp-deco {
  display: none !important;
  background: none !important;
  background-image: none !important;
}

.rp-mascot--corner,
.rp-mascot--letter {
  display: none !important;
}

.rp-stat-illustration {
  display: none !important;
}

.rp-scene--end .rp-poster--end {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  justify-content: flex-start;
  min-height: 100%;
  box-sizing: border-box;
  padding-top: calc(env(safe-area-inset-top) + calc(72 * min(100vw, 420px) / 750));
}

.rp-end-copy {
  width: 100%;
  margin-top: -calc(70 * min(100vw, 420px) / 750);
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
}

.rp-end-copy .rp-end-year,
.rp-end-copy .rp-title-round,
.rp-end-copy .rp-end-sub,
.rp-end-copy .rp-end-share-hint {
  align-self: center;
}

.rp-scene--end .rp-mascot--end-foot {
  display: block !important;
  flex-shrink: 0;
  width: calc(360 * min(100vw, 420px) / 750);
  height: calc(360 * min(100vw, 420px) / 750);
  margin-top: auto;
  margin-bottom: calc(env(safe-area-inset-bottom) + calc(8 * min(100vw, 420px) / 750));
  align-self: center;
  pointer-events: none;
}

.rp-scene--end .rp-mascot--hero {
  display: none !important;
}

.rp-scene--end .rp-end-illust {
  height: 0;
  min-height: 0;
  overflow: hidden;
  margin: 0;
  padding: 0;
}

/* 悠悠 PNG 等抠图形象：全局禁用发光/投影，避免方形光晕 */
image.rp-mascot,
.rp-mascot,
[class*='rp-mascot--'],
.rp-uni__mascot,
.rp-finale-pet-img,
.rp-milestone-inline-visual__img {
  filter: none !important;
  -webkit-filter: none !important;
  box-shadow: none !important;
}

.rp-scene--end .rp-end-year,
.rp-scene--end .rp-title-round,
.rp-scene--end .rp-end-sub,
.rp-scene--end .rp-end-share-hint,
.rp-scene--end .rp-clay-card__sub,
.rp-scene--end .rp-end-share,
.rp-scene--end .rp-tag-pill--sun {
  align-self: center;
  text-align: center;
}

/* 五维图：标签收进画布安全区，避免左右/底部溢出；系统维度仍按思维潜力/学业质量/行为自律/社会素养/成长爆发计算 */
.rp-scene--radar {
  background: linear-gradient(180deg, #5b2fc6 0%, #6d3ed7 46%, #8f5bd5 72%, #f6bd38 100%) !important;
}

.rp-poster--radar-mech {
  padding-top: calc(env(safe-area-inset-top) + calc(76 * min(100vw, 420px) / 750));
  padding-bottom: calc(env(safe-area-inset-bottom) + calc(42 * min(100vw, 420px) / 750));
  box-sizing: border-box;
}

.rp-poster--radar-mech .rp-clay-card--compact {
  margin-top: 0 !important;
  padding: 0 calc(22 * min(100vw, 420px) / 750) calc(4 * min(100vw, 420px) / 750) !important;
}

.rp-poster--radar-mech .rp-title-round--sm {
  line-height: 1.18 !important;
  letter-spacing: calc(1 * min(100vw, 420px) / 750);
}

.rp-poster--radar-mech .rp-clay-card__line,
.rp-poster--radar-mech .rp-radar-sub {
  line-height: 1.55 !important;
}

.rp-shield-wrap {
  height: calc(492 * min(100vw, 420px) / 750) !important;
  min-height: calc(492 * min(100vw, 420px) / 750) !important;
  margin-top: calc(10 * min(100vw, 420px) / 750) !important;
  border-radius: calc(24 * min(100vw, 420px) / 750);
}

.rp-game-radar--shield {
  border-radius: calc(24 * min(100vw, 420px) / 750) !important;
  background:
    radial-gradient(circle at 50% 42%, rgba(125, 211, 252, 0.28), transparent 50%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(238, 242, 255, 0.72)) !important;
  border: calc(2 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.68) !important;
  box-shadow:
    inset 0 calc(1 * min(100vw, 420px) / 750) 0 rgba(255, 255, 255, 0.78),
    0 calc(18 * min(100vw, 420px) / 750) calc(34 * min(100vw, 420px) / 750) rgba(37, 14, 83, 0.16) !important;
}

.rp-shield-ring {
  display: none !important;
}

.rp-poster--radar-mech .rp-radar-canvas {
  width: 100% !important;
  height: 100% !important;
  min-height: calc(492 * min(100vw, 420px) / 750) !important;
}

.rp-energy-bars {
  margin-top: calc(10 * min(100vw, 420px) / 750) !important;
  gap: calc(8 * min(100vw, 420px) / 750) !important;
}

.rp-energy-bar {
  min-height: 0;
  padding: calc(10 * min(100vw, 420px) / 750) calc(14 * min(100vw, 420px) / 750) calc(9 * min(100vw, 420px) / 750) !important;
  border-radius: calc(18 * min(100vw, 420px) / 750) !important;
  background: rgba(255, 255, 255, 0.16) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
  box-shadow: inset 0 calc(1 * min(100vw, 420px) / 750) 0 rgba(255, 255, 255, 0.12);
}

.rp-energy-bar--legend {
  background: rgba(255, 255, 255, 0.22) !important;
  border-color: rgba(250, 204, 21, 0.86) !important;
  box-shadow:
    0 0 calc(22 * min(100vw, 420px) / 750) rgba(250, 204, 21, 0.24),
    inset 0 calc(1 * min(100vw, 420px) / 750) 0 rgba(255, 255, 255, 0.18) !important;
}

.rp-energy-bar__head {
  margin-bottom: calc(6 * min(100vw, 420px) / 750) !important;
}

.rp-energy-bar__icon {
  width: calc(34 * min(100vw, 420px) / 750);
  flex: 0 0 calc(34 * min(100vw, 420px) / 750);
  text-align: center;
  font-size: calc(26 * min(100vw, 420px) / 750) !important;
}

.rp-energy-bar__name {
  min-width: 0;
  text-align: left !important;
  font-size: calc(24 * min(100vw, 420px) / 750) !important;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.rp-energy-bar__badge {
  flex-shrink: 0;
  padding: calc(4 * min(100vw, 420px) / 750) calc(10 * min(100vw, 420px) / 750) !important;
  font-size: calc(18 * min(100vw, 420px) / 750) !important;
  line-height: 1.1;
}

.rp-energy-bar__track {
  height: calc(18 * min(100vw, 420px) / 750) !important;
  border-radius: calc(999 * min(100vw, 420px) / 750) !important;
}

.rp-energy-bar__fill {
  border-radius: calc(999 * min(100vw, 420px) / 750) !important;
}

@media (max-height: 700px) {
  .rp-poster--radar-mech {
    padding-top: calc(env(safe-area-inset-top) + calc(64 * min(100vw, 420px) / 750));
  }

  .rp-shield-wrap {
    height: calc(420 * min(100vw, 420px) / 750) !important;
    min-height: calc(420 * min(100vw, 420px) / 750) !important;
  }

  .rp-poster--radar-mech .rp-radar-canvas {
    min-height: calc(420 * min(100vw, 420px) / 750) !important;
  }

  .rp-energy-bars {
    gap: calc(7 * min(100vw, 420px) / 750) !important;
  }

  .rp-energy-bar {
    padding-top: calc(8 * min(100vw, 420px) / 750) !important;
    padding-bottom: calc(8 * min(100vw, 420px) / 750) !important;
  }
}

/* 闪光证据页：左对齐叙事、突出最高维度，减少大面积居中导致的松散感 */
.rp-scene--stats {
  background: linear-gradient(180deg, #4d25b4 0%, #6130c6 44%, #8b4ed0 72%, #f6c434 100%) !important;
}

.rp-scene--stats .rp-sticker--green {
  color: #1f2937 !important;
  background: linear-gradient(135deg, #bbf7d0, #5eead4) !important;
  border: calc(2 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.68);
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(22 * min(100vw, 420px) / 750) rgba(15, 23, 42, 0.14);
}

.rp-poster--stats {
  padding-top: calc(env(safe-area-inset-top) + calc(76 * min(100vw, 420px) / 750));
  padding-bottom: calc(env(safe-area-inset-bottom) + calc(56 * min(100vw, 420px) / 750));
  box-sizing: border-box;
}

.rp-stats-hero-wrap {
  margin-top: 0 !important;
  margin-bottom: calc(12 * min(100vw, 420px) / 750) !important;
}

.rp-stats-hero {
  text-align: left !important;
}

.rp-stats-hero__tag {
  width: 100%;
  margin: 0 0 calc(10 * min(100vw, 420px) / 750) !important;
  text-align: left !important;
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: calc(30 * min(100vw, 420px) / 750) !important;
  line-height: 1.25;
}

.rp-stats-hero-metric {
  align-items: flex-start !important;
}

.rp-stat-dim-label--pill {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: auto !important;
  max-width: 100%;
  margin: 0 0 calc(10 * min(100vw, 420px) / 750) !important;
  padding: calc(8 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  color: #2f246d !important;
  background: rgba(255, 255, 255, 0.92);
  border: calc(2 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.68);
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(20 * min(100vw, 420px) / 750) rgba(30, 20, 96, 0.16);
  font-size: calc(28 * min(100vw, 420px) / 750) !important;
  line-height: 1.1;
  letter-spacing: calc(1 * min(100vw, 420px) / 750) !important;
  text-align: left !important;
}

.rp-scene--stats .rp-visual__icon--lg {
  align-self: center;
  margin-top: 0;
  font-size: calc(92 * min(100vw, 420px) / 750);
  line-height: 1;
  filter: drop-shadow(0 calc(10 * min(100vw, 420px) / 750) calc(14 * min(100vw, 420px) / 750) rgba(20, 12, 84, 0.16));
}

.rp-scene--stats .rp-num-glow-wrap--compact {
  align-self: center;
  margin-top: calc(4 * min(100vw, 420px) / 750);
}

.rp-scene--stats .rp-num-hero__val {
  font-size: calc(112 * min(100vw, 420px) / 750) !important;
  line-height: 0.95;
  color: #7dd3fc !important;
  -webkit-text-fill-color: #7dd3fc !important;
  text-shadow:
    0 calc(10 * min(100vw, 420px) / 750) calc(26 * min(100vw, 420px) / 750) rgba(15, 23, 42, 0.24),
    0 0 calc(26 * min(100vw, 420px) / 750) rgba(125, 211, 252, 0.42);
}

.rp-stat-num-hint {
  align-self: center;
  color: rgba(255, 255, 255, 0.62) !important;
}

.rp-scene--stats .rp-clay-card__story.rp-stats-hero-proof,
.rp-scene--stats .rp-stats-hero-proof {
  margin: calc(16 * min(100vw, 420px) / 750) 0 !important;
  text-align: justify !important;
  text-align-last: justify !important;
  text-justify: inter-ideograph !important;
  color: rgba(255, 255, 255, 0.92) !important;
  line-height: 1.7 !important;
}

.rp-scene--stats .rp-hint-whisper.rp-stat-rank-hint,
.rp-scene--stats .rp-stat-rank-hint {
  margin: calc(16 * min(100vw, 420px) / 750) 0 0 !important;
  text-align: justify !important;
  text-align-last: justify !important;
  text-justify: inter-ideograph !important;
  color: rgba(255, 255, 255, 0.82) !important;
  line-height: 1.55 !important;
}

.rp-stats-masonry {
  gap: calc(12 * min(100vw, 420px) / 750) !important;
  margin-top: calc(14 * min(100vw, 420px) / 750) !important;
}

.rp-glass-tile {
  border-radius: calc(18 * min(100vw, 420px) / 750) !important;
  background: rgba(255, 255, 255, 0.14) !important;
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.2) !important;
}

.rp-glass-tile--hero {
  min-height: calc(128 * min(100vw, 420px) / 750) !important;
  padding: calc(20 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) !important;
  background: rgba(255, 255, 255, 0.16) !important;
}

.rp-glass-tile--sub {
  min-height: calc(126 * min(100vw, 420px) / 750) !important;
  padding: calc(18 * min(100vw, 420px) / 750) calc(14 * min(100vw, 420px) / 750) !important;
}

.rp-glass-tile__icon {
  font-size: calc(46 * min(100vw, 420px) / 750) !important;
}

.rp-glass-tile__num--hero {
  font-size: calc(72 * min(100vw, 420px) / 750) !important;
}

.rp-glass-tile__num {
  font-size: calc(52 * min(100vw, 420px) / 750) !important;
}

.rp-glass-tile__lbl {
  color: rgba(255, 255, 255, 0.78) !important;
  line-height: 1.25;
}

.rp-medal-strip {
  margin-top: calc(12 * min(100vw, 420px) / 750) !important;
  gap: calc(8 * min(100vw, 420px) / 750) !important;
}

.rp-scene--stats .rp-medal-badge {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: calc(6 * min(100vw, 420px) / 750);
  color: #4b3103 !important;
  background: linear-gradient(135deg, #fef3c7, #facc15) !important;
  border-radius: calc(999 * min(100vw, 420px) / 750);
  box-shadow: 0 calc(8 * min(100vw, 420px) / 750) calc(16 * min(100vw, 420px) / 750) rgba(45, 29, 6, 0.12) !important;
}

.rp-medal-badge__img {
  width: calc(34 * min(100vw, 420px) / 750);
  height: calc(34 * min(100vw, 420px) / 750);
  flex: 0 0 calc(34 * min(100vw, 420px) / 750);
  display: block;
}

.rp-medal-badge__emoji {
  font-size: calc(26 * min(100vw, 420px) / 750);
  line-height: 1;
}

.rp-medal-badge__name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-height: 700px) {
  .rp-poster--stats {
    padding-top: calc(env(safe-area-inset-top) + calc(62 * min(100vw, 420px) / 750));
  }

  .rp-stats-hero__tag {
    font-size: calc(28 * min(100vw, 420px) / 750) !important;
  }

  .rp-scene--stats .rp-visual__icon--lg {
    font-size: calc(74 * min(100vw, 420px) / 750);
  }

  .rp-scene--stats .rp-num-hero__val {
    font-size: calc(94 * min(100vw, 420px) / 750) !important;
  }

  .rp-scene--stats .rp-clay-card__story.rp-stats-hero-proof,
  .rp-scene--stats .rp-stats-hero-proof {
    margin: calc(12 * min(100vw, 420px) / 750) 0 !important;
    line-height: 1.55 !important;
  }
}

/* 报告加载态：用持续动效避免长请求期间像卡住 */
.rp-state--loading {
  box-sizing: border-box;
  justify-content: center;
  padding: calc(env(safe-area-inset-top) + calc(104 * min(100vw, 420px) / 750)) calc(44 * min(100vw, 420px) / 750) calc(env(safe-area-inset-bottom) + calc(76 * min(100vw, 420px) / 750));
}

.rp-state--loading .rp-deco {
  opacity: 0.72;
  animation: rpLoadingStarfield 4.8s ease-in-out infinite;
}

.rp-loading-sky {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
}

.rp-loading-star {
  position: absolute;
  width: calc(8 * min(100vw, 420px) / 750);
  height: calc(8 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 0 calc(18 * min(100vw, 420px) / 750) rgba(255, 255, 255, 0.78);
  animation: rpLoadingStarPulse 2.6s ease-in-out infinite;
}

.rp-loading-star--a {
  left: 22%;
  top: 28%;
}

.rp-loading-star--b {
  right: 18%;
  top: 24%;
  width: calc(6 * min(100vw, 420px) / 750);
  height: calc(6 * min(100vw, 420px) / 750);
  animation-delay: 0.7s;
}

.rp-loading-star--c {
  left: 28%;
  bottom: 25%;
  width: calc(5 * min(100vw, 420px) / 750);
  height: calc(5 * min(100vw, 420px) / 750);
  animation-delay: 1.2s;
}

.rp-loading-comet {
  position: absolute;
  top: 23%;
  left: -calc(160 * min(100vw, 420px) / 750);
  width: calc(160 * min(100vw, 420px) / 750);
  height: calc(3 * min(100vw, 420px) / 750);
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.86));
  transform: rotate(-16deg);
  animation: rpLoadingComet 4s ease-in-out infinite;
}

.rp-loading-stage {
  position: relative;
  z-index: 3;
  width: calc(520 * min(100vw, 420px) / 750);
  height: calc(430 * min(100vw, 420px) / 750);
  display: flex;
  align-items: center;
  justify-content: center;
}

.rp-state--loading .rp-loading-mascot {
  width: calc(390 * min(100vw, 420px) / 750);
  height: calc(390 * min(100vw, 420px) / 750);
  margin: 0;
  animation: rpLoadingMascotFloat 2.3s ease-in-out infinite;
  filter: drop-shadow(0 calc(28 * min(100vw, 420px) / 750) calc(34 * min(100vw, 420px) / 750) rgba(27, 11, 75, 0.28));
  -webkit-filter: drop-shadow(0 calc(28 * min(100vw, 420px) / 750) calc(34 * min(100vw, 420px) / 750) rgba(27, 11, 75, 0.28));
}

.rp-loading-glow {
  position: absolute;
  left: 50%;
  top: 56%;
  width: calc(390 * min(100vw, 420px) / 750);
  height: calc(170 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(125, 211, 252, 0.34), rgba(168, 85, 247, 0));
  transform: translate(-50%, -50%);
  animation: rpLoadingGlowPulse 2.3s ease-in-out infinite;
}

.rp-loading-orbit {
  position: absolute;
  left: 50%;
  top: 52%;
  border-radius: 50%;
  border: calc(2 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.2);
  pointer-events: none;
}

.rp-loading-orbit--a {
  width: calc(470 * min(100vw, 420px) / 750);
  height: calc(170 * min(100vw, 420px) / 750);
  animation: rpLoadingOrbitA 7.5s linear infinite;
}

.rp-loading-orbit--b {
  width: calc(390 * min(100vw, 420px) / 750);
  height: calc(132 * min(100vw, 420px) / 750);
  border-color: rgba(125, 211, 252, 0.28);
  animation: rpLoadingOrbitB 6.2s linear infinite;
}

.rp-loading-panel {
  position: relative;
  z-index: 4;
  width: 100%;
  max-width: calc(560 * min(100vw, 420px) / 750);
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: calc(8 * min(100vw, 420px) / 750);
}

.rp-state--loading .rp-loading-title {
  color: #fff !important;
  font-size: calc(32 * min(100vw, 420px) / 750);
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: 0;
  text-shadow: 0 calc(10 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(28, 12, 84, 0.28);
}

.rp-loading-sub {
  margin-top: calc(14 * min(100vw, 420px) / 750);
  font-size: calc(24 * min(100vw, 420px) / 750);
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.76);
  text-align: center;
}

.rp-loading-bar {
  position: relative;
  width: calc(360 * min(100vw, 420px) / 750);
  height: calc(12 * min(100vw, 420px) / 750);
  margin-top: calc(28 * min(100vw, 420px) / 750);
  overflow: hidden;
  border-radius: calc(999 * min(100vw, 420px) / 750);
  background: rgba(255, 255, 255, 0.22);
  box-shadow: inset 0 0 0 calc(1 * min(100vw, 420px) / 750) rgba(255, 255, 255, 0.18);
}

.rp-loading-bar__shine {
  position: absolute;
  left: -45%;
  top: 0;
  width: 45%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0), #fff, rgba(125, 211, 252, 0.85));
  animation: rpLoadingBar 1.65s ease-in-out infinite;
}

.rp-loading-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(12 * min(100vw, 420px) / 750);
  margin-top: calc(18 * min(100vw, 420px) / 750);
}

.rp-loading-dot {
  width: calc(10 * min(100vw, 420px) / 750);
  height: calc(10 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.82);
  animation: rpLoadingDot 1.2s ease-in-out infinite;
}

.rp-loading-dot--b {
  animation-delay: 0.16s;
}

.rp-loading-dot--c {
  animation-delay: 0.32s;
}

@keyframes rpLoadingStarfield {
  0%,
  100% {
    opacity: 0.55;
    transform: translateY(0);
  }
  50% {
    opacity: 0.9;
    transform: translateY(-calc(8 * min(100vw, 420px) / 750));
  }
}

@keyframes rpLoadingStarPulse {
  0%,
  100% {
    opacity: 0.35;
    transform: scale(0.8);
  }
  50% {
    opacity: 1;
    transform: scale(1.3);
  }
}

@keyframes rpLoadingComet {
  0% {
    opacity: 0;
    transform: translate3d(0, 0, 0) rotate(-16deg);
  }
  14% {
    opacity: 0.9;
  }
  42%,
  100% {
    opacity: 0;
    transform: translate3d(calc(980 * min(100vw, 420px) / 750), calc(210 * min(100vw, 420px) / 750), 0) rotate(-16deg);
  }
}

@keyframes rpLoadingMascotFloat {
  0%,
  100% {
    transform: translateY(0) scale(1);
  }
  50% {
    transform: translateY(-calc(18 * min(100vw, 420px) / 750)) scale(1.025);
  }
}

@keyframes rpLoadingGlowPulse {
  0%,
  100% {
    opacity: 0.54;
    transform: translate(-50%, -50%) scale(0.94);
  }
  50% {
    opacity: 0.9;
    transform: translate(-50%, -50%) scale(1.08);
  }
}

@keyframes rpLoadingOrbitA {
  from {
    transform: translate(-50%, -50%) rotate(-12deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(348deg);
  }
}

@keyframes rpLoadingOrbitB {
  from {
    transform: translate(-50%, -50%) rotate(18deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(-342deg);
  }
}

@keyframes rpLoadingBar {
  0% {
    left: -45%;
  }
  100% {
    left: 105%;
  }
}

@keyframes rpLoadingDot {
  0%,
  100% {
    opacity: 0.35;
    transform: translateY(0);
  }
  50% {
    opacity: 1;
    transform: translateY(-calc(8 * min(100vw, 420px) / 750));
  }
}

@media (max-height: 700px) {
  .rp-state--loading {
    padding-top: calc(env(safe-area-inset-top) + calc(82 * min(100vw, 420px) / 750));
    padding-bottom: calc(env(safe-area-inset-bottom) + calc(52 * min(100vw, 420px) / 750));
  }

  .rp-loading-stage {
    height: calc(360 * min(100vw, 420px) / 750);
  }

  .rp-state--loading .rp-loading-mascot {
    width: calc(330 * min(100vw, 420px) / 750);
    height: calc(330 * min(100vw, 420px) / 750);
  }

  .rp-state--loading .rp-loading-title {
    font-size: calc(28 * min(100vw, 420px) / 750);
  }
}

/* 封面开始按钮：报告是纵向翻页，箭头和质感都固定为向下进入 */
.rp-scene--cover .rp-start-btn,
.rp-start-btn {
  width: calc(104 * min(100vw, 420px) / 750) !important;
  height: calc(104 * min(100vw, 420px) / 750) !important;
  border-radius: 50% !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.24)) !important;
  border: calc(1 * min(100vw, 420px) / 750) solid rgba(255, 255, 255, 0.72) !important;
  box-shadow:
    inset 0 calc(2 * min(100vw, 420px) / 750) 0 rgba(255, 255, 255, 0.62),
    inset 0 -calc(12 * min(100vw, 420px) / 750) calc(24 * min(100vw, 420px) / 750) rgba(255, 255, 255, 0.16),
    0 calc(18 * min(100vw, 420px) / 750) calc(36 * min(100vw, 420px) / 750) rgba(38, 18, 101, 0.24) !important;
  backdrop-filter: blur(calc(22 * min(100vw, 420px) / 750)) saturate(150%);
  -webkit-backdrop-filter: blur(calc(22 * min(100vw, 420px) / 750)) saturate(150%);
}

.rp-scene--cover .rp-start-btn__arrow,
.rp-start-btn__arrow {
  display: block;
  width: 100%;
  text-align: center;
  color: #4f7cff !important;
  font-size: calc(46 * min(100vw, 420px) / 750) !important;
  font-weight: 800 !important;
  line-height: calc(104 * min(100vw, 420px) / 750);
  text-shadow: 0 calc(2 * min(100vw, 420px) / 750) calc(8 * min(100vw, 420px) / 750) rgba(255, 255, 255, 0.66);
}

/* Web / 录屏：隐藏报告内所有滚动条，保留触摸滑动 */
html.gr-promo-record,
html.gr-promo-record body,
.gr-book,
.gr-book .gr-swiper,
.gr-book .rp-poster--game,
.gr-book .rp-poster--radar-mech,
.gr-book .rp-poster--stats,
.gr-book .rp-comment-scroll,
.gr-book .rp-letter-scroll {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.rp-poster--firsts {
  padding-bottom: calc(env(safe-area-inset-bottom) + calc(56 * min(100vw, 420px) / 750));
}

.rp-scene--first_memories .rp-firsts-tail.rp-blk-tail {
  margin-bottom: calc(12 * min(100vw, 420px) / 750);
}

.rp-scene--first_memories .rp-first-card,
.rp-scene--first_memories .rp-first-card__body,
.rp-scene--first_memories .rp-first-card__date,
.rp-scene--first_memories .rp-first-card__label,
.rp-scene--first_memories .rp-first-card__title,
.rp-scene--first_memories .rp-first-card__line {
  text-align: left;
}

.rp-scene--first_memories .rp-first-card {
  align-items: start;
}

.rp-scene--first_memories .rp-first-card__body {
  align-items: flex-start;
}

html.gr-promo-record::-webkit-scrollbar,
html.gr-promo-record body::-webkit-scrollbar,
.gr-book::-webkit-scrollbar,
.gr-book .gr-swiper::-webkit-scrollbar,
.gr-book .rp-poster--game::-webkit-scrollbar,
.gr-book .rp-poster--radar-mech::-webkit-scrollbar,
.gr-book .rp-poster--stats::-webkit-scrollbar,
.gr-book .rp-comment-scroll::-webkit-scrollbar,
.gr-book .rp-letter-scroll::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
  background: transparent !important;
}

/* ── 期末报告推广 · 取景器首页（第 1 页） ── */
html.gr-promo-record .rp-scene--promo_splash,
html.gr-promo-record .rp-scene--promo_splash .rp-page--promo-cover {
  background: #050608 !important;
}

.rp-scene--promo_splash .rp-page--promo-cover {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  min-height: 0;
  padding:
    calc(env(safe-area-inset-top, 0px) + 24 * min(100vw, 420px) / 750)
    calc(28 * min(100vw, 420px) / 750)
    calc(env(safe-area-inset-bottom, 0px) + 28 * min(100vw, 420px) / 750);
  box-sizing: border-box;
  overflow: hidden;
}

.rp-promo-cover__logo {
  flex: 0 0 auto;
  display: flex;
  justify-content: center;
  width: 100%;
  margin-bottom: calc(20 * min(100vw, 420px) / 750);
}

.rp-promo-cover__logo-img {
  display: block;
  width: calc(320 * min(100vw, 420px) / 750);
  height: calc(72 * min(100vw, 420px) / 750);
  object-fit: contain;
}

.rp-promo-cover__frame {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 0;
  padding: 0 calc(8 * min(100vw, 420px) / 750);
}

.rp-promo-cover__bezel {
  position: relative;
  width: min(100%, calc(620 * min(100vw, 420px) / 750));
  height: 100%;
  max-height: calc(980 * min(100vw, 420px) / 750);
  padding: calc(14 * min(100vw, 420px) / 750);
  border-radius: calc(44 * min(100vw, 420px) / 750);
  background: linear-gradient(145deg, #2a2f3a 0%, #0f1218 42%, #050608 100%);
  box-shadow:
    inset 0 calc(2 * min(100vw, 420px) / 750) calc(8 * min(100vw, 420px) / 750) rgba(255, 255, 255, 0.08),
    inset 0 calc(-4 * min(100vw, 420px) / 750) calc(12 * min(100vw, 420px) / 750) rgba(0, 0, 0, 0.65),
    0 calc(8 * min(100vw, 420px) / 750) calc(28 * min(100vw, 420px) / 750) rgba(0, 0, 0, 0.45);
  box-sizing: border-box;
}

.rp-promo-cover__screen {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: calc(32 * min(100vw, 420px) / 750);
  background-color: #87ceeb;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  overflow: hidden;
}

.rp-promo-cover__copy {
  position: absolute;
  left: calc(36 * min(100vw, 420px) / 750);
  top: calc(88 * min(100vw, 420px) / 750);
  right: calc(24 * min(100vw, 420px) / 750);
  text-align: left;
  z-index: 2;
}

.rp-promo-cover__title-line {
  font-size: calc(52 * min(100vw, 420px) / 750);
  line-height: 1.22;
  font-weight: 800;
  color: #1f9fd8;
  letter-spacing: calc(1 * min(100vw, 420px) / 750);
  text-shadow:
    0 calc(2 * min(100vw, 420px) / 750) calc(8 * min(100vw, 420px) / 750) rgba(255, 255, 255, 0.55),
    0 calc(1 * min(100vw, 420px) / 750) 0 rgba(255, 255, 255, 0.35);
}

.rp-promo-cover__sub {
  margin-top: calc(18 * min(100vw, 420px) / 750);
  font-size: calc(28 * min(100vw, 420px) / 750);
  line-height: 1.45;
  font-weight: 600;
  color: #1a2433;
  letter-spacing: calc(0.5 * min(100vw, 420px) / 750);
}

.rp-promo-cover__highlight-line {
  margin-top: calc(10 * min(100vw, 420px) / 750);
  font-size: calc(30 * min(100vw, 420px) / 750);
  line-height: 1.35;
  font-weight: 800;
  color: #e11d48;
  letter-spacing: calc(0.5 * min(100vw, 420px) / 750);
}

.rp-promo-cover__cta {
  flex: 0 0 auto;
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: calc(24 * min(100vw, 420px) / 750);
}

.rp-promo-cover__btn {
  appearance: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(148 * min(100vw, 420px) / 750);
  height: calc(148 * min(100vw, 420px) / 750);
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #2a3140 0%, #0a0d14 72%, #050608 100%);
  box-shadow:
    0 0 0 calc(3 * min(100vw, 420px) / 750) rgba(120, 180, 255, 0.22),
    0 0 calc(24 * min(100vw, 420px) / 750) rgba(80, 160, 255, 0.35),
    inset 0 calc(2 * min(100vw, 420px) / 750) calc(6 * min(100vw, 420px) / 750) rgba(255, 255, 255, 0.12),
    inset 0 calc(-3 * min(100vw, 420px) / 750) calc(8 * min(100vw, 420px) / 750) rgba(0, 0, 0, 0.55);
  padding: calc(12 * min(100vw, 420px) / 750);
  box-sizing: border-box;
}

.rp-promo-cover__btn:active {
  transform: scale(0.96);
}

.rp-promo-cover__btn-label {
  display: block;
  max-width: 4em;
  font-size: calc(26 * min(100vw, 420px) / 750);
  line-height: 1.35;
  font-weight: 700;
  color: #f8fafc;
  letter-spacing: calc(2 * min(100vw, 420px) / 750);
  text-align: center;
}

html.gr-promo-record .rp-scene--promo_splash .rp-page--promo-cover {
  padding-top: calc(env(safe-area-inset-top, 0px) + 16 * min(100vw, 420px) / 750);
}

/* Promo recording motion polish: keep Youyou lively; let badges and pets breathe gently. */
@keyframes rpYoyoWiggleSoft {
  0%,
  100% {
    transform: var(--rp-yoyo-motion-base, translate3d(0, 0, 0)) translate3d(0, 0, 0) rotate(-1deg);
  }
  24% {
    transform: var(--rp-yoyo-motion-base, translate3d(0, 0, 0)) translate3d(0, -4px, 0) rotate(1.4deg);
  }
  52% {
    transform: var(--rp-yoyo-motion-base, translate3d(0, 0, 0)) translate3d(0, 1px, 0) rotate(-0.6deg);
  }
  76% {
    transform: var(--rp-yoyo-motion-base, translate3d(0, 0, 0)) translate3d(0, -2px, 0) rotate(1deg);
  }
}

@keyframes rpImageBreatheSoft {
  0%,
  100% {
    transform: var(--rp-breathe-motion-base, translate3d(0, 0, 0)) scale(1);
  }
  50% {
    transform: var(--rp-breathe-motion-base, translate3d(0, 0, 0)) scale(1.045);
  }
}

html.gr-promo-record .rp-mascot,
html.gr-promo-record .rp-uni__mascot,
html.gr-promo-record .rp-loading-mascot {
  transform-origin: 50% 78%;
  animation: rpYoyoWiggleSoft 2.65s ease-in-out infinite !important;
  will-change: transform;
}

html.gr-promo-record .rp-mascot--peek-letter {
  --rp-yoyo-motion-base: rotate(-6deg);
}

html.gr-promo-record .rp-medal-badge__img,
html.gr-promo-record .rp-milestone-badge-chip__img,
html.gr-promo-record .rp-milestone-inline-visual__img--badge,
html.gr-promo-record .sp-badge-earned__img,
html.gr-promo-record .sp-badge-progress__img,
html.gr-promo-record .rp-pet-form-card__img,
html.gr-promo-record .rp-finale-pet-img,
html.gr-promo-record .rp-milestone-pet__img,
html.gr-promo-record .rp-milestone-inline-visual__img[src*="/images/pets/"],
html.gr-promo-record .rp-glass-tile__icon-img[src*="/images/pets/"],
html.gr-promo-record .rp-first-card__icon-img[src*="/badges/"] {
  transform-origin: 50% 58%;
  animation: rpImageBreatheSoft 2.5s ease-in-out infinite !important;
  will-change: transform;
}

html.gr-promo-record .rp-medal-badge:nth-child(2n) .rp-medal-badge__img,
html.gr-promo-record .rp-milestone-badge-chip:nth-child(2n) .rp-milestone-badge-chip__img,
html.gr-promo-record .rp-pet-form-card:nth-child(2n) .rp-pet-form-card__img {
  animation-delay: 0.32s !important;
}