:root{--ink:#182e34;--muted:#728186;--teal:#147d6c;--teal-dark:#0c6053;--border:#dce5e4;--paper:#fff;--bg:#f4f7f6;--red:#bf4a40;--amber:#a66a18;--sidebar:244px}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.55 'Segoe UI',Arial,sans-serif}button,input,select{font:inherit}button{cursor:pointer;transition:background .15s,transform .15s}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,a:focus-visible{outline:3px solid #61cbb5;outline-offset:3px}button:active:not(:disabled){transform:translateY(1px)}a{color:var(--teal)}.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);background:#102e31;color:#e6f3ef;padding:34px 21px;display:flex;flex-direction:column}.brand{display:flex;gap:12px;align-items:center;color:white;text-decoration:none;font-size:14px;font-weight:750;letter-spacing:1px}.logo{width:39px;height:43px;background:#235054;border:1px solid #416b68;border-radius:12px;font-size:28px;line-height:40px;text-align:center;letter-spacing:-3px}.logo span{color:#78d0b5;font-size:21px}.brand small{display:block;color:#a5bcb9;font-size:10px;letter-spacing:.4px;font-weight:400;margin-top:3px}.nav-caption{font-size:9px;letter-spacing:1.4px;color:#89a8a5;margin:52px 8px 18px}nav{display:grid;gap:8px}nav button{border:0;background:transparent;color:#b9cfcb;padding:14px 12px;text-align:left;border-radius:8px;font-size:12px}nav button span{font-size:10px;color:#749995;margin-right:12px}nav button.active{background:#24524e;color:#fff}nav button.active span{color:#95e0ca}nav button:hover{background:#1e4545}.sidebar-bottom{margin-top:auto;border-top:1px solid #355052;padding:24px 7px 0;font-size:9px;letter-spacing:1.1px;color:#a1bdb5}.sidebar-bottom p{font-size:17px;line-height:1.5;letter-spacing:0;color:#e6f3ef;margin:16px 0}.sidebar-bottom small{font-size:10px;color:#84a39e;letter-spacing:0}.tiny-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#75cca9;margin-right:6px}main{margin-left:var(--sidebar);padding:0 42px;max-width:1700px}header{height:91px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:12px}.breadcrumb{font-size:12px;color:var(--muted)}.breadcrumb span{margin:0 12px;color:#b0bdbb}.top-actions{display:flex;align-items:center;gap:16px}.primary,.secondary,.danger,.outline{border:1px solid transparent;padding:10px 18px;border-radius:7px;font-weight:600;font-size:12px}.primary{background:var(--teal);color:#fff}.primary:hover{background:var(--teal-dark)}.secondary{background:white;border-color:var(--border);color:var(--ink)}.secondary:hover{background:#ecf3f0}.danger{background:#fff4f1;color:var(--red);border-color:#ebcac6}.outline{background:transparent;border-color:#a9cec3;color:var(--teal)}.text-button{background:none;border:0;color:var(--teal);padding:0;font-size:12px}.badge{font-size:11px;padding:5px 10px;border-radius:20px;background:#e9eeee;color:#627574;white-space:nowrap}.badge.good{color:#147353;background:#e3f4ea}.badge.warn{color:#916118;background:#fff0d8}.badge.bad{color:#b14436;background:#fbe8e2}.page-head{display:flex;justify-content:space-between;gap:20px;align-items:center;margin:34px 0 25px}.eyebrow{font-size:10px;color:var(--teal);letter-spacing:1.7px;font-weight:700;margin-bottom:8px}h1{font-size:30px;line-height:1.2;letter-spacing:-.8px;margin:0 0 12px;font-weight:650}h2{font-size:17px;letter-spacing:-.3px;font-weight:650;margin:0 0 5px}h3{font-size:14px;margin:0 0 10px}.subtitle,.muted{color:var(--muted)}.subtitle{margin:0;max-width:650px;font-size:13px}.panel{background:#fff;border:1px solid var(--border);border-radius:12px;padding:25px;margin-bottom:20px}.panel-heading{display:flex;gap:15px;justify-content:space-between;align-items:center;margin-bottom:24px}.panel-heading p{font-size:12px;color:var(--muted);margin:3px 0}.section-no{font-size:11px;color:var(--teal);background:#e8f5ef;padding:7px 10px;border-radius:7px}.grid-two{display:grid;grid-template-columns:1.55fr 1fr;gap:20px}.grid-three{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.field{display:block;font-size:12px;color:#526968}.field input,.field select{display:block;width:100%;margin-top:7px}.field small{display:block;font-size:11px;color:var(--muted);margin-top:7px}input,select{border:1px solid #d5dfdc;background:#fff;border-radius:6px;padding:10px 11px;color:var(--ink);min-width:0;outline:none}input:focus,select:focus{border-color:#3f9d86;box-shadow:0 0 0 3px #e4f4ee}input[type=checkbox]{accent-color:var(--teal)}input[type=number]{font-variant-numeric:tabular-nums}input:disabled,select:disabled{background:#f1f4f3;color:#8e9a96}.number-row{display:flex;align-items:center;gap:10px;margin-top:7px}.number-row input{margin:0;width:100px}.number-row button{width:39px;height:40px;background:white;border:1px solid var(--border);border-radius:6px;font-size:19px}.mode-options{display:grid;grid-template-columns:1fr 1fr;gap:15px}.mode-option{position:relative;text-align:left;padding:22px 18px;background:#fff;border:1px solid var(--border);border-radius:9px;color:var(--ink)}.mode-option.selected{border:2px solid var(--teal);padding:21px 17px;background:#f5fbf8}.mode-option .mode-icon{font-size:23px;display:block;color:var(--teal);height:38px}.mode-option strong{display:block;font-size:14px;margin:3px 0 6px}.mode-option small{display:block;color:var(--muted);font-size:12px;font-weight:400}.radio-dot{position:absolute;top:17px;right:17px;width:15px;height:15px;border:1px solid #bdcac5;border-radius:50%}.selected .radio-dot{border:4px solid var(--teal)}.flow-preview{display:flex;gap:10px;align-items:center;justify-content:center;padding:30px 10px;background:#f6f9f8;border-radius:8px;margin-top:20px;flex-wrap:wrap}.flow-node{border:1px solid #c6dcd4;background:white;padding:10px 14px;border-radius:7px;color:#405f56;font-size:11px}.flow-arrow{color:#89a69b}.summary-number{font-size:37px;font-weight:650;line-height:1.1;color:var(--teal);letter-spacing:-1px}.summary-label{font-size:11px;color:var(--muted);margin-top:5px}.stats{display:flex;gap:30px;padding:20px 0 25px;border-bottom:1px solid var(--border);margin-bottom:20px}.note{font-size:12px;color:#607875;line-height:1.7}.note strong{color:#284c43}.device-mini{display:flex;gap:11px;align-items:center;padding:13px 0;border-bottom:1px solid #edf1f0}.device-symbol{background:#ecf4f0;color:var(--teal);border-radius:7px;width:34px;height:34px;display:grid;place-items:center;font-size:19px}.device-mini strong{display:block;font-size:12px}.device-mini small{display:block;font-size:10px;color:var(--muted)}.device-mini span:last-child{margin-left:auto;font-size:11px;color:var(--muted)}.action-bar{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:22px 0}.action-bar .group,.group{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.notice{background:#fff6e7;color:#87632b;border:1px solid #efdfba;padding:12px 16px;border-radius:7px;margin:16px 0;font-size:12px}.notice.error{background:#fff0ec;border-color:#ecc6bd;color:#a74032}.notice.info{background:#eef7f3;border-color:#d2e6dc;color:#436b5c}.device-tabs{display:flex;gap:8px;overflow-x:auto;padding:2px 0 17px;align-items:center}.device-tabs button{white-space:nowrap;border:1px solid var(--border);background:white;color:#627470;border-radius:6px;padding:8px 15px;font-size:12px}.device-tabs button.active{background:#163f39;border-color:#163f39;color:white}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:12px}th{text-align:left;color:#83918c;font-weight:500;background:#f7f9f8;font-size:10px;letter-spacing:.3px;padding:12px 10px;white-space:nowrap}td{padding:12px 10px;border-bottom:1px solid #eaf0ed}td input,td select{width:100%;padding:8px;font-size:12px}td .short{min-width:72px}.param-key{color:#8a9c93;font-size:11px;font-family:Consolas,monospace}.table-name{min-width:145px}.behavior-table{min-width:780px}.behavior-table td:nth-child(1){width:170px}.formula-input{font-family:Consolas,monospace;min-width:180px}.param-note{font-size:11px;margin-top:12px;color:var(--muted)}.live-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:17px}.device-card{border:1px solid var(--border);border-radius:11px;background:white;padding:21px;text-align:left;color:var(--ink)}.device-card:hover{border-color:#72bba3;box-shadow:0 5px 20px #254a3510}.card-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.card-title strong{font-size:17px}.card-reading{font-size:30px;letter-spacing:-.7px;font-variant-numeric:tabular-nums}.card-reading small{font-size:13px;color:var(--muted);letter-spacing:0}.card-footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #eaf0ec;padding-top:14px;margin-top:19px;font-size:11px;color:var(--muted)}.detail-toolbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:23px}.detail-toolbar .spacer{flex:1}.value-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:15px}.value-card{background:white;border:1px solid var(--border);border-radius:10px;padding:21px}.value-card label{font-size:12px;color:#687c73}.value-card .reading{font-size:30px;margin:14px 0 4px;font-variant-numeric:tabular-nums}.reading small{font-size:13px;color:#86958f}.value-card .source-label{font-size:10px;color:#82988a;margin-bottom:16px;min-height:17px}.value-controls{display:flex;gap:6px}.value-controls input{width:100%;padding:8px;min-width:0}.value-controls button{padding:8px 10px}.value-card .text-button{margin-top:13px}.quality-error{font-size:11px;color:var(--red);margin:6px 0}.map-table{font-family:Consolas,monospace;font-size:11px}.map-table th{font-family:'Segoe UI',Arial}.map-table td{white-space:nowrap}details summary{cursor:pointer;color:var(--teal);font-size:12px;padding:5px 0}details[open] summary{margin-bottom:17px}.live-meta{font-size:11px;color:#80938a;margin-bottom:19px;display:flex;gap:20px;flex-wrap:wrap}footer{display:flex;justify-content:space-between;gap:15px;color:#92a29b;font-size:10px;border-top:1px solid var(--border);margin:35px 0 20px;padding-top:19px}#toast{position:fixed;right:25px;bottom:25px;background:#163f36;color:white;box-shadow:0 5px 25px #12382b30;border-radius:9px;padding:14px 22px;font-size:13px;max-width:420px;z-index:10;display:none}#toast.show{display:block}#toast.error{background:#9d3c31}dialog{border:1px solid var(--border);border-radius:14px;padding:28px;max-width:620px;width:90%;color:var(--ink)}dialog::backdrop{background:#14392e60}.dialog-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}code{background:#edf3f0;padding:2px 5px;border-radius:3px;font-size:12px}#help-content p{font-size:13px}#connection-error[hidden]{display:none}.empty{padding:25px;color:var(--muted)}.import-input{display:none}.pill{font-size:10px;padding:4px 7px;background:#edf3f0;color:#547568;border-radius:4px}.section-description{font-size:12px;color:var(--muted);margin:0 0 18px}
@media(min-width:1500px){main{padding:0 65px}.panel{padding:30px}}
@media(max-width:1100px){:root{--sidebar:215px}main{padding:0 25px}.grid-two{grid-template-columns:1fr}.summary-panel{display:none}h1{font-size:26px}.sidebar{padding:28px 15px}}
@media(max-width:700px){.sidebar{position:static;width:100%;padding:17px 18px}.brand{font-size:12px}.brand small{font-size:9px}.logo{height:33px;width:32px;font-size:24px;line-height:30px}.nav-caption,.sidebar-bottom{display:none}nav{display:flex;margin-top:18px;gap:5px;overflow-x:auto}nav button{font-size:10px;padding:9px 10px;white-space:nowrap}nav button span{margin-right:5px}main{margin:0;padding:0 17px}header{height:75px}.breadcrumb{display:none}.top-actions{width:100%;justify-content:space-between}.page-head{margin:26px 0 20px}.page-head>.pill{display:none}h1{font-size:25px}.subtitle{font-size:12px}.panel{padding:19px}.grid-three{grid-template-columns:1fr}.mode-options{grid-template-columns:1fr}.flow-preview{padding:18px 9px}.action-bar{align-items:flex-start;flex-direction:column}.panel-heading{align-items:flex-start}.value-cards{grid-template-columns:1fr}.live-grid{grid-template-columns:1fr}.detail-toolbar .spacer{display:none}.detail-toolbar{gap:8px}.detail-toolbar button{font-size:11px;padding:8px 12px}footer span:nth-child(2){display:none}#toast{left:17px;right:17px;bottom:17px;max-width:none}}
