/* หลังบ้าน vela — ธีมมืด อ่านง่ายบนจอโปรเจ็กเตอร์ · ไม่มี build step */
:root{--bg:#0b0f17;--panel:#121826;--line:#1f2937;--text:#e5e7eb;--muted:#94a3b8;--ok:#22c55e;--warn:#f59e0b;--bad:#ef4444;--acc:#38bdf8;--spk:#4C78A8;--wait:#E45756;--bot:#54A24B;--think:#6b7280}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.45 -apple-system,"Noto Sans Thai","Segoe UI",sans-serif}
header{display:flex;align-items:center;gap:18px;padding:12px 20px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--bg);z-index:5}
header h1{font-size:18px;margin:0;letter-spacing:.3px}header h1 span{color:var(--acc)}
nav{display:flex;gap:4px;flex-wrap:wrap}nav button{background:none;border:1px solid transparent;color:var(--muted);padding:7px 12px;border-radius:8px;cursor:pointer;font:inherit}
nav button.on{color:var(--text);border-color:var(--line);background:var(--panel)}
main{padding:18px 20px;max-width:1500px;margin:0 auto}section{display:none}section.on{display:block}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.tile{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.tile .k{color:var(--muted);font-size:13px}.tile .v{font-size:22px;font-weight:600;margin-top:4px}.tile .d{color:var(--muted);font-size:13px;margin-top:6px}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;background:var(--muted)}.dot.ok{background:var(--ok);box-shadow:0 0 10px var(--ok)}.dot.bad{background:var(--bad)}
h2{font-size:15px;color:var(--muted);font-weight:500;margin:22px 0 10px}
table{width:100%;border-collapse:collapse;font-size:14px}th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line)}th{color:var(--muted);font-weight:500}tr:hover td{background:#0f1521}
.btn{background:var(--acc);color:#04111a;border:0;padding:8px 14px;border-radius:8px;font:inherit;font-weight:600;cursor:pointer}.btn.ghost{background:transparent;color:var(--text);border:1px solid var(--line)}.btn.danger{background:var(--bad);color:#fff}
input,select{background:#0f1521;border:1px solid var(--line);color:var(--text);padding:8px 10px;border-radius:8px;font:inherit}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.big{font-size:40px;font-weight:700;line-height:1}.muted{color:var(--muted)}
#lanes{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px;overflow:auto;max-height:70vh}
.legend span{display:inline-block;margin-right:14px;font-size:13px;color:var(--muted)}.legend i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:6px;vertical-align:-1px}
iframe{width:100%;height:78vh;border:1px solid var(--line);border-radius:12px;background:#fff}
.call{display:flex;gap:12px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:8px}
.pulse{width:10px;height:10px;border-radius:50%;background:var(--ok);animation:p 1.2s infinite}@keyframes p{0%{box-shadow:0 0 0 0 rgba(34,197,94,.6)}100%{box-shadow:0 0 0 12px rgba(34,197,94,0)}}
pre{background:#0f1521;border:1px solid var(--line);border-radius:10px;padding:12px;overflow:auto;max-height:50vh;font-size:13px}
.login{max-width:360px;margin:18vh auto;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:26px}

button.mini{font-size:11px;padding:1px 6px;margin-left:4px}