/* =====================================================================
   英文页专有样式（en-* 命名空间）：加载顺序在 lh-overlay.css 之后
   ===================================================================== */
/* ============================================================
 * 英文数据库导览页专有样式（en-* 命名空间，不覆盖 .lh-* 既有规则）
 * 2026-09 新增：/en/ 栏目导览页
 * ============================================================ */
/* 英文页面：西文字体优先。模板基础字体栈以中文字体打头（Microsoft YaHei 等），
   英文字符会落到苹方/雅黑的西文字形上，观感偏紧、字符间距生硬。
   这里在 .en 作用域内改为西文优先栈：先用系统 UI 西文字体，再回落到中文字体兜底
   （万一页面混入中文，例如 title 提示，也能正常显示）。 */
.en{font-family:-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans",Arial,"Microsoft YaHei","PingFang SC",sans-serif}
.en h1,.en h2,.en h3,.en h4{font-family:inherit;letter-spacing:-.01em}
.en .en-hero__t{letter-spacing:-.022em}
.en .en-card__name{letter-spacing:-.006em}

/* 英文导航项比中文少，基础样式 justify-content:flex-end 会把菜单推到右侧贴住按钮，
   这里在 .en 作用域内改为左对齐、与 logo 保持间距，视觉更平衡。 */
.en .lh-nav{justify-content:flex-start;margin-left:26px}
.en .lh-nav__ul>li>a{padding:0 13px}
.en .lh-header__side{margin-left:auto}

.en-hero{padding:56px 0 46px;background:linear-gradient(160deg,#243a5c 0%,#2d405f 46%,#1c2b43 100%);color:#fff;position:relative;overflow:hidden}
.en-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(560px 300px at 82% 10%,var(--veil-glow),transparent 68%);pointer-events:none}
.en-hero .lh-wrap{position:relative;z-index:1}
.en-hero__eyebrow{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:99px;background:rgba(255,255,255,.14);font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.en-hero__t{margin:18px 0 12px;font-size:38px;line-height:1.24;font-weight:800;letter-spacing:-.01em}
.en-hero__t em{font-style:normal;color:#ffd479}
.en-hero__d{max-width:700px;font-size:16px;line-height:1.9;color:rgba(255,255,255,.82)}
.en-hero__meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.en-hero__meta span{display:inline-flex;align-items:center;gap:7px;padding:8px 15px;border-radius:99px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);font-size:13px}
/* 数据库总数胶囊：品牌蓝底白字，与其它信息胶囊区分开、更醒目 */
.en-hero__meta span.en-hero__hl{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:600}
.en-hero__meta svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* 访问提示条 */
.en-access{padding:26px 0;background:var(--alt);border-bottom:1px solid var(--line)}
.en-access__in{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.en-access__c{display:flex;gap:13px;padding:17px 19px;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh1)}
.en-access__c i{flex:0 0 auto;width:38px;height:38px;display:grid;place-items:center;border-radius:8px;background:var(--soft);color:var(--blue)}
.en-access__c i svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.en-access__c h4{margin:0 0 5px;font-size:15px;font-weight:700;color:var(--deep)}
.en-access__c p{margin:0;font-size:13px;line-height:1.72;color:var(--text)}
.en-access__c a{color:var(--blue);font-weight:600}

/* 分组 */
.en-sec{padding:46px 0}
.en-sec:nth-child(even){background:var(--alt)}
.en-sec__head{display:flex;align-items:flex-start;gap:16px;margin-bottom:24px}
.en-sec__no{flex:0 0 auto;font-size:27px;font-weight:800;line-height:1;color:var(--blue);opacity:.42;font-variant-numeric:tabular-nums}
.en-sec__t{margin:0 0 6px;font-size:22px;font-weight:800;color:var(--deep);letter-spacing:-.005em}
.en-sec__d{margin:0;font-size:14px;line-height:1.7;color:var(--muted)}
.en-sec__count{margin-left:auto;flex:0 0 auto;padding:6px 13px;border-radius:99px;background:var(--soft);color:var(--deep);font-size:13px;font-weight:700;white-space:nowrap}

/* 卡片栅格 —— 卡片等高，底部按钮对齐 */
.en-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;align-items:stretch}
.en-grid>.en-card{height:100%}
.en-card{display:flex;flex-direction:column;padding:19px 20px 17px;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh1);transition:box-shadow .22s ease,transform .22s ease,border-color .22s ease}
.en-card:hover{box-shadow:var(--sh2);border-color:#d5e0f0;transform:translateY(-3px)}
.en-card__logo{display:flex;align-items:center;justify-content:flex-start;height:38px;margin-bottom:12px}
.en-card__logo img{max-height:38px;max-width:150px;width:auto;height:auto;object-fit:contain;object-position:left center}
.en-card__ico{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:8px;background:var(--soft);color:var(--blue)}
.en-card__ico svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.en-card__head{display:flex;align-items:flex-start;gap:10px;margin-bottom:6px}
.en-card__name{flex:1 1 auto;margin:0;font-size:16px;line-height:1.35;font-weight:700;color:var(--deep)}
.en-badge{flex:0 0 auto;padding:3px 10px;border-radius:99px;font-size:12px;font-weight:700;white-space:nowrap;letter-spacing:.01em}
.en-badge--ok{background:#e8f0fb;color:#2b5797}
.en-badge--try{background:#fdf1e0;color:#a8681a}
.en-badge--free{background:#e7f5ec;color:#256b3d}
.en-badge--pre{background:#f0ecfa;color:#5a4693}
.en-card__type{margin:0 0 8px;font-size:12px;font-weight:700;color:var(--blue);letter-spacing:.02em;text-transform:uppercase}
.en-card__desc{margin:0 0 11px;font-size:14px;line-height:1.7;color:var(--text);flex:1 1 auto}
.en-card__access{display:flex;gap:8px;margin:0 0 11px;padding:9px 12px;background:var(--alt);border-radius:6px;font-size:12px;line-height:1.6;color:var(--muted)}
.en-card__access svg{flex:0 0 auto;width:14px;height:14px;margin-top:2px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.en-card__tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.en-tag{padding:3px 9px;border-radius:6px;background:var(--soft);color:var(--text);font-size:12px;font-weight:600}
.en-tag--more{background:transparent;border:1px dashed var(--line);color:var(--muted)}
.en-card__foot{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:2px}
.en-btn{display:inline-flex;align-items:center;gap:7px;padding:8px 16px 8px 17px;border-radius:99px;font-size:13px;font-weight:700;transition:.2s}
.en-btn svg{width:14px;height:14px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.en-btn--main{background:var(--blue);color:#fff;box-shadow:0 4px 12px var(--brand-sh)}
.en-btn--main:hover{background:var(--blue-d);transform:translateY(-1px)}
.en-btn--ghost{background:#fff;border:1px solid var(--line);color:var(--deep)}
.en-btn--ghost:hover{border-color:var(--blue);color:var(--blue)}

/* 分组内卡片数为奇数时，最后一张跨两列铺满，避免右侧空出一大块 */
@media (min-width:1025px){
  .en-grid--odd>.en-card:last-child{grid-column:1 / -1}
  .en-grid--odd>.en-card:last-child .en-card__desc{max-width:980px}
}

/* 免责说明 */
.en-note{padding:30px 0 46px;background:#fff}
.en-note__in{padding:18px 22px;border-left:3px solid var(--blue);background:var(--alt);border-radius:0 6px 6px 0;font-size:13px;line-height:1.8;color:var(--text)}
.en-note__in b{color:var(--deep)}

/* 移动端 */
@media (max-width:1024px){
  .en-hero{padding:38px 0 32px}
  .en-hero__t{font-size:26px}
  .en-hero__d{font-size:14px}
  .en-access__in{grid-template-columns:1fr}
  .en-grid{grid-template-columns:1fr}
  .en-sec{padding:32px 0}
  .en-sec__head{flex-wrap:wrap;gap:11px}
  .en-sec__count{margin-left:0}
  .en-sec__t{font-size:19px}
  .en-card{padding:17px}
  /* 窄屏：徽标移到名称下方单独一行，避免长标题被挤成两行后与徽标相互压缩 */
  .en-card__head{flex-direction:column-reverse;align-items:flex-start;gap:7px}
  .en-badge{align-self:flex-start}
  .en-card__name{font-size:16px}
  .en-card__logo{height:34px;margin-bottom:11px}
  .en-card__logo img{max-height:34px;max-width:132px}
}
@media (max-width:420px){
  .en-hero__t{font-size:23px}
  .en-card__foot .en-btn{flex:1 1 auto;justify-content:center}
}


/* ============================================================
 * 网络身份联动（英文导览页）
 * 顶栏徽章判定出的访客网络身份（lh-net-campus / -likely / -outside / -unknown，
 * 由徽章脚本写在 <html> 上），在这里驱动数据库访问按钮的配色与访问提示条。
 * 状态名与徽章一致，色值同源，改一处两边同步。
 * ============================================================ */
/* --- 访问提示条：默认不占位，仅在判定完成后按状态显示一条 --- */
.en-netnote{display:none;align-items:flex-start;gap:9px;margin:0 0 18px;padding:12px 15px;
  border-radius:var(--r);border:1px solid var(--line);background:var(--alt);
  font-size:13.5px;line-height:1.65;color:var(--text)}
.en-netnote svg{flex:0 0 auto;width:15px;height:15px;margin-top:3px;fill:none;stroke:currentColor;
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.en-netnote__on,.en-netnote__off{display:none;align-items:flex-start;gap:9px}
.lh-net-campus .en-netnote{display:flex;border-color:#bfe9cf;background:#f1fbf5}
.lh-net-campus .en-netnote__on{display:flex}
.lh-net-campus .en-netnote svg{color:#2fa85f}
.lh-net-likely .en-netnote{display:flex;border-color:#f2dfae;background:#fdf8ec}
.lh-net-likely .en-netnote__off{display:flex}
.lh-net-likely .en-netnote svg{color:#c8952c}
.lh-net-outside .en-netnote,.lh-net-unknown .en-netnote{display:flex;border-color:#d8e0ea;background:#f4f7fb}
.lh-net-outside .en-netnote__off,.lh-net-unknown .en-netnote__off{display:flex}
.lh-net-outside .en-netnote svg,.lh-net-unknown .en-netnote svg{color:var(--blue)}

/* --- 访问按钮的底色与文字色 ---
 * 模板里 .lh a{color:inherit} 的特异性(0,1,1)高于 .en-btn--main(0,1,0)，
 * 会盖掉按钮自身声明的 color，使按钮文字继承了外层正文色（深灰）。
 * 在实心底色上这段文字对比度不足，故这里用 .lh 前缀把特异性提到同档，
 * 确保按钮文字始终按设计取色。 */
.lh .en-btn--main{color:#fff}
.lh .en-btn--main svg{stroke:currentColor}

/* --- 访问按钮配色跟随判定结果 ---
 * 校园网（含疑似教育网）：主按钮转为可直连的绿系；
 * 校外 / IPv6：主按钮回到品牌蓝，副按钮（Off-campus）加重为实心深色，引导优先校外入口。 */
.lh-net-campus .en-btn--main{background:#2fa85f;box-shadow:0 4px 12px rgba(47,168,95,.28)}
.lh-net-campus .en-btn--main:hover{background:#268f50}
.lh-net-likely .en-btn--main{background:#c8952c;box-shadow:0 4px 12px rgba(200,149,44,.28)}
.lh-net-likely .en-btn--main:hover{background:#b08324}
.lh-net-outside .en-btn--ghost,.lh-net-unknown .en-btn--ghost{
  background:var(--deep);border-color:var(--deep);color:#fff}
.lh-net-outside .en-btn--ghost:hover,.lh-net-unknown .en-btn--ghost:hover{
  background:var(--deep2);border-color:var(--deep2);color:#fff}

/* --- 返回顶部浮动按钮（英文页专属元素 .lh-top）
 * 该按钮只存在于 en.htm，共用 CSS 未定义样式，若不补会退化成浏览器默认的
 * 300x150 SVG，占据页面底部一大块。此处补齐尺寸/配色/显隐，
 * 视觉与中文页右下角 .lh-dock 的「回到顶部」保持一致。 */
.lh .lh-top{
  position:fixed;right:18px;bottom:24px;z-index:210;
  display:none;place-items:center;width:46px;height:46px;
  border-radius:8px;background:#fff;border:1px solid var(--line);
  box-shadow:var(--sh2);color:#5b6779;cursor:pointer;
  transition:opacity .2s,background .2s,border-color .2s,color .2s;
}
.lh .lh-top.is-on{display:grid}
.lh .lh-top svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.lh .lh-top:hover{background:var(--deep);border-color:var(--deep);color:#fff}
.lh .lh-top:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
@media (max-width:1024px){
  .lh .lh-top{right:12px;bottom:18px;width:42px;height:42px;border-radius:6px}
}

/* --- AI 馆员提示气泡：英文页文案较长，覆盖共用样式让它可换行
 * 共用 lh-overlay.css 里该气泡是 white-space:nowrap（中文页文案短，够用），
 * 但英文页文案近百字符，nowrap 下单行宽约 516px，在手机上会向左溢出屏幕。
 * 这里改为可换行 + 限宽，并保留原有的 .is-on/hover 显隐逻辑不变。 */
.lh .lh-ai-float__tip{
  white-space:normal;width:max-content;max-width:268px;
  line-height:1.6;padding:9px 14px;border-radius:8px;
}
@media (max-width:575px){
  .lh .lh-ai-float__tip{max-width:min(268px,62vw);font-size:12.5px;padding:8px 12px}
}