/* ============================================================
 * 屏幕自适应兜底（必须最后加载，覆盖前面的固定列宽）
 * ------------------------------------------------------------
 * 背景：站点原有断点集中在 1240 / 1100 / 900px。高分屏（如 1920×1080）
 * 开启 Windows 125%/150% 缩放后，浏览器等效视口约 1536 / 1280px，
 * 正好落在这些断点之间的“空档”：多栏布局的侧栏仍按桌面宽度占位，
 * 中间内容被挤压，出现卡片/网格重叠、越界。
 *
 * 本文件只做一件事：在这段空档里按比例收窄固定像素侧栏、减少列数。
 * 不改配色、不改结构、不动数据逻辑；且用 min-width 限定范围，
 * 不覆盖原有 ≤900px 的移动端规则。
 * ============================================================ */

/* 综述卡片：1241–1536px 由 4 列降为 3 列，避免中等宽度下卡片过窄 */
@media (min-width:1241px) and (max-width:1536px){
  .zs-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* 901–1366px：收窄教案侧栏 / 通用侧栏 / 馆藏侧栏 / 阅读三栏 */
@media (min-width:901px) and (max-width:1366px){
  #view-jiaoan .mod-body{grid-template-columns:var(--as-w,260px) 16px minmax(0,1fr)}
  .mod-body{grid-template-columns:270px minmax(0,1fr)}
  .kbm-body{grid-template-columns:300px minmax(0,1fr)}
  .reader{grid-template-columns:170px minmax(0,1fr) 200px}
}

/* 901–1180px：进一步收窄，给主内容留出空间 */
@media (min-width:901px) and (max-width:1180px){
  #view-jiaoan .mod-body{grid-template-columns:var(--as-w,240px) 14px minmax(0,1fr)}
  .mod-body{grid-template-columns:240px minmax(0,1fr)}
  .kbm-body{grid-template-columns:270px minmax(0,1fr)}
  .reader{grid-template-columns:150px minmax(0,1fr) 180px}
}

/* 图片一律不超过容器，避免小屏横向溢出 */
img{max-width:100%}