:root{--bg: #f7f8fa;--surface: #ffffff;--text: #1b1f24;--muted: #6b7280;--primary: #25d366;--border: #e5e7eb}[data-theme=dark]{--bg: #0f1419;--surface: #1a2027;--text: #e7edf3;--muted: #9aa4af;--primary: #25d366;--border: #2a323c}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%}body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}html[dir=rtl] body{font-family:Cairo,system-ui,sans-serif}.page h1{margin:0 0 8px}.muted{color:var(--muted)}.btn{padding:9px 16px;border:1px solid var(--primary);border-radius:8px;background:var(--primary);color:#00310f;font-weight:600;cursor:pointer}.btn:hover{filter:brightness(.95)}.btn.secondary{background:var(--surface);color:var(--text);border-color:var(--border)}.btn.danger{background:#e5484d;border-color:#e5484d;color:#fff}.btn:disabled{opacity:.6;cursor:not-allowed}input,select,textarea{padding:9px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);font:inherit}.card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.col{display:flex;flex-direction:column;gap:10px}.grid{display:grid;gap:16px}table.data{width:100%;border-collapse:collapse;font-size:.9rem}table.data th,table.data td{text-align:start;padding:8px 10px;border-bottom:1px solid var(--border)}table.data th{color:var(--muted);font-weight:600}.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:.75rem;border:1px solid var(--border);background:var(--bg)}.badge.ready,.badge.success{color:#30a46c;border-color:#30a46c}.badge.disconnected,.badge.failed{color:#e5484d;border-color:#e5484d}.badge.qrready,.badge.initializing{color:#f5a623;border-color:#f5a623}.toolbar{display:flex;gap:8px;align-items:center;margin-bottom:16px;flex-wrap:wrap}.spacer{flex:1}.modal-backdrop{position:fixed;inset:0;background:#00000080;display:grid;place-items:center;z-index:900}.modal{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:24px;width:min(420px,90vw);text-align:center}.engine-error{text-align:start;border:1px solid #e5484d;border-radius:8px;padding:12px 14px;background:color-mix(in srgb,#e5484d 12%,transparent)}.engine-error strong{color:#e5484d}.engine-error p{margin:6px 0 0;font-size:.88rem;color:var(--text)}
