:root{
  --border:#d0d7de;
  --ok:#198754;
  --warn:#ffc107;
  --bad:#dc3545;
  --muted:#6c757d;
  --bg:#ffffff;
  --card:#fafbfc;
}

body{
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  margin:0;background:var(--bg);color:#111
}
.wrap{max-width:1100px;margin:20px auto;padding:0 12px}
h1{font-size:20px;margin:8px 0 16px}
.grid{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:980px){.grid{grid-template-columns:1fr 1fr}}

.card{background:var(--card);border:1px solid var(--border);border-radius:8px}
.card>.hd{padding:10px 12px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center}
.card>.bd{padding:12px}
.card-neutral{border-color:var(--border)}
.card-working{border-color:var(--warn)}
.card-success{border-color:var(--ok)}
.card-fail{border-color:var(--bad)}

.muted{color:var(--muted)}
.ok{color:var(--ok)}
.bad{color:var(--bad)}
.warn{color:var(--warn)}

.btn{display:inline-block;border:1px solid var(--border);background:#fff;border-radius:6px;padding:6px 10px;cursor:pointer}
.btn:disabled{opacity:.5;cursor:not-allowed}

.row{display:flex;gap:8px;flex-wrap:wrap}
.col{flex:1 1 220px}
label{display:block;font-size:12px;margin-bottom:4px}
input[type=text],select{width:100%;padding:6px 8px;border:1px solid var(--border);border-radius:6px;background:#fff}

.statusline{margin-top:6px;font-weight:600}
.statusline .status-text{font-weight:600}
.spinner-inline{width:16px;height:16px;border:2px solid #999;border-top-color:transparent;border-radius:50%;display:none;animation:spin .8s linear infinite;vertical-align:-3px;margin-left:6px}
@keyframes spin{to{transform:rotate(360deg)}}

.hide{display:none}

/* Live log / code blocks */
.log-card{max-height:240px;overflow:auto;background:#0f0f0f;color:#e9e9e9;border-radius:8px;border:1px solid #222;
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace}
.log-hd{padding:8px 10px;border-bottom:1px solid #222;display:flex;justify-content:space-between;align-items:center}
.log-bd{padding:8px 10px;font-size:12px;line-height:1.35;white-space:pre-wrap;word-break:break-word}
.log-az{color:#7CFC00}
.log-err{color:#ff8080}
.log-muted{color:#9aa0a6}

.log-wrap{position:sticky;bottom:0;z-index:5}

/* Card 2 (DNS in index.php) and generic “kv” code blocks */
.dns-lines{margin-top:10px}
.dns-lines .line{font-family:ui-monospace,monospace;font-size:12px;margin:3px 0}
.dns-lines .label{display:inline-block;width:54px;color:#555}
.dns-lines .val{white-space:pre-wrap}

pre.kv{background:#0f0f0f;color:#e9e9e9;padding:8px 10px;border-radius:8px;border:1px solid #222;
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace}