* { margin:0; padding:0; box-sizing:border-box; }
body { background:#0a1420; color:#cfe3f5; font-family:'Microsoft YaHei',system-ui,sans-serif; }
.login-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center; }
.login-card { width:320px; display:flex; flex-direction:column; gap:12px;
  background:#0e1c2c; border:1px solid #16406a; border-radius:8px; padding:28px; }
.login-card h2 { font-size:16px; text-align:center; color:#7fb2d9; }
.login-card input { padding:10px; background:#081424; border:1px solid #1d3a5a; color:#cfe3f5; border-radius:4px; }
.login-card button { padding:10px; background:#0d5c9e; border:none; color:#fff; border-radius:4px; cursor:pointer; }
.err { color:#ff7a7a; font-size:12px; min-height:16px; }
.placeholder { padding:40px; text-align:center; color:#406080; }

.topbar { display:flex; justify-content:space-between; align-items:center; padding:10px 16px;
  background:#0e1c2c; border-bottom:1px solid #16406a; }
.topbar-r { display:flex; align-items:center; gap:12px; }
.topbar button { background:#16406a; color:#cfe3f5; border:1px solid #1d4a72; padding:6px 12px; border-radius:4px; cursor:pointer; }
.wrap { padding:14px; }
.kpis { display:flex; gap:10px; margin-bottom:14px; }
.kpi { flex:1; background:#0e1c2c; border:1px solid #16406a; border-radius:6px; padding:14px; }
.kpi .n { font-size:26px; font-weight:700; color:#e8f4ff; }
.kpi .n small { font-size:13px; color:#5a86ab; }
.kpi .l { font-size:12px; color:#5a86ab; }
.kpi.on .n { color:#3ddc84; } .kpi.off .n { color:#ff7a7a; }
.kpi.rt .n { color:#ce93d8; } .kpi.pd .n { color:#4dd0e1; }
.dev-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:10px; }
.dev-card { background:#0e1c2c; border:1px solid #16406a; border-radius:6px; padding:12px; }
.dev-card.off { opacity:.55; }
.dev-head { display:flex; align-items:center; gap:8px; margin-bottom:10px; }
.dev-head b { color:#bcd9f0; }
.dev-head .ts { margin-left:auto; font-size:11px; color:#4a7294; }
.dot { width:8px; height:8px; border-radius:50%; display:inline-block; }
.dot.on { background:#3ddc84; box-shadow:0 0 6px #3ddc84; }
.dot.off { background:#ff7a7a; }
.dev-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.dev-grid div { text-align:center; }
.dev-grid i { display:block; font-style:normal; font-size:11px; color:#5a86ab; }
.dev-grid b { font-size:16px; color:#e8f4ff; }
.dev-grid b.g { color:#3ddc84; } .dev-grid b.y { color:#ffca28; } .dev-grid b.r { color:#ff7a7a; }
.ov-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:10px;
  max-height:calc(100vh - 320px); overflow-y:auto; padding:2px 4px 6px 2px; }
.ov-meta { margin-top:10px; padding-top:8px; border-top:1px solid #11243a; font-size:12px; color:#5a86ab;
  display:flex; gap:14px; flex-wrap:wrap; }
.ov-meta b { color:#9cc3e0; font-weight:600; }

.anav { display:flex; gap:4px; padding:8px 16px; background:#0b1624; border-bottom:1px solid #122a44; }
.anav a { color:#7fb2d9; text-decoration:none; padding:6px 12px; border-radius:4px; font-size:13px; }
.anav a:hover { background:#122a44; }
.tbl-card { background:#0e1c2c; border:1px solid #16406a; border-radius:6px; padding:12px; }
.tbl { width:100%; border-collapse:collapse; font-size:13px; }
.tbl th { text-align:left; color:#5a86ab; border-bottom:1px solid #1d3a5a; padding:6px; }
.tbl th.sortable { cursor:pointer; }
.tbl th.sortable:hover { color:#7fb2d9; }
.tbl td { padding:6px; border-bottom:1px solid #11243a; }
.tbl tr.bound td { color:#5a86ab; }
.tbl tr.other-bound td { color:#5a86ab; opacity:.55; }
.st { padding:2px 8px; border-radius:8px; font-size:12px; }
.st.active { color:#3ddc84; background:#0d2a1c; }
.st.disabled { color:#ff7a7a; background:#2a1414; }
.ops button, .form-row button { background:#16406a; color:#cfe3f5; border:1px solid #1d4a72; padding:4px 10px; border-radius:4px; cursor:pointer; font-size:12px; }
.form-row { display:flex; gap:8px; margin:12px 0; align-items:center; flex-wrap:wrap; }
.form-row input, .form-row select { padding:8px; background:#081424; border:1px solid #1d3a5a; color:#cfe3f5; border-radius:4px; }
h3 { margin:10px 0; color:#9cc3e0; font-size:15px; } h4 { margin:10px 0; color:#7fb2d9; font-size:13px; }
a { color:#7fb2d9; }
.hidden { display:none; }
.badge { display:inline-block; padding:2px 8px; border-radius:8px; font-size:12px; background:#122a44; color:#9cc3e0; margin-right:4px; }
.badge.super { background:#0d2a1c; color:#3ddc84; }
.badge.none { background:#2a1414; color:#ff7a7a; }
.chk { display:inline-flex; align-items:center; gap:4px; font-size:12px; color:#9cc3e0; }
.modal-mask { position:fixed; inset:0; background:rgba(0,0,0,.6); display:flex; align-items:center; justify-content:center; z-index:100; }
.modal { background:#0e1c2c; border:1px solid #16406a; border-radius:8px; padding:20px; width:340px; }
.modal h3 { margin-top:0; }
.modal.wide { width:min(780px,94vw); }
.seg { display:flex; gap:8px; margin:10px 0; }
.seg button { background:#16406a; color:#cfe3f5; border:1px solid #1d4a72; padding:6px 14px; border-radius:4px; cursor:pointer; font-size:13px; }
.seg button.on { background:#0d5c9e; border-color:#1d5a92; color:#fff; }
.tbl td.empty { text-align:center; color:#406080; padding:24px; }

/* 资产看板(设备卡片) */
.ast-strip { margin:12px 0 4px; color:#9cc3e0; font-size:13px; }
.ast-strip b { color:#e8f4ff; }
.ast-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:10px; margin-top:10px; }
.ast-card { background:#0e1c2c; border:1px solid #16406a; border-radius:6px; padding:14px; cursor:pointer; }
.ast-card:hover { border-color:#1d5a92; }
.ast-card.ub { border-style:dashed; opacity:.85; }
.ast-head b { color:#bcd9f0; font-size:14px; }
.ast-meta { font-size:12px; color:#5a86ab; margin:2px 0 10px; }
.ast-n { font-size:28px; font-weight:700; color:#ce93d8; font-variant-numeric:tabular-nums; }
.ast-l { font-size:12px; color:#5a86ab; }
.ast-cat { margin-top:10px; font-size:12px; color:#7fb2d9; }
.ast-none { padding:30px; text-align:center; color:#406080; font-size:13px; }

/* ---- 生产运营驾驶舱(独立大屏) ---- */
.cp-root { min-height:100vh; display:flex; flex-direction:column;
  background:radial-gradient(1200px 600px at 20% -10%, #0e2a42 0%, #0a1420 55%); }
.cp-root:fullscreen { background:#08111c; }
.cp-top { display:flex; justify-content:space-between; align-items:center; padding:14px 22px; border-bottom:1px solid #16406a; }
.cp-top h1 { font-size:22px; letter-spacing:4px; color:#e8f4ff; }
.cp-tools { display:flex; align-items:center; gap:14px; font-size:13px; color:#7fb2d9; }
.cp-tools button { background:#16406a; color:#cfe3f5; border:1px solid #1d4a72; padding:6px 12px; border-radius:4px; cursor:pointer; }
.cp-exit { color:#7fb2d9; text-decoration:none; }
.cp-hint { color:#406080; font-size:12px; }
.cp-kpis { display:grid; grid-template-columns:repeat(6,1fr); gap:12px; padding:18px 22px; }
.cp-kpi { background:#0e1c2c; border:1px solid #16406a; border-radius:8px; padding:16px; text-align:center; }
.cp-kpi .n { font-size:34px; font-weight:700; color:#e8f4ff; font-variant-numeric:tabular-nums; }
.cp-kpi .n small { font-size:14px; color:#5a86ab; }
.cp-kpi .l { font-size:12px; color:#5a86ab; margin-top:4px; }
.cp-kpi.on .n { color:#3ddc84; } .cp-kpi.pd .n { color:#4dd0e1; } .cp-kpi.rt .n { color:#ce93d8; }
.cp-grid { flex:1; min-height:0; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:14px; padding:0 22px 22px; }
.cp-card { min-height:0; display:flex; flex-direction:column; position:relative;
  background:#0e1c2c; border:1px solid #16406a; border-radius:8px; padding:14px; }
.cp-card h3 { margin:0 0 10px; font-size:14px; color:#9cc3e0; }
.cp-chart { flex:1; min-height:0; }
.cp-wide { grid-column:1 / -1; }
.cp-empty { display:none; align-items:center; justify-content:center; position:absolute; inset:38px 0 0; color:#406080; font-size:13px; }
