/* mobile.css —— 手机端适配（<=768px / <=480px），由子代理 A 维护
 * 加载顺序：common.css -> novel.css -> mobile.css(本文件)，同优先级规则按顺序覆盖 novel.css。
 * 约定：
 *   1) 本文件只写媒体查询，不定义全局基础样式，桌面端行为零改动。
 *   2) 不对 .toast / .pcode-result 等由 JS 切换 [hidden] 的元素设置 display，避免破坏其隐藏逻辑。
 *   3) 不使用 JS、不引入外部字体/依赖、不改动配色体系。
 * 断点：<=768px（平板 / 大屏手机）、<=480px（小屏手机，覆盖 375x812 / 414x896）。
 */

/* ==================== 平板 / 大屏手机：<=768px ==================== */
@media (max-width: 768px) {
  /* --- 基础：字号自适应 + 图片不溢出 --- */
  html { -webkit-text-size-adjust: 100%; }
  body { -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; }
  img { max-width: 100%; height: auto; }

  /* --- 顶栏：加大可点区域 --- */
  .top-bar { padding: 10px 0; }
  .top-bar-inner { padding: 0 12px; }
  .nav-more { display: inline-flex; align-items: center; min-height: 40px; padding: 8px 12px; }
  .top-nav { padding: 6px 8px 10px; }
  .top-nav a { display: flex; align-items: center; min-height: 44px; padding: 10px 14px; font-size: 15px; }

  /* --- 页面容器 --- */
  .page-wrap { margin: 12px auto 28px; padding: 0 12px; }
  .page-card { padding: 16px; border-radius: 10px; }
  .page-title { font-size: 19px; line-height: 1.4; }
  .page-subtitle { font-size: 13px; margin-bottom: 14px; }
  .breadcrumb { font-size: 13px; line-height: 1.6; margin-bottom: 12px; overflow-wrap: anywhere; }
  .section-title { font-size: 16px; }
  .site-footer { padding: 18px 12px; font-size: 12px; }

  /* --- 筛选面板：分类标签横向滚动（首屏不再被筛选占满） --- */
  .filter-panel { padding: 12px 12px 6px; margin-bottom: 14px; }
  .filter-title { font-size: 14px; margin-bottom: 10px; }
  .filter-row { align-items: center; margin-bottom: 8px; }
  .filter-label { flex: 0 0 38px; font-size: 13px; line-height: 40px; }
  .filter-tags {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    min-width: 0;
    gap: 6px;
    padding: 2px 2px 6px;
    margin: 0 -2px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  .filter-tags::-webkit-scrollbar { display: none; width: 0; height: 0; }
  .filter-tag {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    min-height: 40px;
    padding: 0 14px;
    font-size: 13px;
  }

  /* --- 搜索行 / 按钮：触控目标 >= 40px --- */
  .search-row { flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
  .search-input { flex: 1 1 100%; height: 44px; font-size: 15px; }
  .search-row .btn { flex: 1 1 calc(50% - 4px); }
  .btn { min-height: 44px; padding: 0 18px; }

  /* --- 卡片网格 --- */
  .book-grid { grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 10px; }
  .book-info { padding: 8px 10px 10px; gap: 5px; }
  .book-actions { gap: 10px; }
  .book-get, .book-preview { display: inline-flex; align-items: center; min-height: 40px; font-size: 13px; }
  .book-list .book-card { padding: 10px; gap: 12px; }
  .book-list .book-cover { width: 64px; flex: 0 0 64px; }
  .state-box { padding: 24px 0 8px; }

  /* --- 详情页：封面居中限宽、简介取消内部滚动 --- */
  .book-detail { flex-direction: column; align-items: center; gap: 16px; margin-bottom: 18px; }
  .book-detail img { width: 150px; height: 200px; flex: none; }
  .book-detail-info { width: 100%; min-width: 0; }
  .book-detail-info .page-title { text-align: center; }
  .book-meta-line { font-size: 13px; margin-bottom: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .book-intro { max-height: none; overflow: visible; font-size: 14px; line-height: 1.9; margin-bottom: 14px; }

  /* --- 目录 / 章节 --- */
  .chapter-list li { padding: 12px 0; gap: 10px; }
  .chapter-list li a { font-size: 14px; line-height: 1.6; }
  .chapter-content { font-size: 16px; line-height: 1.95; padding: 14px 2px; }
  .chapter-nav { gap: 8px; margin-top: 14px; }
  .chapter-nav .btn, .detail-actions .btn { min-height: 44px; }
  .pan-page .pan-steps { font-size: 14px; line-height: 1.9; padding-left: 18px; }

  /* --- 口令结果 / 弹窗 / 提示 --- */
  .pcode-result { max-width: 100%; margin-top: 12px; }
  .pcode-result .pcode-box, .pcode-box { padding: 12px; max-height: 240px; }
  .pcode-result .pcode-main { font-size: 20px; letter-spacing: 1px; word-break: break-all; }
  .pcode-result .btn { min-width: 0; width: 100%; }
  .modal { max-height: 86vh; overflow: auto; padding: 20px 16px; }
  .modal h3 { font-size: 16px; }
  .modal-actions { gap: 8px; }
  .toast { top: 56px; font-size: 13px; max-width: 92%; padding: 9px 16px; }
}

/* ==================== 小屏手机：<=480px（375x812 / 414x896） ==================== */
@media (max-width: 480px) {
  .page-wrap { padding: 0 10px; }
  .page-card { padding: 12px; }
  .page-title { font-size: 18px; }

  /* --- 更紧凑的卡片网格 --- */
  .book-grid { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
  .book-info { padding: 8px; gap: 4px; }
  .book-title { font-size: 13px; }
  .book-author, .book-meta { font-size: 11px; }
  .book-actions { gap: 8px; }
  .book-get, .book-preview { font-size: 12px; }

  /* --- 详情页动作：两列对齐（第三个自动占满整行） --- */
  .detail-actions { gap: 8px; }
  .detail-actions .btn, .chapter-nav .btn { flex: 1 1 46%; min-width: 0; text-align: center; }
  /* --- 单按钮区域：整行 --- */
  /* 搜索行两个按钮并排（短标签不必整行），口令/弹窗按钮保持整行 */
  .search-row .btn { flex: 1 1 calc(50% - 4px); }
  .pcode-result .btn, .modal-actions .btn { flex: 1 1 100%; width: 100%; }

  /* --- 口令面板 / 弹窗 --- */
  .pcode-result .pcode-main { font-size: 20px; word-break: break-all; }
  .modal { padding: 18px 14px; max-height: 88vh; }
  .toast { top: 52px; max-width: 94%; }

  /* --- 筛选标签略缩，保证一行能容纳更多分类 --- */
  .filter-label { flex: 0 0 34px; font-size: 12px; }
  .filter-tag { padding: 0 12px; font-size: 12px; }
}

/* ==================== 触屏设备：取消 hover 位移 / 粘滞悬停态 ==================== */
@media (hover: none) {
  .book-card:hover { transform: none; box-shadow: none; border-color: #eef1f5; }
  .book-card:active { box-shadow: 0 2px 8px rgba(24, 144, 255, 0.12); border-color: #d6e8ff; }
  .book-title.clickable:hover { color: #222; }
  .filter-tag:hover:not(.active) { border-color: #e3e6eb; color: #444; }
  .btn-primary:hover { background: #1890ff; color: #fff; }
  .btn-plain:hover { background: #fff; color: #333; border-color: #dcdfe6; }
  .book-get:hover, .book-preview:hover { color: #1890ff; }
  .top-nav a:hover:not(.active) { color: #555; background: transparent; }
  .chapter-list li a:hover { color: #333; }
}

/* ==================== 无障碍：减少动态效果 ==================== */
@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
}