.theme-dark,:root{--bg:#12161c;--bg2:#161b22;--surface:#171c24;--card:#1b212a;--line:#2a323d;--line2:#232b35;--line3:#2e3743;--grid:#1e252e;--pipe:#2f3946;--pipe2:#3f4b5a;--muted2:#3a4552;--idle:#4a5563;--idle-ink:#9aa6b4;--text:#e8ecf1;--text2:#c5cedb;--text3:#9daab9;--dim:#8b98a8;--dim2:#6d7887;--run:#5fd08a;--cyan:#4fb3d9;--alarm:#d1604a;--maint:#e0b453;--chip:hsla(0,0%,100%,.06);--capstrip:rgba(0,0,0,.22);--pill:rgba(18,22,28,.72)}.theme-light{--bg:#eef1f5;--bg2:#fff;--surface:#fff;--card:#fff;--line:#d5dce5;--line2:#e7ecf2;--line3:#c8d1dc;--grid:#e9edf3;--pipe:#b6c0cc;--pipe2:#98a5b4;--muted2:#a9b4c1;--idle:#8d99a8;--idle-ink:#55616f;--text:#16202b;--text2:#38434f;--text3:#4f5c6b;--dim:#66727f;--dim2:#8792a0;--run:#12864a;--cyan:#0f6f9e;--alarm:#b03d20;--maint:#8a5f06;--chip:rgba(0,0,0,.05);--capstrip:rgba(0,0,0,.06);--pill:hsla(0,0%,100%,.78)}*{margin:0;padding:0;box-sizing:border-box}body,html{height:100%}body{background:var(--bg);color:var(--text);font-family:IBM Plex Sans,Helvetica,Arial,sans-serif;font-size:13px;line-height:1.45;-webkit-font-smoothing:antialiased}.mono{font-family:IBM Plex Mono,ui-monospace,Cascadia Mono,Consolas,monospace}.micro{font-family:IBM Plex Mono,ui-monospace,Consolas,monospace;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}.card{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:14px}.card-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:12px;flex-wrap:wrap}.card-title{font-size:13px;font-weight:600;color:var(--text)}.chip{background:var(--chip);border-radius:3px;padding:2px 6px}.dot{width:7px;height:7px;border-radius:50%;flex:none;display:inline-block}.pulse{animation:pulseDot 1.8s infinite}@keyframes pulseDot{0%,to{opacity:1}50%{opacity:.2}}@keyframes dashFlow{to{stroke-dashoffset:-32}}.flow-dash{animation:dashFlow 1.4s linear infinite}button{font-family:inherit;font-size:inherit;color:inherit;background:none;border:none;cursor:pointer}.btn{font-family:IBM Plex Mono,ui-monospace,Consolas,monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase;padding:6px 11px;border:1px solid var(--line3);border-radius:4px;background:var(--bg2);color:var(--text2);transition:border-color .14s,color .14s,background .14s;white-space:nowrap}.btn:hover:not(:disabled){border-color:var(--cyan);color:var(--cyan)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:color-mix(in oklab,var(--cyan) 16%,transparent);border-color:color-mix(in oklab,var(--cyan) 46%,transparent);color:var(--cyan)}.btn-danger:hover:not(:disabled){border-color:var(--alarm);color:var(--alarm)}.btn-active{border-color:var(--cyan);color:var(--cyan);background:color-mix(in oklab,var(--cyan) 12%,transparent)}.input{width:100%;font-family:IBM Plex Mono,ui-monospace,Consolas,monospace;font-size:11.5px;padding:6px 8px;background:var(--bg2);border:1px solid var(--line3);border-radius:4px;color:var(--text);outline:none;transition:border-color .14s}.input:focus{border-color:var(--cyan)}.input::placeholder{color:var(--dim2)}.thead{font-family:IBM Plex Mono,ui-monospace,Consolas,monospace;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim2);padding-bottom:7px;border-bottom:1px solid var(--line)}.trow{border-bottom:1px solid var(--line2);padding:8px 0;align-items:center}.trow:last-child{border-bottom:none}.trow-click{cursor:pointer;transition:background .12s}.trow-click:hover{background:var(--bg2)}@keyframes rowFlash{0%{background:color-mix(in oklab,var(--run) 16%,transparent)}to{background:transparent}}.row-new{animation:rowFlash 1.2s ease-out}::-webkit-scrollbar{width:9px;height:9px}::-webkit-scrollbar-track{background:var(--bg2)}::-webkit-scrollbar-thumb{background:var(--muted2);border-radius:5px}::-webkit-scrollbar-thumb:hover{background:var(--dim2)}.scroll-x{overflow-x:auto}.page{padding:18px 22px 40px;display:flex;flex-direction:column;gap:14px}.grid-auto{display:grid;grid-gap:12px;gap:12px}.nav-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:4px;color:var(--text3);text-decoration:none;transition:background .14s,color .14s;border:1px solid transparent}.nav-item:hover{background:var(--bg2);color:var(--text)}.nav-item.active{background:color-mix(in oklab,var(--cyan) 12%,transparent);border-color:color-mix(in oklab,var(--cyan) 30%,transparent);color:var(--cyan)}.unit-hit{cursor:pointer}.unit-hit:hover{filter:brightness(1.14)}.tabbar{display:flex;gap:4px;padding:4px;background:var(--surface);border:1px solid var(--line);border-radius:6px;overflow-x:auto}.tabbtn{flex:1 1;min-width:132px;text-align:left;padding:8px 11px;border-radius:4px;border:1px solid transparent;color:var(--text3);transition:background .14s,color .14s,border-color .14s}.tabbtn:hover{background:var(--bg2);color:var(--text)}.tabbtn-active,.tabbtn-active:hover{background:color-mix(in oklab,var(--cyan) 12%,transparent);border-color:color-mix(in oklab,var(--cyan) 34%,transparent);color:var(--cyan)}.tabbtn-label{display:block;font-size:12.5px;font-weight:600}.tabbtn-hint{display:block;font-family:IBM Plex Mono,ui-monospace,Consolas,monospace;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);margin-top:2px}.tabbtn-active .tabbtn-hint{color:color-mix(in oklab,var(--cyan) 70%,var(--dim))}@media (max-width:640px){.tabbtn-hint{display:none}.tabbtn{min-width:96px;text-align:center}}.toast-stack{position:fixed;top:16px;right:16px;z-index:200;display:flex;flex-direction:column;gap:9px;max-width:min(94vw,380px);pointer-events:none}.toast-card{display:flex;align-items:flex-start;gap:10px;padding:11px 12px;background:var(--card);border:1px solid var(--line);border-left-width:3px;border-radius:6px;box-shadow:0 10px 28px rgba(0,0,0,.3);pointer-events:auto;animation:toastIn .22s ease-out}@keyframes toastIn{0%{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}.toast-icon{flex:none;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700;color:#0b1016;margin-top:1px}.toast-title{font-family:IBM Plex Mono,ui-monospace,Consolas,monospace;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;margin-bottom:2px}.toast-msg{font-size:12px;line-height:1.45;color:var(--text2);word-break:break-word}.toast-close{flex:none;color:var(--dim);font-size:15px;line-height:1;padding:0 2px;transition:color .14s}.toast-close:hover{color:var(--text)}@media (prefers-reduced-motion:reduce){.toast-card{animation:none}}.hmi-canvas{background-color:#e2e8f0;background-image:radial-gradient(#cbd5e1 1.5px,transparent 0);background-size:16px 16px;border:1px solid var(--line);border-radius:5px;padding:16px 12px;overflow-x:auto}@keyframes hmiPipeFlow{0%{stroke-dashoffset:24}to{stroke-dashoffset:0}}.hmi-flow{animation:hmiPipeFlow .8s linear infinite}@keyframes hmiSpinFan{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.hmi-fan{animation:hmiSpinFan 1.2s linear infinite}.hmi-hit{cursor:pointer}.hmi-hit:hover{filter:brightness(1.06)}.hmi-hit:focus-visible{outline:2px solid #0284c7;outline-offset:2px}@media (prefers-reduced-motion:reduce){.flow-dash,.hmi-fan,.hmi-flow,.pulse{animation:none}}.flow-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-gap:6px;gap:6px;align-items:stretch}@media (max-width:1100px){.flow-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.flow-arrow{display:none}}@media (max-width:720px){.page{padding:14px 12px 32px}.flow-steps{grid-template-columns:minmax(0,1fr)}}