:root { --bg:#0b0f19; --card:#121a2a; --txt:#e7eefc; --muted:#9fb0d0; --border:#22304d; }
*{ box-sizing:border-box; }
body{ margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; background:var(--bg); color:var(--txt); }
a{ color:#b8d1ff; text-decoration:none; }
.container{ max-width:1100px; margin:0 auto; padding:18px; }
.topbar{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:12px 16px; background:var(--card); border:1px solid var(--border); border-radius:14px; }
.card{ margin-top:14px; padding:14px 16px; background:var(--card); border:1px solid var(--border); border-radius:14px; }
.row{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
input, select{ background:#0e1524; border:1px solid var(--border); color:var(--txt); padding:10px 10px; border-radius:10px; }
button{ background:#1c2b49; border:1px solid var(--border); color:var(--txt); padding:10px 12px; border-radius:10px; cursor:pointer; }
button:hover{ filter:brightness(1.1); }
.small{ color:var(--muted); font-size: 13px; }
.badge{ padding:4px 8px; border-radius:999px; border:1px solid var(--border); font-size:12px; }
.badge.ok{ background:rgba(40,160,90,0.15); }
.badge.no{ background:rgba(200,80,80,0.15); }
hr{ border:none; border-top:1px solid var(--border); margin:12px 0; }
#liveBox{ max-height:520px; overflow:auto; display:flex; flex-direction:column; gap:6px; }
#lineHint{ margin-top:8px; }
.line{ font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 13px; padding:6px 8px; background:#0e1524; border:1px solid #1c2a46; border-radius:10px; }
.table{ width:100%; border-collapse:collapse; }
.table th, .table td{ border-bottom:1px solid var(--border); padding:8px 6px; text-align:left; vertical-align:top; }
.table th{ color:var(--muted); font-weight:600; }