:root {
  --bg:#0e1116; --panel:#161b22; --panel2:#1c2330; --border:#2a313c;
  --fg:#e6edf3; --muted:#8b949e; --accent:#3b82f6; --ok:#2ea043; --warn:#d29922;
  --bad:#f85149; --chip:#30363d;
}
:root[data-theme="light"] {
  --bg:#f6f8fa; --panel:#fff; --panel2:#f0f3f6; --border:#d0d7de;
  --fg:#1f2328; --muted:#636c76; --accent:#0969da; --ok:#1a7f37; --warn:#9a6700;
  --bad:#cf222e; --chip:#eaeef2;
}
* { box-sizing:border-box; }
body { margin:0; font-family:-apple-system,system-ui,Segoe UI,sans-serif;
  background:var(--bg); color:var(--fg); line-height:1.5; }
a { color:var(--accent); text-decoration:none; } a:hover { text-decoration:underline; }
header { display:flex; align-items:center; gap:1rem; padding:.6rem 1rem;
  background:var(--panel); border-bottom:1px solid var(--border); position:sticky; top:0; z-index:10; }
header .brand { font-weight:700; }
nav { display:flex; gap:.25rem; flex-wrap:wrap; }
nav a { padding:.3rem .6rem; border-radius:6px; color:var(--fg); font-size:.9rem; }
nav a.active, nav a:hover { background:var(--panel2); text-decoration:none; }
#search { margin-left:auto; background:var(--panel2); border:1px solid var(--border);
  color:var(--fg); padding:.35rem .6rem; border-radius:6px; width:220px; }
button.ghost { background:var(--panel2); color:var(--fg); border:1px solid var(--border);
  border-radius:6px; padding:.35rem .6rem; cursor:pointer; }
main { padding:1rem 1.25rem; max-width:1200px; margin:0 auto; }
h1 { font-size:1.4rem; margin:.2rem 0 1rem; }
h2 { font-size:1.05rem; border-bottom:1px solid var(--border); padding-bottom:.3rem; margin-top:1.5rem; }
.cards { display:flex; gap:1rem; flex-wrap:wrap; }
.card { background:var(--panel); border:1px solid var(--border); border-radius:10px;
  padding:.9rem 1.1rem; min-width:130px; }
.card .n { font-size:1.8rem; font-weight:700; } .card .l { color:var(--muted); font-size:.85rem; }
table { width:100%; border-collapse:collapse; margin:.5rem 0; font-size:.9rem; }
th,td { text-align:left; padding:.45rem .6rem; border-bottom:1px solid var(--border); vertical-align:top; }
th { color:var(--muted); font-weight:600; }
tr.row { cursor:pointer; } tr.row:hover td { background:var(--panel2); }
.badge { display:inline-block; padding:.05rem .5rem; border-radius:999px; font-size:.75rem; color:#fff;
  background:var(--muted); } /* fallback bg so an unmapped status is never white-on-white */
.b-completed,.b-passed { background:var(--ok); } .b-failed,.b-product_bug,.b-errored { background:var(--bad); }
.b-running,.b-queued,.b-timed_out { background:var(--warn); }
.b-cancelled { background:var(--muted); }
.b-skipped { background:var(--chip); color:var(--fg); }
.b-info { background:var(--chip); color:var(--fg); }
.chip { display:inline-block; padding:.05rem .5rem; border-radius:999px; background:var(--chip);
  font-size:.75rem; margin:0 .25rem .25rem 0; }
.panel { background:var(--panel); border:1px solid var(--border); border-radius:10px; padding:1rem; margin:.6rem 0; }
.muted { color:var(--muted); } .row2 { display:flex; gap:1rem; flex-wrap:wrap; }
.kv { display:grid; grid-template-columns:max-content 1fr; gap:.25rem 1rem; font-size:.9rem; }
.kv dt { color:var(--muted); }
.timeline li { margin:.15rem 0; } .timeline .dur { color:var(--muted); font-variant-numeric:tabular-nums; }
#events { font-family:ui-monospace,monospace; font-size:.82rem; max-height:320px; overflow:auto;
  background:var(--bg); border:1px solid var(--border); border-radius:8px; padding:.5rem; }
.pager { display:flex; gap:.5rem; align-items:center; margin:.5rem 0; }
.controls { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; margin:.5rem 0; }
select { background:var(--panel2); color:var(--fg); border:1px solid var(--border); border-radius:6px; padding:.3rem; }
.bar { height:10px; background:var(--chip); border-radius:6px; overflow:hidden; }
.bar > i { display:block; height:100%; background:var(--accent); }
kbd { background:var(--panel2); border:1px solid var(--border); border-radius:4px; padding:0 .3rem; font-size:.8rem; }
.live { color:var(--ok); font-size:.8rem; }
.b-product_instability { background:var(--warn); }
pre.code { background:var(--bg); border:1px solid var(--border); border-radius:8px;
  padding:.6rem .7rem; overflow:auto; max-height:440px; font-family:ui-monospace,monospace;
  font-size:.8rem; white-space:pre; margin:.4rem 0; }
.btnrow { display:flex; gap:.5rem; align-items:center; margin:.4rem 0; flex-wrap:wrap; }
textarea.fb { width:100%; min-height:64px; background:var(--panel2); color:var(--fg);
  border:1px solid var(--border); border-radius:6px; padding:.5rem; font:inherit; }
button.act { background:var(--accent); color:#fff; border:0; border-radius:6px;
  padding:.4rem .8rem; cursor:pointer; } button.act:disabled { opacity:.5; cursor:default; }
button.tog { background:none; border:1px solid var(--border); color:var(--accent);
  border-radius:6px; padding:.1rem .5rem; cursor:pointer; font-size:.8rem; }
.fb-item { border-top:1px solid var(--border); padding:.4rem 0; font-size:.9rem; }
.fb-item:first-child { border-top:0; }
.hidden { display:none; }
.login { max-width:380px; margin:3rem auto; }
.login input { width:100%; padding:.55rem .6rem; margin:.35rem 0; background:var(--panel2);
  color:var(--fg); border:1px solid var(--border); border-radius:6px; font:inherit; }
.login .err { color:var(--bad); font-size:.85rem; min-height:1.15rem; margin:.2rem 0; }
.login .act { width:100%; padding:.55rem; margin-top:.3rem; }
#who { color:var(--muted); font-size:.85rem; }