/* ===== 语文桥 · 统一顶栏（全局共享） ===== */

/* 全局偏移变量：固定顶栏高度 + 二级栏目导航栏高度（2026-08-14 引入，供各频道对齐） */
:root {
  --topbar-h: 52px;   /* 固定顶栏高度（2026-08-21 去须坠后压缩） */
  --subnav-h: 48px;   /* 页顶下的二级栏目导航栏高度（面包屑左 / 栏目导航右） */
}

.top-bar {
  /* 深色横梁 — 参照教研标题条：厚底边+深阴影 */
  background: var(--nav-bg);
  background-image: radial-gradient(ellipse at 20% 50%, var(--nav-glow) 0%, transparent 60%);
  display: flex;
  align-items: center;
  height: 52px;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1001;
  border-bottom: 1px solid var(--nav-border);
  box-shadow: none;
}
/* 顶栏过渡条 — 2px 深蓝细线 + 双层外投影（纸面叠加立体感，2026-08-09 桥哥定） */
.top-bar::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
  background: var(--nav-after-grad);
  box-shadow:
    0 1px 10px rgba(0,0,0,.75),
    0 4px 40px rgba(0,0,0,.6);
  pointer-events: none;
}
/* 同步body偏移：为固定顶栏预留空间（二级栏目导航栏位于正常流中，无需额外padding） */
body { padding-top: var(--topbar-h) !important; }

.top-bar .logo-section {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 260px;
  flex-shrink: 0;
  padding-left: 24px;
}
.top-bar .logo-icon { display:inline-flex; align-items:center; line-height:1; }
.top-bar .logo-icon img { height:30px; width:auto; display:block; }
.top-bar .logo-text {
  display: flex;
  flex-direction: column;
  line-height: 1;
  gap: 1px;
}
.top-bar .logo-top {
  display: flex;
  align-items: baseline;
  gap: 4px;
  white-space: nowrap;
}
.top-bar .logo-name {
  font-size: 17px;
  font-weight: 900;
  color: var(--nav-accent);
  letter-spacing: 2px;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
  font-family: 'Noto Serif SC', 'STSong', 'SimSun', serif;
}
.top-bar .logo-domain {
  font-size: 9px;
  color: var(--nav-domain);
  letter-spacing: 1px;
}
.top-bar .logo-domain::before { content: '·'; margin: 0 3px; color: var(--nav-sep-color); }
.top-bar .logo-subtitle {
  font-size: 10px;
  color: var(--nav-accent);
  letter-spacing: 1px;
  white-space: nowrap;
  font-weight: 400;
  line-height: 1.3;
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.6), 0 0 24px var(--nav-subtitle-glow);
  display: none;
}
.top-bar .logo-text--home {
  flex-direction: row;
  align-items: center;
}
.top-bar .logo-tagline {
  display: flex;
  flex-direction: column;
  justify-content: center;
  line-height: 8.5px;
  font-size: 7.5px;
  letter-spacing: 1px;
  color: var(--nav-muted);
  font-weight: 400;
  font-family: 'Noto Serif SC', 'STSong', 'SimSun', serif;
  white-space: nowrap;
  text-align: left;
  margin-left: 10px;
  padding-left: 10px;
  border-left: 1px solid var(--nav-tagline-border);
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.45);
}
.top-bar .logo-tagline span { display: block; }

/* ===== 频道序列 ===== */
.top-bar .nav-channels {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;                  /* 频道间距 */
  flex: 0 0 auto;
  margin-left: auto;         /* 频道 TAB 与搜索整体靠右（2026-08-09 桥哥定） */
}
.top-bar .nav-search { margin-right: 20px; }   /* 搜索框距右缘留白 */

/* 每个频道胶囊 */
.top-bar .nav-channels a {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--nav-text);
  font-size: 13px;
  padding: 0 16px;
  height: 30px;
  text-decoration: none;
  transition: all 0.2s;
  white-space: nowrap;
  letter-spacing: 1px;
  border-radius: 15px;
  font-weight: 500;
  /* 胶囊边线 */
  border: 1px solid var(--nav-pill-border);
  position: relative;
}

/* 频道悬停：微亮 */
.top-bar .nav-channels a:hover {
  color: var(--nav-text-hover);
  background: var(--nav-hover-bg);
  border-color: var(--nav-hover-border);
}

/* 激活频道 */
.top-bar .nav-channels a.active {
  background: var(--nav-active-grad);
  color: var(--nav-active-text);
  font-weight: 700;
  border-color: var(--nav-active-border);
  box-shadow: var(--nav-active-shadow);
  text-shadow: 0 1px 4px rgba(0,0,0,0.3);
}

/* 隐藏斜杠分隔符 */
.top-bar .nav-sep { display: none; }

/* ===== 注册/登录 ===== */
.top-bar .auth-section {
  display: none;             /* 2026-08-09 桥哥定：撤除顶栏注册/登录（入口已迁至页脚用户功能区） */
  align-items: center;
  gap: 0;
  flex-shrink: 0;
  padding-right: 20px;
  margin-left: 60px;
}
.top-bar .auth-section a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--nav-auth);
  font-size: 12px;
  padding: 0 16px;
  height: 32px;
  text-decoration: none;
  transition: all 0.12s;
  white-space: nowrap;
  letter-spacing: 1px;
  font-weight: 300;
  border-radius: 16px;
}
.top-bar .auth-section a:hover { color: var(--nav-auth-hover); background: var(--nav-auth-bg); }
.top-bar .auth-section .auth-user {
  color: var(--nav-auth-user);
  font-size: 12px;
  padding: 0 12px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  letter-spacing: 1px;
  font-weight: 400;
}
.top-bar .auth-section .auth-sep { color: var(--nav-auth-sep); font-size: 10px; }

/* 真题阅读材料首行缩进 */
.q-reading {
    text-indent: 2em;
}

/* ===== 频道换肤：设计令牌（默认=金黑，全站通用） ===== */
:root {
  --nav-bg: #0a0a1a;
  --nav-glow: rgba(40, 30, 60, 0.15);
  --nav-border: #2a2a4a;
  --nav-after-grad: linear-gradient(180deg, #1a1a3a, #0d0d26);
  /* 暗金令牌（克制，与课件 #b8902f 同体系）：去橙、降亮、弱光晕 */
  --nav-accent: #b8902f;
  --nav-domain: rgba(255,255,255,0.80);
  --nav-sep-color: rgba(255,255,255,0.35);
  --nav-subtitle-glow: rgba(184, 144, 47, 0.10);
  --nav-muted: rgba(255, 255, 255, 0.55);
  --nav-tagline-border: rgba(255, 255, 255, 0.15);
  --nav-text: #c0c0d8;
  --nav-pill-border: rgba(255,255,255,0.06);
  --nav-text-hover: #d8d8ee;
  --nav-hover-bg: rgba(255,255,255,0.15);
  --nav-hover-border: rgba(255,255,255,0.25);
  --nav-active-grad: linear-gradient(150deg, #b8902f 0%, #8a6a22 100%);
  --nav-active-text: #fff8e0;
  --nav-active-border: rgba(184, 144, 47, 0.30);
  --nav-active-shadow: 0 0 8px rgba(184, 144, 47, 0.22), 0 0 18px rgba(184, 144, 47, 0.08), inset 0 1px 0 rgba(255,255,255,0.18);
  --nav-auth: #9e8638;
  --nav-auth-hover: #c2a44e;
  --nav-auth-bg: rgba(255,255,255,0.08);
  --nav-auth-user: #b8902f;
  --nav-auth-sep: #5a4a30;
}

/* 读物频道（duwu）深绿换肤 — 仅 <body class="channel-reading"> 生效 */
body.channel-reading {
  /* 背景：沿用原 duwu 深绿(墨绿)，与旧头一致 */
  --nav-bg: linear-gradient(180deg, #344638, #2a3829);
  --nav-glow: rgba(42, 56, 41, 0.20);
  --nav-border: rgba(239, 228, 203, 0.18);          /* 米白虚线边，同原方案 */
  --nav-after-grad: linear-gradient(180deg, rgba(168,216,168,.55), rgba(127,174,127,.16)); /* 报眉绿线，留绿意 */
  /* 字色：米白旧报纸色(#efe4cb)，与绿底异色相 → 区分清楚（原方案 --on-dark） */
  --nav-accent: #efe4cb;                              /* LOGO名/副标主字 */
  --nav-domain: rgba(239, 228, 203, 0.82);
  --nav-sep-color: rgba(239, 228, 203, 0.35);
  --nav-subtitle-glow: rgba(239, 228, 203, 0.12);
  --nav-muted: rgba(239, 228, 203, 0.62);            /* 次级字，同 --on-dark-mute */
  --nav-tagline-border: rgba(239, 228, 203, 0.15);
  --nav-text: rgba(239, 228, 203, 0.86);             /* 普通频道字 */
  --nav-pill-border: rgba(239, 228, 203, 0.10);
  --nav-text-hover: rgba(239, 228, 203, 0.96);
  --nav-hover-bg: rgba(239, 228, 203, 0.10);
  --nav-hover-border: rgba(239, 228, 203, 0.22);
  /* 激活频道按钮：绿调微透底 + 米白字，既保绿意又字底异色 */
  --nav-active-grad: linear-gradient(150deg, rgba(168,216,168,.22) 0%, rgba(127,174,127,.30) 100%);
  --nav-active-text: #efe4cb;
  --nav-active-border: rgba(239, 228, 203, 0.40);
  --nav-active-shadow: 0 0 10px rgba(168, 216, 168, 0.30), 0 0 22px rgba(168, 216, 168, 0.10), inset 0 1px 0 rgba(255,255,255,0.18);
  --nav-auth: #d8cdb4;
  --nav-auth-hover: #efe4cb;
  --nav-auth-bg: rgba(239, 228, 203, 0.08);
  --nav-auth-user: #efe4cb;
  --nav-auth-sep: rgba(239, 228, 203, 0.18);
}
/* 顶栏背景强制为与页脚同款绿渐变：覆盖默认 .top-bar 的 radial-glow 覆盖（该 glow 会把绿渐变顶掉，导致顶栏不绿） */
body.channel-reading .top-bar {
  background-color: transparent;
  background-image: var(--nav-bg);
}
/* 分回阅读页：邮戳下移进章节报眉右上角 + 阅读工具栏/进度条避让固定顶栏 */
body.channel-reading .chapter-banner .postmark {
  position: absolute; top: 16px; right: 20px; z-index: 2;
}
body.channel-reading .cb-title { padding-right: 76px; }
body.channel-reading .read-toolbar { top: var(--topbar-h); }
body.channel-reading .reading-progress { top: calc(var(--topbar-h) + var(--subnav-h) + 5px); }
@media (max-width: 640px) {
  body.channel-reading .chapter-banner .postmark { top: 12px; right: 12px; transform: rotate(-8deg) scale(.82); }
  body.channel-reading .cb-title { padding-right: 64px; }
}

/* ===== 二级栏目导航栏（全局复用组件） =====
   位于固定顶栏正下方；左面包屑，右边栏目导航。
   正常流中渲染、position:sticky 贴住顶栏下沿；高度由 --subnav-h 控制。
   频道内 sticky 侧栏应取 top: calc(var(--topbar-h) + var(--subnav-h)) 以避让本栏。 */
.subnav, .read-toolbar {
  position: sticky;
  top: var(--topbar-h);
  z-index: 40;
  height: var(--subnav-h);
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 18px;
  width: 100%; margin: 0; left: 0; right: 0; max-width: none;
  background: #f5f3ef;

  border-bottom: 1px solid rgba(201, 168, 76, 0.45);
  box-shadow: 0 1px 4px rgba(0,0,0,.06);
  font-family: -apple-system, 'Segoe UI', Roboto, sans-serif;
}
.subnav .sub-crumb, .read-toolbar .tb-crumb {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 13px; color: #7a6a5a; white-space: nowrap; overflow: hidden; min-width: 0;
}
.subnav .sub-crumb a, .read-toolbar .tb-crumb a { color: #7a6a5a; text-decoration: none; }
.subnav .sub-crumb a:hover, .read-toolbar .tb-crumb a:hover { color: #b8902f; }
.subnav .sub-crumb .sub-sep, .read-toolbar .tb-crumb .tb-sep { color: #c0b8a8; }
.subnav .sub-crumb .sub-cur, .read-toolbar .tb-crumb .tb-cur { color: #6a422a; font-weight: 700; }
.subnav .sub-spacer, .read-toolbar .tb-spacer { flex: 1; }
.subnav .sub-links, .read-toolbar .tb-kn { display: inline-flex; align-items: center; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.subnav .sub-links a, .subnav .sub-links button, .read-toolbar .tb-kn a, .read-toolbar .tb-kn button {
  font-size: 12px; font-weight: 400; color: #6a422a; text-decoration: none;
  padding: 5px 12px; border: 1px solid #dacfc1; border-radius: 14px;
  background: rgba(255,255,255,0.5); transition: all .15s; white-space: nowrap; font-family: inherit; cursor: pointer;
}
.subnav .sub-links a:hover, .subnav .sub-links button:hover, .read-toolbar .tb-kn a:hover, .read-toolbar .tb-kn button:hover { border-color: #b8902f; color: #b8902f; }
.subnav .sub-links a.cur, .subnav .sub-links button.cur, .read-toolbar .tb-kn a.cur, .read-toolbar .tb-kn button.cur, .subnav .sub-links button.active, .read-toolbar .tb-kn button.active { background: #6a422a; border-color: #6a422a; color: #fff; }
@media (max-width: 640px) {
  .subnav, .read-toolbar { padding: 0 12px; }
  .subnav .sub-links a, .subnav .sub-links button, .read-toolbar .tb-kn a, .read-toolbar .tb-kn button { padding: 4px 9px; font-size: 12px; }
}

/* 左侧课标树：一级栏展开时常亮高亮（一次只高亮一个） */
.sidebar .tree-header.level1.active {
  background: rgba(192, 61, 61, 0.10);
  border-left: 3px solid #c03d3d;
  color: #8a2626;
  font-weight: 700;
}

/* ===== 课标侧栏搜索框（浅色统一，by yuwenqiao.cn agent 2026-08-16） =====
 * 统一各 kebiao 页搜索框为「前言页」浅色标准：白底圆角 + 🔍 图标 + 聚焦红边。
 * 显式色值（不依赖各页 light token），确保所有页一致呈现。 */
.sidebar-nav .search-box,
.search-box {
  position: relative;
  display: flex;
  align-items: center;
}
.search-box .search-ico {
  position: absolute;
  left: 11px;
  font-size: 12px;
  color: #8b7a66;
  pointer-events: none;
}
.search-box input {
  width: 100%;
  padding: 9px 12px 9px 30px;
  border: 1px solid #ddd8cf;
  border-radius: 9px;
  background: #fff;
  color: #2c2216;
  font-size: 12px;
  font-family: system-ui, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
  outline: none;
  box-sizing: border-box;
  transition: border-color .15s, box-shadow .15s;
}
.search-box input::placeholder { color: #8b7a66; }
.search-box input:focus {
  border-color: #c03d3d;
  box-shadow: 0 0 0 3px rgba(192, 61, 61, 0.12);
}

/* ===== 二级伸缩图标：尖括号式（›，展开旋转 90° 向下），与一级三角区分（2026-08-16） =====
 * 内联 <style> 里二级箭头仍是三角 ▶ 文本；此处隐藏该文本、改用 ::before 渲染 ›，
 * 仅改共享 CSS 一处即可全站生效，无需逐页改 HTML。 */
.tree-group.level2 .tree-header .arrow {
  font-size: 0;            /* 隐藏内联 ▶ 文本 */
  margin-right: 5px;
  width: 12px;
  text-align: center;
}
.tree-group.level2 .tree-header .arrow::before {
  content: '>';            /* 朴素右尖括号 > */
  font-size: 12px;
  line-height: 1;
  display: inline-block;
}

/* 课文页顶部二级导航：左侧改为完整层级面包屑（取消 inline-flex 的 gap，
   使 “语文桥 - 课文 - ...” 用普通文本流紧凑呈现，不被 8px 间距撑散） */
.subnav.lesson-channel-subnav .sub-crumb {
  display: inline;
  gap: 0;
  white-space: nowrap;
  overflow: visible;
}


/* ============================================================
   全站滚动条（页面级）：轨道透明，露出页面自身背景色
   —— 为什么放在 top-nav.css：它被全站页面引用，
   而 components.css 虽然引用更多，但 /kewen/ 大量老页面没有引它。
   —— 2026-09-23 桥哥：教材库滚动条不要白底色
   原先无任何全局定义 → 轨道走浏览器默认（纯白），在深色/米白底上都突兀
   ============================================================ */
html::-webkit-scrollbar, body::-webkit-scrollbar { width: 10px; height: 10px; }
html::-webkit-scrollbar-track, body::-webkit-scrollbar-track,
html::-webkit-scrollbar-track-piece, body::-webkit-scrollbar-track-piece { background: transparent; }
html::-webkit-scrollbar-thumb, body::-webkit-scrollbar-thumb {
  background: #c9b98a; border-radius: 5px; border: 2px solid transparent; background-clip: padding-box;
}
html::-webkit-scrollbar-thumb:hover, body::-webkit-scrollbar-thumb:hover {
  background: #b8922e; background-clip: padding-box;
}
html::-webkit-scrollbar-corner, body::-webkit-scrollbar-corner { background: transparent; }
html, body { scrollbar-color: #c9b98a transparent; scrollbar-width: thin; }