:root{font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif;color:#213047;background:#f8fafc;--blue:#0e5cb6;--green:#19964d}*{box-sizing:border-box}body{margin:0;overflow:hidden}button{font:inherit;cursor:pointer;background:none;border:0;color:inherit;padding:0}button:focus-visible{outline:2px solid #1374d4;outline-offset:4px}button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}#app{height:100dvh;min-height:480px;display:flex;flex-direction:column;position:relative;background:white}header{height:69px;flex-shrink:0;display:flex;justify-content:space-between;align-items:center;padding:0 30px;border-bottom:1px solid #e7ecf1;position:relative;z-index:6;background:#ffffffee;gap:15px}.heading{display:flex;align-items:center;gap:10px;white-space:nowrap}.heading>span{width:3px;height:16px;background:#2165ae;border-radius:1px}h1{font-size:17px;letter-spacing:.5px;font-weight:600;color:#123c71;margin:0}h1 small{font-size:13px;font-weight:500;color:#547292}.toolbar{display:flex;align-items:center;gap:11px}.toolbar button{display:flex;align-items:center;gap:5px;font-size:11px;padding:8px 9px;color:#607186;border-radius:4px;white-space:nowrap}.toolbar button.active{background:#edf5ff;color:#1764b9}.toolbar button:hover{color:#1764b9;background:#f3f6f9}.toolbar #fullscreen{border-left:1px solid #e7ecf1;border-radius:0;padding-left:15px}main{position:relative;flex:1;min-height:0;overflow:hidden;background:radial-gradient(ellipse at 50% 55%,#fff 10%,#f1f4f7 100%)}canvas{display:block;width:100%;height:100%;touch-action:none}#labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}.status-label{position:absolute;transform:translate(-50%,-100%);pointer-events:auto;border:1px solid #a5c9ba;background:#fffffff2;padding:9px 13px;border-radius:4px;min-width:78px;box-shadow:0 2px 8px #304f5b0a;text-align:left;white-space:nowrap;transition:box-shadow .15s}.status-label .name{font-size:15px;font-weight:550;display:block;letter-spacing:.4px;color:#24343c}.status-label .state{font-size:12px;display:block;color:#17964f;margin-top:4px;font-weight:500}.status-label.agv{min-width:77px;padding:8px 10px}.status-label.agv .name{font-size:12px;font-weight:500;letter-spacing:.3px}.status-label.agv .state{font-size:11px}.status-label.stopped{border-color:#dd9c9e}.status-label.stopped .state{color:#d64652}.status-label.standby{border-color:#d6ba88}.status-label.standby .state{color:#d79820}.status-label:hover,.status-label.selected{box-shadow:0 0 0 3px #1f85df1a,0 3px 12px #12496615;border-color:#4f92ce}.label-wire{position:absolute;background:#8daf9b80;width:1px;transform-origin:top;pointer-events:none}.label-wire:after{content:'';position:absolute;bottom:-2px;left:-2px;width:5px;height:5px;background:#369760;border:1px solid white;border-radius:50%}.label-wire.stopped{background:#d9707480}.label-wire.stopped:after{background:#d24c55}.label-wire.standby{background:#d1ac6d90}.label-wire.standby:after{background:#e1a62e}footer{height:59px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 31px;background:#fff;z-index:5;border-top:1px solid #eef1f5;gap:15px}#legend{display:flex;gap:24px}#legend button{display:flex;align-items:center;gap:7px;font-size:11px;color:#647388;white-space:nowrap}#legend button.active{color:#1b466f;font-weight:600}#legend button.inactive{opacity:.35}#legend i{width:7px;height:7px;display:inline-block;border-radius:1px}#legend i.running{background:#20a65d}#legend i.standby{background:#e7a226}#legend i.stopped{background:#e04c5a}#legend i.offline{background:#a7adb8}.foot-actions{display:flex;gap:18px;align-items:center}.foot-actions button{display:flex;gap:5px;align-items:center;font-size:10px;color:#76889a}.foot-actions button:hover{color:#1764b9}.foot-actions svg{width:13px;height:13px}.demo{font-size:9px;color:#9aabba;border-left:1px solid #e2e8ef;padding-left:17px}.help{position:absolute;bottom:78px;left:30px;font-size:9px;color:#a0aab5;pointer-events:none;letter-spacing:.5px}#detail{position:absolute;right:25px;top:24px;width:268px;max-height:calc(100% - 60px);padding:20px;background:#fffffff2;border:1px solid #dce5ed;border-radius:6px;box-shadow:0 12px 40px #1a456616;z-index:5;overflow:auto;backdrop-filter:blur(8px)}#detail[hidden]{display:none}.panel-title{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e9eef3;padding-bottom:12px;font-size:10px;color:#8291a1;letter-spacing:.6px}.panel-title button{display:grid;place-items:center}#detail h2{font-size:20px;letter-spacing:.5px;font-weight:550;margin:18px 0 6px}.asset-id{font-size:9px;color:#92a0ad;letter-spacing:1px}.status-pill{display:inline-flex;align-items:center;gap:5px;font-size:10px;margin:17px 0 18px;color:#27894d;background:#ecf8f0;padding:5px 8px;border-radius:3px}.status-pill i{width:5px;height:5px;border-radius:50%;background:currentColor}.status-pill.stopped{color:#c33e4c;background:#fff0f1}.status-pill.standby{color:#bd811d;background:#fff7e8}.stats{display:grid;grid-template-columns:1fr 1fr;gap:19px 12px;padding:15px 0;border-top:1px solid #e9eef3;border-bottom:1px solid #e9eef3}.stats span{color:#8b99a8;font-size:9px}.stats strong{display:block;font-size:22px;font-weight:500;color:#23415b;margin-top:7px;font-variant-numeric:tabular-nums}.stats small{font-size:10px;font-weight:400;color:#8799a9;margin-left:3px}.row{display:flex;justify-content:space-between;font-size:10px;margin-top:15px;gap:10px}.row span{color:#8b99a8}.row b{color:#496277;font-weight:400}.info-note{font-size:9px;color:#93a1ae;line-height:1.8;margin-top:17px}.alert-note{font-size:10px;line-height:1.8;color:#b95460;background:#fff4f5;border-left:2px solid #e77580;margin-top:16px;padding:9px 11px}.focus{width:100%;margin-top:18px;padding:10px;border:1px solid #cfdfef;background:#f4f9ff;border-radius:3px;color:#2f6ea7;font-size:11px}#unhide-labels{position:absolute;right:25px;bottom:24px;padding:8px 13px;border:1px solid #d1dce7;background:#ffffffe8;color:#55738d;border-radius:4px;font-size:10px}#toast{position:absolute;bottom:80px;left:50%;transform:translateX(-50%);background:#244461eF;color:#fff;border-radius:4px;font-size:11px;padding:10px 17px;opacity:0;pointer-events:none;transition:opacity .2s;z-index:12}#toast.show{opacity:1}#reference-modal{position:absolute;inset:0;z-index:20;background:#182a3e90;backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:30px}#reference-modal[hidden]{display:none}.modal{width:min(1350px,96vw);background:#fff;padding:22px;border-radius:7px;box-shadow:0 20px 50px #0003}.modal>div{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.modal h2{font-size:15px;font-weight:500;margin:0}.modal img{width:100%;max-height:76dvh;object-fit:contain;display:block}.modal p{font-size:10px;color:#8a9bab;line-height:1.8}.modal button{display:grid;place-items:center}#loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#f9fbfd;z-index:15;gap:18px;color:#74899c;font-size:12px;letter-spacing:1px}#loading>div{width:28px;height:28px;border:2px solid #dde8f1;border-top-color:#287dc0;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#error{position:absolute;top:40%;left:20%;right:20%;padding:25px;background:#fff4f4;border:1px solid #edbdc4;color:#b74654;z-index:30}#error[hidden]{display:none}@media(min-width:1600px){header{padding:0 40px;height:76px}h1{font-size:20px}h1 small{font-size:15px}.toolbar{gap:20px}.toolbar button{font-size:12px}.status-label{padding:11px 15px}.status-label .name{font-size:18px}.status-label .state{font-size:14px}.status-label.agv .name{font-size:14px}.status-label.agv .state{font-size:12px}footer{height:66px;padding:0 40px}#legend button{font-size:12px}}@media(max-width:750px){header{height:92px;align-items:flex-start;flex-direction:column;padding:18px 22px 10px;gap:9px}h1{font-size:15px}h1 small{font-size:11px}.toolbar{align-self:flex-end;gap:5px}.toolbar button{font-size:10px;padding:5px 7px}.toolbar svg{width:13px;height:13px}footer{padding:0 20px;height:80px;align-items:flex-start;justify-content:space-between;flex-direction:column;gap:11px;padding-top:14px;padding-bottom:14px}#legend{gap:19px}#legend button{font-size:10px}.foot-actions{align-self:flex-end;gap:17px}.foot-actions button{font-size:9px}.help{bottom:100px;left:21px;font-size:7px;letter-spacing:0}.status-label{min-width:59px;padding:6px 8px}.status-label .name{font-size:11px}.status-label .state{font-size:10px;margin-top:3px}.status-label.agv{min-width:61px;padding:6px 7px}.status-label.agv .name{font-size:10px}.status-label.agv .state{font-size:9px}#detail{right:17px;top:18px;width:240px;padding:16px}.stats strong{font-size:20px}.modal{padding:14px}#reference-modal{padding:10px}}
.status-label.agv{transform:translate(-50%,0)}