:root{
  --bg:#0b1220;
  --bg-accent:#15264b;
  --panel:#0f1a2e;
  --panel2:#0c1628;
  --text:#e9eefc;
  --muted:#a9b3cf;
  --border:rgba(255,255,255,.08);
  --primary:#5b8cff;
  --primary-weak:rgba(91,140,255,.18);
  --primary-strong:rgba(91,140,255,.35);
  --danger:#ff5b6a;
  --success:#39d98a;
  --warn:#ffcc66;
  --mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono","Courier New", monospace;
  --sans:ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
}
:root[data-theme="light"]{
  --bg:#f4f6fb;
  --bg-accent:#e5ecff;
  --panel:#ffffff;
  --panel2:#f2f5ff;
  --text:#0c1527;
  --muted:#5b647a;
  --border:rgba(12,21,39,.10);
  --primary:#2f63ff;
  --primary-weak:rgba(47,99,255,.18);
  --primary-strong:rgba(47,99,255,.35);
  --danger:#d33444;
  --success:#1aa86b;
  --warn:#b6891c;
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    --bg:#f4f6fb;
    --bg-accent:#e5ecff;
    --panel:#ffffff;
    --panel2:#f2f5ff;
    --text:#0c1527;
    --muted:#5b647a;
    --border:rgba(12,21,39,.10);
    --primary:#2f63ff;
    --danger:#d33444;
    --success:#1aa86b;
    --warn:#b6891c;
  }
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:var(--sans);
  color:var(--text);
  background:radial-gradient(1200px 700px at 20% 0%, var(--bg-accent) 0%, var(--bg) 60%);
}
.container{
  width:min(1680px, calc(100vw - 32px));
  margin:0 auto;
  padding:20px;
}
.topbar{
  position:sticky;top:0;z-index:5;
  background:color-mix(in srgb, var(--bg) 85%, transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid color-mix(in srgb, var(--primary) 25%, var(--border));
}
.topbar-inner{display:flex;align-items:center;gap:16px}
.brand-link{color:var(--primary);text-decoration:none;font-weight:700;letter-spacing:.2px}
.nav{display:flex;gap:12px}
.nav a{color:var(--muted);text-decoration:none;padding:8px 10px;border-radius:10px}
.nav a:hover{background:color-mix(in srgb, var(--primary) 12%, transparent);color:var(--text)}
.nav a.active{color:var(--text);background:color-mix(in srgb, var(--primary) 20%, transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--primary) 35%, transparent)}
.spacer{flex:1}

.page-head{display:flex;flex-direction:column;gap:6px;margin:10px 0 16px}
.muted{color:var(--muted)}
.small{font-size:12px}
.mono{font-family:var(--mono)}

.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:12px}
.grid.two{grid-template-columns:repeat(2, minmax(0,1fr))}
.schedule-detail-grid{grid-template-columns:minmax(0,1.7fr) minmax(360px,1fr)}
@media (max-width: 920px){.grid{grid-template-columns:repeat(2,1fr)}.grid.two{grid-template-columns:1fr}}
@media (max-width: 520px){.grid{grid-template-columns:1fr}}

.card{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:14px;
  padding:16px;
  box-shadow:0 6px 18px rgba(0,0,0,.12);
}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.stat{padding:14px}
.stat-label{color:var(--muted);font-size:12px}
.stat-value{font-size:26px;font-weight:800;margin-top:6px;color:var(--primary)}
.card.stat{border-left:3px solid var(--primary-strong)}

.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:10px 12px;border-radius:12px;border:1px solid var(--border);
  background:rgba(255,255,255,.04);color:var(--text);
  text-decoration:none;cursor:pointer;
}
.btn:hover{background:rgba(255,255,255,.07)}
  .btn-primary{background:var(--primary-weak);border-color:var(--primary-strong)}
  .btn-primary:hover{background:color-mix(in srgb, var(--primary) 25%, transparent)}
.btn-ghost{background:transparent}

.form{display:flex;flex-direction:column;gap:12px;max-width:720px}
.form.form-wide{max-width:none}
.form-grid-tight{margin:0}

.args-composer{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(260px,1fr);
  gap:12px;
  align-items:start;
}
.args-input-block{margin:0}
.args-panel-inline{
  margin-top:0 !important;
  min-height:100%;
}

.script-runner-grid{grid-template-columns:minmax(0,1.35fr) minmax(360px,1fr)}
.script-run-form{
  max-width:none;
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:12px;
}
.script-run-form .arg-field{margin:0}
.script-run-form .arg-field-wide{grid-column:1 / -1}
.script-run-form .row{grid-column:1 / -1;margin-top:4px}
label .label{font-size:12px;color:var(--muted);margin-bottom:6px}
input, select, textarea{
  width:100%;
  padding:10px 12px;border-radius:12px;border:1px solid var(--border);
  background:rgba(0,0,0,.2);color:var(--text);
  outline:none;
}
input:focus, select:focus, textarea:focus{
  border-color:var(--primary-strong);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--primary) 20%, transparent);
}
textarea{font-family:var(--mono)}
input[type="date"]::-webkit-calendar-picker-indicator{filter:none;opacity:.75}
:root[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator{
  filter:invert(1) brightness(1.2);
  opacity:.85;
}
@media (prefers-color-scheme: dark){
  :root[data-theme="system"] input[type="date"]::-webkit-calendar-picker-indicator{
    filter:invert(1) brightness(1.2);
    opacity:.85;
  }
}
.filters{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;margin-bottom:12px}
.filters label{min-width:180px}
.jobs-filters-card{
  border:1px solid var(--border);
  border-radius:12px;
  background:color-mix(in srgb, var(--panel2) 55%, transparent);
  margin-bottom:12px;
}
.jobs-filters-summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:2px 0;
}
.jobs-filters-summary::-webkit-details-marker{display:none}
.jobs-filters-summary-actions{margin-left:auto}
.jobs-filters-form{margin-top:12px;padding-top:12px;border-top:1px solid var(--border)}
.jobs-filters-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:12px;
  align-items:end;
}
.jobs-filters-grid label{min-width:0}
.jobs-filters-grid input,
.jobs-filters-grid select{width:100%}
.jobs-filter-actions{margin-top:12px;justify-content:flex-start}
.jobs-filter-wide{grid-column:span 2}

@media (max-width: 1180px){
  .jobs-filters-grid{grid-template-columns:repeat(3, minmax(0, 1fr))}
}

@media (max-width: 900px){
  .jobs-filters-grid{grid-template-columns:repeat(2, minmax(0, 1fr))}
  .jobs-filter-wide{grid-column:span 2}
}

.toggle-wrap{display:flex;align-items:center;gap:8px}
input.toggle{
  appearance:none;
  -webkit-appearance:none;
  width:44px;
  height:24px;
  border-radius:999px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--panel2) 60%, transparent);
  position:relative;
  cursor:pointer;
  transition:background .2s,border-color .2s;
}
input.toggle::after{
  content:"";
  position:absolute;
  top:2px;left:2px;
  width:18px;height:18px;border-radius:50%;
  background:var(--muted);
  transition:transform .2s, background .2s;
}
input.toggle:checked{
  background:var(--primary-weak);
  border-color:var(--primary-strong);
}
input.toggle:checked::after{
  transform:translateX(20px);
  background:var(--primary);
}
input.toggle:focus{
  outline:none;
  box-shadow:0 0 0 3px color-mix(in srgb, var(--primary) 20%, transparent);
}

.table-wrap{overflow:auto}
.table-wrap.scroll-hint{position:relative}
.table-wrap.scroll-hint.is-scrollable::after{
  content:"scroll →";
  position:absolute;
  right:10px;
  top:8px;
  font-size:11px;
  color:var(--muted);
  background:var(--panel2);
  border:1px solid var(--border);
  padding:2px 8px;
  border-radius:999px;
  pointer-events:none;
}
.table-wrap.scroll-hint.is-scrollable:not(.is-at-end)::before{
  content:"";
  position:absolute;
  right:0;
  top:0;
  width:28px;
  height:100%;
  pointer-events:none;
  background:linear-gradient(to left, color-mix(in srgb, var(--panel2) 85%, transparent), transparent);
}
.table-wrap.scroll-hint.is-scrollable:not(.is-at-start) .table{
  box-shadow:inset 12px 0 12px -12px color-mix(in srgb, var(--panel2) 85%, transparent);
}
.table{width:100%;border-collapse:separate;border-spacing:0 8px}
.table th{
  color:var(--muted);
  text-align:left;
  font-weight:600;
  font-size:12px;
  padding:8px 10px;
  position:sticky;
  top:0;
  background:var(--panel2);
  z-index:2;
}
.table td{
  padding:10px;
  background:color-mix(in srgb, var(--panel2) 35%, transparent);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.table tbody tr:nth-child(even) td{
  background:color-mix(in srgb, var(--panel2) 45%, transparent);
}
.table tbody tr:hover td{
  background:color-mix(in srgb, var(--panel2) 60%, transparent);
}
.table tr td:first-child{border-left:1px solid var(--border);border-top-left-radius:12px;border-bottom-left-radius:12px}
.table tr td:last-child{border-right:1px solid var(--border);border-top-right-radius:12px;border-bottom-right-radius:12px}
.link{color:var(--primary);text-decoration:none}
.link:hover{text-decoration:underline}

.pill{
  display:inline-flex;align-items:center;gap:8px;
  padding:5px 10px;border-radius:999px;
  font-size:12px;border:1px solid var(--border);
  background:rgba(255,255,255,.04);
  min-width:2ch;
  justify-content:center;
}
.pill.running{border-color:rgba(255,204,102,.35);background:rgba(255,204,102,.14)}
.pill.running::before{content:"●";color:var(--warn)}
.pill.failed{border-color:rgba(255,91,106,.35);background:rgba(255,91,106,.14)}
.pill.failed::before{content:"✖";color:var(--danger)}
.pill.success{border-color:rgba(57,217,138,.35);background:rgba(57,217,138,.14)}
.pill.success::before{content:"✔";color:var(--success)}
.pill.pending{border-color:rgba(169,179,207,.25);background:rgba(169,179,207,.10)}
.pill.pending::before{content:"…";color:var(--muted)}
.pill.queued{border-color:rgba(169,179,207,.25);background:rgba(169,179,207,.08)}
.pill.queued::before{content:"⏸";color:var(--muted)}
.pill.stopping{border-color:rgba(255,204,102,.35);background:rgba(255,204,102,.12)}
.pill.stopping::before{content:"■";color:var(--warn)}
.pill.healthy{border-color:rgba(57,217,138,.35);background:rgba(57,217,138,.14)}
.pill.healthy::before{content:"●";color:var(--success)}
.pill.degraded{border-color:rgba(255,204,102,.35);background:rgba(255,204,102,.14)}
.pill.degraded::before{content:"●";color:var(--warn)}
.pill.stale{border-color:rgba(255,91,106,.35);background:rgba(255,91,106,.14)}
.pill.stale::before{content:"●";color:var(--danger)}
.pill.unknown{border-color:rgba(169,179,207,.25);background:rgba(169,179,207,.10)}
.pill.unknown::before{content:"●";color:var(--muted)}
.pill.planned{border-color:rgba(79,163,255,.35);background:rgba(79,163,255,.10)}
.pill.planned::before{content:"○";color:#4fa3ff}
.pill.missed{border-color:rgba(255,91,106,.35);background:rgba(255,91,106,.14)}
.pill.missed::before{content:"!";color:var(--danger)}

.kv{display:grid;grid-template-columns:140px 1fr;gap:10px 12px}
.kv .k{color:var(--muted);font-size:12px}
.kv .v{min-width:0}
.row{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.args-panel{min-width:0}
.args-list{
  max-height:260px;
  overflow:auto;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.arg-item{
  padding:8px 10px;
  border-radius:10px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--panel2) 55%, transparent);
}

.log{
  margin:0;
  padding:12px;
  border-radius:12px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--panel2) 55%, transparent);
  max-height:65vh;
  overflow:auto;
  font-family:var(--mono);
  font-size:12px;
  line-height:1.5;
  white-space:pre-wrap;
  word-break:break-word;
}
:root[data-log-wrap="off"] .log{white-space:pre}
.log.lines{counter-reset:line}
.log-wrap{
  margin:0;
  padding:0;
  border-radius:12px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--panel2) 55%, transparent);
  max-height:50vh;
  overflow:auto;
  overflow-x:hidden;
}
.log-body{
  margin:0;
  padding:12px;
  font-family:var(--mono);
  font-size:12px;
  line-height:1.5;
  white-space:pre-wrap;
  word-break:break-word;
}
:root[data-log-wrap="off"] .log-body{white-space:pre}
.log-body.lines{counter-reset:line}
.log-line{display:block}
.log-line{cursor:pointer;padding-left:4px;border-radius:6px}
.log-line.bookmarked{background:color-mix(in srgb, var(--primary) 18%, transparent)}
.log-line.bookmarked::before{color:var(--primary);font-weight:600}
.log-line::before{
  counter-increment:line;
  content:counter(line);
  display:inline-block;
  width:3ch;
  margin-right:10px;
  color:var(--muted);
}
.log-error{color:var(--danger);font-weight:600}
.log-warn{color:var(--warn);font-weight:600}
.log-info{color:var(--primary);font-weight:600}
.terminal{
  background:color-mix(in srgb, #000 30%, var(--panel2));
  color:var(--text);
  border:1px solid color-mix(in srgb, var(--border) 80%, transparent);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,0.03);
}
.log-toolbar{
  position:sticky;
  top:0;
  z-index:2;
  padding:8px;
  background:color-mix(in srgb, #000 35%, var(--panel2));
  border-bottom:1px solid var(--border);
}
.log-layout{align-items:start;grid-template-columns:minmax(0,1fr) minmax(240px, 360px)}
.log-layout.maximized{grid-template-columns:1fr}
.log-layout.maximized > div:first-child{grid-column:1/-1}
.log-layout.maximized{max-width:100%}
.log-layout.maximized .log-wrap{max-height:50vh;width:100%}
.log-layout.maximized .sidebar{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px,1fr));
  gap:12px;
}
.btn-icon{padding:6px 10px;line-height:1;font-size:16px}
.progress-list{display:flex;flex-direction:column;gap:6px}
.progress-line{display:grid;grid-template-columns:160px 1fr;gap:10px;align-items:center}
.progress-label{color:var(--muted)}
.sidebar{display:flex;flex-direction:column;gap:12px}
.bookmarks details{max-height:240px;overflow:auto}
.status-pill{
  padding:4px 8px;
  border-radius:999px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--panel2) 65%, transparent);
}
.issues .issue-latest{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.issue-line{
  font-family:var(--mono);
  font-size:12px;
  padding:6px 8px;
  border-radius:8px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--panel2) 55%, transparent);
}
.issue-details{margin-top:8px}
.issue-details summary{cursor:pointer;color:var(--muted);font-size:12px}
.issue-list{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.issues{min-width:0}
.issues .card-head h2{font-size:13px}
.issues .issue-latest{max-height:110px;overflow:auto}
.issues .issue-list{max-height:240px;overflow:auto}
.issue-line{overflow-wrap:anywhere;word-break:break-word}
.badge{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:22px;height:20px;padding:0 6px;border-radius:999px;
  font-size:11px;color:var(--text);
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--panel2) 65%, transparent);
}
.btn.nav-err{border-color:color-mix(in srgb, var(--danger) 60%, var(--border));color:var(--danger)}
.btn.nav-warn{border-color:color-mix(in srgb, var(--warn) 60%, var(--border));color:var(--warn)}
:root[data-perf="on"] .issues{display:none}
:root[data-perf="on"] #bookmarkList{display:none}
:root[data-perf="on"] .log-line{cursor:default}

.bookmarks details{display:block}
.bookmarks summary{cursor:pointer;display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px;font-weight:600}
.bookmarks summary::-webkit-details-marker{display:none}
.progress-line{
  padding:8px 10px;
  border-radius:10px;
  border:1px dashed var(--border);
  background:color-mix(in srgb, var(--primary) 12%, var(--panel2));
  color:var(--primary);
  font-size:12px;
  box-shadow:0 0 0 1px color-mix(in srgb, var(--primary) 20%, transparent), 0 0 12px color-mix(in srgb, var(--primary) 28%, transparent);
}

.theme-settings{position:relative}
.theme-settings > summary{list-style:none}
.theme-settings > summary::-webkit-details-marker{display:none}
.theme-panel{
  position:absolute;
  right:0;
  top:40px;
  min-width:220px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.theme-panel input[type="color"]{height:36px;padding:0;border-radius:10px}

:root[data-density="compact"] .table td{padding:6px 8px}
:root[data-density="compact"] .table th{padding:6px 8px}
:root[data-density="compact"] .btn{padding:8px 10px}
:root[data-density="compact"] .card{padding:12px}

.tooltip-anchor{position:relative}
:root[data-tooltips="on"] [data-tip]{position:relative}
:root[data-tooltips="on"] [data-tip]:hover::after{
  content:attr(data-tip);
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:calc(100% + 8px);
  background:color-mix(in srgb, var(--panel) 85%, #000);
  border:1px solid var(--border);
  padding:6px 8px;
  border-radius:8px;
  font-size:12px;
  color:var(--text);
  white-space:nowrap;
  z-index:20;
  box-shadow:0 8px 16px rgba(0,0,0,.2);
}
:root[data-tooltips="on"] [data-tip]:hover::before{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:100%;
  border:6px solid transparent;
  border-top-color:color-mix(in srgb, var(--panel) 85%, #000);
}

[data-args-tip]{position:relative}
[data-args-tip]:hover::after{
  content:attr(data-args-tip);
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:calc(100% + 8px);
  background:color-mix(in srgb, var(--panel) 85%, #000);
  border:1px solid var(--border);
  padding:6px 8px;
  border-radius:8px;
  font-size:12px;
  color:var(--text);
  white-space:nowrap;
  z-index:20;
  box-shadow:0 8px 16px rgba(0,0,0,.2);
}
[data-args-tip]:hover::before{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:100%;
  border:6px solid transparent;
  border-top-color:color-mix(in srgb, var(--panel) 85%, #000);
}

.widget{cursor:grab}
.widget.dragging{opacity:.6}
.widget-container:not(.grid) .widget{margin-bottom:12px}
.table tr.click-row{cursor:pointer}
.table tr.click-row:hover td{background:color-mix(in srgb, var(--panel2) 85%, transparent)}
.table tr.click-row:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.analytics-panel > summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.analytics-panel > summary::-webkit-details-marker{display:none}
.analytics-summary{padding:2px 0}
.analytics-metrics{margin-top:8px}
.analytics-metrics summary{cursor:pointer;color:var(--muted);font-size:12px}
.analytics-metrics-list{
  margin-top:8px;
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));
  gap:8px;
}
.analytics-metric-item{
  display:flex;
  align-items:center;
  gap:6px;
  border:1px solid var(--border);
  border-radius:8px;
  padding:6px 8px;
  background:color-mix(in srgb, var(--panel2) 65%, transparent);
}
.line-chart-wrap{
  margin-top:10px;
  border:1px solid var(--border);
  border-radius:12px;
  background:color-mix(in srgb, var(--panel2) 70%, transparent);
  padding:8px;
}
.line-chart{width:100%;height:280px;display:block}
.line-chart-legend{
  margin-top:8px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.line-legend-item{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 8px;
  border:1px solid var(--border);
  border-radius:999px;
  background:color-mix(in srgb, var(--panel2) 72%, transparent);
}
.line-legend-color{
  width:10px;
  height:10px;
  border-radius:50%;
  display:inline-block;
}
.missed-summary-card{
  width:100%;
  text-align:left;
  appearance:none;
  cursor:pointer;
}
.missed-summary-card:hover{
  border-color:color-mix(in srgb, var(--primary) 35%, var(--border));
  background:color-mix(in srgb, var(--panel2) 82%, transparent);
}
.missed-runs-panel{
  overflow:hidden;
  max-height:0;
  opacity:0;
  margin-top:0;
  padding-top:0;
  padding-bottom:0;
  border-width:0;
  transform:translateY(-8px);
  transition:max-height .28s ease, opacity .2s ease, transform .28s ease, margin-top .28s ease, padding .28s ease, border-width .28s ease;
}
.missed-runs-panel.is-open{
  max-height:1200px;
  opacity:1;
  margin-top:12px;
  padding-top:14px;
  padding-bottom:14px;
  border-width:1px;
  transform:translateY(0);
}
.missed-resolve-form{
  justify-content:flex-end;
  margin:0;
}
.timeline-grid{
  display:grid;
  grid-template-columns:repeat(14, minmax(0,1fr));
  gap:6px;
  align-items:end;
}
.timeline-filters{margin-top:8px}
.timeline-zoom{display:flex;flex-direction:column;gap:6px}
.timeline-zoom .row{margin-top:0}
.timeline-nav-row{align-items:center;gap:8px}
.timeline-shift-btn{min-width:36px;padding-inline:8px}
.timeline-zoom-btn.is-active{
  border-color:color-mix(in srgb, var(--primary) 60%, var(--border));
  background:color-mix(in srgb, var(--primary) 16%, transparent);
}
.timeline-view-toggle{margin-top:10px}
.timeline-view-toggle .btn.is-active{
  border-color:color-mix(in srgb, var(--primary) 60%, var(--border));
  background:color-mix(in srgb, var(--primary) 16%, transparent);
}
.timeline-stage{
  position:relative;
  margin-top:8px;
  padding-inline:28px;
}
.timeline-view{margin-top:8px}
.timeline-stage .timeline-view{margin-top:0}
.timeline-edge-btn{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:3;
  min-width:34px;
  width:34px;
  height:34px;
  padding:0;
  border-radius:999px;
  background:color-mix(in srgb, var(--panel2) 88%, transparent);
  box-shadow:0 6px 18px rgba(0,0,0,.18);
}
.timeline-edge-left{left:0}
.timeline-edge-right{right:0}
.timeline-day{display:flex;flex-direction:column;align-items:center;gap:6px}
.timeline-day.is-today{
  border:1px dashed color-mix(in srgb, var(--primary) 70%, var(--border));
  border-radius:10px;
  padding:4px 2px;
  background:color-mix(in srgb, var(--primary) 10%, transparent);
}
.timeline-day.is-today .timeline-label{color:var(--primary);font-weight:600}
.timeline-items{
  display:flex;
  flex-direction:column-reverse;
  gap:6px;
  min-height:120px;
  align-items:center;
}
.timeline-dot{
  appearance:none;
  -webkit-appearance:none;
  padding:0;
  width:12px;height:12px;border-radius:4px;
  background:var(--border);
  border:1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.timeline-grid,.timeline-day,.timeline-items{cursor:default}
.timeline-dot{cursor:pointer}
.timeline-dot:focus-visible{
  outline:2px solid color-mix(in srgb, var(--primary) 70%, transparent);
  outline-offset:2px;
}
.timeline-dot:hover{transform:scale(1.15)}
.timeline-dot.active{box-shadow:0 0 0 2px color-mix(in srgb, var(--primary) 70%, transparent), 0 0 12px color-mix(in srgb, var(--primary) 45%, transparent)}
.timeline-dot.ok{background:color-mix(in srgb, #2ecc71 85%, #000)}
.timeline-dot.warn{background:color-mix(in srgb, #f1c40f 85%, #000)}
.timeline-dot.fail{background:color-mix(in srgb, #e74c3c 85%, #000)}
.timeline-dot.running{background:color-mix(in srgb, #3498db 85%, #000)}
.timeline-dot.planned{background:color-mix(in srgb, #4fa3ff 45%, transparent);border-color:color-mix(in srgb, #4fa3ff 75%, transparent)}
.timeline-dot.missed{background:color-mix(in srgb, #e74c3c 55%, #000);border-color:color-mix(in srgb, #ff9a9a 80%, transparent)}
.timeline-dot.other{background:color-mix(in srgb, var(--border) 90%, #000)}
.timeline-trend-hit{cursor:pointer;pointer-events:all}
.timeline-trend-point{pointer-events:none}
.timeline-label{font-size:11px;color:var(--muted)}
.timeline-empty{color:var(--muted);font-size:12px}
.timeline-tooltip{
  position:fixed;
  display:none;
  padding:6px 8px;
  border-radius:8px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--panel2) 85%, transparent);
  font-size:12px;
  pointer-events:none;
  z-index:50;
}
.timeline-popover{
  position:fixed;
  display:none;
  padding:10px;
  border-radius:10px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--panel2) 92%, transparent);
  box-shadow:0 10px 30px rgba(0,0,0,0.25);
  min-width:220px;
  z-index:60;
}
.timeline-popover .pop-title{font-weight:600;margin-bottom:4px}
.timeline-popover .pop-args{margin-top:4px;white-space:pre-wrap}
.timeline-popover .pop-summary{margin-top:6px;font-size:12px}
.timeline-popover .pop-list{margin-top:8px;max-height:220px;overflow:auto;display:flex;flex-direction:column;gap:6px}
.timeline-popover .pop-item{display:grid;grid-template-columns:auto 120px 1fr auto;gap:8px;align-items:center;text-decoration:none;color:var(--text);padding:6px 8px;border-radius:8px;background:color-mix(in srgb, var(--panel2) 70%, transparent);border:1px solid var(--border)}
.timeline-popover .pop-item:hover{background:color-mix(in srgb, var(--panel2) 85%, transparent)}
@media (max-width: 920px){
  .timeline-stage{padding-inline:22px}
  .timeline-edge-btn{min-width:30px;width:30px;height:30px}
  .timeline-grid{grid-template-columns:repeat(7, minmax(0,1fr))}
}
@media (max-width: 520px){
  .timeline-stage{padding-inline:18px}
  .timeline-grid{grid-template-columns:repeat(4, minmax(0,1fr))}
}

.calendar{display:flex;flex-direction:column;gap:8px}
.calendar-head, .calendar-week{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.calendar-head div{color:var(--muted);font-size:12px;padding:0 6px}
.calendar-day{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:12px;
  min-height:120px;
  padding:8px;
}
.calendar-day.today{border-color:var(--primary-strong);box-shadow:0 0 0 2px color-mix(in srgb, var(--primary) 15%, transparent)}
.calendar-day-head{font-size:12px;color:var(--muted);margin-bottom:6px}
.calendar-items{display:flex;flex-direction:column;gap:4px}
.calendar-item{font-size:12px;display:flex;gap:6px;align-items:center}
.calendar-item .mono{color:var(--muted)}

.sparkline{display:flex;gap:6px;align-items:flex-end;min-height:60px}
.sparkline-bar{
  width:12px;
  border-radius:6px;
  background:var(--muted);
  display:inline-block;
}
.sparkline-bar.success{background:var(--success)}
.sparkline-bar.warn{background:var(--warn)}
.sparkline-bar.failed{background:var(--danger)}
.sparkline-bar.running{background:var(--warn)}
.sparkline-bar.pending{background:var(--muted)}
.sparkline-bar.queued{background:var(--muted)}
.sparkline-bar.stopping{background:var(--warn)}

@media (max-width: 720px){
  .filters{flex-direction:column;align-items:stretch}
  .filters label{min-width:auto;width:100%}
  .jobs-filters-grid{grid-template-columns:1fr}
  .jobs-filter-wide{grid-column:span 1}
  .jobs-filters-summary{flex-direction:column;align-items:flex-start}
  .jobs-filters-summary-actions{margin-left:0}
  .card-head{flex-direction:column;align-items:flex-start}
  .row{gap:8px}
  .table th, .table td{font-size:11px}
  .log{max-height:50vh}
  .calendar-head, .calendar-week{gap:4px}
  .calendar-day{min-height:90px;padding:6px}
}

@media (max-width: 1200px){
  .args-composer{grid-template-columns:1fr}
}

@media (max-width: 980px){
  .script-run-form{grid-template-columns:1fr}
  .script-runner-grid{grid-template-columns:1fr}
}

.flash{
  margin:12px 0;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
}
.flash.error{border-color:rgba(255,91,106,.35);background:rgba(255,91,106,.14)}
.flash.ok{border-color:rgba(57,217,138,.35);background:rgba(57,217,138,.14)}

.footer{border-top:1px solid var(--border);margin-top:20px}
.footer-inner{color:var(--muted);font-size:12px}
.auth-card{max-width:520px;margin:50px auto}
mark{
  background:rgba(255,204,102,.35);
  color:var(--text);
  padding:0 2px;
  border-radius:4px;
}
