@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Syne:wght@400;600;700;800&display=swap";:root{--bg: #050810;--bg2: #0d1117;--bg3: #161b24;--bg4: #1c2232;--border: rgba(99,179,237,.08);--border2: rgba(99,179,237,.18);--border3: rgba(99,179,237,.35);--text: #e8f4fd;--text2: #a8c4d8;--text3: #5a7a94;--accent: #38bdf8;--accent2: #0ea5e9;--accent-glow: rgba(56,189,248,.15);--green: #22d3a5;--green2: #10b981;--green-bg: rgba(34,211,165,.1);--green-glow: rgba(34,211,165,.2);--amber: #fbbf24;--amber-bg: rgba(251,191,36,.1);--red: #fb7185;--red-bg: rgba(251,113,133,.1);--red-glow: rgba(251,113,133,.2);--teal: #22d3ee;--purple: #a78bfa;--mono: "DM Mono", monospace;--sans: "Syne", sans-serif;--radius: 14px;--radius-sm: 8px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{background:var(--bg);color:var(--text);font-family:var(--sans);min-height:100%}body{padding:0;min-height:100vh}.topbar{display:flex;align-items:center;gap:16px;padding:14px 24px;border-bottom:1px solid var(--border);background:var(--bg);position:sticky;top:0;z-index:100}.logo{font-size:15px;font-weight:700;letter-spacing:.06em;color:var(--text)}.logo span{color:var(--accent)}.conn-status{display:flex;align-items:center;gap:7px}.dot{width:7px;height:7px;border-radius:50%;background:var(--text3);transition:background .4s}.dot.on{background:var(--green);box-shadow:0 0 8px #22c55e80}.dot.connecting{background:var(--amber)}.dot.err{background:var(--red)}.conn-lbl{font-size:12px;color:var(--text2);font-family:var(--mono)}.topbar-right{margin-left:auto;display:flex;align-items:center;gap:12px}.ts-lbl{font-size:11px;color:var(--text3);font-family:var(--mono)}.btn-sm{padding:5px 14px;font-size:12px;font-family:var(--mono);border-radius:6px;cursor:pointer;transition:all .15s;border:1px solid var(--border2);background:var(--bg3);color:var(--text2)}.btn-sm:hover{background:var(--bg2);color:var(--text)}.btn-conn{border-color:#3b82f666;color:var(--accent)}.btn-conn:hover{background:#3b82f61a}.btn-disc{border-color:#ef444459;color:var(--red)}.btn-disc:hover{background:var(--red-bg)}.conn-panel{background:var(--bg2);border-bottom:1px solid var(--border);padding:16px 24px;display:none}.conn-panel.open{display:block}.cp-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:10px;align-items:end}.cp-grid2{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;align-items:end;margin-top:10px}.f-group label{font-size:11px;color:var(--text3);letter-spacing:.05em;display:block;margin-bottom:4px;font-family:var(--mono)}.f-group input,.f-group select{width:100%;padding:7px 10px;font-size:12px;font-family:var(--mono);background:var(--bg3);border:1px solid var(--border2);border-radius:6px;color:var(--text);outline:none}.f-group input:focus{border-color:var(--accent)}.cp-err{display:none;font-size:11px;color:var(--red);margin-top:8px;padding:6px 8px;background:#ef444414;border:1px solid rgba(239,68,68,.25);border-radius:5px;font-family:var(--mono);line-height:1.5;word-break:break-all}.alarm-bar{display:none;align-items:center;gap:10px;background:#ef444414;border-bottom:1px solid rgba(239,68,68,.2);padding:9px 24px;font-size:12px;color:var(--red);font-family:var(--mono)}.alarm-bar.show{display:flex}.alarm-pulse{width:8px;height:8px;border-radius:50%;background:var(--red);animation:pulse 1s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.main{padding:20px 24px;max-width:1400px}.process-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-bottom:20px}.process-card{background:linear-gradient(180deg,#161b22f5,#0e1218fa);border:1px solid var(--border);border-radius:12px;padding:14px;box-shadow:inset 0 1px #ffffff08}.process-card.wide{grid-column:span 2}.process-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.process-title{font-size:15px;font-weight:700;color:var(--text);letter-spacing:.04em}.process-topic{font-size:10px;color:var(--text3);font-family:var(--mono);letter-spacing:.08em}.process-stack{display:grid;gap:8px}.process-row{display:grid;grid-template-columns:56px 1fr 46px;align-items:center;gap:8px;min-height:44px}.process-label{font-size:12px;color:var(--text3);font-family:var(--mono)}.process-value{min-height:44px;display:flex;align-items:center;justify-content:flex-end;padding:0 12px;background:#020406;border:1px solid rgba(88,166,255,.16);border-radius:8px;color:#0f6;font-family:var(--mono);font-size:26px;font-weight:500;letter-spacing:.02em}.process-value.small{font-size:22px}.process-value.alarm{color:var(--red)}.process-unit{font-size:14px;color:var(--green);font-family:var(--mono)}.process-unit.warn{color:var(--amber)}.process-status{margin-top:10px;min-height:42px;display:flex;align-items:center;justify-content:center;border-radius:8px;border:1px solid rgba(63,185,80,.2);background:#3fb9501f;color:var(--green);font-size:14px;font-weight:700;letter-spacing:.04em}.process-status.warn{color:#111;border-color:#d2992273;background:#ffe34d}.process-status.alarm{color:#fff;border-color:#f851498c;background:#d7263d}.motor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.motor-card{padding:12px;border-radius:10px;border:1px solid rgba(255,255,255,.06);background:#ffffff05}.motor-title{margin-bottom:10px;color:var(--text);font-size:14px;font-weight:700}.te-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin-bottom:20px}.te-card{background:var(--bg2);border:1px solid var(--border);border-radius:12px;overflow:hidden;transition:border-color .2s}.te-card.heating{border-color:#f59e0b59}.te-card.alarm{border-color:#ef444466}.te-card.ok{border-color:#22c55e33}.te-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px 10px;border-bottom:1px solid var(--border)}.te-name{font-size:13px;font-weight:600;letter-spacing:.05em}.te-ssr{display:flex;align-items:center;gap:5px;font-size:11px;font-family:var(--mono)}.ssr-dot{width:6px;height:6px;border-radius:50%;background:var(--text3)}.ssr-dot.on{background:var(--amber);box-shadow:0 0 6px #f59e0b99}.te-pv-area{padding:14px 14px 0;display:flex;align-items:baseline;gap:6px}.te-pv{font-size:38px;font-weight:700;font-family:var(--mono);color:var(--text);line-height:1}.te-pv.warn{color:var(--amber)}.te-pv.alarm{color:var(--red)}.te-pv-unit{font-size:14px;color:var(--text2);font-family:var(--mono)}.te-sp-row{display:flex;align-items:center;justify-content:space-between;padding:8px 14px 0}.te-sp-lbl{font-size:11px;color:var(--text3);font-family:var(--mono)}.te-sp-val{font-size:13px;color:var(--teal);font-family:var(--mono);font-weight:500}.te-prog-wrap{padding:10px 14px 0}.te-prog-track{height:3px;background:var(--bg3);border-radius:2px;overflow:hidden}.te-prog-fill{height:100%;border-radius:2px;background:var(--teal);transition:width .5s ease}.te-prog-fill.warn{background:var(--amber)}.te-prog-fill.alarm{background:var(--red)}.te-pid-row{display:flex;gap:0;padding:10px 14px;border-top:1px solid var(--border);margin-top:10px}.te-pid-item{flex:1;text-align:center}.te-pid-item+.te-pid-item{border-left:1px solid var(--border)}.te-pid-k{font-size:10px;color:var(--text3);font-family:var(--mono);margin-bottom:2px}.te-pid-v{font-size:13px;font-family:var(--mono);color:var(--text2);font-weight:500}.te-flags{display:flex;gap:6px;padding:0 14px 12px;flex-wrap:wrap}.flag{font-size:10px;font-family:var(--mono);padding:2px 7px;border-radius:4px;background:var(--bg3);color:var(--text3);border:1px solid var(--border)}.flag.on{background:var(--green-bg);color:var(--green);border-color:#22c55e33}.flag.warn{background:var(--amber-bg);color:var(--amber);border-color:#f59e0b40}.editable{cursor:pointer;transition:color .2s;position:relative}.editable:hover{color:var(--accent)}.editable:after{content:"✎";font-size:10px;position:absolute;top:-4px;right:-12px;opacity:0;transition:opacity .2s;color:var(--accent)}.editable:hover:after{opacity:.8}.inline-input{background:var(--bg);border:1px solid var(--accent);color:var(--text);font-family:var(--mono);text-align:center;border-radius:4px;outline:none;padding:0;width:100%;box-sizing:border-box}.process-inline-input{background:#020406;border:1px solid rgba(88,166,255,.26);color:#0f6;font-family:inherit;font-size:inherit;font-weight:inherit;text-align:right;border-radius:8px;padding:0 12px}.te-pv .inline-input{font-size:28px;width:80px;height:36px}.te-sp-val .inline-input{font-size:13px;width:50px;text-align:right}.te-pid-v .inline-input{font-size:12px;width:90%}.te-ctrl-row{display:flex;gap:6px;padding:10px 14px;border-top:1px solid var(--border)}.ctrl-btn{flex:1;padding:6px 0;background:var(--bg3);border:1px solid var(--border2);border-radius:4px;color:var(--text2);font-size:11px;font-family:var(--mono);cursor:pointer;transition:all .15s}.ctrl-btn:hover{border-color:var(--accent);color:var(--accent)}.ctrl-btn.active{background:var(--green-bg);border-color:var(--green);color:var(--green)}.ctrl-btn.active-warn{background:var(--amber-bg);border-color:var(--amber);color:var(--amber)}.chart-panel{background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:16px 18px;margin-bottom:20px}.chart-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.chart-title{font-size:12px;color:var(--text3);letter-spacing:.07em;font-family:var(--mono)}.chart-legend{display:flex;gap:12px;flex-wrap:wrap}.cl-item{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--text2);font-family:var(--mono)}.cl-line{width:16px;height:2px;border-radius:1px}.chart-wrap{position:relative;height:220px}.log-panel{background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:14px 16px}.log-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.log-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.log-title{font-size:12px;color:var(--text3);letter-spacing:.07em;font-family:var(--mono)}.log-filter{min-width:180px;padding:6px 10px;border-radius:6px;border:1px solid var(--border2);background:var(--bg3);color:var(--text2);font-size:11px;font-family:var(--mono);outline:none}.log-clear{font-size:11px;color:var(--text3);cursor:pointer;font-family:var(--mono)}.log-clear:hover{color:var(--text2)}.log-box{height:140px;overflow-y:auto}.log-row{display:grid;grid-template-columns:70px 60px 140px 1fr;gap:8px;padding:6px 0;font-size:11px;font-family:var(--mono);border-bottom:1px solid var(--border);cursor:pointer}.log-row:last-child{border-bottom:none}.log-row:hover{background:#ffffff08}.lt{color:var(--text3)}.lrx{color:var(--accent)}.ltx{color:var(--green)}.lsy,.lsys{color:var(--text3)}.lerr{color:var(--red)}.log-topic-cell,.log-msg-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.log-topic-cell{color:var(--text2)}.log-row.expandable .log-msg-cell:after{content:" 查看";color:var(--text3)}.lbadge{font-size:10px;padding:1px 6px;border-radius:3px}.lbadge.rx{background:#3b82f61a;color:var(--accent)}.lbadge.tx{background:var(--green-bg);color:var(--green)}.lbadge.sys{background:var(--bg3);color:var(--text3)}.lbadge.err{background:var(--red-bg);color:var(--red)}.log-empty{padding:18px 0;color:var(--text3);text-align:center;font-size:11px;font-family:var(--mono)}.log-modal{position:fixed;inset:0;z-index:130;display:none;align-items:center;justify-content:center;padding:18px;background:#02060ac7}.log-modal.open{display:flex}.log-modal-card{width:min(860px,100%);max-height:82vh;overflow:hidden;background:linear-gradient(180deg,#161b22fa,#0c1015fa);border:1px solid var(--border2);border-radius:14px;box-shadow:0 18px 60px #00000073}.log-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px;border-bottom:1px solid var(--border)}.log-modal-title{color:var(--text);font-size:14px;font-weight:700;font-family:var(--mono)}.log-modal-meta{margin-top:5px;color:var(--text3);font-size:11px;font-family:var(--mono)}.log-modal-body{padding:16px;overflow:auto;max-height:calc(82vh - 76px)}.log-modal-pre{margin:0;white-space:pre-wrap;word-break:break-word;background:#020406;border:1px solid rgba(88,166,255,.12);border-radius:10px;padding:14px;color:var(--text2);font-size:12px;line-height:1.6;font-family:var(--mono)}@media(max-width:700px){.main{padding:12px}.topbar{padding:10px 12px}.cp-grid,.cp-grid2,.pid-kgrid{grid-template-columns:1fr 1fr}.te-pv{font-size:30px}.process-card.wide{grid-column:span 1}.motor-grid{grid-template-columns:1fr}.log-row{grid-template-columns:58px 48px 96px 1fr}.log-filter{min-width:132px}}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border2);border-radius:2px}.app-shell{position:relative}.dashboard-main{display:grid;gap:18px;grid-template-columns:minmax(0,1fr);grid-template-areas:"pressure" "te" "chart" "log"}.section-pressure{grid-area:pressure}.section-te{grid-area:te}.section-chart{grid-area:chart}.section-log{grid-area:log}.btn-view{border-color:#6ee7ff59;color:#7be9ff;background:linear-gradient(135deg,#0ea5e91f,#10b9810f)}.btn-view:hover{border-color:#6ee7ffbf;color:#d9f7ff}.trend-target{cursor:pointer;position:relative}.trend-focus-zone{cursor:pointer}.trend-focus-zone:hover{background:linear-gradient(90deg,#7df9ff0f,#7df9ff00)}.trend-target:after{content:"";position:absolute;inset:8px 14px 0;border-radius:6px;border:1px dashed rgba(125,249,255,.12);pointer-events:none}.te-card.trend-focused{border-color:#7df9ffa6!important;box-shadow:0 0 0 1px #7df9ff33,0 10px 28px #06142059}.chart-reset-btn{margin-left:10px;padding:5px 10px;font-size:11px}.view-mode-overview .dashboard-main{grid-template-columns:minmax(0,1fr)}.view-mode-focus .dashboard-main{grid-template-areas:"chart" "pressure" "te"}.view-mode-focus .section-log{display:none}.view-mode-focus .chart-wrap{height:360px}.view-mode-focus .te-pid-row,.view-mode-focus .te-ctrl-row{display:none}.view-mode-focus .te-card{border-color:#38bdf840}.view-mode-compact .dashboard-main{gap:12px;grid-template-columns:minmax(0,1.32fr) minmax(280px,.68fr);grid-template-areas:"pressure chart" "te log";align-items:start}.view-mode-compact .te-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px}.view-mode-compact .te-pv{font-size:30px}.view-mode-compact .te-pid-row{padding:8px 12px}.view-mode-compact .te-prog-wrap,.view-mode-compact .te-pid-row,.view-mode-compact .te-flags,.view-mode-compact .te-ctrl-row{display:none}.view-mode-compact .process-grid{gap:8px}.view-mode-compact .chart-wrap{height:240px}.view-mode-compact .log-box{height:170px}.view-mode-compact .log-panel{padding-top:10px;padding-bottom:10px}.view-mode-neon{--bg: #090318;--bg2: #140926;--bg3: #1a1033;--bg4: #231345;--border: rgba(255, 113, 206, .2);--border2: rgba(125, 249, 255, .3);--text: #f3e9ff;--text2: #b9c2ff;--text3: #8f8ac5;--accent: #7df9ff;--accent2: #ff71ce;--green: #7df9ff;--amber: #ffd166;--red: #ff5d8f}.view-mode-neon:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 15% 15%,rgba(125,249,255,.12),transparent 35%),radial-gradient(circle at 85% 10%,rgba(255,113,206,.16),transparent 32%),radial-gradient(circle at 60% 88%,rgba(142,92,255,.14),transparent 36%);z-index:0}.view-mode-neon .topbar,.view-mode-neon .conn-panel,.view-mode-neon .process-card,.view-mode-neon .te-card,.view-mode-neon .chart-panel,.view-mode-neon .log-panel{background:linear-gradient(160deg,#150d2ce0,#0c081ae6);border-color:#7df9ff40;box-shadow:0 12px 30px #03020a59,inset 0 0 0 1px #ff71ce1f}.view-mode-neon .main,.view-mode-neon .topbar,.view-mode-neon .conn-panel,.view-mode-neon .alarm-bar{position:relative;z-index:1}.view-mode-neon .te-pv,.view-mode-neon .process-value{text-shadow:0 0 16px rgba(125,249,255,.3)}.view-mode-neon .chart-wrap{height:300px}@media(max-width:1100px){.view-mode-compact .dashboard-main{grid-template-columns:minmax(0,1fr);grid-template-areas:"pressure" "chart" "te" "log"}}:root{--value-readonly: #7df9ff;--value-readonly-soft: rgba(125, 249, 255, .2);--value-writable: #ffd166;--value-writable-soft: rgba(255, 209, 102, .24)}.value-ro{color:var(--value-readonly)!important}.value-io{color:var(--value-writable)!important}.process-value.value-ro{border-color:var(--value-readonly-soft)!important}.process-value.value-io{border-color:var(--value-writable-soft)!important;box-shadow:inset 0 0 0 1px #ffd16614}.te-pid-v.value-io,.te-sp-val.value-io{color:var(--value-writable)!important}.te-pv.value-ro{color:var(--value-readonly)!important}*,*:before,*:after{box-sizing:border-box}html,body,#app{margin:0;min-height:100%}body{background:#050810;color:#e8f4fd}.app-shell{min-height:100vh}.screen-swap-enter-active,.screen-swap-leave-active{transition:opacity .38s ease,transform .38s ease}.screen-swap-enter-from,.screen-swap-leave-to{opacity:0;transform:translateY(14px)}.login-screen{min-height:100vh;display:grid;place-items:center;padding:24px;position:relative;overflow:hidden}.login-bg-orb{position:absolute;width:420px;height:420px;border-radius:50%;filter:blur(42px);opacity:.45;pointer-events:none}.orb-a{background:radial-gradient(circle,#38bdf873,#38bdf800);top:-120px;left:-90px}.orb-b{background:radial-gradient(circle,#14b8a66b,#14b8a600);right:-120px;bottom:-130px}.login-card{width:min(680px,100%);padding:28px;border-radius:18px;border:1px solid rgba(125,211,252,.22);background:linear-gradient(165deg,#0d1119f2,#080c13f5);box-shadow:0 24px 80px #0000006b,inset 0 1px #ffffff0a;position:relative;z-index:1}.login-title-wrap{margin-bottom:18px}.login-title{margin:0;font-family:var(--sans, "Syne", sans-serif);letter-spacing:.06em;font-size:clamp(28px,3.8vw,44px);line-height:1.05;color:#eaf6ff}.login-subtitle{margin:10px 0 0;font-size:12px;letter-spacing:.08em;font-family:var(--mono, "DM Mono", monospace);color:#7ea0b9}.login-form{display:grid;gap:10px}.login-advanced-toggle{margin-top:2px;padding:0;border:0;background:transparent;color:#8bd9f4;cursor:pointer;text-align:left;font-size:12px;letter-spacing:.04em;font-family:var(--mono, "DM Mono", monospace)}.login-advanced-toggle:hover{color:#d8f5ff}.login-advanced-wrap{display:grid;gap:10px;padding:10px;border-radius:10px;border:1px solid rgba(125,211,252,.2);background:#09111e80}.advanced-fade-enter-active,.advanced-fade-leave-active{transition:opacity .22s ease,transform .22s ease}.advanced-fade-enter-from,.advanced-fade-leave-to{opacity:0;transform:translateY(-4px)}.login-err{margin-top:4px}.login-connect-btn{margin-top:8px;width:100%;padding:10px 14px;font-size:13px}@media(max-width:700px){.login-card{padding:18px;border-radius:14px}}