*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.75)}}:root{--bg: #F6F5F3;--surface: #FFFFFF;--surface2: #F0EFEB;--border: rgba(0,0,0,.09);--border2: rgba(0,0,0,.15);--text: #1A1A18;--text2: #6B6B67;--text3: #9A9A96;--blue: #E8710A;--blue-bg: #FEF3E8;--blue-t: #B85808;--green: #3B6D11;--green-bg: #EAF3DE;--amber: #854F0B;--amber-bg: #FAEEDA;--red: #A32D2D;--red-bg: #FCEBEB;--radius: 8px;--radius-lg:12px;--shadow: 0 1px 3px rgba(0,0,0,.06)}body{font-family:Inter,system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border2);border-radius:3px}input,select,textarea{font-family:inherit;font-size:13px;color:var(--text);background:var(--surface);border:.5px solid var(--border2);border-radius:var(--radius);padding:0 10px;height:34px;outline:none;transition:border-color .15s}input:focus,select:focus{border-color:var(--blue)}input[type=date]{padding:0 8px}button{font-family:inherit;cursor:pointer}a{color:var(--blue);text-decoration:none}.show-mobile{display:none!important}@media(max-width:768px){.hide-mobile{display:none!important}.show-mobile{display:flex!important}.grid-4col,.grid-3col{grid-template-columns:repeat(2,1fr)!important}.grid-2col{grid-template-columns:1fr!important}.scroll-x{overflow-x:auto;-webkit-overflow-scrolling:touch}.scroll-x table{min-width:480px}.page-pad{padding:10px!important}input,select{max-width:100%}.bottom-nav-pad{padding:10px 10px 66px!important}.recharts-responsive-container{min-height:0!important}.mono-clip{font-family:monospace;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:160px;display:inline-block;vertical-align:bottom}}.bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;z-index:100;background:var(--surface);border-top:.5px solid var(--border);height:56px;align-items:stretch}@media(max-width:768px){.bottom-nav{display:flex}.bottom-nav-pad{padding-bottom:56px}}.sidebar-overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background:#00000059}.sidebar-drawer{position:fixed;top:0;left:0;bottom:0;width:220px;z-index:201;background:var(--surface);border-right:.5px solid var(--border);overflow-y:auto;transform:translate(-100%);transition:transform .22s cubic-bezier(.4,0,.2,1)}.sidebar-drawer.open{transform:translate(0)}@media(max-width:768px){.sidebar-overlay.open{display:block}}.help-fab{bottom:24px;right:24px}@media(max-width:768px){.help-fab{bottom:72px;right:14px}}.device-card{background:var(--surface);border:.5px solid var(--border);border-radius:var(--radius-lg);padding:12px;cursor:pointer;transition:background .12s}.device-card:active{background:var(--surface2)}.vcp{display:flex;flex-direction:column;gap:14px;margin-top:18px}.vcp-header{background:var(--surface);border:.5px solid var(--border);border-radius:var(--radius-lg);padding:16px 20px;display:flex;align-items:center;gap:14px;box-shadow:var(--shadow)}.vcp-header-ico{width:44px;height:44px;background:#eff6ff;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}.vcp-header-title{font-size:15px;font-weight:700;color:var(--text)}.vcp-header-sub{font-size:11px;color:var(--text3);font-family:monospace;margin-top:2px}.vcp-legend{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.vcp-leg{background:var(--surface);border:.5px solid var(--border);border-radius:var(--radius);padding:10px 14px;display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text2)}.vcp-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0}.vcp-dot.open{background:#16a34a}.vcp-dot.closed{background:var(--text3)}.vcp-dot.unknown{background:#d97706}.vcp-section-head{font-size:11px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.07em;display:flex;align-items:center;gap:10px}.vcp-section-head:after{content:"";flex:1;height:1px;background:var(--border2)}.vcp-valves{display:grid;grid-template-columns:1fr 1fr;gap:14px}.vcp-valve{background:var(--surface);border:2px solid var(--border);border-radius:var(--radius-lg);padding:18px;box-shadow:var(--shadow);transition:border-color .2s,box-shadow .2s}.vcp-valve.state-open{border-color:#86efac;box-shadow:var(--shadow),0 0 0 3px #dcfce7}.vcp-valve.state-closed{border-color:var(--border)}.vcp-valve.state-unknown{border-color:#fcd34d}.vcp-vc-head{margin-bottom:14px}.vcp-vc-name{font-size:15px;font-weight:700;color:var(--text)}.vcp-indicator{display:flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:16px}.vcp-ring{width:72px;height:72px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:28px;transition:all .3s}.vcp-ring.open{background:radial-gradient(circle at 38% 38%,#4ade80,#15803d);box-shadow:0 0 0 5px #dcfce7,0 4px 18px #16a34a4d}.vcp-ring.closed{background:radial-gradient(circle at 38% 38%,#e2e8f0,#94a3b8);box-shadow:0 0 0 5px var(--surface2)}.vcp-ring.unknown{background:radial-gradient(circle at 38% 38%,#fbbf24,#d97706);box-shadow:0 0 0 5px #fef3c7,0 4px 18px #d9770640}.vcp-ring-lbl{font-size:14px;font-weight:800;letter-spacing:.04em}.vcp-ring-lbl.open{color:#16a34a}.vcp-ring-lbl.closed{color:var(--text3)}.vcp-ring-lbl.unknown{color:#d97706}.vcp-btn-row{display:grid;grid-template-columns:1fr;gap:8px;margin-bottom:12px}.vcp-btn-open,.vcp-btn-close{padding:12px 8px;border-radius:var(--radius-lg);border:none;font-size:13px;font-weight:700;cursor:pointer;transition:all .15s;display:flex;align-items:center;justify-content:center;gap:4px;min-height:44px}.vcp-btn-open{background:#16a34a;color:#fff}.vcp-btn-open:hover:not(:disabled){background:#15803d;transform:translateY(-1px)}.vcp-btn-close{background:#dc2626;color:#fff}.vcp-btn-close:hover:not(:disabled){background:#b91c1c;transform:translateY(-1px)}.vcp-btn-open:disabled,.vcp-btn-close:disabled{opacity:.45;cursor:not-allowed;transform:none}.vcp-badge{border-radius:var(--radius);padding:6px 12px;font-size:12px;font-weight:600;margin-bottom:10px;display:flex;align-items:center;gap:6px}.vcp-badge.pending{background:#fef9c3;border:1px solid #fde047;color:#854d0e;animation:vcp-pulse-bg 1.8s ease-in-out infinite}.vcp-badge.confirmed{background:#dcfce7;border:1px solid #86efac;color:#166534}.vcp-badge.timeout{background:#fff7ed;border:1px solid #fdba74;color:#9a3412}.vcp-ring.pending{animation:vcp-pulse-ring 1.4s ease-in-out infinite}@keyframes vcp-pulse-bg{0%,to{opacity:1}50%{opacity:.6}}@keyframes vcp-pulse-ring{0%,to{box-shadow:0 0 #facc1580}50%{box-shadow:0 0 0 6px #facc1500}}.vcp-timer{background:var(--surface2);border:.5px solid var(--border2);border-radius:var(--radius-lg);padding:12px}.vcp-countdown{background:#fef3c7;border:1px solid #fbbf24;border-radius:var(--radius);padding:7px 12px;font-size:13px;color:#92400e;font-weight:600;margin-bottom:10px;display:flex;align-items:center;gap:6px}.vcp-timer-lbl{font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}.vcp-presets{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:8px}.vcp-preset{padding:5px 11px;border-radius:var(--radius);border:1px solid var(--border2);background:var(--surface);color:var(--text2);font-size:12px;font-weight:600;cursor:pointer;transition:all .12s;min-height:32px}.vcp-preset:hover{border-color:#d97706;color:#d97706;background:#fef3c7}.vcp-preset.active{border-color:#d97706;color:#d97706;background:#fef3c7;font-weight:700}.vcp-custom-row{display:flex;gap:6px;align-items:center}.vcp-custom-row input{flex:1;min-width:0;height:36px}.vcp-btn-timed{padding:0 14px;height:36px;border-radius:var(--radius);border:none;background:#d97706;color:#fff;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap;transition:all .12s}.vcp-btn-timed:hover:not(:disabled){background:#b45309}.vcp-btn-timed:disabled{opacity:.45;cursor:not-allowed}.vcp-gpio-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.vcp-gpio-card{background:var(--surface);border:.5px solid var(--border);border-radius:var(--radius-lg);padding:12px 16px;display:flex;align-items:center;gap:10px;box-shadow:var(--shadow)}.vcp-gpio-led{width:11px;height:11px;border-radius:50%;flex-shrink:0;transition:all .3s}.vcp-gpio-led.high{background:#16a34a;box-shadow:0 0 5px #16a34a80}.vcp-gpio-led.low{background:var(--text3)}.vcp-gpio-name{font-size:13px;font-weight:600;color:var(--text)}.vcp-gpio-val{font-size:11px;color:var(--text3);margin-top:1px}.vcp-cmds-card{background:var(--surface);border:.5px solid var(--border);border-radius:var(--radius-lg);padding:18px;box-shadow:var(--shadow)}.vcp-cmd-grp{margin-bottom:14px}.vcp-cmd-grp:last-of-type{margin-bottom:0}.vcp-cmd-grp-title{width:100%;display:flex;align-items:center;justify-content:space-between;font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;margin-bottom:7px;background:none;border:none;cursor:pointer;padding:2px 0}.vcp-cmd-grp-title:hover{color:var(--text2)}.vcp-grp-arrow{font-size:13px;transition:transform .15s;display:inline-block;transform:rotate(-90deg)}.vcp-grp-arrow.open{transform:rotate(0)}.vcp-pills{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:4px}.vcp-pill{padding:6px 12px;border-radius:var(--radius);border:1px solid var(--border2);background:var(--surface2);color:var(--text2);font-size:12px;font-weight:500;cursor:pointer;transition:all .12s;min-height:32px}.vcp-pill:hover:not(:disabled){border-color:var(--blue);color:var(--blue);background:var(--blue-bg)}.vcp-pill:disabled{opacity:.45;cursor:not-allowed}.vcp-pill.sent{border-color:#16a34a;color:#16a34a;background:#dcfce7;font-weight:700}.vcp-pill.green{border-color:#86efac;color:#16a34a;background:#dcfce7}.vcp-pill.green:hover{background:#bbf7d0}.vcp-pill.red{border-color:#fca5a5;color:#dc2626;background:#fee2e2}.vcp-pill.red:hover{background:#fecaca}.vcp-pill.danger:not(.green):not(.red):hover{border-color:#dc2626;color:#dc2626;background:#fee2e2}.vcp-send-row{display:flex;align-items:center;gap:10px;margin-top:16px;padding-top:14px;border-top:.5px solid var(--border);flex-wrap:wrap}.vcp-hex-preview{flex:1;min-width:0;font-family:monospace;font-size:11px;padding:7px 10px;border-radius:var(--radius);background:#eff6ff;border:1px solid #bfdbfe;color:#1d4ed8;word-break:break-all}.vcp-hex-preview.empty{background:var(--surface2);border-color:var(--border);color:var(--text3)}.vcp-btn-send{padding:9px 20px;border-radius:var(--radius-lg);border:none;background:var(--blue);color:#fff;font-size:13px;font-weight:700;cursor:pointer;transition:all .15s;white-space:nowrap;min-height:36px}.vcp-btn-send:hover:not(:disabled){opacity:.88;transform:translateY(-1px)}.vcp-btn-send:disabled{background:var(--border2);color:var(--text3);cursor:not-allowed;transform:none}.vcp-fu-bar{display:flex;align-items:center;gap:8px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:var(--radius-lg);padding:10px 14px;font-size:13px;color:#1d4ed8}.vcp-fu-spinner{animation:vcp-spin 1.2s linear infinite;display:inline-block}.vcp-fu-bar strong{font-size:15px;font-weight:800;min-width:28px}.vcp-fu-cancel{margin-left:auto;background:none;border:none;cursor:pointer;color:#93c5fd;font-size:14px;line-height:1;padding:2px 4px;border-radius:4px}.vcp-fu-cancel:hover{color:#1d4ed8;background:#dbeafe}@keyframes vcp-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.vcp-feedback{background:var(--surface);border:.5px solid var(--border);border-radius:var(--radius-lg);padding:16px 18px;box-shadow:var(--shadow)}.vcp-feedback-title{font-size:13px;font-weight:700;color:var(--text2);margin-bottom:10px}.vcp-last-action{background:#eff6ff;border:1px solid #bfdbfe;border-radius:var(--radius);padding:10px 14px;font-size:13px;font-weight:600;color:#1d4ed8;margin-bottom:12px;word-break:break-word}.vcp-log{display:flex;flex-direction:column;gap:6px;max-height:200px;overflow-y:auto}.vcp-log-row{background:var(--surface2);border:.5px solid var(--border);border-radius:var(--radius);padding:8px 12px;display:flex;align-items:center;gap:8px;font-size:12px;flex-wrap:wrap}.vcp-log-time{color:var(--text3);font-weight:600;font-family:monospace;flex-shrink:0}.vcp-log-msg{color:var(--text2);flex:1;word-break:break-word}.vcp-log-tag{font-size:10px;font-weight:700;padding:2px 7px;border-radius:4px;white-space:nowrap;flex-shrink:0}.vcp-log-tag.ok{background:#dcfce7;color:#16a34a;border:1px solid #86efac}.vcp-log-tag.fail{background:#fee2e2;color:#dc2626;border:1px solid #fca5a5}.vcp-alarm-banner{background:#fef2f2;border:1.5px solid #fca5a5;border-radius:var(--radius-lg);padding:11px 16px;font-size:13px;color:#991b1b;font-weight:600;display:flex;align-items:center;gap:8px}.vcp-header-body{flex:1;min-width:0}.vcp-battery{display:flex;align-items:center;gap:5px;font-size:12px;font-weight:700;padding:5px 10px;border-radius:var(--radius-lg);border:1px solid;white-space:nowrap}.vcp-battery.ok{background:#dcfce7;border-color:#86efac;color:#166534}.vcp-battery.warn{background:#fefce8;border-color:#fde047;color:#854d0e}.vcp-battery.crit{background:#fef2f2;border-color:#fca5a5;color:#991b1b;animation:vcp-pulse-bg 1.4s ease-in-out infinite}.vcp-battery.unknown{background:var(--surface2);border-color:var(--border);color:var(--text3)}.vcp-volume{display:flex;align-items:center;gap:6px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:var(--radius);padding:7px 12px;margin-bottom:10px}.vcp-vol-ico{font-size:16px}.vcp-vol-val{font-size:18px;font-weight:800;color:#1d4ed8;flex:1}.vcp-vol-lbl{font-size:10px;color:#93c5fd;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.vcp-pressure-card{background:var(--surface);border:.5px solid var(--border);border-radius:var(--radius-lg);padding:16px 20px;display:flex;align-items:center;gap:16px;box-shadow:var(--shadow)}.vcp-pressure-card.alarm{border-color:#fca5a5;background:#fef2f2}.vcp-press-val{font-size:26px;font-weight:800;color:var(--text)}.vcp-press-sub{font-size:12px;color:var(--text3)}.vcp-press-alarm{font-size:12px;color:#991b1b;font-weight:600;margin-left:auto}.vcp-meter-cfg{background:var(--surface2);border-top:.5px solid var(--border);padding:16px 18px;display:flex;flex-direction:column;gap:12px}.vcp-meter-cfg-hint{font-size:12px;color:var(--text3);line-height:1.5;margin:0}.vcp-meter-cfg-row{display:flex;align-items:center;gap:10px}.vcp-meter-cfg-row label{font-size:13px;font-weight:600;color:var(--text2);flex:1}.vcp-unit{font-size:11px;font-weight:400;color:var(--text3)}.vcp-meter-cfg-row input{width:100px;height:34px}.vcp-meter-cfg-preview{display:flex;gap:16px;font-size:12px;color:var(--text3)}.vcp-meter-cfg-preview span{font-weight:600}.vcp-meter-save{align-self:flex-start;padding:9px 20px;border-radius:var(--radius-lg);border:none;background:var(--blue);color:#fff;font-size:13px;font-weight:700;cursor:pointer;transition:opacity .12s}.vcp-meter-save:hover:not(:disabled){opacity:.85}.vcp-meter-save:disabled{opacity:.45;cursor:not-allowed}.vcp-task-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px 18px;background:var(--surface2);border-top:.5px solid var(--border)}.vcp-task-card{background:var(--surface);border:.5px solid var(--border);border-radius:var(--radius);padding:10px 12px}.vcp-task-title{font-size:11px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px}.vcp-task-row{display:flex;justify-content:space-between;font-size:12px;color:var(--text2);padding:2px 0;gap:8px}.vcp-task-row span{color:var(--text3)}.vcp-task-row strong.ok{color:#16a34a}.vcp-devinfo{display:flex;flex-wrap:wrap;gap:12px;padding:10px 14px;background:var(--surface2);border-bottom:.5px solid var(--border);font-size:11px;color:var(--text3);font-family:monospace}.vcp-collapse{border:.5px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}.vcp-collapse-head{width:100%;display:flex;align-items:center;justify-content:space-between;padding:14px 18px;background:var(--surface);border:none;cursor:pointer;font-size:13px;font-weight:600;color:var(--text2);text-align:left}.vcp-collapse-head:hover{background:var(--surface2)}.vcp-collapse-arrow{transition:transform .2s;font-size:11px;color:var(--text3)}.vcp-collapse-arrow.open{transform:rotate(180deg)}.vcp-collapse-body{background:var(--surface);border-top:.5px solid var(--border);padding:0}.vcp-admin-table{width:100%;border-collapse:collapse;font-size:12px}.vcp-admin-table th{text-align:left;padding:8px 14px;color:var(--text3);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;border-bottom:.5px solid var(--border)}.vcp-admin-table td{padding:8px 14px;border-bottom:.5px solid var(--border);color:var(--text2)}.vcp-admin-table tr:last-child td{border-bottom:none}.vcp-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a80;display:flex;align-items:center;justify-content:center;z-index:1200;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);padding:16px}.vcp-conf{background:var(--surface);border-radius:18px;padding:28px 24px;max-width:340px;width:100%;box-shadow:0 12px 40px #00000026;text-align:center}.vcp-conf-ico{font-size:36px;margin-bottom:12px}.vcp-conf-title{font-size:16px;font-weight:700;color:var(--text);margin-bottom:8px}.vcp-conf-body{font-size:13px;color:var(--text2);margin-bottom:20px;line-height:1.5}.vcp-conf-btns{display:flex;gap:8px}.vcp-cbtn-cancel{flex:1;padding:11px;border-radius:var(--radius-lg);background:var(--surface2);color:var(--text2);border:1px solid var(--border2);font-size:13px;font-weight:600;cursor:pointer;min-height:44px}.vcp-cbtn-cancel:hover{background:var(--border)}.vcp-cbtn-confirm{flex:1;padding:11px;border-radius:var(--radius-lg);background:#dc2626;color:#fff;border:none;font-size:13px;font-weight:700;cursor:pointer;min-height:44px}.vcp-cbtn-confirm:hover{background:#b91c1c}.vcp-toasts{position:fixed;bottom:24px;right:16px;display:flex;flex-direction:column;gap:7px;z-index:1300;max-width:300px;pointer-events:none}.vcp-toast{background:var(--surface);border:1px solid var(--border2);border-radius:var(--radius-lg);padding:11px 14px;font-size:13px;box-shadow:0 8px 28px #0000001f;display:flex;align-items:flex-start;gap:8px;animation:vcpToastIn .2s ease}.vcp-toast.ok{border-color:#86efac}.vcp-toast.err{border-color:#fca5a5}.vcp-toast strong{display:block;font-weight:700;color:var(--text);font-size:12px}.vcp-toast-sub{font-size:11px;color:var(--text3);margin-top:2px}@keyframes vcpToastIn{0%{opacity:0;transform:translate(12px)}to{opacity:1;transform:none}}@media(max-width:640px){.vcp-valves,.vcp-legend,.vcp-gpio-grid,.vcp-btn-row{grid-template-columns:1fr}.vcp-btn-open,.vcp-btn-close{font-size:12px;padding:11px 6px}.vcp-send-row{flex-direction:column;align-items:stretch}.vcp-hex-preview{word-break:break-all}.vcp-toasts{right:8px;bottom:70px;max-width:calc(100vw - 16px)}}