:root{--canvas:#f3f5f9;--surface:#fff;--ink:#172238;--muted:#606d80;--subtle:#8690a1;--line:#e3e7ef;--accent:#2855db;--accent-hover:#1d44bb;--accent-soft:#edf2ff;--success:#16724d;--error:#bd343c;--terminal:#131e30;--terminal-text:#d3deee;--radius:14px;--font:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--canvas);color:var(--ink);font-family:var(--font);font-size:14px;line-height:1.6}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:not-allowed}button,button svg,a,input{transition:background-color .18s,color .18s,border-color .18s}a{color:inherit;text-decoration:none}button svg,svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}button:focus-visible,a:focus-visible,input:focus-visible,.log-output:focus-visible{outline:3px solid #91b2ff;outline-offset:3px}input{caret-color:var(--accent)}::selection{background:#cbd8ff;color:#162b65}[hidden]{display:none!important}h1,h2,h3,p,dl,dd{margin:0}h1{font-size:27px;line-height:1.4;letter-spacing:-.025em;font-weight:650}h2{font-size:15px;font-weight:650}h3{font-size:13px;font-weight:650}.muted{color:var(--muted)}
.topbar{height:72px;padding:0 40px;background:var(--surface);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;gap:12px;font-size:16px;font-weight:650}.brand-mark{display:flex;align-items:center;justify-content:center;width:43px;height:38px;background:var(--accent);color:#fff;border-radius:10px;font-size:20px;font-weight:750;letter-spacing:-.04em}.top-actions{display:flex;align-items:center;gap:24px}.connection{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}.connection i,.live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--success)}.connection.offline i{background:#b7741c}.text-button{border:0;background:transparent;padding:7px 0;color:var(--muted);font-size:12px}.text-button:hover{color:var(--ink)}
.workspace{max-width:1540px;margin:0 auto;padding:34px 40px 20px}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:26px}.page-heading p{margin-top:7px;font-size:13px}.run-status{display:flex;align-items:center;gap:8px;background:#e7ebf2;color:#536176;border-radius:7px;font-size:12px;font-weight:550;padding:7px 12px;white-space:nowrap}.status-dot{width:6px;height:6px;border-radius:50%;background:currentColor}.run-status[data-phase="running"],.run-status[data-phase="logging_in"],.run-status[data-phase="starting"]{background:var(--accent-soft);color:var(--accent)}.run-status[data-phase="completed"]{background:#e4f3eb;color:var(--success)}.run-status[data-phase="failed"],.run-status[data-phase="interrupted"]{background:#ffebed;color:var(--error)}.run-status[data-phase="stopping"]{background:#fff2da;color:#94610b}.work-grid{display:grid;grid-template-columns:300px minmax(0,1fr);gap:24px;align-items:start}.configuration{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.config-body{padding:24px}.section-heading{display:flex;gap:9px;align-items:center}.section-heading svg{color:var(--muted);width:17px}.config-intro{font-size:12px;color:var(--muted);margin:9px 0 24px;line-height:1.8}label:not(.check-row){display:block;font-size:12px;font-weight:550;margin-bottom:8px}input:not([type="checkbox"]){width:100%;height:43px;border:1px solid #d5dce7;border-radius:7px;background:var(--surface);color:var(--ink);padding:0 12px;font-size:13px;min-width:0}input::placeholder{color:#727e90}input:hover:not(:disabled){border-color:#a4b0c5}input:disabled{background:#f5f7fa;color:var(--muted)}#username{margin-bottom:21px}.password-field{position:relative}.password-field input{padding-right:42px}.password-field button{position:absolute;right:0;top:0;height:43px;width:42px;border:0;background:transparent;color:var(--muted);display:grid;place-items:center}.password-field button:hover{color:var(--accent)}.field-note{font-size:11px;color:var(--muted);margin:9px 0 23px;line-height:1.8}.check-row{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:12px}.check-row input{accent-color:var(--accent);width:14px;height:14px;margin:0;flex-shrink:0}.resume-note{font-size:11px;color:var(--muted);margin:5px 0 24px 22px}.full{width:100%}.primary-button,.stop-button{height:43px;border-radius:7px;display:flex;align-items:center;justify-content:center;gap:9px;font-weight:550;font-size:13px}.primary-button{background:var(--accent);color:#fff;border:1px solid var(--accent)}.primary-button:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.primary-button:active:not(:disabled){background:#18399d}.primary-button:disabled{background:#ced8f4;border-color:#ced8f4;color:#5c6f9e}.primary-button svg{width:16px;fill:currentColor;stroke-width:1.2}.stop-button{background:#fff;border:1px solid #d7dde8;color:var(--error);margin-top:10px}.stop-button svg{width:14px;fill:currentColor;stroke:currentColor}.stop-button:hover:not(:disabled){background:#fff1f2;border-color:#e5b0b5}.stop-button:disabled{background:#f7f8fb;border-color:#e4e8ef;color:#8a94a5}.execution-info{padding:22px 24px 24px;border-top:1px solid var(--line);background:#fafbfd}.execution-info dl{margin:13px 0 16px}.execution-info dl div{display:flex;justify-content:space-between;margin-top:9px;font-size:11px}.execution-info dt{color:var(--muted)}.execution-info dd{color:#3b4961}.execution-info p{font-size:11px;color:var(--muted);line-height:1.9}.form-error{background:#fff0f1;color:#a22430;border-radius:6px;padding:10px 12px;font-size:12px;margin:12px 0}
.monitor{min-width:0}.pipeline{display:flex;align-items:center;gap:20px;padding:22px 25px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}.pipeline-step{display:flex;align-items:center;gap:10px;flex-shrink:0}.step-symbol{width:30px;height:30px;display:grid;place-items:center;border:1px solid #e1e6ee;color:#6c798d;background:#f7f9fc;border-radius:50%;font-size:12px;font-variant-numeric:tabular-nums}.pipeline-step strong{display:block;font-size:12px;font-weight:550;color:#566378}.pipeline-step div>span{display:block;font-size:10px;color:var(--muted);margin-top:2px}.step-connector{height:1px;background:var(--line);flex:1;min-width:14px}.pipeline-step.current .step-symbol{background:var(--accent);border-color:var(--accent);color:#fff}.pipeline-step.current strong{color:var(--accent)}.pipeline-step.done .step-symbol{background:#e8f5ee;border-color:#d1eadd;color:var(--success)}.pipeline-step.done strong{color:var(--ink)}.run-summary{margin:24px 0;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:19px 24px 0;overflow:hidden}.summary-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.summary-heading h2{font-size:13px}.summary-heading>span{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}.statistics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:19px 0 23px}.statistics>div+div{border-left:1px solid var(--line);padding-left:22px}.statistics dt{font-size:11px;color:var(--muted);white-space:nowrap}.statistics dd{font-size:25px;line-height:1.5;font-weight:600;font-variant-numeric:tabular-nums;margin-top:5px;letter-spacing:-.02em}#activated{color:var(--success)}#failed.has-errors{color:var(--error)}.statistics .page-total{font-size:13px;color:var(--muted);font-weight:400;letter-spacing:0}.progress-track{height:3px;margin:0 -24px;background:#e9edf5}.progress-track span{display:block;height:100%;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .4s ease-out}
.log-panel{border-radius:var(--radius);overflow:hidden;background:var(--terminal);color:var(--terminal-text)}.log-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;border-bottom:1px solid #2b364a;flex-wrap:wrap}.log-title,.log-actions{display:flex;align-items:center;gap:12px}.log-title h2{font-size:13px;color:#edf2fa;font-weight:550}.terminal-symbol{font-family:Consolas,monospace;font-size:15px;color:#9eb4d8}.log-title>span:last-child{font-size:10px;color:#9dacc1;background:#263247;border-radius:4px;padding:1px 6px}.log-button{display:flex;align-items:center;gap:6px;color:#bac8dd;background:transparent;border:0;font-size:11px;padding:5px 0;white-space:nowrap}.log-button svg{width:13px;height:13px}.log-button:hover{color:#fff}.log-button[aria-disabled="true"]{opacity:.5;pointer-events:none}.log-output{height:365px;overflow:auto;padding:14px 20px;scrollbar-color:#47546b var(--terminal);scrollbar-width:thin;font-family:Consolas,"Cascadia Code","Microsoft YaHei",monospace;font-size:11px;line-height:1.9;overflow-wrap:anywhere;position:relative}.log-line{display:grid;grid-template-columns:61px minmax(0,1fr);gap:12px;white-space:pre-wrap;align-items:start;padding:1px 0}.log-time{color:#8294af;font-variant-numeric:tabular-nums;user-select:none}.log-line.error .log-message{color:#ffa0a8}.log-line.success .log-message{color:#8cddba}.log-line.info .log-message{color:#abc7ff}.empty-logs{height:100%;min-height:240px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;color:#9cacc4;font-family:var(--font)}.empty-logs svg{width:45px;height:45px;color:#71839f;margin-bottom:3px;stroke-width:1.2}.empty-logs strong{color:#d7e2f2;font-size:13px;font-weight:500}.empty-logs>span{font-size:11px;line-height:1.9}.log-footer{border-top:1px solid #2b364a;padding:10px 20px;display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#acbad0}.log-footer .check-row{font-size:10px}.log-footer .check-row input{width:12px;height:12px;accent-color:#94b3ff}#logStatus{display:flex;align-items:center;gap:7px}.live-dot{background:#79cba6;width:5px;height:5px}.monitor-footnote{font-size:11px;line-height:1.8;color:var(--muted);margin-top:13px}.page-footer{margin-top:30px;padding-top:17px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;font-size:10px;color:var(--muted)}
.login-page{min-height:calc(100dvh - 72px);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:50px 24px;gap:30px}.login-panel{width:390px;max-width:100%;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:34px}.gate-icon{width:46px;height:46px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;border-radius:12px;margin-bottom:24px}.gate-icon svg{width:24px;height:24px}.login-panel h1{font-size:23px}.login-panel>.muted{font-size:13px;margin-top:7px}.login-panel form{margin-top:29px}.login-panel .primary-button{margin-top:20px;justify-content:space-between;padding:0 15px}.login-panel .primary-button svg{fill:none;stroke-width:1.7}.gate-footnote{font-size:11px;color:var(--muted);line-height:1.8;margin-top:22px}.login-bottom{font-size:11px;color:var(--muted);text-align:center}.toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);background:#24334c;color:#fff;border-radius:9px;box-shadow:0 7px 25px #14223820;padding:12px 22px;max-width:calc(100% - 32px);font-size:12px;z-index:5}
@media(min-width:1600px){.log-output{height:430px}.work-grid{grid-template-columns:320px minmax(0,1fr)}}
@media(max-width:1120px){.topbar{padding:0 26px}.workspace{padding:28px 26px 20px}.work-grid{grid-template-columns:280px minmax(0,1fr);gap:18px}.config-body,.execution-info{padding:21px}.pipeline{gap:9px;padding:21px 16px}.pipeline-step{gap:7px}.step-symbol{width:25px;height:25px}.pipeline-step div>span{font-size:9px}.step-connector{min-width:6px}.statistics>div+div{padding-left:12px}.statistics dt{font-size:10px}.run-summary{padding-left:18px;padding-right:18px}.progress-track{margin:0 -18px}.log-output{height:375px}}
@media(max-width:900px){.pipeline{gap:8px}.pipeline-step div>span{display:none}.pipeline-step{gap:6px}.pipeline-step strong{font-size:11px}.statistics{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 0}.statistics>div:nth-child(4){border-left:0;padding-left:0}.statistics>div+div{padding-left:16px}.work-grid{grid-template-columns:255px minmax(0,1fr)}.config-body,.execution-info{padding:20px}.log-actions{gap:12px}.log-heading{padding:14px 16px}.log-title{gap:8px}.log-output{padding:12px 14px}.log-line{gap:7px}}
@media(max-width:700px){.topbar{height:64px;padding:0 20px}.brand{font-size:14px;gap:9px}.brand-mark{height:33px;width:38px;font-size:18px;border-radius:8px}.top-actions{gap:15px}.connection{font-size:10px}.connection span{max-width:88px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.workspace{padding:24px 18px 20px}.page-heading{margin-bottom:21px;align-items:flex-start;gap:12px}h1{font-size:24px}.page-heading p{font-size:11px;margin-top:5px}.run-status{font-size:10px;padding:6px 8px;margin-top:5px}.work-grid{grid-template-columns:1fr;gap:20px}.config-body{padding:22px}.config-intro{margin-bottom:20px}.execution-info{padding:18px 22px}.execution-info dl{display:flex;flex-wrap:wrap;gap:5px 22px;margin:9px 0 13px}.execution-info dl div{gap:8px}.execution-info p{max-width:65ch}.pipeline{padding:20px 16px;gap:9px}.pipeline-step{gap:7px}.pipeline-step strong{font-size:11px}.pipeline-step div>span{display:block;font-size:9px}.step-symbol{height:25px;width:25px}.run-summary{margin:20px 0;padding:18px 19px 0}.statistics{grid-template-columns:repeat(3,minmax(0,1fr));padding-top:16px;gap:17px 0}.statistics>div+div{padding-left:16px}.statistics>div:nth-child(4){padding-left:0}.statistics dd{font-size:24px}.progress-track{margin:0 -19px}.log-output{height:400px;font-size:10px}.log-heading{padding:14px}.log-title{gap:7px}.log-actions{gap:12px}.log-button{font-size:10px}.log-footer{padding:10px 14px}.page-footer{margin-top:24px;font-size:9px}.login-page{min-height:calc(100dvh - 64px)}.login-panel{padding:28px}.login-bottom{font-size:10px}}
@media(max-width:370px){.topbar{padding:0 14px}.connection{display:none}.workspace{padding:22px 12px 18px}.pipeline{gap:7px;padding:18px 12px}.pipeline-step div>span{display:none}.log-actions{gap:10px}.log-title>span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}
