*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{display:grid;grid-template-rows:auto 1fr auto;grid-template-columns:1fr 320px;grid-template-areas:"header header" "main   sidebar" "footer footer";font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#e8e8ea;background:#1c1c1f;user-select:none}header{grid-area:header;background:#232327;border-bottom:1px solid #2f2f33;padding:.75rem 1.25rem;display:flex;align-items:center;justify-content:space-between}header h1{font-size:1rem;font-weight:600;letter-spacing:.01em}header .health{font-size:.75rem;color:#9aa0a6;font-family:ui-monospace,SF Mono,Menlo,monospace}header .health.ok{color:#82d181}header .health.error{color:#ef6b6b}main{grid-area:main;background:#000;position:relative;min-height:0;min-width:0}main canvas{width:100%;height:100%;display:block;cursor:crosshair}main canvas:focus{outline:0}aside{grid-area:sidebar;background:#1f1f23;border-left:1px solid #2f2f33;display:flex;flex-direction:column;min-height:0}.tabs{display:flex;border-bottom:1px solid #2f2f33}.tab-btn{flex:1;background:transparent;border:0;color:#9aa0a6;padding:.65rem .5rem;font-size:.8rem;cursor:pointer;border-bottom:2px solid transparent}.tab-btn:hover{color:#e8e8ea}.tab-btn.active{color:#e8e8ea;border-bottom-color:#6c8cff}.tab-panel{flex:1;overflow-y:auto;padding:.85rem;display:none}.tab-panel.active{display:block}.section{margin-bottom:1rem}.section h2{font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:#9aa0a6;margin-bottom:.4rem}.section p{font-size:.8rem;color:#9aa0a6;margin-bottom:.5rem;line-height:1.4}.card{background:#26262b;border:1px solid #2f2f33;border-radius:6px;padding:.75rem;margin-bottom:.65rem}.card h3{font-size:.85rem;font-weight:600;margin-bottom:.25rem}.card .desc{font-size:.75rem;color:#9aa0a6;margin-bottom:.5rem}button,select,input[type=text],input[type=number]{font-family:inherit;font-size:.85rem;background:#2c2c31;color:#e8e8ea;border:1px solid #3a3a3f;border-radius:4px;padding:.4rem .6rem}button{cursor:pointer}button:hover:not(:disabled){background:#34343a}button:disabled{opacity:.5;cursor:not-allowed}button.primary{background:#4a6dff;border-color:#5b7bff;color:#fff;font-weight:500}button.primary:hover:not(:disabled){background:#5b7bff}.row{display:flex;gap:.5rem;align-items:center}.row>*{min-width:0}.row>.grow{flex:1}label.field{display:block;font-size:.75rem;color:#9aa0a6;margin-bottom:.2rem}.pipeline-item{background:#1c1c1f;border:1px solid #2f2f33;border-radius:4px;padding:.5rem;margin-bottom:.4rem;cursor:grab}.pipeline-item.dragging{opacity:.4;cursor:grabbing}.pipeline-item.drag-over{border-color:#6c8cff;border-style:dashed}.pipeline-item .head{display:flex;justify-content:space-between;align-items:center}.pipeline-item .badge{font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:.75rem;background:#2c2c31;border:1px solid #3a3a3f;border-radius:3px;padding:.1rem .4rem}.pipeline-item .desc{font-size:.7rem;color:#9aa0a6;margin:.25rem 0 .4rem}.pipeline-item .arg-row{display:grid;grid-template-columns:80px 1fr;gap:.4rem;align-items:center;margin-top:.25rem}.pipeline-item .arg-row label{font-size:.72rem;color:#9aa0a6}.pipeline-item .arg-row input{width:100%;font-size:.8rem;padding:.25rem .4rem}.pipeline-item .remove{background:transparent;border:0;color:#9aa0a6;font-size:.95rem;padding:.1rem .4rem;cursor:pointer}.pipeline-item .remove:hover{color:#ef6b6b}code,pre{font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:.75rem}pre.command{background:#1c1c1f;border:1px solid #2f2f33;border-radius:4px;padding:.55rem .65rem;word-break:break-all;white-space:pre-wrap;color:#c8d3e1;cursor:copy;position:relative;transition:border-color .15s,background .15s}pre.command:hover{border-color:#4a6dff}pre.command:hover:after{content:"click to copy";position:absolute;top:4px;right:6px;font-size:.6rem;color:#6c8cff;text-transform:uppercase;letter-spacing:.05em}pre.command.copied{border-color:#82d181;background:#1c2a20}pre.command.copied:after{content:"copied";position:absolute;top:4px;right:6px;font-size:.6rem;color:#82d181;text-transform:uppercase;letter-spacing:.05em}.history-item{background:#1c1c1f;border:1px solid #2f2f33;border-radius:5px;padding:.55rem .65rem;margin-bottom:.45rem;font-size:.78rem}.history-item .top{display:flex;justify-content:space-between;margin-bottom:.2rem}.history-item .meta{color:#9aa0a6;font-size:.7rem}.history-item .status-completed{color:#82d181}.history-item .status-failed{color:#ef6b6b}.history-item .status-running{color:#f0c674}footer{grid-area:footer;background:#232327;border-top:1px solid #2f2f33;padding:.45rem 1rem;font-size:.78rem;color:#9aa0a6;font-family:ui-monospace,SF Mono,Menlo,monospace;min-height:1.7rem;display:flex;align-items:center;gap:.65rem}footer #status{flex:1;border-radius:3px;padding:.05rem .3rem;margin:-.05rem -.3rem;transition:background .15s,color .15s}footer #status.copyable{cursor:copy}footer #status.copyable:hover{background:#2c2c31;color:#e8e8ea}footer #status.copied{background:#1c2a20;color:#82d181}footer .spinner{width:12px;height:12px;border:2px solid rgba(255,255,255,.15);border-top-color:#6c8cff;border-radius:50%;animation:spin .85s linear infinite;display:inline-block}footer .spinner.hidden{display:none}@keyframes spin{to{transform:rotate(360deg)}}[hidden],.hidden,input[type=file]{display:none}.file-label{display:inline-block;background:#2c2c31;border:1px solid #3a3a3f;border-radius:4px;padding:.4rem .6rem;font-size:.85rem;cursor:pointer}.file-label:hover{background:#34343a}