:root{color-scheme:light;--ink:#182534;--muted:#586779;--line:#dce3eb;--surface:#fff;--ground:#f4f6f8;--blue:#165dad;--blue-dark:#104780;--blue-light:#eaf2fc;--danger:#a82c2c;--warning:#87500a;--success:#246047;--radius:12px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;color:var(--ink);background:var(--ground);font-family:system-ui,-apple-system,"Segoe UI","Microsoft YaHei",sans-serif;font-size:16px;line-height:1.5}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:not-allowed}a{color:var(--blue);text-underline-offset:4px}::selection{background:#cfe2fa;color:#102d50}:focus-visible{outline:3px solid #81ade0;outline-offset:3px}[hidden]{display:none!important}
.topbar,main,footer{width:min(1104px,calc(100% - 48px));margin-inline:auto}.topbar{display:flex;justify-content:space-between;align-items:center;min-height:88px;gap:16px}.brand{display:flex;align-items:center;gap:12px}.brand svg{color:var(--blue)}h1{font-size:23px;letter-spacing:-.02em;line-height:1.2;margin:0;font-weight:650}h2{font-size:19px;line-height:1.4;margin:0;font-weight:650}p{margin:0}nav{display:flex;align-items:center;gap:20px}nav a{font-size:14px;text-decoration:none}.button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 17px;border:1px solid transparent;border-radius:8px;font-weight:600;font-size:14px;line-height:1.4;transition:background-color .16s,color .16s,border-color .16s}.primary{background:var(--blue);color:white}.primary:hover:not(:disabled){background:var(--blue-dark)}.primary:active:not(:disabled){background:#0c3b6b}.primary:disabled{background:#d5dfe9;color:#5d6e81}.secondary{color:var(--blue);background:var(--blue-light)}.secondary:hover:not(:disabled){background:#dbe9fa}.secondary:disabled{color:#708094;background:#edf1f6}.plain{color:var(--blue);background:transparent;padding-inline:8px}.plain:hover:not(:disabled){background:var(--blue-light)}.plain:disabled{color:#7c8897}.danger{background:#fff1f0;color:var(--danger)}.danger:hover{background:#ffe3e0}
.demo-banner{padding:9px 20px;text-align:center;background:#fff2d7;color:#654106;font-size:14px;font-weight:600}.login-panel{margin:52px auto 100px;max-width:492px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:36px}.login-intro{margin-bottom:28px}.login-intro h2{font-size:24px;margin-bottom:12px}.login-intro p{color:var(--muted);line-height:1.75}.login-panel form>label{display:block;font-size:14px;font-weight:600;margin-bottom:8px}.login-panel .primary{width:100%;margin-top:18px}.help{font-size:12px;line-height:1.7;color:var(--muted)}.login-panel .help{margin-top:10px}.field-error{color:var(--danger);font-size:12px;min-height:18px;margin-top:5px}.muted{font-size:13px;color:var(--muted)}
.connection-strip{display:flex;align-items:center;gap:11px;background:#eef2f7;border:1px solid var(--line);border-radius:10px;padding:13px 16px;margin-bottom:18px;min-height:68px}.connection-strip>div{flex:1}.connection-strip strong{font-size:14px;display:block}.connection-strip span:not(.status-dot){font-size:12px;color:var(--muted);display:block;margin-top:2px}.status-dot{display:block;flex:none;width:9px;height:9px;background:#8793a2;border-radius:50%}.status-dot.online{background:#2b7856}.status-dot.warning{background:#b47b25}.status-dot.offline{background:#a94a42}.notice{padding:12px 16px;background:#fff2dd;color:#6b4612;border:1px solid #e8d6b4;border-radius:8px;font-size:13px;line-height:1.6;margin-bottom:18px}
.editor{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.94fr);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.editor-form{padding:26px 30px 28px}.section-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px}.field-grid{display:grid;grid-template-columns:1fr 1.45fr;gap:16px}.field{margin-bottom:14px}.field>label{display:flex;justify-content:space-between;font-size:14px;font-weight:600;margin-bottom:7px}.field>label span{font-size:12px;font-weight:400;color:var(--muted)}input:not([type=radio]),select{width:100%;height:48px;border:1px solid #bfcbd8;border-radius:7px;padding:10px 12px;background:white;color:var(--ink);caret-color:var(--blue);min-width:0;font-size:16px}input::placeholder{color:#63758a;opacity:1}input:hover,select:hover{border-color:#8c9eb3}input[aria-invalid=true]{border-color:#bd4d46;background:#fffafa}input:disabled,select:disabled{background:#f0f3f7;color:#68798b}.time-field{padding:0;border:0;margin:20px 0 22px;min-width:0}.time-field legend{font-size:14px;font-weight:600;margin-bottom:9px}.radio{display:flex;align-items:center;gap:8px;font-size:14px;min-height:31px;flex-wrap:wrap}.radio input{accent-color:var(--blue);width:16px;height:16px;margin:0}.radio small{font-size:11px;color:var(--muted)}#fixed-time-wrap{margin-top:10px}.editor-actions{display:flex;gap:10px;flex-wrap:wrap}.editor-actions .primary{min-width:160px;min-height:48px;font-size:16px}.action-note{margin-top:11px;font-size:12px;line-height:1.7;color:var(--muted)}
.preview-pane{padding:26px 28px 24px;border-left:1px solid var(--line);background:#fbfcfe;display:flex;flex-direction:column}.preview-pane .section-top{margin-bottom:18px}.preview-badge{padding:3px 7px;border:1px solid #d1dce8;border-radius:5px;color:#52667e;background:#f1f5fa;font-size:11px;white-space:nowrap}.preview-badge.actual{background:#e9f4ed;border-color:#c3ddcc;color:#2c6045}.preview-stage{display:grid;place-items:center;background:#eef1f5;border:1px solid #dfe5ec;border-radius:9px;padding:24px 18px;min-height:330px;flex:1}.preview-stage canvas{width:100%;max-width:354px;height:auto;background:#fff;image-rendering:pixelated;box-shadow:0 5px 14px rgba(26,45,66,.12)}.preview-empty{text-align:center;color:#617185;font-size:14px}.preview-empty svg{margin-bottom:12px;color:#6f83a0}.preview-empty p{line-height:1.8}.preview-empty span{font-size:12px}.preview-description{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:12px}.preview-description p{font-size:12px;color:var(--muted)}.preview-description .button{font-size:12px;padding-inline:5px}.preview-pane>.help{margin-top:5px}
.submission{margin-top:18px;border:1px solid #c6dbef;border-radius:10px;background:#edf5fd;padding:16px 19px;display:flex;align-items:center;justify-content:space-between;gap:18px}.submission strong{font-size:15px}.submission p{font-size:13px;color:#365875;margin-top:4px;overflow-wrap:anywhere}.submission.uncertain{border-color:#e8d1aa;background:#fff4e3}.submission.uncertain p{color:#78501f}.submission-actions{display:flex;gap:8px;flex-wrap:wrap}.history{margin-top:30px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:24px 28px}.history .section-top{margin-bottom:17px}.history .section-top p{margin-top:4px}.history-empty{padding:38px 12px 46px;text-align:center;color:var(--muted);font-size:14px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:620px;font-size:13px}th{text-align:left;font-size:12px;font-weight:500;color:var(--muted);padding:0 12px 12px 0;border-bottom:1px solid var(--line)}td{padding:15px 12px 15px 0;border-bottom:1px solid #e8edf3;vertical-align:top}tr:last-child td{border-bottom:0}td:first-child strong{display:block;font-size:12px;font-weight:600;font-variant-numeric:tabular-nums}td:first-child small{display:block;color:var(--muted);font-size:11px;margin-top:4px}.state-tag{display:inline-block;border-radius:5px;padding:4px 7px;background:#eef2f6;color:#506176;font-size:12px;font-weight:500;white-space:nowrap}.state-tag.active{background:#e8f1ff;color:#175c9e}.state-tag.done{background:#e8f4ed;color:#286044}.state-tag.unknown{background:#fff0d8;color:#815219}.state-tag.failed{background:#fbeae8;color:#9b3f36}.row-actions{display:flex;gap:5px;flex-wrap:wrap}.row-actions .button{min-height:34px;font-size:12px;padding:6px 8px}.row-error{font-size:11px;margin-top:5px;color:var(--muted);max-width:260px}.history>.help{margin-top:12px}.usage{margin:20px 0 8px;padding:16px 3px;color:var(--muted);font-size:12px;line-height:1.8}.usage summary{cursor:pointer;color:#3e5874;font-weight:500}.usage p{max-width:75ch;margin-top:10px}footer{display:flex;justify-content:space-between;gap:16px;padding:22px 0 30px;color:#586779;font-size:11px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:760px){.topbar,main,footer{width:calc(100% - 28px)}.topbar{min-height:76px}h1{font-size:20px}.brand{gap:8px}.brand svg{width:23px}nav{gap:7px}nav a{font-size:12px}.editor{grid-template-columns:1fr}.editor-form{padding:23px 20px 24px}.preview-pane{border-left:0;border-top:1px solid var(--line);padding:23px 20px}.preview-stage{min-height:270px}.preview-stage canvas{max-width:330px}.field-grid{grid-template-columns:1fr 1.4fr;gap:12px}.history{padding:21px 17px}.history .section-top{align-items:flex-start}.history .section-top p{max-width:25ch;font-size:12px}.connection-strip{padding:12px}.connection-strip .plain{font-size:12px;padding-inline:4px}.submission{align-items:flex-start;flex-direction:column}.submission-actions{width:100%}.login-panel{margin:24px auto 70px;padding:28px 24px}.login-intro h2{font-size:23px}.editor-actions .primary{flex:1}.editor-actions .secondary{font-size:13px;padding-inline:12px}footer{padding-bottom:calc(24px + env(safe-area-inset-bottom))}}
@media(max-width:370px){.field-grid{grid-template-columns:1fr;gap:0}.brand svg{display:none}nav a{display:none}.editor-form,.preview-pane{padding-inline:17px}.editor-actions{flex-direction:column}.editor-actions .button{width:100%}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
