/* Read-only industrial symbols. Scoped to the third system-view tab. */
.system-scada { --scada-ink: #234940; --scada-muted: #526963; --scada-live: #167454; --scada-fault: #b33339; display: flex; flex-direction: column; width: 100%; height: 100%; min-height: 0; color: var(--scada-ink); background: #fff; font-family: "Microsoft YaHei", "PingFang SC", system-ui, sans-serif; }
.scada-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 24px; flex: 0 0 auto; min-height: 48px; padding: 8px 14px; box-sizing: border-box; border-bottom: 1px solid #dbe6e2; background: #f2f7f5; }
.scada-toolbar > strong { font-size: 16px; }
.scada-legend { display: flex; flex: 1; flex-wrap: wrap; align-items: center; gap: 8px 18px; font-size: 12px; }
.scada-legend span { display: inline-flex; gap: 6px; align-items: center; white-space: nowrap; }
.scada-legend i { display: inline-block; width: 19px; height: 4px; border-radius: 2px; background: #227cac; }
.scada-legend .scada-key-warm { background: #b76b27; }
.scada-legend .scada-key-live { background: #167454; width: 8px; height: 8px; }
.scada-legend .scada-key-fault { background: #b33339; width: 8px; height: 8px; }
.scada-readonly { padding: 3px 7px; border-radius: 4px; background: #dcece4; color: #245c47; font-size: 12px; }
.scada-viewport { flex: 1 1 0; min-width: 0; min-height: 0; width: 100%; overflow: hidden; padding: 12px; box-sizing: border-box; }
.scada-viewport:focus-visible { outline: 2px solid #237455; outline-offset: -3px; }
.scada-surface { position: relative; width: 1640px; height: 920px; margin-inline: auto; overflow: hidden; }
.scada-canvas { position: absolute; inset: 0 auto auto 0; width: 1640px; height: 920px; transform-origin: top left; }
.scada-svg { display: block; width: 100%; height: 100%; overflow: hidden; font-family: inherit; text-anchor: middle; }
.scada-pipe-halo { fill: none; stroke: #fff; stroke-width: 9; stroke-linecap: round; stroke-linejoin: round; }
.scada-pipe { fill: none; stroke-width: 3.5; stroke-linejoin: round; stroke-linecap: round; }
.scada-pipe-cold { stroke: #227cac; }
.scada-pipe-warm { stroke: #b76b27; }
.scada-pipe-neutral { stroke: #68817c; }
.scada-pipe-steam { stroke: #8a598b; }
.scada-group-title { fill: #285d4c; font-size: 19px; font-weight: 750; paint-order: stroke; stroke: white; stroke-width: 8; }
.scada-device-label { fill: #224c3e; font-size: 14px; font-weight: 650; paint-order: stroke; stroke: #fff; stroke-width: 4; }
.scada-device-state { fill: #526963; font-size: 13px; font-weight: 650; paint-order: stroke; stroke: #fff; stroke-width: 5; }
.scada-value { fill: #145b79; font-size: 18px; font-weight: 700; font-variant-numeric: tabular-nums; paint-order: stroke; stroke: white; stroke-width: 5; }
.scada-reading { fill: #145b79; font-size: 14px; font-weight: 650; font-variant-numeric: tabular-nums; paint-order: stroke; stroke: white; stroke-width: 5; }
.scada-device[data-scada-kind="tower"] .scada-value { font-size: 15px; }
.scada-small { fill: #526963; font-size: 13px; paint-order: stroke; stroke: #fff; stroke-width: 4; }
.scada-machine { fill: #f3f7f5; stroke: #58756c; stroke-width: 1.7; }
.scada-symbol-line { fill: none; stroke: #58756c; stroke-width: 1.5; }
.scada-rotor { fill: #80968e; stroke: #58756c; stroke-width: 1; }
.scada-sensor { fill: #fff; stroke: #58756c; stroke-width: 1.5; }
.scada-header-vessel { fill: #e7f0ec; stroke: #567e6e; stroke-width: 1.5; }
.scada-terminal { fill: #f3f7f5; stroke: #c5d8ce; }
.scada-probe-line { stroke: #297c68; stroke-width: 2; }
.scada-probe-leader { stroke: #527367; stroke-width: 1; stroke-dasharray: 3 3; fill: none; }
.scada-device[data-state="running"] .scada-machine { fill: #dcf0e4; stroke: #167454; }
.scada-device[data-state="running"] .scada-device-state { fill: #126641; }
.scada-device[data-state="running"] .scada-rotor { fill: #22865d; }
.scada-device[data-state="fault"] .scada-machine { fill: #f8e6e4; stroke: #b33339; }
.scada-device[data-state="fault"] .scada-device-state { fill: #b33339; }
.scada-device[data-state="stale"] .scada-device-state { fill: #86570d; }
.scada-device[data-state="invalid"] .scada-device-state { fill: #86570d; }
.scada-device[data-state="invalid"] .scada-machine { fill: #fff3da; stroke: #86570d; }
.scada-device[data-state="charging"] .scada-tank-shell { fill: #e0eef7; stroke: #227cac; }
.scada-device[data-state="discharging"] .scada-tank-shell { fill: #e1f0e7; stroke: #167454; }
.scada-device[data-state="stale"] .scada-value, .scada-device[data-state="stale"] .scada-reading,
.scada-device[data-state="waiting"] .scada-value, .scada-device[data-state="waiting"] .scada-reading { fill: #526963; }
.scada-footer { display: flex; flex: 0 0 auto; justify-content: space-between; flex-wrap: wrap; gap: 6px 16px; padding: 7px 14px; color: #526963; background: #fff; font-size: 11px; line-height: 1.5; }
@media (max-width: 700px) {
  #monitorSystemViewer .monitor-system-switcher { flex-wrap: wrap; gap: 8px; }
  #monitorSystemViewer .monitor-system-view-tabs { width: 100%; flex: 1 1 100%; gap: 4px; }
  #monitorSystemViewer .monitor-system-view-tabs button { font-size: 12px; padding: 7px 4px; flex: 1 1 0; }
  #monitorSystemViewer .monitor-system-title-text { position: static; width: auto; height: auto; clip-path: none; }
  .scada-toolbar { gap: 8px; padding: 8px; }
  .scada-toolbar > strong { font-size: 14px; }
  .scada-legend { flex: 1 1 65%; gap: 6px 10px; font-size: 11px; }
  .scada-footer span:last-child { display: none; }
}
