:root{--bg:#0b0e11;--panel:#12171d;--edge:#1f2833;--text:#c8d3de;--dim:#5c6b7a;
--green:#3ddc84;--red:#ff5252;--amber:#ffb300;--accent:#38bdf8;}
*{box-sizing:border-box;margin:0}
body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,sans-serif;
font-variant-numeric:tabular-nums;min-height:100vh}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1rem;
border-bottom:1px solid var(--edge);letter-spacing:.12em;font-size:.8rem}
.brand{color:var(--accent);font-weight:600}
.who{color:var(--dim);display:flex;gap:.7rem;align-items:center}
.inline{display:inline}
button.link{background:none;border:none;color:var(--dim);cursor:pointer;text-decoration:underline;font-size:.8rem}
main{padding:1rem;max-width:900px;margin:0 auto}
.grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.card{background:var(--panel);border:1px solid var(--edge);border-radius:10px;padding:1rem}
.card-head{display:flex;align-items:center;gap:.6rem}
.dot{width:.7rem;height:.7rem;border-radius:50%;flex:none}
.dot.running{background:var(--green);box-shadow:0 0 8px var(--green)}
.dot.stopped{background:var(--red)}
.dot.unknown{background:var(--amber)}
.gname{font-weight:600;letter-spacing:.05em}
.gstate{margin-left:auto;color:var(--dim);font-size:.75rem;text-transform:uppercase;letter-spacing:.1em}
.players{color:var(--dim);font-size:.82rem;min-height:1.2rem;margin:.6rem 0;word-break:break-word}
.controls{display:flex;gap:.5rem}
.act{flex:1;background:#0e1319;border:1px solid var(--edge);color:var(--text);
padding:.45rem 0;border-radius:6px;cursor:pointer;font-size:.8rem;letter-spacing:.06em}
.act:hover{border-color:var(--accent)}
.act.danger:hover{border-color:var(--red)}
.act:disabled{opacity:.4;cursor:wait}
.msg{font-size:.75rem;color:var(--amber);min-height:1rem;margin-top:.4rem}
.login-card{max-width:340px;margin:14vh auto;background:var(--panel);
border:1px solid var(--edge);border-radius:10px;padding:1.6rem}
.login-card h1{font-size:.95rem;letter-spacing:.2em;color:var(--accent);margin-bottom:1.1rem}
.login-card label{display:block;font-size:.75rem;color:var(--dim);margin-bottom:.9rem;
letter-spacing:.08em}
.login-card input{display:block;width:100%;margin-top:.3rem;background:#0e1319;
border:1px solid var(--edge);border-radius:6px;color:var(--text);padding:.55rem .6rem;font-size:1rem}
.login-card button[type=submit]{width:100%;background:var(--accent);border:none;color:#04222f;
font-weight:700;padding:.6rem;border-radius:6px;cursor:pointer;letter-spacing:.08em}
.error{background:#2a1215;border:1px solid var(--red);color:#ffb4b4;border-radius:6px;
padding:.5rem .7rem;font-size:.8rem;margin-bottom:.9rem}
.empty{color:var(--dim)}
/* v2 */
.brand a{color:var(--accent);text-decoration:none}
.nav{display:flex;gap:1rem}
.nav a{color:var(--dim);text-decoration:none;font-size:.78rem;letter-spacing:.1em}
.nav a:hover{color:var(--text)}
.card.wide{grid-column:1/-1;margin-bottom:1rem}
.card h2{font-size:.8rem;letter-spacing:.18em;color:var(--accent);margin-bottom:.7rem}
a.gname{color:var(--text);text-decoration:none}
a.gname:hover{color:var(--accent)}
.ok{background:#0f2a1a;border:1px solid var(--green);color:#a5e8c5;border-radius:6px;
padding:.5rem .7rem;font-size:.8rem;margin-bottom:.9rem}
.ok-inline{color:var(--green);font-size:.7rem;margin-left:.5rem}
.err-inline{color:var(--red);font-size:.7rem;margin-left:.5rem}
.dim-inline{color:var(--dim);font-size:.7rem;margin-left:.5rem}
.stack label{display:block;margin-bottom:.7rem;font-size:.78rem;color:var(--dim)}
.stack input,.stack select,.rowform input,.rowform select{background:#0e1319;
border:1px solid var(--edge);border-radius:6px;color:var(--text);padding:.4rem .5rem}
.rowform{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;margin-bottom:.6rem;font-size:.78rem}
.rowform label{color:var(--dim);display:flex;flex-direction:column;gap:.2rem}
.chk{flex-direction:row!important;align-items:center;gap:.3rem!important}
.act.mini{flex:none;padding:.25rem .6rem;font-size:.7rem}
.tabs{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.7rem}
.tab{background:#0e1319;border:1px solid var(--edge);color:var(--dim);padding:.35rem .7rem;
border-radius:6px;cursor:pointer;font-size:.75rem}
.tab:hover{color:var(--text);border-color:var(--accent)}
.settings{max-height:60vh;overflow:auto;margin-bottom:.6rem}
.srow{display:grid;grid-template-columns:220px 1fr;gap:.5rem;align-items:center;
padding:.25rem 0;border-bottom:1px solid #10151b;font-size:.8rem}
.skey{color:var(--dim)}
.shelp{grid-column:2;color:#43505d;font-size:.7rem}
.settings textarea{width:100%;background:#0e1319;border:1px solid var(--edge);
border-radius:6px;color:var(--text);font-family:ui-monospace,monospace;font-size:.75rem;padding:.5rem}
#diffbox pre{background:#0e1319;border:1px solid var(--edge);border-radius:6px;
padding:.6rem;font-size:.72rem;max-height:40vh;overflow:auto;white-space:pre-wrap;margin-bottom:.5rem}
.logbox{background:#0e1319;border:1px solid var(--edge);border-radius:6px;padding:.6rem;
font-size:.7rem;max-height:45vh;overflow:auto;white-space:pre-wrap}
.ptable td,.atable td,.atable th{padding:.25rem .6rem;font-size:.78rem;border-bottom:1px solid #10151b;text-align:left}
.atable th{color:var(--dim);font-weight:400;letter-spacing:.08em}
.secret{background:#0e1319;border:1px solid var(--edge);border-radius:6px;padding:.5rem;
font-size:.85rem;letter-spacing:.15em;margin:.4rem 0;word-break:break-all}
.secret.small{font-size:.68rem;letter-spacing:0}
.hidden{display:none}
#settings-actions{display:flex;gap:.8rem;align-items:center;margin:.4rem 0}