/* === CSS Variables === */
:root {
  --bg-deep: #0b0820;
  --bg-mid: #160a36;
  --bg-card: rgba(42,27,82,0.7);
  --bg-card2: rgba(24,14,52,0.62);
  --bg-input: rgba(255,255,255,0.05);
  --bg-overlay: rgba(5,3,15,0.78);

  --border-light: rgba(167,139,250,0.16);
  --border-mid: rgba(167,139,250,0.22);
  --border-strong: rgba(167,139,250,0.3);
  --border-gold: rgba(232,201,122,0.3);

  --gold: #e8c97a;
  --gold-light: #f0d68f;
  --gold-dark: #e0b15f;

  /* 强调色（深色主题=金色系；浅色主题在 light-theme.css 中换为紫色系） */
  --accent-tint: rgba(232,201,122,0.14);
  --accent-tint-soft: rgba(232,201,122,0.08);
  --accent-border: rgba(232,201,122,0.45);
  --accent-ring: rgba(232,201,122,0.7);
  --accent-dot: #e8c97a;
  --accent-gradient: linear-gradient(135deg, rgba(232,201,122,0.1), rgba(167,139,250,0.07));
  --purple: #a78bfa;
  --purple-light: #cdb8ff;
  --purple-dark: #8c80ab;
  --text-primary: #f3ecff;
  --text-body: #ece6ff;
  --text-muted: #cdbff0;
  --text-subtle: #a89ccb;
  --text-dim: #b5a9d4;
  --text-faint: #9a8fbe;
  --text-hint: #6e6690;

  --el-wood: #67c98a;
  --el-fire: #e8728f;
  --el-earth: #e8b96a;
  --el-metal: #e9e4d4;
  --el-water: #6a9ce8;

  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 26px;
  --radius-full: 999px;

  --font-serif: 'Noto Serif SC', serif;
  --font-sans: 'Noto Sans SC', sans-serif;
}

/* === Reset === */
*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  background: #0a0818;
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
  overflow: hidden;
  height: 100vh;
}

/* === Animations === */
@keyframes lltw {
  0%, 100% { opacity: 0.5; }
  50% { opacity: 0.85; }
}
@keyframes llpulse {
  0%, 100% { transform: scale(1); opacity: 0.85; }
  50% { transform: scale(1.08); opacity: 1; }
}
@keyframes llspin {
  to { transform: rotate(360deg); }
}
@keyframes llorbit {
  to { transform: rotate(360deg); }
}
@keyframes llshim {
  0% { opacity: 0.35; }
  50% { opacity: 0.7; }
  100% { opacity: 0.35; }
}
@keyframes llup {
  from { transform: translateY(40px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
@keyframes llfloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-9px); }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* === Scrollbar === */
.llscroll::-webkit-scrollbar { display: none; }
.llscroll { -ms-overflow-style: none; scrollbar-width: none; }

/* === Select styling === */
select option {
  background: #1a1138;
  color: var(--text-body);
}
select {
  -webkit-appearance: none;
  appearance: none;
}