/* Auto-converted from mini program lottery.wxss */
:root { --u: calc(100vw / 750); }
@media (min-width: 540px) {
  :root { --u: 0.72px; }
}
html, body {
  margin: 0;
  padding: 0;
  min-height: 100%;
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", sans-serif;
  background: #fff7e8;
  color: #1a1a2e;
  -webkit-tap-highlight-color: transparent;
}
* { box-sizing: border-box; }
img { max-width: 100%; display: block; }
button, input { font: inherit; }
.hidden { display: none !important; }
.page-nav {
  position: sticky;
  top: 0;
  z-index: 800;
  height: calc(var(--u) * 88);
  display: flex;
  align-items: center;
  justify-content: center;
  background: #FFF7E8;
  border-bottom: 1px solid rgba(0,0,0,0.04);
  font-size: calc(var(--u) * 34);
  font-weight: 700;
  color: #111827;
}
.avatar-wrap { position: relative; width: calc(var(--u) * 80); height: calc(var(--u) * 80); flex-shrink: 0; }
.avatar-circle {
  width: 100%; height: 100%; border-radius: 50%; overflow: hidden;
  background: #ffe4c4; display: flex; align-items: center; justify-content: center;
}
.avatar-img { width: 100%; height: 100%; object-fit: cover; }
.avatar-picker-overlay {
  position: absolute; inset: 0; opacity: 0; cursor: pointer; border: 0; padding: 0; margin: 0; background: transparent;
}
.toast {
  position: fixed; left: 50%; top: 46%; transform: translate(-50%, -50%);
  z-index: 3000; max-width: 70%; padding: 12px 18px; border-radius: 10px;
  background: rgba(17,24,39,.88); color: #fff; font-size: 14px; text-align: center; pointer-events: none;
}
.confirm-box {
  width: min(320px, 100%); background: #fff; border-radius: 16px; padding: 22px 18px 16px; text-align: center;
}
.confirm-box h3 { margin: 0 0 10px; font-size: 17px; }
.confirm-box p { margin: 0 0 18px; color: #6b7280; font-size: 14px; line-height: 1.6; }
.confirm-actions { display: flex; gap: 10px; }
.confirm-actions button {
  flex: 1; border: 0; border-radius: 999px; padding: 12px 8px; font-weight: 700; cursor: pointer;
}
.confirm-cancel { background: #f3f4f6; color: #4b5563; }
.confirm-ok { background: linear-gradient(135deg, #ef4444 0%, #f97316 100%); color: #fff; }
.lottery-shell {
  min-height: calc(100vh - calc(var(--u) * 88));
  background: linear-gradient(180deg, #fff7e8 0%, #ffffff 42%, #fff6f1 100%);
  position: relative;
}

.page-scroll {
  min-height: calc(100vh - calc(var(--u) * 88));
  box-sizing: border-box;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: calc(var(--u) * 40);
}

.page {
  box-sizing: border-box;
  padding: calc(var(--u) * 24) calc(var(--u) * 24) calc(var(--u) * 40);
}

.hero-banner {
  text-align: center;
  padding: calc(var(--u) * 28) calc(var(--u) * 10) calc(var(--u) * 32);
}

.hero-main-title {
  display: block;
  font-size: calc(var(--u) * 64);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: calc(var(--u) * 6);
  color: #7c2d12;
  text-shadow: 0 calc(var(--u) * 8) calc(var(--u) * 24) rgba(249, 115, 22, 0.18);
}

.winner-marquee {
  margin: calc(var(--u) * 20) 0 0;
  padding: calc(var(--u) * 16) calc(var(--u) * 24);
  border-radius: calc(var(--u) * 999);
  background: rgba(127, 29, 29, 0.86);
  color: #fff7d6;
  font-size: calc(var(--u) * 24);
  font-weight: 700;
  overflow: hidden;
  box-shadow: 0 calc(var(--u) * 12) calc(var(--u) * 28) rgba(127, 29, 29, 0.16);
}

.marquee-track {
  white-space: nowrap;
  animation: marqueeMove 9s linear infinite;
}

.marquee-text {
  display: inline-block;
  min-width: 100%;
}

@keyframes marqueeMove {
  0% { transform: translateX(100%); }
  100% { transform: translateX(-100%); }
}

.section-card {
  box-sizing: border-box;
  background: #ffffff;
  border-radius: calc(var(--u) * 28);
  box-shadow: 0 calc(var(--u) * 16) calc(var(--u) * 48) rgba(15, 23, 42, 0.08);
  margin-bottom: calc(var(--u) * 24);
  padding: calc(var(--u) * 28);
}

.user-status-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.user-status-main {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
}

.user-status-copy {
  flex: 1;
  min-width: 0;
  margin-left: calc(var(--u) * 18);
}

.user-status-name {
  display: block;
  font-size: calc(var(--u) * 28);
  font-weight: 800;
  color: #111827;
  width: 100%;
  height: calc(var(--u) * 44);
  line-height: calc(var(--u) * 44);
}

.user-status-id {
  display: block;
  margin-top: calc(var(--u) * 8);
  font-size: calc(var(--u) * 22);
  color: #6b7280;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.draw-progress-card {
  flex-shrink: 0;
  margin-left: calc(var(--u) * 20);
  padding: calc(var(--u) * 16) calc(var(--u) * 20);
  border-radius: calc(var(--u) * 22);
  background: #fff7ed;
  text-align: center;
}

.draw-progress-label {
  display: block;
  font-size: calc(var(--u) * 22);
  color: #9a3412;
}

.draw-progress-value {
  display: block;
  margin-top: calc(var(--u) * 6);
  font-size: calc(var(--u) * 24);
  font-weight: 800;
  color: #c2410c;
}

.glow-slogan-wrap {
  text-align: center;
  padding-top: calc(var(--u) * 8);
}

.glow-slogan {
  display: inline-block;
  padding: calc(var(--u) * 12) calc(var(--u) * 32);
  border-radius: calc(var(--u) * 999);
  font-size: calc(var(--u) * 38);
  font-weight: 800;
  line-height: 1.2;
  color: #fff7d6;
  background: linear-gradient(135deg, #dc2626 0%, #f97316 100%);
  box-shadow: 0 0 calc(var(--u) * 18) rgba(249, 115, 22, 0.35), 0 0 calc(var(--u) * 36) rgba(239, 68, 68, 0.22);
  animation: sloganFloat 1.8s ease-in-out infinite, sloganGlow 1.8s ease-in-out infinite;
}

@keyframes sloganFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-calc(var(--u) * 10)); }
}

@keyframes sloganGlow {
  0%, 100% { box-shadow: 0 0 calc(var(--u) * 18) rgba(249, 115, 22, 0.35), 0 0 calc(var(--u) * 36) rgba(239, 68, 68, 0.22); }
  50% { box-shadow: 0 0 calc(var(--u) * 28) rgba(249, 115, 22, 0.55), 0 0 calc(var(--u) * 56) rgba(239, 68, 68, 0.35); }
}

.ring-board {
  position: relative;
  width: calc(var(--u) * 640);
  height: calc(var(--u) * 640);
  margin: calc(var(--u) * 32) auto 0;
  border-radius: 50%;
  background: radial-gradient(circle, #fffdf5 0%, #fff3cf 42%, #f97316 78%, #b91c1c 100%);
  box-shadow: inset 0 0 0 calc(var(--u) * 18) rgba(255, 248, 220, 0.88), inset 0 0 0 calc(var(--u) * 38) rgba(185, 28, 28, 0.2), 0 calc(var(--u) * 24) calc(var(--u) * 56) rgba(185, 28, 28, 0.22);
}

.ring-board-inner {
  position: absolute;
  top: calc(var(--u) * 56);
  right: calc(var(--u) * 56);
  bottom: calc(var(--u) * 56);
  left: calc(var(--u) * 56);
  border: calc(var(--u) * 6) dashed rgba(255, 244, 160, 0.95);
  border-radius: 50%;
  box-shadow: 0 0 0 calc(var(--u) * 8) rgba(185, 28, 28, 0.18);
  pointer-events: none;
  z-index: 1;
}

.ring-item {
  position: absolute;
  box-sizing: border-box;
  width: calc(var(--u) * 176);
  height: calc(var(--u) * 176);
  padding: calc(var(--u) * 16);
  border-radius: 50%;
  border: calc(var(--u) * 6) solid #facc15;
  background: linear-gradient(135deg, #ffffff 0%, #fff7ed 100%);
  box-shadow: 0 calc(var(--u) * 12) calc(var(--u) * 28) rgba(127, 29, 29, 0.16);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  z-index: 2;
}

.ring-item--active {
  background: linear-gradient(135deg, #f97316 0%, #ef4444 100%);
  transform: scale(1.06);
  box-shadow: 0 calc(var(--u) * 18) calc(var(--u) * 36) rgba(249, 115, 22, 0.3);
}

.ring-item--active .prize-name {
  color: #ffffff;
}

.ring-item--0 { top: -calc(var(--u) * 18); left: calc(var(--u) * 232); }
.ring-item--1 { top: calc(var(--u) * 84); right: calc(var(--u) * 8); }
.ring-item--2 { bottom: calc(var(--u) * 84); right: calc(var(--u) * 8); }
.ring-item--3 { bottom: -calc(var(--u) * 18); left: calc(var(--u) * 232); }
.ring-item--4 { bottom: calc(var(--u) * 84); left: calc(var(--u) * 8); }
.ring-item--5 { top: calc(var(--u) * 84); left: calc(var(--u) * 8); }

.prize-image {
  width: calc(var(--u) * 86);
  height: calc(var(--u) * 86);
  margin-bottom: calc(var(--u) * 12);
  border-radius: calc(var(--u) * 20);
  background: rgba(255, 255, 255, 0.72);
}

.prize-name {
  font-size: calc(var(--u) * 24);
  font-weight: 700;
  line-height: 1.4;
  color: #111827;
}

.ring-center-button {
  position: absolute;
  top: calc(var(--u) * 190);
  left: calc(var(--u) * 190);
  z-index: 3;
  width: calc(var(--u) * 260);
  height: calc(var(--u) * 260);
  border-radius: 50%;
  background: linear-gradient(135deg, #ef4444 0%, #f97316 100%);
  box-shadow: 0 calc(var(--u) * 20) calc(var(--u) * 48) rgba(239, 68, 68, 0.32);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #ffffff;
  box-sizing: border-box;
}

.ring-center-button--disabled {
  opacity: 0.7;
}

.draw-button-title {
  font-size: calc(var(--u) * 30);
  font-weight: 700;
}

.draw-button-price {
  margin-top: calc(var(--u) * 12);
  font-size: calc(var(--u) * 24);
}

.draw-button-price--amount {
  margin-top: calc(var(--u) * 8);
  padding: calc(var(--u) * 6) calc(var(--u) * 18);
  border-radius: calc(var(--u) * 999);
  font-size: calc(var(--u) * 30);
  font-weight: 800;
  color: #fff7d6;
  background: rgba(255, 255, 255, 0.22);
}

.section-header,
.record-item,
.reward-record-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.section-title,
.modal-title {
  font-size: calc(var(--u) * 34);
  font-weight: 700;
  color: #111827;
}

.section-desc,
.record-subtitle {
  color: #6b7280;
  font-size: calc(var(--u) * 24);
}

.record-item {
  padding: calc(var(--u) * 20) 0;
  border-bottom: calc(var(--u) * 1) solid #f3f4f6;
}

.record-item:last-child {
  border-bottom: none;
}

.record-left {
  flex: 1;
  min-width: 0;
}

.record-title {
  display: block;
  font-size: calc(var(--u) * 26);
  font-weight: 600;
  color: #111827;
}

.record-subtitle {
  display: block;
  margin-top: calc(var(--u) * 8);
}

.record-tag {
  flex-shrink: 0;
  padding: calc(var(--u) * 10) calc(var(--u) * 24);
  border-radius: calc(var(--u) * 999);
  font-size: calc(var(--u) * 22);
  color: #c27a00;
  background: #fff2cc;
}

.empty-state {
  margin-top: calc(var(--u) * 24);
  padding: calc(var(--u) * 40) calc(var(--u) * 24);
  border-radius: calc(var(--u) * 24);
  background: #f9fafb;
  text-align: center;
  color: #6b7280;
  font-size: calc(var(--u) * 24);
}

.minor-ban-footer {
  display: block;
  margin: calc(var(--u) * 8) 0 calc(var(--u) * 24);
  text-align: center;
  font-size: calc(var(--u) * 24);
  font-weight: 800;
  line-height: 1.45;
  color: #dc2626;
  padding: 0 calc(var(--u) * 16);
}

.rule-side-button,
.reward-side-button,
.contact-side-button {
  position: fixed;
  right: 0;
  z-index: 500;
  width: calc(var(--u) * 88);
  padding: calc(var(--u) * 18) calc(var(--u) * 10);
  box-sizing: border-box;
  border-radius: calc(var(--u) * 24) 0 0 calc(var(--u) * 24);
  color: #ffffff;
  font-size: calc(var(--u) * 24);
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
}

.rule-side-button {
  top: 45vh;
  background: linear-gradient(135deg, #ef4444 0%, #f97316 100%);
  box-shadow: 0 calc(var(--u) * 12) calc(var(--u) * 32) rgba(239, 68, 68, 0.28);
}

.reward-side-button {
  top: calc(45vh + calc(var(--u) * 148));
  background: linear-gradient(135deg, #16a34a 0%, #22c55e 100%);
  box-shadow: 0 calc(var(--u) * 12) calc(var(--u) * 32) rgba(21, 128, 61, 0.28);
}

.contact-side-button {
  top: calc(45vh + calc(var(--u) * 296));
  background: linear-gradient(135deg, #2563eb 0%, #38bdf8 100%);
  box-shadow: 0 calc(var(--u) * 12) calc(var(--u) * 32) rgba(37, 99, 235, 0.26);
}

.rule-side-button text,
.reward-side-button text,
.contact-side-button text {
  display: block;
}

.modal-mask {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(var(--u) * 32);
  box-sizing: border-box;
  background: rgba(15, 23, 42, 0.52);
}

.modal-card {
  width: 100%;
  max-height: 80vh;
  box-sizing: border-box;
  background: #ffffff;
  border-radius: calc(var(--u) * 28);
  box-shadow: 0 calc(var(--u) * 16) calc(var(--u) * 48) rgba(15, 23, 42, 0.08);
  padding: calc(var(--u) * 32);
}

.notice-modal-card {
  max-height: 88vh;
  padding: calc(var(--u) * 32) calc(var(--u) * 28) calc(var(--u) * 36);
  border-radius: calc(var(--u) * 36);
}

.notice-modal-header,
.rules-modal-header {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.rules-modal-header {
  padding: calc(var(--u) * 36) calc(var(--u) * 64) calc(var(--u) * 28) 0;
}

.rules-modal-header::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: calc(var(--u) * 2);
  background: linear-gradient(90deg, rgba(249, 115, 22, 0.26) 0%, rgba(249, 115, 22, 0) 100%);
}

.rules-modal-title-group {
  display: flex;
  flex-direction: column;
}

.rules-modal-subtitle {
  margin-top: calc(var(--u) * 10);
  font-size: calc(var(--u) * 24);
  line-height: 1.45;
  color: #9a3412;
}

.notice-close-icon {
  position: absolute;
  top: -calc(var(--u) * 4);
  right: 0;
  width: calc(var(--u) * 56);
  height: calc(var(--u) * 56);
  line-height: calc(var(--u) * 56);
  text-align: center;
  font-size: calc(var(--u) * 42);
  color: #9ca3af;
}

.notice-dialog-body {
  margin-top: calc(var(--u) * 26);
  padding: calc(var(--u) * 24) calc(var(--u) * 20);
  border-radius: calc(var(--u) * 28);
  background: linear-gradient(180deg, #fff7ed 0%, #ffffff 100%);
  box-shadow: inset 0 0 0 calc(var(--u) * 2) rgba(249, 115, 22, 0.12);
}

.notice-dialog-scroll {
  max-height: 48vh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.notice-dialog-line {
  text-align: center;
  font-size: calc(var(--u) * 26);
  line-height: 1.72;
  color: #4b5563;
}

.notice-dialog-line + .notice-dialog-line {
  margin-top: calc(var(--u) * 16);
}

.announce-fragment--headline {
  font-size: calc(var(--u) * 40);
  font-weight: 900;
  color: #7c2d12;
}

.announce-fragment--hit {
  padding: calc(var(--u) * 8) calc(var(--u) * 18);
  border-radius: calc(var(--u) * 999);
  font-size: calc(var(--u) * 38);
  font-weight: 900;
  color: #ffffff;
  background: linear-gradient(135deg, #ef4444 0%, #f97316 100%);
}

.announce-fragment--price {
  padding: calc(var(--u) * 4) calc(var(--u) * 12);
  border-radius: calc(var(--u) * 12);
  font-size: calc(var(--u) * 32);
  font-weight: 900;
  color: #dc2626;
  background: #fef08a;
}

.announce-fragment--strong {
  font-weight: 900;
  color: #dc2626;
}

.notice-risk-card {
  margin-top: calc(var(--u) * 18);
  padding: calc(var(--u) * 18) calc(var(--u) * 22);
  border-radius: calc(var(--u) * 20);
  background: #fff7ed;
  color: #c2410c;
  font-size: calc(var(--u) * 24);
  line-height: 1.6;
}

.announcement-agree-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  font-size: calc(var(--u) * 25);
  font-weight: 700;
  color: #7c2d12;
}

.agree-checkbox {
  width: calc(var(--u) * 32);
  height: calc(var(--u) * 32);
  margin-right: calc(var(--u) * 10);
  border: calc(var(--u) * 2) solid #ccc;
  border-radius: calc(var(--u) * 6);
  display: flex;
  align-items: center;
  justify-content: center;
}

.agree-checkbox.checked {
  background: #ef4444;
  border-color: #ef4444;
}

.agree-check-icon {
  color: #ffffff;
  font-size: calc(var(--u) * 22);
  font-weight: 700;
}

.announcement-agreement-link {
  margin-left: calc(var(--u) * 8);
  color: #dc2626;
  text-decoration: underline;
}

.modal-footer {
  display: flex;
  justify-content: center;
  margin-top: calc(var(--u) * 28);
}

.modal-footer--dual {
  gap: calc(var(--u) * 20);
  width: 100%;
  box-sizing: border-box;
}

.modal-button {
  min-width: calc(var(--u) * 280);
  padding: calc(var(--u) * 18) calc(var(--u) * 48);
  border-radius: calc(var(--u) * 999);
  text-align: center;
  font-size: calc(var(--u) * 28);
  color: #ffffff;
  background: linear-gradient(135deg, #ef4444 0%, #f97316 100%);
  box-sizing: border-box;
}

.modal-button--half {
  flex: 1;
  min-width: 0;
  padding: calc(var(--u) * 18) calc(var(--u) * 24);
}

.notice-modal-button--disabled {
  color: #9ca3af;
  background: #e5e7eb;
}

.notice-section {
  padding: calc(var(--u) * 20) calc(var(--u) * 18);
  border-radius: calc(var(--u) * 22);
  background: rgba(255, 255, 255, 0.72);
}

.notice-section + .notice-section,
.notice-probability-list,
.notice-scroll-tip {
  margin-top: calc(var(--u) * 18);
}

.notice-section--important {
  background: #fff7ed;
}

.notice-section--danger {
  background: #fef2f2;
}

.notice-section-title {
  display: block;
  font-size: calc(var(--u) * 28);
  font-weight: 800;
  color: #9a3412;
}

.notice-section-text {
  display: block;
  margin-top: calc(var(--u) * 12);
  font-size: calc(var(--u) * 25);
  line-height: 1.72;
  color: #374151;
}

.notice-probability-list {
  padding: calc(var(--u) * 16) calc(var(--u) * 18);
  border-radius: calc(var(--u) * 22);
  background: #fff7ed;
}

.notice-probability-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: calc(var(--u) * 14) 0;
  font-size: calc(var(--u) * 25);
  font-weight: 700;
  color: #7c2d12;
}

.notice-scroll-tip {
  padding: calc(var(--u) * 18);
  border-radius: calc(var(--u) * 18);
  background: rgba(239, 68, 68, 0.08);
  text-align: center;
  color: #dc2626;
  font-size: calc(var(--u) * 24);
}

.rules-modal-card {
  width: 92%;
  padding: 0 calc(var(--u) * 28) calc(var(--u) * 34);
  border-radius: calc(var(--u) * 40);
  background: linear-gradient(180deg, #fff7ed 0%, #ffffff 28%, #ffffff 100%);
}

.rules-dialog-list {
  max-height: 52vh;
  margin-top: calc(var(--u) * 24);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.rule-card {
  padding: calc(var(--u) * 22) calc(var(--u) * 24);
  border-radius: calc(var(--u) * 24);
  border: calc(var(--u) * 2) solid #f3f4f6;
  background: #ffffff;
}

.rule-card + .rule-card {
  margin-top: calc(var(--u) * 18);
}

.rule-card--highlight {
  border-color: rgba(249, 115, 22, 0.32);
  background: linear-gradient(180deg, #fff7ed 0%, #ffffff 100%);
}

.rule-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.rule-tag {
  padding: calc(var(--u) * 8) calc(var(--u) * 18);
  border-radius: calc(var(--u) * 999);
  font-size: calc(var(--u) * 22);
  font-weight: 700;
  color: #b45309;
  background: #fff2cc;
}

.rule-tag--highlight {
  color: #ffffff;
  background: linear-gradient(135deg, #ef4444 0%, #f97316 100%);
}

.rule-emphasis {
  padding: calc(var(--u) * 6) calc(var(--u) * 14);
  border-radius: calc(var(--u) * 999);
  font-size: calc(var(--u) * 20);
  font-weight: 700;
  color: #dc2626;
  background: rgba(239, 68, 68, 0.08);
}

.rule-text {
  display: block;
  margin-top: calc(var(--u) * 16);
  font-size: calc(var(--u) * 25);
  line-height: 1.75;
  color: #374151;
}

.game-id-modal-card,
.contact-modal-card {
  width: 92%;
  padding: calc(var(--u) * 38) calc(var(--u) * 32) calc(var(--u) * 40);
  text-align: center;
}

.game-id-modal-desc {
  display: block;
  margin-top: calc(var(--u) * 18);
  font-size: calc(var(--u) * 26);
  line-height: 1.7;
  color: #6b7280;
}

.game-id-input {
  width: 100%;
  height: calc(var(--u) * 88);
  margin-top: calc(var(--u) * 28);
  padding: 0 calc(var(--u) * 24);
  box-sizing: border-box;
  border-radius: calc(var(--u) * 20);
  border: calc(var(--u) * 2) solid #fed7aa;
  background: #fff7ed;
  color: #7c2d12;
  font-size: calc(var(--u) * 28);
}

.contact-qr-code {
  width: calc(var(--u) * 420);
  margin: calc(var(--u) * 32) auto 0;
  border-radius: calc(var(--u) * 28);
}

.contact-wechat-card {
  margin-top: calc(var(--u) * 32);
  padding: calc(var(--u) * 32) calc(var(--u) * 24);
  border-radius: calc(var(--u) * 28);
  background: #fff7ed;
}

.contact-wechat-label,
.contact-wechat-value {
  display: block;
  color: #7c2d12;
}

.contact-wechat-value {
  margin-top: calc(var(--u) * 12);
  font-size: calc(var(--u) * 28);
  font-weight: 700;
}

.contact-close-button {
  color: #4b5563;
  background: #f3f4f6;
}

.result-modal-card {
  width: 92%;
  padding: calc(var(--u) * 36) calc(var(--u) * 32) calc(var(--u) * 40);
  border-radius: calc(var(--u) * 40);
  position: relative;
  overflow: hidden;
  text-align: center;
}

.result-modal-card--win {
  background: linear-gradient(180deg, #fff7d6 0%, #ffffff 42%, #fff7ed 100%);
}

.result-modal-card--miss {
  background: #ffffff;
}

.result-stage {
  width: calc(var(--u) * 320);
  height: calc(var(--u) * 320);
  margin: calc(var(--u) * 36) auto 0;
  border-radius: calc(var(--u) * 36);
  background: linear-gradient(135deg, #fff7e8 0%, #fff1d6 100%);
  display: flex;
  align-items: center;
  justify-content: center;
}

.result-image {
  width: calc(var(--u) * 240);
  height: calc(var(--u) * 240);
}

.result-empty-card {
  width: calc(var(--u) * 240);
  height: calc(var(--u) * 240);
  border-radius: calc(var(--u) * 28);
  background: linear-gradient(135deg, #f97316 0%, #ef4444 100%);
  display: flex;
  align-items: center;
  justify-content: center;
}

.result-empty-text {
  font-size: calc(var(--u) * 40);
  font-weight: 700;
  color: #ffffff;
}

.result-name {
  display: block;
  margin-top: calc(var(--u) * 28);
  font-size: calc(var(--u) * 34);
  font-weight: 700;
  color: #111827;
}

.result-notice {
  display: block;
  margin: calc(var(--u) * 18) auto 0;
  padding: calc(var(--u) * 18) calc(var(--u) * 22);
  border-radius: calc(var(--u) * 24);
  font-size: calc(var(--u) * 28);
  font-weight: 800;
  line-height: 1.55;
  color: #ffffff;
  background: linear-gradient(135deg, #ef4444 0%, #f97316 100%);
}

.result-modal-card--miss .result-notice {
  width: 92%;
  box-sizing: border-box;
  background: #f59e0b;
  text-align: center;
  box-shadow: 0 calc(var(--u) * 6) 0 rgba(180, 83, 9, 0.28);
}

.result-miss-banner {
  width: 92%;
  box-sizing: border-box;
  margin: calc(var(--u) * 20) auto 0;
  padding: calc(var(--u) * 22) calc(var(--u) * 20) calc(var(--u) * 20);
  border-radius: calc(var(--u) * 24);
  background: #f59e0b;
  box-shadow: 0 calc(var(--u) * 8) 0 rgba(180, 83, 9, 0.3);
  text-align: center;
}

.result-miss-line1 {
  font-size: calc(var(--u) * 30);
  font-weight: 800;
  line-height: 1.4;
  color: #ffffff;
  letter-spacing: 0.5px;
}

.result-miss-line2 {
  margin-top: calc(var(--u) * 10);
  font-size: calc(var(--u) * 34);
  font-weight: 900;
  line-height: 1.3;
  color: #fff7ed;
  letter-spacing: 3px;
  text-shadow: 0 1px 0 rgba(146, 64, 14, 0.35);
}

.result-friend-tip {
  margin: calc(var(--u) * 10) auto 0;
  padding: 0;
  font-size: calc(var(--u) * 18);
  line-height: 1.4;
  color: #c4c4c4;
  text-align: center;
  font-weight: 400;
}

.result-miss-hero-wrap {
  width: 78%;
  margin: calc(var(--u) * 8) auto 0;
}

.result-miss-hero {
  display: block;
  width: 100%;
  height: auto;
}

.result-modal-card--miss .modal-title.hidden,
.result-modal-card--miss .result-stage.hidden {
  display: none !important;
}

.pay-resume-banner {
  position: fixed;
  left: 0;
  right: 0;
  bottom: calc(56px + env(safe-area-inset-bottom));
  z-index: 1400;
  padding: 12px 14px;
  pointer-events: none;
}

.pay-resume-banner.hidden {
  display: none !important;
}

.pay-resume-banner-inner {
  pointer-events: auto;
  background: rgba(17, 24, 39, 0.92);
  color: #fff;
  border-radius: 14px;
  padding: 14px 16px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}

.pay-resume-title {
  font-size: 15px;
  font-weight: 700;
}

.pay-resume-desc {
  margin-top: 6px;
  font-size: 12px;
  line-height: 1.55;
  color: #e5e7eb;
}

.pay-resume-actions {
  margin-top: 12px;
}

.pay-resume-btn {
  width: 100%;
  border: 0;
  border-radius: 999px;
  padding: 10px 14px;
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(135deg, #ef4444 0%, #f97316 100%);
}

.reward-modal-card {
  max-height: 78vh;
}

.reward-record-list {
  max-height: calc(var(--u) * 720);
  margin-top: calc(var(--u) * 20);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.reward-record-item {
  gap: calc(var(--u) * 18);
  padding: calc(var(--u) * 20) 0;
  border-bottom: calc(var(--u) * 2) solid #f3f4f6;
}

.reward-redeem-button--done {
  min-width: calc(var(--u) * 132);
  padding: 0 calc(var(--u) * 20);
  color: #6b7280;
  background: #e5e7eb;
}

.avatar-fallback {
  font-size: calc(var(--u) * 24);
}