:root { --bg:#0f1115; --panel:#171a21; --line:#2a2f3a; --fg:#e6e8ee; --muted:#8b93a7; --acc:#6ea8fe; --ok:#3fb950; --bad:#f85149; --warn:#d29922; }
* { box-sizing: border-box; }
body { margin:0; font: 14px/1.45 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; background:var(--bg); color:var(--fg); }
a { color:var(--acc); text-decoration:none; } a:hover { text-decoration:underline; }
code { font: 12px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; background:#0b0d12; padding:1px 4px; border-radius:3px; }
header.top { display:flex; justify-content:space-between; align-items:center; padding:10px 20px; border-bottom:1px solid var(--line); background:var(--panel); }
header .brand { font-weight:700; font-size:16px; color:var(--fg); } header .brand span { color:var(--acc); }
header nav a, header nav button.link { margin-left:16px; color:var(--muted); } header nav a:hover { color:var(--fg); }
main { max-width: 1240px; margin: 0 auto; padding: 18px 20px 40px; }
footer.foot { color:var(--muted); font-size:12px; text-align:center; padding:12px; border-top:1px solid var(--line); }
h1 { font-size:22px; margin: 6px 0 12px; } h2 { font-size:16px; margin: 0 0 10px; } h3 { font-size:14px; margin:14px 0 6px; color:var(--muted); }
.card { background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:14px 16px; margin: 0 0 16px; }
.card.narrow { max-width: 460px; margin: 40px auto; }
.grid2 { display:grid; grid-template-columns: 1fr 1fr; gap:16px; } @media (max-width: 900px) { .grid2 { grid-template-columns: 1fr; } }
table { width:100%; border-collapse: collapse; } th, td { text-align:left; padding: 5px 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
th { color:var(--muted); font-weight:600; font-size:12px; } table.small { font-size:12px; } table.kv th { width: 130px; }
tr.sub td { background:#12151b; } tr.rowbad td { background:#2a1517; } tr.rowmuted td { color:var(--muted); }
.muted { color:var(--muted); } .small { font-size:12px; } .ok { color:var(--ok); } .bad { color:var(--bad); }
.pill { display:inline-block; font-size:11px; padding:2px 8px; border:1px solid var(--line); border-radius:999px; color:var(--muted); vertical-align:middle; }
.flash { padding:10px 14px; border-radius:6px; margin-bottom:14px; border:1px solid; word-break: break-all; }
.flash.ok { border-color:var(--ok); background:#12261a; } .flash.bad { border-color:var(--bad); background:#2a1517; }
form.stack { display:flex; flex-direction:column; gap:10px; } form.stack label, .row label { display:flex; flex-direction:column; gap:4px; color:var(--muted); font-size:12px; }
.row { display:flex; flex-wrap:wrap; gap:10px; align-items:flex-end; margin: 8px 0; } form.inline { display:inline; }
input, select, button { font: inherit; color:var(--fg); background:#0b0d12; border:1px solid var(--line); border-radius:6px; padding:7px 10px; }
input[type=file] { padding:5px; } button { cursor:pointer; } button.primary { background:var(--acc); color:#08111f; border-color:var(--acc); font-weight:600; }
button.link { background:none; border:none; padding:0; color:var(--acc); } button.danger, .danger { color:var(--bad); } button:disabled { opacity:.5; cursor:not-allowed; }
details { margin-top:10px; } summary { cursor:pointer; color:var(--acc); }
.st { font-size:11px; padding:2px 7px; border-radius:4px; background:#2a2f3a; } .st-succeeded { background:#12361d; color:var(--ok); } .st-failed { background:#3a1518; color:var(--bad); }
.st-running { background:#1b2a44; color:var(--acc); } .st-queued { background:#2a2f3a; } .st-unavailable { background:#3a2c12; color:var(--warn); }
.v { font-size:11px; padding:2px 7px; border-radius:4px; background:#2a2f3a; } .v-PASS, .v-BLESSED { background:#12361d; color:var(--ok); } .v-FAIL { background:#3a1518; color:var(--bad); }
.v-REFUSED, .v-INCOMPLETE, .v-NO_RECEIPT, .v-WARN { background:#3a2c12; color:var(--warn); }
pre.log { background:#0b0d12; border:1px solid var(--line); border-radius:6px; padding:10px; max-height: 60vh; overflow:auto; font: 12px/1.4 ui-monospace, Menlo, monospace; white-space: pre-wrap; }
.player-wrap { position:relative; width:100%; aspect-ratio: 16 / 9; background:#000; border:1px solid var(--line); border-radius:8px; overflow:hidden; margin: 10px 0; }
.player-wrap iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.trunc { max-width: 420px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; display:inline-block; vertical-align: bottom; }
.danger-zone { border-color:#4a2023; }