:root{--bg: #0d1117;--bg-panel: #161b22;--bg-header: #1c2128;--bg-input: #0d1117;--border: #30363d;--text: #c9d1d9;--text-muted: #8b949e;--text-dim: #484f58;--accent: #388bfd;--accent-light: #58a6ff;--green: #3fb950;--green-bg: rgba(63, 185, 80, .12);--red: #f85149;--red-bg: rgba(248, 81, 73, .12);--yellow: #d29922;--yellow-bg: rgba(210, 153, 34, .12);--blue-bg: rgba(56, 139, 253, .1);--radius: 6px;--radius-lg: 10px}[data-theme=light]{--bg: #f6f8fa;--bg-panel: #ffffff;--bg-header: #eaeef2;--bg-input: #f6f8fa;--border: #d0d7de;--text: #1f2328;--text-muted: #636c76;--text-dim: #9198a1;--accent: #0969da;--accent-light: #218bff;--green: #1a7f37;--green-bg: rgba(26, 127, 55, .1);--red: #cf222e;--red-bg: rgba(207, 34, 46, .1);--yellow: #9a6700;--yellow-bg: rgba(154, 103, 0, .1);--blue-bg: rgba(9, 105, 218, .1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:JetBrains Mono,Fira Code,Cascadia Code,Consolas,monospace;font-size:13px;background:var(--bg);color:var(--text);height:100dvh;display:flex;flex-direction:column;overflow:hidden}#app{display:flex;flex-direction:column;height:100%;overflow:hidden}*{scrollbar-width:thin;scrollbar-color:var(--border) transparent}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.conn-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;background:var(--bg-panel);border-bottom:1px solid var(--border);flex-shrink:0;gap:16px;flex-wrap:wrap}.conn-bar__left{display:flex;align-items:center;gap:20px}.logo-img{height:32px;width:auto;filter:drop-shadow(0 0 4px rgba(220,30,30,.4))}.logo{font-size:1.05rem;font-weight:700;letter-spacing:.04em;color:var(--text)}.logo-accent{color:var(--accent-light)}.app-version{font-size:.65rem;color:var(--text-dim);letter-spacing:.04em;align-self:flex-end;padding-bottom:1px}.status{display:flex;align-items:center;gap:6px;color:var(--text-muted);font-size:.8rem}.status__dot{width:8px;height:8px;border-radius:50%;background:var(--text-dim);flex-shrink:0;transition:background .3s,box-shadow .3s}.status__dot--on{background:var(--green);box-shadow:0 0 6px var(--green);animation:blink 2.5s infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.55}}.conn-bar__controls{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}.ctrl-label{display:flex;flex-direction:column;gap:3px;font-size:.68rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em}.ctrl-label select,.ctrl-label input[type=number]{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-family:inherit;font-size:.82rem;padding:5px 8px;outline:none;transition:border-color .2s}.ctrl-label input[type=number]{width:82px}.ctrl-label select:focus,.ctrl-label input:focus{border-color:var(--accent)}.vdivider{width:1px;height:28px;background:var(--border);align-self:flex-end;margin-bottom:1px}.btn{border:none;border-radius:var(--radius);padding:6px 14px;font-family:inherit;font-size:.82rem;font-weight:600;cursor:pointer;transition:background .15s,opacity .15s,transform .1s;white-space:nowrap;line-height:1.4}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.35;cursor:not-allowed}.btn--primary{background:var(--accent);color:#fff}.btn--primary:hover:not(:disabled){background:var(--accent-light)}.btn--danger{background:var(--red);color:#fff}.btn--danger:hover:not(:disabled){background:#ff6b63}.btn--success{background:var(--green);color:#0d1117}.btn--success:hover:not(:disabled){background:#56d364}.btn--warning{background:var(--yellow);color:#0d1117}.btn--warning:hover:not(:disabled){background:#e3b341}.btn--outline{background:transparent;border:1px solid var(--border);color:var(--text)}.btn--outline:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.btn--sm{padding:4px 10px;font-size:.75rem}.flex-gap{display:flex;gap:6px}.theme-btn{background:transparent;border:1px solid var(--border);border-radius:var(--radius);color:var(--text-muted);font-size:1rem;width:32px;height:32px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .2s,color .2s,background .2s;flex-shrink:0;line-height:1}.theme-btn:hover{border-color:var(--accent);color:var(--accent)}.scan-bar{width:100%;display:flex;align-items:center;gap:8px;padding:6px 0 2px;flex-wrap:wrap;border-top:1px solid var(--border);margin-top:6px}.scan-bar__status{font-size:.72rem;color:var(--text-muted);white-space:nowrap;flex-shrink:0}.scan-bar__results{display:flex;gap:6px;flex-wrap:wrap}.scan-badge{font-size:.72rem;font-weight:700;padding:2px 10px;border-radius:10px;border:1px solid var(--accent);background:var(--blue-bg);color:var(--accent-light);cursor:pointer;transition:background .15s,color .15s;white-space:nowrap}.scan-badge:hover{background:var(--accent);color:#fff}.app-main{display:grid;grid-template-columns:300px 1fr;gap:10px;padding:10px;flex:1;min-height:0;overflow:hidden}.col{display:flex;flex-direction:column;gap:10px;min-height:0;overflow:hidden}.panel{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-lg);display:flex;flex-direction:column;overflow:hidden}.panel__header{display:flex;align-items:center;justify-content:space-between;padding:9px 14px;background:var(--bg-header);border-bottom:1px solid var(--border);flex-shrink:0}.panel__title{display:flex;align-items:center;gap:6px;font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted)}.panel__icon{font-size:.95rem}.panel__badge{font-size:.66rem;font-weight:600;padding:1px 7px;border-radius:10px;background:var(--blue-bg);border:1px solid var(--accent);color:var(--accent)}.panel__placeholder{flex:1;display:flex;align-items:center;justify-content:center;color:var(--text-dim);font-size:.82rem;padding:20px;text-align:center}.relay-panel{flex:1}.relay-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px;flex:1}.relay-card{background:var(--bg);border:2px solid var(--border);border-radius:var(--radius-lg);padding:14px 10px 10px;display:flex;flex-direction:column;align-items:center;gap:6px;transition:border-color .25s,background .25s}.relay-card--on{border-color:var(--green);background:var(--green-bg)}.relay-card__led{width:18px;height:18px;border-radius:50%;background:var(--text-dim);transition:background .25s,box-shadow .25s}.relay-card--on .relay-card__led{background:var(--green);box-shadow:0 0 10px var(--green)}.relay-card__name{font-size:.68rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;text-align:center}.relay-card__state{font-size:1.05rem;font-weight:700;color:var(--text-dim);letter-spacing:.04em}.relay-card--on .relay-card__state{color:var(--green)}.relay-btn{width:100%;margin-top:2px;background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-family:inherit;font-size:.72rem;font-weight:600;padding:5px;cursor:pointer;transition:border-color .15s,color .15s}.relay-btn:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.relay-btn:disabled{opacity:.35;cursor:not-allowed}.di-panel{flex-shrink:0}.di-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:10px}.di-item{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:8px 6px;display:flex;flex-direction:column;align-items:center;gap:4px;transition:border-color .2s,background .2s}.di-item--active{border-color:var(--accent);background:var(--blue-bg)}.di-item__led{width:10px;height:10px;border-radius:50%;background:var(--text-dim);transition:background .2s,box-shadow .2s}.di-item--active .di-item__led{background:var(--accent);box-shadow:0 0 7px var(--accent)}.di-item__name{font-size:.62rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em}.di-item__val{font-size:.85rem;font-weight:700;color:var(--text-dim)}.di-item--active .di-item__val{color:var(--accent-light)}.analog-panel{flex:1;min-height:0}.analog-list{flex:1;overflow-y:auto;display:flex;flex-direction:column}.analog-row{display:grid;grid-template-columns:130px 1fr 110px;align-items:center;gap:10px;padding:9px 14px;border-bottom:1px solid var(--border)}.analog-row:last-child{border-bottom:none}.analog-row__meta{display:flex;align-items:baseline;gap:5px;min-width:0}.analog-row__name{font-size:.7rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.analog-row__val{font-size:.95rem;font-weight:700;color:var(--text)}.analog-row__unit{font-size:.62rem;color:var(--text-dim)}.analog-row__bar-wrap{height:7px;background:var(--bg);border:1px solid var(--border);border-radius:4px;overflow:hidden}.analog-row__bar-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-light));border-radius:4px;transition:width .3s ease}.analog-row__chart-wrap{height:48px}#app>.log-panel{flex-shrink:0;height:170px;margin:0 10px 10px}.log-controls{display:flex;align-items:center;gap:12px}.toggle-lbl{display:flex;align-items:center;gap:4px;font-size:.75rem;color:var(--text-muted);cursor:pointer;-webkit-user-select:none;user-select:none}.toggle-lbl input[type=checkbox]{accent-color:var(--accent);cursor:pointer}.log-list{flex:1;overflow-y:auto;padding:6px 12px;font-size:.72rem;line-height:1.5}.log-row{white-space:nowrap}.log-row--tx{color:#79c0ff}.log-row--rx{color:#56d364}.log-row--info{color:var(--text-muted)}.log-row--error{color:var(--red)}
