:root{--bg:#0d0d0f;--card:#171719;--border:#333;--text:#eee;--muted:#aaa;--accent:#edff21;--bad:#8b1d1d;--ok:#145c2a;--warn:#8a4b00}
*{box-sizing:border-box} html,body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Arial,sans-serif;width:100%;overflow-x:hidden}
main{width:calc(100vw - 12px);max-width:none;margin:0 auto;padding:6px}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;border-bottom:1px solid var(--border);background:#111;position:sticky;top:0;z-index:10000}
.brand{font-weight:900;color:var(--accent)} .brand span{color:#888;font-size:12px}.toplinks a{color:var(--accent);text-decoration:none}
.nav{display:flex;gap:7px;flex-wrap:wrap;position:sticky;top:43px;z-index:9999;background:rgba(18,18,18,.97);border:1px solid var(--border);border-radius:14px;padding:8px;margin:6px 0 8px 0;backdrop-filter:blur(8px)}
.nav a{display:inline-flex;align-items:center;justify-content:center;padding:7px 12px;border-radius:999px;background:#242424;color:var(--accent);text-decoration:none;font-size:12px;font-weight:900;border:1px solid #3a3a3a;white-space:nowrap}
.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:12px;margin:8px 0;width:100%;max-width:none}.small-card h2,.card h1,.card h2{margin-top:0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}.tile{display:block;padding:14px;border:1px solid var(--border);border-radius:16px;background:#131313;color:var(--text);text-decoration:none}.tile strong{color:var(--accent);display:block;margin-bottom:5px}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;align-items:end}.form-grid label{display:block;color:var(--muted);font-size:12px;margin-bottom:4px}
input,select,textarea,button{width:100%;min-height:36px;border-radius:10px;border:1px solid #444;background:#101010;color:var(--text);padding:7px;font:inherit}button,.btn{background:var(--accent);color:#111;font-weight:900;cursor:pointer;text-align:center;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;border:0}.btn.secondary,button.secondary{background:#2b2b2b;color:#eee;border:1px solid #444}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}table{width:100%;border-collapse:separate;border-spacing:0;min-width:760px}th,td{border-bottom:1px solid #303030;padding:8px;text-align:left;vertical-align:top}th{color:var(--accent);font-size:12px;background:#101010;position:sticky;top:92px;z-index:50}
.muted{color:var(--muted)}.pill{display:inline-flex;border-radius:999px;padding:3px 8px;font-size:11px;font-weight:900}.pill.ok{background:var(--ok);color:#d8ffe3}.pill.bad{background:var(--bad);color:#ffe0e0}.pill.warn{background:var(--warn);color:#fff0dc}.pill.off{background:#2b2b2b;color:#ddd;border:1px solid #555}
.warning{border-color:var(--warn);background:rgba(138,75,0,.15)}.error{border-color:var(--bad);background:rgba(139,29,29,.18)}.success{border-color:var(--ok);background:rgba(20,92,42,.18)}
.inline{display:inline}.inline button,.inline .btn{width:auto;min-height:30px;padding:5px 9px}.actions{display:flex;gap:6px;flex-wrap:wrap}.login{max-width:460px;margin:8vh auto}
@media(max-width:800px){main{width:calc(100vw - 6px);padding:3px}.nav{flex-wrap:nowrap;overflow-x:auto;top:42px}.nav a{flex:0 0 auto}.card{padding:8px;border-radius:12px}.form-grid{grid-template-columns:1fr}input,select,textarea,button{font-size:16px}table{min-width:650px}th,td{font-size:12px;padding:6px}}