/* ============================================================
   H5 子页共享外壳（2026-09-09 · 同步主 H5 暗色 + 共青团红）
   顶栏右侧图标 + 导航浮层 + 检索浮层 + 底部 TAB · 红色主题
   ============================================================ */
/* 顶栏右侧图标按钮 */
.iconbtn{ width:42px; height:42px; border-radius:13px; margin-left:8px; flex:none; text-decoration:none;
  display:flex; align-items:center; justify-content:center;
  background:#C8102E; color:#FFFFFF; border:none; cursor:pointer;
  box-shadow:0 3px 10px rgba(200,16,46,.30), inset 0 1px 0 rgba(255,255,255,.15); }
.iconbtn svg{ width:21px; height:21px; }
.iconbtn:hover{ background:#A01224; }
/* 子页左上角 Logo 红底（与主页面一致） */
.appbar .logo{ background:linear-gradient(135deg,#E64635,#C8102E);
  box-shadow:0 2px 8px rgba(200,16,46,.30), 0 0 0 1px rgba(230,70,53,.4), 0 0 14px rgba(200,16,46,.35) !important;
  animation:none !important; }
/* 遮罩 */
.navMask,.searchMask{ position:fixed; inset:0; background:rgba(0,0,0,.40); z-index:60;
  opacity:0; pointer-events:none; transition:opacity .25s; }
.navMask.on,.searchMask.on{ opacity:1; pointer-events:auto; }
/* 浮层（从底部滑出） */
.navSheet,.searchSheet{ position:fixed; left:50%; bottom:0; transform:translate(-50%,105%); z-index:61;
  width:100%; max-width:430px; background:linear-gradient(180deg,#0A241D,#071A15); border-radius:22px 22px 0 0;
  box-shadow:0 -10px 40px rgba(0,0,0,.5); display:flex; flex-direction:column; max-height:82vh;
  transition:transform .28s ease; }
.navSheet.on,.searchSheet.on{ transform:translate(-50%,0); }
.navSheet-hd{ flex:none; display:flex; align-items:flex-start; gap:8px; padding:14px 16px 8px; }
.navSheet-hd b{ font-size:15px; color:#EAFBF7; display:block; }
.navSheet-hd span{ font-size:10.5px; color:#7FB8A6; display:block; margin-top:2px; }
.navSheet-x{ margin-left:auto; flex:none; width:28px; height:28px; border-radius:50%; border:none; cursor:pointer;
  background:rgba(255,255,255,.08); color:#BDE8DB; font-size:16px; }
.navSheet-body{ flex:1; min-height:0; overflow-y:auto; padding:4px 14px 18px; }
.nav-grp{ font-size:11px; color:#7FB8A6; letter-spacing:1px; margin:12px 2px 6px; }
.nav-item{ display:flex; align-items:center; gap:10px; padding:10px 8px; border-radius:10px; text-decoration:none; color:#E4F5F0; }
.nav-item:active{ background:rgba(200,16,46,.12); }
.nav-item .ni{ width:36px; height:36px; border-radius:10px; flex:none; display:flex; align-items:center; justify-content:center;
  background:rgba(200,16,46,.10); color:#F8B4B4; box-shadow:inset 0 0 0 1px rgba(200,16,46,.16); }
.nav-item .ni svg{ width:18px; height:18px; }
.nav-item b{ display:block; font-size:13px; font-weight:600; color:#EAFBF7; }
.nav-item span{ display:block; font-size:10.5px; color:#7FB8A6; margin-top:1px; }
.nav-item .go{ margin-left:auto; color:#5EEAD4; }
.nav-item.danger{ color:#F87171; }
.nav-item.danger .ni{ color:#F87171; background:rgba(230,67,64,.10); box-shadow:inset 0 0 0 1px rgba(230,67,64,.16); }
/* 检索浮层 */
.searchSheet{ position:fixed; left:50%; top:0; bottom:auto; transform:translate(-50%,-110%); z-index:61;
  width:100%; max-width:430px; background:#FFFFFF !important; border-radius:0 0 22px 22px;
  box-shadow:0 12px 40px rgba(0,0,0,.5); transition:transform .28s cubic-bezier(.22,.9,.32,1.2);
  padding:calc(10px + env(safe-area-inset-top)) 14px 12px; display:flex; flex-direction:column; }
.searchSheet.on{ transform:translate(-50%,0); }
.searchBox{ display:flex; align-items:center; gap:8px; padding:14px 14px 8px; }
.searchBox svg{ width:18px; height:18px; color:#9A9A9A; flex:none; }
.searchBox input{ flex:1; min-width:0; height:40px; border:none; outline:none; background:#F2F2F2;
  border:1px solid transparent; border-radius:10px; padding:0 12px; font-size:13px; color:#1A1A1A; }
.searchBox input::placeholder{ color:#9A9A9A; }
.searchClose{ border:none; background:#F2F2F2; color:#666; font-size:13px; padding:7px 12px; border-radius:9px; cursor:pointer; }
.searchResults{ flex:1; min-height:0; overflow-y:auto; padding:4px 12px 18px; }
.sr-hint{ font-size:12px; color:#9A9A9A; text-align:center; padding:24px 0; }
.sr-item{ display:flex; align-items:center; gap:10px; padding:10px 8px; border-radius:10px; text-decoration:none; color:#1A1A1A; background:#F7F7F7; border:1px solid transparent; }
.sr-item:active{ background:#F0F0F0; }
.sr-item .sr-ic{ width:32px; height:32px; border-radius:9px; flex:none; display:flex; align-items:center; justify-content:center;
  background:rgba(200,16,46,.10); color:#C8102E; box-shadow:inset 0 0 0 1px rgba(200,16,46,.16); }
.sr-item .sr-ic svg{ width:16px; height:16px; }
.sr-item b{ display:block; font-size:13px; font-weight:600; color:#1A1A1A; }
.sr-item span{ display:block; font-size:10.5px; color:#9A9A9A; }
/* 底部 TAB */
.sub-tabbar{ position:fixed; left:50%; bottom:0; transform:translateX(-50%); width:100%; max-width:430px; z-index:10;
  height:60px; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); background:#F7F7F7;
  backdrop-filter:blur(16px); border-top:1px solid var(--line); padding-bottom:env(safe-area-inset-bottom); white-space:nowrap; }
.sub-tabbar a{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
  color:#7F7F7F; font-size:10px; text-decoration:none; }
.sub-tabbar a.on{ color:#C8102E; }
.sub-tabbar a .tab-ic{ position:relative; }
.sub-tabbar a.on .tab-ic::after{ content:""; position:absolute; inset:-6px -10px; border-radius:10px;
  background:rgba(200,16,46,.10); z-index:-1; }
.sub-tabbar a.raise .tab-ic::after{ content:none !important; }
.sub-tabbar a svg{ width:21px; height:21px; }
.sub-tabbar a.raise{ color:#7F7F7F; }
.sub-tabbar a.raise .tab-lb{ transform:translateY(-16px); font-weight:700; }
.sub-tabbar a.raise .tab-ic{ width:52px; height:52px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,#E64635,#C8102E); color:#fff; box-shadow:0 8px 22px rgba(200,16,46,.45);
  transform:translateY(-14px); }
.sub-tabbar a.raise .tab-ic svg{ width:24px; height:24px; }
/* 让内容不被底部 TAB 遮挡（仅当注入标准底部 tabbar 时生效） */
.has-subbar .content{ padding-bottom:calc(72px + env(safe-area-inset-bottom)) !important; }
/* ============================================================
   全部功能 · 全屏功能总览页（参考共青团门户「H5 导航栏」）
   ============================================================ */
.navMask{ background:rgba(0,0,0,.45); }
.navSheet{ top:0; bottom:0; max-height:none; border-radius:0; transform:translate(-50%,101%);
  background:#F7F7F7; box-shadow:0 0 40px rgba(0,0,0,.25); }
.navSheet.on{ transform:translate(-50%,0); }
.navSheet-hd{ align-items:center; padding:calc(20px + env(safe-area-inset-top)) 18px 16px;
  background:linear-gradient(135deg,#E64635,#C8102E); color:#FFFFFF; }
.navSheet-hd b{ color:#FFFFFF; font-size:18px; letter-spacing:1px; }
.navSheet-hd span{ color:rgba(255,255,255,.85); }
.navSheet-x{ background:rgba(255,255,255,.22); color:#FFFFFF; font-size:15px; }
.navSheet-body{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px;
  padding:6px 16px 30px; align-content:start; }
.nav-grp{ grid-column:1/-1; margin:13px 2px 2px; padding-left:2px; font-size:12px; font-weight:700; color:#8A8A8A; letter-spacing:2px; }
.nav-grp::before{ content:''; display:inline-block; width:4px; height:12px; background:#C8102E; border-radius:2px; margin-right:7px; vertical-align:-1px; }
.nav-item{ display:flex; flex-direction:row; align-items:center; gap:7px; padding:9px 10px;
  min-height:46px; margin:0; border-radius:12px; background:#FFFFFF; border:1px solid transparent;
  box-shadow:0 1px 2px rgba(0,0,0,.05); }
.nav-item:active{ background:#FFF3F3; transform:scale(.97); }
.nav-item .ni{ width:28px; height:28px; flex:none; display:flex; align-items:center; justify-content:center; background:transparent; color:#C8102E; }
.nav-item .ni svg{ width:14px; height:14px; }
.nav-item > div:not(.ni){ flex:1; min-width:0; display:block; }
.nav-item b{ display:block; font-size:11px; text-align:left; color:#1A1A1A; line-height:1.35;
  white-space:normal; overflow:visible; text-overflow:clip;
  overflow-wrap:break-word; word-break:break-word; }
.nav-item span{ display:none; }
.nav-item .go{ display:none; }
.nav-item.danger b{ color:#E64340; }
.nav-item.danger .ni{ color:#E64340; }
/* ============================================================
   页底「已经到底了」提示
   ============================================================ */
.bottom-tip{ display:flex; align-items:center; justify-content:center; gap:10px;
  margin:24px auto 10px; padding:0 16px; color:#B0B0B0; font-size:11px; letter-spacing:2px;
  user-select:none; order:9999; }
.bottom-tip::before,.bottom-tip::after{ content:''; flex:0 0 30px; height:1px; background:#E2E2E2; }
.bottom-tip .dot{ display:none; }
.bottom-tip b{ font-weight:600; white-space:nowrap; }
#navBody .bottom-tip{ grid-column:1/-1; margin:20px auto 4px; }

/* —— [伦理审查标注 v5] 输入 / 输出数据统一标注 —— */
.eth-chip{ flex:none; display:inline-flex; align-items:center; gap:3px; white-space:nowrap;
  font-size:9px; letter-spacing:.2px; line-height:1.4; padding:3px 8px; border-radius:999px;
  border:1px solid currentColor; color:inherit; opacity:.72; text-decoration:none; }
.eth-chip:active{ opacity:1; }
.eth-note{ display:flex; align-items:center; gap:6px; margin:14px 2px 2px; padding-top:10px;
  border-top:1px dashed currentColor; font-size:10px; line-height:1.6; color:inherit; opacity:.62; }
.eth-note span{ flex:1; }
.eth-note a{ flex:none; color:inherit; text-decoration:none; border-bottom:1px solid currentColor; }
.eth-tag{ display:block; margin-top:7px; text-align:right; font-size:9.5px; line-height:1.5;
  letter-spacing:.3px; color:inherit; opacity:.48; }
.eth-tag.inline{ display:inline-flex; align-items:center; flex:none; margin:0 0 0 6px; white-space:nowrap; }
.eth-chip i,.eth-note i,.eth-tag i{ font-style:normal; }