/* --- 白天模式下特殊覆盖 --- */
body[data-theme="day"] {
  background: #f8f9fc;
}
body[data-theme="day"]::before {
  background:
    radial-gradient(ellipse 60% 40% at 50% 0%, rgba(26,147,111,0.04) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 80%, rgba(184,134,11,0.03) 0%, transparent 40%),
    radial-gradient(circle at 50% 50%, #f0f2f5 0%, #f8f9fc 70%) !important;
}
body[data-theme="day"]::after { opacity: 0 !important; }
body[data-theme="day"] .container::before { background: linear-gradient(to bottom, rgba(248,249,252,0.9), transparent) !important; }
body[data-theme="day"] .container::after { background: linear-gradient(to top, rgba(248,249,252,0.9), transparent) !important; }

body[data-theme="day"] .input-panel,
body[data-theme="day"] .liuqin-panel,
body[data-theme="day"] .strength-panel {
  background: rgba(255,255,255,0.85) !important;
  border-color: rgba(0,0,0,0.06) !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 12px rgba(0,0,0,0.03) !important;
}
body[data-theme="day"] .today-glance,
body[data-theme="day"] .daily-fortune-card,
body[data-theme="day"] .decision-card {
  background: rgba(255,255,255,0.7) !important;
  border-color: rgba(0,0,0,0.05) !important;
}
body[data-theme="day"] .feature-entry {
  background: rgba(255,255,255,0.8) !important;
  border-color: rgba(0,0,0,0.04) !important;
}
body[data-theme="day"] .feature-entry:hover {
  background: #ffffff !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.06) !important;
}
body[data-theme="day"] .start-paipan-entry {
  background: rgba(255,255,255,0.5) !important;
  border-color: rgba(0,0,0,0.04) !important;
}
body[data-theme="day"] .nav-item {
  border-color: rgba(0,0,0,0.08) !important;
  color: var(--ink-light) !important;
}
body[data-theme="day"] .nav-item:hover {
  border-color: var(--gold) !important;
  color: var(--gold) !important;
}
body[data-theme="day"] .tg-item {
  background: rgba(0,0,0,0.02) !important;
  border-color: rgba(0,0,0,0.04) !important;
}
body[data-theme="day"] .fate-id-card {
  background: linear-gradient(160deg, #ffffff, #f5f6f8) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body[data-theme="day"] .qm-cell {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body[data-theme="day"] .accordion-head:hover { background: rgba(0,0,0,0.02) !important; }
body[data-theme="day"] .compliance-banner { background: #f8f9fc !important; border-color: rgba(0,0,0,0.06) !important; }

/* --- 跟随系统偏好自动切换 --- */
@media (prefers-color-scheme: light) {
  body:not([data-theme]) {
    --paper: #f8f9fc; --paper-dark: #ffffff; --paper-darker: #f0f2f5;
    --ink: #1a1d26; --ink-light: #3d4352; --ink-faint: #8590a0;
    --vermilion: #d4473c; --vermilion-light: #6a120e; --vermilion-dim: rgba(212,71,60,0.08);
    --gold: #b8860b; --gold-light: #473304; --gold-dim: rgba(184,134,11,0.08);
    --jade: #1a936f; --jade-light: #2ab090; --jade-dim: rgba(26,147,111,0.08);
    --line: rgba(0,0,0,0.08); --line-soft: rgba(0,0,0,0.04);
    --mu-color: #2d8a4e; --huo-color: #d4473c; --tu-color: #b8860b; --jin-color: #5a6578; --shui-color: #2b6cb0;
    --bg-core1: #f0f2f5; --bg-core2: #f8f9fc;
    background: #f8f9fc;
  }
}

/* 白天模式主题点 */
.theme-dot.t-day { background: linear-gradient(135deg, #f8f9fc, #e8eaf0); border: 1px solid rgba(0,0,0,0.15); }

/* ===========================================================
   内容框视觉丰富化 + 输入栏宽度修复
   =========================================================== */

/* --- 1. 输入框年份宽度不够 --- */
.input-group input[type="number"] { width: 100px !important; min-width: 100px !important; }
.input-group select { width: 100px !important; min-width: 90px !important; }
#year { width: 120px !important; min-width: 120px !important; }

/* --- 2. 卡片不再是纯色方块，加入微妙的渐变和纹理 --- */
.today-glance {
  background: linear-gradient(135deg, rgba(18,28,42,0.5), rgba(22,36,52,0.4)) !important;
  border-left: 3px solid var(--jade) !important;
  border-top: none !important;
}
.daily-fortune-card {
  background: linear-gradient(135deg, rgba(20,30,44,0.5), rgba(28,38,52,0.35)) !important;
  border-left: 3px solid var(--gold) !important;
  border-top: none !important;
}
.decision-card {
  background: linear-gradient(135deg, rgba(22,28,40,0.45), rgba(30,36,50,0.35)) !important;
  border-left: 3px solid var(--vermilion) !important;
  border-top: none !important;
}

/* --- 3. 卡片内部加装饰图案（右上角淡色符号） --- */
.today-glance::before {
  content: '☰'; position: absolute; top: 10px; right: 14px;
  font-size: 1.8rem; color: var(--jade); opacity: 0.06;
  pointer-events: none;
}
.daily-fortune-card::before {
  content: '☯'; position: absolute; top: 12px; right: 14px;
  font-size: 2rem; color: var(--gold); opacity: 0.06;
  pointer-events: none;
}
.decision-card::before {
  content: '⚖'; position: absolute; top: 10px; right: 14px;
  font-size: 1.6rem; color: var(--vermilion); opacity: 0.06;
  pointer-events: none;
}
.today-glance, .daily-fortune-card, .decision-card {
  position: relative !important; overflow: hidden !important;
}

/* --- 4. 速看四格加底部色条 --- */
.tg-item {
  position: relative; overflow: hidden;
  border-bottom: 2px solid transparent !important;
}
.tg-item:nth-child(1) { border-bottom-color: var(--jade) !important; }
.tg-item:nth-child(2) { border-bottom-color: var(--vermilion) !important; }
.tg-item:nth-child(3) { border-bottom-color: var(--gold) !important; }
.tg-item:nth-child(4) { border-bottom-color: #c77dff !important; }

/* --- 5. 功能入口卡片加底部渐变条 --- */
.feature-entry { position: relative; overflow: hidden; }
.feature-entry::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  opacity: 0; transition: opacity 0.2s;
}
.feature-entry:hover::after { opacity: 0.5; }
.feature-entry:nth-child(1)::after { background: linear-gradient(90deg, transparent, #c77dff, transparent); }
.feature-entry:nth-child(2)::after { background: linear-gradient(90deg, transparent, #7ad7f0, transparent); }
.feature-entry:nth-child(3)::after { background: linear-gradient(90deg, transparent, #ffd56b, transparent); }
.feature-entry:nth-child(4)::after { background: linear-gradient(90deg, transparent, #ff8fb0, transparent); }

/* --- 6. 区域之间的分隔不用线，用留白+微妙的色差 --- */
.today-glance::after, #dailyFortuneSlot::after { display: none !important; }

/* --- 7. 白天模式下也丰富 --- */
body[data-theme="day"] .today-glance {
  background: linear-gradient(135deg, rgba(26,147,111,0.03), rgba(255,255,255,0.8)) !important;
  border-left-color: var(--jade) !important;
}
body[data-theme="day"] .daily-fortune-card {
  background: linear-gradient(135deg, rgba(184,134,11,0.03), rgba(255,255,255,0.8)) !important;
  border-left-color: var(--gold) !important;
}
body[data-theme="day"] .decision-card {
  background: linear-gradient(135deg, rgba(212,71,60,0.03), rgba(255,255,255,0.8)) !important;
  border-left-color: var(--vermilion) !important;
}
body[data-theme="day"] .tg-item { background: rgba(0,0,0,0.015) !important; }

/* ===========================================================
   视觉冲击力大改：大胆的色彩/尺寸/布局变化
   =========================================================== */

/* --- 1. 标题区域：巨大化 + 渐变色文字 --- */
header { padding: 48px 0 20px !important; }
header h1 {
  font-size: 3.2rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.5em !important;
  background: linear-gradient(135deg, var(--gold-light), var(--vermilion-light), var(--jade-light)) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  line-height: 1.2 !important;
  margin-bottom: 8px !important;
}
header .subtitle {
  font-size: 0.9rem !important;
  color: var(--ink-light) !important;
}

/* --- 2. 今日速看：大卡片+图标放大 --- */
.today-glance {
  padding: 24px 20px !important;
  border-radius: 16px !important;
  border-left: 4px solid var(--jade) !important;
}
.tg-grid { gap: 12px !important; }
.tg-item {
  padding: 14px 8px !important;
  border-radius: 10px !important;
  background: rgba(14,22,34,0.6) !important;
}
.tg-value { font-size: 1.1rem !important; font-weight: 600 !important; }
.tg-label { font-size: 0.7rem !important; margin-bottom: 6px !important; }

/* --- 3. 命运签：大号诗文 + 背景装饰 --- */
.daily-fortune-card {
  padding: 32px 24px !important;
  border-radius: 16px !important;
  border-left: 4px solid var(--gold) !important;
}
.dfc-poem {
  font-size: 1.1rem !important;
  line-height: 2.2 !important;
  padding: 20px 0 !important;
  color: var(--ink) !important;
}
.dfc-advice {
  font-size: 0.9rem !important;
  padding: 10px 16px !important;
}
.dfc-level { font-size: 1rem !important; }

/* --- 4. 决策助手：判定结果巨大化 --- */
.decision-card {
  padding: 28px 20px !important;
  border-radius: 16px !important;
  border-left: 4px solid var(--vermilion) !important;
}
.dc-verdict { font-size: 2rem !important; margin: 8px 0 !important; }
.dc-question { font-size: 0.88rem !important; }
.dc-reason { font-size: 0.88rem !important; margin-top: 8px !important; }

/* --- 5. 揭盘按钮：大而醒目 --- */
.start-paipan-btn {
  padding: 18px 48px !important;
  font-size: 1.05rem !important;
  letter-spacing: 0.3em !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, var(--vermilion), #b83a24, var(--vermilion-light)) !important;
  background-size: 200% auto !important;
  box-shadow: 0 4px 16px rgba(199,91,84,0.35) !important;
}
.start-paipan-btn:hover {
  box-shadow: 0 8px 28px rgba(199,91,84,0.45) !important;
  transform: translateY(-2px) !important;
}

/* --- 6. 功能入口：更大的卡片 + icon巨大 --- */
.feature-grid { gap: 16px !important; margin: 28px 0 !important; }
.feature-entry {
  padding: 28px 16px !important;
  border-radius: 14px !important;
}
.feature-entry .fe-icon { font-size: 2.2rem !important; margin-bottom: 10px !important; opacity: 1 !important; }
.feature-entry .fe-name { font-size: 0.95rem !important; font-weight: 600 !important; }
.feature-entry .fe-desc { font-size: 0.72rem !important; margin-top: 6px !important; }

/* --- 7. 背景：更强烈的渐变光效 --- */
body::before {
  background:
    radial-gradient(ellipse 80% 50% at 50% -10%, rgba(95,180,196,0.15) 0%, transparent 50%),
    radial-gradient(ellipse 50% 40% at 5% 30%, rgba(199,125,255,0.08) 0%, transparent 40%),
    radial-gradient(ellipse 50% 40% at 95% 70%, rgba(255,143,176,0.06) 0%, transparent 40%),
    radial-gradient(ellipse at 50% 100%, rgba(199,169,107,0.08) 0%, transparent 40%),
    radial-gradient(circle at 50% 50%, var(--bg-core1) 0%, var(--bg-core2) 70%) !important;
}

/* --- 8. 星空粒子更亮 --- */
body::after {
  opacity: 0.5 !important;
}

/* --- 9. 导航条更粗壮 --- */
.nav-item {
  padding: 10px 22px !important;
  font-size: 0.88rem !important;
  font-weight: 500 !important;
  border-radius: 8px !important;
}
.nav-item.active {
  box-shadow: 0 4px 14px rgba(199,91,84,0.35) !important;
}

/* --- 10. 卡片装饰符号更大 --- */
.today-glance::before { font-size: 3rem !important; opacity: 0.04 !important; top: 8px !important; }
.daily-fortune-card::before { font-size: 3.5rem !important; opacity: 0.04 !important; }
.decision-card::before { font-size: 2.8rem !important; opacity: 0.05 !important; }

/* --- 11. 整体容器加宽 --- */
.container { max-width: 720px !important; }

/* --- 12. 白天模式也要冲击力 --- */
body[data-theme="day"] header h1 {
  background: linear-gradient(135deg, #b8860b, #d4473c, #1a936f) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
body[data-theme="day"] .start-paipan-btn {
  box-shadow: 0 4px 16px rgba(212,71,60,0.25) !important;
}
body[data-theme="day"]::before {
  background:
    radial-gradient(ellipse 60% 40% at 50% 0%, rgba(26,147,111,0.06) 0%, transparent 50%),
    radial-gradient(ellipse at 10% 50%, rgba(184,134,11,0.04) 0%, transparent 40%),
    radial-gradient(ellipse at 90% 50%, rgba(43,108,176,0.04) 0%, transparent 40%),
    radial-gradient(circle at 50% 50%, #f0f2f5 0%, #f8f9fc 70%) !important;
}

/* ===========================================================
   超大冲击力：全屏英雄区 + 巨型排版 + 沉浸感
   =========================================================== */

/* --- 全页重置：去掉容器限制，内容撑满 --- */
.container { max-width: 100% !important; padding: 0 !important; }

/* --- 标题区：全屏高度居中，像APP启动页 --- */
header {
  min-height: 35vh !important;
  display: flex !important; flex-direction: column !important;
  align-items: center !important; justify-content: center !important;
  padding: 40px 20px !important;
  position: relative !important;
}
header h1 {
  font-size: clamp(2.8rem, 8vw, 4.5rem) !important;
  font-weight: 900 !important;
  letter-spacing: 0.4em !important;
  background: linear-gradient(135deg, #e6cf97 0%, #e07a6e 40%, #84cfdc 70%, #c77dff 100%) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  text-align: center !important;
}
header .subtitle {
  font-size: clamp(0.9rem, 2.5vw, 1.1rem) !important;
  margin-top: 12px !important;
  color: var(--ink-light) !important;
  letter-spacing: 0.2em !important;
}
header .header-ornament {
  width: 60px !important; height: 2px !important;
  background: linear-gradient(90deg, var(--vermilion), var(--gold), var(--jade)) !important;
  margin-bottom: 20px !important;
  opacity: 0.8 !important;
}

/* --- 内容区有边距 --- */
.intro-hook, .today-glance, #dailyFortuneSlot, .decision-card,
.start-paipan-entry, .feature-grid, #inputPanel, .result,
#caseLibrary, #huangliPanel, .skeleton-loading {
  margin-left: 20px !important; margin-right: 20px !important;
}
@media (min-width: 768px) {
  .intro-hook, .today-glance, #dailyFortuneSlot, .decision-card,
  .start-paipan-entry, .feature-grid, #inputPanel, .result,
  #caseLibrary, #huangliPanel, .skeleton-loading {
    margin-left: auto !important; margin-right: auto !important;
    max-width: 640px !important;
  }
}

/* --- 今日速看：全宽色块 --- */
.today-glance {
  padding: 28px 24px !important;
  border-radius: 20px !important;
  background: linear-gradient(160deg, rgba(95,180,196,0.12), rgba(22,32,46,0.6)) !important;
  border: none !important; border-left: none !important;
  box-shadow: 0 8px 32px rgba(95,180,196,0.08) !important;
}
.tg-grid { gap: 14px !important; }
.tg-item {
  padding: 18px 10px !important;
  border-radius: 12px !important;
  background: rgba(14,22,34,0.7) !important;
  border: 1px solid rgba(95,180,196,0.1) !important;
  border-bottom: 3px solid transparent !important;
}
.tg-value { font-size: 1.3rem !important; font-weight: 700 !important; }
.tg-label { font-size: 0.74rem !important; }

/* --- 命运签：全幅大卡，诗文是主角 --- */
.daily-fortune-card {
  padding: 40px 28px !important;
  border-radius: 20px !important;
  background: linear-gradient(160deg, rgba(199,169,107,0.1), rgba(22,32,46,0.6)) !important;
  border: none !important; border-left: none !important;
  box-shadow: 0 8px 32px rgba(199,169,107,0.06) !important;
  text-align: center !important;
}
.dfc-poem {
  font-size: clamp(1.1rem, 3vw, 1.4rem) !important;
  line-height: 2.4 !important;
  font-family: var(--font-serif) !important;
  padding: 24px 0 !important;
  border: none !important;
}
.dfc-level { font-size: 1.2rem !important; font-weight: 700 !important; }
.dfc-advice {
  font-size: 1rem !important;
  background: rgba(199,169,107,0.1) !important;
  padding: 12px 20px !important;
  border-radius: 8px !important;
  display: inline-block !important;
}

/* --- 决策助手：判定巨大 --- */
.decision-card {
  padding: 36px 24px !important;
  border-radius: 20px !important;
  background: linear-gradient(160deg, rgba(199,91,84,0.08), rgba(22,32,46,0.6)) !important;
  border: none !important; border-left: none !important;
  box-shadow: 0 8px 32px rgba(199,91,84,0.06) !important;
}
.dc-verdict { font-size: 2.8rem !important; font-weight: 900 !important; margin: 12px 0 !important; }
.dc-question { font-size: 1rem !important; letter-spacing: 0.1em !important; }
.dc-reason { font-size: 0.92rem !important; line-height: 1.8 !important; }

/* --- 揭盘按钮：全宽大按钮 --- */
.start-paipan-entry {
  padding: 40px 24px !important;
  border-radius: 20px !important;
  background: linear-gradient(160deg, rgba(199,91,84,0.06), rgba(22,32,46,0.4)) !important;
  border: 1px solid rgba(199,91,84,0.1) !important;
}
.start-paipan-btn {
  width: 100% !important; max-width: 320px !important;
  padding: 20px 40px !important;
  font-size: 1.15rem !important;
  letter-spacing: 0.4em !important;
  border-radius: 14px !important;
  box-shadow: 0 6px 24px rgba(199,91,84,0.3), 0 0 60px rgba(199,91,84,0.1) !important;
}
.start-paipan-btn:hover {
  box-shadow: 0 10px 36px rgba(199,91,84,0.4), 0 0 80px rgba(199,91,84,0.15) !important;
  transform: translateY(-3px) scale(1.02) !important;
}

/* --- 功能入口：大卡片横排 --- */
.feature-grid {
  gap: 16px !important; margin: 32px 20px !important;
  padding: 16px !important; border-radius: 20px !important;
  background: rgba(10,16,26,0.4) !important;
}
.feature-entry {
  padding: 32px 16px !important;
  border-radius: 16px !important;
  background: rgba(22,32,46,0.7) !important;
  border: 1px solid rgba(180,200,220,0.05) !important;
  transition: all 0.2s !important;
}
.feature-entry:hover {
  transform: translateY(-4px) scale(1.02) !important;
  box-shadow: 0 12px 32px rgba(0,0,0,0.2) !important;
  border-color: rgba(199,169,107,0.15) !important;
}
.feature-entry .fe-icon { font-size: 2.8rem !important; margin-bottom: 12px !important; }
.feature-entry .fe-name { font-size: 1.05rem !important; font-weight: 700 !important; }
.feature-entry .fe-desc { font-size: 0.76rem !important; }

/* --- 背景：强烈的多色光团 --- */
body {
  background: #080c14 !important;
}
body::before {
  background:
    radial-gradient(ellipse 70% 50% at 50% -15%, rgba(95,180,196,0.2) 0%, transparent 55%),
    radial-gradient(ellipse 50% 50% at 0% 40%, rgba(199,125,255,0.12) 0%, transparent 45%),
    radial-gradient(ellipse 50% 50% at 100% 60%, rgba(255,143,176,0.1) 0%, transparent 45%),
    radial-gradient(ellipse 60% 40% at 50% 100%, rgba(199,169,107,0.1) 0%, transparent 45%),
    radial-gradient(circle at 50% 50%, #0c1220 0%, #080c14 70%) !important;
  opacity: 1 !important;
}
body::after {
  opacity: 0.6 !important;
  background-image:
    radial-gradient(1.5px 1.5px at 15% 25%, rgba(255,255,255,0.6) 0%, transparent 100%),
    radial-gradient(1px 1px at 45% 65%, rgba(230,207,151,0.5) 0%, transparent 100%),
    radial-gradient(2px 2px at 75% 15%, rgba(132,207,220,0.5) 0%, transparent 100%),
    radial-gradient(1px 1px at 25% 85%, rgba(199,125,255,0.4) 0%, transparent 100%),
    radial-gradient(1.5px 1.5px at 85% 75%, rgba(255,255,255,0.4) 0%, transparent 100%),
    radial-gradient(1px 1px at 55% 35%, rgba(255,143,176,0.3) 0%, transparent 100%),
    radial-gradient(1px 1px at 35% 45%, rgba(255,255,255,0.35) 0%, transparent 100%) !important;
  background-size: 100% 100% !important;
  animation: none !important;
}

/* --- 导航条 --- */
.top-nav {
  padding: 14px 20px !important;
  justify-content: center !important;
}
.nav-item {
  padding: 12px 24px !important;
  font-size: 0.9rem !important;
  border-radius: 10px !important;
}

/* --- 顶部/底部渐变遮罩加强 --- */
.container::before { height: 120px !important; background: linear-gradient(to bottom, rgba(8,12,20,0.95), transparent) !important; }
.container::after { height: 80px !important; background: linear-gradient(to top, rgba(8,12,20,0.95), transparent) !important; }

/* --- 白天模式 --- */
body[data-theme="day"] { background: #f5f7fa !important; }
body[data-theme="day"]::before {
  background:
    radial-gradient(ellipse 60% 40% at 50% 0%, rgba(26,147,111,0.08) 0%, transparent 50%),
    radial-gradient(ellipse at 0% 50%, rgba(184,134,11,0.05) 0%, transparent 40%),
    radial-gradient(ellipse at 100% 50%, rgba(43,108,176,0.05) 0%, transparent 40%),
    radial-gradient(circle at 50% 50%, #eef1f5 0%, #f5f7fa 70%) !important;
}
body[data-theme="day"]::after { opacity: 0 !important; }
body[data-theme="day"] .container::before { background: linear-gradient(to bottom, rgba(245,247,250,0.95), transparent) !important; }
body[data-theme="day"] .container::after { background: linear-gradient(to top, rgba(245,247,250,0.95), transparent) !important; }
body[data-theme="day"] .today-glance { background: linear-gradient(160deg, rgba(26,147,111,0.06), rgba(255,255,255,0.9)) !important; box-shadow: 0 4px 16px rgba(0,0,0,0.04) !important; }
body[data-theme="day"] .daily-fortune-card { background: linear-gradient(160deg, rgba(184,134,11,0.05), rgba(255,255,255,0.9)) !important; }
body[data-theme="day"] .decision-card { background: linear-gradient(160deg, rgba(212,71,60,0.04), rgba(255,255,255,0.9)) !important; }
body[data-theme="day"] .feature-entry { background: rgba(255,255,255,0.9) !important; }
body[data-theme="day"] .start-paipan-entry { background: rgba(255,255,255,0.6) !important; }

/* ===========================================================
   终极视觉重设计
   灵感来源:
   - shadcn/ui (github.com/shadcn-ui) — 语义token + 精致组件
   - Linear (linear.app) — 深空背景 + 紫色accent + 极简界面
   - Vercel — 超薄字重 + 几何留白
   - Raycast — 毛玻璃分层 + 精致阴影
   =========================================================== */

/* --- 色彩系统重置：Linear风 --- */
:root {
  --bg: #09090b;
  --bg-surface: rgba(255,255,255,0.03);
  --bg-elevated: rgba(255,255,255,0.05);
  --bg-hover: rgba(255,255,255,0.07);
  --border: rgba(255,255,255,0.06);
  --border-hover: rgba(255,255,255,0.12);
  --text-primary: #fafafa;
  --text-secondary: #a1a1aa;
  --text-muted: #71717a;
  --accent: #8b5cf6;
  --accent-soft: rgba(139,92,246,0.12);
  --success: #22c55e;
  --warning: #f59e0b;
  --danger: #ef4444;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
}

/* --- 页面基底 --- */
body {
  background: var(--bg) !important;
  color: var(--text-primary) !important;
}
body::before {
  background:
    radial-gradient(ellipse 80% 60% at 50% -20%, rgba(139,92,246,0.08) 0%, transparent 60%),
    radial-gradient(ellipse 60% 40% at 0% 50%, rgba(59,130,246,0.04) 0%, transparent 40%),
    radial-gradient(ellipse 60% 40% at 100% 50%, rgba(236,72,153,0.03) 0%, transparent 40%),
    linear-gradient(to bottom, #09090b, #0c0c10) !important;
}
body::after { opacity: 0.3 !important; }

/* --- 容器 --- */
.container {
  max-width: 680px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
}
.container::before, .container::after { display: none !important; }

/* --- 标题区 --- */
header {
  min-height: auto !important;
  padding: 56px 0 24px !important;
  text-align: center !important;
  display: block !important;
}
header .header-ornament {
  width: 32px !important; height: 2px !important;
  background: var(--accent) !important;
  margin: 0 auto 16px !important;
  border-radius: 1px !important;
  opacity: 1 !important;
}
header .header-ornament::before, header .header-ornament::after { display: none !important; }
header h1 {
  font-size: clamp(2rem, 6vw, 3rem) !important;
  font-weight: 700 !important;
  letter-spacing: 0.3em !important;
  color: var(--text-primary) !important;
  background: none !important;
  -webkit-text-fill-color: var(--text-primary) !important;
  line-height: 1.3 !important;
}
header .subtitle {
  font-size: 0.9rem !important;
  color: var(--text-muted) !important;
  font-weight: 400 !important;
  letter-spacing: 0.1em !important;
  margin-top: 8px !important;
}

/* --- 导航条 --- */
.top-nav {
  padding: 8px 0 16px !important;
  gap: 6px !important;
  justify-content: center !important;
  border-bottom: 1px solid var(--border) !important;
  margin-bottom: 24px !important;
}
.nav-item {
  padding: 8px 16px !important;
  font-size: 0.82rem !important;
  font-weight: 400 !important;
  color: var(--text-muted) !important;
  border: 1px solid transparent !important;
  border-radius: var(--radius-sm) !important;
  background: transparent !important;
  transition: color 0.15s, background 0.15s !important;
  box-shadow: none !important;
}
.nav-item:hover {
  color: var(--text-primary) !important;
  background: var(--bg-hover) !important;
  border-color: transparent !important;
  text-shadow: none !important;
}
.nav-item.active {
  color: var(--text-primary) !important;
  background: var(--bg-elevated) !important;
  border-color: var(--border) !important;
  box-shadow: none !important;
}
.nav-item::after { display: none !important; }
.nav-item[data-view="ziwei"].active,
.nav-item[data-view="zodiac"].active,
.nav-item[data-view="match"].active,
.nav-item[data-view="saved"].active {
  background: var(--bg-elevated) !important;
  border-color: var(--border) !important;
}

/* --- 卡片统一样式（shadcn Card风格）--- */
.today-glance, .daily-fortune-card, .decision-card,
.start-paipan-entry, .feature-entry,
.input-panel, .liuqin-panel, .strength-panel,
.summary-card, .title-card, .fate-id-card, .celeb-match,
.fate-dna-wrap, .life-timeline-wrap, .fate-sim-wrap {
  background: var(--bg-surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: none !important;
  border-left-width: 1px !important;
  border-top-width: 1px !important;
}

/* --- 今日速看 --- */
.today-glance { padding: 20px !important; margin-bottom: 16px !important; }
.tg-title { color: var(--text-muted) !important; font-size: 0.68rem !important; letter-spacing: 0.3em !important; }
.tg-item {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-md) !important;
  border-bottom: 2px solid var(--accent-soft) !important;
  padding: 14px 8px !important;
}
.tg-value { font-size: 1.1rem !important; font-weight: 600 !important; color: var(--text-primary) !important; }
.tg-label { color: var(--text-muted) !important; }
.tg-item:nth-child(1) .tg-value { color: var(--success) !important; }
.tg-item:nth-child(2) .tg-value { color: var(--warning) !important; }
.tg-item:nth-child(3) .tg-value { color: #f59e0b !important; }
.tg-item:nth-child(4) .tg-value { color: var(--accent) !important; }
.tg-item:nth-child(1) { border-bottom-color: rgba(34,197,94,0.2) !important; }
.tg-item:nth-child(2) { border-bottom-color: rgba(245,158,11,0.2) !important; }
.tg-item:nth-child(3) { border-bottom-color: rgba(245,158,11,0.2) !important; }
.tg-item:nth-child(4) { border-bottom-color: rgba(139,92,246,0.2) !important; }
.today-glance::before { display: none !important; }

/* --- 命运签 --- */
.daily-fortune-card { padding: 28px 24px !important; margin-bottom: 16px !important; }
.daily-fortune-card::before { display: none !important; }
.dfc-poem {
  font-size: 1.05rem !important;
  line-height: 2.2 !important;
  color: var(--text-primary) !important;
  border-top: 1px solid var(--border) !important;
  border-bottom: 1px solid var(--border) !important;
  padding: 16px 0 !important;
}
.dfc-advice {
  color: var(--accent) !important;
  background: var(--accent-soft) !important;
  padding: 8px 14px !important;
  border-radius: var(--radius-sm) !important;
  font-size: 0.84rem !important;
}
.dfc-header, .dfc-footer { color: var(--text-muted) !important; }
.dfc-personal { color: var(--success) !important; }
.dfc-level { color: var(--warning) !important; }

/* --- 决策助手 --- */
.decision-card { padding: 24px 20px !important; margin-bottom: 16px !important; }
.decision-card::before { display: none !important; }
.dc-question { color: var(--text-secondary) !important; font-size: 0.86rem !important; }
.dc-verdict { font-size: 2.2rem !important; font-weight: 800 !important; margin: 10px 0 !important; }
.dc-reason { color: var(--text-secondary) !important; }
.dc-day { color: var(--text-muted) !important; }

/* --- 揭盘入口 --- */
.start-paipan-entry { padding: 32px 20px !important; margin: 20px 0 !important; text-align: center !important; }
.start-paipan-btn {
  padding: 14px 36px !important;
  font-size: 0.95rem !important;
  letter-spacing: 0.2em !important;
  border-radius: var(--radius-md) !important;
  background: var(--accent) !important;
  color: #fff !important;
  box-shadow: 0 0 20px rgba(139,92,246,0.3) !important;
  border: none !important;
  width: auto !important; max-width: none !important;
}
.start-paipan-btn:hover {
  box-shadow: 0 0 30px rgba(139,92,246,0.45) !important;
  transform: translateY(-1px) !important;
  background: #7c3aed !important;
}

/* --- 功能入口 --- */
.feature-grid {
  gap: 12px !important; margin: 16px 0 !important;
  padding: 0 !important; background: none !important; border: none !important;
  border-radius: 0 !important;
}
.feature-entry {
  padding: 24px 14px !important;
  transition: background 0.15s, border-color 0.15s, transform 0.15s !important;
}
.feature-entry:hover {
  background: var(--bg-hover) !important;
  border-color: var(--border-hover) !important;
  transform: translateY(-2px) !important;
  box-shadow: none !important;
}
.feature-entry::after { display: none !important; }
.feature-entry .fe-icon { font-size: 2rem !important; opacity: 1 !important; margin-bottom: 10px !important; }
.feature-entry .fe-name { font-size: 0.88rem !important; font-weight: 500 !important; color: var(--text-primary) !important; }
.feature-entry .fe-desc { color: var(--text-muted) !important; font-size: 0.72rem !important; }
.feature-entry:nth-child(1) { border-top: none !important; }
.feature-entry:nth-child(2) { border-top: none !important; }
.feature-entry:nth-child(3) { border-top: none !important; }
.feature-entry:nth-child(4) { border-top: none !important; }

/* --- 输入面板 --- */
#inputPanel.visible {
  padding: 24px !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.3) !important;
}
.panel-title { color: var(--text-muted) !important; font-size: 0.7rem !important; letter-spacing: 0.3em !important; }
.input-group label { color: var(--text-muted) !important; }
.input-group input, .input-group select {
  background: var(--bg) !important;
  border: 1px solid var(--border) !important;
  color: var(--text-primary) !important;
  border-radius: var(--radius-sm) !important;
}
.input-group input:focus, .input-group select:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 2px var(--accent-soft) !important;
}
.btn-calculate {
  background: var(--accent) !important;
  border-radius: var(--radius-sm) !important;
  box-shadow: 0 0 12px rgba(139,92,246,0.2) !important;
  color: #fff !important;
  animation: none !important;
}
.btn-calculate:hover { background: #7c3aed !important; }
.today-btn {
  border: 1px solid var(--border) !important;
  background: var(--bg-surface) !important;
  color: var(--text-secondary) !important;
  border-radius: var(--radius-sm) !important;
}

/* --- 引导文案 --- */
.intro-hook { padding: 0 0 12px !important; }
.hook-copy { color: var(--text-muted) !important; font-size: 0.84rem !important; }

/* --- 合规提示 --- */
.compliance-banner {
  background: var(--bg) !important;
  border-top: 1px solid var(--border) !important;
  color: var(--text-muted) !important;
}

/* --- 主题切换 --- */
.theme-switch { opacity: 0.5 !important; }
.theme-dot { border-radius: 50% !important; }

/* --- 结果区 --- */
.result-header { color: var(--text-secondary) !important; }
.section-title {
  color: var(--text-muted) !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.4em !important;
}
.section-title::before, .section-title::after {
  background: var(--border) !important;
}
.analysis-card h4, .strength-panel h4, .liuqin-panel h4 {
  color: var(--text-primary) !important;
  border-bottom-color: var(--border) !important;
}
.analysis-card h4::before, .strength-panel h4::before, .liuqin-panel h4::before {
  background: var(--accent) !important;
}
.st-row { border-bottom-color: var(--border) !important; }
.st-k { color: var(--text-muted) !important; }
.st-v { color: var(--text-secondary) !important; }
.rel-intro { color: var(--text-muted) !important; }
.st-concl { color: var(--text-muted) !important; border-top-color: var(--border) !important; }

/* --- 手风琴 --- */
.accordion-head { border-bottom-color: var(--border) !important; }
.accordion-title { color: var(--text-secondary) !important; }
.accordion-section.open .accordion-title { color: var(--accent) !important; }
.accordion-arrow { color: var(--text-muted) !important; }
.group-divider { color: var(--text-muted) !important; border-top-color: var(--border) !important; background: none !important; }

/* --- 名人匹配 --- */
.cm-name { color: var(--text-primary) !important; }
.cm-subtitle { color: var(--accent) !important; }
.cm-trait { color: var(--text-secondary) !important; }

/* --- 快捷输入 --- */
.quick-input {
  background: var(--bg) !important;
  border: 1px solid var(--border) !important;
  color: var(--text-primary) !important;
  border-radius: var(--radius-sm) !important;
}
.quick-input:focus { border-color: var(--accent) !important; box-shadow: 0 0 0 2px var(--accent-soft) !important; }
.quick-input::placeholder { color: var(--text-muted) !important; }

/* --- 白天模式覆盖 --- */
body[data-theme="day"] {
  --bg: #fafafa;
  --bg-surface: rgba(0,0,0,0.02);
  --bg-elevated: rgba(0,0,0,0.04);
  --bg-hover: rgba(0,0,0,0.06);
  --border: rgba(0,0,0,0.08);
  --border-hover: rgba(0,0,0,0.15);
  --text-primary: #09090b;
  --text-secondary: #3f3f46;
  --text-muted: #71717a;
  --accent: #7c3aed;
  --accent-soft: rgba(124,58,237,0.08);
}
body[data-theme="day"]::before {
  background: radial-gradient(ellipse 80% 60% at 50% -20%, rgba(124,58,237,0.04) 0%, transparent 60%),
    linear-gradient(to bottom, #fafafa, #f4f4f5) !important;
}
body[data-theme="day"]::after { display: none !important; }

/* ===========================================================
   爆款星座APP视觉风格
   参考：Co-Star (极简黑白) + Astra "Celestial Velvet" (深紫+香槟金)
   配色：深茄紫底 #0f0a1a → 午夜紫 #1a1028 → 星光白文字 → 香槟金强调
   =========================================================== */

:root {
  --bg: #0d0815 !important;
  --bg-surface: rgba(255,255,255,0.025) !important;
  --bg-elevated: rgba(255,255,255,0.045) !important;
  --bg-hover: rgba(255,255,255,0.065) !important;
  --border: rgba(255,255,255,0.055) !important;
  --border-hover: rgba(255,255,255,0.1) !important;
  --text-primary: #f2eff6 !important;
  --text-secondary: #b8b0c8 !important;
  --text-muted: #7a7088 !important;
  --accent: #d4a853 !important;
  --accent-soft: rgba(212,168,83,0.1) !important;
  --accent-glow: rgba(212,168,83,0.25) !important;
  --violet: #8b6cc7 !important;
  --violet-soft: rgba(139,108,199,0.1) !important;
}

body {
  background: #0d0815 !important;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", system-ui, sans-serif !important;
}

/* --- 星空背景：深紫色调 --- */
body::before {
  background:
    radial-gradient(ellipse 90% 60% at 50% -10%, rgba(139,108,199,0.1) 0%, transparent 55%),
    radial-gradient(ellipse 50% 50% at 10% 60%, rgba(212,168,83,0.04) 0%, transparent 40%),
    radial-gradient(ellipse 50% 40% at 90% 30%, rgba(100,80,160,0.05) 0%, transparent 40%),
    radial-gradient(circle at 50% 50%, #110c1e 0%, #0d0815 80%) !important;
}
body::after {
  background-image:
    radial-gradient(1px 1px at 12% 28%, rgba(255,255,255,0.5) 0%, transparent 100%),
    radial-gradient(1px 1px at 38% 62%, rgba(212,168,83,0.4) 0%, transparent 100%),
    radial-gradient(1.5px 1.5px at 72% 18%, rgba(139,108,199,0.5) 0%, transparent 100%),
    radial-gradient(1px 1px at 55% 82%, rgba(255,255,255,0.35) 0%, transparent 100%),
    radial-gradient(1px 1px at 88% 68%, rgba(212,168,83,0.3) 0%, transparent 100%),
    radial-gradient(1px 1px at 22% 48%, rgba(255,255,255,0.3) 0%, transparent 100%) !important;
  opacity: 0.5 !important;
}

/* --- 标题：Co-Star式极简 --- */
header h1 {
  font-weight: 300 !important;
  letter-spacing: 0.6em !important;
  color: var(--text-primary) !important;
  background: none !important;
  -webkit-text-fill-color: var(--text-primary) !important;
  font-size: clamp(1.8rem, 5vw, 2.6rem) !important;
}
header .subtitle {
  font-weight: 300 !important;
  color: var(--text-muted) !important;
  letter-spacing: 0.15em !important;
  font-size: 0.88rem !important;
}
header .header-ornament {
  background: linear-gradient(90deg, transparent, var(--accent), transparent) !important;
  width: 48px !important; opacity: 0.6 !important;
}

/* --- 导航：pill形状，活跃态香槟金 --- */
.nav-item {
  font-weight: 300 !important;
  letter-spacing: 0.05em !important;
  color: var(--text-muted) !important;
  font-size: 0.84rem !important;
}
.nav-item.active {
  color: var(--accent) !important;
  background: var(--accent-soft) !important;
  border-color: rgba(212,168,83,0.15) !important;
}
.nav-item:hover { color: var(--text-primary) !important; }

/* --- 卡片：极薄边框 + 微渐变底 --- */
.today-glance {
  background: linear-gradient(160deg, rgba(139,108,199,0.04), rgba(13,8,21,0.6)) !important;
  border: 1px solid rgba(139,108,199,0.08) !important;
}
.daily-fortune-card {
  background: linear-gradient(160deg, rgba(212,168,83,0.03), rgba(13,8,21,0.6)) !important;
  border: 1px solid rgba(212,168,83,0.08) !important;
}
.decision-card {
  background: linear-gradient(160deg, rgba(200,80,80,0.03), rgba(13,8,21,0.6)) !important;
  border: 1px solid rgba(200,80,80,0.06) !important;
}

/* --- 速看数值：大而轻盈 --- */
.tg-value {
  font-weight: 300 !important;
  font-size: 1.2rem !important;
  color: var(--text-primary) !important;
}
.tg-item:nth-child(1) .tg-value { color: var(--violet) !important; }
.tg-item:nth-child(2) .tg-value { color: #e8826a !important; }
.tg-item:nth-child(3) .tg-value { color: var(--accent) !important; }
.tg-item:nth-child(4) .tg-value { color: #7ad7f0 !important; }
.tg-item {
  background: rgba(17,12,30,0.6) !important;
  border: 1px solid rgba(139,108,199,0.06) !important;
  border-bottom: 1px solid rgba(139,108,199,0.06) !important;
}

/* --- 签文：居中大字+细体 --- */
.dfc-poem {
  font-weight: 300 !important;
  font-size: 1.15rem !important;
  line-height: 2.4 !important;
  color: var(--text-primary) !important;
  letter-spacing: 0.05em !important;
}
.dfc-advice { color: var(--accent) !important; background: var(--accent-soft) !important; }
.dfc-level { color: var(--accent) !important; }
.dfc-personal { color: var(--violet) !important; }

/* --- 决策判定 --- */
.dc-verdict { font-weight: 300 !important; }

/* --- 揭盘按钮：香槟金 --- */
.start-paipan-btn {
  background: linear-gradient(135deg, #d4a853, #c49540) !important;
  color: #0d0815 !important;
  font-weight: 600 !important;
  box-shadow: 0 0 24px rgba(212,168,83,0.2) !important;
}
.start-paipan-btn:hover {
  background: linear-gradient(135deg, #e0b862, #d4a853) !important;
  box-shadow: 0 0 36px rgba(212,168,83,0.3) !important;
}
.start-paipan-entry {
  background: linear-gradient(160deg, rgba(212,168,83,0.03), rgba(13,8,21,0.4)) !important;
  border-color: rgba(212,168,83,0.08) !important;
}

/* --- 功能入口 --- */
.feature-entry {
  background: rgba(17,12,30,0.5) !important;
  border: 1px solid rgba(139,108,199,0.06) !important;
}
.feature-entry:hover {
  border-color: rgba(212,168,83,0.12) !important;
  background: rgba(22,16,38,0.6) !important;
}
.feature-entry .fe-name { color: var(--text-primary) !important; font-weight: 400 !important; }
.feature-entry .fe-desc { color: var(--text-muted) !important; }

/* --- 输入框 --- */
.input-group input, .input-group select {
  background: rgba(13,8,21,0.8) !important;
  border: 1px solid rgba(139,108,199,0.1) !important;
  color: var(--text-primary) !important;
}
.input-group input:focus, .input-group select:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 2px var(--accent-soft) !important;
}
.btn-calculate {
  background: var(--accent) !important;
  color: #0d0815 !important;
  font-weight: 600 !important;
  box-shadow: 0 0 12px rgba(212,168,83,0.15) !important;
}

/* --- 结果区卡片 --- */
.summary-card { border-left-color: var(--accent) !important; }
.title-card { background: linear-gradient(160deg, rgba(139,108,199,0.06), rgba(13,8,21,0.8)) !important; border-color: rgba(139,108,199,0.1) !important; }
.accordion-section.open .accordion-title { color: var(--accent) !important; }
.analysis-card h4::before, .strength-panel h4::before, .liuqin-panel h4::before { background: var(--accent) !important; }
.section-title { color: var(--text-muted) !important; }
.section-title::before, .section-title::after { background: rgba(139,108,199,0.2) !important; }

/* --- 合规/主题 --- */
.compliance-banner { background: #0d0815 !important; border-top-color: rgba(139,108,199,0.06) !important; color: var(--text-muted) !important; }

/* --- 白天模式保持之前设定 --- */
body[data-theme="day"] { --bg: #fafafa !important; --accent: #9a6b20 !important; }

/* --- 内容区加宽 --- */
.container { max-width: 860px !important; padding: 0 32px !important; }
@media (min-width: 768px) {
  .intro-hook, .today-glance, #dailyFortuneSlot, .decision-card,
  .start-paipan-entry, .feature-grid, #inputPanel, .result,
  .skeleton-loading { max-width: 780px !important; }
}
@media (min-width: 1024px) {
  .container { max-width: 960px !important; padding: 0 48px !important; }
  .intro-hook, .today-glance, #dailyFortuneSlot, .decision-card,
  .start-paipan-entry, .feature-grid, #inputPanel, .result,
  .skeleton-loading { max-width: 880px !important; }
}
.feature-grid { max-width: 100% !important; }
.tg-grid { grid-template-columns: repeat(4, 1fr) !important; }

/* 导航链接样式与按钮一致 */
a.nav-item { text-decoration: none; display: inline-block; }

/* ===== 板块独立感：每个视图有独立的视觉区域 ===== */
[id^="view"] {
  min-height: 80vh;
  padding-top: 20px;
}
/* 每个板块有自己的标题区 */
[id^="view"] > header {
  text-align: center;
  padding: 32px 0 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid var(--line-soft);
}
/* 切换Tab时的过渡 */
[id^="view"] {
  animation: viewFadeIn 0.3s ease;
}
@keyframes viewFadeIn { from { opacity: 0; } to { opacity: 1; } }

/* ===== 真实图片装饰 ===== */
/* 使用 Unsplash 免费图片API（自动压缩+裁剪） */

/* 标题区域：星空背景图 */
header {
  background-image: url('https://images.unsplash.com/photo-1534796636912-3b95b3ab5986?w=800&q=60&auto=format');
  background-size: cover;
  background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.85);
  border-radius: 16px;
  margin-bottom: 20px;
}

/* 紫微板块标题：星盘图 */
#viewZiwei > header {
  background-image: url('https://images.unsplash.com/photo-1532968961962-8a0cb3a2d4f0?w=800&q=60&auto=format');
  background-color: rgba(13,8,21,0.82);
}

/* 星座板块标题：星座图 */
#viewZodiac > header {
  background-image: url('https://images.unsplash.com/photo-1505506874110-6a7a69069a08?w=800&q=60&auto=format');
  background-color: rgba(13,8,21,0.82);
}

/* 塔罗板块标题：神秘牌背景 */
#viewTarot > header {
  background-image: url('https://images.unsplash.com/photo-1600429991827-5224817554f8?w=800&q=60&auto=format');
  background-color: rgba(13,8,21,0.8);
}

/* 奇门板块标题：罗盘 */
#viewQimen > header {
  background-image: url('https://images.unsplash.com/photo-1509228627152-72ae9ae6848d?w=800&q=60&auto=format');
  background-color: rgba(13,8,21,0.82);
}

/* 风水板块标题 */
#viewFengshui > header {
  background-image: url('https://images.unsplash.com/photo-1600585154340-be6161a56a0c?w=800&q=60&auto=format');
  background-color: rgba(13,8,21,0.8);
}

/* 功能入口卡片背景图 */
.feature-entry:nth-child(1) {
  background-image: url('https://images.unsplash.com/photo-1475274047050-1d0c0975c63e?w=400&q=40&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.88);
}
.feature-entry:nth-child(2) {
  background-image: url('https://images.unsplash.com/photo-1519681393784-d120267933ba?w=400&q=40&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.88);
}
.feature-entry:nth-child(3) {
  background-image: url('https://images.unsplash.com/photo-1507400492013-162706c8c05e?w=400&q=40&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.88);
}
.feature-entry:nth-child(4) {
  background-image: url('https://images.unsplash.com/photo-1518568814500-bf0f8d125f46?w=400&q=40&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.88);
}

/* 今日命运签背景 */
.daily-fortune-card {
  background-image: url('https://images.unsplash.com/photo-1462331940025-496dfbfc7564?w=600&q=40&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.88);
}

/* 揭盘按钮区域 */
.start-paipan-entry {
  background-image: url('https://images.unsplash.com/photo-1444703686981-a3abbc4d4fe3?w=600&q=40&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.85);
}

/* 白天模式下不用图片背景（太暗了） */
body[data-theme="day"] header,
body[data-theme="day"] .feature-entry,
body[data-theme="day"] .daily-fortune-card,
body[data-theme="day"] .start-paipan-entry,
body[data-theme="day"] [id^="view"] > header {
  background-image: none;
  background-color: var(--bg-surface);
}
body[data-theme="paper"] header,
body[data-theme="paper"] .feature-entry,
body[data-theme="paper"] .daily-fortune-card,
body[data-theme="paper"] .start-paipan-entry {
  background-image: none;
}

/* ===== 统一风格：所有区块使用星空图片+深色覆盖 ===== */

/* 所有卡片统一样式：星空底图+圆角+深色遮罩 */
.today-glance,
.daily-fortune-card,
.decision-card,
.start-paipan-entry,
.input-panel,
.feature-grid,
.summary-card,
.title-card,
.verdict-banner,
.fate-id-card,
.celeb-match,
.fate-dna-wrap,
.life-timeline-wrap,
.fate-sim-wrap,
.three-q-card .tq-section,
.next-actions,
.share-bar {
  background-image: url('https://images.unsplash.com/photo-1534796636912-3b95b3ab5986?w=800&q=50&auto=format');
  background-size: cover;
  background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.92);
  border: 1px solid rgba(255,255,255,0.04);
  border-radius: 16px;
}

/* 分析面板同样风格 */
.strength-panel,
.liuqin-panel,
.analysis-card,
.accordion-section {
  background-image: url('https://images.unsplash.com/photo-1534796636912-3b95b3ab5986?w=800&q=50&auto=format');
  background-size: cover;
  background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.94);
  border: 1px solid rgba(255,255,255,0.04);
  border-radius: 12px;
  padding: 18px 20px;
  margin-bottom: 12px;
}

/* 大运卡片 */
.dayun-card {
  background-image: url('https://images.unsplash.com/photo-1534796636912-3b95b3ab5986?w=400&q=40&auto=format');
  background-size: cover;
  background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.9);
  border: 1px solid rgba(255,255,255,0.05);
}

/* 速看四格 */
.tg-item {
  background-image: url('https://images.unsplash.com/photo-1475274047050-1d0c0975c63e?w=400&q=30&auto=format');
  background-size: cover;
  background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.9);
  border: 1px solid rgba(255,255,255,0.04);
}

/* 导航条 */
.top-nav {
  background-image: url('https://images.unsplash.com/photo-1534796636912-3b95b3ab5986?w=800&q=40&auto=format');
  background-size: cover;
  background-position: top center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.88);
  border-radius: 12px;
  padding: 12px 16px;
  margin-bottom: 20px;
  border: 1px solid rgba(255,255,255,0.04);
}

/* 紫微九宫格 */
.qm-grid .qm-cell,
.zw-pal {
  background-image: url('https://images.unsplash.com/photo-1475274047050-1d0c0975c63e?w=400&q=30&auto=format');
  background-size: cover;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.92);
  border: 1px solid rgba(255,255,255,0.04);
}

/* layer-group头部 */
.layer-head {
  background-image: url('https://images.unsplash.com/photo-1534796636912-3b95b3ab5986?w=800&q=40&auto=format');
  background-size: cover;
  background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.9);
  border: 1px solid rgba(255,255,255,0.04);
  border-radius: 12px;
}

/* 白天/宣纸模式关闭所有图片 */
body[data-theme="day"] .today-glance,
body[data-theme="day"] .daily-fortune-card,
body[data-theme="day"] .decision-card,
body[data-theme="day"] .start-paipan-entry,
body[data-theme="day"] .input-panel,
body[data-theme="day"] .feature-grid,
body[data-theme="day"] .feature-entry,
body[data-theme="day"] .strength-panel,
body[data-theme="day"] .liuqin-panel,
body[data-theme="day"] .analysis-card,
body[data-theme="day"] .accordion-section,
body[data-theme="day"] .dayun-card,
body[data-theme="day"] .tg-item,
body[data-theme="day"] .top-nav,
body[data-theme="day"] .layer-head,
body[data-theme="day"] .summary-card,
body[data-theme="day"] .title-card,
body[data-theme="day"] .verdict-banner,
body[data-theme="day"] .share-bar,
body[data-theme="day"] .qm-cell,
body[data-theme="day"] .three-q-card .tq-section,
body[data-theme="day"] .next-actions,
body[data-theme="paper"] .today-glance,
body[data-theme="paper"] .daily-fortune-card,
body[data-theme="paper"] .decision-card,
body[data-theme="paper"] .start-paipan-entry,
body[data-theme="paper"] .input-panel,
body[data-theme="paper"] .feature-grid,
body[data-theme="paper"] .feature-entry,
body[data-theme="paper"] .strength-panel,
body[data-theme="paper"] .liuqin-panel,
body[data-theme="paper"] .analysis-card,
body[data-theme="paper"] .dayun-card,
body[data-theme="paper"] .tg-item,
body[data-theme="paper"] .top-nav,
body[data-theme="paper"] .layer-head {
  background-image: none;
}

/* ===== 每个区块使用不同的星空图片（同风格不同画面） ===== */

/* 导航条：深空纯净星点 */
.top-nav {
  background-image: url('https://images.unsplash.com/photo-1419242902214-272b3f66ee7a?w=900&q=50&auto=format') !important;
}

/* 今日速看：紫色星云 */
.today-glance {
  background-image: url('https://images.unsplash.com/photo-1462331940025-496dfbfc7564?w=800&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.9) !important;
}

/* 命运签：金色银河 */
.daily-fortune-card {
  background-image: url('https://images.unsplash.com/photo-1444703686981-a3abbc4d4fe3?w=800&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.9) !important;
}

/* 决策助手：深蓝极光 */
.decision-card {
  background-image: url('https://images.unsplash.com/photo-1531366936337-7c912a4589a7?w=800&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.9) !important;
}

/* 揭盘按钮：猎户座星云 */
.start-paipan-entry {
  background-image: url('https://images.unsplash.com/photo-1543722530-d2c3201371e7?w=800&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.87) !important;
}

/* 功能入口网格整体：暗色山脉星空 */
.feature-grid {
  background-image: url('https://images.unsplash.com/photo-1519681393784-d120267933ba?w=900&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.85) !important;
  padding: 20px !important;
}
/* 功能入口各卡片无图（继承grid背景） */
.feature-entry {
  background-image: none !important;
  background-color: rgba(13,8,21,0.6) !important;
  backdrop-filter: blur(4px);
}

/* 输入面板：深邃宇宙 */
.input-panel {
  background-image: url('https://images.unsplash.com/photo-1505506874110-6a7a69069a08?w=800&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.92) !important;
}

/* === 排盘结果区的各面板 === */

/* 三句话总结/命格卡：玫瑰星云（暖色） */
.summary-card,
.three-q-card .tq-section {
  background-image: url('https://images.unsplash.com/photo-1465101162946-4377e57745c3?w=600&q=40&auto=format') !important;
  background-color: rgba(13,8,21,0.93) !important;
}

/* 命格称号卡：猎户大星云 */
.title-card {
  background-image: url('https://images.unsplash.com/photo-1543722530-d2c3201371e7?w=600&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.88) !important;
}

/* 评分横幅：深蓝太空 */
.verdict-banner {
  background-image: url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?w=600&q=40&auto=format') !important;
  background-color: rgba(13,8,21,0.92) !important;
}

/* 命格身份证：月球表面 */
.fate-id-card {
  background-image: url('https://images.unsplash.com/photo-1446776811953-b23d57bd21aa?w=500&q=40&auto=format') !important;
  background-color: rgba(13,8,21,0.91) !important;
}

/* DNA图谱区：暗物质 */
.fate-dna-wrap {
  background-image: url('https://images.unsplash.com/photo-1507400492013-162706c8c05e?w=600&q=40&auto=format') !important;
  background-color: rgba(13,8,21,0.92) !important;
}

/* 人生时间轴：星轨长曝光 */
.life-timeline-wrap {
  background-image: url('https://images.unsplash.com/photo-1472691681358-fdf00a4bfcfe?w=700&q=40&auto=format') !important;
  background-color: rgba(13,8,21,0.9) !important;
}

/* 模拟器：平行宇宙感 */
.fate-sim-wrap {
  background-image: url('https://images.unsplash.com/photo-1464802686167-b939a6910659?w=600&q=40&auto=format') !important;
  background-color: rgba(13,8,21,0.91) !important;
}

/* 名人匹配：古典星图 */
.celeb-match {
  background-image: url('https://images.unsplash.com/photo-1532968961962-8a0cb3a2d4f0?w=600&q=40&auto=format') !important;
  background-color: rgba(13,8,21,0.9) !important;
}

/* 分享栏：流星 */
.share-bar {
  background-image: url('https://images.unsplash.com/photo-1504333638930-c8787321eee0?w=600&q=40&auto=format') !important;
  background-color: rgba(13,8,21,0.91) !important;
}

/* "接下来"引导区：日出地平线 */
.next-actions {
  background-image: url('https://images.unsplash.com/photo-1454789548928-9efd52dc4031?w=600&q=40&auto=format') !important;
  background-color: rgba(13,8,21,0.88) !important;
}

/* === 各独立板块标题区各用不同图 === */

/* 八字主页标题：纯星空（已有） */

/* 紫微：古代星图 */
#viewZiwei > header {
  background-image: url('https://images.unsplash.com/photo-1532968961962-8a0cb3a2d4f0?w=800&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.82) !important;
}

/* 星座：彩色星云 */
#viewZodiac > header {
  background-image: url('https://images.unsplash.com/photo-1462331940025-496dfbfc7564?w=800&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.8) !important;
}

/* 合婚：双星 */
#viewMatch > header {
  background-image: url('https://images.unsplash.com/photo-1518568814500-bf0f8d125f46?w=800&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.83) !important;
}

/* 奇门：罗盘星空 */
#viewQimen > header {
  background-image: url('https://images.unsplash.com/photo-1509228627152-72ae9ae6848d?w=800&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.8) !important;
}

/* 姓名学：书法墨迹 */
#viewNaming > header {
  background-image: url('https://images.unsplash.com/photo-1455885661740-29cbf08a42fa?w=800&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.83) !important;
}

/* 塔罗：神秘烛光 */
#viewTarot > header {
  background-image: url('https://images.unsplash.com/photo-1600429991827-5224817554f8?w=800&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.78) !important;
}

/* 风水：山水 */
#viewFengshui > header {
  background-image: url('https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=800&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.78) !important;
}

/* 六壬：古籍纹理 */
#viewLiuren > header {
  background-image: url('https://images.unsplash.com/photo-1524995997946-a1c2e315a42f?w=800&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.82) !important;
}

/* 生肖：中国红灯笼 */
#viewShengxiao > header {
  background-image: url('https://images.unsplash.com/photo-1547981609-4b6bfe67ca0b?w=800&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.8) !important;
}

/* 每日一卦：八卦太极 */
#viewGua > header {
  background-image: url('https://images.unsplash.com/photo-1507400492013-162706c8c05e?w=800&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.82) !important;
}

/* 择日：日历古风 */
#viewDate > header {
  background-image: url('https://images.unsplash.com/photo-1506784365847-bbad939e9335?w=800&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.83) !important;
}

/* === 大运卡片用不同深度 === */
.dayun-card {
  background-image: url('https://images.unsplash.com/photo-1475274047050-1d0c0975c63e?w=300&q=30&auto=format') !important;
  background-color: rgba(13,8,21,0.88) !important;
}
.dayun-card:hover {
  background-color: rgba(13,8,21,0.82) !important;
}
.dayun-card.active-card {
  background-color: rgba(13,8,21,0.78) !important;
  border-color: rgba(212,168,83,0.3) !important;
}

/* === 速看四格各用不同色调图 === */
.tg-item:nth-child(1) { background-image: url('https://images.unsplash.com/photo-1462331940025-496dfbfc7564?w=300&q=30&auto=format') !important; }
.tg-item:nth-child(2) { background-image: url('https://images.unsplash.com/photo-1543722530-d2c3201371e7?w=300&q=30&auto=format') !important; }
.tg-item:nth-child(3) { background-image: url('https://images.unsplash.com/photo-1444703686981-a3abbc4d4fe3?w=300&q=30&auto=format') !important; }
.tg-item:nth-child(4) { background-image: url('https://images.unsplash.com/photo-1507400492013-162706c8c05e?w=300&q=30&auto=format') !important; }

/* ===== 紫微板块内部面板各用不同星空图 ===== */

/* 紫微命盘网格整体 */
.zw-grid {
  background-image: url('https://images.unsplash.com/photo-1465101162946-4377e57745c3?w=900&q=40&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.88);
  border-radius: 16px; padding: 12px;
  border: 1px solid rgba(255,255,255,0.04);
}

/* 紫微各宫位格子 */
.zw-pal {
  background-image: url('https://images.unsplash.com/photo-1475274047050-1d0c0975c63e?w=300&q=25&auto=format') !important;
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.91) !important;
  border: 1px solid rgba(139,108,199,0.08) !important;
}
.zw-pal.zw-pal-ming {
  background-color: rgba(139,108,199,0.12) !important;
  border-color: rgba(139,108,199,0.2) !important;
}

/* 紫微中宫 */
.zw-center {
  background-image: url('https://images.unsplash.com/photo-1532968961962-8a0cb3a2d4f0?w=400&q=40&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.85);
  border-radius: 12px;
  border: 1px solid rgba(212,168,83,0.1);
}

/* 紫微大限流年面板 */
#zwDxDetail, #zwDxYear {
  background-image: url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?w=600&q=40&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.92);
  border-radius: 12px; padding: 16px;
  border: 1px solid rgba(255,255,255,0.04);
  margin-top: 12px;
}

/* ===== 星座板块内部面板各用不同图 ===== */

/* 星座结果整体区域 */
#zodiacResult {
  background-image: url('https://images.unsplash.com/photo-1462331940025-496dfbfc7564?w=900&q=40&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.86);
  border-radius: 16px; padding: 20px;
  border: 1px solid rgba(255,255,255,0.04);
}

/* 星座卡片（太阳/月亮/金星等） */
.zodiac-card {
  background-image: url('https://images.unsplash.com/photo-1507400492013-162706c8c05e?w=400&q=30&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.89);
  border: 1px solid rgba(255,255,255,0.05);
  border-radius: 12px; padding: 16px;
  margin-bottom: 10px;
}

/* 星座配对区 */
#zpResult {
  background-image: url('https://images.unsplash.com/photo-1518568814500-bf0f8d125f46?w=600&q=40&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.9);
  border-radius: 12px; padding: 16px;
  border: 1px solid rgba(255,255,255,0.04);
  margin-top: 12px;
}

/* 星座每日运势 */
.zod-daily, .bullet-cards {
  background-image: url('https://images.unsplash.com/photo-1444703686981-a3abbc4d4fe3?w=600&q=35&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.9);
  border-radius: 12px; padding: 16px;
  border: 1px solid rgba(255,255,255,0.04);
  margin-top: 12px;
}

/* 星座bullet卡片（性格/爱情/事业等） */
.bullet-card {
  background-image: url('https://images.unsplash.com/photo-1464802686167-b939a6910659?w=400&q=30&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.91);
  border: 1px solid rgba(255,255,255,0.04);
  border-radius: 10px; padding: 16px;
}

/* ===== 合婚板块 ===== */
#viewMatch .input-panel {
  background-image: url('https://images.unsplash.com/photo-1518568814500-bf0f8d125f46?w=800&q=50&auto=format') !important;
  background-color: rgba(13,8,21,0.88) !important;
}

/* ===== 奇门九宫格 ===== */
.qm-grid {
  background-image: url('https://images.unsplash.com/photo-1509228627152-72ae9ae6848d?w=800&q=40&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.85);
  border-radius: 14px; padding: 12px;
  border: 1px solid rgba(255,255,255,0.04);
}
.qm-cell {
  background-image: none !important;
  background-color: rgba(13,8,21,0.7) !important;
  backdrop-filter: blur(4px);
  border: 1px solid rgba(255,255,255,0.05) !important;
}

/* ===== 塔罗结果 ===== */
#tarotResult .strength-panel {
  background-image: url('https://images.unsplash.com/photo-1600429991827-5224817554f8?w=600&q=40&auto=format') !important;
  background-color: rgba(13,8,21,0.87) !important;
}

/* ===== 风水结果 ===== */
#fengshuiResult .strength-panel {
  background-image: url('https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=600&q=40&auto=format') !important;
  background-color: rgba(13,8,21,0.88) !important;
}

/* ===== 姓名学结果 ===== */
#namingResult .strength-panel {
  background-image: url('https://images.unsplash.com/photo-1455885661740-29cbf08a42fa?w=600&q=40&auto=format') !important;
  background-color: rgba(13,8,21,0.9) !important;
}

/* ===== 六壬结果 ===== */
#liurenResult .strength-panel {
  background-image: linear-gradient(145deg, rgba(7,20,31,0.96), rgba(5,13,23,0.9)) !important;
  background-color: rgba(6,16,27,0.92) !important;
}

/* ===== 运势曲线图区域 ===== */
.fortune-chart-section {
  background-image: url('https://images.unsplash.com/photo-1472691681358-fdf00a4bfcfe?w=700&q=40&auto=format') !important;
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.9) !important;
  border: 1px solid rgba(255,255,255,0.04) !important;
  border-radius: 14px !important;
}

/* ===== 白天/宣纸模式全部关闭图片 ===== */
body[data-theme="day"] .zw-grid,
body[data-theme="day"] .zw-pal,
body[data-theme="day"] .zw-center,
body[data-theme="day"] #zodiacResult,
body[data-theme="day"] .zodiac-card,
body[data-theme="day"] #zpResult,
body[data-theme="day"] .bullet-card,
body[data-theme="day"] .bullet-cards,
body[data-theme="day"] .qm-grid,
body[data-theme="day"] .qm-cell,
body[data-theme="day"] #tarotResult .strength-panel,
body[data-theme="day"] #fengshuiResult .strength-panel,
body[data-theme="day"] #namingResult .strength-panel,
body[data-theme="day"] #liurenResult .strength-panel,
body[data-theme="day"] .fortune-chart-section,
body[data-theme="day"] #zwDxDetail,
body[data-theme="day"] #zwDxYear,
body[data-theme="paper"] .zw-grid,
body[data-theme="paper"] .zw-pal,
body[data-theme="paper"] .zw-center,
body[data-theme="paper"] #zodiacResult,
body[data-theme="paper"] .zodiac-card,
body[data-theme="paper"] #zpResult,
body[data-theme="paper"] .bullet-card,
body[data-theme="paper"] .qm-grid,
body[data-theme="paper"] .fortune-chart-section {
  background-image: none !important;
}

/* ===== 更丰富的视觉层次：渐变边框+内光+角标+装饰 ===== */

/* --- 所有卡片加微妙渐变顶部边框 --- */
.today-glance { border-top: 2px solid rgba(139,108,199,0.3) !important; }
.daily-fortune-card { border-top: 2px solid rgba(212,168,83,0.3) !important; }
.decision-card { border-top: 2px solid rgba(96,165,250,0.3) !important; }
.start-paipan-entry { border-top: 2px solid rgba(212,168,83,0.4) !important; }
.title-card { border-top: 2px solid rgba(139,108,199,0.4) !important; }
.verdict-banner { border-top: 2px solid rgba(212,168,83,0.3) !important; }
.fate-id-card { border-top: 2px solid rgba(212,168,83,0.4) !important; }
.summary-card { border-top: 2px solid rgba(74,222,128,0.3) !important; }

/* --- 卡片左上角装饰角标 --- */
.today-glance::before { content: '☰'; position: absolute; top: 12px; left: 14px; font-size: 1rem; color: rgba(139,108,199,0.25); pointer-events: none; }
.daily-fortune-card::before { content: '☯'; position: absolute; top: 12px; left: 14px; font-size: 1.1rem; color: rgba(212,168,83,0.2); pointer-events: none; }
.decision-card::before { content: '⚖'; position: absolute; top: 12px; left: 14px; font-size: 1rem; color: rgba(96,165,250,0.25); pointer-events: none; }
.start-paipan-entry::before { content: '\2726'; position: absolute; top: 14px; left: 16px; font-size: 1.2rem; color: rgba(212,168,83,0.3); pointer-events: none; }
.title-card::before { content: '命'; position: absolute; top: 14px; right: 16px; font-size: 2rem; color: rgba(139,108,199,0.08); pointer-events: none; font-family: var(--font-serif); }
.fate-id-card::before { content: '档'; position: absolute; top: 14px; right: 16px; font-size: 1.8rem; color: rgba(212,168,83,0.06); pointer-events: none; font-family: var(--font-serif); }
.today-glance, .daily-fortune-card, .decision-card, .start-paipan-entry, .title-card, .fate-id-card { position: relative; overflow: hidden; }

/* --- 板块标题区增加底部渐变过渡 --- */
[id^="view"] > header::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 40px;
  background: linear-gradient(to bottom, transparent, var(--bg, #0d0815));
  pointer-events: none;
}
[id^="view"] > header { position: relative; overflow: hidden; }

/* --- 紫微宫位悬停发光 --- */
.zw-pal:hover {
  background-color: rgba(139,108,199,0.08) !important;
  border-color: rgba(139,108,199,0.2) !important;
  box-shadow: 0 0 12px rgba(139,108,199,0.1);
}

/* --- 星座卡片内星座符号放大装饰 --- */
.zodiac-card { position: relative; overflow: hidden; }
.zodiac-card .zod-sym {
  font-size: 2.4rem !important;
  opacity: 0.9;
  filter: drop-shadow(0 0 8px currentColor);
}

/* --- 大运轨道加渐变底线 --- */
.dayun-track::before {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent, rgba(212,168,83,0.2), rgba(139,108,199,0.2), transparent);
  pointer-events: none;
}
.dayun-track { position: relative; }

/* --- 评分数字发光 --- */
.vs-num, .verdict-score .vs-num {
  text-shadow: 0 0 12px rgba(212,168,83,0.4), 0 0 24px rgba(212,168,83,0.15) !important;
}

/* --- 命格称号文字光效 --- */
.tc-name {
  text-shadow: 0 0 16px rgba(139,108,199,0.3), 0 0 32px rgba(139,108,199,0.1) !important;
}

/* --- 速看数值各带不同颜色发光 --- */
.tg-item:nth-child(1) .tg-value { text-shadow: 0 0 8px rgba(139,108,199,0.4); }
.tg-item:nth-child(2) .tg-value { text-shadow: 0 0 8px rgba(251,146,60,0.4); }
.tg-item:nth-child(3) .tg-value { text-shadow: 0 0 8px rgba(212,168,83,0.4); }
.tg-item:nth-child(4) .tg-value { text-shadow: 0 0 8px rgba(96,165,250,0.4); }

/* --- 功能入口卡片各带不同边框色 --- */
.feature-entry:nth-child(1) { border-left: 2px solid rgba(139,108,199,0.3) !important; }
.feature-entry:nth-child(2) { border-left: 2px solid rgba(96,165,250,0.3) !important; }
.feature-entry:nth-child(3) { border-left: 2px solid rgba(212,168,83,0.3) !important; }
.feature-entry:nth-child(4) { border-left: 2px solid rgba(236,72,153,0.3) !important; }

/* --- 揭盘按钮增强：外圈光晕 --- */
.start-paipan-btn {
  box-shadow: 0 0 20px rgba(212,168,83,0.3), 0 0 40px rgba(212,168,83,0.1), inset 0 1px 0 rgba(255,255,255,0.1) !important;
}
.start-paipan-btn:hover {
  box-shadow: 0 0 28px rgba(212,168,83,0.4), 0 0 56px rgba(212,168,83,0.15), inset 0 1px 0 rgba(255,255,255,0.15) !important;
}

/* --- 命运签诗文区域内框发光 --- */
.dfc-poem {
  border-color: rgba(212,168,83,0.1) !important;
  box-shadow: inset 0 0 20px rgba(212,168,83,0.03);
}

/* --- 三句话卡各段不同左边框色 --- */
.three-q-card .tq-section:nth-child(1) { border-left: 3px solid rgba(139,108,199,0.4) !important; }
.three-q-card .tq-section:nth-child(2) { border-left: 3px solid rgba(212,168,83,0.4) !important; }
.three-q-card .tq-section:nth-child(3) { border-left: 3px solid rgba(74,222,128,0.4) !important; }

/* --- 奇门九宫格各宫位不同边框色（按五行） --- */
.qm-cell:nth-child(1) { border-top: 2px solid rgba(74,222,128,0.3) !important; } /* 巽木 */
.qm-cell:nth-child(2) { border-top: 2px solid rgba(248,113,113,0.3) !important; } /* 离火 */
.qm-cell:nth-child(3) { border-top: 2px solid rgba(251,146,60,0.3) !important; } /* 坤土 */
.qm-cell:nth-child(4) { border-top: 2px solid rgba(74,222,128,0.3) !important; } /* 震木 */
.qm-cell:nth-child(5) { border-top: 2px solid rgba(251,146,60,0.3) !important; } /* 中土 */
.qm-cell:nth-child(6) { border-top: 2px solid rgba(226,232,240,0.3) !important; } /* 兑金 */
.qm-cell:nth-child(7) { border-top: 2px solid rgba(251,146,60,0.3) !important; } /* 艮土 */
.qm-cell:nth-child(8) { border-top: 2px solid rgba(96,165,250,0.3) !important; } /* 坎水 */
.qm-cell:nth-child(9) { border-top: 2px solid rgba(226,232,240,0.3) !important; } /* 乾金 */

/* --- 导航条活跃项增加底部发光点 --- */
.nav-item.active::after {
  content: ''; position: absolute; bottom: -2px; left: 50%; transform: translateX(-50%);
  width: 4px; height: 4px; border-radius: 50%;
  background: var(--gold, #d4a853);
  box-shadow: 0 0 6px var(--gold, #d4a853);
}
.nav-item { position: relative; }

/* --- 各板块 header 右下角加水印文字 --- */
#viewZiwei > header::before { content: '紫微斗数'; position: absolute; bottom: 20px; right: 20px; font-size: 1.4rem; color: rgba(255,255,255,0.04); font-family: var(--font-serif); pointer-events: none; letter-spacing: 0.2em; }
#viewZodiac > header::before { content: '西方占星'; position: absolute; bottom: 20px; right: 20px; font-size: 1.4rem; color: rgba(255,255,255,0.04); font-family: var(--font-serif); pointer-events: none; letter-spacing: 0.2em; }
#viewQimen > header::before { content: '奇门遁甲'; position: absolute; bottom: 20px; right: 20px; font-size: 1.4rem; color: rgba(255,255,255,0.04); font-family: var(--font-serif); pointer-events: none; letter-spacing: 0.2em; }
#viewTarot > header::before { content: 'TAROT'; position: absolute; bottom: 20px; right: 20px; font-size: 1.2rem; color: rgba(255,255,255,0.04); pointer-events: none; letter-spacing: 0.3em; }
#viewNaming > header::before { content: '姓名学'; position: absolute; bottom: 20px; right: 20px; font-size: 1.4rem; color: rgba(255,255,255,0.04); font-family: var(--font-serif); pointer-events: none; letter-spacing: 0.2em; }
#viewFengshui > header::before { content: '堪舆'; position: absolute; bottom: 20px; right: 20px; font-size: 1.6rem; color: rgba(255,255,255,0.04); font-family: var(--font-serif); pointer-events: none; letter-spacing: 0.3em; }
#viewLiuren > header::before { content: '六壬'; position: absolute; bottom: 20px; right: 20px; font-size: 1.6rem; color: rgba(255,255,255,0.04); font-family: var(--font-serif); pointer-events: none; letter-spacing: 0.3em; }

/* --- 分析面板h4前的彩色方块改为圆点+不同颜色 --- */
.strength-panel h4::before { content: '\25CF'; font-size: 0.6rem; margin-right: 8px; color: rgba(74,222,128,0.7); vertical-align: middle; background: none !important; width: auto !important; height: auto !important; border-radius: 0 !important; display: inline !important; }
.liuqin-panel h4::before { content: '\25CF'; font-size: 0.6rem; margin-right: 8px; color: rgba(139,108,199,0.7); vertical-align: middle; background: none !important; width: auto !important; height: auto !important; border-radius: 0 !important; display: inline !important; }
.analysis-card h4::before { content: '\25CF'; font-size: 0.6rem; margin-right: 8px; color: rgba(212,168,83,0.7); vertical-align: middle; background: none !important; width: auto !important; height: auto !important; border-radius: 0 !important; display: inline !important; }

/* --- 手风琴展开态有微妙背景变化 --- */
.accordion-section.open {
  background-image: url('https://images.unsplash.com/photo-1475274047050-1d0c0975c63e?w=600&q=25&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.95);
  border-radius: 10px; padding: 0 14px;
  border: 1px solid rgba(212,168,83,0.06);
}

/* --- 减弱动效适配 --- */
@media (prefers-reduced-motion: reduce) {
  .vs-num, .tc-name, .tg-value { text-shadow: none !important; }
}

/* ===== 页面加宽 ===== */
.container { max-width: 1100px !important; padding: 0 40px !important; }
@media (min-width: 1200px) { .container { max-width: 1200px !important; padding: 0 56px !important; } }
@media (min-width: 1400px) { .container { max-width: 1360px !important; padding: 0 64px !important; } }
.today-glance, #dailyFortuneSlot, .decision-card,
.start-paipan-entry, .feature-grid, #inputPanel, .result,
.skeleton-loading, .intro-hook { max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }
.tg-grid { grid-template-columns: repeat(4, 1fr) !important; }
.feature-grid { grid-template-columns: repeat(4, 1fr) !important; }
@media (max-width: 768px) { .feature-grid { grid-template-columns: repeat(2, 1fr) !important; } }

/* ===== 更多区域加入高质量图片 ===== */

/* 八字排盘结果区整体 */
#result {
  background-image: url('https://images.unsplash.com/photo-1419242902214-272b3f66ee7a?w=1200&q=40&auto=format');
  background-size: cover; background-position: center; background-attachment: fixed;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.94);
  border-radius: 20px; padding: 24px;
  border: 1px solid rgba(255,255,255,0.03);
}

/* 合婚结果 */
#matchResult {
  background-image: url('https://images.unsplash.com/photo-1529333166437-7750a6dd5a70?w=800&q=40&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.91);
  border-radius: 14px; padding: 18px;
  border: 1px solid rgba(236,72,153,0.06);
  margin-top: 14px;
}

/* 生肖板块 */
#viewShengxiao > header {
  background-image: url('https://images.unsplash.com/photo-1547981609-4b6bfe67ca0b?w=800&q=50&auto=format') !important;
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.78) !important;
}
#shengxiaoResult {
  background-image: url('https://images.unsplash.com/photo-1513836279014-a89f7a76ae86?w=800&q=40&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.92);
  border-radius: 14px; padding: 18px;
  border: 1px solid rgba(255,255,255,0.04);
  margin-top: 14px;
}

/* 每日一卦结果 */
#guaResult {
  background-image: url('https://images.unsplash.com/photo-1507400492013-162706c8c05e?w=800&q=40&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.91);
  border-radius: 14px; padding: 18px;
  border: 1px solid rgba(212,168,83,0.06);
  margin-top: 14px;
}

/* 择日板块 */
#viewDate > header {
  background-image: url('https://images.unsplash.com/photo-1506784365847-bbad939e9335?w=800&q=50&auto=format') !important;
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.8) !important;
}
#dateResult {
  background-image: url('https://images.unsplash.com/photo-1435527173128-983b87201f4d?w=800&q=40&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.92);
  border-radius: 14px; padding: 18px;
  border: 1px solid rgba(255,255,255,0.04);
  margin-top: 14px;
}

/* 紫微结果 */
#ziweiResult {
  background-image: url('https://images.unsplash.com/photo-1465101162946-4377e57745c3?w=1000&q=40&auto=format');
  background-size: cover; background-position: center; background-attachment: fixed;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.92);
  border-radius: 16px; padding: 20px;
  border: 1px solid rgba(139,108,199,0.06);
  margin-top: 14px;
}

/* 我的命盘 */
#viewSaved > header {
  background-image: url('https://images.unsplash.com/photo-1446776811953-b23d57bd21aa?w=800&q=50&auto=format') !important;
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.8) !important;
}
.saved-list {
  background-image: url('https://images.unsplash.com/photo-1446776811953-b23d57bd21aa?w=800&q=35&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.93);
  border-radius: 14px; padding: 18px;
  border: 1px solid rgba(255,255,255,0.04);
  min-height: 120px;
}

/* 扎心钩子区 */
.zhaxin-hook {
  background-image: url('https://images.unsplash.com/photo-1504333638930-c8787321eee0?w=600&q=35&auto=format') !important;
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.92) !important;
  border-radius: 12px !important; padding: 18px !important;
  border: 1px solid rgba(248,113,113,0.06) !important;
}

/* 标签墙 */
.tagwall-slot {
  background-image: url('https://images.unsplash.com/photo-1464802686167-b939a6910659?w=600&q=30&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.93);
  border-radius: 12px; padding: 16px;
  border: 1px solid rgba(255,255,255,0.04);
}

/* 海报预览区 */
.poster-preview {
  background-image: url('https://images.unsplash.com/photo-1543722530-d2c3201371e7?w=500&q=30&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.9);
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.04);
  min-height: 60px;
}

/* 五行雷达图区域 */
.wuxing-panel {
  background-image: url('https://images.unsplash.com/photo-1462331940025-496dfbfc7564?w=600&q=30&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.93);
  border-radius: 14px; padding: 18px;
  border: 1px solid rgba(139,108,199,0.06);
}

/* 四柱排盘格 */
.four-pillars, .pro-chart {
  background-image: url('https://images.unsplash.com/photo-1534796636912-3b95b3ab5986?w=700&q=30&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.92);
  border-radius: 12px; padding: 14px;
  border: 1px solid rgba(212,168,83,0.06);
}

/* 十神区域 */
.ten-gods, .ten-gods-full {
  background-image: url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?w=600&q=30&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.93);
  border-radius: 12px; padding: 14px;
  border: 1px solid rgba(255,255,255,0.04);
}

/* 刑冲合化面板 */
.rel-panel {
  background-image: url('https://images.unsplash.com/photo-1507400492013-162706c8c05e?w=500&q=30&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.92);
  border-radius: 12px; padding: 16px;
  border: 1px solid rgba(255,255,255,0.04);
}

/* 深度分析表格 */
.deep-table {
  background-image: url('https://images.unsplash.com/photo-1475274047050-1d0c0975c63e?w=600&q=25&auto=format');
  background-size: cover; background-position: center;
  background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.95);
  border-radius: 8px;
  overflow: hidden;
}

/* 白天/宣纸模式关闭 */
body[data-theme="day"] #result,
body[data-theme="day"] #matchResult,
body[data-theme="day"] #shengxiaoResult,
body[data-theme="day"] #guaResult,
body[data-theme="day"] #dateResult,
body[data-theme="day"] #ziweiResult,
body[data-theme="day"] .saved-list,
body[data-theme="day"] .zhaxin-hook,
body[data-theme="day"] .tagwall-slot,
body[data-theme="day"] .poster-preview,
body[data-theme="day"] .wuxing-panel,
body[data-theme="day"] .four-pillars,
body[data-theme="day"] .pro-chart,
body[data-theme="day"] .ten-gods,
body[data-theme="day"] .ten-gods-full,
body[data-theme="day"] .rel-panel,
body[data-theme="day"] .deep-table,
body[data-theme="paper"] #result,
body[data-theme="paper"] #ziweiResult,
body[data-theme="paper"] .wuxing-panel,
body[data-theme="paper"] .four-pillars,
body[data-theme="paper"] .pro-chart {
  background-image: none !important;
}

/* ===== 板块全屏独占：切换后该板块占满整个视口 ===== */

/* 切换板块时隐藏首页内容 */
body.view-active .intro-hook,
body.view-active .today-glance,
body.view-active #dailyFortuneSlot,
body.view-active .decision-card,
body.view-active .start-paipan-entry,
body.view-active .feature-grid,
body.view-active > .container > header {
  display: none !important;
}

/* 当前激活板块全屏占满 */
[id^="view"]:not([style*="display: none"]):not([style*="display:none"]) {
  min-height: calc(100vh - 80px);
}

/* 排盘板块（首页）激活时也隐藏首页装饰 */
body.view-single .intro-hook,
body.view-single .today-glance,
body.view-single #dailyFortuneSlot,
body.view-single .decision-card,
body.view-single .start-paipan-entry,
body.view-single .feature-grid {
  display: block !important;
}

/* ===========================================================
   五主题色系统一和谐修正
   默认(深紫星空) / 白天 / 玄黑 / 暖宣纸 / 星紫
   =========================================================== */

/* === 默认主题（深紫星空+香槟金）— 保持不动，已经和谐 === */

/* === 白天模式：暖白底+深灰文字+深金强调 === */
body[data-theme="day"] {
  --bg: #f9f9fb; --bg-2: #f0f1f4;
  --ink: #1c1c22; --ink-light: #44444d; --ink-faint: #8c8c96;
  --vermilion: #c0392b; --vermilion-light: #6a120e;
  --gold: #8b6914; --gold-light: #473304; --gold-dim: rgba(139,105,20,0.08);
  --jade: #1a7a5c; --jade-light: #238c6a;
  --line: rgba(0,0,0,0.07); --line-soft: rgba(0,0,0,0.04);
  --mu-color: #2d7a42; --huo-color: #c0392b; --tu-color: #8b6914; --jin-color: #4a5568; --shui-color: #1a5fa0;
  background: #f9f9fb !important; color: #1c1c22 !important;
}
body[data-theme="day"]::before { background: linear-gradient(180deg, #f0f1f4, #f9f9fb) !important; }
body[data-theme="day"]::after { display: none !important; }
body[data-theme="day"] header h1 { color: #1c1c22 !important; -webkit-text-fill-color: #1c1c22 !important; background: none !important; }
body[data-theme="day"] .nav-item { color: #8c8c96 !important; border-color: rgba(0,0,0,0.06) !important; }
body[data-theme="day"] .nav-item.active { color: #8b6914 !important; background: rgba(139,105,20,0.06) !important; border-color: rgba(139,105,20,0.15) !important; }
body[data-theme="day"] .btn-calculate, body[data-theme="day"] .start-paipan-btn { background: #8b6914 !important; color: #fff !important; box-shadow: 0 2px 8px rgba(139,105,20,0.15) !important; }
body[data-theme="day"] .tg-value, body[data-theme="day"] .vs-num, body[data-theme="day"] .tc-name { text-shadow: none !important; }
body[data-theme="day"] .top-nav, body[data-theme="day"] .today-glance, body[data-theme="day"] .daily-fortune-card,
body[data-theme="day"] .decision-card, body[data-theme="day"] .start-paipan-entry, body[data-theme="day"] .feature-grid,
body[data-theme="day"] .feature-entry, body[data-theme="day"] .input-panel, body[data-theme="day"] .strength-panel,
body[data-theme="day"] .liuqin-panel, body[data-theme="day"] .analysis-card, body[data-theme="day"] .accordion-section,
body[data-theme="day"] .summary-card, body[data-theme="day"] .title-card, body[data-theme="day"] .verdict-banner,
body[data-theme="day"] .dayun-card, body[data-theme="day"] .tg-item, body[data-theme="day"] .share-bar,
body[data-theme="day"] .layer-head, body[data-theme="day"] .fate-id-card, body[data-theme="day"] .next-actions,
body[data-theme="day"] .three-q-card .tq-section, body[data-theme="day"] .zodiac-card, body[data-theme="day"] .qm-cell,
body[data-theme="day"] #result, body[data-theme="day"] #ziweiResult, body[data-theme="day"] #zodiacResult {
  background-image: none !important;
  background-color: rgba(255,255,255,0.7) !important;
  border-color: rgba(0,0,0,0.06) !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
  backdrop-filter: none !important;
}
body[data-theme="day"] .compliance-banner { background: #f9f9fb !important; border-color: rgba(0,0,0,0.06) !important; }

/* === 玄黑模式：纯黑底+白文字+赤金强调 === */
body[data-theme="dark"] {
  --bg: #050505; --bg-2: #0a0a0a;
  --ink: #f5f5f5; --ink-light: #d4d4d4; --ink-faint: #737373;
  --vermilion: #ef4444; --vermilion-light: #ff9d92;
  --gold: #eab308; --gold-light: #ffdd80; --gold-dim: rgba(234,179,8,0.1);
  --jade: #22c55e; --jade-light: #4ade80;
  --line: rgba(255,255,255,0.06); --line-soft: rgba(255,255,255,0.03);
  --mu-color: #4ade80; --huo-color: #f87171; --tu-color: #fbbf24; --jin-color: #e2e8f0; --shui-color: #60a5fa;
  background: #050505 !important; color: #f5f5f5 !important;
}
body[data-theme="dark"]::before { background: radial-gradient(ellipse 60% 40% at 50% -10%, rgba(234,179,8,0.06) 0%, transparent 50%), linear-gradient(#0a0a0a, #050505) !important; }
body[data-theme="dark"]::after { opacity: 0.25 !important; }
body[data-theme="dark"] header h1 { color: #f5f5f5 !important; -webkit-text-fill-color: #f5f5f5 !important; background: none !important; }
body[data-theme="dark"] .nav-item.active { color: #eab308 !important; background: rgba(234,179,8,0.08) !important; border-color: rgba(234,179,8,0.2) !important; }
body[data-theme="dark"] .btn-calculate, body[data-theme="dark"] .start-paipan-btn { background: #eab308 !important; color: #050505 !important; box-shadow: 0 0 16px rgba(234,179,8,0.2) !important; }
body[data-theme="dark"] .top-nav, body[data-theme="dark"] .today-glance, body[data-theme="dark"] .daily-fortune-card,
body[data-theme="dark"] .decision-card, body[data-theme="dark"] .start-paipan-entry, body[data-theme="dark"] .feature-entry,
body[data-theme="dark"] .input-panel, body[data-theme="dark"] .strength-panel, body[data-theme="dark"] .liuqin-panel,
body[data-theme="dark"] .analysis-card, body[data-theme="dark"] .tg-item, body[data-theme="dark"] .dayun-card,
body[data-theme="dark"] .title-card, body[data-theme="dark"] .verdict-banner, body[data-theme="dark"] .layer-head {
  background-color: rgba(10,10,10,0.9) !important;
  border-color: rgba(255,255,255,0.05) !important;
}
body[data-theme="dark"] .dfc-advice { background: rgba(234,179,8,0.1) !important; color: #eab308 !important; }
body[data-theme="dark"] .vs-num { text-shadow: 0 0 10px rgba(234,179,8,0.4) !important; }

/* === 暖宣纸：米黄底+棕色文字+朱砂红强调 === */
body[data-theme="paper"] {
  --bg: #f5ecd9; --bg-2: #efe4ce;
  --ink: #3a2e22; --ink-light: #5a4a38; --ink-faint: #8a7860;
  --vermilion: #b5302a; --vermilion-light: #6a120e;
  --gold: #8a6820; --gold-light: #473304; --gold-dim: rgba(138,104,32,0.1);
  --jade: #3a7a56; --jade-light: #4a8a66;
  --line: rgba(100,70,30,0.12); --line-soft: rgba(100,70,30,0.06);
  --mu-color: #3a7a4a; --huo-color: #b5302a; --tu-color: #8a6820; --jin-color: #5a6478; --shui-color: #2a5a8a;
  background: #f5ecd9 !important; color: #3a2e22 !important;
}
body[data-theme="paper"]::before { background: linear-gradient(180deg, #efe4ce, #f5ecd9) !important; }
body[data-theme="paper"]::after { display: none !important; }
body[data-theme="paper"] header h1 { color: #3a2e22 !important; -webkit-text-fill-color: #3a2e22 !important; background: none !important; }
body[data-theme="paper"] .nav-item { color: #8a7860 !important; border-color: rgba(100,70,30,0.1) !important; }
body[data-theme="paper"] .nav-item.active { color: #b5302a !important; background: rgba(181,48,42,0.06) !important; border-color: rgba(181,48,42,0.15) !important; }
body[data-theme="paper"] .btn-calculate, body[data-theme="paper"] .start-paipan-btn { background: #b5302a !important; color: #f5ecd9 !important; box-shadow: 0 2px 8px rgba(181,48,42,0.15) !important; }
body[data-theme="paper"] .top-nav, body[data-theme="paper"] .today-glance, body[data-theme="paper"] .daily-fortune-card,
body[data-theme="paper"] .decision-card, body[data-theme="paper"] .start-paipan-entry, body[data-theme="paper"] .feature-entry,
body[data-theme="paper"] .input-panel, body[data-theme="paper"] .strength-panel, body[data-theme="paper"] .liuqin-panel,
body[data-theme="paper"] .analysis-card, body[data-theme="paper"] .tg-item, body[data-theme="paper"] .dayun-card,
body[data-theme="paper"] .title-card, body[data-theme="paper"] .verdict-banner, body[data-theme="paper"] .layer-head,
body[data-theme="paper"] .feature-grid, body[data-theme="paper"] .summary-card, body[data-theme="paper"] .share-bar {
  background-image: none !important;
  background-color: rgba(255,252,244,0.7) !important;
  border-color: rgba(100,70,30,0.08) !important;
  box-shadow: 0 1px 3px rgba(100,70,30,0.04) !important;
}
body[data-theme="paper"] .dfc-advice { background: rgba(181,48,42,0.06) !important; color: #b5302a !important; }
body[data-theme="paper"] .vs-num, body[data-theme="paper"] .tc-name { text-shadow: none !important; color: #b5302a !important; }
body[data-theme="paper"] .tg-item:nth-child(1) .tg-value { color: #3a7a4a !important; }
body[data-theme="paper"] .tg-item:nth-child(2) .tg-value { color: #b5302a !important; }
body[data-theme="paper"] .tg-item:nth-child(3) .tg-value { color: #8a6820 !important; }
body[data-theme="paper"] .tg-item:nth-child(4) .tg-value { color: #5a4a8a !important; }

/* === 神秘星紫：深紫底+荧光紫+淡金 === */
body[data-theme="mystic"] {
  --bg: #08061a; --bg-2: #0e0a28;
  --ink: #e8e4f8; --ink-light: #c4b8e0; --ink-faint: #7a6e98;
  --vermilion: #c77dff; --vermilion-light: #d9a0ff;
  --gold: #fbbf24; --gold-light: #fcd34d; --gold-dim: rgba(251,191,36,0.1);
  --jade: #7ad7f0; --jade-light: #a0e8ff;
  --line: rgba(199,125,255,0.1); --line-soft: rgba(199,125,255,0.05);
  --mu-color: #7ad7a0; --huo-color: #ff8fb0; --tu-color: #fbbf24; --jin-color: #c8d0f0; --shui-color: #7aa8ff;
  background: #08061a !important; color: #e8e4f8 !important;
}
body[data-theme="mystic"]::before { background: radial-gradient(ellipse 70% 50% at 50% -10%, rgba(199,125,255,0.12) 0%, transparent 55%), radial-gradient(ellipse 40% 40% at 80% 70%, rgba(122,168,255,0.06) 0%, transparent 40%), linear-gradient(#0e0a28, #08061a) !important; }
body[data-theme="mystic"]::after { opacity: 0.35 !important; }
body[data-theme="mystic"] header h1 { color: #e8e4f8 !important; -webkit-text-fill-color: #e8e4f8 !important; background: none !important; }
body[data-theme="mystic"] .nav-item.active { color: #c77dff !important; background: rgba(199,125,255,0.08) !important; border-color: rgba(199,125,255,0.2) !important; }
body[data-theme="mystic"] .btn-calculate, body[data-theme="mystic"] .start-paipan-btn { background: linear-gradient(135deg, #c77dff, #9b59b6) !important; color: #fff !important; box-shadow: 0 0 20px rgba(199,125,255,0.25) !important; }
body[data-theme="mystic"] .top-nav, body[data-theme="mystic"] .today-glance, body[data-theme="mystic"] .daily-fortune-card,
body[data-theme="mystic"] .decision-card, body[data-theme="mystic"] .start-paipan-entry, body[data-theme="mystic"] .feature-entry,
body[data-theme="mystic"] .input-panel, body[data-theme="mystic"] .strength-panel, body[data-theme="mystic"] .liuqin-panel,
body[data-theme="mystic"] .analysis-card, body[data-theme="mystic"] .tg-item, body[data-theme="mystic"] .dayun-card,
body[data-theme="mystic"] .title-card, body[data-theme="mystic"] .verdict-banner, body[data-theme="mystic"] .layer-head {
  background-color: rgba(14,10,40,0.88) !important;
  border-color: rgba(199,125,255,0.08) !important;
}
body[data-theme="mystic"] .dfc-advice { background: rgba(199,125,255,0.1) !important; color: #c77dff !important; }
body[data-theme="mystic"] .vs-num { text-shadow: 0 0 12px rgba(199,125,255,0.5) !important; color: #c77dff !important; }
body[data-theme="mystic"] .tc-name { text-shadow: 0 0 16px rgba(199,125,255,0.4) !important; }
body[data-theme="mystic"] .tg-item:nth-child(1) .tg-value { color: #c77dff !important; text-shadow: 0 0 8px rgba(199,125,255,0.3) !important; }
body[data-theme="mystic"] .tg-item:nth-child(2) .tg-value { color: #ff8fb0 !important; }
body[data-theme="mystic"] .tg-item:nth-child(3) .tg-value { color: #fbbf24 !important; }
body[data-theme="mystic"] .tg-item:nth-child(4) .tg-value { color: #7ad7f0 !important; }
body[data-theme="mystic"] .today-glance { border-top-color: rgba(199,125,255,0.3) !important; }
body[data-theme="mystic"] .daily-fortune-card { border-top-color: rgba(251,191,36,0.3) !important; }
body[data-theme="mystic"] .decision-card { border-top-color: rgba(122,215,240,0.3) !important; }

/* ===== 白天模式换配色：改为清雅蓝灰调 ===== */
body[data-theme="day"] {
  --bg: #f4f6f9 !important; --bg-2: #eaecf2 !important;
  --ink: #1e2a3a !important; --ink-light: #3d5068 !important; --ink-faint: #7b8da0 !important;
  --gold: #2563a8 !important; --gold-light: #3b7ed0 !important; --gold-dim: rgba(37,99,168,0.07) !important;
  --jade: #0d8a6a !important;
  --vermilion: #c0392b !important;
  --line: rgba(30,42,58,0.08) !important; --line-soft: rgba(30,42,58,0.04) !important;
  background: #f4f6f9 !important; color: #1e2a3a !important;
}
body[data-theme="day"] .nav-item.active { color: #2563a8 !important; background: rgba(37,99,168,0.06) !important; border-color: rgba(37,99,168,0.15) !important; }
body[data-theme="day"] .btn-calculate, body[data-theme="day"] .start-paipan-btn { background: #2563a8 !important; color: #fff !important; box-shadow: 0 2px 10px rgba(37,99,168,0.2) !important; }
body[data-theme="day"] .dfc-advice { background: rgba(37,99,168,0.06) !important; color: #2563a8 !important; }
body[data-theme="day"] .vs-num, body[data-theme="day"] .tc-name { color: #2563a8 !important; }
body[data-theme="day"] .tg-item:nth-child(1) .tg-value { color: #0d8a6a !important; }
body[data-theme="day"] .tg-item:nth-child(2) .tg-value { color: #c0392b !important; }
body[data-theme="day"] .tg-item:nth-child(3) .tg-value { color: #b8860b !important; }
body[data-theme="day"] .tg-item:nth-child(4) .tg-value { color: #6d28d9 !important; }
body[data-theme="day"] header .header-ornament { background: #2563a8 !important; }

/* ===== 星紫模式换配色：改为深海蓝绿调 ===== */
body[data-theme="mystic"] {
  --bg: #06101a !important; --bg-2: #0a1828 !important;
  --ink: #e0f0f8 !important; --ink-light: #a8c8d8 !important; --ink-faint: #5a8098 !important;
  --gold: #00d4aa !important; --gold-light: #30eac4 !important; --gold-dim: rgba(0,212,170,0.08) !important;
  --jade: #00d4aa !important;
  --vermilion: #ff6b9d !important;
  --line: rgba(0,212,170,0.08) !important; --line-soft: rgba(0,212,170,0.04) !important;
  background: #06101a !important; color: #e0f0f8 !important;
}
body[data-theme="mystic"]::before { background: radial-gradient(ellipse 70% 50% at 50% -10%, rgba(0,212,170,0.08) 0%, transparent 55%), radial-gradient(ellipse 40% 40% at 80% 70%, rgba(0,100,180,0.06) 0%, transparent 40%), linear-gradient(#0a1828, #06101a) !important; }
body[data-theme="mystic"] .nav-item.active { color: #00d4aa !important; background: rgba(0,212,170,0.08) !important; border-color: rgba(0,212,170,0.2) !important; }
body[data-theme="mystic"] .btn-calculate, body[data-theme="mystic"] .start-paipan-btn { background: linear-gradient(135deg, #00d4aa, #009e82) !important; color: #06101a !important; font-weight: 600 !important; box-shadow: 0 0 20px rgba(0,212,170,0.2) !important; }
body[data-theme="mystic"] .top-nav, body[data-theme="mystic"] .today-glance, body[data-theme="mystic"] .daily-fortune-card,
body[data-theme="mystic"] .decision-card, body[data-theme="mystic"] .start-paipan-entry, body[data-theme="mystic"] .feature-entry,
body[data-theme="mystic"] .input-panel, body[data-theme="mystic"] .strength-panel, body[data-theme="mystic"] .liuqin-panel,
body[data-theme="mystic"] .analysis-card, body[data-theme="mystic"] .tg-item, body[data-theme="mystic"] .dayun-card,
body[data-theme="mystic"] .title-card, body[data-theme="mystic"] .verdict-banner, body[data-theme="mystic"] .layer-head {
  background-color: rgba(10,24,40,0.88) !important;
  border-color: rgba(0,212,170,0.06) !important;
}
body[data-theme="mystic"] .dfc-advice { background: rgba(0,212,170,0.08) !important; color: #00d4aa !important; }
body[data-theme="mystic"] .vs-num { text-shadow: 0 0 12px rgba(0,212,170,0.4) !important; color: #00d4aa !important; }
body[data-theme="mystic"] .tc-name { text-shadow: 0 0 14px rgba(0,212,170,0.3) !important; }
body[data-theme="mystic"] .tg-item:nth-child(1) .tg-value { color: #00d4aa !important; text-shadow: 0 0 6px rgba(0,212,170,0.3) !important; }
body[data-theme="mystic"] .tg-item:nth-child(2) .tg-value { color: #ff6b9d !important; }
body[data-theme="mystic"] .tg-item:nth-child(3) .tg-value { color: #fbbf24 !important; }
body[data-theme="mystic"] .tg-item:nth-child(4) .tg-value { color: #60a5fa !important; }
body[data-theme="mystic"] .today-glance { border-top-color: rgba(0,212,170,0.25) !important; }
body[data-theme="mystic"] .daily-fortune-card { border-top-color: rgba(251,191,36,0.25) !important; }
body[data-theme="mystic"] .decision-card { border-top-color: rgba(255,107,157,0.25) !important; }
body[data-theme="mystic"] header .header-ornament { background: linear-gradient(90deg, transparent, #00d4aa, transparent) !important; }

/* ===== 排盘面板直接显示在标题下方 ===== */

/* 用 flexbox order 重新排列首页元素 */
#viewSingle { display: flex; flex-direction: column; }
#viewSingle > header { order: 1; }
#viewSingle > .input-panel { order: 2; display: block !important; }
#viewSingle > .intro-hook { order: 3; }
#viewSingle > .today-glance { order: 4; }
#viewSingle > #dailyFortuneSlot { order: 5; }
#viewSingle > .decision-card { order: 6; }
#viewSingle > .feature-grid { order: 7; }
#viewSingle > .start-paipan-entry { display: none !important; }
#viewSingle > .skeleton-loading { order: 8; }
#viewSingle > .ritual-loader { order: 8; }
#viewSingle > #placeholder { order: 9; }
#viewSingle > #result { order: 10; }
#viewSingle > .input-panel.layer-group { order: 11; }

/* cal-toggle 和 quick-input 也直接显示 */
#viewSingle .cal-toggle { display: flex !important; }
#viewSingle .quick-input-row { display: block !important; }

/* ===== 付费墙 ===== */
.paywall-card {
  margin: 24px 0; padding: 28px 24px; text-align: center;
  background-image: url('https://images.unsplash.com/photo-1543722530-d2c3201371e7?w=800&q=40&auto=format');
  background-size: cover; background-position: center; background-blend-mode: overlay;
  background-color: rgba(13,8,21,0.92);
  border: 1px solid rgba(212,168,83,0.15); border-radius: 16px;
  position: relative;
}
.pw-blur-hint { font-size: 0.72rem; color: var(--text-3,#7a7088); letter-spacing: 0.2em; margin-bottom: 16px; }
.pw-title { font-size: 1.3rem; color: var(--text-1,#f2eff6); font-weight: 600; margin-bottom: 8px; }
.pw-desc { font-size: 0.84rem; color: var(--text-2,#b8b0c8); line-height: 1.7; margin-bottom: 20px; max-width: 500px; margin-left: auto; margin-right: auto; }
.pw-plans { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; margin-bottom: 16px; }
.pw-plan { flex: 1; min-width: 200px; max-width: 260px; padding: 20px; background: rgba(13,8,21,0.7); border: 1px solid var(--border,rgba(255,255,255,0.055)); border-radius: 12px; text-align: center; position: relative; }
.pw-plan-hot { border-color: rgba(212,168,83,0.3); }
.pw-plan-badge { position: absolute; top: -10px; left: 50%; transform: translateX(-50%); background: var(--gold,#d4a853); color: #0d0815; font-size: 0.66rem; padding: 2px 10px; border-radius: 10px; font-weight: 600; }
.pw-plan-name { font-size: 0.9rem; color: var(--text-1,#f2eff6); margin-bottom: 8px; font-weight: 500; }
.pw-plan-price { margin: 12px 0; }
.pw-price-num { font-size: 2rem; color: var(--gold,#d4a853); font-weight: 700; }
.pw-price-unit { font-size: 0.76rem; color: var(--text-3,#7a7088); margin-left: 4px; }
.pw-plan-features { font-size: 0.76rem; color: var(--text-2,#b8b0c8); line-height: 1.9; text-align: left; margin-bottom: 14px; }
.pw-btn { width: 100%; padding: 10px 20px; border: none; border-radius: 8px; background: var(--gold,#d4a853); color: #0d0815; font-size: 0.84rem; font-weight: 600; cursor: pointer; font-family: inherit; transition: transform 0.1s; }
.pw-btn:hover { transform: translateY(-1px); }
.pw-btn-vip { background: linear-gradient(135deg, #c77dff, #9b59b6); color: #fff; }
.pw-guarantee { font-size: 0.72rem; color: var(--text-3,#7a7088); margin-top: 12px; }

/* Toast提示 */
.pay-toast { position: fixed; top: 20px; left: 50%; transform: translateX(-50%) translateY(-20px); background: var(--gold,#d4a853); color: #0d0815; padding: 10px 20px; border-radius: 8px; font-size: 0.84rem; font-weight: 500; opacity: 0; transition: opacity 0.3s, transform 0.3s; z-index: 9999; }
.pay-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ===== 定价页 ===== */
.pricing-page { padding: 20px 0; }
.pricing-header { text-align: center; margin-bottom: 24px; }
.pricing-title { font-size: 1.3rem; color: var(--text-1,#f2eff6); font-weight: 600; }
.pricing-sub { font-size: 0.84rem; color: var(--text-3,#7a7088); margin-top: 6px; }
.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 28px; }
@media (max-width: 768px) { .pricing-grid { grid-template-columns: 1fr; } }
.pricing-card {
  padding: 24px 18px; border-radius: 14px; text-align: center;
  background: var(--bg-surface,rgba(255,255,255,0.025)); border: 1px solid var(--border,rgba(255,255,255,0.055));
  position: relative;
}
.pricing-card.pc-hot { border-color: rgba(212,168,83,0.3); }
.pricing-card.current { border-color: rgba(74,222,128,0.3); }
.pc-badge { position: absolute; top: -10px; left: 50%; transform: translateX(-50%); background: var(--gold,#d4a853); color: #0d0815; font-size: 0.64rem; padding: 2px 10px; border-radius: 10px; font-weight: 600; }
.pc-name { font-size: 0.92rem; color: var(--text-1,#f2eff6); font-weight: 500; margin-bottom: 10px; }
.pc-price { margin: 12px 0; }
.pc-num { font-size: 2.2rem; color: var(--gold,#d4a853); font-weight: 700; }
.pc-unit { font-size: 0.74rem; color: var(--text-3,#7a7088); margin-left: 4px; }
.pc-features { list-style: none; padding: 0; text-align: left; font-size: 0.78rem; color: var(--text-2,#b8b0c8); line-height: 2; margin-bottom: 16px; }
.pc-feat-no { color: var(--text-3,#7a7088); opacity: 0.6; }
.pc-btn-wrap { margin-top: 12px; }
.pc-current-badge { font-size: 0.76rem; color: var(--jade,#4ade80); border: 1px solid rgba(74,222,128,0.3); padding: 6px 14px; border-radius: 6px; }
.pricing-faq { margin-top: 24px; }
.pf-title { font-size: 0.9rem; color: var(--text-1,#f2eff6); font-weight: 500; margin-bottom: 14px; }
.pf-item { font-size: 0.8rem; color: var(--text-2,#b8b0c8); line-height: 1.8; margin-bottom: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--border,rgba(255,255,255,0.055)); }

/* 原价划线 */
.pw-price-orig, .pc-orig { text-decoration: line-through; color: var(--text-3,#7a7088); font-size: 0.76rem; margin-right: 6px; }

/* ===== 日间清雅主题：适合白天阅读 ===== */
.theme-dot.t-light { background: linear-gradient(135deg, #f0f4f8, #dce4ec); border: 1px solid rgba(0,0,0,0.12); }

body[data-theme="light"] {
  --bg: #f5f7fa;
  --bg-2: #edf0f5;
  --ink: #1a2332;
  --ink-light: #3d4f63;
  --ink-faint: #7a8a9c;
  --vermilion: #c0392b;
  --vermilion-light: #6a120e;
  --gold: #2c6faa;
  --gold-light: #1c4f7c;
  --gold-dim: rgba(44,111,170,0.07);
  --jade: #1a8a5c;
  --jade-light: #28a06e;
  --line: rgba(26,35,50,0.08);
  --line-soft: rgba(26,35,50,0.04);
  --mu-color: #1a7a42;
  --huo-color: #c0392b;
  --tu-color: #9a7020;
  --jin-color: #4a5a70;
  --shui-color: #2c6faa;
  background: #f5f7fa !important;
  color: #1a2332 !important;
}