:root{
  --bg:#0d1117; --panel:#161b22; --panel2:#1c2430; --border:#272e3a;
  --fg:#e6edf3; --muted:#8b949e; --green:#22c55e; --amber:#f59e0b; --red:#ef4444;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg); color:var(--fg); min-height:100vh;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  font-size:15px; line-height:1.5;
}
.wrap{max-width:920px;margin:0 auto;padding:0 20px}
.topbar{border-bottom:1px solid var(--border);background:#0b0f14}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:58px}
.brand{display:flex;align-items:center;gap:10px;font-weight:600;letter-spacing:.2px}
.logo{width:22px;height:22px}
.nav a{color:var(--muted);text-decoration:none;margin-left:18px;font-size:14px}
.nav a:hover{color:var(--fg)}
.hero{padding:34px 0 18px}
.hero h1{margin:0;font-size:28px;font-weight:600}
.sub{margin:6px 0 0;color:var(--muted);font-size:14px}
.monitors{display:flex;flex-direction:column;gap:12px;margin:14px 0 8px}
.monitor{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:14px 16px}
.m-head{display:flex;align-items:center;gap:10px}
.dot{width:10px;height:10px;border-radius:50%;background:var(--muted);flex:0 0 auto}
.dot.up{background:var(--green);box-shadow:0 0 8px rgba(34,197,94,.6)}
.m-name{font-weight:600}
.m-badge{margin-left:auto;font-size:12px;padding:3px 9px;border-radius:20px;background:rgba(34,197,94,.14);color:var(--green);border:1px solid rgba(34,197,94,.35)}
.m-meta{display:flex;gap:16px;color:var(--muted);font-size:12px;margin:8px 0 10px}
.bar{
  position:relative;height:32px;border-radius:5px;background:#0b0f14;overflow:hidden;
  background-image:repeating-linear-gradient(90deg,var(--green) 0 4px,transparent 4px 6px);
  opacity:.92;
}
.tick{position:absolute;top:0;bottom:0;width:4px}
.tick.warn{background:var(--amber)}
.tick.down{background:var(--red);top:30%;bottom:30%}
.note{color:var(--muted);font-size:13px;margin:16px 0 40px}
.foot{border-top:1px solid var(--border);background:#0b0f14;margin-top:20px}
.foot .wrap{display:flex;justify-content:space-between;height:52px;align-items:center;color:var(--muted);font-size:12px}
.center{min-height:60vh;display:flex;align-items:center;justify-content:center;text-align:center}
.center h1{font-size:56px;margin:0;color:var(--green)}
.center p{color:var(--muted);margin:8px 0 0}
a{color:#58a6ff}