:root{font-family:system-ui;color:#17202a;background:#eef2f5}body{margin:0}main{max-width:900px;margin:40px auto;padding:24px;background:white;border-radius:12px;box-shadow:0 4px 24px #0002}header,section,.actions{display:flex;gap:14px;align-items:center}header{justify-content:space-between}.selectors{display:grid;gap:10px;flex:1}select,input,button{font:inherit;padding:11px;border:1px solid #aeb7c0;border-radius:6px}button{background:#1769aa;color:white;border:0;cursor:pointer}button:disabled{opacity:.45;cursor:default}#connect{align-self:stretch;width:134px}.connect-idle{background:#1976d2}.connect-verify{background:#2e7d32}.connect-waiting{background:#ed8b00}.connect-connected{background:#c62828}.actions{margin:18px 0}.actions button{width:140px}.actions strong{margin-left:auto;min-width:110px;text-align:right;font-size:38px;line-height:42px;letter-spacing:8px}.show-log{display:block;margin:8px 0}#status{padding:10px;border-radius:6px;font-weight:600}#status.info{color:#07599b;background:#e5f2ff}#status.ok{color:#176b2c;background:#e6f6e9}#status.error{color:#a11212;background:#ffe8e8}pre{box-sizing:border-box;width:100%;height:180px;overflow:auto;background:#101510;color:#d7ffd7;padding:14px;border-radius:6px}.login{max-width:360px}.login form{display:grid;gap:12px}.login #error{color:#b00020}@media(max-width:700px){main{margin:0;border-radius:0}.actions{flex-wrap:wrap}.actions button{flex:1;min-width:120px}.actions strong{width:100%}}