@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,sans-serif;background:#0a0a0a;color:#e0e0e0;min-height:100vh}:root{--green: #25D366;--green-dark: #1da851;--bg-dark: #0a0a0a;--bg-card: #141414;--bg-sidebar: #111111;--border: #2a2a2a;--text: #e0e0e0;--text-muted: #888;--red: #e74c3c;--orange: #f39c12;--blue: #3498db}a{color:var(--green);text-decoration:none}button{cursor:pointer;font-family:inherit;border:none;border-radius:6px;font-size:14px;padding:8px 16px;transition:all .2s}.btn-primary{background:var(--green);color:#000;font-weight:600}.btn-primary:hover{background:var(--green-dark)}.btn-secondary{background:var(--bg-card);color:var(--text);border:1px solid var(--border)}.btn-secondary:hover{background:#1e1e1e}.btn-danger{background:var(--red);color:#fff;font-weight:500}.btn-danger:hover{opacity:.85}input,textarea,select{background:#1a1a1a;border:1px solid var(--border);color:var(--text);border-radius:6px;padding:10px 12px;font-family:inherit;font-size:14px;width:100%}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--green)}.layout{display:flex;min-height:100vh}.sidebar{width:220px;background:var(--bg-sidebar);border-right:1px solid var(--border);padding:20px 0;display:flex;flex-direction:column}.sidebar-logo{padding:0 20px 20px;font-size:22px;font-weight:700;color:var(--green);display:flex;align-items:center;gap:8px}.sidebar-meta{padding:0 20px 16px;font-size:12px;color:var(--text-muted)}.sidebar-nav{flex:1}.sidebar-nav a{display:flex;align-items:center;gap:10px;padding:10px 20px;color:var(--text-muted);font-size:14px;transition:all .2s}.sidebar-nav a:hover{background:#1a1a1a;color:var(--text)}.sidebar-nav a.active{background:var(--green);color:#000;font-weight:600}.main{flex:1;padding:32px;overflow-y:auto}.page-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:24px}.page-title{font-size:24px;font-weight:700}.page-subtitle{font-size:13px;color:var(--text-muted);margin-top:4px}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:20px;margin-bottom:12px}.empty-state{text-align:center;padding:80px 20px;color:var(--text-muted)}.empty-state svg{width:48px;height:48px;margin-bottom:16px;opacity:.3}.empty-state p{font-size:15px}.empty-state .hint{font-size:13px;margin-top:6px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:100}.modal{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:24px;min-width:400px;max-width:550px;width:90%}.modal h2{font-size:18px;margin-bottom:20px}.form-group{margin-bottom:16px}.form-group label{display:block;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);margin-bottom:6px}.form-group .hint{font-size:12px;color:var(--text-muted);margin-top:4px}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.status-badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:12px;font-weight:600}.status-open{background:#25d36626;color:var(--green)}.status-connecting,.status-qr{background:#f39c1226;color:var(--orange)}.status-disconnected{background:#88888826;color:var(--text-muted)}.status-running{background:#3498db26;color:var(--blue)}.status-completed{background:#25d36626;color:var(--green)}.status-pending{background:#f39c1226;color:var(--orange)}.status-error,.status-stopped{background:#e74c3c26;color:var(--red)}.conn-card{display:flex;justify-content:space-between;align-items:center}.conn-info h3{font-size:16px;font-weight:600}.conn-info .conn-id{font-size:11px;color:var(--text-muted);margin-top:2px;font-family:monospace}.conn-actions{display:flex;gap:8px;align-items:center}.qr-container{text-align:center;padding:20px}.qr-container img{border-radius:12px;background:#fff;padding:12px}.qr-container p{margin-top:12px;font-size:13px;color:var(--text-muted)}.progress-bar-bg{width:100%;height:6px;background:#2a2a2a;border-radius:3px;margin-top:10px}.progress-bar-fill{height:100%;background:var(--green);border-radius:3px;transition:width .3s}
