:root { --bg:#0b0e14; --card:#151a23; --fg:#e7edf3; --muted:#8b98a5; --ok:#3fb950; --accent:#7aa2ff; }
* { box-sizing: border-box; }
body { margin:0; font:16px/1.6 -apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; background:var(--bg); color:var(--fg); }
.wrap { max-width:820px; margin:0 auto; padding:0 1.5rem; }
header { border-bottom:1px solid #1e2530; padding:1rem 0; }
.nav { display:flex; align-items:center; gap:1.5rem; }
.brand { font-weight:700; font-size:1.15rem; letter-spacing:.2px; }
nav { margin-left:auto; display:flex; gap:1.25rem; }
nav a { color:var(--muted); text-decoration:none; font-size:.95rem; }
nav a:hover { color:var(--fg); }
main { padding:2rem 1.5rem 3rem; }
.hero h1 { font-size:1.9rem; margin:.5rem 0 .5rem; line-height:1.25; }
.tag { color:var(--muted); font-size:1.05rem; margin:0 0 1rem; }
h2 { font-size:1.2rem; margin:2rem 0 .6rem; }
.muted { color:var(--muted); font-size:.92rem; }
code { background:#1c2431; padding:.1rem .35rem; border-radius:4px; font-family:ui-monospace,Menlo,monospace; font-size:.9em; }
pre.code, pre.console { background:var(--card); border:1px solid #1e2530; border-radius:8px; padding:1rem; overflow-x:auto;
  font-family:ui-monospace,Menlo,monospace; font-size:.88rem; }
pre.console { color:var(--accent); }
.board { display:grid; gap:.5rem; margin:1rem 0; }
.svc { background:var(--card); border-radius:8px; padding:.75rem 1rem; display:flex; align-items:center; gap:.6rem; }
.svc em { margin-left:auto; color:var(--muted); font-style:normal; font-size:.9rem; }
.dot { width:.7rem; height:.7rem; border-radius:50%; background:var(--muted); }
.dot.ok { background:var(--ok); }
ul { padding-left:1.1rem; }
li { margin:.3rem 0; }
a { color:var(--accent); }
footer { color:var(--muted); border-top:1px solid #1e2530; padding:1.5rem 1.5rem; font-size:.85rem; }
