:root{
  --bg:#0c1018; --panel:#141b27; --panel2:#1b2433; --line:#26344a;
  --ink:#dbe6f3; --mut:#8aa0bd; --acc:#3fe0a3; --acc2:#37b0ff; --warn:#ffb648; --bad:#ff6b6b;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font:15px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
a{color:var(--acc2);text-decoration:none}
a:hover{text-decoration:underline}
main{max-width:1080px;margin:24px auto;padding:0 18px}
footer{max-width:1080px;margin:30px auto;padding:14px 18px;color:var(--mut);
  border-top:1px solid var(--line);font-size:12px}

.topbar{display:flex;align-items:center;gap:18px;padding:12px 18px;
  background:var(--panel);border-bottom:1px solid var(--line);flex-wrap:wrap}
.brand{font-weight:700;color:var(--acc)}
.brand span{color:var(--mut);font-weight:400}
.topbar nav{display:flex;gap:14px;flex:1}
.topbar nav a{color:var(--ink)}
.user{display:flex;align-items:center;gap:12px;color:var(--mut);font-size:13px}
.logout{color:var(--bad)}

h1{font-size:20px;margin:0 0 16px} h2{font-size:16px;color:var(--mut)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:16px}
.card h3{margin:0 0 6px} .muted{color:var(--mut)}
.stat{font-size:30px;font-weight:700;color:var(--acc)}

table{width:100%;border-collapse:collapse;background:var(--panel);border-radius:10px;overflow:hidden}
th,td{padding:9px 12px;text-align:left;border-bottom:1px solid var(--line);font-size:13px}
th{color:var(--mut);font-weight:600;background:var(--panel2)}

.badge{padding:2px 8px;border-radius:20px;font-size:12px;border:1px solid var(--line)}
.s-done{color:var(--acc);border-color:var(--acc)}
.s-running{color:var(--acc2);border-color:var(--acc2)}
.s-failed{color:var(--bad);border-color:var(--bad)}
.s-queued{color:var(--warn);border-color:var(--warn)}
.on{color:var(--acc)} .off{color:var(--bad)}

label{display:block;margin:12px 0 4px;color:var(--mut);font-size:13px}
input,select,textarea{width:100%;padding:9px;background:var(--panel2);
  border:1px solid var(--line);border-radius:8px;color:var(--ink);font:inherit}
.btn{display:inline-block;margin-top:14px;padding:9px 16px;background:var(--acc);
  color:#06231a;border:none;border-radius:8px;font-weight:700;cursor:pointer}
.btn.alt{background:transparent;color:var(--ink);border:1px solid var(--line)}
.btn.danger{background:var(--bad);color:#2a0000}
.row{display:flex;gap:14px;flex-wrap:wrap}.row>*{flex:1;min-width:220px}

.flash{padding:10px 14px;border-radius:8px;margin-bottom:14px;border:1px solid var(--line)}
.flash.error{border-color:var(--bad);color:var(--bad)}

pre.out{background:#080b11;border:1px solid var(--line);border-radius:8px;padding:14px;
  overflow:auto;max-height:600px;font-size:12.5px;white-space:pre-wrap;word-break:break-word}
.warnbox{background:rgba(255,182,72,.08);border:1px solid var(--warn);color:var(--warn);
  padding:10px 14px;border-radius:8px;margin:10px 0;font-size:13px}
.login-wrap{max-width:420px;margin:8vh auto;text-align:center}
.gbtn{display:inline-flex;gap:10px;align-items:center;justify-content:center;width:100%;
  padding:12px;background:#fff;color:#1f1f1f;border-radius:8px;font-weight:600;margin-top:18px}
.chk{display:flex;gap:8px;align-items:flex-start}.chk input{width:auto;margin-top:4px}