/* 全站风格变量 + 3D 按钮/卡片 */
:root {
  --yx-page-bg: url("/m/assets/theme/theme-bg-sunny.jpg");
  --yx-overlay: 0.86;
  --yx-overlay-top: 0.92;
  --yx-yellow: #ff642e;
  --yx-ink: #1c1914;
  --yx-title: #2a2418;
}

body.yx-theme-soft3d,
body.yx-theme-warm,
body.yx-theme-classic.yx-use-theme-bg {
  position: relative;
  background-color: #f7f5ef;
  background-image: var(--yx-page-bg);
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}
body.yx-theme-soft3d::before,
body.yx-theme-warm::before,
body.yx-theme-classic.yx-use-theme-bg::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    rgba(255, 210, 190, calc(var(--yx-overlay-top) * 0.55)) 0%,
    rgba(247, 245, 239, var(--yx-overlay)) 48%,
    rgba(247, 245, 239, calc(var(--yx-overlay) + 0.06)) 100%
  );
}
body.yx-theme-warm::before {
  background: linear-gradient(
    180deg,
    rgba(255, 190, 160, calc(var(--yx-overlay-top) * 0.6)) 0%,
    rgba(255, 246, 230, var(--yx-overlay)) 50%,
    rgba(255, 248, 236, calc(var(--yx-overlay) + 0.05)) 100%
  );
}
body.yx-theme-soft3d > *:not(.m-tabbar):not(.m-auth-mask):not(.m-city-mask):not(.ml-sheet-mask):not(.mc-sheet),
body.yx-theme-warm > *:not(.m-tabbar):not(.m-auth-mask):not(.m-city-mask):not(.ml-sheet-mask):not(.mc-sheet),
body.yx-theme-classic.yx-use-theme-bg > *:not(.m-tabbar):not(.m-auth-mask):not(.m-city-mask) {
  position: relative;
  z-index: 1;
}

/* 立体按钮 */
body.yx-btn-3d .yx-btn-3d,
body.yx-btn-3d .yx-me-yellowbtn,
body.yx-btn-3d .yx-me-homebtn,
body.yx-btn-3d .m-auth-submit,
body.yx-btn-3d .mp-apply-btn,
body.yx-btn-3d .ml-apply-btn,
body.yx-btn-3d .ml-submit,
body.yx-btn-3d .yx-me-slide-cta {
  background: linear-gradient(180deg, #ff8a5c 0%, #ff642e 48%, #e84e1a 100%) !important;
  color: var(--yx-ink) !important;
  border: 0 !important;
  box-shadow:
    0 8px 16px rgba(232, 78, 26, 0.3),
    0 2px 0 rgba(200, 60, 20, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.75),
    inset 0 -2px 4px rgba(200, 60, 20, 0.18) !important;
  transform: translateY(0);
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}
body.yx-btn-3d .yx-me-homebtn {
  background: linear-gradient(180deg, #2a2a2a 0%, #111 55%, #000 100%) !important;
  color: #ff642e !important;
  box-shadow:
    0 6px 14px rgba(0, 0, 0, 0.22),
    0 2px 0 #000,
    inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
}
body.yx-btn-3d .yx-btn-3d:active,
body.yx-btn-3d .yx-me-yellowbtn:active,
body.yx-btn-3d .yx-me-homebtn:active,
body.yx-btn-3d .m-auth-submit:active,
body.yx-btn-3d .mp-apply-btn:active,
body.yx-btn-3d .ml-apply-btn:active,
body.yx-btn-3d .ml-submit:active {
  transform: translateY(2px);
  box-shadow:
    0 3px 8px rgba(0, 0, 0, 0.16),
    inset 0 2px 4px rgba(0, 0, 0, 0.12) !important;
}

/* 立体卡片 */
body.yx-card-3d .yx-card-3d,
body.yx-card-3d .yx-me-card,
body.yx-card-3d .ml-card,
body.yx-card-3d .mp-card,
body.yx-card-3d .mc-card,
body.yx-card-3d .yx-card {
  background: linear-gradient(180deg, #ffffff, #fffaf0);
  border: 1px solid rgba(255, 255, 255, 0.9);
  box-shadow:
    0 14px 28px rgba(0, 0, 0, 0.08),
    0 2px 0 rgba(255, 255, 255, 0.95) inset,
    0 -1px 0 rgba(0, 0, 0, 0.04) inset;
}
