/* terminal-light — extracted from mockups/terminal-light, shared across pages */
* { margin:0; padding:0; box-sizing:border-box; transition:none !important; animation:none !important; }
html, body { background:#fff; }
body { color:#111; font-family:"SF Mono", Menlo, Consolas, monospace; font-size:13px; line-height:1.6; }
.col { max-width:780px; margin:0 auto; padding:28px 16px 80px; }
a { color:#111; text-decoration:none; }
a:hover { background:#111; color:#fff; }
.dim { color:#999; } .dimmer { color:#bbb; } .frame { color:#111; }
b, strong { color:#111; font-weight:bold; }

nav { display:flex; gap:14px; white-space:nowrap; }
nav .sp { margin-left:auto; }
.active { background:#111; color:#fff; padding:0 4px; }
nav a { padding:0 4px; }

.rule { overflow:hidden; white-space:nowrap; color:#ccc; }

.crumbs { margin-top:14px; display:flex; }
.crumbs .sp { margin-left:auto; }

.box { border:1px solid #111; padding:14px 16px; margin:24px 0; position:relative; }
.box > .lbl { position:absolute; top:-0.85em; left:10px; background:#fff; padding:0 8px; color:#999; }
.box.now { border-width:2px; }

input, select, textarea {
  background:#fff; color:#111; border:1px solid #999;
  font:inherit; padding:1px 6px; outline:none; border-radius:0;
  appearance:none; -webkit-appearance:none;
}
input:focus, textarea:focus, select:focus { border-color:#111; }
textarea { width:100%; resize:vertical; }
input[type=file] { border:none; padding:0; }
.sel { position:relative; display:inline-block; }
.sel select { padding-right:22px; }
.sel::after { content:"▾"; position:absolute; right:7px; top:1px; color:#999; pointer-events:none; }

.btn { display:inline-block; color:#111; cursor:pointer; background:none; border:none; font:inherit; padding:0; }
.btn:hover { background:#111; color:#fff; }
.btn-primary { background:#111; color:#fff; padding:2px 14px; cursor:pointer; display:inline-block; border:none; font:inherit; }
.btn-primary:hover { background:#fff; color:#111; outline:1px solid #111; }
form.inline { display:inline; }

.tabs span { cursor:pointer; padding:0 8px; color:#999; }
.tabs span:hover { background:#111; color:#fff; }
.tabs span.on { background:#111; color:#fff; }
.mode span, .mode a { cursor:pointer; padding:0 6px; color:#999; }
.mode span:hover, .mode a:hover { background:#111; color:#fff; }
.mode span.on, .mode a.on { background:#111; color:#fff; }

.grid { display:grid; grid-template-columns:130px 110px 1fr; row-gap:6px; align-items:baseline; }
.grid input { width:100%; }
.kgrid { display:grid; grid-template-columns:130px 1fr; row-gap:4px; align-items:baseline; }
.kgrid .k { color:#999; }
.hgrid { display:grid; grid-template-columns:110px 1fr; row-gap:4px; align-items:baseline; }
.hgrid .k { color:#999; }
.ctl { display:grid; grid-template-columns:100px 1fr; row-gap:10px; align-items:baseline; }

.filters { display:flex; flex-wrap:wrap; gap:10px 18px; align-items:baseline; }
.filters label { color:#999; }

.wave { color:#111; letter-spacing:0; }
.wavebig { color:#111; font-size:15px; letter-spacing:0; }
.wavecut { color:#ccc; }
.mark { color:#111; background:#111; }
pre.wv { font:inherit; overflow-x:auto; }

.tag { color:#111; }
.tag:hover { background:#111; color:#fff; cursor:pointer; }
.id { color:#111; font-weight:bold; }

.sess { margin-top:4px; }
.sess a.row, .list a.row { display:block; padding:7px 0; border-bottom:1px solid #e5e5e5; color:inherit; }
.list a.row { padding:9px 0; }
.sess a.row:last-child, .list a.row:last-of-type { border-bottom:none; }
.sess a.row:hover, .list a.row:hover { background:#f2f2f2; color:inherit; }

.radio { cursor:pointer; }
.radio:hover { background:#111; color:#fff; }

table { width:100%; border-collapse:collapse; }
th { color:#999; text-align:left; font-weight:normal; padding:0 10px 4px 0; border-bottom:1px solid #ddd; }
td { padding:4px 10px 4px 0; vertical-align:baseline; }
tr.item:hover td { background:#f2f2f2; }
td.pos { color:#111; font-weight:bold; width:2.5em; }
td.est { color:#999; white-space:nowrap; }

.switchrow { background:#111; color:#fff; padding:3px 10px; margin:14px 0; }
.switchrow b { color:#fff; }

/* box-down banner. Inverted rather than coloured — the palette is monochrome,
   and this has to read as urgent without introducing a hue that exists nowhere
   else. Sits above the content on every page, since a dead box invalidates
   what gen/home/evals are offering to do. */
.banner { padding:3px 10px; margin:14px 0 0; outline:1px solid #111; }
.banner.bad { background:#111; color:#fff; outline:none; }
.banner.bad b, .banner.bad .dimmer { color:#fff; }

.bar { color:#111; }
.barbg { color:#ddd; }

.metrics td { padding:2px 24px 2px 0; }
.metrics td:first-child { color:#999; }
.metrics td.v { color:#111; font-weight:bold; }

.pass { color:#111; font-weight:bold; }
.fail { background:#111; color:#fff; padding:0 4px; }
.status-pending { color:#999; }

.wf { display:block; margin:8px 0 0; }
.wf-canvas { display:block; width:100%; height:64px; border:1px solid #ddd; }
.wf-canvas.wf-editable { cursor:col-resize; }
.wf-bar { margin-top:4px; }
.wf-hint { color:#bbb; }
.wf-empty { color:#999; margin-top:8px; }

/* Fixed advance so the text after a spinner never jitters between frames —
   the glyphs are not guaranteed to be monospaced even in a monospace font. */
[data-spin] { display:inline-block; width:1ch; text-align:center; }
[data-spin="dots"] { width:3ch; text-align:left; }

#swap-loading {
  position:fixed; top:0; right:0;
  background:#111; color:#fff;
  padding:2px 12px;
  font-family:"SF Mono", Menlo, Consolas, monospace; font-size:13px;
}
