/* ============================================================
   base.css - CSS variables, reset, global styles, theme, utilities
   ============================================================ */
/* ============================================================
   墨韵书阁 - Qidian Style Blue/White Theme
   ============================================================ */
:root {
  --primary: #1a6aff;
  --primary-dark: #0052d9;
  --primary-light: #e8f1ff;
  --bg: #f5f7fa;
  --card: #ffffff;
  --text: #1a1a1a;
  --text-2: #555555;
  --text-3: #888888;
  --text-4: #aaaaaa;
  --border: #e8e8e8;
  --gold: #ff9500;
  --green: #00b42a;
  --radius: 8px;
  --shadow: 0 2px 8px rgba(0,0,0,.06);
  --shadow-lg: 0 6px 24px rgba(0,0,0,.1);
  --header-h: 60px;
}

[data-theme="dark"] {
  --bg: #16181d;
  --card: #1f232b;
  --text: #e6e8eb;
  --text-2: #b6bcc6;
  --text-3: #8a919c;
  --text-4: #6a717c;
  --border: #2e333d;
  --primary-light: #1a2a4a;
  --shadow: 0 2px 8px rgba(0,0,0,.4);
  --shadow-lg: 0 6px 24px rgba(0,0,0,.5);
}

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

html { -webkit-text-size-adjust: 100%; }

body {
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", sans-serif;
  background: var(--bg);
  color: var(--text);
  font-size: 14px;
  line-height: 1.6;
  transition: background .25s, color .25s;
}

a { color: inherit; text-decoration: none; transition: color .2s; }

a:hover { color: var(--primary); }

img { display: block; max-width: 100%; }

ul { list-style: none; }

svg { display: inline-block; vertical-align: middle; }

button { font-family: inherit; cursor: pointer; border: none; background: none; }

input { font-family: inherit; outline: none; }

mark { background: #fff3a0; color: #b8860b; padding: 0 2px; border-radius: 2px; }

[data-theme="dark"] mark { background: #6b5b1e; color: #ffe082; }

/* ============================================================
   RESPONSIVE FIXES - 20260916e
   三端适配排查修复（桌面/平板/移动）
   ============================================================ */
/* --- 全局防横向溢出 --- */
html, body { overflow-x: hidden; max-width: 100vw; }

img, video { max-width: 100%; }

/* --- Fix 10: 确保长文本不溢出容器 --- */
.novel-desc, .character-desc, .result-desc, .book-title, .rank-title {
  word-break: break-word;
  overflow-wrap: break-word;
}

/* --- Fix 20: 确保不出现横向滚动条的最后保障 --- */
.container, .layout, .novel-content, .reader, .search-hero form {
  max-width: 100%;
}