/* ============================================================
   base.css —— 变量、重置、字体、背景
   玄幻水墨风：在古风宣纸基础上增加灵气色与层次
   ============================================================ */

:root {
  /* 原古风配色（保留） */
  --paper: #f5e6c8;
  --paper-dark: #e8d4a8;
  --paper-light: #faf6ed;
  --ink: #2c2c2c;
  --ink-light: #5a4a3a;
  --cinnabar: #b33a3a;
  --cinnabar-dark: #8b2222;
  --copper: #4a7c59;
  --copper-light: #6a9c79;
  --gold: #c9a84c;
  --gold-dark: #8b6914;
  --shadow: rgba(44, 28, 18, 0.15);

  /* 新增：灵气色系 */
  --spirit: #3a7cb8;          /* 灵力青蓝 */
  --spirit-light: #6ab8d8;
  --spirit-glow: rgba(58, 124, 184, 0.4);
  --purple-gold: #8b4cb8;     /* 高阶紫金 */
  --demon-red: #6b1818;       /* 魔道暗红 */
  --jade: #4a9c79;            /* 灵玉绿 */

  /* 境界色 */
  --realm-fan: #888888;       /* 凡境 */
  --realm-lianqi: #4a9c79;    /* 练气 */
  --realm-zhuji: #3a7cb8;     /* 筑基 */
  --realm-jindan: #c9a84c;    /* 金丹 */
  --realm-yuanying: #8b4cb8;  /* 元婴 */
  --realm-huashen: #b33a8b;   /* 化神 */
  --realm-dujie: #c0392b;     /* 渡劫 */
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  font-family: 'Noto Sans SC', sans-serif;
  color: var(--ink);
  min-height: 100vh;
  overflow-x: hidden;
}

/* 玄幻水墨背景：远景山水 + 前景宣纸 */
body {
  background: var(--paper);
  background-image:
    /* 远景山影 */
    radial-gradient(ellipse 800px 200px at 20% 15%, rgba(58,124,184,0.06) 0%, transparent 60%),
    radial-gradient(ellipse 600px 150px at 80% 20%, rgba(139,76,184,0.05) 0%, transparent 60%),
    radial-gradient(ellipse 1000px 300px at 50% 90%, rgba(74,124,89,0.08) 0%, transparent 60%),
    /* 灵气光点 */
    radial-gradient(circle at 15% 40%, rgba(106,184,216,0.12) 0%, transparent 2%),
    radial-gradient(circle at 85% 60%, rgba(106,184,216,0.10) 0%, transparent 2%),
    radial-gradient(circle at 45% 80%, rgba(201,168,76,0.10) 0%, transparent 2%),
    /* 宣纸纹理 */
    radial-gradient(ellipse at 20% 30%, rgba(200,180,140,0.15) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 70%, rgba(180,160,120,0.1) 0%, transparent 50%),
    repeating-linear-gradient(0deg, transparent, transparent 28px, rgba(139,105,20,0.03) 28px, rgba(139,105,20,0.03) 29px);
  background-attachment: fixed;
}

/* 滚动条 */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--paper-dark); }
::-webkit-scrollbar-thumb { background: var(--gold-dark); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--copper); }

/* 链接与按钮基础 */
button {
  font-family: inherit;
  cursor: pointer;
  border: none;
  background: none;
  color: inherit;
}

button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

/* 通用文字 */
.serif { font-family: 'Noto Serif SC', serif; }
.calligraphy { font-family: 'Ma Shan Zheng', 'Noto Serif SC', serif; }

/* 灵气光效动画 */
@keyframes spirit-glow {
  0%, 100% { opacity: 0.4; transform: scale(1); }
  50% { opacity: 0.8; transform: scale(1.1); }
}

@keyframes breakthrough-flash {
  0% { box-shadow: 0 0 0 0 var(--spirit-glow); }
  50% { box-shadow: 0 0 30px 10px var(--spirit-glow); }
  100% { box-shadow: 0 0 0 0 var(--spirit-glow); }
}

@keyframes fade-in {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.fade-in { animation: fade-in 0.4s ease-out; }