:root{
  --bg:#0a0b14; --bg2:#0e1020; --panel:#13152a; --panel2:#181a32;
  --border:#262a4d; --text:#e9ebf7; --muted:#9aa0c9; --faint:#6b7099;
  --accent:#8b5cf6; --accent2:#c4b5fd; --indigo:#6366f1; --blood:#e0496b; --green:#34d399; --amber:#fbbf24;
  --maxw:1000px;
}
*{box-sizing:border-box;}
body{
  margin:0; color:var(--text); background:var(--bg);
  font-family:"Inter",ui-sans-serif,system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased; line-height:1.6;
  background-image:
    radial-gradient(900px 540px at 82% -8%, rgba(139,92,246,.18), transparent 60%),
    radial-gradient(700px 700px at 50% 118%, rgba(99,102,241,.12), transparent 60%);
  background-attachment:fixed; min-height:100vh;
}
a{color:inherit;}
.font-mark{font-family:"Space Grotesk",sans-serif;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px;}

/* top bar */
header.bar{position:sticky;top:0;z-index:40;backdrop-filter:blur(10px);
  background:rgba(10,11,20,.6);border-bottom:1px solid var(--border);}
.bar-inner{display:flex;align-items:center;justify-content:space-between;height:62px;}
.brand{display:flex;align-items:center;gap:10px;}
.brand .moon{font-size:21px;filter:drop-shadow(0 0 10px rgba(196,181,253,.55));}
.brand .name{font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:20px;}
.brand .name b{background:linear-gradient(90deg,var(--accent2),var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent;}
.who{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--muted);}
.who img{width:28px;height:28px;border-radius:50%;border:1px solid var(--border);}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:14px;
  padding:9px 16px;border-radius:10px;border:1px solid var(--border);background:var(--panel2);
  color:var(--text);cursor:pointer;transition:.15s;}
.btn:hover{border-color:var(--accent);}
.btn:disabled{opacity:.55;cursor:default;}
.btn-accent{background:linear-gradient(180deg,var(--accent),#7c3aed);border:none;color:#fff;box-shadow:0 6px 20px rgba(124,58,237,.3);}
.btn-accent:hover{filter:brightness(1.08);border:none;}
.btn-sm{padding:6px 12px;font-size:13px;border-radius:8px;}
.btn-ghost{background:none;}

/* cards */
main{padding:34px 0 80px;}
.card{background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--border);
  border-radius:16px;padding:24px;margin-bottom:20px;}
.card h2{font-family:"Space Grotesk",sans-serif;font-size:18px;margin:0 0 4px;}
.card .hint{color:var(--muted);font-size:13.5px;margin:0 0 18px;}
.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.spacer{flex:1;}
label.fld{display:flex;flex-direction:column;gap:6px;font-size:12px;text-transform:uppercase;letter-spacing:.5px;color:var(--faint);}
input,select{background:#0a0c18;border:1px solid var(--border);border-radius:10px;color:var(--text);
  padding:10px 12px;font-size:14px;font-family:inherit;outline:none;}
input:focus,select:focus{border-color:var(--accent);}
input.wide{min-width:340px;}

/* repo list */
.repo{display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:12px 15px;margin-bottom:10px;}
.repo .n{font-family:"Space Grotesk",sans-serif;font-size:14.5px;}
.repo .meta{color:var(--faint);font-size:12.5px;}
.tag{font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px;border:1px solid var(--border);}
.tag.on{background:rgba(52,211,153,.15);color:var(--green);border-color:transparent;}
.tag.off{color:var(--faint);}
.tag.warn{background:rgba(251,191,36,.14);color:var(--amber);border-color:transparent;}

/* runs table */
table{width:100%;border-collapse:collapse;font-size:13.5px;}
th{text-align:left;color:var(--faint);font-weight:500;font-size:11px;text-transform:uppercase;letter-spacing:.5px;padding:8px 10px;border-bottom:1px solid var(--border);}
td{padding:11px 10px;border-bottom:1px solid rgba(38,42,77,.5);}
.pill{font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:999px;}
.pill.ok{background:rgba(52,211,153,.16);color:var(--green);}
.pill.fail{background:rgba(224,73,107,.16);color:var(--blood);}
.pill.run{background:rgba(139,92,246,.16);color:var(--accent2);}
.muted{color:var(--muted);}
.empty{color:var(--faint);font-size:14px;padding:18px 0;text-align:center;}

/* signed-out hero */
.gate{min-height:78vh;display:grid;place-items:center;text-align:center;padding:40px 20px;}
.gate .moon-lg{font-size:56px;filter:drop-shadow(0 0 22px rgba(196,181,253,.5));}
.gate h1{font-family:"Space Grotesk",sans-serif;font-size:clamp(30px,5vw,46px);letter-spacing:-.02em;margin:14px 0 10px;}
.gate h1 .grad{background:linear-gradient(110deg,#fff,var(--accent2),var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent;}
.gate p{color:var(--muted);max-width:520px;margin:0 auto 26px;font-size:17px;}

.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);z-index:80;
  background:var(--panel2);border:1px solid var(--border);border-radius:12px;padding:12px 18px;
  font-size:14px;box-shadow:0 20px 60px rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:.2s;}
.toast.show{opacity:1;}
.toast.err{border-color:var(--blood);}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;}
.hide{display:none !important;}

/* tabs */
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);margin-top:22px;overflow-x:auto;}
.tab{background:none;border:none;border-bottom:2px solid transparent;color:var(--muted);
  font-family:"Space Grotesk",sans-serif;font-size:14.5px;font-weight:500;padding:12px 16px;cursor:pointer;white-space:nowrap;}
.tab:hover{color:var(--text);}
.tab.active{color:var(--text);border-bottom-color:var(--accent);}
.panel{padding-top:22px;}

/* stat tiles */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px;}
.stat{background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--border);border-radius:14px;padding:16px 18px;}
.stat .l{font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--faint);}
.stat .v{font-family:"Space Grotesk",sans-serif;font-size:24px;font-weight:600;margin-top:5px;}

/* budget rows */
.budget{background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:14px 16px;margin-bottom:12px;}
.budget .top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.budget .n{font-family:"Space Grotesk",sans-serif;font-size:14.5px;}
.budget .amt{font-size:13px;color:var(--muted);}
.budget input{width:110px;}
.bmeter{height:8px;border-radius:999px;background:#0a0c18;border:1px solid var(--border);overflow:hidden;margin-top:12px;}
.bmeter > i{display:block;height:100%;background:linear-gradient(90deg,var(--green),var(--accent));}
.bmeter.warn > i{background:linear-gradient(90deg,var(--amber),var(--blood));}
.bmeter.none > i{background:var(--faint);}

@media(max-width:760px){ .stats{grid-template-columns:1fr 1fr;} }
@media(max-width:640px){ input.wide{min-width:0;width:100%;} }
