/* homelab coordinator — dark ops-console look, Mosaico green, NO blue. */
:root{
  --bg:#0e1512; --panel:#141d19; --panel2:#1b2621; --line:#26332c;
  --ink:#e8f0ea; --muted:#8ba394; --green:#99E447; --green-dim:#5f8a3a;
  --warn:#e4b74a;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font:16px/1.55 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}
.wrap{max-width:680px; margin:0 auto; padding:28px 20px 60px}
.top{display:flex; align-items:center; gap:10px; padding:6px 2px 22px}
.top .dot{width:10px; height:10px; border-radius:50%; background:var(--green);
  box-shadow:0 0 10px var(--green)}
.brand{font-weight:700; letter-spacing:.5px}
.card{background:var(--panel); border:1px solid var(--line); border-radius:14px;
  padding:26px 26px 30px}
.card.center{text-align:center}
h1{margin:.1em 0 .5em; font-size:1.7rem}
.lead{font-size:1.08rem; margin:.2em 0 1em}
.muted{color:var(--muted)}
.small{font-size:.88rem}
.note{background:var(--panel2); border:1px solid var(--line); border-left:3px solid var(--green);
  border-radius:10px; padding:14px 16px; margin:6px 0 22px}
.note em{color:var(--ink); font-style:normal; font-weight:600}

ol.steps{list-style:none; margin:0; padding:0; counter-reset:s}
ol.steps>li{border-top:1px solid var(--line); padding:20px 0}
ol.steps>li:first-child{border-top:none}
.step-h{display:flex; align-items:center; gap:10px; font-weight:700; font-size:1.12rem}
.num{display:inline-grid; place-items:center; width:26px; height:26px; border-radius:50%;
  background:var(--green); color:#0e1512; font-weight:800; font-size:.9rem}
.step-b{padding:8px 0 0 36px}
.step-b p{margin:.45em 0}
code{background:#0b120f; border:1px solid var(--line); border-radius:5px;
  padding:1px 6px; font-size:.9em; color:var(--green)}

.btn{display:inline-block; background:var(--green); color:#0e1512; font-weight:700;
  text-decoration:none; padding:11px 18px; border-radius:9px; margin:4px 0}
.btn:hover{filter:brightness(1.07)}
.btn.ghost{background:transparent; color:var(--muted); border:1px solid var(--line)}
.btn.ghost.ready{color:var(--green); border-color:var(--green-dim)}

.status{display:flex; align-items:center; gap:10px; margin:6px 0 12px;
  padding:10px 14px; border-radius:9px; background:var(--panel2); border:1px solid var(--line)}
.s-dot{width:11px; height:11px; border-radius:50%; background:var(--warn); flex:none}
.status.checking .s-dot{background:var(--warn); animation:pulse 1.3s infinite}
.status.ok .s-dot{background:var(--green); box-shadow:0 0 9px var(--green); animation:none}
.status.ok{border-color:var(--green-dim)}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}

.foot{margin-top:30px; text-align:center; color:var(--muted); font-size:.82rem}