:root{--bg-primary:#1a1b26;--bg-secondary:#1e1f2e;--bg-tertiary:#252636;--bg-cell:#1e1f2e;--text-primary:#c0caf5;--text-secondary:#787c99;--text-muted:#565a6e;--border:#2e3050;--border-active:#7aa2f7;--accent:#7aa2f7;--accent-dim:#7aa2f726;--green:#9ece6a;--green-dim:#9ece6a26;--red:#f7768e;--red-dim:#f7768e26;--orange:#e0af68;--orange-dim:#e0af6826;--purple:#bb9af7;--col-token:#9ece6a14;--col-browser:#7aa2f714;--col-wire:#e0af6814;--col-server:#bb9af714;--mono:"JetBrains Mono", "Fira Code", ui-monospace, Consolas, monospace;--sans:"Inter", system-ui, -apple-system, sans-serif;font-family:var(--sans);color:var(--text-primary);background:var(--bg-primary);font-size:14px;line-height:1.5}*{box-sizing:border-box}body{min-height:100vh;margin:0}#root{min-height:100vh}.app{flex-direction:column;min-height:100vh;display:flex}.app-header{border-bottom:1px solid var(--border);padding:24px 32px 16px}.app-header h1{color:var(--text-primary);margin:0;font-size:22px;font-weight:600}.app-subtitle{color:var(--text-secondary);margin-top:4px;font-size:13px}.app-main{flex:1;padding:0}.flow-selector{border-bottom:1px solid var(--border);background:var(--bg-secondary);align-items:center;gap:4px;padding:12px 32px;display:flex}.flow-tab{border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;background:0 0;border-radius:6px;padding:8px 20px;font-size:13px;font-weight:500;transition:all .15s}.flow-tab:hover{color:var(--text-primary);border-color:var(--text-secondary)}.flow-tab--active{background:var(--accent-dim);color:var(--accent);border-color:var(--accent)}.flow-tab-badge{background:var(--orange-dim);width:18px;height:18px;color:var(--orange);border-radius:50%;justify-content:center;align-items:center;margin-left:6px;font-size:11px;font-weight:700;display:inline-flex}.reset-button{border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;background:0 0;border-radius:6px;margin-left:auto;padding:6px 14px;font-size:12px;transition:all .15s}.reset-button:hover{color:var(--red);border-color:var(--red)}.column-badge{text-transform:uppercase;letter-spacing:.8px;border-radius:3px;margin:8px 8px 0;padding:2px 8px;font-size:10px;font-weight:700;display:inline-block}.column-badge--token{color:var(--green);background:var(--green-dim)}.column-badge--browser{color:var(--accent);background:var(--accent-dim)}.column-badge--wire{color:var(--orange);background:var(--orange-dim)}.column-badge--server{color:var(--purple);background:#bb9af726}.steps-container{padding:0 32px}.step-row{border-bottom:1px solid var(--border);padding:16px 0;transition:opacity .2s}.step-row--pending{opacity:.35;pointer-events:none}.step-row--active{opacity:1}.step-row--completed{opacity:.8}.step-row--error{opacity:1}.step-label{margin-bottom:10px}.step-label-text{color:var(--text-primary);font-size:14px;font-weight:600}.step-description{color:var(--text-secondary);margin-left:12px;font-size:12px}.step-error{background:var(--red-dim);color:var(--red);font-size:12px;font-family:var(--mono);border-radius:4px;margin-top:4px;padding:6px 10px;display:block}.step-cells{gap:12px;display:grid}.column-cell{border-radius:6px;min-height:40px}.column-cell--empty{min-height:40px}.column-cell--token{background:var(--col-token);border:1px solid #9ece6a26}.column-cell--browser{background:var(--col-browser);border:1px solid #7aa2f726}.column-cell--wire{background:var(--col-wire);border:1px solid #e0af6826}.column-cell--server{background:var(--col-server);border:1px solid #bb9af726}.cell-label{text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary);padding:8px 12px 4px;font-size:11px;font-weight:600;display:block}.code-cell{padding:0}.code-cell .cell-label{padding:8px 12px 4px}.code-cell-editor{padding:0 4px}.code-cell-editor .cm-editor{font-size:12px;font-family:var(--mono);border-radius:4px}.code-cell-editor .cm-editor .cm-scroller{font-family:var(--mono)}.code-cell-toolbar{justify-content:flex-end;padding:6px 12px;display:flex}.run-button{border:1px solid var(--accent);background:var(--accent-dim);color:var(--accent);cursor:pointer;border-radius:4px;align-items:center;gap:6px;padding:4px 14px;font-size:12px;font-weight:600;transition:all .15s;display:flex}.run-button:hover:not(:disabled){background:var(--accent);color:var(--bg-primary)}.run-button:disabled{opacity:.5;cursor:not-allowed}.spinner{border:2px solid var(--accent);border-top-color:#0000;border-radius:50%;width:12px;height:12px;animation:.6s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.code-cell-output{padding:0 12px 8px}.cell-logs{font-family:var(--mono);background:#0003;border-radius:4px;margin-bottom:4px;padding:6px 8px;font-size:11px}.log-line{color:var(--text-secondary);white-space:pre-wrap;word-break:break-all}.log-error{color:var(--red)}.log-warn{color:var(--orange)}.cell-result{font-family:var(--mono);font-size:11px}.result-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:10px}.cell-result pre{color:var(--text-secondary);white-space:pre-wrap;word-break:break-all;background:#0003;border-radius:4px;max-height:200px;margin:2px 0 0;padding:6px 8px;overflow-y:auto}.json-viewer{padding:0}.json-viewer--empty{min-height:40px}.json-viewer--edited{border-color:var(--orange)!important}.json-viewer-header{align-items:center;gap:6px;padding:8px 12px 4px;display:flex}.direction-arrow{color:var(--orange);font-size:16px;font-weight:700}.edited-badge{text-transform:uppercase;letter-spacing:.5px;color:var(--orange);background:var(--orange-dim);border-radius:3px;margin-left:auto;padding:2px 6px;font-size:10px;font-weight:600}.json-viewer .cm-editor{border-radius:4px;margin:0 4px;font-size:11px}.json-viewer .cm-editor .cm-scroller{font-family:var(--mono)}.json-content{font-family:var(--mono);color:var(--text-secondary);white-space:pre-wrap;word-break:break-all;max-height:300px;margin:0;padding:8px 12px;font-size:11px;overflow-y:auto}.json-parse-error{color:var(--red);font-size:11px;font-family:var(--mono);padding:4px 12px}.json-edit-toolbar{gap:6px;padding:6px 12px;display:flex}.json-apply-button{border:1px solid var(--orange);background:var(--orange-dim);color:var(--orange);cursor:pointer;border-radius:4px;padding:3px 10px;font-size:11px;font-weight:600}.json-apply-button:disabled{opacity:.5;cursor:not-allowed}.json-reset-button{border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;background:0 0;border-radius:4px;padding:3px 10px;font-size:11px}.token-card{padding:0}.token-card--empty{min-height:40px}.token-card-content{padding:4px 12px 12px}.token-icon{width:32px;height:32px;margin-bottom:6px}.token-field{justify-content:space-between;align-items:baseline;padding:2px 0;font-size:12px;display:flex}.token-field-label{color:var(--text-muted);font-size:11px}.token-field-value{color:var(--text-primary);text-align:right}.token-mono{font-family:var(--mono);word-break:break-all;font-size:10px}.token-tag{background:var(--green-dim);color:var(--green);font-size:10px;font-family:var(--mono);border-radius:3px;margin-left:4px;padding:1px 6px;display:inline-block}.token-flags{margin-top:6px}.token-flag-list{gap:4px;margin-top:4px;display:flex}.token-flag{font-size:10px;font-weight:700;font-family:var(--mono);border-radius:3px;padding:2px 6px}.flag-on{background:var(--green-dim);color:var(--green)}.flag-off{color:var(--text-muted);background:#565a6e33}.credential-store{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;margin:24px 32px;padding:16px}.credential-store-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.credential-store-header h3{color:var(--purple);margin:0;font-size:14px;font-weight:600}.clear-button{border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;background:0 0;border-radius:4px;padding:4px 10px;font-size:11px}.clear-button:hover{color:var(--red);border-color:var(--red)}.credential-store-empty{color:var(--text-muted);padding:12px 0;font-size:12px}.credential-list{flex-direction:column;gap:8px;display:flex}.credential-item{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:6px;padding:10px 12px}.credential-field{justify-content:space-between;align-items:baseline;padding:1px 0;font-size:12px;display:flex}.credential-field-label{color:var(--text-muted);font-size:11px}.credential-field-value{color:var(--text-primary)}.credential-mono{font-family:var(--mono);font-size:10px}