/* AI生成 */
/* ============================================================
   温室助手 · 数据大屏（深色科技风 / 1920x1080 基准，等比缩放）
   独立全屏页：不挂侧边栏；含发光边框 / 扫描线 / 角标 / 数字滚动
   ============================================================ */
.screen-root {
  position: fixed; inset: 0; overflow: hidden;
  background: radial-gradient(1400px 720px at 50% -12%, #0b3a52 0%, transparent 62%),
              radial-gradient(1100px 700px at 100% 112%, #06212a 0%, transparent 60%),
              radial-gradient(900px 600px at 0% 100%, #071d2b 0%, transparent 60%),
              linear-gradient(160deg, #04111a 0%, #061a26 55%, #03101a 100%);
  color: #d8ecf5; font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
}
.screen-root::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(rgba(45,212,191,.045) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(45,212,191,.045) 1px, transparent 1px);
  background-size: 52px 52px;
}
.screen-stage { position: absolute; left: 50%; top: 50%; transform-origin: center center; width: 1920px; height: 1080px; }

/* 四角科技角标 */
.sc-corner { position: absolute; width: 46px; height: 46px; pointer-events: none; }
.sc-corner::before, .sc-corner::after { content: ""; position: absolute; background: #2dd4bf; box-shadow: 0 0 12px rgba(45,212,191,.7); }
.sc-corner::before { width: 100%; height: 2px; }
.sc-corner::after { width: 2px; height: 100%; }
.sc-corner.tl { left: 12px; top: 12px; } .sc-corner.tl::before { top: 0; left: 0; } .sc-corner.tl::after { top: 0; left: 0; }
.sc-corner.tr { right: 12px; top: 12px; } .sc-corner.tr::before { top: 0; right: 0; } .sc-corner.tr::after { top: 0; right: 0; }
.sc-corner.bl { left: 12px; bottom: 12px; } .sc-corner.bl::before { bottom: 0; left: 0; } .sc-corner.bl::after { bottom: 0; left: 0; }
.sc-corner.br { right: 12px; bottom: 12px; } .sc-corner.br::before { bottom: 0; right: 0; } .sc-corner.br::after { bottom: 0; right: 0; }

/* 顶部标题栏 */
.screen-header {
  position: absolute; top: 0; left: 0; right: 0; height: 88px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(180deg, rgba(12,74,110,.55), transparent);
}
.sh-line { position: absolute; top: 66px; width: 430px; height: 2px; }
.sh-line.left { left: 96px; background: linear-gradient(90deg, transparent, #22b8c9); }
.sh-line.right { right: 96px; background: linear-gradient(90deg, transparent, #22b8c9); transform: scaleX(-1); }
.screen-title {
  font-size: 36px; font-weight: 800; letter-spacing: 8px;
  background: linear-gradient(180deg, #eafcff, #4dd6e8 70%, #22b8c9);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  text-shadow: 0 4px 26px rgba(34,184,201,.35);
}
.screen-sub { position: absolute; top: 30px; left: 46px; font-size: 12px; color: #4f9db0; letter-spacing: 3px; }
.screen-clock { position: absolute; top: 26px; right: 46px; display: flex; align-items: center; gap: 14px; }
.screen-clock .t { font-family: Consolas, monospace; font-size: 17px; color: #6fe3f0; letter-spacing: 1px; }
.sc-live { font-size: 12px; color: #5b8ea3; padding: 2px 10px; border-radius: 10px; border: 1px solid rgba(95,142,163,.4); }
.sc-live.on { color: #7cff9b; border-color: rgba(124,255,155,.5); box-shadow: 0 0 12px rgba(124,255,155,.25); }

/* 主体：顶部块状汇总 + 三列 */
.sc-topbar {
  position: absolute; top: 96px; left: 24px; right: 24px; height: 84px;
  display: grid; grid-template-columns: repeat(10, 1fr); gap: 12px;
}
.sc-tk {
  position: relative; border-radius: 8px; overflow: hidden;
  background: linear-gradient(180deg, rgba(16,58,80,.55), rgba(7,28,42,.72));
  border: 1px solid rgba(45,212,191,.22);
  box-shadow: inset 0 0 22px rgba(34,184,201,.07);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.sc-tk::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: linear-gradient(#0ea5e9, #2dd4bf); box-shadow: 0 0 8px rgba(45,212,191,.55); }
.sc-tk .tk-num { font-family: Consolas, monospace; font-size: 30px; font-weight: 700; line-height: 1.1;
  background: linear-gradient(180deg, #ffffff, #6fe3f0); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sc-tk .tk-num small { font-size: 14px; font-weight: 600; }
.sc-tk.hl .tk-num { background: linear-gradient(180deg, #c9ffe6, #22c55e); -webkit-background-clip: text; background-clip: text; }
.sc-tk.hl2 .tk-num { background: linear-gradient(180deg, #ffe8a3, #f5a524); -webkit-background-clip: text; background-clip: text; }
.sc-tk .tk-label { font-size: 12px; color: #6fb9cc; letter-spacing: 1px; margin-top: 3px; }

.screen-body { position: absolute; top: 192px; left: 24px; right: 24px; bottom: 18px; display: grid; grid-template-columns: 450px 1fr 450px; gap: 16px; }
.sc-col { display: grid; grid-template-rows: 1fr 1.15fr 1fr; gap: 16px; min-height: 0; }
.sc-main { display: grid; grid-template-rows: 1.15fr 0.85fr; gap: 16px; min-height: 0; }

/* 面板标题右侧小标签 */
.tt-tag { margin-left: auto; font-size: 11px; color: #f5a524; border: 1px solid rgba(245,165,36,.4); border-radius: 9px; padding: 1px 8px; letter-spacing: 0; }

/* 面板 */
.sc-panel {
  position: relative; border-radius: 10px; padding: 14px 16px 10px; min-height: 0; overflow: hidden;
  display: flex; flex-direction: column;
  background: linear-gradient(180deg, rgba(16,58,80,.52), rgba(7,28,42,.7));
  border: 1px solid rgba(45,212,191,.24);
  box-shadow: inset 0 0 34px rgba(34,184,201,.08), 0 0 16px rgba(0,0,0,.4);
}
.sc-panel::before, .sc-panel::after { content: ""; position: absolute; width: 16px; height: 16px; border: 2px solid #2dd4bf; box-shadow: 0 0 8px rgba(45,212,191,.5); }
.sc-panel::before { left: -1px; top: -1px; border-right: none; border-bottom: none; }
.sc-panel::after { right: -1px; bottom: -1px; border-left: none; border-top: none; }
.sc-panel-title { font-size: 15px; font-weight: 600; color: #7fe6f2; letter-spacing: 1.5px; margin-bottom: 8px; display: flex; align-items: center; gap: 8px; flex: none; }
.sc-panel-title i { width: 4px; height: 15px; background: linear-gradient(#2dd4bf, #0ea5e9); border-radius: 2px; box-shadow: 0 0 8px rgba(45,212,191,.6); }

/* 扫描线 */
.sc-scanline { position: absolute; left: 18px; right: 18px; height: 2px; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(45,212,191,.55), transparent);
  animation: sc-scan 7s linear infinite; }
@keyframes sc-scan { 0% { top: 100px; opacity: 0; } 8% { opacity: 1; } 92% { opacity: 1; } 100% { top: 1062px; opacity: 0; } }

/* 核心指标（数字滚动） */
.sc-kpis { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px 10px; flex: 1; }
.sc-kpi { text-align: center; padding: 2px 0; display: flex; flex-direction: column; justify-content: center; }
.sc-kpi .k-num { font-family: Consolas, monospace; font-size: 30px; font-weight: 700; line-height: 1.12;
  background: linear-gradient(180deg, #ffffff, #6fe3f0); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sc-kpi .k-num.hl { background: linear-gradient(180deg, #c9ffe6, #22c55e); -webkit-background-clip: text; background-clip: text; }
.sc-kpi .k-num.hl2 { background: linear-gradient(180deg, #ffe8a3, #f5a524); -webkit-background-clip: text; background-clip: text; }
.sc-kpi .k-label { font-size: 12px; color: #6fb9cc; letter-spacing: 1px; margin-top: 2px; }

/* 工序进度 */
.sc-progress { overflow: auto; padding-right: 4px; flex: 1; }
.sc-progress::-webkit-scrollbar, .sc-list::-webkit-scrollbar, .sc-rank::-webkit-scrollbar { width: 4px; }
.sc-progress::-webkit-scrollbar-thumb, .sc-list::-webkit-scrollbar-thumb, .sc-rank::-webkit-scrollbar-thumb { background: rgba(45,212,191,.3); border-radius: 2px; }
.sc-progress .p { margin-bottom: 9px; }
.sc-progress .pl { display: flex; justify-content: space-between; font-size: 12px; color: #a7dbe6; margin-bottom: 3px; }
.sc-progress .pl .v { font-family: Consolas, monospace; color: #7fe6f2; }
.sc-progress .bar { height: 8px; border-radius: 5px; background: rgba(30,90,110,.35); overflow: hidden; }
.sc-progress .fill { height: 100%; border-radius: 5px; background: linear-gradient(90deg, #2dd4bf, #0ea5e9); box-shadow: 0 0 10px rgba(45,212,191,.55); transition: width .8s ease; }

/* 人员实时列表 */
.sc-list { overflow: auto; flex: 1; }
.sc-li { display: flex; align-items: center; gap: 8px; padding: 5px 4px; border-bottom: 1px dashed rgba(45,212,191,.12); font-size: 12.5px; }
.sc-li .dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.sc-li .dot.busy { background: #f59e0b; box-shadow: 0 0 9px rgba(245,158,11,.8); }
.sc-li .dot.idle { background: #38bdf8; box-shadow: 0 0 7px rgba(56,189,248,.6); }
.sc-li .nm { width: 52px; color: #cdeff7; flex: none; }
.sc-li .pro { flex: 1; color: #7fb6c6; }
.sc-li .loc { color: #6fb9cc; font-family: Consolas, monospace; font-size: 11.5px; }
.sc-li .tm { color: #7fe6f2; font-family: Consolas, monospace; font-size: 11.5px; min-width: 62px; text-align: right; }
.sc-li.warn .nm { color: #fbbf24; } .sc-li.danger .nm { color: #f87171; }

/* 中央平面图 */
.map-panel { }
.sc-map { position: absolute; inset: 42px 16px 32px; display: flex; flex-direction: column; gap: 6px; overflow: auto; }
.sc-gh { border: 1px solid rgba(45,212,191,.14); border-radius: 8px; padding: 5px 8px; }
.sc-gh-name { font-size: 12px; color: #7fe6f2; letter-spacing: 1px; margin-bottom: 4px; }
.sc-zone { display: flex; align-items: center; gap: 8px; margin: 3px 0; }
.sc-zone-n { font-size: 11px; color: #4f9db0; width: 30px; flex: none; }
.sc-row { flex: 1; height: 15px; border-radius: 3px; background: rgba(30,90,110,.32); border: 1px solid rgba(45,212,191,.14); }
.sc-row.st-doing { background: linear-gradient(90deg, rgba(245,158,11,.9), rgba(245,158,11,.4)); border-color: #f59e0b; box-shadow: 0 0 9px rgba(245,158,11,.6); }
.sc-row.st-done { background: linear-gradient(90deg, rgba(34,197,94,.75), rgba(34,197,94,.28)); border-color: #22c55e; box-shadow: 0 0 7px rgba(34,197,94,.45); }
.sc-legend { position: absolute; left: 16px; bottom: 8px; display: flex; gap: 18px; font-size: 12px; color: #6fb9cc; }
.sc-legend i.d { display: inline-block; width: 14px; height: 8px; border-radius: 2px; margin-right: 5px; vertical-align: middle; }
.sc-legend i.idle { background: rgba(30,90,110,.6); border: 1px solid rgba(45,212,191,.3); }
.sc-legend i.doing { background: #f59e0b; } .sc-legend i.done { background: #22c55e; }
.sc-chart { flex: 1; min-height: 0; }

/* 右列：环形 + 迷你指标 */
.sc-dual { display: flex; align-items: center; gap: 6px; flex: 1; min-height: 0; }
.sc-ring { width: 118px; height: 118px; flex: none; }
.sc-mini { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 6px 10px; }
.sc-mini .m { display: flex; flex-direction: column; align-items: center; }
.sc-mini .mv { font-family: Consolas, monospace; font-size: 22px; font-weight: 700; color: #9fe9f5; }
.sc-mini .mv.warn { color: #fbbf24; } .sc-mini .mv.ok { color: #7cff9b; } .sc-mini .mv.danger { color: #f87171; }
.sc-mini .ml { font-size: 11.5px; color: #6fb9cc; }

/* 排行 */
.sc-rank { overflow: auto; flex: 1; }
.sc-rank .r { display: flex; align-items: center; gap: 8px; padding: 5px 2px; }
.sc-rank .no { width: 20px; height: 20px; border-radius: 6px; text-align: center; line-height: 20px; font-size: 11px; background: rgba(45,212,191,.16); color: #7fe6f2; }
.sc-rank .no.no0 { background: linear-gradient(135deg,#f5a524,#ef4444); color: #fff; }
.sc-rank .no.no1 { background: linear-gradient(135deg,#38bdf8,#2dd4bf); color: #04222b; }
.sc-rank .no.no2 { background: linear-gradient(135deg,#a7f3d0,#22c55e); color: #04222b; }
.sc-rank .nm { width: 56px; font-size: 12.5px; color: #cdeff7; }
.sc-rank .bar { flex: 1; height: 9px; border-radius: 5px; background: rgba(30,90,110,.35); overflow: hidden; }
.sc-rank .bar i { display: block; height: 100%; border-radius: 5px; background: linear-gradient(90deg, #2dd4bf, #7cff9b); }
.sc-rank .c { width: 34px; text-align: right; font-family: Consolas, monospace; color: #7fe6f2; font-size: 12.5px; }

/* 异常处理概览 */
.sc-anomaly { overflow: auto; flex: 1; padding-right: 4px; }
.sc-anomaly::-webkit-scrollbar, .sc-worklist::-webkit-scrollbar { width: 4px; }
.sc-anomaly::-webkit-scrollbar-thumb, .sc-worklist::-webkit-scrollbar-thumb { background: rgba(45,212,191,.3); border-radius: 2px; }
.sc-an { margin-bottom: 10px; }
.sc-an .an-line { display: flex; align-items: center; gap: 8px; font-size: 12px; margin-bottom: 3px; }
.sc-an .no { font-family: Consolas, monospace; color: #f5a524; flex: none; }
.sc-an .ct { flex: 1; color: #cdeff7; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sc-an .who { color: #7fb6c6; flex: none; }
.sc-an .an-bar { position: relative; height: 10px; border-radius: 5px; background: rgba(30,90,110,.35); overflow: hidden; }
.sc-an .an-bar i { display: block; height: 100%; border-radius: 5px; background: linear-gradient(90deg, #0ea5e9, #2dd4bf); box-shadow: 0 0 8px rgba(45,212,191,.45); transition: width .8s ease; }
.sc-an .an-bar i.hot { background: linear-gradient(90deg, #22c55e, #7cff9b); box-shadow: 0 0 9px rgba(124,255,155,.5); }
.sc-an .an-bar em { position: absolute; right: 6px; top: 0; line-height: 10px; font-size: 9.5px; font-style: normal; color: #9fd4ff; letter-spacing: 0; }

/* 正在作业行道（横向百分比条） */
.sc-worklist { overflow: auto; flex: 1; padding: 2px 6px 4px 0; }
.sc-work { margin-bottom: 12px; }
.sc-work .w-line { display: flex; align-items: baseline; gap: 12px; font-size: 13px; margin-bottom: 4px; }
.sc-work .loc { color: #cdeff7; font-weight: 600; flex: none; }
.sc-work .loc .gh { font-style: normal; font-size: 11px; color: #6fb9cc; margin-left: 6px; font-weight: 400; }
.sc-work .pc { color: #7fe6f2; flex: 1; }
.sc-work .who { color: #cdeff7; flex: none; }
.sc-work .tm { color: #7fe6f2; font-family: Consolas, monospace; flex: none; }
.sc-work .pct { color: #9fe9f5; font-family: Consolas, monospace; flex: none; min-width: 52px; text-align: right; }
.sc-work .pct.hot { color: #7cff9b; }
.sc-work .w-bar { height: 12px; border-radius: 6px; background: rgba(30,90,110,.35); overflow: hidden; position: relative; }
.sc-work .w-bar i { display: block; height: 100%; border-radius: 6px;
  background: linear-gradient(90deg, #0ea5e9, #2dd4bf, #7cff9b); box-shadow: 0 0 12px rgba(45,212,191,.5); transition: width .8s ease; }
.sc-work .w-bar i::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(180deg, rgba(255,255,255,.35), transparent); }
.sc-work .w-sub { font-size: 11px; color: #6fb9cc; margin-top: 3px; letter-spacing: 0; }
.sc-work.warn .pc { color: #fbbf24; } .sc-work.danger .pc { color: #f87171; }
.sc-work.danger .w-bar i { background: linear-gradient(90deg, #ef4444, #f59e0b); box-shadow: 0 0 10px rgba(239,68,68,.5); }

.empty { color: #3d7d92; font-size: 12px; text-align: center; padding: 16px 0; }