/* 星座深度解析 — 对照蓝湖「其他新测试02」深蓝紫/金布局 */
body.product-xingzuo {
  --xz-night: #24104a;
  --xz-purple: #3a1a78;
  --xz-gold: #e8c36a;
  --xz-cream: #fff8ec;
  --xz-paper: #f8efe0;
  --xz-ink: #5a3a1d;
  --xz-border: #c9ae7d;
  --xz-sky:
    radial-gradient(1.2px 1.2px at 8% 12%, rgba(255, 246, 210, .72) 0, transparent 100%),
    radial-gradient(1px 1px at 22% 28%, rgba(255, 255, 255, .5) 0, transparent 100%),
    radial-gradient(1.4px 1.4px at 41% 8%, rgba(255, 236, 180, .48) 0, transparent 100%),
    radial-gradient(1px 1px at 63% 18%, rgba(255, 255, 255, .42) 0, transparent 100%),
    radial-gradient(1.2px 1.2px at 81% 9%, rgba(255, 246, 210, .62) 0, transparent 100%),
    radial-gradient(1px 1px at 92% 32%, rgba(255, 255, 255, .38) 0, transparent 100%),
    radial-gradient(1px 1px at 15% 62%, rgba(255, 236, 180, .32) 0, transparent 100%),
    radial-gradient(1.2px 1.2px at 48% 71%, rgba(255, 255, 255, .38) 0, transparent 100%),
    radial-gradient(1px 1px at 74% 58%, rgba(255, 246, 210, .42) 0, transparent 100%),
    radial-gradient(1px 1px at 88% 78%, rgba(255, 255, 255, .32) 0, transparent 100%),
    radial-gradient(ellipse at 50% -8%, rgba(118, 62, 198, .55) 0%, transparent 46%),
    radial-gradient(ellipse at 82% 28%, rgba(92, 40, 158, .38) 0%, transparent 40%),
    radial-gradient(ellipse at 18% 86%, rgba(76, 32, 138, .42) 0%, transparent 44%),
    linear-gradient(180deg, #2d1568 0%, #3b1a7a 22%, #2a125c 58%, #24104a 100%);
}

body.product-xingzuo,
body.product-xingzuo .app {
  background: var(--xz-sky);
}

body.product-xingzuo .top-feedback {
  background: #1a0d2e;
  color: #f3e6c8;
}

body.product-xingzuo .top-feedback button {
  background: transparent;
  border: 1px solid var(--xz-gold);
  color: var(--xz-gold);
  border-radius: 999px;
}

body.product-xingzuo .notice {
  background: rgba(12, 6, 24, .72);
}

body.product-xingzuo[data-current-page="result"],
body.product-xingzuo[data-current-page="result"] .app,
body.product-xingzuo .page-result {
  background: var(--xz-paper);
}

body.product-xingzuo .page-home,
body.product-xingzuo .page-form,
body.product-xingzuo .page-pay {
  background: var(--xz-sky);
}

body.product-xingzuo .page-home .sticky-cta,
body.product-xingzuo .page-home .zodiac-zone {
  display: none !important;
}

/* ===== 首页：头图 + 按钮轻微上叠，不被下方内容盖住 ===== */
body.product-xingzuo .marriage-hero-wrap {
  position: relative;
  z-index: 5;
  background: transparent;
}

body.product-xingzuo .marriage-hero-img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  pointer-events: none;
}

body.product-xingzuo .marriage-cta-btn {
  display: block;
  width: 100%;
  margin: -12% 0 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  position: relative;
  z-index: 40;
  pointer-events: auto;
  -webkit-tap-highlight-color: transparent;
}

body.product-xingzuo .marriage-cta-btn img {
  display: block;
  width: 100%;
  height: auto;
  pointer-events: none;
}

body.product-xingzuo .marriage-cta-btn:active {
  transform: translateY(1px);
  opacity: 0.96;
}

/* 覆盖运程 .home-content { margin-top:-80px }，避免挡住开始按钮 */
body.product-xingzuo .home-content,
body.product-xingzuo .marriage-home-content {
  margin-top: 0 !important;
  padding: 0 14px 28px;
  position: relative;
  z-index: 1;
  background: transparent;
}

body.product-xingzuo .page-home .marriage-home-content {
  margin-top: 0 !important;
}

body.product-xingzuo .marriage-home-consent {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 10px 2px 16px;
  color: #fff4e8;
}

body.product-xingzuo .marriage-home-consent .agreement-text,
body.product-xingzuo .marriage-home-consent .agreement-link,
body.product-xingzuo .agreement-text,
body.product-xingzuo .history-link {
  color: #f4e6c8;
}

body.product-xingzuo .marriage-home-consent .history-link {
  color: #ffe08a;
  text-decoration: underline;
  white-space: nowrap;
  background: transparent;
  border: 0;
  font-size: 13px;
}

body.product-xingzuo .marriage-learn-block {
  margin: 0 -14px 16px;
  padding: 0;
  background: transparent;
  border: 0;
}

body.product-xingzuo .marriage-learn-block-img {
  display: block;
  width: 100%;
  height: auto;
  pointer-events: none;
}

body.product-xingzuo .marriage-pay-note,
body.product-xingzuo .pay-note,
body.product-xingzuo .footer-service {
  color: #f4e6c8;
}

body.product-xingzuo .page-home .footer-service,
body.product-xingzuo .page-form .footer-service,
body.product-xingzuo .page-pay .footer-service {
  color: #fff4e8;
}

/* ===== 输入页：覆盖运程 .form-content { margin-top:-240px } 和绝对定位字段 ===== */
body.product-xingzuo .form-content,
body.product-xingzuo .marriage-form-content {
  margin-top: -72px !important;
  padding: 0 14px 28px;
  position: relative;
  z-index: 6;
  overflow: visible;
  background: transparent;
}

body.product-xingzuo .page-form .info-card.marriage-home-form,
body.product-xingzuo .marriage-home-form.info-card {
  position: relative;
  margin: 22px auto 0;
  padding: 28px 16px 12px;
  min-height: 0 !important;
  background: #fffaf1;
  border: 2px solid #d2c3a1;
  border-radius: 14px;
  box-shadow: 0 8px 18px rgba(40, 16, 70, 0.28);
  overflow: visible !important;
  z-index: 8;
}

body.product-xingzuo .marriage-form-badge-img {
  position: absolute;
  top: -22px;
  left: 50%;
  transform: translateX(-50%);
  width: min(78%, 300px);
  height: auto;
  display: block;
  pointer-events: none;
  z-index: 12;
}

body.product-xingzuo .marriage-home-form::after {
  content: "请输入信息";
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 13;
  color: #fff8e0;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 2px;
  white-space: nowrap;
  pointer-events: none;
  text-shadow: 0 1px 2px rgba(20, 8, 40, .45);
}

body.product-xingzuo .page-form .marriage-home-form .input-fields,
body.product-xingzuo .marriage-home-form .input-fields {
  position: relative !important;
  inset: auto !important;
  display: grid;
  gap: 0;
  margin-top: 8px;
  padding: 6px 0 0 !important;
  justify-content: flex-start;
  z-index: 1;
}

body.product-xingzuo .page-form .marriage-home-form .form-row,
body.product-xingzuo .marriage-home-form .form-row {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  margin: 0;
  padding: 10px 4px;
  background: transparent;
  border: 0;
  border-bottom: 1px solid #8f7a4a;
  border-radius: 0;
  font-size: 15px;
  color: var(--xz-ink);
}

body.product-xingzuo .marriage-home-form .form-row.birth-row:last-of-type,
body.product-xingzuo .marriage-home-form .submit-img {
  border-bottom: 0;
}

body.product-xingzuo .marriage-home-form .form-row > span {
  flex: 0 0 5.6em;
  width: 5.6em;
  color: #4a2f24;
  font-size: 15px;
  font-weight: 700;
  white-space: nowrap;
}

body.product-xingzuo .marriage-home-form .form-row input,
body.product-xingzuo .marriage-home-form .birth-row b {
  flex: 1;
  min-width: 0;
  border: 0;
  background: transparent;
  color: #3f2a1d;
  font-size: 15px;
  text-align: left;
  outline: none;
}

body.product-xingzuo .marriage-home-form .form-row input::placeholder,
body.product-xingzuo .marriage-home-form .birth-row b {
  color: #b29a84;
  font-weight: 400;
}

body.product-xingzuo .marriage-home-form .birth-row.has-value b {
  color: #3f2a1d;
  font-weight: 600;
}

body.product-xingzuo .marriage-home-form .gender-group {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-left: 0;
  flex: 0 0 auto;
}

body.product-xingzuo .marriage-home-form .gender {
  width: 40px;
  height: 40px;
  min-width: 40px;
  border-radius: 50%;
  border: 2px solid #c9a24a;
  background: transparent;
  color: #8a6420;
  font-size: 15px;
  font-weight: 700;
  padding: 0;
  line-height: 1;
}

body.product-xingzuo .marriage-home-form .gender.active {
  background: var(--xz-gold);
  border-color: var(--xz-gold);
  color: #2a1450;
}

body.product-xingzuo .marriage-submit-btn,
body.product-xingzuo .marriage-home-form .submit-img {
  display: block;
  width: calc(100% + 28px);
  margin: 8px -14px 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  min-height: 0;
  filter: none;
  animation: none;
  transform: none;
  position: relative;
  z-index: 8;
  pointer-events: auto;
}

body.product-xingzuo .marriage-submit-btn img,
body.product-xingzuo .marriage-home-form .submit-img img {
  display: block;
  width: 100%;
  height: auto;
  pointer-events: none;
}

/* ===== Loading ===== */
body.product-xingzuo .page-loading {
  min-height: 100vh;
  width: 100%;
  background:
    radial-gradient(ellipse at 50% 82%, rgba(108, 58, 186, 0.62) 0%, rgba(42, 16, 88, 0) 48%),
    linear-gradient(180deg, #3a1868 0%, #2a1058 38%, #1e0c42 100%);
}

body.product-xingzuo .page-loading.is-active {
  align-items: stretch;
}

body.product-xingzuo .marriage-loading-shell {
  width: 100%;
  box-sizing: border-box;
  padding: 0 16px 28px;
  background: transparent;
}

body.product-xingzuo .marriage-loading-top {
  display: block;
  width: calc(100% + 32px);
  max-width: none;
  height: auto;
  margin: 0 -16px 8px;
  pointer-events: none;
}

body.product-xingzuo .marriage-loading-card {
  position: relative;
  margin: -20px auto 18px;
  padding: 32px 16px 18px;
  background: #fffdf8;
  border-radius: 16px;
  box-shadow: 0 10px 24px rgba(40, 16, 70, 0.22);
}

body.product-xingzuo .marriage-loading-badge-img {
  position: absolute;
  top: -18px;
  left: 50%;
  transform: translateX(-50%);
  width: min(86%, 300px);
  height: auto;
  display: block;
  pointer-events: none;
  z-index: 2;
}

body.product-xingzuo .marriage-loading-card::after {
  content: "正在解析你的星座特质";
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  color: #fff8e0;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.4px;
  white-space: nowrap;
  pointer-events: none;
  text-shadow: 0 1px 2px rgba(20, 8, 40, .45);
}

body.product-xingzuo .marriage-loading-profile {
  display: grid;
  gap: 0;
}

body.product-xingzuo .marriage-loading-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 11px 2px;
  border-bottom: 1px dashed #ead7bf;
  font-size: 14px;
  color: #4a2f24;
}

body.product-xingzuo .marriage-loading-row--birth {
  display: block;
}

body.product-xingzuo .marriage-loading-row b {
  color: #7a4ac8;
  font-weight: 700;
}

body.product-xingzuo .page-loading .loading-info-text {
  margin: 14px 0 10px;
  text-align: center;
  color: #6d4a3a;
  font-size: 14px;
}

body.product-xingzuo .page-loading .progress-track {
  height: 10px;
  border-radius: 999px;
  background: #efe0c8;
  overflow: hidden;
}

body.product-xingzuo .page-loading .progress-track i,
body.product-xingzuo #loadingProgressFill {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #e8c36a, #b8862a);
}

body.product-xingzuo .xz-loading-pan-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 4px auto 0;
  width: min(82vw, 320px);
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 50%, #4a2288 0%, #2a1058 52%, #1e0c42 78%);
}

body.product-xingzuo .marriage-loading-compass {
  display: block;
  width: 100%;
  height: auto;
  background: transparent;
  filter: drop-shadow(0 10px 18px rgba(40, 10, 70, 0.35));
  animation: xz-compass-spin 12s linear infinite;
  pointer-events: none;
}

@keyframes xz-compass-spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

body.product-xingzuo .page-loading .loading-panel,
body.product-xingzuo .page-loading .pay-header,
body.product-xingzuo .page-loading .loading-card--module {
  display: none !important;
}

/* ===== 预付款 ===== */
body.product-xingzuo .page-pay .pay-top-img,
body.product-xingzuo .marriage-pay-top {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 !important;
  padding: 0;
  pointer-events: none;
  position: relative;
  z-index: 1;
}

body.product-xingzuo .page-pay .pay-header,
body.product-xingzuo .page-pay .pay-profile,
body.product-xingzuo .page-pay .pay-bazi-card {
  display: none !important;
}

body.product-xingzuo .page-pay {
  padding-bottom: calc(env(safe-area-inset-bottom) + 28px);
}

body.product-xingzuo .page-pay .pay-card.marriage-pay-card,
body.product-xingzuo .marriage-pay-card {
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  border-radius: 0;
  overflow: visible;
  box-shadow: none;
  z-index: 2;
}

body.product-xingzuo .marriage-pay-card--design {
  width: 100%;
  margin: -8.5% 0 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}

body.product-xingzuo .marriage-pay-card-bg {
  display: block;
  width: 100%;
  height: auto;
  pointer-events: none;
}

body.product-xingzuo .marriage-pay-ribbon {
  position: absolute;
  top: 2.05%;
  left: 50%;
  transform: translateX(-50%);
  width: 64%;
  height: 6.4%;
  min-height: 28px;
  z-index: 6;
  margin: 0;
  padding: 0 8px;
  border-radius: 6px;
  background: linear-gradient(90deg, #1c1468 0%, #241a7c 50%, #1c1468 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

body.product-xingzuo .marriage-pay-ribbon-text {
  display: block;
  max-width: 100%;
  color: #fff8e0;
  font-size: clamp(13px, 3.9vw, 16px);
  font-weight: 800;
  letter-spacing: 1px;
  white-space: nowrap;
  text-align: center;
  line-height: 1.2;
  text-shadow: 0 1px 2px rgba(20, 8, 40, .45);
}

body.product-xingzuo .marriage-pay-interact {
  position: absolute;
  left: 8%;
  right: 8%;
  top: 54%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  gap: 12px;
  z-index: 5;
  pointer-events: none;
}

body.product-xingzuo .marriage-pay-interact .marriage-price-row,
body.product-xingzuo .marriage-pay-interact .marriage-wechat-pay,
body.product-xingzuo .marriage-pay-interact .price-row,
body.product-xingzuo .marriage-pay-interact .wechat-pay {
  pointer-events: auto;
}

body.product-xingzuo .page-pay .marriage-price-row,
body.product-xingzuo .page-pay .price-row {
  position: static !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: end;
  gap: 10px;
  margin: 0;
  color: #481d16;
}

body.product-xingzuo .page-pay .price-left {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

body.product-xingzuo .page-pay .price-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 10px;
  border-radius: 8px;
  background: #ff8a1f;
  color: #fff;
}

body.product-xingzuo .page-pay .price-badge strong,
body.product-xingzuo #payPriceStrong {
  color: #fff;
  font-size: 18px;
}

body.product-xingzuo .page-pay #payPriceOrigin {
  display: block;
  color: #8a6a4f;
  text-decoration: line-through;
  font-size: 13px;
  padding-left: 4px;
}

body.product-xingzuo .page-pay .price-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  text-align: right;
  font-size: 13px;
  color: #6d4a3a;
}

body.product-xingzuo .page-pay .price-right b,
body.product-xingzuo #countdown {
  color: #b42318;
  font-size: 22px;
  line-height: 1.1;
}

body.product-xingzuo .page-pay .wechat-pay {
  position: static !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: 100%;
  height: 48px;
  margin: 2px 0 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border: 0;
  border-radius: 9px;
  color: #fff;
  background: #09bb07 !important;
  box-shadow: 0 4px 10px rgba(27, 112, 44, 0.22);
  font-size: 20px;
  font-weight: 900;
  pointer-events: auto;
  z-index: 5;
}

body.product-xingzuo .page-pay .wechat-pay img {
  width: 28px;
  height: 28px;
  object-fit: contain;
}

body.product-xingzuo .marriage-pay-secure {
  position: absolute;
  left: 6%;
  right: 6%;
  bottom: 5.8%;
  margin: 0;
  color: #39a72f;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  pointer-events: none;
}

body.product-xingzuo .marriage-pay-promo {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  pointer-events: none;
}

/* ===== 报告页 ===== */
body.product-xingzuo .xz-report-book,
body.product-xingzuo #reportCard {
  background: var(--xz-paper);
}

.xz-result-shell {
  padding: 8px 12px 20px;
  color: var(--xz-ink);
}

.xz-result-head,
.xz-section {
  background: #fffef9;
  border: 1px solid var(--xz-border);
  box-shadow: inset 0 0 0 3px #f3ead8;
  border-radius: 6px;
  padding: 16px 14px;
  margin-bottom: 12px;
}

.xz-result-title {
  text-align: center;
  font-size: 20px;
  font-weight: 800;
  margin-bottom: 8px;
}

.xz-result-name {
  text-align: center;
  font-size: 26px;
  letter-spacing: 10px;
  margin-bottom: 12px;
}

.xz-meta-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 12px;
  font-size: 14px;
}

.xz-meta-grid span {
  color: #8a6a4f;
}

.xz-stamp {
  width: 86px;
  height: 86px;
  margin: 10px auto 0;
  border: 2px solid #9c1c1c;
  border-radius: 50%;
  box-shadow: inset 0 0 0 3px #fffef9, inset 0 0 0 5px #9c1c1c;
  color: #9c1c1c;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 18px;
  font-weight: 800;
  line-height: 1.25;
  transform: rotate(-8deg);
}

.xz-archive-table {
  width: 100%;
  border-collapse: collapse;
  margin: 8px 0 14px;
  font-size: 14px;
}

.xz-archive-table th,
.xz-archive-table td {
  border: 1px solid #e4d2b0;
  padding: 8px 10px;
  text-align: left;
}

.xz-archive-table th {
  width: 30%;
  background: #fbf3e4;
  color: #7a5430;
}

.xz-section h3 {
  text-align: center;
  font-size: 22px;
  margin: 0 0 10px;
}

.xz-section p,
.xz-head-note,
.xz-result-end {
  line-height: 1.8;
  color: #5d4128;
}

.xz-head-note,
.xz-result-end {
  text-align: center;
  color: #a18d7b;
  font-size: 12px;
  margin: 12px 0 0;
}
