:root { --bg:#f4f5f7; --card:#fff; --text:#1f2328; --muted:#6b7280; --line:#e2e5ea; --accent:#2457a8; --ok:#1a7f37; --err:#b42318; --warn:#b54708; }
* { box-sizing:border-box; }
body { margin:0; font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; background:var(--bg); color:var(--text); }
header.top { display:flex; justify-content:space-between; align-items:center; padding:10px 20px; background:#1f2937; color:#fff; }
header.top a, header.top button.link { color:#fff; text-decoration:none; margin-left:16px; }
header.top .brand { font-weight:700; margin:0; font-size:17px; }
main { max-width:1200px; margin:0 auto; padding:20px; }
footer.foot { text-align:center; color:var(--muted); font-size:12px; padding:20px; }
h1 { font-size:22px; margin:0 0 14px; } h2 { font-size:16px; margin:0 0 10px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:16px; margin-bottom:16px; }
.card.narrow { max-width:420px; margin:60px auto; }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:800px) { .grid2 { grid-template-columns:1fr; } }
.row { display:flex; gap:16px; align-items:flex-start; flex-wrap:wrap; }
.row.between { justify-content:space-between; align-items:center; }
.row > label { flex:1; }
label { display:block; margin-bottom:10px; font-size:13px; color:#374151; }
label.check { display:flex; gap:8px; align-items:flex-start; }
label.check input { margin-top:3px; }
input:not([type=checkbox]), select, textarea { display:block; width:100%; margin-top:3px; padding:7px 9px; border:1px solid #cfd4dc; border-radius:5px; font:inherit; font-size:14px; }
input.short { width:110px; display:inline-block; }
textarea { font-family:ui-monospace,Menlo,Consolas,monospace; font-size:13px; }
button, .button { display:inline-block; padding:7px 14px; border:1px solid #cfd4dc; background:#fff; color:var(--text); border-radius:5px; font:inherit; font-size:14px; cursor:pointer; text-decoration:none; }
button.primary, .button.primary { background:var(--accent); border-color:var(--accent); color:#fff; }
button.danger { background:#fff; border-color:var(--err); color:var(--err); }
button.link { background:none; border:0; padding:0; cursor:pointer; font:inherit; }
.button.small, button.small { padding:3px 9px; font-size:13px; }
form.inline { display:inline; }
.flash { padding:10px 14px; border-radius:6px; margin-bottom:14px; border:1px solid; }
.flash.ok { background:#ecfdf3; border-color:#a6f4c5; color:var(--ok); }
.flash.err { background:#fef3f2; border-color:#fecdca; color:var(--err); }
.flash.info { background:#eff6ff; border-color:#bfdbfe; color:#1e40af; }
.flash ul { margin:0; padding-left:18px; }
.muted { color:var(--muted); } .small { font-size:12px; }
.mono { font-family:ui-monospace,Menlo,Consolas,monospace; font-size:13px; }
table.list { width:100%; border-collapse:collapse; background:var(--card); border:1px solid var(--line); border-radius:8px; }
table.list th, table.list td { text-align:left; padding:8px 10px; border-bottom:1px solid var(--line); vertical-align:top; }
table.list th { font-size:12px; text-transform:uppercase; color:var(--muted); }
table.list.small td, table.list.small th { padding:4px 8px; font-size:13px; }
td.num, th.num { text-align:right; }
.badge { display:inline-block; padding:2px 8px; border-radius:10px; font-size:12px; font-weight:600; background:#e5e7eb; color:#374151; }
.badge.running, .badge.queued, .badge.stopping { background:#dbeafe; color:#1e40af; }
.badge.finished { background:#dcfce7; color:var(--ok); }
.badge.failed { background:#fee2e2; color:var(--err); }
.badge.stopped, .badge.interrupted { background:#fef3c7; color:var(--warn); }
dl.kv { display:grid; grid-template-columns:max-content 1fr; gap:4px 16px; margin:0; }
dl.kv dt { color:var(--muted); font-size:13px; } dl.kv dd { margin:0; }
.actions { display:grid; grid-template-columns:repeat(auto-fit, minmax(230px, 1fr)); gap:14px; }
.action { border:1px solid var(--line); border-radius:6px; padding:12px; }
.action p { margin:6px 0 0; }
pre { white-space:pre-wrap; word-break:break-all; margin:0; }
pre.log { background:#0f172a; color:#d1d5db; padding:12px; border-radius:6px; font-size:12px; line-height:1.4; max-height:70vh; overflow:auto; font-family:ui-monospace,Menlo,Consolas,monospace; }
.crumbs { color:var(--muted); font-size:13px; margin:0 0 8px; }
details summary { cursor:pointer; }
code { background:#eef0f3; padding:1px 5px; border-radius:4px; font-size:12px; }