/* Viewport-sized command centre. All dimensions share one reference unit. */
:root{--u:min(calc(100vw / 1920),calc(100vh / 1080));font-size:calc(var(--u)*20);--cyan:#52e6ff;--green:#2cf4c2;--muted:#7397b6;color-scheme:dark}
html,body.screen{width:100%;height:100%;overflow:hidden}
body.screen{font-size:.85rem;color:#d9edff;background:#030d1e;background-image:radial-gradient(ellipse at 50% -10%,#164b7877,transparent 55%),radial-gradient(ellipse at 92% 90%,#07375866,transparent 48%),linear-gradient(#10365b25 1px,transparent 1px),linear-gradient(90deg,#10365b25 1px,transparent 1px);background-size:auto,auto,2rem 2rem,2rem 2rem}
.screen:before{content:'';position:fixed;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 30%,#1abaff06 50%,transparent 70%);animation:ambient 16s ease-in-out infinite;z-index:0}
#wall{position:relative;width:100%;height:100vh;height:100dvh;min-height:0;padding:0 1.4rem .3rem;display:grid;grid-template-rows:5rem 7rem minmax(0,1fr) 2.3rem;gap:.85rem;isolation:isolate}
.wall-head{height:auto;min-height:0;display:grid;grid-template-columns:1fr auto 1fr;gap:1rem;position:relative;border:0;background:linear-gradient(90deg,transparent,#0e3c6033,transparent)}
.wall-head:after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#167baa,#63efff,#167baa,transparent);box-shadow:0 0 .7rem #1bc6ff88}
.wall-head h1{font-size:2rem;font-weight:700;letter-spacing:.3rem;color:#e4f6ff;text-shadow:0 0 1.6rem #0db4ff80;position:relative;padding:0 2.2rem .15rem;white-space:nowrap}
.wall-head h1:before,.wall-head h1:after{content:'';position:absolute;top:35%;width:1.15rem;height:.7rem;border-top:2px solid #31e2ff;border-bottom:2px solid #31e2ff;transform:skewX(-35deg);filter:drop-shadow(0 0 .25rem #0cc8ff)}
.wall-head h1:before{left:0}.wall-head h1:after{right:0;transform:skewX(35deg)}
.brand{display:flex;align-items:center;gap:.6rem;font-size:.8rem;letter-spacing:.08rem;color:#8bafca}.brand-icon{font-size:1.9rem;color:#6bf1ff;filter:drop-shadow(0 0 .4rem #18b3ff)}
.wall-head>div:last-child{text-align:right;font-family:Consolas,monospace;font-size:.82rem;color:#9bc4df;white-space:nowrap}.wall-head>div:last-child #clock{display:inline}
.kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.85rem;padding:0;min-height:0}
.kpi{position:relative;overflow:hidden;min-height:0;padding:.7rem .9rem;gap:.7rem;border-radius:.15rem;border:1px solid #1d628577;background:linear-gradient(120deg,#10314eee,#071c32cc);box-shadow:inset 0 1px #3ba7d122,0 .4rem 1rem #0003}
.kpi:before{content:'';position:absolute;left:0;top:0;width:2rem;height:2px;background:#50dfff;box-shadow:0 0 .7rem #29c7ff}
.kpi:after{content:'';position:absolute;right:-1rem;bottom:-1.8rem;width:5rem;height:5rem;border:1px solid #36b6eb18;border-radius:50%;box-shadow:0 0 0 .65rem #1e84b30b,0 0 0 1.3rem #1e84b309}
.kpi-symbol{font-size:1.65rem;color:#61dcff;border:1px solid #2989ae55;background:#11618b22;width:2.7rem;height:2.7rem;display:grid;place-items:center;border-radius:.5rem;flex-shrink:0}
.kpi>div{min-width:0}.kpi span:not(.kpi-symbol){font-size:.8rem;color:#95b8d3;letter-spacing:.04rem;white-space:nowrap}
.kpi strong{font-family:Consolas,'Microsoft YaHei',monospace;font-size:2.15rem;letter-spacing:-.08rem;line-height:1.15;margin-top:.35rem;font-weight:700;color:#e4f7ff;text-shadow:0 0 1rem #389fef44}.kpi small{font-size:.65rem;margin-left:.3rem;color:#67aac9}
.kpi:nth-child(3){border-color:#1ca89099;background:linear-gradient(120deg,#0b3b44,#071d2d);box-shadow:inset 0 0 1.6rem #1aecb90a,0 0 1rem #17c9a611}.kpi:nth-child(3):before{background:#39ffd2}.kpi:nth-child(3) strong,.kpi:nth-child(3) .kpi-symbol{color:#44ffd0}.kpi:nth-child(3) .kpi-symbol{animation:working 3s ease-in-out infinite}
.wall-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.18fr) minmax(0,1fr);gap:.85rem;min-height:0;overflow:hidden}
.column{display:grid;grid-template-rows:minmax(0,1.04fr) minmax(0,1fr);gap:.85rem;min-width:0;min-height:0}.column.middle{grid-template-rows:minmax(0,.8fr) minmax(0,1.2fr);order:0}
.panel{position:relative;min-height:0;min-width:0;display:flex;flex-direction:column;border:1px solid #24608488;border-radius:.15rem;background:linear-gradient(135deg,#0b2742d9,#061529ee);box-shadow:inset 0 1px #3fbceb16,0 .25rem 1rem #0002;overflow:hidden}
.panel:after{content:'';position:absolute;right:0;bottom:0;width:1rem;height:1rem;border-right:2px solid #3dd8ff99;border-bottom:2px solid #3dd8ff99;pointer-events:none}
.panel h2{flex-shrink:0;min-height:2.55rem;padding:.75rem .9rem .55rem;font-size:.96rem;letter-spacing:.04rem;background:linear-gradient(90deg,#14608b20,transparent);border-bottom:1px solid #22537466;color:#d4eeff;line-height:1.2}
.panel h2:before{top:.8rem;width:.15rem;height:.85rem;box-shadow:0 0 .55rem #27d5ff}
.panel h2 small{font-size:.65rem;margin-top:.15rem;color:#7096b7}.chart-key{float:right;display:inline;font-size:.62rem;padding-top:.15rem;margin-top:0;letter-spacing:0}.chart-key .dot:nth-child(2){margin-left:.7rem}
.side .panel{width:auto;flex:initial}.trend-panel,.list-panel,.rank-panel,.events-panel{flex:initial!important}
.donut-area{flex:1;min-height:0;padding:1rem .9rem;gap:1.1rem;display:flex;justify-content:center}
#donut{position:relative;width:9.3rem;height:9.3rem;flex-shrink:0;box-shadow:0 0 1.8rem #12aefc20,inset 0 0 1rem #0bdcf333;border:0}
#donut:before{content:'';position:absolute;inset:-.55rem;border:1px dashed #3cdcff66;border-radius:50%;animation:orbit 48s linear infinite}
#donut:after{content:'';position:absolute;inset:-.3rem;border:2px solid transparent;border-top-color:#91eeff;border-bottom-color:#14648b;border-radius:50%;animation:orbit 16s linear infinite}
#donut>div{width:7.4rem;height:7.4rem;background:radial-gradient(circle,#123850,#07192d 75%);border:1px solid #31a2c544;z-index:1}
#donut strong{font-size:1.85rem;font-family:Consolas,monospace;margin:.2rem 0;color:#e1f9ff}#donut small{font-size:.65rem;color:#80a4be}
#legend{min-width:0;flex:1}#legend>div{font-size:.78rem;margin:.65rem 0;gap:.2rem .3rem}#legend small{font-size:.6rem}#legend b{font-family:Consolas,monospace;color:#d7f0ff}.status{font-size:.75rem}.dot{width:.4rem;height:.4rem;margin-right:.35rem}.dot.s0{box-shadow:0 0 .35rem #00d9ad77}.dot.s3{box-shadow:0 0 .3rem #ffc45555}
.type-bars{flex:1;min-height:0;max-height:none;padding:.45rem 1rem;overflow:auto;scrollbar-width:thin;scrollbar-color:#1b5778 transparent}
.type-row{margin:.75rem 0 1rem}.type-row>div:first-child{font-size:.8rem;margin-bottom:.55rem;gap:.3rem}.type-row b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.type-row span{font-size:.65rem;white-space:nowrap}.bar-line{gap:.55rem}.bar-line strong{font-size:.74rem;width:3rem;color:#75eaff;font-family:Consolas,monospace}.bar{height:.3rem;border-radius:0;background:#183d5666}.bar i{position:relative;border-radius:0;background:linear-gradient(90deg,#2278f0,#29e7df);box-shadow:0 0 .45rem #04cfe366}.bar i:after{content:'';position:absolute;inset:0;background:linear-gradient(100deg,transparent,#ffffff55,transparent);transform:translateX(-100%);animation:flow 5s linear infinite}
#trend{flex:1;min-height:0;padding:.7rem 1rem .5rem;background:linear-gradient(transparent,#03baca03)}#trend svg{width:100%;height:100%;max-height:none;overflow:visible}#trend path[stroke],#trend polyline{filter:drop-shadow(0 0 3px #0ddbd866)}svg text{font-size:12px}
.filters{flex-shrink:0;margin:0;padding:.55rem .85rem;gap:.4rem;min-height:0}.filters input{width:0;flex:1}.filters select{width:6rem}.screen input,.screen select,.screen button{font-size:.72rem;border-radius:.15rem;padding:.35rem .5rem;border-color:#245b7c;background:#081f36}.screen button{color:#a4ddf8}.screen button:hover{background:#14466b;border-color:#35cbff;box-shadow:0 0 .5rem #0ec8ff22}.screen input:focus,.screen select:focus{outline:1px solid #35cbff;outline-offset:1px}
.table-wrap{flex:1;min-height:0;overflow:auto;scrollbar-width:thin;scrollbar-color:#1b5778 transparent}table{font-size:.76rem;table-layout:fixed;height:100%}thead{height:1.7rem}th{padding:.35rem .45rem;font-size:.67rem;background:#103f5a66;white-space:nowrap}td{padding:.28rem .45rem;border-color:#16456355;height:1.55rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th:first-child,td:first-child{padding-left:.85rem;width:17%}th:nth-child(2){width:29%}th:nth-child(3){width:18%}th:nth-child(4){width:18%}th:last-child{width:18%}.serial,td.serial{font-size:.77rem;letter-spacing:0;color:#beddf4}tbody tr:nth-child(even){background:#17476622}tbody tr:hover{background:#1c658833}.pager{flex-shrink:0;padding:.5rem .85rem;min-height:2rem;font-size:.65rem;gap:.5rem;border-top:1px solid #1c4a6744}.pager>div{gap:.45rem}.pager label{margin-left:.25rem}.pager button{padding:.1rem .5rem}.pager input{width:.65rem;height:.65rem;vertical-align:middle}
#ranking{flex:1;min-height:0;padding:.4rem .9rem;display:flex;flex-direction:column;justify-content:space-evenly;overflow:hidden}.rank{gap:.6rem;margin:.35rem 0;min-height:0;flex:0 1 auto}.rank>b{border-radius:.2rem;min-width:1.3rem;height:1.3rem;font-size:.7rem;margin-top:.4rem;color:#7cccff;border-color:#2e6d9355;background:#17456355;transform:skew(-5deg)}.rank:first-child>b{background:#98732133;border-color:#f2c65588;color:#ffe4a4;box-shadow:0 0 .7rem #ecbd3422}.rank small{font-size:.6rem}.rank-main{display:flex;align-items:center;font-size:.75rem;margin:.16rem 0 .4rem;gap:.4rem}.rank-main strong{display:inline;white-space:nowrap;color:#7feaff;font-family:Consolas,monospace;font-size:.9rem}.rank-main small{font-size:.55rem}.rank .bar{height:.2rem}
#events{flex:1;min-height:0;max-height:none;padding:.25rem .9rem;display:flex;flex-direction:column;justify-content:space-evenly;overflow:hidden}.event{font-size:.65rem;gap:.35rem;padding:.4rem 0;min-height:0;flex:0 1 auto;border-color:#20496666}.event>i{margin-top:.25rem;margin-right:.1rem}.event time{display:block;min-width:3rem;font-size:.62rem;color:#5d93b6;font-family:Consolas,monospace}.event .serial{display:inline;font-size:.68rem;margin:0 .15rem}.event p{font-size:.63rem;color:#40c5b3;margin-top:.2rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.event>div{min-width:0}.event>div>span:first-child{font-size:.6rem;color:#90b2cc}
footer{height:auto;min-height:0;font-size:.62rem;color:#578caf;gap:1rem;border-top:1px solid #173f5655}footer>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}footer>div{gap:.5rem;flex-shrink:0}footer button{font-size:.65rem!important;padding:.2rem .55rem!important}.connected{color:#48c9b4}.disconnected{color:#ffd17d}.empty{font-size:.75rem;padding:1rem}.changed{animation:flash .8s ease-out}.updated{animation:rowFlash 1.5s ease-out}
@keyframes orbit{to{transform:rotate(360deg)}}@keyframes flow{to{transform:translateX(100%)}}@keyframes working{50%{box-shadow:0 0 1rem #1fe9b433;border-color:#44ffd088}}@keyframes ambient{50%{opacity:.3}}

/* Eight rows must fit without a table scrollbar at every tested window height. */
.list-panel td{height:1.45rem;line-height:1.12;padding-top:.22rem;padding-bottom:.22rem}
/* Live telemetry ribbon: real samples, 96 actual devices, and task deltas. */
#wall{grid-template-rows:4.5rem 6rem 5rem minmax(0,1fr) 2.3rem;gap:.7rem}
.column.middle{grid-template-rows:minmax(0,.64fr) minmax(0,1.36fr)}
.live-band{min-height:0;display:grid;grid-template-columns:1fr 1.15fr 2fr;gap:.85rem}
.live-band>div{min-width:0;position:relative;border:1px solid #22638277;background:linear-gradient(100deg,#10395388,#081d32cc);padding:.45rem .8rem;overflow:hidden}
.live-label{font-size:.72rem;font-weight:500;color:#b7dcef;display:flex;align-items:center;gap:.4rem;white-space:nowrap;line-height:1.3}
.live-label>span{margin-left:auto;font-size:.58rem;font-weight:400;color:#719dbb}
.live-led{width:.4rem;height:.4rem;border-radius:50%;background:#2bf8bd;box-shadow:0 0 .5rem #2bf8bd;animation:heartbeat 2s ease-in-out infinite;flex-shrink:0}
.delta-value{display:flex;align-items:baseline;gap:.6rem;margin-top:.18rem}.delta-value strong{font-family:Consolas,monospace;font-size:1.9rem;line-height:1.15;color:#53ffd1;min-width:3rem}.delta-value>span{font-size:.6rem;color:#71a0bd;white-space:nowrap}
.poll-track{position:absolute;bottom:0;left:0;right:0;height:2px;background:#17608333;overflow:hidden}.poll-track i{display:block;width:28%;height:100%;background:linear-gradient(90deg,transparent,#36e7d5,transparent);animation:poll-flow 3s linear infinite}
#live-spark{height:2.6rem;position:relative;margin-top:.25rem;color:#6d9ab8;font-size:.65rem;padding-right:3.7rem;display:flex;align-items:center}#live-spark svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 0 .15rem #12dda955)}#live-spark>b{position:absolute;right:0;top:.5rem;font:700 1.05rem Consolas,monospace;color:#87ffde}#live-spark small{font-size:.55rem;color:#6f9eb4}
#device-matrix{display:grid;grid-template-columns:repeat(48,minmax(0,1fr));grid-template-rows:repeat(2,.65rem);gap:.15rem;margin-top:.45rem}.matrix-cell{display:block;min-width:0;border-radius:.08rem;background:#556c8366;border:1px solid #89aac733;transition:background .6s,box-shadow .6s}.matrix-cell.state-0{background:#23d9af;border-color:#50f8d077;box-shadow:0 0 .25rem #23d9af55;animation:device-breathe 2.4s ease-in-out infinite;animation-delay:var(--phase,0s)}.matrix-cell.state-1{background:#268eda88;border-color:#3ea5df66}.matrix-cell.state-2{background:#41506888;border-color:#64718544}.matrix-cell.state-3{background:#f1b94ecc;border-color:#ffe18477;animation:heartbeat 2.8s ease-in-out infinite}.matrix-cell.state-changed{animation:state-change 1.6s ease-out}.matrix-cell:hover{outline:1px solid white;transform:scale(1.5);z-index:2}.matrix-key{display:flex;align-items:center;gap:.55rem;color:#78a1ba;font-size:.52rem;margin-top:.3rem;white-space:nowrap}.matrix-key .dot{height:.25rem;width:.25rem;margin-right:.2rem}.matrix-key>span:last-child{margin-left:auto}
.event-new{animation:event-in .65s ease-out}.delta-pop{animation:delta-pop .85s ease-out}
.data-paused .live-led,.data-paused .matrix-cell,.data-paused .poll-track i,.data-stale .live-led,.data-stale .matrix-cell,.data-stale .poll-track i{animation-play-state:paused;opacity:.65}.data-stale .live-led{background:#ffbc58;box-shadow:0 0 .4rem #ffbc58}.data-stale #live-spark{opacity:.5}
@keyframes heartbeat{50%{opacity:.4}}@keyframes device-breathe{50%{opacity:.42;box-shadow:none}}@keyframes state-change{0%,30%{background:#fff;box-shadow:0 0 .5rem #a4ffff}100%{box-shadow:none}}@keyframes event-in{from{opacity:0;transform:translateX(1.5rem);background:#16c8b12a}to{opacity:1;transform:translateX(0);background:transparent}}@keyframes delta-pop{0%{transform:translateY(.25rem);opacity:.3}40%{text-shadow:0 0 .8rem #36ffd3}100%{transform:translateY(0);opacity:1}}@keyframes poll-flow{from{transform:translateX(-100%)}to{transform:translateX(460%)}}

#ranking .rank{margin:.2rem 0}.rank-main{margin-bottom:.3rem}
#legend>div{margin:.4rem 0;line-height:1.15}.donut-area{padding:.7rem .9rem}
.data-paused .kpi:nth-child(3) .kpi-symbol,.data-stale .kpi:nth-child(3) .kpi-symbol{animation-play-state:paused}
#donut{width:8.2rem;height:8.2rem}#donut>div{width:6.5rem;height:6.5rem}
.type-row{margin:.5rem 0 .65rem}.type-row>div:first-child{margin-bottom:.4rem}
/* Radiology workflow becomes the primary visual, remote diagnosis a separate service. */
.column.middle{grid-template-rows:minmax(0,.94fr) minmax(0,1.06fr)}
.clinical-flow-panel{background:radial-gradient(ellipse at 50% 25%,#154b6744,transparent 70%),linear-gradient(135deg,#0a2944,#05182c)}
.clinical-flow{position:relative;flex:1.35;min-height:0;padding:.3rem .55rem 0;display:flex;flex-direction:column}.clinical-flow svg{display:block;width:100%;height:100%;min-height:0;flex:1;overflow:visible}.flow-wire{stroke:url(#flow-line);stroke-width:2;fill:none;stroke-dasharray:3 5;opacity:.5}.flow-arrow{stroke:#44dfec;stroke-width:2;fill:none}.node-disc{fill:#0a2840;stroke:#3297b8;stroke-width:1}.node-halo{fill:#159bb315;stroke:#1b7b9f55;stroke-width:9}.node-orbit{fill:none;stroke:#57eed5;stroke-width:2;stroke-dasharray:28 45 4 26;animation:orbit 12s linear infinite;animation-play-state:paused}.node-number{font-family:Consolas,monospace;font-size:27px;fill:#acffe8;font-weight:700;filter:drop-shadow(0 0 5px #33dbba66)}.node-label{font-size:15px;fill:#a3d4ec}.route-label{font-size:11px;fill:#609ab9}.packet{fill:#8bffe0;filter:drop-shadow(0 0 5px #1cf2d0);opacity:0}.exam-active .exam-route .packet,.remote-active .remote-route .packet{opacity:1}.exam-active .exam-node .node-orbit,.remote-active .remote-node .node-orbit{animation-play-state:running}.p1,.p2{animation:exam-packet 2.3s linear infinite}.p2{animation-delay:-1.15s}.p3{animation:diagnose-packet 3s linear infinite}.p4{animation:diagnose-packet 2.7s linear infinite;animation-delay:-1s}.flow-caption{display:flex;justify-content:space-between;font-size:.52rem;color:#6696b1;padding:.1rem .5rem;line-height:1.3;flex-shrink:0}.flow-caption>span:first-child{display:flex;align-items:center;gap:.3rem}.flow-caption .live-led{width:.22rem;height:.22rem}.flow-caption>span:last-child{color:#72d9cb}
.mini-trend{flex:1;min-height:0;border-top:1px solid #1c547455;display:flex;flex-direction:column;padding:.3rem .8rem .15rem}.mini-trend-label{font-size:.6rem;color:#9ac4db;display:flex;justify-content:space-between;line-height:1}.mini-trend-label span{font-size:.5rem;color:#6d9cba}.mini-trend #trend{padding:.15rem .2rem 0;min-height:0;flex:1}.mini-trend #trend svg{max-height:100%}
.remote-today{display:grid;grid-template-columns:1fr 1fr;padding:.7rem .9rem .4rem;gap:.6rem}.remote-today>div+div{border-left:1px solid #275c7555;padding-left:.8rem}.remote-today span{display:block;font-size:.65rem;color:#8eb3cb}.remote-today strong{font:700 1.65rem Consolas,monospace;display:inline-block;color:#71f7d4;margin-top:.15rem;line-height:1.1}.remote-today small{font-size:.55rem;margin-left:.25rem;color:#709daf}.remote-states{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem;margin:.15rem .9rem .4rem}.remote-states>div{background:#13557322;text-align:center;padding:.25rem;border:1px solid #1c608344}.remote-states b{font:700 1rem Consolas,monospace;color:#7cd9ff;display:block}.remote-states span{font-size:.58rem;color:#8fadc4}.remote-states>div:first-child b{color:#efcb80}#remote-cases{padding:.1rem .9rem;flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;justify-content:space-evenly}.remote-case{margin:.15rem 0}.remote-case>div:first-child{display:flex;justify-content:space-between;align-items:center;gap:.3rem;margin-bottom:.25rem}.remote-case .serial{font-size:.65rem}.remote-case small{font-size:.55rem;color:#58d9c0}.remote-case .bar{height:.2rem}.remote-empty{font-size:.62rem;color:#638ba5;text-align:center}.remote-total{border-top:1px solid #1b506d55;padding:.35rem .9rem;font-size:.57rem;color:#6e9bb5;flex-shrink:0}.remote-total strong{color:#b2e6ef;font-family:Consolas,monospace;margin:0 .3rem}.remote-panel{border-color:#26878a88;background:linear-gradient(140deg,#0b3146,#071b2e)}
.list-panel td{height:1.25rem;padding-top:.17rem;padding-bottom:.17rem}.data-stale .packet{opacity:0!important;animation-play-state:paused}.data-paused .packet,.data-paused .node-orbit,.data-stale .node-orbit{animation-play-state:paused!important}.data-paused .packet{opacity:0!important}
@keyframes exam-packet{from{transform:translateX(0)}to{transform:translateX(100px)}}@keyframes diagnose-packet{from{transform:translateX(0)}to{transform:translateX(125px)}}

.column.middle{grid-template-rows:minmax(0,.9fr) minmax(0,1.1fr)}

/* Dashboard motion is explicitly controlled on this screen. */
.motion-off *, .motion-off:before, .motion-off *:before, .motion-off *:after{animation:none!important;transition:none!important}

/* Continuous movement is confined to graphics; text never fades during updates. */
#events{justify-content:flex-start;padding-top:0;padding-bottom:0}
#events .event{flex:0 0 20%;align-items:center;animation:none!important;background:transparent;opacity:1;will-change:transform}
.event-new,.delta-pop,.screen .changed,.screen .updated{animation:none}
.lane-label{font-size:14px;fill:#6fc9dc;letter-spacing:1px}
.node-number{font-size:23px}.node-label{font-size:14px}
.node-orbit{animation-duration:7s;stroke-width:2.5}
.flow-wire{stroke-dasharray:9 7;stroke-width:2.5;opacity:.85;animation:wire-travel 1.4s linear infinite;animation-play-state:paused}
.exam-active .exam-wire,.remote-active .remote-wire{animation-play-state:running}
.p1,.p2{animation-duration:1.8s}.p2{animation-delay:-.9s}.p3,.p4{animation-name:remote-packet;animation-duration:1.6s}.p4{animation-delay:-.8s}
.exam-active .exam-node .node-halo,.remote-active .remote-node .node-halo{animation:node-scan 3.2s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
#device-matrix{position:relative}
#device-matrix:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent,#8cffe94a,transparent);width:12%;animation:matrix-scan 7s linear infinite}
.remote-case .bar i{transition:width 2.8s linear}.bar i:after{animation-duration:2.4s}
.data-paused .flow-wire,.data-stale .flow-wire,.data-paused .node-halo,.data-stale .node-halo,.data-paused #device-matrix:after,.data-stale #device-matrix:after,.data-paused .bar i:after,.data-stale .bar i:after{animation-play-state:paused!important}
@keyframes wire-travel{to{stroke-dashoffset:-32}}
@keyframes remote-packet{to{transform:translateX(70px)}}
@keyframes node-scan{0%,100%{transform:scale(1);stroke-opacity:.3}50%{transform:scale(1.12);stroke-opacity:.65}}
@keyframes matrix-scan{from{transform:translateX(-120%)}to{transform:translateX(950%)}}
.motion-off *, .motion-off:before, .motion-off *:before, .motion-off *:after{animation:none!important;transition:none!important}

.remote-backlog{display:flex;justify-content:space-between;gap:.3rem;margin:0 .9rem .25rem;padding:.25rem .4rem;background:#9b722014;border:1px solid #9b722033;color:#c5ad77;font-size:.56rem;flex-shrink:0}.remote-backlog b{font-family:Consolas,"Microsoft YaHei",sans-serif;color:#efcd85;font-weight:500}.remote-states>div:first-child{border-color:#c79f4844;background:#97701718}

/* Footer removed: the main panels occupy the remaining screen height. */
#wall{grid-template-rows:4.5rem 6rem 5rem minmax(0,1fr)}