/**
 * 大屏原型补丁（仅 html.ls-proto 页面引用）
 * 质量 5 屏 + 成本 2 屏：布局、换行、图表区最小高度、安全区。
 * 勿在其它业务页引用，避免无意覆盖。
 */
html.ls-proto,
html.ls-proto body {
  height: 100%;
}

/* 刘海 / 横屏安全区 */
html.ls-proto .stage-wrap,
html.ls-proto .scr-stage {
  box-sizing: border-box;
  padding-top: env(safe-area-inset-top, 0px);
  padding-right: env(safe-area-inset-right, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  padding-left: env(safe-area-inset-left, 0px);
}

/* 成本页：脚本写入 --dvw 前仍可用 */
html.ls-proto {
  --dvw: 1vw;
  --dvh: 1vh;
  --dvmin: 1vmin;
}

/* 顶栏 Tab + 元数据较多时换行，避免重叠 */
@media (max-width: 1400px) {
  html.ls-proto body.screen-1920.inner .dh-head {
    flex-wrap: wrap;
    row-gap: 8px;
    align-items: flex-start;
  }
}

@media (max-width: 1180px) {
  html.ls-proto body.is-screen.light .scr-head {
    flex-wrap: wrap;
    row-gap: 8px;
    align-items: flex-start;
  }
  html.ls-proto body.is-screen.light .scr-head .meta {
    margin-left: 0;
    width: 100%;
    justify-content: flex-start;
  }
}

/* 放行监控：主区在 flex 列中占满剩余高度 */
html.ls-proto body.screen-1920.inner .rl-grid.rl-grid--main {
  flex: 1 1 52%;
  min-height: 220px;
}

/* 放行监控 / 综合质量：隐式行高度，避免图表区域塌缩 */
html.ls-proto body.screen-1920.inner .rl-grid {
  grid-auto-rows: minmax(0, 1fr);
}
html.ls-proto body.screen-1920.inner .qa-grid {
  grid-auto-rows: minmax(min(140px, 18dvh), 1fr);
}

/* Tab 内主网格（质量管理 / 追溯 / 安灯） */
html.ls-proto body.screen-1920.inner #panes .main-grid {
  grid-auto-rows: minmax(min(120px, 15dvh), 1fr);
}

/* 图表容器：保证 DT.Chart 有纵向空间（排除无 padding 的全幅图） */
html.ls-proto body.screen-1920.inner .glass-panel > .panel-bd[id]:not(.np) {
  min-height: clamp(96px, 11dvh, 200px);
}

/* 成本大屏：实际为 3 行面板，修正 2 行模板导致的第三行挤压 */
html.ls-proto body.is-screen.light .scr-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-rows: repeat(3, minmax(0, 1fr));
  align-content: stretch;
}

html.ls-proto body.is-screen.light .scr-panel .hd {
  height: auto;
  min-height: 34px;
  flex-wrap: wrap;
  row-gap: 4px;
  align-items: center;
}

html.ls-proto body.is-screen.light .scr-panel > .bd[id] {
  min-height: clamp(100px, 12dvh, 240px);
}

/* 放行流水线：阶段列内容可滚动 */
html.ls-proto .pipe .stage .body {
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
