/* ============================================================
   五气朝元 · 春意江山图 全站背景
   - 江山图（青绿山水）固定底图
   - 暗化蒙版，保证暗色主题文字可读
   - 自上而下的竖排古籍文字，自左而右分布，缓缓流动
   - 春意花瓣飘落
   所有层 pointer-events:none，不阻挡交互
   ============================================================ */

/* 让 body 透出固定背景层（theme-bg.css 在 style.css 之后加载，故覆盖其 body 背景） */
html { background: #EFE8D8; }
body { background: transparent; }

.theme-bg {
  position: fixed; inset: 0; z-index: -3;
  pointer-events: none; overflow: hidden;
}

/* 江山图（传统青绿山水画卷） */
.theme-shanshui {
  position: absolute; inset: 0; z-index: -3;
  background: url('shanshui-painting.png') center center / cover no-repeat;
  background-color: #EFE8D8;
}

/* 明亮蒙版：宣纸暖光轻覆，透出春意青绿、整体提亮（浅色主题） */
.theme-scrim {
  position: absolute; inset: 0; z-index: -2;
  background:
    radial-gradient(ellipse at 50% 40%, rgba(253,249,239,0) 0%, rgba(248,243,230,.16) 58%, rgba(238,230,212,.38) 100%),
    linear-gradient(180deg, rgba(250,246,236,.28) 0%, rgba(248,243,230,.05) 30%, rgba(248,243,230,.05) 72%, rgba(240,234,216,.26) 100%);
}

/* 流动古籍文字层 */
.theme-flow {
  position: absolute; inset: 0; z-index: -1;
  overflow: hidden;
  mask-image: linear-gradient(180deg, transparent 0%, #000 12%, #000 88%, transparent 100%);
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 12%, #000 88%, transparent 100%);
}
.theme-col {
  position: absolute;
  top: 0;
  writing-mode: vertical-rl;
  text-orientation: upright;
  font-family: "Noto Serif SC", "Songti SC", "STSong", "FangSong", serif;
  font-size: 1.15rem;
  line-height: 2.3;
  letter-spacing: .25em;
  color: rgba(74, 52, 26, .30);
  white-space: nowrap;
  text-shadow: 0 0 2px rgba(255,250,238,.35);
  will-change: transform;
  animation-name: themeFlow;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  transform: translateY(-50%);
}
@keyframes themeFlow {
  from { transform: translateY(-50%); }
  to   { transform: translateY(0); }
}

/* 春意花瓣 */
.theme-petals {
  position: absolute; inset: 0; z-index: -1;
  overflow: hidden;
}
.theme-petal {
  position: absolute;
  top: -36px;
  background: radial-gradient(circle at 30% 30%, #ffe1ec, #f7b8cd);
  border-radius: 62% 0 62% 0;
  box-shadow: 0 0 6px rgba(247,184,205,.4);
  will-change: transform;
  animation-name: themePetal;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
@keyframes themePetal {
  0%   { transform: translateY(-10vh) translateX(0) rotate(0deg); }
  100% { transform: translateY(112vh) translateX(46px) rotate(360deg); }
}

/* 尊重「减少动态效果」偏好 */
@media (prefers-reduced-motion: reduce) {
  .theme-col, .theme-petal { animation: none !important; }
}

/* ============================================================
   浅色主题下，将 style.css 中写死的深色导航/状态栏改为宣纸浅色
   （theme-bg.css 在 style.css 之后加载，此处覆盖生效）
   ============================================================ */
.hud-bar,
.site-header,
.subnav-bar {
  background: rgba(244,238,224,.82) !important;
  color: var(--cream-dim) !important;
  border-color: var(--line) !important;
  backdrop-filter: blur(12px);
}
.terminal {
  background: rgba(244,238,224,.92) !important;
  color: var(--cream) !important;
  border-top: 1px solid var(--line-strong) !important;
}
.luopan-panel {
  background: rgba(255,252,244,.97) !important;
  color: var(--cream) !important;
}
.lp-content .lp-btn { color: #2C2418 !important; }
/* 旧的 luopan-bg 已被 theme-bg.js 取代，去掉其深色压暗叠层 */
.luopan-bg::before,
.luopan-bg::after { display: none; }