:root {
  --app-height: 100vh;
  --primary: #2b7cd3;
  --active: #2b7cd3;
  --text: #333;
  --text-light: #999;
  --bg: #f5f7fa;
  --card-bg: #fff;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body {
  height: var(--app-height);
  overflow: hidden;
  font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
  background: var(--bg);
  color: var(--text);
}
.app-container {
  height: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
}
.page-container {
  flex: 1;
  overflow-y: auto;
  position: relative;
}
.page {
  display: none;
  min-height: 100%;
  padding-bottom: 80px;
}
.page.active { display: block; }

/* 底部导航 */
.bottom-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 65px;
  background: #fff;
  display: flex;
  border-top: 1px solid #eee;
  z-index: 999;
}
.nav-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: var(--text-light);
  text-decoration: none;
  transition: color 0.2s;
  cursor: pointer;
}
.nav-item.active { color: var(--active); }
.nav-icon { width: 24px; height: 24px; margin-bottom: 4px; }
.nav-text { font-size: 12px; }

/* 弹窗 */
.modal {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.5);
  z-index: 1000;
  align-items: center;
  justify-content: center;
}
.modal-content {
  background: #fff;
  width: 90%;
  max-width: 420px;
  border-radius: 12px;
  padding: 24px;
  max-height: 85vh;
  overflow-y: auto;
}
.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}
.close-btn {
  background: none; border: none; font-size: 24px; cursor: pointer; color: #999;
}
.form-group { margin-bottom: 16px; }
.form-group label { display: block; margin-bottom: 6px; font-size: 14px; color: #444; }
.form-group input, .form-group select {
  width: 100%; padding: 12px; border: 1px solid #ddd; border-radius: 8px; font-size: 16px;
}
.btn-primary {
  width: 100%; padding: 14px; background: var(--primary); color: #fff;
  border: none; border-radius: 8px; font-size: 16px; cursor: pointer;
}
.switch-form { margin-top: 16px; text-align: center; font-size: 14px; color: #666; }
.switch-form a { color: var(--primary); text-decoration: none; }

/* 首页 */
.logo-section { text-align: center; padding: 20px; background: linear-gradient(180deg, #e6f0fa, #fff); }
.logo-image { max-width: 220px; }
.image-carousel { height: 200px; overflow: hidden; background: #000; }
.carousel-container { height: 100%; position: relative; }
.carousel-slide {
  position: absolute; width: 100%; height: 100%; opacity: 0; transition: opacity 0.6s;
}
.carousel-slide.is-active { opacity: 1; }
.carousel-slide img { width: 100%; height: 100%; object-fit: cover; }
.culture-carousel { padding: 20px; }
.culture-slide { display: none; }
.culture-slide.is-active { display: block; }
.culture-kicker { color: var(--primary); font-size: 14px; margin-bottom: 8px; }
.culture-title { font-size: 22px; margin-bottom: 12px; }
.culture-body { line-height: 1.8; color: #555; }
.culture-dots { display: flex; justify-content: center; gap: 10px; margin-top: 20px; }
.culture-dot {
  width: 10px; height: 10px; border-radius: 50%; border: none; background: #ddd; cursor: pointer;
}
.culture-dot.is-active { background: var(--primary); }

/* 产品 */
.products-container { padding: 60px 20px; text-align: center; }
.empty-state { color: #999; font-size: 15px; }

/* 我的 */
.profile-section { padding: 20px; }
.login-section { padding: 30px 0; }
.user-header { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.user-name { font-size: 18px; font-weight: bold; }
.verified-badge { background: #e6f4ea; color: #2e9348; padding: 2px 8px; border-radius: 12px; font-size: 12px; }
.logout-btn { margin-left: auto; background: #f5f5f5; border: none; padding: 6px 12px; border-radius: 6px; cursor: pointer; }
.user-account { margin: 10px 0; color: #666; font-size: 14px; }
.balance-section { display: flex; justify-content: space-between; align-items: center; margin: 20px 0; }
.balance-label { font-size: 14px; color: #666; }
.balance-amount { font-size: 26px; font-weight: bold; }
.withdraw-btn { background: var(--primary); color: #fff; border: none; padding: 10px 20px; border-radius: 8px; cursor: pointer; }
.section-title { font-size: 16px; font-weight: bold; margin: 20px 0 10px; }
.section-header { display: flex; justify-content: space-between; align-items: center; }
.add-card-btn { background: var(--primary); color: #fff; border: none; padding: 6px 12px; border-radius: 6px; cursor: pointer; }
.bank-card { border: 1px solid #eee; border-radius: 10px; padding: 16px; margin-bottom: 10px; background: #fff; }
.bank-card-name { font-size: 14px; color: #666; margin-bottom: 4px; }
.bank-card-number { font-size: 18px; font-weight: bold; }
.record-item { display: flex; justify-content: space-between; padding: 12px 0; border-bottom: 1px solid #eee; }
.record-amount { font-weight: bold; color: #e64340; }
.record-time { font-size: 12px; color: #999; margin-top: 4px; }
.record-status { color: var(--primary); }
.available-balance { font-size: 13px; color: #666; margin-top: 6px; }
.security-tip { margin-top: 12px; padding: 10px; background: #fff8e6; border-radius: 6px; font-size: 13px; color: #996600; }
.record-status.is-pending { color: #e23c3c !important; font-weight: 700; }
.record-status.is-completed { color: #16a34a !important; font-weight: 700; }
.record-status.is-rejected { color: #999; }


/* NEON_VIP_CSS */
.vip-neon-badge{
  display:none;
  position:relative;
  align-items:center;
  justify-content:center;
  padding:2.5px;
  border-radius:8px;
  overflow:hidden;
  flex:0 0 auto;
  line-height:1;
  vertical-align:middle;
  pointer-events:none;
  box-shadow:0 0 8px rgba(255,46,181,.55),0 0 16px rgba(124,92,255,.35);
  animation:vipNeonAura 1.5s ease-in-out infinite;
}
.vip-neon-badge.is-on{display:inline-flex;}
.vip-neon-badge:before{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:240%;
  height:240%;
  transform:translate(-50%,-50%);
  background:conic-gradient(#ff2bd6,#7c5cff,#2de2ff,#3dff8a,#ffe14a,#ff7a1a,#ff2bd6);
  animation:vipNeonSpin 1.35s linear infinite;
  z-index:0;
}
.vip-neon-inner{
  position:relative;
  z-index:1;
  display:block;
  background:#12101a;
  color:#ff3eb5;
  font-weight:800;
  font-size:12px;
  letter-spacing:.16em;
  padding:4px 9px 4px 11px;
  border-radius:6px;
  text-shadow:0 0 6px #ff3eb5,0 0 14px #7c5cff;
  animation:vipNeonFlash 1.8s linear infinite;
}
@keyframes vipNeonSpin{
  to{transform:translate(-50%,-50%) rotate(360deg);}
}
@keyframes vipNeonFlash{
  0%{color:#ff3eb5;text-shadow:0 0 4px #ff3eb5,0 0 12px #c44dff;}
  25%{color:#7cf7ff;text-shadow:0 0 8px #2de2ff,0 0 16px #7c5cff;}
  50%{color:#b8ff4a;text-shadow:0 0 8px #3dff8a,0 0 14px #ffe14a;}
  75%{color:#ffb347;text-shadow:0 0 8px #ff7a1a,0 0 16px #ff3eb5;}
  100%{color:#ff3eb5;text-shadow:0 0 4px #ff3eb5,0 0 12px #c44dff;}
}
@keyframes vipNeonAura{
  0%,100%{box-shadow:0 0 6px rgba(255,62,181,.5),0 0 12px rgba(45,226,255,.28);}
  50%{box-shadow:0 0 12px rgba(255,178,71,.7),0 0 22px rgba(124,92,255,.55);}
}
/* NEON_VIP_CSS_END */





/* START_PAYOUT_CSS */
.record-status.is-paying{color:#999 !important;font-weight:500;font-size:13px;text-align:right;max-width:52%;line-height:1.4;}
.record-item.is-paying,
.record-item.is-paying .record-amount,
.record-item.is-paying .record-time,
.record-item.is-paying .record-info,
.record-item.is-paying .record-status,
.record-item.is-paying *{
  color:#999 !important;
}
.record-item.is-paying .record-amount{font-weight:500;}
/* START_PAYOUT_CSS_END */


/* MINE_NOTICE_CSS */
#mine-notice{position:fixed;inset:0;z-index:2147483600;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.55);padding:18px;}
#mine-notice.show{display:flex;}
.mine-notice-card{width:92%;max-width:380px;max-height:82vh;overflow:auto;background:#fff;border-radius:14px;box-shadow:0 12px 36px rgba(0,0,0,.28);position:relative;padding:22px 20px 20px;}
.mine-notice-close{position:absolute;top:8px;right:10px;width:32px;height:32px;border:0;background:transparent;font-size:26px;line-height:32px;color:#888;cursor:pointer;}
.mine-notice-title{text-align:center;font-size:20px;font-weight:800;color:#c0392b;letter-spacing:8px;padding:4px 28px 12px;border-bottom:1px solid #f0e6e6;}
.mine-notice-body{padding:16px 4px 4px;color:#333;font-size:15px;line-height:1.85;text-align:justify;}
.mine-notice-body .hi{text-indent:0;font-weight:700;margin-bottom:10px;}
.mine-notice-body p{text-indent:2em;margin:0;}
.mine-notice-ok{display:block;width:100%;margin-top:16px;height:40px;border:0;border-radius:8px;background:#e64340;color:#fff;font-size:16px;font-weight:600;cursor:pointer;}
/* MINE_NOTICE_CSS_END */