@charset "utf-8";
* { margin:0; padding:0; border:none; font-style:normal; font-weight:normal; }
html { height: 100%; }
body { background:#FFF; font-family: Verdana, Arial, "Microsoft YaHei", "Noto Sans SC", sans-serif; font-size: 12px; text-align: center; color:#333; height:100vh; overflow-x:auto; display:flex; flex-direction:column; }
a { text-decoration:none; color:#236D9B; }
a:hover { color:#000; }
ul { list-style:none; }
strong { font-weight:bold; }

/* ===== Top Bar (fixed) ===== */
#top-bar {
  position:fixed; top:0; left:0; width:100%; z-index:1000;
  background: linear-gradient(to bottom, #1c1c1c 0%, #1c1c1c 30%, #2c5571 70%, rgba(44,85,113,0.2) 85%, rgba(44,85,113,0) 100%);
  height: auto;
  padding-bottom: 12px;
  pointer-events: none;
}
#top-bar .box { width:990px; height:52px; margin:0 auto; padding:0; text-align:center; position:relative; pointer-events: auto; }
#top-bar a { color:#D8E7F1; }

/* ===== Header (scrollable below top-bar) ===== */
#head {
  width:100%;
  background: linear-gradient(to bottom, #2c5571 0%, #044c72 25%, #1a618d 60%, #e8f0f5 90%, #fff 100%);
}
#head .box { width:990px; margin:52px auto 0; padding:0; text-align:center; position:relative; }
#head .box::after { content:''; display:block; clear:both; }
#head a { color:#D8E7F1; }
#logo { float:left; margin:8px 0 0 10px; width:136px; }
#logo h1 { font-size:17px; font-weight:bold; color:#fff; line-height:22px; letter-spacing:4px; text-align:center; text-shadow:0 1px 2px rgba(0,0,0,0.3); margin:0; font-family:'Microsoft YaHei','微软雅黑',sans-serif; }
#logo .logo-en { display:block; font-family:'Palatino Linotype','Book Antiqua',Palatino,serif; font-size:14px; color:#c9a84c; line-height:18px; letter-spacing:1.8px; text-align:center; font-weight:normal; font-variant:small-caps; }
#headFunction { height:28px; float:right; padding:0 10px; margin-top:18px; }
#headFunction .links { text-align:right; font-size:12px; line-height:28px; }
#headFunction .links a { padding:0 8px; color:#D8E7F1; }
#headFunction .links a:hover { text-decoration:underline; }

/* ===== Navigation (独立立体导航条) ===== */
#mainNav {
  height:30px; width:970px; float:left;
  margin:10px 0 0 10px; position:relative; clear:both;
  background:linear-gradient(to bottom, #2a6288, #0f3a57);
  border:1px solid #387aa3;
  border-top-color:#4d9ec9;
  border-radius:4px;
  box-shadow:0 2px 6px rgba(0,0,0,0.35);
}
#mainNav li { float:left; position:relative; }
#mainNav li a {
  display:block; float:left;
  line-height:28px; font-size:14px; padding:0 18px;
  font-weight:bold; color:#E8F0F5;
  text-shadow:0 1px 1px rgba(0,0,0,0.3);
  border-right:1px solid rgba(0,0,0,0.25);
}
#mainNav li:first-child a { border-radius:3px 0 0 3px; }
#mainNav li a:hover { background:rgba(255,255,255,0.12); color:#FFF; }
#mainNav li a .nav-en { font-size: 10px; font-weight: normal; color: #8BB5D0; margin-left: 3px; }
/* Dropdowns */
#mainNav li ul { display:none; position:absolute; top:26px; left:0; background:#D8E7F1; width:88px; border:1px solid #2E6A96; z-index:1001; padding:4px 0; }
#mainNav li ul li { float:left; width:88px; border-bottom:1px solid #2E6A96; }
#mainNav li ul li a { font-weight:normal; font-size:12px; line-height:28px; width:74px; text-align:center; padding:0 7px; color:#2A5879; border:none; text-shadow:none; }
#mainNav li ul li a:hover { background:#2E6A96; color:#D8E7F1; }
#mainNav li ul li:last-child { border-bottom:none; }
#mainNav li ul.wide-menu .menu-col { float:left; width:88px; }
#mainNav li ul.wide-menu .menu-col li { width:88px; }
#mainNav li ul.wide-menu .menu-col li a { width:74px; text-align:center; }
#mainNav li ul.en-menu { width:176px; }
#mainNav li ul.en-menu .menu-col { width:88px; }
#mainNav li ul.en-menu .menu-col li { width:88px; }
#mainNav li ul.en-menu .menu-col li a { width:74px; text-align:center; }

/* ===== Carousel & Welcome Row ===== */
#carousel { width:45%; margin:10px 0 0 10px; float:left; color:#F0F5F7; position:relative; }
#carousel dl { display:none; width:100%; position:relative; min-height:140px; }
#carousel dl.current { display:block; }
#carousel .cover { display:block; float:left; width:100px; height:130px; margin-right:12px; border:4px solid #D8E7F1; border-radius:3px; overflow:hidden; }
#carousel .cover img { width:100%; height:100%; object-fit:cover; }
#carousel dt { font-size:15px; line-height:24px; margin-bottom:6px; font-weight:bold; float:right; width:calc(100% - 120px); text-align:center; }
#carousel .intro { width:calc(100% - 120px); text-indent:10px; text-align:left; float:right; height:65px; font-size:12px; line-height:18px; overflow:hidden; }
#carousel .tag { position:absolute; bottom:4px; right:0; }
#carousel .tag a { display:inline-flex; align-items:center; justify-content:center; width:14px; height:14px; margin:0 1px; background:#1F6D9C; border:2px solid #3D9DD8; font-size:8px; border-radius:50%; color:#D8E7F1; cursor:pointer; }
#carousel .tag a:hover, #carousel .tag a.cur { background:#3D9DD8; color:#FFF; font-weight:bold; }

#welcome { width:45%; float:right; height:145px; margin-right:10px; color:#FFF; text-align:left; background:url(/static/images/news.jpg) center/cover no-repeat; position:relative; box-shadow:inset 0 0 35px 15px rgba(4,76,114,0.55); display:flex; flex-direction:column; }
#welcome:after { content:''; position:absolute; top:0; left:0; width:100%; height:100%; background:radial-gradient(ellipse 85% 85% at center, rgba(0,0,0,0.38) 0%, rgba(0,0,0,0.25) 55%, transparent 100%); pointer-events:none; }
#welcome h1 { margin:10px 0 6px; font-size:13px; line-height:18px; text-align:left; position:relative; z-index:1; }
#welcome h1 strong { color:#FFD700; font-weight:bold; }
#welcome-extra { text-align:left; position:relative; z-index:1; padding:10px; font-size:12px; overflow-y:auto; flex:1; }

/* ===== Nav-bar inline search (右侧站内搜索) ===== */
#mainNav .nav-search { float:right; margin:0; padding:0 10px; height:28px; display:flex; align-items:center; }
#mainNav .nav-search form { display:flex; align-items:center; gap:6px; }
#mainNav .nav-search input[type="text"] {
  width:180px; height:22px; line-height:22px;
  padding:0 8px; border:1px solid rgba(255,255,255,0.4);
  background:rgba(255,255,255,0.18); color:#fff; font-size:12px;
  border-radius:2px; outline:none;
}
#mainNav .nav-search input[type="text"]::placeholder { color:rgba(255,255,255,0.65); }
#mainNav .nav-search input[type="text"]:focus { border-color:#fff; background:rgba(255,255,255,0.28); }
#mainNav .nav-search input[type="submit"] {
  height:28px; padding:0 12px;
  border:none; background:transparent;
  color:#E8F0F5; font-size:14px; font-weight:bold;
  text-shadow:0 1px 1px rgba(0,0,0,0.3);
  cursor:pointer;
}
#mainNav .nav-search input[type="submit"]:hover { color:#FFF; background:rgba(255,255,255,0.12); }

/* Unread message badge in #nav-user (toggle .is-active to show) */
.msg-badge { display:none; color:#FF4444; font-weight:bold; margin-right:6px; }
.msg-badge.is-active { display:inline; }

/* ===== User dropdown menu (header right) ===== */
#nav-user { display:inline-flex; align-items:center; vertical-align:middle; }
.user-menu { position:relative; display:inline-block; }
.user-trigger {
  display:inline-flex; align-items:center; gap:4px;
  padding:0 6px; line-height:28px; color:#D8E7F1; cursor:pointer;
  max-width:160px;
}
.user-trigger .user-name {
  display:inline-block; max-width:120px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  vertical-align:bottom;
}
.user-trigger .user-caret { font-size:10px; color:#FFD700; }
.user-menu:hover .user-trigger { color:#fff; }
.user-dropdown {
  display:none; position:absolute; top:100%; right:0;
  width:88px; background:#D8E7F1; border:1px solid #2E6A96;
  padding:4px 0;
  z-index:1100;
  box-sizing:border-box;
}
.user-menu:hover .user-dropdown { display:block; }
.user-dropdown .um-item,
.user-dropdown .um-points-link {
  display:block;
  padding:0 14px; font-size:12px; line-height:28px;
  color:#2A5879; text-align:center;
  border-bottom:1px solid #2E6A96;
}
.user-dropdown .um-item:last-child,
.user-dropdown .um-points-link:last-child { border-bottom:none; }
#headFunction .links .user-dropdown a.um-item,
#headFunction .links .user-dropdown a.um-points-link { color:#2A5879; padding:0 14px; }
.user-dropdown .um-item:hover,
.user-dropdown .um-points-link:hover { background:#2E6A96; color:#D8E7F1; }
#headFunction .links .user-dropdown a.um-item:hover,
#headFunction .links .user-dropdown a.um-points-link:hover { color:#D8E7F1; }
.user-dropdown .um-points-link { padding:0; }
.user-dropdown .um-points {
  padding:6px 4px; background:#c9def0; border-bottom:1px solid #2E6A96;
  color:#2A5879; font-size:12px; line-height:1.4; text-align:center;
}
.user-dropdown .um-points-label,
.user-dropdown .um-points-num { display:block; }
.user-dropdown .um-points-num { white-space:nowrap; }
.user-dropdown .um-points strong { color:#1a3f5e; font-size:13px; margin:0 2px; }

/* ===== Sub-head: Breadcrumb + Search (category/detail pages) ===== */
.sub-head {
  max-width: 1400px;
  width: 95%;
  margin: 0 auto;
  overflow: hidden;
}
.sub-head-inner {
  width: calc(100% - 30px);
  height: 40px;
  margin: 0 0 0 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: linear-gradient(to bottom, #2a6288, #5a9abb 30%, #8bb8d0 60%, #b0d0e0);
  border-bottom: 1px solid #8bb8d0;
}
.sh-bread {
  font-size: 12px;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-left: 18px;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}
.sh-bread a { color: #fff; }
.sh-bread a:hover { color: #e0f0ff; }
.sh-search { flex: none; padding-right: 18px; }
.sh-search form { display: flex; align-items: center; gap: 6px; }
.sh-search input[type="text"] {
  width: 180px; height: 24px; line-height: 24px;
  padding: 0 8px; border: 1px solid rgba(255,255,255,0.4);
  background: rgba(255,255,255,0.2); color: #fff; font-size: 12px;
  border-radius: 2px; outline: none;
}
.sh-search input[type="text"]::placeholder { color: rgba(255,255,255,0.6); }
.sh-search input[type="text"]:focus { border-color: #fff; background: rgba(255,255,255,0.3); }
.sh-search input[type="submit"] {
  width: 65px; height: 26px; border: 1px solid rgba(255,255,255,0.35);
  background: rgba(255,255,255,0.1); color: #fff; font-size: 12px;
  cursor: pointer; border-radius: 6px; transition:all 0.2s;
}
.sh-search input[type="submit"]:hover { background: rgba(255,255,255,0.25); }

/* ===== Container ===== */
#container { text-align:left; margin:0 auto; max-width:1400px; width:95%; background:#FFF; overflow:hidden; padding-top:10px; padding-bottom:20px; flex:1; }
#blocks-container { float:left; width:475px; margin-left:15px; }
#sidebar { float:right; width:475px; margin-right:15px; }

/* ===== Unified Page Shell (parchment + reserved banner zones) ===== */
#page-shell { width:990px; margin:0 auto; flex:1; display:flex; flex-direction:column; min-height:0; }
.banner-top, .banner-bottom { width:990px; height:30px; box-sizing:border-box; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.banner-top:empty, .banner-bottom:empty { /* keep reserved height even when empty */ }
.flash-msgs { max-width:960px; margin:0 auto 8px; flex-shrink:0; }
.flash-msgs p { font-size:12px; padding:6px 10px; border-radius:2px; margin-bottom:4px; background:#e8f5e9; color:#2e7d32; border:1px solid #c8e6c9; }
.flash-msgs p.flash-error { background:#fbe9e7; color:#c62828; border-color:#ffccbc; }

/* Homepage opts out of parchment scroll: keep shell width + banner slots, drop the 羊皮卷 backgrounds */
body.home .page-top, body.home .page-bot { display:none; }
body.home .page-mid { background:transparent; padding:0 10px; color:inherit; font-size:inherit; line-height:inherit; display:flex; flex-direction:column; }
body.home .page-mid a:not(.btn-action) { color:inherit; }
body.home .page-mid a:not(.btn-action):hover { color:inherit; }

/* ===== Block: Latest Updates ===== */
.banner { display:block; height:24px; line-height:24px; width:100%; border-top:2px solid #999; border-bottom:2px solid #999; margin:8px 0; font-size:13px; font-weight:bold; color:#333; text-indent:10px; }
#latest { width:100%; float:left; }
#latest .top5 dl { width:100%; padding:6px 0; margin:0; float:left; border-bottom:1px dotted #CCC; }
#latest .top5 .cover-wrap { float:right; width:100px; height:130px; margin-left:10px; background:#f5f5f5; border:1px solid #ddd; overflow:hidden; }
#latest .top5 .cover-wrap img { width:100%; height:100%; object-fit:cover; }
#latest .top5 .book-info { float:left; width:340px; }
#latest .top5 .enTitle { font-weight:bold; font-size:14px; line-height:22px; color:#236D9B; }
#latest .top5 .cnTitle { color:#999; font-size:13px; line-height:20px; }
#latest .top5 .author { color:#999; font-style:italic; font-size:12px; line-height:18px; }
#latest .top5 .author span { margin-left:6px; font-style:normal; }
#latest .top5 .type { line-height:20px; font-size:11px; }
#latest .top5 .type a { color:#B2B2B2; }
#latest .top5 .intro { font-size:12px; line-height:18px; color:#555; margin-top:4px; max-height:36px; overflow:hidden; }

/* ===== Block: Category Tabs ===== */
#latestTag { width:100%; float:left; margin-top:10px; }
#category-tabs { width:100%; }
#category-tabs > li { float:left; }
#category-tabs > li h1 { width:90px; line-height:32px; font-size:13px; text-align:center; float:left; background:#eee; cursor:pointer; border:1px solid #ddd; margin-right:2px; border-radius:3px 3px 0 0; }
#category-tabs > li.current h1 { background:#FFF; border-bottom:1px solid #FFF; font-weight:bold; color:#236D9B; }
#category-tabs > li ul { display:none; clear:both; width:100%; border:1px solid #ddd; padding:8px; margin-top:-1px; background:#FFF; min-height:200px; }
#category-tabs > li.current ul { display:block; }
#category-tabs ul li { line-height:24px; border-bottom:1px dashed #eee; }
#category-tabs ul li a { color:#236D9B; display:block; }
#category-tabs ul li a:hover { color:#000; }

/* ===== Sidebar: Categories ===== */
.s-block { width:100%; float:left; margin-bottom:15px; }
.s-title { height:26px; line-height:26px; font-size:13px; font-weight:bold; color:#333; border-bottom:2px solid #004A6E; margin-bottom:8px; padding-left:5px; }
#cat-list li { float:left; width:100%; line-height:26px; border-bottom:1px dotted #eee; font-size:12px; }
#cat-list li a { color:#236D9B; }
#cat-list li a:hover { color:#000; }
#cat-list .cat-divider { border-top:2px solid #004A6E; margin-top:4px; padding-top:4px; }

/* ===== Sidebar: Top Books ===== */
#top-list { width:100%; }
#top-list dl { float:left; width:100%; padding:5px 0; border-bottom:1px dotted #eee; }
#top-list .rank { float:left; width:20px; font-weight:bold; font-size:14px; color:#999; line-height:40px; }
#top-list .rank.top1 { color:#FF4400; }
#top-list .rank.top2 { color:#FF6600; }
#top-list .rank.top3 { color:#FF9900; }
#top-list .t-cover { float:left; width:36px; height:48px; margin:0 8px; background:#f0f0f0; overflow:hidden; }
#top-list .t-cover img { width:100%; height:100%; object-fit:cover; }
#top-list .t-info { float:left; width:170px; }
#top-list .t-title { font-size:12px; font-weight:bold; color:#236D9B; line-height:18px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
#top-list .t-author { font-size:11px; color:#999; font-style:italic; }

/* ===== Bottom Section ===== */
.bottom-row {
  display: flex;
  gap: 15px;
  margin: 0;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}
.bottom-left {
  flex: 1;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-rows: minmax(0, 5fr) minmax(0, 2.5fr) minmax(0, 2.5fr);
  gap: 8px;
  text-align: left;
}
.content-latest {
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

/* === Left: Grid Cells === */
#dl-rank, #reading-rank, #pack-download, #recent-new, #upload-rank {
  display: flex;
  flex-direction: column;
  border: 1px solid #d0d0d0;
  min-height: 0;
}
#pack-download, #recent-new, #upload-rank { overflow: hidden; }
#upload-rank { grid-column: 1 / -1; }
#dl-rank { background: #f7f7f7; }
#reading-rank { background: #fafafa; }
#pack-download { background: #f2f6f9; }
#recent-new { background: #f8f8f8; }
#upload-rank { background: #fcfcfc; }

/* === Banners === */
.bottom-row .banner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 24px;
  line-height: 24px;
  padding: 0 6px;
  border-top: 2px solid #bbb;
  border-bottom: 2px solid #bbb;
  flex-shrink: 0;
  margin: 0;
  box-sizing: border-box;
  width: 100%;
  text-indent: 0;
  font-size: 13px;
  font-weight: bold;
  color: #333;
}
.bottom-row .banner .bn-en,
.bottom-row .banner .bn-cn {
  color: #333;
  font-size: 13px;
  font-weight: bold;
  white-space: nowrap;
}

/* === List containers === */
#dl-list, #reading-rank .rec-list, #pack-list, #recent-new .rec-list {
  flex: 1;
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  min-height: 0;
}

/* === 下载排行 === */
#dl-list li {
  flex: 1;
  display: flex;
  align-items: center;
  border-bottom: 1px dotted #ddd;
  position: relative;
  min-height: 0;
}
#dl-list li:last-child { border-bottom: none; }
#dl-list .rank-num {
  width: 18px;
  flex-shrink: 0;
  text-align: center;
  font-weight: bold;
  font-size: 12px;
  color: #999;
}
#dl-list .rank-num.top1 { color: #FF4400; font-size: 14px; }
#dl-list .rank-num.top2 { color: #FF6600; font-size: 13px; }
#dl-list .rank-num.top3 { color: #FF9900; font-size: 13px; }
#dl-list .dl-title {
  flex: 1;
  font-size: 12px;
  color: #236D9B;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding-left: 4px;
}
#dl-list .cat {
  flex-shrink: 0;
  font-size: 10px;
  color: #bbb;
  padding-right: 8px;
}
#dl-list li .about {
  display: none;
  position: absolute;
  left: 0; right: 0;
  top: 100%;
  z-index: 20;
  border: 1px solid #d0d0d0;
  border-top: none;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
  padding: 4px;
  background: #f5f8fa;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
}
#dl-list li:hover .about { display: flex; gap: 6px; }
#dl-list li:hover { background: #f5f8fa; }
#dl-list .about .cover-thumb {
  width: 32px; height: 42px;
  flex-shrink: 0;
  border: 1px solid #ccc;
  overflow: hidden;
  background: #fff;
}
#dl-list .about .cover-thumb img { width: 100%; height: 100%; object-fit: cover; }
#dl-list .about .about-text {
  font-size: 10px;
  line-height: 14px;
  color: #666;
  max-height: 42px;
  overflow: hidden;
}

/* === 阅读排行 === */
#reading-rank .rec-list li {
  flex: 1;
  display: flex;
  align-items: center;
  border-bottom: 1px dotted #e5e5e5;
  position: relative;
  min-height: 0;
}
#reading-rank .rec-list li:last-child { border-bottom: none; }
#reading-rank .rec-list li .rank-num {
  width: 18px;
  flex-shrink: 0;
  text-align: center;
  font-weight: bold;
  font-size: 11px;
  color: #999;
}
#reading-rank .rec-list li .rank-num.top1 { color: #FF4400; font-size: 13px; }
#reading-rank .rec-list li .rank-num.top2 { color: #FF6600; font-size: 12px; }
#reading-rank .rec-list li .rank-num.top3 { color: #FF9900; font-size: 12px; }
#reading-rank .rec-list li .cnTitle {
  flex: 1;
  font-size: 12px;
  color: #236D9B;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding-left: 4px;
}
#reading-rank .rec-list li .cat {
  flex-shrink: 0;
  font-size: 10px;
  color: #bbb;
  padding-right: 8px;
}
#reading-rank .rec-list li .about {
  display: none;
  position: absolute;
  left: 0; right: 0;
  top: 100%;
  z-index: 20;
  border: 1px solid #d0d0d0;
  border-top: none;
  padding: 6px 8px;
  background: #f5f8fa;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
  min-width: 0;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}
#reading-rank .rec-list li:hover .about { display: flex; gap: 8px; }
#reading-rank .rec-list li:hover { background: #f5f8fa; }
#reading-rank .rec-list li .about .outer {
  width: 50px; height: 66px;
  flex-shrink: 0;
  border: 1px solid #ddd;
  overflow: hidden;
  background: #fff;
}
#reading-rank .rec-list li .about .inner {
  width: 50px; height: 66px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
#reading-rank .rec-list li .about .enTitle { font-size: 12px; font-weight: bold; color: #333; line-height: 18px; overflow-wrap: break-word; word-break: break-word; min-width: 0; }
#reading-rank .rec-list li .about .enAuthor { font-size: 11px; color: #666; line-height: 16px; font-style: italic; overflow-wrap: break-word; word-break: break-word; min-width: 0; }
#reading-rank .rec-list li .about .cnAuthor { font-size: 10px; color: #999; line-height: 14px; overflow-wrap: break-word; word-break: break-word; min-width: 0; }

/* === 打包下载 */
#pack-list {
  overflow-y: auto;
  flex: 1;
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  min-height: 0;
}
#pack-list li {
  display: flex;
  align-items: center;
  border-bottom: 1px dotted #ddd;
  padding: 0 8px;
  min-height: 28px;
  flex-shrink: 0;
}
#pack-list li:last-child { border-bottom: none; }
#pack-list .pack-name {
  flex: 1;
  font-size: 12px;
  color: #236D9B;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#pack-list .pack-size {
  font-size: 10px;
  color: #999;
  margin-right: 10px;
  flex-shrink: 0;
}
/* ===== Pack download button (毛玻璃风格) ===== */
#pack-list .pack-cost {
  font-size: 10px;
  color: #e68a00;
  margin-right: 8px;
  flex-shrink: 0;
  font-weight: bold;
}
#pack-list li .btn-action { font-size:11px; }

/* === 最近上新 === */
#recent-new .rec-list li {
  flex: 1;
  display: flex;
  align-items: center;
  border-bottom: 1px dotted #e5e5e5;
  padding: 0 8px;
  min-height: 0;
}
#recent-new .rec-list li:last-child { border-bottom: none; }
#recent-new .rec-list li .cnTitle {
  flex: 1;
  font-size: 12px;
  color: #236D9B;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
#recent-new .rec-list li .cat {
  flex-shrink: 0;
  font-size: 10px;
  color: #bbb;
  padding-right: 8px;
}
#recent-new .rec-list li .new-date {
  font-size: 10px;
  color: #aaa;
  flex-shrink: 0;
}

/* === 书友上传 === */
#upload-rank .upload-scroll {
  flex: 1;
  overflow: hidden;
  position: relative;
  min-height: 0;
}
#upload-list { margin: 0; padding: 0; }
#upload-list.scrolling { animation: scrollUp 50s linear infinite; }
@keyframes scrollUp {
  0% { transform: translateY(0); }
  100% { transform: translateY(-50%); }
}
#upload-list li {
  display: flex;
  align-items: center;
  border-bottom: 1px dotted #ddd;
  padding: 0 8px;
  min-height: 24px;
}
#upload-list li:last-child { border-bottom: none; }
#upload-list .ul-title {
  font-size: 12px;
  color: #236D9B;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
#upload-list .ul-title a { color: inherit; text-decoration: none; }
#upload-list .ul-title a:hover { text-decoration: underline; }
#upload-list .ul-user {
  font-size: 11px;
  color: #666;
  margin-left: 4px;
  flex-shrink: 0;
}
#upload-list .ul-date {
  font-size: 10px;
  color: #aaa;
  margin-left: 6px;
  flex-shrink: 0;
}
#upload-list .ul-pts {
  font-size: 10px;
  color: #e68a00;
  margin-left: 4px;
  flex-shrink: 0;
}

/* === 右栏: 书籍推荐 === */
.content-latest .rec-section {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  border: 1px solid #d0d0d0;
  background: #fff;
  text-align: left;
}
.content-latest .top5 {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-rows: repeat(5, minmax(0, 1fr));
}
.content-latest .top5 dl {
  display: flex;
  position: relative;
  min-height: 0;
  padding: 6px 0;
  border-bottom: 1px dotted #ccc;
}
.content-latest .top5 dl:last-child { border-bottom: none; }
.content-latest .top5 .cover-wrap {
  flex: none;
  width: 60px;
  height: 80px;
  margin: auto 10px auto 0;
  border: 1px solid #ddd;
  overflow: hidden;
  background: #f5f5f5;
  align-self: center;
}
.content-latest .top5 .cover-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.content-latest .top5 .book-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.content-latest .top5 .enTitle {
  flex-shrink: 0;
  font-weight: bold;
  font-size: 13px;
  line-height: 20px;
}
.content-latest .top5 .enTitle a { color: #236D9B; text-decoration: none; }
.content-latest .top5 .enTitle a:hover { color: #000; }
.content-latest .top5 .author-type {
  flex-shrink: 0;
  color: #999;
  font-size: 11px;
  line-height: 16px;
  margin-bottom: 8px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.content-latest .top5 .intro {
  flex: 1;
  font-size: 11px;
  line-height: 16px;
  color: #236D9B;
  overflow: hidden;
}
.content-latest .top5 .intro a {
  color: inherit;
  text-decoration: none;
  display: block;
}
.content-latest .top5 dl:has(.intro:hover) .about {
  display: flex;
  align-items: center;
}
.content-latest .top5 dl .about {
  display: none;
  position: absolute;
  inset: -1px;
  z-index: 20;
  padding: 10px 12px;
  pointer-events: none;
  background: #f5f8fa;
  border: 1px solid #d0d0d0;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
  font-size: 11px;
  line-height: 16px;
  color: #236D9B;
  font-weight: bold;
}
.content-latest .top5 .book-tag {
  display: inline-block;
  font-size: 9px;
  font-weight: bold;
  padding: 0 5px;
  margin-left: 6px;
  line-height: 16px;
  border-radius: 2px;
  vertical-align: middle;
}
.content-latest .top5 .tag-rec { background: #d9534f; color: #fff; }
.content-latest .top5 .tag-new { background: #5cb85c; color: #fff; }
.content-latest .top5 .type { line-height: 18px; font-size: 11px; }
.content-latest .top5 .type a { color: #B2B2B2; text-decoration: none; }
.content-latest .top5 .type a:hover { color: #b2b2b2; }

/* ===== Footer ===== */
#footer { width:100%; min-height:60px; background:linear-gradient(to bottom, #fff 0%, #e8f0f5 8%, #1a618d 30%, #044c72 70%, #1c1c1c 100%); }
#footer .box { width:990px; margin:0 auto; overflow: hidden; }
#footer .catList { padding:15px 10px; float:left; width:100%; box-sizing:border-box; text-align:left; font-size:12px; }
#footer .catList a { color:#9EBEDE; }
#footer .catList a:hover { color:#FFF; text-decoration:underline; }
#footer .catList .cat-group { float:left; width:180px; margin-right:15px; }
#footer .catList h3 { font-size:14px; font-weight:bold; color:#6699CC; line-height:28px; border-bottom:1px solid #2D648E; margin-bottom:6px; }
#footer .catList li { line-height:22px; }
#footer .catList li a { color:#9EBEDE; font-size:12px; }
#footer .copyright { width:100%; float:left; padding:18px 10px 4px; box-sizing:border-box; }
#footer .copyright { text-align:center; }
#footer .copyright span { display:block; color:#FFF; font-size:12px; line-height:20px; }
#footer .ft-tagline { color:#9EBEDE; font-size:12px; line-height:20px; }

/* ===== 版块容器样式 (积木) ===== */
.block { float:left; width:100%; margin-bottom:15px; }
.block + .block { border-top:1px dashed #ddd; padding-top:5px; }

body { min-width:990px; overflow-x:auto; }
#top-bar .box, #head .box, #container, #footer .box { min-width:990px; }

/* ===== Login Modal ===== */
.hidden { display:none !important; }
.modal { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:9999; display:flex; align-items:center; justify-content:center; }
.modal-content { background:#fff; padding:20px 24px; border-radius:6px; max-width:320px; width:85%; position:relative; }
.modal-close { position:absolute; top:10px; right:16px; font-size:24px; cursor:pointer; color:#999; }
.modal-close:hover { color:#333; }
.modal-content h2 { font-size:18px; font-weight:bold; margin-bottom:16px; color:#333; text-align:center; }
.modal-input { width:100%; padding:10px 12px; margin-bottom:10px; border:1px solid #ddd; border-radius:4px; font-size:14px; font-family:inherit; box-sizing:border-box; }
.modal-input:focus { outline:none; border-color:#236D9B; }
.modal-hint { font-size:11px; color:#999; margin:-6px 0 8px; line-height:1.4; text-align:left; }
.modal-content .msg { font-size:12px; color:#c00; min-height:18px; margin-bottom:6px; text-align:center; }
.modal-content .btn { display:block; width:100%; padding:10px; color:#236D9B; border:1px solid rgba(35,109,155,0.3); border-radius:6px; font-size:14px; cursor:pointer; transition:all 0.2s; background:rgba(35,109,155,0.06); }
.modal-content .btn:hover { background:rgba(35,109,155,0.15); }
.modal-switch { text-align:center; font-size:12px; color:#999; margin-top:12px; }
.modal-switch a { color:#236D9B; cursor:pointer; }
.modal-switch a:hover { text-decoration:underline; }
#login-switch { display:flex; justify-content:space-between; }

/* =============================================
   Page Container (parchment style)
   Used by: category listing & book detail pages
   ============================================= */
.page-wrap {
  margin-top: 50px;
  margin-left: 15px;
  margin-right: 15px;
}
/* extra spacing when #head is suppressed（upload 页面），并居中 */
.upload-wrap {
  margin: 0 auto;
  width: 540px;
}
.upload-wrap::before {
  content: '';
  display: block;
  height: 20px;
}
/* Narrow content centered inside unified .page-mid (upload form) */
.upload-narrow { max-width:540px; margin:0 auto; }

/* Shared inner card on parchment pages (templates, packs) — unified height/bg/scrollbar */
.parchment-card {
  background: rgba(255,255,240,0.6);
  min-height: 400px;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 5px 12px;
  box-sizing: border-box;
}

/* Unified parchment scrollbar (used by .parchment-card, .tpl-grid, #pack-list-container) */
.parchment-card,
.tpl-grid,
#pack-list-container { scrollbar-width: thin; scrollbar-color: #D2A23F #f5f0e0; }
.parchment-card::-webkit-scrollbar,
.tpl-grid::-webkit-scrollbar,
#pack-list-container::-webkit-scrollbar { width: 8px; }
.parchment-card::-webkit-scrollbar-thumb,
.tpl-grid::-webkit-scrollbar-thumb,
#pack-list-container::-webkit-scrollbar-thumb { background: #D2A23F; border-radius: 4px; }
.parchment-card::-webkit-scrollbar-track,
.tpl-grid::-webkit-scrollbar-track,
#pack-list-container::-webkit-scrollbar-track { background: #f5f0e0; }

.page-top {
  height: 20px;
  font-size: 0;
  background: #ffffff url(/static/images/parchment-top.jpg) no-repeat;
  background-size: 100% 20px;
  flex-shrink: 0;
}
.page-mid {
  padding: 10px 15px;
  color: #6C531E;
  background: #ffffff url(/static/images/parchment-bg.jpg) repeat-y;
  background-size: 100% auto;
  font-size: 12px;
  line-height: 1.6;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

.page-mid a { color: #6C531E; }
.page-mid a:hover { color: #FFFFFF; }
.page-bot {
  height: 20px;
  font-size: 0;
  background: #ffffff url(/static/images/parchment-bottom.jpg) no-repeat;
  background-size: 100% 20px;
  flex-shrink: 0;
}

/* ===== 广告位预留 ===== */
.ad-spacer { height:60px; margin:10px 15px 0; }

/* ===== Page Layout (main + sidebar) ===== */
.page-layout { display: flex; gap: 20px; text-align: left; flex:1; min-height:0; }
.page-side-group {
  display: flex;
  gap: 4px;
  flex: none;
  margin-left: auto;
}
.page-main {
  flex: 1;
  min-width: 0;
  max-width: 75%;
  text-align: left;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.page-side {
  width: 90px;
  flex: none;
  overflow: hidden;
  margin-left: auto;
}
.page-side-hobby {
  width: 90px;
  flex: none;
  overflow: hidden;
}

/* ===== Page Title ===== */
.page-title {
  font-size: 16px;
  font-weight: bold;
  color: #6C531E;
  margin: 0 0 2px 5px;
  padding-bottom: 2px;
  border-bottom: 2px solid #B5934C;
}

.en-title { font-size: 13px; font-weight: normal; color: #8B7355; margin-left: 8px; }

/* ===== Book Listing (category page) ===== */
.book-row {
  display: flex;
  gap: 12px;
  padding: 6px 8px;
  border-bottom: 1px dashed #E4C076;
  align-items: flex-start;
}
.book-row:last-child { border-bottom: none; }
.book-row:hover { background: rgba(212, 162, 63, 0.08); }
.br-cover {
  flex: none; width: 80px; height: 110px;
  border: 3px solid #D2A23F;
  overflow: hidden; background: #f5f0e0;
}
.br-cover img { width: 100%; height: 100%; object-fit: cover; }
.no-cvr {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  color: #B5934C; font-size: 10px; background: #f5f0e0;
}
.br-info { flex: 1; min-width: 0; text-align: left; }
.br-title {
  font-size: 14px; font-weight: bold; line-height: 22px;
  color: #6C531E; display: block; margin-bottom: 3px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.br-title:hover { color: #000; }
.br-meta {
  font-size: 11px; color: #8B7355;
  margin-bottom: 6px; line-height: 18px;
  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
.br-desc {
  font-size: 12px; line-height: 18px;
  color: #6C531E; margin: 0;
  max-height: 36px; overflow: hidden;
  word-wrap: break-word;
}

/* ===== Pagination ===== */
.book-list { flex: 1; min-height: 0; overflow-y: auto; }
.page-nav { text-align: center; padding: 4px 0; flex-shrink: 0; }
.page-nav a,
.page-nav .page-jump button {
  display: inline-block; vertical-align: middle;
  padding: 3px 10px; margin: 0 2px;
  border: 1px solid rgba(108,83,30,0.3); border-radius: 6px;
  color: #6C531E; font-size: 11px; line-height: 1.4;
  background: transparent; text-decoration: none;
  cursor: pointer; font-family: inherit;
  transition: all 0.2s;
}
.page-nav a:hover,
.page-nav .page-jump button:hover {
  color: #FFF; background: rgba(108,83,30,0.85);
  border-color: rgba(108,83,30,0.85);
}
.page-nav .page-info {
  display: inline-block; vertical-align: middle;
  margin: 0 6px; font-size: 12px; color: #6C531E;
}
.page-nav a.disabled { cursor: default; pointer-events: none; }
.page-nav a.disabled:hover { color: #6C531E; background: transparent; border-color: rgba(108,83,30,0.3); }
.page-nav .page-jump { display: inline-block; vertical-align: middle; margin-left: 8px; font-size: 12px; }
.page-nav .page-jump input {
  width: 30px; padding: 3px 2px; text-align: center;
  border: 1px solid rgba(108,83,30,0.3); border-radius: 6px;
  font-size: 12px; color: #6C531E; outline: none;
  vertical-align: middle; margin: 0 2px;
}
.page-nav .page-jump input:focus { border-color: #B5934C; }

/* ===== Sidebar ===== */
.side-box { margin-bottom: 12px; overflow: hidden; }
.side-box h2 {
  height: 22px; line-height: 22px; font-size: 13px;
  font-weight: bold; color: #6C531E;
  padding: 0 6px; margin-bottom: 4px;
  overflow: hidden;
  text-align: center;
}
.side-box li {
  padding: 2px 6px;
  border-bottom: 1px dashed #E4C076;
  line-height: 22px; font-size: 12px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  text-align: center;
}
.side-box li a { color: #6C531E; }
.side-box li a:hover { color: #000; }
.side-box li span {
  display: inline-block; width: 18px;
  font-weight: bold; font-size: 12px;
  color: #B5934C; margin-right: 4px;
}
.side-box li .n1 { color: #FF4400; }
.side-box li .n2 { color: #FF6600; }
.side-box li .n3 { color: #FF9900; }

/* ===== Book Detail Page ===== */
.dt-layout { display: flex; gap: 20px; text-align: left; }
.dt-main {
  flex: 1;
  min-width: 0;
  max-width: 75%;
  padding: 0 15px;
  box-sizing: border-box;
}
.dt-side { width: 200px; flex: none; }
.dt-breadcrumb { font-size: 12px; color: #8B7050; margin: 0 0 8px; }
.dt-breadcrumb a { color: #8B6914; text-decoration: none; }
.dt-breadcrumb a:hover { text-decoration: underline; }
.dt-breadcrumb .dt-bc-sep { margin: 0 6px; color: #c8b48a; }
.dt-title {
  font-size: 20px; font-weight: bold;
  color: #6C531E; margin: 0 0 15px; line-height: 1.3;
  word-wrap: break-word;
}
.dt-meta { width: 100%; margin-bottom: 18px; }
.dt-meta tr { line-height: 26px; border-bottom: 1px dashed #E4C076; }
.dt-meta td { padding: 2px 0; color: #6C531E; font-size: 12px; }
.dt-meta td.l { width: 80px; font-weight: bold; color: #8B7355; }

/* Description */
.dt-desc { margin-bottom: 20px; }
.dt-desc h2 {
  font-size: 14px; font-weight: bold; color: #6C531E;
  border-bottom: 1px dashed #E4C076;
  padding-bottom: 4px; margin-bottom: 10px;
}
.dt-desc p {
  font-size: 12px; line-height: 22px;
  color: #6C531E; text-indent: 24px; margin-bottom: 8px;
}

/* Cover */
.dt-cvr { text-align: center; margin-bottom: 15px; }
.dt-cvr img { width: 160px; border: 3px solid #D2A23F; background: #f5f0e0; }
.no-cvr-l {
  width: 160px; height: 220px; margin: 0 auto;
  border: 3px solid #D2A23F; background: #f5f0e0;
  display: flex; align-items: center; justify-content: center;
  color: #B5934C; font-size: 12px;
}

/* Actions */
.dt-act { padding: 10px 0; }
.login-tip { font-size: 12px; color: #8B7355; }
.login-tip a { color: #6C531E; font-weight: bold; }
.br-actions { margin-top: 8px; text-align: center; }

/* ===== Action buttons (download / read — unified site-wide) ===== */
.btn-action {
  cursor: pointer; border-radius: 6px;
  font-family: inherit; line-height: 1.4;
  display: inline-block; text-decoration: none; vertical-align: middle;
  -webkit-appearance: none; appearance: none;
  background: transparent; transition: all 0.2s;
  padding: 5px 12px; font-size: 12px; margin-right: 6px;
  color: #6C531E; border: 1px solid rgba(108,83,30,0.3);
}
.btn-action:hover {
  color: #FFFFFF; background: rgba(108,83,30,0.85); border-color: rgba(108,83,30,0.85);
}
.btn-action.btn-sm { padding: 3px 8px; font-size: 11px; margin-right: 4px; }
.btn-action.btn-xs { padding: 2px 7px; font-size: 11px; margin-right: 4px; }
/* Higher specificity to beat .page-mid a (0,1,1) for <a class="btn-action"> */
a.btn-action { color: #6C531E; }
a.btn-action:hover { color: #FFFFFF; }

/* ===== Action links (text-style download — dense file lists) ===== */
.link-action,
a.link-action {
  display: inline-block; cursor: pointer; text-decoration: none; white-space: nowrap;
  font-size: 12px; font-weight: bold; transition: color 0.15s;
  color: #b5934c;
}
.link-action:hover,
a.link-action:hover { color: #9a7b3a; text-decoration: underline; }

.br-login-tip { font-size: 12px; color: #8B7355; }
.br-login-tip a { color: #236D9B; }

/* ===== Template & Pack file grids (unified padding inside parchment) ===== */
.tpl-grid { display:grid; grid-template-columns:1fr 1fr; column-gap:20px; flex:1; min-height:0; overflow-y:auto; }
.tpl-cat-heading { grid-column:1 / -1; font-size:13px; font-weight:bold; color:#6C531E; margin:8px 0 3px; padding-bottom:2px; border-bottom:1px solid #e0d5b8; }
.tpl-empty { grid-column:1 / -1; }
.tpl-file-row { display:flex; align-items:center; padding:3px 0; font-size:13px; gap:8px; }
.tpl-file-name { color:#6C531E; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pack-file-grid { display:grid; grid-template-columns:repeat(2, max-content); justify-content:start; column-gap:100px; }
.pack-file-row { display:grid; grid-template-columns: auto 60px auto; align-items:center; padding:3px 0; font-size:13px; }
.pf-left { display:flex; align-items:center; gap:6px; min-width:0; overflow:hidden; }
.pf-right { display:flex; align-items:center; gap:6px; justify-content:flex-end; }
.pack-file-name { color:#6C531E; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
.pack-file-size { font-size:11px; color:#998a66; white-space:nowrap; }
.pack-file-cost { font-size:11px; color:#b88a2e; font-weight:bold; white-space:nowrap; }

/* Content containers: consistent horizontal spacing from parchment edge */
.tpl-grid, #pack-list-container { padding: 0 12px; text-align: left; }
#pack-list-container { flex:1; min-height:0; overflow-y:auto; }

/* ===== Upload form buttons ===== */
.uf-btn, .uf-btn-secondary {
  cursor: pointer; border-radius: 6px;
  font-family: inherit; line-height: 1.4;
  display: inline-block; text-decoration: none; vertical-align: middle;
  -webkit-appearance: none; appearance: none;
  transition: all 0.2s;
  color: #6C531E; border: 1px solid rgba(108,83,30,0.3);
}
.uf-btn { padding: 9px 36px; font-size: 14px; letter-spacing: 1px; background: rgba(108,83,30,0.06); }
.uf-btn-secondary { padding: 6px 18px; font-size: 13px; letter-spacing: 0.5px; background: transparent; }
.uf-btn:hover, .uf-btn-secondary:hover {
  color: #FFFFFF; background: rgba(108,83,30,0.85); border-color: rgba(108,83,30,0.85);
}

/* ===== Empty / No data ===== */
.no-data { padding: 60px 0; text-align: center; color: #8B7355; font-size: 13px; }

/* ===== Upload Form ===== */
.uf-form { max-width: 480px; padding-left: 10px; }
.uf-row { display: flex; align-items: flex-start; margin-bottom: 6px; text-align: left; }
.uf-label { width: 65px; flex: none; font-weight: bold; color: #6C531E; font-size: 13px; line-height: 30px; }
.uf-input {
  flex: 1; padding: 4px 8px; font-size: 13px; font-family: inherit;
  border: 1px solid #D2A23F; border-radius: 2px; color: #6C531E;
  background: rgba(255,255,255,0.7); outline: none;
}
.uf-input:focus { border-color: #B5934C; background: #fff; }
.uf-select { height: 34px; }
.uf-textarea { resize: vertical; line-height: 1.5; }
.uf-file { flex: 1; font-size: 13px; color: #6C531E; padding-top: 4px; }
.uf-hint { display: block; font-size: 11px; color: #8B7355; margin-top: 4px; }
.uf-msgs { margin-bottom: 16px; }
.uf-msg { font-size: 12px; padding: 6px 10px; border-radius: 2px; margin-bottom: 4px; }
.uf-msg-success { background: #e8f5e9; color: #2e7d32; border: 1px solid #c8e6c9; }
.uf-msg-error { background: #fbe9e7; color: #c62828; border: 1px solid #ffccbc; }

/* ===== Upload Notice ===== */
.uf-notice {
  max-width: 480px;
  margin-bottom: 10px;
  padding: 8px 12px;
  text-align: left;
  border: 1px solid #E4C076;
  border-radius: 3px;
  background: rgba(228, 192, 118, 0.08);
  font-size: 12px;
  color: #6C531E;
  line-height: 1.6;
}
.uf-notice strong { font-size: 12px; display: block; margin-bottom: 2px; }
.uf-notice ul { margin: 0; padding-left: 18px; }
.uf-notice li { margin-bottom: 2px; }
.uf-divider { border: none; border-top: 1px dashed #E4C076; margin: 14px 0 10px; text-align: left; }
.uf-subtitle { font-size: 15px; font-weight: bold; color: #6C531E; margin: 0 0 8px; text-align: center; }


/* ===== Upload History Table ===== */
.uf-table { max-width: 480px; font-size: 12px; color: #6C531E; border-collapse: collapse; text-align: left; }
.uf-table th {
  text-align: left; padding: 6px 8px; font-weight: bold;
  border-bottom: 2px solid #B5934C; font-size: 12px;
}
.uf-table td { padding: 6px 8px; border-bottom: 1px dashed #E4C076; }
.uf-table tr:hover { background: rgba(212, 162, 63, 0.06); }
.uf-time { white-space: nowrap; font-size: 11px; color: #8B7355; }
.uf-status { font-size: 11px; padding: 2px 8px; border-radius: 2px; font-weight: bold; }
.uf-st-pending { background: #fff8e1; color: #e65100; border: 1px solid #ffe0b2; }
.uf-st-ok { background: #e8f5e9; color: #2e7d32; border: 1px solid #c8e6c9; }
.uf-st-no { background: #fbe9e7; color: #c62828; border: 1px solid #ffccbc; }

/* ===== Reader ===== */
#reader-body {
  background: #f5f0e0;
  display: flex;
  flex-direction: column;
  height: 100vh;
  overflow-x: auto;
  overflow-y: hidden;
  margin: 0;
  font-family: "Georgia", "Palatino Linotype", "Noto Serif SC", serif;
}
:root { --reader-font-size: 18px; }

#reader-toolbar {
  background: linear-gradient(to bottom, #2a6288, #1a4d6e);
  color: #fff;
  flex-shrink: 0;
  z-index: 100;
  user-select: none;
}
#reader-toolbar .rt-inner {
  max-width: 1400px;
  width: 95%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 16px;
  box-sizing: border-box;
}
#reader-toolbar .rt-left { display: flex; align-items: center; gap: 10px; min-width: 0; }
#reader-toolbar .rt-back { color: #D8E7F1; font-size: 13px; text-decoration: none; white-space: nowrap; }
#reader-toolbar .rt-back:hover { color: #fff; }
#reader-toolbar .rt-title { font-size: 14px; font-weight: bold; max-width: 360px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#reader-toolbar .rt-author { font-size: 12px; color: #B8CDDB; max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#reader-toolbar .rt-right { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
#reader-toolbar button {
  background: rgba(255,255,255,0.15);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.25);
  padding: 4px 10px;
  border-radius: 3px;
  cursor: pointer;
  font-size: 12px;
  line-height: 1.4;
}
#reader-toolbar button:hover { background: rgba(255,255,255,0.3); }
#reader-toolbar .theme-btn { padding: 4px 8px; display: inline-flex; align-items: center; justify-content: center; }
#reader-toolbar .theme-btn svg { width: 18px; height: 18px; pointer-events: none; }
#font-selector {
  background: rgba(255,255,255,0.15);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.25);
  padding: 3px 6px;
  border-radius: 3px;
  font-size: 12px;
  cursor: pointer;
  outline: none;
  font-family: inherit;
}
#font-selector option { background: #2a6288; color: #fff; }

#reader-container { flex: 1; overflow: hidden; position: relative; }
#reader-container .rc-inner { max-width:1400px; width:95%; margin:0 auto; height:100%; position:relative; }

/* Theme variants */
.theme-day #reader-body { background: #fff; }
.theme-sepia #reader-body { background: #f5f0e0; }
.theme-night #reader-body { background: #1a1a2e; }
.theme-night #reader-toolbar { background: linear-gradient(to bottom, #16213e, #0f1a3a); }
.theme-night #reader-bottom { background: linear-gradient(to bottom, #16213e, #0f1a3a); }

/* Bottom */
#reader-bottom {
  background: linear-gradient(to bottom, #1a4d6e, #0f3a57);
  color: #fff;
  flex-shrink: 0;
  font-size: 12px;
  z-index: 100;
}
#reader-bottom .rb-inner {
  max-width: 1400px;
  width: 95%;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  padding: 4px 16px;
  box-sizing: border-box;
}
#reader-bottom button {
  background: rgba(255,255,255,0.15);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.25);
  padding: 4px 14px;
  border-radius: 3px;
  cursor: pointer;
  font-size: 12px;
}
#reader-bottom button:hover { background: rgba(255,255,255,0.3); }
#reader-bottom button:disabled { opacity: 0.4; cursor: default; }
#reader-progress { min-width: 50px; text-align: center; font-size: 13px; }

/* TOC */
#reader-toc {
  position: fixed;
  top: 0; left: -280px;
  width: 260px; height: 100%;
  background: #f5f0e0;
  border-right: 2px solid #D2A23F;
  z-index: 2001;
  overflow-y: auto;
  transition: left 0.25s ease;
  padding: 0 0 20px;
  box-sizing: border-box;
}
#reader-toc.open { left: 0; }
#reader-toc ul { list-style: none; padding: 0; margin: 0; }
#reader-toc li { border-bottom: 1px dashed #E4C076; }
#reader-toc a {
  display: block; padding: 8px 16px;
  color: #6C531E; font-size: 13px;
  text-decoration: none;
}
#reader-toc a:hover { background: rgba(212, 162, 63, 0.15); }
#toc-overlay {
  position: fixed; top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,0.3);
  z-index: 2000;
  display: none;
}
#toc-overlay.open { display: block; }

/* responsive */
@media (max-width: 768px) {
  #reader-toolbar .rt-title { max-width: 160px; font-size: 13px; }
  #reader-toolbar .rt-author { display: none; }
  #txt-viewer { padding: 20px 24px; }
}

.mobile-search { display: none; }

/* ===== Responsive Layout ===== */
@media (max-width: 1200px) {
  #mainNav li a { padding:0 12px; font-size:13px; }
  #mainNav .nav-search input[type="text"] { width:130px; }
}

@media (max-width: 768px) {
  /* === 释放固定高度/宽度约束（手机端自然滚动） === */
  html, body { max-width: 100vw; overflow-x: hidden; }
  body { height: auto; min-width: 0; }
  #page-shell { width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; }
  #container { width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; }
  .banner-top, .banner-bottom { width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; }

  /* === 释放各容器 990px 固定宽度 === */
  #top-bar { min-width: 0; width: 100%; }
  #top-bar .box {
    width: 100%; min-width: 0; max-width: 100%; height: auto;
    padding: 4px 10px; box-sizing: border-box; overflow: hidden;
    display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
  }
  #top-bar #logo { float: none; margin: 0; width: auto; flex: 0 0 auto; text-align: left; }
  #top-bar #logo h1 { font-size: 13px; letter-spacing: 1px; text-align: left; line-height: 20px; }
  #top-bar #logo .logo-en { display: none; }
  #top-bar #headFunction { float: none; margin: 0; padding: 0; height: auto; flex: 1 1 100%; }
  #top-bar #headFunction .links { text-align: left; font-size: 13px; line-height: 22px; word-break: break-word; }
  #top-bar #headFunction .links a { padding: 0 4px; }
  #head .box { margin-top: 60px; }
  #head .box { width: 100%; min-width: 0; }
  #footer .box { width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; padding: 0 10px; }
  #footer .copyright { text-align: center; padding: 12px 0 6px; }
  #footer .copyright span { display: block; }

  /* === 导航栏适配（手机端去边框/阴影，与顶端简洁风格一致） === */
  #mainNav { width: auto; margin: 0 10px; height: auto; overflow: visible; padding-bottom: 4px; background: none; border: none; box-shadow: none; }
  #mainNav li a { padding: 0 8px; font-size: 13px; font-weight: normal; border-right: none; text-shadow: none; }
  #mainNav .nav-search input[type="text"] { width: 100px; }
  #mainNav li ul.en-menu { width: 140px; }

  /* === 竖排堆叠（原 1100px 断点规则） === */
  .bottom-row { flex-direction: column; height: auto; }
  .bottom-left { grid-template-columns: 1fr; grid-template-rows: auto; }
  .page-layout { flex-direction: column; }
  .page-main { max-width: 100%; }
  /* 分类页：顶部 mainNav 已含全部分类入口，隐藏右侧重复树状导航 */
  .page-side-group, .page-side, .page-side-hobby { display: none; }
  .dt-layout { flex-direction: column; }
  .dt-main { max-width: 100%; }
  .dt-side { width: 100%; text-align: center; }

  /* === 首页欢迎区 === */
#carousel, #welcome { width: 95%; float: none; margin: 10px auto; }
  #carousel { margin-bottom: 6px; position: relative; }
  /* 手机端显式设定 cover 尺寸，dots 精确对齐 cover 底边 */
  #carousel .cover { width: 80px !important; height: 100px !important; margin-right: 10px !important; border-width: 3px !important; }
  /* cover 总高 = 100 + 3*2 border = 106px */
  #carousel dt { width: calc(100% - 100px) !important; font-size: 14px !important; line-height: 18px !important; }
  #carousel .intro { width: calc(100% - 100px) !important; height: auto !important; max-height: 70px; font-size: 11px !important; line-height: 16px !important; }
  #carousel dl { position: relative !important; height: 106px !important; min-height: 0 !important; padding-bottom: 0 !important; overflow: hidden !important; }
  /* dots 高度 ~18px，top:88 → 88-106 跨越 cover 底部 18px，水平线对齐 cover 底 */
  #carousel .tag { position: absolute !important; top: 88px !important; right: 8px !important; bottom: auto !important; left: auto !important; }
  #welcome { height: auto; min-height: 90px; }

  /* === 手机端压缩 carousel 与下方版块之间的装饰空隙 === */
  .banner-top, .banner-bottom { height: 0 !important; padding: 0 !important; margin: 0 !important; }
  .page-top, .page-bot { height: 0 !important; }
  .page-mid { padding: 0 !important; }
  #carousel { margin-bottom: 0 !important; }

  /* === 模板变单列 === */
  .tpl-grid { grid-template-columns: 1fr; }

  /* === 手机端首页：隐藏次要版块（保留 轮播/推荐/下载排行/最近更新） === */
  body.home #welcome,
  body.home #reading-rank,
  body.home #pack-download,
  body.home #upload-rank { display: none; }

  /* 推荐书 top5 保持桌面端竖排（不做横向滚动） */

  /* 顶部搜索：隐藏 mainNav 内的，启用 top-bar 内的 */
  #mainNav .nav-search { display: none; }
  #top-bar .mobile-search {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px; margin: 0;
    flex: 1 1 0; min-width: 0;
    max-width: 100%; box-sizing: border-box;
  }
  #top-bar .mobile-search input[type="text"] {
    width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box;
    padding: 4px 8px;
    border: 1px solid #ccc; border-radius: 3px; font-size: 12px;
  }
  #top-bar .mobile-search input[type="submit"] {
    padding: 4px 10px; font-size: 12px; box-sizing: border-box;
    border: 1px solid #1F6D9C; background: #1F6D9C; color: #fff;
    border-radius: 3px; cursor: pointer; white-space: nowrap;
  }

  /* 最近更新：去掉 flex:1 拉伸，按自然高度排列 */
  body.home #recent-new .rec-list,
  body.home #recent-new .rec-list li { flex: 0 0 auto; }
  body.home #recent-new { height: auto; }
}

@media (min-width: 1800px) {
  #container, .sub-head { max-width:1600px; }
  #mainNav li a { font-size:15px; padding:0 24px; }
  .bottom-row { gap:24px; }
}