:root {
  --apple-bg-start: #fff8ef;
  --apple-bg-end: #ebf8f3;
  --apple-surface: rgba(255, 255, 255, 0.78);
  --apple-surface-strong: rgba(255, 255, 255, 0.92);
  --apple-border: rgba(28, 37, 50, 0.12);
  --apple-text-primary: #162133;
  --apple-text-secondary: #5f6a79;
  --apple-accent: #127d6f;
  --apple-accent-strong: #0d5f55;
  --apple-accent-soft: #d7f1ea;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "PingFang SC", "Helvetica Neue", Arial, sans-serif;
  color: var(--apple-text-primary);
  background: var(--apple-bg-start);
}

* { box-sizing: border-box; }

html, body, #root {
  margin: 0;
  height: 100%;
  min-height: 100%;
}

html, body {
  height: 100dvh;
  overflow: hidden;
  background:
    radial-gradient(88% 62% at 102% -6%, rgba(248, 165, 87, 0.24), transparent 64%),
    radial-gradient(72% 48% at -16% 24%, rgba(95, 196, 174, 0.2), transparent 70%),
    linear-gradient(180deg, var(--apple-bg-start) 0%, var(--apple-bg-end) 100%);
}

#root {
  height: 100dvh;
}

button, input, select, textarea { font: inherit; }

.apple-root {
  position: relative;
  isolation: isolate;
  min-height: 100dvh;
  height: 100dvh;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
  padding: calc(env(safe-area-inset-top, 0px) + 14px) 0 calc(env(safe-area-inset-bottom, 0px) + 116px);
  --page-tint-a: rgba(248, 165, 87, 0.2);
  --page-tint-b: rgba(95, 196, 174, 0.18);
}

.apple-root-form,
.apple-root-stored-action,
.apple-root-detail {
  padding-top: calc(env(safe-area-inset-top, 0px) + 2px);
  padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 16px);
}

.apple-root::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  background:
    radial-gradient(70% 50% at 100% 0%, var(--page-tint-a), transparent 68%),
    radial-gradient(58% 44% at 0% 20%, var(--page-tint-b), transparent 72%);
  transition: opacity 280ms ease, filter 280ms ease;
}

.apple-root-native::before {
  display: none;
}

.apple-root-native .apple-main-enter {
  animation: none;
}

.apple-root-native .apple-device {
  position: relative;
  z-index: 2;
}

.apple-root-events {
  --page-tint-a: rgba(248, 165, 87, 0.22);
  --page-tint-b: rgba(95, 196, 174, 0.14);
}

.apple-root-coupons {
  --page-tint-a: rgba(248, 126, 98, 0.2);
  --page-tint-b: rgba(255, 196, 111, 0.2);
}

.apple-root-memberships {
  --page-tint-a: rgba(100, 151, 225, 0.19);
  --page-tint-b: rgba(111, 209, 192, 0.18);
}

.apple-root-discover {
  --page-tint-a: rgba(114, 179, 102, 0.2);
  --page-tint-b: rgba(252, 187, 92, 0.18);
}

.apple-root-mine {
  --page-tint-a: rgba(249, 157, 106, 0.2);
  --page-tint-b: rgba(112, 180, 214, 0.16);
}

.apple-root-detail {
  --page-tint-a: rgba(95, 162, 224, 0.17);
  --page-tint-b: rgba(96, 202, 173, 0.14);
}

.apple-device {
  width: min(430px, calc(100% - 20px));
  margin: 0 auto;
}

.apple-version-badge {
  position: fixed;
  right: 10px;
  top: calc(env(safe-area-inset-top, 0px) + 10px);
  z-index: 50;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 700;
  color: #1b4b44;
  background: rgba(232, 246, 240, 0.9);
  box-shadow: inset 0 0 0 1px rgba(115, 165, 152, 0.24);
}

.apple-summary-wrap {
  display: flex;
  justify-content: flex-end;
  padding: 0 2px;
  margin-bottom: 8px;
  animation: section-rise 260ms ease-out both;
}

.apple-refresh-pill {
  border: 0;
  border-radius: 999px;
  padding: 8px 14px;
  font-size: 12px;
  font-weight: 600;
  color: #18564f;
  background: rgba(228, 247, 240, 0.92);
  box-shadow: inset 0 0 0 1px rgba(115, 165, 152, 0.26);
  transition: transform 160ms ease, background 180ms ease, box-shadow 180ms ease;
}

.apple-refresh-pill:hover {
  background: rgba(214, 241, 232, 0.98);
  box-shadow: inset 0 0 0 1px rgba(88, 145, 131, 0.38);
}

.apple-refresh-pill:active {
  transform: scale(0.97);
}

.apple-summary {
  display: flex;
  gap: 8px;
  padding: 0 2px;
  margin-top: 0;
  animation: section-rise 280ms ease-out both;
}

.apple-summary-pill {
  flex: 1;
  border-radius: 14px;
  padding: 9px 10px;
  font-size: 12px;
  text-align: center;
  color: #1f4d45;
  border: 1px solid rgba(255, 255, 255, 0.7);
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.9), rgba(239, 250, 246, 0.74));
  backdrop-filter: blur(14px);
  box-shadow: 0 8px 16px rgba(38, 62, 80, 0.08);
  transition: transform 170ms ease, box-shadow 170ms ease;
}

.apple-summary-pill:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 20px rgba(38, 62, 80, 0.12);
}

.apple-error-banner {
  margin-top: 10px;
  padding: 9px 12px;
  border-radius: 14px;
  border: 1px solid rgba(235, 106, 106, 0.25);
  background: rgba(255, 235, 238, 0.8);
  color: #8f2231;
  font-size: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.apple-error-retry {
  border: 0;
  border-radius: 10px;
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 600;
  color: #741726;
  background: rgba(255, 255, 255, 0.75);
}

.apple-main {
  margin-top: 6px;
  padding: 0 2px;
}

.apple-root-form .apple-main,
.apple-root-stored-action .apple-main {
  margin-top: 0;
}

.apple-main-enter {
  animation: main-swap 260ms cubic-bezier(.2, .8, .2, 1);
}

.apple-tabbar {
  position: fixed;
  left: 50%;
  bottom: calc(env(safe-area-inset-bottom, 0px) + 6px);
  transform: translateX(-50%);
  z-index: 35;
  width: min(430px, calc(100% - 20px));
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 4px;
  padding: 8px;
  border-radius: 24px;
  background: linear-gradient(130deg, rgba(255, 255, 255, 0.92), rgba(233, 246, 240, 0.84));
  border: 1px solid rgba(255, 255, 255, 0.78);
  backdrop-filter: blur(26px) saturate(1.16);
  box-shadow: 0 24px 36px rgba(27, 45, 61, 0.16);
}

.apple-tab {
  border: 0;
  background: transparent;
  color: #6a7282;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  border-radius: 16px;
  padding: 7px 6px;
  font-size: 11px;
  font-weight: 500;
  transition: transform 160ms ease, color 160ms ease, background 170ms ease;
}

.apple-tab:hover {
  color: #1f3f3a;
  background: rgba(236, 250, 244, 0.78);
}

.apple-tab-icon {
  width: 28px;
  height: 28px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 170ms ease, box-shadow 170ms ease, background 170ms ease;
}

.apple-tab-active {
  color: #0f322d;
}

.apple-tab-active .apple-tab-icon {
  transform: translateY(-1px);
  background: linear-gradient(160deg, #145f54 0%, #188370 100%);
  color: #fff;
  box-shadow: 0 10px 18px rgba(24, 115, 99, 0.34);
}

.apple-fab {
  position: fixed;
  right: calc(50% - 174px);
  bottom: calc(env(safe-area-inset-bottom, 0px) + 92px);
  z-index: 36;
  width: 58px;
  height: 58px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.65);
  color: #fff;
  background: linear-gradient(145deg, #14816f 0%, #15675b 100%);
  box-shadow: 0 16px 24px rgba(17, 91, 79, 0.35);
  transition: transform 170ms ease, filter 180ms ease, box-shadow 180ms ease;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}

.apple-fab:hover {
  filter: brightness(1.06);
  box-shadow: 0 20px 30px rgba(17, 91, 79, 0.42);
}

.apple-fab:active {
  transform: scale(0.95);
}

.apple-fab-dragging {
  cursor: grabbing;
  filter: brightness(1.05);
  box-shadow: 0 22px 34px rgba(17, 91, 79, 0.42);
}

.wanhao-card {
  background: var(--apple-surface);
  border: 1px solid var(--apple-border);
  backdrop-filter: blur(16px);
  box-shadow: 0 12px 24px rgba(23, 38, 53, 0.08);
}

.wanhao-surface-card {
  background: linear-gradient(164deg, rgba(255, 255, 255, 0.9), rgba(242, 250, 247, 0.8));
}

.wanhao-stat-card {
  background: linear-gradient(164deg, rgba(255, 255, 255, 0.96), rgba(237, 249, 245, 0.86));
}

.wanhao-section-card {
  background: linear-gradient(164deg, rgba(255, 255, 255, 0.94), rgba(243, 251, 248, 0.82));
}

.wanhao-asset-card {
  background: linear-gradient(164deg, rgba(255, 255, 255, 0.96), rgba(243, 251, 247, 0.86));
}

.wanhao-asset-amount {
  background: rgba(236, 249, 245, 0.88);
}

.wanhao-swipe-shell {
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.34), rgba(242, 248, 255, 0.24));
  border: 1px solid rgba(180, 198, 236, 0.34);
}

.wanhao-swipe-delete {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 82px;
  border: 0;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.02em;
  background: linear-gradient(165deg, rgba(255, 127, 150, 0.84), rgba(234, 84, 122, 0.9));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.34),
    -10px 0 20px rgba(210, 77, 114, 0.24);
  backdrop-filter: blur(14px) saturate(1.22);
  opacity: 0;
  pointer-events: none;
  transform: translateX(10px);
  transition: opacity 180ms ease, transform 180ms ease, filter 180ms ease;
}

.wanhao-swipe-delete::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0));
  pointer-events: none;
}

.wanhao-swipe-delete-open {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(0);
}

.wanhao-swipe-main {
  position: relative;
  z-index: 1;
  touch-action: pan-y;
  transition: transform 190ms ease;
}

.wanhao-swipe-main-open {
  transform: translateX(-82px);
}

.wanhao-card-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}

.wanhao-card-left {
  min-width: 0;
}

.wanhao-card-right {
  min-width: 112px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}

.wanhao-coupon-type-right {
  margin-right: 5px;
}

.wanhao-asset-amount-spot {
  min-width: 88px;
  justify-content: center;
}

.wanhao-date-chip {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  border-radius: 12px;
  border: 1px solid rgba(154, 191, 182, 0.4);
  background: rgba(236, 249, 245, 0.88);
  color: #2b5a55;
  padding: 6px 10px;
}

.wanhao-date-chip-label {
  font-size: 10px;
  font-weight: 600;
  opacity: 0.82;
}

.wanhao-date-chip-value {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.wanhao-card-tag {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  border: 1px solid rgba(146, 179, 170, 0.35);
  background: rgba(233, 246, 240, 0.9);
  color: #2d5753;
  padding: 2px 8px;
  font-size: 10px;
  font-weight: 700;
}

.wanhao-card-action-btn {
  min-width: 74px;
  height: 34px;
  padding: 0 10px;
}

.wanhao-countdown-muted {
  color: #3a546a;
}

.wanhao-countdown-expired {
  color: #c13b3b;
}

.wanhao-countdown-number {
  display: inline-flex;
  min-width: 24px;
  justify-content: center;
  margin: 0 2px;
  padding: 0 6px;
  border-radius: 9px;
  font-size: 1.06em;
  line-height: 1.28;
  font-weight: 800;
}

.wanhao-countdown-number-normal {
  color: #1c5f50;
  background: rgba(214, 243, 233, 0.9);
}

.wanhao-countdown-number-soon {
  color: #9d4e10;
  background: rgba(255, 233, 201, 0.9);
}

.wanhao-countdown-number-urgent {
  color: #b12a2a;
  background: rgba(255, 220, 220, 0.92);
}

.wanhao-calendar-action {
  min-width: 34px;
  height: 34px;
  padding: 0 8px;
}

.wanhao-card-actions-right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  min-height: 34px;
}

.wanhao-card-clearing {
  animation: card-clearing 420ms cubic-bezier(.22,.84,.22,1) both;
}

.wanhao-empty-card {
  background: rgba(255, 255, 255, 0.84);
}

.wanhao-interactive-card {
  transition: transform 170ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.wanhao-interactive-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 28px rgba(23, 41, 59, 0.12);
  border-color: rgba(22, 119, 103, 0.2);
}

.wanhao-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.wanhao-page > * {
  animation: section-rise 280ms ease-out both;
}

.wanhao-page > *:nth-child(2) { animation-delay: 40ms; }
.wanhao-page > *:nth-child(3) { animation-delay: 78ms; }
.wanhao-page > *:nth-child(4) { animation-delay: 116ms; }

.wanhao-stat-grid > * {
  animation: section-rise 280ms ease-out both;
}

.wanhao-stat-grid > *:nth-child(2) { animation-delay: 52ms; }
.wanhao-stat-grid > *:nth-child(3) { animation-delay: 84ms; }
.wanhao-stat-grid > *:nth-child(4) { animation-delay: 116ms; }

.wanhao-card-stack > * {
  animation: section-rise 280ms ease-out both;
}

.wanhao-card-stack > *:nth-child(2) { animation-delay: 56ms; }
.wanhao-card-stack > *:nth-child(3) { animation-delay: 88ms; }
.wanhao-card-stack > *:nth-child(4) { animation-delay: 120ms; }

.wanhao-hero-card {
  background: linear-gradient(145deg, #1f4b64 0%, #1a786f 52%, #2e9f8d 100%);
  border: 1px solid rgba(255, 255, 255, 0.25);
  box-shadow: 0 18px 32px rgba(21, 65, 79, 0.3);
}

.wanhao-hero-card-events {
  background: linear-gradient(146deg, #1f4b64 0%, #1a786f 52%, #2e9f8d 100%);
}

.wanhao-hero-card-coupons {
  background: linear-gradient(148deg, #7c3f2f 0%, #bf6d45 48%, #de8b57 100%);
}

.wanhao-hero-card-memberships {
  background: linear-gradient(145deg, #32477a 0%, #326d92 52%, #4b97b3 100%);
}

.wanhao-hero-card-discover {
  background: linear-gradient(145deg, #2f6f46 0%, #458e53 52%, #6cab63 100%);
}

.wanhao-hero-card-mine {
  background: linear-gradient(145deg, #42518d 0%, #2f7b8e 52%, #4ca59d 100%);
}

.wanhao-hero-icon {
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.22);
}

.wanhao-discover-chip {
  background: rgba(240, 249, 245, 0.9);
  border: 1px solid rgba(154, 196, 184, 0.24);
}

.wanhao-offer-row {
  background: rgba(240, 249, 245, 0.88);
  border: 1px solid rgba(154, 196, 184, 0.24);
  transition: transform 170ms ease, box-shadow 170ms ease;
}

.wanhao-offer-row:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 18px rgba(24, 49, 67, 0.1);
}

.wanhao-setting-row {
  background: rgba(243, 250, 247, 0.9);
  border: 1px solid rgba(154, 196, 184, 0.24);
  transition: transform 170ms ease, box-shadow 170ms ease;
}

.wanhao-setting-row:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 18px rgba(24, 49, 67, 0.1);
}

.wanhao-setting-icon {
  background: rgba(225, 242, 236, 0.96);
  border: 1px solid rgba(138, 182, 169, 0.32);
}

.wanhao-mine-export {
  white-space: nowrap;
}

.wanhao-mine-user-badge {
  max-width: 180px;
  padding: 2px 0;
  text-align: right;
}

.wanhao-mine-user-name {
  font-size: 12px;
  font-weight: 700;
  color: #ffffff;
}

.wanhao-mine-user-phone {
  margin-top: 2px;
  font-size: 11px;
  color: rgba(236, 246, 255, 0.92);
  overflow: hidden;
  text-overflow: ellipsis;
}

.wanhao-btn {
  border-radius: 14px;
  border: 1px solid transparent;
  font-weight: 600;
  letter-spacing: -0.01em;
  transition: transform 160ms ease, filter 170ms ease, box-shadow 190ms ease;
}

.wanhao-btn:active {
  transform: scale(0.97);
}

.wanhao-btn-primary {
  background: linear-gradient(150deg, #16816e 0%, #145f55 100%);
  box-shadow: 0 10px 20px rgba(17, 91, 79, 0.25);
}

.wanhao-btn-outline {
  background: rgba(255, 255, 255, 0.76);
  border-color: rgba(30, 86, 78, 0.18);
}

.wanhao-btn-secondary {
  background: rgba(214, 240, 232, 0.76);
}

.wanhao-btn-sm { min-height: 36px; }
.wanhao-btn-md { min-height: 40px; }

.wanhao-input {
  border: 1px solid rgba(31, 83, 76, 0.18);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
  color: var(--apple-text-primary);
}

.wanhao-input:focus {
  outline: none;
  border-color: rgba(23, 125, 108, 0.6);
  box-shadow: 0 0 0 3px rgba(20, 141, 121, 0.16);
}

select, textarea {
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.9);
}

.wanhao-asset-form {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  gap: 12px;
  padding-bottom: 12px;
}

.wanhao-form-page {
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 14px);
}

.apple-root-native .wanhao-form-page,
.apple-root-native .wanhao-asset-form,
.apple-root-native .wanhao-form-section,
.apple-root-native .wanhao-submit-zone,
.apple-root-native .wanhao-form-page-header {
  position: relative;
  z-index: 3;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  backface-visibility: hidden;
}

.apple-root-native .wanhao-form-page-header {
  backdrop-filter: none;
}

.wanhao-form-page-header {
  position: sticky;
  top: 0;
  z-index: 12;
  display: grid;
  grid-template-columns: 88px 1fr 88px;
  align-items: center;
  padding: 4px 2px 10px;
  background: linear-gradient(180deg, rgba(255, 248, 240, 0.96), rgba(255, 248, 240, 0.68) 74%, rgba(255, 248, 240, 0));
  backdrop-filter: blur(12px);
}

.wanhao-detail-page-header {
  grid-template-columns: 88px 1fr auto;
}

.wanhao-form-page-title {
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  color: #1b2f42;
}

.wanhao-form-page-placeholder {
  width: 88px;
}

.wanhao-form-version {
  justify-self: end;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 700;
  color: #1b4b44;
  background: rgba(232, 246, 240, 0.9);
  box-shadow: inset 0 0 0 1px rgba(115, 165, 152, 0.24);
}

.wanhao-form-back {
  width: fit-content;
  border: 0;
  border-radius: 999px;
  padding: 7px 12px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #1c4d45;
  font-size: 12px;
  font-weight: 600;
  background: rgba(232, 246, 240, 0.9);
  box-shadow: inset 0 0 0 1px rgba(115, 165, 152, 0.24);
  transition: transform 160ms ease, background 160ms ease;
}

.wanhao-form-back:active {
  transform: scale(0.97);
}

.wanhao-detail-head-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.wanhao-detail-kicker {
  color: rgba(31, 73, 98, 0.75);
  font-size: 12px;
  font-weight: 700;
}

.wanhao-detail-title {
  margin-top: 6px;
  font-size: 24px;
  line-height: 1.2;
  font-weight: 700;
  color: #19354a;
}

.wanhao-detail-meta {
  margin-top: 6px;
  font-size: 13px;
  color: #4f6478;
}

.wanhao-detail-countdown {
  margin-top: 10px;
  font-size: 20px;
  font-weight: 700;
  color: #1b3347;
}

.wanhao-detail-grid {
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.wanhao-detail-item {
  border: 1px solid rgba(154, 196, 184, 0.26);
  background: rgba(248, 253, 250, 0.9);
  border-radius: 14px;
  padding: 10px 12px;
}

.wanhao-detail-item-label {
  font-size: 11px;
  color: #66798c;
}

.wanhao-detail-item-value {
  margin-top: 4px;
  font-size: 14px;
  font-weight: 700;
  color: #2a4156;
}

.wanhao-detail-note {
  margin-top: 12px;
  white-space: pre-wrap;
  font-size: 13px;
  line-height: 1.55;
  color: #3c5268;
  border-radius: 14px;
  border: 1px solid rgba(154, 196, 184, 0.26);
  background: rgba(248, 253, 250, 0.9);
  padding: 10px 12px;
}

.wanhao-detail-code {
  margin-top: 12px;
  display: grid;
  gap: 8px;
}

.wanhao-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.wanhao-detail-bottom-actions {
  display: flex;
  justify-content: flex-end;
}

.wanhao-detail-delete-btn {
  color: #b42318 !important;
  border-color: rgba(219, 90, 90, 0.55) !important;
  background: rgba(255, 245, 245, 0.92) !important;
}

.wanhao-detail-delete-right {
  margin-left: auto;
}

.wanhao-form-hero {
  border-radius: 22px;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.64);
  background: linear-gradient(145deg, rgba(17, 92, 82, 0.94) 0%, rgba(28, 124, 108, 0.92) 58%, rgba(40, 156, 136, 0.88) 100%);
  box-shadow: 0 16px 26px rgba(16, 70, 64, 0.28);
}

.wanhao-form-hero-kicker {
  color: rgba(226, 245, 240, 0.9);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.wanhao-form-hero-title {
  margin-top: 4px;
  font-size: 21px;
  line-height: 1.24;
  font-weight: 700;
  color: #f7fffd;
}

.wanhao-form-hero-sub {
  margin-top: 8px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: rgba(235, 249, 245, 0.9);
  font-size: 12px;
}

.wanhao-form-hero-dot {
  width: 8px;
  height: 8px;
  border-radius: 99px;
  background: #ffe4c3;
  box-shadow: 0 0 0 4px rgba(255, 228, 195, 0.22);
}

.wanhao-form-section {
  border-radius: 20px;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.7);
  background: linear-gradient(168deg, rgba(255, 255, 255, 0.94), rgba(240, 249, 245, 0.84));
  box-shadow: 0 12px 22px rgba(23, 45, 60, 0.08);
}

.wanhao-form-section-emphasis {
  border-color: rgba(122, 176, 164, 0.32);
  background: linear-gradient(168deg, rgba(251, 255, 253, 0.98), rgba(233, 246, 241, 0.88));
}

.wanhao-section-title {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 6px;
  margin-bottom: 12px;
  font-size: 13px;
  font-weight: 700;
  color: #244247;
}

.wanhao-page-picker {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.wanhao-page-option {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid rgba(125, 171, 158, 0.28);
  border-radius: 19px;
  background: linear-gradient(165deg, rgba(251, 255, 253, 0.96), rgba(239, 249, 246, 0.84));
  color: #3a4c5e;
  padding: 11px 11px 14px;
  min-height: 136px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  text-align: left;
  transform-origin: center bottom;
  transition: transform 200ms ease, box-shadow 180ms ease, border-color 180ms ease, background 180ms ease;
}

.wanhao-page-option::before {
  content: '';
  position: absolute;
  left: -24px;
  top: -46px;
  width: 116px;
  height: 116px;
  border-radius: 999px;
  opacity: 0.58;
  z-index: 0;
}

.wanhao-page-option-events::before {
  background: radial-gradient(circle at center, rgba(172, 232, 208, 0.95), rgba(172, 232, 208, 0));
}

.wanhao-page-option-coupons::before {
  background: radial-gradient(circle at center, rgba(252, 220, 162, 0.95), rgba(252, 220, 162, 0));
}

.wanhao-page-option-memberships::before {
  background: radial-gradient(circle at center, rgba(180, 215, 255, 0.95), rgba(180, 215, 255, 0));
}

.wanhao-page-option > * {
  position: relative;
  z-index: 1;
}

.wanhao-page-option:hover {
  transform: translateY(-2px) scale(1.012);
  box-shadow: 0 14px 22px rgba(23, 45, 60, 0.14);
}

.wanhao-page-option:focus-visible {
  outline: none;
  border-color: rgba(23, 119, 104, 0.65);
  box-shadow: 0 0 0 3px rgba(24, 136, 116, 0.16);
}

.wanhao-page-option-active {
  border-color: rgba(24, 120, 104, 0.5);
  color: #143835;
  background: linear-gradient(165deg, rgba(234, 249, 243, 0.98), rgba(224, 246, 238, 0.96));
  box-shadow: 0 16px 28px rgba(20, 107, 92, 0.22);
}

.wanhao-page-option-sub {
  margin-top: 8px;
  font-size: 12px;
  line-height: 1.42;
  opacity: 0.84;
  white-space: pre-line;
}

.wanhao-type-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.wanhao-type-icon {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.62);
  color: #123d39;
  background: rgba(255, 255, 255, 0.78);
  box-shadow: 0 6px 12px rgba(24, 52, 74, 0.1);
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.wanhao-page-option-active .wanhao-type-icon {
  transform: translateY(-1px) scale(1.05);
  box-shadow: 0 9px 16px rgba(22, 64, 58, 0.17);
}

.wanhao-type-icon-events {
  color: #14695e;
  background: linear-gradient(145deg, rgba(231, 250, 243, 0.98), rgba(208, 241, 227, 0.96));
}

.wanhao-type-icon-coupons {
  color: #8f5c10;
  background: linear-gradient(145deg, rgba(255, 244, 221, 0.98), rgba(255, 229, 186, 0.94));
}

.wanhao-type-icon-memberships {
  color: #2f5ea9;
  background: linear-gradient(145deg, rgba(230, 242, 255, 0.98), rgba(210, 230, 255, 0.94));
}

.wanhao-type-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border-radius: 999px;
  padding: 5px 11px;
  font-size: 12px;
  font-weight: 700;
  color: #2d5753;
  letter-spacing: 0.2px;
  background: rgba(233, 246, 240, 0.92);
  border: 1px solid rgba(145, 185, 174, 0.36);
}

.wanhao-type-chip::before {
  content: '';
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: currentColor;
  opacity: 0.7;
}

.wanhao-page-option-events .wanhao-type-chip {
  color: #1f6359;
  background: rgba(222, 243, 235, 0.96);
}

.wanhao-page-option-coupons .wanhao-type-chip {
  color: #815214;
  background: rgba(255, 236, 211, 0.95);
}

.wanhao-page-option-memberships .wanhao-type-chip {
  color: #305992;
  background: rgba(218, 235, 255, 0.95);
}

.wanhao-type-check {
  position: absolute;
  right: 9px;
  bottom: 9px;
  width: 19px;
  height: 19px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: linear-gradient(145deg, #16816e 0%, #145f55 100%);
  box-shadow: 0 8px 14px rgba(21, 93, 83, 0.24);
  animation: type-check-pop 220ms ease-out;
}

@keyframes type-check-pop {
  0% {
    transform: scale(0.76);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

.wanhao-form-field {
  display: block;
  width: 100%;
}

.wanhao-form-field + .wanhao-form-field {
  margin-top: 10px;
}

.wanhao-form-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
  font-size: 13px;
  font-weight: 600;
  color: #30485b;
}

.wanhao-form-input,
.wanhao-form-select {
  width: 100%;
  min-height: 46px;
  border-radius: 14px;
  padding: 0 13px;
  border: 1px solid rgba(32, 87, 79, 0.2);
  background: rgba(255, 255, 255, 0.9);
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.wanhao-file-input-hidden {
  display: none;
}

.wanhao-file-picker-row {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  border-radius: 14px;
  padding: 6px 10px;
  border: 1px solid rgba(32, 87, 79, 0.2);
  background: rgba(255, 255, 255, 0.9);
}

.wanhao-file-picker-btn {
  min-height: 32px !important;
  padding: 0 12px !important;
  border-radius: 10px !important;
  white-space: nowrap;
}

.wanhao-file-picker-name {
  min-width: 0;
  flex: 1 1 auto;
  font-size: 13px;
  color: #4b6073;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.wanhao-form-input:focus,
.wanhao-form-select:focus {
  outline: none;
  border-color: rgba(25, 130, 113, 0.58);
  box-shadow: 0 0 0 3px rgba(20, 141, 121, 0.14);
}

.wanhao-money-input-wrap {
  position: relative;
}

.wanhao-money-prefix {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
  font-weight: 700;
  color: #2a5c57;
  pointer-events: none;
}

.wanhao-money-input {
  padding-left: 30px !important;
  font-weight: 700;
  letter-spacing: 0.01em;
  background: linear-gradient(180deg, rgba(245, 253, 250, 0.96), rgba(232, 247, 241, 0.86));
  box-shadow: inset 0 0 0 1px rgba(171, 213, 201, 0.32);
}

.wanhao-form-help {
  margin-top: 6px;
  font-size: 12px;
  color: #5d7387;
}

.wanhao-form-error {
  margin-top: 6px;
  font-size: 12px;
  color: #be123c;
}

.wanhao-form-submit-error {
  margin-top: 2px;
  font-size: 13px;
  color: #b91c1c;
}

.wanhao-account-row {
  display: flex;
  gap: 8px;
}

.wanhao-account-row .wanhao-form-select {
  flex: 1;
}

.wanhao-account-add-btn {
  min-width: 86px;
  gap: 4px;
}

.wanhao-account-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.wanhao-account-tag {
  border: 1px solid rgba(125, 171, 158, 0.34);
  background: rgba(247, 252, 250, 0.84);
  color: #3a4c5e;
  border-radius: 999px;
  min-height: 34px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  font-weight: 600;
  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.wanhao-account-tag-active {
  border-color: rgba(24, 120, 104, 0.55);
  color: #123d39;
  background: rgba(228, 246, 240, 0.98);
  box-shadow: 0 10px 16px rgba(21, 93, 83, 0.14);
}

.wanhao-account-tag-add {
  min-height: 34px;
  padding: 0 12px !important;
  border-radius: 999px !important;
  gap: 4px;
}

.wanhao-date-trigger-wrap {
  position: relative;
  overflow: hidden;
}

.wanhao-date-trigger {
  width: 100%;
  min-height: 46px;
  border-radius: 14px;
  padding: 0 13px;
  border: 1px solid rgba(32, 87, 79, 0.2);
  background: rgba(255, 255, 255, 0.9);
  color: #1e3a4d;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 500;
  text-align: left;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

.wanhao-date-trigger:focus-visible {
  outline: none;
  border-color: rgba(25, 130, 113, 0.58);
  box-shadow: 0 0 0 3px rgba(20, 141, 121, 0.14);
}

.wanhao-date-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  background: rgba(15, 23, 42, 0.3);
  backdrop-filter: blur(6px);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 12px;
}

.wanhao-date-modal-panel {
  width: min(420px, 100%);
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.72);
  background: rgba(251, 255, 253, 0.97);
  box-shadow: 0 24px 48px rgba(15, 23, 42, 0.2);
  padding: 12px;
  animation: sheet-up 180ms cubic-bezier(.2, .8, .2, 1);
}

.wanhao-date-modal-head {
  display: grid;
  grid-template-columns: 36px 1fr 36px;
  align-items: center;
  gap: 8px;
}

.wanhao-date-month-title {
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  color: #1e3a4d;
}

.wanhao-date-month-btn {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  border: 1px solid rgba(125, 171, 158, 0.34);
  background: rgba(247, 252, 250, 0.9);
  color: #234154;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.wanhao-date-week-row {
  margin-top: 10px;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 4px;
}

.wanhao-date-week-item {
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  color: #617386;
}

.wanhao-date-day-grid {
  margin-top: 8px;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 4px;
}

.wanhao-date-day-empty {
  height: 38px;
}

.wanhao-date-day-btn {
  height: 38px;
  border-radius: 12px;
  border: 1px solid transparent;
  background: transparent;
  color: #243b4e;
  font-size: 14px;
  font-weight: 600;
}

.wanhao-date-day-btn-today {
  border-color: rgba(24, 120, 104, 0.45);
  background: rgba(232, 246, 240, 0.74);
}

.wanhao-date-day-btn-active {
  color: #fff;
  border-color: rgba(23, 119, 104, 0.7);
  background: linear-gradient(145deg, #14816f 0%, #15675b 100%);
  box-shadow: 0 10px 18px rgba(17, 91, 79, 0.28);
}

.wanhao-date-modal-actions {
  margin-top: 12px;
  display: grid;
  gap: 8px;
}

.wanhao-date-modal-actions-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wanhao-date-modal-actions-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.wanhao-date-action-btn {
  min-height: 34px;
  border-radius: 12px;
  border: 1px solid rgba(125, 171, 158, 0.34);
  background: rgba(247, 252, 250, 0.88);
  color: #294255;
  font-size: 13px;
  font-weight: 600;
}

.wanhao-quick-account-panel {
  margin-top: 10px;
  border-radius: 16px;
  padding: 12px;
  border: 1px dashed rgba(107, 159, 147, 0.42);
  background: rgba(236, 249, 244, 0.78);
  display: flex;
  flex-direction: column;
  gap: 8px;
  animation: panel-unfold 220ms ease-out;
}

.wanhao-quick-account-title {
  font-size: 13px;
  font-weight: 700;
  color: #27485b;
}

.wanhao-inline-actions {
  display: flex;
  gap: 8px;
}

.wanhao-inline-actions .wanhao-btn {
  flex: 1;
}

.wanhao-fee-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-items: start;
}

.wanhao-fee-grid > .wanhao-form-field {
  margin-top: 0 !important;
}

.wanhao-custom-repeat-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: 10px;
  align-items: start;
}

.wanhao-coupon-section {
  gap: 4px;
}

.wanhao-code-preview-wrap {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.wanhao-code-preview-img {
  width: 120px;
  height: 120px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid rgba(125, 171, 158, 0.34);
  background: rgba(255, 255, 255, 0.9);
}

.wanhao-code-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 78;
  background: rgba(15, 23, 42, 0.34);
  backdrop-filter: blur(6px);
  display: grid;
  place-items: center;
  padding: 18px;
}

.wanhao-code-modal-panel {
  width: min(320px, 100%);
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.7);
  background: rgba(251, 255, 253, 0.95);
  box-shadow: 0 20px 38px rgba(15, 23, 42, 0.24);
  padding: 14px;
  display: grid;
  gap: 10px;
}

.wanhao-code-modal-image {
  width: 100%;
  max-height: 360px;
  object-fit: contain;
  border-radius: 12px;
  border: 1px solid rgba(125, 171, 158, 0.34);
  background: rgba(255, 255, 255, 0.9);
}

.wanhao-coupon-name-field {
  margin-bottom: 4px;
}

.wanhao-toggle-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
}

.wanhao-tab-segment-row {
  display: grid;
  width: 100%;
  gap: 8px;
}

.wanhao-tab-segment-row-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wanhao-tab-segment-row-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.wanhao-tab-segment-row .wanhao-toggle-pill {
  width: 100%;
  min-height: 38px;
  justify-content: center;
  display: inline-flex;
  align-items: center;
}

.wanhao-toggle-pill {
  border: 1px solid rgba(125, 171, 158, 0.34);
  background: rgba(247, 252, 250, 0.84);
  color: #3a4c5e;
  border-radius: 999px;
  padding: 8px 13px;
  font-size: 13px;
  font-weight: 600;
  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.wanhao-toggle-pill-active {
  border-color: rgba(24, 120, 104, 0.55);
  color: #123d39;
  background: rgba(228, 246, 240, 0.98);
  box-shadow: 0 10px 16px rgba(21, 93, 83, 0.14);
}

.wanhao-photo-btn {
  width: 100%;
  justify-content: center;
  gap: 6px;
}

.wanhao-chip-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.wanhao-day-chip {
  border: 1px solid rgba(125, 171, 158, 0.34);
  background: rgba(247, 252, 250, 0.84);
  color: #3a4c5e;
  border-radius: 999px;
  min-height: 34px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.wanhao-day-chip-active {
  border-color: rgba(24, 120, 104, 0.55);
  color: #123d39;
  background: rgba(228, 246, 240, 0.98);
  box-shadow: 0 10px 16px rgba(21, 93, 83, 0.14);
}

.wanhao-captcha-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
}

.wanhao-captcha-box {
  width: 122px;
  height: 46px;
  border-radius: 12px;
  border: 1px solid rgba(125, 171, 158, 0.34);
  background: rgba(247, 252, 250, 0.88);
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.wanhao-captcha-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.wanhao-number-wheel3d {
  position: relative;
  height: 172px;
  border-radius: 16px;
  border: 1px solid rgba(125, 171, 158, 0.34);
  background: linear-gradient(180deg, rgba(247, 252, 250, 0.94), rgba(236, 248, 244, 0.9));
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.6);
  overflow: hidden;
}

.wanhao-wheel-scroll {
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 66px 0;
  scrollbar-width: none;
  -ms-overflow-style: none;
  perspective: 620px;
  touch-action: pan-y;
  overscroll-behavior: contain;
}

.wanhao-wheel-scroll::-webkit-scrollbar {
  display: none;
}

.wanhao-wheel-focus-line {
  position: absolute;
  left: 8px;
  right: 8px;
  top: 50%;
  height: 40px;
  transform: translateY(-50%);
  border-radius: 12px;
  border: 1px solid rgba(24, 120, 104, 0.3);
  background: rgba(228, 246, 240, 0.56);
  box-shadow: 0 10px 18px rgba(21, 93, 83, 0.12);
  pointer-events: none;
}

.wanhao-wheel-shadow-top,
.wanhao-wheel-shadow-bottom {
  position: absolute;
  left: 0;
  right: 0;
  height: 52px;
  pointer-events: none;
  z-index: 2;
}

.wanhao-wheel-shadow-top {
  top: 0;
  background: linear-gradient(180deg, rgba(235, 248, 243, 0.95), rgba(235, 248, 243, 0));
}

.wanhao-wheel-shadow-bottom {
  bottom: 0;
  background: linear-gradient(0deg, rgba(235, 248, 243, 0.95), rgba(235, 248, 243, 0));
}

.wanhao-wheel3d-item {
  height: 40px;
  width: 100%;
  border: 0;
  background: transparent;
  color: #466072;
  font-size: 17px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7);
  display: grid;
  place-items: center;
  transition: transform 150ms ease, opacity 150ms ease, filter 150ms ease, color 150ms ease;
  touch-action: pan-y;
  user-select: none;
  -webkit-user-select: none;
}

.wanhao-wheel3d-item-active {
  color: #123d39;
  font-size: 20px;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9), 0 6px 12px rgba(26, 86, 76, 0.24);
}

.wanhao-wheel3d-item-near {
  opacity: 0.78;
}

.wanhao-wheel3d-item-far {
  opacity: 0.5;
  filter: blur(0.2px);
}

.wanhao-wheel3d-item-fade {
  opacity: 0.22;
  filter: blur(0.35px);
}

.wanhao-wheel3d-item-up.wanhao-wheel3d-item-near {
  transform: rotateX(20deg) translateY(-1px);
}

.wanhao-wheel3d-item-down.wanhao-wheel3d-item-near {
  transform: rotateX(-20deg) translateY(1px);
}

.wanhao-wheel3d-item-up.wanhao-wheel3d-item-far {
  transform: rotateX(34deg) translateY(-4px);
}

.wanhao-wheel3d-item-down.wanhao-wheel3d-item-far {
  transform: rotateX(-34deg) translateY(4px);
}

.wanhao-type-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
}

.wanhao-switch-btn {
  width: 100%;
  border: 1px solid rgba(125, 171, 158, 0.34);
  background: rgba(247, 252, 250, 0.84);
  color: #3a4c5e;
  border-radius: 14px;
  min-height: 46px;
  padding: 8px 12px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
}

.wanhao-switch-btn-on {
  border-color: rgba(24, 120, 104, 0.55);
  color: #123d39;
  background: rgba(228, 246, 240, 0.98);
}

.wanhao-switch-dot {
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(134, 168, 158, 0.5);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.wanhao-submit-zone {
  position: sticky;
  bottom: 0;
  margin-top: 6px;
  padding-top: 10px;
  background: linear-gradient(180deg, rgba(237, 249, 244, 0), rgba(237, 249, 244, 0.82) 56%);
}

.wanhao-form-submit {
  min-height: 48px;
  letter-spacing: 0.01em;
  box-shadow: 0 14px 24px rgba(19, 104, 90, 0.26);
}

.wanhao-form-submit:disabled {
  box-shadow: none;
}

.wanhao-form-delete {
  min-height: 44px;
  color: #b42318 !important;
  border-color: rgba(219, 90, 90, 0.55) !important;
  background: rgba(255, 245, 245, 0.92) !important;
}

.wanhao-form-delete:hover {
  border-color: rgba(205, 65, 65, 0.7) !important;
  background: rgba(255, 236, 236, 0.95) !important;
}

.wanhao-page-fields {
  animation: panel-unfold 240ms ease-out;
}

.wanhao-field-enter {
  opacity: 0;
  animation: section-rise 260ms ease-out forwards;
}

.wanhao-toast {
  animation: toast-in 220ms ease-out;
  backdrop-filter: blur(18px);
}

.wanhao-sheet-overlay {
  animation: fade-in 180ms ease-out;
}

.wanhao-auth-overlay {
  position: fixed;
  inset: 0;
  z-index: 88;
  background: rgba(15, 23, 42, 0.34);
  backdrop-filter: blur(6px);
  display: grid;
  place-items: center;
  padding: 16px;
  animation: fade-in 180ms ease-out;
}

.wanhao-auth-panel {
  width: min(420px, 100%);
  max-height: min(88vh, 700px);
  overflow: auto;
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.7);
  background: rgba(251, 255, 253, 0.95);
  backdrop-filter: blur(20px);
  box-shadow: 0 24px 56px rgba(15, 23, 42, 0.22);
  padding: 14px;
}

.wanhao-auth-head {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 10px;
  margin-bottom: 8px;
  background: rgba(251, 255, 253, 0.95);
  border-bottom: 1px solid rgba(148, 179, 171, 0.25);
}

.wanhao-sheet-panel {
  border: 1px solid rgba(255, 255, 255, 0.66);
  animation: sheet-up 220ms cubic-bezier(.2, .8, .2, 1);
}

.wanhao-sheet-grabber {
  width: 42px;
  height: 5px;
  border-radius: 99px;
  margin: 10px auto 2px;
  background: rgba(108, 139, 132, 0.4);
}

.wanhao-sheet-header {
  background: rgba(247, 252, 250, 0.88) !important;
  backdrop-filter: blur(16px);
}

.wanhao-confirm-panel {
  border: 1px solid rgba(255, 255, 255, 0.7);
  background: rgba(251, 255, 253, 0.95) !important;
  backdrop-filter: blur(20px);
}

.wanhao-loading-wrap {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 16px;
}

.wanhao-loading-card {
  min-width: 230px;
  text-align: center;
  padding: 18px 20px;
  border-radius: 20px;
  color: var(--apple-text-secondary);
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(16px);
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1);
}

.wanhao-gained-button {
  background: linear-gradient(145deg, #2b7647 0%, #179468 100%);
  box-shadow: 0 12px 26px rgba(22, 121, 83, 0.26);
  transform: translateZ(0);
  transition: transform 180ms ease, box-shadow 180ms ease, filter 180ms ease;
}

.wanhao-gained-button-inline {
  border: 0;
  border-radius: 14px;
  color: #fff;
  min-height: 34px;
  padding: 0 11px;
  font-size: 12px;
  font-weight: 700;
  line-height: 34px;
  white-space: nowrap;
}

.wanhao-gained-button:hover {
  transform: translateY(-1px) scale(1.01);
  box-shadow: 0 16px 30px rgba(22, 121, 83, 0.34);
}

.wanhao-gained-button:active,
.wanhao-gained-button-active {
  animation: gained-pop 420ms cubic-bezier(.2,.8,.2,1);
  filter: saturate(1.2);
}

.wanhao-usage-row {
  border: 1px solid rgba(154, 196, 184, 0.26);
  background: rgba(248, 253, 250, 0.9);
  border-radius: 16px;
  padding: 11px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

@keyframes main-swap {
  from {
    opacity: 0;
    transform: translateY(10px) scale(0.99);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes section-rise {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes panel-unfold {
  from {
    opacity: 0;
    transform: translateY(10px) scale(0.985);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes sheet-up {
  from {
    opacity: 0;
    transform: translateY(18px) scale(0.99);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes toast-in {
  from {
    opacity: 0;
    transform: translate(-50%, -14px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translate(-50%, 0) scale(1);
  }
}

@keyframes gained-pop {
  0% {
    transform: scale(1);
    box-shadow: 0 12px 26px rgba(23, 122, 79, 0.24);
  }
  35% {
    transform: scale(0.94);
  }
  60% {
    transform: scale(1.08);
    box-shadow: 0 18px 36px rgba(23, 122, 79, 0.38);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 12px 26px rgba(23, 122, 79, 0.24);
  }
}

@keyframes card-clearing {
  0% {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: saturate(1);
  }
  45% {
    opacity: 0.95;
    transform: translateY(-2px) scale(0.985);
    filter: saturate(1.12);
  }
  100% {
    opacity: 0.08;
    transform: translateY(-14px) scale(0.92);
    filter: blur(1.5px) saturate(1.2);
  }
}

@media (max-width: 390px) {
  .apple-root {
    padding: calc(env(safe-area-inset-top, 0px) + 12px) 0 calc(env(safe-area-inset-bottom, 0px) + 108px);
  }

  .apple-root-form,
  .apple-root-stored-action,
  .apple-root-detail {
    padding-top: calc(env(safe-area-inset-top, 0px) + 2px);
    padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 12px);
  }

  .apple-tab {
    font-size: 10px;
    padding: 7px 4px;
  }

  .apple-fab {
    right: 14px;
  }

  .wanhao-page-picker {
    grid-template-columns: 1fr;
  }

  .wanhao-form-page-header {
    grid-template-columns: 76px 1fr 76px;
  }

  .wanhao-custom-repeat-grid {
    grid-template-columns: 1fr;
  }

  .wanhao-fee-grid {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .wanhao-page > *,
  .wanhao-stat-grid > *,
  .wanhao-card-stack > *,
  .wanhao-field-enter,
  .wanhao-page-fields,
  .wanhao-quick-account-panel,
  .apple-main-enter,
  .wanhao-sheet-overlay,
  .wanhao-sheet-panel,
  .wanhao-toast,
  .wanhao-type-check,
  .wanhao-card-clearing {
    animation: none !important;
  }

  .wanhao-interactive-card,
  .wanhao-offer-row,
  .wanhao-setting-row,
  .apple-summary-pill,
  .apple-tab-icon,
  .apple-tab,
  .apple-fab,
  .wanhao-btn,
  .wanhao-page-option,
  .wanhao-type-icon,
  .wanhao-swipe-main {
    transition: none !important;
  }
}

/* Utility classes used by current app views (tailwind-like subset). */
.block { display: block; }
.flex { display: flex; }
.inline-flex { display: inline-flex; }
.grid { display: grid; }
.fixed { position: fixed; }
.sticky { position: sticky; }

.left-0 { left: 0; }
.right-0 { right: 0; }
.top-0 { top: 0; }
.top-5 { top: 1.25rem; }
.bottom-0 { bottom: 0; }
.left-1\/2 { left: 50%; }

.z-20 { z-index: 20; }
.z-\[80\] { z-index: 80; }

.w-4 { width: 1rem; }
.w-5 { width: 1.25rem; }
.w-6 { width: 1.5rem; }
.w-full { width: 100%; }
.w-\[calc\(100\%-32px\)\] { width: calc(100% - 32px); }

.h-4 { height: 1rem; }
.h-5 { height: 1.25rem; }
.h-6 { height: 1.5rem; }

.max-w-\[260px\] { max-width: 260px; }
.max-w-\[360px\] { max-width: 360px; }
.max-w-\[390px\] { max-width: 390px; }
.max-w-\[420px\] { max-width: 420px; }
.max-w-\[430px\] { max-width: 430px; }

.min-h-screen { min-height: 100vh; }
.min-w-0 { min-width: 0; }

.flex-1 { flex: 1 1 0%; }
.flex-col { flex-direction: column; }
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }

.items-center { align-items: center; }
.items-start { align-items: flex-start; }
.items-end { align-items: flex-end; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.text-left { text-align: left; }
.break-all { word-break: break-all; }

.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 0.75rem; }
.gap-4 { gap: 1rem; }
.gap-1 { gap: 0.25rem; }

.mx-auto { margin-left: auto; margin-right: auto; }
.mr-2 { margin-right: 0.5rem; }
.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-3 { margin-top: 0.75rem; }
.mt-5 { margin-top: 1.25rem; }

.p-2 { padding: 0.5rem; }
.p-3 { padding: 0.75rem; }
.p-4 { padding: 1rem; }
.p-5 { padding: 1.25rem; }
.p-6 { padding: 1.5rem; }
.px-2 { padding-left: 0.5rem; padding-right: 0.5rem; }
.px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.px-1 { padding-left: 0.25rem; padding-right: 0.25rem; }
.py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
.py-4 { padding-top: 1rem; padding-bottom: 1rem; }
.pb-2 { padding-bottom: 0.5rem; }
.pb-28 { padding-bottom: 7rem; }
.pt-0 { padding-top: 0; }
.pt-4 { padding-top: 1rem; }

.space-y-2 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.5rem; }
.space-y-3 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.75rem; }
.space-y-4 > :not([hidden]) ~ :not([hidden]) { margin-top: 1rem; }

.overflow-hidden { overflow: hidden; }
.rounded-2xl { border-radius: 1rem; }
.rounded-3xl { border-radius: 1.5rem; }
.rounded-\[28px\] { border-radius: 28px; }

.border { border-width: 1px; border-style: solid; }
.border-0 { border-width: 0; }
.border-b { border-bottom-width: 1px; border-bottom-style: solid; }
.border-t { border-top-width: 1px; border-top-style: solid; }

.border-slate-200 { border-color: #e2e8f0; }
.border-emerald-200 { border-color: #a7f3d0; }
.border-rose-200 { border-color: #fecdd3; }

.bg-transparent { background: transparent; }
.bg-white { background-color: #fff; }
.bg-white\/10 { background-color: rgba(255, 255, 255, 0.1); }
.bg-slate-50 { background-color: #f8fafc; }
.bg-slate-100 { background-color: #f1f5f9; }
.bg-slate-200 { background-color: #e2e8f0; }
.bg-slate-900 { background-color: #0f172a; }
.bg-emerald-50 { background-color: #ecfdf5; }
.bg-rose-50 { background-color: #fff1f2; }
.bg-amber-50 { background-color: #fffbeb; }
.bg-rose-500 { background-color: #f43f5e; }

.bg-gradient-to-br {
  background-image: linear-gradient(to bottom right, var(--tw-gradient-from), var(--tw-gradient-to));
}
.from-slate-900 {
  --tw-gradient-from: #0f172a;
  --tw-gradient-to: rgba(15, 23, 42, 0);
}
.to-slate-700 { --tw-gradient-to: #334155; }

.hover\:bg-slate-100:hover { background-color: #f1f5f9; }

.text-white { color: #fff; }
.text-slate-300 { color: #cbd5e1; }
.text-slate-400 { color: #94a3b8; }
.text-slate-500 { color: #64748b; }
.text-slate-600 { color: #475569; }
.text-slate-700 { color: #334155; }
.text-slate-900 { color: #0f172a; }
.text-red-500 { color: #ef4444; }
.text-rose-500 { color: #f43f5e; }
.text-rose-900 { color: #881337; }
.text-emerald-900 { color: #064e3b; }
.text-amber-900 { color: #78350f; }

.text-xs { font-size: 0.75rem; line-height: 1rem; }
.text-sm { font-size: 0.875rem; line-height: 1.25rem; }
.text-base { font-size: 1rem; line-height: 1.5rem; }
.text-lg { font-size: 1.125rem; line-height: 1.75rem; }
.text-xl { font-size: 1.25rem; line-height: 1.75rem; }
.text-2xl { font-size: 1.5rem; line-height: 2rem; }
.text-3xl { font-size: 1.875rem; line-height: 2.25rem; }
.text-\[11px\] { font-size: 11px; line-height: 1; }

.font-medium { font-weight: 500; }
.font-semibold { font-weight: 600; }
.leading-5 { line-height: 1.25rem; }
.leading-6 { line-height: 1.5rem; }

.shadow-sm { box-shadow: 0 1px 2px rgba(15, 23, 42, 0.1); }
.shadow-lg { box-shadow: 0 10px 24px rgba(15, 23, 42, 0.18); }
.shadow-2xl { box-shadow: 0 18px 40px rgba(15, 23, 42, 0.26); }

.-translate-x-1\/2 { transform: translateX(-50%); }

/* ===== iOS glass redesign (v26) ===== */
:root {
  --glass-bg-top: #f2f6ff;
  --glass-bg-bottom: #e8eefc;
  --glass-surface: rgba(255, 255, 255, 0.46);
  --glass-surface-strong: rgba(255, 255, 255, 0.68);
  --glass-border: rgba(255, 255, 255, 0.58);
  --glass-border-deep: rgba(167, 185, 229, 0.42);
  --glass-shadow: 0 18px 38px rgba(37, 50, 78, 0.2);
  --glass-shadow-soft: 0 10px 22px rgba(37, 50, 78, 0.14);
  --glass-text: #11203a;
  --glass-subtext: #4c5f82;
  --glass-accent: #2b67f6;
  --glass-accent-2: #3f95ff;
}

html, body {
  background:
    radial-gradient(72% 56% at 4% -8%, rgba(92, 161, 255, 0.36), transparent 64%),
    radial-gradient(62% 44% at 94% -2%, rgba(167, 120, 255, 0.26), transparent 66%),
    radial-gradient(58% 40% at 50% 110%, rgba(102, 210, 255, 0.22), transparent 72%),
    linear-gradient(180deg, var(--glass-bg-top) 0%, var(--glass-bg-bottom) 100%) !important;
}

.apple-root {
  --page-tint-a: rgba(122, 188, 255, 0.28);
  --page-tint-b: rgba(189, 164, 255, 0.24);
}

.apple-root::before {
  background:
    radial-gradient(68% 48% at 102% 0%, var(--page-tint-a), transparent 68%),
    radial-gradient(56% 42% at 0% 18%, var(--page-tint-b), transparent 72%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0));
  filter: saturate(1.08);
}

.apple-root::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(40% 30% at 24% 26%, rgba(255, 255, 255, 0.28), transparent 72%),
    radial-gradient(36% 24% at 78% 70%, rgba(255, 255, 255, 0.22), transparent 74%);
  animation: glass-drift 18s ease-in-out infinite alternate;
}

@keyframes glass-drift {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
    opacity: 0.86;
  }
  100% {
    transform: translate3d(0, -10px, 0) scale(1.03);
    opacity: 1;
  }
}

.apple-tabbar {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.5), rgba(239, 245, 255, 0.38)) !important;
  border: 1px solid var(--glass-border) !important;
  backdrop-filter: blur(28px) saturate(1.25) !important;
  box-shadow: 0 24px 46px rgba(39, 60, 99, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.62);
}

.apple-tab {
  color: #4d6290 !important;
}

.apple-tab:hover {
  background: rgba(255, 255, 255, 0.34) !important;
  color: #203a6a !important;
}

.apple-tab-active .apple-tab-icon {
  background: linear-gradient(145deg, #5ea4ff 0%, #396dff 100%) !important;
  box-shadow: 0 12px 24px rgba(56, 111, 255, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.apple-fab {
  background: linear-gradient(145deg, #6eacff 0%, #3a73ff 100%) !important;
  border-color: rgba(255, 255, 255, 0.72) !important;
  box-shadow: 0 18px 28px rgba(52, 95, 208, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.56) !important;
}

.wanhao-card,
.wanhao-surface-card,
.wanhao-stat-card,
.wanhao-section-card,
.wanhao-asset-card,
.wanhao-empty-card {
  position: relative;
  overflow: hidden;
  background: linear-gradient(150deg, rgba(255, 255, 255, 0.54), rgba(242, 248, 255, 0.4)) !important;
  border: 1px solid var(--glass-border) !important;
  backdrop-filter: blur(24px) saturate(1.2);
  box-shadow: var(--glass-shadow-soft), inset 0 1px 0 rgba(255, 255, 255, 0.62);
}

.wanhao-card::before,
.wanhao-surface-card::before,
.wanhao-stat-card::before,
.wanhao-section-card::before,
.wanhao-asset-card::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 52%;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0));
}

.wanhao-hero-card {
  border: 1px solid rgba(255, 255, 255, 0.68) !important;
  backdrop-filter: blur(22px) saturate(1.28);
  box-shadow: var(--glass-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.5) !important;
}

.wanhao-hero-card-events {
  background: linear-gradient(146deg, rgba(59, 114, 250, 0.74), rgba(76, 160, 255, 0.56), rgba(109, 174, 255, 0.42)) !important;
}

.wanhao-hero-card-coupons {
  background: linear-gradient(146deg, rgba(102, 118, 255, 0.74), rgba(115, 176, 255, 0.54), rgba(123, 208, 255, 0.42)) !important;
}

.wanhao-hero-card-memberships {
  background: linear-gradient(146deg, rgba(81, 108, 255, 0.75), rgba(95, 145, 255, 0.56), rgba(134, 183, 255, 0.42)) !important;
}

.wanhao-hero-card-discover {
  background: linear-gradient(146deg, rgba(83, 132, 255, 0.74), rgba(94, 175, 255, 0.54), rgba(141, 210, 255, 0.42)) !important;
}

.wanhao-hero-card-mine {
  background: linear-gradient(146deg, rgba(73, 116, 255, 0.75), rgba(95, 166, 255, 0.55), rgba(129, 188, 255, 0.42)) !important;
}

.wanhao-hero-icon {
  background: rgba(255, 255, 255, 0.24) !important;
  border-color: rgba(255, 255, 255, 0.42) !important;
}

.wanhao-asset-amount,
.wanhao-date-chip,
.wanhao-card-tag,
.wanhao-discover-chip,
.wanhao-offer-row,
.wanhao-setting-row,
.wanhao-detail-item,
.wanhao-detail-note,
.wanhao-usage-row,
.wanhao-mine-user-badge,
.wanhao-captcha-box {
  background: linear-gradient(150deg, rgba(255, 255, 255, 0.56), rgba(244, 249, 255, 0.34)) !important;
  border-color: var(--glass-border-deep) !important;
  backdrop-filter: blur(18px) saturate(1.18);
}

.wanhao-btn {
  border-radius: 16px;
  backdrop-filter: blur(18px) saturate(1.2);
}

.wanhao-btn-primary {
  background: linear-gradient(145deg, #6caeff 0%, #3c73ff 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 14px 28px rgba(57, 105, 242, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.44) !important;
}

.wanhao-btn-outline {
  background: linear-gradient(150deg, rgba(255, 255, 255, 0.52), rgba(243, 248, 255, 0.34)) !important;
  border-color: var(--glass-border-deep) !important;
  color: #314c7a !important;
}

.wanhao-btn-secondary {
  background: linear-gradient(150deg, rgba(234, 244, 255, 0.72), rgba(225, 238, 255, 0.56)) !important;
  color: #294774 !important;
}

.wanhao-input,
.wanhao-form-input,
.wanhao-form-select,
.wanhao-date-trigger,
.wanhao-file-picker-row,
.wanhao-number-wheel3d,
.wanhao-switch-btn,
.wanhao-account-tag,
.wanhao-toggle-pill,
.wanhao-day-chip,
.wanhao-date-action-btn,
.wanhao-date-month-btn {
  background: linear-gradient(150deg, rgba(255, 255, 255, 0.56), rgba(241, 248, 255, 0.34)) !important;
  border-color: var(--glass-border-deep) !important;
  color: var(--glass-text) !important;
  backdrop-filter: blur(16px) saturate(1.2);
}

.wanhao-toggle-pill-active,
.wanhao-day-chip-active,
.wanhao-account-tag-active,
.wanhao-switch-btn-on {
  background: linear-gradient(145deg, rgba(112, 178, 255, 0.84), rgba(69, 124, 255, 0.75)) !important;
  border-color: rgba(122, 168, 255, 0.82) !important;
  color: #ffffff !important;
  box-shadow: 0 14px 24px rgba(74, 122, 255, 0.28);
}

.wanhao-form-page-header,
.wanhao-submit-zone {
  background: linear-gradient(180deg, rgba(236, 244, 255, 0.84), rgba(236, 244, 255, 0.2) 74%, rgba(236, 244, 255, 0)) !important;
  backdrop-filter: blur(20px) saturate(1.18);
}

.wanhao-form-section,
.wanhao-form-section-emphasis,
.wanhao-quick-account-panel {
  background: linear-gradient(154deg, rgba(255, 255, 255, 0.56), rgba(241, 248, 255, 0.34)) !important;
  border-color: var(--glass-border) !important;
  box-shadow: var(--glass-shadow-soft), inset 0 1px 0 rgba(255, 255, 255, 0.58);
}

.wanhao-date-modal-backdrop,
.wanhao-auth-overlay,
.wanhao-code-modal-backdrop {
  background: rgba(38, 58, 98, 0.34) !important;
  backdrop-filter: blur(14px) saturate(1.08);
}

.wanhao-date-modal-panel,
.wanhao-auth-panel,
.wanhao-code-modal-panel,
.wanhao-sheet-panel,
.wanhao-confirm-panel {
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.68), rgba(242, 249, 255, 0.48)) !important;
  border-color: var(--glass-border) !important;
  backdrop-filter: blur(28px) saturate(1.26);
  box-shadow: var(--glass-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.62);
}

.wanhao-sheet-header,
.wanhao-auth-head {
  background: rgba(244, 250, 255, 0.76) !important;
  border-color: rgba(168, 191, 236, 0.34) !important;
}

.wanhao-gained-button {
  background: linear-gradient(145deg, #78b6ff 0%, #4b7fff 100%) !important;
  box-shadow: 0 12px 28px rgba(66, 121, 255, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.48) !important;
}

.wanhao-countdown-number-normal {
  color: #224e95 !important;
  background: rgba(211, 231, 255, 0.78) !important;
}

.wanhao-countdown-number-soon {
  color: #5a4b1a !important;
  background: rgba(255, 236, 188, 0.74) !important;
}

.wanhao-countdown-number-urgent {
  color: #7b2133 !important;
  background: rgba(255, 212, 224, 0.78) !important;
}

.wanhao-toast {
  border-color: rgba(186, 203, 238, 0.72) !important;
  background: linear-gradient(154deg, rgba(255, 255, 255, 0.7), rgba(241, 248, 255, 0.52)) !important;
  color: #1e355d !important;
  box-shadow: var(--glass-shadow-soft), inset 0 1px 0 rgba(255, 255, 255, 0.62);
  backdrop-filter: blur(22px) saturate(1.2);
}

.wanhao-toast.border-emerald-200 {
  border-color: rgba(93, 170, 255, 0.64) !important;
  background: linear-gradient(154deg, rgba(229, 244, 255, 0.78), rgba(213, 233, 255, 0.62)) !important;
  color: #1f4685 !important;
}

.wanhao-toast.border-rose-200 {
  border-color: rgba(255, 148, 177, 0.64) !important;
  background: linear-gradient(154deg, rgba(255, 239, 246, 0.82), rgba(255, 222, 236, 0.66)) !important;
  color: #7b2742 !important;
}

/* ===== glass depth boost ===== */
.wanhao-card-stack {
  perspective: 1200px;
  transform-style: preserve-3d;
}

.wanhao-card-stack > * {
  transform-origin: 50% 0%;
  animation: card-rise-layered 340ms cubic-bezier(.2, .82, .2, 1) both !important;
}

.wanhao-card-stack > *:nth-child(2) { animation-delay: 74ms !important; }
.wanhao-card-stack > *:nth-child(3) { animation-delay: 112ms !important; }
.wanhao-card-stack > *:nth-child(4) { animation-delay: 148ms !important; }

.wanhao-card,
.wanhao-surface-card,
.wanhao-stat-card,
.wanhao-section-card,
.wanhao-asset-card {
  box-shadow:
    0 18px 34px rgba(48, 69, 113, 0.2),
    0 8px 16px rgba(48, 69, 113, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.66) !important;
}

.wanhao-interactive-card {
  transform-style: preserve-3d;
  will-change: transform, box-shadow, filter;
}

.wanhao-interactive-card::after {
  content: '';
  position: absolute;
  inset: -1px;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(112deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0.1));
  opacity: 0;
  transform: translateX(-26%);
  transition: opacity 220ms ease, transform 280ms ease;
}

.wanhao-interactive-card:hover {
  transform: translateY(-5px) scale(1.012) rotateX(2.2deg) !important;
  box-shadow:
    0 22px 40px rgba(48, 69, 113, 0.24),
    0 12px 22px rgba(48, 69, 113, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
}

.wanhao-interactive-card:hover::after {
  opacity: 1;
  transform: translateX(22%);
}

.wanhao-interactive-card:active {
  transform: translateY(-1px) scale(0.996) !important;
}

/* ===== hero tilt follow ===== */
.wanhao-hero-tilt {
  --hero-tilt-x: 0deg;
  --hero-tilt-y: 0deg;
  --hero-glow-x: 50%;
  --hero-glow-y: 50%;
  position: relative;
  overflow: hidden;
  transform-style: preserve-3d;
  transform: perspective(1100px) rotateX(var(--hero-tilt-x)) rotateY(var(--hero-tilt-y)) translateZ(0);
  transition: transform 220ms cubic-bezier(.2, .8, .2, 1), box-shadow 220ms ease, filter 220ms ease;
  will-change: transform, box-shadow, filter;
}

.wanhao-hero-tilt::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background:
    radial-gradient(240px circle at var(--hero-glow-x) var(--hero-glow-y), rgba(255, 255, 255, 0.36), transparent 62%),
    linear-gradient(120deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0));
  opacity: 0.58;
  transition: opacity 220ms ease;
}

.wanhao-hero-tilt-active {
  box-shadow:
    0 24px 46px rgba(48, 71, 118, 0.3),
    0 12px 26px rgba(48, 71, 118, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.56) !important;
}

@media (hover: none) {
  .wanhao-hero-tilt {
    transform: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .wanhao-hero-tilt,
  .wanhao-hero-tilt-active {
    transform: none !important;
    transition: none !important;
  }

  .wanhao-hero-tilt::after {
    transition: none !important;
  }
}

/* ===== directional page transition ===== */
.apple-main-enter {
  animation: none;
  will-change: transform, opacity, filter;
  transform-origin: 50% 14%;
}

.apple-main-enter-forward {
  animation: main-swap-forward 340ms cubic-bezier(.2, .82, .2, 1) both;
}

.apple-main-enter-back {
  animation: main-swap-back 320ms cubic-bezier(.2, .82, .2, 1) both;
}

.apple-main-enter-fade {
  animation: main-swap-fade 280ms cubic-bezier(.2, .82, .2, 1) both;
}

@keyframes main-swap-forward {
  from {
    opacity: 0;
    transform: translate3d(18px, 12px, 0) scale(0.986);
    filter: blur(1.8px);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
  }
}

@keyframes main-swap-back {
  from {
    opacity: 0;
    transform: translate3d(-16px, 8px, 0) scale(0.989);
    filter: blur(1.2px);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
  }
}

@keyframes main-swap-fade {
  from {
    opacity: 0;
    transform: translate3d(0, 10px, 0) scale(0.992);
    filter: blur(1px);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
  }
}

@keyframes card-rise-layered {
  from {
    opacity: 0;
    transform: translate3d(0, 16px, -30px) rotateX(8deg) scale(0.982);
    filter: blur(1.2px);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) rotateX(0deg) scale(1);
    filter: blur(0);
  }
}

/* ===== settings row refresh ===== */
.wanhao-settings-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.wanhao-setting-row {
  position: relative;
  overflow: hidden;
  min-height: 60px;
  border-radius: 18px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(171, 194, 236, 0.5) !important;
  background: linear-gradient(150deg, rgba(255, 255, 255, 0.62), rgba(241, 248, 255, 0.44)) !important;
  backdrop-filter: blur(20px) saturate(1.2);
  box-shadow: 0 12px 20px rgba(45, 70, 116, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.66);
  transition: transform 180ms ease, box-shadow 200ms ease, border-color 180ms ease;
}

.wanhao-setting-row::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0));
}

.wanhao-setting-row:hover {
  transform: translateY(-1px);
  border-color: rgba(132, 166, 232, 0.62) !important;
  box-shadow: 0 16px 24px rgba(47, 67, 113, 0.19), inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.wanhao-setting-row:active {
  transform: scale(0.99);
}

.wanhao-setting-row:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(90, 144, 239, 0.24), 0 16px 24px rgba(47, 67, 113, 0.19), inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.wanhao-setting-main {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}

.wanhao-setting-icon {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px !important;
  background: linear-gradient(150deg, rgba(114, 166, 250, 0.3), rgba(92, 148, 255, 0.18)) !important;
  border: 1px solid rgba(132, 172, 239, 0.5) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6), 0 8px 12px rgba(59, 105, 182, 0.12);
}

.wanhao-setting-icon-svg {
  color: #2f5f9a !important;
  stroke-width: 2.15;
}

.wanhao-setting-title {
  color: #173765 !important;
  font-size: 15px !important;
  line-height: 1 !important;
  font-weight: 640 !important;
}

.wanhao-setting-arrow {
  width: 28px;
  height: 28px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #5e7cb0;
  background: rgba(255, 255, 255, 0.36);
  border: 1px solid rgba(170, 194, 236, 0.52);
  transition: transform 180ms ease, color 180ms ease, background 180ms ease;
}

.wanhao-setting-row:hover .wanhao-setting-arrow {
  transform: translateX(2px);
  color: #3c62a1;
  background: rgba(255, 255, 255, 0.52);
}

.wanhao-theme-setting {
  margin-bottom: 12px;
  padding: 12px;
  border-radius: 18px;
  border: 1px solid rgba(171, 194, 236, 0.44);
  background: linear-gradient(150deg, rgba(255, 255, 255, 0.58), rgba(241, 248, 255, 0.4));
  box-shadow: 0 10px 18px rgba(45, 70, 116, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.62);
}

.wanhao-theme-setting-header {
  margin-bottom: 10px;
}

.wanhao-theme-setting-title {
  font-size: 14px;
  font-weight: 700;
  color: #173765;
}

.wanhao-theme-setting-sub {
  margin-top: 2px;
  font-size: 12px;
  color: #6177a1;
}

.wanhao-theme-segment {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.wanhao-theme-option {
  min-height: 38px;
  border: 1px solid rgba(156, 183, 230, 0.46);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.45);
  color: #4f678f;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  transition: transform 150ms ease, border-color 150ms ease, background 150ms ease, color 150ms ease;
}

.wanhao-theme-option:hover {
  transform: translateY(-1px);
  border-color: rgba(116, 157, 226, 0.66);
  color: #2a4e88;
  background: rgba(255, 255, 255, 0.62);
}

.wanhao-theme-option-active {
  color: #ffffff;
  border-color: rgba(122, 168, 255, 0.82);
  background: linear-gradient(145deg, rgba(112, 178, 255, 0.84), rgba(69, 124, 255, 0.75));
  box-shadow: 0 10px 16px rgba(74, 122, 255, 0.25);
}

html[data-theme='light'] {
  color-scheme: light;
}

html[data-theme='dark'] {
  color-scheme: dark;
  color: #edf4ff;
  --apple-text-primary: #edf4ff;
  --apple-text-secondary: #b5c8e8;
  --glass-bg-top: #0b1327;
  --glass-bg-bottom: #090f1f;
  --glass-surface: rgba(28, 38, 62, 0.58);
  --glass-surface-strong: rgba(33, 46, 74, 0.72);
  --glass-border: rgba(139, 171, 235, 0.3);
  --glass-border-deep: rgba(126, 156, 218, 0.46);
  --glass-shadow: 0 18px 38px rgba(0, 0, 0, 0.48);
  --glass-shadow-soft: 0 10px 22px rgba(0, 0, 0, 0.35);
  --glass-text: #ebf2ff;
  --glass-subtext: #9fb2d6;
  --glass-accent: #74a8ff;
  --glass-accent-2: #8ec4ff;
}

html[data-theme='dark'],
html[data-theme='dark'] body {
  background:
    radial-gradient(74% 58% at 2% -8%, rgba(56, 98, 178, 0.44), transparent 64%),
    radial-gradient(66% 44% at 96% -2%, rgba(102, 74, 178, 0.34), transparent 66%),
    radial-gradient(58% 40% at 50% 108%, rgba(39, 86, 154, 0.36), transparent 72%),
    linear-gradient(180deg, var(--glass-bg-top) 0%, var(--glass-bg-bottom) 100%) !important;
}

html[data-theme='dark'] .apple-root::before {
  filter: saturate(1.08) brightness(0.8);
}

html[data-theme='dark'] .apple-root::after {
  opacity: 0.55;
}

html[data-theme='dark'] .apple-tabbar {
  background: linear-gradient(145deg, rgba(20, 31, 54, 0.78), rgba(27, 42, 70, 0.64)) !important;
  border-color: rgba(135, 166, 228, 0.3) !important;
  box-shadow: 0 24px 46px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

html[data-theme='dark'] .apple-tab {
  color: #9eb1d5 !important;
}

html[data-theme='dark'] .apple-tab:hover {
  background: rgba(124, 153, 212, 0.16) !important;
  color: #d5e4ff !important;
}

html[data-theme='dark'] .apple-tab-active {
  color: #ecf4ff !important;
}

html[data-theme='dark'] .wanhao-card,
html[data-theme='dark'] .wanhao-surface-card,
html[data-theme='dark'] .wanhao-stat-card,
html[data-theme='dark'] .wanhao-section-card,
html[data-theme='dark'] .wanhao-asset-card,
html[data-theme='dark'] .wanhao-empty-card {
  background: linear-gradient(150deg, rgba(21, 31, 52, 0.72), rgba(18, 26, 44, 0.58)) !important;
  border-color: rgba(132, 164, 226, 0.34) !important;
  box-shadow: 0 16px 28px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

html[data-theme='dark'] .wanhao-asset-amount,
html[data-theme='dark'] .wanhao-date-chip,
html[data-theme='dark'] .wanhao-card-tag,
html[data-theme='dark'] .wanhao-offer-row,
html[data-theme='dark'] .wanhao-setting-row,
html[data-theme='dark'] .wanhao-theme-setting,
html[data-theme='dark'] .wanhao-detail-item,
html[data-theme='dark'] .wanhao-detail-note,
html[data-theme='dark'] .wanhao-usage-row,
html[data-theme='dark'] .wanhao-mine-user-badge,
html[data-theme='dark'] .wanhao-captcha-box {
  background: linear-gradient(150deg, rgba(29, 41, 68, 0.68), rgba(22, 32, 53, 0.56)) !important;
  border-color: rgba(124, 157, 219, 0.42) !important;
}

html[data-theme='dark'] .wanhao-setting-title,
html[data-theme='dark'] .wanhao-theme-setting-title,
html[data-theme='dark'] .wanhao-setting-icon-svg {
  color: #e7f0ff !important;
}

html[data-theme='dark'] .wanhao-setting-arrow {
  color: #a8c0ea;
  background: rgba(54, 73, 112, 0.45);
  border-color: rgba(117, 149, 210, 0.48);
}

html[data-theme='dark'] .wanhao-theme-setting-sub {
  color: #9fb3d8;
}

html[data-theme='dark'] .wanhao-theme-option {
  background: rgba(37, 51, 82, 0.7);
  border-color: rgba(114, 149, 214, 0.44);
  color: #bcd0f2;
}

html[data-theme='dark'] .wanhao-theme-option:hover {
  color: #e4efff;
  background: rgba(48, 68, 106, 0.78);
}

html[data-theme='dark'] .wanhao-input,
html[data-theme='dark'] .wanhao-form-input,
html[data-theme='dark'] .wanhao-form-select,
html[data-theme='dark'] .wanhao-date-trigger,
html[data-theme='dark'] .wanhao-file-picker-row,
html[data-theme='dark'] .wanhao-number-wheel3d,
html[data-theme='dark'] .wanhao-switch-btn,
html[data-theme='dark'] .wanhao-account-tag,
html[data-theme='dark'] .wanhao-toggle-pill,
html[data-theme='dark'] .wanhao-day-chip,
html[data-theme='dark'] .wanhao-date-action-btn,
html[data-theme='dark'] .wanhao-date-month-btn {
  background: linear-gradient(150deg, rgba(31, 44, 73, 0.72), rgba(23, 34, 57, 0.6)) !important;
  border-color: rgba(124, 157, 219, 0.42) !important;
  color: #ebf2ff !important;
}

html[data-theme='dark'] .wanhao-form-page-header,
html[data-theme='dark'] .wanhao-submit-zone {
  background: linear-gradient(180deg, rgba(12, 18, 32, 0.88), rgba(12, 18, 32, 0.32) 74%, rgba(12, 18, 32, 0)) !important;
}

html[data-theme='dark'] .wanhao-form-section,
html[data-theme='dark'] .wanhao-form-section-emphasis,
html[data-theme='dark'] .wanhao-quick-account-panel {
  background: linear-gradient(154deg, rgba(24, 35, 58, 0.76), rgba(21, 31, 50, 0.64)) !important;
  border-color: rgba(124, 157, 219, 0.38) !important;
}

html[data-theme='dark'] .wanhao-date-modal-backdrop,
html[data-theme='dark'] .wanhao-auth-overlay,
html[data-theme='dark'] .wanhao-code-modal-backdrop {
  background: rgba(5, 9, 18, 0.58) !important;
}

html[data-theme='dark'] .wanhao-sheet-panel,
html[data-theme='dark'] .wanhao-confirm-panel {
  background: rgba(20, 30, 49, 0.94) !important;
  border: 1px solid rgba(126, 157, 218, 0.3);
}

html[data-theme='dark'] .wanhao-sheet-header {
  background: rgba(20, 30, 49, 0.92) !important;
  border-color: rgba(126, 157, 218, 0.26) !important;
}

html[data-theme='dark'] .border-slate-200 {
  border-color: rgba(126, 157, 218, 0.28) !important;
}

html[data-theme='dark'] .bg-white {
  background-color: rgba(26, 38, 63, 0.94) !important;
}

html[data-theme='dark'] .bg-slate-50 {
  background-color: rgba(22, 33, 55, 0.92) !important;
}

html[data-theme='dark'] .bg-slate-100,
html[data-theme='dark'] .bg-slate-200 {
  background-color: rgba(36, 52, 84, 0.9) !important;
}

html[data-theme='dark'] .text-slate-300 {
  color: #90a7cf !important;
}

html[data-theme='dark'] .text-slate-400 {
  color: #9ab0d3 !important;
}

html[data-theme='dark'] .text-slate-500,
html[data-theme='dark'] .text-slate-600 {
  color: #b5c8e8 !important;
}

html[data-theme='dark'] .text-slate-700 {
  color: #d6e3fb !important;
}

html[data-theme='dark'] .text-slate-900 {
  color: #edf4ff !important;
}

html[data-theme='dark'] .wanhao-section-card h3,
html[data-theme='dark'] .wanhao-surface-card h3,
html[data-theme='dark'] .wanhao-section-card .text-base,
html[data-theme='dark'] .wanhao-surface-card .text-base {
  color: #edf4ff !important;
}

html[data-theme='dark'] input::placeholder,
html[data-theme='dark'] textarea::placeholder {
  color: #8ea6cb !important;
}