/* Yuntu first integrated layout. Page flow stays scrollable at every size. */
html,body{width:100%;height:100%;min-width:0;overflow:hidden}
#application{--ym-period:1.45s;--ym-green:#59e4aa;--ym-red:#ff8290;--ym-amber:#f4c468;--ym-muted:#9cb7ca;height:100dvh;width:100%;overflow-y:auto;overflow-x:hidden;background:#061728;color:#dceefb;font:13px/1.55 "Microsoft YaHei","PingFang SC",sans-serif;scrollbar-gutter:stable}
#application [hidden]{display:none!important}#application *{box-sizing:border-box}
#application button,#application select,#application input{font:inherit;transition:none}
#application button:hover{transform:none;animation:none;filter:none;box-shadow:none;background:#19465e;color:#d9f5ff}
#application button:disabled{cursor:not-allowed}#application button:focus-visible{outline:2px solid #7ceaff;outline-offset:2px}
#application .topbar{position:static;display:grid;grid-template-columns:210px minmax(0,1fr) 285px;min-height:94px;height:auto;gap:15px;padding:15px 20px;background:linear-gradient(100deg,#081d32,#0e3049 50%,#081d32);border-bottom:1px solid #27677f}
#application .brand{font-size:18px;gap:10px}#application .brand-mark{width:42px;height:45px;font-size:25px;flex-shrink:0}#application .brand small{font-size:10px;letter-spacing:1.5px}
#application .page-title{grid-area:auto;text-align:center;min-width:0;padding:12px 8px;background:linear-gradient(100deg,#12354e,#185478,#12354e);clip-path:polygon(0 0,100% 0,95% 100%,5% 100%);border-bottom:2px solid #30c8e7}
#application .page-title h1{font-size:25px;letter-spacing:1px;line-height:1.4;margin:0}#application .page-title>span{font-size:10px;letter-spacing:2px}
#application .header-tools{grid-area:auto;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;font-size:12px}#application #clock{width:100%;text-align:right}#application .header-tools button{padding:4px 8px;min-height:30px}
#application .navigation{position:static;height:auto;min-height:52px;display:flex;gap:15px;align-items:center;padding:8px 18px;background:#0b243b;border-bottom:1px solid #21516d}
#application .navigation>div{display:flex;gap:10px;flex-wrap:wrap}#application .navigation .management-tabs{margin-left:auto}#application .navigation .connection{font-size:11px;padding:0;gap:6px}
#application .navigation button{padding:7px 18px;border:1px solid #295871;border-bottom:2px solid #295871;background:#10314a;border-radius:2px;color:#cde9f8}
#application .navigation button.active,#application .visual-tabs button[aria-pressed=true]{background:#15506a;border-color:#4fd3ee;color:#80e9fa}
#application .scope-bar{display:flex;gap:14px;flex-wrap:wrap;align-items:center;padding:12px 18px 0}#application .scope-bar label{display:flex;align-items:center;gap:6px;font-size:12px;min-width:0}#application .scope-bar select{max-width:290px;width:auto;background:#0d293d;border:1px solid #2c5971;border-radius:4px;color:#cae4f5;padding:6px 9px}#application #scope-label{margin-left:auto;color:#a1bed1;font-size:12px}
#application .summary{padding:12px 18px 0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}#application .summary-card{min-height:86px;background:#0e3047;border:1px solid #285c73;border-radius:5px;padding:12px 15px}#application .summary-card.communication-card{grid-column:auto}#application .summary-card strong{font-size:30px}#application .summary-card p{font-size:11px}#application .summary-card>span{font-size:13px}
#application .data-status{padding:8px 12px;margin:10px 18px 0;display:flex;gap:7px 18px;flex-wrap:wrap;font-size:11px;color:#98b9ce;background:#0b2539;border-color:#234658}#application .data-status>span{line-height:1.5}
#application .workspace,#application .workspace.sidebar-collapsed{display:grid;grid-template-columns:210px minmax(0,1fr);gap:14px;align-items:start;padding:14px 18px 24px;min-height:0;max-width:none;margin:0;height:auto;overflow:visible}
#application .workspace.sidebar-collapsed{grid-template-columns:48px minmax(0,1fr)}#application .station-panel{position:sticky;top:12px;max-height:calc(100dvh - 24px);min-height:0;background:#0b283e;border:1px solid #28576e;border-radius:5px;overflow:hidden}
#application .station-heading{padding:11px 10px;gap:6px}#application .station-heading h2{font-size:15px}#application #station-count{font-size:12px}#application .station-search{margin:0 9px 9px}#application .station-search input{width:100%;min-width:0;font-size:12px}#application .station-filters{padding:0 8px;display:flex;flex-wrap:wrap;gap:5px}#application .station-filters button{font-size:11px;padding:3px 7px}#application .list-caption{padding:10px;font-size:11px}#application #stations{max-height:calc(100dvh - 245px);min-height:120px;overflow-y:auto}#application .station-row{padding:11px 9px}#application .station-name{display:flex;gap:6px;align-items:flex-start}#application .station-name strong{font-size:12px;white-space:normal;overflow-wrap:anywhere}#application .online-badge{font-size:10px;padding:1px 3px}#application .station-row .device-no{font-size:10px;margin:4px 0}#application .station-row-foot,#application .station-data-issue{font-size:11px}#application .group-toggle{padding:9px;font-size:12px}#application .sidebar-foot{font-size:11px;padding:10px}
#application .main-content,#application .view{min-width:0;overflow:visible}#application .detail-heading{margin:0 0 12px;padding:15px 17px;min-height:90px;background:linear-gradient(110deg,#10334a,#0c283d);border:1px solid #2a5b73;border-radius:5px;gap:10px;align-items:center}#application .detail-heading h2{font-size:23px;line-height:1.4;margin:4px 0}#application .detail-heading .eyebrow{font-size:10px;letter-spacing:2px}#application .detail-heading p{font-size:12px;margin:6px 0 0}#application .station-heading-right{font-size:11px;max-width:440px;text-align:right}#application .station-heading-right p{font-size:11px}#application .tag{font-size:11px;padding:3px 6px}
#application .panel{background:#0b293e;border:1px solid #28596f;border-radius:5px;box-shadow:none;overflow:hidden}#application .panel-heading{padding:11px 13px;min-height:44px;background:#103247;border-bottom:1px solid #285266;gap:8px;margin:0}#application .panel-heading h3,#application .equipment-heading h3{font-size:14px;margin:0;color:#dff5ff}#application .panel-heading span,#application .panel-heading p{font-size:11px;color:#9dbfd2}#application .panel-note{padding:9px 12px;margin:0;font-size:12px;line-height:1.6;overflow-wrap:anywhere}
#application .station-layout{display:flex;flex-direction:column;gap:13px;min-width:0}#application .station-toolbar{display:grid;grid-template-columns:minmax(260px,1.2fr) minmax(210px,1fr) minmax(170px,.8fr);align-items:center;gap:18px;padding:12px 15px;background:#0d2d42}#application .mode-switch-block{gap:10px;flex-wrap:wrap}#application .mode-switch-block>span{font-size:12px}#application .mode-rocker{padding:6px 10px;min-width:0;max-width:100%;gap:10px;border-radius:5px}#application .mode-track{width:76px;height:35px;flex-shrink:0}#application .mode-thumb{font-size:14px;width:39px;height:29px}#application .mode-switch-copy{font-size:13px}#application .mode-switch-copy small{font-size:11px}#application .toolbar-water{display:flex;gap:25px;min-width:0;justify-content:center}#application .toolbar-level span,#application .toolbar-level small{font-size:11px}#application .toolbar-level strong{font-size:15px}#application .toolbar-refresh{display:block;min-width:0}#application .toolbar-refresh button{font-size:12px;padding:5px 9px}#application .toolbar-refresh small{display:block;font-size:10px;margin-top:3px;max-width:225px}
#application .visual-tabs{padding:9px 12px;display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap;background:#113248;border-bottom:1px solid #28596f}#application .visual-tabs>div{display:flex;gap:8px}#application .visual-tabs button{font-size:13px;padding:6px 18px}#application .visual-tabs>span{font-size:11px;color:#a1c1d4}#application .equipment-section{padding:0;min-width:0;background:#092237}#application .equipment-heading{padding:12px 13px;margin:0;gap:10px}#application .equipment-heading>span{font-size:11px}#application .equipment-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;padding:0 13px}#application .equipment-grid.three-loads{grid-template-columns:repeat(3,minmax(0,1fr))}#application .equipment-card{min-width:0;padding:0 10px 8px;border:1px solid #2b536b;border-top:3px solid #52758b;border-radius:4px;background:linear-gradient(#103650,#0a2439);box-shadow:none}#application .equipment-card.is-running{border-top-color:#49d2b0}#application .equipment-card.fault{border-color:#a65c72;border-top-color:#ff8290}#application .equipment-card-heading{min-height:43px;padding:9px 0;border-bottom:1px solid #28526a;gap:7px}#application .equipment-card-heading h4{font-size:16px;margin:0}#application .runtime-indicator{width:8px;height:8px;background:#7897a9;border-radius:50%;box-shadow:0 0 0 4px #274252;flex-shrink:0}#application .runtime-indicator.running{background:#57e0ac;box-shadow:0 0 0 4px #21564d}#application .runtime-line{display:flex;justify-content:space-between;gap:6px;align-items:center;font-size:11px;padding:10px 0 0}#application .runtime-line strong{font-size:13px;color:#b7d5e6}#application .is-running .runtime-line strong{color:#59e4aa}#application .equipment-visual{display:block;height:auto;padding:0;background:none;margin:0}#application .state-row{font-size:12px;line-height:1.6;padding:3px 0;gap:6px;margin:0;min-height:25px}#application .state-row strong{font-size:12px}#application .equipment-output{display:flex;gap:5px;flex-wrap:wrap;justify-content:space-between;align-items:center;padding:10px 0 4px;margin-top:9px;border-top:1px solid #2b5469}#application .equipment-output>span{font-size:11px}#application .output-toggle{font-size:14px;min-width:65px;padding:4px 8px}#application .control-disabled-reason{font-size:11px;padding:7px 0 3px;line-height:1.6;color:#e5c16c}#application .control-warning-message{font-size:11px;margin:4px 0;padding:5px}#application .equipment-records{font-size:11px;border:0;margin-top:8px}#application .equipment-records summary{color:#9cbed0;cursor:pointer}#application .equipment-records p{font-size:10px;margin:5px 0}#application .equipment-records button{padding:3px 0;font-size:11px}#application .visual-footnote{padding:10px 13px;margin:0;font-size:11px;color:#97bace}#application .plant-equipment-strip{padding:0 14px 14px;display:flex;gap:8px;flex-wrap:wrap}#application .plant-equipment-strip button{font-size:12px;padding:5px 9px}
#application .station-bottom{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,1fr);gap:13px;align-items:start}#application .station-bottom>div{min-width:0}#application .station-record-column{display:grid;gap:13px}#application .variable-workspace .panel-heading{align-items:center;gap:8px}#application .variable-workspace label{font-size:11px;min-width:0;gap:5px}#application .variable-workspace input{max-width:180px;width:100%;font-size:11px;padding:6px}#application .variable-workspace .panel-heading p{display:none}#application .variable-table-scroll{max-height:440px;min-height:0;overflow:auto}#application table{font-size:12px}#application .variable-workspace table{min-width:580px}#application th,#application td{padding:10px}#application td small{font-size:10px}#application .variable-actions{display:flex;gap:5px;flex-wrap:wrap}#application .variable-actions button{padding:5px 7px;font-size:11px}#application .variable-value{font-size:13px}#application .variable-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-top:1px solid #214a61;font-size:11px}#application .variable-footer button{font-size:11px;padding:5px 8px}#application .collection-result{font-size:11px}
#application .latest-operation{margin:0}#application .latest-operation .panel-heading>span{display:none}#application .operation-record{padding:10px 12px}#application .operation-record>div{display:flex;flex-wrap:wrap;gap:5px 10px}#application .operation-record strong,#application .operation-record b{font-size:12px}#application .operation-record time,#application .operation-record p{font-size:11px}#application .operation-record p{margin:6px 0 0;line-height:1.6}#application .operation-history{max-height:300px;overflow:auto;margin:0;padding:9px 12px;font-size:11px}#application .operation-history summary{cursor:pointer;color:#9bc0d5}#application .quiet-state,#application .alarm-item{padding:12px;font-size:12px}#application .station-info>summary{padding:13px;cursor:pointer;font-size:13px}#application .station-info>summary span{font-size:11px;color:#95b6c9;margin-left:10px}#application .station-info-content{display:grid;grid-template-columns:1.3fr 1fr;gap:12px;padding:0 13px 13px}#application .gateway-details{display:grid;grid-template-columns:1fr 1fr;padding:13px;gap:12px}#application .gateway-details dt{font-size:11px}#application .gateway-details dd{font-size:13px;overflow-wrap:anywhere}#application .location-panel h4{font-size:13px;margin:12px}#application .location-panel .coordinate{font-size:12px;margin:12px}#application .location-panel .map-open{font-size:12px;margin:12px}
#application .region-heading{margin-bottom:12px}#application .region-summary{display:none}#application .region-layout{grid-template-columns:minmax(180px,.6fr) minmax(0,1.5fr)}#application .region-position-plot{max-height:440px;width:100%}#application .region-heading h2,#application .section-heading h2{font-size:22px}#application .region-group{font-size:13px}#application .region-subnote{font-size:12px}#application footer{font-size:11px;padding:12px 18px;gap:10px;background:#061728;border-top:1px solid #234a61}
@media(max-width:1250px){#application .topbar{grid-template-columns:160px minmax(0,1fr) 240px;gap:10px}#application .page-title h1{font-size:21px}#application .workspace{grid-template-columns:180px minmax(0,1fr)}#application .station-toolbar{grid-template-columns:minmax(220px,1fr) 1fr}#application .toolbar-refresh{grid-column:1/-1;display:flex;gap:12px;align-items:center}#application .toolbar-refresh small{max-width:none;margin:0}#application .equipment-grid{gap:7px;padding:0 9px}#application .equipment-card{padding:0 7px 8px}#application .equipment-card-heading h4{font-size:14px}#application .state-row,#application .state-row strong{font-size:11px}#application .navigation .connection{width:100%;justify-content:flex-end}#application .station-bottom{grid-template-columns:minmax(0,1.4fr) minmax(250px,1fr)}}
@media(max-width:1050px){#application .topbar{grid-template-columns:155px minmax(0,1fr)}#application .header-tools{grid-column:1/-1;justify-content:flex-end}#application #clock{width:auto;margin-right:auto}#application .workspace,#application .workspace.sidebar-collapsed{grid-template-columns:minmax(0,1fr)}#application .station-panel{display:none}#application .station-heading-right{text-align:left}#application .summary{grid-template-columns:repeat(3,minmax(0,1fr))}#application .station-bottom{grid-template-columns:minmax(0,1.5fr) minmax(240px,1fr)}}
@media(max-width:760px){#application .station-bottom{grid-template-columns:1fr}#application .equipment-grid,#application .equipment-grid.three-loads{grid-template-columns:repeat(3,minmax(0,1fr))}#application .station-toolbar{grid-template-columns:1fr}#application .toolbar-water{justify-content:flex-start}#application .station-info-content{grid-template-columns:1fr}#application .scope-bar select{max-width:230px}#application .region-layout{grid-template-columns:1fr}#application .navigation .management-tabs{margin-left:0}#application .navigation .connection{display:none}}
@media(max-width:520px){#application .topbar{grid-template-columns:1fr;padding:12px}#application .brand{font-size:15px}#application .brand-mark{height:33px;width:33px;font-size:20px}#application .page-title h1{font-size:21px}#application .page-title{grid-row:2}#application .header-tools{grid-row:3}#application .workspace{padding:10px}#application .navigation{padding:8px 10px;gap:8px}#application .navigation button{font-size:12px;padding:6px 10px}#application .scope-bar{padding:10px 10px 0;gap:8px}#application .scope-bar label{width:100%}#application .scope-bar select{max-width:none;width:calc(100% - 40px)}#application #scope-label{margin:0;font-size:11px}#application .data-status{margin:8px 10px 0;padding:7px;font-size:10px}#application .summary{padding:10px;grid-template-columns:1fr 1fr}#application .summary-card.communication-card{grid-column:1/-1}#application .detail-heading{padding:12px}#application .detail-heading h2{font-size:20px}#application .equipment-grid,#application .equipment-grid.three-loads{grid-template-columns:repeat(2,minmax(0,1fr))}#application .variable-workspace .panel-heading{flex-direction:column;align-items:flex-start}#application .variable-workspace input{max-width:240px}#application .gateway-details{grid-template-columns:1fr}#application .visual-tabs{align-items:flex-start}#application .station-info>summary span{display:block;margin-left:12px}}
@media(max-width:360px){#application .equipment-grid,#application .equipment-grid.three-loads{grid-template-columns:1fr}#application .equipment-card{padding:0 14px 10px}#application .state-row,#application .state-row strong{font-size:13px}}
@media(prefers-reduced-motion:reduce){#application *{scroll-behavior:auto!important}}
#application .station-toolbar .toolbar-refresh{grid-column:auto;grid-row:auto}
#application .variable-workspace th,#application .variable-workspace td,#application .variable-workspace td strong{font-size:12px;line-height:1.5}
#application .variable-workspace th{background:#103247;font-weight:500}
#application .variable-workspace tbody tr:nth-child(2n){background:#0c2a40}
#application .variable-workspace label{white-space:nowrap;display:flex;align-items:center}
@media(max-width:1250px){#application .station-toolbar .toolbar-refresh{grid-column:1/-1}}