/* ============================================================
   大阵雲龍奇玄阁 · 黑金水主题（玄黑为底 · 鎏金为脉 · 水纹为气）
   玄黑 #0B0B10 · 黑卡 #15151C · 金 #D4AF37 · 亮金 #E5C35A
   深金 #8E7A2F · 水青 #3E7C96 · 暗金灰 #9C937B
   ============================================================ */
:root {
  --paper: #0B0B10;
  --card: #15151C;
  --ink: #EFE8D0;
  --sub: #9C937B;
  --jade: #D4AF37;
  --jade-deep: #8E7A2F;
  --qingbai: #1C1C26;
  --ochre: #C9A24B;
  --gold: #E5C35A;
  --cinnabar: #B08D3F;
  --line: #3A332A;
  --line-soft: #26221C;
  --el-jin: #D4AF37;
  --el-mu: #4E8A6A;
  --el-shui: #3E7C96;
  --el-huo: #C0653F;
  --el-tu: #C9A24B;
  --radius: 14px;
  --shadow: 0 6px 24px rgba(0, 0, 0, 0.55);
  --shadow-soft: 0 2px 10px rgba(0, 0, 0, 0.4);
}

* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

html { scroll-behavior: smooth; }

body {
  background: var(--paper);
  color: var(--ink);
  font-family: 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
  font-size: 15px;
  line-height: 1.7;
  min-height: 100vh;
}

.serif, h1, h2, h3, .brand-name, .seal-font {
  font-family: 'Noto Serif SC', 'Songti SC', 'SimSun', serif;
}

a { color: inherit; text-decoration: none; }
button { font-family: inherit; border: none; background: none; cursor: pointer; color: inherit; }
img { display: block; max-width: 100%; }

/* ---------- 顶部导航 ---------- */
.topbar {
  position: sticky;
  top: 0;
  z-index: 60;
  background: rgba(247, 243, 234, 0.92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line-soft);
}
.topbar-inner {
  max-width: 1120px;
  margin: 0 auto;
  padding: 10px 20px;
  display: flex;
  align-items: center;
  gap: 24px;
}
.brand { display: flex; align-items: center; gap: 10px; }
.brand-seal {
  width: 38px; height: 38px;
  border-radius: 7px;
  background: var(--cinnabar);
  color: #F7F3EA;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Noto Serif SC', serif;
  font-size: 22px; font-weight: 700;
  box-shadow: inset 0 0 0 2px rgba(247,243,234,0.35), 0 2px 6px rgba(160,59,40,0.35);
}
.brand-name { font-size: 20px; font-weight: 700; letter-spacing: 3px; color: var(--jade-deep); }
.brand-en { font-size: 9px; letter-spacing: 1.5px; color: var(--sub); margin-top: 2px; display: block; }
.topnav { display: flex; gap: 4px; margin-left: auto; }
.topnav a {
  padding: 7px 14px;
  border-radius: 8px;
  font-size: 14px;
  color: var(--sub);
  transition: all .2s;
}
.topnav a:hover, .topnav a.active { color: var(--jade); background: var(--qingbai); font-weight: 600; }
.top-actions { display: flex; align-items: center; gap: 14px; }
.currency-btn {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 5px 12px;
  font-size: 13px;
  color: var(--jade);
  background: var(--card);
}
.cart-link { font-size: 13px; color: var(--jade); position: relative; padding: 5px 4px; }
.cart-badge {
  position: absolute; top: -6px; right: -10px;
  min-width: 18px; height: 18px;
  border-radius: 9px;
  background: var(--cinnabar);
  color: #fff; font-size: 11px;
  display: flex; align-items: center; justify-content: center;
  padding: 0 4px;
}

/* ---------- 视图 ---------- */
main { max-width: 1120px; margin: 0 auto; padding: 20px 20px 90px; }
.view { display: none; animation: fadeIn .3s ease; }
.view.active { display: block; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* ---------- 底部导航（移动端） ---------- */
.bottombar {
  display: none;
  position: fixed;
  left: 0; right: 0; bottom: 0;
  background: rgba(255, 253, 248, 0.96);
  border-top: 1px solid var(--line-soft);
  z-index: 60;
  padding-bottom: env(safe-area-inset-bottom);
}
.bottombar a {
  flex: 1;
  display: flex; flex-direction: column; align-items: center;
  padding: 8px 0 6px;
  font-size: 11px;
  color: var(--sub);
}
.bottombar a.active { color: var(--jade); font-weight: 600; }
.bottombar .ico { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; margin-bottom: 2px; }

/* ---------- 通用组件 ---------- */
.section-title {
  display: flex; align-items: baseline; justify-content: space-between;
  margin: 34px 0 16px;
}
.section-title h2 {
  font-size: 20px; font-weight: 700; letter-spacing: 2px; color: var(--jade-deep);
  display: flex; align-items: center; gap: 10px;
}
.section-title h2::before {
  content: '';
  width: 18px; height: 3px;
  background: linear-gradient(90deg, var(--cinnabar), var(--gold));
  border-radius: 2px;
}
.section-more { font-size: 13px; color: var(--ochre); }
.section-more:hover { text-decoration: underline; }

.card {
  background: var(--card);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
  padding: 18px;
}

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border-radius: 10px;
  padding: 12px 26px;
  font-size: 15px; font-weight: 600;
  transition: all .2s;
}
.btn-primary { background: linear-gradient(135deg, var(--jade), var(--jade-deep)); color: #F7F3EA; box-shadow: 0 4px 14px rgba(47,74,61,.25); }
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(47,74,61,.3); }
.btn-ochre { background: linear-gradient(135deg, var(--ochre), #7E5440); color: #F7F3EA; }
.btn-gold { background: linear-gradient(135deg, var(--gold), #A98A4F); color: #2B2B2B; }
.btn-ghost { border: 1px solid var(--line); color: var(--jade); background: var(--card); }
.btn-block { display: flex; width: 100%; }
.btn-sm { padding: 8px 16px; font-size: 13px; border-radius: 8px; }
.btn:disabled { opacity: .5; cursor: not-allowed; }

.chip {
  display: inline-flex; align-items: center;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  border: 1px solid var(--line);
  color: var(--sub);
  background: var(--card);
}
.chip-jade { border-color: var(--jade); color: var(--jade); background: var(--qingbai); }
.chip-ochre { border-color: var(--ochre); color: var(--ochre); background: rgba(156,107,79,.08); }
.chip-gold { border-color: var(--gold); color: #8A6D33; background: rgba(194,164,106,.12); }

/* 五行色标签 */
.el-tag {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 30px; height: 30px;
  border-radius: 50%;
  color: #fff;
  font-size: 13px; font-weight: 600;
  font-family: 'Noto Serif SC', serif;
}
.el-jin { background: var(--el-jin); }
.el-mu { background: var(--el-mu); }
.el-shui { background: var(--el-shui); }
.el-huo { background: var(--el-huo); }
.el-tu { background: var(--el-tu); }

/* 玉签竖排标签 */
.jade-tag {
  display: inline-block;
  writing-mode: vertical-rl;
  letter-spacing: 4px;
  padding: 8px 5px;
  border-radius: 6px;
  background: linear-gradient(180deg, rgba(233,239,226,.9), rgba(194,164,106,.25));
  border: 1px solid rgba(47,74,61,.25);
  color: var(--jade-deep);
  font-family: 'Noto Serif SC', serif;
  font-size: 13px;
}

.price { color: var(--cinnabar); font-weight: 700; }
.price-sym { font-size: .72em; margin-right: 2px; }
.orig-price { color: var(--sub); text-decoration: line-through; font-size: .85em; margin-left: 6px; }

/* 水墨山脊分隔 */
.ink-divider {
  position: relative;
  height: 34px;
  margin: 6px 0;
  background:
    radial-gradient(120% 140% at 30% 30%, rgba(47,74,61,.10) 0%, transparent 45%),
    radial-gradient(100% 120% at 70% 60%, rgba(34,55,45,.12) 0%, transparent 40%);
}
.ink-divider::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold), var(--jade), var(--gold), transparent);
}

/* ---------- 首页 ---------- */
.hero {
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  background:
    radial-gradient(130% 160% at 85% 0%, rgba(194,164,106,.22) 0%, transparent 50%),
    linear-gradient(150deg, #22372D 0%, #2F4A3D 55%, #3A5A4C 100%);
  color: #F7F3EA;
  padding: 48px 44px;
  min-height: 260px;
  display: flex;
  align-items: center;
  box-shadow: 0 10px 30px rgba(34,55,45,.25);
}
.hero::before {
  content: '';
  position: absolute;
  right: -60px; top: -60px;
  width: 320px; height: 320px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(233,239,226,.18) 0%, transparent 65%);
}
.hero::after {
  content: '';
  position: absolute;
  right: 60px; bottom: -110px;
  width: 260px; height: 260px;
  border: 1px solid rgba(233,239,226,.15);
  border-radius: 50%;
  box-shadow: 0 0 0 30px rgba(233,239,226,.05), 0 0 0 60px rgba(233,239,226,.04);
}
.hero-inner { position: relative; z-index: 2; max-width: 560px; }
.hero-kicker {
  font-size: 13px; letter-spacing: 4px;
  color: var(--gold);
  margin-bottom: 12px;
  display: flex; align-items: center; gap: 10px;
}
.hero-kicker::before { content: ''; width: 26px; height: 1px; background: var(--gold); }
.hero-title { font-size: 40px; font-weight: 900; letter-spacing: 8px; line-height: 1.35; }
.hero-slogan { font-size: 15px; color: #CDD9C4; margin-top: 10px; letter-spacing: 2px; }
.hero-desc { font-size: 13px; color: #B8C6B4; margin-top: 16px; max-width: 420px; line-height: 1.8; }
.hero-cta { margin-top: 26px; display: flex; gap: 12px; flex-wrap: wrap; }

.hero-stat {
  position: relative; z-index: 2;
  margin-left: auto;
  display: grid; grid-template-columns: repeat(3, auto); gap: 10px;
  text-align: center;
}
.hero-stat .cell {
  background: rgba(233,239,226,.08);
  border: 1px solid rgba(233,239,226,.16);
  border-radius: 12px;
  padding: 14px 18px;
}
.hero-stat .num { font-size: 22px; font-weight: 700; color: var(--gold); font-family: 'Noto Serif SC', serif; }
.hero-stat .lbl { font-size: 11px; color: #B8C6B4; margin-top: 2px; letter-spacing: 1px; }

/* 快捷入口 */
.quick-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(88px, 1fr)); gap: 12px; }
.quick-item {
  background: var(--card);
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  padding: 16px 8px;
  text-align: center;
  cursor: pointer;
  transition: all .2s;
}
.quick-item:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.quick-ic {
  width: 44px; height: 44px;
  margin: 0 auto 8px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Noto Serif SC', serif;
  font-size: 20px; font-weight: 700; color: #F7F3EA;
}
.q1 { background: linear-gradient(135deg, #2F4A3D, #4E7A4C); }
.q2 { background: linear-gradient(135deg, #9C6B4F, #C2935F); }
.q3 { background: linear-gradient(135deg, #BFA05A, #E0D08A); color: #3A342C; }
.q4 { background: linear-gradient(135deg, #3E6B8C, #6E9EC4); }
.quick-t { font-size: 13px; color: var(--sub); }

/* 场景咨询卡 */
.consult-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
.consult-card {
  position: relative;
  background: var(--card);
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  padding: 18px 16px;
  cursor: pointer;
  transition: all .2s;
  overflow: hidden;
}
.consult-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.consult-card::after {
  content: '';
  position: absolute;
  right: -20px; top: -20px;
  width: 80px; height: 80px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(47,74,61,.06), transparent 70%);
}
.consult-mark {
  width: 40px; height: 40px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Noto Serif SC', serif;
  font-size: 22px; font-weight: 700;
  color: #F7F3EA;
  background: linear-gradient(150deg, var(--jade), var(--jade-deep));
  margin-bottom: 10px;
}
.consult-title { font-size: 17px; font-weight: 700; letter-spacing: 1px; }
.consult-desc { font-size: 12px; color: var(--sub); margin-top: 4px; line-height: 1.6; }
.consult-go { font-size: 12px; color: var(--ochre); margin-top: 10px; }

/* 商品网格 */
.product-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.product-card {
  background: var(--card);
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  overflow: hidden;
  cursor: pointer;
  transition: all .2s;
  display: flex; flex-direction: column;
}
.product-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.product-card .thumb { aspect-ratio: 1; overflow: hidden; background: var(--qingbai); position: relative; }
.product-card .thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s; }
.product-card:hover .thumb img { transform: scale(1.04); }
.product-card .fav {
  position: absolute; top: 10px; right: 10px;
  width: 30px; height: 30px;
  border-radius: 50%;
  background: rgba(255,253,248,.92);
  display: flex; align-items: center; justify-content: center;
  font-size: 15px;
  color: var(--sub);
}
.product-card .fav.on { color: var(--cinnabar); }
.product-card .info { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.product-card .nm { font-size: 15px; font-weight: 600; color: var(--ink); }
.product-card .meta { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--sub); }
.product-card .tags { display: flex; gap: 6px; flex-wrap: wrap; }
.product-card .price-row { margin-top: auto; display: flex; align-items: baseline; justify-content: space-between; }
.cross-tag {
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 4px;
  border: 1px solid var(--gold);
  color: #8A6D33;
  background: rgba(194,164,106,.12);
  letter-spacing: 1px;
}

/* 跨境服务条 */
.global-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  background: var(--card);
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  padding: 20px;
  box-shadow: var(--shadow-soft);
}
.global-item { display: flex; align-items: center; gap: 10px; }
.global-item .g-ic {
  width: 34px; height: 34px;
  border-radius: 8px;
  background: var(--qingbai);
  display: flex; align-items: center; justify-content: center;
  color: var(--jade);
}
.global-item .g-ic svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.global-item .g-t { font-size: 13px; font-weight: 600; }
.global-item .g-s { font-size: 11px; color: var(--sub); }

/* 品牌故事 */
.story {
  position: relative;
  overflow: hidden;
  padding: 26px;
}
.story::before {
  content: '調運';
  position: absolute;
  right: 14px; bottom: 6px;
  font-family: 'Noto Serif SC', serif;
  font-size: 74px; font-weight: 900;
  color: rgba(47,74,61,.05);
  letter-spacing: 6px;
}
.story h3 { font-size: 18px; letter-spacing: 2px; color: var(--jade-deep); margin-bottom: 8px; }
.story p { font-size: 14px; color: var(--sub); max-width: 640px; position: relative; z-index: 1; }

/* ---------- 商城 ---------- */
.mall-tools { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 16px; }
.search-box {
  flex: 1; min-width: 220px;
  display: flex; align-items: center; gap: 8px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 0 14px;
}
.search-box input { flex: 1; border: none; outline: none; background: none; padding: 11px 0; font-size: 14px; color: var(--ink); }
.filter-row { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }
.filter-row button {
  padding: 6px 14px;
  border-radius: 999px;
  font-size: 13px;
  border: 1px solid var(--line);
  color: var(--sub);
  background: var(--card);
}
.filter-row button.active { border-color: var(--jade); color: var(--jade); background: var(--qingbai); font-weight: 600; }
.mall-count { font-size: 12px; color: var(--sub); margin-bottom: 12px; }

/* ---------- 详情 ---------- */
.detail-wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.detail-gallery .main-img {
  border-radius: 16px;
  overflow: hidden;
  background: var(--qingbai);
  aspect-ratio: 1;
  box-shadow: var(--shadow);
}
.detail-gallery .main-img img { width: 100%; height: 100%; object-fit: cover; }
.detail-info { display: flex; flex-direction: column; gap: 14px; }
.detail-info h1 { font-size: 24px; font-weight: 700; letter-spacing: 1px; }
.detail-row { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.kv { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; font-size: 14px; }
.kv .k { color: var(--sub); }
.kv .v { color: var(--ink); }
.spec-box {
  background: var(--qingbai);
  border-radius: 12px;
  padding: 14px 16px;
  font-size: 13px;
  line-height: 2;
}
.spec-box b { color: var(--jade-deep); }
.meaning-box {
  border-left: 3px solid var(--gold);
  background: rgba(194,164,106,.10);
  border-radius: 0 12px 12px 0;
  padding: 12px 16px;
  font-family: 'Noto Serif SC', serif;
  font-size: 15px;
  color: var(--jade-deep);
}
.cross-ship {
  border: 1px dashed var(--line);
  border-radius: 12px;
  padding: 12px 16px;
  font-size: 13px;
  color: var(--sub);
  display: flex; gap: 12px; align-items: center; flex-wrap: wrap;
}
.detail-actions { display: flex; gap: 10px; margin-top: 4px; }
.buy-bar {
  position: sticky; bottom: 0;
  margin-top: 24px;
  background: rgba(255,253,248,.96);
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  padding: 12px 18px;
  display: flex; align-items: center; gap: 14px;
  box-shadow: var(--shadow);
}
.buy-bar .total { font-size: 20px; }
.buy-bar .btns { margin-left: auto; display: flex; gap: 10px; }

/* ---------- 表单 ---------- */
.form-card { display: flex; flex-direction: column; gap: 14px; max-width: 620px; }
.form-item { display: flex; flex-direction: column; gap: 6px; }
.form-item label { font-size: 13px; color: var(--sub); letter-spacing: 1px; }
.form-item input, .form-item select, .form-item textarea {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--card);
  padding: 12px 14px;
  font-size: 15px;
  font-family: inherit;
  outline: none;
  color: var(--ink);
  transition: border .2s;
}
.form-item input:focus, .form-item select:focus, .form-item textarea:focus { border-color: var(--jade); }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.gender-pick { display: flex; gap: 10px; }
.gender-pick button {
  flex: 1;
  padding: 12px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--card);
  font-size: 15px;
  color: var(--sub);
}
.gender-pick button.active { border-color: var(--jade); background: var(--qingbai); color: var(--jade); font-weight: 600; }
.hour-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
.hour-grid button {
  padding: 10px 4px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--card);
  font-size: 12px;
  color: var(--sub);
}
.hour-grid button.active { border-color: var(--jade); background: var(--qingbai); color: var(--jade); font-weight: 600; }

/* ---------- 排盘结果 ---------- */
.pillar-banner {
  background: linear-gradient(140deg, #1F332A, #2F4A3D 60%, #3A5A4C);
  border-radius: 16px;
  padding: 22px 24px;
  color: #F6F1E6;
  margin-bottom: 18px;
  box-shadow: var(--shadow);
}
.pillar-banner .pb-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.pillar-banner .pb-name { font-size: 18px; font-weight: 700; }
.pillar-banner .pb-birth { font-size: 12px; color: #C9D6BD; }
.pillars { display: flex; margin-top: 16px; }
.pillar-col { flex: 1; text-align: center; border-right: 1px solid rgba(246,241,230,.18); }
.pillar-col:last-child { border-right: none; }
.pillar-label { font-size: 12px; color: #A9BCA2; letter-spacing: 2px; }
.pillar-gan { font-family: 'Noto Serif SC', serif; font-size: 30px; font-weight: 700; margin-top: 4px; }
.pillar-day { color: #E5C77E; }
.pb-dm { margin-top: 12px; font-size: 13px; color: #E4EADF; text-align: center; }

.tabs { display: flex; background: var(--card); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; margin-bottom: 16px; }
.tab { flex: 1; text-align: center; padding: 12px 0; font-size: 14px; color: var(--sub); cursor: pointer; position: relative; }
.tab.active { color: var(--jade); font-weight: 700; background: rgba(233,239,226,.5); }
.tab.active::after { content: ''; position: absolute; bottom: 0; left: 30%; right: 30%; height: 3px; border-radius: 2px; background: var(--ochre); }
.tab .lock { font-size: 10px; color: var(--cinnabar); margin-left: 2px; }

.wx-bar-row { display: flex; align-items: center; margin-bottom: 14px; }
.wx-name { width: 34px; font-family: 'Noto Serif SC', serif; font-size: 17px; font-weight: 700; color: var(--jade); }
.wx-track { flex: 1; height: 12px; background: var(--line-soft); border-radius: 6px; overflow: hidden; margin: 0 12px; }
.wx-fill { height: 100%; border-radius: 6px; }
.wx-jin { background: linear-gradient(90deg, #C9B458, #E0D08A); }
.wx-mu { background: linear-gradient(90deg, #4E7A4C, #7CA871); }
.wx-shui { background: linear-gradient(90deg, #3E6B8C, #6E9EC4); }
.wx-huo { background: linear-gradient(90deg, #B4573F, #D97B5E); }
.wx-tu { background: linear-gradient(90deg, #9C6B3F, #C2935F); }
.wx-pct { width: 64px; text-align: right; font-size: 13px; color: #5C5347; }

.gods-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.god-cell { border-radius: 12px; padding: 14px 10px; text-align: center; border: 1px solid rgba(47,74,61,.15); background: var(--card); }
.god-cell.god-yong { background: linear-gradient(160deg, #2F4A3D, #3A5A4C); color: #F6F1E6; }
.god-cell.god-xi { background: rgba(194,164,106,.16); }
.god-cell.god-ji { background: rgba(180,87,63,.10); }
.god-cell.god-xian { background: rgba(138,122,102,.10); }
.god-label { font-size: 12px; opacity: .85; }
.god-wx { font-size: 26px; font-weight: 700; margin: 4px 0; font-family: 'Noto Serif SC', serif; }
.god-desc { font-size: 11px; opacity: .85; line-height: 1.5; }

.ss-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; }
.ss-cell { text-align: center; padding: 10px 0; border-bottom: 1px solid var(--line-soft); }
.ss-label { font-size: 11px; color: var(--sub); }
.ss-gan { font-size: 20px; font-weight: 700; color: var(--jade); }
.ss-name { font-size: 12px; color: #5C5347; }

.yun-scroll { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 6px; }
.yun-item { flex: 0 0 88px; text-align: center; padding: 12px 0; border-radius: 10px; background: rgba(233,239,226,.6); border: 1px solid #C9D6BD; }
.yun-ganzhi { font-size: 17px; font-weight: 700; color: var(--jade); font-family: 'Noto Serif SC', serif; }
.yun-age { font-size: 11px; color: var(--sub); margin-top: 4px; }

.advice-text { font-size: 14px; line-height: 1.9; color: var(--ink); }
.tiaohou { font-size: 13px; color: #5C5347; background: rgba(156,107,79,.08); border-radius: 10px; padding: 10px 14px; margin-top: 8px; line-height: 1.8; }

/* 六壬 */
.lr-row { display: flex; margin-bottom: 16px; }
.lr-item { flex: 1; text-align: center; }
.lr-label { font-size: 12px; color: var(--sub); }
.lr-value { font-size: 20px; font-weight: 700; color: var(--jade); margin-top: 4px; font-family: 'Noto Serif SC', serif; }
.ke-row { display: flex; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line-soft); font-size: 13px; }
.ke-name { width: 84px; color: var(--sub); }
.ke-shang { width: 44px; text-align: center; font-size: 18px; font-weight: 700; color: var(--jade); font-family: 'Noto Serif SC', serif; }
.ke-arrow { width: 20px; text-align: center; color: #B9AE9C; }
.ke-xia { width: 44px; text-align: center; font-size: 18px; font-weight: 700; font-family: 'Noto Serif SC', serif; }
.ke-qin { flex: 1; text-align: center; color: var(--ochre); }
.ke-jiang { width: 56px; text-align: right; color: #8A6D33; }
.chuan-row { display: flex; gap: 10px; }
.chuan-cell { flex: 1; text-align: center; padding: 12px 0; border-radius: 12px; background: rgba(233,239,226,.6); border: 1px solid #C9D6BD; }
.chuan-label { font-size: 11px; color: var(--sub); }
.chuan-zhi { font-size: 24px; font-weight: 700; color: var(--jade); margin: 4px 0; font-family: 'Noto Serif SC', serif; }
.chuan-sub { font-size: 11px; color: #5C5347; }

/* 奇门九宫 */
.qm-grid { display: grid; grid-template-columns: repeat(3, 1fr); border: 2px solid var(--jade); border-radius: 12px; overflow: hidden; }
.qm-cell { position: relative; height: 118px; border: 1px solid rgba(47,74,61,.35); display: flex; flex-direction: column; align-items: center; justify-content: center; background: var(--card); }
.qm-shen { position: absolute; top: 4px; left: 8px; font-size: 11px; color: var(--ochre); }
.qm-main { display: flex; flex-direction: column; align-items: center; }
.qm-tian { font-size: 20px; font-weight: 700; color: var(--el-huo); font-family: 'Noto Serif SC', serif; }
.qm-star { font-size: 12px; color: var(--jade); margin-top: 2px; }
.qm-door { font-size: 12px; color: #8A6D33; }
.qm-di { position: absolute; bottom: 4px; right: 8px; font-size: 14px; color: rgba(47,74,61,.5); font-family: 'Noto Serif SC', serif; }

/* 锁面板 */
.lock-panel { background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 48px 30px; text-align: center; }
.lock-mark { font-size: 54px; color: rgba(156,107,79,.25); font-weight: 700; font-family: 'Noto Serif SC', serif; }
.lock-title { font-size: 19px; font-weight: 700; color: var(--jade); margin-top: 8px; }
.lock-desc { font-size: 13px; color: var(--sub); margin: 10px auto 22px; max-width: 360px; line-height: 1.8; }
.pay-includes { background: var(--qingbai); border-radius: 12px; padding: 12px 16px; margin-bottom: 16px; text-align: left; }
.pay-line { font-size: 13px; line-height: 2; }
.pay-price { text-align: center; font-size: 32px; font-weight: 700; color: var(--cinnabar); margin-bottom: 18px; }

/* ---------- 咨询 ---------- */
.quiz-step { max-width: 620px; margin: 0 auto; }
.quiz-progress { display: flex; gap: 6px; margin-bottom: 22px; }
.quiz-progress .dot { flex: 1; height: 4px; border-radius: 2px; background: var(--line-soft); }
.quiz-progress .dot.done { background: var(--jade); }
.quiz-progress .dot.cur { background: var(--gold); }
.quiz-q { font-size: 19px; font-weight: 700; color: var(--jade-deep); margin-bottom: 18px; font-family: 'Noto Serif SC', serif; }
.option-list { display: flex; flex-direction: column; gap: 10px; }
.option-item {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px 16px;
  background: var(--card);
  font-size: 15px;
  cursor: pointer;
  transition: all .2s;
  text-align: left;
}
.option-item:hover { border-color: var(--jade); }
.option-item.selected { border-color: var(--jade); background: var(--qingbai); color: var(--jade); font-weight: 600; }
.quiz-actions { display: flex; gap: 10px; margin-top: 22px; justify-content: space-between; }

.cr-preview { border-left: 3px solid var(--gold); background: rgba(194,164,106,.10); border-radius: 0 12px 12px 0; padding: 14px 18px; }
.chapter { margin-bottom: 14px; }
.chapter h4 { font-size: 15px; color: var(--jade-deep); margin-bottom: 6px; display: flex; align-items: center; gap: 8px; }
.chapter h4::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--cinnabar); }
.chapter p { font-size: 14px; color: #4A443B; line-height: 1.9; }

/* ---------- 购物车 ---------- */
.cart-item { display: flex; gap: 14px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--line-soft); }
.cart-item .thumb { width: 76px; height: 76px; border-radius: 10px; overflow: hidden; background: var(--qingbai); flex: none; }
.cart-item .thumb img { width: 100%; height: 100%; object-fit: cover; }
.cart-item .mid { flex: 1; min-width: 0; }
.cart-item .nm { font-size: 15px; font-weight: 600; }
.cart-item .unit { font-size: 12px; color: var(--sub); margin-top: 2px; }
.qty { display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.qty button { width: 30px; height: 30px; font-size: 15px; color: var(--jade); background: var(--card); }
.qty span { min-width: 34px; text-align: center; font-size: 14px; }
.cart-summary { display: flex; align-items: center; gap: 16px; margin-top: 18px; }
.checkbox { width: 20px; height: 20px; border: 1.5px solid var(--line); border-radius: 5px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; color: transparent; }
.checkbox.on { background: var(--jade); border-color: var(--jade); color: #fff; }

/* ---------- 订单 ---------- */
.order-card { background: var(--card); border: 1px solid var(--line-soft); border-radius: 14px; padding: 16px; margin-bottom: 14px; box-shadow: var(--shadow-soft); }
.order-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; font-size: 13px; color: var(--sub); }
.order-status { color: var(--jade); font-weight: 600; }
.order-items { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; }
.order-line { display: flex; justify-content: space-between; font-size: 14px; }
.order-line .nm { color: var(--ink); }
.order-foot { display: flex; justify-content: space-between; align-items: center; border-top: 1px dashed var(--line); padding-top: 10px; font-size: 14px; }
.timeline { display: flex; flex-direction: column; gap: 12px; }
.tl-item { display: flex; gap: 12px; }
.tl-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--line); margin-top: 6px; flex: none; }
.tl-item.done .tl-dot { background: var(--jade); }
.tl-item.cur .tl-dot { background: var(--gold); box-shadow: 0 0 0 4px rgba(194,164,106,.2); }
.tl-item .tl-t { font-size: 14px; font-weight: 600; }
.tl-item .tl-s { font-size: 12px; color: var(--sub); }

/* ---------- 用户中心 ---------- */
.me-head { display: flex; align-items: center; gap: 16px; padding: 22px; }
.me-avatar {
  width: 56px; height: 56px;
  border-radius: 50%;
  background: linear-gradient(150deg, var(--jade), var(--jade-deep));
  color: var(--gold);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Noto Serif SC', serif;
  font-size: 26px; font-weight: 700;
  flex: none;
}
.me-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px; }
.me-tabs button {
  padding: 7px 16px;
  border-radius: 999px;
  font-size: 13px;
  border: 1px solid var(--line);
  background: var(--card);
  color: var(--sub);
}
.me-tabs button.active { background: var(--jade); color: #F7F3EA; border-color: var(--jade); font-weight: 600; }
.me-list { display: flex; flex-direction: column; gap: 10px; }
.me-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.row-btn { color: var(--ochre); font-size: 13px; flex: none; }
.row-btn.danger { color: var(--cinnabar); }

/* ---------- 空态 ---------- */
.empty { text-align: center; padding: 60px 20px; color: var(--sub); }
.empty .e-mark { font-size: 52px; color: rgba(47,74,61,.18); font-family: 'Noto Serif SC', serif; font-weight: 700; margin-bottom: 10px; }
.empty p { font-size: 14px; }

/* ---------- Toast ---------- */
.toast {
  position: fixed;
  left: 50%; bottom: 80px;
  transform: translateX(-50%);
  background: rgba(34,55,45,.92);
  color: #F7F3EA;
  padding: 10px 22px;
  border-radius: 10px;
  font-size: 14px;
  z-index: 200;
  box-shadow: 0 6px 20px rgba(0,0,0,.2);
  max-width: 80vw;
  text-align: center;
}

/* ---------- 响应式 ---------- */
@media (max-width: 860px) {
  .topnav { display: none; }
  .hero { padding: 34px 26px; min-height: 220px; }
  .hero-title { font-size: 28px; letter-spacing: 5px; }
  .hero-stat { display: none; }
  .quick-grid { gap: 8px; }
  .consult-grid { grid-template-columns: repeat(2, 1fr); }
  .product-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .global-bar { grid-template-columns: repeat(2, 1fr); }
  .detail-wrap { grid-template-columns: 1fr; }
  .buy-bar { flex-wrap: wrap; }
  .bottombar { display: flex; }
  main { padding-bottom: 84px; }
  .gods-grid { grid-template-columns: repeat(2, 1fr); }
  .ss-grid { grid-template-columns: repeat(4, 1fr); }
  .form-grid { grid-template-columns: 1fr; }
  .hour-grid { grid-template-columns: repeat(4, 1fr); }
  .topbar-inner { padding: 8px 14px; }
  .brand-en { display: none; }
}

@media (max-width: 420px) {
  .product-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .quick-ic { width: 38px; height: 38px; font-size: 17px; }
  .hero-title { font-size: 24px; letter-spacing: 3px; }
  .cart-link { font-size: 12px; }
}

/* ---------- 小六壬 / 手相面相（融合新增） ---------- */
.quick-ic.q5 { background: linear-gradient(135deg, #5A4A6E, #8A7BA8); }
.quick-ic.q6 { background: linear-gradient(135deg, #7A5A3A, #B98A5E); }
.quick-ic.q7 { background: linear-gradient(135deg, #C98A9B, #E5B8C2); color: #4A3438; }
@media (max-width: 860px) { .quick-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 420px) { .quick-grid { grid-template-columns: repeat(3, 1fr); } }

/* 掌诀六宫图 */
.palm-map { margin: 4px 0 14px; }
.palm-map-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  max-width: 340px;
  margin: 0 auto;
}
.palm-cell {
  position: relative;
  background: var(--card);
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  padding: 12px 8px 10px;
  text-align: center;
}
.palm-cell .palm-dot {
  position: absolute;
  top: 8px; right: 8px;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #D9D2C2;
}
.palm-cell.palm-hit { border-color: var(--cinnabar); box-shadow: 0 6px 18px rgba(160,59,40,.18); }
.palm-cell.palm-hit .palm-dot { background: var(--cinnabar); animation: palmPulse 1s ease-in-out infinite; }
@keyframes palmPulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.45); } }
.palm-name { font-family: 'Noto Serif SC', serif; font-size: 16px; font-weight: 700; color: var(--jade-deep); }
.palm-sub { font-size: 11px; color: var(--sub); margin-top: 3px; }
.palm-pos { font-size: 10px; color: #B0A792; margin-top: 3px; }
.palm-note { text-align: center; font-size: 11px; color: var(--sub); margin-top: 10px; }
.palm-result-row { display: flex; gap: 10px; }
@media (max-width: 420px) { .palm-map-grid { max-width: none; } }

/* 六壬课体吉凶 */
.lr-value.jx-great, .lr-value.jx-good { color: #2E7D5B; font-weight: 700; }
.lr-value.jx-mid { color: #8A7B3E; font-weight: 700; }
.lr-value.jx-bad, .lr-value.jx-worse { color: var(--cinnabar); font-weight: 700; }
.chuan-dir { font-size: 10px; color: #B0A792; margin-top: 2px; }
.chuan-sub { font-size: 11px; color: var(--sub); margin-top: 4px; line-height: 1.5; }

/* 奇门格局 */
.qm-jx { position: absolute; bottom: 3px; left: 0; right: 0; display: flex; gap: 4px; justify-content: center; }
.jx { font-style: normal; font-size: 9px; padding: 1px 4px; border-radius: 4px; }
.jx-吉 { background: rgba(46,125,91,.12); color: #2E7D5B; }
.jx-平 { background: rgba(138,123,62,.12); color: #8A7B3E; }
.jx-凶 { background: rgba(160,59,40,.12); color: #A03B28; }
.geju-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  border-bottom: 1px dashed var(--line-soft);
  font-size: 13px;
}
.geju-row:last-child { border-bottom: none; }
.geju-gong { font-size: 11px; color: #B0A792; min-width: 34px; }
.geju-gan { font-family: 'Noto Serif SC', serif; font-weight: 700; color: var(--jade-deep); min-width: 40px; text-align: center; }
.geju-name { color: var(--ink); font-weight: 600; min-width: 76px; }
.geju-jx { font-size: 11px; padding: 1px 6px; border-radius: 4px; min-width: 30px; text-align: center; }
.geju-desc { color: var(--sub); font-size: 12px; flex: 1; }

/* 手相面相解读行 */
.xiang-line {
  font-size: 13px;
  color: #4A443B;
  line-height: 1.8;
  padding: 7px 12px;
  margin-top: 6px;
  background: rgba(233,239,226,.5);
  border-left: 3px solid var(--ochre);
  border-radius: 0 8px 8px 0;
}

/* 八字婚配合婚指数 */
.marry-score { font-size: 44px; font-weight: 700; font-family: 'Noto Serif SC', serif; min-width: 76px; text-align: center; }
.marry-score.jx-great, .marry-score.jx-good { color: #2E7D5B; }
.marry-score.jx-mid { color: #8A7B3E; }
.marry-score.jx-bad, .marry-score.jx-worse { color: var(--cinnabar); }
.marry-grade { font-size: 20px; font-weight: 700; font-family: 'Noto Serif SC', serif; letter-spacing: 2px; }
.marry-grade.jx-great, .marry-grade.jx-good { color: #2E7D5B; }
.marry-grade.jx-mid { color: #8A7B3E; }
.marry-grade.jx-bad, .marry-grade.jx-worse { color: var(--cinnabar); }
.marry-bar { height: 8px; background: rgba(47,74,61,.12); border-radius: 4px; margin-top: 8px; overflow: hidden; }
.marry-fill { height: 100%; border-radius: 4px; }
.marry-fill.jx-great, .marry-fill.jx-good { background: linear-gradient(90deg, #2E7D5B, #4E9A72); }
.marry-fill.jx-mid { background: linear-gradient(90deg, #8A7B3E, #B9A75A); }
.marry-fill.jx-bad, .marry-fill.jx-worse { background: linear-gradient(90deg, #A03B28, #C0563E); }

/* 联系师父 · 微信码 / 付款码 */
.contact-card { padding: 20px 16px; }
.contact-qrs { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.qr-box { width: 150px; text-align: center; }
.qr-box img { width: 150px; height: 150px; object-fit: contain; border-radius: 10px; border: 1px solid #E2D9C4; background: #fff; box-shadow: 0 4px 14px rgba(47,74,61,.12); }
.qr-lbl { font-size: 12px; color: #7D7264; margin-top: 8px; letter-spacing: 2px; }
.contact-note { font-size: 13px; color: #4A443B; line-height: 1.9; text-align: center; margin-top: 14px; }

/* 全方位解锁套餐 */
.all-unlock { padding: 20px 16px; border: 1px solid rgba(160,59,40,.25); background: linear-gradient(160deg, #FFFDF8, #F7F1E2); }
.au-badge { font-size: 17px; font-weight: 700; font-family: 'Noto Serif SC', serif; color: #2F4A3D; text-align: center; letter-spacing: 3px; }
.au-badge.done { color: #2E7D5B; }
.au-list { display: flex; justify-content: space-around; margin: 14px 0 6px; text-align: center; }
.au-row { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: #7D7264; }

/* ============================================================
   黑金水主题覆盖层 · 玄黑为底 · 鎏金为脉 · 水纹为气
   ============================================================ */
body {
  background-image:
    radial-gradient(1200px 640px at 16% -8%, rgba(212,175,55,0.06) 0%, transparent 55%),
    radial-gradient(900px 520px at 104% 108%, rgba(62,124,150,0.10) 0%, transparent 60%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='48' viewBox='0 0 240 48'%3E%3Cpath d='M0 18 C30 8 60 8 90 18 S150 28 180 18 S220 8 240 18' fill='none' stroke='%23D4AF37' stroke-opacity='0.055' stroke-width='1'/%3E%3Cpath d='M0 30 C30 22 60 22 90 30 S150 38 180 30 S220 22 240 30' fill='none' stroke='%233E7C96' stroke-opacity='0.05' stroke-width='1'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-attachment: fixed;
}
.topbar { background: rgba(11,11,16,.92); border-bottom-color: var(--line); }
.brand-seal { background: linear-gradient(135deg, var(--gold), var(--jade)); color: #15151C; box-shadow: inset 0 0 0 2px rgba(21,21,28,.3), 0 2px 8px rgba(212,175,55,.4); }
.brand-name { color: var(--gold); }
.topnav a { color: var(--sub); }
.topnav a:hover, .topnav a.active { color: var(--gold); background: rgba(212,175,55,.1); }
.currency-btn { border-color: var(--line); color: var(--gold); background: var(--card); }
.cart-link { color: var(--gold); }
.cart-badge { background: linear-gradient(135deg, var(--gold), var(--jade)); color: #15151C; }
.bottombar { background: rgba(11,11,16,.96); border-top-color: var(--line); }
.bottombar a.active { color: var(--gold); }
.card { background: var(--card); border-color: var(--line); }
.btn-primary { background: linear-gradient(135deg, var(--gold), var(--jade)); color: #15151C; box-shadow: 0 4px 16px rgba(212,175,55,.25); }
.btn-primary:hover { box-shadow: 0 6px 20px rgba(212,175,55,.35); }
.btn-ochre { background: linear-gradient(135deg, var(--ochre), var(--jade-deep)); color: #15151C; }
.btn-gold { background: linear-gradient(135deg, var(--gold), var(--jade)); color: #15151C; }
.btn-ghost { border-color: var(--line); color: var(--gold); background: transparent; }
.chip { border-color: var(--line); color: var(--sub); background: rgba(21,21,28,.65); }
.chip-jade { border-color: var(--gold); color: var(--gold); background: rgba(212,175,55,.08); }
.chip-ochre { border-color: var(--ochre); color: var(--ochre); background: rgba(201,162,75,.1); }
.chip-gold { border-color: var(--gold); color: var(--gold); background: rgba(212,175,55,.12); }
.cross-tag { border-color: var(--gold); color: var(--gold); background: rgba(212,175,55,.12); }

/* 首页 hero：玄黑 + 金波光 + 水青涟漪 */
.hero {
  background:
    radial-gradient(130% 160% at 85% 0%, rgba(229,195,90,.15) 0%, transparent 50%),
    radial-gradient(70% 110% at 6% 112%, rgba(62,124,150,.16) 0%, transparent 55%),
    linear-gradient(150deg, #0E0E15 0%, #15151E 55%, #0A0A0F 100%);
  color: var(--ink);
  box-shadow: 0 10px 30px rgba(0,0,0,.55);
}
.hero::before { background: radial-gradient(circle, rgba(229,195,90,.14) 0%, transparent 65%); }
.hero::after { border-color: rgba(62,124,150,.30); box-shadow: 0 0 0 30px rgba(62,124,150,.08), 0 0 0 60px rgba(62,124,150,.05); }
.hero-slogan { color: #D8C893; }
.hero-desc { color: #B7AE8F; }
.hero-stat .cell { background: rgba(229,195,90,.06); border-color: rgba(229,195,90,.18); }
.hero-stat .lbl { color: #B7AE8F; }
.hero-title { color: var(--gold); }

/* 五行快捷入口：黑金水色系 */
.quick-item { background: var(--card); border-color: var(--line); }
.quick-ic { color: #15151C; }
.q1 { background: linear-gradient(135deg, #D4AF37, #8E7A2F); }
.q2 { background: linear-gradient(135deg, #C0653F, #8E7A2F); }
.q3 { background: linear-gradient(135deg, #3E7C96, #2E5E6E); color: #EFE8D0; }
.q4 { background: linear-gradient(135deg, #4E8A6A, #2E5E4E); color: #EFE8D0; }

/* 场景咨询卡 */
.consult-card { background: var(--card); border-color: var(--line); }
.consult-card::after { background: radial-gradient(circle, rgba(212,175,55,.06), transparent 70%); }
.consult-mark { color: #15151C; background: linear-gradient(150deg, var(--gold), var(--jade)); }
.consult-go { color: var(--gold); }

/* 商品 */
.product-card { background: var(--card); border-color: var(--line); }
.product-card .thumb { background: #101018; }
.product-card .fav { background: rgba(11,11,16,.72); border: 1px solid var(--line); }
.product-card .fav.on { color: var(--gold); }

/* 跨境服务条与品牌故事 */
.global-bar { background: var(--card); border-color: var(--line); }
.global-item .g-ic { background: rgba(212,175,55,.1); color: var(--gold); }
.story { background: var(--card); border: 1px solid var(--line); }

/* 表单控件：玄黑底金描 */
input, select, textarea {
  background: #0D0D13;
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 10px;
}
input::placeholder, textarea::placeholder { color: #6E6756; }

/* 排盘结果 */
.pillar-banner { background: linear-gradient(160deg, #16161E, #101018); border: 1px solid var(--line); }
.pillar-label { color: #A8A088; }
.pb-dm { color: #D8C893; }
.pb-birth { color: var(--sub); }
.pillars .pillar-col { border-right-color: rgba(229,195,90,.14); }

/* Tab 切换 */
.tabs { background: var(--card); border-color: var(--line); }
.tab { color: var(--sub); }
.tab.active { color: #15151C; background: rgba(212,175,55,.12); }
.tab.active::after { background: var(--gold); }
.tab .lock { color: var(--gold); }

/* 锁面板 */
.lock-panel { background: linear-gradient(160deg, #16161E 0%, #1E1E28 100%); border-color: var(--line); }
.lock-title { color: var(--gold); }

/* 用户中心 */
.me-head { background: linear-gradient(150deg, #16161E, #0E0E15); border-color: var(--line); }
.me-tabs button { color: var(--sub); border-color: var(--line); background: transparent; }
.me-tabs button.active { background: var(--gold); color: #15151C; border-color: var(--gold); }

/* 空态与印章 */
.empty .e-mark { color: var(--gold); }
.jade-tag { color: var(--gold); border-color: var(--line); }

/* 水纹分隔线 */
.ink-divider { background: linear-gradient(90deg, transparent, rgba(212,175,55,.4), transparent); }
.footer { border-top-color: var(--line); color: var(--sub); }
/* ---- 黑金补遗：残留浅色组件 ---- */
.jade-tag { background: rgba(212,175,55,.08); color: var(--gold); }
.buy-bar { background: rgba(11,11,16,.96); border-color: var(--line); }
.god-cell { border-color: rgba(212,175,55,.25); }
.god-cell.god-yong { background: linear-gradient(160deg, var(--jade), var(--jade-deep)); color: #15151C; }
.god-cell.god-xi { background: rgba(212,175,55,.16); }
.god-cell.god-ji { background: rgba(192,101,63,.12); }
.god-cell.god-xian { background: rgba(62,124,150,.12); }
.yun-item { background: rgba(21,21,28,.8); border-color: var(--line); color: var(--ink); }
.chuan-cell { background: rgba(21,21,28,.8); border-color: var(--line); color: var(--ink); }
.qm-cell { border-color: rgba(212,175,55,.35); }
.qm-di { color: rgba(212,175,55,.5); }
.toast { background: rgba(11,11,16,.94); color: var(--ink); border: 1px solid var(--line); box-shadow: 0 6px 20px rgba(0,0,0,.5); }

/* 吉凶色：黑金体系（金=吉 · 金铜=平 · 鎏金=凶向） */
.lr-value.jx-great, .lr-value.jx-good { color: var(--gold); }
.lr-value.jx-mid { color: var(--ochre); }
.jx-吉 { background: rgba(212,175,55,.14); color: var(--gold); }
.jx-平 { background: rgba(201,162,75,.12); color: var(--ochre); }
.jx-凶 { background: rgba(192,101,63,.16); color: #E09A5A; }
.marry-score.jx-great, .marry-score.jx-good { color: var(--gold); }
.marry-score.jx-mid { color: var(--ochre); }
.marry-grade.jx-great, .marry-grade.jx-good { color: var(--gold); }
.marry-grade.jx-mid { color: var(--ochre); }
.marry-fill.jx-great, .marry-fill.jx-good { background: linear-gradient(90deg, var(--jade), var(--gold)); }
.marry-fill.jx-mid { background: linear-gradient(90deg, var(--ochre), var(--gold)); }
.marry-fill.jx-bad, .marry-fill.jx-worse { background: linear-gradient(90deg, #C0653F, #E09A5A); }
/* ---- 阴盘大六壬 · 四盘同观（地盘/天盘/神盘/支盘） ---- */
.si-note { font-size: 12px; color: #9C937B; margin-bottom: 10px; letter-spacing: 1px; }
.si-pan {
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  background: #0D0D13;
}
.si-row {
  display: grid;
  grid-template-columns: 52px repeat(12, 1fr);
  border-bottom: 1px solid rgba(58,51,42,.6);
}
.si-row:last-child { border-bottom: none; }
.si-lb {
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; letter-spacing: 2px;
  color: var(--gold);
  background: rgba(212,175,55,.08);
  border-right: 1px solid var(--line);
  font-weight: 600;
}
.si-c {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 7px 2px;
  font-size: 13px;
  color: var(--ink);
  font-family: 'Noto Serif SC', serif;
  border-right: 1px solid rgba(58,51,42,.35);
}
.si-c:last-child { border-right: none; }
.si-di { color: #8E7A2F; font-weight: 700; }
.si-shen { font-size: 11px; color: #E5C35A; }
.si-ke { font-size: 12px; line-height: 1.25; color: #D8C893; }
.si-ke i { display: block; font-style: normal; color: #6E6756; font-size: 10px; }
.si-ke b { font-weight: 500; color: #3E7C96; font-size: 10px; font-family: inherit; }

/* ---------- 神祇符文暗纹背景（六丁六甲 · 二十八星宿 · 张天师 护身镇坛） ---------- */
body::before {
  content: "六丁六甲护身 张天师镇坛 二十八星宿 角亢氐房心尾箕 斗牛女虚危室壁 奎娄胃昴毕觜参 井鬼柳星张翼轸 丁卯丁巳丁未丁酉丁亥丁丑 甲子甲戌甲申甲午甲辰甲寅 张道陵天师镇坛 北斗七星照命 四值功曹 青龙白虎 朱雀玄武 太乙救苦天尊 天蓬天猷 翊圣佑圣 五方揭谛 护法诸神 六丁六甲 二十八宿 护身镇坛 万邪不侵 六丁六甲护身 张天师镇坛 二十八星宿 角亢氐房心尾箕 斗牛女虚危室壁 奎娄胃昴毕觜参 井鬼柳星张翼轸 丁卯丁巳丁未丁酉丁亥丁丑 甲子甲戌甲申甲午甲辰甲寅 张道陵天师镇坛 北斗七星照命 四值功曹 青龙白虎 朱雀玄武 太乙救苦天尊 天蓬天猷 翊圣佑圣 五方揭谛 护法诸神 六丁六甲 二十八宿 护身镇坛 万邪不侵";
  position: fixed;
  inset: 0;
  z-index: 0;
  color: rgba(212, 175, 55, 0.05);
  font-family: 'Noto Serif SC', 'Songti SC', 'SimSun', serif;
  font-size: 13px;
  letter-spacing: 7px;
  line-height: 3.1;
  padding: 88px 18px 40px;
  white-space: pre-wrap;
  word-break: break-all;
  pointer-events: none;
  user-select: none;
  transform: rotate(-4deg) scale(1.08);
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,.9) 0%, rgba(0,0,0,.5) 55%, rgba(0,0,0,.18) 100%);
          mask-image: linear-gradient(180deg, rgba(0,0,0,.9) 0%, rgba(0,0,0,.5) 55%, rgba(0,0,0,.18) 100%);
}
#view { position: relative; z-index: 1; }
.hero-shen {
  margin-top: 14px;
  font-size: 12px;
  letter-spacing: 4px;
  color: rgba(212, 175, 55, 0.55);
  font-family: 'Noto Serif SC', 'Songti SC', serif;
  font-weight: 500;
}
.hero-shen b { color: rgba(229, 195, 90, 0.75); font-weight: 600; }